/* RadSlider for ASP.NET AJAX Base Stylesheet */ .RadSlider { width:22px; height:22px; } .RadSlider, .RadSlider .rslItem, .RadSlider .rslLargeTick span { font:normal 10px "Segoe UI", Arial, Verdana, sans-serif; color:black; } /* 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 */ .RadSlider .rslTrack { z-index:1; border-style:solid; } .RadSlider .rslDisabled { filter:progid:DXImageTransform.Microsoft.Alpha(opacity = 50); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; -moz-opacity:.5; opacity:.5; } .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; } /* any link inside RadSlider */ .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; } /* slider wrapper class */ .RadSlider .rslHorizontal, .RadSlider .rslVertical { position:relative; -moz-user-select:none; font-size:1px; line-height:2px; } /* horizontal slider */ .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:8px; margin-top:-8px; background-repeat:no-repeat; } .RadSlider .rslHorizontal a.rslDraghandle:hover { background-position:-9px 0; } .RadSlider .rslHorizontal a.rslDraghandle:focus, .RadSlider .rslHorizontal a.rslDraghandle:active { background-position:-18px 0; } .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 { -moz-opacity:1; opacity:1; filter:alpha(opacity=100); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; } /* vertical slider */ .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:8px; line-height:8px; margin-left:-8px; } /* Fix the positioning problem in IE6 and IE7 in rtl mode */ * html .RadSliderRTL .rslVertical a.rslDraghandle { margin-left:0px; margin-right:-8px; left:auto !important; /* use important in order to override the left inline style; it is always 0 in vertical slider */ right:0px; } *+html .RadSliderRTL .rslVertical a.rslDraghandle { margin-left:0px; margin-right:-8px; left:auto !important; /* use important in order to override the left inline style; it is always 0 in vertical slider */ right:0px; } .RadSlider .rslVertical a.rslDraghandle:hover { background-position:0 -9px; } .RadSlider .rslVertical a.rslDraghandle:focus, .RadSlider .rslVertical a.rslDraghandle:active { background-position:0 -18px; } /* ITEMS AND TICKS */ .RadSlider .rslItemsWrapper, .RadSlider .rslItem, .RadSlider .rslLargeTick, .RadSlider .rslSmallTick { margin:0px; padding:0px; list-style:none !important; } /* text */ .RadSlider .rslItem span, .RadSlider .rslLargeTick span { font-size:11px; } /* Item specific */ .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 .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; } /* Tick specific */ .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; } /* LiveDrag=false */ .RadSlider .rslLiveDragHandleActive { opacity:0.4; filter:alpha(opacity=40); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; } .RadSlider .rslLiveDragHandle { -moz-opacity:0; opacity:0; filter:alpha(opacity=0); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; } /* Position the elements of the slider */ .RadSlider .rslHandle, .RadSlider .rslDraghandle, .RadSlider .rslTrack, .RadSlider .rslSelectedregion, .RadSlider .rslItemsWrapper, /* Tick text */ .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, /* tick marks */ .RadSlider .rslLeft .rslLargeTick span, .RadSlider .rslVertical .rslLargeTick span.rslBRItemText { left:auto; right:0; } .RadSlider .rslTop .rslItemsWrapper, .RadSlider .rslBottom .rslHandle, .RadSlider .rslVertical .rslIncrease, /* tick marks */ .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; } /* TrackPosition=Center */ .RadSlider .rslMiddle .rslTrack, .RadSlider .rslMiddle .rslHandle { top:50%; } .RadSlider .rslCenter .rslTrack, .RadSlider .rslCenter .rslHandle { left:50%; } /* Fix the positioning problem in IE6 and IE7 in rtl mode */ * html .RadSliderRTL .rslCenter .rslTrack, * html .RadSliderRTL .rslCenter .rslHandle { right:50%; } *+html .RadSliderRTL .rslCenter .rslTrack, *+html .RadSliderRTL .rslCenter .rslHandle { right: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; } /* Fix the positioning problem in IE6 and IE7 in rtl mode */ * html .RadSliderRTL .rslCenter a.rslHandle { margin-left:0; margin-right:-11px; } *+html .RadSliderRTL .rslCenter a.rslHandle { margin-left:0; margin-right:-11px; } .RadSlider .rslCenter div.rslTrack { /* half of the width of the track */ margin-left:-3px; } /* Fix the positioning problem in IE6 and IE7 in rtl mode */ * html .RadSliderRTL .rslCenter div.rslTrack { margin-left:0; margin-right:-3px; } *+html .RadSliderRTL .rslCenter div.rslTrack { margin-left:0; margin-right:-3px; } /* Item/Tick */ .RadSlider .rslHorizontal .rslItem, .RadSlider .rslHorizontal .rslLargeTick, .RadSlider .rslHorizontal .rslSmallTick { float:left; } /* Item/Tick text */ .RadSlider .rslLargeTick span { white-space:nowrap; } .RadSlider .rslHorizontal .rslLargeTick span { width:100%; text-align:center; } .RadSlider .rslVertical .rslLargeTick span { height:100%; } /* set width of the ticks */ .RadSlider .rslHorizontal .rslSmallTick, .RadSlider .rslHorizontal .rslLargeTick { width:1px; } .RadSlider .rslVertical .rslSmallTick, .RadSlider .rslVertical .rslLargeTick { height:1px; } /*fix larger space between items under IE*/ * html .RadSlider .rslLargeTick { vertical-align:middle; } *+html .RadSlider .rslLargeTick { vertical-align:middle; }