/* CSS Document */
body, html, #MainViewable
{
	height: 100%;
}
body > #MainViewable
{
	height: auto;
	min-height: 100%;
}
body
{
	margin:0;
	font-family: Verdana,Geneva,sans-serif;
	font-size:medium;
	background-color: #FFFFFF;
}
table {border-collapse:collapse;}
td  {padding:2px; font-size:small;}

a:visited {
	color: #09c;
}
a:hover {
	text-decoration: underline;
}
a {
	color: #09c;
	text-decoration: none;
}
div, ul, li {
	margin: 0;
	padding: 0;
}

/* common styles used to adjust layout for specific items */
.textCentered {
	text-align: center;	
}
.elementCentered {
	margin: 0px auto;
	display: table;
}
.clearfix:after { 
   content: " ";
   display: block; 
   height: 0; 
   clear: both;
}


/* Main Layout */
div#Header
{
	font-family: Arial, Helvetica, sans-serif;
}
div#TopBar
{
	width:920px;
	height:70px;
	margin:0 auto;
	position:relative;
	z-index: 20001;
}
div#AdBar
{
	text-align:center;
	width:730px;
	height:92px;
	margin:5px auto;
	padding:0px;
	z-index:1;
}
div#MainContainer
{
	width:920px !important;
	margin: 0 auto;
	padding:4px 0 60px;
	text-align:left;
}
div#TopRight
{
	width:460px;
	margin-left:460px;
	text-align:center;
	font-size:7pt;
}

div#FooterBar
{
	background:#ffb32d;
	clear: both;
	position: relative;
	margin-top: -59px;
	min-width: 940px;
}
div#Footer
{
	color: #996633;
	width:920px;
	font-size:8pt;
	padding:10px 0;
	text-align:left;
	margin:5px auto 0px auto;
}
div#Footer div.FooterBlock
{
	float: left;
}
div#Footer div.FooterSocial
{
	float: left;
	width: 16px;
	height: 16px;
	margin: 0px 10px 0px 5px;
	background-image: url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png");
}

div#Footer #footerFacebook {
	background-position: -36px -88px;
}
div#Footer #footerTwitter {
	background-position: -53px -88px;
}
div#Footer #footerGoogle {
	background-position: -70px -88px;
}

div#Footer div.FooterBlock a
{
	color:#000;
}
div#Footer div.FooterBlock a div.FooterBlock:hover
{
	text-decoration: underline;
}
div#CenterContent
{
	padding:10px 0;
	min-height: 450px;
	position:relative;
}
div.noscript {width: 500px;
	float: left;
	position: absolute;
	top: 140px;
	left: 125px;
	z-index: 2;
 	padding: 20px;
	text-align: center;
	border: 2px black solid;
	background-color: #CCCCCC;}

.registerinfo
{
	font-size: 9pt;
	font-style: italic;
	color: #600;
}
div#TitleBox
{
	text-align: left;
	font-weight: bold;
	font-size: 24px;
	margin-bottom: 20px;
	padding: 10px 0px;
	width: 500px;
}
.item {
	font-weight: bold;
}
.clickable {
	cursor: pointer;
}
input.inhint {
	color: #aaa !important;
}
textarea.inhint {
	color: #aaa !important;
}

sup.challZero {background-color:#999999;}
#LogInAcct sup.challCount {box-shadow: none;-moz-box-shadow:none;-webkit-box-shadow:none; font-size:7.5pt;}
/** Button UI */
/* text-only Orange button */
#button .button {
    position: relative;
    text-decoration: none;
    display: inline-block;
    border: 1px solid #ee922b;
    border-top-color: #efa149;
    border-left-color: #efa149;
    color: #fff;
    text-shadow: 0 2px #d06e13;
    padding: 5px 10px 5px 10px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-box-shadow:    0 3px 0 #e9e7e6, inset 0 1px 1px rgba(255,255,255,1), inset 0 -1px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 3px 0 #e9e7e6;
    box-shadow:         0 3px 0 #e9e7e6;
    background: #ff9620;
    background: -webkit-gradient(
                    linear,
                    left bottom,
                    left top,
                    color-stop(0, rgb(255,144,27)),
                    color-stop(0.5, rgb(255,150,32)),
                    color-stop(0.5, rgb(255,152,32)),
                    color-stop(1, rgb(254,188,85))
                );
    background: -moz-linear-gradient(
                    center bottom,
                    rgb(255,144,27) 0%,
                    rgb(255,150,32) 50%,
                    rgb(255,152,32) 50%,
                    rgb(254,188,85) 100%
                );
    background: linear-gradient(
                    center bottom,
                    rgb(255,144,27) 0%,
                    rgb(255,150,32) 50%,
                    rgb(255,152,32) 50%,
                    rgb(254,188,85) 100%
                );
}

#limit {
	background: #e8e8e8;
	font-style: italic;
	font-family: Helvetica Neue, Helvetica, Arial;
	font-size: 11px;
	text-align: center;
}
#limit a {
	color:#666 !important;
}

#button .img-button:hover, #button .button:hover{
        border: 1px solid #e47705;
    }


#button .img-button strong, #button .button strong {
    font: bold 14px/1.4 Helvetica Neue, Helvetica, Arial, sans-serif;
    }

/* text-only FORM button */

#button .submit {
    border: 1px solid #afafaf;
    border-radius: 20px;
     -moz-box-shadow:    0 3px 0 #e9e7e6, inset 0 1px 1px rgba(255,255,255,1), inset 0 -1px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 3px 0 #e9e7e6;
    box-shadow:         0 3px 0 #e9e7e6;
    color: #333;
    cursor: pointer;
    font: 14px/1.4 Helvetica Neue, Helvetica, Arial, sans-serif;
    padding: 5px 10px 5px 10px;
    text-shadow: 0 2px #ececec;
    background: #ccc;
    background: -webkit-gradient(
                    linear,
                    left bottom,
                    left top,
                    color-stop(0, rgb(221,221,221)),
                    color-stop(0.5, rgb(231,231,231)),
                    color-stop(0.5, rgb(239,239,239)),
                    color-stop(1, rgb(254,254,254))
                );
    background: -moz-linear-gradient(
                    center bottom,
                    rgb(221,221,221) 0%,
                    rgb(231,231,231) 50%,
                    rgb(239,239,239) 50%,
                    rgb(254,254,254) 100%
                );
    background: linear-gradient(
                    center bottom,
                    rgb(221,221,221) 0%,
                    rgb(231,231,231) 50%,
                    rgb(239,239,239) 50%,
                    rgb(254,254,254) 100%
                );
}

#button .submit {
    margin: 10px 0;
}

/* Tinybox CSS */
/* modal CSS */

#modalPop {
font-family: Helvetica Neue, Helvetica, Arial, Verdana, sans-serif;margin:0px auto;
color:#666;
font-size: 14px;
text-shadow: 0 1px 0 #fff6da;
}
#modalPop p {
line-height:1em;
}
#modalPop a, #modalPop a:visited {color:#0099cc;text-decoration: none;cursor: pointer;}
#modalPop a:hover {text-decoration:underline}
#modalPop a.button {text-decoration: none !important; color: white;}
.banner {
background: url('//d162758vd3dbpx.cloudfront.net/images/modalRegBanner.png') no-repeat;
background-position:center top;
background-size: 550px 266px;
width:680px;
text-align: center;
margin: auto;
}
#modalPop a {
font-weight: bold;color:#0099cc;
}
#modalPop h1{
margin-top:0;font-weight: normal;
}
#modalPop h1 {
text-align: center;
font-size: 24px;
font-weight: bold;
text-shadow: 0 1px 0 #fff6da;
color:#333;
margin-bottom:10px;
}
#modal_login_error {
	padding-left: 10px;
	color: red;
	font-size: smaller;
}
#reg {
width:700px;margin:auto;margin-top: 20px;
}
.why {
border: none;padding-top:210px
}
.fancyDivider li{
padding: 0 5px;
display: inline;
text-decoration:none;
}
div.why ul.fancyDivider li.strike {
text-decoration:line-through;
text-shadow: 0 1px 0 #fff6da;
color: #b3a895;
width: 200px;
}
ul.fancyDivider {
padding:0;
text-align: center;
list-style: none;
display: list-item;
font-family: Georgia, Times, serif;
font-size: 21px;
font-style: italic;
text-shadow: 0 1px 0 #fff6da;
color:#4e473a;
margin: 21px 0px;
}
#modalcontent {
padding:10px;margin-top: 10px;
}
#modalcontent p {
margin:0;padding:10px 0 0 0;
}
#leftModal{
position:relative;float:left;border-right:1px solid #b3a895;width:300px !important;margin-top: 10px;}
#rightModal {
position:relative;float:right;width:260px;margin-top: 10px;margin-left:15px;
}
/* JS-called styles */

.labelLink {font-size:12px; margin-left:10px;font-weight:normal !important}
.tbox {position:absolute; display:none; padding:14px 17px; z-index:200002}
.tinner {
padding:15px;
-moz-border-radius:15px;
-webkit-border-radius: 15px;
border-radius:15px 15px 15px 15px;
background: #fff url('//d162758vd3dbpx.cloudfront.net/images/tanNoiseBgd.png') repeat !important;
}
.tinner2 {
padding:30px;
-moz-border-radius:15px;
-webkit-border-radius: 15px;
border-radius:15px 15px 15px 15px;
background-color: #fff;
}
.tmask {position:absolute; display:none; top:0px; left:0px; height:100%; width:100%; background:#000; z-index:200001}
.tclose {position:absolute; top:0px; right:0px; width:30px; height:30px; cursor:pointer; background:url('//d162758vd3dbpx.cloudfront.net/images/close.png') no-repeat}
.tclose:hover {background-position:0 -30px}
#modButton
{min-height:74px;padding-top: 10px;}
/* Green button */
#modButton .button, #startbutton .button {
cursor: pointer;
position: relative;
text-decoration: none;
display: inline-block;
border: 1px solid #5da041;
border-top-color: #459a28;
border-left-color: #6caf26;
color: #fff;
text-shadow: 0 2px #6e8d19;
padding: 8px 30px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow:    10px #d0c8b7, inset 0 1px 1px rgba(255,255,255,1), inset 0 -1px 1px rgba(0,0,0,0.1);
-webkit-box-shadow: 10px #d0c8b7;
box-shadow:         10px #d0c8b7;
box-shadow:inset 0px 1px 3px #addf6f;
-moz-box-shadow:inset 0px 1px 3px #addf6f;
-webkit-box-shadow:inset 0px 1px 3px #addf6f;
background: #8bbf25;
background: -webkit-gradient(linear,left bottom, left top,
      color-stop(0, rgb(122,175,33)),
      color-stop(1, rgb(155,199,41))
                );
background: -moz-linear-gradient(center bottom,
      rgb(122,175,33) 0%,
      rgb(155,199,41) 100%
                );
background: linear-gradient(center bottom,
      rgb(122,175,33) 0%,
      rgb(155,199,41) 100%
                );
}
#modButton .button:hover, #startbutton .button:hover{
        border: 1px solid #307414;
    }
#modButton .button strong, #startbutton .button strong {
    font: bold 20px Helvetica Neue, Helvetica, Arial, sans-serif;
    }
.buttonBgd{
padding:10px;width:200px;margin:auto;
background-color:#d0c8b7;
-moz-border-radius:12px;
-webkit-border-radius: 10px;
border-radius:12px;
-moz-box-shadow: 0 2px 1px #efebe4;
-webkit-box-shadow: 0 2px 1px #efebe4;
box-shadow: 0 2px 1px #efebe4;
}

/*Small button */
span .smallButton {
border: 1px solid #999;
border-radius: 20px;
-moz-box-shadow:    0 3px 0 #e9e7e6, inset 0 1px 1px rgba(255,255,255,1), inset 0 -1px 1px rgba(0,0,0,0.1);
-webkit-box-shadow: 0 3px 0 #e9e7e6;
box-shadow:         0 3px 0 #e9e7e6;

background: #e0e0e0;
    background: -webkit-gradient(
                    linear,
                    left bottom,
                    left top,
                    color-stop(0, rgb(221,221,221)),
                    color-stop(1, rgb(254,254,254))
                );
    background: -moz-linear-gradient(
                    center bottom,
                    rgb(221,221,221) 0%,
                    rgb(254,254,254) 100%
                );
    background: linear-gradient(
                    center bottom,
                    rgb(221,221,221) 0%,
                    rgb(254,254,254) 100%
                );


color: #7f7f7f;
cursor: pointer;
font: 9px Helvetica Neue, Helvetica, Arial, sans-serif;
margin-left:5px;}
span .smallButton {margin: 0px;padding:5px;font-weight: bold;}
span .smallButton:hover{border: 1px solid #666;text-decoration: none !important; background-color:#e7e7e7;}

input.textinput {
	border: 1px solid #C9C9C9;
	color: #666;
	margin: 0;
	padding: 4px;
	vertical-align: middle;
	width: 160px;
	font-family: Helvetica Neue, Helvetica, Arial;
	font-size: 14px;
}

.clearfix {
	display: block;
	clear:both;
}

/** Alert styles - green, red, and blue alerts */

.alertGood {
	border: 1px solid #8aba56;
	background: #e2f9e3;
	color: #006600;
	background-image: url('//d162758vd3dbpx.cloudfront.net/images/alert_check.png');
	margin: 8px 0px;
	padding: 10px 10px 10px 40px;
	font-weight: bold;
	font-size: 11pt;
	text-align: left;
	text-shadow: 0 1px #fff;
	background-repeat: no-repeat;
	background-position: 10px 7px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}

.alertBad, #challalert {
	/** challalert is a DUPLICATE of alertBad for legacy purposes. alertBad is a class style and has a more descriptive name than "challalert" */
	border: 1px solid #c76565;
	background: #f5d0d0;
	color: #8f2d2d;
	background-image: url('//d162758vd3dbpx.cloudfront.net/images/alertIcon.png');
	margin: 8px 0px;
	padding: 10px 10px 10px 40px;
	font-weight: bold;
	font-size: 11pt;
	text-align: left;
	text-shadow: 0 1px #fff;
	background-repeat: no-repeat;
	background-position: 10px 7px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}

.alertNeutral, #notification {
	border: 1px solid #65a5c7;
	background: #d0e8f5;
	color: #2d6d8f;
	margin: 8px 0px;
	padding: 10px;
	font-weight: bold;
	font-size: 11pt;
	text-align: left;
	text-shadow: 0 1px #fff;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	border-radius: 2px;
}

#notification a {
	color:#09c;
}
#narrow_content{
	position: relative;
	width:560px;
}

.dek { /* 7/2/2013 update */
font-size: 120%;
margin-bottom: 20px; padding:0;
color:#666;
width: 560px !important;
}

.dek a { /* added for login form */
color:#09c;
}

/* ----------container to center the layout-------- */
#container {
	width: 920px !important;
	padding:0px;
	margin: 0px 0px 25px 0px;
	margin-left: auto;
	margin-right: auto;
	font-size: 14px;
	color:#333;
	font-family: Helvetica Neue, Helvetica, Verdana, Arial, SunSans-Regular, Sans-Serif;
}

/* ----------outer and inner----------------- */
#outer{
	/* border-left: solid 0px #fff; */ /* color of the left column  */
	/* border-right: solid 0px #fff; */ /* color of the right column  */
	background-color: #fff;  /* color of the content column */
}
#inner{margin:0; width:100%; } /* ie/pc */

/* --------------left and right ------------- */
#left {
	width:0px;
	float:left;
	position:relative;
	margin-left:-1px;
	margin-right:1px;
}
#right {
	width:0px;
	float:right;
	position:relative;
	margin-right:-1px;
	margin-left:1px;
}
#forms {
margin-bottom:10px;
padding:20px 0 0 0 !important; /* added importance due to conflict with current styles */
float:left;
width:560px;
background-color: #f3f3f3;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

#forms ul, #graybox ul {
list-style-type: none;
}
#forms label {
float:left;
width:130px;
text-align: right;
margin:3px 20px 0 0;
}
#forms label.resetlabel {
	float: none;
	width: auto;
	text-align: left;
	margin: 0px;
}
#forms li, #graybox li  {
padding-bottom: 20px !important; /* added importance due to conflict with some current styles */
}
#forms li {
padding-right:20px !important; /* added importance due to conflict with some current styles */
}
#graybox li {text-align: center}
#forms .textinput {
width: 375px;
}
textarea.textinput { /* can likely be combined with main.css input.textinput */
border: 1px solid #C9C9C9;
color: #666;
margin: 0;
padding: 4px;
vertical-align: middle;
width: 160px;
font-family: Helvetica Neue, Helvetica, Arial;
font-size: 14px;
}
#forms .email {
width:180px;
}
.divider {
border-top:1px solid #d7d7d7;
padding-top:20px;
}
.info {
color:#999;
font-size: 12px;
}
#forms .un { /* new class, but same attributes as previously 'email', could be called something like 'shortInput' */
width:180px;
margin-right:10px;
}
#forms .captcha { /* new classes for reg only */
width:40px;
}
#outsideForm label{
font-weight: 500;
}
#outsideForm h2 {
margin: 1.5em 0 1em;
line-height: 1.3;
}
#outsideForm ul {
	margin-bottom: 15px;
}
#outsideForm ul li {
	margin-left: 20px;
}
#outsideForm .source {
	font-size: 10px;
	font-style: italic;
}
#outsideForm p, #outsideForm li, #outsideForm label {
	line-height: 18px;
}
#check ul {list-style-type: none}
#check li{display: inline;padding-right:0 !important;float:left;}
#forms a { /* new class */
color:#09c;
font-size: 12px;
}
#graybox { /* reg specific */
margin: 0 0 15px 0;
padding-top:20px;
width:560px;
background-color: #f3f3f3;
border: none;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
clear: both
}
#graybox span{ /* reg specific */
margin-right: 15px;
}
.formBtn .button strong{font-size: 20px !important;padding:0 20px;}
.formBtn {margin-left:150px;
}

/** rhcBox stuff -- styles for right-hand-column boxes */

#rhcBox{
	width: 300px !important;
	font-family: Helvetica Neue, Helvetica, Arial;
	margin-bottom: 15px !important;
	text-align: left;
	margin-top: 6px;
}

#rhcBox ol a:visited {
	color:#aaa;
}

#rhcBox .plays {
	text-align: right;
	float: right;
	max-width: 80px;
	text-decoration: none;
	color:#000;
}

#rhcBox .plays span.gamelen {
	max-width: 80px;
}

#rhcBox .plays:hover {
	text-decoration: none;
}

.rhcHeader{ /* add this class to #PromoBox h1, #ActivityBox h1 block in CSS */
	padding:0;
	font-size: 12px !important;
	text-transform: uppercase;
	padding-bottom: 3px;
	border-bottom: 1px solid #D8D8D8 !important;
	margin: 0 0 6px;
}

#rhcBox ol {
	width: 336px;
	padding:0;margin: 0;
	width: 300px !important;
}

#rhcBox .sporange {
	color:#f90;
}

#rhcBox a span.number {
	color:#f90;
	text-decoration: none;
}

#rhcBox span.number {
	color:#f90;
	text-decoration: none;
}

#rhcBox span.school {
	margin-left:3px;
}

#rhcBox li {
	list-style-type: none;
	border-bottom: 1px solid #eee;
	padding:3px 0;
}

#rhcBox .stat {
	text-transform: uppercase;
	font-size: 11px;
	padding: 5px 0;
}


#rhcBox .more {
	text-align: center;
}

#rhcBox .more a:hover, #rhcBox .info a:hover {
	text-decoration: underline;
}

#rhcBox li, #rhcBox .more {
	list-style-type: none;
	border-bottom: 1px solid #eee;
	padding:3px 0;
	font-size: 95%;
}

#rhcBox ol.small li, #rhcBox ol.short .more {
	list-style-type: none;
	border-bottom: none;
	padding: 2px 0;
}

#rhcBox li:hover, #rhcBox .more:hover {
	background-color: #fcfbde;
}

#popBox h3, #birthdayHeader {
border:0 !important;
background-color: #f1f1f1;
padding:3px 8px;
}
#rhcNav {
margin:10px 0 8px 0;
border-bottom: 2px solid #d8d8d8;
height: 18px;
}
#rhcNav div.tab {
text-transform: uppercase;
font-size: 9pt;
font-weight: bold;
padding: 0 0px 3px;
color: #09c;
cursor: pointer;
float:left;
height:15px;
}
#rhcNav div.tab:hover{
color:#000;
}
#rhcNav div.tab.on {
color: #333;
border-bottom: 2px solid #333;
}
#headerBox .gamelen
{
    overflow: hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    display:inline-block;
}
#rhcBox .gamelen
{
    overflow: hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    width:186px;
    display:inline-block;
}
#rhcReplaceable .gamelen
{
    overflow: hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
    width:227px;
    display:inline-block;
}
#nextPrevious {
display: inline-block;
width:100%;
}
.next {
border-bottom:0px;height:14px;padding:3px 0px;
float: right;
}
.previous {
border-bottom:0px;height:14px;padding:3px 0px;
float:left;
}

/* Tooltip style for mouseover magic! */
.tooltip {
	display: inline;
	position: relative;
}
.tooltip:hover:after{
	background: #1e2123;
	background: rgba(30,33,35,.95);
	border-radius: 5px;
	bottom: 26px;
	color: #fff;
	content: attr(title);
	left: -50px;
	padding: 10px;
	position: absolute;
	z-index: 98;
	min-width: 120px;
	text-transform: none;
	font-size: 12px;
}
.tooltip:hover:before{
	border: solid;
	border-color: #333 transparent;
	border-width: 6px 6px 0 6px;
	bottom: 20px;
	content: "";
	left: 25%;
	position: absolute;
	z-index: 99;
}


/** Mobile portion of rhc area */

#mobile {
	margin-top:7px;
}
#mobile ul li {
	width:97px;
	display:inline-block;
	border:0 !important;
}
#mobile ul,#ActivityBox ul {
list-style:none;
text-align:left;
}
#mobile ul li,#ActivityBox ul li {
display:inline;
}
#mobile ul li,#ActivityBox ul li {
display:inline;
margin:0;
padding:0;
}
#mobile table {
	width: 100%;
}

/** Itunes/Android mobile buttons */

.mobile_itunes, .mobile_droid, .mobile_kindle {
	background-image: url("//d162758vd3dbpx.cloudfront.net/images/homeSprite5.png");
	height: 52px;
	width: 52px;
	margin-bottom: 5px;
}
.mobile_itunes {
	background-position: 0px 0px;
	}
.mobile_kindle {
	background-position: -53px 0px;
	}	
.mobile_droid {
	background-position: -107px 0px;
	}

/** switch to mobile web link in footer for mobile browsers viewing site normally */
#mobilelink {
display: none;
background-color:#eee;
text-align: center;
font-size: 25pt;
font-weight: bold;
padding:40px 0;
color:#09c;
border-top:5px solid #333;
border-bottom:5px solid #333;
}

img.loader {
	float: right;
	padding: 0px 135px;
	position: relative;
	top: -32px;
	display: none;
}

/*************************
 * StatsBox style stuff below -- StatBox, appstore, join sporcle section
 *************************/
#StatsBox,#PromoBox,#ActivityBox {
font-family:Helvetica Neue, Helvetica, Verdana, Arial, SunSans-Regular, Sans-Serif;
color:#777;
width:300px;
text-align:left;
margin:0;
}
#ArchiveBox, #PromoBox div#button {
	text-align:center;
}
#StatsBox h1,#PromoBox h1,#ActivityBox h1,#ArchiveBox h1 {
font-weight:700;
color:#333;
}
#StatsBox h1 {
font-size:14px;
margin:0 0 3px;
}
#StatsBox ul {
line-height:17px;
list-style:none;
font-size:10px;
}
#StatsBox ul a {
color:#777;
text-decoration:underline;
}
#StatsBox strong {
color:#f80;
font-size:14px;
}
#ActivityBox table {
height:32px;
}
#ActivityBox ul {
margin-bottom:0;line-height: 14px;
}
#ActivityBox td {
vertical-align:middle;
}
#PromoBox,#ActivityBox{
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
padding-bottom:10px;
padding-top:10px;
height: 135px;
}
#PromoBox img{ border:0;}
#PromoBox h1,#ActivityBox h1 {
font-size:12px;
text-transform:uppercase;
padding-bottom:3px;
border-bottom:1px solid #d8d8d8;
margin:0 0 6px;
}
#PromoBox h2, #ActivityBox h2 {
color:#f80;
font-size:14px;
font-weight:700;
margin:0;
padding:0;
}
#PromoBox p, #ActivityBox p {
line-height:17px;
margin:4px 0;
}
#StatsBox ul a:hover,#PromoBox a,#ActivityBox a {
color:#09c;
}
div#APC {
	height: 135px;
	margin: 2px 0px 30px 0px;
}
a.signupbutton {
	width: 278px;
}
/*************************
 * End stats box
 *************************/

/* history box - removed from Play and Homepage css and combined here, since it uses new header sprite */
.history ul {
	margin-top: 5px;
	list-style-type: none;
	float:left;
	border-bottom: 1px solid #EEE !important;
	display: block;
}
.history ul li {
	float:left; 
	border:0 !important;
}
.history ul li a:hover {
	text-decoration: underline !important;
}
.history ul li:hover {
	background-color:#fff !important;
}
.popGame {
	padding-left: 10px !important;
	padding-top: 8px !important;
	margin-top: 0;
	text-align: left;
	height: 22px;
	width: 256px; !important
}
.spacer {
	padding-top: 7px;
}
.clear {
	overflow: auto;
	width: 100%;
}



/*************************
 * New Header Styles
 *************************/
#header {
	margin: 0;
	padding: 0;
	height: 190px;
	width: 100%;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.minwidth {
	min-width:920px; width: auto !important; width: 920px; 
}
#navOuter {
	width: 100%;
}
#nav {
	position: relative;
	top: 0;
	height:47px;
	text-transform: uppercase;
	padding:0;
	width: 920px;
	display: block;
	margin:0 auto;
}
#nav li ul, #nav li ul {
	margin: 0;
	padding: 0;
}
#nav a {
	text-decoration: none;
}
#nav li { /*float the main and sub list items*/
	margin: 0;
	float: left;
	display: block;
}
#nav li ul {
	display: none;
}

/* more subnav controls */
#nav li.off ul, #nav li.on ul  { /*put the subnav below - main buttons must exactly touch subnav to prevent menu collapse */
	position: absolute;
	top: 47px;
	left: 0;
	padding-top: 10px; /* important to use padding and not margin, to prevent gaps */
	background: #fff;
	height: 26px;
	/* width: 920px;*/
	/* gray subnav bar */
	border-bottom: 3px solid #d8d8d8;
}
#nav li.on ul {
	background: #fff;
}
#nav li.on:hover ul, #nav li.over ul { /*for ie*/
	background: #fff;
	z-index: 9999;
	margin: 0;
}

/* main buttons */
#nav li a {
	color: #424240;
	font-weight: bold;
	display: block;
	width: 100px;
	padding-top: 3px;		
	font-size: 10pt;
	text-shadow: 0px 1px 0px rgba(255,255,255,0.6);
}

/* random buttons */
#nav li#liRandom, #nav li#liRandomCat {
	float: right;
	height:30px
}
#nav li#liRandomCat a{
 	min-width: 195px;
}
#nav li#liRandomCat a,  #nav li#liRandom a{
	color:#fff;
	text-shadow: 0px 1px 0px rgba(79,0,0,0.75);
}
#nav li a.tab {
	padding-top: 15px;
}
#nav li#liRandomCat, #nav li#liRandomCat a {
	text-align: right;
}
#nav li#liRandomCat {
	padding:0 15px 0 0;
}
#nav li#liRandomCat a:hover,  #nav li#liRandom a:hover {
	text-shadow: none;
	color:#424240;
	text-shadow: 0px 1px 0px rgba(255,255,255,0.6);
}
#nav li.on a {
	color: #333;
}
#nav li.on ul a, #nav li.off ul a {
	border: 0;
	/*float: left;*/ /*ie doesn't inherit the float*/
	color: #f90;
	width: auto;
}
#nav li.on ul {
	display: block;
}
#nav li.off:hover ul, #nav li.over ul {
	display: block;
	z-index: 6000;
}
#liHome a, #liPlay a, #liCreate a, #liQuizLab a, #liApps a, #liLive a{
	display: block;
	position: relative;
 	height:46px;
	color:#333;
	text-align:center;
	padding-top:15px
}
#nav li .tab {
	padding-top:15px;
}

/*subnav formatting*/
#nav li.off ul a, #nav li.on ul a {
	display: block;
	background: transparent;
	color: #999;
	font-size: 8pt;
}
#nav li.off ul a:hover,#nav li.on ul a:hover {
	color:#333;
}
ul#nav li ul li {
	padding-right: 10px;
}
ul#nav li ul li a{
	height: 23px;
}

/* subnav orange selects */
#nav li.on ul a.select {
	color:#333;
	border-bottom:3px solid #f90;
}
#nav li ul {
	width:920px; 
}

/*main*/
#navOuter {
 	height:47px;
}

/* header top section */
#header-inner {
	position: relative;
	max-width: 920px;
	margin: 0 auto;
	padding: 15px 0;
	height:60px
}
#headerLogo {
	z-index:1002;
	position:absolute;
}
#logo {
	width: 172px;
	height: 60px;
}
#headerSearch {
	width:290px;
	position: absolute;
	top:18px;
	left:205px;
	z-index:1002;
}
#headerSearch ul {
	padding:0;
	margin:0;
	list-style: none;
}
#headerSearch li {
	display: inline-block;;
}	
#headerSearch .textfield {
	width: 230px;
	height: 17px;
	color:#333333;
	padding:8px;
	font-size: 11pt;
	font-family: Helvetica, Arial, Verdana;
	border:1px solid #d8d8d8;
	position: relative;
	top:0;
	border-right:0;
	z-index:1002;
	-webkit-border-top-left-radius: 4px;
	-webkit-border-bottom-left-radius: 4px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-bottomleft: 4px;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
	margin:0px;
}
#headerSearch:-moz-placeholder {
	color:#939393;
}
#searchButton {
	background-position: 0 -70px;
	width: 35px;
	height: 35px;
	vertical-align: bottom;
	border: none;
	display:inline-block;
}
#headerSocial {
	width:38px;
	height:16px;
	position: absolute;
	top:28px;
	right:0;
	z-index:1002;
}


/*--- User Nav ---*/
#userNav {
	text-align: right;
	font-weight: bold;
	-webkit-text-size-adjust: none;
	font-size: 10pt;
	position: relative;
	z-index: 1000;
	right:50px;
	top: 28px;
}
#userNav ul {
	font-size: 0; /*Removes inconsistent spacing before list items*/
	padding: 0;
	margin: 0;
	position: relative;
	right: 0;
	top: -15px;
}		
#userNav li {
	font-size: 10pt;
	list-style-type: none;
	display: inline;
	padding: 5px;
}		
#userNav a {
	color:#09c;
	padding:6px;
	text-decoration: none;
}		
#first {
	border-right:1px solid #ddd;
	position: relative;
}
#userNav .challenge {
	padding-right: 1px;
}
#first a.counter {
	padding:0;
	margin:0 0 0 5px;
	top:6px;
	left:5px;
	position:absolute;
	display: block;
	width: 20px;
	height: 20px;
}
#first a.counter:hover {
	background-color: transparent;
}
#first a.wider {
	padding-left:35px;
}
#first a.wider:hover { 
	background-repeat: no-repeat;
	padding-left:35px;
}
#second {
 	border-right:1px solid #ddd;
}		
#userNav #third {
	padding-right:0;
}
#first:hover a, #second:hover a {
	color: #fff;
	background-color: #09c;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	text-decoration: none;
}	
#third:hover a.userName {
	color: #fff !important;
	background-color: #09c;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
	text-decoration: none;	
}

/*--- user DROPDOWN ---*/
 ul#ddNav{
	background:#fff;
	list-style:none;
	position:absolute;
	border-top:3px solid #09c;
	padding:0;
	display:none;
	float:right;
	right:0px;
	top:18px;
	z-index:1;
}
 ul#ddNav li{
	display: block !important;
	border-left:1px solid #ddd;
	border-right:1px solid #ddd;
	border-bottom:1px solid #ddd;
	padding:5px;
}
li#third ul#ddNav li a {
	background:none;
	padding-right:13px;
	font-size: 10pt;
}
li#third ul#ddNav li:hover {
	background-color: #f3f3f3;
}
li#third ul#ddNav li a:hover {
	color:#09c;
}
sup.challCounts {
	background-color: #bc0202;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	padding: 2px 5px;
	margin: 0;
	vertical-align: 5%;
	color: #fff;
	font-weight: bold;
	font-size: 10pt;
}

/* sub-sub nav */
#liLive ul li, #liPlay ul li, #liQuizLab ul li {	
	padding:0;	
	margin:0;
}		
#liLive ul li.menu, #liPlay ul li.menu, #liQuizLab ul li.menu {
	position:relative; 
}	
#liLive ul li.menu a, #liPlay ul li.menu a, #liQuizLab ul li.menu a {
	padding:3px 10px 0; /* strange link alignment fix */
}
#liLive ul li.menu a:hover, #liPlay ul li.menu a:hover, #liQuizLab ul li.menu a:hover, #liLive ul li.menu:hover a, #liPlay ul li.menu:hover a, #liQuizLab ul li.menu:hover a {
	-webkit-border-radius: 6px 6px 0 6px;
	-moz-border-radius: 6px 6px 0 6px;
	border-radius: 6px 6px 0 6px;
	text-decoration: none;						
	background-color: #e9e9e9 
}
#liLive a.subLink, #liPlay a.subLink, #liQuizLab a.subLink {
	background-color: transparent !important;
}
#liLive ul li.menu ul.subsub , #liPlay ul li.menu ul.subsub , #liQuizLab ul li.menu ul.subsub  { 
	display: none; 
	white-space:nowrap;
	background-color: #e9e9e9 !important;
	z-index: 9999;
	padding:10px 0 0;
	border-bottom: 0;
	-webkit-border-radius: 0 6px 6px 6px;
	-moz-border-radius: 0 6px 6px 6px;
	border-radius: 0 6px 6px 6px;
}
#liLive ul li.menu:hover ul.subsub , #liPlay ul li.menu:hover ul.subsub , #liQuizLab ul li.menu:hover ul.subsub  { 
	top:23px;
	left:0;
	background-color: transparent;
	display: table;
	table-layout: fixed;
}	
#liLive ul li.menu:hover ul.subsub li, #liPlay ul li.menu:hover ul.subsub li, #liQuizLab ul li.menu:hover ul.subsub li {
	display: table-row;
	float:none;
	border-bottom: 1px solid #fff;
}
#liLive ul li.menu:hover ul.subsub li a, #liPlay ul li.menu:hover ul.subsub li a, #liQuizLab ul li.menu:hover ul.subsub li a {
	display: table-cell;
	text-shadow: none;
	text-align: left;
	border-bottom:0;
}

/* unique submenu widths */
.moreDD ul.subsub {	
	width:130px !important;
}

/* Header Sprites */

#third:hover .menuArrow {
	background: #09c url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") no-repeat 0 -288px;	
}
.menuArrow {
	background: #fff url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") no-repeat 0 -294px;
	display: inline-block;
	width: 9px;
	height:12px;
	margin-left:5px;
	position:relative;
	top:5px;
}
#liHome.on a { 
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") 0 -157px no-repeat;
}
#liHome.off a { 
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") 0 -208px no-repeat;
}
#liHome a, #liPlay a, #liCreate a, #liQuizLab a, #liApps a, #liLive a{
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") 100px -208px repeat-x;
}
#navOuter {
 	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") 0 -106px repeat-x;
}
#liHome a:hover, #liHome:hover a, #liHome.over a {
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") 0 -157px no-repeat;
}
#liPlay a:hover, #liPlay:hover a, #liPlay.over a, #liPlay.on a {
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") -100px -157px no-repeat;
}
#liCreate a:hover, #liCreate:hover a, #liCreate.over a, #liCreate.on a {
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") -100px -157px no-repeat;
}
#liQuizlab a:hover, #liQuizLab:hover a, #liQuizLab.over a, #liQuizLab.on a {
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") -100px -157px no-repeat;
}
#liApps a:hover, #liApps:hover a, #liApps.over a, #liApps.on a {
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") -100px -157px no-repeat;
}
#liLive a:hover, #liLive:hover a, #liLive.over a, #liLive.on a {
	background: transparent url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") -100px -157px no-repeat;
}
#logo {
	background-image: url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png");
}
#searchButton {
	background-image: url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png");
}
#facebook {
	background-image: url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png");
	background-position: 164px -88px;
	width:16px;
	height:16px;float:left;
	margin-right:5px;	
}
#twitter {
	background-image: url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png");
	background-position: 147px -88px;
	width:16px;
	height:16px;
	float:left;
}
.year {
	padding: 10px 0;
	text-align: center;
	font-size: 9px;
	font-weight: bold;
	width: 33px;
	height: 22px;
	background: url("//d162758vd3dbpx.cloudfront.net/images/headerSprite_v3.png") 0 -257px no-repeat;
}


/*************************
 * End New Header 
 *************************/