/* Ширина слайдера */
.slider-range{
    width:183px;
	height:26px;
	background:url('../i/doubleslider-bg.png') 0 0 no-repeat;
}
#slider_range {
    width:163px;
	margin:auto;
	height:26px;
}
/* Контейнер слайдера */
.ui-slider {
    position: relative;
	width:164px;
	margin-left:10px;
}
/* Ползунок */
.ui-slider .ui-slider-handle {
    position: absolute;
    z-index: 2;
    width:19px;   /* Задаем нужную ширину */
    height:27px;  /* и высоту */
    background:url(../i/doubleslider-handle.png) no-repeat; /* картинка изображающая ползунок. Или можно залить цветом, задать бордюр и скругления */
    cursor: pointer
}
.ui-slider .ui-slider-range {
    position: absolute;
    z-index: 1;
    font-size: .7em;
    display: block;
    border: 0;
    overflow: hidden;
}
/* горизонтальный слайдер (сама полоса по которой бегает ползунок) */
.ui-slider-horizontal {
     height: 3px; /* задаем высоту согласно дизайна */
}
/* позиционируем ползунки */
.ui-slider-horizontal .ui-slider-handle {
    top: 3px;
    margin-left: -10px;
}
.ui-slider-horizontal .ui-slider-range {
    top: 0;
    height: 4px;
}
.ui-slider-horizontal .ui-slider-range-min {
    left: 0;
}
.ui-slider-horizontal .ui-slider-range-max {
    right: 0;
}
/* оформление полосы по которой ходит ползунок */
.ui-widget-content{
}
/* оформление активного участка (между двумя ползунками) */
.ui-widget-header {
	margin-top:11px;
	height:4px;
    background:#FFF url('../i/doubleslider-track.png') 0 0 repeat-x;
}
/* скругление для полосы слайдера */
.ui-corner-all {
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
}