@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: "Segment";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/Seven\ Segment.ttf") format("truetype"); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

* {
    box-sizing: border-box;
    padding: 0px;
    margin: 0px;
}
.bg_radio {
    position: relative;
    width: 1024px;
    height: 695px;
    background-image: url("../media/car_dashboard_v.jpg");
}
.station1off {
    position: absolute;
    left: 177px;
    top: 366px;
    width: 65px;
    height: 55px;

    background-image: url(../media/car_station_1off.jpg);
}
.station1on {
    background-image: url(../media/car_station_1on.jpg);
}

.station2off {
    position: absolute;
    left: 255px;
    top: 366px;
    width: 65px;
    height: 55px;

    background-image: url(../media/car_station_2off.jpg);
}
.station2on {
    background-image: url(../media/car_station_2on.jpg);
}

.station3off {
    position: absolute;
    left: 330px;
    top: 366px;
    width: 65px;
    height: 55px;

    background-image: url(../media/car_station_3off.jpg);
}
.station3on {
    background-image: url(../media/car_station_3on.jpg);
}

.station4off {
    position: absolute;
    left: 406px;
    top: 366px;
    width: 65px;
    height: 55px;

    background-image: url(../media/car_station_4off.jpg);
}
.station4on {
    background-image: url(../media/car_station_4on.jpg);
}
.btnOn {
    position: absolute;
    width: 81px;
    height: 66px;
    left: 7px;
    top: 275px;
    border-radius: 100%;

    background-color: rgba(165, 42, 42, 0.6);
}
.volume {
    position: absolute;
    width: 81px;
    height: 66px;
    left: 555px;
    top: 275px;
    border-radius: 100%;

    background-color: rgba(165, 42, 42, 0.6);
}

.display {
    position: absolute;
    width: 300px;
    height: 60px;

    left: 180px;
    top: 295px;

    font-family: "Segment";
    font-size: 40px;
    color: rgba(255, 0, 0, 0.863);

    opacity: 0;
    visibility: hidden;
    transition: all 300ms ease;

    user-select: none;
}
.visable {
    opacity: 1;
    visibility: visible;
}

.box {
    position: absolute;
    left: 617px;
    top: 224px;
    width: 404px;
    height: 256px;

    background-image: url(../media/car_glove_box_open.png);
}
.boxHidden {
    opacity: 0;
}