/* -------------------------------------------------------
   Reset CSS as described by Eric Meyer:
   http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, button, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
  outline: 0;
}
body {
  line-height: 1;
  color: black;
  background: white;
}

ol, ul {
  list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: separate;
  border-spacing: 0;
}
caption, th, td {
  text-align: left;
  font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
}
blockquote, q {
  quotes: "" "";
}

/* -------------------------------------------------------
   Generals
------------------------------------------------------- */

* { margin:0; padding:0; }
a img { border:none; }
h1, h2, h3, h4, h5, h6 { font-weight:normal; line-height:1.2em; }
strong { font-weight:bold; }
em { font-style:italic; }
p { line-height:1.3em; }
body{ height: 100.01%; }

/* -------------------------------------------------------
  Clearing Issues
------------------------------------------------------- */

/* clearing br */
br.clearbr,
form br {
  clear:both;
  height:0;
  margin:0;
  padding:0;
  font-size: 1px;
  line-height: 0;
}

/* clearing b */
b.c {
	clear: both;
	display: block;
}

/* -------------------------------------------------------
  Aufheben von Floats ohne zusaetzliches Markup
  http://www.jassesnee.de/easyclear/
------------------------------------------------------- */

.clearfix:after {
   content: ".";
   display: block;
   height: 0;
   clear: both;
   visibility: hidden;
}
.clearfix {
   display: inline-block;
}
/* Hides from IE-mac \*/
* html .clearfix {
   height: 1%;
}
.clearfix {
   display: block;
}
/* End hide from IE-mac */


/* -------------------------------------------------------
   Center Page
------------------------------------------------------- */

body {
  text-align:center;
  font-family:Arial, Helvetica, sans-serif;
  background:#fff; }

#webtv_wrap {
	position: relative;
	width: 720px;
	margin: 0 auto;
	text-align:left;
}

/* -------------------------------------------------------
   Links
------------------------------------------------------- */

a:link,
a:visited {
  color:#5f5f5f;
  text-decoration:none;
  }


a:hover {
  text-decoration:underline;
  color:#171717;
  }

a:active {
  }


/* -------------------------------------------------------
   Player
------------------------------------------------------- */

#player #flash {
	width: 720px;
}

/* -------------------------------------------------------
   Body
------------------------------------------------------- */

.browseleft, .browseright {
  display:block;
	width:24px;
	height:77px;
  overflow:hidden;
  text-indent:-9999em;
  position:absolute;
  top:7px;
  z-index:900;
}

.browseright {
  right:-6px;
}

.browseleft {
  left:-6px;
}

a.browseright:link {
	background:url(images/webtv/right.png) 0px 0px no-repeat;
}

a.browseright:visited {
	background:url(images/webtv/right.png) 0px 0px no-repeat;
}

a.browseright:hover {
	background:url(images/webtv/right.png) -24px 0px no-repeat;
}

a.browseright:active {
	background:url(images/webtv/right.png) -48px 0px no-repeat;
}

a.browseleft:link {
	background:url(images/webtv/left.png) -48px 0px no-repeat;
}

a.browseleft:visited {
	background:url(images/webtv/left.png) -48px 0px no-repeat;
}

a.browseleft:hover {
	background:url(images/webtv/left.png) -24px 0px no-repeat;
}

a.browseleft:active {
	background:url(images/webtv/left.png) 0px 0px no-repeat;
}

#playlist #playlisttabs {
	list-style-type:none;
  background:url(images/webtv/head-bg.png) top left repeat-x;
  color:#5f5f5f;
  border-bottom:1px solid #ddd;
  height:24px;
}

#playlist #playlisttabs li {
  display:block;
  background:url(images/webtv/devider.png) top left no-repeat;
	float:right;
  margin:4px 0 0 0;
	padding: 3px 10px 4px 11px;
  font-size:11px;
}

#playlist #playlisttabs li.left {
	float: left;
  background:none;
  padding-left: 30px;
}

#playlist #playlisttabs li.clickable {
	cursor: pointer;
}

#playlist #playlisttabs #autofillselect.selected {
	color: #000;
}

#playlist #playlistcontainer, 
#playlist #playlistmanage {
	width:674px;
	height:101px;
	overflow:hidden;
  margin-left:23px;
  padding-top:3px;
}

#playlist #playlistcontainer {
	position:relative;
}

#playlist #playlistmanage {
	display:none;
}

#playlist #playlistitems, 
#playlistdrag {
	list-style-type:none;
	width:1000px;
	padding:0;
	margin:0;
}

#playlist #playlistitems {
	position:relative;
}

#playlist #playlistitems li p {
  font-family:Tahoma, "Arial Narrow", Arial, Helvetica, sans-serif;
  word-spacing:-1px;
}


#playlist #playlistitems li.playlistitem, 
#playlistdrag li.playlistitem {
	float:left;
	width:100px;
	height:87px;
	padding:5px 6px 6px 6px;
  overflow:hidden;
  font-size:9px;
}

#playlist #playlistitems li.playlistitem.act {
	color:#000;
  border:1px solid #a3a3a3;
  background:#fff;
  padding:4px 5px 5px 5px;
}

#playlist #playlistitems li.playlistitem img.thumb, #playlistdrag li.playlistitem img.thumb {
	width:100px;
	height:75px;
	background:url(images/loading_small.gif) center center no-repeat;
}

#playlistdrag li.playlistitem {
	cursor: move;
	opacity:0.7;
	-moz-opacity:0.7;
	filter:alpha('opacity = 70');
}

#playlist #playlistitems li.playlistitem p, 
#playlistdrag li.playlistitem p {
	height:13px;
  padding-top:1px;
  color:#333;
  overflow:hidden;
  }

#playlist #playlistitems li.playlistitem:hover p {
	color:#000;
  }

#playlist #playlistitems li.playlistitem p.overlay, 
#playlistdrag li.playlistitem p.overlay {
	background:url(images/webtv/overlay.png);
  height:13px;
  line-height:13px;
  width:92px;
  padding: 0 4px;
  color:#cfcece;
  position:relative;
  top:-29px;
  left:0px;
  font-size:9px;
  }

#playlist #playlistitems li.playlistitem p.overlay .rating, 
#playlistdrag li.playlistitem p.overlay .rating {
	float:left;
  }

#playlist #playlistitems li.playlistitem p.overlay .rating img, 
#playlistdrag li.playlistitem p.overlay .rating img {
	position:relative;
  top:2px;
  left:0;
  }

* html #playlist #playlistitems li.playlistitem p.overlay .rating img, 
* html #playlistdrag li.playlistitem p.overlay .rating img,
*+html #playlist #playlistitems li.playlistitem p.overlay .rating img, 
*+html #playlistdrag li.playlistitem p.overlay .rating img {
	position:static;
  }
  
#playlist #playlistitems li.playlistitem p.overlay .time, 
#playlistdrag li.playlistitem p.overlay .time {
  float:right;
  }

#playlistdrag li.playlistitem a.close {
  	display:none;
  }

#playlist #playlistitems li.playlistitem a.close {
  	position:relative;
    top:-104px;
    left:79px;
    display:block;
    width:21px;
    height:20px;
    overflow:hidden;
    text-indent:-999em;
    background:url(images/webtv/close.png) top left no-repeat;
    visibility:hidden;
  }

#playlist #playlistitems li.playlistitem:hover a.close {
  	visibility:visible;
  }

#playlist #playlistitems li.playlistitem a.close:hover {
  	background:url(images/webtv/close.png) bottom left no-repeat;
  }

#playlistdrag li.playlistitem a.play {
  	display:none;
  }

#playlist #playlistitems li.playlistitem a.play {
  	position:relative;
    top:-104px;
    left:31px;
    display:block;
    width:35px;
    height:35px;
    overflow:hidden;
    text-indent:-999em;
    background:url(images/webtv/play.png) top left no-repeat;
    visibility:hidden;
  }

#playlist #playlistitems li.playlistitem:hover a.play {
  	visibility:visible;
  }

#playlist #playlistitems li.playlistitem a.play:hover {
  	background:url(images/webtv/play.png) bottom left no-repeat;
  }

#playlist #playlistitems li.droppable {
	float:left;
	height:90px;
	padding:0;
	margin:0;
}

#playlist #playlistitems li.droppable .highlight {
	width:10px;
	height:90px;
	margin:auto;
}

#playlist #playlistitems li.droppable.over .highlight {
	background:url(images/webtv/inserter.png) center center no-repeat;
}

#playlist #playlistitems li.droppable.firstdroppable .highlight {
	position:absolute;
	left:0;
	top:0;
	width:5px;
}

#playlist #playlistitems li.droppable.lastdroppable .highlight {
	position:absolute;
	right:0;
	top:0;
	width:5px;
}

#playlistdrag {
	height:0;
	width:0;
	overflow:hidden;
}

#contentbrowser {
  font-size:11px;
  border-bottom:1px solid #d0d0d0; 
}

#contentbrowser #browsertabs {
  list-style-type:none;
  background:url(images/webtv/head-bg.png) top left repeat-x;
  color:#5f5f5f;
  border-bottom:1px solid #ccc;
  height:24px;
  margin-top:5px;
  padding-left:27px;
}

#contentbrowser #browsertabs li {
	float: left;
  color:#828282;
  background:#d1d1d1;
	border: 1px solid #bababa;
	padding: 0px 9px 1px 9px;
  margin:2px 3px 0 0;
	cursor: pointer;
  height:20px;
  line-height:20px;
}

#contentbrowser #browsertabs li .loader {
	position:relative;
  top:3px;
  left:2px;
}

#contentbrowser #browsertabs li.act {
	border:1px solid #ccc;
  border-bottom:1px solid #eee;
  height:21px;
  background:url(images/webtv/head-bg.png) top left repeat-x;
  margin-top:1px;
  color:#5f5f5f;
}

#contentbrowser #browsertabs li .loader {
	visibility:hidden;
	margin-left: 5px;
}

#contentbrowser #browsertabs li.notab {
	float: right;
	border:0;
	cursor: default;
  background:none;
  margin-top:3px;
  padding-right:16px;
}

#contentbrowser #browsertabs li.notab.act {
	border:0;
  background:none;
  margin-top:3px;
}

#contentbrowser .contentitems {
	float: left;
	width: 674px;
	list-style-type: none;
  padding-top:4px;
}

#contentbrowser .contentitems li {
	float:left;
	width:74px;
	height:80px;
	padding:5px;
  overflow:hidden;
}

#contentbrowser .contentitems li p {
	font-family:Tahoma, "Arial Narrow", Arial, Helvetica, sans-serif;
  word-spacing:-1px;
  font-size:9px;
  height:12px;
  color:#333;
  overflow:hidden;
}

#contentbrowser .contentitems li:hover p {
  color:#000;
}

#contentbrowser .contentitems li img.thumb {
	width:74px;
	height:54px;
	background:url(images/loading_small.gif) center center no-repeat;
}

#contentbrowser .contentitems li img.thumb.noload {
	background:none;
}

#playlist {
  background:#d4d4d4;
  margin-top:5px;
  border-bottom:1px solid #d0d0d0; }
  
.row { 
 position:relative;
 background:#eeeeee; }
 
.contentcontainer {
  height:86px;
  margin-left:23px;
  overflow:hidden;
  padding-top:4px;
  width:674px;
}

#webtv_footer {
	text-align:center;
}

#webtv_footer a, #webtv_footer span {
  display:inline-block;
  height:1.6em;
  margin:2em 0.5em;
  overflow:hidden;
  text-decoration:none;
  font-size:11px;
}

#contentbrowser #browsertabs li input#searchfield {
  	width:100px;
    font-size:11px;
    height:14px;
    padding-top:2px;
    padding-left:2px;
    line-height:16px;
    border:1px solid #afafaf;
    background:#fff;
    color:#afafaf;
    margin:0 3px 0 5px;
  }

#contentbrowser #browsertabs li.act input#searchfield {
    border:1px solid #a0a0a0;
    background:#fff;
    color:#5F5F5F;
  }

#search-go {
	display:block;
  float:right;
	width:33px;
  height:18px;
  overflow:hidden;
  text-indent:-999em;
  background:url(images/webtv/search.png) 0 0 repeat-x;
  }

#search-go:active {
  background:url(images/webtv/search.png) 0 -18px repeat-x;
  }
  
#loader_search, input#searchfield, #search-go {
    float:left;
  }
  
#contentbrowser .contentitems li p.overlay {
	background:url(images/webtv/overlay-soft.png);
  height:54px;
  line-height:13px;
  width:66px;
  padding: 0 4px;
  color:#cfcece;
  position:relative;
  top:-68px;
  left:0px;
  font-size:9px;
  visibility:hidden;
  }
  
#contentbrowser .contentitems li:hover p.overlay {
  visibility:visible;
  }

#contentbrowser .contentitems li a.play,
#contentbrowser .contentitems li a.enqueue {
  	display:none;
  }


#contentbrowser .contentitems li a.play {
  	position:relative;
    top:12px;
    left:5px;
    display:block;
    width:26px;
    height:25px;
    overflow:hidden;
    text-indent:-999em;
    background:url(images/webtv/play-small.png) top left no-repeat;
  }

#contentbrowser .contentitems li a.play:hover {
  	background:url(images/webtv/play-small.png) bottom left no-repeat;
  }
  
#contentbrowser .contentitems li a.enqueue {
  	position:relative;
    top:-13px;
    left:36px;
    display:block;
    width:26px;
    height:25px;
    overflow:hidden;
    text-indent:-999em;
    background:url(images/webtv/add.png) top left no-repeat;
  }

#contentbrowser .contentitems li a.enqueue:hover {
  	background:url(images/webtv/add.png) bottom left no-repeat;
  }
  
#contentbrowser .rating {
  position:relative;
  display:block;
  height:10px;
  width:66px;
  padding:0 4px;
  overflow:hidden;
  top:-77px;
  left:0;
  background:url(images/webtv/overlay.png);
  }

#nav {
  position:absolute;
  top:6px;
  right:0px;
  list-style:none;
  text-align:right; }
  
  #nav li {
    display:inline;
    }
    
  #nav li a {
    display:inline-block;
    font-size:11px;
    height:1.6em;
    margin:2em 0.5em;
    overflow:hidden;
    text-decoration:none;
    }
 
p.showerror { 
  color:#C00; 
  border:3px solid #C00; 
  padding:12px 20px; 
  font-size:14px; 
  text-align:center;
  font-weight:bold;
  font-family:"Arial Black", Gadget, sans-serif; }
  
div#wrap_sky {
  	position:absolute;
    top:74px;
    left:730px;
    width:auto; }

/* LOAD AND SAVE PLAYLIST */

#playlistmanage {
  color:#5F5F5F;
  font-size:11px;
  text-align:right;
}

#playlistmanage .slide {
  padding:10px;
}

#playlistmanage .slide h3 {
  font-size:12px;
  font-weight:bold;
  color:#333;
  padding-bottom:4px;
}

#playlistmanage .slide p {
  padding:4px;
}

#playlistmanage .slide p input#playlistname_id {
  background:#FFFFFF none repeat scroll 0 0;
  border:1px solid #AFAFAF;
  color:#5F5F5F;
  font-size:11px;
  padding:1px;
  width:140px;
}

#playlistmanage .slide p select#playlistid_id {
  background:#FFFFFF none repeat scroll 0 0;
  border:1px solid #AFAFAF;
  color:#5F5F5F;
  font-size:11px;
  padding:1px;
  width:140px;
}

#playlistmanage .slide p.error {
  padding:1px;
  color:#C33;
}

/* Back to Community Link */

#communitylink {
  	padding-left:19px;
    background:url(images/webtv/backtocommunity.png) top left no-repeat;
  }