@import url('https://fonts.googleapis.com/css2?family=Quicksand:wght@300..700&display=swap');
*{
	margin:0;
	padding:0;
	font-family:"Quicksand",trebuchet,sans-serif;
	font-size:16px;
	font-weight:400;
	line-height:1.7;
}
div#page{
	overflow:hidden;
}

h1,h2,h3{

}
h1,.fauxh1{
	font-size:2rem;
	font-weight:800;
}
h2,.fauxh2{
	font-size:1.5rem;
	font-weight:600;
}
.fauxh1:after,
.fauxh2:after{
	content:" ";
	width:20px;
	height:5px;
	background-color:#ffd100;
	display:block;
	margin:0 auto 20px 0;
}
.fauxh1.after-vertclair:after,
.fauxh2.after-vertclair:after{
	background-color:#8ebf26;
}
.fauxh1.after-rose:after,
.fauxh2.after-rose:after{
	background-color:#ff5757;
}
.fauxh1.no-surlign:after,
.fauxh2.no-surlign:after{
	content:none;
}


h3,.fauxh3{
	font-size:1.2rem;
	font-weight:600;
}
p,
.fauxp{
	font-size:1rem;
}
p,
.fauxp,
.gros-p,
.big-p{
	margin:10px 0 15px 0;
	font-weight:400;
	text-transform:none;
}
.gros-p,.gros-p b,.gros-p strong{
	font-size:1.5rem;
}
.big-p,.big-p b,.big-p strong{
	font-size:2rem;
}
.bigbig-p{
	font-size:2.6rem;
}
b,strong,.strong{
	font-weight:600;
}
a{
	text-decoration:none;
	color:#;
}
ul{
	list-style-type:none;
}


/* /// COULEURS /// */
.jaune{
	color:#ffd100;
}
.bg-jaune{
	background-color:#ffd100;
}
.bg-jaune.bg-opa{
	background-color:rgba(255,209,0,0.6);
}

.jaunebis{
	color:#edca00;
}
.bg-jaunebis{
	background-color:#edca00;
}

.vertfonce{
	color:#2aa738;
}
.bg-vertfonce{
	background-color:#2aa738;
}

.vertclair{
	color:#8ebf26;
}
.bg-vertclair{
	background-color:#8ebf26;
}

.bleu{
	color:#21aa93;
}
.bg-bleu{
	background-color:#21aa93;
}
.bg-bleu.bg-opa{
	background-color:rgba(33,170,147,0.75);
}

.orange{
	color:#fc8210;
}
.bg-orange{
	background-color:#fc8210;
}
.bg-orange.bg-opa{
	background-color:rgba(252,130,16,0.75);
}

.rouge{
	color:#ec312c;
}
.bg-rouge{
	background-color:#ec312c;
}

.violet{
	color:#a72693;
}
.bg-violet{
	background-color:#a72693;
}

.rose{
	color:#ff5757;
}
.bg-rose{
	background-color:#ff5757;
}

.gris{
	color:#585857;
}
.bg-gris{
	background-color:#585857;
}


.noir{
	color:#212121;
}
.bg-noir{
	background-color:#212121;
}
.border-noir{
	border:1px solid #212121;
}


.blanc{
	color:#ffffff;
}
.bg-blanc{
	background-color:#ffffff;
}
.border-blanc{
	border:1px solid #ffffff;
}

.bg-noir,.bg-noir a,.bg-noir p,.bg-noir span,.bg-noir b,.bg-noir strong,.bg-noir h1,.bg-noir h2,.bg-noir h3,
.bg-gris,.bg-gris a,.bg-gris p,.bg-gris span,.bg-gris b,.bg-gris strong,.bg-gris h1,.bg-gris h2,.bg-gris h3,
.bg-orange,.bg-orange a,.bg-orange p,.bg-orange span,.bg-orange b,.bg-orange strong,.bg-orange h1,.bg-orange h2,.bg-orange h3,
.bg-bleu,.bg-bleu a,.bg-bleu p,.bg-bleu span,.bg-bleu b,.bg-bleu strong,.bg-bleu h1,.bg-bleu h2,.bg-bleu h3,
.bg-vertfonce,.bg-vertfonce a,.bg-vertfonce p,.bg-vertfonce span,.bg-vertfonce b,.bg-vertfonce strong,.bg-vertfonce h1,.bg-vertfonce h2,.bg-vertfonce h3{
	color:#ffffff;
}

span.italic{
	font-style:italic !important;
}

/* /// WIDTH FLEX & CO /// */
.flexblock{
	display:flex;
}
.reverse{
	flex-direction:row-reverse;
}
.items-center{
	align-items:center;
}
.items-end{
	align-items:flex-end;
}
.items-start{
	align-items:flex-start;
}
.justif-center{
	justify-content:center;
}
.justif-end{
	justify-content:flex-end;
}
.wrap{
	flex-wrap:wrap;
}
.midwidth{
	width:46%;
}
.un-tiers{
	width:29%;
}
.deux-tiers{
	width:73%;
}
.un-quart{
	width:21%;
}
.trois-quart{
	width:71%;
}
.midwidth,
.un-tiers,
.deux-tiers,
.un-quart,
.trois-quart{
	margin:20px 2%;
}
.capsule{
	max-width:1200px;
	margin:0 auto;
}
.capsule600{
	max-width:600px;
	margin:0 auto;
}
.capsule800{
	max-width:800px;
	margin:0 auto;
}
.capsule1000{
	max-width:1000px;
	margin:0 auto;
}
section.all,
header,footer{
	width:80%;
	padding:30px 10%;
	margin:30px auto;
}
section.shadow{
	-webkit-box-shadow: 3px 3px 15px 5px #d3d3d3;
	box-shadow: 3px 3px 15px 5px #d3d3d3;
}

.transition{
	transition:0.4s;
}


/* DIVERS */
.maj{
	text-transform:uppercase;
}
.center{
	text-align:center;
}

/* BOUTONS */
a.bta{
	width:fit-content;
	padding:1px 13px 3px 13px;
	border-radius:20px;
	display:block;
	margin:20px 0;
	font-weight:500;
	transition:0.4s;
	font-size:1.1rem;
	color:#ffffff;
}
a.bta-center{
	margin:20px auto;
}
a.bta.plus{
	font-size: 1.5rem;
  font-weight: 600;
  padding: 0 13.5px;
  transition:0.4s;
}
a.bta.plus:hover,
a.bta:hover{
	transition:0.4s;
	background-color:#212121;
}


/* IMAGES */
img{
	width:100%;
	height:auto;
}
figure.img-shadow{
	-webkit-box-shadow: 3px 3px 15px 5px #d3d3d3;
	box-shadow: 3px 3px 15px 5px #d3d3d3;
}
figure.mt-10 img{
	margin-bottom:-10px;
}





/* --- /// HEADER /// --- */
header#header{
	margin:0 auto;
}
aside.rs-top{
	width:10%;
}
aside.rs-top img{
	width:35px;
}
figure#logo{
	width:15%;
}
figure#logo img{
	max-width:150px;
}
nav#main-menu{
	width:75%;
}
aside.rs-top a{
	display:block;
	margin:5px auto;
}

/* menu principal */
nav#main-menu ul{
	justify-content:space-evenly;
}
nav#main-menu ul li a{
	color:#212121;
	text-transform:uppercase;
	font-size:1.1rem;
	font-weight:500;
	transition:0.4s;
}
nav#main-menu ul li a:hover{
	transition:0.4s;
	color:#ffd100;
}

/* submenu */
li.with-submenu{
	position:relative;
	padding-bottom:25px;
}
li.with-submenu:after{
	content:"+";
	color:#ffd100;
	margin-top:10px;
	margin-bottom:-10px;
	transition:0.4s;
}
ul.submenu{
	display:none;
	position:absolute;
	background-color:#212121;
	width:230px;
	margin-top:5px;
	text-align:left !important;
}

ul.submenu li{
	display:block !important;
	margin:5px 6% !important;
}
ul.submenu li,ul.submenu li a{
	color:#ffffff !important;
	text-align:left !important;
	text-transform:none !important;
	font-size:0.9rem;
	transition:0.4s;
}
nav#main-menu ul li.with-submenu ul.sub-menu li:first-child{
	border:none;
}
li.with-submenu:hover > ul.submenu{
	display:block;
	transition:0.4s
}
li.with-submenu:hover > li.with-submenu:after{
	transition:0.4s;
	content:none;
}
ul.submenu li,ul.submenu li:hover > a{
	transition:0.4s;
	margin-left:5px;
}

/* ------ menu on scroll ------- */
.menuscroll{
	position:fixed;
	z-index:15;
	top:0;
	background-color:#212121;
	padding-bottom:10px;
	padding-top:5px;
	height:25px;
}
.menuscroll nav#main-menu ul li a{
	color:#ffffff;
	font-size:1rem;
}
.menuscroll figure#logo{
	width:70px;
}
.menuscroll aside.rs-top img{
	visibility:hidden;
}


/* --- /// HOMEPAGE /// --- */
figure.citron{
	margin:-160px -5% 100px 5%;
}
figure.citron img{
	width:550px;
}

/* prestations */
article.offre h2.blanc{
	padding:17px 15px 5px 15px;
	border-radius:20px;
	margin:-50px auto 30px auto;
}
article.offre h2.blanc span.grosp{
	display:block;
	margin:-5px 0 5px 0;
}
article.offre{
	-webkit-box-shadow: 3px 3px 15px 5px #d3d3d3;
	box-shadow: 3px 3px 15px 5px #d3d3d3;
	padding:20px 35px 50px 35px;
	position:relative;
}
article.offre h2:before{
	content: " ";
  width: 20px;
  height: 5px;
  border: 1px solid #ffffff;
  display: block;
  transform: rotate(35deg);
  margin: -22px auto 22px 15px;
}
article.offre.offre-jaune h2:before{
	background-color:#ffd100;
}
article.offre.offre-bleu h2:before{
	background-color:#21aa93;
}
article.offre.offre-orange h2:before{
	background-color:#fc8210;
}

span.trait{
	width:100%;
	height:1px;
	display:block;
}
article.offre span.trait.remonte{
	margin:-40px 0 55px 0;
}
article.offre a.bta.descend{
	position: absolute;
	bottom: -35px;
	left: 30%;
}
article.offre a.bta.plus{
	position:relative;
	z-index:1;
}
article.offre ul{
	list-style-type:disc;
	padding-left:25px;
}
article.offre ul li a{
	color:#212121;
	transition:0.4s;
}
article.offre ul li a:hover{
	transition:0.4s;
	margin-left:7px;
}
article.offre.offre-jaune ul li::marker{
	color:#ffd100;
}
article.offre.offre-bleu ul li::marker{
	color:#21aa93;
}
article.offre.offre-orange ul li::marker{
	color:#fc8210;
}
span.theme{
	font-size:0.9rem;
}

/* numerique responsable */
section.border-top-vertclair{
	border-top:5px solid #8ebf26;
	margin-top:150px;
}
figure.img-num-resp-home{
	width: 35%;
	margin-top: -70px;
	background-color: #fff;
}

/* conseils */
article.picore a.bta{
	margin-top:-15px;
}
article.picore h3:before{
	content: " ";
  width: 17px;
  height: 5px;
  display: block;
  transform: rotate(35deg);
  margin: 50px auto 5px -5px;
}
article.picore h3.before-jaunebis:before{
	background-color:#edca00;
}
article.picore h3.before-rose:before{
	background-color:#ff5757;
}
article.picore h3.before-vertfonce:before{
	background-color:#2aa738;
}

/* about */
section.border-top-rose{
	border-top:5px solid #ff5757;
	margin-top:150px;
	margin-bottom:-30px;
}
a.bta-lk{
	font-size: 1.2rem;
	font-weight: 800;
	padding: 0 10px 1px 10px;
	display:block;
	margin-right:15px;
}

aside.bta-cote-cote a:hover{
	transition:0.4s;
	background-color:#ff5757;
}
a.bta-lk:hover{
	transition:0.4s;
	background-color:#21aa93 !important;
}


/* --- /// PRESTATION /// --- */
p.hastg{
	font-size:2rem;
	font-weight:600;
}
section.border-top-jaune{
	border-top:5px solid #ffd100;
}
section.border-top-bleu{
	border-top:5px solid #21aa93;
}
section.border-top-orange{
	border-top:5px solid #fc8210;
}
article.offre-presta{
	box-shadow:none !important;
	padding:0;
}
article.offre-presta h2.blanc{
	margin:0 auto 30px 0 !important;
}
div.rond{
	width:30px;
	height:30px;
	border-radius:50%;
}
figure.tiret{
	width: 20px;
  height: 7px;
  display: inline-block;
	margin:20px 10px 0 -5px;
}
article.utile,
aside.avantg{
	margin-top:-40px;
}
a.bta.descend-presta{
	margin-bottom:-45px;
}
.border-left-noir{
	padding-left:5%;
	border-left:1px solid #212121;
}

/* et si */
aside.etsi span{
	font-size: 3.5rem;
  font-weight: 900;
  text-shadow: -1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;
  color: #ffd100;
}
section.bg-orange aside.un-quart.etsi span{
 	color:#fc8210 !important; 
}
section.bg-bleu aside.un-quart.etsi span{
 	color:#21aa93 !important; 
}

/* accordion */
#accordion h3:hover{
	cursor:pointer;
}

#accordion h3{
	border-top:1px solid #f8f8f8;
	padding-top:8px;
	padding-bottom:10px;
}


/* --- /// WEBINAIRE SINGLE /// --- */

div.cadre-webinaire .shadow,
article.liste-ress{
	padding:15px;
	-webkit-box-shadow: 3px 3px 15px 5px #d3d3d3;
  box-shadow: 3px 3px 15px 5px #d3d3d3;
  margin:0 0 35px 0;
}
p.tarif{
	width:fit-content;
	padding:0 10px 2px 10px;
}
div.cadre-webinaire .shadow ul,
article.liste-ress ul{
	list-style-type:"○ ";
	margin-left:15px;
}
div.cadre-webinaire .shadow ul li::marker{
	color:#fc8210;
}
article.proch-date{
	margin:30px 0;
}
article.proch-date a{
	transition:0.4s;
}
article.proch-date a:hover{
	transition:0.4s;
	margin-left:5px;
}
div.txt-webinaire ul,
div.txt-ressource ul{
	list-style-type:"▬ ";
	margin-left:5%;
}
div.txt-webinaire ul li::marker{
	color:#fc8210;
}
div.txt-ressource ul li::marker,
.single-ressource ul li::marker{
	color:#ff5757;
}


/* --- /// GLOSSAIRE /// --- */
article.lettre{
	width:12%;
	margin:20px 1%;
}
/* popup */
figure.button{
	cursor: pointer;
	transition: all 0.3s ease-out;
}
.overlay {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.7);
  transition: opacity 500ms;
  visibility: hidden;
  opacity: 0;
  overflow:auto;
  z-index:10;
}
.overlay:target {
  visibility: visible;
  opacity: 1;
}

.popup {
  margin: 70px auto;
  padding: 30px;
  background: #fff;
  width: 40%;
  position: relative;
  transition: all 5s ease-in-out;
}

.popup h2 {
  margin-top: 0;
  color: #212121;
  font-size: 1.2rem;
  font-weight: 600;
  border-top: 1px solid #f5f5f5;
  padding-top: 10px;
  padding-bottom: 15px;
}
.popup h2:first-child{
	border-top:0;
}
.popup h2:hover{
	cursor:pointer;
}
.popup .close {
  position: absolute;
  top: 0px;
  right: 20px;
  transition: all 200ms;
  font-size: 30px;
  font-weight: bold;
  text-decoration: none;
  color: #ffd100;
  z-index:6;
}
.popup .close:hover {
  color: #2aa738;
}
.popup .content {
  max-height: 30%;
  overflow: auto;
}

@media screen and (max-width: 700px){
  .box{
    width: 70%;
  }
  .popup{
    width: 70%;
  }
}


/* suggestion */
article.sugg-gloss{
	width:24%;
	-webkit-box-shadow: 3px 3px 15px 5px #d3d3d3;
	box-shadow: 3px 3px 15px 5px #d3d3d3;
	padding:15px 1%;
}


/* --- /// LE BLOG /// --- */
article.article-blog p.date{
	font-size:0.7rem;
	margin-bottom:0;
}
article.article-blog a.bta.bg-noir{
	margin-top:-15px;
	transition:0.4s;
	color:#ffffff !important;
	text-decoration:none;
}
article.article-blog a.bta.bg-noir:hover{
	transition:0.4s;
	background-color:#ffd100;
}
article.article-blog h2{
	font-size: 1.1rem;
  font-weight: 500;
  margin-top: -5px;
  line-height: 1.4;
}

/* single blog */
section.fullgeo {
  background-image: url("blog/images/bg4.png");
  background-repeat: repeat;
  text-align: center;
	padding-bottom:25px;
}
section.fullgeo a{
	color:#212121;
	transition:0.4s;
}
section.fullgeo a:hover{
	color:#ff5757;
	transition:0.4s;
}
.article-blog a{
	text-decoration:underline;
	color:#212121;
}

.article-blog a.bta.bg-noir{
	color:#ffffff;
	text-decoration:none;
	transition:0.4s;
	margin:25px auto 50px auto;
}
.article-blog a.bta.bg-noir:hover{
	background-color:#ffd100;
	transition:0.4s;
}

h1.titreblog,
span.faux-titreblog{
	font-size:40px;
	margin:0 0 35px 0;
	font-weight:500;
	text-align:center;
}
h1.titreblog span{
	font-size:40px;
	font-weight:500;
}
h1.h1like-p{
	font-size:18px;
	font-weight:600;
}
img#illus-top-blog {
  width: 100%;
  max-width: 700px;
  display: block;
  margin: 0 auto;
  height: auto;
}
img.imgdansarticle{
	max-width:500px;
}
section.post-content-wrap img{
	width:50%;
}
section.post-content-wrap ul{
	list-style-type:disc;
	margin-left:3%;
}
section.post-content-wrap ol{
	margin-left:3%;
}
section.post-content-wrap b,
section.post-content-wrap strong,
section.post-content-wrap strong span,
section.post-content-wrap b span{
	font-weight:600 !important;
}
section.post-content-wrap a{
	text-decoration:underline;
	color:#212121;
	transition:0.4s;
}
section.post-content-wrap a:hover{
	text-decoration:none;
	transition:0.4s;
}
section.post-content-wrap h2,
section.post-content-wrap h2 span{
	margin:70px 0 20px 0;
	font-size:1.5rem;
	font-weight:600;
}
section.post-content-wrap h3,
section.post-content-wrap h3 span{
	font-size: 1.2rem;
  font-weight: 600;
  margin:25px 0 5px 0;
}
span.chapo-blog,
span.chapo-blog a,
span.chapo-blog span,
span.chapo-blog strong,
span.chapo-blog b,
span.chapo-blog ul li{
	font-size:18px;
}
span.rougeohey{
	color:#DC7B65;
}
span.barre{
	text-decoration:line-through;
}
span.goth{
	font-family:'Quicksand',Tahoma,sans-serif;
}
span.grosgoth{
	font-size:26px;
}
p span.mediumgoth{
	font-size:20px;
}
p.font18{
	font-size:18px;
}
p.retrait{
	padding-left:2%;
	border-left:2px solid #edca00;
	margin:20px 0 20px 5%;
}

section.back-blog a{
	transition:0.4s;
}
section.back-blog a:hover{
	transition:0.4s;
	background-color:#ffd100
}

/* vote blog */
section.vote-blog{
	max-width:850px;
	margin:75px auto;
}
section.vote-blog div.sc-bdb96318-2.jpiktk{
	display:none !important;
}

/* section liane blog */
section#liane{
	text-align:center;
	padding: 20px 0;
	margin: 100px auto 10px auto;
	border-top: 1px solid #e72929;
	border-bottom: 1px solid #e72929;
}
section#liane figure#logo-liane img{
	max-width:180px;
}
.color-liane{
	color:#e72929;
}
.font20{
	font-size:20px;
}

/* filtres */
section#blog ul.filtres li{
	text-transform:uppercase;
	margin: 20px 1%;
	padding: 2px 1% 1px 1%;
	background-color:#ffffff;
	border: 1px solid #212121;
}
section#blog ul.filtres li:hover{
	cursor:pointer;
	transition:0.4s;
	background-color:#212121;
	color:#ffffff;
}
section#blog ul.filtres li.active{
	color:#ffffff;
	background-color:#212121;
}


/* --- /// RESSOURCES /// --- */
article.liste-ress{
	width:26%;
	margin:20px 2% 40px 2%;
}
article.liste-ress ul li::marker{
	color:#ff5757;
}
article.liste-ress a.bta.bg-noir{
	margin:30px auto -30px auto;
	transition:0.4s;
}
article.liste-ress a.bta.bg-noir:hover{
	background-color:#ff5757;
	transition:0.4s;
}
article.liste-ress p.tarif{
	margin:-15px auto 20px -15px;
}

/* single */
section.bg-noir aside.etsi span{
	color:#212121;
}
.single-ressource ul{
	list-style-type:disc;
	margin-left:5%;
}
.single-ressource ul li::market{
	color:#ff5757;
}



/* --- /// NEWSLETTER /// --- */
span.undeuxtrois,
span.chiffre{
	font-size: 2.5rem;
  font-weight: 900;
  text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
  color: #fff;
}
section.nl ul{
	padding-left:15px;
}
span.chiffre{
	font-size:1.5rem;
	margin-right:5px
}
section.nl{
	position:relative;
	padding-bottom: 20px;
	margin-bottom: -110px;
}
figure#bg-nl{
	position:absolute;
	width: 40%;
  height: 400px;
  right: 10px;
  top: -30px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity:0.4;
  z-index:-2;
}


/* --- /// FOOTER /// --- */
footer#footer{
	border-top:5px solid #212121;
	margin-bottom:0;
	padding-bottom:5px;
}
footer#footer figure.logo-footer img{
	width:120px;
}
footer#footer a{
	color:#212121;
}
footer#footer figure.logo-footer{
	width:12%;
}
footer#footer aside{
	width:24%;
	padding-left: 20px;
	border-left: 2px solid #ffd100;
}
.membre ul{
	list-style-type:"·";
}
.menu-plan ul{
	list-style-type:"-";
}
.membre ul,.menu-plan ul{
	padding-left:12px;
}
.membre ul li a,.menu-plan ul li a{
	transition:0.4s;
	margin-left:5px;
}
.membre ul li a:hover,.menu-plan ul li a:hover{
	transition:0.4s;
	margin-left:10px;
}
aside.coord b a{
	font-weight:600;
	transition:0.4s;
}
aside.coord b a:hover{
	margin-left:5px;
	transition:0.4s;
}


/* --- last footer --- */
.last-footer ul li a{
	font-size:0.75rem;
	transition:0.4s;
}
.last-footer ul li a:hover{
	transition:0.4s;
	color:#edca00;
}
.last-footer ul li:after{
	content:"·";
	color:#edca00;
	font-weight:900;
	margin:0 7px;
}
.last-footer ul li:last-child:after{
	content:none;
}



.nodesk{
	display:none;
}
/* ////////////////////////////////////// RESPONSIVE /////////////////////////////////////// */
@media screen and (max-width: 700px){
	.nomobile{
		display:none !important;
	}
	.nodesk{
	display:block;
	}
	.flexblock,
	.midwidth,
	.un-tiers,
	.deux-tiers,
	.un-quart,
	.trois-quart{
		display:block;
		width:96%;
		margin:20px 2%;
	}
	
	figure#logo-mobile{
		width:100px;
		position:relative;
		z-index:10;
	}
	
	/* --- MENU BURGER --- */
	header#header-mobile{
		margin: 0;
		display:block;
	}
	#hamburger-button {
		position:absolute;
	  z-index: 70000;
	  display: inline-block;
	  height:50px;
	  width:50px;
	  top: 15px;
	right: -10px;
	padding: 20px;
	}

	#hamburger-button:hover {
	  cursor:pointer;
	}

	#hamburger-button > span {
	  display: block;
	  height: 4px;
	  margin-bottom: 6px;
	  width: 30px;
	  background-color:#212121;
	  border-radius:5px;
	 -webkit-transition-timing-function: linear; /* Safari and Chrome */
	transition-timing-function: linear;
	transition-duration:0.6s;
	}
	
	#hamburger-button > span:first-child{
		width:26px;
	}
	#hamburger-button > span:last-child{
		width:22px;
	}

	#hamburger-button.open > span:first-child {
	-webkit-transform: translateY(9px) rotate(45deg); /* Chrome, Safari, Opera */
	transform:translateY(9px) rotate(45deg);
	width:30px;
	}


	#hamburger-button.open > span:nth-child(2) {
	   -webkit-transform: rotateY(90deg); /* Safari */
		transform: rotateY(90deg);
	  /* rotates the second child on the Y AXIS ONLY 90 degrees so it disappears into a point */
	}

	#hamburger-button.open > span:last-child {
	 -webkit-transform: translateY(-10px) rotate(-45deg); /* Chrome, Safari, Opera */
		transform: translateY(-10px) rotate(-45deg);
		width:30px;
	}


	.navbar{
	  position:absolute;
	  opacity:.975;
	  z-index:3; /*so its above the content but below the burger button*/
	  height:100vh;
	  width: 100vw;
	  left:-100vw;
	  transition:1s;
	  background-color:rgba(255,255,255,0.985);
	  color:white;
	  top:-20px;
	  padding-top:20px;
	}

	.navbar.open{
	  left:0;
	}
	.navbar ul{
	  list-style:none;
	  margin-top:150px;
	  font-size:1.1em;
	  margin-left:10%;
	}

	.navbar ul li{
	  margin-bottom: 10px;
		padding: 5px;
		text-transform: uppercase;
	}
	.navbar ul li a{
		text-transform: uppercase;	
		color:#212121;
		font-size:1.1rem;
		font-weight:500;
	}
	.navbar ul li:hover{
	  cursor:pointer;
	}
	li.with-submenu:after{
		content:" ";
	}
	.navbar ul.submenu{
		display:block;
		position:relative;
		display:block;
		background-color:transparent !important;
		margin-top:0;
		margin-left:2%;
	}
	.navbar ul.submenu:before{
		content:none;
	}
	.navbar ul.submenu li,
	.navbar ul.submenu li a{
		color:#1d1d1b !important;
	}
	
	section.all{
		width:96%;
		padding:30px 2%;
		margin:20px auto;
	}
	
	/* HOMEPAGE */
	figure.citron{
		width: 100%;
		margin: 10px auto;
		display: block;
	}
	figure.citron img{
		width:100%;
	}
	article.offre{
		padding:15px 10px 40px 10px;
		width:90%;
		margin:25px auto 110px auto;
	}
	figure.img-num-resp-home{
		width:95%;
	}
	
	
	/* PRESTATION */
	article.utile div.flexblock{
		display:flex;
	}
	article.utile{
		margin:10px 0;
	}
	div.rond{
		display:none;
	}
	.border-left-noir{
		padding-left:0;
		border:none;
	}
	aside.un-quart.avantg div.flexblock.blanc{
		display:flex;
		margin:30px 0;
	}
	
	
	/* LE BLOG */
	h1.titreblog, span.faux-titreblog{
		font-size:1.4rem;
		line-height:1.5;
	}
	P.sst-blog,
	P.sst-blog a{
		font-size:0.8rem;
	}
	
	/* CONSEILS */
	article.liste-ress{
		width:88%;
	}
	
	/* glossaire */
	section#glossaire div.capsule.flexblock.wrap{
		display:flex;
		flex-wrap:wrap;
	}
	section#glossaire article.lettre.box{
		width: 29%;
		margin: 20px 2%;
	}
	section#glossaire article.sugg-gloss{
		width:96% !important;
	}
	
	
	/* NEWSLETTER */
	figure#bg-nl{
		width:100%;
		right:0;
		bottom:-30px;
		top:auto;
	}
	
	
	/* FOOTER */
	footer#footer figure.logo-footer img{
		width:65px;
	}
	footer#footer aside{
		width:100%;
	}
	footer#footer div.rs-footer{
		display:flexblock;
	}
	.rs-footer img{
		width:35px;
	}
	div.last-footer ul{
		margin-top:40px;
		display:flex;
		flex-wrap:wrap;
	}
	
	
	
	
}




