
@font-face {
   font-family: "Compacta";
  	src: url('../fonts/CompactaBTBlack.ttf');
    font-weight: 100;
    font-style: normal;	                          
}

@font-face {
    font-family: 'molotregular';
    src: url('../fonts/Molot-webfont.eot');
    src: url('../fonts/Molot-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Molot-webfont.woff') format('woff'),
         url('../fonts/Molot-webfont.ttf') format('truetype'),
         url('../fonts/Molot-webfont.svg#molotregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

body {
	border: 0px;
	padding: 0px;
	background-color:#000000;

	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
}

img {
	border:none;
}

td {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #ffffff;
	line-height:140%;
}

/* L I N K S */

a:link {
	/*font-size: 12px;*/
	color: #ffffff;
	text-decoration: none;
}

a:active {
/*	font-size: 12px;*/
	color: #ffffff;
	text-decoration: none;
}

a:visited {
	/*font-size: 12px;*/
	color: #ffffff;
	text-decoration: none;
}

a:hover {
/*	font-size: 12px;*/
	color: #ffffff;
	text-decoration: none;
}

/* F R O N T E N D */

#frontend {
	position:absolute;
	left:40px;
	top:0px;
	width:968px;
}

/* H E A D E R */

#header {
	margin-top:0px;
	height:50px;
	width:100%;
}

#header_logo {
	float:left;
}

#header_menu {
	float:right;
	margin-top:22px;
}
/* M E N U */

#menu {
	margin-top:0px;
	height:80px;
	width:100%;
}

#menu_buttons {
	background-color: #0F0F0F;
    display: block;
    float: left;
    height: 30px;
    margin-left: 27px;
    margin-top: 19px;
    width: 390px;
}

#menu_title {
	float:left;
	margin-top:23px;
}

#menu_rss {
	float:right;
	margin-top:36px;
	margin-left:10px;
}

#menu_suche {
	margin-top:33px;
	margin-left: 15px;
	float:left;
}

#menu_line {
	margin-top:0px;
	width:100%;
	display:none;
}

/* C O N T E N T */

#content {
	margin-top:0px;
	width:968px;
}

#contentBackground {
	color:#ffffff;
	background-color:#454545;
	width:100%;
	height:100%;
}

.contentBackground {
	color:#ffffff;
	background-color:#454545;
	width:100%;
	height:100%;
}

#contentBackgroundVideos {
	color:#ffffff;
	background-color:#454545;
	width:100%;
	height:100%;
}

.contentBackgroundBlack {
	color:#ffffff;
	background-color:#000000;
	width:100%;
	height:100%;
}
	
.contentBackgroundGray {
	color:#ffffff;
	background-color:#141414;
	width:100%;
	height:100%;
}

.contentHeadline {
    font-size: 14px;
    font-weight: Bold;
	line-height:120%;
}

.contentHeadlineVideos {
	font-size: 14px;
	font-weight: Bold;
	padding-top: 7px;
	padding-left: 5px;
}
	
.contentBoldWhite {
	color:#ffffff;
	font-weight:bold;
}

.contentBoldYellow {
    color:#ffea1b;
    font-weight:bold;
}

.contentBoldGray {
	color:#454545;
	font-weight:bold;
}

.contentWhite {
	color:#ffffff;
}

.contentYellow {
    color:ffea1b;
}

.contentGray {
	color:#454545;
}

.contentThumbnailComments {
	height:14px;
	width:20px;
	display:block;
	font-size:9px;
	color:#FFEA1B;
	padding-left:1px;
	padding-right:1px;
	left:88px;
	top:64px;
	position:relative;
	text-align:center;
}

.contentThumbnailVideoComments1 {
	height:14px;
	width:20px;
	display:block;
	font-size:9px;
	color:#FFEA1B;
	padding-left:1px;
	padding-right:1px;
	left:88px;
	top:48px;
	position:relative;
	text-align:center;
}

.contentThumbnailVideoComments2 {
	height:14px;
	width:20px;
	display:block;
	font-size:9px;
	color:#FFEA1B;
	padding-left:1px;
	padding-right:1px;
	left:258px;
	top:143px;
	position:relative;
	text-align:center;
	}


.contentEvent td{
	background-color: #ffffff !important;
	color: #141414 !important;	
}

.halle .contentEvent td{
	background-color: #454545!important;
	color: #ffffff!important;	
}

.contentEvent a{
	color: #141414;	
}

.halle .contentEvent a {
	color: #ffffff;
}

.contentEvent .contentBoldWhite{
	color: #141414 !important;	
}

.halle .contentEvent .contentBoldWhite {
	color: #ffffff !important;
}

.cafe .contentEvent .contentHeadline{
	color: #141414 !important;	
}

/* P R O G R A M M */
	
#programmCalendar {
	position:relative;
	left:-17px;
	width:1003px;
	height:440px;
}

#programmMonth {
	position:relative;
	left:-17px;
	width:1000px;
	height:130px;
}

#programmBottom {
	margin-top:10px;
}

#programmBottomContent {
	margin-top:10px;
	height:475px; /*305;*/
}

#programmWatchList {
	float:left;
	margin-right:7px;
	width:211px;
	height:100%;
}

#programmVideosPics {
	float:left;
	margin-right:7px;
	width:363px;
	height:100%;
	background-color:#660066;
}

#programmYoutube {
	float:left;
	width:750;
	height:100%;
}

#programmNewsList {
	float:right;
	width:380px;
	height:100%;
}

/* V O T I N G */

#voting {
	float:left;
	background-color:#454545;
	border:solid 1px #ffffff;
	
	height:15px;
	width:30px;
	
	text-align:center;
}

#voting_border {
	float:left;
	background-color:#000000;
	border:solid 1px #ffffff;
	
	padding:2px;
	
	margin-left:-1px;
	margin-right:-1px;
	
	width:300px;
	height:10 px;
	
	font-size:1px;
	line-height:0px;
}

#voting_bar {
	background-color:#ffea1b;
	height:11px;
}

/* F O O T E R */

#footer {
	margin-top:15px;
	width:100%;
}

/* F O R M */

select {
	border: 1px solid #666;
	height: 19px;
	min-width: 40px;
}

option {
	font-family: Arial, Helvetica, sans-serif;
	text-transform: none;
	font-size: 12px;
	padding-top: 4px;
	height:18px;
}

input {
	color: #000000;
	border: 1px solid #666;
	padding-left: 3px;
	height:17px;
}

.file {
	border: 1px solid #666;
}

input:active,
input:focus,
select:active,
select:focus {
   background-color: #FFF;
}

textarea {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	border: 1px solid #666;
}

/* PROGRAMM CALENDAR */


.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.ie7 .clearfix {
    *zoom: 1;
}


.programm-btn{
	width: 15px;
	height: 165px;	
	float: left;	
	cursor:pointer;
	margin-top: 222px;
}

#btn-right{
	background-image: url("../images/arrow-right.png");	
	margin-left: 5px;
}

#btn-right:hover{
	background-image: url("../images/arrow-right-hover.png");	
}

#btn-right:active{
	background-image: url("../images/arrow-right.png");	
}

#btn-left{
	background-image: url("../images/arrow-left.png");
	margin-right: 5px;
}

#btn-left:hover{
	background-image: url("../images/arrow-left-hover.png");
}

#btn-left:active{
	background-image: url("../images/arrow-left.png");
}


#programmCalendar{
	width: 1003px;
	height: 620px;	
}

.calendar-box{
	background-color: #141414; 
	width: 122px;
	height: 540px;	
	float: left;
	margin-left: 3px;
	margin-top: 35px;
	cursor: pointer;
}

.calendar-box.first{
	margin-left:0px;
}	

.calendar-box:not(.active):hover{
	background-color: #454545;	
}

.calendar-box:not(.active):hover .calendar-box-halle .event-headline{
	background-color: #ffea1b;	
}

.calendar-box:not(.active):hover .trenner{
	background-image: url("../images/trenner-hover.png");	
}

.calendar-box-halle, .calendar-box-cafe{
	height: 270px;
	display: block;
	cursor: pointer;
}

.calendar-box.active .calendar-box-halle,  
.calendar-box.active .calendar-box-cafe{
/*	height: 310px;*/
	height: 309px;
	position: relative;	
}

.calendar-box-cafe {
	background: #ffffff;
	padding-top: 8px;
}

.active .calendar-box-cafe {
	padding-top: 0px;
}

.calendar-box-cafe .event-details,
.calendar-box-cafe .event-desc {
	color: #000000;
}

/*
.calendar-box-cafe .event-details {
	color	
}
*/

.calendar-box.monday{
	margin-left: 0px;	
}

.calendar-box.active{
	background-color: #454545;
	width: 210px;
	height: 620px;	
	margin-top: 0px;
}

.event-headline{
	background-color: #ffffff;
	height: 25px;
	line-height:25px;
	margin-bottom: 10px;
	font-size: 15px;
	font-weight: bold;
	color: #000000;
}

.calendar-box.active .event-headline{
	background-color: #ffea1b;	
	
}

.event-headline-left, .event-headline-left-active{

	float: left;
	margin-left: 3px;
}


.event-headline-left-active{
	display: none;	
}

.event-headline-right{
	float: right;
	margin-right: 3px;
}

.event-headline-icon-right{
	display: none;
	float: right;
	margin-right: 3px;	
}

.active .calendar-box-halle .event-headline-left{
	display: none;
	
}

.active .calendar-box-halle .event-headline-left-active{
	display: block;
	
}

.active .calendar-box-halle .event-headline-right{
	display: none;
	
}

.active .calendar-box-halle .event-headline-icon-right{
	display: block;
	
}

.event-pic{
	display: none;
	float: left;	
}

.calendar-box.active .event-pic{
	display: block;	
}

.calendar-box.active .event-pic.empty{
	display: none;	
}



.calendar-box-cafe .event-headline{
	display:none;
}

.calendar-box.active .calendar-box-cafe .event-headline{
	display:block;
}

.event-desc{
	padding: 0 3px 0px 10px;
    overflow: hidden;
}

.event-text{
	font-size: 11px;	
}

.calendar-box.active .event-desc{
	float: left;
	height: 175px;	
	width: 107px;
	
}

.calendar-box.active .event-desc.empty{
	width: 180px;
}


.calendar-box.double .event-desc{
	height: 120px;	
}

.calendar-box.double.active .event-desc{
	height: 138px;	
}


.calendar-box.double.active .event-text{
	display: none;	
}

.event-name{
	font-size: 14px;
	text-transform: uppercase;
	margin-bottom: 10px;
	font-weight: bold;	
}

.event-details{
	display: none;
	font-size: 11px;	
}

.calendar-box.active .event-details{
	bottom: 5px;
    display: block;
    position: absolute;
	left: 0px;
}

.calendar-box.active.double .event-details{
	display: block;
	position: relative;
   
}

.black-bg{
	clear:both;
    background-color: #000000;
    display: block;
    float: left;
    margin-bottom: 2px;
    padding: 1px 4px;
    text-transform: uppercase;
    width: 50px;
	color: #ffffff;
}

#start-time, #price{
	float: left;
    margin-left: 10px;
    width: 140px;	
}

.calendar-box.double.active #start-time, 
.calendar-box.double.active #price{
	width: 87px;	
}

.trenner{
	background-image: url("../images/trenner.png");
	background-repeat:repeat-x;
	height: 2px;
	width: 100%;	
/*	margin-bottom: 10px;*/
	margin-bottom: 2px;
}

.calendar-box.active .trenner{
	display: none;	
}


/* PROGRAMM MONTH */


#programmMonth{
	width: 1000px;
	height: 90px;	
}

.calendar-month-box{
	background-color: #141414;
	width: 21px;
	height: 65px;
	float: left;
	margin-left: 2px;
	cursor: pointer;
	display: block;	
}

.calendar-month-box:hover{
	background-color: #454545;	
}

.calendar-month-box:hover .headline{
	background-color: #ffea1b;	
}



.calendar-month-box.first{
	margin-left: 0px;	
}

.calendar-month-box.similar{
	width: 119px;	
}

.calendar-month-box.active{
	width: 50px;
	background-color: #454545; 	
}

.programm-month-btn{
	float: left;
	width: 15px;
	height: 50px;
	cursor: pointer;
	margin-top: 7px;	
}

#btn-month-left{
	background-image: url("../images/arrow-left-small.png");
	margin-right: 2px;	
}

#btn-month-left:hover{
	background-image: url("../images/arrow-left-hover-small.png");
}

#btn-month-left:active{
	background-image: url("../images/arrow-left-small.png");	
}

#btn-month-right{
	background-image: url("../images/arrow-right-small.png");
	margin-left: 2px;	
}

#btn-month-right:hover{
	background-image: url("../images/arrow-right-hover-small.png");
}

#btn-month-right:active{
	background-image: url("../images/arrow-right-small.png");
}

.headline{
	background-color: #ffffff;
	color: #000000;
	font-weight: bold;
	font-size: 10px;	
	text-transform: uppercase;
	height:15px;
}

.active .headline{
	background-color: #ffea1b;
}

.calendar-month-box-content{
	display: block;
	padding: 4px;
	text-transform: uppercase;
	font-size: 11px;
	font-weight: bold;	
}

.calendar-month-box-content-active{
	display: none;	
	text-transform: uppercase;
	font-size: 11px;
	font-weight: bold;	
}

.active .calendar-month-box-content-active{
	display: block;	
}

.active .calendar-month-box-content{
	display: none;	
}

.icon-active-day{
	margin-left: 5px;
	margin-top: 15px;	
}

.calendar-month-box .event-headline-left{
	float: none;
}

.calendar-month-box .event-headline-right{
	display:none;
}

.calendar-month-box.similar .event-headline-left{
	float: left;
}

.calendar-month-box.similar .event-headline-right{
	display:block;
	
}

.eventTitle{
	background-color: #454545;
    font-family: "Compacta",Helvetica,Arial,sans-serif;
    font-size: 35px;
    font-weight: 100;
    line-height: 55px;
    margin-bottom: 1px !important;
    padding: 0 15px;
	margin-top: 1px;
}

.eventDate{
	font-size: 	20px;
	line-height: 20px;
	margin-right: 14px;
}


.ie7 .blackline, .ie8 .blackline{
	display: none;	
}

.social-button{
	float: left;
	margin-right: 10px;
	margin-top: 15px;	
}

.youtube-btn{
	background-image: url("../images/btn-youtube-long.png");
	width: 46px;
	height: 21px;
	display: block;
		
}

.youtube-btn:hover{
	background-image: url("../images/btn-youtube-long-hover.png");
		
}


.itunes-btn{
	background-image: url("../images/btn-itunes.png");
	width: 64px;
	height: 21px;
	display: block;
		
}

.itunes-btn:hover{
	background-image: url("../images/btn-itunes-hover.png");
		
}

.facebook-btn{
	background-image: url("../images/btn-facebook.png");
	width: 21px;
	height: 21px;
	display: block;
		
}

.facebook-btn:hover{
	background-image: url("../images/btn-facebook-hover.png");
		
}

.spotify-btn{
	background-image: url("../images/btn-spotify-long.png");
	width: 59px;
	height: 21px;
	display: block;
		
}

.spotify-btn:hover{
	background-image: url("../images/btn-spotify-long-hover.png");
		
}

.website-btn{
	background-image: url("../images/btn-website.png");
	width: 21px;
	height: 21px;
	display: block;
		
}

.website-btn:hover{
	background-image: url("../images/btn-website-hover.png");
		
}

.artist-archive-pic{
	width: 590px;
	height: auto;	
}

.press-pic{
	margin-right:10px;
	margin-bottom:10px;	
}

.press-text{
	
}

.spacer{
	height: 25px;	
}


#scrollbar1 { width: 95%; clear: both; margin: 0px 4px; }
#scrollbar1 .viewport { width: 97%; height: 440px; overflow: hidden; position: relative; }
#scrollbar1 .overview { list-style: none; position: absolute; left: 0; top: 0; width: 100%; }
#scrollbar1 .thumb .end,
#scrollbar1 .thumb { background-color: #141414; }
#scrollbar1 .scrollbar { position: relative; float: right; width: 6px; }
#scrollbar1 .track { background-color: #454545; height: 100%; width:6px; position: relative; padding: 0 1px; }
#scrollbar1 .thumb { height: 20px; width: 6px; cursor: pointer; overflow: hidden; position: absolute; top: 0; }
#scrollbar1 .thumb .end { overflow: hidden; height: 5px; width: 13px; }
#scrollbar1 .disable{ display: none; }
.noSelect { user-select: none; -o-user-select: none; -moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; }

.rightContent #scrollbar1 { width: 96%;}
.rightContent #scrollbar1 .scrollbar { width: 8px;}
.rightContent #scrollbar1 .track { width: 8px;}
.rightContent #scrollbar1 .thumb { width: 8px;}
