.RadSlider {
    width: 22px;
    height: 22px;
    /* the dragHandle needs to have greater z-index than the increase/decrease handlers, as it can be positioned over the rounded corders
  of the track, part of those handles */
    /* any link inside RadSlider */
    /* slider wrapper class */
    /* horizontal slider */
    /* vertical slider */
    /* end rslVertical styles */
    /* ITEMS AND TICKS */
    /* text */
    /* Item specific */
    /* Tick specific */
    /* LiveDrag=false */
    /* Position the elements of the slider */
    /* TrackPosition=Center */
    /* Item/Tick */
    /* Item/Tick text */
    /* set width of the ticks */
}

    .RadSlider, .RadSlider * {
        box-sizing: content-box;
        -moz-box-sizing: content-box;
    }

        .RadSlider,
        .RadSlider .rslItem,
        .RadSlider .rslLargeTick span {
            font: normal 10px "Segoe UI", Arial, Verdana, sans-serif;
            color: black;
        }

            .RadSlider .rslTrack {
                z-index: 1;
                border-style: solid;
            }

            .RadSlider .rslDisabled {
                opacity: .5;
                filter: progid:DXImageTransform.Microsoft.Alpha(opacity = 50);
                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
            }

                .RadSlider .rslDisabled,
                .RadSlider .rslDisabled a,
                .RadSlider .rslDisabled li {
                    cursor: no-drop;
                }

                    .RadSlider .rslDisabled,
                    .RadSlider .rslDisabled .rslItem,
                    .RadSlider .rslDisabled .rslLargeTick span {
                        font-family: arial,sans-serif;
                    }

            .RadSlider a {
                display: block;
                text-indent: -9999px;
                overflow: hidden;
                text-decoration: none;
                text-align: center;
                overflow: hidden;
            }

                .RadSlider a:focus,
                .RadSlider a:active {
                    outline: none;
                }

            .RadSlider .rslHandle span,
            .RadSlider .rslDraghandle span {
                display: block;
            }

            .RadSlider .rslHorizontal,
            .RadSlider .rslVertical {
                position: relative;
                -moz-user-select: none;
                font-size: 1px;
                line-height: 2px;
            }

                .RadSlider .rslHorizontal,
                .RadSlider .rslHorizontal a.rslHandle,
                .RadSlider .rslHorizontal a.rslDraghandle {
                    height: 22px;
                    line-height: 22px;
                }

                    .RadSlider .rslHorizontal a.rslHandle {
                        width: 25px;
                        background-repeat: no-repeat;
                    }

                    .RadSlider .rslHorizontal .rslDecrease {
                        background-position: 0 -22px;
                    }

                        .RadSlider .rslHorizontal .rslDecrease:hover {
                            background-position: -25px -22px;
                        }

                    .RadSlider .rslHorizontal .rslIncrease {
                        background-position: 0 0;
                    }

                        .RadSlider .rslHorizontal .rslIncrease:hover {
                            background-position: -25px 0;
                        }

                    .RadSlider .rslHorizontal a.rslDraghandle {
                        width: 18px !important;
                        margin-top: -8px;
                        background-repeat: no-repeat;
                    }

                        .RadSlider .rslHorizontal a.rslDraghandle:hover {
                            background-position: -18px 0 !important;
                        }

                        .RadSlider .rslHorizontal a.rslDraghandle:focus,
                        .RadSlider .rslHorizontal a.rslDraghandle:active {
                            background-position: -36px 0 !important;
                        }

                    .RadSlider .rslHorizontal .rslTrack,
                    .RadSlider .rslHorizontal .rslSelectedregion {
                        height: 6px;
                        line-height: 6px;
                    }

                    .RadSlider .rslHorizontal .rslTrack {
                        border-width: 0 1px;
                    }

                    .RadSlider .rslHorizontal .rslItemsWrapper {
                        margin: 0 1px;
                        /* The margin must equal the side border of the track element */
                    }

            .RadSlider .rslDisabled .rslLiveDragHandle {
                opacity: 1;
                filter: alpha(opacity=100);
                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
            }

            .RadSlider .rslVertical,
            .RadSlider .rslVertical a.rslHandle,
            .RadSlider .rslVertical a.rslDraghandle {
                width: 22px;
            }

                .RadSlider .rslVertical a.rslHandle {
                    height: 25px;
                    line-height: 25px;
                    background-repeat: no-repeat;
                }

                .RadSlider .rslVertical .rslDecrease {
                    background-position: 0 0;
                }

                    .RadSlider .rslVertical .rslDecrease:hover {
                        background-position: 0 -28px;
                    }

                .RadSlider .rslVertical .rslIncrease {
                    background-position: -22px 3px;
                }

                    .RadSlider .rslVertical .rslIncrease:hover {
                        background-position: -22px -25px;
                    }

                .RadSlider .rslVertical .rslTrack,
                .RadSlider .rslVertical .rslSelectedregion {
                    width: 6px;
                }

                .RadSlider .rslVertical .rslTrack {
                    border-width: 1px 0;
                }

                .RadSlider .rslVertical .rslItemsWrapper {
                    margin: 1px 0;
                    /* The margin must equal the side border of the track element */
                }

                .RadSlider .rslVertical a.rslDraghandle {
                    height: 9px;
                    line-height: 8px;
                    margin-left: -8px;
                    *margin-left: 0;
                    *margin-right: -8px;
                    *left: auto !important;
                    /* use important in order to override the left inline style; it is always 0 in vertical slider */
                    *right: 0;
                    /* improves drag&drop in mobile browsers */
                    -webkit-transform: rotate3d(0, 0, 1, 0);
                    -webkit-backface-visibility: hidden;
                    -webkit-perspective: 1000;
                    -moz-transform: rotate3d(0, 0, 1, 0);
                    -moz-backface-visibility: hidden;
                    -moz-perspective: 1000;
                    -o-transform: rotate3d(0, 0, 1, 0);
                    -o-backface-visibility: hidden;
                    -o-perspective: 1000;
                    -ie-transform: rotate3d(0, 0, 1, 0);
                    -ie-backface-visibility: hidden;
                    -ie-perspective: 1000;
                }

                    .RadSlider .rslVertical a.rslDraghandle:hover {
                        background-position: 0 -9px;
                    }

                    .RadSlider .rslVertical a.rslDraghandle:focus,
                    .RadSlider .rslVertical a.rslDraghandle:active {
                        background-position: 0 -18px;
                    }

            .RadSlider .rslItemsWrapper,
            .RadSlider .rslItem,
            .RadSlider .rslLargeTick,
            .RadSlider .rslSmallTick {
                margin: 0;
                padding: 0;
                list-style: none !important;
            }

                .RadSlider .rslItem span,
                .RadSlider .rslLargeTick span {
                    font-size: 11px;
                }

            .RadSlider .rslVertical .rslItemsWrapper .rslItemFirst,
            .RadSlider .rslHorizontal .rslItemsWrapper .rslItemFirst {
                background-image: none;
            }

            .RadSlider .rslItem {
                text-overflow: ellipsis;
                overflow: hidden;
                cursor: default;
                background-repeat: no-repeat;
            }

            .RadSlider .rslHorizontal .rslItem {
                text-align: center;
            }

            .RadSlider .RadSlider .rslItemsWrapper li.rslItemDisabled {
                color: #d0d0ce;
            }

            .RadSlider .rslMiddle .rslItem,
            .RadSlider .rslLeft .rslLargeTick,
            .RadSlider .rslLeft .rslSmallTick {
                background-position: left center;
            }

            .RadSlider .rslTop .rslItem {
                background-position: left top;
            }

            .RadSlider .rslBottom .rslItem {
                background-position: left bottom;
            }

            .RadSlider .rslCenter .rslItem,
            .RadSlider .rslTop .rslLargeTick,
            .RadSlider .rslTop .rslSmallTick {
                background-position: center top;
            }

            .RadSlider .rslLeft .rslItem {
                background-position: left top;
            }

            .RadSlider .rslRight .rslItem {
                background-position: right top;
            }

            .RadSlider .rslLargeTick,
            .RadSlider .rslSmallTick {
                cursor: default;
                /* We need this in order to position the SPAN holding the text. */
                position: relative;
                background-repeat: no-repeat;
            }

            .RadSlider .rslCenter .rslLargeTick,
            .RadSlider .rslCenter .rslSmallTick,
            .RadSlider .rslMiddle .rslLargeTick,
            .RadSlider .rslMiddle .rslSmallTick {
                background-position: center center;
            }

            .RadSlider .rslRight .rslLargeTick,
            .RadSlider .rslRight .rslSmallTick {
                background-position: right center;
            }

            .RadSlider .rslBottom .rslLargeTick,
            .RadSlider .rslBottom .rslSmallTick {
                background-position: center bottom;
            }

            .RadSlider .rslLiveDragHandleActive {
                opacity: 0.4;
                filter: alpha(opacity=40);
                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
            }

            .RadSlider .rslLiveDragHandle {
                opacity: 0;
                filter: alpha(opacity=0);
                -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
            }

            .RadSlider .rslHandle,
            .RadSlider .rslDraghandle,
            .RadSlider .rslTrack,
            .RadSlider .rslSelectedregion,
            .RadSlider .rslItemsWrapper,
            .RadSlider .rslLargeTick span {
                position: absolute;
                top: 0;
                left: 0;
            }

            .RadSlider .rslHorizontal .rslTrack,
            .RadSlider .rslHorizontal .rslItemsWrapper {
                left: 25px;
            }

            .RadSlider .rslVertical .rslTrack,
            .RadSlider .rslVertical .rslItemsWrapper {
                top: 25px;
            }

            .RadSlider .rslHorizontal .rslIncrease,
            .RadSlider .rslRight .rslHandle,
            .RadSlider .rslLeft .rslItemsWrapper,
            .RadSlider .rslLeft .rslLargeTick span,
            .RadSlider .rslVertical .rslLargeTick span.rslBRItemText {
                left: auto;
                right: 0;
            }

            .RadSlider .rslTop .rslItemsWrapper,
            .RadSlider .rslBottom .rslHandle,
            .RadSlider .rslVertical .rslIncrease,
            .RadSlider .rslTop .rslLargeTick span,
            .RadSlider .rslHorizontal .rslLargeTick span.rslBRItemText {
                top: auto;
                bottom: 0;
            }

            .RadSlider .rslHorizontal .rslTrack {
                top: 8px;
            }

            .RadSlider .rslBottom div.rslTrack {
                top: auto;
                bottom: 8px;
            }

            .RadSlider .rslVertical .rslTrack {
                left: 8px;
            }

            .RadSlider .rslRight div.rslTrack {
                left: auto;
                right: 8px;
            }

            .RadSlider .rslMiddle .rslTrack,
            .RadSlider .rslMiddle .rslHandle {
                top: 50%;
            }

            .RadSlider .rslCenter .rslTrack,
            .RadSlider .rslCenter .rslHandle {
                left: 50%;
            }

            .RadSlider .rslMiddle a.rslHandle {
                /* half of the height of the handle */
                margin-top: -11px;
            }

            .RadSlider .rslMiddle div.rslTrack {
                /* half of the height of the track */
                margin-top: -3px;
            }

            .RadSlider .rslCenter a.rslHandle {
                /* half of the width of the handle */
                margin-left: -11px;
            }

            .RadSlider .rslCenter div.rslTrack {
                /* half of the width of the track */
                margin-left: -3px;
            }

            .RadSlider .rslHorizontal .rslItem,
            .RadSlider .rslHorizontal .rslLargeTick,
            .RadSlider .rslHorizontal .rslSmallTick {
                float: left;
            }

            .RadSlider .rslLargeTick span {
                white-space: nowrap;
            }

            .RadSlider .rslHorizontal .rslLargeTick span {
                width: 100%;
                text-align: center;
            }

            .RadSlider .rslVertical .rslLargeTick span {
                height: 100%;
            }

            .RadSlider .rslHorizontal .rslSmallTick,
            .RadSlider .rslHorizontal .rslLargeTick {
                width: 1px;
            }

            .RadSlider .rslVertical .rslSmallTick,
            .RadSlider .rslVertical .rslLargeTick {
                height: 1px;
                *vertical-align: middle;
            }

/* Fix the positioning problem in IE6 and IE7 in rtl mode */
.RadSliderRTL .rslCenter .rslTrack,
.RadSliderRTL .rslCenter .rslHandle {
    *right: 50%;
}

/* Fix the positioning problem in IE6 and IE7 in rtl mode */
.RadSliderRTL .rslCenter a.rslHandle {
    *margin-left: 0;
    *margin-right: -11px;
}

/* Fix the positioning problem in IE6 and IE7 in rtl mode */
.RadSliderRTL .rslCenter div.rslTrack {
    *margin-left: 0;
    *margin-right: -3px;
}

.rslTrack {
    border-color: #8a8a8a;
}

.rslHorizontal a.rslHandle {
    background-image: url('Slider/Handles.gif');
}

.rslHorizontal .rslTrack {
    background: url('Slider/TrackBgr.gif') repeat-x;
}

.rslHorizontal .rslSelectedregion {
    background: url('Slider/SelectedRegionHorizontalBgr.gif') right top no-repeat;
}

.rslHorizontal .rslItem {
    background-image: url('Slider/ItemHorizontalBgr.gif');
}

.rslVertical a.rslHandle {
    background-image: url('Slider/HandlesVertical.gif');
}

.rslVertical .rslTrack {
    background: url('Slider/TrackVerticalBgr.gif') repeat-y;
}

.rslVertical .rslSelectedregion {
    background: url('Slider/SelectedRegionVerticalBgr.gif') left bottom no-repeat;
}

.rslVertical a.rslDraghandle {
    background: url('Slider/DragVerticalHandle.gif') no-repeat;
}

.rslVertical .rslItem {
    background-image: url('Slider/ItemVerticalBgr.gif');
}

.rslLeft a.rslDraghandle {
    background: url('Slider/DragVerticalHandleRight.gif') no-repeat;
}

.rslItem,
.rslLargeTick span {
    color: #333333;
}

.rslItemsWrapper .rslItemSelected {
    color: #333333;
}

.rslTop .rslSmallTick,
.rslBottom .rslSmallTick {
    background-image: url('Slider/SmallChangeHorizontal.gif');
}

.rslTop .rslLargeTick,
.rslBottom .rslLargeTick {
    background-image: url('Slider/LargeChangeHorizontal.gif');
}

.rslLeft .rslSmallTick,
.rslRight .rslSmallTick {
    background-image: url('Slider/SmallChangeVertical.gif');
}

.rslLeft .rslLargeTick,
.rslRight .rslLargeTick {
    background-image: url('Slider/LargelChangeVertical.gif');
}

.rslMiddle .rslSmallTick {
    background-image: url('Slider/SmallChangeMiddleHorizontal.gif');
}

.rslLargeTick {
    background-image: url('Slider/LargeChangeMiddleHorizontal.gif');
}

.rslCenter .rslSmallTick {
    background-image: url('Slider/SmallChangeCenterVertical.gif');
}

.rslCenter .rslLargeTick {
    background-image: url('Slider/LargelChangeCenterVertical.gif');
}