/* written by Tobu (Toms Burkovskis) */
@import url(//tobu.io/css/normalize.css);
@import url(//tobu.io/css/fonts.css);
@import url(//tobu.io/css/cookieconsent.css);
@import url(//tobu.io/css/magnific.css);
body { background: #ccc url(//tobu.io/img/bg.jpg); color: #444; font-family: Catamaran, sans-serif; font-weight: 400; font-size: 12pt; margin-bottom: 60px;
}
textarea,
input,
select { transition: .3s ease; -moz-transition: .3s ease; -webkit-transition: .3s ease; border-radius: 5px; font-family: Catamaran, sans-serif; font-size: 12pt; color: #444;
}
textarea:focus,
input:focus,
select:focus { box-shadow: 0 0 10px #ff3e5c; -moz-box-shadow: 0 0 10px #ff3e5c; -webkit-box-shadow: 0 0 10px #ff3e5c;
}
.clearfix { clear: both;
}
.tooltip {	display: none;	position: absolute;	background-color: #222;	border-radius: 5px;	padding: 5px 10px;	color: #fff;	font-size: 11pt; opacity: 0.9; filter: alpha(opacity=90);
}
a { color: #d4324a; text-decoration: none; outline: none; }
input { border: 1px solid #ccc; padding: 0 10px; transition: .2s ease; }
input.password { }
input.submit { background-color: #f3f3f3; }
input.submit:hover { background-color: #ddd; color: #fff; }
#login-form { width: 325px; margin: 0 auto; background: #222; padding: 20px; margin-top: 5%; border-radius: 5px; border-top: 5px solid #d62f49; border-bottom: 1px solid #fff; box-shadow: 0 10px 20px #888; -moz-box-shadow: 0 10px 20px #888; -webkit-box-shadow: 0 10px 20px #888;
}
#login-form input { border: 0; width: 300px; height: 45px; background: #666; color: #ccc; margin: 10px 0;
}
#login-form input:focus { background: #fff; color: #444; font-size: 14pt;
}
#login-form input.submit { background: #d62f49; color: #f3a8b3; width: auto; font-size: 14pt;
}
#login-form input.submit:hover { background: #ff3554; color: #fff;
}
#login-form div.logo { text-align: center;
}
#login-form .credit { color: #555; font-size: 9pt; padding: 20px 5px 0 0;
}
div.msg { background-color: #faef79; border-top: 2px solid #e5db6e; border-bottom: 2px solid #e5db6e; color: #6a6533; padding: 5px 10px;
}
div.msg a{ font-weight: 600; color: #6a6533;
}
div.err { background-color: #fa7979; border-top: 2px solid #c66060; border-bottom: 2px solid #c66060; color: #6a3333; padding: 5px 10px;
}
div.err a{ font-weight: 600; color: #6a3333;
}
#wrapper { background: #fff; width: 750px; margin: 0 auto; box-shadow: 0 10px 20px #888; -moz-box-shadow: 0 10px 20px #888; -webkit-box-shadow: 0 10px 20px #888; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;
}
#nav { overflow: hidden;
}
div.logo { background: #222; padding: 10px; text-align: center;
}
#nav .links { overflow: hidden; background: #f3f3f3; padding: 10px;
}
#nav .links a { color: #777; float: left; display: block; padding: 10px; font-size: 10pt; transition: .2s ease; background-color: #f3f3f3; border-radius: 5px; text-transform: uppercase; margin-right: 10px;
}
#nav .links a:hover { background-color: #ddd;
}
#nav .links a.current { background-color: #999; color: #fff;
}
table.form { width: 100%; border-collapse: collapse; color: #777;
}
table td { padding: 10px; }
table tr:nth-child(odd) { background-color: #f3f3f3; border-top: 1px solid #ddd;
}
table.form input,
table.form textarea,
table.form select { padding: 3px; width: 300px; border: 1px solid #ccc; font-size: 12pt;
}
table.form input:focus { border: 1px solid #fff;
}
table.form span { font-size: 9pt; color: #777;
}
table.form input.submit { background: #d62f49; color: #fff; width: auto; font-size: 14pt; padding: 3px 20px; border: none;
}
table.form input.submit:hover { background: #ff3554; color: #fff;
}
table th { text-align: left; font-weight: 600; padding: 10px;
}
table.form input.radio { width: 20px; padding: 0;
}
table.form .txt { height: 220px; width: 300px; line-height: 23px;
}
div.tracks { overflow: hidden;
}
div.tracks a { display: block; width: 70px; float: left; background-color: #f3f3f3; border: 1px solid #ddd; padding: 15px 15px 5px 15px; color: #777; margin: 9px; border-radius: 5px; transition: .2s ease;
}
div.tracks a:hover { background-color: #ddd; border: 1px solid #bbb;
}
div.tracks a .album { background-color: #777; padding: 0 5px; position: absolute; text-transform: uppercase; color: #fff; font-weight: 300; font-size: 8pt; border-radius: 5px; margin: 66px 0 0 -85px;
}
div.info { font-size: 9pt; color: #777; text-align: center; padding: 10px 0;
}
a.grey { color: #aaa; font-size: 9pt;
}
a.grey:hover { color: #666;
}
#footer { width: 770px; margin: 0 auto; text-align: center; text-shadow: 1px 1px #fff; color: #666; font-size: 8pt; padding: 10px 0;
}
div.line { margin: 10px 0; border-top: 1px solid #ddd;
}
#stats { overflow: hidden;
}
#stats .box { padding: 10px 30px; float: left; text-transform: uppercase; font-weight: 300; font-size: 8pt; border-radius: 5px; background-color: #f5f5f5; border: 1px solid #ddd; text-align: center; width: 110px; height: 70px; letter-spacing: 1px; margin: 5px; white-space: nowrap;
}
#stats .box .title { color: #777; font-weight: 400;
}
#stats .box .count { font-size: 22pt; font-weight: 800;
}
h2 { margin: 10px 0; font-weight: 300; text-transform: uppercase; font-size: 14pt;
}