@font-face {
	font-family: 'LeagueGothicRegular';
	src: url('fonts/league-gothic/League_Gothic-webfont.eot');
	src: local('?'), url('fonts/league-gothic/League_Gothic-webfont.woff') format('woff'), url('fonts/league-gothic/League_Gothic-webfont.ttf') format('truetype'), url('fonts/league-gothic/League_Gothic-webfont.svg#webfont') format('svg');
	font-weight: normal;
	font-style: normal;
}

body, #content {
	background-color: #0a8ebc;
	color: #69d5fb;
	font-family: Helvetica, Arial, sans-serif!important;}
h1,h2,h3,h4 {
	font-family: "LeagueGothicRegular", sans-serif;
	color: #fcec00;
	text-transform: uppercase;
	font-size: 47px;
	font-weight: normal;
	white-space: nowrap;
	overflow: hidden;
}
h4 {
	font-size:31px!important;
}
h5, h6 {
	font-family: Helvetica, Arial, sans-serif!important;
	color:#fff;
	font-weight: bold;
}
strong, .strong { font-weight:bold; color:#fff;}

ol,
ul { list-style-type:none; margin:0px;}
ol li,
ul li { line-height: 1.3em; margin-bottom: 15px; }

#content{padding-top: 1.5em;}
.section { width:1060px; padding:2em 10px; margin-bottom: 1.5em;}

.hide { display: none;}

.vertical li {
	background-position:  left top;
	background-repeat: no-repeat;
	padding-left:55px;
	padding-top:3px;
	min-height: 30px;
}
.doubledecker li {
	background-position:  left 120px;
	background-repeat: no-repeat;
	width:190px;
	float:left;
	padding-top:123px;
	padding-left:50px;
	min-height: 30px;
}
.horizontal li {
	background-position: center top;
	background-repeat: no-repeat;
	padding-top:45px;
	min-height: 30px;
	float:left;
	list-style-type: none;
	text-align:center;
}

.horizontal em,
.tripledecker em { font-size:0.9em;}
.tripledecker em { font-style: normal;}

.vertical .one { background-image:url(sprite_nums_vert.png); background-position: -10px -10px; }
.vertical .two { background-image:url(sprite_nums_vert.png); background-position: -10px -63px; }
.vertical .three { background-image:url(sprite_nums_vert.png); background-position: -10px -118px;}
.vertical .four { background-image:url(sprite_nums_vert.png); background-position: -10px -172px; }

.doubledecker .one { background-image:url(sprite_nums_dbl.png); background-position:  0px 120px; }
.doubledecker .two { background-image:url(sprite_nums_dbl.png); background-position:  0px -137px; }
.doubledecker .three { background-image:url(sprite_nums_dbl.png); background-position:0px -393px;}
.doubledecker .four { background-image:url(sprite_nums_dbl.png); background-position: 0px bottom; }

.horizontal .one { background-image:url(sprite_nums_dbl.png); background-position:  center 0px; }
.horizontal .two { background-image:url(sprite_nums_dbl.png); background-position:  center -257px; }
.horizontal .three { background-image:url(sprite_nums_dbl.png); background-position:center -513px;}
.horizontal .four { background-image:url(sprite_nums_dbl.png); background-position: center -770px; }

.doublelined { padding-top:0px!important; }
.two.doublelined { background-position: -10px -56px; }

/*#header { background: #000 url(cusack_header.png) no-repeat center 2px !important; }*/
#banner { background: #69d5fb url(cusack_header.png) no-repeat center bottom; height: 600px;
}
#footer { background-color: #004058; }
.bigbox { background-color: #03a1d8; }
.section { border-bottom-color: #29bdf1; }
.exhibit { color: #025b7a; font-size: 14px; font-weight: bold; font-style: italic;}
#respond { background-color: #0a8ebc; }
#respond input, #respond textarea { background-color: #69d5fb!important; }
#respond a {
	color:#69d5fb;
	text-decoration: underline;
}
#respond a:hover {
	color: #fff;
}

#introleft { width: 570px; margin-right:150px;}
#mixtapeleft { width: 420px; margin-right: 60px;}
#timelineleft { width: 520px; margin-right:75px;margin-bottom: 75px;}
#timelineright { width: 465px; }
#boyleft { width: 360px;}
#boyright{margin-bottom: 20px;}
#rideleft { width:540px;}
#adversaryleft { width: 600px; }
#adversaryright { width: 460px; }
#resultsleft { width:540px;}
#bonusleft { width: 420px;}
#bonusright { width: 640px;}

#resultsright .two {
	margin: 32px 0px 29px;
}

#bonusright p {
	line-height: 26px;
	margin-bottom: 40px;
}

#bonusright h2 {
	margin-bottom: 16px;
}

#mixtaperight li {
	margin-bottom: 45px;
}

#mymixtape {
	position: relative;
}

#mymixtape .jp-single-player {
	background:url(tape_deck_clean.png) no-repeat;
	height: 248px; width:400px;
	display: block;
}

#mymixtape .jp-play,
#mymixtape .jp-pause {
	height: 248px; width:400px;
	display: block;
	text-indent: -9996px;
	position:absolute; top:0px;
}

#mymixtape .jp-play{
	background: url(click_to_launch.png) no-repeat center 152px;
	-webkit-transition: all 0.3s ease-out;
}

#mymixtape .jp-pause {
	background: url(click_to_eject.png) no-repeat center 152px;
	-webkit-transition: all 0.3s ease-out;
}

#mymixtape .rightwheel,
#mymixtape .leftwheel {
	background: url(tape_wheel.png) no-repeat;
	height: 49px;
	width:49px;
	direction: block;
	position: absolute;
	z-index: 10;
	top:89px;
}

#mymixtape .leftwheel {
	left:96px;
}


#mymixtape .rightwheel {
	left:254px;
}

.playing .leftwheel, .playing .rightwheel {
  -webkit-animation-name: sidewinder;
  -webkit-animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: linear;
}

@-webkit-keyframes sidewinder {
  0% {
    -webkit-transform:rotate(0deg);
  }
  100% {
    -webkit-transform:rotate(-360deg);
  }
}

#daydreamschart {
	background: url(therewasaboy_numbered.png) no-repeat;
	height:222px;
	width:700px;margin-top: 50px;margin-bottom: 30px;}
#daydreamschart li { text-indent: -9996px;}

#ride .doubledecker {
	background: url(rides.png) no-repeat left top;
}

#ride .col1 { width:200px; display: inline-block;}
#ride .col2 { width:200px; display: inline-block; }
#rideright ol li{margin-bottom:25px ;}

#sidekickschart {
	background: url(sidekicks.png) no-repeat;
	width:1060px;
	padding-top:240px;
}
#sidekickschart li { width: 16%; }

#girlschart {
	background: url(girls.png) no-repeat left top;
	padding-top:220px;
	width:630px;
	margin-right:30px;
}

#girlsleft {
	width:660px;
}

#girlschart li { width: 25%; }
#girlsright ol li{margin-bottom:25px;}

.legend { margin-left:45px;}

#adversary .col1 { width:295px; display: inline-block;}
#adversary .col2 { width:200px; display: inline-block; }
#adversaryleft ol li{margin-bottom:25px ;}

#adversary .doubledecker {
	width:460px;
	background: url(inway.png) no-repeat left top;
}

#adversary .doubledecker .two,
#adversary .doubledecker .four {
	width:190px;
	float:left;
}

#adversary .doubledecker .two,
#adversary .doubledecker .four {
	width:170px;
	float:left;
}

#resultsleft ol li, #resultsright ol li{margin-bottom:25px ;}


.follow-us a {
	background-image: url(sprite_follow.png);
	background-color: #025b7b;
}

.follow-us a:hover {
	background-color: #0a8ebc!important;
}

#footer .credits {
	color:#0a8ebc;
}

#footer .credits a {
	color:#69d5fb;
	border-bottom:2px solid #358baa;
	text-decoration: none;
	padding-left:0px;
	margin-left:3px;
}

#footer .credits a:hover {
	color:#fff;
}

.comment-count {
	font-size: 14px;
	margin: 0px;
}

.commentlist::-webkit-scrollbar-track-piece  {
    background-color: #29bdf1;
}
.commentlist::-webkit-scrollbar-thumb:vertical {
    height: 10px;
    background-color: #0a8ebc;
}

.commentlist { font-family: Helvetica, Arial, sans-serif!important; padding-top:10px;}

.comment-body cite { top:0px;}
.comment-body .comment-meta { top: 16px; }
.comment-body cite, .comment-body cite a, .comment-meta a { color: #fff!important; line-height: 1em; }
.comment-body cite a:hover,.comment-meta a:hover { color: #29bdf1!important; }
.comment { border-bottom-color: #29bdf1;}

input#submit { background-color: #03a1d8!important; color: #fff; font-weight:bold; width: 96px; display: block; font-family: Helvetica, Arial, sans-serif!important;}

input:hover#submit {
	background-color: #025b7b!important;
}

input:active#submit {
	background-color: #358baa;
}

#socialmedia a {
	background-image: url(./sprite_social.png);
}

::-moz-selection{
	background:#fcec00;
	color:#fff;
}

::selection {
	background:#fcec00;
	color:#fff;
}

/* 404
-------------------------------------------------------------- */
#inyoureyes a, #footer .left a{color: #d2ecfb!important;}
#inyoureyes a:hover{color: #fff!important;}
#inyoureyes {
	background: url(./404cusack.png) no-repeat 580px;
	padding-right:540px;
	width:540px;
	height:606px;
	text-align:left;
	margin-top:60px;
}

#inyoureyes p {
	margin-bottom: 0px;
}

#inyoureyes {
	-webkit-animation-name: cusack-slider;
	-webkit-animation-duration: 4s;
	-webkit-animation-iteration-count: 1;
	-webkit-animation-timing-function: ease-out;
}


@-webkit-keyframes cusack-slider {
	0% {
		background-position: 400px 606px;
	}
	100% {
		background-position: 580px 0;
	}
}