input[type=text], input[type=password] { border-radius:4px; border:1px solid #ccc; padding:4px 8px; }
input[type=checkbox] { border-radius:4px; border:1px solid #ccc; padding:4px 8px; width:20px; height:20px; }
span.checkbox, label[for=tw-i], label[for=fb-i] { display:inline-block; width:26px; height:26px; background-image:url(../img/social-checkbox.png); line-height:42px; text-align:left; text-indent:-9999px; cursor:pointer; background-repeat:no-repeat;}
.checkbox-checked span { background-position:-58px -33px; }
label[for=tw-i] { background-position:-84px 0; }
label[for=fb-i] { background-position:-26px 0; }
.checkbox-checked label[for=tw-i] { background-position:-84px -33px; }
.checkbox-checked label[for=fb-i] { background-position:-26px -33px; }

#pause { height:105px; width:78px; background:url(../img/playpause.png) no-repeat -236px 0px; position:absolute; left:202px; top:108px; }


#info-l:hover, #info-l.current { background-position: -331px 1px; }
#volume-l:hover, #volume-l.current { background-position: -393px 1px; }
#share-l:hover, #share-l.current { background-position: -456px 1px; }
#related-l:hover, #related-l.current  { background-position: -519px 1px; }
#togo-l:hover, #togo-l.current { background-position: -583px 1px; }
.b:hover, .b.current { color:#fff; }

.u {
	background-color:rgb(1,1,1);
	height:6px; width:48px;
	bottom: -20px;
	position:absolute;
}
.tab-content {
	padding-top:10px;
	text-shadow:1px 1px rgba(0,0,0,0.4);
}
#info-u {background-color:#ffe92a;}
#volume-u {background-color:#07d21e;}
#share-u {background-color:#FF0000;}
#related-u {background-color:#25D2FF;}
#togo-u {background-color:#9C5FD4;}

#restart {
	color:#fff;
	line-height:1.9em;
	position:relative;
	top:58px;
}
#volume {
	position:relative;
	top:64px;
}
.btn {
	background-repeat: no-repeat;
	background-color:transparent;
	background-image:url(../img/buttons.png);
	background-position:-138px -9px;
	font-size:14px; line-height:24px;
	text-decoration:none; color: #fff;
	height:34px; width:137px;
	text-shadow:-1px -1px rgba(101,70,211,0.5);
	border:none;
	margin-right:-6px;
}
input.btn { padding-bottom:10px; position:relative; top:-6px;}
.btn:active {
	background-position:-138px -46px;
}
.btn.secondary {
	background-position:0 -9px; width:140px;
}
.btn.secondary:active {
	background-position:0 -46px;
}

.btn.q {
	display:inline-block;
	margin-top:0.5em;
}
.slider {
	background:#000;
	height:4px;
	position:relative;
	border:1px solid #333;
	width: 342px;
	clear:right;
	margin-top:20px;
	left:69px;
	box-shadow:1px 1px rgba(255,255,255,0.4);
	-webkit-box-shadow:1px 1px rgba(255,255,255,0.4);
	-moz-box-shadow:inset 1px 1px rgba(255,255,255,0.4);
}
.progress {
	margin:-1px 0 0 -1px;
	height:6px;
	background-color:#a264cd;
	background-image: -webkit-gradient(
	    linear,
	    left top,
	    left bottom,
		color-stop(0, #a264cd),
	    color-stop(0.3, rgb(153,102,204)),
	    color-stop(0.79, rgb(170,126,224)),
		color-stop(1.0, #b47de2)
	);
}
.handle {
	height:28px;
	width:30px;
	top:-12px;
	position:absolute;
	display:block;
	cursor:ew-resize;
	border-radius:15px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.4);
	background-image: url(../img/slider.png);
}
.range {
	background:none; border:none;
	color:#d3d3d3; display:block;
	width:92px; margin:20px auto; position:relative; top:-79px;
	padding-right:55px; font-size:30px;
	text-align:right;
}
#share { position:relative; top:60px; }
#share label[for=comment-i], #share fieldset legend {
	display:block; margin: 0 auto 0.5em;
	width: 400px; text-align: left;
	font-size:14px; color:white; font-weight:bold;
}
#post label { background-image:url(../img/share.png); text-indent:-9999px; height:18px; line-height:18px; margin: -2px 0.25em 0 0;}
#share fieldset { width:400px; text-align:left; margin: 0 auto 0.5em; display:block; }
#share fieldset input[type=text] { width:139px; margin-top:0.5em; padding:4px 0;}
#share fieldset label[for=emb-i] { width: 26px; display:inline-block; background-position:0 -10px; }
#share fieldset label[for=link-i] { width: 20px; display:inline-block; margin-left: 12px; background-position:-75px -10px; }

#share #comment-i { width: 400px; margin:0.5em auto; display:block; }
#share #comment-i.default { color: #BCBCBC; }
#share #sn-submit { width:400px; text-align:right; margin: auto; display:block; }
.copy-btn { background-image:url(../img/share.png); background-position:-32px; text-indent:-9999px; display:inline-block; width:32px; height:26px; margin-left:-13px; position:relative; top:-6px; }
.copy-btn.active, .copy-btn.copied {
	background-position:0;
	background-image:url(../img/share-active.png);
	margin-left:-8px;
	margin-right:1px;
	width:26px;
	height:25px;
	top:-7px;
}
#togo { width:480px; top:72px; height:118px; position:absolute;}
#togo-menu { width:240px; margin-left:48px; overflow:hidden; padding-left:134px;}
#togo ul { width:880px; height:117px; position:relative; }
#togo ul li { display:block; float:left; text-align:center; }

.title img { display:none; }

/** Control Buttons **/
#reset { position:absolute; top:8px;right:8px; background-position:-78px -0px; top:8px;right:8px; }
#reset:hover { background-position:-82px 0; top:7px;right:7px; background-image:url(../img/ctrl-buttons-hover.png); width:40px; height:40px; }
#reset:active { background-position:-82px -41px; top:7px;right:7px; background-image:url(../img/ctrl-buttons-hover.png); width:40px; height:40px; }

#resume { position:absolute; top:8px; left:8px; }
#resume:hover { background-position:0 0; top:7px;left:7px; background-image:url(../img/ctrl-buttons-hover.png); width:40px; height:40px; }
#resume:active { background-position:0 -41px; top:7px;left:7px; background-image:url(../img/ctrl-buttons-hover.png); width:40px; height:40px; }

#console #info .back {
	display:none;
}

#console.loading-more .title { display:none; }
#console.loading #menu { display:none; }
#console.loading #reset { display:none; }
#console.loading #resume { display:none; }

#togo-menu .scrollable li {
	width:116px;
}
#togo-menu .scrollable li a img {
	display:block; margin:auto;
	margin-top:59px;
	height:59px;  opacity:0.5;
}
#togo-menu-titles div {
	position:absolute;
	width:100%;
}
#launcher:hover {
	background-image:url(../img/launcher.png);
	background-position:0 -70px;
}
#launcher:active {
	background-image:url(../img/launcher.png);
	background-position:0 -149px;
}

body.arcade .launcher-ui #launcher:hover { background-image:url(../img/arcade-launcher.png); background-position:0 -161px; margin-top:4px;}
body.arcade .launcher-ui #launcher:active { background-image:url(../img/arcade-launcher.png); background-position:0 -241px; margin-top:4px;}

#play, .loading .panes {
	display:none;
}

#shared { font-weight:bold; }
#shared img { vertical-align:bottom; }
#shared h3 { font-size:28px; line-height:28px; margin-bottom:0.5em; margin-top:1.25em;}
#shared p { max-width:380px; line-height:1.5em; margin:auto; margin-bottom:0.75em; }

#login-msg { font-weight:bold; font-size:14px;}
#login fieldset input[type="text"], #login fieldset input[type="password"] {width:292px; display:block; margin:0.75em auto; padding:4px 4px;}
#login .submit {width:360px; text-align:right; margin:0.75em auto 0; padding-top:1em; }
#login a {color:#8864bc;}
#login fieldset { padding-left:60px; background:url(../img/login-logo.png) no-repeat left center; width:300px;}

.share-buttons { margin:2em auto; }
.share-buttons a { display:inline-block; text-align: left; margin-left: -4px; font-size: 13px; height: 21px; line-height: 21px; padding: 0 5px; width: 182px; background: transparent url("../img/purple-button-bg.gif") repeat-x center; border-radius: 4px; }
.share-buttons a span { background:url(../img/fbtwit-btn-flair.png) no-repeat left top; padding:1px 0 1px 20px; height:15px;}
.share-buttons a.fb { margin-right:13px; }
.share-buttons a.tw span {background-position:0 -16px;}

.arcade .launcher-ui iframe { display:none; }