/**
 *  Ein dynamisch anpassendes DIV-Objekt, dass sowohl horizontal, 
 *  als auch vertikal scrollen kann. Breite und Höhe des DIV sind 
 *  konfigurierbar und die Höhe der vertikalen Scrollbar kann auch
 *  kürzer sein, als der Inhalt.
 *
 *  @date   22.04.2005
 *  @notice Diese Datei (scrollbar.css) sowie "scrollbar.js" und "scrollbar.html" 
 *          dürfen nur mit dem ausgelieferten Produkt verwendet werden. Eine Verwendung
 *          in anderen Projekt-Seiten ist nur mit schriftlicher Genehmigung zulässig.
 */

div#sbHolder
{
    position: relative;
    overflow: hidden;
    left: 10px;
    width: 600px;
    height: 130px;
    border: 0px;
    margin: 0px;
    padding: 0px;
}

/* height = sbContainer.style.height */
div#sbContent
{
    position: relative; 
    border: 0px;
    margin: 0px;
    padding: 0px;
}

div#sbContainer
{
    position: absolute;
    overflow: hidden;
    width: 500px;
    height: 115px;
    left: 50px;
    border: 0px;
    margin: 0px;
    padding: 0px;
}
/* top = sbContainer.style.height + "AbstandOben" */
div#sbHorizontal
{
    position: absolute;
    width: 500px;
    height: 10px;
    top: 120px;
    left: 50px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    visibility: hidden;
}
/* height kleiner od. = sbContainer.style.height */
/* left = sbContainer.style.left + sbContainer.style.width + "AbstandLinks" */
div#sbVertical
{
    position: absolute;
    width: 10px;
    height: 115px;
    top: 0px;
    left: 555px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    visibility: hidden;
}
div#sbhLeft
{
    position: absolute;
    z-index: 30;
    width: 8px;
    height: 10px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    background: url(sbbilder/sbhleft.gif) no-repeat;
}

/* width = sbHorizontal.style.width - sbhRight.style.width - sbhLeft.style.width */
/* left = sbhLeft.style.width */
div#sbhBg
{
    position: absolute;
    z-index: 28;
    top: 0px;
    left: 8px;
    width: 484px;
    height: 10px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    background: url(sbbilder/sbhbg.gif) repeat-x;
}

/* left = sbhLeft.style.width */
div#sbhSlider
{
    position: absolute;
    z-index: 29;
    top: 0px;
    left: 0px;
    width: 8px;
    height: 10px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    background: url(sbbilder/sbhslider.gif) no-repeat;
}

/* width = sbHorizontal.style.width - this.width */
div#sbhRight
{
    position: absolute;
    z-index: 30;
    top: 0px;
    left: 492px;
    width: 8px;
    height: 10px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    background: url(sbbilder/sbhright.gif) no-repeat;
}
div#sbvUp
{
    position: absolute;
    z-index: 30;
    top: 0px;
    left: 0px;
    width: 10px;
    height: 8px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    background: url(sbbilder/sbvup.gif) no-repeat;
}

/* height = sbVertical.style.height - sbvUp.style.height - sbvDown.style.height */
/* top = sbvUp.style.height */
div#sbvBg
{
    position: absolute;
    z-index: 28;
    top: 8px;
    left: 0px;
    width: 10px;
    height: 99px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    background: url(sbbilder/sbvbg.gif) repeat-y;
}
/* top = sbvUp.style.top */
div#sbvSlider
{
    position: absolute;
    z-index: 29;
    top: 0px;
    left: 0px;
    width: 10px;
    height: 8px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    background: url(sbbilder/sbvslider.gif) no-repeat;
}

/* top = sbVertical.style.height - this.height */
div#sbvDown
{
    position: absolute;
    z-index: 30;
    top: 107px;
    left: 0px;
    width: 10px;
    height: 8px;
    border: 0px;
    margin: 0px;
    padding: 0px;
    background: url(sbbilder/sbvdown.gif) no-repeat;
}