html {
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}


body{
	font-size: 14px;
	font-family: 'usual', sans-serif;
	margin: 0;
}
#content{
	margin: 0 auto;
	max-width: 1400px;
	width: 100%;
}
	header{
		background-image: url(../img/Header.jpg);
		background-repeat: no-repeat;
		background-size: cover;
		height: 712px;
		padding: 60px 0 0 0;
		text-align: center;
		text-transform: uppercase;
		width: 100%;
	}
		header #logo{
			margin-bottom: 160px;
		}
			header #logo img{
				max-height: 100%;
				max-width: 100%;
			}
		header .headline_1{
			color: #fff;
			font-size: 3.857em;
			font-weight: bold;
			letter-spacing: 0.06em;
			margin-bottom: 0;
		}
		header .headline_2{
			color: #7b7b7b;
			font-size: 2.143em;
			font-weight: normal;
			letter-spacing: 0.06em;
			margin-top: 15px;
		}
		header .headline_2:after{
			background-color: #fff;
			content: '';
			display: block;
			height: 8px;
			margin: 20px auto 0;
			width: 185px;
		}
	#text{
		color: #7b7b7b;
		font-size: 1.071em;

		text-align: center;		
		max-width: 1070px;
		margin: 0 auto;
	}
		#text h2{
			color: #fbba00;
			font-weight: 400;
			font-size: 2.6em;
			margin: 30px 0 20px;
		}
		#text p {
			margin: 0;
		}
		
	#boxes{
		background-color: #7b7b7b;
		display: table;
		margin: 50px auto 70px;
		max-width: 1070px;
		width: 100%;
	}
		#boxes div{
			float: left;
			width: 50%;
		}
		
			#boxes .image img{
				display: block;
				max-width: 100%;
				max-height: 100%;
			}
			
			#boxes .text{
				color: #fff;
				font-size: 1.071em;
				padding: 3%;
			}
				#boxes .text ul{
					line-height: 2;
					padding-left: 15px;
				} 
	footer{
		margin:0 3%;
	}		
		footer > div {
			display: inline;
			float: right;
			width: 60%;
		}	
		footer a.info{
			color: #ddd;
			font-size: 0.786em;
			margin: 0 18px 0px 0;
			padding: 30px 0 20px;
			text-transform: uppercase;
			text-decoration: none;
			-webkit-transition: all 300ms;
			-moz-transition: all 300ms;
			-ms-transition: all 300ms;
			-o-transition: all 300ms;
			transition: all 300ms; 
		}
		footer a.info:hover{
			color: #fbba00;
		}
		footer a.shop{
			background-color: #fbba00;
			background-image: url(../img/icon.png);
			background-repeat: no-repeat;
			background-position: 15px center;
			color: #fff;
			float: right;
			
			padding: 15px 15px 15px 60px;
			text-decoration: none;
			-webkit-transition: all 300ms;
			-moz-transition: all 300ms;
			-ms-transition: all 300ms;
			-o-transition: all 300ms;
			transition: all 300ms; 
		}
		footer a.shop:hover{
			background-color: #7b7b7b;
		}
		
@media only screen and (max-width: 1090px){
	#boxes{
		margin-left: 5%;
		margin-right: 5%;
		width: 90%;
	}
}

@media only screen and (max-width: 612px){
	#boxes div,
	footer > div{
		width: 100%
	}
	footer > div{
		clear: both;
		display: block; 
		height: 85px;
		text-align: center;
	}
    	
	footer a.shop{
		float: none;
		margin: 0 auto 30px;
	}
	
	#boxes .text {
	    padding: 6%;
	}
}

@media only screen and (max-width: 480px){
	footer a.shop{
		display: block;
		width: 97%;
	}

	header{
		height: 520px;
	}
	header #logo{
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 80px;
		width: 80%;
	}

	header h1{
		font-size: 2.6em;
	}
	header h2{
		font-size: 1.6em;
	}
	#text .headline{
		font-size: 1.6em;
	}
}
