/** ---------------------------------
STRUCTURE
---------------------------------**/

body{
    margin:0;
    padding:0;
	background-color:#292522;
}

#container {
	min-width:940px;
}

.parallax-section{
    margin:0px;
    width:100%;
}

.section{
    margin:0px;
    width:100%;
}

.section-container {
	position:relative;
	margin:0 auto;
	padding-top:130px;
	padding-bottom:150px;
	width:700px;
}

/** ---------------------------------
SECTION BLOCKS
---------------------------------**/


#home {
	height:700px;
    background-image:url("content/splash.jpg");
    background-repeat: no-repeat;
    background-position: center top;
    background-size:110%;
}

#comingsoon {
    background-image:url("content/paper1.jpg");
    background-repeat: repeat;
}

#performances {
    background-image:url("content/paper2.jpg");
    background-repeat: repeat;
}

#watch {
    background-image:url("content/paper1.jpg");
    background-repeat: repeat;
}

#listen {
    background-image:url("content/paper2.jpg");
    background-repeat: repeat;
}

#buy {
    background-image:url("content/paper1.jpg");
    background-repeat: repeat;
}

#bio {
    background-image:url("content/paper2.jpg");
    background-repeat: repeat;
}

#subscribe {
    background-image:url("content/paper2.jpg");
    background-repeat: repeat;
}

#contact {
    background-image:url("content/paper1.jpg");
    background-repeat: repeat;
}

/** ---------------------------------
PERFORMANCE CALENDAR
---------------------------------**/


div.show {
	position: relative;
	display:block;
	padding:0;
	margin-top:45px;
	height:30px;
	width:100%;
	color:#5e5e5e;
	font-family:"Oswald"; font-weight:300;
	font-size:17px;
	list-style-type: none;
	text-transform:uppercase;

}

div.date {
	position:absolute;
	left:0px;
	font-size:20px;	
	top:-4px;

}

div.venue {
	position:absolute;
	left:70px;
	top:-4px;
	font-size:20px;	
	color:#c14444;	

}

div.city {
	color:#5e5e5e;
	font-size:17px;
}

div.time {
	position:absolute;
	left:270px;
	top:-4px;
	font-size:20px;	

}

div.band {
	position:absolute;
	left:380px;

}

div.note {
	position:absolute;
	right:0px;
	text-align:right;
}

/** ---------------------------------
MEDIA
---------------------------------**/

.video {
	background-color:#000;
	width:100%;
	height:393px;
	padding:0;
	margin-top:40px;
	cursor:pointer;
}

.audio {
	padding-top:40px;
}

.sc-track {
	padding-top:30px;
}

#poorheart {
	width:100%;
	height:100%;
	background-image:url('content/poor_heart.jpg');
    background-repeat: no-repeat;
    background-position: center top;
}

.video-container {
	width:100%;
	height:100%;
}

.video-container iframe,  
.video-container object,  
.video-container embed  {
	width:100%;
	height:100%;
}

.album-select {
	float:clear;
	width:100%;
	height:250px;
	margin-top:25px;
}

.album-select img {
	width:250px;
	float:left;
	padding-right:20px;
	margin-top:8px;
}



/** ---------------------------------
NAVIGATION
---------------------------------**/

#navigation {
	position:relative;
	top:250px;
	width:100%;
}

#nav-main-logo {
	position:relative;
	margin:0 auto;
	width:260px;
}

#nav-main-logo img {
	width:100%;
}

.rule-light {
	margin:30px auto 30px auto;
	border-bottom:1px solid white;
	height:0px;
	width:700px;
	opacity:.5;
}

#nav-main {
	z-index:99;
	position:relative;
	margin:0 auto;
	padding-top:25px;
}

#nav-main ul {
	margin:0 auto;
	width:359px; /**512 with performances**/
	padding-left:17px;
	color:fff;
	font-family:"Oswald"; font-weight:300;
	text-transform:uppercase;

}

#nav-main ul li {
	float:left;
	padding-right:20px;
	font-size:23px;
}

#nav-main-social {
	width: 62px;
	margin:0 auto;
	padding-top:100px;
	display:block;
	clear: both;
}

#nav-main-social img {
	width:20px;
}


#nav-banner {
	position:fixed;
	min-width:940px;
	display:none;
	z-index:101;
	width:100%;
 	top: 0px;
 	height:70px;
 	background-color:rgba(77, 50, 57, 0.4);	

}

#nav-banner-logo {
	float:left;
	position:relative;
 	left:30px;
 	color:#c14444;
}

#nav-banner-links {
	right:10px;
	position:relative;
 	margin-top:7px;
	float:right;
}

#nav-banner-links ul {
 	top: 0px;
 	right:0px;
	z-index:100;
	padding:11px;
	margin:0;
	color:fff;
	font-family:"Oswald"; font-weight:400;
	font-size:23px;
	text-transform:uppercase;
}

#nav-banner-links ul li {
	padding-left:20px;
	padding-right:20px;
	float:left;
}

#nav-banner-logo img {
	width:120px;
	padding:10px;
}

#nav-mobile {
	display:none;
}

#nav-mobile-social {
	width:76px;
	margin:0 auto;
	display:block;
	clear: both;
}

#nav-mobile-social img {
	width:25px;
}


#nav-mobile-burger {
	padding-top:30px;
	bottom:0px;
	margin:0 auto;
	width:39px;
	cursor:pointer;
}

#nav-mobile-burger img{
	width:35px;
}

#nav-mobile-links {
	height:0;
	overflow:hidden;
	text-transform:uppercase;
	background-color:c14444;
	color:fff;
	font-family:"Oswald"; font-weight:300;
	font-size:23px;
	width:100%;
	margin:0 auto;
	transform: translate3d(0,0,0);
	-webkit-transform: translate3d(0,0,0);
}

#nav-mobile-links ul {
	margin:0;
	text-align:center;
	padding-left:0;
	padding-top:20px;
	padding-bottom:20px;
}

#nav-mobile-links ul li{
	padding:10px;
}


/** ---------------------------------
GLOBAL TYPOGRAPHY
---------------------------------**/

a {
	text-decoration:none;
	color:c14444;
}

a:hover {
	text-decoration:underline;
}

#nav-main a, #nav-mobile-links a, #nav-banner-links a {
	text-decoration:none;
	color: fff;
}

#nav-main a:hover, #nav-banner-links a:hover {
	color:c14444;
}

ul {	
	list-style-type: none;
}

p {
	font-family:"Raleway";
}

.album-select p {
	font-size:18px;
}

.album-title {
	font-family:"Oswald";
	text-transform:uppercase;
	font-size:25px;
}

#bio-text p {
	padding-top:25px;
	font-size:18px;
	line-height:30px;
}

#contact-text p {
	text-align:center;
	padding-top:25px;
	font-family:"Raleway";
	font-size:25px;
	line-height:30px;
}

.section-title {
	text-transform:uppercase;
	font-family:"Oswald"; font-weight:400;
	font-size:50px;
	border-bottom:6px solid #c14444;
	color:c14444;	
}

.section-sub-title-first {
	text-transform:uppercase;
	font-family:"Oswald"; font-weight:400;
	font-size:30px;
	border-bottom:4px solid #95877d;
	color:84756b;	
	padding-top:30px;
	padding-bottom:10px;
}

.section-sub-title-addl {
	text-transform:uppercase;
	font-family:"Oswald"; font-weight:400;
	font-size:30px;
	border-bottom:4px solid #95877d;
	color:84756b;	
	padding-top:70px;
	padding-bottom:10px;
}



/** ---------------------------------
MEDIA QUERIES
---------------------------------**/

/** PORTRAIT SMARTPHONE **/

@media (max-width: 480px) {

	#container {
		min-width:400px;
	}

	.section-container {
		width:400px;
		padding-top:40px;
		padding-bottom:70px;
	}

	#home {
		height:350px;
		min-width:400px;
    	background-position: center 0px;
    	background-size:130%;
	}
	
	#navigation {
		margin:0 auto;
		top:110px;
	}
	
	#nav-main-logo {
		width:200px;
	}

	#nav-main {	
		display:none;
	}
	
	#nav-banner {
		opacity:0;
	}
	
	#nav-mobile {
		display:block;
	}
	
	.rule-light {
		border-bottom:0px solid white;
	}
	
	.section-title {
		font-size:35px;
		border-bottom:5px solid #c14444;
		padding-bottom:8px;
		margin-left:7.5%;
		color:c14444;	
		width:85%;
	}
	
	.section-sub-title-first {
		font-size:25px;
		border-bottom:4px solid #95877d;
		padding-bottom:5px;
		margin-left:7.5%;
		color:84756b;
		width:85%;	
	}
	
	.section-sub-title-addl {
		font-size:25px;
		border-bottom:4px solid #95877d;
		padding-bottom:5px;
		margin-left:7.5%;
		color:84756b;
		width:85%;	
	}
	
	.show {
		position:relative;
		height:60px;
	}
	
	.date {
		position:absolute;
		margin-left:7.5%;
		font-size:21px;
	}

	.venue {
		position:absolute;
		left:115px !important;
	}

	.time {
		position:absolute;
		left:0px;
		right:0px;
		margin-right:7.5%;
		text-align:right;
		font-size:21px;
	}
	
	.band, .note {
		display:none;
	}

	
	#bio-text {
		width:85%;
		margin-left:7.5%;
	}
	
	.video {
		width:85%;
		margin-left:7.5%;
		height:190px;
	}
	
	.audio {
		width:85%;
		margin-left:7.5%;
	}
	
	.album-select {
		height:150px;
		margin-top:10px;
	}
	
	.album-select img {
		width:150px;
		margin-left:7.5%;
	}
	
	#poorheart {
		background-size:100%;
	}
	
	#contact-text p {
	font-size:20px;
	}

}

@media (min-width: 481px) {

	#nav-mobile-links {
		height:0px !important;
	}
}

