/*
Theme Name: 2M Agencement
Author: emma.satti
Author URI: https://emmasatti.fr
Version: 2.26.10
*/

/*-------------------------------------------*/
/* CLASSES
/*-------------------------------------------*/
.blocfix {
	position: relative;
	width:calc(100% - 30px);
	max-width:1140px;
	margin:auto;
}
/*.fa, .fas {
	display:inline-block;
	color: var(--principal);
}
.fa:hover, .fas:hover { color: var(--menuhover) }/*

/*-------------------------------------------*/
/* IDs
/*-------------------------------------------*/
.head {
    background: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,0));
	position:relative;
	width: 100%;
	height: 225px;
	margin:  0;
	padding: 20px 0 20px 0;
	z-index: 1000;
}
.head .logo {
	position: absolute;
    top: 0;
    left: 20px;
	width: 135px;
}
.head .logo img {
    width: 135px;
}
.head .logo:before {
    content: "";
    display: block;
    position: absolute;
    top: -41px;
    left: -45px;
    width: 225px;
    height: 210px;
    background: #fff;
    border-radius: 0 0 0 30px;
 	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	transform: rotate(-10deg);
    box-shadow: 0 0 15px rgba(0,0,0,0.7);
    z-index: -1;   
}

/*-------------------------------------------*/
/* menu
/*-------------------------------------------*/
.menutop {
	position:absolute;
    top: 35px;
    right: 0;
	width: 100%;
	line-height: 40px;
	padding: 0;
    text-align: right;
	-webkit-transition: all 1s;
	transition: all 1s;
    z-index: 1000;
}
.menutop ul { margin: 0 auto; padding: 0 }
.menutop li {
	display:inline-block;
	margin: 0;
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
	border-bottom: 3px solid transparent;
}
.menutop li:after {
    content: "•";
    color: #ff6601;
    margin: 0 10px;
}
.menutop li:last-child:after, .menutop li li:after {
    content: "";
    margin: 0;
}
.menutop li a {
    display: inline-block;
    line-height: 40px;
	font-size: 18px;
	font-weight: 400;
	color: var(--menu);
	text-decoration:none;
    text-transform: uppercase;
}
.menutop a:hover, .menutop li:hover > a {
	color: var(--menuhover);
}

/* NIVEAU 2 ---------------------------------*/
.menutop li ul {
	position: absolute;
	padding: 0;
	top: 44px;
	display:none;
	background: #fff;
	z-index: 100;
	text-align: left;
	box-shadow: 0 0 2px 0 rgba(0,0,0,0.4);
}
.menutop li:hover ul {
	display:block;
}
.menutop li li {
	display: block;
	position: relative;
	background: none;
	margin: 0;
}
.menutop li li, .menutop li li:hover {
    border: none;
}
.menutop li li a {
	display: block;
	line-height: 40px;
	color: var(--menu2);
	font-size: 18px;
	font-weight: 400;
    text-transform: none;
	padding: 5px 15px;
}
.menutop li li a:hover {
	color: var(--menu2hover);
}
.menutop li li:hover { background: #ccc }
/*-------------------------------------------*/
.show-menu, .close-menu {
	position: fixed;
	top: 20px;
	right: 20px;
    font-size: 24px;
	color: var(--awf);
    display: none;
}
/*Hide checkbox*/
.head input[type=checkbox]{ display: none }
/*Show menu when invisible checkbox is checked*/
#show-menu:checked ~ .menutop { left: -15px }
#show-menu:checked ~ .close-menu { display: block }
#show-menu:checked ~ .show-menu { display: none }

/*-------------------------------------------*/
.bulle a {
	display: block;
    width:100%;
    height:0;
    padding: 65% 0 35%;
	border-radius: 0 0 40px 0;
    text-align: right;
	font-family: 'Barlow', sans-serif;
	font-size: 22px;
	font-weight: 300 !important;
    color:transparent !important;
}
.bulle a:hover {
	background-color: rgba(0,0,0,0.7);
	color: #fff !important;
}

/*-------------------------------------------*/
.foot {
	position: relative;
	width:100%;
	padding: 20px 0;
	overflow: auto;
	line-height: normal;
	font-size: 14px;
    font-weight: 400;
	color:  var(--foottxt);
    text-align: center;
	z-index: 10;
}
.foot .logo {
    display: block;
	position: relative;
    float: left;
	height: 80px;
}

.foot .menu-menufoot-container, .foot ul, .foot li {
	display: inline-block;
	margin: 0;
	padding: 0;
}
.foot a { color: var(--foottxt); text-decoration: none }
.foot li a:after { content: "•"; margin: 0 5px; color: var(--principal) }
.foot a:hover { color: var(--linkh) }

/*-------------------------------------------*/
/* RESPONSIVE
/*-------------------------------------------*/

@media screen and (max-width: 1090px) {
.head { height: auto }
.show-menu { display:block }
.head .logo { left: 10px; width: 115px }
.head .logo img { width: 115px }
.head .logo:before { left: -30px; width: 175px;  height: 180px }
.menutop { position: fixed; top: 0; left: -270px; right: auto; width: 270px; height: 100%;	margin: 0 auto; background: var(--principal); overflow: auto  }
.menutop ul { margin: 0; padding: 0; background: none }
.menutop li:after { content: ""; margin: 0 }
.menutop li { display:block; margin: 0; padding: 0 }
.menutop li, .menutop li:hover {border-bottom: 1px solid #fff }
.menutop li a, .menutop li li a { display:block; line-height: 50px; padding: 0 !important; font-size: 17px; color: #fff !important; text-align: center }
.menutop a:hover { background: #f98922; border: none !important }
.menutop li ul { position: relative; top: 0; display:block; background: none; text-align: center; box-shadow: 0 0 0 0;  }
.menutop li li a { line-height: inherit; padding: 10px 0; border: none }
.foot { line-height: 2em; font-size: 15px }
.foot .logo { float: none; margin: 0 auto 15px auto }
.foot .menu-menufoot-container, .foot ul, .foot li { display: block }
.foot li a:after { content: ""; margin: 0 }

}