/*
Theme Name: SuperSonicNoise.
Theme URI: 
Description: Official Theme.
Version: 1.0
Author: 
Tags: 

Enjoy the theme!

*/




/* STANDARD CSS FILE - BADSHARK COMMUNICATIONS */

/* ---------------------------- */
/* STANDARD HTML TAG RESET  (Thanks to HTML5 Boilerplate) */
/* ---------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, 
hgroup, menu, nav, section, menu,
time, mark, audio, video {
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
  font-weight: normal;
}

article, aside, figure, footer, header, 
hgroup, nav, section, menu { display:block; }

table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
table, td, th { vertical-align: middle; }

ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }

a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
a img { border: none; }
del { text-decoration: line-through; }
input, select { vertical-align:middle; }


/* ---------------------------- */
/* STANDARD HTML TAG DEFINITION */
/* ---------------------------- */

body {
	background: #e4e4e4;
	color: #303030;
 	font: normal 12px/18px Helvetica, Arial, sans-serif;
}

form, input { 
	color: #303030; 
 	font: 100% Helvetica, Arial, sans-serif;
}

pre, code, kbd, samp { font-family: monospace, sans-serif; }
 
a { color: #000000; border-bottom: 1px solid #d63f14; text-decoration: none; }
a:link, a:visited {text-decoration: none; outline: none;} 
a:hover {text-decoration: none; border-bottom: 1px solid #000000 !important;}
a:active { outline: none; text-decoration: none;}

strong { font-weight: bold; }
em {font-style: italic;}
hr { display:block; height: 0px; border: 0px; margin: 0px; padding: 0px; min-height: 0px; }

input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; *vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }

button {  width: auto; overflow: visible; }

.ie7 img { -ms-interpolation-mode: bicubic; }


/* Typography */

@font-face {
    font-family: 'CabinBold';
    src: url('fonts/Cabin-Bold-webfont.eot');
    src: url('fonts/Cabin-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Cabin-Bold-webfont.woff') format('woff'),
         url('fonts/Cabin-Bold-webfont.ttf') format('truetype'),
         url('fonts/Cabin-Bold-webfont.svg#CabinBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

.title {
	font-family: "CabinBold", Helvetica, Arial, sans-serif;
}

.subTitle {
	font-family: "CabinBold", Helvetica, Arial, sans-serif;
}

h1 {
	
} 

h2 {
	
} 

h3 {
	
}

p {
	
}


/* ----------------------------*/ 
/* PAGE ELEMENTS     */ 
/* ----------------------------*/ 

body {
	position: relative;
}

.home {
	background:#dd6a33 url('images/bgHome.jpg') 0 0 no-repeat;
}

	nav li.ho a:hover, .home li.current-menu-item a, .home #main h1, .home #main h2, .home footer a {
		color: #d63f14;
	}
	
	.home a {
		border-bottom: 1px solid #d63f14;
	}
	
	.home a.buy {
		background-color: #d63f14;
	}
	
.who {
	background:#3878a4 url('images/bgWho.jpg') 0 0 no-repeat;
}

	nav li.wh a:hover, .who li.current-menu-item a, .who footer a {
		color: #3878a4;
	}
	
	.who #main h1, .who #main h2 {
		color: #dadada;
	}
	
	.who a {
		border-bottom: 1px solid #3878a4;
	}
	
	.who a.buy {
		background-color: #3878a4;
	}
	
.credits {
	background:#d3d3d3 url('images/bgCredits.jpg') 0 0 no-repeat;
}

	nav li.cr a:hover, .credits li.current-menu-item a, .credits #main h1, .credits #main h2, .credits footer a {
		color: #d63f14;
	}

	.credits a {
		border-bottom: 1px solid #d63f14;
	}
	
	.credits a.buy {
		background-color: #d63f14;
	}
	
.music {
	background:#f2d668 url('images/bgMusic.jpg') 0 0 no-repeat;
}

	nav li.mu a:hover, .music li.current-menu-item a, .music footer a {
		color: #fffa66;
	}
	
	 .music #main h1, .music #main h2 {
		color: #000000;
	}

	.music a {
		border-bottom: 1px solid #fffa66;
	}
	
	.music a.buy {
		background-color: #000000;
	}
	
.video {
	background:#fef6c5 url('images/bgVideo.jpg') 0 0 no-repeat;
}

	nav li.vi a:hover, .video li.current-menu-item a, .video #main h1, .video #main h2, .video footer a {
		color: #7c4a0f;
	}

	.video a {
		border-bottom: 1px solid #7c4a0f;
	}
	
	.video a.buy {
		background-color: #7c4a0f;
	}
	
.links {
	background:#99b07c url('images/bgLinks.jpg') 0 0 no-repeat;
}

	nav li.li a:hover, .links li.current-menu-item a, .links #main h1, .links #main h2, .links footer a {
		color: #3a6820;
	}

	.links a {
		border-bottom: 1px solid #3a6820;
	}
	
	.links a.buy {
		background-color: #3a6820;
	}
		

	/* ---------------------------*/ 
 	/* HEADER */
	
	header {
		width: 960px;
		position: relative;
	}
	
		header a, header a:hover {
			border: 0px !important;
		}
	
		a.logo {
			display: block;
			width: 103px;
			height: 78px;
			position: absolute;
			left: 30px;
			top: 50px;
		}
		
		a.logo:hover {
			top: 52px;
		}
		
			a.logo img {
				display: block;
			}
	
		nav {
			width: 510px;
			height: 40px;
			position: absolute;
			top: 0px;
			left: 255px;
			padding-left: 10px;
		}
		
			nav a, nav li {
				display: inline;
			}
			
			nav li {
				text-transform: uppercase;
				font-size: 18px;
				color: #dadada;
				line-height: 55px;
				padding-left: 5px;
			}
			
			nav li:first-child {
				padding-left: 0px;
			}
			
				nav li:first-child span {
					display: none;
				}
			
			nav a {
				color: #dadada;
				padding-left: 5px;
			}
			
		a.buy {
			display: block;
			position: absolute;
			top: 15px;
			right: 0px;
			font-size: 18px;
			line-height: 40px;
			height: 56px;
			background: #d63f14;
			color: #dadada;
			text-transform: uppercase;
			padding: 0px 10px 0px 35px;
			background: #d63f14 url('images/icnBuy.png') 10px 15px no-repeat;
			text-align: right;
		}
		
			a.buy span {
				font-size: 11px;
				text-transform: uppercase;
				display: block;
				position: relative;
				top: 5px;
				right: 0px;
				height: 20px;
				font-family: Helvetica, Arial, sans-serif;
				width: 120px;
				line-height: 10px;
			}
		
		a.buy:hover {
			padding-left: 45px;
		}
	
			
	/* ---------------------------*/ 
	/* MAIN */
			
	#main {
		width: 677px;
		float: left;
		margin-left: 281px;
		margin-top: 190px;
		margin-bottom: 100px;
	}
	
		#main h1 {
			font-size: 48px;
			font-weight: bold;
			color: #d63f14;
			line-height: 55px;
			text-transform: uppercase;
			margin-bottom: 0px;
		}
		
		.col {
			width: 465px;
		}
		
		.summary {
			font-size: 14px;
			font-weight: bold;
			margin-bottom: 18px;
		}
		
		.table .wideCol, .table .sideCol {
			background: #c25d2c;
		}
		
		.table .wideCol h2, .table .sideCol h2 {
			background: #000000;
			color: #d63f14;
			text-transform: uppercase;
			font-size: 24px;
			height: 30px;
			line-height: 30px;
			padding-left: 10px;
			border-bottom: 1px solid #dd6a33;
		}
		
		.table .wideCol {
			width: 465px;
			float: left;
			border-right: 1px solid #dd6a33;
			min-height: 500px;
			word-wrap: break-word;
		}

		.table .wideCol.full {
			width: 677px;
		}
		
		.table .sideCol {
			width: 211px;
			float: right;
			word-wrap: break-word;
			min-height: 500px;
		}

			.table .sideCol img {
				width: 60%;
				height: 60%;
			}
		
		.post {
			padding: 12px;
			border-bottom: 1px solid #dd6a31;
		}

			.post .content {
				width: 310px;
				float: right;
			}

				.post h3 {
					font-size: 14px;
					font-weight: bold;
					margin-top: 12px;
				}

				.post small {
					font-size: 11px;
					display: block;
					margin-bottom: 12px;
				}

		.mainCol {
			width: 455px;
			float: right;
		}
		
			.mainCol p {
				font-weight: bold;
				margin-top: 18px;
			}
			
			.mainCol h2, .fullCol h2 {
				font-size: 24px;
				margin-top: 18px;
			}
			
			.mainCol ul {
				margin-top: 10px;
				margin-bottom: 25px;
			}
			
				.mainCol ul a {
					font-weight: bold;
				}
				
		/* Audio Player */
		
		#musicPlayer {
			margin-top: 35px;
			margin-bottom: 45px;
			-webkit-transform: rotate(5deg);
			-moz-transform: rotate(5deg);
			-ms-transform: rotate(5deg);
			-o-transform: rotate(5deg);
			transform: rotate(5deg);
		}
		
		.audiojs {
			background: #000000 !important;
		}
		
			.audiojs .scrubber {
				border-top: 0px;
			}
		
		ol { padding: 0px; margin: 0px; list-style: decimal-leading-zero inside; color: #000000; width: 460px; border-top: 1px solid #666666; font-size: 0.9em; background: #ffffff; text-transform: uppercase;}
		      ol li { position: relative; margin: 0px; padding: 9px 10px 10px; border-bottom: 1px solid #666666; cursor: pointer; }
		      ol li a { display: block; text-indent: -3.3ex; padding: 0px 0px 0px 20px; font-weight: bold;}
		      li.playing { color: #ffffff; background: #000000; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2); }
		      li.playing a { color: #ffffff; font-weight: bold;}
		      li.playing:before { content: 'Now Playing'; width: 100px; height: 14px; padding: 3px; line-height: 14px; margin: 0px; position: absolute; right: 10px; top: 7px; color: #000; font-size: 10px; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2); color: #ffffff; text-align: right;}
		
		.fullCol ol a {
			border: 0px !important;
		}
		
		/* SSA Module */
		
		.saModule p {
			margin-top: 15px;
		}
		
		.saModule h2 {
			line-height: 24px;
		}
		
		a.button {
			background: #000000;
			padding: 10px 0px 15px 0px;
			font-size: 36px;
			font-family: "CabinBold", Helvetica, Arial, sans-serif;
			color: #ffffff;
			text-transform: uppercase;
			display: block;
			width: 200px;
			text-align: center;
			border-bottom: 0px;
			-webkit-transform: rotate(-3deg);
			-moz-transform: rotate(-3deg);
			-ms-transform: rotate(-3deg);
			-o-transform: rotate(-3deg);
			transform: rotate(-3deg);
		}
		
		a.button:hover {
			border-bottom: 0px !important;
			background: #ffffff;
			color: #000000;
		}
		
			a.button span {
				font-size: 16px;
				display: block;
				margin-bottom: 5px;
			}
	
										
	/* ---------------------------*/
	/* FOOTER */ 
	
	footer {
		width: 160px;
		position: absolute;
		left: 0px;
		top: 480px;
		padding-left: 15px;
	}
	
		footer h2 {
			font-weight: bold;
			font-size: 20px;
			text-transform: uppercase;
			margin-top: 10px;
			margin-bottom: 15px;
			color: #000000;
			height: 20px;
		}
		
		footer p {
			font-weight: bold;
			color: #dadada;
			margin-bottom: 5px;
		}
		
		footer ul {
		}
		
			footer a {
				font-weight: bold;
				border: 0px !important;
				padding-left: 25px;
				padding-top: 0px;
			}
			
			footer a:hover {
				color: #ffffff;
			}
		
			footer li.em a {
				background: url('images/icons.png') 0 0 no-repeat;
			}
		
			footer li.ph a {
				background: url('images/icons.png') 0 -18px no-repeat;
			}
		
			footer li.tw a {
				background: url('images/icons.png') 0 -36px no-repeat;
			}
		
			footer li.fb a {
				background: url('images/icons.png') 0 -54px no-repeat;
			}
		
			footer li.yt a {
				background: url('images/icons.png') 0 -72px no-repeat;
			}
				
								
/* ----------------------------*/
/* CUSTOM CLASSES     */
/* ----------------------------*/

.ir { display:block; text-indent:-999em; overflow:hidden; background-repeat: no-repeat; }

.clear {display: block; clear: both; height: 0px; line-height: 0px; margin: 0px; border: 0px; padding: 0px; visibility: hidden;}


/* ----------------------------*/
/* CSS3 CLASSES     */
/* ----------------------------*/



/* ----------------------------*/
/* IE CLASSES     */
/* ----------------------------*/



/* ----------------------------*/
/* PRINT STYLES     */
/* ----------------------------*/

@media print {
  * { background: transparent !important; color: #444 !important; text-shadow: none; }
  a, a:visited { color: #444 !important; text-decoration: underline; }
  a:after { content: " (" attr(href) ")"; } 
  abbr:after { content: " (" attr(title) ")"; }
  .ir a:after { content: ""; }  /* Don't show links for images */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  img { page-break-inside: avoid; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3{ page-break-after: avoid; }
}