/* Last modified Mar 2015 */
html, #MainViewable {
	height: 100%;
}
body > #MainViewable {
	height: auto;
	min-height: 100%;
}
body {
	font-family: Helvetica Neue, Helvetica, Arial, Verdana, Geneva, Sans-Serif;
	font-size: medium;
	background-color: #f7f7f7;
	margin:0;
}
#bg-temp {
	background: url('/images/pageBgd.png') center top repeat-y;
}
table {
	border-collapse:collapse;
}
td {
	padding:2px; font-size:small;
}
a.stateful:visited {
	color: #898989;
}
a:hover {
	text-decoration: underline;
}
a {
	color: #0098ce;
	text-decoration: none;
}
div, ul, li {
	margin: 0;
	padding: 0;
}
input, textarea {
	font-family: Helvetica Neue, Helvetica, Arial, Verdana, Geneva, Sans-Serif;
}
.textCentered {
	text-align: center;
}
.elementCentered {
	margin: 0px auto;
	display: table;
}
.clearfix:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
}
.bold {
	font-weight: bold;
}
.center img {
	margin: 0 auto;
	display: block;
}

img.leaderboardAd {
	padding: 5px 0;
	height:90px;
	display: block;
}

/* Main Layout */
#MainViewable {
	margin-top:5px;
}
#page-wrapper {
	width:960px;
	background-color: #fff;
	margin: 0 auto 5px;
	padding:20px 0 0 0;
	border-top: 1px solid #d8d8d8;
	border-bottom: 1px solid #dbdbdb ;
}
#TopBar {
	width:920px;
	height:70px;
	margin:0 auto;
	position:relative;
	z-index: 20001;
}
#AdBar {
	min-height:92px;
	margin:0 auto 5px;
	padding:0px;
	z-index:1;
}
#AdBarLinks {
	width:728px;
	margin:0 auto;
	overflow:auto;
}
#MainContainer {
	width:920px !important;
	margin: 0 auto;
	padding:4px 0 60px;
	text-align:left;
}
#TopRight {
	width:460px;
	margin-left:460px;
	text-align:center;
	font-size:7pt;
}
#CenterContent {
	padding:20px;
	min-height: 450px;
	position:relative;
}
.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;
}
#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;
}
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 */
/* 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-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;
}

/* Pagination */
.paginationBox {
	border-top: 1px solid #dbdbdb;
	padding: 30px 0;
	text-align: center;
	margin: 0 auto;
}
.paginationBox > a {
	text-decoration: none;
}
.pagenum {
	display: inline-block;
	color: #0098ce;
	padding: 5px 10px;
}
.pagenum.active {
	font-weight: bold;
	border: 3px solid #f90;
	color: #f90;
	border-radius: 20px;
}
.pagenum span:hover {
	text-decoration: underline;
	cursor: pointer;
}
.pageButton {
	display: inline-block;
	background: #eee;
	-webkit-transition: background-color .15s;
	-moz-transition: background-color .15s;
	-ms-transition: background-color .15s;
	transition: background-color .15s;
	color: #bbb;
	font-size: 10pt;
	font-weight: bold;
	padding: 7px 12px;
	margin: 0 2px;
	-webkit-border-radius: 6px;
	-moz-border-radius: 6px;
	border-radius: 6px;
}
.pageButton a {
	text-decoration: none;
}
.activeLink {
	color: #09c;
}
.activeLink:hover:not(.disabled) {
	background-color: #dbdbdb;
	-webkit-transition: background-color .15s;
	-moz-transition: background-color .15s;
	-ms-transition: background-color .15s;
	transition: background-color .15s;
	text-decoration: none;
	cursor: pointer;
}

/* New modals CSS */
/**	Signup/Login modal **/
.loginSignupPromo .topPromo {
	text-align:center;
}
.loginSignup {
	position:relative;
	text-align:center;
}
.loginSignup .orDivider {
	display:inline-block;
	position:absolute;
	left: 281px;
	top: 68px;
	width:50px;
	text-align: center;
	padding:10px;
	background-color: #fff;
	color:#999;
	z-index:2;
}
.loginSignup .signupPromo {
	display:inline-block;
	width:225px;
	vertical-align: top;
}
.loginSignup .signupPromo input {
	border:1px solid #eee;
	background-color: #eee;
	padding:8px;
	font-size: 11pt;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;	
}
.loginSignup .labelLink {
	position:relative;
	top: -21px;
	left: 81px;
	padding:0;
	margin:0;
}
.loginSignup .usernameInput {
	position: relative;
	display: block;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width:100%;
	padding:8px;
}
.loginSignup .passwordInput {
	position: relative;
	display: block;
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	width:100%;
	padding:8px 50px 8px 8px;
}
.loginSignup .signupPromo input:hover {
	border:1px solid #dbdbdb;
	background-color: rgba(235,235,235,0.4);
	-webkit-transition: background-color .15s, border-color .15s;
	-moz-transition: background-color .15s, border-color .15s;
	-ms-transition: background-color .15s, border-color .15s;
	transition: background-color .15s, border-color .15s;
}
.loginSignup .signupPromo button {
	margin-bottom: 15px;
}
.loginSignup .promoLeft {
	padding-right:57px;
}
.loginSignup .promoRight {
	position:relative;
	line-height: 43%;
	padding-top:11px;
	padding-left:57px;
	border-left: 1px solid #dbdbdb;
}
.loginSignup .rememberMeContainer {
	color:#999;
	font-size: 12px;
	padding:4px;
	text-align:left;
}
.loginSignup .loginError {
	color: red;
	text-align: center;
	font-size: 80%;
	position:absolute;
	width:100%;
	bottom:-5px;
	left:28.5px;
}
.loginSignupPromo .loginPassthrough {
	color:#9C9B9A;
	display:block;
	text-align:center;
    font-size: 75%;
    margin-top:15px;
    text-decoration:underline;
}
.loginSignupPromo .loginPassthrough:hover {
	cursor:pointer;
}
/* end new modals css */


/* Tinybox CSS */
/* modal CSS */
#modalPop {
	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:#0098ce;
	text-decoration: none;
	cursor: pointer;
	font-weight:bold;
}
#modalPop a:hover {
	text-decoration:underline
}
#modalPop a.button {
	text-decoration:none !important;
	color: white;
}
.banner {
	background: url('/images/modalRegBanner.png') no-repeat;
	background-position:center top;
	background-size: 550px 266px;
	width:680px;
	text-align: center;
	margin: auto;
}
#modalPop h1{
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	text-shadow: 0 1px 0 #fff6da;
	color:#333;
	margin-top:0;
	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;
}
.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 p {
	margin:0;
	padding:10px 0 0 0;
}
#modalcontent-login #header1-login {
	text-align: center;
	font-size: 24px;
	font-weight: bold;
	text-shadow: 0 1px 0 #fff6da;
	color:#333;
	margin-bottom:0px;
}
#above-social {
	line-height: 1.3em;
	padding: 10px 0 0 0;
}
.modal-spacer {
	margin-bottom:15px;
	margin-top: 15px;
	line-height: 1.3em;
}
#rightMod {
	position: relative;
	float: right;
	width: 260px !important;
	margin-top: 10px;
	padding-left: 30px;
	border-left: 1px solid #b3a895;
}
#leftMod {
	position: relative;
	float: left;
	width: 260px !important;
	margin-top: 10px;
	padding-right:15px
}

#passthrough {
	clear: both;
	text-align: right;
	padding: 10px;
}

#passthrough #passthrough-a {
	font-weight: normal;
	color: #999;
}

/* 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, .tinner-no-bg {
	padding:25px;
	-moz-border-radius:15px;
	-webkit-border-radius: 15px;
	border-radius:15px 15px 15px 15px;
	background: #fff url('/images/tanNoiseBgd.png') repeat !important;
}
.tinner-no-bg {
	background-image:none !important;
}
.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('/images/close.png') no-repeat;
}
.tclose:hover {
	background-position:0 -30px;
}
#modButton {
	min-height:74px;
	padding-top: 10px;
}
/*
Green button
adding .modButton .button to allow access #modButton behaviour without inheriting min-height & padding
*/
#modButton .button, #startbutton .button, .resetButton, .passButton, .modButton .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%);
}

/*
For fake buttons:
*/
.fake-link {
	color:#0098ce;
}
.fake-link:hover {
	text-decoration:underline;
	cursor:pointer;
}

/*
adding .modButton .button:hover to allow access #modButton behaviour without inheriting min-height & padding
*/
#modButton .button:hover, #startbutton .button:hover, .modButton .button:hover{
	border: 1px solid #307414;
}
/*
adding .modButton .button strong to allow access #modButton behaviour without inheriting min-height & padding
*/
#modButton .button strong, #startbutton .button strong, .resetButton, .modButton .button strong {
	font: bold 20px Helvetica Neue, Helvetica, Arial, sans-serif;
}

#forms.password_form {
	background-color:#fff;
	padding:0 !important; /*Important added to override #forms padding*/
}
#forms.password_form ul {
	background-color:#f3f3f3;
	padding-top:20px;
	border-radius:5px;
	margin-bottom: 20px;
}
.err {
	color:red;
}
.resetButton {
	padding:8px 50px;
	padding-top:8px !important;
	min-height:25px !important;
	margin-top:4px;
}
#modButton.passButton {
	font:15px Helvetica Neue, Helvetica, Arial, sans-serif;
	padding:5px 20px;
	min-height:25px;
	margin-top:4px;
	margin-left:0;
	text-shadow:none;
}
.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-size: 14px;
}

/** Alert styles - green, red, and yellow alerts */
/* common styles */
.alertGood, .alertBad, .alertNeutral, .alertLoading {
	margin: 1em 0;
	padding: 18px 18px 18px 60px;
	font-size: 15px;
	text-align: left;
	background-repeat: no-repeat;
	background-position: 10px 7px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
.alertGood a, .alertBad a, .alertNeutral a, .alertLoading a {
	text-decoration: underline;
}
.alertGood {
	color: #fff;
	background: #5ccb7c url("/images/alertSuccess.png") no-repeat 15px center;
}
.alertGood a{
	color:#fff;
}
.alertBad {
	color: #fff;
	background: #d35959 url("/images/alertError.png") no-repeat 15px center;
}
.alertBad a{
	color:#fff !important;
}
.alertNeutral {
	background: url("/images/alertNotice.png") no-repeat 15px center;
}
.alertLoading {
	background: url("/images/loadinfo.net_2.gif") no-repeat 15px center;
}
.alertNeutral, .alertLoading {
	color: #b3800c;
	background-color: #feda5e;
}
.alertNeutral a, .alertLoading a {
	color: #b3800c;
}
.alert-message, #game-message {
	width: 97%;
	display: inline-block;
	vertical-align: middle;
}
.close-alert, .close-message {
	display: inline-block;
	vertical-align: middle;
	cursor: pointer;
	font-weight: bold;
	text-align: right;
	white-space: nowrap;
	right:0
}
.close-alert:hover, .close-message:hover {
	opacity: .8;
}

.authAlert {
color:red;
padding-bottom:10px;
}
.authAlert {
	color:red;
	padding-bottom:10px;
}
#game-message-box:after {
	content: "";
	display: block;
	white-space: nowrap;
}
#narrow_content{
	position: relative;
	width:560px;
}
.dek {
	font-size: 120%;
	margin-bottom: 20px; padding:0;
	color:#666;
	width: 560px !important;
}
.dek a { /* added for login form */
	color:#0098ce;
}
#auth-success {
	font-size:120%;
	/*color:#666;*/
}
.help-icon {
	display: inline-block;
	width: 12px;
	height: 12px;
	color: #fff;
	background-color: #5777BA;
	text-align: center;
	border-radius: 50%;
	font-size: 10px;
	margin-top: 3px;
    margin-left: 3px;
	position: relative;
	bottom: 1px;
	font-weight: normal;
	vertical-align:top;
	line-height:13px;
}

/* ----------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;
}

/* ----------outer and inner----------------- */
#outer {
	background-color: #fff;
}
#inner {
	margin:0;
	width:100%;
}

/* --------------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:20px;
	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;
}
#forms div.err {
	color: #f00;
	margin-bottom: 10px;
	margin-left:150px;
}
#forms label.err {
	color:#f00;
}
#forms input.err {
	border: 2px solid red;
	color: #f00;
}
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-size: 14px;
}
#forms .email {
	width:180px;
}
.divider {
	border-top:1px solid #d7d7d7;
	padding-top:20px;
}
.info {
	color:#999;
	font-size: 12px;
}
#forms .un {
	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:#0098ce;
	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;
	margin-bottom: 15px !important;
	text-align: left;
	margin-top: 6px;
}
#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 .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 .gamelen, #rhcBox .more:hover {
	text-decoration:underline;
}
#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 .tab {
	text-transform: uppercase;
	font-size: 9pt;
	font-weight: bold;
	padding: 0 0px 3px;
	color: #0098ce;
	cursor: pointer;
	float:left;
	height:15px;
}
#rhcNav .tab:hover{
	color:#000;
}
#rhcNav .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;
	cursor:pointer;
}
.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;
}

/** 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:#0098ce;
	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 {
 	color:#777;
 	width:300px;
 	text-align:left;
 	margin:0;
 }
 #ArchiveBox, #PromoBox #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:#0098ce;
 }
 #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%;
}

/************************
* Header and User Nav *
************************/
#header {
	margin: 0;
	padding: 0;
	height: 123px;
	width: 100%;
	font-family: Helvetica, Arial, Verdana, Geneva, Sans-Serif;
	border-bottom: 3px solid rgba(0,0,0,0.15);
}
.minwidth {
	min-width:920px;
	width: auto !important;
	width: 920px;
}

/* header top section */
#header-inner {
	position: relative;
	max-width: 920px;
	margin: 0 auto;
	padding: 5px 20px;
	height:58px;
	background-color:#fff;
}
#headerLogo {
	position:absolute;
}
#logo {
	width: 170px;
	height: 43px;
	background:transparent url('/images/headerSprite_v11.png') 0 0 no-repeat;
}
#headerSearch {
	position: absolute;
	top:8px;
	left:235px;
}
#searchBox, .headerButtons {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
}
#searchBox {
	width: 230px;
	height: 18px;
	padding:8px 8px 8px 33px;
	font-size: 11pt;
	border:1px solid #eee;
	background:#eee url('/images/headerSprite_v11.png') -23px -74px no-repeat;
	-webkit-transition: background-color .15s, border-color .15s;
	-moz-transition: background-color .15s, border-color .15s;
	-ms-transition: background-color .15s, border-color .15s;
	transition: background-color .15s, border-color .15s;
}
#searchBox:hover {
	border:1px solid #dbdbdb;
	background-color: rgba(235,235,235,0.4);
	-webkit-transition: background-color .15s, border-color .15s;
	-moz-transition: background-color .15s, border-color .15s;
	-ms-transition: background-color .15s, border-color .15s;
	transition: background-color .15s, border-color .15s;
}
.headerButtons {
	background-color: #eee;
	-webkit-transition: background-color .15s;
	-moz-transition: background-color .15s;
	-ms-transition: background-color .15s;
	transition: background-color .15s;
	padding: 13px 10px 10px;
	cursor: pointer;
	font-size: 10pt;
	font-weight: bold;
	position: absolute;
	top: 8px;
	line-height: 1em;
	height: 13px;
}
.headerButtons:hover {
	background-color: #dbdbdb;
	-webkit-transition: background-color .15s;
	-moz-transition: background-color .15s;
	-ms-transition: background-color .15s;
	transition: background-color .15s;
	text-decoration: none;
}
.headerButtons.placeholder {
	cursor:default;
}
.headerButtons.placeholder:hover {
	background-color:#eee;
}
.headerButtons:active {
	background-color:#ccc;
}
#random {
	right:307px;
}
#signup {
	right:192px;
}
#go-orange {
	right:202px;
	color:#fff;
	background-color:#f90;
}
#go-orange:hover {
	background-color: #ffc00a;
}

/*--- User Nav & Notifications ---*/
#user-not-logged-in {
	right: 118px;
}
#userNav {
	text-align: right;
	-webkit-text-size-adjust: none;
	position: absolute;
	z-index: 1;
	right: 118px;
	top: 8px;
	display: inline-table;
	padding: 0;
	color:#09c;
}
#userNav ul {
	font-size: 0;
	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:#0098ce;
	padding:6px;
	text-decoration: none;
}
.user-thumb, #userNav-thumb {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	display: inline-block;
	background: #eee url(/images/u/default.png) no-repeat;
	background-position: center;
	background-size: cover;
	width: 36px;
	height: 36px;
	vertical-align: middle;
	position: relative;
}
.user-thumb a {
	display:block;
	height:100%;
}
.user-thumb-indicator {
	position: absolute;
	bottom: 0;
	right: 0;

	width:50%;
	height:50%;
	margin-right:-25%;
	margin-bottom:-20%;
}
.sporcle-Admin-indicator, .sporcle-Staff-indicator {
	background-image: url('/images/teamAvatar_2.png');
	background-repeat: no-repeat;
	background-size:100%;
}
.sporcle-Orange-indicator {
	background-image: url('/images/icon-orangeAvatar.png');
	background-repeat: no-repeat;
	background-size:100%;
}
.transparent {
    background-color: transparent !important;
}
.username {
	padding:0 10px;
	top: 1px;
	position: relative;
}
#notifications {
	right: 20px;
}
#messages {
	right: 68px;
}
.alert-subject {
	word-break:break-word;
	word-wrap:break-word;
	max-width:253px;
}
#notifications, #messages {
	text-align: right;
	-webkit-text-size-adjust: none;
	position: absolute;
	z-index: 1;
	top: 8px;
	display: inline-table;
	padding: 0;
}
#notifications-thumb {
	width: 34px;
	background: url('/images/headerSprite_v11.png')  9px -72px no-repeat;
}
#messages-thumb {
	width: 36px;
	background: url('/images/headerSprite_v11.png')  9px -108px no-repeat;

}
#notifications-thumb, #messages-thumb {
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	border-radius: 4px;
	display:inline-block;
	height: 36px;
	right: 20px;
	-webkit-transition: background-color .15s;
	-moz-transition: background-color .15s;
	-ms-transition: background-color .15s;
	transition: background-color .15s;
}
#notifications-thumb.active, #messages-thumb.active {
	background-color:#ccc;
	-webkit-transition: background-color .15s;
	-moz-transition: background-color .15s;
	-ms-transition: background-color .15s;
	transition: background-color .15s;
}
#userNav-thumb.placeholder, #notifications-thumb.placeholder, #messages-thumb.placeholder {
	background-image:none;
}
#userNav-thumb.placeholder:before, #notifications-thumb.placeholder:before, #messages-thumb.placeholder:before {
	content: ' ';
	position: absolute;
	left: 0;
	top: 0;
	height: 36px;
	opacity: 0.5;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	filter: gray;
	filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale");
}
#userNav-thumb.placeholder:before {
	width: 36px;
	background-image: url('/images/u/default.png');
}
#notifications-thumb.placeholder:before {
	width: 34px;
	background:url('/images/headerSprite_v11.png') 9px -72px no-repeat;
}
#messages-thumb.placeholder:before {
	width: 36px;
	background:url('/images/headerSprite_v11.png') 9px -108px no-repeat;
}
.counter {
	padding:0;
	top:-3px;
	position:absolute;
	display: block;
	z-index: 2;
	background-color: #d00000;
	-webkit-border-radius: 14px;
	-moz-border-radius: 14px;
	border-radius: 14px;
	cursor:pointer;
}
#notifications-wrapper .counter {
	right:10px;
}
#messages-wrapper .counter {
	right:58px;
}
#notifications_count {
	margin: 0;
	display: block;
	color: #fff;
	min-width: 14px;
	height: 14px;
	font-size: 9pt;
	padding: 5px;
	text-align: center;
	line-height: 1.4em;
}
#messages_count {
	margin: 0;
	display: block;
	color: #fff;
	min-width: 14px;
	height: 14px;
	font-size: 9pt;
	padding: 5px;
	text-align: center;
	line-height: 1.4em;
}

/*--- header dropdowns ---*/
.ddNav {
	background-color:#e3e3e3;
	list-style:none;
	position:absolute;
	padding:0 0 10px 0;
	right:116px;
	top:42px;
	z-index:400001;
	font-size: 10pt;
	width:150px;
	border-bottom-right-radius:	4px;
	-moz-border-radius-bottomright:	4px;
	-webkit-border-bottom-right-radius:	4px;
	border-bottom-left-radius: 4px;
	-moz-border-radius-bottomleft: 4px;
	-webkit-border-bottom-left-radius: 4px;
	visibility: hidden;
	opacity: 0;
	transition: visibility 0s linear 0.15s,opacity 0.15s linear;
}
.ddNav.visible {
	visibility: visible;
	opacity: 1;
	transition-delay: 0s;
}
.ddNav li{
	margin:0;
	background-color:#f6f6f6;
	border-left:1px solid #dbdbdb;
	border-right:1px solid #dbdbdb;
}
.ddNav li:hover {
	background-color:#f8f8f8;
}
.ddNav li a {
	font-size: 10pt;
	padding:6px 10px;
	color:#888;
	cursor: pointer;
}
.ddNav .separator {
	border-top:1px solid #c5c5c5
}
.ddNav h4 {
	text-align: center;
	padding:10px 10px 10px 10px;
	margin:0;
	font-size: 10pt;
	border-bottom: 1px solid #c5c5c5;
}
/*---- user dropdown ----*/
#userNav-dropdown a {
	display: block;
	color:#09c;
}
#userNav-dropdown a:hover {
	text-decoration: underline;
	background-color: #f9f9f9;
}
#userNav-dropdown h4 a, #messages-dropdown h4 a, #notifications-dropdown h4 a {
	color:#000;
}
#userNav-dropdown h4 a:hover, #messages-dropdown h4 a:hover, #notifications-dropdown h4 a:hover{
	background-color: transparent;
}
/*--- notifications dropdown ---*/
#notifications-dropdown {
	width: 310px;
	right:20px;
	line-height: 1.3em;
}

/*--- messages dropdown ---*/
#messages-dropdown {
	width: 310px;
	right:68px;
	line-height: 1.3em;
}

/*--- notifications and messages dropdown ---*/
#notifications-dropdown li, #messages-dropdown li{
	border-bottom:1px solid #e5e5e5;
	width:288px
}
#notifications-dropdown li a, #messages-dropdown li a {
	padding: 5px 10px;
	cursor: pointer;
}
#notifications-content, #messages-content {
	max-height: 400px;
	overflow: hidden;
}
#notifications-content:hover, #messages-content:hover {
	overflow-y : auto;
	overflow-x: hidden;
}
#notifications-content li, #messages-content li {
	padding:10px;
	overflow:hidden;
}
#notifications-content li.unread, #messages-content li.unread {
	background-color: #e4f6fd;
}
#notifications-content li.unread:hover, #messages-content li.unread:hover {
	background-color: #eaf9fe;
}
#notifications-content li a, #messages-content li a {
	color:#09c;
	padding:0;
}
#notifications-content li a:hover, #messages-content li a:hover {
	cursor: pointer;
	text-decoration: underline;
}
#notifications-content .actionText, #messages-content .actionText {
	width:253px;
	float:right;
	word-break: break-word;
}
#notifications-content .actionTime, #messages-content .actionTime {
	color:#888;
	font-size: 85%;
	padding-top:5px;
}
#notifications-content .box25, #messages-content .box25 {
	width:25px;
	height:25px;
	margin-right:10px;
}
#notifications-content .box25 a, #messages-content .box25 a {
	display: block;
	border:0
}
#seeAll {
	padding-top:8px;
}

/* this helps with vertical scrollbar on webkit browswers */
::-webkit-scrollbar {
	-webkit-appearance: none;
	width: 7px;
}
::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background-color: rgba(0,0,0,.5);
	-webkit-box-shadow: 0 0 1px rgba(255,255,255,.5);
}

/* Main Nav, Section Buttons */
#nav {
	position: relative;
	height: 55px;
	text-transform: uppercase;
	background-color: #f90;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
}
#nav a {
	text-decoration: none;
}
#nav li a {
	color: #fff;
	display: block;
	padding:16px 20px 19px ;
	font-size:16px;
	font-weight: 600;
}
#nav li {
	float: left;
	display: block;
}
#nav .mainNav.on {
	background-color: #ffae00;
}
#nav .mainNav:hover .tab {
	background-color: #ffae00;
	text-decoration: underline;
}
#nav .mainNav .tab {
	height:20px;
}

/* MAIN NAV VERTICAL DD menus */
.mainNav .dropdown {
	display: none;
}
.mainNav .dropdown li {
	width: 100%;
}
.mainNav .dropdown li:hover {
	background-color: #ffc600;
}
.mainNav:hover .dropdown  {
	z-index: 400000;
	background-color: #ffae00;
	height: auto;
	width: 180px;
	display: block;
	float: none !important;
	color: #fff;
	position: absolute;
	-webkit-border-bottom-right-radius: 6px;
	-webkit-border-bottom-left-radius: 6px;
	-moz-border-radius-bottomright: 6px;
	-moz-border-radius-bottomleft: 6px;
	border-bottom-right-radius: 6px;
	border-bottom-left-radius: 6px;
	padding:0 0 10px 0;
	-webkit-box-shadow: 3px 3px 0px rgba(0,0,0,0.15);
	-moz-box-shadow: 3px 3px 0px rgba(0,0,0,0.15);
	box-shadow: 3px 3px 0px rgba(0,0,0,0.15);
}

/* nav style overrides */
#nav .dropdown li a {
	padding: 5px 20px 2px 20px;
	font-size: 77%;
}

/*****************
*	END NAV     *
****************/

/* footer */
#footerTop, #footerBottom {
	margin: 0 auto;
}
#footerTop {
	background-color: #fff;
	border-top:1px solid #dbdbdb;
	padding:20px ;
}
#footerLogoBox {
	background: transparent url('/images/headerSprite_v11.png') no-repeat 0px -150px;
	display: block;
	width:102px;
	height:36px;
	margin-bottom: 11px;
}
#footerBottom {
	background-color: #eee;
	padding:20px;
	color:#8f8f92;
	font-size: 79%;
}
#bottomContent {
	position: relative;
}
#footerLogo, #footerCount {
	display:inline-block;
}
#footerLogo {
	color:#929292;
	font-size: 90%
}
#footerCount {
	float:right;
	font-size: 130%;
	width:313px;
	padding:0;
	margin-top:6px;
}
.smallerText {
	font-size: 68%;
	padding:0;
}
#footerBottom a {
	text-decoration: none;
	color:#8f8f92;
}
#footerBottom a:hover {
	text-decoration: underline;
	color: #444;
}
#footerBottom a.orange-highlight {
	color:#f90;
}
#footerBottom ul{
	list-style: none;
	margin: 0;
	padding: 0;
}
#footerBottom li {
	margin: 0;
	padding: 0;
	font-size: 100%;
	line-height: 1.4;
}
div.footer-links {
	float: left;
	width: 304px;
	margin: 0 0 10px 0;
}
div.footer-links h3 {
	margin: 5px 0 15px 0;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
}
.clearfix:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
}

input[type=button]::-moz-focus-inner,
button::-moz-focus-inner {
	padding: 0;
	border: 0;
}
/* sitewide buttons */
.smallGrayButton {
	display: inline-block;
	background-color: #fff;
	color: #0098ce;;
	padding: 10px 15px;
	border-radius: 4px;
	cursor:pointer;
}
.smallGrayButton:hover {
	background-color:rgba(0,0,0,0.08);
	border-radius: 3px 3px 3px 3px;
	-moz-border-radius: 3px 3px 3px 3px;
	-webkit-border-radius: 3px 3px 3px 3px;
}
.buttonShape {
	box-sizing: border-box;
	border: 2px solid transparent;
	color: #fff;
	cursor: pointer;
	font-family: Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;
	font-size: 14px;
	font-weight: 400;
	min-width: 2.7857em;
	line-height: 2.7857em;
	padding: 0 1em;
	position: relative;

	/* common button styles */
	text-align: center;
	text-decoration: none;
	white-space:nowrap;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	transition: background-color .15s,border-color .15s,color .15s;

	background-repeat:  no-repeat;
	background-position: 10px, left;
	background-size: 25px 25px;
	display: block;
	width: 100%;
	margin-top: 10px;
}
.buttonShape:hover {
	background-color: #777777;
}
.buttonFacebook {
	background-color: #3b5998;
	padding-left: 40px;
	background-image: url('/images/facebook_button2.svg');
}
.buttonFacebook:hover {
	background-color: #4562a1;
}
.buttonTwitter {
	background-color: #428bca;
	padding-left: 40px;
	background-image: url('/images/twitter_button2.svg');
}
.buttonTwitter:hover {
	background-color: #3b94d9;
}
.buttonGoogle {
	background-color: #dd4b39;
	padding-left: 40px;
	background-image: url('/images/google_button4.svg');
}
.buttonGoogle:hover {
	background-color: #ee503d;
}
.buttonContainer {
	display: inline-block;
	width:220px;
	margin:0 10px;
}
.centeredButtonContainer {
	margin:0 auto;
	width:220px;
	text-align:center;
}
.buttonGreen {
	background-color: #84b623;
	padding:0;
	color:#fff;
}
.buttonGreen:hover {
	background-color: #83c504;
	text-decoration:none;
}
.buttonOrange {
	background-color: #f90;
	padding:0;
	color:#fff;
}
.buttonOrange:hover {
	background-color: #ffc00a;
	text-decoration:none;
}
.fakeButton:visited {
	color:#ffffff;
}
.fakeButton:hover {
	text-decoration: none;
}
/*   Facebook Modals   */
.center {
	text-align:center;
}
.button-wrapper-facebook {
	margin:0 auto;
	text-align:center;
}
.button-wrapper-facebook .buttons span{
	font-size:120%;
	border:2px solid #f90;
	font-weight:600;

	padding: 10px 20px;
	text-shadow: none;
	text-transform: uppercase;
	display: inline-block;

	/* common button styles */
	text-decoration:none;
	text-align:center;
	white-space:nowrap;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	transition: background-color .15s,border-color .15s,color .15s;

}
.button-wrapper-facebook .buttons span:hover  {
	border:2px solid rgb(255, 132, 0);
	background-color:rgb(255, 132, 0);
	color:#fff !important;
	text-decoration: none !important;
}
.button-wrapper-facebook .buttons .flatClearButton {
	margin-right:30px;
	color:#f90 !important;
}
.button-wrapper-facebook .buttons .flatOrangeButton {
	color: #fff !important;
	background-color: #f90;
}
#modalPop h2 {
	color:#000;
	text-shadow: none;
	border-bottom:none;
}
/*   End Facebook Modals   */

/* Gray button */
/* should be declared after .buttonshape */
.buttonGray {
	background-color: #eee;
	padding: 0;
	color: #09c;
	/*font-family: Helvetica Neue, Helvetica, Arial, Verdana, Geneva, Sans-Serif;*/
}
.buttonGray:hover {
	background-color:#dbdbdb;
}

/* White button */
/* should be declared after .buttonshape */
.buttonWhite {
	background-color:#fff;
	color:#09c;
	/*font-family: Helvetica Neue, Helvetica, Arial, Verdana, Geneva, Sans-Serif;*/
	border:1px solid #09c;
	padding:0;
}
.buttonWhite:hover, .buttonFollowing {
	background-color: #09c;
	color:#fff;
	text-decoration: none;
}
.buttonReveal {
	color: #0098ce;
	width:148px;
	border:1px solid #09c;
	padding:8px 10px;
	text-align: center;
	text-transform: uppercase;
	font-size: 65%;
	margin-left:5px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	cursor:pointer;
}
.buttonReveal:hover {
	color:#fff;
	background-color:#09c;
}
.linkReveal {
	color:#0098ce;
	float:right;
	font-size:9pt;
	font-weight:normal;
	line-height: 23px;
	cursor:pointer;
}
.linkReveal:hover {
	text-decoration: underline;
}
.linkReveal span {
	display: inline-block;
	color:#a5aeba;
	text-decoration: none;
}
#leftColumn {
	width:590px;
	float: left;
}
#rightColumn {
	float:right;
	width:300px;
}
.rightBox {
	font-size: 84%;
	padding-bottom: 10px;
}
.rightBox .rightBoxTitle {
	background:transparent url('/images/rhc-hdr-ribbon.gif') 0 0 no-repeat;
	color: #fff;
	font-size: 15px;
	font-weight: 400;
	letter-spacing: 1px;
	height: 47px;
	left: 0;
	padding:6px 0 0 10px;;
	text-transform: uppercase;
	top: 0;
	width: 342px;
	margin: 20px 0 0 0;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
}
#colHead .floatLeft,#colHead .floatRight {
    text-transform: uppercase;
    font-size: 85%;
}
.floatLeft{
    float:left !important;
}
.floatRight {
    float:right;
}
#colHead {
    display: block;
    height: 25px;
}
.rightBox ol {
	padding-left:0;
	list-style: none;
	margin:-5px 0 0 0 ;
}
.rightBox li {
	line-height: 1.4;
	font-weight: bold;
    overflow: hidden;
}
.rightBox li a {
    float: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.rightBox ol.small li a {
	width: 90%;
}
.rightBox h4 {
	margin:10px 0 0 0;
	font-weight: 200;
	text-transform: uppercase;
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;		
	font-weight: 600;	
	
}
.rightBox ul {
	list-style-type: none;
	margin: -5px 0 0 0;
}
.rightBox ul li span{
	color:#949292;
	font-weight: normal;
	float: right;
}

#follow-box {
	display:inline-block;
}
.follow-button {
	line-height:18px;
	color:#09c;
	border:1px solid #09c;
	-webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    width:75px;
    text-transform: uppercase;
    font-size:11px;
    text-align:center;
    display: inline-block;
}
.follow-button:hover {
	background-color:#09c;
	color:#fff;
	cursor:pointer;
}
.follow-button.following {
	background-color:#09c;
	color:#fff;
}
.follow-button .follow-button-text:after {
    content: "Follow";
}

.follow-button.following .follow-button-text:after {
    content: "Following";
}

/* promo pages for not-logged-in users (create, manage groups, etc.) */
#promo-box {
	background: url('/images/bgd_promo.png') center 0 no-repeat;
	min-height: 275px;
	color:#333;
	font-size: 17pt;
}
#promo-title-container {
	padding:0 60px;
}
#promo-title {
	font-weight: bold;
	font-size: 20pt;
}
#promo-content {
	width:760px;
	margin:auto;
}
#promo-content ul {
	margin-top: 20px;
}
#promo-content li {
	margin-left:20px;
	color:#f90;
	margin-top: 5px;
	font-size: 16pt;
}
#promo-content li span {
	color:#777;
}
#promo-join-now {
	color: #f90;
	font-weight: bold;
	font-size: 26pt;
	margin: 14px 0;
	text-align: center;
}
#promo {
	text-align: center;
}
#promo #button .button strong {
	font-size: 16pt;
	padding: 0 20px;
}

/* game type icons/sprite */
/* The first five styles are duplicated in each of these so that the explicit height/width
   doesn't put blank offsets on games (list type) that have no glyph */
.gameType.slideshow {
	display: inline-block;
	width: 19px;
	height: 17px;
	margin-left: 5px;
	position: relative;
	background:transparent url('/images/gameTypes2.png') -80px -84px;
	top: 2px;
}
.gameType.picture_click {
	display: inline-block;
	width: 19px;
	height: 17px;
	margin-left: 5px;
	position: relative;
	background:transparent url('/images/gameTypes2.png') -58px -85px;
	top: 3px;
}
.gameType.click_box {
	display: inline-block;
	width: 19px;
	height: 17px;
	margin-left: 5px;
	position: relative;
	background:transparent url('/images/gameTypes2.png') -20px -85px;
	top: 2px;
}
.gameType.picture_box {
	display: inline-block;
	width: 19px;
	height: 17px;
	margin-left: 5px;
	position: relative;
	background:transparent url('/images/gameTypes2.png') -0px -85px;
	top: 3px;
}
.gameType.map, .gameType.map_shape {
	display: inline-block;
	width: 19px;
	height: 17px;
	margin-left: 5px;
	position: relative;
	background:transparent url('/images/gameTypes2.png') -39px -85px;
	top: 3px;
}
.gameType.multiple_choice {
	display: inline-block;
	width: 19px;
	height: 17px;
	margin-left: 5px;
	position: relative;
	background:transparent url('/images/gameTypes2.png') -221px -85px;
	top: 2px;
}

/* generic styles for OpenTip tooltips */
.sp-opentip {
	font-size:13px;
}
.sp-opentip h3 {
	text-align:center;
	margin:0;
}
.sp-opentip-divider {
	width:100%;
	height:1px;
	background-color:#DDD;
	margin:6px 0;
}

/* facebook reconnect modal */
div[data-remodal-id=fb_reconnect_modal] .remodal-confirm {
	background-color: #f90;
	color: #fff;
	font-weight: 400;
	float: right;
}
div[data-remodal-id=fb_reconnect_modal] .remodal-confirm:hover {
	background-color: rgb(254,188,10);
	color: #fff;
}
div[data-remodal-id=fb_reconnect_modal] .remodal-cancel {
	background-color: #d8d8d8;
    color: #8f8f92;
    font-weight: 300;
    float: left;
}
div[data-remodal-id=fb_reconnect_modal] .remodal-cancel:hover {
	background-color: #e3e3e3;
    color: #8f8f92;
}
div[data-remodal-id=fb_reconnect_modal] button {
    font-size: 90%;
	padding: 10px 30px;
}

/* Set up to match the styles of the pubnation links */
.pubnation {
	float: left;
}
.hide-ad {
	margin-top: 2px !important;
	background: none !important;
	text-align: right !important;
	display: inline-block !important;
	float: right !important;
}
.hide-ad-link {
	font-size: 12px !important;
	color: #a5a5a5 !important;
	text-decoration: none !important;
	cursor: pointer !important;
}
.hide-ad-link:hover {
	text-decoration: none !important;
}

/* Sporcle Promo */
.banner-alert {
	color:#373720;
	font-weight:bold;
	font-size:15px;
	margin: 0;
	padding: 8px;
	border-bottom:1px solid #ebebb0;
	background-color: #FEFFCB;
	text-align:center;
	position:relative;
}
.banner-alert-dismiss {
	opacity:0.5;
	position:absolute;
	right:30px;
}
.banner-alert-dismiss:hover {
	opacity:1;
	cursor:pointer;
}
.banner-alert a {
	color:#ce0814;
}
#banner-verify {
	color:white;
	background-color:#d35959;
	font-weight:normal;
}
#banner-verify-resend {
	text-decoration:underline;
}
#banner-verify-resend:hover {
	cursor:pointer;
}