/* General */
*
{
	margin: 0;
	padding: 0;
	border-width: 0;
	outline-style: none;
	-webkit-text-size-adjust: 100%;
}

html, body
{
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}

body
{
	font-family: 'Special Elite', cursive;
	font-weight: 400;
	background-color: #5a2d01;
	background-position: center top;
	background-size: 750px 1500px;
	background-repeat
}

.wrapper
{
	position: relative;
	width: 100%;
}

.section-A, .section-B
{
	position: relative;
	width: 100%;
	max-width: 750px;
	margin-left: auto;
	margin-right: auto;
	background-size: 100% auto;
	background-repeat: no-repeat;
}

.main, .small
{
	width: 100%;
}

.main, .main-copy, .close-overlay 
{
	display: none;
}

.small, .small-copy 
{
	display: block;
}

.small-copy
{
	position: relative;
	background-color: #1e1e1e;
	margin-top: -0px;
}

.border-A
	{
	position: absolute;
	display: block;
	top:-30px;
	left: 0px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 30px 0 0 50vw;
	border-color: transparent transparent transparent #1e1e1e;
	}
	
.border-B
{
	position: absolute;
	display: block;
	top:-30px;
	right: 0px;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0px 0 30px 50vw;
	border-color: transparent transparent #1e1e1e transparent;
}

.small-content
{
	padding: 24px 30px 10px 30px;
	font-size: 14px;
	color: #ccc;
}

.small-content a
{
	text-decoration: underline;
	color: #ccc;
}

.small-content p 
{
	margin-top: 20px;
	line-height: 19px;
}

.footer
{
	font-family: sans-serif;
	font-size: 11px;
	text-align: center;
	margin-bottom: 10px;
	border-top: 1px #ECECEC solid;
	padding-top:16px;
	line-height: 15px !important;
	margin-top: 34px !important;
}

.footer a
{
	text-decoration: none;
	color: #ccc;
}

.small-content iframe 
{
	margin-top: 30px;
	margin-bottom: 10px;
}


@media (min-width: 750px) 
{
	.main, .main-copy 
	{
		display: block;
	}

	.small, .small-copy 
	{
		display: none;
	}
	
	.section-B
	{
	padding-bottom: 60px;
	}
	
	.main-copy
	{
		position: absolute;
		font-size: 14px;
		line-height: 31px;
		width: 614px;
		opacity: 0.8;
		padding-left: 60px;
		padding-right: 60px;
		box-sizing: border-box;
		color: #3b3733;
	}
	
	.main-copy p
	{
		margin-top: 30px;
		margin-bottom: 30px;
	}
	
	.main-copy h1
	{
		font-size: 14px;
		text-align: right;
		font-weight: 400;
		padding-top: 22px;
		margin-bottom: -23px;
	}
	
	.main-copy a
	{
		color: #974532;
		text-decoration: none;
	}
	
	.listen
	{
		cursor: pointer;
	}
	
	.releases
	{
		top: 770px;
		left: 115px;
		transform: rotate(-0.5deg);
	}
	
	.reviews
	{
		top: 750px;
		left: 72px;
		transform: rotate(2deg);
	}
	
	.about
	{
		top: 1124px;
		left: 46px;
		transform: rotate(-0.5deg);
	}
	#overlay
	{
		position: fixed;
		top: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		background-color: rgba(0,0,0,0.85);
		z-index: 200;
		display: none;
	}
	
	#overlay iframe
	{
		position: absolute;
		bottom: 20px;
		right: 20px;
	}
	
	.close-overlay
	{
		position: fixed;
		top: 20px;
		right: 20px;
		width: 60px;
		height: 60px;
		border-radius: 50%;
		cursor: pointer;
		z-index: 300;
		display: none;
		background-color: #789b94;
		background-image: url(../imgs/close-thick.svg);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: 36px 36px;
	}
}

@media (min-width: 750px) and (-webkit-max-device-pixel-ratio: 1.999), (max-resolution: 191dpi)
{
 	.section-A
 	{
 	background-image: url(../imgs/main-A-lo.jpg);
 	}
 	.section-B
 	{
 	background-image: url(../imgs/main-B-lo.jpg);
 	}
 	body
 	{
 	background-image: url(../imgs/main-background-lo.jpg);
 	}
}

@media (min-width: 750px) and (max-height: 800px)
{
 	body
 	{
 	background-position: center -60px;
 	}
 	.section-A, section-B
 	{
 		margin-top: -60px;
 	}
}

@media (min-width: 750px) and (max-height: 700px)
{
 	body
 	{
 	background-position: center -90px;
 	}
 	.section-A, section-B
 	{
 		margin-top: -90px;
 	}
}

@media (min-width: 750px) and (max-height: 600px)
{
 	body
 	{
 	background-position: center -120px;
 	}
 	.section-A, section-B
 	{
 		margin-top: -120px;
 	}
}

@media (min-width: 750px) and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi)
{
 	.section-A
 	{
 	background-image: url(../imgs/main-A-hi.jpg);
 	}
 	.section-B
 	{
 	background-image: url(../imgs/main-B-hi.jpg);
 	}
 	body
 	{
 	background-image: url(../imgs/main-background-hi.jpg);
 	}
}

@media (max-width: 405px)
{
 	.section-A
 	{
 	background-image: url(../imgs/small-A-810.jpg);
 	}
 	.section-B
 	{
 	background-image: url(../imgs/small-B-810.jpg);
 	}
}

@media (min-width: 406px) and (max-width: 600px)
{
 	.section-A
 	{
 	background-image: url(../imgs/small-A-1200.jpg);
 	}
 	.section-B
 	{
 	background-image: url(../imgs/small-B-1200.jpg);
 	}
}

@media (min-width: 601px) and (max-width: 749px)
{
 	.section-A
 	{
 	background-image: url(../imgs/small-A-1500.jpg);
 	}
 	.section-B
 	{
 	background-image: url(../imgs/small-B-1500.jpg);
 	}
}


/*

@media (max-width: 749px)
{
 	.section-A
 	{
 	background-image: url(../imgs/small-A-1500.jpg);
 	}
}

*/





/*
.intro-overlay
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-color: rgba(212,2,29,0.70);
	background-image: url(../imgs/dots.png);
	background-size: 2px 2px;
	z-index: 100;
}

*/

/*
MEDIA QUERIES
*/

@media only screen and (min-width: 750px)
{
 	
}