/* WHOLE DRUM TRUTH
 * Code: William Golden
 * ==|== normalize ==========================================================
 */

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }

html { font-size: 100%; overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
body { margin: 0; font-size: 13px; line-height: 1.231; }
body, button, input, select, textarea { font-family: sans-serif; color: #222; }

::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }
::selection { background: #fe57a1; color: #fff; text-shadow: none; }

a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, monospace; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }

form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; *overflow: visible; }
table button, table input { *overflow: auto; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }

table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }


/* 960 Grid System */

/*
  Forces backgrounds to span full width,
  even if there is horizontal scrolling.
  Increase this if your layout is wider.

  Note: IE6 works fine without this fix.
*/

body {
  min-width: 960px;
}

/* Containers
----------------------------------------------------------------------------------------------------*/
.container_12 {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
}

/* Grid >> Global
----------------------------------------------------------------------------------------------------*/


.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	display:inline;
	float: left;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
}



.push_1, .pull_1,
.push_2, .pull_2,
.push_3, .pull_3,
.push_4, .pull_4,
.push_5, .pull_5,
.push_6, .pull_6,
.push_7, .pull_7,
.push_8, .pull_8,
.push_9, .pull_9,
.push_10, .pull_10,
.push_11, .pull_11,
.push_12, .pull_12 {
	position:relative;
}


/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .grid_1 {
	width:60px;
}

.container_12 .grid_2 {
	width:140px;
}

.container_12 .grid_3 {
	width:220px;
}

.container_12 .grid_4 {
	width:300px;
}

.container_12 .grid_5 {
	width:380px;
}

.container_12 .grid_6 {
	width:460px;
}

.container_12 .grid_7 {
	width:540px;
}

.container_12 .grid_8 {
	width:620px;
}

.container_12 .grid_9 {
	width:700px;
}

.container_12 .grid_10 {
	width:780px;
}

.container_12 .grid_11 {
	width:860px;
}

.container_12 .grid_12 {
	width:940px;
}




/* Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .prefix_1 {
	padding-left:80px;
}

.container_12 .prefix_2 {
	padding-left:160px;
}

.container_12 .prefix_3 {
	padding-left:240px;
}

.container_12 .prefix_4 {
	padding-left:320px;
}

.container_12 .prefix_5 {
	padding-left:400px;
}

.container_12 .prefix_6 {
	padding-left:480px;
}

.container_12 .prefix_7 {
	padding-left:560px;
}

.container_12 .prefix_8 {
	padding-left:640px;
}

.container_12 .prefix_9 {
	padding-left:720px;
}

.container_12 .prefix_10 {
	padding-left:800px;
}

.container_12 .prefix_11 {
	padding-left:880px;
}



/* Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .suffix_1 {
	padding-right:80px;
}

.container_12 .suffix_2 {
	padding-right:160px;
}

.container_12 .suffix_3 {
	padding-right:240px;
}

.container_12 .suffix_4 {
	padding-right:320px;
}

.container_12 .suffix_5 {
	padding-right:400px;
}

.container_12 .suffix_6 {
	padding-right:480px;
}

.container_12 .suffix_7 {
	padding-right:560px;
}

.container_12 .suffix_8 {
	padding-right:640px;
}

.container_12 .suffix_9 {
	padding-right:720px;
}

.container_12 .suffix_10 {
	padding-right:800px;
}

.container_12 .suffix_11 {
	padding-right:880px;
}



/* Push Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .push_1 {
	left:80px;
}

.container_12 .push_2 {
	left:160px;
}

.container_12 .push_3 {
	left:240px;
}

.container_12 .push_4 {
	left:320px;
}

.container_12 .push_5 {
	left:400px;
}

.container_12 .push_6 {
	left:480px;
}

.container_12 .push_7 {
	left:560px;
}

.container_12 .push_8 {
	left:640px;
}

.container_12 .push_9 {
	left:720px;
}

.container_12 .push_10 {
	left:800px;
}

.container_12 .push_11 {
	left:880px;
}



/* Pull Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .pull_1 {
	left:-80px;
}

.container_12 .pull_2 {
	left:-160px;
}

.container_12 .pull_3 {
	left:-240px;
}

.container_12 .pull_4 {
	left:-320px;
}

.container_12 .pull_5 {
	left:-400px;
}

.container_12 .pull_6 {
	left:-480px;
}

.container_12 .pull_7 {
	left:-560px;
}

.container_12 .pull_8 {
	left:-640px;
}

.container_12 .pull_9 {
	left:-720px;
}

.container_12 .pull_10 {
	left:-800px;
}

.container_12 .pull_11 {
	left:-880px;
}




/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */

.clearfix:before,
.clearfix:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.clearfix:after {
  clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix {
  zoom: 1;
}

/* ==|== primary styles =====================================================
   Author: William Golden
   ========================================================================== */

	body {
			font-family: Arial, sans-serif;
			font-size: 11px;
			line-height: 14px;
			color: #6a3800;
	}
   
   
   /* Layout */
   
   #container {

   }
   
   
   /* Layout: Header */
   header {
		border-top: 5px solid #cb5d00;
		margin-top: 30px;
		margin-bottom: 40px;
   }
   
   header h1 a {
   		background: url(../img/layout/logo.png) no-repeat;
		display: block;
		height: 118px;
		margin-top: 15px;
		text-indent: -9999px;
		width: 460px;
   }
   
   /*Navigation */
   
   .block {
	
		border-top: 5px solid #e70088;
   }
   
   #navigation .inner {
		background: #cb5d00;
   }
   
   
   #navigation ul {
		list-style-type: none;
		margin: 0;
		padding: 15px;
		height: 139px;
   }
   
   #navigation ul li {
		margin-bottom: 15px;
	}
	
	#navigation ul li a{
		color: #fff;
		font-family: 'ArcherBold';
		font-size: 16px;
		font-weight: normal;
		text-decoration: none;
		text-transform: uppercase;
	}
	
	#navigation ul li a.current, #navigation ul li a:hover {color: #471c00;}
	
	/* Intro Block */
	
	#intro {
	}
	
	#intro .inner {
			font-size: 20px;
			color: #6a3800;
			line-height: 30px;
			font-family: 'ArcherBook';
	}
	
	#intro .inner a {
			color: #e70088;
			text-decoration: none;
	}
	


	
	
   /* Content */
   
	/* Slideshow */
	
	#slideshow{
			height: 356px;
			width: 618px;
			margin-bottom: 20px;
	}
	#slideshow 
	.rhino-prev  {position: absolute; color: #cb5d00; text-transform: uppercase; top: -23px; right: 50px;}
	.rhino-next  {position: absolute; color: #cb5d00; text-transform: uppercase; top: -23px; right: 0px;}
	#slideshow .rhino-container {
		position: relative;
		top: 0;
		left: 0;

	}

	#slideshow .rhino-container, #slideshow_content{
		margin: 2px 0 0 0 !important;
	}
   #slideshow_content ul {
		padding: 0;
		margin: 0;
		list-style-type: none;
	}
	#slideshow_content li {
		height: 356px !important;
	}
   #taptaptap {
			border-top: 5px solid #3ab6c0;
   }
   
   #boom, #taptaptapbig {
			border-top: 5px solid #355a83;
			text-align: right;
   }
   
   #clickclack {
			border-top: 5px solid #437d4e;
			text-align: right;
   }
   
   #swishswish {
			border-top: 5px solid #3ab6c0;
			text-align: right;
   }
   #tiptap {
			border-top: 5px solid #d8be00;
			text-align: right;
   }
   
   #taptaptapbig {
			position: relative;
			top: 0;
			left: 0;
   }
   
 
	 
	/* Footer */
	
	footer {
			margin-top: 80px;
			margin-bottom: 80px;
			border-top: 5px solid #cb5d00;
			color: #cb5d00;
			padding-top: 12px;
	}
	
	footer a {
			color: #cb5d00;
			text-decoration: none;
			margin-right: 10px;
	}
	
	footer a:hover {
		color: #471c00;
	}
   
	footer a.designedby {
			color: #d8be00;
			float: right;
	}
	
	footer a.designedby:hover {
		color: #471c00;
	}
   /* Typography */
   
   /* Misc */

	.inner {
		margin-top: 3px;
		margin-bottom: 28px;
	}

	.invisible {
		visibility: hidden;
	}

	.columnup {
		position: relative;
		top: -22px;
		left: 0;
	}
	
	.player .block .inner p {
		line-height: 16px;
	}
	.player {
		margin-bottom: 30px;
	}
	.player h2 {
		font-family: 'ITCAvantGardeGothicStdMedium';
		font-size: 25px;
		color: #e70088;
		font-weight: normal;
		margin: 0 0 8px;
	}



	/* Louis Hayes */ 
	.player.lh h2 {
		color: #437d4e;
	}

	.player.lh .block {
		border-top: 5px solid #437d4e;
	}

	/* Willie Jones III */ 
	.player.wj h2 {
		color: #cb5d00;
	}

	.player.wj .block {
		border-top: 5px solid #cb5d00;
	}


	/* Jackie Williams */ 
	.player.jw h2 {
		color: #e70088;
	}

	.player.jw .block {
		border-top: 5px solid #e70088;
	}


	/* Tootie Heath */ 
	.player.th h2 {
		color: #e70088;
	}

	.player.th .block {
		border-top: 5px solid #e70088;
	}

	/* Kenny Washington */
	.player.kw h2 {
		color: #d8be00;
	}

	.player.kw .block {
		border-top: 5px solid #d8be00;
	}

	/* Idriss Muhammed*/
	.player.im h2 {
		color: #3ab6c0;
	}

	.player.im .block {
		border-top: 5px solid #3ab6c0;
	}


	/* Billy Hart*/
	.player.bh h2 {
		color: #3ab6c0;
	}

	.player.bh .block {
		border-top: 5px solid #3ab6c0;
	}


	/* Leroy Williams*/
	.player.lw h2 {
		color: #355a83;
	}

	.player.lw .block {
		border-top: 5px solid #355a83;
	}

	/* Ed Thipen*/
	.player.et h2 {
		color: #d8be00;
	}

	.player.et .block {
		border-top: 5px solid #d8be00;
	}

	/* Ben Riley*/
	.player.br h2 {
		color: #437d4e;
	}

	.player.br .block {
		border-top: 5px solid #437d4e;
	}


        /* Syvlia Cuenca */
        .player.sc h2 {
                color: #D8B300;
        }

	.player.sc .block {
		border-top: 5px solid #D8B300;
	}
	
        /*  Joe Saylor */
        .player.js h2 {
                color: #1E4775;
        }

	.player.js .block {
		border-top: 5px solid #1E4775;
	}
	
	/* Media Page */
	.media_intro .block { border-top: 5px solid #3AB6C0; }
	.media_intro .block .inner{
	
	    color: #3AB6C0;
		font-family: 'ITCAvantGardeGothicStdDemi';
		font-size: 50px;
		font-weight: normal;
		line-height: 50px;
		margin-top: 8px;
		margin-bottom: 26px;
	
	}

	.image .block .inner { margin-bottom: 20px;}
	.image.specialpos {
		position: relative;
		top: 414px;
	}
	
	.image.doublecol .block {
		width: 620px;
	}

	.image.doublecol .block img {
                width: auto;   
        }
	
	.c1 .block{
		border-top: 5px solid #d8be00;
	}
	
	.c2 .block{
		border-top: 5px solid #cb5d00;
	}
	
	.c3 .block{
		border-top: 5px solid #437d4e;
	}
	
	.c4 .block {
		border-top: 5px solid #e70088;
	}
	
	.c5 .block {
		border-top: 5px solid #3ab6c0;
	}
	.c6 .block {
		border-top: 5px solid #d8be00;
	}
	.c7 .block {
		border-top: 5px solid #355a83;
	}
	
	
	/* Review Page */
	
	.review {
		background: #3ab6c0;
		margin-bottom: 18px;
	}
	
	.review p {
		font-family: 'ITCAvantGardeGothicStdBook';
		font-size: 50px;
		color: #fff;
		line-height: 48px;
		padding: 18px;
		margin: 0;
	}
	
	.review p span {
		font-family: 'Arial', san-serif;
		font-size: 11px;
		font-weight: bold;
		display: block;
		line-height: 10px;
		margin-top: 8px;
	}
	
	.review p span span {
		display: inline;
	}
	.review p span em {
		font-weight: normal;
		font-style: italic;
		line-height: 10px;
	}
	
	.idemi {
		font-family: 'ITCAvantGardeGothicStdDemi';
	}
	
	.ibook {
		font-family: 'ITCAvantGardeGothicStdBook';
	}
	
	#r1 {
		height: 177px;
	}
	
	#r2 {
		background: #d8be00;
	}
	
	#r2 p { font-size: 33px; font-family: 'ITCAvantGardeGothicStdDemi';}
	#r2 span { margin-top: 0; }
	#r3, #r4, #r5 {
		height: 275px;
	}
	#r3 p, #r4 p, #r5 p{
		padding-top: 30px;
	}
	
	#r3 {
		background: #437d4e;
	}
	#r3 p{
		font-size: 22px;
		line-height: 23px;
	}
	
	#r4 {
		background: #e70088;
	}
	
	#r4 p{
		font-size: 26px;
		line-height: 30px;
	}
	
	#r5 {
		background: #cb5d00;
	}
	#r5 p {
		font-size: 19px;
		line-height: 22px;
	}
	
	#r6 {
		background: #355a83;
		height: 425px;
	}
	#r6 p {
		font-size: 35px;
		line-height: 39px;
	}
	
	#r7 {
		height: 202px;
	}
	
	#r7 p {
		font-size: 25px;
		line-height: 32px;
	}
	
	
	.sound a{
		display: block;
		cursor: pointer;
	}
/* ==|== non-semantic helper classes ======================================== */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }


/* ==|== media queries ====================================================== */

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


}

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

}



/* ==|== print styles ======================================================= */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } 
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } 
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}


/* Custom Web Fonts */

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

}

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

}

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

}

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


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

div.image a > img {
  width: 300px;
}