#fuel-container {
    width: auto;
    height: 44%;
    aspect-ratio: 1/.6;

    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);

    background: linear-gradient(60deg, var(--background));
    border-radius: 2vh;
    opacity: 0;
    user-select: none;
    transition: all 187ms ease;
}

/* HEAD */

.fuel-head {
    width: 100%;
    height: 6.2vh;
    margin: 0;

    background: #FFFFFF09;
    border-radius: 2vh 2vh 0 0;
}
.fuel-head img {
    width: auto;
    height: 4.7vh;
    margin: .75vh;
    float: left;

    object-fit: contain;
}
.fuel-head h2 {
    position: absolute;
    width: 100%;
    height: 6.2vh;
    margin: 0;

    color: #FFF;
    font-family: 'Calibri', sans-serif;
    font-size: 2.9vh;
    font-weight: normal;
    text-align: center;
    line-height: 6.2vh;
}
.fuel-head-exit {
    width: 6.2vh;
    height: 6.2vh;
    margin: 0 .2vh 0 0;
    float: right;

    font-size: 2.6vh;
    text-align: center;
    line-height: 6.2vh;
    color: #FFFFFF60;
    filter: drop-shadow(0 0 1vh var(--main));
    transition: all 187ms ease;
}
.fuel-head-exit:hover {
    color: var(--main);
    cursor: pointer;
}

/* BODY */

.fuel-body {
    width: 100%;
    height: 46%;
}
.fuel-box {
    width: 30.6%;
    height: 100%;
    margin: 2% 0 0 2%;
    float: left;

    background: #FFFFFF09;
    border-radius: 1vh;
    opacity: .6;
}
.fuel-box-enabled {
    background: #FFFFFF12;
    opacity: 1;
}

.fuel-checkbox-icon {
    width: 100%;
    margin: 9% 0 0 0;
    z-index: 2;

    font-size: 5.2vh;
    text-align: center;
    color: var(--main);
    filter: drop-shadow(0 0 2vh var(--glow));
}
.fuel-checkbox-titel {
    width: 100%;
    margin: 9% 0 0 0;

    font-family: 'Calibri', sans-serif;
    font-size: 2.9vh;
    font-weight: normal;
    text-align: center;
    color: #FFFFFFcc;
    filter: drop-shadow(0 0 2vh #FFFFFF60);
}
.fuel-checkbox-text {
    width: 100%;
    margin: 0 0 0 0;

    font-family: 'Calibri', sans-serif;
    font-size: 2vh;
    font-weight: normal;
    text-align: center;
    color: #FFFFFF90;
}
.fuel-checkbox-price {
    margin: 0 0 0 0;

    font-family: 'Calibri', sans-serif;
    font-size: 3.1vh;
    font-weight: bold;
    text-align: center;
    color: var(--main);
    filter: drop-shadow(0 0 1vh var(--glow));
}

/* LEVEL */
.fuel-car-level {
    width: 96%;
    height: 12%;
    margin: 2% 0 0 2%;
    float: left;

    background: linear-gradient(to right, var(--main) 9%, #FFFFFF09 9%);
    border-radius: 1vh;
    filter: drop-shadow(0 0 2vh var(--glow));
}
.car-level-value {
    width: 100%;
    height: 100%;
    margin: 0;

    font-size: 1.8vh;
    text-align: center;
    color: #FFFFFF90;
    filter: drop-shadow(0 0 1vh #FFFFFF60);
    display: flex;
    justify-content: center;
    align-items: center;
}
.car-level-value span {
    margin: 0 0 0 1%;

    font-family: 'Calibri', sans-serif;
    font-size: 2vh;
    font-weight: normal;
}

/* SWITCH */
.fuel-switch {
    width: 20%;
    height: 14%;
    margin: 2% 0 0 2%;
    float: left;
}

.switch {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
}
.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #FFFFFF09;
    border-radius: 1vh;
    -webkit-transition: 187ms;
    transition: 187ms;
}
.slider:before {
    position: absolute;
    content: "";
    height: 100%;
    width: 50%;
    left: 0;
    bottom: 0;
    background: #FFFFFF09;
    border-radius: 1vh;
    -webkit-transition: 187ms;
    transition: 187ms;
}
input:checked + .slider:before {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    transform: translateX(100%);
}

.fuel-switch-icon1 {
    width: 50%;
    height: 100%;
    margin: -42% 0 0 0%;

    font-size: 2vh;
    color: var(--main);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .2s ease;
}
.fuel-switch-icon2 {
    width: 50%;
    height: 100%;
    margin: -42% 0 0 50%;

    font-size: 2vh;
    color: var(--main);
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .2s ease;
}

.fuel-button {
    width: 74%;
    height: 14%;
    margin: 2% 0 0 2%;

    background: #FFFFFF09;
    color: var(--main);
    border-radius: 1vh;
    border: none;
    outline: none;
    transition: all 187ms ease;

    font-family: 'Calibri', sans-serif;
    font-size: 2.5vh;
    font-weight: bold;
}
.fuel-button:hover {
    background: #FFFFFF12;
    cursor: pointer;
}

/* BOSS-MENU */
#boss-container {
    width: auto;
    height: 45%;
    aspect-ratio: 1.2/.8;

    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);

    background: linear-gradient(60deg, var(--background));
    border-radius: 2vh;
    opacity: 0;
    user-select: none;
    transition: all 187ms ease;
}

.boss-head {
    width: 100%;
    height: 6vh;
    margin: 0;

    background: #FFFFFF09;
    border-radius: 2vh 2vh 0px 0px;
}

#boss-head-img {
    width: 4vh;
    height: 4vh;
    margin: 1vh 1.5vh;
    float: left;

    background-image: url('img/logo.png');
    background-position: center;
    background-size: cover;
}

#boss-head-titel {
    height: 6vh;
    margin: 0;
    float: left;

    color: #FFF;
    font-family: 'Calibri', sans-serif;
    font-size: 2.9vh;
    font-weight: normal;
    text-align: center;
    line-height: 6vh;
}

#boss-head-exit {
    width: 6vh;
    height: 6vh;
    margin: 0 .2vh 0 0;
    float: right;

    font-size: 2.6vh;
    text-align: center;
    line-height: 6vh;
    color: #FFFFFF60;
    filter: drop-shadow(0 0 1vh var(--main));
    transition: all 187ms ease;
}
#boss-head-exit:hover {
    color: var(--main);
    cursor: pointer;
}

.boss-stats {
    width: 45%;
    height: 16%;
    margin: 2% 0 0 2%;
    padding-top: 1%;
    padding-left: 2%;
    float: left;

    background: #FFFFFF09;
    color: #FFFFFF60;
    border-radius: 1vh;

    font-family: 'Calibri', sans-serif;
    font-size: 2.2vh;
    font-weight: normal;
}
.boss-stats-value {
    margin: 0;

    font-size: 3.6vh;
    color: var(--main);
}

.boss-mode {
    width: 30.6%;
    height: 36%;
    margin: 2.6% 0 0 2%;
    float: left;

    background: #ff00ff00;
}
.boss-mode-box {
    width: 94%;
    height: 62%;
    padding-top: 4%;
    padding-left: 6%;
    float: left;

    background: #FFFFFF09;
    color: #FFFFFF60;
    border-radius: 1vh;

    font-family: 'Calibri', sans-serif;
    font-size: 2.2vh;
}
.boss-mode-price {
    margin: 2% 0 0 0;

    font-family: 'Calibri', sans-serif;
    font-size: 2.9vh;
    font-weight: bold;
    color: var(--main);
}
.boss-mode-less {
    margin: 0;

    font-family: 'Calibri', sans-serif;
    font-size: 2.2vh;
    font-weight: lighter;
    font-style: italic;
    color: #FFFFFF60;
}
.boss-mode-less span {
    font-weight: normal;
    font-style: normal;
    color: #FFFFFFbb;
}
.boss-mode-input {
    width: 66%;
    height: 26%;
    margin: 6% 0;
    float: left;

    background: #FFFFFF09;
    color: #FFF;
    border-radius: 1vh;
    border: none;
    outline: none;
    transition: all 187ms ease;

    font-family: 'Calibri', sans-serif;
    font-size: 2vh;
    text-align: center;
}
.boss-mode-input:focus {
    background: #FFFFFF12;
}
.boss-mode-button {
    width: 30%;
    height: 27.2%;
    margin: 6% 0 6% 2%;

    background: #FFFFFF09;
    color: var(--main);
    border-radius: 1vh;
    border: none;
    outline: none;
    display: inline-flex;
    transition: all 187ms ease;

    font-size: 2vh;
    text-align: center;
    justify-content: center;
    align-items: center;
}
.boss-mode-button:hover {
    background: #FFFFFF12;
    cursor: pointer;
}

.boss-actions {
    width: 45%;
    height: 16%;
    margin: 3.5% 0 0 2%;
    padding-top: 1%;
    padding-left: 2%;
    float: left;

    background: #FFFFFF09;
    color: #FFFFFF60;
    border-radius: 1vh;

    font-family: 'Calibri', sans-serif;
    font-size: 2vh;
    font-weight: normal;
}
.boss-actions h2 {
    margin: 0;

    font-family: 'Calibri', sans-serif;
    font-size: 2vh;
    font-weight: normal;
}

.boss-actions-input {
    width: 55%;
    height: 45%;
    margin: 1% 0;
    padding-left: 5%;
    float: left;

    background: #FFFFFF09;
    color: #FFF;
    border-radius: 1vh;
    border: none;
    outline: none;
    transition: all 187ms ease;

    font-family: 'Calibri', sans-serif;
    font-size: 2vh;
}
.boss-actions-input:focus {
    background: #FFFFFF12;
}
.boss-actions-button {
    width: 30%;
    height: 47.4%;
    margin: 1% 0 1% 4%;
    float: left;

    background: #FFFFFF09;
    color: var(--main);
    border-radius: 1vh;
    border: none;
    outline: none;
    transition: all 187ms ease;

    font-family: 'Calibri', sans-serif;
    font-size: 2vh;
}
.boss-actions-button:hover {
    background: #FFFFFF12;
    cursor: pointer;
}

/* BUY */
#buy-container {
    width: 35vh;
    height: auto;
    aspect-ratio: .9/.6;

    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);

    background: linear-gradient(60deg, var(--background));
    border-radius: 2vh;
    opacity: 0;
    transition: all 187ms ease;
    user-select: none;
}

#buy-titel {
    width: 100%;
    margin: 3.5% 0 0 0;

    font-family: 'Calibri', sans-serif;
    font-size: 5vh;
    font-weight: bold;
    text-align: center;
    color: #FFF;
}
#buy-subtitel {
    width: 100%;
    margin: 0;

    font-family: 'Calibri', sans-serif;
    font-size: 2.5vh;
    font-weight: normal;
    text-align: center;
    color: #FFFFFF90;
}
#buy-price {
    width: 100%;
    margin: 3.5% 0 5% 0;

    font-family: 'Calibri', sans-serif;
    font-size: 4vh;
    font-weight: bold;
    font-style: italic;
    text-align: center;
    color: var(--main);
}
#buy-container button {
    width: 90%;
    height: 4vh;
    margin: 0 0 5% 5%;

    background: #FFFFFF09;
    color: var(--main);
    border-radius: 1vh;
    border: none;
    outline: none;
    transition: all 187ms ease;

    font-family: 'Calibri', sans-serif;
    font-size: 2.25vh;
    font-weight: normal;
}
#buy-container button:hover {
    background: #FFFFFF12;
    cursor: pointer;
}

/* FLIGHT */
#flight-container {
    width: 45vh;
    height: auto;

    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);

    background: linear-gradient(60deg, var(--background));
    border-radius: 2vh;
    opacity: 0;
    transition: all 187ms ease;
    user-select: none;
}

#flight-type {
    width: 94%;
    height: 16vh;
    margin: 3%;

    background: #FFFFFF09;
    border-radius: 1vh;
}
#flight-type i {
    width: 50%;
    height: 100%;
    float: left;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 8vh;
    color: var(--main);
    filter: drop-shadow(0 0 2vh var(--glow));
}
#flight-type-data {
    width: 50%;
    height: 100%;
    margin: 0;
    float: left;

    display: flex;
    align-items: center;
}
#flight-type h2 {
    width: 100%;
    margin: 0;

    font-family: 'Calibri', sans-serif;
    font-size: 3.75vh;
    font-weight: bold;
    color: var(--main);
}
#flight-type h2 span {
    width: 100%;
    margin: 0;
    float: left;

    font-family: 'Calibri', sans-serif;
    font-size: 1.75vh;
    font-weight: normal;
    color: #FFFFFF90;
}

#flight-level {
    width: 94%;
    height: 3vh;
    margin: 1% 0 -1% 3%;
    float: left;

    background: linear-gradient(to right, var(--main) 9%, #FFFFFF09 9%);
    color: #FFF;
    border-radius: 1vh;
    filter: drop-shadow(0 0 2vh var(--glow));

    font-family: 'Calibri', sans-serif;
    font-size: 1.25vh;
    font-weight: normal;
    text-align: center;
    line-height: 3vh;
}

#flight-button {
    width: 94%;
    height: 5vh;
    margin: 3%;

    background: #FFFFFF09;
    color: var(--main);
    border-radius: 1vh;
    border: none;
    outline: none;
    transition: all 187ms ease;

    font-family: 'Calibri', sans-serif;
    font-size: 2.5vh;
    font-weight: bold;
}
#flight-button:hover {
    background: var(--main);
    color: #FFF;
    cursor: pointer;
}

/* REDESIGN */
::-webkit-scrollbar {
    width: 0px;
}
::-webkit-scrollbar-track {
    display: none;
}   
::-webkit-scrollbar-thumb {
    display: none;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}