.gm-fullscreen-control {
  display: none;
}
.slidecontainer {
  width: 270px;
  height: auto;
  position: absolute;
  background: #fff;
  top: 10px;
  left: 10px;
  z-index: 3;
  padding: 10px;
  /* box-shadow: 0 2px 2px rgba(0,0,0,0.2); */
  box-shadow: 0 1px 3px 0 rgba(0,0,0,.2), 0 1px 1px 0 rgba(0,0,0,.14), 0 2px 1px -1px rgba(0,0,0,.12);
}
.slider-title {
  padding: 5px 0 5px 0;
  font-size: 15px;
  font-weight: 550;
}
.slider-range {
  padding: 0 20px;
}
.row-slider {
  box-sizing: border-box;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  padding: 5px 0 5px 0;
}
.row-slider span {
  font-size: 13px;
  width: 54px;
  text-align: center;
}

/* slider */
input[type="range"] {
  width: 100%;
  -webkit-appearance: none; /*remove the line*/
  outline: none;
  border: 0; /*for firefox on android*/
  padding: 0 8px; /*for IE*/
  margin: 8px 0;
}
/*chrome and opera*/
input[type="range"]::-webkit-slider-runnable-track {
  background: #ccc; /*trackColor*/
  height: 3px; /*trackHeight*/
  border-radius: 3px; /*trackHeight*/
  transition: 0.3s;
}
input[type="range"]:hover::-webkit-slider-runnable-track,
input[type="range"]:focus::-webkit-slider-runnable-track {
  background: #777; /*activeTrackColor*/
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  background: red; /*thumbColor*/
  width: 20px; /* thumbHeight + (2 x thumbBorderWidth)*/
  height: 20px; /* thumbHeight + (2 x thumbBorderWidth)*/
  border-radius: 50%;
  margin-top: -9px; /* -[thumbHeight + (2 x thumbBorderWidth) - trackHeight]/2*/
  cursor: pointer;
  border: 2px solid #fff; /*border-width should be equal to thumbBorderWidth if you want same border width across all browsers and border-color should match the background*/
  transition: 0.3s;
}
input[type="range"]:hover::-webkit-slider-thumb,
input[type="range"]:focus::-webkit-slider-thumb {
    background: darkOrange; /*activeThumbColor*/
}

/*firefox*/
input[type="range"]::-moz-focus-outer {
    border: 0;
}
input[type="range"]::-moz-range-track {
    background: #ccc; /*trackColor*/
    height: 3px; /*trackHeight*/
    border-radius: 3px; /*trackHeight*/
    /*background isn't animatable, so can't use transition*/
}
input[type="range"]:hover::-moz-range-track,
input[type="range"]:focus::-moz-range-track {
    background: #777; /*activeTrackColor*/
}
input[type="range"]::-moz-range-thumb {
    background: red; /*thumbColor*/
    width: 16px; /*thumbHeight*/
    height: 16px; /*thumbHeight*/
    border-radius: 50%;
    cursor: pointer;
    border: 2px solid #fff; /*border-width = thumbBorderWidth, border-color should match the background*/
}
input[type="range"]:hover::-moz-range-thumb,
input[type="range"]:focus::-moz-range-thumb {
    background: darkOrange; /*activeThumbColor*/
}
input[type="range"]::-moz-range-progress {
    background: red; /*thumbColor*/
    border-radius: 3px; /*trackHeight*/
    height: 3px; /*trackHeight*/
}
input[type="range"]:hover::-moz-range-progress,
input[type="range"]:focus::-moz-range-progress {
    background: darkOrange; /*activeThumbColor*/
}
/*edge and IE*/
input[type="range"]::-ms-track {
    background: #ccc; /*trackColor*/
    height: 12px; /*trackHeight*/
    border-radius: 3px; /*trackHeight*/
    border: none;
    color: transparent;
}
input[type="range"]:hover::-ms-track,
input[type="range"]:focus::-ms-track {
    background: #777; /*activeTrackColor*/
}
input[type="range"]::-ms-thumb {
  background: red; /*thumbColor*/
  width: 10px; /*thumbHeight*/
  height: 10px; /*thumbHeight*/
  border-radius: 50%;
  border: none;
  margin: 0 3px 0; /*0 thumbBorderWidth 0*/
  box-shadow: 0 0 0 2px #fff; /*0 0 0 thumbBorderWidth #fff, box-shadow color should match the background*/
  /*cursor:pointer; doesn't work*/
}
input[type="range"]:hover::-ms-thumb,
input[type="range"]:focus::-ms-thumb {
  background: darkOrange; /*activeThumbColor*/
}
input[type="range"]::-ms-tooltip {
  display: none; /*tooltip makes thumb sliding lagy*/
}
input[type="range"]::-ms-fill-lower {
  background: red; /*thumbColor*/
  border-radius: 3px; /*trackHeight*/
}
input[type="range"]:hover::-ms-fill-lower,
input[type="range"]:focus::-ms-fill-lower {
  background: darkOrange; /*activeThumbColor*/
}