/* font face */
@font-face {
	font-family: 'AvenirBlack';
	src: url('fonts/avenir-black-webfont.eot');
	src: url('fonts/avenir-black-webfont.eot?#iefix') format('embedded-opentype'),
		url('fonts/avenir-black-webfont.woff') format('woff'),
		url('fonts/avenir-black-webfont.ttf') format('truetype'),
		url('fonts/avenir-black-webfont.svg#AvenirRegular') format('svg');
}
@font-face {
	font-family: 'AvenirHeavy';
	src: url('fonts/avenir-heavy-webfont.eot');
	src: url('fonts/avenir-heavy-webfont.eot?#iefix') format('embedded-opentype'),
		url('fonts/avenir-heavy-webfont.woff') format('woff'),
		url('fonts/avenir-heavy-webfont.ttf') format('truetype'),
		url('fonts/avenir-heavy-webfont.svg#AvenirRegular') format('svg');
}

*{ font-family:  "AvenirHeavy", "Arial Black", Tahoma, Geneva, sans-serif; font-weight: normal !important;}
body{ margin: 0; padding: 0;}

.width{ max-width: 1010px; margin: 0 auto;  }
p{ margin: 0 0 14px 0; padding: 0;  word-spacing: -1px; font-size:37px; font-weight: 100;}
p:last-child{ margin-bottom: 0;}

#social{ padding: 150px;}
#social a{ display: block; height: 52px; width: 52px; float:left;}
#social a#facebook{ background:url(images/social-facebook.png) no-repeat;}
#social a#soundcloud{ background:url(images/social-soundcloud.png) no-repeat; margin-left: 15px;}
#social a:hover{ background-position: 0 -52px !important;}

#logo{ background:url(images/logo.png) 50% 0% no-repeat; height: 360px; background-size: contain;}
header{ padding-bottom: 15%;}
article{  padding: 15% 35px;}

#blood,#gold{ display: table; height:500px; width: 100%;}
article{  padding: 100px 35px; display: table-cell; vertical-align: middle; }
article > div{ }
article p{ letter-spacing:-1.5px; }
#blood{ background: #FD523F; color: #FFFFFF;}
#gold { background: #F3B827; color: #414141; }

footer{ padding:2% 0 40px 0; }
a#email{ display: block; background: url(images/email.png) no-repeat 0 35px; background-size:100%; padding: 120px 0 60px 0; margin-bottom: 80px; text-decoration:none; color: #414141; font-size: 34px;  }
a#email:hover{ background-image: url(images/email-hover.png); color: #FD523F; }

.copyright{ font-size: 16px; font-stretch:normal; text-align: center;letter-spacing: 0;  word-spacing: 0; padding: 0 30px;  color: #414141;}
.copyright span{ font-family:Arial, Helvetica, sans-serif; font-weight: 900; padding: 10px 0;}
.copyright br{ display:none;}

@media screen and (max-width: 1024px) {
	#logo{ margin:0 4%;}
	#email{ margin:0 4%;}
	article{  padding: 10% 35px;}
}

@media screen and (max-width: 850px) {
	#logo{ height: 250px; margin:0 5%;}
	footer{ padding-bottom: 0;}
	a#email{margin:0 5%; margin-bottom: 20px; }
	p{ font-size: 32px;}
}

@media screen and (max-width: 700px) {
	#logo{ height: 220px; }
	footer{ padding-bottom: 0;}
	a#email{ margin-bottom: 20px;}
	p{ font-size: 28px;}
	.hide{ display: none;}
}

@media screen and (max-width: 600px) {
	#logo{ height: 200px; }
	footer{ padding-bottom: 0;}
	a#email{ margin-bottom: 0px;  padding-bottom: 40px}
	article p{ letter-spacing:-1.5px; }
	p.copyright{ font-size: 14px; line-height: 100% !important;}
	
}

@media screen and (max-width: 480px) {
	body{ padding-bottom: 20px;}
	#social{ padding: 20px 0px 80px 0px; text-align:center; width: 120px !important; margin: 0 auto !important;}
	#social a{ display: block; height: 52px; width: 52px;}
	#logo{ height: 150px; }
	footer{ padding-bottom: 0;}
	a#email{ margin-bottom: 0px; padding-bottom: 20px;}
	p{ font-size: 24px;}
}

@media screen and (max-width: 360px) {
	#logo{ height: 120px; }
	article{  padding: 20px 35px;}
	footer{ padding-bottom: 0;}
	a#email{ margin-bottom: 0px; padding-bottom: 0px;}
	p{ font-size: 20px;}
	.hidden{ display:none;}
	.copyright br{ display:block;}
}