@media only screen and (max-width:1700px) {
	.realisations article div h3 {
	margin-top:15%;
	font-size:16px
	}

	.realisations article div p { font-size:12px }

	.realisations article div a:nth-child(3), .realisations article div a:nth-child(3):hover,
	.realisations article div a:nth-child(4), .realisations article div a:nth-child(4):hover {
	width:60%;
	font-size:11px;
	margin:0 20% 10px 20%
	}
}

@media only screen and (max-width:1600px) {
	.contentMid, #nav {
	width:80%;
	margin:0 10%
	}

	#savoirINC .savoirFaire1 h3, #savoirINC .savoirFaire2 h3 {
	font-size:20px;
	margin:20px 0 10px 0
	}
}

@media only screen and (max-width:1500px) {
	.titleHomeBlue32, .titleHomeWhite32 { font-size:28px }
	.titleHomeBlue44, .titleHomeRed44 {	font-size:38px }
	.ssTitleGrey18, .ssTitleWhite18 { font-size:16px }

	.savoirFaire1 h3, .savoirFaire2 h3 {
	font-size:38px
	}

	.competences > article p:nth-child(2) { font-size:13px }

	a.filterReal, a.tagsTriOFF, a.tagsTriON:hover,
	a.filterReal:hover, a.filterReal:active, a.tagsTriON, #all, #all:hover {
	font-size:12px;
	width:14%;
	-webkit-border-radius:16px;
	-moz-border-radius:16px;
	border-radius:16px;
	margin:0 1% 10px 1%;
	padding:4px 8px
	}
}

@media only screen and (max-width:1400px) {
	.contentMid { padding:0 10px }

	.ssTitle { font-size:32px }
}

@media only screen and (max-width:1300px) {
	.titleHomeBlue32, .titleHomeWhite32 { font-size:24px }
	.titleHomeBlue44, .titleHomeRed44 {	font-size:28px }
	.ssTitleGrey18, .ssTitleWhite18 { font-size:14px }
	.titleHomeBlue26 { font-size:22px }
	.titlePageRed28 { font-size:23px }

	.savoirFaire1 h3, .savoirFaire2 h3 {
	font-size:28px
	}

	.pageTitle, .pageTitle2 { font-size:24px }

	.realisations article div a:nth-child(3), .realisations article div a:nth-child(3):hover,
	.realisations article div a:nth-child(4), .realisations article div a:nth-child(4):hover {
	padding:8px 30px
	}
}

@media only screen and (max-width:1200px) {
	.contentMid, #nav {
	width:100%;
	margin:0
	}

	#pageContent {
	min-height:400px;
	padding:40px 0
	}

	a.deroulePresta, a.deroulePresta:hover {
	font-size:15px;
	padding:10px 12px
	}

	.prestaList a, .prestaList a:hover { font-size:13px }

	.competences > article p:nth-child(2) { font-size:11px }

	.realisations article div h3 { margin-top:10% }

	body { font-size:14px }

	#leftReal { width:40% }
	#rightReal { width:56% }
}

@media only screen and (max-width:1100px) {
	.competences > article {
	width:17%;
	margin:0 1% 5px 1%
	}

	.realisations article { width:50% }

	.realisations article div h3 { margin-top:20% }

	#contactForm label {
	font-weight:900;
	font-size:16px;
	margin:0 0 8px 0
	}

	#contactForm input[type=text], input[type=tel], input[type=email], textarea {
	font-weight:300;
	font-size:12px;
	padding:4px 8px
	}

	#contactForm select {
	border:solid 2px #F3F2F2;
	font-weight:300;
	font-size:12px;
	padding:4px 8px	
	}

	.blocTitle { padding:20px 0 40px 0 }

	.blocTitle h2 { font-size:40px }

	a.filterReal, a.tagsTriOFF, a.tagsTriON:hover,
	a.filterReal:hover, a.filterReal:active, a.tagsTriON, #all, #all:hover {
	font-size:12px;
	width:23%;
	-webkit-border-radius:16px;
	-moz-border-radius:16px;
	border-radius:16px;
	margin:0 1% 10px 1%;
	padding:4px 8px
	}
}

@media only screen and (max-width:1000px) {
	body { font-size:14px }

	.txt10 { font-size:12px }
	.txt20 { font-size:16px }
	.txt30 { font-size:20px }

	.Muli30 { font-size:25px }
	.Muli40 { font-size:35px }
	.Muli60 { font-size:50px }
	.Muli80 { font-size:70px }

	.Muli28 { font-size:25px; font-family:"Muli", sans-serif }
	.Muli26 { font-size:23px; font-family:"Muli", sans-serif }
	.Muli24 { font-size:21px; font-family:"Muli", sans-serif }
	.Muli22 { font-size:19px; font-family:"Muli", sans-serif }
	.Muli20 { font-size:17px; font-family:"Muli", sans-serif }
	.Muli18 { font-size:15px; font-family:"Muli", sans-serif }
	.Muli16 { font-size:13px; font-family:"Muli", sans-serif }
	.Muli14 { font-size:12px; font-family:"Muli", sans-serif }
	.Muli12 { font-size:11px; font-family:"Muli", sans-serif }

	#nav ul li a:not(.redLiHome) {
	font-size:11px;
	padding:3px 0 4px 0
	}

	#nav ul li a:not(.redLiHome):hover { font-size:11px }

	a.redLiHome, a.redLiHome:hover {
	font-size:11px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	padding:8px 16px
	}

	#competence_wrap > .contentMid .buttonMore, #competence_wrap > .contentMid .buttonMore:hover {
	width:50%;
	margin:30px 25% 0 25%
	}

	#competence_wrap > .contentMid .buttonMore, #competence_wrap > .contentMid .buttonMore:hover,
	#realisation_wrap .buttonMore, #realisation_wrap .buttonMore:hover, .otherReal .buttonMore, .otherReal .buttonMore:hover {
	width:40%;
	margin:25px 30% 0 30%
	}

	#devisBTN { text-align:center }

	a.devisLK, a.devisLK:hover, a.devisLK:active, a.devisLK2, .devisLK2, a.devisLK2:hover, a.devisLK2:active, .devisLK2:hover {
	width:31%;
	font-size:11px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	margin:0 1% 10px 1%;
	padding:6px 10px
	}

	#devis ::placeholder { font-size:12px }

	#devis p:not(.titleHomeBlue26) { font-size:12px }

	#devis label {
	font-size:16px;
	margin:0 0 5px 0
	}

	#devis input[type=text], #devis input[type=tel], #devis input[type=email], #devis select {
	font-size:12px;
	margin:0 0 10px 0;
	padding:5px
	}

	#devis textarea {
	height:150px;
	font-size:12px;
	margin:0 0 10px 0;
	padding:5px
	}

	#devis input[type=radio] {
	margin:0 5px 10px 15px;
	padding:0
	}

	.savoirFaire1, .savoirFaire2, #savoirINC .savoirFaire1, #savoirINC .savoirFaire2 {
	width:50%;
	margin:0 0 15px 0
	}

	#compeFullPage a, #compeFullPage a:hover {
	width:21%;
	border:solid 1px #DBDADA;
	margin:0 2% 25px 2%;
	padding:5px 15px
	}

	#compeFullPage a > img {
	width:100%;
	margin:0
	}

	#compeFullPage span:before {
	left:30%;
	height:1px;
	width:40%;
	border-bottom:solid 2px #DBDADA
	}

	#compeFullPage span {
	float:left;
	width:100%;
	height:60px;
	font-size:16px;
	margin:25px 0 25px 0;
	padding:25px 0 0 0
	}
	
	.wrap_news2 > p, .wrap_news > p { font-size:12px }

	.wrap_news2 h3, .wrap_news h3 { font-size:14px }

	.wrap_news2 h3 a, .wrap_news2 h3 a:hover,
	.wrap_news h3 a, .wrap_news h3 a:hover { font-size:14px }
}

@media only screen and (max-width:900px) {
	#nav {
	width:100%;
	margin:0
	}

	.cookie-message p:nth-child(1) { width:100% }
	.cookie-message p:nth-child(2) { width:100%; margin:10px 0 0 0 }

	#preHeader .contentMid div { display:none }

	.titleHomeBlue44, .titleHomeRed44 {	font-size:22px }

	.savoirFaire1 h3, .savoirFaire2 h3 {
	font-size:22px
	}

	.titleRed21 { font-size:18px }
	.titleHomeBlue26 { font-size:20px }

	.titlePageRed28 { font-size:21px }

	#headerMobile3 { display:none }

	.imgComp { width:80% }

	.ibsLogos img {
	width:35%;
	height:auto;
	margin:0 2%
	}

	.PQP-widget {
	font-size:14px !important;
	top:5px !important;
	right:5px !important;
	left:auto !important
	}
}

@media only screen and (max-width:850px) {
	#contactForm .case1dA, #contactForm .case1dB {
	width:100%;
	margin:0 0 15px 0
	}

	.ssTitle { font-size:24px }

	.blocTitle { padding:15px 0 20px 0 }

	.blocTitle h2 { font-size:32px }

	#pageContent {
	min-height:200px;
	padding:20px 0
	}

	#preHeader, #header { display:none }

	#headerMobile, #headerMobile2, #headerMobile3 { display:block }

	#recherche2 {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	width:75%;
	margin:0;
	padding:0 5px
	}

	#headerMobile2 > a {
	display:inline-block;
	vertical-align:middle;
	width:75%;
	margin:0;
	padding:0 5px
	}

	#recherche2 > a {
	width:100%
	}

	#recherche2 > a > img, #headerMobile2 > a > img {
	max-width:250px;
	width:100%;
	height:auto
	}

	#headerMobile div, #headerMobile2 div {
	display:inline-block;
	vertical-align:middle;
	width:23%;
	margin:0;
	padding:0 5px
	}

	#headerMobile div > a:not(#MLclose2):not(#MLcheck) {
	display:inline-block;
	float:left;
	width:50%;
	text-align:center;
	color:#E50947;
	font-size:16px;
	font-weight:bold;
	margin:0;
	padding:0
	}

	#headerMobile2 div > a {
	display:inline-block;
	float:left;
	width:50%;
	text-align:center;
	color:#E50947;
	font-size:16px;
	font-weight:bold;
	margin:0 0 0 50%;
	padding:0
	}

	#MLclose2, #MLcheck {
	display:none;
	float:left;
	width:50%;
	text-align:center;
	color:#E50947;
	font-size:16px;
	font-weight:bold;
	margin:0;
	padding:0
	}

	#search_key2 {
	position:absolute;
	vertical-align:middle;
	color:white;
	width:100%;
	background-color:#123565;
	border:solid 2px #5B81B5;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px;
	font-size:12px;
	margin:0;
	padding:10px 15px;
	top:30%;
	left:0
	}

	.environnement img {
	width:10%;
	margin:0 2%
	}

	.references img {
	width:24%;
	margin:0 3% 40px 3%
	}

	#devis .casei { display:none }

	#devis .case1dA, #devis .case1dB {
	width:100%;
	margin:0 0 10px 0
	}

	a.voirURL, a.voirURL:hover {
	font-size:11px;
	-webkit-border-radius:14px;
	-moz-border-radius:14px;
	border-radius:14px;
	padding:6px 14px
	}

	#compeFullPage a, #compeFullPage a:hover {
	width:29%;
	margin:0 1% 20px 1%;
	padding:5px 12px
	}

	#compeFullPage span {
	float:left;
	width:100%;
	height:50px;
	font-size:14px;
	margin:20px 0;
	padding:20px 0 0 0
	}

	#actuWrap .wrap_news2 {
	width:100%;
	margin:0 0 40px 0
	}

	.actualites .wrap_news:nth-child(1), .actualites .wrap_news:nth-child(3), .actualites .wrap_news:nth-child(2) {
	width:100%;
	margin:0 0 40px 0
	}
}

@media only screen and (max-width:800px) {
	#left, .alogo_mob,#content, #content ul { display:block }

	.realisations article img {
    -moz-transition:none;
    -webkit-transition:none;
    -o-transition:color 0 ease-in;
    transition:none;
	}

	.realScale {
	-moz-transform:none;
	-webkit-transform:none;
	transform:none
	}

	#leftReal,#rightReal { width:100% }

	#header_pc { display:none }
	#header_mob { display:block }

	#logo_mob {
	position:relative;
	z-index:0;
	float:left;
	width:60%;
	height:auto;
	margin:8px 20% 2px 20%;
	padding:0;
	top:0;
	left:0
	}

	.noMob { display:none }

	#home { display:block; width:30px; height:auto; z-index:9999; position:absolute; top:10px; left:10px; outline:none }
	#setting2 { display:block; width:30px; height:auto; z-index:9999; position:absolute; top:10px; right:10px; outline:none }

	#left {
	background-color:white;
	color:black;
	-webkit-overflow-scrolling:touch;
	display:none;
	overflow:auto;
	position:fixed;
	z-index:9999;
	width:85%;
	height:100%;
	top:0;
	bottom:0;
	left:-85%;
	padding:0;
	-webkit-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
	   -moz-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		-ms-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		 -o-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
			transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750);

	-webkit-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
	   -moz-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		-ms-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		 -o-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
			transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
	}

	#right {
	background-color:white;
	color:black;
	-webkit-overflow-scrolling:touch;
	display:none;
	overflow:auto;
	position:fixed;
	z-index:9999;
	width:85%;
	height:100%;
	top:0;
	bottom:0;
	left:100%;
	padding:0;
	-webkit-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
	   -moz-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		-ms-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		 -o-transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750); 
			transition: all 250ms cubic-bezier(0.250, 0.250, 0.750, 0.750);

	-webkit-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
	   -moz-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		-ms-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
		 -o-transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750); 
			transition-timing-function: cubic-bezier(0.250, 0.250, 0.750, 0.750);
	}

	#logo_mob img {
	width:100%;
	height:auto
	}

	#footer .contentMid {
	display:flex;
	flex-direction: column-reverse
	}

	#footerLinks { width:100%; float:right }

	#footer aside {
	float:right;
	width:100%;
	text-align:center;
	margin:25px 0 0 0;
	padding:0 0 5px 0
	}

	#footer aside > img { width:30% }

	#footer section { width:100%; margin-bottom:25px }

	#footer section ul {
	width:100%;
	margin:0
	}

	#footer section ul li {
	width:50%
	}

	#footer {
	background-color:#202b51;
	background:#202b51 !important;
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#202b51', endColorstr='#202b51', GradientType=0);
	padding:20px 0
	}

	.tlStrk {
	float:left;
	width:100%;
	margin:10px 0 25px 0;
	text-align:left;
	text-transform:uppercase;
	font-family:"Muliay", sans-serif;
	font-size:12px;
	font-weight:800;
	color:#E50947;
	position:relative;
	z-index:1
	}

	.tlStrk:before {
	border-top:2px solid #E50947;
	content:"";
	margin:0 auto;
	position:absolute;
	top:40%; left:0; right:0; bottom:0;
	width:95%;
	z-index:-1;
	}

	.tlStrk span {
	padding:0 15px 0 0;
	background-color:#202b51
	}

	.competences > article {
	width:30%;
	margin:0 1% 5px 1%
	}

	.realisations article div h3 { margin-top:8% }

	#competence_wrap > .contentMid .buttonMore, #competence_wrap > .contentMid .buttonMore:hover,
	#news_wrap > .contentMid .buttonMore, #news_wrap > .contentMid .buttonMore:hover,
	#realisation_wrap .buttonMore, #realisation_wrap .buttonMore:hover, .otherReal .buttonMore, .otherReal .buttonMore:hover {
	width:60%;
	margin:20px 20% 0 20%
	}

	.case3rlM, .case1rlM {
	width:100%;
	margin:0 0 20px 0
	}

	.case3rlM { margin-bottom:40px }
}

@media only screen and (max-width:780px) {
	.titleRed21 { font-size:15px }
	.titleHomeBlue26 { font-size:17px }

	.Muli30 { font-size:22px }
	.Muli40 { font-size:30px }
	.Muli60 { font-size:40px }
	.Muli80 { font-size:50px }
}

@media only screen and (max-width:700px) {
	.imgComp { width:100% }

	.savoirFaire1, .savoirFaire2, #savoirINC .savoirFaire1, #savoirINC .savoirFaire2 {
	width:100%;
	margin:0 0 15px 0
	}

	a.filterReal, a.tagsTriOFF, a.tagsTriON:hover,
	a.filterReal:hover, a.filterReal:active, a.tagsTriON, #all, #all:hover {
	font-size:11px;
	width:31%;
	-webkit-border-radius:16px;
	-moz-border-radius:16px;
	border-radius:16px;
	margin:0 1% 10px 1%;
	padding:4px 8px
	}

	#compeFullPage span {
	font-size:12px
	}
}

@media only screen and (max-width:650px) {
	.pictoPH, .pictoPH2 { max-width:22px }

	#preHeader > .contentMid p, #preHeader p > a, #preHeader p > a:hover { font-size:11px }

	.Muli30 { font-size:22px }
	.Muli40 { font-size:25px }
	.Muli60 { font-size:35px }
	.Muli80 { font-size:50px }
}

@media only screen and (max-width:600px) {
	.realisations article { width:100% }

	.realisations article div h3 { margin-top:20% }

	a.devisLK, a.devisLK:hover, a.devisLK:active, a.devisLK2, .devisLK2, a.devisLK2:hover, a.devisLK2:active, .devisLK2:hover {
	width:31%;
	font-size:10px;
	-webkit-border-radius:8px;
	-moz-border-radius:8px;
	border-radius:8px;
	margin:0 1% 10px 1%;
	padding:4px 8px
	}

	#competence_wrap > .contentMid .buttonMore, #competence_wrap > .contentMid .buttonMore:hover,
	#realisation_wrap .buttonMore, #realisation_wrap .buttonMore:hover {
	width:80%;
	margin:20px 10% 0 10%
	}

	#compeFullPage a, #compeFullPage a:hover {
	width:46%;
	margin:0 2% 15px 2%;
	padding:3px 6px
	}
}

@media only screen and (max-width:500px) {
	a.filterReal, a.tagsTriOFF, a.tagsTriON:hover,
	a.filterReal:hover, a.filterReal:active, a.tagsTriON {
	font-size:11px;
	width:48%;
	-webkit-border-radius:16px;
	-moz-border-radius:16px;
	border-radius:16px;
	margin:0 1% 10px 1%;
	padding:4px 8px
	}
}

@media only screen and (max-width:350px) {
	#headerMobile div > a,
	#headerMobile2 div > a { font-size:14px	}

	a.MLnormal, a.MLnormal:hover,
	a.MLradRed, a.MLradRed:hover,
	a.MLradWhite, a.MLradWhite:hover { font-size:12px; margin-bottom:10px }

	#menuLat { margin-top:10px }
}