/* === General Experience Stylesheet === */

html { background: #eee; }

body {
	padding-top: 10px;
	background: #8dd8f8 url('../images/templates/theme/background.png') center 0 repeat;
	/*background: #245 url('../images/templates/theme/background.png') center 0 repeat-y;*/
	}

p { margin-bottom: 12px; }

textarea { resize: vertical; }

#ajax_loader_bar {
	position: absolute;
	top: 0;
	left: 0;
	text-align: center;
	width: 100%;
	}
.center {
	margin-left: auto !important;
	margin-right: auto !important;
	}
.left { float: left; }
.right { float: right; }
.align-right { text-align: right; }
.no-results {
	margin: 40px 0 50px;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	width: 922px;
	color: #a39b84;
	}

/* === Page Header === */

#header {
	height: 61px;
	overflow: hidden;
	border-bottom: 1px solid #333;
	background: url("../images/banner-blank.jpg") no-repeat;
	text-align: center;
	margin-bottom: 10px;
	}
#header h1 {
	margin-top: 10px;
	font-size: 40px;
	color: #fff;
	text-shadow: -1px -1px 0 #1874a1, 1px 1px 0 #6cf;
		-webkit-text-shadow: -1px -1px 0 #1874a1, 1px 1px 0 #6cf;
		-moz-text-shadow: -1px -1px 0 #1874a1, 1px 1px 0 #6cf;
	}

/* === Buttons! === */

.button {
	background: url("../images/button.png") repeat-x scroll left top #F9CF4C;
	color: #fff !important;
	display: inline-block;
	font-size: 20px;
	font-weight: bold;
	padding: 10px;
	cursor: pointer;
	border: 1px solid #c90;
	border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
	text-shadow: 1px 1px #c90;
		-webkit-text-shadow: 1px 1px #c90;
		-moz-text-shadow: 1px 1px #c90;
	box-shadow: 0 0 3px #ff0 inset;
		-webkit-box-shadow: 0 0 3px #ff0 inset;
		-moz-box-shadow: 0 0 3px #ff0 inset;
	}
input.button {
    height: 45px;
    padding: 0 10px;
    cursor: pointer;
	}
.button:hover {
	background-position: 0 -200px;
	border-color: #a70;
	}
.button:active, .button.active {
	background: #fc0;
	border-color: #a70;
	box-shadow: 0 0 3px #aa0 inset;
		-webkit-box-shadow: 0 0 3px #aa0 inset;
		-moz-box-shadow: 0 0 3px #aa0 inset;
	}

/* === Sections! === */

.section {
	background: #fffaeb; color: #666;
	position: relative;
	margin: 10px; padding: 10px;
	border: 1px solid #c3bba4;
	border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
	}
	.section > h2 {
		font-size: 24px;
		display: block;
		margin: -10px -10px 20px -10px; padding: 20px;
		background: #fff; color: #999;
		border-bottom: 1px solid #c3bba4;
		border-radius: 10px 10px 0 0;
			-webkit-border-radius: 10px 10px 0 0;
			-moz-border-radius: 10px 10px 0 0;
		box-shadow: 0 0 5px #ccc;
			-webkit-box-shadow: 0 0 5px #ccc;
			-moz-box-shadow: 0 0 5px #ccc;
		}
	.section > p, .section ul, .section ol, 
	.section .error, .section .notice, .section .alert { 
		list-style-type: none; margin: 0 0 20px;}
	.section > ul {
		list-style-type: disc;
		margin-left: 40px;
		}
		.section > ol { margin-bottom: 10px;}

/* Section Clearfix */

.section:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
	}
* html .section             { zoom: 1; } /* IE6 */
*:first-child+html .section { zoom: 1; } /* IE7 */

/* === Forms! === */

.form-section {
	overflow: hidden;
	margin-bottom: 20px;
	}
	.form-section label {
		display: block;
		float: left;
		}
.form-info { position: relative; cursor: help; }
	.form-info-mark {
		display: inline-block;
		background: #ddd; color: #999;
		font-size: 20px; line-height: 20px;
		text-align: center;
		height: 20px; width: 20px;
		padding: 5px; margin: 5px;
		border-radius: 20px;
			-moz-border-radius: 20px;
			-webkit-border-radius: 20px;
		}
	.form-info-content { display: none; }
	.form-info:hover .form-info-mark {
		color: #fff;
		border-radius: 0 20px 20px 0;
			-moz-border-radius: 0 20px 20px 0;
			-webkit-border-radius: 0 20px 20px 0;
		}
	.form-info:hover .form-info-content {
		position: absolute; top: -10px; right: 30px;
		display: block;
		width: 450px;
		font-size: 12px; line-height: 12px;
		padding: 4px;
		background: #ddd; color: #777;
		border-radius: 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
		}
		
/* === Header bars! === */

.header_bar {
	background: url("../images/templates/header-background-01.png") top right #1975a2;
	color:#fff;
	height: 20px;
	position: relative;
	font-size: 20px;
	padding: 10px;
	border-top: 1px solid #4ad;	border-bottom: 1px solid #28b;
	text-shadow: 1px 1px 0 #28b;
		-webkit-text-shadow: 1px 1px 0 #28b;
		-moz-text-shadow: 1px 1px 0 #28b;
	box-shadow: 1px 1px 5px #6cf inset;
		-webkit-box-shadow: 1px 1px 5px #6cf inset;
		-moz-box-shadow: 1px 1px 5px #6cf inset;
	}
	.header_bar .nav {
		position: absolute; top: 6px; right: 10px;
		padding: 1px;
		background: #17a;
		border-radius: 7px;
			-webkit-border-radius: 7px;
			-webkit-border-radius: 7px;
		box-shadow: 0 0 2px #6cf, 0 0 2px #079 inset;
		}
		.header_bar .nav .button {
			font-size: 10px;
			padding: 5px;
			margin: 2px;
			display: block;
			float: left;
			}

/* === Alerts! === */

a.close-alert {
	position: relative;
	overflow: hidden;
	font-weight: bold;
	display: inline-block;
	height: 16px; width: 16px;
	font-size: 20px;
	line-height: 16px;
	float: right;
	text-indent: -9999px;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-o-border-radius: 8px;
	border-radius: 8px;
	}
	a.close-alert:after {
		content:"\00D7";
		position: absolute; top: 0; left: 0;
		width: 16px; height: 16px;
		text-align: center;
		text-indent: 0;
		}
	.error a.close-alert { background: #b00; color: #fbb !important; }
	.notice a.close-alert { background: #0b0; color: #bfb !important; }
	.alert a.close-alert { background: #bb0; color: #ffb !important; }

/* ----------------------------------------------------------- WRAPPERS & BACKGROUNDS */

#wrapper-site {
	width: 960px; /* width of content area */
	height: 100%;
	margin: 0 auto;
	position: relative;
}

#wrapper-background {
	background: #9097FF url('../images/templates/sky-background.png') repeat-x; /* -WINTER */
	/* background: #9097FF url('../images/templates/landscape-winter-sky.png'); +WINTER */
	width: 1400px;
	margin-left: -220px;
}
#background-left {
	float: left;
	width: 220px;
}
#sun-left {
	width: 209px;
	height: 283px;
	background: #9097FF url('../images/templates/sky-sun-left2.png') no-repeat; /* -WINTER */
	float: left;
}
#background-right {
	float: right;
	width: 220px;
}
#sun-right {
	width: 220px; /* ie7 fix - match the width of sun-right to background-right */
	height: 278px;
	background: #9097FF url('../images/templates/sky-sun-right2.png') no-repeat right; /* -WINTER */ /* ie7 fix - align bg image top right */
	float: right;
}
#wrapper-page {
	margin: 0 auto;
	padding-top: 10px;
	width: 960px; /* width of content area */
}
#page {
	background: transparent url('../images/templates/page-background.png') repeat-y;
	height: 100%;
	width: 978px; /* width of background image */
	margin-left: -9px;
	position: relative;
}


/* ----------------------------------------------------------- BARS */

/* full length bar */

.bar {
	width: 960px;
	height: 50px;
	background: transparent url('../images/templates/bar-background.png') repeat-x;
	margin-left: 9px;
	position: relative;
	z-index: 100;
}
.bar-left {
	background: transparent url('../images/templates/bar-background-left.png') no-repeat;
	float: left;
	position: absolute;
	left: -20px;
	height: 50px;
	width: 50px;
}
.bar-right {
	background: transparent url('../images/templates/bar-background-right.png') no-repeat;
	float: right;
	position: absolute;
	right: -20px;
	height: 50px;
	width: 50px;
}
.bar-content {
	width: auto;
	position: relative;
}
.bar-content-left {
	float: left;
	margin-left: -11px;
	width: auto;
}
.bar-content-right {
	float: right;
	margin-right: -11px;
	width: auto;
}

/* left-capped bar */

.bar-left-capped {
	height: 50px;
	background: transparent url('../images/templates/bar-background.png') repeat-x;
	margin-left: 17px;
	position: relative;
	z-index: 100;
}
.bar-left-capped .bar-left {
	background: transparent url('../images/templates/bar-background-end-left.png') no-repeat;
	float: left;
	position: absolute;
	left: -13px;
	height: 50px;
	width: 50px;
}
.bar-left-capped .bar-right {
	background: transparent url('../images/templates/bar-background-right.png') no-repeat;
	float: right;
	position: absolute;
	right: -13px;
	height: 50px;
	width: 50px;
}
.bar-left-capped .bar-content {
	margin-left: 20px;
	width: auto;
	position: relative;
}
.bar-left-capped .bar-content-left {
	float: left;
	width: auto;
}
.bar-left-capped .bar-content-right {
	float: right;
	margin-right: -8px;
	width: auto;
}

/* right-capped bar */

.bar-right-capped {
	height: 50px;
	background: transparent url('../images/templates/bar-background.png') repeat-x;
	margin-left: -16px;
	position: relative;
	z-index: 100;
}
.bar-right-capped .bar-left {
	background: transparent url('../images/templates/bar-background-left.png') no-repeat;
	float: left;
	position: absolute;
	left: -13px;
	height: 50px;
	width: 50px;
}
.bar-right-capped .bar-right {
	background: transparent url('../images/templates/bar-background-end-right.png') no-repeat;
	float: right;
	position: absolute;
	right: -13px;
	height: 50px;
	width: 50px;
}
.bar-right-capped .bar-content {
	margin-left: 7px;
	width: auto;
	position: relative;
}
.bar-right-capped .bar-content-left {
	float: left;
	width: auto;
}
.bar-right-capped .bar-content-right {
	float: right;
	margin-right: 4px;
	width: auto;
}

.bar-240 { width: 240px; }
.bar-260 { width: 260px; }
.bar-290 { width: 290px; }
.bar-460 { width: 460px; }
.bar-640 { width: 640px; }
.bar-660 { width: 660px; }
.bar-682 { width: 682px; }
.bar-699 { width: 699px; }

.bar-divider {
	float: left;
	width:22px;
	height: 38px;
}
.bar-divider-left {
	background: transparent url('../images/templates/bar-divider-left.png') no-repeat center;
}
.bar-divider-right {
	background: transparent url('../images/templates/bar-divider-right.png') no-repeat center;
}

#wrapper-buttons {
	margin: 0 0 0 16px;
	float: left;
}

/* ----------------------------------------------------------- HEADER BAR */

a#gamestar-logo {
	text-indent: -9999px;
	float: left;
	display: block;
	height: 30px;
	width: 33px;
	background: transparent url('../images/templates/gamestar-logo.png') no-repeat;
}
a#gamestar-logo:hover {
	background-position: 0 -30px;
}

.game-button {
	text-indent: -9999px;
	float: left;
	display: block;
	height: 26px;
	margin: 2px 5px 0 0;
	background: transparent url('../images/templates/bar-menu-buttons.png') no-repeat;
	}
	#game-button-quest { width: 90px; }
		#game-button-quest:hover, #game-button-quest.active { background-position: 0 -26px; }
	#game-button-workshop { width: 131px; background-position: -90px 0; }
		#game-button-workshop:hover, #game-button-workshop.active { background-position: -90px -26px; }
	#game-button-gamealley { width: 131px; background-position: -221px 0; }
		#game-button-gamealley:hover, #game-button-gamealley.active { background-position: -221px -26px; }
	#game-button-store { width: 90px; background-position: -352px 0; }
		#game-button-store:hover, #game-button-store.active { background-position: -352px -26px; }

.menu-button {
	text-indent: -9999px;
	display: block;
	float: left;
	height: 10px;
	margin: 11px -5px 0;
}
a#menu-button-logout {
	background: transparent url('../images/templates/menu-button-logout2.png') no-repeat;
	width: 65px;
}
a#menu-button-logout:hover {background-position: 0 -11px;}
#menu-button-premium {
	background: transparent url('../images/templates/menu-button-premium2.png') no-repeat;
	width: 70px;
}
a#menu-button-premium:hover {background-position: 0 -11px;}
#menu-button-parents {
	background: transparent url('../images/templates/menu-button-parents2.png') no-repeat;
	width: 66px;
}
a#menu-button-parents:hover {background-position: 0 -11px;}
a#menu-button-help {
	background: transparent url('../images/templates/menu-button-help2.png') no-repeat;
	width: 38px;
}
a#menu-button-help:hover {background-position: 0 -11px;}

#gamestar-timer {
	margin: 0 -8px 0 -8px;
	float: left;
	width: 33px;
	height: 30px;
	text-indent: -9999px;
}
#gamestar-timer a {
	width: 33px;
	height: 30px;
	display: block;
	background: transparent url('../images/templates/gamestar-timer2.png') no-repeat;
}
#gamestar-timer a:hover {
	background-position: 0 -30px;
}

/* header login form */
/*
form#header-login-form
{
	margin: 4px 0 0 75px;
	padding: 0;
	float: left;
	width: 281px;
}
#header-login-username,
#header-login-username-clear,
#header-login-password-clear,
#header-login-password {
	margin: 1px 0 0 0;
	padding: 3px 5px;
	width: 93px;
	height: 16px;
	border: none;
	font-size: 10px;
	line-height: 13px;
	font-weight: bold;
	color: #ccc;
	background: transparent url('../images/templates/header-textarea.png') no-repeat;
}
#header-playnow-button {
	margin: 0;
	padding: 0;
	width: 75px;
	height: 23px;
	text-indent: -9999px;
	border: none;
	background: transparent url('../images/templates/button-login.png') 0 0 no-repeat;
	font-size: 0;
	line-height: 0;
	display: block;
}
#header-playnow-button:hover
{
	cursor: pointer;
	background: transparent url('../images/templates/button-login.png') 0 -23px no-repeat;
}

#header-login-username-clear {
	display: none;
}
#header-login-password-clear {
	display: none;
}
*/

/* header welcome area */

/*
#bar-welcome {
	margin: 5px 0 0 23px;
	padding: 5px 0 0 0;
	background: transparent url('../images/templates/bar-inset-background3.png') repeat-x;
	width: 180px;
	height: 20px;
	font-size: 10px;
	line-height: 10px;
	text-align: center;
	float: left;
}
#bar-welcome a {
	font-weight: bold;
	color: #3295c6;
}
#bar-welcome a:hover {
	color: #65ccff;
}
*/

/* ----------------------------------------------------------- CONTENT BARS */

.title-button {
	text-indent: -9999px;
	float: left;
	display: block;
	height: 28px;
	margin: 2px 0 0 0;
}
#title-button-publishedgames {
	width: 226px;
	background: transparent url('../images/templates/title-publishedgames.png') no-repeat;
}
#title-button-featuredgames {
	width: 219px;
	background: transparent url('../images/templates/title-featuredgames.png') no-repeat;
}
#title-button-newgames {
	width: 164px;
	background: transparent url('../images/templates/title-newgames.png') no-repeat;
}
#title-button-topgames {
	width: 227px;
	background: transparent url('../images/templates/title-topratedgames.png') no-repeat;
}
#title-button-populargames {
	width: 244px;
	background: transparent url('../images/templates/game/title-populargames.png') no-repeat;
}
#title-button-featuredchallenge {
	width: 266px;
	background: transparent url('../images/templates/title-featuredchallenge.png') no-repeat;
}
#title-button-challengewinners {
	width: 258px;
	background: transparent url('../images/templates/title-challengewinners.png') no-repeat;
}
#title-button-moregames {
	width: 174px;
	background: transparent url('../images/templates/title-moregames.png') no-repeat;
}
#title-button-ratethegame {
	width: 200px;
	background: transparent url('../images/templates/title-ratethegame.png') no-repeat;
}
#title-button-ratethegame {
	width: 200px;
	background: transparent url('../images/templates/title-ratethegame.png') no-repeat;
}
#title-button-commentguidelines {
	width: 265px;
	background: transparent url('../images/templates/title-commentguidelines.png') no-repeat;
}
#title-button-comments {
	width: 156px;
	background: transparent url('../images/templates/title-comments.png') no-repeat;
}
#title-button-searchresults {
	width: 211px;
	background: transparent url('../images/templates/title-searchresults.png') no-repeat;
}

/* ----------------------------------------------------------- CONTENT */

#content {
	margin: -11px auto 0;
	width: 942px;
	color: #333;
	min-height: 450px;
	padding-bottom: 100px;
}

#content .bar {
	margin-left: -9px;
}

a, a:visited { color: #3295c6; }
	a:hover { color: #65ccff; }

/* ----------------------------------------------------------- GAME CARDS */

.gamecard-actions .gamecard-actions-left {
	float: left;
	width: 60px;
}
a.gamecard-draft-edit {
	margin-left: 10px;
	text-indent: -9999px;
	float: left;
	display: block;
	width: 45px;
	height: 22px;
	background: transparent url('../images/templates/button-edit.png') no-repeat;
}
a.gamecard-draft-edit:hover {
	background-position: 0 -22px;
}
.gamecard-actions .gamecard-actions-right {
	float: right;
	width: 60px;
}
#content .gamecard-actions .gamecard-actions-right a {
	display: block;
	margin: 5px 10px 0 0;
	color: #FF0000;
	font-size: 12px;
	font-weight: bold;
}

.gamecard-actions .gamecard-actions-left-premium {
	float: left;
	width: 85px;
	height: 22px;
	color: #fff;
}
#content .gamecard-actions .gamecard-actions-left-premium a {
	color: #fff;
}
a.gamecard-draft-edit-premium {
	padding-top: 5px;
	display: block;
	float: left;
	width: 40px;
	height: 17px;
	color: #fff;
	text-align: center;
	background-color: #3295c6;
	border: none;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
a.gamecard-draft-edit-premium:hover {
	cursor: pointer;	
	background-color: #65ccff;
}
a.gamecard-draft-stats-premium {
	margin-left: 5px;
	padding-top: 5px;
	display: block;
	float: right;
	width: 40px;
	height: 17px;
	color: #fff;
	text-align: center;
	background-color: #3295c6;
	border: none;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
a.gamecard-draft-stats-premium:hover {
	cursor: pointer;	
	background-color: #65ccff;
}
.gamecard-actions .gamecard-actions-right-premium {
	float: right;
	width: 45px;
	height: 22px;
}
#content .gamecard-actions .gamecard-actions-right-premium a {
	display: block;
	margin: 5px 0 0 0;
	color: #FF0000;
	font-size: 10px;
	font-weight: bold;
	text-align: right;
}

/* Gamecard display wrappers */

.page_outer{
	position: relative;
	overflow: hidden;
	padding: 10px 0 0 10px;
	background: #c3bba4;
	box-shadow: 0 0 3px #666 inset;
	}
	.page_outer #ajax_loader_bar {
		position: absolute; top: 60px; margin: 0 auto;
		z-index: 200;
		}
		
/* === Generic gamecard styles === */

.gamecard {
	position: relative;
	border: 1px solid #666;
	background-color: #fff;
	color: #666;
	float: left;
	font-size: 10px;
	overflow: hidden;
	margin: 0 10px 10px 0;
	border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
	box-shadow: 0 0 3px rgba(0,0,0,0.3);
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.5);
		-moz-box-shadow: 0 0 3px rgba(0,0,0,0.5);
	}
	.gamecard-info{
		position: absolute; top:0;
		background: #f9eece url('../images/templates/game/gametile_bkg.png') top left repeat-x;
		padding: 3px 5px 5px;
		width: 211px;
		text-shadow: 1px 1px 0 rgba(255,255,255,0.5);
			-moz-text-shadow: 1px 1px 0 rgba(255,255,255,0.5);
			-webkit-text-shadow: 1px 1px 0 rgba(255,255,255,0.5);
		box-shadow: 0 0 3px rgba(0,0,0,0.5);
			-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.5);
			-moz-box-shadow: 0 0 3px rgba(0,0,0,0.5);
		border-radius: 5px 5px 0 0;
			-moz-border-radius: 5px 5px 0 0;
			-webkit-border-radius: 5px 5px 0 0;
		}
		.gamecard h3 {
			float: left;
			display: block;
			clear: both;
			font-size: 14px;
			width: 200px;
			margin-bottom: 2px;
			}
		.gamecard .gamecard-owner {
			float: left;
			clear: both;
			}
			.gamecard .mechanic-name {
				font-size: 12px;
				font-weight: bold;
				}
	.gamecard-meta {
		position: absolute; top: 150px;
		background: #f9eece;
		padding: 2px 1px 5px;
		width: 100%;
		text-align: center;
		box-shadow: 0 0 3px rgba(0,0,0,0.5);
			-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.5);
			-moz-box-shadow: 0 0 3px rgba(0,0,0,0.5);
		}
		.gamecard-ratings {
			width: 150px;
			margin: 0 auto;
			}
		.gamecard-fun, .gamecard-difficulty {
			width: 65px;
			float: left;
			}
		.gamecard-ratings span {
			margin: 1px 0 3px;
			display: block;
			font-weight: bold;
			}
		.gamecard-fun { margin-right: 10px; }
		.gamecard-stats { clear: both; }
		.gamecard-time { margin-top: 3px; font-style: italic; color: #999; }
		
.gamecard:hover .gamecard-meta {top: auto; bottom: 0;}
.gamecard-badges { position: absolute; top: 1px; right: 1px; z-index: 200; }

/* === Specific gamecard styles === */

.gamecard-big { width: 454px; height: 344px; }
	.gamecard-big .gamecard-info { width: 444px; }
	.gamecard-big h3 { font-size: 22px; width: 420px; }
	.gamecard-big .gamecard-owner { font-size: 12px;}
	.gamecard-big .mechanic-name { font-size: 16px;}
	.gamecard-big .gamecard-badges { top: 7px; right: 5px; }
	.gamecard-big .thumb {
		width: 454px;
		height: 344px;
		}
	.gamecard-big .gamecard-meta { top: 302px; }
.gamecard-small { width: 221px; height: 166px; }
	.gamecard-small .thumb {
		width: 221px;
		height: 166px;
		}
.gamecard-featured {}
	.gamecard-featured .gamecard-info {
		background: url("../images/templates/premium/premium-button-large.png") repeat-x scroll left top #F9CF4C;
		box-shadow: 0 0 2px #ff0 inset, 0 0 3px rgba(0,0,0,0.5);
			-moz-box-shadow: 0 0 2px #ff0 inset, 0 0 3px rgba(0,0,0,0.5);
			-webkit-box-shadow: 0 0 2px #ff0 inset, 0 0 3px rgba(0,0,0,0.5);
		}
	.gamecard-featured .gamecard-meta {
		background: #F9CF4C;
		}
		.gamecard-featured .gamecard-time { color: #b98f0c; }
	.gamecard-featured a {
		color: #fff !important;
		text-shadow: 1px 1px 0 #c80;
			-moz-text-shadow: 1px 1px 0 #c80;
			-webkit-text-shadow: 1px 1px 0 #c80;
		}
.gamecard-small-showcase-info {
	width: 141px;
	float: right;
	padding: 5px;
	text-align: center;
	}
	.gamecard-small-showcase-info .gamecard-stats {
		margin-top: 3px;
		}
	.gamecard-small-showcase-info .button {
		font-size: 14px;
		padding: 5px;
		margin-top: 20px;
		}
.gamecard-copy {
	position: absolute; bottom: 0;
	margin: 0 auto;
	text-align: center;
	padding: 5px 0;
	width: 100%;
	background: #f9eece;
	box-shadow: 0 0 3px rgba(0,0,0,0.5);
		-webkit-box-shadow: 0 0 3px rgba(0,0,0,0.5);
		-moz-box-shadow: 0 0 3px rgba(0,0,0,0.5);
	}
	.gamecard-copy .button {
		font-size: 12px;
		padding: 3px 0;
		width: 100px;
		}
.challengecard {
	float: left;
	margin: 0 10px 10px 0;
	width: 221px;
	text-align: center;
	background: #f9eece;
	}
	.challengecard h3 {
		width: 211px; height: 28px;
		display: block;
		padding: 0 5px 5px;
		}
		.challengecard .thumb {
			display: block;
			margin: 10px;
			}
	.challenge-status {
		display: block;
		padding: 5px;
		font-weight: bold;
		font-size: 14px;
		height: 14px;
		overflow: hidden;
		margin: 0 10px;
		border: 1px solid #999;
		border-radius: 5px;
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
		}
		.challenge-status.enter			{ background: #f82; color: #b00; }
		.challenge-status.ready 		{ background: #6f6; color: #191; }
		.challenge-status.notready		{ background: #ff6; color: #aa1; }
		.challenge-status.complete		{ background: #6cf; color: #17a; }
		.challenge-status.uncompleted	{ background: #fcc; color: #b66; }
		.challenge-status.closed		{ background: #eee; color: #999; }
		.challenge-status.pending		{ background: #fff; color: #ccc; }
	.challenge-date {
		display: block;
		font-size: 13px;
		padding: 5px;
		color: #999;
		font-style: italic; font-weight: bold;
		overflow: hidden;
		}
.usercard {
	width: 454px; height: 166px;
	background: #fffaeb;
	}
	.usercard-owner { width: 212px; padding: 10px; float: left; }
		.usercard-owner .mechanic-name {
			font-size: 18px;
			display: block;
			}
		.usercard-owner .mechanic-level {
			font-weight: bold;
			font-size: 14px;
			color: #999;
			}
		.usercard-owner .button {
			display: block;
			text-align: center;
			margin-top: 20px;
			font-size: 14px;
			padding: 5px;
			}
	.no-showcase-game {
		width: 221px; height: 166px;
		float: right;
		border-left: 1px solid #c3bba4;
		}
	.usercard .gamecard {
		margin: -1px -1px 0 0;
		float: right;
		box-shadow: none;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
		}
	
/* === Directory Pages: Pagination & Back buttons === */

.pagination {
	padding: 5px 10px;
	font-weight: bold;
	color: #999;
	background-color: #ddd;
	overflow: hidden;
	text-shadow: 1px 1px 0 #e9e9e9;
		-webkit-text-shadow: 1px 1px 0 #e9e9e9;
		-moz-text-shadow: 1px 1px 0 #e9e9e9;
	}
	.pagination h3 { float: left; font-size: 18px; }
	.pagination .nav {
		display: block;
		float: right;
		text-align: right;
		}
		.pagination .nav li {
			display: inline-block;
			margin-right: 5px;
			}
			.pagination .button {
				font-size: 12px;
				padding: 3px 5px;
				}
#go_back {
	text-align: center;
	padding: 10px;
	background: #fffaeb;
	border-bottom: 1px solid #c3bba4;
	border-top: 1px solid #c3bba4;
	}

/* comments page gamecard */

.gamecard-commentspage {
	margin: 10px 0 0 10px;
	padding: 0;
	width: 466px;
	height: 165px;
}
.gamecard-commentspage-left {
	float: left;
	width: 208px; /* thumbail width + image padding and border */
}
.gamecard-commentspage-left img {
	padding: 3px;
	width: 200px;
	height: 150px;
	background-color: #FFF;
	border: 1px solid #7c7767;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
.gamecard-commentspage-right {
	float: right;
	width: 248px;
	font-size: 10px;
	font-weight: bold;
}
.gamecard-commentspage-right .gamecard-ratings {
	margin: 0;
	padding: 0;
}
.gamecard-commentspage-right .gamecard-stats {
	margin: 8px 0;
	font-size: 10px;
	font-weight: bold;
}
.gamecard-commentspage-right .gamecard-stats strong {
	font-size: 12px;
}
.gamecard-commentspage-right .gamecard-owner {
	margin: 0;
	padding: 0;
	text-align: left;
	height: 49px;
}
.gamecard-commentspage-right .gameplayer-designedby-title {
	margin: 0 0 0 8px;
	text-indent: -9999px;
	width: 118px;
	height: 13px;
	background: transparent url('../images/templates/title-designedby.png') no-repeat;
}
.gamecard-commentspage-right .gameplayer-designedby-owner {
	margin: 3px 0 0 0;
	padding: 0;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	line-height: 15px;
	text-align: center;
}
.gamecard-commentspage-right .gameplayer-designedby-owner a {
	color: #fff;
}

/* ----------------------------------------------------------- FOOTER & LANDSCAPE */

#footer {
	position: relative;
	background: #eee; color: #999;
	border-top: 1px solid #c3bba4;
	padding: 20px;
	text-align: center;
	}
	#footer-nav {
		width: 900px;
		margin: 0 auto 20px;
		padding: 20px;
		background: #ddd;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
		}
		#footer-nav li {display: inline; margin: 0 20px 0 0; }
	.footer-logo {
		display: inline-block;
		text-indent: -9999px;
		vertical-align: middle;
		margin: 0 10px;
		}
	#logo-eline {
		width: 147px; height: 64px;
		background: transparent url('../images/templates/home/logo-eline.png') 0 0 no-repeat;
		}
	#logo-iop {
		width: 122px; height: 72px;
		background: transparent url('../images/templates/home/logo-iop.png') 0 0 no-repeat;
		}
	#logo-macarthur {
		width: 193px; height: 20px;
		background: transparent url('../images/templates/home/logo-macarthur.png') 0 0 no-repeat;
		}
	#footer:before {
		content: "";
		width: 100%; height: 80px;
		min-width: 980px;
		position: absolute; bottom: 100%; left: 0;
		background: transparent url('../images/templates/theme/footer.png') center bottom no-repeat;
		}
#seriousplay-certified {
	display: block;
	width: 33px;
	height: 40px;
	background-image: url('../images/templates/seriousplay-certified.png');
	float: right;
	margin: 2px 10px;
}

/* ----------------------------------------------------------- GAME ALLEY */

#first-div-after-header {
	margin-top: -30px;
}
#header-gamealley-search {
	margin: 0;
	padding: 3px;
	width: 244px;
	height: 56px;
	background-color: #c3bba4;
	border: none;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#header-gamealley-search-header {
	margin: 0;
	padding: 0;
}
#header-gamealley-search-title {
	margin: -3px 10px 0 5px;
	padding: 0;
	text-indent: -9999px;
	width: 93px;
	height: 19px;
	background: transparent url('../images/templates/search-title.png') no-repeat;
	float: left;
}
#header-gamealley-search-tabs {
	margin: 1px 0 0 0;
	padding: 0;
	float: right;
	width: 130px;
	height: 13px;
}
#header-gamealley-search-tabs .header-gamealley-search-tab {
	margin: 0;
	padding: 0;
	height: 13px;
	float: left;
}
#header-gamealley-search-games,
#header-gamealley-search-users {
	margin: 0;
	padding: 0;
	width: 13px;
	height: 13px;
	vertical-align: top;
}
#header-gamealley-search-tabs span {
	margin: 0;
	padding: 0 10px 0 4px;
	font-size: 10px;
	line-height: 10px;
	font-weight: bold;
	color: #fff;
	vertical-align: top;
}
#header-gamealley-findit {
	margin: 3px auto;
	padding: 0;
	width: 240px;
	height: 20px;
}
#header-gamealley-findit .left,
#header-gamealley-findit .right {
	margin: 0;
	padding: 0;
	height: 20px;
}
#findit-searchfor {
	margin: 0;
	padding: 1px 0 0 1px;
	width: 164px;
	height: 17px;
	border: 1px solid #fff;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-bottomleft: 5px;
	-webkit-border-radius-topleft: 5px;
	-webkit-border-radius-bottomleft: 5px;
	position: absolute;
}
#findit-form-button
{
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	width: 73px;
	height: 20px;
	border: none;
	background: transparent url('../images/templates/search-button-findit.png') 0 0 no-repeat;
	font-size: 0;
	line-height: 0;
	display: block;
}
#findit-form-button:hover
{
	cursor: pointer;
	background: transparent url('../images/templates/search-button-findit.png') 0 -20px no-repeat;
}
#header-gamealley-advancedsearch {
	margin: 0;
	padding: 0;
	font-size: 12px;
	font-weight: bold;
	color: #fff;
	text-align: right;
}
#header-gamealley-advancedsearch a,
#header-gamealley-advancedsearch a:hover {
	color: #fff;
}

#featured {
	margin-top: -30px;
}
#featured #featured-left {
	float: left;
	width: 460px;
}
#featured #featured-right {
	float: right;
	width: 460px;
}
/*
#featured #featured-right .content-area {
	padding: 0 10px 10px 10px;
	font-size: 12px;
	line-height: 15px;
}
#featured #featured-right .content-area div {
	margin-bottom: 15px;
}
*/
#favorite-games .content-area {
	padding: 0 10px 10px 10px;
	font-size: 12px;
	line-height: 15px;
}
#favorite-games .content-area div {
	margin-bottom: 15px;
}
#published-games .content-area {
	padding: 0 10px 10px 10px;
	font-size: 12px;
	line-height: 15px;
}
#published-games .content-area div {
	margin-bottom: 15px;
}

#featured #featured-right
{
	margin: 0;
	padding: 0;
}
/*
#featured #featured-right #featured-challenge-outer
{
	margin: 0;
	padding: 0;
	height: 572px;
	background: transparent url('../images/templates/challenge-acheron.png') no-repeat top right;
}
#featured #featured-right #featured-challenge
{
	margin: 0;
	padding: 0;
	width: 220px;
	font-size: 14px;
	line-height: 16px;
}
#featured #featured-right #featured-challenge h2
{
	margin: 0 0 10px 0;
	padding: 0;
	font-size: 24px;
	line-height: 28px;
	font-weight: bold;
}
#featured #featured-right #featured-challenge #featured-challenge-logo
{
	margin: 0 auto 10px auto;
	width: 106px;
	height: 78px;
	background: transparent url('../images/templates/challenge-scholasticaward.png') no-repeat;
	text-align: center;
}
#featured #featured-right #featured-challenge #featured-challenge-logo a
{
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	display: block;
	width: 106px;
	height: 78px;
}
#featured #featured-right #featured-challenge div
{
	margin: 0 0 20px 0;
	padding: 0;
}
#featured #featured-right #featured-challenge #featured-challenge-see-all
{
	font-size: 18px;
	line-height: 18px;
	font-weight: bold;
}
*/

/* ----------------------------------------------------------- HOME PAGE */

#title-button-gsm {
	text-indent: -9999px;
	float: left;
	display: block;
	width: 271px;
	height: 29px;
	margin: 1px 0 0 0;
	background: transparent url('../images/templates/gamestar-title.png') no-repeat;
}
#title-button-gsm a {
	width: 271px;
	height: 29px;
	display: block;
}
#home-row-left {
	text-indent: -9999px;
	float: left;
	width: 671px;
	height: 436px;
	background: transparent url('../images/templates/splash-home.png') no-repeat;
}
#home-row-right {
	margin-right: 10px;
	float: right;
	width: 251px;
	height: 436px;
}
a#home-playnow {
	margin-top: 10px;
	text-indent: -9999px;
	display: block;
	width: 251px;
	height: 71px;
	background: transparent url('../images/templates/button-playnow.png') no-repeat;
}
a#home-playnow:hover { background-position: 0 -71px; }
#home-blurb {
	margin-top: 10px;
	text-indent: -9999px;
	width: 251px;
	height: 179px;
	background: transparent url('../images/templates/blurb.png') no-repeat;
}
#home-screenshot {
	margin-top: 10px;
	text-indent: -9999px;
	width: 251px;
	height: 155px;
	background: transparent url('../images/templates/screenshot.png') no-repeat;
}


.content-area-ge {
	margin: 0;
	padding: 0;
	font-size: 12px;
	line-height: 15px;
}
.content-area-ge h1 {
	margin: 0 0 15px 0;
	padding: 0;
	font-size: 24px;
	font-weight: bold;
}
.content-area-ge div {
	margin: 0 20px 10px 20px;
	padding: 0;
}
.content-area-ge ul {
	margin-bottom: 15px;
}
.content-area-ge li {
	margin-left: 50px;
	list-style: square;
}

#home-banner-onlinelearning {
	display: block;
	width: 942px; height: 150px;
	border-bottom: 1px solid #333;
	text-indent: -9999px;
	background: transparent url('../images/templates/home/banner-onlinelearning.png') no-repeat;
	}

/* ----------------------------------------------------------- SWE */

.content-area-swe #content_left
{
	float: left;
	width: 471px;
}
.content-area-swe #content_right
{
	float: right;
	width: 441px;
	height: 388px;
}

textarea.wide
{
	width: 916px;
}
textarea.tall
{
	height: 311px;
}
textarea.short
{
	height: 131px;
}

#frag-become-a-member {
	text-indent: -9999px;
	width: 441px;
	height: 354px;
	background: transparent url('../images/templates/splash_login.jpg') no-repeat;
}

#session-loaded {
	margin: 0;
	padding: 8px 0;
	font-size: 18px;
	text-align: center;
}
#maintenance-mode {
	margin: 0;
	padding: 8px 0;
	font-size: 18px;
	text-align: center;
}

.coming-soon {
	margin: 0 10px 10px 10px;
	padding: 0;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
}

#editor {
	margin: 0 0 20px 0;
	padding: 0;
	width: 942px;
}


#challenge-button-big
{
	margin-left: 5px;
	text-indent: -9999px;
	width: 273px;
	height: 230px;
	background: transparent url('../images/challenges/scholastic.png') no-repeat;
}
#challenge-button-big:hover
{
	background-position: 0 -230px;
}
#challenge-button-big a
{
	width: 273px;
	height: 230px;
	display: block;
}




.rating_image_large
{
	margin: 0 2px;
}
.rating_image_medium
{
	margin: 0 1px 0 0;
}
.rating_image_small
{
	margin: 0 1px 0 0;
	display: inline;
}

.no-results img
{
	padding: 3px;
	background-color: #FFF;
	border: 1px solid #7c7767;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

#title-button-beta
{
	float: left;
	background: transparent url('../images/templates/home/beta-badge.png') no-repeat;
	text-indent: -9999px;
	width: 36px;
	height: 36px;
	margin: 0 -10px 0 -20px;
	padding: 0;
}

.page_container{
	float:left;
}
.page_games{
	position:relative;
}

/* LOCKED USERS */
.locked
{
	color: #666;
}
.locked-icon
{
	display: inline-block;
	width: 11px;
	height: 14px;
	background: url('../images/templates/game/usericon-locked.png') top left no-repeat;
}

/* Prepopulated text in forms */
.defaultTextActive { color: #a1a1a1; font-style: italic; }

/* FONTS */


@font-face {
    font-family: 'Ubuntu';
    src: url('../fonts/ubuntu/Ubuntu-Regular-webfont.eot');
    src: url('../fonts/ubuntu/Ubuntu-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ubuntu/Ubuntu-Regular-webfont.woff') format('woff'),
         url('../fonts/ubuntu/Ubuntu-Regular-webfont.ttf') format('truetype'),
         url('../fonts/ubuntu/Ubuntu-Regular-webfont.svg#UbuntuRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'Ubuntu';
    src: url('../fonts/ubuntu/Ubuntu-Italic-webfont.eot');
    src: url('../fonts/ubuntu/Ubuntu-Italic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ubuntu/Ubuntu-Italic-webfont.woff') format('woff'),
         url('../fonts/ubuntu/Ubuntu-Italic-webfont.ttf') format('truetype'),
         url('../fonts/ubuntu/Ubuntu-Italic-webfont.svg#UbuntuItalic') format('svg');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'Ubuntu';
    src: url('../fonts/ubuntu/Ubuntu-Bold-webfont.eot');
    src: url('../fonts/ubuntu/Ubuntu-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ubuntu/Ubuntu-Bold-webfont.woff') format('woff'),
         url('../fonts/ubuntu/Ubuntu-Bold-webfont.ttf') format('truetype'),
         url('../fonts/ubuntu/Ubuntu-Bold-webfont.svg#UbuntuBold') format('svg');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'Ubuntu';
    src: url('../fonts/ubuntu/Ubuntu-BoldItalic-webfont.eot');
    src: url('../fonts/ubuntu/Ubuntu-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/ubuntu/Ubuntu-BoldItalic-webfont.woff') format('woff'),
         url('../fonts/ubuntu/Ubuntu-BoldItalic-webfont.ttf') format('truetype'),
         url('../fonts/ubuntu/Ubuntu-BoldItalic-webfont.svg#UbuntuBoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;

}

#lobby-wrapper { font-family: 'Arial', 'Verdana', sans-serif; }

/* ----------------------------------------------------------- LOBBY */
#lobby-wrapper { overflow: hidden; }
	#lobby-wrapper .section { 
		-webkit-border-radius: 3px; 
		-moz-border-radius: 3px; 
		-o-border-radius: 3px; 
		border-radius: 3px;
		}
	#lobby-wrapper h2 { 
		padding: 5px; 
		font-size: 16px; 
		margin-bottom: 0; 
		-webkit-border-radius: 3px 3px 0 0; 
		-moz-border-radius: 3px 3px 0 0;
		-o-border-radius: 3px 3px 0 0;
		border-radius: 3px 3px 0 0;
		}
	#lobby-news-and-messages { width: 512px; float: left; padding-left: 10px; }
		#lobby-news, #lobby-messages #mechanic-messages { 
			position: relative;
			margin: 0 0 12px;
			background: #45a7d7 url('../images/templates/lobby/news-frame.png') 0 0 repeat-x;
			border: 1px solid #333;
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			-o-border-radius: 3px;
			border-radius: 3px;
			-webkit-box-shadow: 0 0 2px #fff inset;
			-moz-box-shadow: 0 0 2px #fff inset;
			-o-box-shadow: 0 0 2px #fff inset;
			box-shadow: 0 0 2px #fff inset;
			}
		#lobby-news { height: 313px; }
			#lobby-news-and-messages h2, #lobby-news-and-messages h3 { 
				margin: 8px 8px 0;
				padding: 0;
				color: #fff;
				text-shadow: 1px 1px 0 rgba(0,0,0,0.2);
				}
			#lobby-news-list {
				height: 271px;
				overflow: auto;
				margin: 8px;
				font-size: 12px;
				background: #fff;
				border: 1px solid #333;
				-webkit-border-radius: 3px;
				-moz-border-radius: 3px;
				-o-border-radius: 3px;
				border-radius: 3px;
				-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset, 0 0 2px #fff;
				-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset, 0 0 2px #fff;
				-o-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset, 0 0 2px #fff;
				box-shadow: 0 0 10px rgba(0,0,0,0.5) inset, 0 0 2px #fff;
				}
				#lobby-news-list a { font-weight: bold; }
				.lobby-news-item { padding: 5px; overflow: hidden; position: relative; }
					.lobby-news-item .news-icon { width: 40px; height: 40px; float: left; background: url('../images/templates/lobby/news-icons.png') 9999px 9999px no-repeat; }
						.news-comment .news-icon { background-position: 0 center; }
						.news-review .news-icon { background-position: -40px center; }
						.news-new-game .news-icon { background-position: -80px center; }
						.news-edit-game .news-icon { background-position: -120px center; }
						.news-newsitem .news-icon { background-position: -160px center; }
						.news-fav .news-icon { background-position: -200px center; }
						.news-rank .news-icon { background-position: -240px center; }
						.news-follow .news-icon { background-position: -280px center; }
						.news-recommend .news-icon { background-position: -320px center; }
						.news-badge .news-icon { background-position: center center; }
						.lobby-news-item .news-text { margin-left: 40px; padding: 6px; }
							.lobby-news-item .date {
								font-size: 11px;
								font-style: italic;
								color: #888;
								display: block;
								}
					.lobby-news-item.from-class:after {
						content: "";
						position: absolute; top: 0px; right: 0px;
						width: 21px; height: 20px;
						line-height: 20px;
						background: transparent url('../images/templates/lobby/news-label-class.png') 0 0 no-repeat;
						-webkit-transition-property: width;
						-moz-transition-property: width;
						-o-transition-property: width;
						transition-property: width;
						-webkit-transition-duration: 0.3s;
						-moz-transition-duration: 0.3s;
						-o-transition-duration: 0.3s;
						transition-duration: 0.3s;
						-webkit-transition-timing-function: ease;
						-moz-transition-timing-function: ease;
						-o-transition-timing-function: ease;
						transition-timing-function: ease;
						}
					.lobby-news-item.from-class:hover:after { width: 100px; }
				.lobby-news-item:nth-child(even) { background-color: rgba(100, 200, 255, 0.15); }
				.lobby-news-item.sticky { background: rgba(255, 255, 50, 0.3) !important; }
				.lobby-news-item.me { text-align: right; }
					.lobby-news-item.me .news-icon { float: right; }
					.lobby-news-item.me .news-text { margin-right: 40px; }
			#lobby-news-list::-webkit-scrollbar,
			#lobby-messages #message-header::-webkit-scrollbar,
			#lobby-messages #message-body::-webkit-scrollbar { width: 5px; height: 5px; }
			#lobby-news-list::-webkit-scrollbar-thumb,
			#lobby-messages #message-header::-webkit-scrollbar-thumb,
			#lobby-messages #message-body::-webkit-scrollbar-thumb { -webkit-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0; background: #3295c6; }
			#lobby-news-list::-webkit-scrollbar-track,
			#lobby-messages #message-header::-webkit-scrollbar-track,
			#lobby-messages #message-body::-webkit-scrollbar-track { -webkit-border-radius: 0 3px 3px 0; border-radius: 0 3px 3px 0; background: rgba(50,149,198,0.3); border-left: 1px solid rgba(50,149,198,0.5); }
			#lobby-news-list::-webkit-scrollbar-track:hover,
			#lobby-messages #message-header::-webkit-scrollbar-track:hover,
			#lobby-messages #message-body::-webkit-scrollbar-track:hover { background: rgba(0,99,148,0.3); border-left: 1px solid rgba(0,99,148,0.5); }
		#lobby-messages { height: 240px; }
			#mechanic-messages { height: 237px; }
			#lobby-messages .nav { position: absolute; top: 5px; right: 8px; }
				#lobby-messages .nav .button { font-size: 12px; padding: 4px; } 
			#lobby-messages #workshop-messages-form table {
				font-size: 12px;
				width: 493px;
				margin: 8px 8px 4px;
				padding: 10px;
				background: #fff;
				border: 1px solid #333;
				-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset, 0 0 2px #fff;
				-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset, 0 0 2px #fff;
				-o-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset, 0 0 2px #fff;
				box-shadow: 0 0 10px rgba(0,0,0,0.5) inset, 0 0 2px #fff;
				}
				#lobby-messages #workshop-messages-form table thead { font-weight: bold; background: rgba(0,99,148,0.3); }
				#lobby-messages  .message:nth-child(odd) { background-color: rgba(100, 200, 255, 0.15); }
				#lobby-messages #workshop-messages-form table td { padding: 3px; height: 13px; }
				#lobby-messages .message-unread { font-weight: bold;  background: rgba(255, 255, 50, 0.3) !important; }
			#lobby-messages #message-actions { margin-left: 5px; text-align: center; }
				#lobby-messages #message-actions .button { font-size: 12px; height: 20px; }
			#lobby-messages #message-header, #lobby-messages #message-body { 
				font-size: 12px;
				margin: 4px 8px 4px;
				padding: 10px;
				background: #fff;
				border: 1px solid #333;
				-webkit-border-radius: 3px;
				-moz-border-radius: 3px;
				-o-border-radius: 3px;
				border-radius: 3px;
				-webkit-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset;
				-moz-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset;
				-o-box-shadow: 0 0 10px rgba(0,0,0,0.5) inset;
				box-shadow: 0 0 10px rgba(0,0,0,0.5) inset;
				}
				#lobby-messages #message-header { height: 34px; margin-top: 8px; font-weight: bold; padding: 0; overflow: auto; }
					#lobby-messages #message-header td { padding: 3px 10px; }
				#lobby-messages #message-body { height: 115px; overflow: auto; }
#lobby-header {
	background: url("../images/banner-blank.jpg") no-repeat scroll 0 0 transparent;
	border-bottom: 1px solid #333333;
	height: 61px;
	overflow: hidden;
	text-align: center;
	margin-bottom: 10px;
	}
	#lobby-header h1 {
		color: #FFFFFF;
		font-size: 26px;
		margin: 16px 0 0 !important;
		text-shadow: -1px -1px 0 #1874A1, 1px 1px 0 #66CCFF;
		}
		#lobby-header .username { color: #f9cf4c; }
#lobby-tiles { width: 410px; float: right; }
	.lobby-tile-wrapper { margin-bottom: 10px; overflow: hidden; }
		a.lobby-tile { height: 180px; display: block; margin: 0; }
			#lobby-quest a.lobby-tile { background: url("../images/templates/lobby/lobby-tile-quest.png") no-repeat scroll 0 0 transparent; }
			#lobby-workshop a.lobby-tile { background: url("../images/templates/lobby/lobby-tile-workshop.png") no-repeat scroll 0 0 transparent; }
			#lobby-gamealley a.lobby-tile { background: url("../images/templates/lobby/lobby-tile-gamealley.png") no-repeat scroll 0 0 transparent; }
			a.lobby-tile:hover { background-position: 0 -180px !important; }
			.lobby-tile-blurb {
				font-size: 14px;
				line-height: 16px;
				margin: 10px;
				-webkit-text-shadow: 1px 1px 0 rgba(255,255,255,0.5);
				-moz-text-shadow: 1px 1px 0 rgba(255,255,255,0.5);
				-o-text-shadow: 1px 1px 0 rgba(255,255,255,0.5);
				text-shadow: 1px 1px 0 rgba(255,255,255,0.5);
				}
.lobby-news
{
	color: #fff;
	font-weight: bold;
	display: block;
	height: 20px;
	margin: -27px 10px 10px;
	font-size: 16px;
	text-align: center;
	overflow: hidden;
	-webkit-text-shadow: 1px 1px 0 #1874a1;
	-moz-text-shadow: 1px 1px 0 #1874a1;
	text-shadow: 1px 1px 0 #1874a1;
}
.lobby-news .hilight
{
	color: #f9cf4c;
}

.smallcaps
{
	font-size: 0.9em;
	text-transform: uppercase;
	font-weight: bold;
}

#lobby-promo-amd
{
	display: block;
	height: 64px;
	width: 922px;
	margin: 10px 10px 30px;
	text-indent: -9999px;
	background: transparent url('../images/templates/lobby/lobby-promo-amd.png');
	float: left;
}

#lobby-banner-holiday-sprite-pack {
	display: block;
	background: url("../images/templates/lobby/lobby-banner-holiday-sprite-pack.jpg");
	height: 100px;
	border-top: 1px solid #333; border-bottom: 1px solid #333;
	}
#lobby-banner-holiday-sprite-pack-premium {
	display: block;
	background: url("../images/templates/lobby/lobby-banner-holiday-sprite-pack-premium.jpg");
	height: 100px;
	border-top: 1px solid #333; border-bottom: 1px solid #333;
	}
#lobby-banner-teacher-projects {
	display: block;
	background: url("../images/templates/lobby/lobby-banner-teacher-projects.jpg");
	height: 100px;
	border-top: 1px solid #333; border-bottom: 1px solid #333;
	}
#lobby-banner-teacher-projects-upgrade {
	display: block;
	background: url("../images/templates/lobby/lobby-banner-teacher-projects-upgrade.jpg");
	height: 100px;
	border-top: 1px solid #333; border-bottom: 1px solid #333;
	}

#lobby-banner-onlinelearning-teacher {
	display: block;
	background: url("../images/templates/lobby/lobby-banner-onlinelearning-teacher.png");
	height: 64px;
	width: 922px;
	margin: 10px;
	text-indent: -9999px;;
	}
#lobby-banner-onlinelearning-student {
	display: block;
	background: url("../images/templates/lobby/lobby-banner-onlinelearning-student.png");
	height: 64px;
	width: 922px;
	margin: 10px;
	text-indent: -9999px;;
	}
.lobby-banner-onlinelearning-enter {
	position: relative;
	display: block;
	background: url("../images/templates/lobby/lobby-banner-onlinelearning-enter.png");
	height: 64px; width: 922px;
	margin: 10px;
	}
	#lobby-banner-onlinelearning-summer {
		background: url("../images/templates/lobby/lobby-banner-onlinelearning-summer.png");
		}
	
#ol-instructor-dash-links { margin-bottom: 30px; }
	.ol-instructor-dash-link {
		padding: 5px;
		text-align: center;
		margin: 10px;
		background: #6a6;
		}
		.ol-instructor-dash-link a {
			color: #ff9 !important;
			text-decoration: underline;
			}
		.ol-instructor-dash-link a:hover {
			color: #fff !important;
			}

/* === Edmodo names === */
.edmodo_name {
	font-size: 0.8em;
	font-weight: bold;
	font-style: italic;
	display: inline-block;
	}
	
/* === Follow links === */
.follow {
	display: inline-block;
	background: #3295C6;
	color: #fff !important;
	font-size: 11px;
	text-transform: uppercase;
	font-weight: bold;
	padding: 4px 6px;
	border-radius: 5px;
	border: 1px solid #1073a4;
	position: relative;
	}
	.follow:hover:before {
		content: "";
		position: absolute; left: 20px; top: 20px; z-index: 100;
		width: 0; height: 0;
		border-bottom: 5px solid #333;
		border-left: 5px solid transparent;
		border-right: 5px solid transparent;
		}
	.follow:hover:after {
		content: "Follow this user to see their activity in your news feed!";
		font-weight: normal;
		position: absolute; left: 0; top: 25px; z-index: 100;
		display: block;
		padding: 4px;
		background: #333; color: #fff;
		font-size: 10px;
		text-transform: none;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
		}
	.follow.active { background: #afa; border-color: #696; color: #696 !important; }
	.follow.active:hover { background: #faa; border-color: #966; color: #966 !important; }
		.follow.active:hover:after { content: "Unfollowing this user will remove their activity from your news feed!"; }
	#user-info .follow:hover:before { top: -8px; border-top: 5px solid #333; border-bottom: none; }
	#user-info .follow:hover:after { top: -35px; width: 200px; }

/* === Level map page === */
#level-map-frame {
	text-align: center;
	padding: 10px;
	background-color: #333;
	margin-top: 20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	}
	#level-map-frame img { max-width: 100%; }

/* === OBI Badge landing pages === */

.obi-badge-title {
	width: 902px;
	margin: 20px 20px 0;
	height: 100px;
	text-indent: -9999px;
	border: 1px solid #c3bba4;
	background: url('../images/templates/landing/apprentice_badge/header.png') center center no-repeat;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	}
	#obi-badge-title-apprentice {
		background: url('../images/templates/landing/apprentice_badge/header-apprentice.png') center center no-repeat;
		}
	#obi-badge-title-mentor {
		background: url('../images/templates/landing/apprentice_badge/header-mentor.png') center center no-repeat;
		}
.obi-badge-info {
	margin: 20px 20px 0;
	padding: 20px 20px 0;
	line-height: 20px;
	background: #fffaeb;
	border: 1px solid #c3bba4;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	}
	.obi-badge-info h3, .obi-badge-info p { margin-bottom: 20px; }
	.obi-badge-callout {
		margin: -20px 0 20px 20px;
		float: right;
		width: 258px;
		padding: 20px;
		background: #fff;
		border: 1px solid #c3bba4;
		border-top: none;
		-webkit-border-radius: 0 0 3px 3px;
		-moz-border-radius: 0 0 3px 3px;
		-o-border-radius: 0 0 3px 3px;
		border-radius: 0 0 3px 3px;
		}
	#image-circles-and-badges {
		width: 860px; height: 257px;
		background: url('../images/templates/landing/apprentice_badge/circles-and-badges.png') center center no-repeat;
		}
	.obi-badge-info .badge-details {
		padding: 20px; margin: 20px 0;
		background: #fff;
		border: 1px solid #c3bba4;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
		}
		.obi-badge-info .badge-details .badge-details-image {
			width: 128px; height: 128px;
			padding: 5px;
			margin: -20px 20px -20px -20px;
			float: left;
			border-right: 1px solid #c3bba4;
			}
			#badge-apprentice {
				background: url('../images/templates/landing/apprentice_badge/macarthur-apprentice-128.png') center center no-repeat;
				}
			#badge-mentor {
				background: url('../images/templates/landing/apprentice_badge/macarthur-mentor-128.png') center center no-repeat;
				}
	.obi-badge-info.obi-login-area { width: 500px; margin: 20px auto 20px; text-align: center; }
	.obi-badge-info ol {
		list-style-type: decimal;
		margin: 20px 0 20px 40px;
		}
		.obi-badge-info li { margin-bottom: 20px; }
		.obi-badge-info ol ol { list-style-type: lower-alpha; }
	#obi-badge-proof {}
		#obi-badge-proof h2 {
			margin: -20px -20px 20px;
			background: #fff; border-bottom: 1px solid #c3bba4;
			padding: 10px;
			-webkit-border-radius: 2px 2px 0 0;
			-moz-border-radius: 2px 2px 0 0;
			-o-border-radius: 2px 2px 0 0;
			border-radius: 2px 2px 0 0;
			}
			.obi-badge-proof-exercise {
				padding: 0 20px 20px;
				margin: 0 -20px;
				}
				#obi-badge-proof h3 {
					margin: -21px -20px 20px;
					background: #fff;
					border-top: 1px solid #c3bba4;
					border-bottom: 1px dashed #c3bba4;
					padding: 10px;
					}
					.obi-badge-fullpage { font-size: 10px; font-weight: normal; text-transform: uppercase; }
					.obi-badge-proof-expand {
						line-height: 20px;
						float: right;
						font-size: 20px;
						display: block;
						width: 20px; height: 20px;
						text-align: center;
						border: 1px solid #3295C6;
						-webkit-border-radius: 10px;
						-moz-border-radius: 10px;
						-o-border-radius: 10px;
						border-radius: 10px;
						}
				.obi-badge-proof-task {
					background: #fff;
					padding: 20px;
					margin: 20px 0;
					border: 1px solid #c3bba4;
					-webkit-border-radius: 3px;
					-moz-border-radius: 3px;
					-o-border-radius: 3px;
					border-radius: 3px;
					}
					.obi-badge-proof-task h4 {
						margin: -20px -20px 20px;
						background: #fff; border-bottom: 1px solid #c3bba4;
						padding: 10px;
						-webkit-border-radius: 2px 2px 0 0;
						-moz-border-radius: 2px 2px 0 0;
						-o-border-radius: 2px 2px 0 0;
						border-radius: 2px 2px 0 0;
						}
					.obi-badge-proof-game { 
						text-align: center; 
						padding: 10px; 
						background: #c3bba4;
						-webkit-border-radius: 3px;
						-moz-border-radius: 3px;
						-o-border-radius: 3px;
						border-radius: 3px;
						}

/* === Support for mio dropdown stuff on Quest page === */
/* Dropdown Button */
.mio-dropbtn {
    /*
    background-color: #4CAF50;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
    */
    cursor: pointer;
    font-size: 16px;
    padding: 5px 10px;
    margin: 10px 0px;
}

#mio-dropbtn {
    color: rgb(157, 4, 12) !important;
}

/* Dropdown button on hover & focus */
.mio-dropbtn:hover, .mio-dropbtn:focus {
    background-color: #3e8e41;
}

/* The container <div> - needed to position the dropdown content */
.mio-dropdown {
    /*position: relative;*/
    /*display: inline-block;*/
    /* text-align: center; */
    width: 175px;
    margin: 0px 383px;
}

/* Dropdown Content (Hidden by Default) */
.mio-dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.mio-dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.mio-dropdown-content a:hover {background-color: #f1f1f1}

/* Show the dropdown menu (use JS to add this class to the .mio-dropdown-content container when the user clicks on the dropdown button) */
.mio-show {display:block;}
