html { background-color: black; }
@media all and (max-width: 767px) { html { width: 1288px; margin: 0 auto 0 auto; } } /* <-- cadre pour smartphones */

/*a:link { font-family: "Arial Narrow"; font-size: 14px; color: #9a7070; }
a:hover { font-family: "Arial Narrow"; font-size: 14px; color: #b19281; }
a:visited  { color: #9a7070; }
a:visited:hover  { color: #b19281; }*/

@font-face {
	font-family: "Arial";
	src: url('datas/ARIAL.TTF');
}
@font-face {
	font-family: "Tahoma";
	src: url('datas/TAHOMA_0.TTF');
}
@font-face {
	font-family: "Old English Text MT";
	src: url('datas/OLDENGL.TTF');
}
@font-face {
	font-family: "Gabriola";
	src: url('datas/Gabriola.ttf');
}
@font-face {
	font-family: "Arial Narrow";
	src: url('datas/ArialNarrow.ttf');
}



/* ======================================================================== HEADER ======================================================================== */

.global { width: 1280px; height: 256px; margin-left: auto; margin-right: auto; }
.global2 { width: 1280px; height: 768px; margin-left: auto; margin-right: auto; margin-top: 128px; }
.espacement { height: 18px; }
.espacement2 { height: 64px; }
     .pubgoogle { height: 124px; margin-left: 278px; margin-top: 9px; }
.espacement3 { height: 58px; }
.espacement3b { height: 24px; }
#entete { width: 1280px; height: 256px; background-image:url(datas/FOND_HEADER.gif); margin-left: auto; margin-right: auto; }
#titre { height: 64px; margin-left: 75px; }
#menu { width: 1280px; text-align: center; margin-left: 75px }
    .menu-tabA { display: inline-block; width: 200px; height: 75px; margin-left: auto; margin-right: auto; }  /* inline-block */
    .menu-tabB { display: inline-block; width: 280px; height: 75px; margin-left: auto; margin-right: auto; }  /* inline-block */
    .menu-tabC { display: inline-block; width: 296px; height: 75px; margin-left: auto; margin-right: auto; }  /* inline-block */
    #lienACC:link { width: 77px; height: 33px; display : block; background-image:url(datas/BOUTON_Accueil_NOR.png); text-decoration: none; }
    #lienACC:hover { width: 77px; height: 33px; display : block; background-image:url(datas/BOUTON_Accueil_ON.png); text-decoration: none; }
    #lienACC-OFF { width: 77px; height: 33px; display : block; background-image:url(datas/BOUTON_Accueil_OFF.png); text-decoration: none; }
    #lienTEL:link { width: 175px; height: 33px; display : block; background-image:url(datas/BOUTON_Telechargement_NOR.png); text-decoration: none; }
    #lienTEL:hover { width: 175px; height: 33px; display : block; background-image:url(datas/BOUTON_Telechargement_ON.png); text-decoration: none; }
    #lienTEL-OFF { width: 175px; height: 33px; display : block; background-image:url(datas/BOUTON_Telechargement_OFF.png); text-decoration: none; }
    #lienAUT:link { width: 85px; height: 33px; display : block; background-image:url(datas/BOUTON_Auteur_NOR.png); text-decoration: none; }
    #lienAUT:hover { width: 85px; height: 33px; display : block; background-image:url(datas/BOUTON_Auteur_ON.png); text-decoration: none; }
    #lienLIE:link { width: 137px; height: 33px; display : block; background-image:url(datas/BOUTON_Liens-Contact_NOR.png); text-decoration: none; }
    #lienLIE:hover { width: 137px; height: 33px; display : block; background-image:url(datas/BOUTON_Liens-Contact_ON.png); text-decoration: none; }
    #lienLIE-OFF { width: 137px; height: 33px; display : block; background-image:url(datas/BOUTON_Liens-Contact_OFF.png); text-decoration: none; }
    #lienCOM:link { width: 141px; height: 33px; display : block; background-image:url(datas/BOUTON_Commentaires_NOR.png); text-decoration: none; }
    #lienCOM:hover { width: 141px; height: 33px; display : block; background-image:url(datas/BOUTON_Commentaires_ON.png); text-decoration: none; }
    #lienCOM-OFF { width: 141px; height: 33px; display : block; background-image:url(datas/BOUTON_Commentaires_OFF.png); text-decoration: none; }


/* ======================================================================== BODY ======================================================================== */

#corps { width: 1280px; height: 768px; background-image:url(datas/FOND_BUREAU.gif); }
#feuille { width: 488px; height: 708px; background-image:url(datas/texture-feuille.gif); margin: 0 auto 0 auto;
           padding: 8px 8px 8px 16px; overflow: auto; overflow-x: hidden; scrollbar-width: thin; font-family: "Arial"; font-style: light; font-size:13.5px; }
#feuille2 { display: block; width: 488px; height: 604px; background-image:url(datas/texture-feuille.gif); margin: 0 auto 0 auto;
           padding: 0 8px 8px 16px; overflow: auto; scrollbar-width: thin; font-family: "Arial"; font-style: light; font-size:13.5px; }


/* << ACCUEIL >> */
#avatar { float: right;  width: 75px; height: 75px; background-image:url(datas/avatarEG.jpg); margin-top: 8px; margin-left: 6px; border: 1px solid #988b8b; }
.sous-titre { width: 481px; height: 28px; font-family: "Tahoma", "Arial"; font-style: bold; font-size: 18px; color: #900808; border-bottom: 1px solid #988b8b; }
    #news { font-family: "Arial"; font-style: light; font-size:13px; text-align: justify; margin-right: 6px; }
        .newsul, .newsul li { font-family: "Arial"; font-style: light; font-size:13px; text-align: justify; margin-right: 0.35em; padding-left: 1em; }
    #fin-news { width: 456px; height: 48px; text-align: center; line-height: 48px; border-top: 1px solid #988b8b; }
    #exnews { font-family: "Tahoma", "Arial"; font-style: bold; font-size: 13.6px; text-decoration: none; color: #8d5e5e; }
    #exnews:hover { font-family: "Tahoma", "Arial"; font-style: bold; font-size: 13.6px; text-decoration: none; color: #9d7f6d; }
#index { width: 448px; padding: 6px 12px 6px 12px; background-image:url(datas/texture-feuille-DK.gif); text-align: justify; line-height: 1.18em /* line-height */; padding: 9px 12px 9px 12px; margin: 6px 0 15px 0; box-shadow: 2px 2px 2px 2px #5f5136; }
#indexpolice { font-family: "Gabriola"; font-size: 18.3px; color: #530900; }
#firstletter { font-family:"Old English Text MT"; font-weight: bold; font-size:36px; color: #530900; }

/* Images pour les News */
#IMG_NEWS  { width: 306px; height: 450px; margin-left: auto; margin-right: auto; background-image:url(datas/5ans.jpg); }  
#IMG_NEWS2 { width:  80px; height: 160px; float: left; margin-right: 16px; margin-top: 12px; background-image:url(datas/10ans.png); }  
#IMG_NEWS3 { width: 472px; height: 136px; margin-right: 16px; margin-top: 12px; background-image:url(datas/13ansHSD.png); background-size: cover; }  


/* << TELECHARGEMENT >> */
#menu_telech { display: block; width: 488px; height: 99px; background-image:url(datas/texture-feuille.gif); padding: 8px 8px 8px 16px; margin: 0 auto 0 auto; border-bottom: double 1px rgba(0, 0, 0, 0.25); }
            #gravure01 { float: right;  width: 200px; height: 128px; background-image:url(datas/gravure01.png); margin-top: 24px; }
            #gravure02 { float: right;  width: 200px; height: 200px; background-image:url(datas/gravure02.png); margin-top: 24px; }
            #gravure03 { float: right;  width: 128px; height: 128px; background-image:url(datas/gravure03.png); margin-top: 24px; }
            #gravure04 { float: right;  width: 200px; height: 128px; background-image:url(datas/gravure04.png); margin-top: 24px; }
            #gravure05 { float: right;  width: 200px; height: 128px; background-image:url(datas/gravure05.png); margin-top: 24px; }
            #gravure06 { float: right;  width: 128px; height: 200px; background-image:url(datas/gravure06.png); margin-top: 24px; }
            #gravure07 { float: right;  width: 200px; height: 124px; background-image:url(datas/gravure07.png); margin-top: 24px; }
            #gravure08 { float: right;  width: 128px; height: 200px; background-image:url(datas/gravure08.png); margin-top: 24px; }
            #gravure09 { float: right;  width: 128px; height: 200px; background-image:url(datas/gravure09.png); margin-top: 24px; }
            #gravure10 { float: right;  width: 128px; height: 200px; background-image:url(datas/gravure10.png); margin-top: 24px; }
            #gravureSP { float: right;  width: 139px; height: 160px; background-image:url(datas/gravureSUPPL.png); margin-top: 24px; }
            #gravureLIEN { float: right;  width: 432px; height: 160px; background-image:url(datas/gravureLIEN.png); }
    #sommet 
    { 
        width: 478px; height: 40px; text-align: center; line-height: 40px; 
        font-family: "Tahoma"; font-size: 13px; font-weight: bold; color: black; 
        border: 2px solid black; background-image:url(datas/texture-feuille-LG.gif); vertical-align: middle; 
    }
    #menu-saisons { width: 469px; height: auto; padding: 6px; background-image:url(datas/texture-feuille-DK.gif); border-bottom: 1px solid rgba(0, 0, 0, 0.25); }
    .gras { font-weight: bold; } /* BOLD */
        .liens-saisons { font-family: "Arial"; font-size: 12.6px; color: #774e4e; font-weight: bolder; }
        .liens-saisons:hover { font-family: "Arial"; font-size: 12.6px; color: #a28371; }
    .saison { width: 472px; height: 40px; text-align: center; line-height: 40px; font-family: "Courier New"; font-size: 20px; font-style: black; color: black; border-bottom: 1px solid black; background-image:url(datas/texture-feuille-LG.gif); }
    .ornements { letter-spacing: 8px; font-family: "Tahoma", "Arial"; font-style: bold; font-size: 10px; } /* Letter-spacing */
    .ornements2 { letter-spacing: 5px; font-family: "Tahoma", "Arial"; font-style: bold; font-size: 10px; }
    .ornements2b { letter-spacing: 1px; font-family: "Tahoma", "Arial"; font-style: bold; font-size: 10px; }
    .espacementS { width: 472px; height: 16px; border-bottom: 1px solid black; }
    .espacementS1 { width: 472px; height: 16px; border-bottom: 1px solid black; }
    .espacementSMN { width: 481px; height: 16px; border-bottom: 1px solid black; }
    .espacementE { width: 472px; height: 16px; }
    .lienDL { font-family: "Arial Narrow"; font-size: 13px; color: #8b5e5e; line-height: 20px; }
    .lienDLb { font-family: "Arial"; font-size: 13px; color: #9a7070; font-weight: bold; }
    .lienDL2 { font-family: "Arial Narrow"; font-size: 15px; color: #9a7070; text-decoration: none; font-weight: bold; }
        .lienDLb:hover, .lienDL2:hover { color: #ac8f7f; }
    .lienDL:hover { font-family: "Arial Narrow"; font-size: 13px; color: #ac8f7f; line-height: 20px; }
    .lienDL2:hover { font-family: "Arial Narrow"; font-size: 15px; color: #ad8f7d; text-decoration: none; font-weight: bold; }
    .livre { width: 472px; font-family: "Tahoma"; font-size: 13px; color: black; margin-top: 4px; margin-bottom: 4px; }
        .livre-id { font-family: "Arial"; font-weight: bold; font-size: 13.6px; }
        .livre33-id { font-family: "Arial"; font-weight: bold; font-size: 13.6px; letter-spacing: -0.25px; }
        .livre-titre { font-style: italic; /* text-shadow: 1px 0 rgb(0, 0, 0, 0.1); */ }
        .livre-page { font-family: "Arial Narrow"; font-size: 13px; color: #774e4e; }
            .livre-page-OFF { font-family: "Arial Narrow"; font-size: 12px; color: #907a6e; }
        .descript-suppl { font-family: "Tahoma"; font-size: 11.5px; color: #463f3d; }
        .mp3 { vertical-align:bottom; } /* vertical-align */
        .entre2livres { height: 12px; }
        .entre2titres { height: 6px; }
        .entre2supplements { height: 4px; }
        .entre2saisons { height: 28px; }
        .s4tab { border-collapse: collapse; width: 100%; }
        /*.s4case1 { width: 268px; }
        .s4case1 { width: 204px; }*/
        .s4case1 { width: 50%; }
        .tabEP21A { width: 104px; }
        .tabEP21B { width: 204px; }
    #fin-DLA { width: 472px; height: 28px; text-align: center; }
    #fin-DLB { width: 472px; height: 16px; text-align: center; border-top: 1px solid #988b8b;}


audio
{
    width: 204px;
    height: 20px;
    vertical-align: middle;
    font-size: 9px;
   
    -webkit-transition: all 0.5s linear;
    -moz-transition: all 0.5s linear;
    -o-transition: all 0.5s linear;
    transition: all 0.5s linear;
    -moz-border-radius: 7px 7px 7px 7px;
    -webkit-border-radius: 7px 7px 7px 7px;
    border-radius: 7px 7px 7px 7px;
    
    background-color: #187dd6;
    -webkit-box-shadow: inset 0 0 5px rgba( 255, 255, 255, 0.5 );
    -moz-box-shadow: inset 0 0 5px rgba( 255, 255, 255, 0.5 );
    box-shadow: inset 0 0 5px rgba( 255, 255, 255, 0.5 );
    
    opacity: 0.4;
    z-index: 0.5;
}
@-moz-document url-prefix() 
{
  audio { filter: invert(84%); }
}


/* << COMMENTAIRES >> */
.fb-like { float: right; float: top; }
#co-possibles { width: 496px; height: 24px; background-image:url(datas/connexions_possibles.png); }

    /* NOUVEAU MODULE (2022) */
    .livredor form, .livredor input { font-family: "Tahoma"; font-size:11px; }
        .livredor input, #champmessage { opacity: 0.8; }
    .achere { width: 100%; height: 1px; border-bottom: 1px solid rgba(170, 147, 128, 0.53); border-top: 1px solid rgba(234, 228, 221, 0.53); margin: 0.91em auto 0.91em auto; }
    #jaime_ctn
    { 
        display: inline-block; width: 28.8ch; padding: 1px 4px 1px 4px; float: right;
        border-radius: 6px; border: dotted 1px rgba(0, 0, 0, 0.5); text-align: center; vertical-align: middle; line-height: 27px; 
    }
        #jaime_nbr { display: inline; width: auto; background-color: white; padding: 0.32px 1.36px 0.32px 1.36px; font-family: "Arial"; font-size: 13px; font-weight: bold; text-align: center; }
        #jaime_texte { font-family: "Arial Narrow"; font-size: 13.5px; font-weight: bold; color: #530900; }
    #section2_entete_off, #section2_entete_on
    {
        width: calc(100% - 29,2ch)); height: 2.56em; line-height: 2.5em;
        font-family: Tahoma; font-size: 12.5px; font-weight: bold; color: #530900; text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.2); text-decoration: underline;
    }
    #section2_entete_off:hover, #section2_entete_on:hover
    {
        width: calc(100% - 29,2ch)); height: 2.56em; line-height: 2.5em;
        font-family: Tahoma; font-size: 12.5px; font-weight: bold; color: #900808; text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.2);
    }
    #section2_form_on
    {
        width: calc(100% - 20px); padding: 8px; font-family: "Tahoma"; font-size: 13px; color: #530900; margin-top: 1.3em;
        border-top: 2px solid rgba(170, 147, 128, 0.53); border-bottom:  2px solid rgba(234, 228, 221, 0.53);
        border-left: 2px solid rgba(170, 147, 128, 0.53); border-right: 2px solid rgba(234, 228, 221, 0.53);
    }
    .textinput { width: 156px; }
    input[type=radio]:hover, input[type=checkbox]:hover { cursor: pointer; }
    .form_tab { width: calc(100% - 2px); border: none; }
    #champmessage { width: calc(100% - 8px); height: 3em; margin: 0 auto 0 auto; font-family: "Tahoma"; font-size: 11px; resize: none; }
    #avatar_radio_ctn { width: 100%; text-align: justify; }
        #avatar_radio_ctn input { margin-right: -3.5px; margin-left: 7px; }
    .avatar_radio_div { display: inline; }
    .petitEspaceVertical { width: 100%; height: 8px; }
    .comm_cadre { width: 96%;  vertical-align: top; border-top-right-radius: 8px; background-image:url(datas/texture-feuille-CLR.gif); box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.08); padding-top: 4px; }
    .comm_nouveau { width: calc(100% - 0.8em); }
    .comm_reponse { width:  calc(93.3% - 0.8em); margin-left: 7.5%; margin-top: -4px; }
    .comm_entete_avatar { display: inline; width: 32px; margin-right: 8px; margin-top: -4px; margin-left: 7px; }
    .comm_entete_infos
    { 
        display: inline-block; width: calc(100% - 57px); height: 27px; margin-top: -4px;
        vertical-align: middle; line-height: normal;
    }
    .comm_nom  { display: inline; font-family: "Gabriola"; font-size: 21px; line-height: 14px; font-weight: bold; float: left; }
    .comm_date { display: inline; font-family: "Tahoma"; font-size: 11px; font-style: italic; float: right; color: rgba(0, 0, 0, 0.66); margin-right: 7px; }
    .comm_message
    {
        display: block; padding: 0.8em; margin-top: -4px; line-height: 18px; text-align: justify;
        font-family: "Tahoma"; font-size: 13px; background-color: rgba(255, 255, 255, 0.16);
        border-bottom-left-radius: 6px; border-bottom-right-radius: 8px;
    }
    .smileys { margin-bottom: -2px; }


/* << LIENS-CONTACT >> */
.sous-titreB { width: 452px; height: 28px; font-family:"Old English Text MT"; font-size:18px; color: #832316; }
.MAIL { font-family: "Arial Narrow"; font-size: 14px; color: #9a7070; }
.lienMAIL:link { font-family: "Arial Narrow"; font-size: 14px; color: #9a7070; }
.lienMAIL:hover { font-family: "Arial Narrow"; font-size: 14px; color: #b19281; }
.lienMAIL:visited  { color: #9a7070; }
.lienMAIL:visited:hover  { color: #b19281; }
.cadrecontact { width: 452px; padding: 6px 12px 6px 12px; background-image:url(datas/texture-feuille-DK.gif); border: 1px solid #847068; }
.firstletter2 { font-family:"Old English Text MT"; font-weight: bold; font-size:23px; color: #761c0f; }
#cadregravure { width: 444px; padding: 0 12px 0 12px; margin: 24px 0 24px 0; text-align: center; }
#liste-liens { margin-top: 200px; margin-left: 24px; }
.unlien{ text-align: left; font-family: "Tahoma", "Arial"; font-size: 13px; }
.links { letter-spacing: auto; font-family: "Gabriola"; color: #3c2508; font-size: 19px; font-weight: bold; text-decoration: underline; line-height: 1.8em }
.links:hover { letter-spacing: auto; font-family: "Gabriola"; color: #845825; font-size: 19px; font-weight: bold; text-decoration: underline; line-height: 1.8em }
.disabled, .disabled:hover { color: #988771; text-decoration: none; text-decoration: line-through; cursor: default; }
#cadreskull { width: 210px; height: 100px; vertical-align:center; margin-left: 210px; margin-top: 0px; }
#skull { width: 100px; height: 100px; background-image:url(datas/skull-fixe.png); }
#skull:hover { width: 100px; height: 100px; background-image:url(datas/skull.gif); }



/* ======================================================================== BAS ======================================================================== */
#bas { width: 1280px; height: 64px; font-family: "Arial"; font-size:11.6px; color: #523b33; text-align: center; }
.lien-banal { font-family: "Arial"; font-size: 11.5px; text-decoration: none; color: #774e4e; }
.lien-banal:hover { font-family: "Arial"; font-size: 11.5px; text-decoration: none; color: #957262; }




/* Thin Scroll pour Chrome */

::-webkit-scrollbar {
  width: 9px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background-color: rgba(155, 155, 155, 0.5);
  border-radius: 20px;
  border: transparent;
}




/* Divers */

.width100 { width: 100%; }

.bold    { font-weight: bold; }

.font8   { font-size:  8px; }
.font10  { font-size: 10px; }
.font11  { font-size: 11px; }
.font12  { font-size: 12px; }
.font13  { font-size: 13px; }
.font14  { font-size: 14px; }

.center  { text-align: center;  }
.left    { text-align: left;    }
.right   { text-align: right;   }
.justif  { text-align: justify; }
.fleft   { float:      left;    }
.fright  { float:      right;   }

.stretch
{
    display: inline-block;
    -webkit-transform:scale(1.25,0.775);
    -moz-transform:scale(1.25,0.775);
    -ms-transform:scale(1.25,0.775);
    -o-transform:scale(1.25,0.775);
    transform:scale(1.25,0.775);
}

.center         { text-align: center; }
.centermargin   { margin:  0px auto  0px; }
.centermargin10 { margin: 10px auto 10px; }

.pointer        { cursor: pointer; }