/* :::::[ Tablette horizontale ]::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media only screen and (max-width: 1750px) {
.psbdelest-02 > img{left:17%;}
.diagonal{	width:90%}
}

@media only screen and (max-width: 1500px) {

.psbdelest-02 > img{left:10%;}
.psbdelest-02 > div{ width:70%; }

.parallelogramme{width:40%;}
}

@media only screen and (max-width: 1200px) {

.intro{display:flex; flex-wrap: wrap;  }

header .soumission{	float:right; padding-top:4%; text-align:right; background:url(../images/fleche.png) no-repeat right top; height:163px; background-size:auto 163px;  }
.sciagebeton-01, .psbdelest-01{width:80%;position:relative; }
.psbdelest-01{ order:1;  margin: 0 0 0 auto; top:0}
.sciagebeton-01 {order:2; top:10px }
.diagonal{/*display:none;*/ position:absolute; top:35%; left:5%}
h1{	width:60%; font-size:44px;}
.psbdelest-02 > img{ left:25px; }
h1{	font-size:30px; }
h2{	font-size:60px; }
h3{	font-size:30px; }
h4{	font-size:22px; }
.style01{ font-size:30px;}
.swiper-slide span{	font-size:30px;}
.realisation-intro{font-size:40px; }

.sciagebeton-02{flex-direction: column;}
.sciagebeton-02 img{width:80%; margin:0 auto 5% 0; order:2}
.sciagebeton-02 div{text-align:center; margin: 5%; order:1}
.parallelogramme{width:50%; margin:0 auto}


.sciage h2, .psb h2{font-size:55px}
}


/* :::::[ tablette verticale ]:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media only screen and (max-width: 1008px) {
h1{	font-size:35px; }
header h1 em{	display:inline-block; font-style:normal}
header .soumission{	  font-size:17px; padding-left:25px}

.psbdelest-02 > div{width:100%; margin:0 auto; padding:0 5% 0 20%; box-sizing:border-box; text-align:right; flex-direction: column }
.psbdelest-02 > div > div > img{ max-width:650px; width:100%; height:auto;}

.territoire span{ font-size:30px; }
.territoire strong{ font-size:25px; }

.sciagebeton-02 img{width:90%; padding:0 }

.parallelogramme2 .contenu{flex-direction: column }
.parallelogramme2 ul{width:100%;}
.parallelogramme2 ul:first-child, .parallelogramme2 ul:nth-child(2), .parallelogramme2 ul:nth-child(3){padding-top:0}
.realisation-intro img.hvr-pop{width:70px; height:auto }

footer{ flex-direction: column; justify-content:center }
footer > div:first-child{width:100%; margin:0 auto; text-align:center; }
footer > div img{margin:0 auto; }
.parallelogramme{width:75%; }
}

/* :::::[ 480 PIXELS LAYOUT (IPHONE HORIZONTALE et VERTICALE)]::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media only screen and (max-width: 752px) {
body{background:url(../images/bg-beton.png) repeat-y top center #ffffff ; background-size:100% auto;}
header{flex-direction: column;}
header .soumission{	  text-align:center; background:url(../images/fleche.png) no-repeat center top; padding:25px 0 0 0}




.intro img.hvr-wobble-vertical{	width:40px; height:auto }
/*.intro .logo2{	width:50%; }*/
.intro .logo1{	width:80%; }
.sciagebeton-01 div{right:15%; bottom:20px;}
.psbdelest-01 div{left:10%;  top:0; bottom:20px}

.intro > div > a > div span{ margin:10px 0; font-size:20px; font-family: 'Uniform-Medium';}

.territoire, .territoire span{ font-size:20px; }
.territoire strong{ font-size:22px; }

.parallelogramme{
width:100%;
-webkit-transform:skew(0);
-moz-transform:skew(0);
-o-transform:skew(10);
tranform:skew(0);
}

.parallelogramme div{
-webkit-transform:skew(0);
-moz-transform:skew(0);
-o-transform:skew(0);
tranform:skew(0);

}
 }

/*:::::[ 320 PIXELS LAYOUT (iphone vertical) ]::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
@media only screen and (max-width: 464px) {



.intro{ margin:25px 0 50px 0;}
header .soumission{	  background-size:100% auto;}
h2{	font-size:40px; }
.sciage h2, .psb h2{font-size:35px}


.sciagebeton-01, .psbdelest-01{width:100%; overflow: hidden;}
.img-sciagebeton-01, .img-psbdelest-01{width:150%; }
.img-psbdelest-01{margin-left:-130px}

.psbdelest-02 > img{ left:0; }
.psbdelest-02 > div{padding:0 5%; }
.parallelogramme{width:100%;}


.intro > div > a > div {position:relative;  margin-bottom:20px}
.sciagebeton-01 div{right:0; left:0; bottom:0px; top:0}
.psbdelest-01 div{left:0; right:0;  top:0px}
.intro > div > a > div span{ color:#4b4b4c;}

.sciagebeton-02{width:100%; overflow: hidden;}
.sciagebeton-02 img{	width:140%}

.intro .diagonal{display:none }

.realisation-intro > div > a > div {position:absolute; }
.realisation-intro .sciagebeton-01 div{ bottom:0px; top:15px; font-size:24px; font-family: 'Uniform-Medium';}
.realisation-intro .psbdelest-01 div{ top:15px; font-size:24px; font-family: 'Uniform-Medium';}
/*
.realisation-intro .sciagebeton-01 div{top:110px;}
.realisation-intro .psbdelest-01 div{ top:110px}
.realisation-intro .psbdelest-01 div img, .realisation-intro .sciagebeton-01 div img{padding-top:25px}
.realisation-intro .sciagebeton-01{ top:0; left:0}
.realisation-intro .psbdelest-01{ top:0; right:0}*/