/* === GENERAL === */
.section-content { margin: 0 10px; padding: 0; }

/* === Header: Self === */

#header-workshop-self {
	margin: 0 auto;
	width: 942px;
	height: 197px;
	}
.header-workshop-bg { background: transparent url('../images/templates/banner-workshop-self.png') no-repeat; }
.header-workshop-bg-m { background: transparent url('../images/templates/banner-workshop-self-m.jpg') no-repeat; }
.header-workshop-bg-f { background: transparent url('../images/templates/banner-workshop-self-f.jpg') no-repeat; }
#header-workshop-self-right {
	margin: 0 10px 0 0;
	width: 140px;
	height: 166px;
	float: right;
	}
	#header-workshop-self-right a#build-a-new-game {
		margin: 18px 0 0 0;
		text-indent: -9999px;
		display: block;
		width: 140px;
		height: 132px;
		background: transparent url('../images/templates/button-buildanewgame.png') no-repeat;
		}
	#header-workshop-self-right a#build-a-new-game:hover {background-position: 0 -130px;}

/* === Header: Other === */

#header-workshop-other {
	margin: 0 auto;
	width: 942px;
	height: 196px;
	background: transparent url('../images/templates/banner-workshop-other.jpg') no-repeat;
	}
	#header-workshop-other h2 {
		margin: 0 auto;
		padding: 40px 0;
		width: 300px;
		font-size: 36px;
		font-weight: bold;
		text-align: center;
		color: #FF8416;
		}
		#header-workshop-other h2 span {
			font-size: 48px;
			line-height: 52px;
			}

/* === Mechanic Profile === */

#mechanic-name {
	line-height: 48px;
	display: inline-block;
	margin: 10px 0 10px 10px; padding: 0;
	max-width: 480px;
	font-size: 36px;
	font-weight: bold;
	}
	#user-info #mechanic-name.has-portfolio { max-width: 345px; }
#mechanic-rank {
	display: inline-block;
	font-size: 20px; font-weight: bold;
	margin-left: 10px;
	color: #999;
	}
#my-portfolio-button { font-size: 14px; margin: 15px 10px 0 0; }
#view_progress_button {
	font-size: 12px;
	padding: 5px;
	vertical-align: baseline;
	}
#mechanic-profile { overflow: hidden; }
	#mechanic-info {
		width: 454px;
		float: left;
		}
		.profile-section {
			background: #fffaeb; color: #666;
			position: relative;
			overflow: hidden;
			margin: 10px; padding: 10px;
			border: 1px solid #c3bba4;
			border-radius: 10px;
				-webkit-border-radius: 10px;
				-moz-border-radius: 10px;
			}
			.profile-section > h3 {
				text-align: left;
				font-size: 18px;
				display: block;
				margin: -10px -10px 5px -10px; padding: 5px;
				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;
				}
				.profile-section > h3 .button { font-size: 12px; padding: 2px 5px; float: right; }
		#mechanic-badges, #mechanic-world-badges { text-align: center; }
			#mechanic-badges .top-badge {
				float: left;
				margin-right: 3px;
				width: 64px;
				height: 64px;
				float: left;
				}
			#mechanic-badges .no-results, #mechanic-world-badges .no-results {
				width: 412px;
				}
			#mechanic-world-badges .top-badge {
				text-align: left;
				float: left;
				width: 200px; height: 74px;
				background: #fff;
				border: 1px solid #c3bba4;
				}
				#mechanic-world-badges .top-badge + .top-badge { float: right;}
				#mechanic-world-badges .top-badge img { float: left; margin: 5px; }
				#mechanic-world-badges .top-badge .badge-info {
					float: right;
					width: 120px;
					font-size: 12px;
					padding: 5px 5px 5px 0;
					margin: 5px 0;
					}
					#mechanic-world-badges .top-badge .badge-completion { margin-bottom: 5px; }
					#mechanic-world-badges .top-badge .badge-status { padding: 2px; }
		.sync-obi {
			display: block; padding: 1px; font-size: 10px;
			background: #eee; border: 1px solid #ddd;
			font-weight: bold;
			text-align: center;
			margin: 5px 0;
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			-o-border-radius: 3px;
			border-radius: 3px;
			}
		#mechanic-bio .button {
			font-size: 12px;
			padding: 3px;
			}
		#mechanic-messages {}
			#mechanic-messages .nav {
				position: absolute; top: 3px; right: 5px;
				}
				#mechanic-messages .nav .button {
					font-size: 10px;
					padding: 3px;
					}
			.messages-form {
				margin: -5px -10px 0;
				font-size: 12px;
				}
				.messages-form thead, #message-header, #messages thead {
					font-weight: bold;
					background: #eee;
					border-bottom: 1px solid #c3bba4;
					}
					.messages-form td { vertical-align: middle; }
				.message { border-bottom: 1px solid #eee; }
				.message-odd { background: #fff; }
				.message-unread {font-weight: bold;}
			#message-actions {
				background: #fff;
				padding: 5px;
				border-top: 1px solid #c3bba4;
				margin: -1px 0 -10px;
				text-align: center;
				border-radius: 0 0 10px 10px;
					-webkit-border-radius: 0 0 10px 10px;
					-moz-border-radius: 0 0 10px 10px;
				}
				#message-actions .button {
					font-size: 12px;
					height: 25px;
					padding: 0 10px;
					}
			#message-header td { padding: 3px 5px; }
			#message-header #message-date { text-align: right;}
			#message-body {
				height: 120px;
				overflow: auto;
				padding: 5px 5px 6px;
				}
			#single_message #message-header {
				font-size: 12px;
				padding: 10px;
				border-radius: 10px 10px 0 0;
					-moz-border-radius: 10px 10px 0 0;
					-webkit-border-radius: 10px 10px 0 0;
				}
			#single_message #message-actions {
				margin: 0;
				border-radius: 0 0 10px 10px;
					-moz-border-radius: 0 0 10px 10px;
					-webkit-border-radius: 0 0 10px 10px;
				}
			#single_message #message-body { height: auto; }
	#showcase-game {
		width: 455px;
		float: left;
		margin-left: 0;
		padding-bottom: 0;
		}
		#showcase-game > img {
			margin: 6px 0 10px;
			border: 1px solid #c3bba4;
			}
		#showcase-game .gamecard {
			margin-top: 6px;
			box-shadow: none;
				-moz-box-shadow: none;
				-webkit-box-shadow: none;
			}
		#showcase-game-actions {
			background: #fff;
			padding: 10px;
			border-top: 1px solid #c3bba4;
			margin: 0 -10px;
			text-align: center;
			clear: both;
			border-radius: 0 0 10px 10px;
				-moz-border-radius: 0 0 10px 10px;
				-webkit-border-radius: 0 0 10px 10px;
			}
			#showcase-game-actions .button {
				font-size: 16px;
				}
#mechanic-teachers { padding-bottom: 0; }
	#mechanic-teachers > h3 { margin-bottom: 0; }
	.institution {
		border-bottom: 1px solid #ddd;
		overflow: hidden;
		margin: 0 -10px;
		}
		.institution h4 {
			background: #ffc;
			display: block;
			float: left;
			height: 14px;
			padding: 10px 15px;
			border-right: 1px solid #ddd;
			}
		.institution a {
			display: block;
			float: left;
			height: 14px;
			border-right: 1px solid #ddd;
			padding: 10px 10px;
			font-size: 12px;
			font-weight: bold;
			}
#mechanic-teacher-classes { padding-bottom: 0; }
	.institution-listing {
		background: #fff;
		padding: 10px 10px 0;
		margin: 10px 0;
		border: 1px solid #c3bba4;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
		}
		.institution-listing h4 { padding-bottom: 5px; }
		.institution-listing a, .institution-listing span {
			margin-right: 6px;
			margin-bottom: 10px;
			position: relative;
			display: inline-block;
			padding: 4px;
			font-weight: bold;
			border: 1px solid #c3bba4;
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			-o-border-radius: 3px;
			border-radius: 3px;
			}
		.institution-listing span { color: #bbb; border-color: #ddd; background: #f9f9f9; }
			.institution-listing span:hover { cursor: not-allowed; }
			.institution-listing span:hover:before {
				content: ""; width: 0; height: 0;
				border-top: 5px solid #333;
				border-left: 5px solid transparent;
				border-right: 5px solid transparent;
				position: absolute; bottom: 35px; left: 60px;
				}
			.institution-listing span:hover:after {
				content: "Purchase the Exclusive Educational Package to access this feature!";
				background: #333; color: #fff;
				width: 120px; height: 30px;
				padding: 5px;
				font-size: 10px; font-weight: normal;
				position: absolute; bottom: 40px; left: 0;
				-webkit-border-radius: 3px;
				-moz-border-radius: 3px;
				-o-border-radius: 3px;
				border-radius: 3px;
				}
		a.premium-institution-ad {
			display: block;
			width: 898px; height: 47px;
			padding: 0; margin: 0 -10px;
			border: none;
			border-top: 1px solid #c3bba4;
			text-indent: -9999px;
			background: url('../images/templates/workshop/premium-institution-ad.png');
			-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;
			}
	.institution-sublist { margin: -10px 10px 10px; }
		.institution-sublist .institution-listing {
			margin: 0;
			border-top: none;
			-webkit-border-radius: 0;
			-moz-border-radius: 0;
			-o-border-radius: 0;
			border-radius: 0;
			}
		.institution-sublist .institution-listing:last-child {
			-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;
			}
#mechanic-teacher-courses { padding-bottom: 0; }
	#mechanic-teacher-courses .institution-listing { background: #dfd; }
		#mechanic-teacher-courses .institution-listing h4 { display: inline-block; margin-right: 20px; }
		#mechanic-teacher-courses .institution-listing a { background: #afa; border-color: #8b8; }
#mechanic-groups { padding-bottom: 0;}
	#mechanic-groups > h3{ margin-bottom: 10px; }
	.group {
		display: inline-block;
		margin: 0 10px 10px 0;
		height: 32px; width: 100px;
		padding: 5px;
		background: #333; color: #fff !important;
		text-align: center;
		font-weight: bold;
		border-radius: 5px;
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
		}
	#group-amd {
		width: 896px;
		height: 32px;
		background: transparent url('../images/templates/workshop/amd-employee-youth-banner.png') no-repeat;
		text-indent: -9999px;
		}
#new_game_button {
	text-align: center;
	width: 123px; height: 100px;
	box-shadow: 0 0 3px rgba(0, 0, 0, 0.5), 0 0 3px #FFFF00 inset;
	}
	#new_game_button span {		display: block; }
	#new_game_button-make {		font-size: 34px; }
	#new_game_button-a_new {	font-size: 30px; }
	#new_game_button-game {		font-size: 30px; }
	
/* === Game Cards === */

.button-delete {
	border-color: #b00;
	background: #f66;
	text-shadow: 1px 1px 0 #600;
		-moz-text-shadow: 1px 1px 0 #600;
		-webkit-text-shadow: 1px 1px 0 #600;
	box-shadow: 0 0 4px #fcc inset;
		-moz-box-shadow: 0 0 4px #fcc inset;
		-webkit-box-shadow: 0 0 4px #fcc inset;
	}
.button-delete:hover {
	background: #b00;
	border-color: #900;
	}
.gamecard-draft, .gamecard-draft .thumb {
	width: 143px;
	height: 120px;
	}
	.gamecard-draft h3 {
		display: block;
		width: 100%;
		background: #fffaeb;
		position: absolute; top: 0;
		padding: 1px 3px 3px;
		border-bottom: 1px solid #ccc;
		}
	.gamecard-draft .gamecard-actions {
		width: 100%;
		background: #fffaeb;
		position: absolute; bottom: 0;
		padding: 3px;
		text-align: center;
		border-top: 1px solid #ccc;
		}
		.gamecard-draft .gamecard-actions .button {
			font-size: 12px;
			padding: 3px 5px;
			}

.gamecard-small-workshop {
	height: 138px; width: 298px;
	background: #fffaeb;
	}
	.gamecard-small-workshop h3 { width: 100%; }
	.gamecard-small-workshop .gamecard-ratings { width: 140px; }
	.gamecard-small-workshop-left {
		overflow: hidden;
		float: left;
		width: 140px;
		height: 132px;
		position: relative;
		background: #fff;
		border: 1px solid #c3bba4;
		border-radius: 5px;
		padding: 3px;
		margin: -1px 0 0 -1px;
		text-align: center;
		}
		.gamecard-small-workshop-left .challenge-entry {
			position: absolute; top: 3px; left: 3px;
			display: block;
			width: 134px;
			padding: 2px;
			font-weight: bold;
			background: #ffa;
			border: 1px solid #ccc;
			}
	.gamecard-small-workshop-right-outer{
		overflow: hidden;
		float: left;
		width: 151px;
		}
		.gamecard-small-workshop-right-container{
			overflow: hidden;
			position: relative;
			float: left;
			width: 453px;
			left: -151px;
			}
			.gamecard-small-workshop-right {
				float: left;
				font-size: 9px; font-weight: bold;
				width: 147px; height: 135px;
				padding: 2px;
				}
			.gamecard-small-workshop-right.premium-ad { margin-left: 145px; }
				.gamecard-small-workshop-right .gamecard-stats {
					text-align: center;
					margin: 2px 0;
					}
					.gamecard-small-workshop-right .gamecard-stats span {display: inline-block;}
				.gamecard-action {
					display: block;
					padding: 3px;
					font-size: 11px; 
					background-position: 5px 1px;
					background-repeat: no-repeat;
					text-indent: 24px;
					float: left;
					width: 116px;
					margin: 0 10px 2px;
					}
				.gamecard-action:hover {
					background-position: 5px 1px;
					background-color: #fd3;
					}
				.gamecard-action:active {
					background-position: 5px 1px;
					background-color: #fc0;
					}
				.gamecard-action.disabled {
					background-color: #aaa;
					color: #555 !important;
					border-color: #555;
					}
				.gamecard-action-edit {
					background-image: url('../images/templates/workshop/game-tile-icon-edit.png');
					}
				.gamecard-action-share {
					background-image: url('../images/templates/workshop/game-tile-icon-share.png');
					}
				.gamecard-action-stats, .gamecard-action-stats-enabled, .gamecard-action-stats-premium {
					background-image: url('../images/templates/workshop/game-tile-icon-stats.png');
					}
				.gamecard-action-delete, .gamecard-action-delete-page {
					background-image: url('../images/templates/workshop/game-tile-icon-delete.png');
					}
				.gamecard-action-back, .gamecard-action-share-back, .gamecard-action-delete-back, .gamecard-action-stats-back {
					background-image: url('../images/templates/workshop/game-tile-icon-back.png');
					margin-top: 6px;
					}
				.gamecard-action-share-email {
					background-image: url('../images/templates/workshop/game-tile-icon-share-email.png');
					width: 62px;
					margin-right: 2px; margin-left:0;
					}
				.gamecard-action-share-link {
					background-image: url('../images/templates/workshop/game-tile-icon-share-link.png');
					width: 52px;
					margin-right: 2px; margin-left:0;
					}
				.gamecard-action-share-embed {
					background-image: url('../images/templates/workshop/game-tile-icon-share-embed.png');
					width: 68px;
					margin-right: 2px; margin-left:0;
					}
				.gamecard-action-share-social {
					width: 12px;
					margin-right: 2px; margin-left:0;
					text-indent: -9999px;
					box-shadow: none;
						-webkit-box-shadow: none;
						-moz-box-shadow: none;
					}
				.gamecard-action-share-social:hover {
					background-position: center center;
					border-color: #fff;
					}
				.gamecard-action-share-social-edmodo { 
					background-color: #0d51a2;
					background-image: url("../images/templates/social-edmodo.png");
					background-position: center center;
					background-repeat: no-repeat;
					background-size: cover;	
					border-color: #333;
					}
				.gamecard-action-share-social-everloop { 
					background-color: #000;
					background-image: url("../images/templates/social-everloop.png");
					background-position: center center;
					background-repeat: no-repeat;
					background-size: cover;
					border-color: #333;
					}
				.gamecard-action-share-social-twitter {
					background: #42c8f4;
					background-image: url("../images/templates/social-twitter.png");
					background-position: center center;
					background-size: cover;
					background-repeat: no-repeat;
					}
				.gamecard-action-share-social-facebook {
					background-color: #3B5998;
					background-image: url("../images/templates/social-facebook.png");
					background-position: center center;
					background-size: cover;
					background-repeat: no-repeat;	
					border-color: #333;
					}
				.gamecard-edit-sharing-settings {
					height: 19px;
					margin: 0 3px;
					padding: 0 3px;
					display: block;
					float: left;
					}
				.gamecard-small-workshop-right h4 {
					text-transform: uppercase;
					font-size: 11px;
					text-align: center;
					margin-top: 4px;
					margin-bottom: 6px;
					}
				.gamecard-small-workshop-right p {
					margin-bottom: 6px;
					line-height: 12px;
					}
				.gamecard-small-workshop-thumb {
					width: 140px;
					height: 105px;
				}
				.share-textbox {
					width: 120px;
					margin: 0 5px;
					font-size: 10px;
					}
				.gamecard-action-stats-premium {
					margin-top: 85px; }
				.premium-ad {
					background: url('../images/templates/workshop/ad-premium-stats.png') center 2px no-repeat;
					}

/* === View All Messages page === */

#all-mechanic-messages #messages { width: 920px; margin: -10px 0 0 -10px; }
#all-mechanic-messages #messages td { padding: 10px; font-size: 12px; }

/* === Single Message page === */

#single_message { padding: 0; }
#single_message #message-actions .button {
	margin-bottom: 10px;
	line-height: 20px;
	}

/* === Edit Profile page === */

#edit_profile label {
	font-size: 18px;
	width: 200px;
	float: left;
	text-align: right;
	}
#edit_profile textarea {
	width: 650px;
	float: left;
	margin-left: 10px;
	}
#edit_profile p {
	width: 650px;
	float: left;
	margin-left: 210px; margin-top: 5px;
	font-style: italic;
	}

/* TROPHY CASE - Deprecated

#title-button-trophycase
{
	width: 177px;
	background: transparent url('../images/templates/workshop/title-trophycase.png') no-repeat;
}
#trophycase .rounded-box
{
	padding: 0;
}

#selected-trophy-case
{
	height: 158px;
	overflow-y: auto;
}
#selected-trophy
{
	margin: 0 10px 0 0;
	padding: 10px;
	width: 370px;
	height: 138px;
	float: left;
	background-color: #e9dfc1;
	color: #333;
	border-top-left-radius: 7px;
	border-bottom-left-radius: 7px;
	-moz-border-radius-topleft: 7px;
	-moz-border-radius-bottomleft: 7px;
	-webkit-border-radius-topleft: 7px;
	-webkit-border-radius-bottomleft: 7px;
}
#selected-trophy #selected-trophy-left
{
	margin: 0 10px 0 0;
	padding: 0;
	width: 128px;
	height: 147px;
	float: left;
}
#selected-trophy #selected-trophy-right
{
	margin: 0;
	padding: 0;
	width: 232px;
	height: 147px;
	float: right;
}
#selected-trophy #selected-trophy-right #selected-trophy-name
{
	margin: 0 0 10px 0;
	padding: 0;
	font-size: 18px;
	line-height: 18px;
	font-weight: bold;
}
#selected-trophy #selected-trophy-right #selected-trophy-description
{
	margin: 0 0 10px 0;
	padding: 0;
	font-size: 12px;
	line-height: 15px;
}
.trophy
{
	margin: 10px 10px 0 0;
	padding: 5px;
	width: 64px;
	height: 117px;
	float: left;
	font-size: 12px;
	line-height: 15px;
	text-align: center;
	border: 1px solid #e9dfc1;
	color: #999;
	cursor: pointer;
}
.trophy-selected
{
	background-color: #e9dfc1;
}

*/

/* template games */

#title-button-templategames
{
	width: 217px;
	background: transparent url('../images/templates/workshop/title-templategames.png') no-repeat;
}
#template-games-about
{
	font-size: 12px;
	line-height: 14px;
}
#template-games-about-title
{
	text-indent: -9999px;
	width: 227px;
	height: 14px;
	background: transparent url('../images/templates/workshop/title-abouttemplategames.png') no-repeat;
}
#template-games-about-tip
{
	margin: 20px 0;
	text-align: center;
}
#template-games-about-icons
{
	margin: 0 auto 10px auto;
	padding: 0;
	width: 880px;
}
.template-games-about-icon
{
	margin: 0;
	padding: 0 10px;
	float: left;
	width: 200px;
}
.template-games-about-asset
{
	margin: 0;
	padding: 0;
	width: 32px;
	float: left;
}
.template-games-about-descr
{
	margin: 0;
	padding: 0;
	width: 158px;
	float: right;
}
#template-games-title
{
	text-indent: -9999px;
	width: 161px;
	height: 14px;
	background: transparent url('../images/templates/workshop/title-templategames2.png') no-repeat;
	float: left;
}

/* lessons */

#title-button-lessons
{
	background: url("../images/templates/workshop/title-assignments.png") no-repeat scroll 0 0 transparent;
	width: 184px;
}

/* GAME DELETE */

#are-you-sure {
	text-indent: -9999px;
	height: 311px;
	background: url('../images/templates/are-you-sure.png') no-repeat right;
}

/* DRAFT GAMES */

#draft-games .gamecard-draft
{
	margin: 0;
	padding: 0 0 10px 24px;
}

/* DENIED GAMES */

#denied-games .gamecard-draft
{
	margin: 0;
	padding: 0 0 10px 24px;
}

/* MESSAGES */

#messages-list
{
	margin: 10px 20px;
	padding: 0;
}
#messages-list table
{
	font-size: 12px;
	line-height: 14px;
}
#messages-list thead td
{
	font-size: 14px;
	font-weight: bold;
	color: #fff;
	background-color: #c3bba4;
}
#messages-list td
{
	margin: 0;
	padding: 5px 8px;
}

/* Student Tracking */

#tracking-blurb {
	margin: -11px 10px 20px 10px;
	padding: 0;
	font-weight: bold;
	color: #FFF;
	background-color: #c3bba4;
	height: 30px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-radius-bottomleft: 5px;
	-webkit-border-radius-bottomright: 5px;
}

#tracking-blurb h3 {
	margin: 0;
	padding: 6px 5px 6px 15px;
	font-size: 18px;
	line-height: 18px;
	overflow: hidden;
	height: 18px;
}

/* STATS */

#title-button-gamestatistics
{
	width: 214px;
	background: transparent url('../images/templates/game/title-gamestatistics2.png') no-repeat;
}
#stats-blurb {
	margin: -11px 10px 20px 10px;
	padding: 0;
	font-weight: bold;
	color: #FFF;
	background-color: #c3bba4;
	height: 30px;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
	-moz-border-radius-bottomleft: 5px;
	-moz-border-radius-bottomright: 5px;
	-webkit-border-radius-bottomleft: 5px;
	-webkit-border-radius-bottomright: 5px;
}
#stats-blurb h3 {
	margin: 0;
	padding: 6px 5px 6px 15px;
	font-size: 18px;
	line-height: 18px;
	overflow: hidden;
	height: 18px;
}

#stats-left
{
	margin: 0 0 0 10px;
	float: left;
	width: 607px;
}
#player-funnel
{
	margin-left: 20px;
	text-indent: -9999px;
	width: 143px;
	height: 14px;
	background: url('../images/templates/workshop/title-playerfunnel.png') 0 0 no-repeat;
}
#stats-levels
{
	margin: 0;
	padding: 0;
	border: 3px solid #c3bba4;
	background-color: #fff;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}

#stats-right
{
	margin: 0 10px 0 0;
	float: right;
	width: 307px;
}
#player-tries
{
	margin-left: 20px;
	text-indent: -9999px;
	width: 258px;
	height: 14px;
	background: url('../images/templates/game/title-playertriesonthislevel.png') 0 0 no-repeat;
}

		.row-wrap {
			text-align: center;
			width: 600px;
			height: 98px;
			position: relative;
			margin: 5px auto;
			overflow: hidden;
			}
		
		.base-wrap {
			width: 465px;
			height: 98px;
			float: right;
			position: relative;
			}
		.row-wrap.odd .base-wrap {
			background: #ccc;
			}
		.row-wrap.even .base-wrap {
			background: #eee;
			}
		.base {
			margin: 0 auto;
			background: rgb(101,204,255);
			background-position: center;
			height: 98px;
			}
/*
		.base-selected
		{
			background: rgb(255,132,22);
		}
*/
		.slope {
			border-style: solid;
			}
		.slope-left {
			float: left;
			border-color: transparent transparent #fff #fff;
			}
		.slope-right {
			float: right;
			border-color: transparent #fff #fff transparent;
			}
		.row-wrap.odd .slope-left {
			border-color: transparent transparent #ccc #ccc;
			}
		.row-wrap.odd .slope-right {
			border-color: transparent #ccc #ccc transparent;
			}
		.row-wrap.even .slope-left {
			border-color: transparent transparent #eee #eee;
			}
		.row-wrap.even .slope-right {
			border-color: transparent #eee #eee transparent;
			}
			
		.info {
			position: relative;
			height: 98px;
			width: 130px;
			float: left;
			font-size: 10px;
			font-weight: bold;
			color: #333;
			}
		.level-title {
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			border-radius: 5px;
			position: absolute;
			top: 10px;
			left: 10px;
			max-width: 105px;
			background: rgb(51,51,51);
			color: #fff;
			padding: 3px;
			text-align: left;
			}
		.info img {
			padding: 3px;
			background: #FFF;
			border: 1px solid #7C7767;
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			border-radius: 5px;
			}
		
		.label-wrap {
			text-align: center;
			height: 98px;
			width: 465px;
			right: 0;
			position: absolute;
			}
		.label {
			margin: 0 auto;
			height: 12px;
			font-size: 12px;
			color: #fff;
			font-weight: bold;
			padding: 3px;
			width: 40px;
			text-align: center;
			}
		.label-attempts {
			background: rgb(51,51,51);
			-webkit-border-bottom-right-radius: 5px;
			-webkit-border-bottom-left-radius: 5px;
			-moz-border-radius-bottomright: 5px;
			-moz-border-radius-bottomleft: 5px;
			border-bottom-right-radius: 5px;
			border-bottom-left-radius: 5px;
			}
		.label-wins {
			margin-top: 62px;
			background: rgb(141,198,63);
			-webkit-border-top-left-radius: 5px;
			-webkit-border-top-right-radius: 5px;
			-moz-border-radius-topleft: 5px;
			-moz-border-radius-topright: 5px;
			border-top-left-radius: 5px;
			border-top-right-radius: 5px;
			}
		.label-fail {
			background: rgb(198,63,63);
			}
		.label-first {
			width: 120px;
			}
		
		.players {
			font-size: 18px;
			font-weight: bold;
			}
		.players-started {
			background: url('../images/templates/workshop/viz-players-started.png') 0 0 no-repeat;
			}
		.players-finished {
			background: url('../images/templates/workshop/viz-players-finished.png') 0 0 no-repeat;
			}
		.players-title {
			float: left;
			width: 160px;
			padding-top: 20px;
			}
		.players-win {
			color: rgb(141,198,63)
			}
		.players-lose {
			color: rgb(198,63,63)
			}
.label-wrap
{
	cursor: pointer;
}

/* right */

		.row-wrap-right {
			text-align: center;
			width: 300px;
			height: 98px;
			position: relative;
			margin: 5px auto;
			overflow: hidden;
			}
		.row-wrap-right.odd,
		.row-wrap-right.even {
			height: 304px;
		}
		
		.base-wrap-right {
			width: 165px;
			height: 98px;
			float: right;
			position: relative;
			}
		.row-wrap-right.odd .base-wrap-right {
			background: #ccc;
			height: 304px;
			}
		.row-wrap-right.even .base-wrap-right {
			background: #eee;
			height: 304px;
			}
		.base-right {
			margin: 0 auto;
			background: rgb(255,132,22);
			background-position: center;
			height: 98px;
			}
		.row-wrap-right.odd .base-right {
			height: 304px;
			}
		.row-wrap-right.even .base-right {
			height: 304px;
			}
/*
		.slope {
			border-style: solid;
			}
		.slope-left {
			float: left;
			border-color: transparent transparent #fff #fff;
			}
		.slope-right {
			float: right;
			border-color: transparent #fff #fff transparent;
			}
*/
		.row-wrap-right.odd .slope-left {
			border-color: transparent transparent #ccc #ccc;
			}
		.row-wrap-right.odd .slope-right {
			border-color: transparent #ccc #ccc transparent;
			}
		.row-wrap-right.even .slope-left {
			border-color: transparent transparent #eee #eee;
			}
		.row-wrap-right.even .slope-right {
			border-color: transparent #eee #eee transparent;
			}
			
		.info-right {
			position: relative;
			height: 98px;
			width: 130px;
			float: left;
			font-size: 10px;
			font-weight: bold;
			color: #333;
			}
		.level-title-right {
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			border-radius: 5px;
			position: absolute;
			top: 10px;
			left: 10px;
			max-width: 105px;
			background: rgb(51,51,51);
			color: #fff;
			padding: 3px;
			text-align: left;
			}
		.info-right img {
			padding: 3px;
			background: #FFF;
			border: 1px solid #7C7767;
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			border-radius: 5px;
			}
		
		.label-wrap-right {
			text-align: center;
			height: 98px;
			width: 165px;
			right: 0;
			position: absolute;
			}
		.label-right {
			margin: 0 auto;
			height: 12px;
			font-size: 12px;
			color: #fff;
			font-weight: bold;
			padding: 3px;
			width: 40px;
			text-align: center;
			}
		.label-attempts-right {
			background: rgb(51,51,51);
			-webkit-border-bottom-right-radius: 5px;
			-webkit-border-bottom-left-radius: 5px;
			-moz-border-radius-bottomright: 5px;
			-moz-border-radius-bottomleft: 5px;
			border-bottom-right-radius: 5px;
			border-bottom-left-radius: 5px;
			}
		.label-wins-right {
			margin-top: 268px;
			background: rgb(141,198,63);
			-webkit-border-top-left-radius: 5px;
			-webkit-border-top-right-radius: 5px;
			-moz-border-radius-topleft: 5px;
			-moz-border-radius-topright: 5px;
			border-top-left-radius: 5px;
			border-top-right-radius: 5px;
			}
		.label-fail-right {
			background: rgb(198,63,63);
			}
		.label-first-right {
			width: 120px;
			}
		
		.players-right {
			font-size: 18px;
			font-weight: bold;
			}
		.players-title-right {
			float: left;
			width: 160px;
			padding-top: 20px;
			}
		.players-win-right {
			color: rgb(141,198,63)
			}
		.players-lose-right {
			color: rgb(198,63,63)
			}

/* student tracking */
#student-tracking-button a
{
	color: #fff;
	text-align: center;
}
#student-tracking-button a:hover
{
	color: #fff;
}
.student-tracking-table
{
	width: 100%;
	font-size: 12px;
	line-height: 14px;
	background: #FFFAEB;
	text-align: center;
}
.student-tracking-table th
{
	color: #fff;
	font-weight: bold;
	text-align: center;
	font-size: 10px;
	text-transform: uppercase;
	background-color: #C3BBA4;
}
.student-tracking-table th,
.student-tracking-table td
{
	padding: 10px 5px;
	overflow: hidden;
}
.student-tracking-table td
{
	border-bottom: 1px solid #eee;
	vertical-align: middle;
	font-size: 15px;
}
.student-tracking-table td.num
{
	text-align: center;
}
.student-tracking-table tr.even
{
	background-color: #fff;
}

.student-user
{
	width: 100px;
	background-color: #DED4B9;
	font-weight: bold;
	text-align: center;
}
.student-game
{
	width: 100px;
	background-color: #efe5ca;
	font-weight: bold;
	text-align: center;
}
.student-rating
{
	width: 100px;
	background-color: #fff;
}
.student-moderation
{
	width: 89px;
	text-align: center;
	font-size: 8px !important;
	text-transform: uppercase;
	line-height: 10px;
}
a.remove-student
{
	color: #b00 !important;
	font-weight: bold;
	font-size: 10px;
	text-transform: uppercase;
	line-height: 12px;
}
a.flag-game
{
	display: inline-block !important;
}
h2.student-tracking-title
{
	margin: 20px;
}
tr.flagged
{
	background: #f9cece;
}
tr.flagged .student-user
{
	background: #deb9b9;
}
tr.flagged .student-moderation
{
	color: #b00;
}
tr.deleted
{
	background: #eee;
	color: #aaa;
}
tr.deleted .student-user
{
	background: #ddd;
}
tr.deleted .student-moderation
{
	color: #b00;
}
table p
{
	margin-bottom: 6px;
}
.notapplicable
{
	width: 100%;
	display: block;
	text-align: center;
}
h2.nothingtoseehere
{
	text-align: center;
	font-size: 20px;
	text-transform: uppercase;
	color: #C3BBA4;
}
#quotas
{
	font-size: 20px;
	text-align: center;
	padding: 10px;
	background: #FFFAEB;
	border-bottom: 1px solid #C3BBA4;
	margin-bottom: 20px;
}

/* challenges */

#title-button-challenges
{
	width: 297px;
	background: transparent url('../images/templates/workshop/title-challenges.png') no-repeat;
}
#my-challenges
{
	padding-left: 13px;
}
#my-challenges.fullpage
{
	padding-left: 35px;
}
.center
{
	margin-left: auto;
	margin-right: auto;
}
#back-button
{
	font-size: 20px;
	width: 400px;
	padding: 10px;
}

/* ACHIEVEMENTS PAGE */

.content-area {
	margin: 0 10px;
	overflow: hidden;
	}
.content-section {
	overflow: hidden;
	margin-bottom: 10px;
	}
.content-section.box {
	padding: 10px;
	border-radius: 10px;
	background: #FFFAEB;
	border: 1px solid #C3BBA4;
	}
#header {
	height: 61px;
	overflow: hidden;
	border-bottom: 1px solid #333;
	background: url("../images/banner-blank.jpg") no-repeat scroll 0 0 transparent;
	text-align: center;
	margin-bottom: 20px;
	}
#header h1 {
	margin-top: 10px;
	font-size: 40px;
	text-transform: uppercase;
	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;
	}
#achievements #username {
	font-size: 36px;
	margin: 0 0 10px 0;
	}
#achievements h2 { font-size: 20px; margin: 20px 0; }
#achievements .content-section p {
	width: 650px;
	display: block;
	float: left;
	font-size: 14px;
	color: #666;
	}
#back-to-workshop {
	float: right;
	}
.advancement-label {
	font-family: Ubuntu, Verdana, Arial, sans-serif;
	display: block;
	float: left;
	width: 250px;
	text-align: center;
	}
.mechanic-rank {
	display: block;
	margin: 0 10px 15px;
	}
	.mechanic-rank strong {
		font-size: 28px;
		}
.mechanic-rank + .mechanic-rank {
	color: #999;
	margin-bottom: 0;
	}
#rank-overview p {
	font-size: 18px !important;
	line-height: 20px;
	}
.xp-label {
	font-size: 26px;
	text-align: center;
	margin-bottom: 5px;
	}
.xp-progress-track {
	height: 40px;
	background: #999;
	position: relative;
	text-align: center;
	clear: both;
	border-radius: 10px;
	box-shadow: 0 0 5px #333 inset;
	overflow: hidden;
	}
.xp-progress-amount {
	position: absolute;
	width: 100%;
	color: #fff;
	font-weight: bold;
	font-size: 36px;
	font-family: Ubuntu, Verdana, Arial, sans-serif;
	}
.xp-progress-bar {
	position: absolute; top: 0; left: 0;
	height: 40px;
	width: 0%;
	background: #333;
	border-radius: 10px;
	box-shadow: 0 0 5px #fff inset;
	}
.xp-progress-blurb {
	display: block;
	text-align: center;
	font-weight: bold; text-transform: uppercase;
	font-size: 11px;
	color: #f33;
	}
.xp-progress-blurb.complete {
	color: #3c3;
	}
	
#dxp,#pxp,#rxp,#cxp {
	width: 434px;
	float: left;
	}
#dxp, #rxp {
	margin-right: 10px;
	}
#dxp p,#pxp p,#rxp p,#cxp p {
	width:414px !important;
	height: 70px;
	}

#dxp h3 {
	color: #9a0000;
	}
#dxp .xp-progress-track {
	background: #9a0000;
	}
#dxp .xp-progress-bar {
	background: #cc0000;
	}
	
#pxp h3 {
	color: #2a7bcc;
	}
#pxp .xp-progress-track {
	background: #2a7bcc;
	}
#pxp .xp-progress-bar {
	background: #3399ff;
	}
	
#rxp h3 {
	color: #d1a700;
	}
#rxp .xp-progress-track {
	background: #d1a700;
	}
#rxp .xp-progress-bar {
	background: #ffcc00;
	}
	
#cxp h3 {
	color: #d55500;
	}
#cxp .xp-progress-track {
	background: #d55500;
	}
#cxp .xp-progress-bar {
	background: #ff6600;
	}
.badge-info { margin: 20px 10px; }
#world-badges { padding-left: 30px; }
	.world-badge {
		position: relative;
		padding: 10px;
		background: #FFFAEB;
		border: 1px solid #C3BBA4;
		margin: 0 10px 10px 0;
		display: block;
		float: left;
		height: 220px; width: 128px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		-o-border-radius: 10px;
		border-radius: 10px;
		}
		.world-badge img { 
			width: 128px; height: 128px; display: block;
			}
		.world-badge .badge-title {
			width: 128px; height: 40px;
			font-size: 16px;
			margin-top: 10px;
			font-weight: bold;
			text-align: center;
			}
		.badge-status {
			display: block;
			padding: 4px;
			text-align: center;
			font-weight: bold;
			border: 1px solid #7d7;
			background: #7f7;
			color: #6a6 !important;
			-webkit-border-radius: 5px;
			-moz-border-radius: 5px;
			-o-border-radius: 5px;
			border-radius: 5px;
			}
			.badge-status:hover { color: #494 !important; }
			.incomplete .badge-status {
				background: #6cf;
				border-color: #4ad;
				color: #28b !important;
				}
				.incomplete .badge-status:hover { color: #17a !important; }
			/*.world-badge.incomplete .badge-status {
				background: #ff7;
				border-color: #dd7;
				color: #aa6 !important;
				}
				.world-badge.incomplete .badge-status:hover { color: #994 !important; }*/
		.world-badge .badge-description {
			font-size: 11px;
			padding: 10px 10px 10px 0;
			position: absolute;
			top: 15px;
			left: -9999px;
			background: #FFFAEB;
			width: 128px;
			height: 78px;
			border: 1px solid #C3BBA4;
			border-left: none;
			-webkit-border-radius: 0 10px 10px 0;
			-moz-border-radius: 0 10px 10px 0;
			-o-border-radius: 0 10px 10px 0;
			border-radius: 0 10px 10px 0;
			}
			.world-badge:hover .badge-description {
				left: 148px;
				z-index: 10;
				width: 128px;
				}
		.badge-completion {
			position: relative;
			border: 1px solid #c3bba4;
			color: #a39b84;
			font-size: 10px; font-weight: bold;
			text-align: center;
			margin-top: 5px;
			height: 10px;
			padding: 1px 0;
			-webkit-border-radius: 3px;
			-moz-border-radius: 3px;
			-o-border-radius: 3px;
			border-radius: 3px;
			}
			.badge-completion-bar {
				position: absolute; top: 0; left: 0;
				background: #c3fba4;
				height: 12px;
				width: 70px;
				-webkit-border-radius: 2px;
				-moz-border-radius: 2px;
				-o-border-radius: 2px;
				border-radius: 2px;
				}
			.badge-completion-label {
				position: absolute; top: 0; left: 0; width: 100%;
				}
		.world-badge.right-edge .badge-description {
			padding: 10px 0 10px 10px;
			border: 1px solid #C3BBA4;
			border-right: none;
			border-radius:  10px 0 0 10px;
			}
			.world-badge.right-edge:hover .badge-description {
				left: -139px;
				z-index: 10;
				width: 128px;
				}
#mozilla-persona-info {
	margin: 20px 30px; padding: 20px;
	background: #fffaeb;
	border: 1px solid #c3bba4;
	line-height: 20px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	}
	#mozilla-persona-info .error, #mozilla-persona-info .alert, #mozilla-persona-info .notice { margin-bottom: 20px; }
	#mozilla-persona-info .button { padding: 5px 10px 4px; font-size: 16px; }
	#mozilla-persona-info label { margin-left: 180px; line-height: 30px; font-weight: bold; float: left; width: 200px; }
	#mozilla-persona-info form { margin: 20px 0; }
	#mozilla-persona-info input.button { float: left; height: 30px; line-height: 16px; vertical-align: middle; }
	#mozilla-persona-info input[type="text"] { 
		float: left; 
		height: 18px; width: 150px;
		padding: 5px; margin-right: 5px;
		border: 1px solid #c3bba4;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		-o-border-radius: 3px;
		border-radius: 3px;
		}

#badges {
	overflow: hidden;
	padding-left: 30px;
	}
	.badge {
		position: relative;
		padding: 10px;
		border-radius: 10px;
		background: #FFFAEB;
		border: 1px solid #C3BBA4;
		margin: 0 10px 10px 0;
		display: block;
		float: left;
		height: 110px;
		width: 64px;
		}
		.badge img {
			width: 64px;
			height: 64px;
			display: block;
			}
		.badge-title {
			width: 64px;
			font-size: 12px;
			height: 36px;
			margin-top: 10px;
			font-weight: bold;
			text-align: center;
			}
		.badge .badge-description {
			font-size: 11px;
			padding: 10px 10px 10px 0;
			position: absolute;
			top: 15px;
			left: -9999px;
			background: #FFFAEB;
			width: 128px;
			height: 78px;
			border: 1px solid #C3BBA4;
			border-left: none;
			border-radius: 0 10px 10px 0;
			}
			.badge:hover .badge-description {
				left: 84px;
				z-index: 10;
				width: 128px;
				}
		.badge.right-edge .badge-description {
			padding: 10px 0 10px 10px;
			border: 1px solid #C3BBA4;
			border-right: none;
			border-radius:  10px 0 0 10px;
			}
			.badge.right-edge:hover .badge-description {
				left: -139px;
				z-index: 10;
				width: 128px;
				}
		.badge.incomplete {
			background: #eee;
			color: #bbb;
			border-color: #ddd;
			}
			.badge.incomplete .badge-placeholder {
				width: 64px; height: 64px;
				display: block;
				background: #ccc;
				-webkit-border-radius: 32px;
				-moz-border-radius: 32px;
				-o-border-radius: 32px;
				border-radius: 32px;
				}
			.badge.incomplete .badge-description {
				background: #eee;
				border-color: #ddd;
				color: #bbb;
				}


#user-info { margin-bottom: 0; padding: 0; }
	#user-info #mechanic-name {
		overflow: hidden;
		margin: 0 10px 0 0;
		padding: 10px;
		border: none;
		-webkit-border-radius: 10px 0 0 10px;
		-moz-border-radius: 10px 0 0 10px;
		-o-border-radius: 10px 0 0 10px;
		border-radius: 10px 0 0 10px;
		border-right: 1px solid #c3bba4;
		font-size: 24px;
		float: left;
		color: #666;
		}
	#user-info #mechanic-rank { font-size: 14px; margin: 11px 0 6px 0; }
		#user-info #mechanic-rank strong { font-size: 18px; color: #666; }
		#user-info #mechanic-rank .button { padding: 4px 6px; vertical-align: bottom; }
	#mechanic-follow { font-size: 14px; color: #999; font-weight: bold; }
		#user-info #mechanic-follow strong { font-size: 16px; }
		#mechanic-follow .follow { padding: 4px 6px; vertical-align: bottom; }
		

.profile-following ul li {
	display: block; float: left;
	background: #fff;
	padding: 5px; margin: 5px;
	border: 1px solid #c3bba4;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	}
	.profile-following ul li .delete { color: #b00 !important; }
	.profile-following ul li .delete:hover { color: #f00 !important; }

#proof-banner {
	margin: 20px;
	height: 100px;
	background: #f00;
	}
#proof-content {
	margin: 20px; padding: 20px;
	line-height: 20px;
	background: #fffaeb;
	border: 1px solid #c3bba4;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-o-border-radius: 3px;
	border-radius: 3px;
	}
	#proof-content ol {
		list-style-type: decimal;
		margin-left: 40px;
		}
		#proof-content ol li { margin-bottom: 10px; }