/*
Theme Name: The Kills
Description: Custom theme for www.thekills.tv
Author: Not Evil Ltd
Author URI: http://www.evilstudio.com 
*/

/* Reset */
html, body, div, span, object, iframe, h1, h2, h3, h4, p, a, img, ol, ul, li, form, label { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; }
ol, ul, dl { list-style:none; }
blockquote, q { quotes:none; }
:focus, :active { outline:0; }
table { border-collapse: collapse; }
table, th, td, caption { text-align: left; vertical-align: top; }
h1, h2, h3, p, div.row { padding: 0 0 10px 0; }
hr { display: none; }		
select { margin-right: 7px; vertical-align: middle	}
option { margin-right: 7px; }
header, footer, aside, nav, article, section, figure {  
	display: block; 
	}

/* Scrollbar gutter */
html>body { overflow-y:scroll;  }
*+html>body { overflow-y: visible; }
*+html { overflow-x: hidden; }
* html { overflow-x: hidden; }

/* Helper classes */	

.cfx:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
	}
	* html .cfx { height: 1px }
	*+html .cfx { min-height: 1px; }

/* Font config */	
body { /* Base font 14px (15px leading) */
	font: 87.5%/15px "AnotherTypewriterRegular","Courier New", sans-serif;
	color: rgba(255,255,255,.8);
	}
	body a { color: rgba(255,255,255,.8); text-decoration: none; }
	body a:hover { color: rgba(255,255,255,1); text-decoration: underline; }
	.no-rgba body, .no-rgba body a { color: #a3a3a3; }
	.no-rgba body a:hover { color: #fff; }
	h1, h2, h3, h4 { font-weight:normal; }


/* Centering */	
#site {
	width: 100%;
	min-height: 100%;
	background: fixed url(i/mesh.gif);	
	margin: 0;
	overflow: hidden;
	}
html {  
	background-color: #2e2e2e;
	background-position: 50% 0;
	background-repeat: no-repeat;
	background-attachment: fixed;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 100%;
	min-height: 100%;
	}
body {
	text-align: center; 
	padding: 0 0 0 0;	
	position: relative;
	height: 100%;
	}
	#top {
		width: 990px;
		text-align: left; 
		margin: auto;
		padding: 0;		
		height: auto !important;
		height: 600px;
		min-height: 600px;
		}	
header {
	padding: 37px 0 40px 0;
	}
	header h1 {
		width: 990px; height: 218px;
		background: url(i/logo.png) 0 0 no-repeat;
		overflow: hidden;
		text-indent: -3000px;
		}


#leftColumn {
	float: left;
	width: 630px; 
	height: auto !important;
	height: 100px;
	min-height: 100px;
	margin-right: 30px;
	}
#rightColumn {
	float: left;
	width: 330px; 
	height: auto !important;
	height: 100px;
	min-height: 100px;
	}	
#mainFooter {
	background: #000;
	text-align: left;
	clear: both;	
	height: auto !important;
	height: 300px;
	min-height: 300px;	
	width: 100%;
	color: #333;
	padding-bottom: 20px;
	}
	#mainFooter h1 {
		text-decoration: underline;
		font-size: 18px;
		}
	#mainFooter a { color: #333; }
	#mainFooter .inner {
		width: 590px;
		text-align: left; 
		margin: auto;
		position: relative;
		padding: 30px 380px 0 20px;
		}	
		#mainFooter nav {
			font-size: 12px;
			text-align: right;
			padding: 0 0 20px ;
			margin-bottom: 20px;
			border-bottom: 1px solid #4d4d4d;
			text-transform: uppercase;
			}
			#mainFooter nav a, #mainFooter nav span { float: left; margin-right: 10px; }
			#mainFooter nav a:last-child { float: none; margin-right: 0; }
			#mainFooter nav, #mainFooter nav a { color:#4d4d4d; }
	#archiveWrapper {
		width: 590px;
		}		
	.yearBlock {
		float: left;
		width: 145px;
		height: auto !important;
		height: 150px;
		min-height: 150px;
		opacity: 0.999;
		}
		.yearBlock:nth-child(4n+5) { clear: both;}
		.yearBlock h2 { padding:0; margin:0; background: url(i/bullet2.gif) 0 6px no-repeat; padding-left: 8px; }		
	#credit {
		position: absolute;
		top: 30px;
		right: 0px;	
		font-size: 12px;
		color:#222;	
		}

/* Boxes */
.box {
	display: block;
	padding: 20px;
	margin-bottom: 20px;
	background: url(i/bg.png);
	}
	.box h1 { font-size: 18px; opacity: 0.999; text-decoration: underline; margin-bottom: 10px; }
	.large { font-size: 18px; opacity: 0.999; text-decoration: underline; }
	.box p { opacity: 0.999; }
	.box p:last-child { padding-bottom: 0; }
	.rgba .box {
		background:rgba(0,0,0,.5);		
		}


/* Aside buttons */
aside nav ul li {
	padding-left: 14px;
	background: url(i/bullet.gif) 0 6px no-repeat;
	}
#buttonImages {	
	}		
	#buttonImages a { display: block; margin-bottom: 10px; }
	#buttonImages a:last-child { margin-bottom: 0; }
	#buttonImages a:hover { opacity: 0.5; }
	#buttonImages img { vertical-align: bottom; }	

/* Soundcloud */
#soundcloud {
	margin-bottom: 20px;
	}	
	#buysatellite {
		padding: 0 0 20px 0;
		margin-bottom: 20px;
		border-bottom: 1px solid #808080;
		}
	#buysatellite a {
		float: left;
		margin-right: 10px;
		}

/* MP3 Player */	
.tracks { list-style: decimal outside; margin: 0 0 0 20px; }
.tracks li { cursor: pointer; }
.tracks li.selected, .tracks li:hover { color:#fff; text-decoration: underline; }
#controls {
	padding: 0 0 0 0
	}
	#controls ul { height: 24px; margin-bottom: 10px;}	
	#controls li {
		float: left;
		width: 30px; height: 24px;
		background: url(i/controls.png);
		text-indent: -3000px;
		overflow: hidden;
		cursor: pointer;	
		}
		#controls li#prev { background-position: 0 0; }
		#controls li#play { background-position: -60px 0; }
		#controls li#pause { background-position: -30px 0; }
		#controls li#next { background-position: -90px 0; width:31px; }
		#controls li#prev:hover { background-position: 0 -24px; }
		#controls li#play:hover { background-position: -60px -24px; }
		#controls li#pause:hover { background-position: -30px -24px; }
		#controls li#next:hover { background-position: -90px -24px; }
#progress, .jp-load-bar {
	width: 91px;
	height: 10px;
	background: #a3a3a3;
	cursor: pointer;
	margin-bottom: 10px;
	}		
	#bar, .jp-play-bar {
		height: 10px;
		font-size: 0;
		line-height: 0;
		text-indent: -3000px;
		overflow: hidden;
		width: 0;
		background: #fff;
		}	


/* News */
article {
	}
	article p { clear: both; }
	article img {
		border: 14px solid  #fff;
		overflow: hidden;
		margin-bottom: 20px;
		display: block;
		vertical-align: bottom;
		}
		article embed { vertical-align: bottom; margin:0; padding:0;}
		.ie article object {
			display: inline-block;
			}
		article img { max-width:562px; }
		article object, article embed { width:590px; height:420px; }
		article a { text-decoration: underline;}

	article footer {
		text-align: right;
		border-top: 1px solid #fff;
		padding-top: 15px;
		}				
		article footer time {
			float: left;
			opacity: 0.999;
			}
		.twitter,
		.facebook {
			text-align: left;
			display: -moz-inline-box !important;
			display: inline-block;
			font-size: 0;
			line-height: 0;
			overflow: hidden;
			text-indent: -3000px;
			width: 16px; height: 15px;
			background: url(i/social.gif) 0 0 no-repeat;
			vertical-align: top;
			}	
		.twitter { background-position: -21px 0; }	
		.facebook:hover {  background-position: 0 -15px; }
		.twitter:hover {  background-position: -21px -15px; }	


/* Tour Dates */
#tourDates {

	}	
	#tourDates .year {
		margin-bottom: 30px;
		}
		#tourDates .year:last-child { margin-bottom: 0;}
	#tourDates h2 {
		padding: 0 0 10px 0;
		text-decoration: underline;
		opacity: 0.9999;
		}	 
	#tourDates ol {
		padding: 0 0 10px 0;
		}	
	#tourDates li {	
		opacity: 0.9999;
		position: relative;
		padding: 0 30px;
		}
		#tourDates li time {
			position: absolute;
			top: 0px;
			left: 0px;			
			width: 25px;
			}
		#tourDates li a {
			position: absolute;
			top: 0px;
			right: 0px;
			text-transform: uppercase;
			color:#747474;
			font-style: italic;
			}

/* backgroundSwitcher */
#editSite {

	}
#backgroundSwitcher {
	height: 63px;
	}
#backgroundSwitcher li {
	float: left;
	position: relative;
	}
	#backgroundSwitcher .ldr {
		position: absolute;
		top: 0px;
		left: 0px;
		line-height: 58px;
		height: 58px;
		width: 58px;
		text-align: center;
		font-size: 10px;
		opacity: 0.999;
		}
	#backgroundSwitcher li a:hover img { opacity: 0.6; }		
#editSite form {
	border-top: 1px solid #808080;
	padding: 10px 0 0 0;
	}
	input {
		border: 0;
		width: 180px;
		background: #d1d1d1;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		padding: 2px 7px;
		opacity: 0.999;
		font: 14px/20px "AnotherTypewriterRegular","Courier New", sans-serif;
		vertical-align: top;
		}
	button {
		border: 0;
		background: #5d5d5d;
		color:#000;
		display: -moz-inline-box !important;
		display: inline-block;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		padding: 2px 7px;
		opacity: 0.999;
		font: 14px/20px "AnotherTypewriterRegular","Courier New", sans-serif;
		cursor: pointer;
		vertical-align: top;
		}				
		button:hover {
			background: #fff;
			}
	.ff3 button { top: -1px; position: relative; }		
	embed {
		margin-bottom: 10px;
		}


#trackList li span {
	position: absolute;
	top: 0px;
	left: 0px;			
	width: 25px;
	}
#trackList li {
	position: relative;
	padding: 0 30px;
	opacity: 0.9999;
	}