/******************************************************************
 *
 *  Preiskalkulator
 *
 */
:root {
  --yellow: #E84C0A;
  --light-yellow: #fdf2d2;
  --orange: #E84C0A;
  --light-gray: #e3e4e8;
  --gray: #71738b;
  --light-blue: #7a7c93;
  --blue: #34385a;
  --slider-handle-size: 15px;
  --slider-handle-border-radius: 8px;
  --slider-handle-margin-top: -4px;
  --slider-track-height: 6px;
  --slider-track-border-radius: 4px;
}

#pricecalc .tick-slider {
  position: relative;
  width: 100%;
  /*

      REMOVE SLIDER STYLE DEFAULTS

  */
}
#pricecalc .tick-slider * {
  box-sizing: border-box;
}
#pricecalc .tick-slider #sliderContainer > div:first-child {
  margin-bottom: 48px;
}
#pricecalc .tick-slider .tick-slider-header {
  display: flex;
  justify-content: space-between;
  margin-bottom: -5px;
}
#pricecalc .tick-slider .tick-slider-header > h5 {
  margin: 0;
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  font-weight: 300;
  color: var(--gray);
}
#pricecalc .tick-slider .tick-slider-value-container {
  position: absolute;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
  font-family: "Hind Madurai", sans-serif;
  font-size: 18px;
  color: var(--gray);
  top: 48px;
}
#pricecalc .tick-slider .tick-slider-value-container .tick-slider-value {
  position: absolute;
  top: 0;
  font-weight: bold;
  color: var(--blue);
  border-radius: var(--slider-handle-border-radius);
}
#pricecalc .tick-slider .tick-slider-value-container .tick-slider-value > div {
  animation: bulge 0.3s ease-out;
}
#pricecalc .tick-slider .tick-slider-background,
#pricecalc .tick-slider .tick-slider-progress,
#pricecalc .tick-slider .tick-slider-tick-container {
  position: absolute;
  bottom: 5px;
  left: 0;
  height: var(--slider-track-height);
  pointer-events: none;
  border-radius: var(--slider-track-border-radius);
  z-index: -1;
}
#pricecalc .tick-slider .tick-slider-background {
  width: 100%;
  background-color: var(--light-gray);
}
#pricecalc .tick-slider .tick-slider-progress {
  background-color: var(--yellow);
}
#pricecalc .tick-slider .tick-slider-tick-container {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 calc(var(--slider-handle-size) / 2);
}
#pricecalc .tick-slider .tick-slider-tick {
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background-color: white;
}
#pricecalc .tick-slider .tick-slider-label {
  opacity: 0.85;
  transition: opacity 0.1s ease;
}
#pricecalc .tick-slider .tick-slider-label.hidden {
  opacity: 0;
}
@keyframes bulge {
  0% {
    transform: scale(1);
  }
  25% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
#pricecalc .tick-slider input[type=range] {
  -webkit-appearance: none;
  width: 100%;
  background: transparent;
  outline: none;
  margin: 5px 0;
  min-height: 0;
  border: none;
  padding: 0;
  height: 3px;
  /*

      HANDLE

  */
  /*

      TRACK

  */
}
#pricecalc .tick-slider input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: none;
}
#pricecalc .tick-slider input[type=range]:focus {
  outline: none;
}
#pricecalc .tick-slider input[type=range]::-moz-focus-outer {
  border: 0;
}
#pricecalc .tick-slider input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: var(--slider-handle-size);
  height: var(--slider-handle-size);
  background: var(--orange);
  border-radius: var(--slider-handle-border-radius);
  cursor: pointer;
  margin-top: var(--slider-handle-margin-top);
  -webkit-transform: scale(1);
  transform: scale(1);
  transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
#pricecalc .tick-slider input[type=range]::-moz-range-thumb {
  -webkit-appearance: none;
  width: var(--slider-handle-size);
  height: var(--slider-handle-size);
  background: var(--orange);
  border: none;
  border-radius: var(--slider-handle-border-radius);
  cursor: pointer;
  transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
#pricecalc .tick-slider input[type=range]:hover::-webkit-slider-thumb, #pricecalc .tick-slider input[type=range]:focus::-webkit-slider-thumb {
  transform: scale(1.2);
}
#pricecalc .tick-slider input[type=range]:hover::-moz-range-thumb, #pricecalc .tick-slider input[type=range]:focus::-moz-range-thumb {
  transform: scale(1.2);
}
#pricecalc .tick-slider input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: var(--slider-track-height);
  cursor: pointer;
  background: none;
  border-radius: var(--slider-track-border-radius);
}
#pricecalc .tick-slider input[type=range]::-moz-range-track {
  width: 100%;
  height: var(--slider-track-height);
  cursor: pointer;
  background: none;
  border-radius: var(--slider-track-border-radius);
}
#pricecalc .tick-slider input[type=range]:focus::-webkit-slider-runnable-track, #pricecalc .tick-slider input[type=range]:active::-webkit-slider-runnable-track {
  background: none;
}

/*# sourceMappingURL=pricecalc.css.map */