comparison interfaces/horizontal-sliders.css @ 3132:38d2150045f5

#286 reformatted the horizontal sliders to use grids

 /*
  * Hold any style information for MUSHRA interface. Customise if you like to make the interface your own!
- * 
+ *
  */
 
 body {
     /* Set the background colour (note US English spelling) to grey*/
     background-color: #ddd

     float: left;
     height: 94px;
     border: solid;
     border-width: 1px;
     border-color: black;
-    padding: 2px;
     margin-left: 94px;
     margin-bottom: 25px;
+    display: grid;
+    grid-template-columns: 113px 1fr 107px;
 }
 div.track-slider-title {
-    float: left;
-    padding-top: 40px;
-    width: 100px;
+    padding-top: 30px;
 }
 button.track-slider-button {
-    float: left;
-    width: 100px;
-    height: 94px;
+    width: 90px;
+    height: 74px;
+    margin: 10px;
 }
 div#outside-reference-holder {
     display: flex;
     align-content: center;
     justify-content: center;

     margin: 0px 5px;
 }
 div.track-slider-playing {
     background-color: rgba(255, 201, 201, 0.5);
 }
-input.track-slider-range {
-    float: left;
-    margin: 2px 10px;
-}
 input[type=range] {
     height: 94px;
     padding: 0px;
     color: rgb(255, 144, 144);
+    background-color: rgba(0,0,0,0);
 }
 input[type=range]::-webkit-slider-runnable-track {
     cursor: pointer;
     background: #fff;
     border-radius: 4px;