/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}


/*end css reset */

/* grid setup */

html { font-size:100%; } 

body {
  font-family: 'Droid Sans', sans-serif;
  background: #b3b3b3;
  font-size: 13px;
  line-height: 20px;
 padding-top: 125px;
}


/* Header Perfection */ 

header {
	background: black;
	height: 125px;
	width: 100%;
	position: fixed;
	top: 0;
}


#htop {
	height: 90px;
	float: left;
	background-color: black;
	width: 100%;
} 

.hlock {
	min-width: 700px;
}

#htop img {
	width: 101px;
	float: left;
}



#brand {
	float: left;
	width: 599px;
}

.container {
	max-width: 960px;
	background: #b3b3b3;
	margin: 0 auto;

}

li a:hover {
	color: black;
	text-decoration: none;
}

.eighths {
	width: 8.125%;
	margin: 0% 1.458333333333% 0% 1.458333333333%;
	padding-top: 0.520833333333%; 
	padding-bottom: 0.416666666667%;
	padding-left: 0.520833333333%;
	padding-right: 0.520833333333%;
	/*background: #1A1A1C;*/
	float: left;
	color: #E7EBF2;
	text-align: center;
	border-radius: 0.3125%;
	/*border: 1px solid gray;*/
		text-transform: uppercase;
}

/* FLUID */ 

@media only screen and (max-width: 900px) {

#navbar ul li {
	font-size: 9px;

}

}

@media only screen and (max-width: 600px){

	#navbar ul li {
font-size: 6px;

} 


.eighths {
	width: 7.825%;
	margin: 0% 1.458333333333% 0% 1.458333333333%;
	padding-top: 0.520833333333%; 
	padding-bottom: 0.416666666667%;
	padding-left: 0.520833333333%;
	padding-right: 0.520833333333%;
	/*background: #1A1A1C;*/
	float: left;
	color: #E7EBF2;
	text-align: center;
	border-radius: 0.3125%;
	/*border: 1px solid gray;*/
}
	
}


/* End of FLUID */

#tagline {
	color: white;
	font-size: 15px;
	float: left;
	padding-left: 5px;
	line-height: 30px;
	font-weight: normal;
}

.mainnav li {
	font-size: 10px;
	text-transform: uppercase;
	font-family: 'fjalla one';
}

#navbar {
	width: 100%;
	background-color: #b3b3b3;
}

.clear{clear:both;}


/*
  Clearfix
*/

.group:before,
.group:after {
  content: "";
  display: table;
}
.group:after {
  clear: both;
}
.group {
  clear: both;
  *zoom: 1;
}



div .col {
	width: 20.833333333333%;
	margin: 1.041666666667%;
	padding: 1.041666666667%;
	/*background: #1A1A1C;*/
	float: left;
	color: black;
	text-align: center;

}

div .half {
	width: 45.833333333333%;
	margin: 1.041666666667%;
	padding: 1.041666666667%;
	/*background: #1A1A1C;*/
	float: left;
	color: black;
}

img, video, canvas {
  max-width: 100%;
}

/* Julian styles */



#hero {
/*margin-left: 10px;*/
/*margin-top: 10px;*/
}


h1 {
	font-family: 'Fjalla One', sans-serif;
	color: white;
	font-size: 45px;
  text-transform: uppercase;
    /*position: relative;*/
  line-height: 40px;
  padding-top: 16px;
  font-weight: 600;
}



h2 {
	font-family: 'Fjalla One', sans-serif;
	font-size: 24px;
	line-height: 32px;
	padding-bottom: 9px;
	text-align: left;
	padding-top: 8px;
	/*padding-left: 10px;*/
	text-transform: uppercase;


}

h3 {
		font-family: 'Fjalla One', sans-serif;
	font-size: 18px;
	line-height: 24px;
	padding-bottom: 5px;

}

iframe {
	padding-top: 8px;
}

footer {
	background: black;
	height: 200px;
	width: 100%;
	color: white;
	padding-top: 30px;
}

*img {
	margin: 10px;
}


#snaker {
	float: right;
	padding-top: 27px;
}

#expendable {
	float: right;
	padding-top: 27px;
}

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

a:hover {
	text-decoration: underline;
}


/* Contact Form */

#contact-area {
	float: left;
	margin-left: 16px;
	width: 480px;
	/*background: black;*/
	color: black;
	padding: 10px;
	/*border: 2px solid rgba(255, 255, 255, .8);*/
	border-radius: 4px;
}

#contact-area {
	width: 93.75%;
	margin-top: 25px;
}

textarea {
	width: 400px;
    height: 250px;
}

form {
	margin: 0 0 20px 0;
	padding-top: 10px;
}

input {
	border-radius: 4px;
}

input#name {
	margin-bottom: 10px;
}

input#message {
	display: block;
}

textarea {
	border-radius: 4px;
	width: 770px;
	height: 80px;
}

.coverart {
	float: left;
	margin: 0 12px 30px 12px;
}



/*.coverart:hover {
	width: 300px;
	height: 300px;
}*/

.release {
	margin-bottom: 30px;
	clear: both;
}

h4 {
	font-weight: bold;
	text-decoration: underline;
	display: inline;

}


ul#performers li.performer {
	float: left;
	width: 21.875%;
	/*background-color: black;*/
	padding: .520833333333%;
	margin: 1.041666666667%;
	color: black;
}

/*** GALLERY COLORBOX CSS **/

/*
    ColorBox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}

/* 
    User Style:
    Change the following styles to modify the appearance of ColorBox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/



#cboxOverlay{background:#000000;}
#colorbox{outline:0;}
#cboxContent{margin-top:32px; overflow:visible;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{background:#000000; padding:1px;}
#cboxLoadingGraphic{background:url(http://static.tumblr.com/fftf9xi/rkklqu1ni/loading.gif) no-repeat center center;}
#cboxLoadingOverlay{background:#000000;}
#cboxTitle{position:absolute; top:-22px; left:0; color:#ffffff; text-shadow:none;}
#cboxCurrent{position:absolute; top:-22px; right:205px; text-indent:-9999px;}

/* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
#cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }

/* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
#cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

#cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(http://static.tumblr.com/fftf9xi/1dslqu1o1/controls.png) no-repeat 0 0;}
#cboxPrevious{background-position:0px 0px; right:44px;}
#cboxPrevious.hover{background-position:0px -25px;}
#cboxNext{background-position:-25px 0px; right:22px;}
#cboxNext.hover{background-position:-25px -25px;}
#cboxClose{background-position:-50px 0px; right:0;}
#cboxClose.hover{background-position:-50px -25px;}
.cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}
.cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
.cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;}
.cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
.cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;}


/**** FORM STUFF ****/

li.hide {
	visibility: hidden;
}