/*NEW SLIDER STYLES FOR SCALE, ETC*/

/* slider widget */

.ui-slider {
  text-decoration: none !important;border: 0px;
}
.ui-slider .ui-slider-handle {
  overflow: visible !important;
}
.ui-slider .ui-slider-tooltip {
  display: none;
}
.ui-slider .ui-state-active .ui-slider-tooltip,
.ui-slider .ui-state-focus .ui-slider-tooltip,
.ui-slider .ui-state-hover .ui-slider-tooltip,.ui-slider .ui-slider-handle .ui-slider-tooltip {
  display: block;
  position: absolute;
  bottom: 27px;
  text-align: center;
  padding: 4px 10px;
  font-size: 12px;
  width: auto;
/*  min-width: 120px;*/
  margin-left: -4em;right: -6px;
/*  right: -52px;*/background: #000;color: #fff;border: 0px;
}
.ui-widget-content .ui-state-default.ui-slider-handle:hover, .ui-widget-content .ui-state-default.ui-slider-handle.ui-state-active,.ui-widget-content .ui-state-default.ui-slider-handle{width: 20px;height: 20px;background: #9C9C9C;
    box-shadow: 0px 0px 4px #9C9C9C;}
.ui-slider{background: -webkit-linear-gradient(left, #FFCECE 50%, #FFF3CB 30%, #BAFBC1 30%);}
.ui-slider .ui-slider-tooltip{position: relative;}
.ui-slider-handle .ui-slider-tooltip:after{content: " ";position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;bottom: -5px;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}}
.ui-slider a {
  text-decoration: none;
}
.ui-slider ol,
.ui-slider li,
.ui-slider dl,
.ui-slider dd,
.ui-slider dt {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ui-slider ol,
.ui-slider dl {
  position: relative;
  top: 1.3em;
  width: 100%;
}
.ui-slider dt {
  top: 1.5em;
  position: absolute;
  padding-top: .2em;
  text-align: center;
  border-bottom: 1px dotted #ddd;
  height: .7em;
  color: #999;
}
.ui-slider dt span {
  background: #fff;
  padding: 0 .5em;
}
.ui-slider li,
.ui-slider dd {
  position: absolute;
  overflow: visible;
  color: #666;
}
.ui-slider li span.ui-slider-label,
.ui-slider dd span.ui-slider-label {
  display: none;
}
.ui-slider li span.ui-slider-label-show,
.ui-slider dd span.ui-slider-label-show {
  display: block;
}
.ui-slider span.ui-slider-tic {
  position: absolute;
  left: 0;
  height: .8em;
  top: -1.3em;
}
.ui-slider li span.ui-widget-content,
.ui-slider dd span.ui-widget-content {
  border-right: 0;
  border-left-width: 1px;
  border-left-style: solid;
  border-top: 0;
  border-bottom: 0;
}
.ui-slider .first .ui-slider-tic,
.ui-slider .last .ui-slider-tic {
  display: none;
}
.slider {
  margin-bottom: 55px;
  width: 100%;
  float: left;
}
.slider.sleep {
  background: #a3e5f4;
}
.slider-controller {
  padding-top: 0;
}
.slider-controller select {
  width: 100px;
}
.ui-slider-handle.minimum,
a[data-temperature="minimum"],
.ui-slider-range.minimum {
  background: #a3e5f4;
}
.ui-slider-handle.saving,
a[data-temperature="saving"],
.ui-slider-range.saving {
  background: #DAFFDE;
}
.ui-slider-handle.comfort,
a[data-temperature="comfort"],
.ui-slider-range.comfort {
  background: #DAFFDE;
}
.ui-slider-handle.sleep,
a[data-temperature="sleep"],
.ui-slider-range.sleep {
  background: #a3e5f4;
}
.ui-slider-handle.leave,
a[data-temperature="leave"],
.ui-slider-range.leave {
  background: #FFF7DA;
}
/*.ui-slider-handle.return,
a[data-temperature="return"],
.ui-slider-range.return {
  background: #DAFFDE;
}*/
.ui-slider-handle.wake,
a[data-temperature="wake"],
.ui-slider-range.wake {
  background: #FFF3CB;
}
.temperature-wake {
  background-color:#FFDADA;
  color: #fff;
}
.temperature-leave {
  background-color: #DAFFDE;
}
.temperature-return {
  background-color: #DAFFDE;
  color: #fff;
}
.temperature-sleep {
  background-color: #a3e5f4;
}
.temperatures input {
  text-align: right;
}
.slider-tick-mark-main {
  display: inline-block;
  width: 1px;
  background: #bbb;
  height: 7px;
  position: absolute;
  top: 15px;
  font-size: 11px;
}
.slider-tick-mark-main-text {
  display: inline-block;
  width: 20px;
  height: 10px;
  position: absolute;
  top: 25px;
  font-size: 11px;
  text-align: center;
  margin-left: -9px;
}
.slider-tick-mark-side {
  display: inline-block;
  width: 1px;
  background: #ccc;
  height: 5px;
  position: absolute;
  top: 15px;
}
.slider-tick-mark-side-text {
  display: inline-block;
  width: 20px;
  height: 10px;
  position: absolute;
  top: 25px;
  font-size: 9px;
  text-align: center;
  margin-left: -9px;
}
.slider span.ui-slider-tooltip {
  width: auto;
}