@charset "UTF-8";
/* CSS Document */
body{ margin:auto; background:#070707 url(../images/bg-home.jpg) center top no-repeat; font-family:dinpro;}
.kanal{ background:#070707 url(../images/bg-kanal.jpg) center top no-repeat}
@font-face {
	font-family: 'dinpro';
	src: url(../fonts/DINNextLTPro-Regular.eot);
	src: local('☺'), url('../fonts/DINNextLTPro-Regular.woff') format('woff'), url('../fonts/DINNextLTPro-Regular.ttf') format('truetype'), url('../fonts/DINNextLTPro-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
a{ color:inherit; text-decoration:none;}
a:hover{text-decoration:underline;}
.wrap{width:980px;margin:auto; z-index:10; position:relative;}
.contain-home { margin: 0 auto; width: 980px; position:relative;z-index:0; float:left; min-height:1100px }
.contain { margin: 0 auto; width: 980px; position:relative;z-index:0; float:left; }
.box{ width:960px; padding:10px; background:rgba(0,0,0,0.8); float:left; margin-top:150px;}
.header{ width:980px; height:138px;float:left; position:relative;}
.menu { width:450px; height:100px; margin-top:50px; float:right;}
.button{ width:100px; height:100px; float:left; margin:0px 5px; float:left; opacity:0.9}
.button:hover{ opacity:1;}
.logo{ width:134px; position:absolute; left:20px; height:99px; top:35px}
.user-login{ max-width:225px; position:absolute; right:30px; height:auto; top:0px; padding:7px 10px 5px 10px; color:#ebe311; text-align:center}
.login { width:335px; height:210px; position:absolute; right:70px; bottom:40px; background:url(../images/login.jpg) no-repeat}

/* ----- FORM ---- */

.box-login{ width:280px; float:left; margin-left:30px; margin-top:50px; color:#ffff00; font-family:dinpro;}
.box-login p{ text-align:center;font-size:14px; line-height:15px;}

input[type=text],
input[type=password], select[type=text] {
    font-family: 'Lato', Calibri, Arial, sans-serif;
    font-size: 13px;
    font-weight: 400;
    display: block;
    width: 255px;
    padding: 5px;
    margin-bottom: 5px;
    border: 3px solid #ebe6e2;
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
	text-align:center;
	
}

input[type=text]:hover,
input[type=password]:hover, select[type=text]:hover {
    border-color: #3dbecd;
}

label:hover ~ input {
    border-color: #3dbecd;
}

input[type=text]:focus,
input[type=password]:focus, select[type=text]:focus {
    border-color: #3dbecd;
    outline: none; /* Remove Chrome's outline */
}

.bt-login{ width:130px; height:22px; float: left; margin:0px 5px; text-align:center; background:#8d191b; margin-bottom:8px; color:#fff; padding-top:8px; font-size:13px}
.bt-login:hover{ background:#740c0e}

.copywrite{ width:500px; height:219px; position:absolute; left:30px; bottom:20px; color:#fff; font-size:11px;}
.copywrite p{ margin-top:10px;}

.upload{ width:480px; height:203px; float:left;position:relative; margin-top:50px;padding-bottom:50px; overflow:hidden}
.footer{ width:960px; padding:10px; background:rgba(0,0,0,0.8); float:left; margin-top:5px; color:#fff; font-size:12px; text-align:center; margin-bottom:5px}

.info{ width:450px; float:left; height:auto; margin-left:30px; margin-top:10px; color:#fff;}
.info ul{ padding:0; padding-left:10px;}
.info li{ list-style:square; line-height:24px; margin-bottom:10px; font-size:16px; font-weight:300;}
.info li span{color:#ffff00}
.info h3{ padding:0; margin:0; text-align:left; font-size:22px; font-weight:300; color:#fff}
.list-lagu{ width:450px; float:left; margin-bottom:20px;}

/*CSS file upload*/


.file-wrapper {
	position: relative;
	display: inline-block;
	margin-top:20px;
	cursor: pointer;
	height:30px;
	float:left;
}
.file-wrapper input {
	position: absolute;
	top: 0;
	right: 0;
	filter: alpha(opacity=1);
	opacity: 0.01;
	-moz-opacity: 0.01;
	cursor: pointer;
	z-index:100;
	width:190px;
	height:30px;
	
}

.file-wrapper .button1 {
	height:25px;
	color: #000;
	font-family:dinpro;
	text-transform:uppercase;
	background: #fff;
	border:3px solid #ebe6e2;
	padding: 9px;
	padding-top:5px;
	padding-bottom:0;
	margin-right: 5px;	
	display: inline-block;
	font-weight: bold;
	cursor: pointer;
	font-size:12px;
	line-height:24px;
	font-weight:bold;
	width:175px;
	text-align:center;
}

.button1:hover {
	
	background: #38c6f3;
	
}
.file-holder{
	color: #000;
	position: absolute;
	left: 5px;
	top: 11px;
	width: 204px;
	text-align:center
}

.bt-submit {
width: auto;
height: auto;
padding:8px 10px;
padding-top:10px;
float: left;
margin: 0px 5px;
margin-top:20px;
text-align: center;
background: #8d191b;
margin-bottom: 8px;
border-radius:4px;
}

.box-gallery{ width:460px; height:auto; float:left; margin:10px; border-bottom:1px solid #fff; padding:10px 0px;}
.foto-band{ width:150px; height:150px; float:left;overflow:hidden}
.foto-band img{ width:100%; height:auto;}
.title-band{ width:300px; float:left; height:auto; margin-left:10px; font-family:dinpro;}
.title-band h2{ font-size:24px; text-transform:uppercase; color:#fff; margin:0; padding:0; font-weight:300}
.title-band h3{ font-size:16px; text-transform:normal; color:#fff; margin:0; padding:0; font-weight:300}
.title-band h4{ font-size:16px; text-transform:normal; color:#293c50; margin:0; padding:0; font-weight:300; padding-bottom:5px; border-bottom:2px dotted #fff;}
.title-lagu{ width:230px; float:left; margin-left:10px; margin-top:20px; color:#ffff00;}
.play{ width:auto; margin-left:10px; float:left; background:#631625; padding:3px 10px; color:#fff; font-family:dinpro; margin-top:15px;border-radius:4px;}
.play:hover{ background:#8c2136; cursor:pointer}
.share{ width:130px; float:left; height:auto; margin-left:10px; background:#2a3d50; color:#fff; padding:5px; margin-top:20px; text-align:center}
.paging{
	width:720px;
	float:right;
	padding:10px;
	text-align:right;
	margin-right:0px;
	margin-top:5px;
}

.paging a{
	background:#fff;
	padding:10px;
	color:#000;
}

.paging a:hover{
	background:#631625;
	color:#fff;
	text-shadow: 0 1px 0 #000;

}

.paging a, .paging span {
padding: 7px;
color: #000;
border: 1px solid #000;
background: linear-gradient(#f2f2f2, #fefefe);
transition: all 0.3s ease-out;
text-transform: uppercase;
text-decoration: none;
cursor: pointer;
font-size:13px;
}

.cara{ width: 480px; height:auto; float:left; }

@media screen {
	/*
	* FancyBox - jQuery Plugin
	* Simple and fancy lightbox alternative
	*
	* Examples and documentation at:http://fancybox.net
	* 
	* Copyright (c) 2008 - 2010 Janis Skarnelis
	* That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated.
	* 
	* Version:1.3.4 (11/11/2010)
	* Requires:jQuery v1.3+
	*
	* Dual licensed under the MIT and GPL licenses:
	*   http://www.opensource.org/licenses/mit-license.php
	*   http://www.gnu.org/licenses/gpl.html
	*/

	#fancybox-loading { position:fixed; top:50%; left:50%; width:40px; height:40px; margin-top:-20px; margin-left:-20px; cursor:pointer; overflow:hidden; z-index:1104; display:none }
	#fancybox-loading div { position:absolute; top:0; left:0; width:40px; height:480px; background-image:url('../../../themes/demos/images/fancybox/fancybox.png') }
	#fancybox-overlay { position:absolute; top:0; left:0; width:100%; z-index:1100; display:none }
	#fancybox-tmp { padding:0; margin:0; border:0; overflow:auto; display:none }
	#fancybox-wrap { position:absolute; top:0; left:0; padding:20px; z-index:1101; outline:none; display:none }
	#fancybox-outer { position:relative; width:100%; height:100%; background:#fff }
	#fancybox-inner { width:0; height:0; padding:0; outline:none; position:relative; overflow:hidden; z-index:1102; border:0px solid #fff }
	#fancybox-hide-sel-frame { position:absolute; top:0; left:0; width:100%; height:100%; background:transparent; z-index:1101 }
	#fancybox-close { position:absolute; top:-15px; right:-15px; width:30px; height:30px; background:transparent url('../../../themes/demos/images/fancybox/fancybox.png') -40px 0px; cursor:pointer; z-index:1103; display:none }
	#fancybox-error { color:#444; font:normal 12px/20px Arial; padding:14px; margin:0 }
	#fancybox-img { width:100%; height:100%; padding:0; margin:0; border:none; outline:none; line-height:0; vertical-align:top }
	#fancybox-frame { width:100%; height:100%; border:none; display:block }
	#fancybox-left, #fancybox-right { position:absolute; bottom:0px; height:100%; width:35%; cursor:pointer; outline:none; background:transparent url('../../../themes/demos/images/fancybox/blank.gif'); z-index:1102; display:none }
	#fancybox-left { left:0px }
	#fancybox-right { right:0px }
	#fancybox-left-ico, #fancybox-right-ico { position:absolute; top:50%; left:-9999px; width:30px; height:30px; margin-top:-15px; cursor:pointer; z-index:1102; display:block }
	#fancybox-left-ico { background-image:url('../../../themes/demos/images/fancybox/fancybox.png'); background-position:-40px -30px }
	#fancybox-right-ico { background-image:url('../../../themes/demos/images/fancybox/fancybox.png'); background-position:-40px -60px }
	#fancybox-left:hover, #fancybox-right:hover { visibility:visible; /* IE6 */ }
	#fancybox-left:hover span { left:20px }
	#fancybox-right:hover span { left:auto; right:20px }

	.fancybox-bg { position:absolute; padding:0; margin:0; border:0; width:20px; height:20px; z-index:1001 }
	#fancybox-bg-n { top:-20px; left:0; width:100%; background-image:url('../../../themes/demos/images/fancybox/fancybox-x.png') }
	#fancybox-bg-ne { top:-20px; right:-20px; background-image:url('../../../themes/demos/images/fancybox/fancybox.png'); background-position:-40px -162px }
	#fancybox-bg-e { top:0; right:-20px; height:100%; background-image:url('../../../themes/demos/images/fancybox/fancybox-y.png'); background-position:-20px 0px }
	#fancybox-bg-se { bottom:-20px; right:-20px; background-image:url('../../../themes/demos/images/fancybox/fancybox.png'); background-position:-40px -182px }
	#fancybox-bg-s { bottom:-20px; left:0; width:100%; background-image:url('../../../themes/demos/images/fancybox/fancybox-x.png'); background-position:0px -20px }
	#fancybox-bg-sw { bottom:-20px; left:-20px; background-image:url('../../../themes/demos/images/fancybox/fancybox.png'); background-position:-40px -142px }
	#fancybox-bg-w { top:0; left:-20px; height:100%; background-image:url('../../../themes/demos/images/fancybox/fancybox-y.png') }
	#fancybox-bg-nw { top:-20px; left:-20px; background-image:url('../../../themes/demos/images/fancybox/fancybox.png'); background-position:-40px -122px }
	#fancybox-title { font-family:Helvetica; font-size:12px; z-index:1102 }

	.fancybox-title-inside { padding-bottom:10px; text-align:center; color:#333; background:#fff; position:relative }

	.fancybox-title-outside { padding-top:10px; color:#fff }

	.fancybox-title-over { position:absolute; bottom:0; left:0; color:#FFF; text-align:left }
	#fancybox-title-over { padding:10px; background-image:url('../../../themes/demos/images/fancybox/fancy_title_over.png'); display:block }

	.fancybox-title-float { position:absolute; left:0; bottom:-20px; height:32px }
	#fancybox-title-float-wrap { border:none; border-collapse:collapse; width:auto }
	#fancybox-title-float-wrap td { border:none; white-space:nowrap }
	#fancybox-title-float-left { padding:0 0 0 15px; background:url('../../../themes/demos/images/fancybox/fancybox.png') -40px -90px no-repeat }
	#fancybox-title-float-main { color:#FFF; line-height:29px; font-weight:bold; padding:0 0 3px 0; background:url('../../../themes/demos/images/fancybox/fancybox-x.png') 0px -40px }
	#fancybox-title-float-right { padding:0 0 0 15px; background:url('../../../themes/demos/images/fancybox/fancybox.png') -55px -90px no-repeat }

	/* IE6 */

	.fancybox-ie6 #fancybox-close { background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_close.png', sizingMethod='scale') }

	.fancybox-ie6 #fancybox-left-ico { background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/mages/fancybox/fancy_nav_left.png', sizingMethod='scale') }
	.fancybox-ie6 #fancybox-right-ico { background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_nav_right.png', sizingMethod='scale') }

	.fancybox-ie6 #fancybox-title-over { background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_title_over.png', sizingMethod='scale'); zoom:1 }
	.fancybox-ie6 #fancybox-title-float-left { background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_title_left.png', sizingMethod='scale') }
	.fancybox-ie6 #fancybox-title-float-main { background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_title_main.png', sizingMethod='scale') }
	.fancybox-ie6 #fancybox-title-float-right { background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_title_right.png', sizingMethod='scale') }

	.fancybox-ie6 #fancybox-bg-w, .fancybox-ie6 #fancybox-bg-e, .fancybox-ie6 #fancybox-left, .fancybox-ie6 #fancybox-right, #fancybox-hide-sel-frame { height:expression(this.parentNode.clientHeight + "px") }
	#fancybox-loading.fancybox-ie6 { position:absolute; margin-top:0; top:expression( (-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 :document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop :document.body.scrollTop )) + 'px') }
	#fancybox-loading.fancybox-ie6 div	{ background:transparent; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_loading.png', sizingMethod='scale') }

	/* IE6, IE7, IE8 */

	.fancybox-ie .fancybox-bg { background:transparent !important }

	.fancybox-ie #fancybox-bg-n { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_shadow_n.png', sizingMethod='scale') }
	.fancybox-ie #fancybox-bg-ne { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_shadow_ne.png', sizingMethod='scale') }
	.fancybox-ie #fancybox-bg-e { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_shadow_e.png', sizingMethod='scale') }
	.fancybox-ie #fancybox-bg-se { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_shadow_se.png', sizingMethod='scale') }
	.fancybox-ie #fancybox-bg-s { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_shadow_s.png', sizingMethod='scale') }
	.fancybox-ie #fancybox-bg-sw { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_shadow_sw.png', sizingMethod='scale') }
	.fancybox-ie #fancybox-bg-w { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_shadow_w.png', sizingMethod='scale') }
	.fancybox-ie #fancybox-bg-nw { filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../themes/demos/images/fancybox/fancy_shadow_nw.png', sizingMethod='scale') }
}
.tablelist th, .tablelist td {
padding: 10px 15px;
margin: 1px;
vertical-align: top;
}

.userpage .tablelist {
margin: 5px 0 10px;
}

.tablelist tr:first-child, .tablelist tr.first {
background: #594B3F;
}

.tablelist tr th, .tablelist tr th a, .tablelist tr:first-child td, .tablelist tr:first-child td a, .tablelist tr.first td, .tablelist tr.first td a {
font: 1.6em 'font2', sans-serif!important;
color: #fff;
background-color: #594B3F;
text-align: left;
}

.tablelist tr.odd {
background: #eee;
}

#progress {
background: url(../../../themes/demos/images/ajax-loader.gif) center bottom no-repeat;
padding: 10px 0 20px;
text-align: center;
overflow: hidden;
}

.userpage {
width: 600px;
display: table;
}

#progress h1 {
font: 1.2em font2, sans-serif;
}

.hide {
display: none;
}

.userpage > div.buttonblock {
width: 600px;
}

.tablelist {
margin: 20px 0;
width: 100%;
}

.userpage .tablelist {
margin: 5px 0 10px;
}

.tablelist td input[type="text"] {
width: 90%;
background-color: #fff;
}

.tablelist td.auto {
width: auto;
}

.tablelist th, .tablelist td {
padding: 10px 15px;
margin: 1px;
vertical-align: top;
}

.lagu {
	text-align: left;	
}

.omp {
    width: 198px;
    height: auto;
    position: absolute;
    right: 10px;
    top: -15px;
}

.winner{ width:150px; height:150px; position:absolute; top:-30px; right:-40px;}
.warning {
	font-size: 15px;
	color: red;
	font-weight: bold;
	background-color: white;
	padding: 10px;
}