/**
 * CSS for XHTML layout
 * created by Michal Luberda
 */

body, h1, h2, h3, h4, h5, h6, p, ul, li, ol, a {}

/* hidden element */
.div_id,
.div_timebased,
.div_videoid,
.div_bitrate,
.div_url,
.div_transcript,
.div_commentid,
.div_type,
.div_playlist,
.div_imageset,
.div_length,
#div_submenu .li_video,
#div_submenu .li_channel .div_description,
#div_menu .ul_channel li {
	display: none;
}

.ul_menu .div_name {display:none}
.ul_channel .div_name {display:block}

#div_carousel .div_description {display:none}

/* main container */
#div_container {
}

.hide {display:none}

body {
	margin:0px;
	padding:0px;
	background-color:black;
}

ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

li {
	display: inline;
	padding: 0;
	margin: 0;
}

#div_tv {position:absolute; left:300px; top:155px;}

#div_container {
	position:absolute;
	width:988px;
	left:50%;
	margin:10px 0px 0px -498px;
	background:white;
	background:black url(../gfx/top.png) top left no-repeat;
	}
	
#div_header {
	position:absolute;
	left:400px;
	top:0px;
}

#div_header ul  li{
	float:left;
}

	
#div_header a {
	color:#444444;
	text-decoration:none;
	font-family:"Trebuchet MS",Arial,sans-serif;
	font-size:14px;
	padding:0px 8px;
}

#div_header a:hover {
	color:#ee0400;
}

#div_onair {
	width: 142px;
	height: 105px;
	background: #000 url(../gfx/onair_off.png) no-repeat 0 0;
	position: absolute;
	left: -90px;
	top: 3px;
}

#div_onair img{
	border:0px;
}


#div_menu .ul_channel {
	position:absolute;
	left:200px;
	top:115px;
}

#div_menu .ul_channel li{
	float:left;
	padding-right:5px;
}

#div_submenu {
	position:relative;
	top:147px;
	width:250px;
	height:300px;
	margin:0px 0px 0px 26px;
	padding: 40px 0px 0px 10px;
	border-left:2px solid #2a2a2a;
}

#div_submenu li.li_category {

}

#div_submenu a {
	display:block;
	width:213px;
	height:28px;
	padding:3px 0px 0px 0px;
	margin:0px 0px 6px 0px;
	background-image:url(../gfx/leftbutton.png);
	background-position:0 0px;
	font-family:"Trebuchet MS",Arial,sans-serif;
	font-size:20px;
	color:white;
	text-align:center;
	text-decoration:none;
}

#div_submenu a:hover, #div_submenu a.active {
	background-position:0 -31px;
}

#div_submenu a:hover{
	color:#ff0003;
}

#onair {
	position:absolute;
	left:390px;
	top:7px;
}

a {
    outline:none;
}

#div_carousel{
	position:absolute;
	top:502px;
	left:0px;
	width:940px;
	height:105px
}

#ul_carousel {
	width:940px;
	height:105px
}

#ul_carousel .div_name {
	width:112px;
	height:100px;
	overflow:hidden;
}

#div_carousel a{
	float:left;
    width: 111px;
    height: 84px;
	color:white;
	text-decoration:none;
	background:black url(../css/carousel/thumb_off.png) top left no-repeat;
}

#div_carousel a:hover, #div_carousel a.active {
	background:black url(../css/carousel/thumb_on.png) top left no-repeat;
}

	
#div_carousel li img{border:0px; margin:3px 0px 0px 0px}

div#footer_boxes {
	position: absolute;
	left: 25px;
	top: 610px;
}

#div_footer {
	font-family:arial;
	font-size:11px;
	text-align:center;
	color:white;
	position: absolute;
	width:970px;
	left: 0;
	top: 240px;
}

/* selected videos */

td.mid {border-top:2px solid #231F1F; border-bottom:2px solid #231F1F; vertical-align:top}

#le_iene {
	position:absolute;
	left:0px;
	top:0px;
	width:205px;
	}

#le_iene .box {
	width:200px;
	height:100px;
	padding:0px;
}

#le_iene .box b { 
	display:block;
	font-family:"Trebuchet MS",Arial,sans-serif;
	font-size:18px;
	color:white;
	text-align:center;
	padding:4px 0px;
}
	
#live_show {
	position:absolute;
	left:230px;
	top:0px;
	width:478px;
	}

#live_show img {
	float:left;
}
	
#live_show .box {
	width:177px;
	height:133px;
	margin-top:0px;
	float:left;
}	
	
	
#backstage {
	position:absolute;
	left:725px;
	top:0px;
	width:210px;
	}

#div_videos_2 {
	height:136px;
	}

#div_videos_3 {
	height:85px;
	padding-left:10px;
	}

	
#div_videos_2 a, #div_videos_3 a {
	display:block;
	width:154px;
	height:23px;
	padding:1px 0px 0px 0px;
	margin:0px 0px 3px 0px;
	background-image:url(../gfx/footerbutton.png);
	background-position:0 0px;
	font-family:"Trebuchet MS",Arial,sans-serif;
	font-size:16px;
	color:white;
	text-align:center;
	text-decoration:none;
}

#div_videos_2 a:hover, #div_videos_2 a.active, #div_videos_3 a:hover, #div_videos_3 a.active {
	background-position:0 -24px;
}

#div_videos_2 a:hover, #div_videos_3 a:hover{
	color:#ff0003;
}


.smallbox {
	position:absolute;
	width:214px;
	height:84px;
	background: black url(../gfx/smallbox-bg.png) no-repeat;
	text-align:center;
	padding-top:6px;
}

.smallbox img {border:0px}

#box1 {
	left:0px;
	top:150px;
}

#box2 {
	left:240px;
	top:150px;
}

#box3 {
	left:480px;
	top:150px;
}

#box4 {
	left:721px;
	top:150px;
}

/* carousel */

/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 75px;
    height: 75px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}

/* end of carousel */

/* buttons */

#div_menu .div_name a {
	display:-moz-inline-box;
	display:inline-block;
	cursor:pointer;
	border:none;
    font-size:0;
    line-height:0;
    
	/*
	for Safari, read this first
	http://creativebits.org/webdev/safari_background_repeat_bug_fix
	*/
	background-position:0 0;
	background-repeat:no-repeat;
	height:30px;
	text-decoration:none;
	font-style:normal;
	margin:0 6px 0px 0;
	padding:0 5px 0 0;	/* AD/2 */
	vertical-align:middle;	
    padding-top:-2px;
	_position:relative;
	_width:10px;	
	_overflow-y:hidden;
}

#div_menu .div_name a, #div_menu .div_name a span {
    background-image:url(../gfx/form_buttons.png);
}

#div_menu .div_name a span {
	white-space:nowrap;
	cursor:pointer;
    color:white;
	display:-moz-inline-box;
	display:inline-block;
	line-height:1.2;
    letter-spacing:0 !important;
    font-family:"Trebuchet MS",Arial,sans-serif !important;
    font-size:14px !important;
    font-style:normal;    
    background-color:transparent;
	background-position:100% 0;
	background-repeat:no-repeat;
	height:24px;
	padding:6px 10px 0 1px;/* AD/2 */
	margin:0 -16px 0 10px;
	border:none;
	vertical-align:text-top;
	zoom:1;
	_position:relative;
    _padding-left:0px;
	_padding-right:6px;/* AD/2 */
	_margin-right:-10px;
	_display:block;
	_top:0;
	_right:-5px;
	
}

html.safari #div_menu .div_name a span {
  line-height:1.3;
}

/*Hover Style*/

#div_menu .div_name a:hover, #div_menu .div_name a:focus, a.active, #div_menu .li_channel_selected .div_name a {
	background-position:0 -60px;
	text-decoration:none;
}

#div_menu .div_name a:hover span, #div_menu .div_name a:focus span {
	background-position:100% -60px;
	color:#ff0003;
}

a.active span, #div_menu .li_channel_selected .div_name a span {
	background-position:100% -60px;
}

/* end of buttons */

/* scrollpane */


.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: transparent url(../gfx/track.png) repeat-y center;
}
.jScrollPaneDrag {
	position: absolute;
	background: #666;
	cursor: pointer;
	overflow: hidden;
	background: transparent url(../gfx/slider.png) no-repeat;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}