:root { 
    --fonce: #191E38; /* bleu fonce */
    --clair: #d8ac2a; /* jaune */
    --bleuclair: #209fa5;
    --orange: #EB7622;
    --blanc: #fff;
}



body{
    font-family: 'Open Sans', sans-serif;
    font-weight:400;
    min-width:320px;
    color:#373737;
    line-height:1.3;
    font-size:16px;
}

.haut1,
.haut10,
.haut20,
.haut30,
.haut40,
.haut60{
	display:block;
}
.haut1{
	height:1px;
}
.haut10{
	height:10px;
}
.haut20{
	height:20px;
}
.haut30{
	height:30px;
}
.haut40{
	height:40px;
}
.haut60{
	height:60px;
}

a, a:hover, a:active, a:visited{
	text-decoration:none;
}
ul{
	list-style:none;
}
cent{
    width:100%;
}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .font-theme{
    font-family: 'Lora', serif;
    color: var(--fonce);
}

h1:after{
    content:'';
    background:url("../img/separateur_clair.png") no-repeat;
    display:block;
    margin:auto;
    width: 179px;
    height: 44px;
    position:relative;
    top:5px;
    margin-bottom: 40px;
}
h1, .h1{
    font-size: 44px;
    margin-top: 40px;
    margin-bottom: 20px;
}
h2, .h2{
    font-size: 36px;
    margin-top: 40px;
    margin-bottom: 30px;
}
h2 span.petit{
    font-size: 24px;
}
.foire h2{
    font-size: 30px;
    margin-top: 20px;
    margin-bottom: 10px;
}
h3, .h3{
    font-size: 28px;
    margin-top: 30px;
    margin-bottom: 20px;
}

h4, .h4{
    font-size:22px;
    line-height: 24px;
}

.blanc{
    color:var(--blanc);
}   
/*---------------------classes récurentes--------------------*/
.img-resp img,
.img-resp,
.image-resp img{
    max-width:100%;
    width:auto;
    height:auto;
}
.visuel img, .box img{
    width:100%;
    height:auto;
    margin-bottom:10px;
}
.box img:hover{
    cursor:zoom-in;
    -webkit-filter: brightness(0.5);
    filter: brightness(0.5);	
    transition: all 0.3s ease 0s;
}


    /*----------------onglets menus administration-----------*/
    .tabs--primary {
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .tabs--primary li{
        padding: 4px 15px;
        border: 1px solid #ccc;
        border-bottom: none;
        margin: auto 1px;
    }
    
 /*--------------------------editeur--------------------------------*/
.editeur ul{
   list-style-image: url(../img/puce.png);
   list-style-position: outside;
}

.editeur li{
    margin-bottom: 5px;
}


.fonce{
    color:var(--fonce);
}

.clair{
    color:var(--clair);
}
.bleuclair{
     color:var(--bleuclair);
}
.orange{
     color:var(--orange);
}

p.soustitre{
    font-size: 28px;
    font-family: 'Lora', serif;
}
p.plusgrand{
    font-size:20px;
}  

table, .table th{
	text-align:center;
}
table{
	width:auto;
	max-width:100%;
	display:block;
	margin:auto;
}
table th{
	vertical-align:middle;
	font-size:15px;
}
table > thead > tr > th,
table > tbody > tr > td {
	vertical-align: middle;
	padding: 12px 10px 12px 10px;
        border:1px solid #ccc;
}
table > thead > tr > th {
	background-color: var(--fonce);
	border-bottom: none;
	color: #fff;
}
table > thead > tr > th:first-child {
	background-color: var(--clair);
}
table > tbody > tr > td {
	border-top: none;
	background-color: #f2f2f2;
	min-width:20%;
}


.editeur .bouton a,
.editeur a span.bouton{
    display: inline-block;
    padding: 10px 20px 10px 40px;
    background: url(../img/puce_savoirplus.png) no-repeat 10px center;
    background-color: var(--clair);
    margin-top: 10px;
    border-radius: 30px;
    border: 2px solid var(--clair);
    font-weight: 600;
    color:#fff;
}
.editeur .bouton a:hover,
.editeur a span.bouton:hover{
    background-color: var(--fonce);
    transition: all 0.3s;
    border: 2px solid var(--fonce);
    color:#fff;
}




/*------------------------gtranslate--------------------------------*/
.gtranslate_wrapper {
    text-align: center;
    overflow: hidden;
    height: 140px;
}
.gtranslate_wrapper a{
    display: block;
    margin:6px auto;
}

/*------------------------Slider / entete-----------------------------*/


.entete a, 
.tel_logo a,
.navbar-brand a,
.editeur a:hover{
    color:var(--fonce);
}
.entete a:hover, .entete a:active, 
.tel_logo a:hover, .tel_logo a:active,
.navbar-brand a:hover, .navbar-brand a:active,
.editeur a{
    color:var(--bleuclair);
}
.sstitre_logo{
    font-weight: 600;
    margin-top: 10px;
    font-size:18px;
}
.tel_logo a{
    font-size: 26px;
    font-weight: 600;
    white-space: nowrap;
}
.tel_logo{
    margin-bottom: 5px;
}


/*------------------------navigation--------------------------------*/
.bg-nav{
    background: var(--fonce);
    width:100%;
}

.nav-link{
    font-size: 20px;
    color: #fff;
    border-top: 2px solid var(--fonce);
    border-bottom: 2px solid var(--fonce);
    padding-top:3px;
    padding-bottom:2px;
}
.nav-link:hover, .nav-link:active{
    border-top: 2px solid #fff;
    border-bottom: 2px solid #fff;
    color: #fff;
}
.navbar, .navbar-nav{
   display: inline-block;
   margin: auto;
   width: 100%;
}
.navbar-toggler {
  background-color: var(--fonce);
  border: 1px solid var(--fonce);
  position:absolute;
  top:15px;
  right: 15px;
}
.bg-nav .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 0.8)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.nav-item{
    margin: 0 1%;
    display: inline-block;
    text-align: center;
}
.nav-item.reservation{
    background: var(--clair);   
}
.nav-item.reservation .nav-link{
    color: var(--fonce);
}

.actu .carousel-indicators {
    bottom: -40px; 
}
.actu .carousel-indicators [data-bs-target] {
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background-color: var(--clair); 
    margin-left: 10px;
    margin-right: 10px;
    border: 0;
}
.equipe .carousel-indicators,
.tourisme .carousel-indicators{
    bottom: 40px;
}
.equipe p{
    margin-top: 5px;
}
.tourisme p{
    background: var(--fonce);
    padding: 10px 20px;
    margin: 0 auto;
    color: var(--blanc);
}

/*-----------------------------page interne ------------------------------------*/

.bt_savoir_plus{
    display: inline-block;
    padding: 10px 20px 10px 40px;
    background: url(../img/puce_savoirplus.png) no-repeat 10px center;
    background-color: var(--clair);
    margin-top: 10px;
    border-radius: 30px;
    border: 2px solid var(--clair);
}
.bt_savoir_plus a, .bt_savoir_plus a:hover, .bt_savoir_plus a:active{
    color:#fff;
    font-weight: 600;
}
.bt_savoir_plus:hover{
    background-color: var(--fonce);
    transition: all 0.3s;
    border: 2px solid var(--fonce);
}

.services{
    margin-top:30px;
}
.titre-service{
    color:var(--blanc);
    background: var(--fonce);
    border-radius: 30px;
    font-weight: 500;
    display: inline-block;
    min-width: 170px;
    max-width: 100%;
    padding: 3px 12px 4px;
    text-align: center;
    font-size: 22px;
}
/*.picto img{
    filter: invert(11%) sepia(24%) saturate(1327%) hue-rotate(192deg) brightness(95%) contrast(97%); bleu fonce
    filter: invert(53%) sepia(48%) saturate(1605%) hue-rotate(347deg) brightness(95%) contrast(93%); orange
    filter: invert(83%) sepia(100%) saturate(4937%) hue-rotate(329deg) brightness(92%) contrast(94%); jaune
}*/
.picto img{
    filter: invert(44%) sepia(82%) saturate(390%) hue-rotate(134deg) brightness(100%) contrast(94%); /* bleu clair*/
}


/*-------------------------chambres---------------------------*/
.tarifs,
.tarifs-vue{
    background: var(--fonce);
    display: inline-flex;
    color: var(--blanc);
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-family: 'Lora', serif;
    padding: 10px 20px;
    margin-bottom: 50px;
}

.tarifs-vue{
    font-size: 24px;
    display: block;
    margin-bottom: 20px;
}
a:hover .tarifs-vue{
    background: var(--clair);
}
.bt-reserver,
.caracteristiques,
.caracteristiques-vue{
    border: 2px solid var(--clair);
    border-radius: 30px;
    display: flex;
    align-items: center;
    padding:10px 32px;
    font-size: 20px;
    margin-bottom: 20px;
}
.bt-reserver,
.caracteristiques-vue{
    display: inline-flex;
    font-size: 16px;
    padding:10px 20px;
    margin-bottom: 6px;
}
.caracteristiques img,
.caracteristiques-vue img{
    margin-right: 20px;
}
.lien-chambre:hover,
.lien-chambre{
    color: var(--fonce);
}

.bt-reserver{
    background: var(--fonce);
    border: 2px solid var(--fonce);
    
}

.bt-reserver a{
    color:var(--clair);
    font-weight: 600;
}

.bt-reserver:hover a,
.bt-reserver a:hover{
    color:var(--fonce);
}

.bt-reserver:hover{
    background: var(--clair);
    border: 2px solid var(--clair);
}



/*-----------------------formulaires----------------------------*/

.formulaire input[type="text"],
.formulaire input[type="email"],
.formulaire input[type="tel"],
.formulaire textarea{
	width:100%;
	border:1px solid var(--fonce);
	margin-bottom:30px;
	padding: 10px 8px;
}

.formulaire input[type="submit"]{
	border:1px solid var(--clair);
	width:114px;
	padding:10px;
	margin:auto;
	text-align:center;
	background:var(--clair);
        color:#fff;
        font-weight: 600;
}
.formulaire input[type="submit"]:hover{
    background-color:  var(--fonce);
    border:1px solid var(--fonce);
    color: #fff;
    cursor: pointer;
}

/*-----------------------FAQ----------------------------*/
.accordion{
    --bs-accordion-border-radius: 0;
    --bs-accordion-inner-border-radius: 0;
    --bs-accordion-border-color: none;
   
}
h3.accordion-header{
    margin-top: 10px;
}
.accordion-button:focus {
    border-color:#fff;
    box-shadow: none;
    border-bottom: 1px solid var(--clair);
    
}
.accordion-button:not(.collapsed) {
    background-color: var(--fonce);
    color: var(--blanc);
    
}
.accordion-button{
    font-size: 20px;
    color: var(--fonce);
    border-bottom: 1px solid var(--clair);
}


/*--------------------------footer------------------------------------*/
footer{
    padding-top: 30px;
    padding-bottom: 30px;
    background: var(--fonce);
    color:#fff;
    margin-top: 80px;
}
footer a, 
footer a:hover, 
footer a:active,
footer .tel_logo a{
    color:#fff;
}
footer a:hover, 
footer a:active,
footer .tel_logo a:hover{
    color:var(--clair);
}

.bordure{ 
    text-align: center;
}
.bordure > p{
    font-family: 'Lora', serif;
    font-size: 22px;
    padding: 8px 0;
    border:1px solid var(--blanc);
    border-radius: 30px;
}
.bordure-jaune{
    border: 1px solid var(--clair);
    border-radius: 30px;
    padding-top: 20px;
}
.partenaire{
    display: inline-flex;
}
.partenaire div{
    width: 45%;
    margin: 0 auto;
}



/*-----------------------responsive-----------------------------------------*/



@media (max-width: 1199px) {
	
	
	/*------------------------Slider / entete 1200-----------------------------*/
	
	.tel_logo a {
            font-size: 22px;
        }
        
        .tarifs,
        .tarifs-vue{
            font-size: 24px;
            padding: 10px 15px;
        }
        
        
}



@media (max-width: 991px) {
	
/*------------------------langues--------------------------------*/
        #block-hotel-selecteurdelangue{
            background: #fff;
        }

        #block-hotel-selecteurdelangue .links li{
            padding:15px;
            display:inline-block;
        }
        
        .gtranslate_wrapper {
            height: 34px;
            width: 250px;
            margin: 0 auto;
            padding-top: 8px;
        }
	
	.gtranslate_wrapper a{
            display: inline-block;
            margin:0 15px;    
        }
    /*------------------------Slider / entete 991--------------------------------*/
    
    
    .entete{
        display: none;
    }
    .tel_logo{
        display: inline-block;
        text-align: center;
    }
    .tel_logo a{
        font-size: 24px;
        display: inline-block;
    }
    

    #block-hotel-selecteurdelangue ul.links {
        margin-bottom: 0;
    }
    .navbar-brand{
        margin-right: 0.1rem;
        padding-top: 0;
        padding-bottom: 0;
    }
    
    .navbar-brand img{
        width: 200px;
        height: auto;
    }
    .navbar-brand {
        white-space: normal;
        font-size:26px;
        color: var(--fonce);
    }
    .navbar-brand a{
        white-space: nowrap;
        margin-right: 5px;
    }
    .font-theme{
        font-size: 30px;
    }
        
	/*--------------------------navigation 991----------------------------*/
        .navbar{
             box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.1);
        }
        .nav-item{
            margin: 0;
            display: block;
        }
        .bg-nav{
        background: #fff;
        width:100%;
        z-index:1000;
        }
        .nav-link {
	color: var(--fonce);
	border-top: none;
	border-bottom: none;
        padding:8px 0;
        }
        
        .nav-link:hover, .nav-link:active, .nav-link:focus {
	color: #fff;
        border-top: none;
	border-bottom: none;
        }
        .nav-item{
            border-bottom: 1px solid var(--fonce);
        }
        .nav-item:hover{
            background: var(--fonce);
        }
	
        /*------------------------footer 991--------------------------------*/
        .partenaire {
            flex-direction: column;
        }
        .partenaire div{
            width: 85%;
        }
	
	
}

@media (max-width: 767px) {
	
    
	
    /*------------------------Slider / entete 767--------------------------------*/
    .icone_entete{
        display: none;
    }
    
    /*------------------------footer 767--------------------------------*/
    footer{
     padding-bottom: 100px;
    }    
    
    .partenaire {
            flex-direction: row;
        }
        
        .partenaire div{
            width: 45%;
        }
    
	
	
}


@media (max-width: 575px) {
	
    h1, .h1{
        font-size: 36px;
    }
    .soustitre{
        font-size: 30px;
    } 
    /*------------------------Slider / entete 575--------------------------------*/
    .navbar{
        padding-left: 10px;
    }
    .tel-brand{
        font-weight: 600;
    }
    .navbar-brand{
        width: 234px;
    }
	
   
        
	
    /*--------------------------footer 575--------------------------------*/
    
    .icone_footer{
        display: none;
    }
	
    /*--------------------------editeur 575--------------------------------*/
    .editeur ul{
       padding-left: 30px;
    }
}


@media (max-width: 360px) {
	
    .titre-service{
        min-width: 150px;
    }
        
}



/*------------------------ scroll up-----------------------------*/

#scroll-up {
    position: fixed;
    z-index: 8000;
    bottom: 20px;
    right: 20px;
    display: none;
    width: 52px;
    height: 52px;
    font-size: 18px;
    line-height: 50px;
    text-align: center;
    text-decoration: none;
    background-color: #000;
    color:var(--clair);
    border-radius: 100%;
    cursor: pointer;
    border:2px solid #000;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;			
}

#scroll-up:hover {
    background-color: var(--clair);
    color: #fff;
    border:2px solid var(--clair);
}
#scroll-up .fa-angle-up{
	font-size:30px;
}




#toolbar-bar {
    position: fixed;
    width: 100%;
}

.captcha{
	display:inline-block;
	margin-top:20px;
	width:100%;
	text-align:center;
        margin-bottom: 20px;
}
.g-recaptcha{
	display:block;
	margin:auto;
	width:301px;
}

#gmapsx{
    height:600px; 
    width:100%
}


.widget-satisfaction-wrapper-42{
    z-index: 100000;
}

/*------------------------ user login-----------------------------*/
#user-login-form label{
    display: block;
}
#user-login-form {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
}
#user-login-form input{
    margin:10px 0 15px;
}

.tabs--primary li:has(a[href*="revisions"]) {
    display: none;
}