/*
  root element for the scrollable.
  when scrolling occurs this element stays still.
*/
.scrollable {

  /* required settings */
  position:relative;
  overflow:hidden;
  width: 795px;
  height:220px;
  margin-top: 20px;
  padding-left: 10px;
  /* custom decorations */
  border:1px solid #ccc;
  background-color: #f5f5f5;
  /*background:url(../img/h300.png) repeat-x;*/
}

/*
  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 #thumbs {
  /* this cannot be too large */
  width:20000em;
  position:absolute;
  clear:both;
}

/* single scrollable item */
.scrollable div#thumbs div {
  float:left;
  margin: 20px 7px 20px 7px;
  background: transparent url(../img/bg_mediathek_listview_item.png) no-repeat;
  padding: 14px;
  width:120px;
  height:160px;
}
div#mediathek_listview div#thumbs img { 
  width: 120px;
  height: 90px;
  margin-bottom: 10px; 
}
div#mediathek_listview div#thumbs div a {
  font-size: 11px;
  line-height: 14px;
  color: #3290ba;
  text-decoration: none;
  font-weight: bold;
}

div#mediathek_listview div#thumbs a:hover {color: #004b7d;}
div#mediathek_listview div#thumbs div span.subtitle {
  font-size: 11px;
  line-height: 21px;
  color: #999999;
}