/* CSS Document */

body, html {margin:0px; height:100%;}
	.oswald {font-family: 'Oswald', sans-serif;}
	.roboto {font-family: 'Roboto Slab', serif;}
	.red {color:#c1272c}

h1, h2, h3, h4 {display:inline-block; font-size:inherit; font-weight:inherit; margin:0px; padding:0px }
    .motion-linear {-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear;}
	header {width:100%; background-image:url(../img/bg-header.jpg); background-size: cover; background-repeat: no-repeat; height:500px; }
	header .border {height:50px; background-color:#ec2323; opacity:0.6; position: fixed; width: 100%; z-index:1000;}
	header .menu {width:100%; background-image:url(../img/img-menu.jpg); height:50px; border-bottom:2px solid #fff; margin:0px auto; text-align: center; position: fixed; margin-top: 50px; z-index:2000}
	header .content {width:100%; margin:0px auto; max-width: 1020px}
header .content img{width:290px;margin-top:-23px; position: fixed; margin-left:10px}
header .burger {display: none}
/* header .menu-mobile {display: none} */



	header .btn {color:#fff; text-transform:uppercase;  display: inline-block; vertical-align:top; border-right:1px solid #fff; padding-top:14px; padding-bottom:12px; padding-right:20px; padding-left:20px; cursor: pointer}
 header .btn:hover {color:#000; -webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear; font-weight: 500;}
header .wrapper-padding {width:100%; max-width: 1020px; margin:0px auto}
	header .wrapper {width: 320px;}
	header .title {text-transform:uppercase; font-size:18px; margin-top:220px; display: inline-block; vertical-align: top; margin-left:20px}
	header .line {width:130px;border-bottom:1px solid #fff; display:inline-block; vertical-align:bottom; font-size:0px; margin-left:10px}
	header .subtitle {text-transform:uppercase; font-size: 40px; color:#fff; line-height:40px; margin-top:10px; margin-left:20px}
	
	#level1 {width:100%; background-color:#fff; background-image:url(../img/img-bottom.jpg); background-position:bottom; background-repeat: no-repeat; background-size:100%; padding-bottom:30px }
	#level1 .wrapper {max-width:1020px; margin:0px auto; width:90%}
	#level1 .title {font-size:18px; text-transform:uppercase; padding-top:50px}
	#level1 .content {width:45%; padding-top:20px; display:inline-block; vertical-align:top; margin-right:30px; line-height:30px; font-size:14px; padding-bottom: 20px }
	
#level2 {width:100%; background-color:#000;}	
#level2 .line {width:160px; border-bottom:1px solid #fff; display:inline-block; vertical-align:bottom; font-size:0px;}
/*#level2 .wrapper {max-width:1020px; margin:0px auto; width:100%}
#level2 .wrapper img{display:inline-block; vertical-align:top; width:45%} */
#level2 .first {display:inline-block; vertical-align:top; width:100%; height:400px ; background-image:url(../img/img-soudeur.jpg); background-repeat: no-repeat; background-position: -150px 0px; background-size:80%; text-align: right}
#level2 .first .title {text-transform:uppercase; font-size:18px; display:inline-block; vertical-align:top; margin-top:100px; margin-left: 400px}
#level2 .subtitle {color:#fff; text-transform:uppercase; font-size:22px; padding-top:10px}
#level2 .red-line {width:80%; border-top:1px solid #c1272c; margin:0px auto}
#level2 .content-wrapper {max-width:1000px; margin:0px auto; width:100%}
#level2 .content-wrapper .title {text-transform:uppercase; font-size:18px; display:inline-block; vertical-align:top; margin-top:40px}
#level2 .content {color:#fff; font-size:15px; padding-top:10px; padding-bottom:50px; line-height: 25px}
#level2 .bg-bottom {width:100%;}
#level2 .wrapper-padding {width:100%; max-width: 1020px; margin:0px auto}
#level2 .wrapper {width:100%; background-image:url(../img/img-soudeur.jpg); background-size: cover; background-repeat: no-repeat; height:400px; background-position: -100px}
#level2 .title-wrapper {text-align: right; padding-top:100px; padding-right:30px; text-transform: uppercase}


#level3 {width:100%; background-color:#fff; background-image:url(../img/img-bottom.jpg); background-position:bottom; background-repeat: no-repeat; background-size:100%; padding-bottom:30px; }
#level3 .title {text-transform:uppercase; font-size:18px; margin-top:50px; padding-bottom:20px}
#level3 .wrapper {width:100%; margin:0px auto; max-width:1020px}
#level3 .subtitle {margin-top:60px; font-size:18px; text-transform: uppercase; padding-bottom:30px}
#level3 .content-wrapper {display:table; table-layout:fixed;border-collapse:collapse;font-size:0px;}
#level3 .portrait {width:250px; height:auto; display: table-cell; padding-right:3px; vertical-align: bottom}
#level3 img{width:100%}
#trailer {width:99%; height:100%; padding-top:2px; padding-bottom:10px}

#contact {background-color:#c1272c; width:100%; }
#contact .wrapper {width:100%; max-width:1020px; margin:0px auto}
#contact .content-left {width:50%; display: inline-block; vertical-align: top}
#contact .content-right {width:49%;  display: inline-block; vertical-align: top}
#contact .title {text-transform: uppercase; font-size:18px; color:#fff; padding-top:40px}
#contact li{list-style: none; }
#contact .hours {width:100%;max-width:800px}
#contact .day-wrapper {display: inline-block; vertical-align: top; max-width:460px; width:40%; padding-top:20px; font-size:14px; color:#d5d5d5}
#contact .subtitle {width:100%; max-width:400px; color:#fff; font-size: 14px; padding-top:20px}
#contact .adress {display: inline-block; vertical-align: top; font-size: 14px; width:49%}
#contact .content-wrapper {width:100%; padding-top:20px; color:#d5d5d5}
#contact .map {max-width:400px; padding-top: 30px; height:400px}
#contact input[type=text] {width:90%; background:#FFF; color:#7d7d7d; font-size:12px; padding-left:10px; height:25px; margin:5px 0px;max-width:420px; }
#contact textarea {width:91%; height:100px; background:#fff; color:#7d7d7d; font-size:12px; border:none; padding:6px; resize: none; max-width: 420px; margin-top:7px}
#contact input[type=button] {height:35px; background:#000; font-size:14px; color:#FFF;  width:200px; text-transform:uppercase; text-align:center; display:block;  border: none; margin-top: 10px}
#contact input[type=button]:hover {height:35px; background:#333; font-size:14px; color:#FFF;  width:200px; text-transform:uppercase; text-align:center; display:block;  border: none; margin-top: 10px}
#contact .submit {display:block; width:300px}
#contact .content-wrapper {width:100%; padding-top:20px; color:#d5d5d5}

footer {width:100%; background-color:#000; color:#fff; font-size:12px; height:60px}
footer .wrapper {max-width:1020px; width:100%; margin:0px auto; padding-top:20px}

	@media (max-width:1040px){
		#level2 .first .title {margin-top:50px}
		#level2 .first .subtitle {font-size:14px;}
		#level2 .wrapper {width:100%; }
#level2 .content-wrapper {max-width:800px}
		#level3 .wrapper {width:80%;}
		#contact .wrapper {width:98%;}
		#contact .content-left {text-align: left; padding-left: 20px}
		#contact .content-right {text-align: left; padding-left: 20px}
		footer .wrapper {width:80%}
}





	@media (max-width:960px){
		header {height:300px; background-position: center; max-width:960px; width:100%}
		header .menu {margin-top:20px}
	header .border{height:20px}
	header .btn {display:none}
		 header .menu-mobile {color:#fff;width:100%; background-color:#c1272c; position: fixed; text-align: center; padding-top:20px; padding-bottom:20px; top:72px; display:none}
		header .li{display:inline-block; font-size:14px; text-transform:uppercase; margin:10px 10px; padding:12px; cursor:pointer; border:1px solid #000; background-color: #000}
		header .li:hover{font-weight: 600} 
		 header .burger {float:right; height:50px; width:70px; background:url(../img/icon-burger.png) center center no-repeat; background-size:40% auto; border-left:2px Solid #fff; cursor:pointer; display:block;} 
	header .content img {margin-left:20px; width:220px; margin-top:-13px}
		
		header .title {font-size:14px; margin-left:20px; margin-top:200px}	
		header .line {width:60px}
		header .subtitle {font-size:26px; line-height:27px; margin-left:20px }
		#level1 .wrapper {text-align: center; width:90%}
		#level1 .title {font-size: 18px; padding-top:30px; text-align: left}
		#level1 .content {width:100%; display:block; text-align:left; font-size:12px; line-height:20px }	
		#level2 .content-wrapper {max-width:500px}
		#contact .wrapper {width:98%}
		#contact .content-left {width:98%; }
		#content .content-right {width:98%}
	} 
@media (max-width:690px){
	#level2 .wrapper {height:300px}
	header .content img{width:220px; margin-top:-13px}
}

@media (max-width:625px){
	#level2 .wrapper {background-position:-50px 0px; background-size:auto 70%}
	#level2 .title-wrapper {padding-top:140px}
}
@media (max-width:570px){
	#level2 .first .title {font-size:16px}
	#level2 .subtitle {font-size:16px}
	#level2 .wrapper {height:280px}
	#level2 .wrapper img{width:100%}
	/* #level2 .first {width:90%; padding-bottom:30px} */
	#level2 .content-wrapper {max-width:300px}
	#level2 .content-wrapper .content {font-size:14px}
	#contact .content-left {width:95%; padding-left:10px }
	#contact .content-right {width:95%; padding-left:10px}
	
}