/*start Thumb css*/
input[type=range].renge {
	-webkit-appearance: none;
	width: 100%;
	margin: 9.5px 0;
}
input[type=range].renge:focus {
	outline: none;
}
input[type=range].renge::-webkit-slider-runnable-track {
 width: 100%;
 height: 15px;
 cursor: pointer;
 box-shadow: none;
 background: #f7f7f7;
 border-radius: 3px;
 border: none;
}
input[type=range].renge::-webkit-slider-thumb {
 height: 34px;
 width: 34px;
 border-radius: 3px;
    box-shadow: none;
    border: none;
 background: #ababab;
 cursor: pointer;
 -webkit-appearance: none;
 margin-top: -9.5px;
}
input[type=range].renge:focus::-webkit-slider-runnable-track {
 background: #f7f7f7;
}
input[type=range].renge::-moz-range-track {
 width: 100%;
 height: 15px;
 cursor: pointer;
 box-shadow: none;
 background: #f7f7f7;
 border-radius: 3px;
 border: none;
}
input[type=range].renge::-moz-range-thumb {
 height: 34px;
 width: 34px;
 border-radius: 3px;
    box-shadow: none;
    border: none;
    background: #ababab;
 cursor: pointer;
}
input[type=range].renge::-ms-track {
 width: 100%;
 height: 15px;
 cursor: pointer;
 background: transparent;
 border-color: transparent;
 color: transparent;
}
input[type=range].renge::-ms-fill-lower {
 background: #f7f7f7;
 border: none;
 border-radius: 6px;
 box-shadow: none;
}
input[type=range].renge::-ms-fill-upper {
 background: #f7f7f7;
 border: none;
 border-radius: 6px;
 box-shadow: none;
}
input[type=range].renge::-ms-thumb {
 height: 34px;
 width: 34px;
 border-radius: 3px;
    box-shadow: none;
    border: none;
    background: #ababab;
 cursor: pointer;
 height: 15px;
	
	
display: none;
    width: 277px;
    position: absolute;
    left: -98px;
    top: -293px;
    box-shadow: none;
    z-index: 3;
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
}
input[type=range].renge:focus::-ms-fill-lower {
 background: #f7f7f7;
}
input[type=range].renge:focus::-ms-fill-upper {
 background: #f7f7f7;
}
/*end Thumb css*/

/* start progres css*/
/* All HTML5 progress enabled browsers */
progress {
	/* Turns off styling - not usually needed, but good to know. */
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
	/* gets rid of default border in Firefox and Opera. */
	border: 1px solid rgba(0, 0, 0, 0.18);
	border-radius: 10px;
	/* Dimensions */
	width: 100%;
	height: 20px;
    overflow: hidden;
}
/* Polyfill */
progress[role]:after {
	background-image: none; /* removes default background from polyfill */
}
/*
 * Background of the progress bar background
 */

/* Firefox and Polyfill */
progress {
	background: #538540 !important; /* !important only needed in polyfill */
}

/* Chrome */
progress::-webkit-progress-bar {
 border-radius: 10px;
 background: #538540;
}

/*
 * Background of the progress bar value
 */

/* Firefox */
progress::-moz-progress-bar {
 border-radius: 5px;
 background-image: -moz-linear-gradient(  center bottom,  #f7f7f7 37%,  #f7f7f7 69%  );
}

/* Chrome */
progress::-webkit-progress-value {
 border-radius: 5px;
 background-image: -webkit-gradient(  linear,  left bottom,  left top,  color-stop(0, #f7f7f7),  color-stop(1, #f7f7f7)  );
 background-image: -webkit-linear-gradient(  center bottom,  #f7f7f7 37%,  #f7f7f7 69%  );
}
/* Polyfill */
progress[aria-valuenow]:before {
	border-radius: 5px;
	background-image: -moz-linear-gradient(  center bottom,  #f7f7f7 37%,  #f7f7f7 69%  );
	background-image: -ms-linear-gradient(  center bottom,  #f7f7f7 37%,  #f7f7f7 69%  );
	background-image: -o-linear-gradient(  center bottom,  #f7f7f7 37%,  #f7f7f7 69%  );
}
/* end progres css*/

.renge {
	margin: 30px 0 !important;
	height: 50px;
	padding: 5px;
	border-radius: 4px;
    background-color: transparent;
}
#slider-range , .slider-range {
    background: transparent;
    border: 0 !important;
	height: 15px;
}
.ui-slider-range.ui-corner-all.ui-widget-header {
	height: 15px;
	background: #f7f7f7;
}
/*.ui-slider-handle.ui-corner-all.ui-state-default :first{
  margin-left: 0 !important;
}
.ui-slider-handle.ui-corner-all.ui-state-default :last{
  margin-left: -34px !important;
}*/
.ui-slider-horizontal .ui-slider-handle.ui-corner-all.ui-state-default {
	top: -0.5em !important;
}
.ui-slider-handle.ui-corner-all.ui-state-default {
	width: 34px;
	height: 34px;
	background: #ababab;
    cursor: pointer;
    cursor: -webkit-grab;
    border:none;
    border-radius: 4px;
}
.ui-slider  > .ui-slider-handle:nth-of-type(1) {
	margin-left:-34px;
}
.ui-slider  > .ui-slider-handle:nth-of-type(2) {
	margin-left:0px;
}
.multi-range-content {
	height: 3px;
	text-align: center;
	width: 100%;
	display: table-cell;
	padding: 0 34px;
}
#slider-range , .slider-range{
	margin: 20px 5px 0;
}
