/*body,td,th { font-family: Arial, Helvetica, sans-serif; font-size : 10px ; overflow-y:scroll; overflow-x:auto; margin:auto; padding:0; height:100%; color:#ccc; background-color:#333 ; letter-spacing : 0.06em ; }
*/

html { height: 100%; box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit;}
body { height: 100%; font-family: Arial, Helvetica, sans-serif; color: var(--coul_gris_2) ; font-size:10px; letter-spacing : 0.1em ; line-height : var(--hauteurligne3) ; text-align : center ; margin: 0 12px; background-color: var(--coul_gris_fond) ; overflow-y :scroll ; hyphenate-character: '';}

:root { 
/*triangles*/ --tr_b: 1.7rem ; --tr_h: 1.1rem ; --coul_tr: rgba(255, 255, 255, 0.8) ; --btnht: 0.4em ; --btngdh: 2.9em ; --btngdt: 0.85em ; --btngdgd: -0.65em ; 
--coul_gris_1 : #888 ; --coul_gris_2 : #ccc ; --coul_gris_3 : #aaa ; --coul_gris_noir_1: #000 ; --coul_gris_noir_2: #222 ; --coul_gris_blanc: #eee ; --blanc: #fff ; 
--coul_gris_fond: #333 ; --coul_fondvign_sombre: rgba(51, 51, 51, 0.85) ; --coul_fondvign_clair: rgba(220, 220, 220, 0.85) ; 
--coul_liens_mix: #950 ; --coul_liens : #930 ; --coul_liens_hover : #ffd9b3 ; --coul_liens_hover_neg : #00c ; 
--t_police_0 : 0.7rem ; --t_police_1 : 0.85rem ; --t_police_2 : 0.92rem ; --t_police_3 : 1.02rem ; --t_police_4 : 1.04rem ; --t_police_5 : 1.3rem ; --t_police_6 : 1.4rem ; 
--hauteurligne0 : 0.78rem ; --hauteurligne1 : 0.95rem ; --hauteurligne2 : 1.3rem ; --hauteurligne3 : 1.5rem ; --largeur_maxi0 : 400px ; 
--largeur_maxi1 : 600px ; --largeur_maxi2 : 900px ; --largeur_maxi3 : 1100px ; --largeur_maxi4 : 1600px ; }

h1 { margin: auto ; font-size: 1.2em; width: 100% ; max-width: 500px ; text-align: center ; color:#999; /*background-color : #274 ; */}

.conteneurdi_h1 { position: relative ; display: inline-block ; width:98% ; max-width: var(--largeur_maxi4) ; margin: 0 auto ; padding:0; z-index: 3 ;/*background-color:#9da ;*/ }
.di_h1 { position: relative ; width: 70% ; gap: 0 30px; margin: 15px auto ; color: var(--coul_gris_2) ;font-size: var(--t_police_2) ; text-align:center ; z-index:2; /*background-color : #9add ;*/ }
a:hover .di_h1 { color: var(--coul_liens_hover) ; transition: color 0.15s; text-decoration: none; }

.hautpage:hover .triangleh { border-bottom-color: var(--coul_liens_mix) ; transition: border-bottom-color 0.1s;}
.boutonh:hover .triangleh { border-bottom-color: var(--coul_liens_mix) ; transition: border-bottom-color 0.1s;}
.boutong:hover .triangleg { border-right-color : var(--coul_liens_mix) ; transition: border-right-color 0.1s;}
.boutond:hover .triangled { border-left-color : var(--coul_liens_mix) ; transition: border-left-color 0.1s;}

.hautpage:hover .bouthaupage { color: var(--coul_liens_mix) ; transition: color 0.1s; }
.boutonh:hover .boutonth { color: var(--coul_liens_mix) ; transition: color 0.1s; }
.boutong:hover .boutontg { color: var(--coul_liens_mix) ; transition: color 0.1s; }
.boutond:hover .boutontd { color: var(--coul_liens_mix) ; transition: color 0.1s; }

.affVinfa { display : none ; } 
.affV680infa { display : none ; } 
.affV680infb { display : none ; } 
.masqV680infa { display : block ; } 

.bloc_bouthpage { position: fixed ; width: 140px ; max-width: var(--largeur_maxi4) ; bottom: 15px ; right : 15px ; font-size: var(--t_police_1) ; letter-spacing : 0.0rem ; line-height : var(--hauteurligne1) ; font-weight: lighter; mix-blend-mode: exclusion ; z-index: 3 ; background-color : #d8c8 ; }
.bloc_bouthgdf { position: fixed ; width:95.5% ; max-width: var(--largeur_maxi4) ; top: 0 ; left: 50%; transform: translateX(-50%); font-size: var(--t_police_1) ; letter-spacing : 0.0rem ; line-height : var(--hauteurligne1) ; font-weight: lighter; mix-blend-mode: exclusion ; z-index: 3 ; /*background-color : #d8c8 ;*/ }
.bloc_bouthgds { position: fixed ; top: 0 ; left : 1rem ; right: 0 ; font-size: var(--t_police_1) ; letter-spacing : 0.0rem ; line-height : var(--hauteurligne1) ; font-weight: lighter; mix-blend-mode: exclusion ; z-index: 3 ; /*background-color : #aeb5 ;*/ }
@supports (position: sticky) {.bloc_bouthgds { position: sticky; }}

.hautpage { position: absolute ; display : flex ;justify-content: flex-start ; align-items: center ; bottom: var(--btnht) ; right : 0 ; border : 0 ; height : 1.9em ; margin: 0 ; /*background-color : #d75b ; */}

.bouthaupage { width : 9em ; overflow-wrap: anywhere; color: var(--coul_tr) ; /*background-color : rgba(255, 222, 222, 0.2) ; */}
.boutonth { width : 5em ; overflow-wrap: anywhere; color: var(--coul_tr) ; /*background-color : rgba(255, 222, 222, 0.05) ;*/ }
.boutontg { width: 13.2em ; margin-left : 0.3em ; overflow-wrap: anywhere; color: var(--coul_tr) ; line-height : var(--hauteurligne0) ; letter-spacing: -0.05rem ; /*background-color : rgba(255, 222, 222, 0.05) ;*/ }
.boutontd { width: 13.2em ; margin-right: 0.3em ; overflow-wrap: anywhere; color: var(--coul_tr) ; line-height : var(--hauteurligne0) ; letter-spacing: -0.05rem ; /*background-color : rgba(255, 222, 222, 0.05) ;*/ }

.triangleh { width : 1.2em ; height: 1.2em ; top: auto ; border-right: var(--tr_h) solid transparent ; border-bottom: var(--tr_b) solid var(--coul_tr) ; border-left : var(--tr_h) solid transparent ; }
.triangleg { width : 1.2em ; height: 1.2em ; top: auto ; border-top : var(--tr_h) solid transparent ; border-right : var(--tr_b) solid var(--coul_tr) ; border-bottom: var(--tr_h) solid transparent ; }
.triangled { width : 1.2em ; height: 1.2em ; top: auto ; border-top : var(--tr_h) solid transparent ; border-bottom: var(--tr_h) solid transparent ; border-left : var(--tr_b) solid var(--coul_tr) ; }

#bloc_im_individuelle_3 { right : -0.9em ; top : 3.8em ; margin: 0 ; width:12.5em ; z-index : 2 ; position: fixed ; height:3.8em; }
.plusbas_3 { position:relative ; text-align:center ; font-size : 1.2em ; top: -1.5em; width: 100%; letter-spacing : 0 ; opacity: 0.5; }
.plusbas_4 {  display: inline-block ; position:relative ; text-align:center ; font-size : 1.9em ; font-weight:bold ; top: -0.3em; right : 0.85em; width: 100%; letter-spacing : 0 ; opacity: 0.5; }
.plusbas_5 {  display: inline-block ; position: absolute ; text-align:center ; font-size : 1.4em ; font-weight: normal ; top: 1.9em; right : 3.5em; width: 3em; letter-spacing : 0 ; opacity: 0.5; /*background-color : #247 ;*/ }
.plusbas_6 {  display: inline-block ; position: absolute ; text-align:center ; font-size : 1.4em ; font-weight: normal ; top: 2.9em; right : 4.6em; width: 7em; letter-spacing : 0 ; opacity: 1; color:#000; line-height : 1.3em ; /*background-color : #247 ; */}
.boutonfl { border : 0 ; width : 100% ; height : 0.9em ; margin :0 ; text-align:center ; }
.imflh { width: 20px ; height: 20px ; left: 0 ; border: 0; }
.flecheshhh { position:relative ; display: inline-block ; top: -1.5em ; }
.retour { position:relative ; display: inline-block ; top: -3.2em ; width : 4em ; height : 1.2em ; }
#a5x5px { position: relative; right : 3px ; }
#b5x5px { position: relative; right : 3px ; }
#c5x5px { position: relative; right : 4px ; }
#d5x5px { border-radius: 8px; width: 100%; height: 100% ; }
#e5x5px { border-radius: 8px; width: 100%; height: 100% ; }
#f5x5px { border-radius: 8px; width: 100%; height: 100% ; }
#g5x5px { border-radius: 8px; width: 100%; height: 100% ; }
#h5x5px { border-radius: 8px; width: 100%; height: 100% ; }

.fr_en {  display: inline  ; position:relative ; text-align:center ; font-size : 1.1em ; font-weight:bold ; padding: 0em 0.2em 0.15em 0.2em ; top: 0.04em; left : 0.85em; height : 0.6em ; letter-spacing : 0 ; color: #888;  opacity: 0.9; border: 0.05em solid #888; }

#blocboutons { margin: 0.5em auto 0.5em ; max-width: 1700px ; width: 97% ; font-size : 1.6em ; letter-spacing : 0.06em ; text-align: center ; }
.boutoni { position: relative; display: inline-block ; border : 0 ; width : 100% ; height : 3.0em ; margin: 1em auto 0 ; line-height: 1.1em ; }
.boutont { position: relative; display: inline-block ; vertical-align: middle ; font-size : 1em ; }

.fondbouton { position: absolute; left:0; top:0; width: 100% ; height: 100%; }
.margehaut1 { margin-top : 0.95em ; }
.blocpages1 { max-width: 65em; margin: 2em auto 0; font-size : 1.6em ; letter-spacing : 0.06em ; }
.blocpages2 { margin: 2em auto 10em ; width: 87% ; max-width: 1900px ; height:auto ; text-align: center; }
#pano_container{ margin: 0 ; height : 100% ; width : 100% ; float: left; border : 0 ; background-color:#333 ; }
.bloc_listes { position:relative ; float: left; text-align: left ; margin: 0 0 0 1.5em ; width: 88%; }
.titrcv { float: left; margin: 0; width: 100%; }

.legendPop { position: absolute; bottom:0; left:0; margin: 0 ; padding: 2%; background: rgba(5, 5, 5, 0.2); color: #ddd; visibility: hidden; font-size: 0.9em; font-weight: bold; line-height: 1 ; width : 96.2% ; height: auto ; z-index:3;}
.blocvign:hover .legendPop { visibility: visible; opacity: 1;}
.blocvign { display: inline-block ; position: relative; vertical-align: middle; height : auto ; max-width : 90% ; margin: 3em 0 0 0 ; font-size : 1.6em ; letter-spacing : 0.06em ; }
.vignet { margin: 0 ; width : 98.9% ; }
.legendPo2 { display: block ; top : 0.0em; left: 0 ; padding: 0; height : auto ; color: #ccc; letter-spacing: 0em ; font-size: 0.85em; line-height: 1.4em ; width : 100% ; }
.arrondi { border-radius: 1.3em ; }

a:link {color: #ac7753; text-decoration: none; } 
a:visited { color: #ac7753; text-decoration: none; }
a:hover {color: rgba(255, 140, 26, 0.7) ; text-decoration: none; }
a:active { color: rgba(255, 140, 26, 0.7) ; text-decoration: none; }

.gris3 { color : #ddd ; text-decoration : none ; } 
.gris3 a:link { color : #ddd ; text-decoration : none ; } 
.gris3 a:visited { color : #ddd ; text-decoration : none ; } 
.gris3 a:hover { color : #888 ; text-decoration : none ; } 
.gris3 a:active { color : #888 ; text-decoration : none ; } 

.gris4 { color : #999 ; text-decoration : none ; } 
.gris4 a:link { color : #999 ; text-decoration : none ; font-weight:bold ; } 
.gris4 a:visited { color : #999 ; text-decoration : none ; } 
.gris4 a:hover { color : #ccc ; text-decoration : none ; } 
.gris4 a:active { color : #ccc ; text-decoration : none ; } 

.gris5 { color:#fff; text-decoration: none; }
.gris5 a:link {color:#fff; text-decoration: none; font-weight:bold ; }
.gris5 a:visited { color:#fff; text-decoration: none; }
.gris5 a:hover {color:#555; text-decoration: none;}
.gris5 a:active { color:#555; text-decoration: none; }

#video-fond { overflow: hidden; position: fixed; top: 0; right: 0; bottom: 0; left: 0;}
#video-fond > video { width: 100%; height: 100%; position: absolute; top: 0; left: 0;}

img.fondecran {min-height: 100%;width: 100%;height: auto;position: fixed;top: 0;left: 0 ; }

.petite_police { font-size : 1em ; letter-spacing : -0.06em ; color: #888; }

.boutonvideo { position: absolute ; display: flex ; justify-content: center ; align-self: center ; border-radius: 50% ; top: auto ; left: auto ; width: 30% ; margin: 0 ; max-width : 95% ; background-color : rgba(0, 0, 0, 0.6) ; }
.boutonvideo::before { content:""; display: block; padding-bottom: 100% ; }
.vignboutonvideo:hover .boutonvideo .trianglevideo:after { border-left-color : var(--coul_liens_hover) ; opacity: 0.7 ; transition: border-left-color 0.1s; }
.trianglevideo { margin-left : 13% ; align-self: center ; width: 0; height: 0; padding-top: 30%; padding-bottom: 30%; padding-left: 52%; overflow: hidden; }
.trianglevideo:after { content: ""; display: block; width: 0; height: 0; margin-top:-500px; margin-left: -866px; border-top: 500px solid transparent; border-bottom: 500px solid transparent; border-left: 866px solid rgba(255, 140, 26, 0.7) ; }
.vignboutonvideo { display: flex ; justify-content: center ; border: 0; margin-bottom : 0.5rem ; max-width : 100% ; cursor: pointer; }

.boutonvideo_neg { position: absolute ; display: flex ; justify-content: center ; align-self: center ; border-radius: 50% ; top: auto ; left: auto ; width: 30% ; margin: 0 ; max-width : 95% ; background-color : rgba(255, 255, 255, 0.7) ; }
.boutonvideo_neg::before { content:""; display: block; padding-bottom: 100% ; }
.vignboutonvideo:hover .boutonvideo_neg .trianglevideo_neg:after { border-left-color : var(--coul_liens_hover_neg) ; opacity: 0.7 ; transition: border-left-color 0.1s; }
.trianglevideo_neg { margin-left : 13% ; align-self: center ; width: 0; height: 0; padding-top: 30%; padding-bottom: 30%; padding-left: 52%; overflow: hidden; }
.trianglevideo_neg:after { content: ""; display: block; width: 0; height: 0; margin-top:-500px; margin-left: -866px; border-top: 500px solid transparent; border-bottom: 500px solid transparent; border-left: 866px solid rgba(0, 0, 0, 0.7) ; }
.vignboutonvideo { display: flex ; justify-content: center ; border: 0; margin-bottom : 0.5rem ; max-width : 100% ; cursor: pointer; }



@media only screen and (min-width: 500px) {
.bloc_listes { margin: 0 0 0 8.5em ; width: 61%; }
.boutoni { width : 13em ; }
.boutont { width : 13em ; }
}

@media only screen and (min-width: 900px) and (min-height: 610px){ 

.affV680infa { display : block ; } 
.masqV680infa { display : none ; }
.affHinfa { display: inline ; } 
.masqHinfa { display: none ; } 
.affVinfa { display: block ; } 
.largeur73p { width:73% ;}

}

.bloc_im_individuelle_4 { position : absolute ; right : -1.2em ; top : 2.8em ; margin : 0 ; width : 14em ; height : 0.2em ; letter-spacing : 0.08em ; line-height : 1.1em ; z-index : 2 ; /*background-color : #9ea ;*/ } 
.melange1 { mix-blend-mode: exclusion ; }
.prec   { position : relative ; display : inline-block ; text-align: left ; font-size : 3.0em ; top : 0.4em ; width : 1.2em ; height : 0.1em ; font-family : serif ; } 
.retou2 { position : relative ; display : inline-block ; text-align: center ; font-size : 3.0em ; bottom : 0.4em ; width : 1.2em ; height : 0.1em ; font-family : serif ; } 
.suiv   { position : relative ; display : inline-block ; text-align: right ; font-size : 3.0em ; top : 0.4em ; width : 1.2em ; height : 0.1em ; font-family : serif ; } 
.afftext { display: none ; position : relative ; margin: 0 ; width : 2em ; height: 2em ; top : -1.5em ; right : 3em ; opacity: 0.5 ; z-index : 4 ; background-color : #aaa ; } 
.titre_page { display : block ; position : absolute ; top : 0.5em ; right : -2.5em ; margin : 0 ; color : #fff ; letter-spacing : 0.01em ; font-size : 1.1em ; line-height : 1.2em ; height : 0.2em ; white-space : nowrap ; direction : rtl ; unicode-bidi : normal ; /*background-color : #e7c ;*/ } 
.nonvisib { visibility : hidden ; } 
.noms2 { font-size : 1.1em ; } 
/* _____The MIT License (MIT) Copyright (c) 2018 Kristijonas Gerdvilis__https : //github.com/krisger/MultilevelNavigationPlugin__https : //www.jqueryscript.net/menu/multi-level-expanding-navigation.html___*/
.navigation { display : inline-block ; position : absolute ; right : 5.1em ; top : 3.8em ; margin : 0 ; width : 0px ; height : 2em ; letter-spacing : 0.08em ; line-height : 0.8em ; text-align : right ; z-index : 5 ; /*background-color : #ea7 ;*/ } 
.navigation li { list-style-type : none ; } 
.navigation li a { display : block ; } 
ul.navigation > li ul { display : none ; } 
ul.navigation li.active > a { width : 11em ; height : 3em ; right : 5em ; opacity: 0.0 ; }