html, body {
  margin: 0;
}

html {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  height: 100%;
}

input[type="range"] {
  writing-mode: vertical-lr;
}


                        /***** Track Styles *****/
/***** Chrome, Safari, Opera, and Edge Chromium *****/
input[type="range"]::-webkit-slider-runnable-track {
  background: #053a5f;
}

/******** Firefox ********/
input[type="range"]::-moz-range-track {
  background: #053a5f;
  width: 2rem;


}

input[type="range"]::-webkit-slider-thumb {
   -webkit-appearance: none; /* Override default look */
   appearance: none;
   margin-top: -12px; /* Centers thumb on the track */
   background-color: #5cd5eb;
   height: 2rem;
   width: 1rem;    
}

input[type="range"]::-moz-range-thumb {
    border: none; /*Removes extra border that FF applies*/

    background-color: #5cd5eb;
    height: 2rem;
    width: 2rem;
}