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

      /* required settings */
      position:relative;
      overflow:hidden;
      width: 440px;
      height:150px;
      float:left;
  }

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

  /*
      a single item. must be floated on horizontal scrolling
      typically this element is the one that *you* will style
      the most.
  */
  div.item {
      text-align: center;
      position: relative;
      float: left;
      width: 100px;
  }

  div.items_image {
      margin-left:10px;
      text-align:center;
      text-transform:uppercase;
  }

  div.items_image img{
/*       height: 100px; */
  }


  /* you may want to setup some decorations to active item */
  div.items div.active {
      border:1px inset #ccc;
      background-color:#fff;
  }
  a.prev {
    background:transparent url(/images/icon/left_carousel.gif) no-repeat scroll 0 0;
    cursor:pointer;
    float:left;
    height:32px;
    width:62px;
  }

  a.next  {
    background:transparent  url(/images/icon/right_carousel.gif) no-repeat scroll 0 0;
    float:left;
    cursor:pointer;
    float:left;
    height:32px;
    width:62px;
  }

  a.disabled  {
    background-image:none;
    float:left;
  }