@import url("//netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.css");
/* XS @media (max-width: 767px) >>>> Smartphones SM @media (min-width: 768px) and (max-width: 991px) >>>> Tablettes MD @media (min-width: 992px) and (max-width: 1199px)>>>> Tablettes Paysage + Petits écrans LG @media (min-width: 1200px) {
     >>>> Grands écrans */
     .sql{
        /* Class de test pour le requetes et msg d'erreur*/
         position:relative;
         width:100%;
         background-color: rgba(147,255,38,0.5);
         z-index:99999999999;
         font-family: Play;
         font-size: 11pt;
         color: #000000;
         text-decoration: none;
    }
     Visiter Musée Vous cherchez un musée d'art, d'histoire, d'ethnol... Musées musées Vous trouverez partout des musées en France. Vous ... Musées Tous les musées de France https://museedupatrimoine.fr/1/musee-de-france.php @media (max-width: 767px){
         .position_fb {
             position:relative!important;
             top:10px!important;
             z-index:1;
        }
         .position_txt{
             margin-top:10px;
        }
    }
     @media (min-width: 768px) and (max-width: 991px){
         .position_fb {
             position:relative!important;
             top:-50px!important;
             z-index:1;
        }
         .position_txt{
             margin-top:50px;
        }
    }
     @media (min-width: 992px) and (max-width: 1199px){
         .position_fb {
             position:relative!important;
             top:-100px!important;
             z-index:1;
        }
         .position_txt{
             margin-top:120px;
        }
    }
     @media (min-width: 1200px){
         .position_fb {
             position:relative!important;
             top:-100px!important;
             z-index:1;
        }
         .position_txt{
             margin-top:120px;
        }
         #accueil .col-lg-4 {
             max-height: 290px;
        }
    }
     .page{
         background-color: rgba(255,255,255,1);
         border: 1px solid #ffd24c;
         padding: 20px;
         border-radius: 4px;
    }
     .barre{
         text-decoration: line-through;
    }
     .tagequipement{
         margin:4px!important;
         background-color: rgba(255,255,153,0.5);
         color:#ffffff;
         border: 1px solid #ffd24c;
         padding: 2px;
         font-size: 1.3rem;
         border-radius: 4px;
         white-space: nowrap;
         font-weight: normal;
         text-align: center;
         vertical-align: middle;
    }
     .tagclasse{
         margin-bottom:30px;
         background-color: rgba(221,221,221,0.1);
        /*border: 1px solid #ffd24c;
        */
         padding:3px;
         font-size: 14px;
         border-radius: 4px;
         white-space: nowrap;
         font-weight: normal;
         text-align: center;
         vertical-align: middle;
         box-shadow: 2px 2px 10px #eeeeee;
         -moz-box-shadow: 2px 2px 10px #eeeeee;
         -webkit-box-shadow: 2px 2px 10px #eeeeee;
    }
     @media (max-width: 767px) {
         .blocselect_patrimoine {
             min-height:220px;
        }
         .bloc_patrimoine {
             min-height:350px;
        }
    }
     @media (min-width: 768px) and (max-width: 991px) {
         .blocselect_patrimoine {
            /*min-height:280px;
            */
        }
         .bloc_patrimoine {
            /*min-height:480px;
            */
        }
    }
     @media (min-width: 992px) and (max-width: 1199px) {
         .blocselect_patrimoine {
             min-height:320px;
        }
         .bloc_patrimoine {
             min-height:320px;
        }
    }
     @media (min-width: 1200px) {
         .blocselect_patrimoine {
            /*min-height:416px;
            */
        }
         .bloc_patrimoine {
             min-height:500px;
        }
    }
     .blocselect_patrimoine {
        /*margin-bottom:20px;
        */
         padding:5px;
         transform:scale(1);
         -webkit-transform:scale(1);
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         border-radius: 10px;
        /*color: #003040;
        */
         background-color: rgba(200,200,200,0.0);
         -moz-box-shadow:0px 2px 2px #bbbbbb;
         box-shadow: 0px 2px 2px #bbbbbb;
         -webkit-box-shadow: 0px 0px 10px #bbbbbb;
         -moz-transition: all 0.3s ease-in-out 0s;
         -webkit-transition: all 0.3s ease-in-out 0s;
         -o-transition: all 0.3s ease-in-out 0s;
         -ms-transition: all 0.3s ease-in-out 0s;
         transition: all 0.3s ease-in-out 0s;
    }
     .blocselect_patrimoine:hover {
         -moz-box-shadow:0px 2px 2px transparent;
         box-shadow: 0px 2px 2px transparent;
         -webkit-box-shadow: 0px 2px 2px transparent;
         background-color: rgba(255,255,255,0);
         transform:scale(0.95);
         -webkit-transform:scale(0.97);
         -webkit-transition: all 0.1s ease-in-out;
         -moz-transition: all 0.1s ease-in-out;
         -o-transition: all 0.1s ease-in-out;
         transition: all 0.1s ease-in-out;
    }
     .bloc_patrimoine {
         margin-bottom:20px;
         padding:10px;
         transform:scale(1);
         -webkit-transform:scale(1);
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         border-radius: 10px;
        /*color: #003040;
        */
         background-color: rgba(200,200,200,0.1);
         -moz-box-shadow:0px 0px 10px #bbbbbb;
         box-shadow: 0px 0px 10px #bbbbbb;
         -webkit-box-shadow: 0px 0px 10px #bbbbbb;
         -moz-transition: all 0.3s ease-in-out 0s;
         -webkit-transition: all 0.3s ease-in-out 0s;
         -o-transition: all 0.3s ease-in-out 0s;
         -ms-transition: all 0.3s ease-in-out 0s;
         transition: all 0.3s ease-in-out 0s;
    }
     .bloc_patrimoine:hover {
         -moz-box-shadow:0px 2px 2px transparent;
         box-shadow: 0px 2px 2px transparent;
         -webkit-box-shadow: 0px 2px 2px transparent;
         background-color: rgba(255,255,255,1);
         transform:scale(0.95);
         -webkit-transform:scale(0.97);
         -webkit-transition: all 0.1s ease-in-out;
         -moz-transition: all 0.1s ease-in-out;
         -o-transition: all 0.1s ease-in-out;
         transition: all 0.1s ease-in-out;
    }
     .patienter {
         position:relative;
        /*left: 33%;
        */
         top: 150px;
         max-width: 200px!important;
         max-height: 200px!important;
         margin-left: auto;
        /* Cette valeur doit être la moitié négative de la valeur du width */
         margin-top: auto;
        /* Cette valeur doit être la moitié négative de la valeur du height */
    }
    /* SECURITE */
     .sec {
         display:none;
    }
     .bphoto {
         transform:scale(1);
         -webkit-transform:scale(1);
         -webkit-transition: all 0.1s ease-in-out;
         -moz-transition: all 0.1s ease-in-out;
         -o-transition: all 0.1s ease-in-out;
         transition: all 0.1s ease-in-out;
         width: 100%;
    }
     .bphoto:hover , .bphoto:focus {
         transform:scale(1.05);
         -webkit-transform:scale(1.05);
         -webkit-transition: all 0.1s ease-in-out;
         -moz-transition: all 0.1s ease-in-out;
         -o-transition: all 0.1s ease-in-out;
         transition: all 0.1s ease-in-out;
         box-shadow: 2px 2px 10px #999999;
         -moz-box-shadow: 2px 2px 10px #999999;
         -webkit-box-shadow: 2px 2px 10px #999999;
    }
     .minizoom {
         transform:scale(1);
         -webkit-transform:scale(1);
         -webkit-transition: all 0.1s ease-in-out;
         -moz-transition: all 0.1s ease-in-out;
         -o-transition: all 0.1s ease-in-out;
         transition: all 0.1s ease-in-out;
    }
     .minizoom li:hover , .minizoom:focus {
         transform:scale(1.05);
         -webkit-transform:scale(1.05);
         -webkit-transition: all 0.1s ease-in-out;
         -moz-transition: all 0.1s ease-in-out;
         -o-transition: all 0.1s ease-in-out;
         transition: all 0.1s ease-in-out;
         box-shadow: 2px 2px 10px #999999;
         -moz-box-shadow: 2px 2px 10px #999999;
         -webkit-box-shadow: 2px 2px 10px #999999;
    }
     .masquephoto div{
         position:relative;
         overflow:hidden;
         width:100%;
         height:665px;
         z-index:1;
    }
     .masquephoto img{
         min-width:100%;
         z-index:1;
    }
     html {
         font-family: Arial, sans-serif;
    }
     #mainpatrimoine {
         z-index:2;
         box-shadow: 0px -5px 30px #111111;
         -moz-box-shadow: 0px -5px 30px #111111;
         -webkit-box-shadow: 0px -5px 30px #111111;
         position:relative;
         top:-20px;
    }
     .btn-patrimoine {
         color: #999999;
         background-color: #ffffff;
         border-bottom: 1px #2C60AB solid;
         box-shadow: 0px 0px 30px #111111;
         -moz-box-shadow: 0px 20px 30px #111111;
         -webkit-box-shadow: 0px 10px 10px #eeeeee;
    }
     .btn-patrimoine:hover, .btn-patrimoine:focus, .btn-patrimoine:active, .btn-patrimoine.active {
         color: #2C60AB;
         background-color: #ffffff;
         border-bottom: 1px transparent solid;
    }
     .listPatrimoine_result{
         width: 100%;
    }
     .listPatrimoine_result img{
         float: right;
    }
     .Hebergements_Buttons_left{
         width: 75%;
         float: left;
    }
     .Hebergements_Buttons_right{
         width: 25%;
         float: left;
    }
     .latete {
         z-index:2;
         box-shadow: 0px 5px 30px #fefefe;
         -moz-box-shadow: 0px 5px 30px #fefefe;
         -webkit-box-shadow: 0px 5px 30px #fefefe0;
    }
     #raccourcis {
         position:relative;
         z-index:2;
         box-shadow: 0px -5px 10px rgba(0,0,0,0.3);
         -moz-box-shadow: 0px -5px 10px rgba(0,0,0,0.3);
         -webkit-box-shadow: 0px -5px 10px rgba(0,0,0,0.3);
        /*top:-8px!important;
        */
    }
     @media (max-width: 1200px) {
         .Hebergements_Buttons_left{
             width: 100%;
             float: left;
        }
         .Hebergements_Buttons_right{
             width: 100%;
             float: left;
        }
    }
     @media (max-width: 767px) {
         #logo {
             max-width:200px;
             position:relative;
             top: 0px;
             padding:6px;
        }
    }
     @media (min-width: 768px) and (max-width: 991px) {
         #logo {
             max-width:200px;
             position:relative;
             top: 0px;
             padding:6px;
        }
    }
     @media (min-width: 992px) and (max-width: 1199px) {
         #logo {
             max-width:250px;
             position:relative;
             top: 0px;
             padding:6px;
        }
    }
     @media (min-width: 1200px) {
         #logo {
             max-width:300px;
             position:relative;
             top: 0px;
             padding:6px;
        }
    }
     #headerpresentationhotel {
        /* menu statique du haut de chaque fiche */
         position:relative;
         z-index:10;
         top:-20px;
         background: #ffffff;
         padding: 0px;
         margin: 0px;
         width:100%;
         box-sizing:border-box;
         border-bottom:1px solid #cccccc;
         box-shadow: 2px 2px 20px #bbbbbb;
         -moz-box-shadow: 2px 2px 20px #bbbbbb;
         -webkit-box-shadow: 2px 2px 20px #bbbbbb;
    }
     #menustatique {
        /* menu statique du haut du back-office */
         position:relative;
         z-index:10;
         top:-20px;
         background: #fbf9fb;
         padding: 0px;
         margin: 0px;
         width:100%;
         box-sizing:border-box;
         border-bottom:1px solid #cccccc;
    }
     #bloc{
        /* fond de page central */
         z-index:1;
         position:relative;
         top:-40px;
         padding:10px;
         margin:10px auto 10px;
         width:100%;
         max-width:1200px;
         background: #444242;
         border:1px solid #cccccc;
         box-shadow: 2px 2px 10px #bbbbbb;
         -moz-box-shadow: 2px 2px 10px #bbbbbb;
         -webkit-box-shadow: 2px 2px 10px #bbbbbb;
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         border-radius: 10px;
    }
     .pousse-right {
         float: right !important;
    }
     @media (max-width: 767px){
         .pousse-right {
             float: left !important;
        }
    }
     #toTop{
        /* Bouton retour haut*/
         position: fixed;
         bottom: 80px;
         right: 10px;
         cursor: pointer;
         display: none;
         z-index:10;
    }
    /* FORMATAGE DES TEXTES EN FONCTION DE LA RESOLUTION SI CLASS "XS" EST INDIQUE */
     @media (max-width: 525px){
         .xxs {
             font-size: 15px;
            /*margin-top:-15px;
            */
        }
         .xs {
             font-size: 20px;
            /*margin-top:-15px;
            */
        }
    }
     @media (min-width: 526px) and (max-width: 767px) {
         .xxs {
             font-size: 18px;
        }
         .xs {
             font-size: 22px;
            /*margin-top:-15px;
            */
        }
    }
     @media (min-width: 768px) and (max-width: 991px){
         .xxs {
             font-size: 20px;
        }
         .xs {
             font-size: 25px;
            /*margin-top:-15px;
            */
        }
    }
     @media (min-width: 992px) and (max-width: 1199px){
         .xxs {
             font-size: 20px;
        }
         .xs {
             font-size: 25px;
            /*margin-top:-15px;
            */
        }
    }
     @media (min-width: 1200px){
         .xxs {
             font-size: 20px;
        }
         .xs {
             font-size: 25px;
            /*margin-top:-15px;
            */
        }
    }
     .fieldset {
         border: 2px solid rgba(255,255,255,0.8);
         margin: 0px;
         padding: 0px;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .contenu{
         position:relative;
         top:-60px;
    }
     #pinBoot {
         position: relative;
         max-width: 100%;
         width: 100%;
    }
     .white-panel {
         position: absolute;
         background: white;
         box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
         padding: 10px;
    }
    /* stylize any heading tags withing white-panel below */
     .white-panel h1 {
         font-size: 1em;
    }
     .white-panel h1 a {
         color: #A92733;
    }
     #chercher {
         position:relative;
         top:-80px;
         margin-top:50px;
    }
     .tags{
         padding:1px 2px 1px 2px ;
         margin:1px;
         font-size:12px;
         background-color: transparent;
         color:#CCCCCC;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
         border: 0.1em dashed #CCCCCC;
         list-style:none;
    }
     .addannonceplus{
         margin:3px 10px 0px 10px;
         background-color: rgba(255,255,255,0.5);
         color:#000000;
         min-width:260px;
         font-size:14px;
         text-align:center;
         -webkit-border-radius: 12px 12px 12px 12px;
         -moz-border-radius: 12px 12px 12px 12px;
         border-radius: 12px 12px 12px 12px;
         border: 1px solid #D9A300;
    }
     .addannonceplus:hover{
         background-color: rgba(255,255,255,0.1);
         color:#333333;
         -webkit-border-radius: 12px 12px 12px 12px;
         -moz-border-radius: 12px 12px 12px 12px;
         border-radius: 12px 12px 12px 12px;
         border: 1px solid #eeeeee;
    }
     .addannonce{
         margin:0px 10px 0px 10px;
         background-color: rgba(255,255,255,0.1);
         color:#333333;
         -webkit-border-radius: 0px 0px 12px 12px;
         -moz-border-radius: 0px 0px 12px 12px;
         border-radius: 0px 0px 12px 12px;
         border: 1px solid #D9A300;
    }
     .addannonce:hover{
         background-color: rgba(255,255,255,1);
         color:#333333;
         -webkit-border-radius: 12px 12px 0px 0px;
         -moz-border-radius: 12px 12px 0px 0px;
         border-radius: 12px 12px 0px 0px;
         border: 1px solid #eeeeee;
    }
    /* img {
         width: 100%;
    }
     */
     .iconeavant {
         color:#8C2300;
    }
     .txt150 {
         font-size:150%;
    }
     .bloc-client {
         background-color:#FCFCFC;
         padding:10px 10px 20px 10px;
         border-width: 1px 1px 1px 20px;
         border-style: solid;
         border-color: #FFC926;
         -moz-box-shadow:2px 2px 5px #ccc;
         box-shadow: 2px 2px 5px #ccc;
         -webkit-box-shadow: 2px 2px 5px #ccc;
    }
     .bloc-client h3 {
         padding:0px 0px 20px 10px;
    }
     .bloc-client ul {
         padding:0px 0px 20px 0px;
    }
     div .bloc-zoom {
         -moz-transition: all 0.3s ease-in-out 0s;
         -webkit-transition: all 0.3s ease-in-out 0s;
         -o-transition: all 0.3s ease-in-out 0s;
         -ms-transition: all 0.3s ease-in-out 0s;
         transition: all 0.3s ease-in-out 0s;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
        /*opacity: 0.7;
        */
         padding:10px 0 10px 0;
         border-width: 1px 1px 1px 1px;
         border-style: solid;
         border-color: #ccc;
         z-index:1;
        /* max-height:300px;
         overflow:hidden;
         */
    }
     div .bloc-zoom:hover {
         background-color:#FCFCFC;
         -moz-transform: scale(1.10);
         -webkit-transform: scale(1.10);
         -o-transform: scale(1.10);
         -ms-transform: scale(1.10);
         transform: scale(1.10);
         -moz-box-shadow:2px 2px 15px #ccc;
         box-shadow: 2px 2px 15px #ccc;
         -webkit-box-shadow: 2px 2px 15px #ccc;
        /*opacity: 1;
        */
         z-index:999991;
    }
     .poubelle {
         position:relative;
         top:30px;
         text-shadow: 1px 1px 5px rgba(252,252,252, 0.8);
    }
    /* ESPACEMENT *************************************/
     .space-top {
         margin-top: 24px;
    }
     @media only screen and (max-width: 768px) {
         .space-top {
             margin-top: 19.2px;
        }
    }
     .space-bottom {
         margin-bottom: 24px;
    }
     @media only screen and (max-width: 768px) {
         .space-bottom {
             margin-bottom: 19.2px;
        }
    }
     .double-space-top {
         margin-top: 48px;
    }
     @media only screen and (max-width: 768px) {
         .double-space-top {
             margin-top: 31.2px;
        }
    }
     .double-space-bottom {
         margin-bottom: 48px;
    }
     @media only screen and (max-width: 768px) {
         .double-space-bottom {
             margin-bottom: 31.2px;
        }
    }
     .double-padding-top {
         padding-top: 48px !important;
    }
     @media only screen and (max-width: 768px) {
         .double-padding-top {
             padding-top: 31.2px !important;
        }
    }
     .double-padding-bottom {
         padding-bottom: 48px !important;
    }
     @media only screen and (max-width: 768px) {
         .double-padding-bottom {
             padding-bottom: 31.2px !important;
        }
    }
     .padding-top{
         padding-top:10px!important;
    }
     .padding-bottom{
         padding-bottom:10px!important;
    }
     .padding0 {
         padding:0px!important;
    }
     .margin0 {
         margin:0px!important;
    }
     .margin-right {
         margin-right:10px!important;
    }
     .padding5 {
         padding:5px!important;
    }
     .padding10 {
         padding:10px!important;
    }
     .padding20 {
         padding:20px!important;
    }
     .margin5 {
         margin:5px!important;
    }
     .margin10 {
         margin:10px!important;
    }
     .margin20 {
         margin:20px!important;
    }
     .marginauto{
         margin:auto!important;
    }
     @media only screen and (max-width: 768px) {
         .center-mobile {
             text-align: center !important;
        }
    }
     @media only screen and (max-width: 991px) {
         .center-tablet {
             text-align: center !important;
        }
    }
    /* COULEURS TEXTES ET STYLES *************************************/
     .titre {
         margin: 0px 10px 10px 0px ;
        /*border:1px solid #222222;
        */
         color:#00698C;
         text-decoration:none!important;
    }
     .titre:hover {
         color:#698C00;
         text-decoration:none!important;
    }
     .green {
         margin:3px;
         color:#468C00;
    }
     .txt-clair {
         color:#EEEEEE!important;
    }
     .txt-ombre {
         text-shadow: 1.0px 1.0px 2px rgba(0,0,0,0.8);
    }
     .txt-vert {
         color:#73b83a!important;
    }
     .txt-bleu {
         color:#00698c!important;
    }
     .txt-orange {
         color:#FF9326!important;
    }
     .txt-gris-fonce {
         color:#666666!important;
    }
     .txt-gris {
         color:#AAAAAA!important;
    }
     .txt-gris-clair{
         color:#eeeeee!important;
    }
     .txt-bleu-clair{
         color:#73dcff!important;
    }
     .txt-ocre {
         color:#D90000 !important;
    }
     .txt-creme {
         color:#fcc169 !important;
    }
     .txt-brun {
         color:#b35900 !important;
    }
     .txt-blanc {
         color:#FFFFFF !important;
    }
     .txt-placeholder {
         color:#FF794C !important;
    }
     .txt-noir {
         color:#000000 !important;
    }
     .mauvais {
         color:#b35900 !important;
    }
     .bon {
         color:#73b83a !important;
    }
     .blason {
         color: #fcb910 !important;
         text-shadow: 0px 5px 4px rgba(85,85,85,0.5);
    }
     .blasonno {
         color: #eeeeee !important;
         text-shadow: 0px 5px 4px rgba(85,85,85,0.3);
    }
     .light-weight {
         font-weight: 300 !important;
    }
     .bold-weight {
         font-weight: bold !important;
    }
     .normal-weight {
         font-weight: normal !important;
    }
     .passouligner{
         text-decoration: none;
    }
     .font-indie{
         font-family: 'Indie Flower', cursive!important;
    }
     .font-lato{
         font-family: "Lato", Helvetica, Arial, sans-serif!important;
    }
     .font-asap{
         font-family: 'Asap', sans-serif!important;
    }
     .font10 {
         font-size:10px!important;
    }
     .font12 {
         font-size:12px!important;
    }
     .font14 {
         font-size:14px!important;
    }
     .font16 {
         font-size:16px!important;
    }
     .font18 {
         font-size:18px!important;
    }
     .font20 {
         font-size:20px!important;
    }
     .font25 {
         font-size:25px!important;
    }
     .font30{
         font-size:30px!important;
    }
     .font40{
         font-size:40px!important;
    }
     @media only screen and (max-width: 768px) {
         .font10 {
             font-size:9px!important;
        }
         .font12 {
             font-size:10px!important;
        }
         .font14 {
             font-size:12px!important;
        }
         .font16 {
             font-size:14px!important;
        }
         .font18 {
             font-size:16px!important;
        }
         .font20 {
             font-size:17px!important;
        }
         .font25 {
             font-size:21px!important;
        }
         .font30{
             font-size:24px!important;
        }
         .font40{
             font-size:30px!important;
        }
    }
     @media (min-width: 769px) and (max-width: 992px) {
         .font10 {
             font-size:10px!important;
        }
         .font12 {
             font-size:12px!important;
        }
         .font14 {
             font-size:13px!important;
        }
         .font16 {
             font-size:15px!important;
        }
         .font18 {
             font-size:17px!important;
        }
         .font20 {
             font-size:19px!important;
        }
         .font25 {
             font-size:22px!important;
        }
         .font30{
             font-size:25px!important;
        }
         .font40{
             font-size:32px!important;
        }
    }
     .text-left {
         text-align: left;
    }
     .text-right {
         text-align: right;
    }
     .text-center {
         text-align: center;
    }
     .text-justify {
         text-align: justify;
    }
     .text-nowrap {
         white-space: nowrap;
    }
     .text-lowercase {
         text-transform: lowercase;
    }
     .text-uppercase {
         text-transform: uppercase;
    }
     .text-capitalize {
         text-transform: capitalize;
    }
     .center {
         margin-left: auto;
         margin-right: auto;
    }
     .center img{
         margin-left: auto;
         margin-right: auto;
    }
    /* BORDER *************************************/
     .arrondir{
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         border-radius: 10px;
    }
     .arrondir_top{
         -webkit-border-radius: 10px 10px 0 0;
         -moz-border-radius: 10px 10px 0 0;
         border-radius: 10px 10px 0 0;
    }
     .arrondir_bottom{
         -webkit-border-radius: 0 0 10px 10px;
         -moz-border-radius: 0 0 10px 10px;
         border-radius: 0 0 10px 10px;
    }
     .grosborderrouge {
         border: 5px solid #B32D00;
    }
     .grosbordervert {
         border: 5px solid #59B300;
    }
     .grosborderorange {
         border: 5px solid #FF9326;
    }
     .borderrouge {
         border: 1px solid #B32D00!important;
    }
     .bordergris {
         border: 1px solid #AAAAAA!important;
    }
     .bordervert {
         border: 1px solid #59B300;
    }
     .borderorange {
         border: 1px solid #FF9326;
    }
     .borduretop{
         border-top:1px solid #DDDDDD;
    }
     .bordurebottom{
         border-bottom:1px solid #FF9326!important;
    }
     .bordureleft{
         border-left:5px solid #aaaaaa;
         padding-left:5px;
    }
     .bordureligne{
         border-left:10px solid transparent!important;
        /*border-bottom:1px solid #cccccc!important;
        */
    }
     .bordureligne:hover{
        /*margin-left:2px;
        */
         border-left:10px solid #FFC926!important;
        /*color:#FFC926;
        */
         -webkit-transition: all 1s ease-in-out;
         -moz-transition: all 1s ease-in-out;
         -o-transition: all 1s ease-in-out;
         transition: all 1s ease-in-out;
    }
     #listPatrimoine .list-group-item{
         background-color: rgb(255 255 255 / 79%);
    }
    /* FONDS ET BG *************************************/
     .carre {
         height:150px;
         line-height:150px;
         text-align:center;
    }
     .carre a {
         width:150px;
        /* largeur zone de texte */
         vertical-align:middle;
         line-height:normal;
        /* on rétablit le line-height */
         text-align:left;
        /* ... et l'alignement du texte */
    }
     .carre span {
         width:150px;
        /* largeur zone de texte */
         vertical-align:middle;
         line-height:normal;
        /* on rétablit le line-height */
         text-align:left;
        /* ... et l'alignement du texte */
    }
     .bg-fb {
         background-color:#3b5999;
    }
     .txt-fb {
         color:#3b5999;
    }
     .bg-hover {
         color: #eeeeee;
         padding:10px 0px 10px 0px;
         border: 1px solid #FFFFFF;
         -webkit-transition: 0.2s ease-in-out;
         -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
         transition: 0.2s ease-in-out;
         background-color: #000000a1;
    }
     .bg-hover:hover {
         color: #000000b3;
         border: 1px solid #eeeeee;
         background-color:#f9f9f9;
         -webkit-transition: 0.2s ease-in-out;
         -moz-transition: 0.2s ease-in-out;
         -o-transition: 0.2s ease-in-out;
         transition: 0.2s ease-in-out;
    }
     .bg-bleu-dark{
         padding:5px;
         background-color:#57889c;
         border: 1px solid #FFFFFF;
    }
     .bg-vert-dark{
         padding:5px;
         background-color:#569C76;
         border: 1px solid #FFFFFF;
    }
     .bg-ocre-dark{
         padding:5px;
         background-color:#936060;
         border: 1px solid #FFFFFF;
    }
     .bg-orange-dark{
         padding:5px;
         background-color:#d1b993;
         border: 1px solid #FFFFFF;
    }
     .bg-bleu {
         padding:5px;
         background-color:#275ba6;
         border: 1px solid #FFFFFF;
    }
     .bg-bleu:hover {
         border: 1px solid #FFC926;
    }
     .bg-vert {
         padding:5px;
         background-color:#B4DC92;
         border: 1px solid #008C23;
    }
     .bg-orange {
         padding:5px;
         background-color:#FFE495;
         border: 1px solid #FFFFFF;
    }
     .bg-warning {
         padding:5px;
         background-color:#ff9600;
    }
     .bg-rouge {
         padding:5px;
         background-color:#D90000!important;
         border: 1px solid #FFFFFF;
    }
     .bg-vert-clair{
         padding:5px;
         background-color:#ebf5e2;
         border: 1px solid #abd685;
    }
     .bg-mauve-clair{
         padding:5px;
         background-color:#efdfff!important;
         border: 1px solid #d9b3ff!important;
    }
     .bg-gris-clair{
         background-color:#fafafa;
    }
     .bg-orange-clair{
         background-color:#ffefbf;
         border: 1px solid #ffb973;
    }
     .bg-noir{
         background-color:#000000;
    }
     .bg-gris {
         background-color:#EEEEEE;
         border: 1px solid #999999;
         -moz-box-shadow:2px 2px 5px #ccc;
         box-shadow: 2px 2px 5px #ccc;
         -webkit-box-shadow: 2px 2px 5px #ccc;
    }
     .bg-gris:hover {
    }
     .bg-bleu-hover {
         border: 1px solid #FFFFFF;
    }
     .bg-bleu-hover:hover {
         border: 1px solid #FFC926;
         background-color:#EDF7F8;
    }
     .bg-vert-hover {
         padding:5px;
         border: 1px solid #FFFFFF;
    }
     .bg-vert-hover:hover {
         border: 1px solid #008C23;
         background-color:#DDF0CE;
    }
     .bg-orange-hover{
         padding:5px;
         border: 1px solid #FFFFFF;
    }
     .bg-orange-hover:hover {
         border: 1px solid #FFC926;
         background-color:#FFF4D2;
    }
     .bg-gris-hover{
         background-color:#f7f7f7;
         border: 1px solid #FFFFFF;
    }
     .bg-gris-hover:hover {
         border: 1px solid #FFC926;
         background-color:#dddddd;
    }
     .bg-prod-hover{
         border-left: 10px solid transparent;
         border-top: 1px solid #FFC926;
         border-right: 10px solid transparent;
         background-color:#ffffff;
         -webkit-border-radius: 15px;
         -moz-border-radius: 15px;
         border-radius: 15px;
    }
     .bg-prod-hover:hover {
         border-left: 10px solid #FFC926;
         border-right: 10px solid #FFC926;
         background-color:#FCFCFC;
    }
     .bg-blanc{
         background-color:rgba(255,255,255,1)!important;
    }
     .bg-vide{
         border:1px solid #cccccc;
         -webkit-border-radius: 15px;
         -moz-border-radius: 15px;
         border-radius: 15px;
         background-color:rgba(255,255,255,0.9)!important;
    }
     .aide {
         color:#008C00!important;
         padding:1px 10px 1px 10px;
         margin:0px ;
         border:1px solid #59B300;
         -webkit-border-radius: 2px;
         -moz-border-radius: 2px;
         border-radius: 2px;
         background-color:#BFFF00!important;
    }
     .imgcondens {
         width:200px!important;
         background-color:#FFFFFF!important;
         border:1px solid #AAAAAA;
         -webkit-border-radius: 4px;
         -moz-border-radius: 4px;
         border-radius: 4px;
         box-shadow: 2px 2px 10px #CCCCCC, -2px -2px 5px #CCCCCC;
         -moz-box-shadow: 2px 2px 10px #CCCCCC, -2px -2px 5px #CCCCCC;
         -webkit-box-shadow: 2px 2px 10px #CCCCCC, -2px -2px 5px #CCCCCC;
    }
     .photobox {
         color:#cccccc;
         font-size:11px;
    }
     .photobox a{
         color:#FF9326;
    }
     .ombre {
         border:1px solid #CCCCCC;
         box-shadow: 2px 2px 5px #CCCCCC;
         -moz-box-shadow: 2px 2px 5px #CCCCCC;
         -webkit-box-shadow: 2px 2px 5px #CCCCCC;
    }
     .nowrap {
         white-space: nowrap;
    }
     .footerpro {
         background-color:#f9f9f9;
         padding-top:5px;
         margin-top:50px;
         border:1px solid #AAAAAA;
         -webkit-border-radius: 4px;
         -moz-border-radius: 4px;
         border-radius: 4px;
         position:relative;
         bottom:-1px;
         box-shadow: -2px -2px 20px #CCCCCC;
         -moz-box-shadow: -2px -2px 20px #CCCCCC;
         -webkit-box-shadow: -2px -2px 20px #CCCCCC;
    }
     .footer {
         background-color:#444e59;
         box-shadow: -2px -2px 20px #CCCCCC;
         -moz-box-shadow: -2px -2px 20px #CCCCCC;
         -webkit-box-shadow: -2px -2px 20px #CCCCCC;
    }
     .theme {
         position:relative;
         top:-50px;
         z-index:1;
         display:bloc;
         padding:10px;
         margin:0px;
         max-height:70px;
         background-color:rgba(0,0,0,0.5)!important;
         border:1px solid #AAAAAA;
    }
     .headtitle {
         position:relative;
        bottom:-87px;
         z-index:1;
         padding:10px;
         margin:0px;
         max-height:70px;
         background-color:rgba(0,0,0,0.5)!important;
         border:0px solid #AAAAAA;
    }
     .decale_droite {
         display:bloc;
         left:50px;
         padding:20px;
         line-height:40px;
         list-style:none;
    }
     .blocdesphotos {
         display:bloc;
         padding:1px;
         margin:10px;
         max-width:70px;
         border:1px solid #AAAAAA;
         -webkit-border-radius: 4px;
         -moz-border-radius: 4px;
         border-radius: 4px;
         box-shadow: 2px 2px 50px #CCCCCC, -2px -2px 5px #CCCCCC;
         -moz-box-shadow: 2px 2px 50px #CCCCCC, -2px -2px 5px #CCCCCC;
         -webkit-box-shadow: 2px 2px 50px #CCCCCC, -2px -2px 5px #CCCCCC;
    }
     .photoprincipale {
         width:100%;
         max-width:200px!important;
         margin:0;
         border:1px solid #AAAAAA;
         -webkit-border-radius: 4px;
         -moz-border-radius: 4px;
         border-radius: 4px;
         box-shadow: 2px 2px 10px #CCCCCC, -2px -2px 10px #CCCCCC;
         -moz-box-shadow: 2px 2px 10px #CCCCCC, -2px -2px 10px #CCCCCC;
         -webkit-box-shadow: 2px 2px 10px #CCCCCC, -2px -2px 10px #CCCCCC;
    }
     .fond-transparent {
         background-color:rgba(255,255,255,0.7)!important;
    }
     .bgvert {
         background: #d2ff52;
        /* Old browsers */
         background: -moz-linear-gradient(top, #d2ff52 0%, #91e842 100%);
        /* FF3.6+ */
         background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d2ff52), color-stop(100%,#91e842));
        /* Chrome,Safari4+ */
         background: -webkit-linear-gradient(top, #d2ff52 0%,#91e842 100%);
        /* Chrome10+,Safari5.1+ */
         background: -o-linear-gradient(top, #d2ff52 0%,#91e842 100%);
        /* Opera 11.10+ */
         background: -ms-linear-gradient(top, #d2ff52 0%,#91e842 100%);
        /* IE10+ */
         background: linear-gradient(to bottom, #d2ff52 0%,#91e842 100%);
        /* W3C */
         filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d2ff52', endColorstr='#91e842',GradientType=0 );
        /* IE6-9 */
    }
     .ajoutannonce a{
         opacity:0.8;
         filter:alpha(opacity=80);
         -moz-opacity:0.8;
    }
     .ajoutannonce a:hover{
         opacity:1;
         filter:alpha(opacity=100);
         -moz-opacity:1;
    }
     .ajoutannonce img{
         width:100%;
         max-width:400px;
         margin:auto;
         padding:5px;
    }
     .width30 {
         width:30px!important;
    }
     .width50 {
         width:50px!important;
    }
     .width100 {
         width:100px!important;
    }
     .width200 {
         width:200px!important;
    }
     @media (max-width: 525px){
         .width30 {
             width:20px!important;
        }
         .width50 {
             width:30px!important;
        }
         .width100 {
             width:50px!important;
        }
         .width200 {
            /*width:100px!important;
            */
        }
    }
     .rougefonce {
         background-color:#8C0000;
         border: 1px solid #DDDDDD;
         margin:auto;
         padding:5px;
         color:#ffffff;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .annonce {
         font-family: "arial", sans-serif;
         font-size:11px;
         padding:5px;
         color:#999999;
    }
     .annonce15 {
         font-family: "arial", sans-serif;
         font-size:15px;
         padding:5px;
         color:#999999;
    }
     .prix {
         background-color:#E0FFC1;
         font-family: "arial", sans-serif;
         border: 1px solid #DDDDDD;
         margin:auto;
         padding:5px;
         color:#B30000;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .prix sup{
         color:#B30000;
         font-size:11px;
    }
    /* upload photo photo */
     #filedrag {
         display: none;
         font-weight: bold;
         text-align: center;
         padding: 1em 0;
         margin: 1em 0;
         color: #BBBBBB;
         border: 1px dashed #BBBBBB;
         border-radius: 7px;
         cursor: default;
    }
     #filedrag.hover {
         color: #f00;
         border-color: #f00;
         border-style: solid;
         box-shadow: inset 0 3px 4px #888;
    }
     #messages {
         max-width:100px;
         padding: 0 10px;
         margin: 1em 0;
         border: 1px solid #999;
    }
    /* FIN upload photo */
    /* BLOC D'ANNONCES */
     #pied {
         background: rgb(226,130,20);
        /* Old browsers */
         background: -moz-linear-gradient(top, rgba(226,130,20,1) 0%, rgba(248,179,52,1) 7%, rgba(249,227,172,1) 68%, rgba(252,205,77,1) 87%, rgba(248,179,52,1) 100%);
        /* FF3.6+ */
         background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(226,130,20,1)), color-stop(7%,rgba(248,179,52,1)), color-stop(68%,rgba(249,227,172,1)), color-stop(87%,rgba(252,205,77,1)), color-stop(100%,rgba(248,179,52,1)));
        /* Chrome,Safari4+ */
         background: -webkit-linear-gradient(top, rgba(226,130,20,1) 0%,rgba(248,179,52,1) 7%,rgba(249,227,172,1) 68%,rgba(252,205,77,1) 87%,rgba(248,179,52,1) 100%);
        /* Chrome10+,Safari5.1+ */
         background: -o-linear-gradient(top, rgba(226,130,20,1) 0%,rgba(248,179,52,1) 7%,rgba(249,227,172,1) 68%,rgba(252,205,77,1) 87%,rgba(248,179,52,1) 100%);
        /* Opera 11.10+ */
         background: -ms-linear-gradient(top, rgba(226,130,20,1) 0%,rgba(248,179,52,1) 7%,rgba(249,227,172,1) 68%,rgba(252,205,77,1) 87%,rgba(248,179,52,1) 100%);
        /* IE10+ */
         background: linear-gradient(to bottom, rgba(226,130,20,1) 0%,rgba(248,179,52,1) 7%,rgba(249,227,172,1) 68%,rgba(252,205,77,1) 87%,rgba(248,179,52,1) 100%);
        /* W3C */
         filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e28214', endColorstr='#f8b334',GradientType=0 );
        /* IE6-9 */
    }
     .divannonce {
         font-family: Play;
         -webkit-text-size-adjust: 100%;
         -ms-text-size-adjust: 100%;
         background-color:#FFFFFF;
         border: 1px solid #698C00;
         margin:auto;
         padding:5px;
         color:#999999;
         width:100%;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .divannonce :hover{
         background-color:#0000D9;
    }
     .imgannonce {
         width:150px;
    }
     @media (max-width: 900px){
         .imgannonce {
             width:100px;
        }
    }
     .titreannonce a{
         background-color:transparent;
         left:160px;
         font-family: Play;
         -webkit-text-size-adjust: 100%;
         -ms-text-size-adjust: 100%;
         color:#0040FF;
    }
     .chemin {
         font-family: "Arial", sans-serif;
         -webkit-text-size-adjust: 100%;
         -ms-text-size-adjust: 100%;
        /*font-size: .8em;
        */
         color: #999999;
         text-decoration: none;
    }
    /* FIN BLOC D'ANNONCES */
     .txt-blanc {
         color:#ffffff;
    }
     .rouge {
         background-color:#EEA317;
         border: 1px solid #DDDDDD;
         margin:auto;
         padding:5px;
         color:#ffffff;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .blanc {
         background-color:#FFFFFF;
         border: 1px solid #DDDDDD;
         margin:auto;
         padding:5px;
         color:#ffffff;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .bloc_blanc_rond {
         background-color:rgba(255,255,255,0.6);
         border: 2px solid #ffffff;
         margin:auto;
         padding:5px;
         width:100px;
         height:100px;
         -webkit-border-radius: 50%;
         -moz-border-radius: 50%;
         border-radius: 50%;
    }
     .bloc_blanc_rond p{
         padding:10px;
    }
     .blanclight {
         background-color:#FFFFFF;
         border: 1px solid #DDDDDD;
         margin:auto;
         padding:5px;
        /*max-width:200px;
        */
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .vertlight {
         background-color:#EAFFEB;
         border: 1px solid #DDDDDD;
         margin:auto;
         padding:5px;
        /*max-width:200px;
        */
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .rougeclair {
         background-color:#F1B749;
         padding:5px;
         width:100%;
         margin:5px;
         color:#ffffff;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     .sharecadre {
         padding: 5px;
         width:80px;
         text-align: center;
         background-color:#FFFFFF;
         border: 1px solid #DDDDDD;
    }
     .favtext {
         position:relative;
         left:1px;
         top:0px;
         font-family: Play, sans-serif;
         font-size: 10px;
         font-weight: 400;
         color: #888888;
    }
     .img-annonce-responsive {
         display: block;
         max-width: 80%;
         height: auto;
         padding:5px;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
    }
     [class*="col-"]{
        /* border: 1px solid #DDDDDD;
         background-color: #DDDDDD;
         border-radius: 6px;
         line-height: 40px;
         margin-bottom: 20px;
         text-align: center;
         */
    }
     .divider {
         font-family: Play;
         font-size: 14px;
         font-weight: 800;
         color: #000;
         background-color: #BFD09D;
    }
     .divider disabled{
         background-color: #00468C;
         color: #FCC545;
         line-height:4em;
    }
     .starter-template{
         padding: 10px;
         top:50px;
         margin-bottom:20px;
         text-align: center;
         background-color: #dff0d8;
         border: 4px solid #fff;
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         border-radius:10px;
    }
     #accordion .glyphicon {
         margin-right:10px;
    }
     .panel-collapse>.list-group .list-group-item:first-child {
        border-top-right-radius: 0;
        border-top-left-radius: 0;
    }
     .panel-collapse>.list-group .list-group-item {
        border-width: 1px 0;
    }
     .panel-collapse>.list-group {
        margin-bottom: 0;
    }
     .panel-collapse .list-group-item {
        border-radius:0;
    }
     .panel-collapse .list-group .list-group {
        margin: 0;
        margin-top: 10px;
    }
     .panel-collapse .list-group-item li.list-group-item {
        margin: 0 -15px;
        border-top: 1px solid #ddd;
        border-bottom: 0;
        padding-left: 30px;
    }
     .panel-collapse .list-group-item li.list-group-item:last-child {
        padding-bottom: 0;
    }
     .panel-collapse div.list-group div.list-group{
        margin: 0;
    }
     .panel-collapse div.list-group .list-group a.list-group-item {
        border-top: 1px solid #ddd;
        border-bottom: 0;
        padding-left: 30px;
    }
    /* Use a wide full screen for small screens like tablets. */
     @media (min-width: 768px) and (max-width:992px) {
         .container {
             width: initial;
             padding-left: 2em;
             padding-right: 2em;
        }
    }
     .suggestionsBox {
        /*margin: -40px 0px 0px 100px;
        */
         text-align:left;
         width: 100%;
        /*background-color: #ffefbf;
        */
         border: 2px solid #ff9326;
         color: #00698C;
         -webkit-border-radius: 3px;
         -moz-border-radius: 3px;
         border-radius: 3px;
         overflow:visible;
         box-shadow: 2px 2px 10px #CCCCCC;
         -moz-box-shadow: 2px 2px 10px #CCCCCC;
         -webkit-box-shadow: 2px 2px 10px #CCCCCC;
    }
     .suggestionList , .suggestproList {
         margin: 0px;
         padding: 0px;
         margin-top: -20px;
    }
     .suggestionList a , .suggestproList li {
        /* position:relative;
         top:0px;
         margin: 0px 0px 3px 0px;
         padding: 3px;
         */
         cursor: pointer;
         z-index:100007;
         overflow:visible;
    }
     .suggestionList a:hover, .suggestproList li:hover{
         color: #001040;
         background-color: #FFFFFF;
    }
    /* Validation formulaire */
     form.cmxform {
         font-family: inherit;
         width: 100%;
         color: #333;
    }
     form.cmxform label {
         color: #999;
         font-family: Arial;
         font-weight: 400;
         font-size: 14px;
         text-align:right;
    }
     form.cmxform label.error, label.error {
        /* remove the next line when you have trouble in IE6 with labels in list */
         color: red;
    }
     div.error {
         display: none;
    }
     input {
         border: 1px solid black;
    }
     input.checkbox {
         border: none 
    }
     input:focus {
         border: 1px dotted black;
    }
     input.error {
         border: 1px dotted red;
    }
     form.cmxform .gray * {
         color: gray;
    }
     form.cmxform td p {
         list-style: none;
         padding: 0px;
         margin: 0;
    }
     form.cmxform label {
        /* Width of labels */
        /*border:1px solid #000;
        */
         width: auto;
    }
     form.cmxform fieldset fieldset label {
         margin-left: 70%;
    }
    /* Width plus 3 (html space) */
     form.cmxform label.error {
         position:relative;
         top:1px;
         margin-left: auto;
         text-align:left;
         width: 100%;
    }
     form.cmxform input.submit {
         margin-left: 103px;
    }
     .facebook a, .twitter a, .google-plus a {
         display: block;
         width: 100%;
         color: rgb(75, 110, 168) !important;
    }
     .twitter a {
         color: rgb(79, 213, 248) !important;
    }
     .google-plus a {
         color: rgb(221, 75, 57) !important;
    }
     .facebook:hover a {
         color: rgb(255, 255, 255) !important;
         background-color: rgb(75, 110, 168) !important;
    }
     .twitter:hover a {
         color: rgb(255, 255, 255) !important;
         background-color: rgb(79, 213, 248) !important;
    }
     .google-plus:hover a {
         color: rgb(255, 255, 255) !important;
         background-color: rgb(221, 75, 57) !important;
    }
    /* CAROUSSEL */
     #custom_carousel .item {
         color:#9dd53a;
         padding:10px 0;
    }
     #custom_carousel .controls{
         overflow-x: auto;
         overflow-y: hidden;
         padding:0;
         margin:0;
         white-space: nowrap;
         text-align: center;
         position: relative;
         top:-70px;
    }
     #custom_carousel .controls li {
         display: table-cell;
         width: 1%;
         max-width:90px;
    }
     #custom_carousel .controls li.active {
         border-bottom:3px solid orange;
    }
     #custom_carousel .controls a small {
         overflow:hidden;
         display:block;
         font-size:9px;
         margin-top:5px;
         font-weight:400;
    }
     #picture {
         overflow-y: scroll;
         overflow-x: hidden;
         max-height: 700px;
    }
    /* ANNONCES */
    /**** LAYOUT ****/
     .list-inline>li {
         padding: 0 10px 0 0;
    }
     .container-pad {
         padding: 300px 15px;
    }
    /**** MODULE ****/
     .bgc-fff div{
         margin:0px;
    }
     .bgc-fff div:hover {
        /*background: #FDFFF0;
        */
    }
     .box-shad {
         border: 1px solid #8A8A7B;
         -moz-box-shadow:2px 2px 5px #777777;
         box-shadow: 2px 2px 5px #777777;
         -webkit-box-shadow: 2px 2px 5px #777777;
    }
     .brdr {
         border: 1px solid #CFFFBF;
    }
     .brdr:hover {
         border: 1px solid #006600;
    }
    /* Font changes */
     .fnt-lighter {
         color: #bbb;
    }
     .fnt-smaller {
         font-size: .9em;
    }
     .fnt-lighter {
         color: #bbb;
    }
    /* Padding - Margins */
     .pad-10 {
         padding: 0px!important;
         margin: 5px!important;
    }
     .mrg-0 {
         margin: 0px!important;
    }
     .btm-mrg-10 {
         margin-bottom: 10px!important;
    }
     .btm-mrg-20 {
         margin-bottom: 20px!important;
    }
    /* Color */
     .clr-535353 {
         color: #B32D00;
    }
    /**** MEDIA ANNONCES PETITS ECRANS ****/
     @media only screen and (max-width: 768px) {
         #property-listings .property-listing {
             padding: 0px!important;
             margin: 1px!important;
             background-color: #FFFFFF;
        }
         #property-listings .property-listing a {
             margin: 0px;
             -webkit-font-smoothing: antialiased;
             font-size:80%;
        }
         #property-listings .fnt-smaller {
             font-size:80%;
        }
         #property-listings .property-listing img {
             max-width: 80px;
        }
         #property-listings .property-listing .media-body {
             position:relative;
             left:0px;
             padding: 1px 0px 1px 1px;
            /* haut droite bas gauche */
             margin:1px!important;
            /*background-color: #FFB973;
            */
        }
    }
    /**** MEDIA ANNONCES GRANDS ECRANS ****/
     @media only screen and (min-width: 769px) {
         #property-listings .property-listing {
             background-color: #FFFFFF;
        }
         #property-listings .property-listing img {
             max-width: 130px;
        }
    }
    /* FIN ANNONCES */
    /* CAROUSSEL PATRIMOINE */
     .media-carousel {
         margin-bottom: 0;
         padding: 0 40px 30px 40px;
         margin-top: 30px;
    }
     .media-carousel .carousel-control.left {
         left: -12px;
         background-image: none;
         background: none repeat scroll 0 0 #00468c;
         border: 4px solid #FFFFFF;
         border-radius: 23px 23px 23px 23px;
         height: 40px;
         width : 40px;
         margin-top: 30px 
    }
     .media-carousel .carousel-control.right {
         right: -12px !important;
         background-image: none;
         background: none repeat scroll 0 0 #00468c;
         border: 4px solid #FFFFFF;
         border-radius: 23px 23px 23px 23px;
         height: 40px;
         width : 40px;
         margin-top: 30px 
    }
     #my_carousel img{
         position: relative;
         left: 50%;
         transform: translateX(-50%);
         border-radius: 6px;
    }
    /* TIMELINE */
    /* .timeline {
         list-style: none;
         position: relative;
         width: 100%;
         padding: 20px;
         margin: 0 auto;
         overflow: hidden;
    }
     .timeline:after {
         content: "";
         position: absolute;
         top: 0;
         left: 50%;
         margin-left: -2px;
         background-color: #aaaaaa;
         height: 100%;
         width: 4px;
         border-radius: 2px;
         display: block;
    }
     .timeline .timeline-row {
         padding-left: 50%;
         position: relative;
         z-index: 1;
    }
     .timeline .timeline-row .timeline-time {
         position: absolute;
         right: 50%;
         top: 31px;
         text-align: right;
         margin-right: 40px;
         font-size: 16px;
         line-height: 1.3;
         font-weight: 600;
    }
     .timeline .timeline-row .timeline-time small {
         display: block;
         color: #d96c00;
        /*text-transform: uppercase;
        */
         font-weight: 400;
    }
     .timeline .timeline-row .timeline-icon {
         position: absolute;
         top: 30px;
         left: 50%;
         margin-left: -20px;
         width: 40px;
         height: 40px;
         border-radius: 50%;
         background-color: #fcfcfc;
         text-align: center;
         border: 2px #aaaaaa solid;
         overflow: hidden;
         padding: 2px;
         color: white;
         z-index: 100;
    }
     .timeline .timeline-row .timeline-icon > div {
         border-radius: 50%;
         line-height: 34px;
         font-size: 16px;
    }
     .timeline .timeline-row .timeline-content {
         margin-left: 40px;
         position: relative;
         color: #333333;
    }
     .timeline .timeline-row .timeline-content:after {
         content: "";
         position: absolute;
         top: 48px;
         left: -41px;
         height: 4px;
         width: 40px;
         background-color: #aaaaaa;
         z-index: -1;
    }
     .timeline .timeline-row .timeline-content .panel-body {
         background-color: #e2ffd9;
         padding: 15px 15px 2px;
         position: relative;
         z-index: 10;
    }
     .timeline .timeline-row .timeline-content h2 {
         font-size: 22px;
         margin-bottom: 12px;
         margin-top: 0;
         line-height: 1.2;
    }
     .timeline .timeline-row .timeline-content p {
         margin-bottom: 15px;
    }
     .timeline .timeline-row .timeline-content img {
         margin-bottom: 15px;
    }
     .timeline .timeline-row:nth-child(odd) {
         padding-left: 0;
         padding-right: 50%;
    }
     .timeline .timeline-row:nth-child(odd) .timeline-time {
         right: auto;
         left: 50%;
         text-align: left;
         margin-right: 0;
         margin-left: 40px;
    }
     .timeline .timeline-row:nth-child(odd) .timeline-content {
         margin-right: 40px;
         margin-left: 0;
    }
     .timeline .timeline-row:nth-child(odd) .timeline-content:after {
         left: auto;
         right: -41px;
    }
     .timeline.animated .timeline-row .timeline-content {
         opacity: 0;
         left: 20px;
         -webkit-transition: all 0.8s;
         -moz-transition: all 0.8s;
         transition: all 0.8s;
    }
     .timeline.animated .timeline-row:nth-child(odd) .timeline-content {
         left: -20px;
    }
     .timeline.animated .timeline-row.active .timeline-content {
         opacity: 1;
         left: 0;
    }
     .timeline.animated .timeline-row.active:nth-child(odd) .timeline-content {
         left: 0;
    }
     @media (max-width: 1200px) {
         .timeline {
             padding: 15px 10px;
        }
         .timeline:after {
             left: 28px;
        }
         .timeline .timeline-row {
             padding-left: 0;
             margin-bottom: 16px;
        }
         .timeline .timeline-row .timeline-time {
             position: relative;
             right: auto;
             top: 0;
             text-align: left;
             margin: 0 0 6px 56px;
        }
         .timeline .timeline-row .timeline-time strong {
             display: inline-block;
             margin-right: 10px;
        }
         .timeline .timeline-row .timeline-icon {
             top: 52px;
             left: -2px;
             margin-left: 0;
        }
         .timeline .timeline-row .timeline-content {
             margin-left: 56px;
             box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
             position: relative;
        }
         .timeline .timeline-row .timeline-content:after {
             right: auto !important;
             left: -20px !important;
             top: 32px;
        }
         .timeline .timeline-row:nth-child(odd) {
             padding-right: 0;
        }
         .timeline .timeline-row:nth-child(odd) .timeline-time {
             position: relative;
             right: auto;
             left: auto;
             top: 0;
             text-align: left;
             margin: 0 0 6px 56px;
        }
         .timeline .timeline-row:nth-child(odd) .timeline-content {
             margin-right: 0;
             margin-left: 55px;
        }
         .timeline.animated .timeline-row:nth-child(odd) .timeline-content {
             left: 20px;
        }
         .timeline.animated .timeline-row.active:nth-child(odd) .timeline-content {
             left: 0;
        }
    }
     #bandeau_accueil {
         position: relative;
         bottom: 0;
         width: 100%;
        /* Set the fixed height of the footer here */
         height: 208px;
         background:#ffffff url(../img/concept-relais-historiques.jpg) center center no-repeat;
    }
     @media (max-width: 768px) {
        /* cible tes colonnes directes dans #picture > .space-bottom */
         #picture .space-bottom > .col-md-4.text-center {
             float: none;
            /* annule le float Bootstrap */
             display: inline-block;
            /* maintenant inline-block fonctionne */
             width: 32%;
            /* 2 colonnes */
             vertical-align: top;
            /* optionnel: aligne en haut */
        }
    }
    /* Timeline !!! */
     :root {
         --line-h: 6px;
         --dot: 14px;
         --accent: #1f6feb;
         --muted: #e5e7eb;
         --text: #0f172a;
         --bg: #ffffff;
    }
     .subtitle {
         color:#475569;
         margin:0 0 16px;
    }
    /* .timeline {
         position: relative;
         height: 210px;
         border-radius: 12px;
         padding: 24px 0 78px;
         background: #fff;
         overflow: hidden;
    }
    */
     .timeline {
         position: relative;
         color: black;
         height: 213px;
         padding: 24px 0 78px;
         background: none;
        /* on enlève le fond direct */
         overflow: visible;
        /* tooltips visibles */
         z-index: 1;
         width: calc(100% - 60px);
         left: 30px;
         right: 40px;
    }
     .timeline::before {
         content: "";
         position: absolute;
         inset: 0;
        /* top:0;
         right:0;
         bottom:0;
         left:0 */
         border-radius: 12px;
         background: #fff;
         z-index: -1;
        /* en arrière-plan */
         box-shadow: 0 2px 8px rgba(0,0,0,0.1);
    }
     .era-band {
         position: absolute;
         top: 0;
         height: 100%;
         opacity: .10;
        /* léger pour ne pas gêner */
         z-index: 0;
        /* sous l’axe et les events */
    }
     .era-band.first {
         border-top-left-radius: 12px;
         border-bottom-left-radius: 12px;
    }
     .era-band.last {
         border-top-right-radius: 12px;
         border-bottom-right-radius: 12px;
    }
     .era-label {
         position: absolute;
         bottom: 6px;
         left: 50%;
         transform: translateX(-50%);
         font-size: 11px;
         font-weight: 600;
         color: #334155;
         opacity: .85;
         white-space: nowrap;
         pointer-events: none;
    }
    /* Axe + ticks */
     .axis {
         position: absolute;
         left:0;
         right:0;
         top: 50px;
         height: var(--line-h);
         background: linear-gradient(90deg, var(--muted), #cbd5e1);
         border-radius: 999px;
         z-index: 1;
    }
     .tick {
         position: absolute;
         top: 52px;
         width: 1px;
         height: 30px;
         background: #cbd5e1;
         z-index: 1;
    }
     .tick .tick-label {
         position: absolute;
         top: 30px;
         left: 50%;
         transform: translateX(-50%);
         font-size: 12px;
         color:#64748b;
         white-space: nowrap;
         writing-mode: horizontal-tb;
    }
     .ellipsis {
         position: absolute;
         top: 52px;
         width: 1px;
         height: 30px;
         background: transparent;
         z-index: 1;
    }
     .ellipsis .tick-label {
         position: absolute;
         top: 30px;
         left: 50%;
         transform: translateX(-50%);
         font-size: 16px;
         color:#94a3b8;
    }
    /* Events (au-dessus) */
     .event {
         position: absolute;
         top: 0;
         transform: translateX(-50%);
         text-align: center;
         transition: z-index 0.1s ease;
         z-index: 2;
    }
     .event:hover {
         z-index: 1000;
    }
     .dot {
         position: absolute;
         top: 46px;
         transform: translate3d(-50%, 0%, 0px);
         width: var(--dot);
         height: var(--dot);
         background: var(--accent);
         border-radius: 50%;
         box-shadow: 0 2px 8px rgba(31, 111, 235, 0.35);
         transition: transform .12s ease-out;
         cursor: pointer;
    }
    /*.event:hover .dot {
         transform: scale(1.1);
    }
    */
     .title, .period {
         transition: background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
    }
     .title {
         position: absolute;
         top: 71px;
         max-height: 140px;
         height: max-content;
         transform: translateX(-50%);
         font-size: 13px;
         font-weight: 600;
         padding: 4px;
         border-radius: 6px;
         background: #f8fafc;
         border: 1px solid #e2e8f0;
         z-index: 3;
         writing-mode: sideways-lr;
    }
     .period {
         position: absolute;
         top: 10px;
         transform: translateX(-50%);
         font-size: 12px;
         color: #334155;
         padding: 2px 6px;
         border-radius: 6px;
         background: #f1f5f9;
         border: 1px solid #e2e8f0;
         width: max-content;
         z-index: 3;
    }
     .event:hover .title, .event:hover .period, .event:hover .tooltip_timeline {
         background:#0f172a;
         color:#fff;
        /*border-color:#0f172a;
        */
         border: solid 1px white;
         box-shadow:0 4px 16px rgba(0,0,0,.18);
         cursor:pointer;
    }
     .event:hover .title {
         display: none;
         cursor:pointer;
    }
    /* Tooltip dessous */
     .tooltip_timeline {
         position: absolute;
         top: 69px;
         left: 50%;
         transform: translateX(-50%);
         background: #0f172a;
         color: #fff;
         font-size: 13px;
         padding: 10px 12px;
         border-radius: 10px;
         box-shadow: 0 10px 24px rgba(0, 0, 0, .22);
         line-height: 1.35;
         display: none;
         z-index: 9999;
         width: max-content;
         max-width: 150px;
    }
     .tooltip_timeline::after {
         content:"";
         position:absolute;
         left:50%;
         top:-6px;
         transform:translateX(-50%);
         border:6px solid transparent;
         border-bottom-color:#0f172a;
    }
     .event:hover .tooltip_timeline {
         display: block;
    }
     .gap{
         display: none;
    }
     .era-band {
         z-index: 0;
    }
    /* fond le plus bas */
     .axis {
         z-index: 1;
    }
     .ellipsis {
         z-index: 2;
    }
    /* … sous les ticks */
     .tick {
         z-index: 3;
    }
    /* ticks par-dessus */
     .event {
         z-index: 4;
    }
    /* événements au-dessus */
     html, body {
         scroll-snap-type: y proximity;
        /* ou y mandatory si tu veux un aimant très fort */
    }
    /* Empêcher Bootstrap d’étirer les images/tuiles Leaflet */
     .leaflet-container .leaflet-pane > img, .leaflet-container .leaflet-marker-icon, .leaflet-container .leaflet-marker-shadow, .leaflet-container .leaflet-tile {
         max-width: 100% !important;
         width: auto !important;
        /* certains thèmes mettent width:100% */
    }
     .leaflet-container img {
         max-width: 100% !important;
        /*width: 100% !important;
        /* certains thèmes mettent width:100% *
        /*/
    }
    /* Donner une vraie hauteur à la carte à l’intérieur de .ratio */
     #map-wrapper {
         height: calc(100vh - 105px);
         scroll-snap-align: start;
         scroll-margin-top: 94px;
    }
     #map-wrapper > #map {
         height: 100%;
         width: 100%;
    }
    /* Conteneur de la barre de recherche */
     #leaflet-search-container {
         position: absolute;
         width: 340px;
         max-width: calc(100% - 110px);
         bottom: 10px;
         left: 50%;
         transform: translateX(-50%);
         z-index: 1000;
         transition: width 0.3s ease;
         color: black;
    }
    /* Champ de recherche type Google */
     #leaflet-address-search {
         width: 100%;
        /*max-width: 90vw;
        */
         padding: 8px 12px;
         border-radius: 4px;
         border: 1px solid #ccc;
         font-size: 14px;
         box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    }
    /* Ici : on change bien 'width', pas 'min-width' */
     #leaflet-search-container:hover, #leaflet-search-container:focus-within {
         width: 520px;
    }
    /* Liste des résultats */
     #leaflet-search-results {
         margin: 4px 0 0 0;
         padding: 0;
         list-style: none;
         background: #fff;
         border-radius: 4px;
         box-shadow: 0 2px 6px rgba(0,0,0,0.2);
         max-height: 240px;
         overflow-y: auto;
    }
    /* Élément de résultat */
     #leaflet-search-results li {
         padding: 6px 10px;
         font-size: 13px;
         cursor: pointer;
         border-bottom: 1px solid #eee;
    }
     #leaflet-search-results li:last-child {
         border-bottom: none;
    }
     #leaflet-search-results li:hover {
         background: #f0f0f0;
    }
    /* Si un parent applique transform / filter, force un rendu propre */
     .leaflet-pane, .leaflet-tile, .leaflet-marker-icon {
         will-change: transform;
    }
    /* Panneau flottant par-dessus la carte */
     .overlay {
         position: absolute;
         top: 1rem;
         left: 1rem;
         z-index: 1000;
        /* au-dessus de la carte */
        /*background: rgba(255, 255, 255, 0.95);
        */
         backdrop-filter: saturate(140%) blur(2px);
         box-shadow: 0 10px 30px rgba(0,0,0,0.15);
         border-radius: 12px;
         width: min(380px, 92vw);
         max-height: calc(100% - 2rem);
         display: flex;
         flex-direction: column;
        /*overflow: hidden;
        */
         overflow-y: auto;
         overflow-x: hidden;
         border: 1px solid rgba(0,0,0,0.08);
    }
     .overlay header {
         display: flex;
         align-items: center;
         justify-content: space-between;
         gap: .5rem;
         padding: .75rem .9rem;
         border-bottom: 1px solid rgba(0,0,0,0.06);
    }
     .overlay h2 {
         margin: 0;
         font-size: 1rem;
         line-height: 1.1;
    }
     .overlay button {
         appearance: none;
         border: 0;
         border-radius: 8px;
         padding: .45rem .6rem;
         font-size: .9rem;
         cursor: pointer;
         background: #f3f4f6;
    }
     .overlay button:hover {
         background: #e7e9ee;
    }
     .search {
         padding: .5rem .9rem .25rem;
         border-bottom: 1px solid rgba(0,0,0,0.06);
    }
     .search input {
         width: 100%;
         padding: .55rem .7rem;
         border: 1px solid #d1d5db;
         border-radius: 8px;
         font-size: .95rem;
    }
     .list {
         overflow: auto;
         padding: .5rem;
    }
     .item {
         display: grid;
         grid-template-columns: auto 1fr;
         gap: .4rem .65rem;
         align-items: start;
         transition: background .15s ease;
    }
    /*.item:hover {
         background: #f7f7f9;
    }
    */
     .item small {
         color: #6b7280;
         grid-column: 2;
    }
     .item a {
         color: #2563eb;
         text-decoration: none;
    }
     .item a:hover {
         text-decoration: underline;
    }
    /* Bouton pour replier le panneau sur mobile */
     .overlay[data-collapsed="true"] .search, .overlay[data-collapsed="true"] .list {
         display: none;
    }
     .overlay[data-collapsed="true"] {
         width: auto;
    }
    /* Optionnel : déplacer le panneau en bas à droite sous 640px */
     @media (max-width: 640px) {
         .overlay {
             left: auto;
             right: .8rem;
             bottom: .8rem;
             top: auto;
        }
    }
    /* Styles de base pour la liste */
     #listPatrimoine {
         max-height: calc(100vh - 200px);
         overflow-x: hidden;
         overflow-y: auto;
    }
     #listPatrimoineDiv {
         position: absolute;
         padding: 0px;
         top: 15px;
         right: 15px;
         z-index: 5;
    }
     .list-group-item {
         border: 1px solid #ddd;
         border-radius: 4px;
         overflow: hidden;
    }
     .list-group-item a {
         text-decoration: none;
         color: inherit;
         display: block;
    }
     .list-group-item h5 {
         margin-top: 0;
         margin-bottom: 5px;
    }
     .list-group-item img {
         max-width: 100%;
         height: auto;
         border-radius: 4px;
    }
     .listPatrimoine_result .row {
         cursor: pointer;
    }
    /* Empêche le lien de bloquer les clics sur mobile */
     @media (max-width: 768px) {
         #listPatrimoine{
             max-height: calc(30vh);
        }
         .listPatrimoine_result > a {
             pointer-events: none;
        }
         .listPatrimoine_result .row {
             pointer-events: auto;
        }
    }
    /* Conteneur général du marker */
     .custom-marker {
         position: relative;
         width: 50px;
         height: 60px;
         cursor: pointer;
    }
    /* La vignette photo */
     .marker-image {
         width: 50px;
         height: 50px;
         background-size: cover;
         background-position: center;
         border-radius: 8px;
         border: 2px solid white;
         box-shadow: 0 2px 5px rgba(0,0,0,0.4);
         transition: transform 0.2s;
    }
     .marker-image-selected {
         border: 2px solid #ff0000;
    }
    /* La “pointe” triangulaire */
     .marker-pin {
         position: absolute;
         left: 50%;
         bottom: 0;
         transform: translateX(-50%);
         width: 0;
         height: 0;
         border-left: 8px solid transparent;
         border-right: 8px solid transparent;
         border-top: 12px solid #2c3e50;
    }
    /* L'étiquette de survol */
     .marker-label {
         position: absolute;
         bottom: 65px;
        /* au-dessus de la photo */
         left: 50%;
         transform: translateX(-50%);
         background: rgba(44, 62, 80, 0.9);
         color: #fff;
         padding: 4px 8px;
         border-radius: 6px;
         font-size: 12px;
         line-height: 1.2;
         white-space: nowrap;
         opacity: 0;
         pointer-events: none;
         transition: opacity 0.2s ease, transform 0.2s ease;
         z-index: 650;
    }
     .leaflet-control {
         z-index: 1000 !important;
    }
    /* Petite flèche sous le texte */
     .marker-label::after {
         content: "";
         position: absolute;
         left: 50%;
         bottom: -5px;
         transform: translateX(-50%);
         border-left: 5px solid transparent;
         border-right: 5px solid transparent;
         border-top: 5px solid rgba(44, 62, 80, 0.9);
    }
    /* Apparition au survol */
     .custom-marker:hover .marker-image {
         transform: scale(1.3);
    }
     .custom-marker:hover .marker-label {
         opacity: 1;
         transform: translate(-50%, -2px);
    }
    /* conteneur */
     .marker-carousel {
         position: relative;
         margin-top: 0px;
         text-align: center;
         overflow: hidden;
    }
    /* boutons */
     .marker-carousel button.marker-carousel-prev, .marker-carousel button.marker-carousel-next {
         position: absolute;
         top: 50%;
         transform: translateY(-50%);
         background: rgb(0 0 0 / 54%);
         color: #fff;
         border-width: 2px;
         border-color: white;
         border-radius: 50%;
         width: 35px;
         height: 35px;
         cursor: pointer;
         font-size: large;
         transition: all 0.25s ease;
    }
    /* Effet hover : fond plus clair + légère mise en avant */
     .marker-carousel button.marker-carousel-prev:hover, .marker-carousel button.marker-carousel-next:hover {
         background: rgb(255 255 255 / 80%);
         color: #000;
         transform: translateY(-50%) scale(1.1);
         box-shadow: 0 0 6px rgba(0,0,0,0.4);
    }
     .marker-carousel .marker-carousel-prev {
         left: 0;
    }
     .marker-carousel .marker-carousel-next {
         right: 0;
    }
    /* fade mode */
     .marker-carousel[data-mode="fade"] .marker-carousel-track {
         position: relative;
         width: 100%;
         height: auto;
    }
     .marker-carousel[data-mode="fade"] .marker-carousel-img {
         position: absolute;
         inset: 0;
         margin: 0 auto;
         max-width: 100%;
         border-radius: 6px;
         opacity: 0;
         transition: opacity .28s ease;
    }
     .marker-carousel[data-mode="fade"] .marker-carousel-img.is-active {
         position: relative;
         opacity: 1;
    }
    /* slide mode */
     .marker-carousel[data-mode="slide"] .marker-carousel-viewport {
         overflow: hidden;
    }
     .marker-carousel[data-mode="slide"] .marker-carousel-track {
         display: flex;
         transition: transform .32s ease;
         will-change: transform;
    }
     .marker-carousel[data-mode="slide"] .marker-carousel-img {
         flex: 0 0 100%;
         max-width: 100%;
         border-radius: 6px;
         display: block;
    }
     .marker-carousel .marker-carousel-viewport {
         width: 400px;
    }
     .marker-carousel .marker-carousel-viewport {
         overflow: hidden;
         width: 100%;
         margin: 0 auto;
         overflow: hidden;
    }
     .marker-carousel .marker-carousel-img {
         width: 100%;
         object-fit: contain;
        /* ou 'cover' si tu préfères remplir en coupant un peu */
         display: block;
         margin: 0 auto;
    }
     #MainCarousel{
         overflow: hidden;
    }
    /* Conteneur du zoom dans la modale principale */
     #MainCarousel .marker-carousel-viewport {
         position: relative;
         overflow: hidden;
        /* coupe ce qui dépasse quand on zoome */
         cursor: zoom-in;
    }
    /* Image dans la modale : laisse-la gérer sa propre largeur/hauteur */
     #MainCarousel .marker-carousel-img {
         max-width: 100%;
         max-height: calc(100vh - 20px);
        /* hauteur max (en tenant compte header/footer) */
         width: auto;
         height: auto;
         object-fit: contain;
         display: block;
         margin: 0 auto;
    }
    /* Mode zoom actif */
     #MainCarousel .marker-carousel-viewport.is-zoomed {
         cursor: zoom-out;
    }
     #MainCarousel .marker-carousel-viewport.is-zoomed .marker-carousel-img {
        /* on laisse JS gérer transform + transform-origin */
    }
    /* La modale photos s'adapte à son contenu et anime sa largeur */
     #MainCarousel .modal-dialog {
         width: auto;
         max-width: 95vw;
         margin: 30px 0 0 50%;
         transform: translateX(-50%);
         transition: width 0.45s cubic-bezier(0.25, 0.1, 0.25, 1), max-width 0.45s cubic-bezier(0.25, 0.1, 0.25, 1);
    }
    /* Le carousel dans la modale ne doit pas être figé à 900px */
     #MainCarousel .marker-carousel {
         max-width: none;
    }
    /* Les images à l’intérieur du carousel de la modale */
     #MainCarousel .marker-carousel-img {
         height: calc(100vh - 35px);
         width: 100%;
    }
     #MainCarousel .modal-header{
         position: absolute;
         z-index: 10;
         width: 100%;
         color: white;
         border: none;
         padding-top: 10px;
         padding-bottom: 0px;
    }
     #MainCarousel .close{
         color: white;
         opacity: 1;
         font-size: xxx-large;
         line-height: 0.5;
    }
     #MainCarousel .modal-body{
         padding: 3px 3px 3px 3px;
    }
    /*#MainCarousel .modal-footer{
         position: absolute;
         bottom: 0px;
         width: 100%;
         z-index: 10;
         border: none;
    }
     */
     .marker-link{
         position: absolute;
         right: 10px;
         bottom: 10px;
         background-color: #ffffffcc;
         border-radius: 6px;
         padding: 7px;
         border-width: 2px;
         border-color: #7c7c85;
         border-style: solid;
         transition: all 0.25s ease;
    }
     .marker-link:hover{
         background-color: #c7c1c1cc;
    }
    /* --- Points indicateurs (pagination) --- */
     .marker-carousel .marker-dots {
         display: flex;
         justify-content: center;
         gap: 5px;
         position: absolute;
         bottom: 5px;
         left: 50%;
         transform: translateX(-50%);
    }
     .marker-carousel .marker-dot {
         width: 8px;
         height: 8px;
         border-radius: 50%;
         background-color: rgba(255, 255, 255, 0.5);
         border: 1px solid rgba(255, 255, 255, 0.7);
         cursor: pointer;
         transition: all 0.25s ease;
         z-index: 10;
    }
     .marker-carousel .marker-dot.active {
         background-color: #fff;
         transform: scale(1.3);
         border-color: #000;
    }
     .marker-link-hebergement{
        /* background-color: blue;
         color: white;
         */
    }
     .marker-link-website{
         background-color: black !important;
         color: white !important;
         transition: background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
    }
     .marker-link-website:hover{
         background-color: #7c7c7c !important;
         color: white !important;
    }
     .marker-link-booking{
         background-color: blue !important;
         color: white !important;
         transition: background-color .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
    }
     .marker-link-booking:hover{
         background-color: #c1d0fb !important;
         color: black;
         !important;
    }
     .CategTitre{
         position: absolute;
         width: 100%;
         display: contents;
         font-weight: bold;
         font-size: medium;
         cursor: pointer;
    }
     .rowMap{
         position: relative;
         padding-top: 1px;
         padding-bottom: 1px;
         padding-left: 6px;
         padding-right: 6px;
         border-radius: 8px;
         transition: background .15s ease;
    }
     .rowMap:hover{
         background-color: black;
         color: white;
         cursor: pointer;
    }
     .rowMap label{
         margin: 0px;
    }
    /* Tooltip dessous */
     .tooltip_map {
         position: absolute;
         top: 50%;
         left: calc(100% + 13px);
         transform: translateY(-50%);
         background: #0f172a;
         color: #fff;
         font-size: 13px;
         padding: 10px 12px;
         border-radius: 10px;
         box-shadow: 0 10px 24px rgba(0, 0, 0, .22);
         line-height: 1.35;
         display: none;
         z-index: 9999;
         width: max-content;
         max-width: 250px;
    }
     .tooltip_map::after {
        /* content:"";
         position:absolute;
         left:50%;
         top:-6px;
         transform:translateX(-50%);
         border:6px solid transparent;
         border-bottom-color:#0f172a;
         */
         content: "";
         position: absolute;
         top: 50%;
         left: -20px;
         transform: translateY(-50%);
         border: 10px solid transparent;
         border-right-color: #0f172a;
    }
     .rowMap:hover .tooltip_map {
         display: block;
         cursor: pointer;
    }
     .marker-spinner {
         position: absolute;
         top: 50%;
         left: 50%;
         width: 36px;
         height: 36px;
         margin-top: -18px;
         margin-left: -18px;
         border-radius: 50%;
         border: 3px solid rgba(255,255,255,0.6);
         border-top-color: #ff8800;
         animation: marker-spin 0.6s linear infinite;
         z-index: 20;
    }
     @keyframes marker-spin {
         to {
             transform: rotate(360deg);
        }
    }
    /* Styles pour l'accordéon mobile */
     @media (max-width: 768px) {
         .CategTitre{
             font-size: small;
        }
         #listPatrimoineDiv {
             display: none;
             top: 5px;
             right: 5px;
        }
         .listPatrimoine_result {
             position: relative;
        }
         .listPatrimoine_result .row {
             display: none;
             padding: 2px;
        }
         .listPatrimoine_result.active .row {
             display: block;
        }
        /* En-tête de l'accordéon */
         .accordion-header {
             display: flex;
             justify-content: space-between;
             align-items: center;
             padding: 3px;
             background-color: #f8f9fa;
             cursor: pointer;
        }
         .accordion-header h5 {
             margin: 0;
             font-size: 16px;
        }
         .accordion-icon {
             transition: transform 0.3s ease;
             font-size: 18px;
        }
         .listPatrimoine_result.active .accordion-icon {
             transform: rotate(180deg);
        }
         .listPatrimoine_result.active img {
             margin-top: 2px;
        }
    }
    /* Styles pour desktop */
     @media (min-width: 769px) {
         .accordion-header {
             display: none;
        }
    }
     :root {
         --blue: #1B3A57;
         --beige: #F3ECE2;
         --red: #C6483C;
         --text-dark: #0D1B2A;
         --text-light: #6B7280;
    }
     * {
         box-sizing: border-box;
    }
    /* Largeur / hauteur de la scrollbar */
     ::-webkit-scrollbar {
         width: 12px;
         height: 10px;
    }
    /* Couleur du fond de la scrollbar */
     ::-webkit-scrollbar-track {
         background: #f0f0f0;
         border-radius: 10px;
    }
    /* Couleur du curseur (le \"thumb\") */
     ::-webkit-scrollbar-thumb {
         background-color: #1B3A57;
         border-radius: 10px;
        /*border: 2px solid #f0f0f0;
        */
    }
    /* Au survol */
     ::-webkit-scrollbar-thumb:hover {
         background-color: #C6483C;
    }
    /* body {
         font-family: 'Poppins', sans-serif;
         color: #f6e7d9;
         margin: 0;
         padding: 0;
         min-height: 100vh;
         background-color: #000;
         position: relative;
         overflow-x: hidden;
         padding-top: 160px;
    }
     body::before {
         content: "";
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
         background: linear-gradient(to bottom, rgb(0 0 0 / 25%), #000000), url('../img/background.jpg') top / contain no-repeat;
         background-size: contain;
         z-index: -1;
    }
     */
     header {
         position: fixed;
         top: 0;
         width: 100%;
         height:150px;
         z-index: 1001;
         transition: all 0.4s ease;
         padding: 0.5rem;
         display: flex;
         justify-content: space-between;
         align-items: center;
         flex-wrap: wrap;
         color:#f9f4ef;
    }
     header img {
         height: 100%;
         border-radius: 40px;
         transition: all 0.4s ease;
    }
     header::before {
         content: '';
         position: absolute;
         top: 0;
         left: 0;
         right: 0;
         bottom: 0;
         background: linear-gradient(to bottom, rgb(72 96 117), rgb(0 0 0 / 28%));
         opacity: 0;
         transition: all 0.4s ease;
         pointer-events: none;
         z-index: -1;
    }
     header.scrolled::before {
         opacity: 1;
    }
     header.scrolled {
         backdrop-filter: blur(10px);
         box-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
         height:92px;
    }
     .header_content{
         position: relative;
         width: calc( 100% - 150px );
         height: 100%;
        float: right;
         transition: all 0.4s ease;
    }
     header.scrolled .header_content{
         width: calc( 100% - 91px );
    }
     header.scrolled .btn-transparent-menu{
         margin: 2px;
    }
     header.scrolled img{
         border-radius: 27px;
    }
     header.scrolled nav{
         top:5px;
    }
     header.scrolled nav #searchDiv{
         top:44px;
    }
     header h3{
         margin-top: 12px;
         transition: all 0.4s ease;
    }
     header.scrolled h3{
         margin-top:8px;
         font-size: 18px;
         @media (max-width: 1150px) {
             font-size: 1.5rem;
        }
    }
     #themes{
         position: relative;
         padding: 10px;
         width: 100%;
         transition: all 0.4s ease;
    }
     header.scrolled .btn-transparent-menu{
         font-size:x-small;
    }
     nav {
         flex-wrap: wrap;
         align-items: center;
         padding: 0.2rem;
         position: absolute;
         right: 0;
         top: 10px;
         transition: top 0.4s ease;
    }
     nav a {
         margin-left: 10px;
         text-decoration: none;
         color: var(--blue);
        /*font-weight: 600;
        */
         transition: all 0.3s ease;
         color: white;
         border-radius: 5px;
         padding: 8px;
    }
     nav a i {
        /*margin-right: 0.4em;
        */
    }
     nav a:hover {
         color: var(--red);
         background-color: #ffffffc9;
    }
     @media (max-width: 1500px) {
         header {
             flex-direction: column;
            /*height: auto;
            */
             padding: 1rem;
             align-items: flex-start;
        }
         nav {
             display: flow;
             flex-direction: column;
             padding: 0;
             position: absolute;
             right: 0;
             top: 0;
        }
         nav a {
             margin: 0.25rem 0;
             width: 100%;
             text-align: left;
        }
         header img {
             margin-bottom: 0.5rem;
        }
         header h3 {
             font-size: 1.8rem;
             margin: 0.3rem;
             position: absolute;
             bottom: 0px;
             top: 0;
             width: calc(100% - 450px);
        }
    }
     @media (max-width: 1150px) {
         header h3 {
             width: calc(100% - 34px);
        }
    }
     .burger-menu {
         width: 100%;
         position: absolute;
         right: 0;
         top: 0;
    }
     .burger-icon {
         display: none;
         flex-direction: column;
         justify-content: space-around;
         width: 30px;
         height: 22px;
         cursor: pointer;
         z-index: 1002;
         right: 0;
         position: absolute;
         top: 5px;
    }
     .burger-icon span {
         display: block;
         height: 3px;
         background: white;
         border-radius: 2px;
         transition: all 0.3s ease;
    }
     #searchDiv{
         position: absolute;
         z-index: 1;
         right: 0px;
         top: 70px;
         margin-right: 20px;
         transition: all 0.4s ease;
    }
     #searchDiv input[type="text"] {
         padding: 0.5rem 0.5rem;
         border-radius: 20px;
         border: 1px solid #ccc;
         width: 275px;
         max-width: calc(100vw - 185px);
         transition: width 0.4s ease;
         background-color: black;
         color: white;
         float: right;
    }
     #searchDiv input[type="text"]:hover, #searchDiv input[type="text"]:focus, #searchDiv input[type="text"]:not(:placeholder-shown) {
         width: calc(100vw - 185px);
         font-size: medium;
    }
     #searchDiv button {
         background-color: #C6483C;
         color: white;
         padding: 0.5rem 1rem 0.5rem 0.5rem;
         border-radius: 0px 20px 20px 0px;
         border: 1px solid #C6483C;
        /*font-size: 0.85rem;
        */
         cursor: pointer;
         transition: background-color 0.3s ease;
    }
     #searchDiv button:hover {
         background-color: #a3392e;
    }
     #searchContainer{
         display: none;
         position: absolute;
         width: calc(100% - 32px);
         top: 159px;
         left: 16px;
         height: calc(100vh - 172px);
         overflow-y: scroll;
         transition: all 0.4s ease;
    }
     #searchContainer.scrolled{
         top: 96px;
         height: calc(100vh - 107px);
    }
     #searchDiv.scrolled{
         top: 45px;
    }
     .result_search{
         color: black;
         background-color: white;
         position: relative;
         display: flex;
         width: 100%;
        /* display: block;
         */
         padding: 5px 10px;
         background-color: rgba(255, 255, 255, 0.88);
    }
     nav#mainNav {
         font-size: 1.5rem;
    }
     @media (max-width: 1150px) {
         .burger-icon {
             display: flex;
        }
         nav#mainNav {
             opacity: 0;
             max-height: 0;
             overflow: hidden;
             flex-direction: column;
             background-color: rgba(27, 58, 87, 0.95);
             padding: 0 1rem;
             z-index: 1001;
             position: absolute;
             top: 50px;
             right: 0;
             border-radius: 10px;
             width: 320px;
             transition: opacity 0.4s ease, max-height 0.4s ease, padding 0.3s ease;
        }
         nav#mainNav a {
             padding: 0.5rem;
             color: white;
             display: block;
        }
         nav#mainNav.active {
             opacity: 1;
             max-height: 500px;
            /* suffisant pour contenir tous les liens */
             padding: 1rem;
        }
    }
     .button {
         margin-left: 4px;
         text-decoration: none;
         color: var(--blue);
        /*font-weight: 600;
        */
         transition: all 0.3s ease;
         color: white;
         border-radius: 5px;
         padding: 8px;
    }
     .button:hover {
         color: var(--red);
         background-color: #ffffffc9;
    }
     .border_button {
         border-style: solid;
         border-width: 1px;
         border-radius: 10px;
         padding: 6px;
    }
     .floating-search-bar {
         position: absolute;
         bottom: 10px;
         left: 50%;
         width: max-content;
         transform: translateX(-50%);
         z-index: 1000;
         background: rgb(13 25 119 / 57%);
        ;
         padding: 0.5rem;
        /* padding-left: 0.8rem;
         padding-right: 0.8rem;
         */
         border-radius: 30px;
         box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
         display: flex;
         gap: 0.5rem;
         flex-wrap: wrap;
         justify-content: center;
         max-width: 100%;
    }
     .floating-search-bar input[type="text"] {
         padding: 0.75rem 1rem;
         border-radius: 20px;
         border: 1px solid #ccc;
         min-width: 200px;
         font-size: 1rem;
    }
     .floating-search-bar button {
         background-color: #C6483C;
         color: white;
         border: none;
         padding: 0.75rem 1.5rem;
         border-radius: 20px;
         font-weight: bold;
         cursor: pointer;
         transition: background-color 0.3s ease;
    }
     .floating-search-bar button:hover {
         background-color: #a3392e;
    }
     #map {
         position: relative;
         min-height: 200px;
         width: 100%;
         border-radius: 12px;
         box-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
    }
     #map-around {
         min-height: 200px;
         flex: 4 1 0%;
         min-width: 300px;
         margin: 0 1rem;
         position: relative;
         width: 100%;
         border-radius: 12px;
         box-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
    }
     #map-around-infos .cards{
         gsap:0.5rem;
    }
     #map-around-infos .card-list{
         padding: 0.5rem;
    }
     #map-around-infos .card-list a{
         height: fit-content;
         font-style: normal;
         text-decoration: none;
    }
     #map-around-infos .card-list .card{
         background-color: #f6f6f666;
         background: #ffffffb8;
         padding: 0.5rem;
         color: black;
         height: 300px;
    }
     #map-around-infos .card:hover{
         transform: scale(1.05);
    }
     .leaflet-control-zoom-fullscreen.fullscreen-icon {
        /*background-image: url('museedupatrimoine/icons/fullscreen.svg');
        */
         background-size: 16px 16px;
         background-repeat: no-repeat;
         background-position: center;
         background-color: #1B3A57;
        /* Couleur de fond */
         border: none;
         width: 34px;
         height: 34px;
         opacity: 0.9;
         transition: background-color 0.3s ease, transform 0.2s ease;
    }
     .leaflet-control-zoom-fullscreen.fullscreen-icon:hover {
         background-color: #C6483C;
         transform: scale(1.1);
    }
     .section {
         padding: 1.5rem;
         max-width: 1200px;
         margin: auto;
         scroll-margin-top: 110px;
        /* ajuste à la hauteur de ton header */
    }
     .section_full {
        /*padding: 1rem;
        */
         width: 100%;
         max-width: none;
         margin: 0 auto;
    }
     .cards {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
         gap: 2rem;
    }
     .card {
         position: relative;
         overflow: hidden;
         border-radius: 5px;
        /*transition: transform 0.3s ease;
        */
         transition: background-color 0.3s ease, transform 0.2s ease;
         box-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
    }
     .card a {
         display: block;
         position: relative;
         overflow: hidden;
    }
     .card img {
         width: 100%;
         display: block;
         border-radius: 5px;
         transition: transform 0.3s ease;
    }
     .card:hover {
         transform: scale(1.1);
    }
     .card:hover img {
         transform: scale(1.05);
    }
     .card h3 {
         position: absolute;
         bottom: 0;
         left: 0;
         right: 0;
         background: rgba(0, 0, 0, 0.6);
         color: white;
         margin: 0;
         padding: 0.75rem;
         font-size: 1rem;
         text-align: center;
         border-radius: 0 0 8px 8px;
    }
     .card_full {
         position: relative;
         overflow: hidden;
         border-radius: 5px;
         box-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
    }
     .visuozCards {
         display: grid;
         grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
         gap: 2rem;
    }
     .visuozCard {
         position: relative;
         overflow: hidden;
         border-radius: 5px;
        /*transition: transform 0.3s ease;
        */
         box-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
    }
     .visuozCard iframe {
         width: 100%;
         display: block;
         border-radius: 5px;
         transition: transform 0.3s ease;
    }
     .social-icons a {
         color: white;
         margin-right: 0.8rem;
         font-size: 1.2rem;
         transition: transform 0.2s ease;
    }
     .social-icons a:hover {
         transform: scale(1.2);
         color: var(--red);
    }
     #cookie-popup {
         position: fixed;
         bottom: 20px;
         left: 20px;
         background-color: white;
         padding: 1rem;
         border-radius: 10px;
         box-shadow: 0 2px 10px rgba(0,0,0,0.2);
         max-width: 300px;
         z-index: 1000;
         color: black;
    }
     #cookie-popup button {
         background-color: var(--blue);
         color: white;
         border: none;
         padding: 0.5rem 1rem;
         border-radius: 5px;
         margin-top: 1rem;
         cursor: pointer;
    }
     @media (max-width: 600px) {
         header, nav {
             flex-direction: column;
             align-items: flex-start;
        }
    }
     .back-to-top {
         position: fixed;
         bottom: 10px;
         right: 10px;
         z-index: 50;
         text-decoration: none;
         color: #ffffff;
         background-color: #415db5;
         display: none;
         font-size: large;
         width: 40px;
         height: 40px;
         text-align: center;
         vertical-align: middle;
    }
    /*carousel*/
     .thumb {
         opacity: 0.7;
         transition: opacity 0.3s ease;
    }
     .thumb:hover {
         opacity: 1;
    }
     .carousel img {
        /*height: 180px;
        */
         border-radius: 6px;
    }
     .carousel-page{
         height: 100%;
    }
     #mainCarouselImage{
         width: 100%;
         height: auto;
        /* transform: translate3d(-50%, -50%, 0);
         top: 50%;
         left: 50%;
        */
         position: relative;
         transition: transform 0.5s ease, opacity 0.5s ease;
    }
     #prevBtn{
         position:absolute;
         top: 50%;
         left: 10px;
         transform: translateY(-50%);
         height: 40px;
         width: 40px;
         border: none;
         border-radius: 50%;
         background: rgb(153 151 151 / 83%);
         color: white;
         cursor: pointer;
         font-weight: bold;
         z-index: 2;
         font-size: x-large;
    }
     #nextBtn{
         position: absolute;
         top: 50%;
         right: 10px;
         transform: translateY(-50%);
         height: 40px;
         width: 40px;
         border: none;
         border-radius: 50%;
         background: rgb(153 151 151 / 83%);
         color: white;
         cursor: pointer;
         font-weight: bold;
         z-index: 2;
         font-size: x-large;
    }
     .description {
         max-width: 900px;
         margin: 2rem auto;
         line-height: 1.6;
    }
     #infos {
        /*max-width: 900px;
        */
         margin: 1rem 1rem 1rem 1rem;
         line-height: 1.6;
         background-color: #010851;
         padding: 1rem;
         border-radius: 10px;
    }
     #infos .fa{
         margin-right: 20px;
         margin-left: 10px;
    }
     #infos .fab{
         margin-right: 20px;
         margin-left: 10px;
    }
     #infos h2{
         background-color: aliceblue;
         border-radius: 10px;
         padding: 5px;
         margin: 0;
         color: black;
    }
     #infos p{
         margin: 0.7rem;
    }
     #infos a{
         display: inline-block;
         background-color: #ff69696b;
         border-style: solid;
         margin: 18px 10px 5px 10px;
         border-width: 1px;
    }
     #infos a:hover{
         color: white;
         background-color: #ffffff6b;
    }
     #infos .infos-columns {
         display: flex;
         gap: 2rem;
         flex-wrap: wrap;
         margin-top: 2rem;
    }
     #infos .infos-columns > div {
         flex: 1 1 45%;
    }
     #etablissements{
         flex: 1.5;
         min-width: 280px;
         max-height: 800px;
         overflow-y: scroll;
    }
     #etablissements .card-list{
         display: inline;
    }
     #etablissements .card-list .card{
         height: 150px;
         margin: 10px;
         background-color: #f6f6f666;
         background: white;
         padding: 1rem;
    }
     #etablissements .card-list .card:hover{
         transform: scale(1.02);
         background-color: #ffffff;
    }
     #etablissements .card-list .card:hover img{
         transform: scale(1.0);
    }
     #etablissements img{
         height: 100%;
         width: auto;
    }
     #etablissements .fa{
         margin-right: 10px;
         color: white;
    }
     #etablissements:hover .card .fa{
         color: black;
    }
     #etablissements p{
         margin: 2px;
    }
     #etablissements h4{
         margin: 1rem;
    }
     #etablissements .etablissements_infos{
         position: absolute;
         display: inline;
         color: black;
         top: 0;
         left: 150px;
    }
     .visuoz {
         text-align: center;
         margin: 3rem auto;
    }
     .visuoz a {
         background: #C6483C;
         color: white;
         padding: 1rem 2rem;
         border-radius: 8px;
         text-decoration: none;
         font-weight: bold;
    }
     .visuoz a:hover {
         background: #a3392e;
    }
     