@import url(https://fonts.googleapis.com/css?family=Roboto&display=swap);
@import url("https://fonts.googleapis.com/css?family=Roboto");
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap');
@font-face {
    font-family: "Rimini";
    font-style: normal;
    font-weight: normal;
    src: local('Rimini'), url('./font/Rimini.otf') format('truetype');
}

@font-face {
    font-family: "PerfectlyTogether";
    font-style: normal;
    font-weight: normal;
    src: local('PerfectlyTogether'), url('./font/PerfectlyTogether.ttf') format('truetype');
}

@font-face {
    font-family: "FoolsErrand";
    font-style: normal;
    font-weight: normal;
    src: local('FoolsErrand'), url('./font/FoolsErrand.ttf') format('truetype');
}

@font-face {
    font-family: "NFL";
    font-style: normal;
    font-weight: normal;
    src: local('NFL'), url('./font/Nflcoltt.ttf') format('truetype');
}

@font-face {
    font-family: "Metropolis-Bold";
    src: local('Metropolis-Bold'), url('./font/metropolis.bold.otf') format('opentype');
}

:root {
    --backgroundinsidewindowcolor: rgb(22, 22, 22);
}

body {
    overflow: hidden;
}

.mainalles {
    display: none;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.progress-container {
    display: none;
    margin-left: auto;
    margin-right: auto;
    z-index: 5;
    color: #fff;
    font-family: Metropolis-Bold;
    width: 25vh;
    position: fixed;
    bottom: 10%;
    left: 42.7%;
}

.progress-labels {
    width: 100%;
    top: 1vh;
    height: -20px;
    text-align: center;
    position: absolute;
    display: inline-block;
    white-space: nowrap
}

.progress-labels div {
    font-size: 23px;
    position: relative;
    color: #ffffff;
    z-index: 10;
    font-family: Metropolis-Bold;
}

.progress-bar-container {
    width: 100%;
    background-color: #202020;
    /* transform: skew(-30deg); */
    height: 2vh;
    margin-left: 2px;
    margin-right: 3px;
    margin-top: 5px;
    margin-bottom: 5px;
    background-color: #202020;
    border-radius: 4px;
    padding: 5px;
    text-align: left;
    overflow: hidden;
    position: relative;
    display: block;
    white-space: nowrap;
}

.progress-bar {
    width: 0%;
    background-image: linear-gradient(135deg, rgba(255, 255, 255, .15) 0%, transparent 0%, transparent 0%, rgba(255, 255, 255, .15) 0%, rgba(255, 255, 255, .15) 0%, transparent 0%, transparent);
    height: 100%;
    border-radius: 3px;
    background-size: 30px 30px;
    transition: width 0.3s;
    transition-timing-function: ease-out;
    -webkit-animation: animate-stripes 3s linear infinite;
}

@keyframes animate-stripes {
    0% {
        background-position: 0 0;
    }
    100% {
        background-position: 60px 0;
    }
}

.selected {
    transition: 300ms;
    transform: translateY(-.5rem);
}

.namenlol {
    position: absolute;
    top: 30%;
    left: 30%;
    width: 70vh;
    height: 40vh;
    display: none;
    background-image: url(./img/newbgrathaus.png);
    border-radius: 7px;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
}

.rathauslogo {
    position: absolute;
    top: -15%;
    width: 11vh;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
}

.rathauslogo3 {
    position: absolute;
    top: 35%;
    width: 11vh;
    left: 17%;
}

.hrstrichrathaus {
    position: absolute;
    background-color: #3A3A3A;
    height: 40vh;
    left: 50%;
    width: 0.5vh;
    border-radius: 5px;
}

.register-main {
    display: block;
    position: absolute;
    top: 30%;
    bottom: 50%;
    left: 82%;
    right: 50%;
    transform: translate(-50%, 0%);
    width: 80%;
    height: 70vh;
    display: none;
}

.register-in {
    border-radius: 7px;
    max-width: 100%;
    background-image: url(./img/newbgrathaus.png);
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    width: 20%;
    height: 40vh;
    position: relative;
    display: block;
    align-items: stretch;
    opacity: 1;
}

.input {
    width: 30%;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    border: none;
    margin-top: 80px;
    margin-left: -11%;
    background-color: #202020;
    text-align: center;
    color: #ababab;
    font-family: Metropolis-Bold;
}

.namenbox {
    width: 30%;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    border: none;
    margin-top: 20px;
    margin-left: 35%;
    background-color: #202020;
    color: #ababab;
    font-family: Metropolis-Bold;
}

#fertignamen {
    border: none;
    font-family: Metropolis-Bold;
    border-radius: 7px;
    color: #ababab;
    margin-top: 40%;
    margin-left: 61%;
    width: 30%;
    height: 10%;
    background: #202020;
    font-size: 1.3vh;
}

#fertig {
    border: none;
    font-family: Metropolis-Bold;
    border-radius: 7px;
    color: #ababab;
    margin-top: 95%;
    margin-left: 25.5%;
    width: 50%;
    height: 10%;
    background: #202020;
    font-size: 1.5vh;
}

.btn:hover {
    transition: 300ms;
    transform: translateY(-.3rem);
}

/* BUSINESS */

.busineslol {
    position: absolute;
    top: 30%;
    left: 30%;
    width: 70vh;
    height: 40vh;
    display: none;
    background-image: url(./img/newbgrathaus.png);
    border-radius: 7px;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
}


.businesslogo3 {
    position: absolute;
    top: 35%;
    width: 11vh;
    left: 17%;
}

.hrstrichbusiness {
    position: absolute;
    background-color: #3A3A3A;
    height: 40vh;
    left: 50%;
    width: 0.5vh;
    border-radius: 5px;
}


.businessinfotext {
    position: relative;
    top: 5%;
    left: 25%;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1.5vh;
    text-align: center;
    line-height: 2.1vh;
}

.businessbox {
    width: 30%;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    border: none;
    margin-top: 25%;
    margin-left: 35%;
    background-color: #202020;
    color: #ababab;
    font-family: Metropolis-Bold;
}

#fertigbusiness {
    border: none;
    font-family: Metropolis-Bold;
    border-radius: 7px;
    color: #ababab;
    margin-top: 15%;
    margin-left: 60.7%;
    width: 30%;
    height: 10%;
    background: #202020;
    font-size: 1.3vh;
}

.announcenotify2 {
    font-family: "Metropolis-Bold";
    padding: 0;
    margin: 0;
    margin: 1rem 0 1rem 38%;
    background-color: rgb(42, 42, 42, 0.9);
    width: 40vh;
    height: auto;
    word-wrap: break-word;
    font-weight: 400;
    padding: 1rem;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.158);
    border-radius: 7px;
}

.announcenotify2logo {
    margin: 0rem 0 0rem 44.5%;
    width: 4.2vh;
    border-radius: 100px
}

.notification {
    margin-bottom: 1vh;
    position: relative;
    top: 2vh;
    left: 2vh;
    background-color: rgba(44, 44, 44, 0.767);
    max-width: 18vh;
    min-width: 1vh;
    min-height: 3vh;
    word-wrap: break-word;
    padding: 0.8vh;
    /* border-bottom: 6px solid #900089d0; */
    font-weight: 400;
    font-family: Arial, sans-serif;
    -webkit-box-shadow: 11px 10px 58px -22px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 11px 10px 58px -22px rgba(0, 0, 0, 0.75);
    box-shadow: 11px 10px 58px -22px rgba(0, 0, 0, 0.75);
    border-radius: 7px;
}

.notificationlogo {
    margin-left: 80%;
    width: 3.2vh;
    border-radius: 100px;
    opacity: 0.6;
}

.img {
    margin-top: .7rem;
    margin-left: 0.4rem;
    border-radius: 5px;
    background-color: rgba(0, 0, 0, 0.5);
    text-align: center;
    height: 65px;
    fill: red;
    width: 63px;
    /* background-color: white; */
    margin-top: 0.5rem;
    /* background: url("keys.svg") no-repeat; */
}

#message {
    font-family: "Metropolis-Bold";
    color: #ffffff;
    font-size: 1.3vh;
    margin-left: 2.3vh;
}

.notification i {
    color: white;
    font-size: 1.3vh;
    position: absolute;
    top: 42%;
    left: 6%;
}

#messageannounce {
    font-family: "Metropolis-Bold";
    color: #ffffff;
    font-size: 16px;
    text-align: center;
}

.h1 {
    width: 30px;
    margin-top: 20px;
    background: crimson;
}


/* WEAPONSHOP WARENKORB */

.warenkorbweapon {
    font-family: Metropolis-Bold;
    position: relative;
    display: inline-block;
    left: 73.5%;
    top: 14.4%;
    width: 26.5%;
    height: 65%;
    color: white;
    text-align: center;
    font-size: 14px;
}

.warenkorb-listweapon {
    font-family: Metropolis-Bold;
    position: relative;
    width: 80%;
    height: 62%;
    left: 0.5%;
    margin-left: auto;
    margin-right: auto;
    overflow-x: hidden;
    overflow-y: scroll;
}

.warenkorb-listweapon::-webkit-scrollbar {
    width: 10px;
    height: 15px;
}

.warenkorb-listweapon::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: rgba(255, 255, 255, 0.1);
}

.warenkorb-listweapon::-webkit-scrollbar-thumb {
    background-color: #1b1b1b;
    border-radius: 20px;
    -webkit-box-shadow: rgba(0, 0, 0, .12) 0 3px 13px 1px;
}

.warenkorb-list-elemweapon {
    font-family: Metropolis-Bold;
    position: relative;
    width: 95%;
    height: 45px;
    float: left;
    margin-top: 15px;
    background-color: #1b1b1b;
    font-size: 2.5vh;
    border-radius: 15px;
}

.warenkorb-list-elemweapon p {
    font-family: Metropolis-Bold;
    position: relative;
    color: white;
    font-size: 1.3vh;
    line-height: 55px;
    margin-right: 10px;
    display: inline-block;
    float: left;
    left: 3%;
    bottom: 20px;
}

.warenkorb-list-elemweapon i {
    font-family: Metropolis-Bold;
    color: white;
    position: relative;
    float: right;
    line-height: 45px;
    right: 17px;
    display: inline-block;
    bottom: 100px;
}

.warenkorb-contweapon {
    font-family: Metropolis-Bold;
    position: absolute;
    top: 80%;
    width: 80%;
    height: 14%;
    right: 13%;
    background-color: #1b1b1b;
    font-size: 1.5vh;
    border-radius: 20px;
}

.warenkorb-contweapon p {
    position: relative;
    font-size: 1.9vh;
    display: inline-block;
}

.warenkorb-contweapon span {
    position: relative;
    display: inline-block;
}

.buyweapon {
    font-family: Metropolis-Bold;
    position: absolute;
    top: 98%;
    width: 80%;
    height: 9%;
    right: 13%;
    font-size: 2.1vh;
    background-color: #1b1b1b;
    border-radius: 15px;
    cursor: pointer;
}

.buyweapon p {
    text-align: center;
    margin-top: 3%;
}

.buyweapon:hover {
    background-color: #1a1a1a;
}

.warenkorb-cont-barweapon {
    font-family: Metropolis-Bold;
    position: absolute;
    left: 10%;
}

.warenkorb-cont-bar-leftweapon {
    position: absolute;
}

.warenkorb-cont-bar-rightweapon {
    position: absolute;
}

.warenkorb {
    font-family: Metropolis-Bold;
    position: relative;
    display: inline-block;
    left: 73.5%;
    top: 14.4%;
    width: 26.5%;
    height: 65%;
    color: white;
    text-align: center;
    font-size: 14px;
}

.warenkorb-list {
    font-family: Metropolis-Bold;
    position: relative;
    width: 80%;
    height: 62%;
    left: 0.5%;
    margin-left: auto;
    margin-right: auto;
    overflow-x: hidden;
    overflow-y: scroll;
}

.warenkorb-list::-webkit-scrollbar {
    width: 10px;
    height: 15px;
}

.warenkorb-list::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: rgba(255, 255, 255, 0.1);
}

.warenkorb-list::-webkit-scrollbar-thumb {
    background-color: #1b1b1b;
    border-radius: 20px;
    -webkit-box-shadow: rgba(0, 0, 0, .12) 0 3px 13px 1px;
}

.warenkorb-list-elem {
    font-family: Metropolis-Bold;
    position: relative;
    width: 95%;
    height: 45px;
    float: left;
    margin-top: 15px;
    background-color: #1b1b1b;
    font-size: 2.5vh;
    border-radius: 15px;
}

.warenkorb-list-elem p {
    font-family: Metropolis-Bold;
    position: relative;
    color: white;
    font-size: 1.3vh;
    line-height: 50px;
    margin-right: 10px;
    display: inline-block;
    float: left;
    left: 3%;
    bottom: 20px;
}

.warenkorb-list-elem i {
    font-family: Metropolis-Bold;
    color: white;
    position: relative;
    float: right;
    line-height: 45px;
    right: 17px;
    display: inline-block;
    bottom: 100px;
}

.warenkorb-cont {
    font-family: Metropolis-Bold;
    position: absolute;
    top: 80%;
    width: 80%;
    height: 14%;
    right: 13%;
    background-color: #1b1b1b;
    font-size: 1.5vh;
    border-radius: 20px;
}

.warenkorb-cont p {
    position: relative;
    font-size: 1.9vh;
    display: inline-block;
}

.warenkorb-cont span {
    position: relative;
    display: inline-block;
}

.buy {
    font-family: Metropolis-Bold;
    position: absolute;
    top: 98%;
    width: 80%;
    height: 9%;
    right: 13%;
    font-size: 2.1vh;
    background-color: #1b1b1b;
    border-radius: 15px;
    cursor: pointer;
}

.buy p {
    text-align: center;
    margin-top: 3%;
}

.buy:hover {
    background-color: #1a1a1a;
}

.warenkorb-cont-bar {
    font-family: Metropolis-Bold;
    position: absolute;
    left: 10%;
}

.warenkorb-cont-bar-left {
    position: absolute;
}

.warenkorb-cont-bar-right {
    position: absolute;
}

.shopcon {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 70%;
    height: 68%;
    top: -51%;
    left: -13%;
    overflow: scroll;
}

#shop {
    display: none;
    position: absolute;
    top: 16%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 0%);
    width: 100vh;
    height: 62vh;
    /* background: #1f1f1f; */
    background-image: url(./img/newbgautohaus.png);
    border-radius: 15px 15px 5px 5px;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
}

#produkte {
    font-family: Metropolis-Bold;
    font-size: 2.7vh;
    color: white;
    text-align: center;
    margin-top: 2%;
}

.storelogo {
    position: absolute;
    width: 13vh;
    left: 50%;
    right: 50%;
    top: -6.5%;
    transform: translate(-50%, 20%);
}

.shopitemboximg {
    position: absolute;
    width: 5.5vh;
    left: 50%;
    right: 50%;
    top: 90%;
    transform: translate(-50%, -130%);
    font-family: Metropolis-Bold;
    font-size: 1.5vh;
}

.shopboxpreis {
    text-align: center;
    margin-top: -22%;
}

#produkteshop {
    position: absolute;
    top: 16%;
    left: 2%;
    width: 70vh;
    height: 42vh;
    background: #1b1b1b;
    border-radius: 5px;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.349);
}


/* WEAPONSHOP */

#shopweapon {
    display: none;
    position: absolute;
    top: 16%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 0%);
    width: 100vh;
    height: 62vh;
    background: #1f1f1f;
    border-radius: 15px 15px 5px 5px;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
}

.storelogoweapon {
    position: absolute;
    width: 13vh;
    left: 50%;
    right: 50%;
    top: -6.5%;
    transform: translate(-50%, 20%);
}

#produkteshopweapon {
    position: absolute;
    top: 16%;
    left: 2%;
    width: 70vh;
    height: 42vh;
    background: #1b1b1b;
    border-radius: 5px;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.349);
}

#shopitemboxweapon {
    position: relative;
    display: inline-block;
    margin-top: 10%;
    margin-left: 8%;
    width: 10vh;
    height: 10vh;
    background: rgb(15, 15, 15);
    border-top: 35px solid #272727;
    font-family: Metropolis-Bold;
    font-size: 1.5vh;
    text-align: center;
    line-height: 2vh;
    color: white;
    border-radius: 5px;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.349);
    transition: 200ms;
}

#shopitemboxweapon:hover {
    transition: 200ms;
    transform: translateY(-.5rem);
}

.shopboxpreisweapon {
    text-align: center;
    margin-top: -22%;
}

.shopconweapon {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 70%;
    height: 68%;
    top: -51%;
    left: -13%;
    overflow: scroll;
}

.shopitemboximgweapon {
    position: absolute;
    width: 5.5vh;
    left: 50%;
    right: 50%;
    top: 90%;
    transform: translate(-50%, -130%);
    font-family: "FoolsErrand";
    font-size: 1.5vh;
}


/* WEAPONSHOP END */

#geschwindigkeittacho {
    position: absolute;
    left: 40%;
    top: -37%;
}

#tacho {
    display: none;
    position: absolute;
    top: 97%;
    left: 45.5%;
    width: 14vh;
    height: 3vh;
    background: linear-gradient(to left, #181818, #1b1b1b);
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.212);
    font-family: Poppins;
    font-weight: normal;
    font-size: 1.5vh;
    text-align: center;
    color: white;
    border-radius: 5px;
}

.tachologo {
    position: absolute;
    left: 10%;
    top: 1%;
    width: 3vh;
}

#shopitembox {
    position: relative;
    display: inline-block;
    margin-top: 10%;
    margin-left: 8%;
    width: 10vh;
    height: 10vh;
    background: rgb(15, 15, 15);
    border-top: 35px solid #272727;
    font-family: Metropolis-Bold;
    font-size: 1.5vh;
    text-align: center;
    line-height: 2vh;
    color: white;
    border-radius: 5px;
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.349);
    transition: 200ms;
}

#shopitembox:hover {
    transition: 200ms;
    transform: translateY(-.5rem);
}

#closebuttonshop {
    position: absolute;
    top: 2%;
    left: 96%;
    color: white;
    font-size: 2vh;
    transition: transform .7s ease-in-out;
}

#closebuttonshop:hover {
    transform: rotate(90deg);
}

#closebuttonshopweapon {
    position: absolute;
    top: 2%;
    left: 96%;
    color: white;
    font-size: 2vh;
    transition: transform .7s ease-in-out;
}

#closebuttonshopweapon:hover {
    transform: rotate(90deg);
}

.inv-geben {
    position: absolute;
    width: 10vh;
    height: 5vh;
    background-color: white;
    top: 99.3%;
    left: 42%;
}

#crimelifeschrift {
    position: absolute;
    text-transform: uppercase;
    font-family: "NFL";
    letter-spacing: 0.3vh;
    font-size: 1.8vh;
    color: white;
    top: -1.3%;
    left: 43%;
}

#closebuttoninv {
    position: absolute;
    top: 1%;
    left: 95%;
    color: white;
    transition: 500ms;
    font-size: 2vh;
}

#closebuttoninv:hover {
    transition: 500ms;
    transform: rotate(90deg);
}

.inv-cont-elem {
    text-transform: uppercase;
    letter-spacing: 0.1vh;
    font-family: "NFL";
    border-radius: 2px;
    position: relative;
    text-align: center;
    background: #141414;
    transition: 300ms;
    height: 9vh;
    width: 9vh;
    display: inline-block;
    margin-left: 5%;
    margin-top: 5%;
    top: 1%;
    left: 2.2%;
    opacity: 1.0;
}

.item-inner {
    position: relative;
    border-radius: 5px;
    text-align: center;
    width: 100%;
    height: 100%;
    fill: red;
    opacity: 1.0;
}

.inner-label {
    text-align: center;
    margin-top: 7%;
    color: rgb(255, 255, 255);
    font-family: Metropolis-Bold;
    text-transform: uppercase;
    font-size: 1.2vh;
}

.inner-label-down {
    text-align: center;
    padding-top: 8.5vh;
    color: rgb(255, 255, 255);
}

.inner-label-down2 {
    padding-top: 5.6vh;
    padding-left: 5.5vh;
    color: rgb(255, 255, 255);
    font-family: Metropolis-Bold;
    text-transform: uppercase;
    font-size: 1.5vh;
}

.crimelife {
    color: white;
}

.img2 {
    position: absolute;
    opacity: 0.9;
    margin-top: -30%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    border-radius: 5px;
    text-align: center;
    width: 5.7vh;
}

#penismini22 {
    left: 1250px;
    top: 25px;
    position: absolute;
    overflow: visible;
    width: 13px;
    white-space: nowrap;
    text-align: left;
    font-family: Segoe UI;
    font-style: normal;
    font-weight: normal;
    font-size: 25px;
    color: rgb(255, 0, 0);
}

#penismini22:hover {
    color: red;
    transform: scale(1.2);
}

.maininv {
    display: none;
    position: absolute;
    top: 16%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 0%);
    width: 55vh;
    height: 67vh;
    padding-top: 0.6rem;
    background: #1c1c1c;
    border-radius: 10px;
    overflow-y: scroll;
    overflow-x: hidden;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.137);
    overflow: hidden;
    font-family: Metropolis-Bold;
}

.inventartextoben {
    position: absolute;
    color: white;
    font-size: 5vh;
    left: 5%;
    top: -3%;
}

#inventar {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
    height: 60%;
    top: 18%;
    left: -1.5%;
    overflow: scroll;
}

.closeinv {
    position: absolute;
    top: 2%;
    left: 93%;
    color: white;
    font-size: 2.3vh;
    transition: transform .7s ease-in-out;
}

.closeinv:hover {
    transform: rotate(90deg);
}

.ausgewaehltinventar {
    position: absolute;
    font-size: 1.7vh;
    top: 82%;
    left: 8%;
    font-family: Metropolis-Bold;
    color: white;
    letter-spacing: 0.1rem;
}

.buttons {
    display: none;
    position: relative;
    width: 500px;
    height: 75px;
    background-color: white;
    margin: auto;
    top: 65px;
    border-radius: 11px;
}

.sub-cont-number {
    position: absolute;
    border-radius: 2px;
    width: 7vh;
    height: 3vh;
    float: right;
    display: inline-block;
    top: 14%;
    right: 9.5%;
    text-align: center;
    line-height: 50px;
    vertical-align: middle;
    outline: none;
    color: white;
    background: none;
    border: 3px solid #515151;
    word-wrap: break-word;
    white-space: pre-line;
    overflow: hidden;
    font-size: large;
    font-family: Metropolis-Bold;
}

.packshieldbtn {
    position: absolute;
    border-radius: 2px;
    width: 2.6vh;
    height: 2.6vh;
    float: right;
    display: inline-block;
    top: 14%;
    right: 23.5%;
    text-align: center;
    line-height: 2.6vh;
    font-size: 1.5vh;
    color: white;
    background: none;
    border: 3px solid #515151;
    font-family: Metropolis-Bold;
    cursor: pointer;
}

.packshieldlog {
    position: absolute;
    left: 10%;
    top: 10%;
    width: 2vh;
}

.packshieldbtn:hover {
    opacity: 0.7;
}

.packgunbtn:hover {
    opacity: 0.7;
}

.packgunbtn {
    position: absolute;
    border-radius: 2px;
    width: 2.6vh;
    height: 2.6vh;
    float: right;
    display: inline-block;
    top: 14%;
    right: 30.4%;
    text-align: center;
    line-height: 2.6vh;
    font-size: 1.5vh;
    color: white;
    background: none;
    border: 3px solid #515151;
    font-family: Metropolis-Bold;
    cursor: pointer;
}

.give {
    position: absolute;
    font-family: Metropolis-Bold;
    left: 39%;
    width: 12vh;
    height: 3.5vh;
    background: linear-gradient(to top, #2a2a2a, #2e2e2e);
    color: white;
    text-align: center;
    bottom: 15px;
    border-radius: 5px;
    top: 91%;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.24);
    letter-spacing: 0.1rem;
    line-height: 3.4vh;
    font-size: 1.4vh;
    cursor: pointer;
}

.inventarback {
    display: none;
    position: absolute;
    font-family: Metropolis-Bold;
    left: 35%;
    width: 12vh;
    height: 3.5vh;
    background: linear-gradient(to top, #2a2a2a, #2e2e2e);
    color: white;
    text-align: center;
    bottom: 15px;
    border-radius: 5px;
    top: 13.5%;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.24);
    letter-spacing: 0.1rem;
    line-height: 3.4vh;
    font-size: 1.4vh;
    cursor: pointer;
}

.kofferraumnehmen {
    display: none;
    position: absolute;
    font-family: Metropolis-Bold;
    left: 8%;
    width: 12vh;
    height: 3.5vh;
    background: linear-gradient(to top, #2a2a2a, #2e2e2e);
    color: white;
    text-align: center;
    bottom: 15px;
    border-radius: 5px;
    top: 13.5%;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.24);
    letter-spacing: 0.1rem;
    line-height: 3.4vh;
    font-size: 1.4vh;
    cursor: pointer;
}

.kofferraum {
    display: none;
    position: absolute;
    font-family: Metropolis-Bold;
    left: 35%;
    width: 12vh;
    height: 3.5vh;
    background: linear-gradient(to top, #2a2a2a, #2e2e2e);
    color: white;
    text-align: center;
    bottom: 15px;
    border-radius: 5px;
    top: 13.5%;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.24);
    letter-spacing: 0.1rem;
    line-height: 3.4vh;
    font-size: 1.4vh;
    cursor: pointer;
}

.kofferraumlegen {
    display: none;
    position: absolute;
    font-family: Metropolis-Bold;
    left: 8%;
    width: 12vh;
    height: 3.5vh;
    background: linear-gradient(to top, #2a2a2a, #2e2e2e);
    color: white;
    text-align: center;
    bottom: 15px;
    border-radius: 5px;
    top: 13.5%;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.24);
    letter-spacing: 0.1rem;
    line-height: 3.4vh;
    font-size: 1.4vh;
    cursor: pointer;
}

.use {
    position: absolute;
    font-family: Metropolis-Bold;
    left: 8%;
    width: 12vh;
    height: 3.5vh;
    background: linear-gradient(to top, #2a2a2a, #2e2e2e);
    color: white;
    text-align: center;
    bottom: 15px;
    border-radius: 5px;
    top: 91%;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.24);
    letter-spacing: 0.1rem;
    line-height: 3.4vh;
    font-size: 1.4vh;
    cursor: pointer;
    transition: 200ms;
}

.use:hover {
    transition: 200ms;
    transform: translateY(-0.09rem);
    background: linear-gradient(to top, #429408, #307500);
}

.throw:hover {
    transition: 200ms;
    transform: translateY(-0.09rem);
    background: linear-gradient(to top, #8c0723, #750817);
}

.give:hover {
    transition: 200ms;
    transform: translateY(-0.09rem);
    background: linear-gradient(to top, #ff9d00, #af8600);
}

.kofferraum:hover {
    transition: 200ms;
    transform: translateY(-0.09rem);
    background: linear-gradient(to top, #429408, #307500);
}

.inventarback:hover {
    transition: 200ms;
    transform: translateY(-0.09rem);
    background: linear-gradient(to top, #429408, #307500);
}

.kofferraumlegen:hover {
    transition: 200ms;
    transform: translateY(-0.09rem);
    background: linear-gradient(to top, #004f99, #0192bc);
}

.kofferraumnehmen:hover {
    transition: 200ms;
    transform: translateY(-0.09rem);
    background: linear-gradient(to top, #004f99, #0192bc);
}

.throw {
    position: absolute;
    font-family: Metropolis-Bold;
    width: 12vh;
    height: 3.5vh;
    background: linear-gradient(to top, #2a2a2a, #2e2e2e);
    color: white;
    right: 8%;
    text-align: center;
    bottom: 15px;
    border-radius: 5px;
    top: 91%;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.24);
    letter-spacing: 0.1rem;
    line-height: 3.4vh;
    font-size: 1.4vh;
    cursor: pointer;
}

.ausweis {
    display: none;
}

.ausweisbild {
    position: absolute;
    width: 16%;
    height: 16%;
    right: 2%;
    top: 24%;
}

#ausweisname {
    position: absolute;
    font-family: Metropolis-Bold;
    font-size: 1.5vh;
    color: white;
    left: 83%;
    top: 29%;
}

#ausweisfraktion {
    position: absolute;
    font-family: Metropolis-Bold;
    font-weight: normal;
    letter-spacing: 0.1vh;
    font-size: 1vh;
    color: white;
    left: 83%;
    top: 32%;
}

.moneyhudbg {
    position: absolute;
    /* background: linear-gradient(to left, #181818, #1b1b1b); */
    background-image: url(./img/newbg.png);
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.212);
    border-radius: 10px;
    width: 25vh;
    height: 8vh;
    top: 5%;
    right: 2%;
}

#moneyhudbgtext {
    text-align: center;
    margin-top: 20%;
    font-family: Metropolis-Bold;
    color: white;
    font-size: 2.5vh;
}

.geldsymbol {
    position: absolute;
    /* transform: skew(30deg); */
    left: 39%;
    top: 1%;
    width: 5vh;
}

.funkbox {
    position: absolute;
    /* background: linear-gradient(to left, #181818, #1b1b1b); */
    background-image: url(./img/newbg.png);
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.212);
    border-radius: 10px;
    width: 12vh;
    height: 4.5vh;
    top: 14%;
    right: 9.35%;
}

.funktext {
    margin-top: 12%;
    margin-left: 25%;
    font-family: Metropolis-Bold;
    color: white;
    font-size: 1.5vh;
}

.funkicon {
    position: absolute;
    top: 10%;
    width: 3vh;
}

.micbox {
    position: absolute;
    /* background: linear-gradient(to left, #181818, #1b1b1b); */
    background-image: url(./img/newbg.png);
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.212);
    border-radius: 10px;
    width: 12vh;
    height: 4.5vh;
    top: 14%;
    right: 2%;
}

.mictext {
    margin-top: 12%;
    margin-left: 35%;
    font-family: Metropolis-Bold;
    color: white;
    font-size: 1.5vh;
}

.micicon {
    position: absolute;
    top: 13%;
    left: 4%;
    width: 3vh;
}


/* FFA */

.ffaauswahl {
    display: none;
    position: absolute;
    background: #0e0e0e;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    border-radius: 5px;
    width: 40vh;
    height: 40vh;
    top: 25%;
    left: 39%;
}


/* FFA ZONEN */

.ffabox1 {
    position: absolute;
    background: #141414;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    color: white;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 4vh;
    border-radius: 5px;
    width: 20vh;
    height: 6vh;
    top: 9%;
    left: 24%;
    transition: 400ms;
}

.aktuellespielerffa1 {
    width: 20vh;
    text-align: center;
    margin-top: -12%;
    transition: 400ms;
}

.betretenffa1 {
    display: none;
    position: absolute;
    width: 5vh;
    height: 2vh;
    text-align: center;
    font-size: 1vh;
    border: 3px solid #05851A;
    color: #078f1d;
    border-radius: 7px;
    cursor: pointer;
    top: 58%;
    left: 37%;
}

.betretenffa1:hover {
    transition: 200ms;
    transform: translateY(-0.15rem);
}

.ffabox2 {
    position: absolute;
    background: #141414;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    color: white;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 4vh;
    border-radius: 5px;
    width: 20vh;
    height: 6vh;
    top: 31%;
    left: 24%;
    transition: 400ms;
}

.aktuellespielerffa2 {
    width: 20vh;
    text-align: center;
    margin-top: -12%;
    transition: 400ms;
}

.betretenffa2 {
    display: none;
    position: absolute;
    width: 5vh;
    height: 2vh;
    text-align: center;
    font-size: 1vh;
    border: 3px solid #05851A;
    color: #078f1d;
    border-radius: 7px;
    cursor: pointer;
    top: 58%;
    left: 37%;
}

.betretenffa2:hover {
    transition: 200ms;
    transform: translateY(-0.15rem);
}

.ffabox3 {
    position: absolute;
    background: #141414;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    color: white;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 4vh;
    border-radius: 5px;
    width: 20vh;
    height: 6vh;
    top: 53%;
    left: 24%;
    transition: 400ms;
}

.aktuellespielerffa3 {
    width: 20vh;
    text-align: center;
    margin-top: -12%;
    transition: 400ms;
}

.betretenffa3 {
    display: none;
    position: absolute;
    width: 5vh;
    height: 2vh;
    text-align: center;
    font-size: 1vh;
    border: 3px solid #05851A;
    color: #078f1d;
    border-radius: 7px;
    cursor: pointer;
    top: 58%;
    left: 37%;
}

.betretenffa3:hover {
    transition: 200ms;
    transform: translateY(-0.15rem);
}

.ffabox4 {
    position: absolute;
    background: #141414;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    color: white;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 4vh;
    border-radius: 5px;
    width: 20vh;
    height: 6vh;
    top: 75%;
    left: 24%;
    transition: 400ms;
}

.aktuellespielerffa4 {
    width: 20vh;
    text-align: center;
    margin-top: -12%;
    transition: 400ms;
}

.betretenffa4 {
    display: none;
    position: absolute;
    width: 5vh;
    height: 2vh;
    text-align: center;
    font-size: 1vh;
    border: 3px solid #05851A;
    color: #078f1d;
    border-radius: 7px;
    cursor: pointer;
    top: 58%;
    left: 37%;
}

.betretenffa4:hover {
    transition: 200ms;
    transform: translateY(-0.15rem);
}


/* FFA ZONEN END */

.ffabg {
    display: none;
    position: absolute;
    background: linear-gradient(to left, #131313, #181818);
    /* border-left: 10px solid rgb(54, 54, 54); */
    /* border-right: 10px solid rgb(54, 54, 54); */
    /* transform: perspective(400px) rotateX(20deg); */
    /* box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.349); */
    padding-top: 0.8%;
    padding-left: 8%;
    border-radius: 5px;
    width: 15%;
    height: 5%;
    top: 0%;
    left: 38%;
}

#ffakills {
    position: absolute;
    font-family: Metropolis-Bold;
    color: white;
    font-size: 2.5vh;
    /* transform: skew(10deg); */
    left: 14.5%;
    top: -5%;
}

#ffatode {
    position: absolute;
    font-family: Metropolis-Bold;
    color: white;
    font-size: 2.5vh;
    /* transform: skew(0deg); */
    left: 51.5%;
    top: -5%;
}

#ffakd {
    position: absolute;
    font-family: Metropolis-Bold;
    color: white;
    font-size: 2.5vh;
    /* transform: skew(-10deg); */
    left: 87%;
    top: -5%;
}

.totsymbol {
    position: absolute;
    /* transform: skew(0deg); */
    left: 44.5%;
    top: 36%;
    width: 5%;
}

.killsymbol {
    position: absolute;
    /* transform: skew(10deg); */
    left: 7.3%;
    top: 36%;
    width: 5%;
}

.kdsymbol {
    position: absolute;
    /* transform: skew(-10deg); */
    left: 80%;
    top: 36%;
    width: 5%;
}


/* LIFEINVADER */

.lifeinvaderbox {
    display: none;
    position: absolute;
    background: #191919;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    /* transform: skew(-30deg); */
    border-radius: 15px;
    width: 40vh;
    height: 50vh;
    top: 0%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
}

.lifeinvadertext {
    position: absolute;
    width: 70%;
    height: 25%;
    top: 45%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    border-radius: 5px;
    border: none;
    outline: none;
    background-color: #191919;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1vh;
}

#fertiglifeinvader {
    position: absolute;
    border: none;
    font-family: Metropolis-Bold;
    border-radius: 5px;
    color: white;
    top: 74%;
    left: 25%;
    width: 20vh;
    height: 3vh;
    background: #101010;
    font-size: 1.3vh;
}

.bgwerbetext {
    position: absolute;
    top: 30%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 27vh;
    height: 8vh;
    background-color: #101010;
    border-radius: 7px;
}

.bgwerbetext p {
    text-align: center;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1.5vh;
}

.lifeinvadertext3 {
    text-align: center;
    font-size: 1.4vh;
    color: #8C8B89;
    font-family: Metropolis-Bold;
    margin-top: 77%;
}

.bgschriftlife {
    position: absolute;
    top: 20%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 17vh;
    height: 4vh;
    background-color: #191919;
    border-radius: 7px;
}

.bgschriftlife p {
    text-align: center;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1.5vh;
}

.lifeinvaderbild {
    position: absolute;
    top: -8%;
    left: 50%;
    right: 50%;
    width: 12vh;
    transform: translate(-50%, 50%);
}




/* BUSINESS INVITE */


/* AUTOHAUS */

.autohauslaptopimg {
    display: none;
    position: fixed;
    width: 120vh;
    height: 70vh;
    top: 11.50%;
    left: 16.21%;
    overflow: scroll;
    border: none;
    border-radius: 0px 0px 25px 25px;
}

.container {
    display: none;
    overflow: hidden;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    font-weight: 400;
    font-family: Metropolis-Bold;
    top: 13.1%;
    width: 95vh;
    height: 62.3vh;
    left: 23.2%;
    background: #2b2b2b;
    border-radius: 2.8vh 2.6vh 0.5vh 0.5vh;
}

.barleisteautohaus {
    position: absolute;
    bottom: 1%;
    left: 31.5%;
    width: 35vh;
    height: 5vh;
    background: #3f3f3f;
    border-radius: 10px;
}

.webleisteautohaus {
    position: absolute;
    top: 10%;
    right: 8%;
    width: 35vh;
    height: 3vh;
    background: #3f3f3f;
    border-radius: 10px;
}

.webleisteautohaustext {
    text-align: center;
    color: white;
    font-size: 1.5vh;
    margin-top: 2.4%;
}

.autoubescrhifthandler {
    position: absolute;
    top: 3%;
    left: 8%;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 4vh;
}

.safariicon {
    position: absolute;
    top: 11%;
    left: 10%;
    width: 4vh;
}

.settingsicon {
    position: absolute;
    top: 5%;
    left: 30%;
    width: 4.5vh;
}

.applephoneicon {
    position: absolute;
    top: 7%;
    left: 53%;
    width: 4.2vh;
}

.messageicon {
    position: absolute;
    top: 7%;
    left: 75%;
    width: 4.2vh;
}

#iconslaptop {
    transition: 300ms;
}

#iconslaptop:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.uhrzeitautohaus {
    margin-top: 0.5%;
    color: white;
    font-size: 1.3vh;
    text-align: center;
}

.autohauslogo {
    position: absolute;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    top: -22.5%;
    width: 20vh;
}

.icon {
    position: relative;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 10%;
    border-radius: 25px 25px 0 0;
}

#closeauto {
    position: absolute;
    top: 25%;
    left: 4%;
    color: white;
    font-size: 1.5vh;
    transition: transform .7s ease-in-out;
}

#closeauto:hover {
    transform: rotate(90deg);
}

.label {
    position: relative;
    font-size: 40px;
    top: -1%;
    left: 42.5%;
    color: white;
    font-family: Metropolis-Bold;
    letter-spacing: 0.4rem;
}

.garage-vehicles {
    display: inline-block;
    position: absolute;
    float: left;
    width: 100%;
    height: 65%;
    top: 20%;
    left: 0%;
    overflow: auto;
    overflow-x: hidden;
}

.vehicle {
    position: relative;
    left: 8.5%;
    width: 20vh;
    height: 17vh;
    float: left;
}

.vehicle-inner {
    position: relative;
    width: 95%;
    height: 90%;
    border-radius: 5px;
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    top: 5%;
}

.inner-icon {
    position: relative;
    width: 100%;
    height: 70%;
    border-radius: 7px;
}

.inner-label-knz {
    position: relative;
    width: 100%;
    bottom: 20%;
    text-align: center;
    color: white;
    letter-spacing: 0.1rem;
    font-size: 1.3vh;
    left: 25%;
}

.buyauto {
    position: absolute;
    float: left;
    top: 58%;
    left: 5%;
    vertical-align: middle;
    color: white;
    line-height: 25px;
    font-size: 1.2vh;
}

.buyauto:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.confirmbuttonauto {
    display: none;
    position: absolute;
    width: 200px;
    height: 100px;
    background-color: #1f1f1f;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    color: white;
    text-align: center;
    font-size: 15px;
    padding-top: 10px;
}

#confirmauto {
    position: absolute;
    top: 60%;
    left: 20%;
    color: white;
    font-size: 1.5vh;
    transition: 300ms;
}

#confirmauto:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

#confirmauto2 {
    position: absolute;
    top: 60%;
    left: 65%;
    color: white;
    font-size: 1.5vh;
    transition: 300ms;
}

#confirmauto2:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}


/* GARAGE IN ARBEIT */

.garagekomplett {
    display: none;
    font-family: Arial, sans-serif;
}

.garageicon {
    position: absolute;
    color: white;
    font-size: 4.5vh;
    top: 5%;
    left: 7.8%;
}

.background {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #141414;
    top: 20%;
    left: 19%;
    width: 110vh;
    height: 55vh;
    border-radius: 5px;
    z-index: 1;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
}

.inside {
    /* background-color: #1b1b1b; */
    width: 86vh;
    height: 43.5vh;
    border-radius: 3.4vh;
    z-index: 1;
    margin-top: 10vh;
    margin-left: 3.50vh;
    /* box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349); */
}

.actionside {
    width: 23vh;
    height: 100%;
    z-index: 1;
    margin-right: 4vh;
    border-radius: 5px 0px 0px 5px;
    background-color: #202020;
}

.headericon {
    position: relative;
    color: #707070;
    font-size: 5vh;
    text-align: center;
    margin-top: 3vh;
}

.actions {
    position: relative;
    width: 100%;
    height: 20%;
    top: 10vh;
}

.action {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 6.4vh;
    border-radius: 0.8vh;
    margin-top: 1vh;
    margin-bottom: 1vh;
    opacity: 0.4;
}

.action i {
    color: #707070;
    font-size: 2.0vh;
    margin-left: 1vh;
}

.actionselected {
    background-color: #1d1d1d;
    border-left: 5px solid #ffffff;
    width: 98.7%;
    border-radius: 0px;
    opacity: 1;
    transition: .15s ease-in;
}

.actiontext {
    margin-left: 0.7vh;
    color: white;
    font-size: 2.1vh;
}

.windows {
    width: 100%;
    height: 6vh;
    background-color: var(--backgroundinsidewindowcolor);
    border-radius: 1vh;
    margin-top: 8vh;
}

.currentgarage {
    text-align: center;
    color: white;
    width: 30vh;
    margin-top: 7.5vh;
    margin-left: -3.5vh;
    font-size: 2.35vh;
    font-family: Poppins;
    letter-spacing: 0.1rem;
    text-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.616);
}

.header {
    position: relative;
    width: 100%;
    height: 6vh;
}

#closegarage {
    position: absolute;
    top: -140%;
    left: 93%;
    color: white;
    font-size: 3vh;
    transition: transform .7s ease-in-out;
}

#closegarage:hover {
    transform: rotate(90deg);
}

.searchbar {
    position: relative;
    float: right;
    background-color: rgb(53, 53, 53);
    width: 3vh;
    height: 3vh;
    border-radius: 0.5vh;
    margin-top: -8.4vh;
    margin-right: 13.5vh;
    border: .1vh solid rgba(0, 0, 0, 0.349);
    color: white;
    transition: 300ms;
}

.searchbar.active {
    width: 23vh;
}

.searchbar i {
    position: absolute;
    font-size: 1.2vh;
    width: 3vh;
    height: 3vh;
    text-align: center;
    margin-top: 1vh;
}

.search {
    position: absolute;
    display: none;
    background-color: transparent;
    border: none;
    width: 80%;
    height: 80%;
    resize: none;
    color: #707070;
    ;
    float: right;
    margin-left: 3vh;
    margin-top: 0.33vh;
}

.search:focus {
    border: none;
    outline: none;
}

.searchbar:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.favtoggle {
    position: relative;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -8.4vh;
    margin-right: 8vh;
    width: 3vh;
    height: 3vh;
    background-color: rgb(53, 53, 53);
    border-radius: 0.5vh;
    color: white;
    font-size: 1.2vh;
    border: .1vh solid rgba(0, 0, 0, 0.349);
    transition: 200ms;
}

.favtoggle:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

#parkaction {
    position: relative;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90%;
    height: 7vh;
    margin-top: 80.5%;
    margin-right: 1vh;
    color: white;
    background-color: #181818;
    text-align: center;
    border-radius: 5px;
    font-size: 1.3vh;
    z-index: 1;
    transition: 200ms;
}

#parkaction:hover {
    transition: 300ms;
    transform: translateY(-0.5rem);
}

#parkaction.active:hover {
    color: #707070;
}

#parkaction txt {
    margin-left: 0.5vh;
}

.carfl {
    position: absolute;
    width: 100%;
    height: 100%;
}

.cpyr {
    position: relative;
    text-align: center;
    font-size: 1vh;
    color: white;
    opacity: 0.1;
    top: 2vh;
}

.auto {
    position: relative;
    width: 120%;
    height: 90%;
    left: -9.5%;
    top: -20%;
    overflow: auto;
}

.carcontainer {
    position: relative;
    float: right;
    display: flex;
    align-items: center;
    width: 19vh;
    height: 8vh;
    background-color: rgb(53, 53, 53);
    border-radius: 5px;
    margin-left: 2.2vh;
    margin-top: 2vh;
    float: left;
    color: white;
}

.carcontainer i {
    font-size: 4vh;
    margin-left: 1vh;
}

.carcontainer:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.carinformations {
    height: 6vh;
    width: 100%;
    margin-left: 1vh;
    border-radius: 0.3vh;
}

.model {
    color: white;
    font-weight: 400;
}

.plate {
    font-size: 1.2vh;
    color: rgb(145, 145, 145);
    font-weight: 400;
}

.nickname {
    font-size: 0.9vh;
    color: rgb(145, 145, 145);
    font-weight: 400;
}

.carsetfav {
    position: absolute;
    margin-bottom: 4.5vh;
    margin-right: 0.7vh;
    right: 0;
    color: white;
}

.carsetfav i {
    font-size: 1.2vh
}

.carshowrename {
    position: absolute;
    margin-top: 4.5vh;
    margin-right: 0.7vh;
    right: 0;
    color: white;
}

.carshowrename i {
    font-size: 1.2vh
}

.renamewindow {
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: rgb(53, 53, 53);
    border-radius: 1.5vh;
}

.renamewindow i {
    color: white;
    font-size: 1.4vh;
    margin-top: 1vh;
}

.renamewindow txt {
    position: absolute;
    font-size: 1.1vh;
    margin-left: 0.5vh;
    margin-top: 1vh;
    color: white;
}

.renameinput {
    background-color: var(--backgroundinsidewindowcolor);
    border: none;
    margin-left: 1.1vh;
    margin-top: 3vh;
    border-radius: 1vh;
    text-align: center;
    color: #707070;
    ;
    width: 15vh;
}

.renameinput:focus {
    border: none;
    outline: none;
}

.rename {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 1.7vh;
}

.rename i {
    margin-right: 0.7vh;
    transition: 200ms;
}

.rename:hover i {
    color: #707070;
    ;
}

::-webkit-scrollbar {
    width: 0.3vh;
    border-radius: 15vh;
    display: none;
}

::-webkit-scrollbar-track {
    border-radius: 15vh;
}

::-webkit-scrollbar-thumb {
    background: #707070;
    ;
    border-radius: 15vh;
}

::-webkit-scrollbar-thumb:hover {
    background: rgb(15, 15, 15);
    border-radius: 15vh;
}


/* FRAKGARAGE IN ARBEIT */

.garagekomplettfrak {
    display: none;
    font-family: Arial, sans-serif;
}

.garageiconfrak {
    position: absolute;
    color: white;
    font-size: 4.5vh;
    top: 5%;
    left: 7.8%;
}

.backgroundfrak {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #141414;
    top: 20%;
    left: 19%;
    width: 110vh;
    height: 55vh;
    border-radius: 5px;
    z-index: 1;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
}

.insidefrak {
    /* background-color: #1b1b1b; */
    width: 86vh;
    height: 43.5vh;
    border-radius: 3.4vh;
    z-index: 1;
    margin-top: 10vh;
    margin-left: 3.50vh;
    /* box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349); */
}

.actionsidefrak {
    width: 23vh;
    height: 100%;
    z-index: 1;
    margin-right: 4vh;
    border-radius: 5px 0px 0px 5px;
    background-color: #202020;
}

.headericonfrak {
    position: relative;
    color: #707070;
    font-size: 5vh;
    text-align: center;
    margin-top: 3vh;
}

.actionsfrak {
    position: relative;
    width: 100%;
    height: 20%;
    top: 10vh;
}

.actionfrak {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    height: 6.4vh;
    border-radius: 0.8vh;
    margin-top: 1vh;
    margin-bottom: 1vh;
    opacity: 0.4;
}

.actionfrak i {
    color: #707070;
    font-size: 2.0vh;
    margin-left: 1vh;
}

.actionselectedfrak {
    background-color: #1d1d1d;
    border-left: 5px solid #ffffff;
    width: 98.7%;
    border-radius: 0px;
    opacity: 1;
    transition: .15s ease-in;
}

.actiontextfrak {
    margin-left: 0.7vh;
    color: white;
    font-size: 2.1vh;
}

.windowsfrak {
    width: 100%;
    height: 6vh;
    background-color: var(--backgroundinsidewindowcolor);
    border-radius: 1vh;
    margin-top: 8vh;
}

.headerfrak {
    position: relative;
    width: 100%;
    height: 6vh;
}

#closegaragefrak {
    position: absolute;
    top: -140%;
    left: 93%;
    color: white;
    font-size: 3vh;
    transition: transform .7s ease-in-out;
}

#closegaragefrak:hover {
    transform: rotate(90deg);
}

#parkactionfrak {
    position: relative;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 90%;
    height: 7vh;
    margin-top: 10.5%;
    margin-right: 1vh;
    color: white;
    background-color: #181818;
    text-align: center;
    border-radius: 5px;
    font-size: 1.3vh;
    z-index: 1;
    transition: 200ms;
}

#parkactionfrak:hover {
    transition: 300ms;
    transform: translateY(-0.5rem);
}

#parkactionfrak.active:hover {
    color: #707070;
}

#parkactionfrak txt {
    margin-left: 0.5vh;
}

.carflfrak {
    position: absolute;
    width: 100%;
    height: 100%;
}

.cpyrfrak {
    position: relative;
    text-align: center;
    font-size: 1vh;
    color: white;
    opacity: 0.1;
    top: 2vh;
}

.autofrak {
    position: relative;
    width: 120%;
    height: 90%;
    left: -9.5%;
    top: -20%;
    overflow: auto;
}

.carcontainerfrak {
    position: relative;
    float: right;
    display: flex;
    align-items: center;
    width: 19vh;
    height: 8vh;
    background-color: rgb(53, 53, 53);
    border-radius: 5px;
    margin-left: 2.2vh;
    margin-top: 2vh;
    float: left;
    color: white;
}

.carcontainerfrak i {
    font-size: 4vh;
    margin-left: 1vh;
}

.carcontainerfrak:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.carinformationsfrak {
    height: 6vh;
    width: 100%;
    margin-left: 1vh;
    border-radius: 0.3vh;
}

.modelfrak {
    color: white;
    font-weight: 400;
    margin-top: 15%;
    font-size: 1.5vh;
}

.currentgaragefrak {
    text-align: center;
    color: white;
    width: 30vh;
    margin-top: 9.5vh;
    margin-left: -3.5vh;
    font-size: 2.35vh;
    font-family: Poppins;
    letter-spacing: 0.1rem;
    text-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.616);
}

.frakinfotext {
    text-align: center;
    color: white;
    width: 20vh;
    margin-top: 9.5vh;
    margin-left: 1.5vh;
    font-size: 1.35vh;
    font-family: Poppins;
    letter-spacing: 0.1rem;
    text-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.616);
}


/* FRAKLAGER IN ARBEIT */

#closefraklager {
    position: absolute;
    top: 4%;
    left: 94%;
    color: white;
    font-size: 2.4vh;
    transition: transform .7s ease-in-out;
}

#closefraklager:hover {
    transform: rotate(90deg);
}

.sub-cont-numberfraklager {
    display: none;
    position: relative;
    width: 9vh;
    height: 3vh;
    float: right;
    display: inline-block;
    top: 90%;
    right: 5%;
    text-align: center;
    line-height: 50px;
    vertical-align: middle;
    outline: none;
    color: white;
    font-family: Metropolis-Bold;
    background: linear-gradient(to left, #131313, #181818);
    border-radius: 7px;
    word-wrap: break-word;
    white-space: pre-line;
    overflow: hidden;
    border: none;
    font-size: large;
}

.fraklagerbg {
    display: none;
    position: absolute;
    width: 80vh;
    height: 50vh;
    top: 20%;
    left: 27.5%;
    background: linear-gradient(to right, #1e1e1e, #1d1d1d);
    border-radius: 10px;
}

.fraklagerlinksbg {
    position: absolute;
    width: 20vh;
    height: 50vh;
    background: linear-gradient(to left, #181818, #1b1b1b);
    border-radius: 10px;
}

.fraklagertextoben {
    position: absolute;
    top: -1%;
    left: 40%;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 3vh;
    letter-spacing: 0.4rem;
}

.fraklagerhoverdings {
    position: absolute;
    width: 14vh;
    height: 5vh;
    left: 14%;
    top: 10%;
    background: linear-gradient(to left, #131313, #131313);
    border-left: 5px solid #131313;
    border-radius: 7px;
    transition: 500ms;
}

.fraklagerhoverdingstext {
    text-align: center;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1.8vh;
    letter-spacing: 0.2rem;
}

.fraklagerwaffenkaufen {
    display: none;
    position: absolute;
    width: 12vh;
    height: 3vh;
    left: 4%;
    top: 20%;
    background: linear-gradient(to left, #0c0c0c, #0f0f0f);
    border-left: 5px solid #131313;
    border-radius: 7px;
}

.fraklagerwaffenkaufentext {
    margin-top: 6%;
    text-align: center;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1.2vh;
    letter-spacing: 0.1rem;
}

.fraklagerwaffenkaufen:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.fraklageritemkaufen {
    display: none;
    position: absolute;
    width: 12vh;
    height: 3vh;
    left: 4%;
    top: 40%;
    background: linear-gradient(to left, #0c0c0c, #0f0f0f);
    border-left: 5px solid #131313;
    border-radius: 7px;
}

.fraklageritemkaufentext {
    margin-top: 6%;
    text-align: center;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1.2vh;
    letter-spacing: 0.1rem;
}

.fraklageritemkaufen:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.fraklageritemholen {
    display: none;
    position: absolute;
    width: 12vh;
    height: 3vh;
    left: 4%;
    top: 60%;
    background: linear-gradient(to left, #0c0c0c, #0f0f0f);
    border-left: 5px solid #131313;
    border-radius: 7px;
}

.fraklageritemholentext {
    margin-top: 6%;
    text-align: center;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1.2vh;
    letter-spacing: 0.1rem;
}

.fraklageritemholen:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.fraklageritemlagern {
    display: none;
    position: absolute;
    width: 12vh;
    height: 3vh;
    left: 4%;
    top: 80%;
    background: linear-gradient(to left, #0c0c0c, #0f0f0f);
    border-left: 5px solid #131313;
    border-radius: 7px;
}

.fraklageritemlagerntext {
    margin-top: 6%;
    text-align: center;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 1.2vh;
    letter-spacing: 0.1rem;
}

.fraklageritemlagern:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.fraklagerlogo {
    position: absolute;
    width: 10vh;
    top: 40%;
    left: 24%;
    transition: 400ms;
}

.fraklagerboxfuerwaffen {
    position: absolute;
    top: 14%;
    left: 31%;
    width: 50vh;
    height: 40vh;
    margin-left: auto;
    margin-right: auto;
    overflow-x: hidden;
    overflow-y: scroll;
}

.waffeitembox {
    display: inline-block;
    margin-left: 5%;
    margin-top: 5%;
    width: 9vh;
    height: 9vh;
    color: white;
    font-family: Metropolis-Bold;
    background: linear-gradient(to left, #131313, #181818);
    border-radius: 7px;
}

.waffelogo {
    position: relative;
    top: 0%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 4vh;
    height: auto;
}

.waffepreis {
    text-align: center;
    margin-top: 35%;
}

.waffename {
    text-align: center;
}

.fraklagerboxfuerwaffen::-webkit-scrollbar {
    width: 7px;
    padding-left: 100px;
    background: #4e4d4d;
    margin: 25px;
    border-radius: 0.1rem;
}

.fraklagerboxfuerwaffen::-webkit-scrollbar-thumb {
    background: #900089;
    border-radius: 0.1rem;
}

.fraklagerboxfuerwaffen::-webkit-scrollbar-track {
    border-radius: 10px;
    background-color: #1a1a1a;
}

.waffeitembox:hover {
    transition: 300ms;
    transform: translateY(-.4rem);
}

.itembox {
    display: inline-block;
    margin-left: 5%;
    margin-top: 5%;
    width: 9vh;
    height: 9vh;
    color: white;
    font-family: Metropolis-Bold;
    background: linear-gradient(to left, #131313, #181818);
    border-radius: 7px;
}

.itemlogo {
    position: relative;
    top: 0%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 4vh;
    height: auto;
}

.itempreis {
    text-align: center;
    margin-top: 35%;
}

.itemname {
    text-align: center;
}

.itembox:hover {
    transition: 300ms;
    transform: translateY(-.4rem);
}


/* Frakkleidung */

.frakauswahllogo {
    position: absolute;
    top: -2%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 6.2vh;
    border-radius: 100px
}

#frakauswahlschrift {
    position: absolute;
    top: 7%;
    left: 50%;
    right: 50%;
    width: 10%;
    transform: translate(-50%, 50%);
    text-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.37);
    color: white;
    font-size: 1.5vh;
    border-radius: 10px;
    font-family: "NFL";
    padding-top: 0.25%;
    text-align: center;
    letter-spacing: 0.1vh;
}

#kleider {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    height: 80%;
    top: 20%;
    left: 7%;
    overflow: hidden;
}

.kleiderauswahl {
    display: none;
    position: absolute;
    width: 120vh;
    height: 70vh;
    top: 15%;
    left: 16.2%;
    background: linear-gradient(to right, #1e1e1e, #1d1d1d);
    border-radius: 10px;
}

.list {
    display: inline-block;
    margin-left: 10%;
    margin-top: 10%;
    margin-right: 15%;
}

.listitem {
    position: relative;
    width: 0;
    height: 0;
    margin-left: 4vh;
    border-radius: 10px;
    background: none;
    border: none;
    transition: 750ms;
    opacity: 0.7;
}

.listimage {
    position: absolute;
    margin-top: 1.5%;
    margin-left: 5%;
    width: 0;
    height: 0;
    border-radius: 10px;
    background: none;
    transition: 750ms;
}

.imagevonoutfit {
    margin-top: 5px;
    margin-left: 2.5%;
    width: 0;
    height: 0;
    border-radius: 10px;
    border: none;
    transition: 750ms;
}

.listitem:hover {
    transition: 300ms;
    transform: translateY(-.3rem);
}

.inner-label-kleidungsid {
    display: none;
    text-align: center;
    color: rgb(255, 255, 255);
}

.inner-label-kleidungsid-down {
    text-align: center;
    font-size: 2vh;
    padding-top: 4vh;
    color: rgb(255, 255, 255);
}

.selectedkleidung {
    transition: 300ms;
    transform: translateY(-.5rem);
}

.kleidungplay {
    position: absolute;
    top: 90%;
    height: 3%;
    width: 8%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background: #282828;
    border: 5px solid #323232;
    text-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.37);
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.13);
    color: white;
    font-size: 1.5vh;
    border-radius: 10px;
    font-family: "Metropolis-Bold";
    padding-top: 0.25%;
    text-align: center;
    letter-spacing: 0.01vh;
    opacity: 0.7;
}

.kleidungplay:hover {
    background-color: rgb(29, 29, 29);
}

#closekleiderwahl {
    position: absolute;
    top: 2%;
    left: 96.5%;
    color: white;
    font-size: 2.5vh;
    transition: transform .7s ease-in-out;
}

#closekleiderwahl:hover {
    transform: rotate(90deg);
}

.kleiderwahltextoben {
    position: absolute;
    top: -1%;
    left: 43%;
    color: white;
    font-family: Metropolis-Bold;
    font-size: 3vh;
    letter-spacing: 0.4rem;
}

.outfit1button {
    text-align: center;
    margin-top: -35%;
    margin-left: 43.5%;
    width: 15vh;
    height: 4vh;
    min-height: 3.5vh;
    max-height: 3.5vh;
    border-radius: 10px;
    color: white;
    background: #282828;
    border: 5px solid #323232;
    opacity: 0.7;
    font-family: Metropolis-Bold;
    padding-top: 1vh;
    font-size: 2vh;
}

.kleiderlogo {
    position: absolute;
    width: 35vh;
    top: 2%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    opacity: 0.1;
}

.frakinvitebox {
    display: none;
    position: absolute;
    top: 30%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 30vh;
    height: 15vh;
    font-family: Metropolis-Bold;
    color: white;
    background: linear-gradient(to right, #1e1e1e, #1d1d1d);
    border-radius: 5px;
}

.frakinvitefraktext {
    text-align: center;
    margin-top: 4%;
    font-size: 2vh;
}

.fraktextbox {
    text-align: center;
    margin-top: 10%;
    font-size: 1.5vh;
}

.frakinviteja {
    text-align: center;
    line-height: 4vh;
    margin-left: 10%;
    width: 10vh;
    height: 4vh;
    background: #282828;
    background: linear-gradient(to right, #181818, #1a1a1a);
    border-bottom: 3px solid rgba(92, 92, 92, 0.506);
    border-radius: 5px;
    transition: 300ms;
    font-size: 1.4vh;
    cursor: pointer;
}

.frakinviteja:hover {
    transition: 300ms;
    transform: translateY(-0.3rem);
}

.frakinvitene {
    text-align: center;
    line-height: 4vh;
    margin-top: -14.2%;
    margin-left: 56%;
    width: 10vh;
    height: 4vh;
    background: #282828;
    background: linear-gradient(to right, #181818, #1a1a1a);
    border-bottom: 3px solid rgba(92, 92, 92, 0.506);
    border-radius: 5px;
    transition: 300ms;
    font-size: 1.4vh;
    cursor: pointer;
}

.frakinvitene:hover {
    transition: 300ms;
    transform: translateY(-0.3rem);
}

/* BUSINESS INVITE */

.frakinviteboxbusiness {
    display: none;
    position: absolute;
    top: 30%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 30vh;
    height: 15vh;
    font-family: Metropolis-Bold;
    color: white;
    background: linear-gradient(to right, #1e1e1e, #1d1d1d);
    border-radius: 5px;
}

.frakinvitefraktextbusiness {
    text-align: center;
    margin-top: 4%;
    font-size: 2vh;
}

.fraktextboxbusiness {
    text-align: center;
    margin-top: 10%;
    font-size: 1.5vh;
}

.frakinvitejabusiness {
    text-align: center;
    line-height: 4vh;
    margin-left: 10%;
    width: 10vh;
    height: 4vh;
    background: #282828;
    background: linear-gradient(to right, #181818, #1a1a1a);
    border-bottom: 3px solid rgba(92, 92, 92, 0.506);
    border-radius: 5px;
    transition: 300ms;
    font-size: 1.4vh;
    cursor: pointer;
}

.frakinvitejabusiness:hover {
    transition: 300ms;
    transform: translateY(-0.3rem);
}

.frakinvitenebusiness {
    text-align: center;
    line-height: 4vh;
    margin-top: -14.2%;
    margin-left: 56%;
    width: 10vh;
    height: 4vh;
    background: #282828;
    background: linear-gradient(to right, #181818, #1a1a1a);
    border-bottom: 3px solid rgba(92, 92, 92, 0.506);
    border-radius: 5px;
    transition: 300ms;
    font-size: 1.4vh;
    cursor: pointer;
}

.frakinvitenebusiness:hover {
    transition: 300ms;
    transform: translateY(-0.3rem);
}


/* MONEY GEBEN */

.moneyboxein {
    display: none;
    position: absolute;
    top: 40%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 40vh;
    height: 10vh;
    background: linear-gradient(to right, #181818, #1a1a1a);
    border-radius: 5px;
    font-family: Metropolis-Bold;
}

#closemoneyboxin {
    position: absolute;
    top: 7%;
    left: 93%;
    color: white;
    font-size: 1.8vh;
    transition: transform .7s ease-in-out;
}

#closemoneyboxin:hover {
    transform: rotate(90deg);
}

.moneyeingeben {
    width: 10%;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: -5%;
    margin-left: 47%;
    background-color: #1d1d1d;
    border: none;
    color: #ababab;
    font-size: 1.5vh;
    text-align: center;
}

#moneygeben {
    border: none;
    font-family: Metropolis-Bold;
    border-radius: 7px;
    color: #ababab;
    margin-top: 15.5%;
    margin-left: 38%;
    width: 10vh;
    height: 3vh;
    background-color: #1d1d1d;
    font-size: 1.3vh;
}


/* CHAR CREATOR */

.charcreatormain {
    display: none;
    font-family: Metropolis-Bold;
}

.charcreatorleftbg {
    position: absolute;
    height: 90vh;
    width: 30vh;
    top: 5%;
    left: 5%;
    background-color: #1e1e1e;
    border-radius: 5px;
}

.skinsaveleft {
    position: absolute;
    width: 15vh;
    height: 4vh;
    top: 90%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #087e00;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    border-radius: 15px;
    transition: 300ms;
    cursor: pointer;
}

.skinsaveleft:hover {
    background-color: #0ba700;
}

.skinsavelefttext {
    text-align: center;
    color: white;
    margin-top: 8%;
    font-size: 1.6vh;
}

.charladenbtn {
    position: absolute;
    width: 15vh;
    height: 4vh;
    top: 78%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #e9be00;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    border-radius: 15px;
    transition: 300ms;
    cursor: pointer;
}

.charladenbtn:hover {
    background-color: #ffd000;
}

.charladentxt {
    text-align: center;
    color: white;
    margin-top: 8%;
    font-size: 1.6vh;
}

.sexandern {
    position: absolute;
    width: 15vh;
    height: 4vh;
    top: 84%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #0068a5;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    border-radius: 15px;
    transition: 300ms;
    cursor: pointer;
}

.sexandern:hover {
    background-color: #0078be;
}

.sexleftext {
    text-align: center;
    color: white;
    margin-top: 8%;
    font-size: 1.4vh;
}

.charcreatorkategoriebox {
    display: block;
    margin-left: 13%;
    margin-top: 5%;
    width: 20vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #232323;
    border: solid 2px #2d2d2d;
    border-radius: 15px;
    cursor: pointer;
}

.charcreatorkategoriebox:hover {
    background-color: #2a2a2a;
}

.charcreatorleftcategorytext {
    text-align: center;
    color: white;
    margin-top: 6.5%;
    font-size: 1.6vh;
}

.charcreatorkategorien {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
    height: 88%;
    top: 2%;
    left: 0%;
    overflow: scroll;
}

.charcreatorrightbg {
    position: absolute;
    height: 90vh;
    width: 70vh;
    top: 5%;
    right: 5%;
    background-color: #1e1e1e;
    border-radius: 5px;
}

.charcreatorkleidungbox {
    display: inline-block;
    margin-left: 7%;
    margin-top: 5%;
    width: 10vh;
    opacity: 0.7;
    cursor: pointer;
}

.charcreatorkleidungbox:hover {
    opacity: 1;
}

.charcreatorkleidungid {
    text-align: center;
    color: white;
    font-size: 1.5vh;
}

.charcreatorkleidungboximg {
    width: 10vh;
    height: 10vh;
    border-radius: 15px;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
}

.charcreatorkkleidung {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    width: 90%;
    height: 88%;
    top: 0%;
    left: 0%;
    overflow: scroll;
}

.charcreatorslider {
    position: absolute;
    width: 60%;
    top: 85%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    /* Width of the outside container */
}


/* The slider itself */

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 15px;
    border-radius: 5px;
    background: #161616;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
}


/* Mouse-over effects */

.slider:hover {
    opacity: 1;
    /* Fully shown on mouse-over */
}

.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #2f2f2f;
}

.slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #2f2f2f;
}

.charinputd {
    text-align: center;
    width: 13vh;
    height: 5vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 3%;
    margin-left: 35.5%;
    background-color: #2f2f2f;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    outline: none;
    border: none;
    color: white;
    font-size: 2vh;
    font-family: Metropolis-Bold;
}

.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 15px;
    border-radius: 5px;
    background: #161616;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
}


/* HEADING CHAR */

.headingslider {
    position: absolute;
    width: 20%;
    top: 90%;
    left: 39%;
    right: 50%;
    transform: translate(-50%, 50%);
    /* Width of the outside container */
}


/* The slider itself */

.headslider {
    -webkit-appearance: none;
    width: 100%;
    height: 15px;
    border-radius: 5px;
    background: #161616;
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

.headslider:hover {
    opacity: 1;
    /* Fully shown on mouse-over */
}

.headslider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #0068a5;
}

.headslider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #0068a5;
}


/* searchbar */

.searchbarchar {
    position: relative;
    float: right;
    background-color: #2f2f2f;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    width: 3vh;
    height: 3vh;
    border-radius: 0.5vh;
    margin-top: 5.3vh;
    margin-right: 2.5vh;
    color: white;
    transition: 300ms;
    opacity: 0.7;
}

.searchbarchar.active {
    width: 7vh;
}

.searchbarchar i {
    position: absolute;
    font-size: 1.2vh;
    width: 3vh;
    height: 3vh;
    text-align: center;
    margin-top: 1vh;
}

.searchchar {
    position: absolute;
    display: none;
    background-color: transparent;
    border: none;
    width: 80%;
    height: 80%;
    resize: none;
    color: white;
    float: right;
    margin-left: 3vh;
    margin-top: 0.33vh;
}

.searchchar:focus {
    border: none;
    outline: none;
}

.searchbarchar:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}


/* GAMGWAR */

.gangwarmain {
    display: none;
    font-family: Metropolis-Bold;
    color: white;
}

.gangwarbg {
    position: absolute;
    top: -5%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 46vh;
    height: 8vh;
    background-color: #1e1e1e;
    border-radius: 5px;
}

.timergangwar {
    position: absolute;
    top: 6.7%;
    left: 45.5%;
    transform: perspective(400px) rotateX(-20deg);
    width: 16vh;
    height: 5vh;
    background-color: #1e1e1e;
    border-radius: 5px;
}

.gangwartimertext {
    text-align: center;
    margin-top: 9%;
    font-size: 2.5vh;
    transform: skew(0deg)
}

.gangwarbesitzer {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 8vh;
    top: 0%;
    left: 0%;
    overflow: scroll;
    background-color: #1e1e1e;
    border-radius: 5px;
}

.gangwarbesitzerimg {
    position: absolute;
    top: -5%;
    left: 40%;
    right: 10%;
    transform: translate(-50%, 50%);
    width: 5vh;
    height: 5vh;
}

.gangwarbesitzerfrak {
    text-align: left;
    margin-left: 10%;
    margin-top: 19%;
    font-size: 1.4vh;
}

.gangwarbesitzerpoints {
    font-size: 1.4vh;
    margin-left: 60%;
    margin-top: -12%;
}

.gangwarangreifer {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 8vh;
    top: 0%;
    right: 0%;
    overflow: scroll;
    background-color: #1e1e1e;
    border-radius: 5px;
}

.gangwarangreiferimg {
    position: absolute;
    top: -5%;
    left: 50%;
    right: 10%;
    transform: translate(-50%, 50%);
    width: 5vh;
    height: 5vh;
}

.gangwarangreiferfrak {
    text-align: right;
    margin-right: 10%;
    margin-top: 19%;
    font-size: 1.4vh;
}

.gangwarangreiferpoints {
    font-size: 1.4vh;
    margin-top: -12%;
}

.gangwarlogo {
    position: absolute;
    top: -20%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 6vh;
}


/* DONO SYSTEM */

.donatormain {
    display: none;
    position: absolute;
    color: white;
    background-image: url(./img/newbg.png);
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    border-radius: 5px;
    top: 10%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 70vh;
    height: 40vh;
    font-family: Metropolis-Bold;
}

#closedonator {
    position: absolute;
    top: 3%;
    left: 95%;
    color: white;
    font-size: 2vh;
    transition: transform .7s ease-in-out;
}

#closedonator:hover {
    transform: rotate(90deg);
}

.dono1 {
    position: absolute;
    top: -14%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 14vh;
    opacity: 0.7;
}

.dono2 {
    position: absolute;
    top: -10%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 14vh;
    opacity: 0.7;
}

.donatorfranklin {
    position: absolute;
    bottom: 0%;
    left: 5%;
    width: 13vh;
    opacity: 0.9;
}

.donatorfrau {
    position: absolute;
    bottom: -3%;
    right: -6%;
    width: 27vh;
    opacity: 0.6;
}

.coderedeem {
    position: absolute;
    width: 12vh;
    height: 3vh;
    top: 70%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    border-radius: 5px;
    transition: 300ms;
    cursor: pointer;
}

.coderedeem:hover {
    background-color: #1a1a1a;
}

.codeeingebenredeem {
    text-align: center;
    width: 20vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 25%;
    margin-left: 35.5%;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    outline: none;
    border: none;
    color: white;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
    text-transform: uppercase;
}

.coderedeemtext {
    text-align: center;
    color: white;
    margin-top: 7.5%;
    font-size: 1.4vh;
}

.jumpscareclass {
    position: absolute;
    display: none;
    width: 100%;
    height: 100%;
    padding: 10px;
}

.jumpscarelol {
    position: fixed;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
}


/* AMENU V2 */

.amenuv2bg {
    position: absolute;
    color: white;
    background-color: #1e1e1e;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.349);
    border-radius: 5px;
    top: -20%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 60vh;
    height: 70vh;
    font-family: Metropolis-Bold;
}

.playerlistamenu {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 50vh;
    top: 24%;
    left: 5%;
    overflow: scroll;
    background-color: #202020;
    border-radius: 5px;
}

.playeritembox {
    display: block;
    margin-left: 12%;
    margin-top: 5%;
    width: 15vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #1b1b1b;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.hrplayermenu {
    width: 45%;
    height: 0px;
    margin-left: 27%;
    margin-top: -37px;
    border: 1px solid rgba(255, 255, 255, 0.33);
}

.playeridamenu {
    text-align: center;
    padding-top: 4%;
}

.playernameamenu {
    text-align: center;
    margin-top: -10px;
}

.playerlistamenu2 {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 50vh;
    top: 24%;
    left: 5%;
    overflow: scroll;
    background-color: #202020;
    border-radius: 5px;
}

.playeritembox2 {
    display: block;
    margin-left: 12%;
    margin-top: 5%;
    width: 15vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #1b1b1b;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.hrplayermenu2 {
    width: 45%;
    height: 0px;
    margin-left: 27%;
    margin-top: -37px;
    border: 1px solid rgba(255, 255, 255, 0.33);
}

.playeridamenu2 {
    text-align: center;
    padding-top: 4%;
}

.playernameamenu2 {
    text-align: center;
    margin-top: -10px;
}

.amenuv2logo {
    position: absolute;
    left: 50%;
    right: 50%;
    top: -8.5%;
    transform: translate(-50%, 50%);
    width: 12vh;
}

.selectedamenu {
    background-color: #161616;
}

.selectedamenu2 {
    background-color: #161616;
}

.playermenuinfos {
    position: absolute;
    top: 24%;
    right: 5%;
    background-color: #202020;
    width: 34vh;
    height: 50vh;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.licenseamenu {
    position: absolute;
    font-size: 1.2vh;
    top: 1%;
    left: -1%;
}

.discordamenu {
    position: absolute;
    font-size: 1.2vh;
    top: 6%;
    left: -1%;
}

.ipamenu {
    position: absolute;
    font-size: 1.2vh;
    top: 11%;
    left: -1%;
    color: #1a1a1a;
    background: #1a1a1a;
    border-radius: 5px;
    cursor: pointer;
}

.amenugoto {
    position: absolute;
    font-size: 1.5vh;
    top: 20%;
    left: -1%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenugoto2 {
    text-align: center;
    margin-top: 15%;
}

.amenubring {
    position: absolute;
    font-size: 1.5vh;
    top: 20%;
    left: 35%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenubring2 {
    text-align: center;
    margin-top: 15%;
}

.amenuspec {
    position: absolute;
    font-size: 1.5vh;
    top: 20%;
    left: 71%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuspec2 {
    text-align: center;
    margin-top: 15%;
}

.amenurevive {
    position: absolute;
    font-size: 1.5vh;
    top: 35%;
    left: -1%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenurevive2 {
    text-align: center;
    margin-top: 15%;
}

.amenukick {
    position: absolute;
    font-size: 1.5vh;
    top: 35%;
    left: 35%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenukick2 {
    text-align: center;
    margin-top: 15%;
}

.amenuban {
    position: absolute;
    font-size: 1.5vh;
    top: 35%;
    left: 71%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuban2 {
    text-align: center;
    margin-top: 15%;
}

.amenuban:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenugoto:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenubring:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenuspec:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenurevive:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenukick:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenuban:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenuban1day:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenuban3day:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenuban7day:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenuban14day:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenuban30day:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenubanpermday:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.amenuban1day {
    position: absolute;
    font-size: 1.5vh;
    top: 40%;
    left: -1%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuban1day {
    text-align: center;
    margin-top: 15%;
}

.amenuban3day {
    position: absolute;
    font-size: 1.5vh;
    top: 40%;
    left: 35%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuban3day {
    text-align: center;
    margin-top: 15%;
}

.amenuban7day {
    position: absolute;
    font-size: 1.5vh;
    top: 40%;
    left: 71%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuban7day {
    text-align: center;
    margin-top: 15%;
}

.amenuban14day {
    position: absolute;
    font-size: 1.5vh;
    top: 55%;
    left: -1%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuban14day {
    text-align: center;
    margin-top: 15%;
}

.amenuban30day {
    position: absolute;
    font-size: 1.5vh;
    top: 55%;
    left: 35%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuban30day {
    text-align: center;
    margin-top: 15%;
}

.amenubanpermday {
    position: absolute;
    font-size: 1.5vh;
    top: 55%;
    left: 71%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenubanpermday {
    text-align: center;
    margin-top: 15%;
}

.grundbann {
    text-align: center;
    width: 20vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 120%;
    margin-left: 16.5%;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    outline: none;
    border: none;
    color: white;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
    text-transform: uppercase;
}

.banndauer {
    text-align: center;
    width: 20vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 10%;
    margin-left: 16.5%;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.198);
    outline: none;
    border: none;
    color: white;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
    text-transform: uppercase;
}

.amenuv2onlinebutton {
    position: absolute;
    font-size: 1.5vh;
    top: 6%;
    left: 10%;
    width: 14vh;
    height: 5vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuv2onlinebuttontext {
    text-align: center;
    margin-top: 12%;
    font-size: 1.9vh;
}

.amenuv2selfbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 6%;
    right: 10%;
    width: 14vh;
    height: 5vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuv2selfbuttontext {
    text-align: center;
    margin-top: 12%;
    font-size: 1.9vh;
}

.amenuv2teambutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15%;
    left: 38.3%;
    width: 14vh;
    height: 5vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuv2teambuttontext {
    text-align: center;
    margin-top: 12%;
    font-size: 1.9vh;
}

.amenuv2fahrzeugbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 6%;
    left: 10%;
    width: 14vh;
    height: 5vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.amenuv2fahrzeugbuttontext {
    text-align: center;
    margin-top: 12%;
    font-size: 1.9vh;
}

.openamenuv2online {
    position: absolute;
    top: 24%;
    right: 5%;
    background-color: #202020;
    width: 34vh;
    height: 50vh;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.amenuv2fahrzeugmaybe {
    position: absolute;
    top: 24%;
    right: 5%;
    background-color: #202020;
    width: 34vh;
    height: 50vh;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.amenuv2selfmaybe {
    position: absolute;
    top: 24%;
    right: 5%;
    background-color: #202020;
    width: 34vh;
    height: 50vh;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.propbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 2.3%;
    left: -1%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.propbutton2 {
    text-align: center;
    margin-top: 15%;
}

.rambutton {
    position: absolute;
    font-size: 1.5vh;
    top: 2.3%;
    left: 35%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.rambutton2 {
    text-align: center;
    margin-top: 15%;
}

.firebutton {
    position: absolute;
    font-size: 1.5vh;
    top: 2.3%;
    left: 71%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.firebutton2 {
    text-align: center;
    margin-top: 15%;
}

.explodebutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15.3%;
    left: -1%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.explodebutton2 {
    text-align: center;
    margin-top: 15%;
}

.kickcarbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15.3%;
    left: 35%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.kickcarbutton2 {
    text-align: center;
    margin-top: 15%;
}

.freezebutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15.3%;
    left: 71%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.freezebutton2 {
    text-align: center;
    margin-top: 15%;
}

.drunkbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 30.3%;
    left: -1%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.drunkbutton2 {
    text-align: center;
    margin-top: 15%;
}

.pedrechtebutton {
    position: absolute;
    font-size: 1.5vh;
    top: 30.3%;
    left: 35%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.pedrechtebutton2 {
    text-align: center;
    margin-top: 15%;
}

.jumpbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 30.3%;
    left: 71%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.jumpbutton2 {
    text-align: center;
    margin-top: 15%;
}

.crashbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 35.3%;
    left: -1%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.crashbutton {
    text-align: center;
    margin-top: 15%;
}

.tazerbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 35.3%;
    left: 35%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.tazerbutton {
    text-align: center;
    margin-top: 15%;
}

.givewaffebutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15%;
    left: -45%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.givewaffebutton2 {
    text-align: center;
    margin-top: 15%;
}

.kompobutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15%;
    left: 5%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.kompobutton2 {
    text-align: center;
    margin-top: 15%;
}

.pedsetzenbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15%;
    left: 55%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.pedsetzenbutton2 {
    text-align: center;
    margin-top: 15%;
}

.epssetzenbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 30%;
    left: -45%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.epssetzenbutton2 {
    text-align: center;
    margin-top: 15%;
}

.carspawnbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15%;
    left: -45%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.carspawnbutton2 {
    text-align: center;
    margin-top: 15%;
}

.kennzeichenbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15%;
    left: 5%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.kennzeichenbutton2 {
    text-align: center;
    margin-top: 15%;
}

.iddestorybutton {
    position: absolute;
    font-size: 1.5vh;
    top: 15%;
    left: 55%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.iddestorybutton2 {
    text-align: center;
    margin-top: 15%;
}

.repairbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 30%;
    left: -45%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.repairbutton2 {
    text-align: center;
    margin-top: 15%;
}

.vhgodmodebutton {
    position: absolute;
    font-size: 1.5vh;
    top: 30%;
    left: 5%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.vhgodmodebutton2 {
    text-align: center;
    margin-top: 15%;
}

.dvallbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 30%;
    left: 55%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.dvallbutton2 {
    text-align: center;
    margin-top: 15%;
}

.speedbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 45%;
    left: -45%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.speedbutton2 {
    text-align: center;
    margin-top: 15%;
}

.speed2button {
    position: absolute;
    font-size: 1.5vh;
    top: 45%;
    left: 5%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.speed2button2 {
    text-align: center;
    margin-top: 15%;
}

.speed5button {
    position: absolute;
    font-size: 1.5vh;
    top: 45%;
    left: 55%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.speed5button2 {
    text-align: center;
    margin-top: 15%;
}

#colorpicker {
    position: absolute;
    background: none;
    outline: none;
    border: none;
    width: 9vh;
    height: 2vh;
    left: -45%;
    top: 60%;
}

#colorpicker2 {
    position: absolute;
    background: none;
    outline: none;
    border: none;
    width: 9vh;
    height: 2vh;
    left: 5%;
    top: 60%;
}

#colorpicker3 {
    position: absolute;
    background: none;
    outline: none;
    border: none;
    width: 9vh;
    height: 2vh;
    left: 55%;
    top: 60%;
}

.colorpickerbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 65%;
    left: -45%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.colorpickerbutton2 {
    text-align: center;
    margin-top: 15%;
}

.colorpicker2button {
    position: absolute;
    font-size: 1.5vh;
    top: 65%;
    left: 5%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.colorpicker2button2 {
    text-align: center;
    margin-top: 15%;
}

.colorpicker3button {
    position: absolute;
    font-size: 1.5vh;
    top: 65%;
    left: 55%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.colorpicker3button2 {
    text-align: center;
    margin-top: 15%;
}

.fulltunebutton {
    position: absolute;
    font-size: 1.5vh;
    top: 80%;
    left: -45%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.fulltunebutton2 {
    text-align: center;
    margin-top: 15%;
}

.fulltune2button2 {
    text-align: center;
    margin-top: 15%;
}

.fulltune2button {
    position: absolute;
    font-size: 1.5vh;
    top: 80%;
    left: 5%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.fulltunebutton2 {
    text-align: center;
    margin-top: 15%;
}

.handlingbutton {
    position: absolute;
    font-size: 1.5vh;
    top: 80%;
    left: 55%;
    width: 9vh;
    height: 4vh;
    color: white;
    font-family: Metropolis-Bold;
    background-color: #161616;
    box-shadow: 3px 3px 3px 3px rgba(0, 0, 0, 0.13);
    border-radius: 5px;
    cursor: pointer;
}

.handlingbutton2 {
    text-align: center;
    margin-top: 15%;
}

.carspawnbox2 {
    width: 30%;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 20px;
    margin-left: 35%;
    background-color: #242424;
    border: none;
    color: #ababab;
}


/* HANDY */

.handyallg {
    font-family: Metropolis-Bold;
}

.handyrahmen {
    position: absolute;
    right: 3%;
    top: 45%;
    width: 25vh;
}

.handyalleapps {
    position: absolute;
    right: 3.2%;
    top: 46.1%;
    width: 24.2vh;
    height: 50vh;
    border-radius: 10px;
}

.handywallpaper {
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

.handywallpaperbild {
    width: 100%;
    height: 100%;
}

.uhrzeitphone {
    position: absolute;
    top: -1%;
    left: 7%;
    color: white;
    font-size: 1.2vh;
}

.wlanphone {
    position: absolute;
    top: -1%;
    right: 9%;
    color: white;
    font-size: 1.2vh;
}

.flugphone {
    position: absolute;
    top: -1%;
    right: 9%;
    color: white;
    font-size: 1.2vh;
}

.handybgunten {
    position: absolute;
    left: 8%;
    bottom: 3%;
    width: 20.2vh;
    height: 5vh;
    background-color: rgba(90, 90, 90, 0.600);
    border-radius: 10px;
}

#handyappid {
    position: relative;
    display: inline-block;
    margin-top: 10%;
    margin-left: 10%;
    left: -1.5%;
    width: 4vh;
    height: 4vh;
    background-color: #1c1c1c;
    border-radius: 10px;
    transition: 300ms;
}

#handyappid:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

#handyappidoben:hover {
    transition: 300ms;
    transform: translateY(-.2rem);
}

.alleappsoben {
    position: absolute;
    top: 5%;
}

#handyappidoben {
    position: relative;
    display: inline-block;
    top: -90%;
    left: 3%;
    margin-top: 7%;
    margin-left: 7%;
    width: 5vh;
    height: 5vh;
    background-color: #1c1c1c;
    border-radius: 10px;
    transition: 300ms;
}

.handykontakteapp {
    position: absolute;
    top: -30%;
}

.handykontakteapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2vh;
    top: 25%;
    left: 28%;
}

.handynachrichtenapp {
    position: absolute;
    top: -30%;
}

.handynachrichtenapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2vh;
    top: 25%;
    left: 24%;
}

.handytelefonapp {
    position: absolute;
    top: -30%;
}

.handytelefonapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2vh;
    top: 25%;
    left: 24%;
}

.handyprofilapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2.5vh;
    top: 25%;
    left: 24%;
}

.handysettingsapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2.5vh;
    top: 25%;
    left: 24%;
}

.handyteamapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2.5vh;
    top: 25%;
    left: 17%;
}

.handybusinessapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2.5vh;
    top: 25%;
    left: 27%;
}

.handyticketapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2.5vh;
    top: 25%;
    left: 21%;
}

.handygpsapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2.5vh;
    top: 25%;
    left: 21%;
}

.handyfunkapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2.5vh;
    top: 25%;
    left: 18%;
}

.handylifeinvaderapp i {
    position: absolute;
    color: #b8b8b8;
    font-size: 2.5vh;
    top: 25%;
    left: 24%;
}


/* PROFILAPP */

.profilappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.profilallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowprofil {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowprofil:hover {
    transform: 1000ms;
    color: white;
}

.profiltext {
    position: relative;
    display: block;
    color: #b8b8b8;
    text-align: left;
    top: 5%;
    font-size: 1.5vh;
    line-height: 0.5vh;
    margin-top: 8%;
    height: 2vh;
    border-bottom: 2px solid rgba(184, 184, 184, 0.150);
}


/* SETTINGS */

.settingsappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.settingsallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowsettings {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowsettings:hover {
    transform: 1000ms;
    color: white;
}

#backarrowsettings3 {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowsettings3:hover {
    transform: 1000ms;
    color: white;
}


/* SWITCH Flugmodus */

.flugmodussettings {
    position: absolute;
    top: 13.33%;
    left: 5%;
    color: #b8b8b8;
}

#flugmodusicontext {
    position: absolute;
    width: 10vh;
    height: 30vh;
    font-size: 1.5vh;
}

.flugmodustext {
    position: absolute;
    top: -5%;
    left: 20%;
    font-family: Metropolis-Bold;
    height: 3vh;
}

.toggle {
    position: absolute;
    display: inline-block;
    width: 3vh;
    height: 1.9vh;
    top: 13.13%;
    left: 80%;
}

.toggle input {
    display: none;
}

.roundbutton {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    background-color: #b8000f;
    display: block;
    transition: all 0.3s;
    border-radius: 3.4rem;
    cursor: pointer;
}

.roundbutton:before {
    position: absolute;
    content: "";
    height: 1.3vh;
    width: 1.3vh;
    border-radius: 100%;
    display: block;
    left: 4.5%;
    top: 14%;
    background-color: white;
    transition: all 0.3s;
}

input:checked+.roundbutton {
    background-color: #1a9900;
}

input:checked+.roundbutton:before {
    transform: translate(1.3vh, 0);
}

.hrflugmodus {
    position: absolute;
    background-color: rgba(184, 184, 184, 0.150);
    width: 100%;
    height: 0.2vh;
    top: 19%;
    border-radius: 5px;
}

.hrdarkmode {
    position: absolute;
    background-color: rgba(184, 184, 184, 0.150);
    width: 100%;
    height: 0.2vh;
    top: 28%;
    border-radius: 5px;
}

.hrtonmodus {
    position: absolute;
    background-color: rgba(184, 184, 184, 0.150);
    width: 100%;
    height: 0.2vh;
    top: 37%;
    border-radius: 5px;
}


/* SWITCH DARKMODE */

.darkmodussettings {
    position: absolute;
    top: 22.33%;
    left: 5%;
    color: #b8b8b8;
}

#darkmodusicontest {
    position: absolute;
    width: 10vh;
    height: 30vh;
    font-size: 1.5vh;
}

.darktext {
    position: absolute;
    top: -5%;
    left: 20%;
    font-family: Metropolis-Bold;
    height: 3vh;
}

.toggledark {
    position: absolute;
    display: inline-block;
    width: 3vh;
    height: 1.9vh;
    top: 21.53%;
    left: 80%;
}

.toggledark input {
    display: none;
}

.roundbuttondark {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    background-color: #b8000f;
    display: block;
    transition: all 0.3s;
    border-radius: 3.4rem;
    cursor: pointer;
}

.roundbuttondark:before {
    position: absolute;
    content: "";
    height: 1.3vh;
    width: 1.3vh;
    border-radius: 100%;
    display: block;
    left: 4.5%;
    top: 14%;
    background-color: white;
    transition: all 0.3s;
}

input:checked+.roundbuttondark {
    background-color: #1a9900;
}

input:checked+.roundbuttondark:before {
    transform: translate(1.3vh, 0);
}


/* SWITCH TON */

.tonmodussettings {
    position: absolute;
    top: 31.33%;
    left: 5%;
    color: #b8b8b8;
}

#tonmodusicontext {
    position: absolute;
    width: 10vh;
    height: 30vh;
    font-size: 1.5vh;
}

.tonmodustext {
    position: absolute;
    top: -5%;
    left: 20%;
    font-family: Metropolis-Bold;
    height: 3vh;
}

.toggleton {
    position: absolute;
    position: relative;
    display: inline-block;
    width: 3vh;
    height: 1.9vh;
    top: 29.93%;
    left: 80%;
}

.toggleton input {
    display: none;
}

.roundbuttonton {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    background-color: #b8000f;
    display: block;
    transition: all 0.3s;
    border-radius: 3.4rem;
    cursor: pointer;
}

.roundbuttonton:before {
    position: absolute;
    content: "";
    height: 1.3vh;
    width: 1.3vh;
    border-radius: 100%;
    display: block;
    left: 4.5%;
    top: 14%;
    background-color: white;
    transition: all 0.3s;
}

input:checked+.roundbuttonton {
    background-color: #1a9900;
}

input:checked+.roundbuttonton:before {
    transform: translate(1.3vh, 0);
}


/* WALLPAPER SETTINGS */

.klingeltext {
    position: relative;
    display: block;
    color: #b8b8b8;
    text-align: left;
    top: 5%;
    font-size: 1.5vh;
    line-height: 0.5vh;
    margin-top: 8%;
    height: 2vh;
    border-bottom: 2px solid rgba(184, 184, 184, 0.150);
    cursor: pointer;
}


.wallpapertext {
    margin-top: 73%;
    color: #b8b8b8;
    text-align: center;
    font-size: 1.6vh;
}

.wallpapereingabe {
    text-align: center;
    width: 20vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 5%;
    margin-left: 8%;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
    text-transform: uppercase;
}

.wallpapervorgelegt {
    position: absolute;
    width: 10vh;
    height: 3vh;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    top: 53%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    border-radius: 5px;
    transition: 300ms;
    cursor: pointer;
}

.wallpapervorgelegt:hover {
    transition: 300ms;
    background-color: #282828;
}

.wallpapertextvorgelegt {
    text-align: center;
    color: #b8b8b8;
    margin-top: 10%;
    font-size: 1.1vh;
}


/* KLINGELTON SETTINGS */

.klingeltontext {
    margin-top: 25%;
    color: #b8b8b8;
    text-align: center;
    font-size: 1.6vh;
}

.klingeltoneingabe {
    text-align: center;
    width: 20vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 5%;
    margin-left: 8%;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
    text-transform: uppercase;
}

.klingeltonvorgelegt {
    position: absolute;
    width: 10vh;
    height: 3vh;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    top: 80%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    border-radius: 5px;
    transition: 300ms;
    cursor: pointer;
}

.klingeltonvorgelegt:hover {
    transition: 300ms;
    background-color: #282828;
}

.klingeltontextvorgelegt {
    text-align: center;
    color: #b8b8b8;
    margin-top: 10%;
    font-size: 1.1vh;
}

.whitemodean {
    background-color: white;
    color: black;
}

.whitemodeanbuttons {
    background-color: #252525;
    color: white;
}

.whitemodeantext {
    color: black;
}

.whitemodeantextwhite {
    color: white;
}

.klingetonvorgeschlagenbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46.1%;
    width: 24.15vh;
    height: 49.9vh;
    border-radius: 10px;
}


/* WALLPAPER */

.wallpapervorschlagen {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

.wallpapervorschlagen2 {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46.1%;
    width: 24.15vh;
    height: 49.9vh;
    border-radius: 10px;
}


.wallpaperauswahl {
    width: 100%;
    height: 100%;
}

#wallpaperscrollleft {
    position: absolute;
    bottom: 3.1%;
    left: 17%;
    color: #b8b8b8;
    font-size: 3vh;
    transform: 1000ms;
}

#wallpaperscrollleft:hover {
    color: white;
}

#wallpaperscrollright {
    position: absolute;
    bottom: 3.1%;
    right: 17.3%;
    color: #b8b8b8;
    font-size: 3vh;
    transform: 1000ms;
}

#wallpaperscrollright:hover {
    color: white;
}

.wallpaperauswahlbutton {
    position: absolute;
    bottom: 6%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 4vh;
    height: 4vh;
    border-radius: 100px;
    background-color: #b8b8b8;
}

.wallpaperauswahlbutton:hover {
    background-color: white;
}

#wallpaperbuttonicon {
    position: absolute;
    color: black;
    font-size: 2vh;
    left: 27%;
    top: 25%;
}


/* TEAM APP */

.teamappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.teamallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowsettings {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowsettings:hover {
    transform: 1000ms;
    color: white;
}

.teammembertext {
    text-align: left;
    margin-top: 14%;
    margin-left: 11%;
    color: #b8b8b8;
    font-size: 1.4vh;
}

.teamonlinetext {
    text-align: left;
    margin-top: -4%;
    margin-left: 11%;
    color: #b8b8b8;
    font-size: 1.4vh;
}

.teamfrakmedictext {
    text-align: left;
    margin-top: -4%;
    margin-left: 11%;
    color: #b8b8b8;
    font-size: 1.4vh;
}

.invitebuttonteam {
    position: absolute;
    right: 10%;
    top: 91.5%;
}

#plusinvitebutton:hover {
    color: white;
}

#plusinvitebutton {
    font-size: 2vh;
    color: #b8b8b8;
}

.eingabefeldinvitelol {
    text-align: center;
    width: 16vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 145%;
    margin-left: 8%;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
    text-transform: uppercase;
}

.alleautoseinparkenteam {
    position: absolute;
    width: 20vh;
    height: 3vh;
    top: 83%;
    left: 7.5%;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    border-radius: 5px;
    cursor: pointer;
}

.alleautoseinparkenteam:hover {
    background-color: #3a3a3a;
}

.alleautoseinparkenteamtext {
    text-align: center;
    color: #b8b8b8;
    font-size: 1.3vh;
    margin-top: 4.5%;
}

.teamonlineliste {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 30vh;
    top: 20%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}

.spielerlisteboxspieler {
    display: inline-block;
    margin-left: 2%;
    margin-top: 2%;
    width: 19vh;
    height: 3.8vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
}

.spielerlisteboxspielername {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.3vh;
    left: 5%;
    margin-top: 3.5%;
}

.spielerlisteboxspielerrang {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.2vh;
    left: 5%;
    margin-top: 11%;
}

#spielerlisteboxspieleronline1 {
    position: absolute;
    color: #05851A;
    font-size: 1.6vh;
    left: 61%;
    margin-top: 5.5%;
}

#spielerlisteboxspieleronline {
    position: absolute;
    color: #ae0000;
    font-size: 1.6vh;
    left: 61%;
    margin-top: 5.5%;
}

#spielerlisteboxspielertelefon {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.5vh;
    left: 73%;
    margin-top: 5.5%;
}

#spielerlisteboxspielertelefon:hover {
    color: white;
}

#spielerlisteboxspielerchange {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.5vh;
    left: 85%;
    margin-top: 5.5%;
}

#spielerlisteboxspielerchange:hover {
    color: white;
}

#changememberfrak {
    display: none;
    position: absolute;
    width: 20vh;
    height: 28.8vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
    top: 20%;
    left: 8%;
}

#closechangememberfrak {
    position: absolute;
    top: 5%;
    left: 3%;
    color: #b8b8b8;
    font-size: 1.5vh;
    transform: 1000ms;
}

#closechangememberfrak:hover {
    transform: 1000ms;
    color: white;
}

.editfrakmemberuprank {
    position: absolute;
    width: 18vh;
    height: 3.5vh;
    top: 9%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #272727;
    border-radius: 5px;
    cursor: pointer;
}

.editfrakmemberuprank:hover {
    background-color: #292929;
}

.editfrakmemberuprank p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 0.7vh;
    font-size: 1.5vh;
}

.editfrakmemberderank {
    position: absolute;
    width: 18vh;
    height: 3.5vh;
    top: 24%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #272727;
    border-radius: 5px;
    cursor: pointer;
}

.editfrakmemberderank:hover {
    background-color: #292929;
}

.editfrakmemberderank p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 0.7vh;
    font-size: 1.5vh;
}

.editfrakmemberkick {
    position: absolute;
    width: 18vh;
    height: 3.5vh;
    top: 39%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #272727;
    border-radius: 5px;
    cursor: pointer;
}

.editfrakmemberkick:hover {
    background-color: #292929;
}

.editfrakmemberkick p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 0.7vh;
    font-size: 1.5vh;
}

.editfrakmemberfrakmedic {
    position: absolute;
    width: 18vh;
    height: 3.5vh;
    top: 54%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #272727;
    border-radius: 5px;
    cursor: pointer;
}

.editfrakmemberfrakmedic:hover {
    background-color: #292929;
}

.editfrakmemberfrakmedic p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: left;
    line-height: 0.7vh;
    padding-left: 10%;
    font-size: 1.5vh;
}

.togglefrakmedic {
    position: absolute;
    display: inline-block;
    width: 3vh;
    height: 1.9vh;
    top: 20.13%;
    left: 75%;
}

.togglefrakmedic input {
    display: none;
}

.roundbuttonfrakmedic {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    background-color: #b8000f;
    display: block;
    transition: all 0.3s;
    border-radius: 3.4rem;
    cursor: pointer;
}

.roundbuttonfrakmedic:before {
    position: absolute;
    content: "";
    height: 1.3vh;
    width: 1.3vh;
    border-radius: 100%;
    display: block;
    left: 4.5%;
    top: 14%;
    background-color: white;
    transition: all 0.3s;
}

input:checked+.roundbuttonfrakmedic {
    background-color: #1a9900;
}

input:checked+.roundbuttonfrakmedic:before {
    transform: translate(1.3vh, 0);
}

.editfrakmemberfraklager {
    position: absolute;
    width: 18vh;
    height: 3.5vh;
    top: 69%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #272727;
    border-radius: 5px;
    cursor: pointer;
}

.editfrakmemberfraklager:hover {
    background-color: #292929;
}

.editfrakmemberfraklager p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: left;
    line-height: 0.7vh;
    padding-left: 10%;
    font-size: 1.5vh;
}

.togglefraklager {
    position: absolute;
    display: inline-block;
    width: 3vh;
    height: 1.9vh;
    top: 20.13%;
    left: 75%;
}

.togglefraklager input {
    display: none;
}

.roundbuttonfraklager {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    background-color: #b8000f;
    display: block;
    transition: all 0.3s;
    border-radius: 3.4rem;
    cursor: pointer;
}

.roundbuttonfraklager:before {
    position: absolute;
    content: "";
    height: 1.3vh;
    width: 1.3vh;
    border-radius: 100%;
    display: block;
    left: 4.5%;
    top: 14%;
    background-color: white;
    transition: all 0.3s;
}

input:checked+.roundbuttonfraklager {
    background-color: #1a9900;
}

input:checked+.roundbuttonfraklager:before {
    transform: translate(1.3vh, 0);
}

.leavefrakbutton {
    position: absolute;
    width: 8vh;
    height: 5vh;
    top: 6.5%;
    right: 12%;
    background-color: #313131;
    border-radius: 5px;
    cursor: pointer;
}

.leavefrakbutton:hover {
    background-color: #3a3a3a;
}

.leavefrakbutton p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: center;
    padding-top: 0%;
    line-height: 1.3vh;
    font-size: 1.4vh;
}


/* FUNK APP */

.funkappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.funkallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowfunk {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowfunk:hover {
    transform: 1000ms;
    color: white;
}

.funkeingabe {
    text-align: center;
    width: 20vh;
    height: 3vh;
    margin-top: 55%;
    margin-left: 8%;
    background: none;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 2px solid rgba(184, 184, 184, 0.150);
    outline: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
    text-transform: uppercase;
}

.funkbeitreten {
    position: absolute;
    width: 15vh;
    height: 3vh;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    top: 35%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    border-radius: 5px;
    transition: 300ms;
    cursor: pointer;
}

.funkbeitreten:hover {
    transition: 300ms;
    background-color: #353535;
}

.funkbeitretentext {
    text-align: center;
    color: #b8b8b8;
    margin-top: 6%;
    font-size: 1.3vh;
}

.funkverlassen {
    position: absolute;
    width: 15vh;
    height: 3vh;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    top: 45%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    border-radius: 5px;
    transition: 300ms;
    cursor: pointer;
}

.funkverlassen:hover {
    transition: 300ms;
    background-color: #353535;
}

.funkverlassentext {
    text-align: center;
    color: #b8b8b8;
    margin-top: 6%;
    font-size: 1.3vh;
}


/* GPS APP */

.gpsappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.gpsallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowgps {
    position: absolute;
    top: 1%;
    left: 5%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowgps:hover {
    transform: 1000ms;
    color: white;
}

.hrgps {
    position: absolute;
    width: 24.15vh;
    height: 0.1vh;
    top: 10%;
    border-bottom: 2px solid rgba(184, 184, 184, 0.150);
}

.hrgpsoben {
    position: absolute;
    width: 2vh;
    height: 5.1vh;
    top: 0%;
    left: 50%;
    border-left: 2px solid rgba(184, 184, 184, 0.150);
}

.gpsstandortebtn {
    position: absolute;
    top: 0%;
    left: 2%;
    width: 11.5vh;
    height: 5.1vh;
    border-radius: 7.5px;
    cursor: pointer;
}

.gpsstandortebtn p {
    text-align: center;
    color: #b8b8b8;
    font-size: 1.4vh;
    margin-top: 15%;
}

.gpsfahrzeugstandortebtn {
    position: absolute;
    top: 0%;
    right: 2%;
    width: 11.5vh;
    height: 5.1vh;
    border-radius: 7.5px;
    cursor: pointer;
}

.gpsfahrzeugstandortebtn p {
    text-align: center;
    color: #b8b8b8;
    font-size: 1.4vh;
    margin-top: 16%;
}

.gpsstandorteallgemein {
    display: none;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 43vh;
    top: 12%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}

.gpsstandortebox {
    display: inline-block;
    margin-left: 2%;
    margin-top: 2%;
    width: 19vh;
    height: 3.3vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
    cursor: pointer;
}

.gpsstandortebox:hover {
    background: #3f3f3f;
}

.gpsstandorteboxtext {
    text-align: center;
    color: #b8b8b8;
    font-size: 1.4vh;
    margin-top: 5%;
}

.fahrzeugstandorteallgemein {
    display: none;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 43vh;
    top: 12%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}

.fahrzeugstandortebox {
    display: inline-block;
    margin-left: 2%;
    margin-top: 2%;
    width: 19vh;
    height: 3.3vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
    cursor: pointer;
}

.fahrzeugstandortebox:hover {
    background: #3f3f3f;
}

.fahrzeugstandorteboxtext {
    color: #b8b8b8;
    font-size: 1.4vh;
    margin-top: 5%;
    margin-left: 10%;
}

.fahrzeugstandorteboxtextkennzeichen {
    color: #b8b8b8;
    font-size: 1.4vh;
    margin-top: -15%;
    margin-left: 58%;
}


/* LIFEINVADER APP */

.lifeinvaderappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.lifeinvaderallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

.keinewerbungen {
    position: relative;
    text-align: center;
    top: 20%;
    color: #b8b8b8;
    font-size: 1.8vh;
}


.keinetickets {
    position: relative;
    text-align: center;
    top: 20%;
    color: #b8b8b8;
    font-size: 1.8vh;
}

.keinecars {
    position: relative;
    text-align: center;
    top: 20%;
    color: #b8b8b8;
    font-size: 1.8vh;
}

#backarrowlifeinvader {
    position: absolute;
    top: 1%;
    left: 5%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowlifeinvader:hover {
    transform: 1000ms;
    color: white;
}

.lifeinvaderwerbungen {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 43vh;
    top: 6%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}

.lifeinvaderwerbungenbox {
    display: inline-block;
    margin-left: 2%;
    margin-top: 5%;
    width: 19vh;
    height: auto;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
}

.lifeinvaderwerbungenboxtext {
    color: #b8b8b8;
    font-size: 1.3vh;
    margin-top: 7%;
    margin-left: 9%;
}

#lifeinvaderwerbungenboxnummer {
    color: #b8b8b8;
    font-size: 1.5vh;
    margin-bottom: 8%;
    margin-left: 30%;
    width: 1vh;
}

#lifeinvaderwerbungenboxnachricht {
    color: #b8b8b8;
    font-size: 1.5vh;
    margin-top: -16%;
    margin-left: 65%;
    width: 1vh;
}

#lifeinvaderwerbungenboxnummer:hover {
    color: white;
}

#lifeinvaderwerbungenboxnachricht:hover {
    color: white;
}

.uhrzeitinvader {
    text-align: center;
}


/* TICKET APP */

.ticketappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.ticketallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowticket {
    position: absolute;
    top: 1%;
    left: 5%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowticket:hover {
    transform: 1000ms;
    color: white;
}

.ticketsboxfenster {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 43vh;
    top: 12%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}

.hrtickets {
    position: absolute;
    width: 24.15vh;
    height: 0.1vh;
    top: 10%;
    border-bottom: 2px solid rgba(184, 184, 184, 0.150);
}

.hrticketsoben {
    position: absolute;
    width: 2vh;
    height: 5.1vh;
    top: 0%;
    left: 50%;
    border-left: 2px solid rgba(184, 184, 184, 0.150);
}

.alleticketstext {
    position: absolute;
    text-align: center;
    font-family: Metropolis-Bold;
    top: -45%;
    left: 15%;
    font-size: 1.5vh;
    color: #b8b8b8;
    cursor: pointer;
}

.meineticketstext {
    position: absolute;
    text-align: center;
    font-family: Metropolis-Bold;
    top: 20%;
    right: 5.5%;
    font-size: 1.5vh;
    color: #b8b8b8;
    cursor: pointer;
}

.alleticketsbg {
    position: absolute;
    top: 5%;
    left: 0%;
    width: 12vh;
    height: 3vh;
    cursor: pointer;
}

.meineticketsbg {
    position: absolute;
    top: 0%;
    right: 2%;
    width: 11.5vh;
    height: 5.1vh;
    cursor: pointer;
}

.ticketeinzelbox {
    display: inline-block;
    margin-left: 2%;
    margin-top: 5%;
    width: 19vh;
    height: 6vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
}

.ticketeinzelboxown {
    display: inline-block;
    margin-left: 2%;
    margin-top: 5%;
    width: 19vh;
    height: 10vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
}

.ticketeinzelboxtextname {
    color: #b8b8b8;
    font-size: 1.5vh;
    margin-top: 5%;
    text-align: center;
}

.ticketeinzelboxtext {
    color: #b8b8b8;
    font-size: 1.3vh;
    margin-top: -2%;
    text-align: center;
}

#ticketeinzelboxaccept {
    position: relative;
    color: #b8b8b8;
    font-size: 1.5vh;
    top: -40%;
    left: 5%;
    width: 1vh;
    color: #087e00;
    transition: 500ms;
}

#ticketeinzelboxaccept:hover {
    transition: 500ms;
    transform: translateY(-0.3rem);
}

#ticketeinzelboxdecline {
    position: relative;
    color: #b8b8b8;
    font-size: 1.5vh;
    top: -40%;
    left: 77%;
    width: 1vh;
    color: #a2060b;
    transition: 500ms;
}

#ticketeinzelboxdecline:hover {
    transition: 500ms;
    transform: translateY(-0.3rem);
}

.ticketeinzelboxtextnameown {
    color: #b8b8b8;
    font-size: 1.7vh;
    margin-top: 6%;
    text-align: center;
}

.ticketeinzelboxtextown {
    color: #b8b8b8;
    font-size: 1.3vh;
    margin-top: -2%;
    text-align: center;
}

#ticketeinzelboxacceptown {
    position: relative;
    color: #b8b8b8;
    font-size: 1.5vh;
    top: -40%;
    left: 5%;
    width: 1vh;
    color: #b8b8b8;
    transition: 500ms;
}

#ticketeinzelboxacceptown:hover {
    transition: 500ms;
    transform: translateY(-0.3rem);
}

#ticketeinzelboxdeclineown {
    position: relative;
    color: #b8b8b8;
    font-size: 1.5vh;
    top: -40%;
    left: 77%;
    width: 1vh;
    color: #b8b8b8;
    transition: 500ms;
}

#ticketeinzelboxdeclineown:hover {
    transition: 500ms;
    transform: translateY(-0.3rem);
}

#ticketeinzelboxreviveown {
    position: relative;
    color: #b8b8b8;
    font-size: 1.5vh;
    top: -10%;
    left: -8.6%;
    width: 1vh;
    color: #b8b8b8;
    transition: 500ms;
}

#ticketeinzelboxreviveown:hover {
    transition: 500ms;
    transform: translateY(-0.3rem);
}

#ticketeinzelboxkickown {
    position: relative;
    color: #b8b8b8;
    font-size: 1.5vh;
    top: -10%;
    left: 64%;
    width: 1vh;
    color: #b8b8b8;
    transition: 500ms;
}

#ticketeinzelboxkickown:hover {
    transition: 500ms;
    transform: translateY(-0.3rem);
}

#ticketeinzelboxcloseown {
    position: relative;
    color: #b8b8b8;
    font-size: 1.5vh;
    top: 10%;
    left: 19%;
    width: 1vh;
    color: #a2060b;
    transition: 500ms;
}

#ticketeinzelboxcloseown:hover {
    transition: 500ms;
    transform: translateY(-0.3rem);
}


/* SUPPORT SYSTEM */

.supportsystem {
    display: none;
    position: absolute;
    top: 20%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #1e1e1e;
    border-radius: 5px;
    width: 20vh;
    height: 30vh;
}

.closesupportsystem {
    position: absolute;
    top: 3%;
    left: 88%;
    color: white;
    font-size: 1.6vh;
    transition: transform .7s ease-in-out;
}

.closesupportsystem:hover {
    transform: rotate(90deg);
}

.dropbtn {
    position: relative;
    background-color: #333333;
    color: white;
    font-size: 1.4vh;
    border: none;
    border-radius: 5px;
    font-family: Metropolis-Bold;
    width: 15vh;
    height: 5vh;
    margin-top: 30%;
    margin-left: 17%;
}

.dropdown {
    position: relative;
    display: inline-block;
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #282828;
    font-family: Metropolis-Bold;
    width: 15vh;
    left: 17%;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    cursor: pointer;
}

.dropdown-content a {
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    color: white;
}

.dropdown-content a:hover {
    background-color: #3b3b3b;
}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #282828;
}

.supportgrundabschicken {
    position: absolute;
    background-color: #333333;
    color: white;
    font-size: 1.1vh;
    border: none;
    border-radius: 5px;
    font-family: Metropolis-Bold;
    width: 8vh;
    height: 3vh;
    top: 80%;
    left: 30%;
    transition: 400ms;
}

.supportgrundabschicken:hover {
    transition: 400ms;
    transform: scale(1.03);
    background-color: #3b3b3b;
}

.grundeingabe {
    display: none;
    position: absolute;
    top: 65%;
    text-align: center;
    width: 20vh;
    height: 3vh;
    background: none;
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 2px solid rgba(184, 184, 184, 0.150);
    outline: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
}

.grundausgewaehlt {
    position: relative;
    text-align: center;
    color: white;
    font-family: Metropolis-Bold;
    top: 10%;
}

/* KONTAKTE APP */

.kontakteappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.kontakteallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowkontakte {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowkontakte:hover {
    transform: 1000ms;
    color: white;
}

#backarrowkontakte2 {
    position: absolute;
    top: 4%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowkontakte2:hover {
    transform: 1000ms;
    color: white;
}

.kontakteeinzelbox {
    display: inline-block;
    margin-left: 2%;
    margin-top: 5%;
    width: 19vh;
    height: 3.5vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
    cursor: pointer;
}

.kontakteeinzelbox:hover {
    background-color: #474747;
}


.kontakteeinzelboxname {
    color: #b8b8b8;
    font-size: 1.5vh;
    margin-top: 5%;
    text-align: center;
}


.kontaktelistefenster {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 45vh;
    top: 8%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}

.searchkontakt {
    position: absolute;
    background-color: #313131;
    border: none;
    width: 15vh;
    height: 2.5vh;
    resize: none;
    color: #707070;;
    float: right;
    margin-left: 17%;
    margin-top: 5%;
    font-family: Metropolis-Bold;
    border-radius: 5px;
}

.searchkontakt:focus {
    border: none;
    outline: none;
}

#AddKontaktId {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.7vh;
    right: 10%;
    top: 3.5%;
}

#AddKontaktId:hover {
    color: white;
}

.addkontaktmenu {
    position: absolute;
    height: 20vh;
    width: 20vh;
    top: 10%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
}

.nameingabeadd {
    text-align: center;
    width: 16vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 20%;
    margin-left: 8%;
    background-color: #282828;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
}

.handyeingabedd {
    text-align: center;
    width: 16vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 5%;
    margin-left: 8%;
    background-color: #282828;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
}

.kontaktabsenden {
    position: absolute;
    background-color: #282828;
    color: white;
    font-size: 1.1vh;
    border: none;
    border-radius: 5px;
    font-family: Metropolis-Bold;
    width: 8vh;
    height: 3vh;
    top: 70%;
    left: 30%;
    transition: 400ms;
}

.kontaktabsenden:hover {
    transition: 400ms;
    transform: scale(1.03);
    background-color: #3b3b3b;
}

.editkontaktmenu {
    display: none;
    position: absolute;
    height: 25vh;
    width: 20vh;
    top: 0%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
}

.nameingabeaddedit {
    text-align: center;
    width: 16vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 35%;
    margin-left: 8%;
    background-color: #282828;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
}

.handyeingabeddedit {
    text-align: center;
    width: 16vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 5%;
    margin-left: 8%;
    background-color: #282828;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
}

.kontaktabsendenedit {
    position: absolute;
    background-color: #282828;
    color: white;
    font-size: 1.1vh;
    border: none;
    border-radius: 5px;
    font-family: Metropolis-Bold;
    width: 8vh;
    height: 3vh;
    top: 70%;
    left: 30%;
    transition: 400ms;
}

.kontaktabsendenedit:hover {
    transition: 400ms;
    transform: scale(1.03);
    background-color: #3b3b3b;
}


#calleditkontakt {
    position: absolute;
    color: #b8b8b8;
    font-size: 2vh;
    left: 13%;
    top: 14%;
}

#calleditkontakt:hover {
    color: white;
}


#messageeditkontakt {
    position: absolute;
    color: #b8b8b8;
    font-size: 2vh;
    left: 73%;
    top: 14%;
}

#messageeditkontakt:hover {
    color: white;
}


#deleteeditkontakt {
    position: absolute;
    color: #b8b8b8;
    font-size: 2vh;
    left: 43%;
    top: 14%;
    text-align: center;
}

#deleteeditkontakt:hover {
    color: white;
}


.anrufbildschirmanruferbg {    
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.anrufbildschirmanrufer {    
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}


.ablehneniconanrufbutton {
    position: absolute;
    left: 50%;
    right: 50%;
    bottom: 10%;
    transform: translate(-50%, 50%);
    border-radius: 100px;
    background-color: #b8000f;
    width: 3vh;
    height: 3vh;
}

.ablehneniconanrufbutton:hover {
    background-color: #690009;
}

#ablehneniconanruf {
    color: white;
    margin-left: 25%;
    margin-top: 30%;
}

.anrufertelefonnummer {
    position: relative;
    top: 10%;
    color: white;
    font-size: 1.5vh;
    text-align: center;
}

.wirdangerufentelefon {
    position: relative;
    top: 15%;
    color: white;
    font-size: 1.5vh;
    text-align: center;
}


.anrufbildschirmanruferbg {    
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.anrufbildschirmgerufener {    
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}


.ablehneniconanrufbuttonanrufener {
    position: absolute;
    right: 20%;
    bottom: 10%;
    border-radius: 100px;
    background-color: #b8000f;
    width: 3vh;
    height: 3vh;
}

.ablehneniconanrufbuttonanrufener:hover {
    background-color: #690009;
}

#ablehneniconanruf2 {
    color: white;
    margin-left: 25%;
    margin-top: 30%;
}

.annehmeniconanrufbutton {
    position: absolute;
    left: 20%;
    bottom: 10%;
    border-radius: 100px;
    background-color: #119400;
    width: 3vh;
    height: 3vh;
}

.annehmeniconanrufbutton:hover {
    background-color: #0d7000;
}

#annehmeniconanrufbuttontext {
    color: white;
    margin-left: 25%;
    margin-top: 30%;
}

.gerufenertelefonnummer {
    position: relative;
    top: 10%;
    color: white;
    font-size: 1.5vh;
    text-align: center;
}

.wirdangerufentelefon2 {
    position: relative;
    top: 15%;
    color: white;
    font-size: 1.5vh;
    text-align: center;
}

.klingelumrandung {
    border-bottom: 2px solid #ffffff;
}

.klingelauswahlbutton {
    position: absolute;
    bottom: 6%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    width: 4vh;
    height: 4vh;
    border-radius: 100px;
    background-color: #b8b8b8;
}

.klingelauswahlbutton:hover {
    background-color: white;
}

#klingelauswahlbutton2 {
    position: absolute;
    color: black;
    font-size: 2vh;
    left: 27%;
    top: 25%;
}

/* PHONE APP */


.phoneappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.phoneallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowphone {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowphone:hover {
    transform: 1000ms;
    color: white;
}

.nummereingabedwa {
    text-align: center;
    width: 16vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 45%;
    margin-left: 17%;
    background-color: #363636;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
}

.nummerabsendwwna {
    position: absolute;
    background-color: #363636;
    color: white;
    font-size: 1.1vh;
    border: none;
    border-radius: 5px;
    font-family: Metropolis-Bold;
    width: 16vh;
    height: 3vh;
    top: 35%;
    left: 17%;
    transition: 400ms;
}

.nummerabsendwwna:hover {
    transition: 400ms;
    transform: scale(1.03);
    background-color: #3b3b3b;
}

.phoneallgtexawe2 {
    position: relative;
    top: 25%;
    color: #b8b8b8;
    font-size: 1.3vh;
    text-align: center;
}

/* MESSAGE APP */

.messageappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.messageallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowmessage {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowmessage:hover {
    transform: 1000ms;
    color: white;
}



.messagelistefenster {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 45vh;
    top: 8%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}

.messagetableeinzelbox {
    display: inline-block;
    margin-left: 2%;
    margin-top: 5%;
    width: 19vh;
    height: 3.5vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
    cursor: pointer;
}

.messagetableeinzelbox:hover {
    background-color: #474747;
}


.messagetableinzelboxkontakt {
    color: #b8b8b8;
    font-size: 1.5vh;
    margin-top: 5%;
    text-align: center;
}



.nachrichtenfenster {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 40vh;
    top: 5%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}



.nachrichteinzelbox {
    display: inline-block;
    margin-left: 2%;
    margin-top: 5%;
    width: 19vh;
    min-height: 3.5vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
}



.nachrichteinzelboxnachricht {
    color: #b8b8b8;
    font-size: 1.4vh;
    margin-top: 5%;
    text-align: center;
}

.nachrichteningabe {
    position: absolute;
    text-align: center;
    width: 90%;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    top: 87%;
    left: 4%;
    background-color: #363636;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
}

/* BUSINESS TOWER */

.businessappbg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
    background-color: #262626;
}

.businessallg {
    display: none;
    position: absolute;
    right: 3.19%;
    top: 46%;
    width: 24.15vh;
    height: 50.1vh;
    border-radius: 10px;
}

#backarrowsettings {
    position: absolute;
    top: 2%;
    left: 6%;
    color: #b8b8b8;
    font-size: 1.7vh;
    transform: 1000ms;
}

#backarrowsettings:hover {
    transform: 1000ms;
    color: white;
}


.businessmembertext {
    text-align: left;
    margin-top: 14%;
    margin-left: 11%;
    color: #b8b8b8;
    font-size: 1.4vh;
}

.businessmotd {
    position: relative;
    text-align: center;
    top: 68%;
    color: #b8b8b8;
    font-size: 1.4vh;
}

.businessonlinetext {
    text-align: left;
    margin-top: -4%;
    margin-left: 11%;
    color: #b8b8b8;
    font-size: 1.4vh;
}


.invitebuttonbusiness {
    position: absolute;
    right: 10%;
    top: 91.5%;
}

#plusinvitebutton:hover {
    color: white;
}

#plusinvitebutton {
    font-size: 2vh;
    color: #b8b8b8;
}

.eingabefeldinvitebusinesslol {
    text-align: center;
    width: 16vh;
    height: 3vh;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px;
    margin-top: 143%;
    margin-left: 8%;
    background-color: #313131;
    box-shadow: 2px 2px 2px 2px rgba(0, 0, 0, 0.098);
    outline: none;
    border: none;
    color: #b8b8b8;
    font-size: 1.1vh;
    font-family: Metropolis-Bold;
    opacity: 1;
    text-transform: uppercase;
}

.businessonlineliste {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    width: 20vh;
    height: 30vh;
    top: 20%;
    left: 8%;
    overflow: scroll;
    border-radius: 5px;
}

.spielerlisteboxspielerbusiness {
    display: inline-block;
    margin-left: 2%;
    margin-top: 2%;
    width: 19vh;
    height: 3.8vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
}

.spielerlisteboxspielernamebusiness {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.3vh;
    left: 5%;
    margin-top: 3.5%;
}

.spielerlisteboxspielerrangbusiness {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.2vh;
    left: 5%;
    margin-top: 11%;
}

#spielerlisteboxspieleronline1business {
    position: absolute;
    color: #05851A;
    font-size: 1.6vh;
    left: 61%;
    margin-top: 5.5%;
}

#spielerlisteboxspieleronlinebusiness {
    position: absolute;
    color: #ae0000;
    font-size: 1.6vh;
    left: 61%;
    margin-top: 5.5%;
}

#spielerlisteboxspielertelefonbusiness {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.5vh;
    left: 73%;
    margin-top: 5.5%;
}

#spielerlisteboxspielertelefonbusiness:hover {
    color: white;
}

#spielerlisteboxspielerchangebusiness {
    position: absolute;
    color: #b8b8b8;
    font-size: 1.5vh;
    left: 85%;
    margin-top: 5.5%;
}

#spielerlisteboxspielerchangebusiness:hover {
    color: white;
}

#changememberbusiness {
    display: none;
    position: absolute;
    width: 20vh;
    height: 28.8vh;
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    background: #313131;
    border-radius: 5px;
    top: 20%;
    left: 8%;
}

#closechangememberbusiness {
    position: absolute;
    top: 5%;
    left: 3%;
    color: #b8b8b8;
    font-size: 1.5vh;
    transform: 1000ms;
}

#closechangememberbusiness:hover {
    transform: 1000ms;
    color: white;
}

.editbusinessmemberuprank {
    position: absolute;
    width: 18vh;
    height: 3.5vh;
    top: 9%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #272727;
    border-radius: 5px;
    cursor: pointer;
}

.editbusinessmemberuprank:hover {
    background-color: #292929;
}

.editbusinessmemberuprank p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 0.7vh;
    font-size: 1.5vh;
}

.editbusinessmemberderank {
    position: absolute;
    width: 18vh;
    height: 3.5vh;
    top: 24%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #272727;
    border-radius: 5px;
    cursor: pointer;
}

.editbusinessmemberderank:hover {
    background-color: #292929;
}

.editbusinessmemberderank p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 0.7vh;
    font-size: 1.5vh;
}

.editbusinessmemberkick {
    position: absolute;
    width: 18vh;
    height: 3.5vh;
    top: 39%;
    left: 50%;
    right: 50%;
    transform: translate(-50%, 50%);
    background-color: #272727;
    border-radius: 5px;
    cursor: pointer;
}

.editbusinessmemberkick:hover {
    background-color: #292929;
}

.editbusinessmemberkick p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: center;
    line-height: 0.7vh;
    font-size: 1.5vh;
}

.leavebusinessbutton {
    position: absolute;
    width: 8vh;
    height: 5vh;
    top: 6.5%;
    right: 12%;
    background-color: #313131;
    border-radius: 5px;
    cursor: pointer;
}

.leavebusinessbutton:hover {
    background-color: #3a3a3a;
}

.leavebusinessbutton p {
    color: #b8b8b8;
    font-family: Metropolis-Bold;
    text-align: center;
    padding-top: 0%;
    line-height: 1.3vh;
    font-size: 1.4vh;
}