@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700,800,900');


body{background:url('../img/wall.jpg')no-repeat center center;background-size: cover;width:100%; position:relative;font-family:'Montserrat';font-size: 16px}

.gun{position:absolute;top:100px;left:-150px;right:50%;}
.gun img {max-width:75%;height:auto;}

.manette{position:absolute;bottom:200px;right:-450px;left:70%;}
.manette img {max-width:75%;height:auto;}

.container{position:relative;background-color:#efe7d4;max-width:700px;width:100%;margin:0 auto 0 auto;padding:50px;margin-top:100px;margin-bottom:100px;box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.47);box-sizing: border-box;}
.container .link{position:absolute;bottom:15px;left:0;right:0;width:100%;text-align:center;display:block;color:#ec1c24;text-transform:uppercase;text-decoration:none;}

.emplois {border:3px dashed #ec1c24;position:relative;}
.emplois .emplois-cont{padding:20px 30px 20px 30px;box-sizing: border-box;}
.emplois hr{border-bottom:0;border-left:0;border-right:0;border-top:3px dashed #ec1c24;margin-left:5px;margin-right:5px;}
.emplois img{width:100%;height:auto;display:block;}
.emplois .logo{width:150px;height:auto;margin:-28px auto 0 auto;}
.emplois .first, .emplois .second, .emplois .third, .emplois .fourth{text-align:center; display:block;font-weight:900;text-transform:uppercase;padding:0;margin:0;white-space: nowrap;}
.emplois .first{color:#ec1c24}
.emplois h2{text-transform:uppercase;font-weight: 900;font-size:35px;margin:0;padding:0;line-height: 110%;}
.emplois a{color:#ec1c24;text-decoration: none;}
.emplois ul{margin-left:0;padding-left:20px;list-style:  square;margin-bottom:0;padding-bottom:0;}
.emplois .btn{background-color:#ec1c24;color:#ffffff;display:block;text-align:center;text-transform: uppercase;padding:20px 0 20px 0;font-weight:900;font-size:25px;transition:0.3;}
.emplois .btn:hover{background-color:#212121;}




/* ============================= */
/* ==  STRUCTURE ADAPTATIVE   == */
/* ============================= */


/*
====================================================================================================================
 BIGGEST SCREEN EVER  
====================================================================================================================
*/

@media screen and (min-width:2000px){

}


/*
====================================================================================================================
 BIG SCREEN 
====================================================================================================================
*/

@media screen and (min-width:1600px) and (max-width:1999px){

}


/*
====================================================================================================================
 NORMAL SCREEN 
====================================================================================================================
*/

@media screen and (min-width:1280px) and (max-width:1599px) {


}


/*
====================================================================================================================
 SMALL SCREEN 
====================================================================================================================
*/

@media screen and (min-width:1025px) and (max-width:1279px) {

}


/*
====================================================================================================================
 IPAD 
====================================================================================================================
*/

@media screen and (min-width:768px) and (max-width:1024px) {
	.gun, .manette{display:none;}
	.emplois h2{font-size:20px;}
}


/*
====================================================================================================================
 IPHONE PAYSAGE 
====================================================================================================================
*/ 

@media screen and (min-width:431px) and (max-width:767px) {
	body{font-size: 14px}
	.gun, .manette{display:none;}
	
	.container{padding:20px 20px 50px 20px;max-width:400px}

	.emplois h2{font-size:20px;}
	.emplois .btn{font-size:20px;}
}


/*
====================================================================================================================
 IPHONE PORTRAIT
====================================================================================================================
*/

@media screen and (max-width:430px) {
	body{font-size: 14px}
	.gun, .manette{display:none;}
	.container{padding:20px 20px 50px 20px;}
	.emplois .emplois-cont{padding:10px 15px 10px 15px;box-sizing: border-box;}
	.emplois h2{font-size:17px;}
	.emplois .btn{font-size:20px;}
}