#videoDiv {
 z-index: 99999999999 ;
}
#playpause {
	float: left;
	width: 51px;
	height: 36px;
	cursor: pointer;
}
.pp_play {
	background: url(../images/seltv/playpause.png) 0 0;
}
.pp_play:hover {
	background: url(../images/seltv/playpause.png) -51px 0px;
}
.pp_pause {
	background: url(../images/seltv/playpause.png) 0px -36px;
}
.pp_pause:hover {
	background: url(../images/seltv/playpause.png) -51px -36px;
}


#loadstatusblock {
	float: left;
	width: 250px;
	height: 40px;
	margin: 2px 0 0 10px;
}

#loadstatus {
	width: 250px;
	height: 10px;
	border: 1px solid #fff;
}

#loadingb {
	width: 0px;
	height: 10px;
	background: #332;
}
#loadingt {
	width: 0px;
	height: 10px;
	background: #b00;
}
#loadstatusdata {
	width: 250px;
	height: 20px;
	margin-top: 5px;
}

#loadstatusdata #timing {
	float: left;
	width: 150px;
	color: #fff;
	font-size: 80%;
	text-align: left;
}

#loadstatusdata #buffering {
	float: right;
	width: 80px;
	color: #fff;
	font-size: 80%;
	text-align: left;
	margin: 0;
}


#volDisplay {
	float: left;
	width: 45px;
	height: 25px;
	margin: 5px 0 0 10px;
}

.volDisplay0 {
	background: url(../images/seltv/volume.png) 0px -125px no-repeat;
}
.volDisplay20 {
	background: url(../images/seltv/volume.png) 0px -100px no-repeat;
}
.volDisplay40 {
	background: url(../images/seltv/volume.png) 0px -75px no-repeat;
}
.volDisplay60 {
	background: url(../images/seltv/volume.png) 0px -50px no-repeat;
}
.volDisplay80 {
	background: url(../images/seltv/volume.png) 0px -25px no-repeat;
}
.volDisplay100 {
	background: url(../images/seltv/volume.png) 0px 0px no-repeat;
}


#volBtnPlus {
	float: left;
	width: 25px;
	height: 25px;
	background: url(../images/seltv/volumebuttons.png) 0px 0px no-repeat;
	margin: 5px 0 0 10px;
	cursor: pointer;
}
#volBtnPlus:hover {
	background: url(../images/seltv/volumebuttons.png) -25px 0px no-repeat;
}
#volBtnPlus:active {
	background: url(../images/seltv/volumebuttons.png) 0px 0px no-repeat;
}

#volBtnMinus {
	float: left;
	width: 25px;
	height: 25px;
	background: url(../images/seltv/volumebuttons.png) 0px -25px no-repeat;
	margin: 5px 0 0 25px;
	cursor: pointer;
}
#volBtnMinus:hover {
	background: url(../images/seltv/volumebuttons.png) -25px -25px no-repeat;
}
#volBtnMinus:active {
	background: url(../images/seltv/volumebuttons.png) 0px -25px no-repeat;
}

.categories {
	float: left;
	height: 20px;
	line-height: 20px;
	padding: 3px 20px 3px 10px;
	background: #d50000 url(../images/seltv/categories_arrow.png) top right no-repeat;
	color: #fff ;
	font-weight: bold;
	margin-right: 15px;
}

#category_list .category_item {
	float: left;
	height: 30px;
	margin: 0 0;
	padding: 3px 15px 0 15px;
	font-weight: bold;
	color: #333;
	cursor: pointer;
}
#category_list .selected{
	background: #333 url(../images/seltv/category_item_bg.png) center bottom no-repeat;
	color: #fff;
}


.scrollable {

	/* required settings */
	position:relative;
	overflow:hidden;
	width: 890px;
	height:100px;

	/* custom decorations */
	margin: 10px 5px 0 5px;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items {
	/* this cannot be too large */
	width:20000em;
	position:absolute;
	clear:both;
}

/* single scrollable item */
.scrollable img.img_vpl {
	float:left;
	margin: 10px 13px 10px 13px;
	cursor: pointer;
	width:100px;
	height:80px;
}
.scrollable img.img_vpl_empty {
	float:left;
	margin: 10px 13px 10px 13px;
	cursor: pointer;
	width:100px;
	height:80px;
}

/* active item */
.scrollable img.active {
	
	margin: 5px 8px 10px 8px;
	border: 5px solid #ddd;
	z-index:9999;
	position:relative;
}

.demotip { 
    display: none; 
    background: transparent url(../images/tooltip/black_arrow.png); 
    font-size:12px; 
    height:70px; 
    width:160px; 
    padding:25px; 
    color:#fff;
    z-index: 9999999999;
}

/* this makes it possible to add next button beside scrollable */
.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.browse {
	display:block;
	width:30px;
	height:30px;
	float:left;
	margin: 45px 0 0 0 ;
	cursor:pointer;
	font-size:1px;
}

/* right */
a.right 				{ background: url(../images/scrollable/arrow/seltv_right.png); clear:right; margin-right: 0px;}
a.right:hover 		{ background-position: 0 -30px; }
a.right:active 	{ background-position: 0 0px; } 


/* left */
a.left				{ background: url(../images/scrollable/arrow/seltv_left.png); margin-left: 0px; } 
a.left:hover  		{ background-position: 0 -30px; }
a.left:active  	{ background-position: 0 0px; }

/* up and down */
a.up, a.down		{ 
	background:url(../images/scrollable/arrow/vert_large.png) no-repeat; 
	float: none;
	margin: 10px 50px;
}

/* up */
a.up:hover  		{ background-position:-30px 0; }
a.up:active  		{ background-position:-60px 0; }

/* down */
a.down 				{ background-position: 0 -30px; }
a.down:hover  		{ background-position:-30px -30px; }
a.down:active  	{ background-position:-60px -30px; } 


/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
} 	


.m_vpl {
	height: 60px;
	margin: 0 5px;
	padding: 5px;
	border-bottom: 1px dotted #191919;
	cursor: pointer;
	font-weight: normal; 
	font-size: 85%;  
	color: #fff;	
}
.m_vpl_selected {
	background: #333;
	font-weight: bold; 
	font-size: 85%;  
	color: #fff;	
}


