html {
  min-height: 100%;
}
body {
  margin: 0;
  width: 100%;
  height: 100%;
}
.input-range {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 30%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.input-range #range-slider {
  width: calc(100% - 16.66666667%);
  order: 10;
  margin: 0;
  border: none;
  background-color: #f1f1f1;
  margin-top: 2vw;
  border-radius: 2vw;
  height: 0.8vw;
}
@media screen and (max-width: 768px) {
  .input-range #range-slider {
    margin-top: 4vw;
  }
}
.input-range #range-slider .ui-slider-range {
  background-color: #bad6ef;
  border-radius: 2vw;
  -webkit-transition: all ease 250ms;
  -moz-transition: all ease 250ms;
  -o-transition: all ease 250ms;
  transition: all ease 250ms;
  cursor: pointer;
  height: 0.8vw;
}
.input-range #range-slider .ui-slider-handle {
  background-color: #bad6ef;
  border: none;
  width: 1.5vw;
  height: 1.5vw;
  border-radius: 20px;
  transform: translateY(-50%);
  top: 50%;
  margin-left: -0.75vw;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
  outline: none;
  -webkit-transition: all ease 250ms;
  -moz-transition: all ease 250ms;
  -o-transition: all ease 250ms;
  transition: all ease 250ms;
  cursor: pointer;
}
.input-range #range-slider[data-value="1"] .ui-slider-range,
.input-range #range-slider[data-value="1"] .ui-slider-handle {
  background-color: #bad6ef;
}
.input-range #range-slider[data-value="2"] .ui-slider-range,
.input-range #range-slider[data-value="2"] .ui-slider-handle {
  background-color: #bad6ef;
}
.input-range #range-slider[data-value="3"] .ui-slider-range,
.input-range #range-slider[data-value="3"] .ui-slider-handle {
  background-color: #ffb72f;
}
.input-range #range-slider[data-value="4"] .ui-slider-range,
.input-range #range-slider[data-value="4"] .ui-slider-handle {
  background-color: #ffb72f;
}
.input-range #range-slider[data-value="5"] .ui-slider-range,
.input-range #range-slider[data-value="5"] .ui-slider-handle {
  background-color: #fd6b6b;
}
.input-range #range-slider[data-value="6"] .ui-slider-range,
.input-range #range-slider[data-value="6"] .ui-slider-handle {
  background-color: #fd6b6b;
}
.input-range .labels {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.input-range .labels .fas {
  width: calc(100% / 6);
  text-align: center;
  cursor: pointer;
  color: #f1f1f1;
  -webkit-transition: all ease 250ms;
  -moz-transition: all ease 250ms;
  -o-transition: all ease 250ms;
  transition: all ease 250ms;
}
.input-range .labels .fas:before {
  font-size: 4vw;
}
.input-range .labels .fas:hover {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}
.input-range .labels[data-value="1"] .fas:nth-child(-n + 1) {
  color: #bad6ef;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.input-range .labels[data-value="2"] .fas:nth-child(-n + 2) {
  color: #bad6ef;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.input-range .labels[data-value="3"] .fas:nth-child(-n + 3) {
  color: #ffb72f;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.input-range .labels[data-value="4"] .fas:nth-child(-n + 4) {
  color: #ffb72f;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.input-range .labels[data-value="5"] .fas:nth-child(-n + 5) {
  color: #fd6b6b;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.input-range .labels[data-value="6"] .fas:nth-child(-n + 6) {
  color: #fd6b6b;
  text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
