/**********************************
  structure globale du site
***********************************/


/* ------------
HEADER (EN-TETE)
--------------*/

#header {
	background-color: rgba(0, 0, 0, 0);
	position: absolute;
    top: 0;
    left: 0;
	width: 100%;
	z-index: 9;
}
#header::before {
	content: "";
	width: 100%;
	height: 240px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2; /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
	background: -webkit-gradient(linear,  left top, left bottom,  from(rgba(14,14,14,0.9)),color-stop(15%, rgba(0,0,0,0.9)),to(rgba(255,255,255,0)));
	background: -o-linear-gradient(top,  rgba(14,14,14,0.9) 0%,rgba(0,0,0,0.9) 15%,rgba(255,255,255,0) 100%);
	background: linear-gradient(to bottom,  rgba(14,14,14,0.9) 0%,rgba(0,0,0,0.9) 15%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e60e0e0e', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */
}


header.scrollUp.nav-down {
    -webkit-box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.32);
    box-shadow: 0px 3px 5px 0px rgba(0,0,0,0.32);
}
	#header > .inner {
		padding: 10px 10px;
	}
	#header .logo {
		z-index: 9;
	}
		.logo img {
			max-width: 200px;
			margin-bottom: 20px;
			min-width: 120px;
			width: 200px;
		}
		.headertopBar {
			background-color: rgba(0, 0, 0, 0);
			padding: 10px 0 5px 0px;
		}
			.headertopBar .container{
				z-index: 999;
				font-size: 1.3rem;
			}
		.headertopBar a{
			color: white;
			-webkit-transition: color 0.5s;
			-o-transition: color 0.5s;
			transition: color 0.5s;
		}
		.headertopBar a.phone{
			color: var(--color02);
			font-family: 'mb', sans-serif;
			font-size: 1.4rem;
			margin-right: 4px;
		}
		.headertopBar span.adresse{
			color: var(--color00);
		}
		.headertopBar a.hotelLink {
			cursor: pointer;
			margin-left: 40px;
			border-bottom: 2px solid var(--color02);
			-webkit-transition: color 0.5s;
			-o-transition: color 0.5s;
			transition: color 0.5s;
		}
		.headertopBar a.hotelLink:hover {
			color: var(--color02);
		}
		.headertopBar a.contact{
			margin-left: 40px;
		}
		.headertopBar a.contact:hover{
			color: var(--color02);
		}
		.headertopBar a.contact:hover span.ico.mail{
			background-position: -105px -57px;
			margin-right: 0px;
		}
		.headertopBar .selectLanguage .wpml-ls-slot-shortcode_actions:last-of-type::before {
			content: '/';
			position: absolute;
			color: #fff;
			top: 4px;
			left: -2px;
		}
			.headertopBar .selectLanguage .wpml-ls-current-language a {
				font-family: "mb", sans-serif;
			}
		.headertopBar .selectLanguage .text-left{
			margin: 0px;
		}
		.headertopBar .selectLanguage .select_language{
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
		}

/* ----------------------
ZONE INTERIEURE (CONTENU)
-----------------------*/

section#contents {
    padding: 50px 0;
}

/* ----------------------
HEADER PAGE
-----------------------*/

.headerPage {
    height: 400px;
    background-color: grey;
}
.headerPage::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
}
	.breadcrumb {
		top: -40px;
	}
	.breadcrumb a, .breadcrumb span{
		font-family: 'ml', sans-serif;
		color: #959595;
		text-transform: uppercase;
		font-size: 1.4rem !important;
	}
	.headerPage .text, .headerPage .text .container {
		height: 100%;
	}
	.headerPage .text {
		z-index: 1;
		top: 0;
	}
		.headerPage .text .container .desc {
			text-align: center;
		}
		.headerPage .text .container div.title {
			position: absolute;
			left: 50%;
			-webkit-transform: translateX(-50%);
			    -ms-transform: translateX(-50%);
			        transform: translateX(-50%);
			bottom: 25%;
			text-align: center;
			width: -webkit-fit-content;
			width: -moz-fit-content;
			width: fit-content;
		}
			.headerPage .text .container h1{
				font-size: 5.2rem;
				position: relative;
				color: white;
				font-weight: 100;
				padding: 5px 0px;
			}
			.headerPage .text .container h1::before{
				content: "";
				position: absolute;
				top: -6px;
				left: 50%;
				-webkit-transform: translateX(-50%);
				    -ms-transform: translateX(-50%);
				        transform: translateX(-50%);
				height: 2px;
				width: 60%;
				background-color: white;
			}
			.headerPage .text .container h1::after{
				content: "";
				position: absolute;
				bottom: -6px;
				left: 50%;
				-webkit-transform: translateX(-50%);
				    -ms-transform: translateX(-50%);
				        transform: translateX(-50%);
				height: 2px;
				width: 60%;
				background-color: white;
			}
		
span.mobile-buton {
	display: none;
	width: 35px;
}
	span.mobile-buton span {
		width: 100%;
		height: 3px;
		background-color: var(--color02);
		display: block;
		margin: 6px 0;
	}
span.mobile-buton::before, span.mobile-buton::after {
    content: "";
    width: 100%;
    height: 3px;
	background-color: var(--color02);
	-webkit-transition: -webkit-transform 0.5s;
	transition: -webkit-transform 0.5s;
	-o-transition: transform 0.5s;
	transition: transform 0.5s;
	transition: transform 0.5s, -webkit-transform 0.5s;
}


/* ------------
COLONNES
--------------*/
#leftbar >.inner{

}
#rightbar > .inner{
	
}


/* -------------------
FOOTER (PIED DE PAGE)
--------------------*/
footer#footer {
    background-color: var(--color03);
    padding: 2px 0px 6px 0px;
}
	footer#footer ul {
		margin: 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
	}
		footer#footer ul li {
			padding: 0;
		}
			footer#footer ul li a {
				font-size: 1.2rem;
				color: #fff;
			}
			footer#footer ul li:not(:last-child) a::after {
				content: "/";
				margin: 0 5px;
			}
			footer .footerContent{
				background-color: var(--color00);
				padding: 15px 0px;
			}
				footer .footerContent .infoContact span{
					text-transform: uppercase;
					font-family: 'mb', sans-serif;
					color: var(--color03);
					font-size: 1.2rem;
					margin-bottom: 5px;
				}
				footer .footerContent .infoContact a{
					font-family: 'mb', sans-serif;
					color: var(--color02);
					font-size: 1.6rem;
				}
				footer .footerContent .infoRestaurant span{
					font-family: 'mb', sans-serif;
					color: var(--color03);
					font-size: 1.4rem;
					margin-bottom: 5px;
				}
			footer .footerBottomBar{
				background-color: var(--color03);
			}
			footer .footerBottomBar .hotel a.logo-hotel{
				width: 160px;
				margin-right: 20px;
			}
				footer .footerBottomBar .hotel img{
					width: 160px;
				}
				
		

/* ------------
PAGE ERREUR
--------------*/
#error_page{

}
.error{
	color:#f00;
}
.error_form{
	color:#f00;
}

/*RESPONSIVE
01 - DESKTOP */
@media screen and (max-width: 1400px), (max-device-width: 1400px){
}
@media screen and (max-width: 1200px), (max-device-width: 1200px){
}
/*02 TABLETTE*/
@media screen and (max-width: 1024px), (max-device-width: 1024px){
}
/*03 MINI-TABLETTE et MOBILE */
@media screen and (max-width: 767px), (max-device-width: 767px){
		
	span.mobile-buton {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		z-index: 9;
		-webkit-box-ordinal-group: 4;
		    -ms-flex-order: 3;
		        order: 3;
	}
	.mm-menu_offcanvas {
		z-index: 99 !important;
	}
	.mm-menu_offcanvas a.mm-navbar__title{
		text-transform: uppercase;
		color: var(--color02);
	}
	.logo img {
		max-width: 170px;
	}
	
}