/* -------------------------------------------------------------- 
   reset.css
   * Resets default browser CSS.
	Bassed on reset from Blueprint and  Eric Meyer Reset Reloaded
	
   	http://www.blueprintcss.org/
	http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
-------------------------------------------------------------- */

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, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

h1,h2,h3,h4,h5,h6{
	font-size:100%;
	font-weight: bold;
}

/* remember to define focus styles! ------------------------------Need to investigate the accesability issues */
:focus {
	outline: 0;
}

ol, ul {
	list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}

caption, th, td {
	text-align: left;
	font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}

blockquote, q {
	quotes: "" "";
}

fieldset, img{
	border:0;
}

address,caption,cite,code,dfn,em,th,var{
	font-style:normal;
	font-weight:normal;
}
caption,th {
	text-align:left;
}



/* 
 TYPOGRAPHY
 Font related information only (ie. font-*, text-*, line-height )
 See http://www.alistapart.com/articles/howtosizetextincss for sizing technique
 for a quick note - just hit this: http://jontangerine.com/silo/css/pixels-to-ems/ very easy guide to use.

	10px 	{font-size:0.625em;}
	11px 	{font-size:0.688em;}
	12px 	{font-size:0.75em;}
	13px 	{font-size:0.813em;}
	14px 	{font-size:0.875em;}
	15px 	{font-size:0.938em;}
	16px 	{font-size:1em;}
	17px 	{font-size:1.063em;}
	18px 	{font-size:1.125em;}
	19px 	{font-size:1.188em;}
	20px 	{font-size:1.25em;}
	21px 	{font-size:1.313em;}
	22px 	{font-size:1.375em;}
	23px 	{font-size:1.438em;}
	24px 	{font-size:1.5em;}

*/

/* so:font-family */

body, input, textarea, #twitter p.posted-by, p.label-p label {
	font-family: 'Arial', helvetica, sans-serif;
}

.flash.notice, legend, #games #main-content a, #comments #content #errorExplanation, .success, .failure, #signup #content strong, #signup h3, #highscores, #section dt, #supporting-content #page-nav ul li, label, .no-comments, #comments-list ul li span.comment-meta, ul.documents li, h1, h2, h3, h4, h5, p.post-meta, #twitter p.tweet, dl#articles-list dt a, dl#articles-list dd p.comment-count, dl#articles-list dd p.comment-leave, #articles #supporting-content, .pagination, .footer-pagination, #ppcDetected, a.usa-link, a.teachers-link {
	font-family: 'Courier', arial, helvetica, sans-serif;
}

/* eo:font-family */

/* so:font-sizes */

	/* 11px */	
#footer, .feature p, #twitter p.posted-by,
dl#articles-list dd p.description,
p.post-meta,
dl#articles-list dd p.comment-leave,
#main-content ol,
#main-content ul,
#section dd,
#games #supporting-content p	{
		font-size:0.688em;
	}

	/* 12px */ 	
dl#articles-list dd p.comment-count,
#articles #supporting-content h2,
#supporting-content ul li,
.pagination, 
.footer-pagination,
#section dt,
#signup h3,
#sessions #content, #comments form,
#main-content p	{
		font-size:0.75em;
	}

	/* 14px */ 
#comments #content #errorExplanation ul, #comments #content #errorExplanation p, #signup #content strong, #supporting-content #page-nav h2, #games #main-content p, #articles.show #main-content h2#respond, #supporting-content #page-nav ul li	{
		font-size:0.875em;
	}

	/* 16px */ 	
input, textarea,
#supporting-content ul li ul li,
#main-content h4,
legend,
#main-content #errorExplanation h2,
ul.documents li	{
		font-size:1em;
	}

	/* 17px */ 	
label	{
		font-size:1.063em;
	}

	/* 18px */ 	
#highscores, #games #supporting-content h2, main-content h3, .feature h1, #twitter p.tweet, dl#articles-list dt a	{
		font-size:1.125em;
	}

	/* 20px */ 	
#articles.show #main-content p.no-comments,	 #main-content h2, #sessions h2, #errorExplanation 	{
		font-size:1.25em;
	}

	/* 24px */	
h1#location , #main-content h1, .success, .failure	{
		font-size:1.5em;
	}

/* eo:font-sizes */

/* so:font-styles */

	/* Bold */
dl#articles-list dd p.comment-count,
dl#articles-list dd p.comment-leave,
#twitter p.tweet,
#main-content p strong,
#comments-list ul li span.comment-meta,
#highscores,
#sessions a,
#sessions h2,
.success, .failure  {
		font-weight: bold;
	}

	/* Italic */
#main-content p em	{
		font-style: italic;
	}

	/* Underline */

	/* Unordered List */
#main-content ul	{
		list-style-type: disc; 
		list-style-position:inside;
	}

	/* Ordered List */
#main-content ol	{
		list-style-type: decimal;
		list-style-position:inside;
	}

#main-content #comments-list ul, #main-content ul.gallery {list-style-type:none;}

	/* Uppercase */
#articles #supporting-content h2,
.pagination, 
.footer-pagination,
label,
#signup h3,
ul.documents li a em	{
		text-transform: uppercase;
	}

ul.documents li a em {
	letter-spacing:2px;
}
	
ul.documents li a em span {
	text-transform: none;
	letter-spacing:normal;
	padding-left:15px;
}

ul.documents li a em span.seperator {
	text-transform: none;
	letter-spacing:normal;
	padding-left:0px;
	margin-left:-10px;
}


	/* Normal */
a:hover	{
		text-decoration: none !important;
	}
	
#main-content h1, 	#signup h3, #articles #supporting-content h2	{font-weight: normal;}

#main-content #errorExplanation ul {list-style-position:inside;}
	
/* eo:font-styles */

/* so:line-height*/
 
#footer p {
	line-height:18px;
	}
	
.feature h1,
#twitter p.tweet,
dl#articles-list dt a,
dl#articles-list dd p.comment-count {
	line-height:20px;
	word-spacing: -3px;
}

.feature p,
#twitter p.posted-by,
dl#articles-list dd p.description,
dl#articles-list dd p.comment-leave,
p.post-meta,
#main-content p,
h2#respond,
#section dd,
#games p {
	line-height:16px;
}

#games #supporting-content h2, #main-content h1,
#highscores,
#signup #content strong {
	line-height:26px;
}

p.label-p label {font-size:12px; 	text-transform: none;}

#signup h3,
label  {
	line-height:20px;
}
/* eo:line-height*/


  a.usa-link, a.teachers-link {
  		font-size:0.75em;
  	}

/*
  LAYOUT
  Page positioning of elements. Plus borders, padding, margins etc.
  Note: border color and style sghould go in skin.css
*/

/* so:main-layout */

#wrap {
	width:960px;
	margin:auto;
	position: relative;
}

#header {
	height:252px;
	position:relative;
	left:-97px;
	width:1057px;
}

#content {
	margin:40px auto 20px;
	padding-top:87px;
}

#terms-conditions #content,
#privacy-policy #content {
	padding-top:0px;
}

#main-content {
	width: 650px;
	position:relative;
}

#supporting-content,
#sidebar {
	width: 310px;
	position:relative;
}

#footer {
	height:230px;
	padding:20px;
	position:relative;
}

#the-book #main-content,
#the-author #main-content,
#missions #main-content,
#downloads #main-content,
#terms-conditions #main-content,
#privacy-policy #main-content {float:right; width:568px; margin-right:22px;}

#submissions #main-content  {float:left; width:568px; margin-left:23px;}

#the-book #supporting-content,
#the-author #supporting-content,
#missions #supporting-content,
#downloads #supporting-content,
#terms-conditions #supporting-content,
#privacy-policy #supporting-content  {float:left; position:relative;}

#the-book #section,
#the-author #section,
#missions #section,
#downloads #section,
#terms-conditions #section,
#privacy-policy #section {float:right; width:568px; margin-right:22px;}

/* so:pages */

#supporting-content #page-nav h2 {
	padding:45px 40px 2px 22px;
}

#supporting-content #page-nav  {
	margin-left: 22px;
	min-height:100px;
}

#supporting-content #page-nav ul {
	padding-bottom:48px;
}

#supporting-content #page-nav ul li ul {
	padding:0;
}

#supporting-content #page-nav ul li {
	padding:12px 0 11px 35px;
	margin:0 40px 0 20px;
}

#supporting-content #page-nav a,
#supporting-content #page-nav span {display:block;}

#supporting-content #page-nav ul li ul li {
	margin:0 0 0 7px;
	padding:4px 0 5px 14px;
}


#supporting-content #page-nav ul li:first-child {
	margin-top:9px;
}

#supporting-content #page-nav ul li ul li:first-child {
	margin-top:5px;
}

#the-book #main-content h1,
#the-author #main-content h1,
#missions #main-content h1,
#downloads #main-content h1,
#terms-conditions #main-content h1,
#privacy-policy #main-content h1 {margin-bottom:15px;}

#section {margin-bottom:20px;}
#section h2 {height:78px;}
#section dl {padding-bottom:15px;}
#section dt {margin:0 30px 4px 30px;}
#section dt a {padding:0 20px 0 20px;}
#section dd {margin:0 30px 18px 30px; padding:0 20px 0 20px;}

#the-book #sign-up,
#the-author #sign-up,
#missions #sign-up,
#downloads #sign-up,
#terms-conditions #sign-up,
#privacy-policy #sign-up {left:-14px; top:11px;}

/* eo:pages*/

/*so:header*/

h1#site-name a#logo {
	position: absolute;
	top: 21px;
	left: 447px;
	height:160px;
	width:265px;
}

h1#site-name a#puffin {
	display:block;
	height:87px;
	left:135px;
	position:relative;
	top:88px;
	width:92px;
}

	h1#site-name a#puffin span.hover {
		height:87px;
		left:0;
		position:absolute;
		top:0;
		width:92px;
		display:block;
	}

/*eo:header*/

/*so:footer*/

#footer div.vcard {position:absolute; top:191px; left:23px;}
#footer ul#footer-sub {position:absolute; top:209px; left:23px;}
#footer ul#footer-sub li {float:left; margin-right:10px;}
#footer p {position:absolute; top:189px; right:22px;}

/*eo:footer*/

/*so:nav*/

ul#nav, ul#sub-nav, ul#footer-nav {
	position: absolute;
}

ul#nav {
	bottom:-7px;
	height:69px;
	left:121px;
}

	ul#nav li, ul#footer-nav li {
		float:left;
		margin:9px 15px 0 0;
	}

		ul#nav li a, ul#footer-nav li a {
			width:140px;
			height:53px;
			position:relative;
			display:block;
		}

		ul#nav li a *, ul#footer-nav li a *, ul#sub-nav li a *, #sign-up a *, a#puffin * {display:none;}

		ul#nav li a span.hover, ul#footer-nav li a span.hover {
			width:140px;
			height:53px;
			position:absolute;
			display:block;
			top:0;
			left:0;
		}

ul#sub-nav {
	top:60px;
	right:23px;
	width:140px;
}

	ul#sub-nav li {
		height:40px;
		margin:3px 0 28px 1px;
		position:relative;
		width:126px;
	}

		ul#sub-nav li a {
			position:relative;
			width:140px;
			height:53px;
			display:block;
		}

		ul#sub-nav li a span.hover {
			position:absolute;
			width:140px;
			height:53px;
			display:block;
			top:0;
			left:0;
		}

ul#footer-nav {
	height:69px;
	width:960px;
	left:23px;
	top:-9px;
}

/*eo:nav*/

/*so:home*/

#home #content {
	margin:20px auto 20px;
	padding:0px;
}

#banner {
	margin: 0px auto 28px;
	height: 328px;
}

#main-content {float:left;}
#supporting-content, #sidebar {float:right;}

/*eo:home*/

/*so:features*/

#features {
	width: 915px;
	margin:0 auto 48px;
}

.feature {
	width:280px;
	height:271px;
	float:left;
	margin-left:37px;
	position:relative;
}

.feature:first-child {margin-left:0px;}
.feature h1 {padding:22px 0 0 24px; height:40px;}
.feature p {padding:34px 24px 0;}

.feature a.more {
	position:absolute;
	bottom:10px;
	right:4px;
	width:52px;
	height:28px;
}
li.feature img {
	float: left;
  margin: 37px 10px 10px 24px;
}

.feature #countdown_1, .feature #countdown_2, .feature #countdown_3 {
  bottom: 39px;
  left: 24px;
  position: absolute;
}

/*eo:features*/


/*so:twitter*/

#twitter p.posted-by {margin-top:10px;}

#twitter a#follow {
	width:100px;
	height:71px;
	margin-top:2px;
	position:relative;
	z-index:1;
	display:block;
}

	#twitter a#follow span.hover {
		width:100px;
		height:71px;
		top:0;
		position:absolute;
		left:0;
		display:block;
	}

#twitter {padding:87px 22px 0px 19px;}

#widget {
  margin-left: 18px;
}

/*eo:twitter*/

/* so:sign-up */

#sign-up {
	width:305px;
	height:277px;
	left:-16px;
	top:0px;
	position:relative;
}

#sign-up a {
	height:146px;
	left:35px;
	position:relative;
	display:block;
	top:33px;
	width:270px;
}

#sign-up a span.hover {
	height:146px;
	left:0;
	position:absolute;
	display:block;
	top:0;
	width:270px;
}

#articles #sign-up {top:0px; left:-36px;}
/* eo:sign-up */

/*so:articles*/
#articles #main-content {padding:0 40px 0 23px; width:575px;}

#blog {padding:87px 40px 0 23px;}

dl#articles-list dt {margin-bottom:5px; padding-top:30px;}
dl#articles-list dt:first-child {padding-top:0px;}

dl#articles-list dd p.comment-count {
  float: right;
  height: 25px;
  padding: 19px 15px 0 0px;
  position: relative;
  top: -23px;
  width: 36px;
  overflow: hidden;
  text-align: center;
}

dl#articles-list dd p.comment-leave {float:right; margin-right:8px;}
dl#articles-list dd p.description {margin-bottom:12px;}

#gallery {position:relative; margin:20px 0;height:135px; width:575px; clear:both;}
.image-gallery {margin:0px auto; padding-top:27px;}
ul.gallery {margin-bottom:10px; list-style-type:none; margin-left:0; clear:both;}
ul.gallery li {margin: 0 7px 0 8px;float:left;}
ul.gallery li img {width:132px; height:99px; margin-top:4px;}

a.forward, a.back {width:17px; height:19px; position:absolute;}
a.forward {top:73px; right:25px;}
a.back {top:73px; left:25px;}

#main-content ul.documents {margin-bottom:10px; list-style-type:none; margin-left:0; clear:both; padding:20px 0 20px 0;}
ul.documents li {padding-bottom:5px;}

dl#articles-list dt img {float:left; margin:0 20px 22px 0;}
dl#articles-list dt {clear:both;}

#main-content ul,
#main-content ol {
	margin-bottom:10px;
	margin-left:20px;
}

#articles #supporting-content h2 {padding-bottom:30px;}
#articles #supporting-content {width:290px;}

#articles #supporting-content ul.article-list li {margin-bottom:18px;}
#articles #supporting-content ul.article-list li a {clear: both; display:block; margin-bottom:5px;}
#articles #supporting-content ul.article-list,
#articles #supporting-content ul.archive {margin-bottom:25px;}
#articles #supporting-content ul.archive li {padding:0 0 12px 0;}
#articles #supporting-content ul.archive li span {margin-right:10px; float:left; margin-top:3px;}
#articles #supporting-content ul.archive li ul {margin:12px 0 0 0;}
#articles #supporting-content ul.archive li ul li {padding:7px 0 0 36px;}
#articles #supporting-content ul.archive li ul li:first-child {padding:0 0 0 36px;}

#main-content h2,
#main-content h3,
#main-content h4 {margin-bottom:10px;}

a.rss {
	height:20px;
	left:115px;
	position:absolute;
	top:-65px;
	width:20px;
}

#home a.rss {
	top:20px;
}

#articles.show p.post-meta {margin:4px 0 15px 0px;}
#main-content p img {float:left; margin:0 20px 20px 0; clear:both; padding:5px;}
#main-content p {margin-bottom:10px;}

/*eo:articles*/

/*so:comments*/

#comments #content {padding:0 0 0 23px;}

#comments-list {clear:both;}

h2.comment-title {width:610px; height:69px; margin-left:-23px; margin-bottom:5px !important;}
h2#respond {margin-bottom: 20px !important; padding-top:60px;}

#comments-list ul {margin-left:0 !important;}
	#comments-list ul li {clear:both; padding-top:40px;}
	#comments-list ul li:first-child {padding-top:20px;}
		.comment-meta {width:87px; float:left; margin-right:20px;}
		.comment {width:460px; float:right;}

	.no-comments {padding-top:25px;}

#comments #content #errorExplanation {margin-bottom:20px;}
#comments #content #errorExplanation h2 {margin-bottom:5px;}
#comments #content #errorExplanation ul {margin:10px 0 0 10px;}
#comments #content p#name-comment, #comments #content p#email-comment, #comments #content p#message-comment {margin-bottom:10px;}

h1#location {margin-bottom:20px;}


/*eo:comments*/

/*so:pagination*/

.pagination {clear:both; position:relative; text-align:center; padding-bottom:30px; margin-bottom:20px;}
	.pagination .prev_page {position:absolute; left:0px; top:0px;}
	.pagination .next_page {position:absolute; right:20px; top:0px;}

.footer-pagination {clear:both; position:relative; text-align:center; padding-top:30px; margin-bottom:30px;}
	.footer-pagination .prev_page {position:absolute; left:0px; bottom:0px;}
	.footer-pagination .next_page {position:absolute; right:20px; bottom:0px;}

/*eo:pagination*/

/* so:game */

#game {margin-bottom:-7px; position:relative; top:-40px;}
#games #content {padding:0 0 0 23px;position:relative;}
#games #supporting-content h2 {margin-bottom:10px;}
#games #main-content {margin-left:-23px; padding-left:23px; width:627px; padding-top:73px;}
#games #supporting-content {padding-top:92px;width:265px; padding-left:23px; padding-right:22px;}
#games #supporting-content #sign-up {left:-36px; top:0px;}
#games #supporting-content p {margin-bottom:10px;}
#highscores {margin-bottom:30px;}
#highscores tbody td {padding:8px 0;}
#highscores tbody tr#rank-4 td {padding:17px 0 7px;}

/* eo:game */



/*so:signup*/

	#signup #content h1 {height:69px; margin-bottom:35px;}
	#signup #content {padding-top:0;}
	#signup #main-content {padding:0 22px 0 23px; width:auto;}

/*eo:signup*/

/*so:sessions*/

#sessions #content {padding-top:0px; padding-left:23px;}
#sessions #session_submit {width:70px; height:61px; margin:10px 0px;}
#sessions #session_email {margin:10px 0px;}

.success, .failure {padding:10px; margin:0 22px 20px 0;}

/*eo:sessions*/

/*.fieldWithErrors {
	display: inline;
}*/


#top-banner {
  background: url(/images/banner-wrap-bg.jpg) repeat-x top center;
  height: 30px;
  padding: 0;
}

#banner-wrap {
  margin: 0 auto;
  width: 960px;
  height: 30px;
  }

  a.usa-link, a.teachers-link {
    display:block;
    margin:0 0 0 20px;
    padding:8px 0 3px 30px;
	float: left;
  }

  	a.teachers-link {
		float: right;
		margin-right: 20px;
		padding-left: 20px;
	}


/* so:clearfix */

#content:after,
#footer:after,
#features:after,
#comments-list ul:after,
.book-block:after,
.float-block p:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

/* eo:clearfix */

/*Books*/

.book-block {
  clear:both;
  display: block;
  margin-bottom: 20px;
}

.float-block {
  float:left;
  display: block;
  padding: 0;
  margin: 0 20px 20px 0;
  text-align:center;
}

.float-block img{
  width: 180px;
}

.amazon-link{text-transform: uppercase;font-weight:bold}

.ibookstore_link img{
  margin: 0 23px !important;
  width: 132px !important;
}



/*OVERLAY*/

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 101%;
  background: url(/images/overlay-bg.png);
  z-index: 99999999;
}

.overlay.hidden{display:none;}

.overlay .overlay-content {
  width: 968px;
  margin: 66px auto 0 auto;
  position: relative;
  left:-19px;
}

.overlay .close {
  float: right;
  position: relative;
  right: -44px;
  top: -51px;
}

.overlay .title{margin: 0 0 0 192px;}
.overlay img{float:left;}
.overlay .links {float: left;}

.overlay .right-col {float: right;}
.overlay .right-col .youtube {margin: 26px 0 8px 0;}
.overlay .right-col .prologue {margin: 0 0 0 80px;}

.overlay .overlay-footer{
  clear: both;
  text-align: center;
  padding: 42px 0 0 0;
}
.overlay .logo {float: left;margin: 0 0 0 86px;}
.overlay .overlay-footer .enter{
  position: relative;
  top: 30px;
  left: -39px;
}
.overlay .puffin{float:right;margin: 11px 50px 0 0;}


/*
  SKIN
  All colour and background image styling.
*/

body {
  background: #000000;
  color: #FFF;
}

/* so:pages */

#supporting-content #page-nav h2 {
  background: url(/images/supporting-top.gif) no-repeat;
  color:#fff;
}

#supporting-content #page-nav  {
  background: url(/images/supporting-middle.gif) repeat-y;
}

#supporting-content #page-nav ul {
  background: url(/images/supporting-bottom.gif) no-repeat bottom left;
}

#supporting-content #page-nav ul li ul {
  background: none;
}

#supporting-content #page-nav ul li {
  border-top:1px solid #1e1e1e;
  color:#292929;
  background: url(/images/bull.gif) no-repeat 22px 17px;
}

#supporting-content #page-nav ul li ul li {
  border-top:none;
  background: url(/images/bull.gif) no-repeat 0px 8px;
}

#supporting-content #page-nav a {background: url(/images/arrow-grey.gif) no-repeat center right;}
#supporting-content #page-nav a:hover {background: url(/images/arrow-blue.gif) no-repeat center right;}
#supporting-content #page-nav span {color:#fff; background: url(/images/arrow-white.gif) no-repeat center right;}

#supporting-content #page-nav a {color:#01bbc7;}

#section {background: url(/images/section-background.gif) repeat-y;}
#section h2 {background: url(/images/section-header.gif) no-repeat top center;}
#section dl {background: url(/images/section-foot.gif) no-repeat bottom center;}
#section dt a {color:#fff; background: url(/images/section-bull.gif) no-repeat left center;}
#section dt a:hover {background: url(/images/section-bull-white.gif) no-repeat left center;}
#section dd {color:#a99c90;}

/* eo:pages*/

/* so:header */

#header {background: url(/images/header.jpg) no-repeat;}
a.usa-link, a.teachers-link {
  background:transparent url(/images/usa.gif) no-repeat scroll 0 5px;
  color:#FFFFFF !important;
}

a.teachers-link {
	background:transparent url(/images/teachers.gif) no-repeat scroll 0 5px;
}

a.usa-link span, a.teachers-link span {
  color: #019DC7 !important;
}
/* eo:header */

/* so:footer */

#footer {background: url(/images/footer.jpg) no-repeat;}

#footer div.vcard {color:#fff;}
#footer a {color:#019dc7;}
#footer a:hover {color:#fff;}
#footer p {color:#6f6f64; text-align:right;}

/* eo:footer */

/* so:links */

a {text-decoration: none;}
a:hover {text-decoration: underline;}

/* eo:links */

/*so:features*/

.feature {
  background: url(/images/article-box-large.gif) no-repeat;
  color:#fff;
}

.feature:hover {cursor:pointer;}

.feature a.more {background: url(/images/more-sprite.gif) no-repeat;}
.feature:hover a.more {background: url(/images/more-sprite.gif) no-repeat 0 -29px;}

/*eo:features*/

/* so:home */

#home #main-content #blog {background: url(/images/home-blog.gif) no-repeat top right;}
#home #supporting-content #twitter {background: url(/images/home-twitter.gif) no-repeat top left;}

/* eo:home */

/* so:twitter */

#twitter p.tweet {color:#fff;}
#twitter p.posted-by {color:#3d3730; word-spacing: normal; }
#twitter a#follow {background: url(/images/follow.jpg) no-repeat 0 0;}
#twitter a#follow.fade span.hover, #twitter a#follow.no-js:hover {background: url(/images/follow.jpg) no-repeat 0 -71px;}

/* eo:twitter */

/* so:sign-up */

#sign-up {background: url(/images/sign-up.jpg) no-repeat;}

/* eo:sign-up */

/* so:articles */

#articles #content {background: url(/images/articles-header.gif) no-repeat;}

dl#articles-list dt {background: url(/images/divider.gif) no-repeat;}
dl#articles-list dt:first-child {background:none;}

#main-content h1 {color:#fff;}
#main-content p,
p.label-p label,
#main-content ul,
#main-content ol {color:#a99c90;}
#main-content p.post-meta {color:#3d3730;}
#main-content a {color:#01bbc7;}
#main-content a:hover {color:#fff;}

#main-content p img {
  border:1px dashed #374d86;
}

#articles.show #main-content h2,
#articles.show #main-content h3,
#articles.show #main-content h4 {color:#fff;}

#main-content h2,
#main-content h3,
#main-content h4 {color:#fff;}

dl#articles-list dt a {color:#01bbc7;}
dl#articles-list dt a:hover {color:#fff;}
dl#articles-list dd p.description {color:#a99c90;}
dl#articles-list dd p.comment-count {color:#000 !important;}
dl#articles-list dd p.comment-leave a {color:#01bbc7;}
dl#articles-list dd p.comment-leave a:hover {color:#fff;}
dl#articles-list dd p.post-meta {color:#3d3730;}

dl#articles-list dd p.comment-count {background: url(/images/comment-bubble.gif) no-repeat;}

#articles #supporting-content a {color:#01bbc7;}
#articles #supporting-content a:hover {color:#fff;}
#articles #supporting-content ul.archive li span {color:#01bbc7;}
#articles #supporting-content {color:#3d3730;}
#articles #supporting-content h2 {color:#646a64;background: url(/images/sub-divider.gif) no-repeat center left;}

#gallery {background: url(/images/gallery.gif) no-repeat top left;}

a.forward {background: url(/images/gallery-right.gif) right;}
a.forward:hover {background-position: left;}

a.back {background: url(/images/gallery-left.gif) left;}
a.back:hover {background-position: right;}

ul.documents {background: url(/images/divider.gif) no-repeat top center;}

ul.documents li a em, ul.documents li a em span.seperator, ul.documents li a:hover em span.seperator {color:#646a64;}
ul.documents li a em span {color:#01bbc7;}
ul.documents li a:hover em span {color:#fff;}
ul.documents li a {color:#3d3730 !important;}

#articles #supporting-content ul.archive li span {background: url(/images/plus-minus.gif) no-repeat top left; width:7px; height:7px;}
#articles #supporting-content ul.archive li span.up-button {background: url(/images/plus-minus.gif) no-repeat top right; width:7px; height:7px;}

/* eo:articles */

  /* so:comments */

  h2.comment-title {background: url(/images/comments-header.gif) no-repeat top left;}

  #comments-list ul li {background: url(/images/comment-divider.gif) no-repeat center;}
  #comments-list ul li:first-child {background:none;}

  #comments-list ul li span.comment-meta {color:#646a64;}
  #comments-list ul li span strong {color:#01bbc7;}
  #articles.show #main-content h2#respond {color:#fff; background: url(/images/divider.gif) no-repeat center 25px;}

  #articles.show #main-content p.no-comments {color:#fff;}

  #comments #content #errorExplanation, h1#location  {color:#fff;}

  /* eo:comments */

  /* so:pagination */
  .pagination {background: url(/images/divider.gif) no-repeat 0px 30px;}
  .footer-pagination {background: url(/images/divider.gif) no-repeat 0px 10px;}

    .pagination span, .footer-pagination span{color:#646a64;}
    .pagination a, .footer-pagination a{color:#01bbc7;}
    .pagination a:hover, .footer-pagination a:hover {color:#fff; }

  /* eo:pagination */

/* so:signup */

  #signup #content h1 {background: url(/images/signup-header.gif) no-repeat top left;}
  #signup h3 {color:#646a64;}
  #signup #content strong {color:#fff;}

/* eo:signup */

/* so:game */

#games h1, #games h2 {color:#fff;}
#games p {color:#a99c90;}
#games a {color:#01bbc7;}
#games a:hover {color:#fff;}

#games #main-content {background: url(/images/highscores-header.gif) no-repeat top right;}
#games #supporting-content {background: url(/images/about-header.gif) no-repeat top left;}

#highscores tbody {color:#9e9286;}

#highscores tbody tr td.left {background: url(/images/divider-l.gif) no-repeat top left; position:relative;}
#highscores tbody tr td.middle {background: url(/images/divider-m.gif) no-repeat top center; position:relative;}
#highscores tbody tr td.right {background: url(/images/divider-r.gif) no-repeat top right; position:relative;}

#highscores tbody tr#rank-4 td.left {background: url(/images/d-divider-l.gif) no-repeat top left; position:relative;}
#highscores tbody tr#rank-4 td.middle {background: url(/images/d-divider-m.gif) no-repeat top center; position:relative;}
#highscores tbody tr#rank-4 td.right {background: url(/images/d-divider-r.gif) no-repeat top right; position:relative;}

#highscores tbody tr#rank-1 td {background:none}

tr#rank-1 {color:#fff000;}
tr#rank-2 {color:#fff;}
tr#rank-3 {color:#8a5809;}

#highscores tbody tr#rank-4 {background: url(/images/double-divider.gif) no-repeat top center;}

tr#rank-4, tr#rank-5,
tr#rank-6, tr#rank-7,
tr#rank-8, tr#rank-9, tr#rank-10 {
  color:#01bbc7;
}


/* eo:game */

/* so:sessions */

#sessions #session_submit {background: url(/images/signin.jpg) no-repeat 0 0; border:none; }
#sessions #session_submit:hover {background: url(/images/signin.jpg) no-repeat 0 -61px; border:none; }

#sessions h2 {color:#fff;}

#sessions a {color:#01bbc7;}
#sessions a:hover {color:#fff;}

#main-content #errorExplanation h2 {color:#01bbc7;}
#main-content #errorExplanation p {color:#fff;}

#submissions #content {background: url(/images/submissions-header.gif) no-repeat top left;}

/* eo:sessions */

/* so:error */
.success {color:#fff; background:#0de000; border: 1px solid #0f7007;}
.failure {color:#fff; background:#be000e; border: 1px solid #93040f;}

#ppcDetected {color:#fff; }
/* eo:error */



/*so:overlay*/
.overlay {
  font-family: 'Courier', arial, helvetica, sans-serif;
  color: #01bbc7;
  font-size: 14px;
}

.overlay a{color:#01bbc7;}
.overlay a:hover{color:#fff;}

.overlay .youtube{
  width: 353px;
  height: 195px;
  padding: 12px 12px 22px 12px;
  background: url(/images/overlay-video.gif) no-repeat;
}


/*eo:overlay*/


/* so:image-replacement */

h1#site-name a,
ul#nav li a,
ul#sub-nav li a,
ul#footer-nav li a,
.feature a.more,
#home #main-content #blog h2,
#home #supporting-content #twitter h2,
#twitter a#follow,
#sign-up a,
a.rss,
#article.index #content h1,
a.forward, a.back,
h2.comment-title,
input#submit,
input#subscriber_submit,
.hidden,
#section h2,
#games #content h1,
#highscores thead span,
#signup #content h1,
#sessions #session_submit,
#articles #supporting-content ul.archive li span,
#submissions #main-content h1,
.overlay .title,
.overlay .pre-order,
.overlay .sign-up,
.overlay .prologue,
.overlay .logo,
.overlay .puffin{
  overflow: hidden;
  text-align: left;
  display: block;
  line-height:0;
  text-indent: -1000em;
}

ul#nav li.book-nav a, ul#footer-nav li.book-nav a {background: url(/images/menu.png) no-repeat -50px -48px;}
ul#nav li.author-nav a, ul#footer-nav li.author-nav a {background: url(/images/menu.png) no-repeat -205px -48px;}
ul#nav li.blog-nav a, ul#footer-nav li.blog-nav a {background: url(/images/menu.png) no-repeat -360px -48px;}
ul#nav li.lost-nav a, ul#footer-nav li.lost-nav a {background: url(/images/menu.png) no-repeat -515px -48px;}
ul#nav li.missions-nav a, ul#footer-nav li.missions-nav a {background: url(/images/menu.png) no-repeat -670px -48px;}
ul#nav li.downloads-nav a, ul#footer-nav li.downloads-nav a {background: url(/images/menu.png) no-repeat -825px -48px;}

ul#sub-nav li#signup-nav a {background: url(/images/sign-up-nav.jpg) no-repeat 0 0px;}
ul#sub-nav li#signup-nav a.fade span.hover, ul#sub-nav li#signup-nav a.no-js:hover {background: url(/images/sign-up-nav.jpg) no-repeat 0 -53px;}

ul#sub-nav li#forum-nav a {background: url(/images/forum-nav.jpg) no-repeat 0 0px;}
ul#sub-nav li#forum-nav a.fade span.hover, ul#sub-nav li#forum-nav a.no-js:hover {background: url(/images/forum-nav.jpg) no-repeat 0 -53px;}

#sign-up a {background: url(/images/sign-up-hover.jpg) no-repeat 0 0px;}
#sign-up a.fade span.hover, #sign-up a.no-js:hover {background: url(/images/sign-up-hover.jpg) no-repeat 0 -146px;}

#puffin {background: url(/images/puffin-hover.jpg) no-repeat 0px 0px;}
#puffin.fade span.hover, #puffin.no-js:hover {background: url(/images/puffin-hover.jpg) no-repeat 0px -87px;}

ul#nav li.book-nav a.fade span.hover, ul#footer-nav li.book-nav a.fade span.hover,
ul#nav li.book-nav a.no-js:hover, ul#footer-nav li.book-nav a.no-js:hover {background: url(/images/menu.png) no-repeat -50px -131px;}
ul#nav li.author-nav a.fade span.hover, ul#footer-nav li.author-nav a.fade span.hover,
ul#nav li.author-nav a.no-js:hover, ul#footer-nav li.author-nav a.no-js:hover {background: url(/images/menu.png) no-repeat -205px -131px;}
ul#nav li.blog-nav a.fade span.hover, ul#footer-nav li.blog-nav a.fade span.hover,
ul#nav li.blog-nav a.no-js:hover, ul#footer-nav li.blog-nav a.no-js:hover {background: url(/images/menu.png) no-repeat -360px -131px;}
ul#nav li.lost-nav a.fade span.hover, ul#footer-nav li.lost-nav a.fade span.hover,
ul#nav li.lost-nav a.no-js:hover, ul#footer-nav li.lost-nav a.no-js:hover {background: url(/images/menu.png) no-repeat -515px -131px;}
ul#nav li.missions-nav a.fade span.hover, ul#footer-nav li.missions-nav a.fade span.hover,
ul#nav li.missions-nav a.no-js:hover, ul#footer-nav li.missions-nav a.no-js:hover {background: url(/images/menu.png) no-repeat -670px -131px;}
ul#nav li.downloads-nav a.fade span.hover, ul#footer-nav li.downloads-nav a.fade span.hover,
ul#nav li.downloads-nav a.no-js:hover, ul#footer-nav li.downloads-nav a.no-js:hover {background: url(/images/menu.png) no-repeat -825px -131px;}

#the-book ul#nav li.book-nav a, #the-book ul#footer-nav li.book-nav a {background-position: -50px -214px;}
#the-author ul#nav li.author-nav a, #the-author ul#footer-nav li.author-nav a {background-position: -205px -214px;}
#articles ul#nav li.blog-nav a, #articles ul#footer-nav li.blog-nav a {background-position: -360px -214px;}
#games ul#nav li.lost-nav a, #games ul#footer-nav li.lost-nav a {background-position: -515px -214px;}
#highscores ul#nav li.lost-nav a, #highscores ul#footer-nav li.lost-nav a {background-position: -515px -214px;}
#missions ul#nav li.missions-nav a, #missions ul#footer-nav li.missions-nav a {background-position: -670px -214px;}
#downloads ul#nav li.downloads-nav a, #downloads ul#footer-nav li.downloads-nav a {background-position: -825px -214px;}

#the-book ul#nav li.book-nav a span.hover, #the-book ul#footer-nav li.book-nav a span.hover {display:none;}
#the-author ul#nav li.author-nav a span.hover, #the-author ul#footer-nav li.author-nav a span.hover {display:none;}
#articles ul#nav li.blog-nav a span.hover, #articles ul#footer-nav li.blog-nav a span.hover {display:none;}
#games ul#nav li.lost-nav a span.hover, #games ul#footer-nav li.lost-nav a span.hover {display:none;}
#highscores ul#nav li.lost-nav a span.hover, #highscores ul#footer-nav li.lost-nav a span.hover {display:none;}
#missions ul#nav li.missions-nav a span.hover, #missions ul#footer-nav li.missions-nav a span.hover {display:none;}
#downloads ul#nav li.downloads-nav a span.hover, #downloads ul#footer-nav li.downloads-nav a span.hover {display:none;}

#the-book #content {background: url(/images/the-book-header.gif) no-repeat;}
#the-author #content {background: url(/images/the-author-header.gif) no-repeat;}
#missions #content {background: url(/images/missions-header.gif) no-repeat;}
#downloads #content {background: url(/images/downloads-header.gif) no-repeat;}

a:hover, a span.hover, input#submit:hover, input#subscriber_submit:hover  {cursor:pointer;}


.overlay .title {
  background: url(/images/overlay-title.png) no-repeat;
  width: 591px;
  height: 48px;
}

.overlay .pre-order {
  background: url(/images/overlay-pre-order.png) no-repeat;
  width: 280px;
  height: 192px;
}
.overlay .sign-up{
  background: url(/images/overlay-sign-up.png) no-repeat;
  width: 280px;
  height: 156px;
}

.overlay .prologue{
  background: url(/images/overlay-prologue.gif) no-repeat;
  width: 200px;
  height: 53px;
}

.overlay .logo{
  background: url(/images/overlay-logo.png) no-repeat;
  width: 140px;
  height: 79px;
}

.overlay .puffin{
  background: url(/images/overlay-puffin.png) no-repeat;
  width: 38px;
  height: 58px;
}

/* eo:image-replacement */

input,
textarea {
	border-left:#181918 solid 1px;
	border-top:#111211 solid 1px;
	border-bottom:#1b1c1b solid 1px;
	border-right:#181918 solid 1px;
	background: #1e1f1e;
	padding:5px;
	color:#fff;
}

label {
	color:#646a64;
}

input#submit:hover, #sessions #session_submit:hover {cursor:pointer;}

p#name-comment,
p#email-comment {width:50%; float:left;}

p#name-comment input,
p#email-comment input {width:92%;}

p#message-comment textarea {width:96%;}

input#subscriber_submit, input#submit {width:79px; height:61px; border:0px !important; margin-left:-4px;}

input#subscriber_submit, input#submit {background:url(/images/submit.jpg) no-repeat 0 0;}
input#subscriber_submit:hover, input#submit:hover {background:url(/images/submit.jpg) no-repeat 0 -61px;}

p#name-signup input,
p#parent-signup input,
p#email-signup input {width:100%;}

#signup form p {padding-left:25px; width:57%;}
#signup form p#name-signup,
#signup form p#email-signup {margin-top:5px;}

#signup form p#name-signup,
#signup form p#email-signup,
#signup form p#parent-signup,
#signup form p#submit-signup {padding-left:0px;}

input#submission_terms, input.checkbox, input#subscriber_guardian_acceptance {float:left; background:none; border:none; padding:0; width:auto !important; z-index:999;}

#signup #main-content h3 {margin-bottom:0px;}

form.new_submission p input {width:53%;}
form.new_submission p textarea {width:98%;}
form.new_submission input.checkbox, input#submission_terms{margin-right:10px;}

legend {color:#01BBC7; margin-bottom:10px; padding-top:20px;}

.flash.notice {color:#01BBC7;
	float:right;
	margin-right:22px;
	margin-bottom:30px;
	width:568px; }
	
#home	.flash.notice {color:#01BBC7;
		float:none;
		margin-right:0px;
		text-align:center;
		width:100%; }
		
		
/*GOOGLE DOCS FORMS*/

#main-content iframe {
  width: 575px !important;
}

#main-content #dsq-content iframe {
  width: 507px !important;
}


/*Disqus Forms*/
.dsq-comment-message {
  color: #A99C90 !important;
  font-size: 12px !important;
}

.dsq-comment-header {
  color: #01BBC7 !important;
  font-size: 20px !important;
  font-family: 'Courier',arial,helvetica,sans-serif !important;
  background: none !important;
}

.dsq-comment-meta a, .dsq-comment-actions a {
  font-size: 12px !important;
}

div#fancy_overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	z-index: 30;
	background:black;
}

div#fancy_loading {
	position: absolute;
	height: 40px;
	width: 40px;
	cursor: pointer;
	display: none;
	overflow: hidden;
	background: transparent;
	z-index: 100;
}

div#fancy_loading div {
	position: absolute;
	top: 0;
	left: 0;
	width: 40px;
	height: 480px;
	background: transparent url('/images/fancybox/fancy_progress.png') no-repeat;
}

div#fancy_outer {
	position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    padding: 20px 20px 40px 20px;
    margin: 0;
    background: transparent;
    display: none;
}

div#fancy_inner {
	position: relative;
	width:100%;
	height:100%;
	background: #FFF;
}

div#fancy_content {
	margin: 0;
	z-index: 100;
	position: absolute;
}

div#fancy_div {
	background: #000;
	color: #FFF;
	height: 100%;
	width: 100%;
	z-index: 100;
}

img#fancy_img {
	position: absolute;
	top: 0;
	left: 0;
	border:0; 
	padding: 0; 
	margin: 0;
	z-index: 100;
	width: 100%;
	height: 100%;
}

div#fancy_close {
	position: absolute;
	top: -12px;
	right: -15px;
	height: 30px;
	width: 30px;
	background: url('/images/fancybox/fancy_closebox.png') top left no-repeat;
	cursor: pointer;
	z-index: 181;
	display: none;
}

#fancy_frame {
	position: relative;
	width: 100%;
	height: 100%;
	display: none;
}

#fancy_ajax {
	width: 100%;
	height: 100%;
	overflow: auto;
}

a#fancy_left, a#fancy_right {
	position: absolute; 
	bottom: 0px; 
	height: 100%; 
	width: 35%; 
	cursor: pointer;
	z-index: 111; 
	display: none;
	background-image: url("data:image/gif;base64,AAAA");
	outline: none;
	overflow: hidden;
}

a#fancy_left {
	left: 0px; 
}

a#fancy_right {
	right: 0px; 
}

span.fancy_ico {
	position: absolute; 
	top: 50%;
	margin-top: -15px;
	width: 30px;
	height: 30px;
	z-index: 112; 
	cursor: pointer;
	display: block;
}

span#fancy_left_ico {
	left: -9999px;
	background: transparent url('/images/fancybox/fancy_left.png') no-repeat;
}

span#fancy_right_ico {
	right: -9999px;
	background: transparent url('/images/fancybox/fancy_right.png') no-repeat;
}

a#fancy_left:hover, a#fancy_right:hover {
	visibility: visible;
	background-color: transparent;
}

a#fancy_left:hover span {
	left: 20px; 
}

a#fancy_right:hover span {
	right: 20px; 
}

#fancy_bigIframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: transparent;
}

div#fancy_bg {
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	z-index: 70;
	border: 0;
	padding: 0;
	margin: 0;
}
	
div.fancy_bg {
	position: absolute;
	display: block;
	z-index: 70;
	border: 0;
	padding: 0;
	margin: 0;
}

div#fancy_bg_n {
	top: -20px;
	left: 0;
	width: 100%;
	height: 20px;
	background: transparent url('/images/fancybox/fancy_shadow_n.png') repeat-x;
}

div#fancy_bg_ne {
	top: -20px;
	right: -20px;
	width: 20px;
	height: 20px;
	background: transparent url('/images/fancybox/fancy_shadow_ne.png') no-repeat;
}

div#fancy_bg_e {
	right: -20px;
	height: 100%;
	width: 20px;
	background: transparent url('/images/fancybox/fancy_shadow_e.png') repeat-y;
}

div#fancy_bg_se {
	bottom: -20px;
	right: -20px;
	width: 20px;
	height: 20px;
	background: transparent url('/images/fancybox/fancy_shadow_se.png') no-repeat;
}

div#fancy_bg_s {
	bottom: -20px;
	left: 0;
	width: 100%;
	height: 20px;
	background: transparent url('/images/fancybox/fancy_shadow_s.png') repeat-x;
}

div#fancy_bg_sw {
	bottom: -20px;
	left: -20px;
	width: 20px;
	height: 20px;
	background: transparent url('/images/fancybox/fancy_shadow_sw.png') no-repeat;
}

div#fancy_bg_w {
	left: -20px;
	height: 100%;
	width: 20px;
	background: transparent url('/images/fancybox/fancy_shadow_w.png') repeat-y;
}

div#fancy_bg_nw {
	top: -20px;
	left: -20px;
	width: 20px;
	height: 20px;
	background: transparent url('/images/fancybox/fancy_shadow_nw.png') no-repeat;
}

div#fancy_title {
	position: absolute;
	z-index: 100;
	display: none;
	top:5px;
	left:5px;
	background: black;
}

div#fancy_title div {
	color: #FFF;
	font: 14px Courier;
	white-space: nowrap;
}

/*div#fancy_title table {
	margin: 5px;
}*/

div#fancy_title table td {
	padding: 0;
	vertical-align: middle;
}

td#fancy_title_left {
	height: 32px;
	width: 15px;
	background: black;
}

td#fancy_title_main {
	height: 32px;
	text-transform:uppercase;
	background: black;
}

td#fancy_title_right {
	height: 32px;
	width: 15px;
	background: black;
}