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

    /* required settings */
    float:left;
    position:relative;
    overflow:hidden;
    width: 500px;
    height:180px;
    margin:0px;
    margin-left:1px;
    padding:0px;
    /* custom decorations */
    border:0px solid #ccc;
}




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


/* single scrollable item */
.scrollable_bestseller .itemDIV {
    float:left;
    margin:0px;
    background-color:#fff;
    padding-right:12px;
    border:0px solid #ccc;
    cursor:pointer;
    width:150px;
    height:180px;
    
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
}

/* active item */
.scrollable_bestseller .active {
    /*border:2px solid #000;*/
    z-index:9999;
    position:relative;
}



/* prev, next, prevPage and nextPage buttons */
a.browse#bestseller {
    background:url(/skin/frontend/kraxel/default/images/scrollable/hori_large.gif) no-repeat;
    display:block;
    width:20px;
    height:30px;
    float:left;
        display: inline;
    margin:70px 0px;
    cursor:pointer;
    font-size:1px;
position:absolute;left:0;

}

/* right */
a.right#bestseller              { background-position: 0 -30px; clear:right; margin-right: 0px;}
a.right:hover#bestseller        { background-position:-30px -30px; }
a.right:active#bestseller   { background-position:-60px -30px; } 


/* left */
a.left#bestseller               { margin-left: 0px; } 
a.left:hover#bestseller         { background-position:-30px 0; }
a.left:active#bestseller    { background-position:-60px 0; }

/* up and down */

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


.scrollable_bestseller .items .itemDIV {  
    font-size:12px; 
    font-weight:bold; 
    color:#707173; 
    text-decoration:none; 
    }



.start_besteller {
    float:left;
    }

#main .featured .featured_title h1 {background:url(/skin/frontend/kraxel/default/images/bg_related-502.gif) no-repeat;color:#fff;font-size:1.2em;font-weight:bold;padding-left:10px;margin:0;}

.featured {background:url(/skin/frontend/kraxel/default/images/bg_teaser_featured.gif) no-repeat bottom;width:502px;position:relative;padding-bottom:5px;float:left;}
.featured .scrollablebuttonright {height:180px;top:25px;width:20px;right:1px;}
.featured .scrollablebuttonleft {height:180px;top:25px;width:20px;left:1px;}
.featured .related-product h5 {font-size:12px;padding-left:10px;}
.featured .related-product .price-box {font-size:11px;padding-left:5px;}
.featured .related-product img {margin-left:20px;}
.featured .related-product .product-image {height:120px;}
