/*
 * Design d'origine du site (largeur fixe de 900 px), repris de style/style.css, style/news.css et style/bxslider.css.
 * Les dimensions viennent de l'ancien CSS, écrit en content-box, d'où le box-sizing ci-dessous.
 */

body {
    margin: 0;
    padding: 0;
    min-width: 900px;
    font-size: .8em;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    background-color: #000;
    color: #222;
}

#header, #header *,
#haut, #haut *,
#gauche, #gauche *,
#droite, #droite *,
#pied, #pied *,
.videotheque, .videotheque *,
.accueil, .accueil * {
    box-sizing: content-box;
}

#gauche ul, #droite ul, #menubarre, .raccourcis ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

/* ---------- Bannière ---------- */

#header {
    position: relative;
    width: 900px;
    height: 112px;
    margin: 0 auto;
    overflow: hidden;
}

.banniere-fonds {
    position: absolute;
    inset: 0;
    background: #fff;
}

.banniere-titres {
    position: absolute;
    top: 15px;
    left: 200px;
    width: 529px;
    height: 77px;
    z-index: 3;
}

/* ---------- Diaporamas ---------- */

[data-slider] {
    position: relative;
}

[data-slider] > .slide {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity .7s, visibility .7s;
}

[data-slider] > .slide.is-active {
    opacity: 1;
    visibility: visible;
}

[data-slider] > div.slide {
    width: 100%;
}

@media (prefers-reduced-motion: reduce) {
    [data-slider] > .slide { transition: none; }
}

.slider-pager {
    text-align: center;
    line-height: 16px;
}

.slider-pager button {
    padding: 0 5px;
    border: 0;
    background: transparent;
    color: #00007d;
    font: inherit;
    cursor: pointer;
}

.slider-pager button:hover,
.slider-pager button.selected {
    color: #000;
    background-color: #fee496;
}

/* ---------- Page ---------- */

#conteneur {
    width: 900px;
    margin: 0 auto;
    background-image: url('../media/images/fondbody2.jpg');
}

#conteneur::after {
    content: '';
    display: block;
    clear: both;
}

#haut {
    position: relative;
    height: 109px;
    background: transparent url('../media/images/newbarrecentre.jpg') no-repeat;
}

#barre_centrale {
    position: absolute;
    top: 0;
    left: 158px;
    height: 75px;
}

#menubarre li, #menubarre li a {
    height: 58px;
    background: url('../media/images/barremenu-regle_2.png') no-repeat left top;
}

#menubarre li { float: left; }

#menubarre li a {
    display: block;
    overflow: hidden;
    text-indent: -9999px;
    opacity: 0;
    transition: opacity .25s;
}

#menubarre li a:hover,
#menubarre li a:focus-visible { opacity: 1; }

#menubarre li.home { background-position: -1px -1px; width: 97px; }
#menubarre li.news { background-position: -99px -1px; width: 79px; }
#menubarre li.videos { background-position: -179px -1px; width: 87px; }
#menubarre li.cemois { background-position: -267px -1px; width: 107px; }
#menubarre li.livreor { background-position: -375px -1px; width: 118px; }
#menubarre li.liens { background-position: -494px -1px; width: 97px; }

#menubarre li.home a { background-position: -1px -60px; width: 97px; }
#menubarre li.news a { background-position: -99px -60px; width: 79px; }
#menubarre li.videos a { background-position: -179px -60px; width: 87px; }
#menubarre li.cemois a { background-position: -267px -60px; width: 107px; }
#menubarre li.livreor a { background-position: -375px -60px; width: 118px; }
#menubarre li.liens a { background-position: -494px -60px; width: 97px; }

#recherche {
    position: absolute;
    top: 58px;
    left: 365px;
    width: 200px;
    text-align: center;
}

#recherche input {
    border: 1px solid #757575;
    font: 10px "Trebuchet MS", Helvetica, sans-serif;
}

#centre {
    position: relative;
    z-index: 1;
    margin: -20px 157px 0 158px;
    padding: 0 10px 20px;
    background-image: url('../media/images/charte2-site-1.6_05.jpg');
    background-repeat: repeat-y;
    font-size: small;
    color: #222;
    text-align: justify;
}

#centre::after {
    content: '';
    display: block;
    clear: both;
}

#centre p {
    margin-top: 5px;
    line-height: 1.7em;
    vertical-align: top;
    text-align: justify;
}

#centre h1 {
    font: 20px Papyrus, "Trebuchet MS", sans-serif;
    line-height: 1.2;
}

#centre h2 {
    padding-left: 25px;
    border-bottom: 1px solid #a4221c;
    background: url('../media/images/h2.gif') no-repeat left bottom;
    color: #a4221c;
    font: bold 18px/20px Papyrus, "Trebuchet MS", sans-serif;
}

#centre h3 {
    margin: 0 0 5px 15px;
    padding-left: 5px;
    border-bottom: 1px solid #0c3d16;
    border-left: 3px solid #0c3d16;
    color: #0c3d16;
    font: bold 12px/18px Papyrus, "Trebuchet MS", sans-serif;
}

#centre h4 {
    margin-top: 2em;
    background: url('../media/images/bismillahnews.gif') no-repeat center;
    color: #fff;
    font: bold 12px/56px Papyrus, "Trebuchet MS", sans-serif;
    text-align: center;
}

#centre h5 {
    padding-left: 15px;
    border-left: 1px solid #0aa262;
    color: #0aa262;
    font: 14px/18px Papyrus, "Trebuchet MS", sans-serif;
}

#centre h6 {
    margin-bottom: 5px;
    padding: 5px 0 0 25px;
    border-bottom: 1px solid #a10d10;
    background: url('../media/images/h2.gif') no-repeat left bottom;
    color: #a10d10;
    font: 17px/17px Papyrus, "Trebuchet MS", sans-serif;
}

#centre a {
    color: #5c382a;
    text-decoration: none;
}

#centre a:hover { color: #0aa262; }

#centre .breadcrumb { margin: 10px 0 5px; font-size: 11px; }

/* ---------- Colonne gauche ---------- */

#gauche {
    float: left;
    width: 158px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

#menu { width: 158px; font-size: 11px; }

.menu-section { margin-bottom: 15px; text-align: center; }
.menu-section img { display: block; }

.menu-section summary {
    display: block;
    width: 158px;
    min-height: 35px;
    cursor: pointer;
    list-style: none;
}

.menu-section summary::-webkit-details-marker { display: none; }
details.menu-section[open] .menu-ferme,
details.menu-section:not([open]) .menu-ouvert { display: none; }

#menu li { width: 158px; line-height: 22px; }

#menu li a {
    display: block;
    height: 22px;
    overflow: hidden;
    background-image: url('../media/images/bouton-new-design-contenu.jpg');
    color: #000;
    font: 11px/22px Papyrus, "Trebuchet MS", sans-serif;
    text-decoration: none;
}

#menu li a:hover {
    color: #0a470f;
    font-weight: bold;
}

.don { margin-bottom: 15px; text-align: center; }

/* ---------- Colonne droite ---------- */

#droite {
    float: right;
    width: 157px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

.droite-bloc { margin-bottom: 15px; }
.droite-bloc img { display: block; }

#droite li { width: 157px; }

#droite .droite-bloc:first-child li a {
    display: block;
    background-image: url('../media/images/bouton-new-design-contenu-droite.jpg');
    color: #9e163c;
    font: 11px/22px Papyrus, "Trebuchet MS", sans-serif;
    text-align: center;
    text-decoration: none;
}

#droite .droite-bloc:first-child li a:hover { font-weight: bold; }

#onrecommande li a {
    display: block;
    width: 127px;
    padding-left: 30px;
    background-image: url('../media/images/contenuonrecommande.jpg');
    color: #5b331f;
    font: 11px/22px Papyrus, "Trebuchet MS", sans-serif;
    text-decoration: none;
}

#onrecommande li a:hover {
    color: #0aa262;
    text-decoration: underline;
}

#debatspresse li a {
    display: block;
    width: 137px;
    padding: 5px 10px;
    background-image: url('../media/images/contenudebatspresse.jpg');
    color: #000;
    font: 10px/12px Verdana, sans-serif;
    text-decoration: none;
}

#debatspresse li a:hover {
    color: #0aa262;
    text-decoration: underline;
}

/* ---------- Pied de page ---------- */

#pied {
    clear: both;
    height: 80px;
    background: url('../media/images/footer.jpg') no-repeat;
    text-align: center;
    font-size: 11px;
}

.pied-compteur {
    height: 14px;
    padding-top: 12px;
    color: #ac2c2e;
    font: bold 11px Arial, sans-serif;
}

.pied-liens a { color: #000; }
.pied-liens a:hover { color: #9e163c; text-decoration: underline; }

/* ---------- Accueil ---------- */

#salutation {
    width: 480px;
    height: 58px;
    margin: 0 auto;
    padding-top: 12px;
    background: url('../media/images/oumma.gif');
    color: #9e163c;
    font: 11px/56px Verdana, sans-serif;
    text-align: center;
}

.raccourcis {
    display: flex;
    width: 478px;
    height: 117px;
    margin: 10px auto 0;
    background: url('../media/html5/slider2/images/fond.jpg') repeat-x;
}

.raccourcis button {
    flex: none;
    height: 117px;
    padding: 0;
    border: 0;
    cursor: pointer;
}

.raccourcis-prec { width: 88px; background: url('../media/html5/slider2/images/gauche.jpg'); }
.raccourcis-suiv { width: 89px; background: url('../media/html5/slider2/images/droite.jpg'); }

.raccourcis ul {
    display: flex;
    flex: 1;
    overflow-x: auto;
    scrollbar-width: none;
}

.raccourcis ul::-webkit-scrollbar { display: none; }
.raccourcis li { flex: none; }

#centre a.raccourci {
    display: block;
    width: 117px;
    height: 77px;
    padding-top: 40px;
    color: #000;
    font: 10px/11px "Trebuchet MS", sans-serif;
    text-align: left;
    transition: opacity .4s;
}

#centre a.raccourci:hover { opacity: .5; }

.raccourci span { display: block; padding-left: 3px; }

.raccourci-titre {
    font-size: 12px;
    font-weight: bold;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.raccourci-article { background: url('../media/html5/slider2/images/cadre-bouton-titre-aleatoir.jpg') no-repeat; }
.raccourci-news { background: url('../media/html5/slider2/images/cadre-bouton-news.jpg') no-repeat; }
.raccourci-videos { background: url('../media/html5/slider2/images/cadre-bouton-video2.jpg') no-repeat; }
.raccourci-salat { background: url('../media/html5/slider2/images/cadre-bouton-horaires-prier.jpg') no-repeat; }
.raccourci-dossier { background: url('../media/html5/slider2/images/cadre-bouton-dossier.jpg') no-repeat; }
.raccourci-interieur { background: url('../media/html5/slider2/images/cadre-bouton-isinterieur.jpg') no-repeat; }

#news {
    position: relative;
    display: flow-root;
    width: 550px;
    min-height: 980px;
    margin: 20px auto 0;
    background-image: url('../media/images/cadrenews_fond.gif');
    text-align: justify;
}

#news p {
    margin: 0;
    line-height: 1.7em;
}

#news-newstyle {
    float: left;
    width: 280px;
    padding: 0 28px 20px 9px;
    font: 11px "Trebuchet MS", sans-serif;
}

.une { height: 140px; margin-bottom: 18px; }
.une-image { float: left; margin: .5em 1em 0 0; }

#centre .titrenews,
#centre .titrenews a { color: #0c4133; font: 16px/20px Verdana, sans-serif; }

#centre .titrenews2 { font: 18px/22px Verdana, sans-serif; }
#centre .titrenews2 a { color: #0c4133; }
#centre .titrenews3 { font: 18px/22px Arial, sans-serif; }
#centre .titrenews3 a { color: #1a5e32; }

#centre .titrenews a:hover,
#centre .titrenews2 a:hover,
#centre .titrenews3 a:hover,
#centre a.liennews2:hover {
    color: #a30f1d;
    text-decoration: underline;
}

#centre a.liennews2 { color: #0c4133; }

#centre .droitenews {
    text-align: right;
}

.separationnews {
    width: 280px;
    height: 1px;
    margin: 4px 0;
    background: url('../media/images/separation_news_2.gif') center;
}

.bx-questions {
    position: relative;
    width: 280px;
    height: 112px;
    background: url('../media/html5/slider4/cadre_questions.jpg') no-repeat;
}

.questions { width: 280px; height: 76px; }

.questions .slide {
    font: 15px/20px "Leckerli One", "Segoe Script", cursive;
    text-align: center;
}

#centre .questions a { color: #c50000; }
#centre .questions a:hover { color: #129af0; }

.bx-questions .slider-pager {
    position: absolute;
    left: 0;
    bottom: 3px;
    width: 180px;
}

.bx-questions .slider-pager button { color: #00337a; }

.questions-toutes {
    position: absolute;
    right: 0;
    bottom: 3px;
}

#centre .questions-toutes a { color: #00337a; font-weight: bold; }
#centre .questions-toutes a:hover { color: #129af0; }

#news_variable {
    position: relative;
    width: 280px;
    height: 161px;
    margin: 4px 0;
    background-image: url('../media/images/fond_articles_variables.jpg');
}

.variable {
    top: 5px;
    width: 280px;
    height: 115px;
    overflow: hidden;
}

.slider-nav {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 22px;
    display: flex;
    justify-content: space-between;
    padding: 0 10px;
    width: 260px;
}

.slider-nav button {
    width: 16px;
    height: 16px;
    padding: 0;
    border: 0;
    cursor: pointer;
}

.slider-prec { background: url('../media/images/fleche_gauche_vert.gif') no-repeat center; }
.slider-suiv { background: url('../media/images/fleche_droite_vert.gif') no-repeat center; }

.variable-tous {
    position: absolute;
    left: 0;
    bottom: 0;
}

#centre .alire-titre { margin-bottom: 8px; }

#centre .alireegalement {
    padding: 5px 0 3px;
    text-align: left;
}

#centre .alireegalement a {
    padding-left: 20px;
    background: url('../media/images/onrecommande.gif') no-repeat left bottom;
    color: #0c4133;
    font-weight: bold;
}

#centre .alireegalement a:hover {
    color: #a30f1d;
    text-decoration: underline;
}

#tribune {
    margin-top: 10px;
    text-align: center;
}

.defilant {
    width: 280px;
    overflow: hidden;
    white-space: nowrap;
    line-height: 33px;
}

.defilant-contenu {
    display: inline-block;
    padding-left: 100%;
    animation: defilement 40s linear infinite;
}

.defilant-contenu:hover,
.defilant-contenu:focus-within { animation-play-state: paused; }

.defilant-contenu b { margin-right: 40px; }

@keyframes defilement {
    to { transform: translateX(-100%); }
}

@media (prefers-reduced-motion: reduce) {
    .defilant { overflow-x: auto; }
    .defilant-contenu { padding-left: 0; animation: none; }
}

#versetsemaine {
    float: right;
    width: 205px;
    height: 180px;
    margin-right: 15px;
    overflow: hidden;
    background: url('../media/images/verset.png') no-repeat left top;
}

#versetsemaine .verset-texte {
    width: 195px;
    height: 126px;
    margin-top: 27px;
    padding: 0 5px;
    overflow-y: auto;
    scrollbar-width: thin;
    font: 10px/14px Arial, sans-serif;
    text-align: justify;
}

#centre #versetsemaine .verset-texte p { margin: 0; font: inherit; }

#versetsemaine p {
    padding: 2px 5px 0;
    font: 10px/1.3 Arial, sans-serif;
}

#hadithpriere {
    float: right;
    width: 230px;
    height: 110px;
    margin: 12px 0 0 2px;
    text-align: center;
}

#centre a.hadith-lien {
    display: block;
    font: 13px "Leckerli One", "Segoe Script", cursive;
}

#articleenrelation {
    float: right;
    width: 215px;
    height: 545px;
    margin: 10px 7px 0 0;
    background-image: url('../media/images/cadre-tribune.gif');
    text-align: center;
    font: 12px Papyrus, "Trebuchet MS", sans-serif;
}

#articleenrelation > b:first-child {
    display: block;
    padding-top: 10px;
}

.brown { color: #5b331f; }

.relation-liste {
    padding: 10px 0 0 16px;
    text-align: left;
}

#centre a.fleche-verte {
    display: block;
    padding-left: 10px;
    background: url('../media/images/fleche_vert.gif') no-repeat left center;
    color: #000;
    font: 10px/18px Verdana, sans-serif;
    text-align: left;
}

#centre a.fleche-verte:hover { color: #9e163c; font-weight: bold; }

#centre a.relation-tous {
    display: block;
    padding-left: 100px;
    color: #000;
    font: 10px/18px Verdana, sans-serif;
}

#separation, #separation2, .separation {
    width: 175px;
    height: 27px;
    margin: 0 auto;
    background: url('../media/images/separation.gif') center;
}

.chroniques {
    left: 6px;
    width: 204px;
    height: 136px;
    overflow: hidden;
}

.chronique {
    display: flow-root;
    margin-bottom: 4px;
    text-align: left;
}

.chronique img { float: left; margin: .5em 1em 0 0; }

#centre .titrechronique { text-align: left; line-height: 14px; }
#centre .titrechronique a { color: #3e3a96; font: 12px/14px Verdana, sans-serif; }
#centre .titrechronique a:hover { color: #a30f1d; text-decoration: underline; }

#centre .lienchronique a {
    padding-left: 10px;
    background: url('../media/images/puce_interieur.jpg') no-repeat left center;
    color: #000;
    font: 10px/18px Verdana, sans-serif;
}

#infos {
    float: right;
    width: 215px;
    margin: 10px 7px 0 0;
}

#centre #infos h2 {
    margin: 0 0 10px;
    padding-left: 10px;
    border: 0;
    background: url('../media/images/infos.gif') no-repeat left center;
    color: #fff;
    font: bold 12px/14px Arial, sans-serif;
}

#centre a.flecheinfos {
    display: block;
    padding: 0 0 4px 16px;
    background: url('../media/images/fleche_infos2.gif') no-repeat left center;
    color: #000;
    font: 9px/15px Verdana, sans-serif;
}

#centre a.flecheinfos:hover { color: #090; text-decoration: underline; }

#centre a.infos-tout {
    display: block;
    color: #00f;
    font: 9px/15px Verdana, sans-serif;
    text-align: right;
}

#centre a.infos-tout:hover { color: #ac2c2e; text-decoration: underline; }

/* ---------- Actualités ---------- */

.debats { background: url('../media/images/fond_archives.jpg') repeat-y; }

#centre .debats-mois {
    padding-left: 25px;
    border-bottom: 1px solid #a10d10;
    background: url('../media/images/archives.gif') no-repeat left bottom;
    color: #a10d10;
    font: bold 17px/20px Arial, sans-serif;
}

#centre .debats-ligne { margin: 10px; font: 11px/1.7em "Trebuchet MS", sans-serif; text-align: left; }

#centre a.fleche-verte-inline {
    padding-left: 10px;
    background: url('../media/images/fleche_vert.gif') no-repeat left center;
    color: #000;
    font-size: 12px;
}

#centre a.fleche-verte-inline:hover { color: #9e163c; text-decoration: underline; }

.debats-date { color: #00f; }

#centre .debat h1 {
    margin: 10px 0;
    padding-left: 25px;
    border-bottom: 1px solid #566912;
    background: url('../media/images/h2.gif') no-repeat left bottom;
    color: #566912;
    font: bold 17px/20px Arial, sans-serif;
}

#centre .debat-source { text-align: right; }
#centre .debat-source a { color: #9e163c; }

#centre .lienarchives { margin-top: 15px; }

#centre .lienarchives a {
    padding-left: 20px;
    background: url('../media/images/puce_archives.gif') no-repeat left bottom;
    color: #00f;
    font-weight: bold;
}

#centre .lienarchives a:hover { color: #ac2c2e; text-decoration: underline; }

/* Sommaire d'un article : une ligne centrée, titres séparés par des barres, comme sur l'ancien site. */
#centre .article-toc { margin-top: 5px; font-weight: bold; line-height: 1.7em; text-align: center; }
#centre .article-toc ul { margin: 0; padding: 0; list-style: none; }
#centre .article-toc li { display: inline; }
#centre .article-toc li + li::before { content: '\00a0\00a0|\00a0\00a0'; }
#centre .article-toc a { color: #174024; }
#centre .article-toc a:visited,
#centre .article-toc a:hover { color: #9e163c; text-decoration: underline; }

/* Contenu des articles importés : ni débordement sur les colonnes, ni « clear » qui se cale sous elles. */
#centre .article-content { display: flow-root; line-height: normal; }
#centre .article-content img,
#centre .article-content iframe { max-width: 100%; height: auto; }
#centre .article-content iframe { aspect-ratio: 16 / 9; }

/* Les textes s'appuyaient sur les marges par défaut du navigateur, que Bootstrap remet à zéro. */
#centre .article-content h1 { margin: .67em 0; }
#centre .article-content h2 { margin: .83em 0; }
#centre .article-content h3 { margin: 1em 0 5px 15px; }
#centre .article-content h4 { margin: 2em 0 1.33em; }
#centre .article-content h5 { margin: 1.67em 0; }
#centre .article-content h6 { margin: 2.33em 0 5px; }
#centre .article-content p { margin-bottom: 1em; }
#centre .article-content ul,
#centre .article-content ol { margin: 1em 0; padding-left: 40px; }
#centre .article-content blockquote { margin: 1em 40px; }
#centre .article-content address { font-style: italic; }
#centre .article-content img { vertical-align: baseline; }
#centre .article-content table { border-collapse: separate; border-spacing: 2px; }
#centre .article-content th { text-align: center; }
#centre .article-content li {
    text-indent: 4em;
    line-height: 1.7em;
    text-align: justify;
    vertical-align: top;
}

/* Styles d'origine des contenus : les anciens identifiants arrivent ici en classes (ArticleRenderer::STYLE_IDS). */
#centre .quote {
    padding: 5px;
    border: 1px solid #000;
    background-color: #d6a553;
    color: #45310f;
    font: 12px Papyrus, "Trebuchet MS", sans-serif;
    text-align: justify;
}

#centre .quotebible {
    padding: 5px;
    border: 1px solid #000;
    background-color: #fff;
    color: #45310f;
    font: 11px "Trebuchet MS", sans-serif;
    text-align: justify;
}

#centre .tableau table { padding: 5px; border-collapse: collapse; background: transparent; }
#centre .tableau th,
#centre .tableau td { padding: 5px; border: thin solid #28801a; text-align: center; }
#centre .tableau th { background-color: #83b17c; font-weight: bold; }

.droite {
    display: block;
    padding-bottom: 15px;
    line-height: 1.7em;
    text-align: right;
    vertical-align: top;
}

#centre .mainretour { float: right; vertical-align: top; }
#centre img.centered { display: block; margin-right: auto; margin-left: auto; }
#centre .bordure-image { border: 1px solid #000; }
#centre .fleche { padding-left: 10px; background: url('../media/images/fleche_vert.gif') no-repeat left center; }
#centre .fleche2 { padding-left: 10px; background: url('../media/images/fleche_bleu.gif') no-repeat left center; }
#centre .debatpresse a { color: #000; font: 12px "Trebuchet MS", sans-serif; }
#centre .debatpresse a:hover { color: #9e163c; text-decoration: underline; }
#centre .lienbleu a { color: #00f; font-weight: bold; }
#centre .lienbleu a:hover { color: #ac2c2e; text-decoration: underline; }
#centre .chroniquedetailsuivante a { padding-right: 10px; padding-left: 10px; color: #276117; font-weight: bold; }
#centre .chroniquedetailsuivante a:hover { color: #a30f1d; text-decoration: underline; }

/* Texte des actualités et infos (#debatpresse2), des chroniques (#chroniquedetail) et de l'agenda (#debatpresse). */
#centre .texte-presse h3 {
    padding-left: 25px;
    border-bottom: 1px solid #566912;
    border-left: 0;
    background: url('../media/images/h2.gif') no-repeat left bottom;
    color: #566912;
    font: bold 17px/20px Arial, sans-serif;
}
#centre .texte-presse .article-content p { margin: 10px; font: 12px/1.7em Verdana, sans-serif; }
#centre .texte-presse .article-content a { color: #000; font: 12px Verdana, sans-serif; }
#centre .texte-presse .article-content a:hover { color: #9e163c; text-decoration: underline; }
#centre .texte-chronique .article-content p { margin: 10px; font: 12px/1.7em Arial, sans-serif; }
#centre .texte-chronique .article-content a { color: #9e163c; font: 12px Arial, sans-serif; }
#centre .texte-chronique .article-content a:hover { color: #1f7b62; }
#centre .texte-agenda .article-content p { margin: 10px; font: 11px/1.7em "Trebuchet MS", sans-serif; }
#centre .texte-agenda .article-content a { color: #000; font: 12px "Trebuchet MS", sans-serif; }
#centre .texte-agenda .article-content a:hover { color: #9e163c; text-decoration: underline; }

/* Couleurs de l'ancien site : numéro en cours en noir et gras, autres numéros en vert, survol en rouge. */
#centre .pagination {
    --bs-pagination-focus-color: #9e163c;
    --bs-pagination-focus-box-shadow: 0 0 0 2px rgba(43, 94, 70, .35);
    justify-content: center;
    margin-top: 15px;
}
#centre .pagination .page-link { color: #2b5e46; font-weight: bold; }
#centre .pagination .page-link:hover { color: #9e163c; }
#centre .pagination .active .page-link { border-color: #2b5e46; background-color: #e6eee9; color: #000; }
#centre .pagination .disabled .page-link { color: #999; }

/* ---------- Ce mois, liens, qui sommes-nous ---------- */

#centre .recap-lien { margin: 10px 0; text-align: right; }
#centre .recap-lien a { color: #00f; font-weight: bold; }
#centre .recap-lien a:hover { color: #ac2c2e; text-decoration: underline; }

.lien-site { margin: 15px 10px; }

#centre a.lien-site-url { color: #00f; font-weight: bold; }
#centre a.lien-site-url:hover { color: #ac2c2e; text-decoration: underline; }

.lien-site-description { margin-left: 15px; }
#centre .lien-site-description p { margin: 0; }

#titrequisommesnous {
    margin-top: 2em;
    background: url('../media/images/bismillahnews2.gif') no-repeat center;
    color: #fff;
    font: bold 12px/56px Papyrus, "Trebuchet MS", sans-serif;
    text-align: center;
}

#quisommesnous {
    padding: 5px;
    border: 1px solid #155217;
    background-color: #aff5b1;
    /* Bloc isolé : ses « clear » ne doivent pas se caler sous les colonnes latérales, qui flottent. */
    display: flow-root;
    font: 11px/20px "Trebuchet MS", sans-serif;
    text-align: justify;
}

#centre #quisommesnous a { color: #00f; }
#centre #quisommesnous a:hover { color: #ac2c2e; text-decoration: underline; }

.qsn-titre { clear: both; }
.qsn-droite { float: right; margin: 1em 0 0 1em; }
.qsn-gauche { float: left; margin: 1em 1em 0 0; }

/* ---------- Chroniques ---------- */

.cadreauteur {
    display: flow-root;
    min-height: 80px;
    margin: 20px 0 10px;
    background: url('../media/images/fond_chronique.gif') top left no-repeat;
}

.cadreauteur .photo { float: left; padding: 1px 0 0 25px; box-sizing: content-box; }

#centre .cadreauteur .rubrique {
    margin: 22px 0 0 10px;
    padding-left: 10px;
    overflow: hidden;
    color: #d10000;
    font: bold 19px Arial, Helvetica, sans-serif;
    text-align: left;
}

.cadreauteur .sousrubrique { color: #000; font: bold 17px Arial, Helvetica, sans-serif; }
.cadreauteur .auteur { color: #000; font: bold 13px Arial, Helvetica, sans-serif; }

#centre .chronique-outils { text-align: right; }

#centre .chronique-lectures {
    margin-top: 10px;
    padding: 2px 5px;
    background-color: #ddeed9;
    text-align: right;
}

#centre .commentaire-infos { margin-bottom: 0; color: #9e163c; font-weight: bold; font-size: 11px; }
.article-comment { margin-bottom: 12px; }

/* ---------- Sermons ---------- */

#vendredi {
    width: 533px;
    margin: 15px auto 0;
    background: #d7ecd1 url('../media/images/bord_gauche_vendredi.jpg') repeat-y left;
    font: 11px Arial, sans-serif;
}

#vendredi2 { background: url('../media/images/bord_droit_vendredi.jpg') repeat-y right; }

#hautvendredi {
    height: 18px;
    background-image: url('../media/images/bord_haut_vendredi.jpg');
}

#coinghvendredi { float: left; width: 15px; height: 18px; background-image: url('../media/images/bord_haut_gauche_vendredi.jpg'); }
#coindhvendredi { float: right; width: 15px; height: 18px; background-image: url('../media/images/bord_haut_droit_vendredi.jpg'); }

#contenuvendredi { padding: 15px; }

#basvendredi {
    height: 18px;
    background-image: url('../media/images/bord_bas_vendredi.jpg');
}

#coingbvendredi { float: left; width: 15px; height: 18px; background-image: url('../media/images/bord_bas_gauche_vendredi.jpg'); }
#coindbvendredi { float: right; width: 15px; height: 18px; background-image: url('../media/images/bord_bas_droit_vendredi.jpg'); }

/* ---------- Livre d'or ---------- */

/* Rubriques et croissants */
.rubrique-article { display: flow-root; margin: 15px 0; text-align: left; }
.rubrique-vignette { float: left; max-width: 120px; height: auto; margin: 0 1em 0 0; }
.croissant { position: relative; max-width: 100%; margin: 10px auto; }
.croissant img { display: block; }
.croissant a { position: absolute; display: block; background-repeat: no-repeat; }
.croissant a:hover,
.croissant a:focus-visible { background-image: var(--croissant-survol); }

/* Coran */
.coran-choix { margin: 12px 0 15px; text-align: center; }
.coran-choix select { max-width: 100%; }
.coran-cadre {
    max-width: 533px;
    margin: 0 auto;
    background: #fefab1 url('../media/images/bord_gauche_coran.jpg') repeat-y left;
    font: 12px/1.6 Arial, Helvetica, sans-serif;
}
.coran-cadre-droit { background: url('../media/images/bord_droit_coran.jpg') repeat-y right; }
.coran-haut,
.coran-bas { display: flow-root; height: 18px; }
.coran-haut { background: url('../media/images/bord_haut_coran.jpg'); }
.coran-bas { background: url('../media/images/bord_bas_coran.jpg'); }
.coran-coin-gauche,
.coran-coin-droit { display: block; width: 15px; height: 18px; }
.coran-coin-gauche { float: left; }
.coran-coin-droit { float: right; }
.coran-haut .coran-coin-gauche { background: url('../media/images/bord_haut_gauche_coran.jpg'); }
.coran-haut .coran-coin-droit { background: url('../media/images/bord_haut_droit_coran.jpg'); }
.coran-bas .coran-coin-gauche { background: url('../media/images/bord_bas_gauche_coran.jpg'); }
.coran-bas .coran-coin-droit { background: url('../media/images/bord_bas_droit_coran.jpg'); }
.coran-contenu { padding: 15px; }
#centre .coran-titre { font: 18px Papyrus, "Trebuchet MS", sans-serif; text-align: center; }
#centre .coran-sous-titre { font-size: 11px; text-align: center; }
#centre .coran-voisines { display: flex; justify-content: space-between; margin: 15px 0; font-weight: bold; }

/* Articles de presse */
.presse-article { margin: 15px 0; padding: 8px 10px; border: 1px solid #b4b4b4; background-color: #f3f3f3; }
#centre .presse-titre { color: #a10d10; font: italic bold 18px/22px Papyrus, "Trebuchet MS", sans-serif; text-align: center; }
#centre .presse-journal { font: bold 13px/20px Verdana, sans-serif; text-align: center; }
#centre .presse-suite { font-weight: bold; text-align: right; }

/* Photos */
.photos-grille { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 15px 0; }
.photos-grille img { display: block; max-width: 130px; height: auto; border: 1px solid #757575; }
.photos-grille a:hover img,
.photos-grille a:focus-visible img { border-color: #a30f1d; }
.photo-grande { display: block; max-width: 100%; height: auto; margin: 10px auto; }
#centre .photo-description { margin-top: 10px; }

/* Ressources, agenda, livres, audio du Coran */
.ressources-liste { margin: 8px 10px 15px; padding-left: 20px; font-size: 12px; text-align: left; }
.agenda-evenement { margin-bottom: 15px; }
#centre .agenda-evenement .debats-mois { text-align: left; }
.livre-couverture { float: left; max-width: 160px; height: auto; margin: 0 1em 1em 0; }
#centre .coran-audio { display: flex; align-items: center; justify-content: center; gap: 12px; margin: 10px 0; }
.coran-audio audio { max-width: 100%; }
.coran-sommaire { columns: 2; margin: 15px 0; padding-left: 35px; font-size: 12px; text-align: left; }

/* Plan du site */
.plan-liste { margin: 8px 10px 15px; padding: 0; list-style: none; font-size: 12px; text-align: left; }
.plan-liste ul { margin: 2px 0 6px 15px; padding: 0; list-style: none; }

/* Recherche */
#centre .recherche-total { font-weight: bold; }
#centre .recherche-resultat { margin: 10px 0; text-align: left; overflow-wrap: anywhere; }
#centre .recherche-resultat a { color: #0c4133; font-weight: bold; }
#centre .recherche-resultat a:hover { color: #a30f1d; text-decoration: underline; }

/* Questions / Réponses */
#centre .question-texte { margin-bottom: 12px; color: #00f; font-weight: bold; }

/* Infos */
#centre .infos-categories { margin: 10px; font-size: 12px; text-align: center; }

/* Tribune libre */
#centre .tribune-contribuer { margin: 10px 0; font-weight: bold; text-align: center; }
.tribune-resume { padding: 8px 0; border-bottom: 1px solid #b4b4b4; }
#centre .tribune-titre { font-weight: bold; text-align: center; }
#centre .tribune-auteur { font-size: 11px; font-weight: bold; text-align: right; }

/* Glossaire */
#centre .glossaire-lettres { margin: 10px 0; text-align: center; word-spacing: 3px; }
.glossaire-recherche { margin-bottom: 15px; text-align: center; }
.glossaire-entree { margin-bottom: 15px; }

/* Dossiers */
.dossier { display: flow-root; margin: 10px; }
.dossier-image { float: right; max-width: 160px; height: auto; margin-left: 10px; }
#centre .dossier-titre { font-weight: bold; text-align: left; }
.dossier-sommaire { margin: 0; padding-left: 20px; font-size: 12px; text-align: left; }

#centre .livre-or-moyenne { text-align: center; font-size: 13px; }

.form-repliable {
    margin: 10px 0 15px;
    padding: 8px 10px;
    border: 1px solid #388d3e;
    background-color: #f3f3f3;
}

.form-repliable summary {
    color: #388d3e;
    font-weight: bold;
    cursor: pointer;
}

.form-repliable form { margin-top: 10px; text-align: left; }
.form-repliable label { font-weight: bold; }

#centre .form-info { font-size: 11px; line-height: 1.4em; text-align: left; }

/* Hors écran plutôt que display:none, que certains robots repèrent. */
.form-piege {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.livre-or-message {
    display: flow-root;
    margin-bottom: 12px;
    padding: 6px;
    border: 1px solid #757575;
    background-color: #f3f3f3;
    font: 12px/1.5 Verdana, Helvetica, sans-serif;
    text-align: left;
}

.livre-or-date { float: right; color: #c30; }
.livre-or-auteur { color: #c30; font-weight: bold; }
.livre-or-lieu { font-weight: normal; }
.livre-or-note { color: #878787; font-weight: bold; }
.livre-or-texte { margin-top: 8px; overflow-wrap: anywhere; }

.livre-or-reponse {
    margin-top: 8px;
    padding: 5px;
    border: 1px solid #b4b4b4;
    background-color: #fff;
}

/* ---------- Horaires de prière ---------- */

.salat-choix { display: flex; flex-direction: column; gap: 6px; margin: 15px 10px; }
.salat-choix label { font-weight: bold; }
.salat-choix select { font-weight: normal; }

.salat-mois {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin: 10px 0;
    font-size: 16px;
    font-weight: bold;
}

.salat-mois button,
.salat-format {
    padding: 0 4px;
    border: 0;
    background: transparent;
    color: #5c382a;
    font: inherit;
    cursor: pointer;
}

.salat-mois button:hover,
.salat-format:hover { color: #0aa262; }

.salat-format { text-decoration: underline; }

.timetable {
    margin: 0 auto;
    border: 1px outset gray;
    border-collapse: collapse;
}

.timetable th,
.timetable td {
    width: 3.7em;
    padding: 1px;
    border: 1px inset #ccc;
    text-align: center;
}

.head-row { background-color: #80a972; color: #000; }
.today-row { background-color: #bbebbf; color: #000; font-weight: bold; }

#centre .salat-source { margin-top: 7px; text-align: center; }

/* ---------- Vidéothèque ---------- */

.videos-conteneur {
    display: flex;
    justify-content: space-between;
    width: 510px;
    margin: 10px auto 0;
    padding: 10px 20px;
    background-image: url('../media/images/cadrevideos_fond.gif');
    text-align: left;
}

.videos-colonne { width: 245px; }

.videos-liste {
    padding: 10px;
    text-align: left;
}

#centre .videotheque h1 {
    margin: 12px 0 6px;
    padding-left: 20px;
    border-bottom: 1px solid #0a246a;
    background: url('../media/images/etoile_video_titre.gif') no-repeat left bottom;
    color: #0a246a;
    font: bold 16px/20px Papyrus, "Trebuchet MS", sans-serif;
}

.lien-video { line-height: 1.4; margin-bottom: 3px; }

#centre .lien-video a {
    padding-left: 20px;
    background: url('../media/images/fleche_video.gif') no-repeat left center;
    color: #000;
}

#centre .lien-video a:hover { color: #a30f1d; text-decoration: underline; }

.video-nouveau { color: #00f; }

#centre .videos-toutes { margin: 0; text-align: right; }
#centre .videos-toutes a { color: #a30f1d; }
#centre .videos-toutes a:hover { color: #0a246a; text-decoration: underline; }

.contenuvideo.video-grande { width: 480px; margin: 10px auto; }

#centre .video-grande a.video-lecteur {
    width: 460px;
    height: 340px;
}

#centre .video-externe { text-align: center; }
.video-indisponible { color: #a10d10; font-weight: bold; }

/* ---------- Cadres vidéo ---------- */

.cadre-video {
    width: 550px;
    margin: 15px auto 0;
}

.bandevideo {
    width: 550px;
    height: 30px;
    border: 1px solid #000;
    background: #007e58;
    font-weight: bold;
}

#centre .bandevideo-titre {
    margin: 0;
    padding: 5px 5px 10px 40px;
    border: 0;
    background: url('../media/images/etoile_islam.png') no-repeat left center;
    color: #fff;
    font: bold 13px/15px "Trebuchet MS", sans-serif;
}

.bandevideo-bas { text-align: right; line-height: 30px; }

#centre .bandevideo-bas a { padding-right: 5px; color: #ffe170; }
#centre .bandevideo-bas a:hover { color: #000; text-decoration: underline; }

.cadrevideo {
    display: flex;
    justify-content: space-between;
    width: 550px;
    height: 215px;
    border-left: 1px solid #000;
    border-right: 1px solid #000;
}

.contenuvideo { width: 280px; margin-top: 5px; }
.contenuvideo iframe { display: block; border: 0; }

#centre a.video-lecteur {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 260px;
    height: 185px;
    padding: 10px;
    background: #111;
    color: #fff;
    font: bold 12px/16px Verdana, sans-serif;
    text-align: center;
}

#centre a.video-lecteur:hover { background: #007e58; color: #fff; }

.contenuliensvideos {
    width: 255px;
    height: 210px;
    margin-top: 5px;
    overflow-y: auto;
    text-align: left;
}

#centre .contenuliensvideos a.fleche-verte { font: 10px/16px Verdana, sans-serif; }