/* Fullscreen mode */
/*

.wrapperEl{
	width: 100%;
	height: 100%;
}

body {
	overflow: hidden;
}
*/

/* Standart mode */
.wrapperEl{
    overflow: hidden;
    width: 296px;
    height: 230px;
    position: relative;
}

.tambour{
    width: 24px;
    height: 24px;
    background: red;
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    background: url(/images/scroller/tambour.gif) no-repeat;
}

.contentEl{
    overflow: hidden;
    /*position:absolute;*/
    zoom: 1;
}

.greyEl{
    background: #fff;
    position: absolute;
    visibility: visible;
    opacity: 0.7;
    filter: alpha(opacity=70);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=70)";
    width: 100%;
    height: 100%;
}

.scrollVertical{
    font-size: 0px; /* for IE6 */
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 19px;
}

.topBtn{
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 19px;
    height: 17px;
    background: url(/images/scroller/topBtn.gif) no-repeat 0 -34px;
    cursor: pointer;
}

.topBtn-Highlighted{
    background: url(/images/scroller/topBtn.gif) no-repeat 0 -17px;
}

.topBtn-Active{
    background: url(/images/scroller/topBtn.gif) no-repeat 0 0;
}

.downBtn{
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 19px;
    height: 17px;
    background: url(/images/scroller/downBtn.gif) no-repeat 0 -34px;
    cursor: pointer;
}

.downBtn-Highlighted{
    background: url(/images/scroller/downBtn.gif) no-repeat 0 -17px;
}

.downBtn-Active{
    background: url(/images/scroller/downBtn.gif) no-repeat 0 0;
}

.scrollBarVertical{
    display: block;
    position: absolute;
    top: 17px;
    right: 0;
    bottom: 17px;
    width: 19px;
    background: url(/images/scroller/scrollBarVertical.gif) repeat-y center top;
    padding: 0;
}

.scrollHandleVertical{
    cursor: pointer;
    display: block;
    position: absolute;
    top: 0;
    right: 0px;
    _right: -1px;
    width: 19px;
    cursor: pointer;

}

.scrollBarVertical-Active .scrollHandleVertical{
}

.scrollHandleBGVertical{
    background: transparent url(/images/scroller/scrollHandleBGVertical.gif) no-repeat center;
    display: block;
    position: relative;
    width: 19px;
    top: 0;
    bottom: 0;
}

.scrollBarVertical-Highlighted .scrollHandleBGVertical{
}

.scrollBarVertical-Active .scrollHandleBGVertical{
}

.scrollHandleMiddleVertical{
    display: block;
    position: absolute;
    width: 19px;
    height: 10px;
    background: url(/images/scroller/scrollHandleMiddleVertical.gif) no-repeat 0 0;
    top: 50%;
    margin: -7px 0 0 0;
}

.scrollBarVertical-Highlighted .scrollHandleMiddleVertical{
    background: url(/images/scroller/scrollHandleMiddleVertical.gif) repeat-y -38px 0;
}

.scrollBarVertical-Active .scrollHandleMiddleVertical{
    background: url(/images/scroller/scrollHandleMiddleVertical.gif) repeat-y -19px 0;
}

.scrollHandleTop{
    display: block;
    position: relative;
    width: 19px;
    height: 2px;
    background: url(/images/scroller/scrollHandleTop.gif) no-repeat 0 0;
}

.scrollBarVertical-Highlighted .scrollHandleTop{
    background: url(/images/scroller/scrollHandleTop.gif) no-repeat -19px 0;
}

.scrollBarVertical-Active .scrollHandleTop{
    background: url(/images/scroller/scrollHandleTop.gif) no-repeat -38px 0;
}

.scrollHandleDown{
    display: block;
    position: relative;
    width: 19px;
    height: 2px;
    background: url(/images/scroller/scrollHandleDown.gif) no-repeat 0 0;
}

.scrollBarVertical-Highlighted .scrollHandleDown{
    background: url(/images/scroller/scrollHandleDown.gif) no-repeat -19px 0;
}

.scrollBarVertical-Active .scrollHandleDown{
    background: url(/images/scroller/scrollHandleDown.gif) no-repeat -38px 0;
}

.scrollHorizontal{
    font-size: 0px; /* for IE6 */
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 24px;
}

.leftBtn{
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 24px;
    height: 24px;
    background: url(/images/scroller/leftBtn.gif) no-repeat 0 -48px;
    cursor: pointer;
}

.leftBtn-Highlighted{
    background: url(/images/scroller/leftBtn.gif) no-repeat 0 -24px;
}

.leftBtn-Active{
    background: url(/images/scroller/leftBtn.gif) no-repeat 0 0;
}

.rightBtn{
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 24px;
    height: 24px;
    background: url(/images/scroller/rightBtn.gif) no-repeat 0 -48px;
    cursor: pointer;
}

.rightBtn-Highlighted{
    background: url(/images/scroller/rightBtn.gif) no-repeat 0 -24px;
}

.rightBtn-Active{
    background: url(/images/scroller/rightBtn.gif) no-repeat 0 0;
}

.scrollBarHorizontal{
    display: block;
    position: absolute;
    left: 24px;
    bottom: 0;
    rigth: 24px;
    height: 24px;
    background: url(/images/scroller/scrollBarHorizontal.gif) repeat-x center center;
    padding: 0;
}

.scrollHandleHorizontal{
    cursor: pointer;
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    height: 24px;
    cursor: pointer;
    zoom: 1;
}

.scrollBarHorizontal-Active .scrollHandleHorizontal{
    opacity: 0.85;
    filter: alpha(opacity=50);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=85)";
}

.scrollHandleBGHorizontal{
    background: transparent url(/images/scroller/scrollHandleBGHorizontal.gif) repeat-x scroll 0 -48px;
    display: block;
    position: relative;
    height: 24px;
    left: 0;
    right: 0;
    float: left;
}

.scrollBarHorizontal-Highlighted .scrollHandleBGHorizontal{
    background: transparent url(/images/scroller/scrollHandleBGHorizontal.gif) repeat-x scroll 0 -24px;
}

.scrollBarHorizontal-Active .scrollHandleBGHorizontal{
    background: transparent url(/images/scroller/scrollHandleBGHorizontal.gif) repeat-x scroll 0 0;
}

.scrollHandleMiddleHorizontal{
    display: block;
    position: absolute;
    height: 24px;
    width: 13px;
    background: url(/images/scroller/scrollHandleMiddleHorizontal.gif) no-repeat 0 0;
    left: 50%;
    margin: 0 -7px 0;
}

.scrollBarHorizontal-Highlighted .scrollHandleMiddleHorizontal{
    background: url(/images/scroller/scrollHandleMiddleHorizontal.gif) repeat-x 13px 0;
}

.scrollBarHorizontal-Active .scrollHandleMiddleHorizontal{
    background: url(/images/scroller/scrollHandleMiddleHorizontal.gif) repeat-x 26px 0;
}

.scrollHandleLeft{
    display: block;
    position: relative;
    height: 24px;
    width: 11px;
    background: url(/images/scroller/scrollHandleLeft.gif) no-repeat 0 0;
    float: left;
}

.scrollBarHorizontal-Highlighted .scrollHandleLeft{
    background: url(/images/scroller/scrollHandleLeft.gif) no-repeat -11px 0;
}

.scrollBarHorizontal-Active .scrollHandleLeft{
    background: url(/images/scroller/scrollHandleLeft.gif) no-repeat -22px 0;
}

.scrollHandleRight{
    display: block;
    position: relative;
    height: 24px;
    width: 11px;
    background: url(/images/scroller/scrollHandleRight.gif) no-repeat 0 0;
    float: left;
}

.scrollBarHorizontal-Highlighted .scrollHandleRight{
    background: url(/images/scroller/scrollHandleRight.gif) no-repeat -11px 0;
}

.scrollBarHorizontal-Active .scrollHandleRight{
    background: url(/images/scroller/scrollHandleRight.gif) no-repeat -22px 0;
}