body {
  /* Heben Sie diese Auskommentierung auf, um Bildlauf und Zoomen zu aktivieren.
  touch-action: manipulation;
  */
    
    font-family: Verdana;
}

/*Stellt ein Bereich bereit, in den der Slider eingefügt wird*/
.slider-wrapper {
    display: inline-block;
    width: 40px;
    height: 180px;
    padding: 0; /*Abstand*/
}

.slider-wrapper input {
    width: 180px;   /*Breite des Sliders (skaliert)*/
    height: 40px;   /*Höhe des Sliders (skaliert)*/
    margin: 0;  /*Abstand zu anderen "Blöcken"*/
    transform-origin: 90px 90px;    /*Drehpunkt (hier rechts unten)*/
    transform: rotate(-90deg);  /*Drehwinkel um den o.g. Drehpunkt*/
}

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 25px;
    background: #d3d3d3;
    outline: none;
    opacity: 1;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 50px;
    height: 75px;
    background: #4CAF50;
    cursor: pointer;
}

.slider::-moz-range-thumb {
    width: 50px;
    height: 75px;
    background: #4CAF50;
    cursor: pointer;
}

* {
    box-sizing: border-box;
}

.remoteHeader {
    background-color: #db0031;
    text-align: center;
    font-size: 2vw;
}
.motorHeaderBox {
    float: left;
    padding: 1%;
    width: 35%;
    background-color: inherit;
}
.servoHeaderBox {
    float: left;
    padding: 1%;
    width: 30%;
    background-color: inherit;
}
.remoteMain {
    background-color: #f1f1f1;
    text-align: center;
    font-size: 2vw;
}
.mainBoarderBox {
    background-color: #db0031;
    float: left;
    padding: 1%;
    width: 15%;
    font-size: 5vw;
    text-align: inherit;
    height: 200px;
}
.motorBox {
    float: left;
    padding: 1%;
    width: 15%;
    text-align: inherit;
    height: 200px;
}
.motorValBox {
    float: left;
    padding: 1%;
    width: 10%;
    font-size: 5vw;
    text-align: inherit;
    /*vertical-align: middle;*/
    height: 200px;
}
.servoBox {
    float: left;
    padding: 1%;
    width: 20%;
    text-align: center;
    height: 200px;
}

button{
    /*width: 10%;*/
    font-size: inherit;
}

input{
    font-size: inherit;
}