body {
	text-align:center;
	background:url(/img/bg.gif);
	color:#FFF;
	font-family: 'Open Sans', sans-serif;
	margin:0;
}
#main {
	text-align:left;
	width:407px;
	margin:auto;
}
div#main>h1 {
	background:url(/img/logo.png);
	width:410px;
	height:192px;
	text-indent:-9999px;
	margin:10px 0px;
}

section {
	border:1px solid #272E2E;
	border-bottom-color: #272E2E;
	border-right-color: #272E2E;
	border-top-color:#191C1C;
	border-left-color:#191C1C;
	border-radius:5px;
	background-color:#242B2B;
	padding:10px 15px;
}

section header h1, section header h2 {
	font-family: 'Open Sans', sans-serif;
	text-transform:uppercase;
	font-weight:700;
	font-size:1.55em;
	color:#00F6FF;
	text-shadow:2px 2px 1px #000;
	margin:0px;
	letter-spacing:0.025em;
}

section header h2 {
	font-size:1.25em;
}

section article p{
	font-family: 'Open Sans', sans-serif;
	font-size:0.8em;
	color:#BFBFBF;
}

section article p a, section article p a:visited{
	color:#00F6FF;
	font-weight: bold;
	text-decoration: none;
}

section article p a:hover{
	text-decoration: underline;
}

section article p strong{
	font-weight: bold;
	color: #EEE;
}

em {
	font-style:normal;
	color:#00F6FF;
}
em.love {
	color:#00FF72;
}
em.hate{
	color:#FF004E;
}

form {
	margin:30px 0px !important;
}

form input{
	height:46px;
	width:270px;
	background-color:#D3D3D3;
	border-radius:5px;
	border-width:1px;
	padding-left:10px;
	font-size:1.3em;
	color:#000;
}

form input.button {
	width:114px;
	margin-left:10px;
	height:48px;
	border:1px solid #103636;
	background-color:#07D3D3;
	border-top-color:#7FD3D3;
	border-left-color:#7FD3D3;
	text-transform:uppercase;
	color:white;
	font-family: 'Open Sans', sans-serif;
	text-transform:uppercase;
	font-weight:700;
	background-image:url(/img/button-play.png);
	background-repeat:no-repeat;
	background-position:center;
	text-indent:-9999px;
}
form input.button:hover {
		background-image:url(/img/button-play-hover.png);
}

hr {
	margin:5px 0px;
	border:0;
	border-bottom:1px solid #232929;
	box-shadow:0px 1px 0px #293030;
}
img#artnow {
	width:125px;
	height:125px;
	border:6px solid rgba(100, 100, 100, 0.2);
	float:left;
	border-radius:10px;
	margin-right:15px;
}
section#now div#info {
	margin:15px 0px;
	font-family: 'Open Sans', sans-serif;
	font-size:1.3em;
	color:#999;
	text-shadow: 1px 1px 2px #000;
}

section#now div#info div.artist{
	font-weight:700;
	color:#fff;
}
section#now div#info div.title{
	max-height:60px;
	overflow:hidden;
}

div#next {
	width:250px;
	float:left;
	font-size:0.9em;
}

div#next  {
	margin:0px 0px;
	font-family: 'Open Sans', sans-serif;
	color:#999;
	text-shadow: 1px 1px 2px #000;
}

div#next div.artist{
	font-weight:700;
	color:#fff;
}

div#next div.title{
	height:40px;
}

img#artnext{
	width:50px;
	height:50px;
	border:4px solid rgba(100, 100, 100, 0.2);
	float:left;
	border-radius:10px;
	margin-right:10px;
}

div#timer {
	text-align:right;
	text-transform:uppercase;
	font-size:0.9em;
	font-weight:700;
	text-shadow: 1px 1px 2px #000;
}
span.time {
	display:block;
	font-family: 'Open Sans', sans-serif;
	font-weight:700;
	font-size:3em;
	color:#839E9E;
	margin-top:-5px;
}

div#status {
	position:absolute;
	width:170px;
	height:60px;
	background-repeat:no-repeat;
	background-color:#242B2B;
	z-index:100;
	font-family: 'Open Sans', sans-serif;
	font-weight:700;
	font-size:0.9em;
	text-shadow: 1px 1px 2px #000;
	padding-left:70px;
	padding-right:10px;
	
}
.feedback{
	background-image:url(/img/status-feedback.png);
}
.loading{
	background-image:url(/img/status-finding.png);
}
#hidden {
	border:0;
	height:0px;
	width:0px;
}

.buttons{
	padding-left:150px;
	margin-top:10px;
}
.ctlbutton {
	width:27px;
	height:26px;
	background:url(/img/buttons.png);
	text-indent:-9999px;
	display:inline-block;
	
}
.ctlbutton.love{
	background-position:0px 0px
}
.ctlbutton.love:hover{
	background-position:0px 28px
}
.ctlbutton.ban{
	background-position:-31px 0px
}
.ctlbutton.ban:hover{
	background-position:-31px 28px
}
.ctlbutton.skip{
	background-position:-62px 0px
}
.ctlbutton.skip:hover{
	background-position:-62px 28px
}
a.ctlbutton.love:active, a.ctlbutton.love:focus, a.ctlbutton.love:selected{
	outline: 4px solid lime;
}

.starthidden {
	display:none;
}

#fblike
{
	display:block;
	margin-top:-30px;
	margin-bottom:10px;
}

footer {
	margin-top:10px;
	font-family: 'Open Sans', sans-serif;
	font-size:0.8em;
	color:#BFBFBF;
	text-align:center;
}

footer a, footer a:active, footer a:visited{
	color:#666;
	text-decoration:none;
}
footer a:hover{
	color:#fff;
	text-decoration:underline;
}

section.faq, section.deactivation{
	position:absolute;
	top:50%;
	margin-top: -250px;
	width:375px;
	z-index: 250;
	border: 10px solid #333;
	display:none;
}
#matt {
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: #000;
	opacity: 0.5;
	top: 0;
	left: 0;
	z-index: 150;
	display: none;
}
div#header {
	font-family: 'Open Sans', sans-serif;
	font-size:0.8em;
	color:#FFF;
	font-weight:bold;
	border:1px solid #272E2E;
	border-bottom-color: #272E2E;
	border-right-color: #272E2E;
	border-top-color:#191C1C;
	border-left-color:#191C1C;
	border-radius:0 0 5px 5px;
	background-color:#07D3D3;
	//background-color:#242B2B;
	padding:10px 15px;
}

div#header span.close {
	float:right;
	cursor:pointer;
}

div#header a{
	color:#FFF;
	text-decoration:none;
	
}
div#header a:hover, div#header span.close:hover{
	color:#000;
	text-decoration:underline;
}

div#timer {
	cursor:pointer;
	background-image:url(/img/buttons-pause.png);
	background-repeat:no-repeat;
	background-position: 255px 35px;
}
div#timer.paused {
	background-image:url(/img/buttons-play.png);
}