@charset "utf-8";
/* CSS Document */
:root {
	--nav-bk : #f6ddc8; 
	--navbar-bk:rgba(255,255,255,1);
	--dropdown-bk:#e3dcd4;
	--dropdown-bkh:#e3dcd4;
	--dropdown-br : 4px solid --dropdown-bk;
	--dropdown-color:#472817;
	--dropdown-item-c:#472817;
	--nav-link-c:#212121;
	--nav-link-h:#f15827;
	--nav-link-f:#f15827;
	--nav-link-a:#f15827;
	--nav-link-br :  4px solid --theme5;
	--theme4 :#f7e5c2;
	--theme5 :#ac7b31;
	--nav-link-bk : linear-gradient(to bottom,  #d1aa6b 0%,#ac7b31 100%); 
	--us-btn-bkg:#472817;
	--me-btn-bkg:#8c5737;
}
.nav{background-color:var(--nav-bk);position:relative;top:0px;z-index:2;}

.info{background-color:#fcfcfc;border-color:#e1e1e1; border-width:0 0 1px 0;border-style:solid;}
.info .dte{align-items: center;display: flex;align-content: end;justify-content: flex-end;}
.amailto{ width: 2em;height: 2em;display:flex;background-image:url(../img/mail.svg);background-position:center;background-repeat:no-repeat;opacity:1;}
.amailto:hover{background-color:var(--soho)}

.dropdown-menu {font-size: 13px;background-color:var(--dropdown-bk);border:var(--dropdown-br);padding:3px;}
.dropdown-item{color:var(--dropdown-color);background-color:var(--dropdown-bk);}
.dropdown-item:hover{background-color:var(--dropdown-item-c);}

header .dropdown-menu li {background: linear-gradient(to bottom, #f0d7ae   0%,#d1aa6b 100%);/**/
border:2px solid #fdf3e5;
border-radius: 2px;
margin:1px;


}
header .dropdown-menu li:hover {background: inear-gradient(to bottom, #d1aa6b 0%,#ac7b31 50%,#ac7b31 50%,#d1aa6b 100%);border-radius: 5px;}
header .dropdown-item{
	color:var(--dropdown-color);
	background: radial-gradient(ellipse at top,  #f7e5c2 0px,transparent 50%);
	text-shadow: 1px 1px 1px var(--theme4);
}
header .dropdown-item:hover{color:var(--dropdown-color);text-shadow: 1px 1px 1px transparent;background-color:transparent;}
@media (max-width:767px){
	.container-fluid.nav-fond{padding-right: var(--bs-gutter-x, 0);padding-left: var(--bs-gutter-x, 0);background-color:var(--bs-white);}
	.connexion{display:block;width:100%;}
	.connexion a{width:100%;text-align:center;margin-bottom:15px;}
	.menu3{display:block;width:65%;}
	.menu3 a{ width:25%;text-align:center;height:50px;line-height:50px;}
	.navbar-brand{margin-right:0;}
	.us{background-color:var(--us-btn-bkg)}
	.me{background-color:var(--me-btn-bkg)}
	.agence{background-color:var(--bs-gray-500)}
	.planning{background-color:var(--w-boutonup)}
	.us:before ,
	.me:before ,
	.agence:before ,
	.planning:before ,.planning:before {color:#fff;}
	.us span,
	.me span,
	.planning span{transform: translate(10px,-35px);opacity: 0.9;color:#fff;}
	.agence span	{transform: translate(10px,-35px);opacity: 0.9;color:#000;}
	.us:hover ,
	.me:hover ,
	.planning:hover ,
	.agence:hover{background-color:var(--w-bg-btnup)}
	.us:hover span,
	.me:hover span,
	.planning:hover span,
	.agence:hover span{transform: translate(10px,-35px);opacity: 1;color:#fff;}
	.navbar-collapse{padding-left:0;}
	.dropdown-menu{display:block;padding:0 0 0 15px;background-color:transparent;border-width:0;}
	.dropdown-item { font-size: 1em;}
}
@media (min-width:10px){
	.brand{
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		justify-content: center !important;
		width:100%;
	}
	.navbar-toggler:focus{box-shadow: 0 0 0 0rem;}
	body.home .brand {width: 100%;padding-right:0px;}
	.menu{
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		justify-content: center !important;
		width:100%}
	.navbar{background-color:var(--navbar-bk);padding-top: 1rem !important;padding-bottom: 1rem !important;}
	body.home .menu .navbar {display:none;}
	.toggle { display:block; position:fixed; top:15px; right:10px; z-index:2000;width:120px;border: 0;background-color: transparent;}
	.toggle:focus{}
	.hb {width:100%;margin: 0 auto;display: block;}
	#navbar-page{
		position: fixed;top:-2500px;right:0; 
		width: 80%;
		z-index:100;
		padding-top:80px;
		padding-left:50px;
		padding-bottom:100px;
		/*transform:translate(0,2500px);*/
		transition: all 0.3s ease;
		background-color:#f2f2f2;
	}
	#navbar-page.sorti{
		position: absolute;
		top:0;;
		/*transform:translate(0,0);*/
		transition: all 0.5s ease;
	}
	.navbar-brand{
		transform:translate(0,0) scale(1,1);
		transition: transform 0.6s ease;
	}
	.navbar-brand.sorti{
		transform:translate(-40%,0) scale(0.5,0.5);
		transition: transform 0.3s ease;
	}
	.navbar-page .navbar-nav  li{width:100%;}
	.navbar-page .navbar-nav  .nav-link{color:#4f4a4a;font-size:13px;padding-left:5px;transition: all 0.3s ease;}
	.navbar-page .navbar-nav  .nav-link:hover{padding-left:10px;transition: all 0.3s ease;}
	.navbar-page .navbar-nav .dropdown-menu{display:flex;flex-direction:row;background-color:transparent;font-size:1.5rem;padding-left:50px;color:#4f4a4a;;transition: all 0.3s ease;
	width:50%;border-width: 2px 0 0 0;
	border-color: var(--bs-red);
	}
	.navbar-page .navbar-nav .dropdown::after {display: none;}
	.navbar-page .navbar-nav .dropdown-item{color:#4f4a4a;}
	.navbar-page .navbar-nav .dropdown-item:hover{background-color:transparent;transform:translate(-5px,0) ;transition: all 0.9s ease;position:relative;}
	.navbar-nav .nav-link{color:#4f4a4a;}
	.navbar-nav .nav-link:hover{color:var(--nav-link-h)}
	.navbar-nav .nav-link:focus{color:var(--nav-link-f)}
	.navbar-nav .nav-link:active{color:var(--nav-link-a)}
	.navbar-nav .active .nav-link{color:var(--nav-link-a)}
	.navbar-page .navbar-nav .dropdown-menu .dropdown-menu {display:flex;flex-direction:column;border-width:0 0 0 0;}
	
	.col-12.px-4{
	padding-right: 0rem !important;
	padding-left: 0!important;
	}
	ul{
		padding-left: 1rem;
	}
		body.simple .first{height:330px;background-color: var(--w-bg-gris);}
	body.simple .nav-fond {background-color: rgba(69,36,0,0.89);}
}
@media (min-width:500px){
	.toggle {width:120px;}
}
@media (min-width:10px){
	.menu{
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		justify-content: center !important;
	}
}
@media (max-width:767px){
	#navbars{padding-left:30px;padding-right:30px;padding-top: 5px;}
	.navbar-light .navbar-nav .nav-link{display:block;padding-left:30px;line-height:50px;margin-right: 0px;}
	.dropdown-item{line-height:50px;color:#000;}
	.dropdown-menu{padding: 0 0 0 0;}
	.dropdown{border:2px solid var(--ch-blue);margin-bottom:10px;}

	.navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link{
		/*color: var(--dropdown-color);*/
		/*background-color: var(--dropdown-bk);*/
		background-color: var(--dropdown-bk);
		color:#000;
	}
	.navbar-light .navbar-nav .nav-link.niv01 , .navbar-light .navbar-nav .nav-link.niv01{background-color: var(--dropdown-bkh);color:#000;}
	.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus{background-color: var(--dropdown-bkh);}
	
}
@media (min-width:767px){
	.brand{width:45%;padding-right:1rem;
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		justify-content: flex-start!important;
		padding-right:0;
		padding-left:0;
		margin: 0 auto;
	}
	.menu{
		/*justify-content: flex-start!important;*/
	}
	.navbar-brand {margin-right:0;}
	.connexion{padding-bottom:10px}

}
@media (min-width:768px){
	.menu2{position:absolute; top:20px ;right:5%;width:20%}
}
@media (min-width:800px){
	.brand{width:35%;padding-right:1rem;}
	.menu{width:100%;}
	.navbar-brand {margin-right:0;}
	.connexion{padding-bottom:10px}
	.dropdown-menu.show{}
	.dropdown-submenu{}
	
	.dropdown.open .dropdown-menu.show {display: flex !important;flex-direction: column;}
	.dropdown.open .dropdown-menu.show .dropdown-item{}
	.dropdown.open .dropdown-menu.show .dropdown-menu{display:block;position:relative;display: flex !important;flex-direction: column;}
	.menu2 {
		position: absolute;
		top: 20px;
		right: 5%;
		width: 20%;
		justify-content: center !important;
		flex-wrap: wrap !important;
		display: flex !important;
		flex: 0 0 auto;
	}
	body.simple .first{height:280px;background-color: var(--w-bg-gris);}
	body.simple .nav-fond {background-color: rgba(69,36,0,0.89);}
}
@media (min-width:900px){
	.brand{width:35%;}
	.menu{width:65%;}
	#logo{padding-left:0px;margin-left:3%;margin-right:0;}
	#logo.mx-auto{margin-left:50px!important;margin-right:0!important;}
	#logo img{max-width:90px;}
	.navbar-brand {margin-right:0;}
	#logo #espace_affaires{max-width:90%;width:90%}
	.connexion{padding-bottom:0px;margin-right:20px;}
	.menu2 {
		position: absolute;
		top: 20px;
		right: 5%;
		width: 20%;
	}
		body.simple .first{height:180px;background-color: var(--w-bg-gris);}
	body.simple .nav-fond {background-color: rgba(69,36,0,0.89);}
}
@media (min-width:1000px){
	.brand{width:35%;padding-right:1rem;}
	.menu{width:65%}
	.menu2{width:25%;}
	.navbar-brand {margin-right:0;}
	#logo #espace_affaires{max-width:90%;width:90%}
}
@media (min-width:1024px){
	.brand{width:35%;padding-right:1rem;}
	.navbar-brand {margin-right:0;}
	#logo #espace_affaires{max-width:90%;width:90%}
		body.simple .first{height:180px;background-color: var(--w-bg-gris);}
	body.simple .nav-fond {background-color: rgba(69,36,0,0.89);}
}
@media (min-width:1100px){
	.brand{width:35%;}
	.navbar-brand {margin-right:0;}
	#logo #espace_affaires{max-width:90%;width:90%}
	body.simple .first{height:180px;background-color: var(--w-bg-gris);}
	body.simple .nav-fond {background-color: rgba(69,36,0,0.89);}
}
@media (min-width:1200px){
	.brand{width:35%;}
	.navbar-brand {margin-right:0;}
	#logo #espace_affaires{max-width:90%;width:90%}
}
@media (min-width:1300px){
	.brand{width:25%}
	.menu{width:65%}
	.navbar-brand {margin-right:0;}
}
@media (min-width:1400px){
	.brand{width:25%}
	.menu{width:60%}
	.navbar-brand {margin-right:0;}

}
@media (min-width:1500px){
	.brand{width:25%}
	.navbar-brand {margin-right:0;}
		body.simple .first{height:180px;background-color: var(--w-bg-gris);}
	body.simple .nav-fond {background-color: rgba(69,36,0,0.89);}
}
@media (min-width:1600px){
	.brand{width:25%}
	.menu{width:50%}
	.menu2{width:25%;}
}
@media (min-width:1700px){
	.brand{width:25%}
	.menu{width:65%}
	body.simple .first{height:180px;background-color: var(--w-bg-gris);}
	body.simple .nav-fond {background-color: rgba(69,36,0,0.89);}
}
