body {
    margin: 0;
    overflow:hidden;
}

#recepsiyon { display: block; }
#feedbacks {display: none;}
#recepsiyonmain { display: block; }
#myrooms { display: none; }
#BuyRoomScreen { display: none; }
#menurece { display: none; }

#ReceptionContainer {
    background: url(back.png) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    display: none;
    width: 100%;
    height: 105vh;
    flex-shrink: 0;
    
    /* opacity: 0.03999999910593033; */
    /* background: url(<path-to-image>), lightgray 50% / cover no-repeat; */
}

.myRooms5 {
    display: none;
}

#MotelAdminMenu {
    width: 767px;
    height: 860px;
    flex-shrink: 0;
    margin: auto;
    display: none;
    position: absolute;
    left: 0;
    bottom: 0;
    top: 0;
    right: 0;
    border-radius: 12px;
    background: #373738;
}


#BossMenuContainer {
    background: url(back.png) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    display: none;
    width: 123.5rem;
    height: 68.22163rem;
    flex-shrink: 0;
}

#ReceptionContainer h1 {
    color: #ffffff;
    text-align: center;
    text-shadow: 0px 3.532224416732788px 152.76870727539062px 0px rgba(238, 238, 238, 0.55);
    font-family: 'Manrope', sans-serif;
    font-size: 3rem;
    font-style: normal;
    font-weight: 800;
    text-transform: uppercase;
    text-transform: uppercase;
    position: relative;
    top: 3vh;
    margin: auto;
    line-height: normal;
}

#ReceptionContainer h3 {
    margin: auto;
    color: #acacac;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 0px 1.9396092891693115px 83.88809967041016px 0px rgba(238, 238, 238, 0.55);
    font-family: Manrope;
    font-size: 1.4rem;
    position: relative;
    top: 2.5vh;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.26775rem;
}

.ReceptionMenuContainer {
    display: flex;
    align-items: center;
    padding: 0.4vh 0; /* Sağ ve sol kenar boşluğu sıfır */
    border-radius: 2.53925rem;
    border: 1.27px solid rgb(255, 255, 255);
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(8.059002876281738px);
    padding-right: 0.7vh;
    padding-left: 0.2vh;
    width: fit-content;
    margin: auto;
    margin-top: 5vh;
    height: 3.8em;

    /* Media sorgularını kullanarak responsive davranış ekleyin */
    @media screen and (max-width: 768px) {
        top: 5%; /* Küçük ekranlarda menüyü yukarı taşıyabilirsiniz */
        gap: 0.5rem; /* Daha küçük bir boşluk ekleyebilirsiniz */
    }
}


.ReceptionMenuContainer-item {
    display: flex;
    padding: .8rem 2rem 0.8544rem 1.8rem;
    align-items: flex-start;
    border-radius: 2.53925rem;
    background: transparent;
    margin-left: .42em;
    text-transform: uppercase;
    margin-right: vh;
    margin-top: .1em;
    color: #ffffff;
    align-items: center;
    cursor: pointer;
    font-family: Satoshi;
    font-size: 1.11094rem;
    height: 50%;
    width: fit-content;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0.01588rem;
}

.damlaevlen {
    margin: auto;
    position:relative;
    background: transparent;
    top: 2em;
    height: 46vh;
}

.selected {
    background: #fdfdff;
    color: #EDEDED;
    font-family: Satoshi;
    font-style: normal;
    font-weight: 700;
    letter-spacing: .3vh;
    line-height: 2em;
    font-size: 1rem;
    position: relative;
}

@font-face { 
    font-family: Satoshi;
    src: url(fonts/Satoshi-Regular.otf);
}

@font-face { 
    font-family: SatoshiBold;
    src: url(fonts/Satoshi-Bold.otf);
}

.MotelReceptionSlider {
    top: -5em;
    width: 47.1875rem;
    height: 32.20925rem;
    flex-shrink: 0;
    margin: auto;
    position: relative;
    border-radius: 0.53519rem;
    border: 0.869px solid #ffffff;
    background: rgba(62, 62, 62, 0.01);
    box-shadow: 0px 0px 11.569709777832031px 0px rgba(119, 119, 119, 0.16);
}

.MotelReceptionImage {
    width: 45.8125rem;
    height: 16.125rem;
    margin-top: 1vh;
    flex-shrink: 0;
    object-fit: cover;
    border-radius: 0.64163rem;
}

.RoomTypeHeader {
    color: #ffffff;
    font-family: SatoshiBold;
    font-size: 2.30863rem;
    text-align: center;
    text-transform: uppercase;
    position: relative;
    top: -1vh;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
}

.tanitimText {
    width: 23.1875rem;
    height: 2.75563rem;
    color: #ffffff;
    margin: auto;
    position: relative;
    top: -2.5em;
    font-family: Satoshi;
    font-size: 0.89231rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-align: center;
}

.rentARoom {
    width: 19.45144rem;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.59875rem;
    margin: auto;
    cursor: pointer;
    flex-shrink: 0;
    margin-top: 1vh;
    border-radius: 0.40325rem;
    border: 1.26px solid #ffffff;
    background: rgba(217, 217, 217, 0.06);
    color: #ffffff;
    font-family: Satoshi;
    font-size: 0.94688rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.resimSlaytCizgileri {
    background: transparent;
    max-width: 52vh;
    width: fit-content;
    height: 2vh;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(78px, 1fr));
    margin: auto;
    position: relative;
    top: -3em;
}

.sliderx {
    width: 4.0265rem;
    height: 0.397rem;
    cursor: pointer;
    transition: .4s;
    flex-shrink: 0;
    border-radius: 0.17013rem;
    border-radius: 0.17013rem;
    background: #272727;
}

.sliderx:hover {
    background-color: #ffffff;
    transition: .4s;
}

.selectedcizgi {
    background: #ffffff;
    float: left;

}

.solOk {
    position: relative;
    left: 55vh;
    transition: .4s;
    cursor: pointer;
    top: 19vh;
}

.solOk p:hover, .sagOk p:hover {
    transition: .4s;
    color: #fff;
}

.sagOk {
    position: relative;
    left: 121vh;
    top: 15vh;
    transition: .4s;
    cursor: pointer;
}

.buyMotelContainer {
    background-color: transparent;
    width: fit-content;
    margin: auto;
    max-width: 64vh;
    position: relative;
    top: 7em;
    height: 6em;
}

.kotuoyna {
    display: block;
    width: 72%;
    height: 59em;
    margin: auto;
    margin-top: 3em;
    background-color: transparent;
}

.buyMotelContainer h4 {
    color: #7E7E7E;
    text-align: center;
    font-family: Satoshi;
    font-size: 1.32888rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.buyMotelButton {
    width: fit-content;
    height: 2.4375rem;
    margin: auto;
    position: relative;
    top: -1vh;
    transition: .4s;
    cursor: pointer;
    flex-shrink: 0;
    color: #21DB98;
    border-radius: 0.30344rem;
    border: 0.971px solid #21DB98;
    background: rgba(33, 219, 152, 0.06);
    box-shadow: 0px 0px 38px 0px rgba(172, 172, 172, 0.16);
}

.buyMotelButton:hover {
    transition: .4s;
    background-color: #21DB98;
    color: #000;
}

.buyMotelButton p {
    width: fit-content;
    height: 1.21875rem;
    flex-shrink: 0;
    font-family: Satoshi;
    margin: auto;
    padding: 12px;
    font-size: 0.72969rem;
    font-style: normal;
    font-weight: 700;
    text-align: center;
    line-height: normal;
}

.buyMotelModal {
    width: 30.5625rem;
    height: 12.875rem;
    flex-shrink: 0;
    position: absolute;
    left: 0;
    margin: auto;
    display: none;
    bottom: 0;
    top: 0;
    right: 0;
    border-radius: 1rem;
    border-radius: 1.5625rem;
    background: #0e0d0d;
}

.buyMotelModal h6 {
    width: 24.8125rem;
    height: 3rem;
    flex-shrink: 0;
    color: #B6B6B6;
    font-family: Rubik;
    text-align: left;
    position: relative;
    top: -2.5vh;
    left: 2vh;
    font-size: 1.1rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.cizgiM {
    width: 91.5%;
    margin: auto;
    position: relative;
    top: -8.7vh;
    height: 0.125rem;
    flex-shrink: 0;
    background: rgba(48, 48, 48, 0.46);
}

.textduy {
    width: 72%;
    height: 10.9375rem;
    flex-shrink: 0;
    color: #ffffff;
    text-align: center;
    margin: auto;
    position: relative;
    top: -7vh;
    font-family: Inter;
    font-size: 1.4rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.butx {
    border-radius: 0.625rem;
    width: 12.875rem;
    height: 3.525rem;
    float: left;
    cursor: pointer;
    position: relative;
    text-align: center;
    left: 1vh;
    top: -17.5vh;
    margin-left: 2vh;
    flex-shrink: 0;
}


.butx p {
    position:relative;
    top: -0.7vh;
}

.cancel {
    background: #181818;
    color: #A3A2A2;
    text-align: center;
    font-family: Inter;
    font-size: 1.3rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.buy {
    flex-shrink: 0;
    border-radius: 0.625rem;
    background: #3EA862;
    color: #211F1F;
    text-align: center;
    font-family: Inter;
    font-size: 1.3rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.BuyEnterScreen {
    background-color: transparent;
    width: 154vh;
    position: relative;
    top: 10vh;
    margin: auto;
    height: 69vh;
}

.odaTypeString {
    color: #AAA;
    font-family: Inter;
    font-size: 2.02963rem;
    font-style: normal;
    text-transform: uppercase;
    font-weight: 600;
    line-height: normal;
}

.minikstring {
    color: #6B6B6B;
    font-family: Satoshi;
    font-size: 1.12856rem;
    font-style: normal;
    font-weight: 500;
    position: absolute;
    left: 0vh;
    top: 3.5vh;
    line-height: normal;
}

.odabox1 {
    background: transparent;
    width: 45vh;
    height: 10vh;
    position: relative;
    top: 5vh;
}

.odabox2 {
    width: 3.13938rem;
    height: 3.13938rem;
    flex-shrink: 0;
    float: left;
    border-radius: 0.1365rem;
    background: #EB2834;
}

.filledroomstext {
    color: #696969;
    font-family: Satoshi;
    font-size: 1.11069rem;
    font-style: normal;
    margin-left: 1vh;
    float: left;
    font-weight: 500;
    line-height: normal;
}

.filledroomsmiktar {
    color: #C6C6C6;
    font-family: Satoshi;
    font-size: 1.11069rem;
    font-style: normal;
    font-weight: 700;
    margin: auto;
    position: absolute;
    left: 5.7vh;
    top: 2vh;
    line-height: normal;
}

.filledroomstext2 {
    color: #696969;
    font-family: Satoshi;
    font-size: 1.11069rem;
    font-style: normal;
    position: relative;
    top: -2vh;
    text-transform: uppercase;
    left: 6vh;
    float: left;
    font-weight: 500;
    line-height: normal;
}

.filledroomsmiktar2 {
    color: #C6C6C6;
    font-family: Satoshi;
    font-size: 1.11069rem;
    font-style: normal;
    font-weight: 700;
    position: absolute;
    left: 26vh;
    top: 2vh;
    line-height: normal;
}

.odabox3 {
    width: 3.13938rem;
    height: 3.13938rem;
    position: relative;
    top: -2vh;
    left: 5vh;
    border-radius: 0.1365rem;
    border: 2.184px solid #565656;
    background: rgba(86, 86, 86, 0.00);
    float: left;
    flex-shrink: 0;
}

.odalistx {
    background: transparent;
    width: 98vh;
    height: 41vh;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
    top: 1vh;
}

.roompart {
    width: 9.5625rem;
    height: 9.5625rem;
    flex-shrink: 0;
    position: relative;
    left: -3vh;
    margin-top: 3vh;
    margin-left: 3vh;
    float: left;
    border-radius: 0.41563rem;
}

.empty {
    border-radius: 0.41575rem;
    border: 4px solid #565656;
    transition: .4s;
    color: #565656;
    cursor: pointer;
    background: rgba(86, 86, 86, 0.00);
}

.empty:hover {
    transition: .4s;
    border: 4px solid #EB2834;
    background: #EB2834;
    color: #FFF;
}

.full {
    border-radius: 0.41575rem;
    border: 4px solid #EB2834;
    background: #EB2834;
    color: #FFF;
}

.seciliOda {
    border-radius: 0.41575rem;
    border: 4px solid #1d9d34;
    background: #1d9d34;
    color: #FFF;
}

.roompart p {
    text-align: center;
    font-family: Satoshi;
    font-size: 3.25rem;
    margin: auto;
    padding: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

/* width */
::-webkit-scrollbar {
    width: 0px;
    height: 0px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.6); 
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.6); 
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.6); 
  }

.paymentPart {
    background-color: transparent;
    width: 53vh;
    float: right;
    left: 4vh;
    height: 69vh;
    bottom: 53vh;
    position: relative;
}

.paymentPartText {
    color: #AAA;
    font-family: SatoshiBold;
    font-size: 2.22963rem;
    font-style: normal;
    position: absolute;
    left: .5vh;
    top: -6vh;
    font-weight: 900;
    line-height: normal;
}

.inx {
    color: #6B6B6B;
    font-family: Satoshi;
    font-size: 1.12856rem;
    font-style: normal;
    float: left;
    position: relative;
    left: 1vh;
    font-weight: 500;
    line-height: normal;
}

.boxapp {
    width: 33rem;
    height: 33.625rem;
    position: relative;
    top: 4vh;
    flex-shrink: 0;
    border-radius: 0.375rem;
    background: linear-gradient(113deg, rgba(11, 11, 12, 0.40) 0%, rgba(11, 11, 12, 0.40) 100%);
}


.rombox {
    width: 30.5rem;
    height: 6.4375rem;
    flex-shrink: 0;
    margin: auto;
    position: relative;
    top: 1.5vh;
    border-radius: 0.41563rem;
    border: 4px solid #565656;
    background: rgba(86, 86, 86, 0.00);
}

.romboxtext {
    color: #565656;
    text-align: center;
    font-family: Satoshi;
    font-size: 2.58838rem;
    font-style: normal;
    text-transform: uppercase;
    position: relative;
    top: -4.5vh;
    font-weight: 700;
    line-height: normal;
}

.amounttext {
    color: #5C5C5C;
    font-family: Satoshi;
    font-size: 1.25056rem;
    position: relative;
    font-style: normal;
    width: 17vh;
    top: 1vh;
    float: right;
    float: left;
    left: 1.7vh;
    font-weight: 700;
    line-height: normal;
}

.amountmiktar {
    color: #8B8B8B;
    font-family: Satoshi;
    font-size: 2.75369rem;
    font-style: normal;
    float: right;
    position: relative;
    right: 1vh;
    top: -2.7vh;
    font-weight: 700;
    line-height: normal;
}

.dexcription {
    color: #5C5C5C;
    text-align: center;
    font-family: 'SatoshiBold';
    font-size: 1.25056rem;
    font-style: normal;
    position: relative;
    width: 22vh;
    top: 2vh;
    left: 0.2vh;
    font-weight: 700;
    line-height: normal;
}

.boxapp p {
    width: 30.25rem;
    height: 7.9375rem;
    flex-shrink: 0;
    color: #ADADAD;
    font-family: Satoshi;
    font-size: 1.0625rem;
    position: relative;
    left: 2vh;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.ayarlanhadi {
    width: 95%;
    height: 4.0625rem;
    flex-shrink: 0;
    border-radius: 0rem 0rem 0.375rem 0.4375rem;
    background: #17986A;
    color: #FFF;
    font-family: Satoshi;
    font-size: 1.36269rem;
    border: 1px;
    position: relative;
    font-style: normal;
    font-weight: 900;
    transition: .4s;
    line-height: normal;
    left: 2vh;
    cursor: pointer;
}

.ayarlanhadi:hover, .BabalaTv:hover, .RecepFazilYarakKurek:hover, .CreatHotel:hover, .EnCokBeniSev:hover, .successOnayla:hover, .SaveChanges:hover, .SaveHersey:hover, .CreateFaadback:hover {
    transition: .4s;
    box-shadow: 0px 0px 24px 0px #17986A;
}

#myrooms h1 {
    color: #8D8D8D;
    font-family: 'SatoshiBold';
    font-size: 1.36275rem;
    font-style: normal;
    font-weight: 800;
    position: relative;
    left: 7.2em;
    top: 0;
    text-align: left;
    line-height: normal;
}

.roomlistbox {
    width: 49.2rem;
    height: 41.1875rem;
    float: left;
    position: relative;
    left: 1vh;
    top: 1vh;
    flex-shrink: 0;
    overflow-x: hidden;
    overflow-y: auto;
}

.roomlistbox2 {
    width: 100%;
    height: 41.1875rem;
    float: right;
    position: relative;
    top: 0.8vh;
    flex-shrink: 0;
    right: 0vh;
    overflow-x: hidden;
    background: transparent;
    overflow-y: auto;
}


.roomLix {
    width: 20.75rem;
    height: fit-content;
    flex-shrink: 0;
    float: left;
    border-radius: 1rem;
    margin-left: 3vh;
    position: relative;
    left: -3vh;
    top: -1vh;
    margin-top: 2vh;
    border: 2px solid #444444;
    background: #101010;
}

.tanitim {
    width: 19.625rem;
    height: 10.875rem;
    cursor: pointer;
    margin-top: 1vh;
    flex-shrink: 0;
    border-radius: 0.875rem;
}

.overlay3 {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
  
.overlay3 p {
    color: #a3a3a3;
    font-size: 24px;
    font-family: 'SatoshiBold';
    position: relative;
    text-transform: uppercase;
    font-weight: bold;
}

.tanitimx {
    width: 100%;
    background: transparent;
    height: 18vh;
    top: -5vh;
    flex-shrink: 0;
    position: relative;
    margin: auto;
    margin-top: 5vh;
    border-radius: .4vh;
    cursor: pointer;
}

.tanitimx:hover .overlay3 {
    opacity: 1;
    pointer-events: auto; /* İmleç overlay üzerine geldiğinde overlay elementine izin verir */
}

.odaX {
    background: transparent;
    width: 90%;
    float: left;
    margin: auto;
    margin-left: 1.5vh;
    position: relative;
    top: -5.8vh;
    height: 3.8vh;
    margin-top: -0.5vh;
}

.odaX2 {
    background: transparent;
    width: 90%;
    float: left;
    margin: auto;
    margin-left: 2vh;
    position: relative;
    top: 2vh;
    height: 3.8vh;
}

.solKisim {
    width: fit-content;
    max-width: 50%;
    height: 100%;
    float: left;
    background: transparent;
}

.sagKisim {
    width: fit-content;
    max-width: 50%;
    height: 100%;
    float: right;
    background: transparent;
}

.solKisim h4 {
    color: #747171;
    text-align: center;
    font-family: Inter;
    position:relative;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.sagKisim h5 {
    color: #b9b9b9;
    font-family: 'SatoshiBold';
    font-size: 1.3rem;
    margin: auto;
    text-align: right;
    padding-top: 1.9vh;
    text-transform: uppercase;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.kirmizicizgimiz {
    width: 93%;
    height: 0.125rem;
    flex-shrink: 0;
    background: #2a2a2a;
    border-radius: 19px;
    position: relative;
    margin: auto;
    top: 14.7vh;
}

.red {
    background: #E7242F;
}

.buten {
    width: 6.25rem;
    height: 1.375rem;
    flex-shrink: 0;
    border: 1px;
    border-radius: 0.1875rem;
    margin-top: 2vh;
    color: #E9E9E9;
    text-align: center;
    cursor: pointer;
    font-family: Inter;
    font-size: 0.725rem;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.borderline {
    background: #E6942C;
}

.octext {
    text-align: left;
    position: relative;
    left: 28vh;
    top: 12.3vh;
}

.listeleFaturalar {
    background: transparent;
    width: 99%;
    height: 58vh;
    position: relative;
    overflow-x: hidden;
    overflow-y: auto;
    border-radius: .4vh;
}

.fatura {
    width: 98.3%;
    height: 3.0625rem;
    flex-shrink: 0;
    border-radius: 0.18363rem;
    position: relative;
    top: -1vh;
    left: 1vh;
    margin-top: 1vh;
    border: 0.735px solid #616161;
    background: rgba(97, 97, 97, 0.11);
}

.faturaNo {
    width: 10%;
    height: 100%;
    float: left;
    background-color: transparent;
}

.faturaDate {
    background-color: transparent;
    width: 40%;
    float: left;
    height: 100%;
}

.faturaRoom {
    background-color:transparent;
    width: 30%;
    float: left;
    height: 100%;
}

.faturaOdendi {
    background-color:transparent;
    width: 20%;
    float: left;
    height: 100%;
}

.faturaNo h4, .faturaDate h4, .faturaRoom h4 {
    color: #A7A7A7;
    text-align: center;
    font-family: Satoshi;
    margin: auto;
    padding: 14px;
    text-align: left;
    font-size: 0.96119rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.odeme {
    width: 5.19256rem;
    border: 1px;
    height: 1.548rem;
    flex-shrink: 0;
    margin-left: 3vh;
    text-align: center;
    margin-top: 1.2vh;
    font-family: Satoshi;
    font-size: 1.3vh;
    font-style: normal;
    font-weight: 500;
    transition: .4s;
    line-height: normal;
    border-radius: 0.258rem;
    z-index: 8000;
}

.kasarx {
    cursor: pointer;
    color: #fb432c;
    border: 1.032px solid #ff614d;
    background: rgba(215, 29, 29, 0.21);
}

.kasarxV {
    color: #cc6c1e;
    border: 1.032px solid #cc6c1e;
    background: rgba(128, 60, 6, 0.21);
}

.kasar {
    color: #1DD794;
    border: 1.032px solid #1DD794;
    background: rgba(29, 215, 148, 0.21);
}

.kasar:hover {
    transition: .4s;
    box-shadow: 0px 0px 24px 0px #1DD794;
}

.kasarx:hover {
    transition: .4s;
    box-shadow: 0px 0px 24px 0px #c42713;
}

.kasarxV:hover {
    transition: .4s;
    box-shadow: 0px 0px 24px 0px #cc6c1e;
}

#BossMenuContainer h1 {
    color: #B1B1B1;
    text-align: center;
    text-shadow: 0px 3.532224416732788px 152.76870727539062px 0px rgba(238, 238, 238, 0.55);
    font-family: Manrope;
    font-size: 3.14588rem;
    font-style: normal;
    text-transform: uppercase;
    position: relative;
    top: 4vh;
    margin: auto;
    font-weight: 800;
    line-height: normal;
}

#BossMenuContainer h3 {
    color: #515151;
    text-align: center;
    text-shadow: 0px 1.9396092891693115px 83.88809967041016px 0px rgba(238, 238, 238, 0.55);
    font-family: Manrope;
    font-size: 1.72744rem;
    font-style: normal;
    font-weight: 500;
    text-transform: uppercase;
    margin: auto;
    margin-top: 3.5vh;
    line-height: normal;
    letter-spacing: 0.26775rem;
}

.bossMenuList {
    background-color: transparent;
    width: 38vh;
    height: 76vh;
    float: left;
    position: relative;
    left: 5vh;
    top: 6vh;
    border-radius: .4vh;
}

.bossmenu-item {
    width: 20.5625rem;
    height: 4.3125rem;
    cursor: pointer;
    margin-top: -1.3vh;
    flex-shrink: 0;
    transition: .4s;
    color: #4B4B4B;
    border-radius: 0.375rem;
    background: linear-gradient(113deg, rgba(217, 217, 217, 0.07) 0%, rgba(217, 217, 217, 0.00) 100%);
    box-shadow: 0px 0px 3px 0px rgb(255 255 255 / 47%);
}

/* .bossmenu-item:hover {
    transition: .4s;
    
    box-shadow: 0px 0px 6px 0px rgb(255 255 255 / 47%);
} */

.bossmenu-item:hover{
    color: #B2B2B2;
    transition: .4s;
    box-shadow: 0px 0px 6px 0px rgb(255 255 255 / 47%);
}

.bossmenu-item:hover .svg path {
    color: #B2B2B2;
    fill: #B2B2B2;    
    transition: .4s;
    box-shadow: 0px 0px 6px 0px rgb(255 255 255 / 47%);
}
  

.ownerIMG {
    width: 3.08488rem;
    height: 3.08488rem;
    position: relative;
    float: left;
    left: 1vh;
    top: 1vh;
    flex-shrink: 0;
    border-radius: 0.20119rem;
}

.bossmenu-item h4 {
    color: #C7C5C5;
    font-family: Satoshi;
    text-transform: uppercase;
    margin: auto;
    position: relative;
    left: 2vh;
    text-transform: uppercase;
    top: 1.5vh;
    float: left;
    font-size: 1.22794rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.bossmenu-item p {
    color: #939393;
    font-family: Satoshi;
    font-size: 0.74469rem;
    float: left;
    margin: auto;
    text-transform: uppercase;
    position: absolute;
    left: 6.5vh;
    top: 2.8vh;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.ikonc {
    float: right;
    position: relative;
    right: 1vh;
    top: 2vh;
}

.startbaba {
    float: left;
    width: 1.99463rem;
    height: 1.99444rem;
    position: relative;
    left: 1.5vh;
    top: 1.7vh;
    margin: auto;
    fill: #4B4B4B;
    flex-shrink: 0;
}

.startbaba2 {
    float: left;
    width: 1.99463rem;
    height: 1.99444rem;
    position: relative;
    left: 1.5vh;
    top: 2.3vh;
    margin: auto;
    fill: #4B4B4B;
    flex-shrink: 0;
}

.selecteditem .svg path {
    fill: #B2B2B2;
    color: #B2B2B2;
}

.selecteditem {
    color: #B2B2B2;
}
.bossmenu-item h5 {
    font-family: SatoshiBold;
    font-size: 1.30788rem;
    font-style: normal;
    position: relative;
    left: 4vh;
    text-transform: uppercase;
    top: 2vh;
    font-weight: 700;
    line-height: normal;
}

/** Menüler **/

.Dashboard {
    background: transparent;
    width: 139vh;
    height: 73vh;
    display: block;
    position: relative;
    left: 4vh;
    top: 4vh;
    float: left;
}

.RoomsPage {
    background: transparent;
    width: 139vh;
    height: 73vh;
    display: none;
    position: relative;
    left: 9vh;
    top: 4vh;
    float: left;
}

.FinancePage {
    background: transparent;
    width: 139vh;
    height: 73vh;
    display: none;
    position: relative;
    left: 9vh;
    top: 4vh;
    float: left;
}

.BillingPage {
    background: transparent;
    width: 139vh;
    height: 73vh;
    display: none;
    position: relative;
    left: 9vh;
    top: 4vh;
    float: left;
}

.SettingPage {
    background: transparent;
    width: 139vh;
    height: 73vh;
    display: none;
    position: relative;
    left: 9vh;
    top: 3vh;
    float: left;
}

/** Menü ler **/

.Dashboard h5, .RoomsPage h5, .FinancePage h5, .BillingPage h5, .SettingPage h5 {
    color: #8D8D8D;
    font-family: Satoshi;
    font-size: 1.30788rem;
    font-style: normal;
    margin: auto;
    text-transform: uppercase;
    position: relative;
    top: -4.4vh;
    margin-top: 1vh;
    font-weight: 700;
    line-height: normal;
}

.DashboardAssets {
    width: 59.6875rem;
    height: 301px;
    flex-shrink: 0;
    position: relative;
    top: -9.5vh;
    margin-top: 6vh;
    border-radius: 0.375rem;
    box-shadow: 0px 0px 3px 0px rgb(255 255 255 / 47%);
}

.assetsbox {
    width: 56.5rem;
    height: 7.2rem;
    flex-shrink: 0;
    margin-top: 2.5vh;
    position: relative;
    top: 1.8vh;
    left: 2vh;
    border-radius: 0.19594rem;
    border: 1.045px solid #434343;
    background: rgba(217, 217, 217, 0.04);
}

.assetsbox p {
    color: #8D8D8D;
    font-family: Satoshi;
    font-size: 0.79294rem;
    font-style: normal;
    position: relative;
    left: 2.7vh;
    top: 1.7vh;
    margin: auto;
    text-transform: uppercase;
    font-weight: 700;
    line-height: normal;
}

.assetsbox h4 {
    color: #8D8D8D;
    font-family: 'SatoshiBold';
    font-size: 3.0731rem;
    font-style: normal;
    margin: auto;
    position: relative;
    left: 2.5vh;
    text-transform: uppercase;
    top: 1.8vh;
    font-weight: 500;
    line-height: normal;
}

.circlebox {
    width: 19vh;
    height: 100%;
    position: relative;
    float: left;
    left: -4vh;
    margin-left: 9vh;
    top: 0vh;
    background-color: transparent;
}

.circlebox h6 {
    color: #8C8C8C;
    text-align: center;
    font-family: Satoshi;
    font-size: 1.38838rem;
    text-transform: uppercase;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

#anan {
    position: relative;
    left: 3vh;
    top: -20vh;
    stroke-dashoffset: 190;
}

#ortax {
    fill: transparent;
    stroke: #252525;
    stroke-width: 10px;
    stroke-dasharray: 565.48px;
    stroke-dashoffset: 0;
}

.dis {
    stroke-width: 10px;
    stroke-linecap: round;
    stroke-dashoffset: 350px;
    fill: transparent;
    stroke-dasharray: 55vh;
}

.text {
    fill: #fffdfd;
    font-size: 28.761px;
    font-style: normal;
    font-family: SatoshiBold;
    font-weight: bold;
    transform: rotate(90deg) translate(34px, -90px);
}

.text2 {
    color: #ffffff;
    font-size: 28.761px;
    font-style: normal;
    margin-left: 2vh;
    position: relative;
    text-align: center;
    top: -.5vh;
    font-family: SatoshiBold;
    font-weight: bold;
}


.gelirtext {
    color: #8C8C8C;
    text-align: center;
    font-family: Satoshi;
    font-size: 21.214px;
    font-style: normal;
    margin-left: 2.5vh;
    margin-top: 6vh;
    font-weight: 700;
    line-height: normal;
}

.svgx {
    transform: rotate(-90deg);
    position: relative;
    left: 1.7vh;
    margin: auto;
    top: 5vh;
}

.tablelist {
    background: transparent;
    width: 46vh;
    height: 75vh;
    margin: auto;
    position: relative;
    left: 92vh;
    bottom: 82.5vh;
    border-radius: .4vh;
    float: left;
}

.mem {
    color: #8D8D8D;
    font-family: Satoshi;
    font-size: 20.926px;
    font-style: normal;
    position: relative;
    top: 4vh;
    font-weight: 700;
    line-height: normal;
}

.listv {
    width: 435px;
    height: 18.9rem;
    flex-shrink: 0;
    position: relative;
    overflow: auto;
    margin-top: 6.9vh;
    top: -2vh;
    border-radius: 6px;
    box-shadow: 0px 0px 3px 0px rgb(255 255 255 / 47%);
    background: linear-gradient(113deg, rgba(11, 11, 12, 0.40) 0%, rgba(11, 11, 12, 0.40) 100%);
}

.listv-item {
    width: 93%;
    height: 16%;
    margin: auto;
    flex-shrink: 0;
    position: relative;
    top: 0.5vh;
    margin-top: 1vh;
    box-shadow: 0px 0px 0px 0.1px rgb(255 255 255 / 47%);
    background: rgba(217, 217, 217, 0.03);
}

.mulkiyet {
    float: left;
    width: 3.5vh;
    height: 3.5vh;
    position: relative;
    left: 1vh;
    top: 0.5vh;
    border-radius: .1vh;
}

.listv-item h5 {
    color: #ACACAC;
    font-family: Satoshi;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    position: relative;
    left: 2vh;
    top: 0.5vh;
    margin: auto;
    line-height: normal;
    float: left;
}

.listv-item p {
    color: #818181;
    font-family: 'Satoshi';
    font-size: 0.7rem;
    float: left;
    position: absolute;
    text-transform: uppercase;
    left: 5.6vh;
    top: 1.6vh;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.listv-itemm {
    width: 93%;
    height: 11vh;
    margin: auto;
    flex-shrink: 0;
    position: relative;
    top: 0.5vh;
    margin-top: 1vh;
    box-shadow: 0px 0px 0px 0.1px rgb(255 255 255 / 47%);
    background: rgba(217, 217, 217, 0.03);
}

.belmaIncke {
    background: #303030;
    height: 1.2px;
    top: 4.7vh;
    width: 95%;
    margin: auto;
    position: relative;
}

.listv-itemm h6 {
    text-align: center;
    margin-top: 6vh;
    font-family: 'Inter';
    color: #999;
    text-transform: uppercase;
}

.listv-itemm h5 {
    color: #ACACAC;
    font-family: Satoshi;
    font-size: 1rem;
    font-style: normal;
    font-weight: 500;
    position: relative;
    left: 2vh;
    top: 0.5vh;
    margin: auto;
    line-height: normal;
    float: left;
}

.listv-itemm p {
    color: #818181;
    font-family: 'Satoshi';
    font-size: 0.7rem;
    float: left;
    position: absolute;
    text-transform: uppercase;
    left: 5.6vh;
    top: 1.6vh;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.cenan {
    position: relative;
    transition: .4s;
    left: -1.5vh;
    top: 1.5vh;
    cursor: pointer;
    float: right;
}

.cenan:hover .mem1 path {
    transition: .4s;
    fill: #fff;
}

.allroomstab {
    width: 1249px;
    height: 694px;
    flex-shrink: 0;
    position: relative;
    top: -2.5vh;
    overflow: auto;
    border-radius: 6px;
    box-shadow: 0px 0px 0px 1px rgb(64 64 64 / 47%);
    background: linear-gradient(113deg, rgba(11, 11, 12, 0.40) 0%, rgba(11, 11, 12, 0.40) 100%);
}

.roomimg {
    width: 95%;
    height: 8rem;
    position: relative;
    top: 1vh;
    border-radius: 16px;
}

.roomparx {
    width: 235.84px;
    height: 174.143px;
    position: relative;
    margin-top: 1vh;
    float: left;
    margin-left: 1vh;
    flex-shrink: 0;
}

.had {
    width: 205.869px;
    height: 45.4px;
    flex-shrink: 0;
    position: relative;
    margin: auto;
    margin-left: 2.3vh;
    top: 2.3vh;
    border-radius: 3.783px;
    background: rgba(217, 217, 217, 0.08);
}

.rooms-item {
    float: left;
    background: transparent;
    width: fit-content;
}

.hadh1 {
    color: #c9c8c8;
    font-family: 'SatoshiBold';
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 500;
    margin: auto;
    text-transform: uppercase;
    position: relative;
    top: -16.5vh;
    text-align: center;
    line-height: normal;
}

.icerika {
    background: transparent;
    width: 22vh;
    height: 11vh;
    left: 2.5vh;
    top: 2.5vh;
    position: relative;
}

.stateroom {
    width: 201.869px;
    height: 32.267px;
    flex-shrink: 0;
    margin-top: 0.6vh;
    border-radius: 3.783px;
}

.state-text {
    color: #FFF;
    font-family: Satoshi;
    font-size: 15.379px;
    font-style: normal;
    font-weight: 700;
    margin: auto;
    text-align: center;
    position: relative;
    text-transform: uppercase;
    top: -11.8vh;
    line-height: normal;
}

.editRoom {
    width: 203.869px;
    height: 45.4px;
    flex-shrink: 0;
    cursor: pointer;
    color: #A0A0A0;
    font-family: Satoshi;
    font-size: 16.382px;
    font-style: normal;
    margin: auto;
    z-index: 9992;
    text-transform: uppercase;
    transition: .4s;
    position: relative;
    top: -8vh;
    font-weight: 700;
    line-height: normal;
    border-radius: 3.783px;
    border: 0.946px solid #606060;
    background: rgba(217, 217, 217, 0.08);
}

.fulx {
    border: 0.946px solid #EB2834;
    background: #EB2834;
}

.editRoom:hover {
    transition: .4s;
    box-shadow: 0px 0px 6px 0px rgb(255 255 255 / 47%);
}

.emptyy {
    border: 0.946px solid #616161;
    background: rgba(97, 97, 97, 0.40);
}

.roomeditpage {
    border-radius: 7.275px;
    background: #000000de;
    position: absolute;
    z-index: 99999;
    width: 568px;
    padding-bottom: 4vh;
    height: fit-content;
    display: none;
    flex-shrink: 0;
    box-shadow: 0px 0px 3px 0px rgb(255 255 255 / 47%);
    left: 0;
    right: 0;
    margin: auto;
    top: 0;
    bottom: 0;
}

.ownerBox {
    width: 33.5rem;
    height: 72px;
    flex-shrink: 0;
    border-radius: .2rem;
    border: 0.639px solid #434343;
    background: rgba(217, 217, 217, 0.04);
    margin: auto;
    margin-top: 0.9rem;
}

.infoowner {
    color: #676767;
    font-family: Satoshi;
    font-size: 0.9rem;
    font-style: normal;
    position: relative;
    top: 1.2vh;
    left: 1.5vh;
    font-weight: 700;
    line-height: normal;
}

.roomownername {
    color: #ACACAC;
    font-family: 'SatoshiBold';
    font-size: 25.154px;
    font-style: normal;
    position: relative;
    text-transform: uppercase;
    top: 1vh;
    left: 1.4vh;
    font-weight: 500;
    line-height: normal;
}

.kalas {
    color: #ACACAC;
    font-family: 'SatoshiBold';
    font-size: 25.154px;
    font-style: normal;
    position: relative;
    float: left;
    left: 2vh;
    top: 1.1vh;
    font-weight: 500;
    background: transparent;
    border: 1px;
    line-height: normal;
}

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

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

input:focus {
    outline: 0;
}

.dolar {
    color: #ACACAC;
    font-family: SatoshiBold;
    font-size: 25.154px;
    position: relative;
    top: 1.2vh;
    font-style: normal;
    left: 1.4vh;
    font-weight: 500;
    float: left;
    line-height: normal;
}

.UpdatePriceButton {
    background: #00b764;
    width: 32.4rem;
    padding-left: 1vh;
    position: relative;
    left: 1.5vh;
    float: left;
    right: 0.5vh;
    border-radius: .4vh;
    transition: .4s;
    top: 1vh;
    color: #000000;
    cursor: pointer;
    height: 3vh;
    padding-right: 1vh;
}

.UpdatePriceButton p {
    text-align: center;
    font-family: 'SatoshiBold';
    font-size: 12.546px;
    text-transform: uppercase;
    font-style: normal;
    position: relative;
    top: -0.4vh;
    font-weight: 900;
    line-height: normal;
}

.UpdatePriceButton:hover, .resetOwnerButton:hover  {
    transition: .4s;
    box-shadow: 0px 0px 10px 0px #15c596;
}

.tyu {
    width: 265px;
    height: 29px;
    margin-top: 1.9vh;
    z-index: 9999;
    top: 0.2vh;
    cursor: pointer;
    float: left;
    position: relative;
    transition: .4s;
    left: 1vh;
    margin-left: 0.5vh;
    flex-shrink: 0;
}

.kick {
    border-radius: 0.3vh;
    background: #676767;
}

.deleteroom {
    border-radius: 0.3vh;
    background: #EB2834;
}

.tyu p {
    color: #FFF;
    text-align: center;
    font-family: Satoshi;
    font-size: 11.546px;
    position: relative;
    top: -0.5vh;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
}

.kick:hover {
    transition: .4s;
    box-shadow: 0px 0px 10px 0px #676767;
}

.deleteroom:hover {
    transition: .4s;
    box-shadow: 0px 0px 10px 0px #EB2834;
}

.roomeditpage h6 {
    color: #8D8D8D;
    font-family: Satoshi;
    font-size: 13.434px;
    font-style: normal;
    margin: 0;
    position: relative;
    z-index: -1;
    top: 1.5vh;
    margin-top: 4vh;
    left: 1.6vh;
    font-weight: 700;
    line-height: normal;
}

.odaListesi {
    background: transparent;
    width: 96%;
    position: relative;
    top: 2.5vh;
    left: 1.2vh;
    overflow-x: hidden;
    overflow-y: auto;
    height: 30vh;
}

.odalarCaylaar {
    width: 533.135px;
    height: 100.107px;
    flex-shrink: 0;
    cursor: pointer;
    margin-top: 1vh;
    top: -1vh;
    left: 0.5vh;
    position: relative;
    border-radius: 5.01px;
    border: 1px solid transparent;
    display: flex;
    justify-content: center;
    align-items: center;
}

.secilirex {
    border: 1px solid #efefef;
}

.banner {
    width: 100%;
    height: 100%;
    border-radius: 0.3rem;
    cursor: pointer;
    object-fit: cover;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    pointer-events: none; /* İmleç overlay üzerinden geçerken elementin altındaki elementlere izin verir */
    transition: opacity 0.3s ease;
  }
  
  .overlay p {
    color: #a3a3a3;
    font-size: 24px;
    font-family: 'SatoshiBold';
    position: relative;
    text-transform: uppercase;
    top: 0vh;
    font-weight: bold;
  }
  
  .odalarCaylaar:hover .overlay {
    opacity: 1;
    pointer-events: auto; /* İmleç overlay üzerine geldiğinde overlay elementine izin verir */
  }


.billlist {
    background: transparent;
    width: 94.5%;
    height: 15vh;
    left: 1.8vh;
    position: relative;
    overflow: auto;
    top: 1.3vh;
}

.fatura-item {
    width: 529px;
    height: 42.536px;
    flex-shrink: 0;
    margin-top: 0.6vh;
    position: relative;
    top: 0.3vh;
    border-radius: 3.657px;
    border: 0.914px solid #616161;
    background: rgba(97, 97, 97, 0.11);
}

.orxa {
    float: left;
    width: 29%;
    height: 100%;
    left: -1vh;
    margin-left: 1vh;
    position: relative;
    background: transparent;
}

.orxa h5 {
    color: #A7A7A7;
    font-family: Satoshi;
    font-size: 14.867px;
    font-style: normal;
    padding: 11px;
    margin: auto;
    font-weight: 500;
    line-height: normal;
}

.odenx {
    width: 62.837px;
    height: 23.201px;
    flex-shrink: 0;
    border-radius: 3.867px;
    position: relative;
    top: 1vh;
    float: right;
    font-family: Satoshi;
    font-size: 12.259px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.error {
    color: #FF2E3A;
    border: 0.967px solid #EB2834;
    background: rgba(235, 40, 52, 0.21);
}

.errorbes {
    color: #c2560d;
    border: 0.967px solid #c2560d;
    background: rgba(128, 72, 8, 0.21);
}

.basar {
    color: #19c24c;
    border: 0.967px solid #19c24c;
    background: rgba(40, 235, 89, 0.21);
}

.odenx p {
    text-align: center;
    position: relative;
    top: -0.8vh;
}

.resetOwnerButton {
    background: #0bbf6e;
    color: #000;
    position: relative;
    text-transform: uppercase;
    top: -7.2vh;
    font-family: 'Inter';
    cursor: pointer;
    z-index: 9999;
    font-weight: 600;
    transition: .4s;
    border: 1px;
    right: 23vh;
    width: 20vh;
    height: 3.5vh;
    border-radius: .4vh;
}

.financePageX {
    width: 1298px;
    height: 694px;
    flex-shrink: 0;
    position: relative;
    top: -1vh;
    border-radius: 6px;
    box-shadow: 0px 0px 0px 1px rgb(64 64 64 / 47%);
    background: linear-gradient(113deg, rgba(11, 11, 12, 0.40) 0%, rgba(11, 11, 12, 0.40) 100%);
}

.erbakan {
    color: #a19f9f;
}

.TotalMoneyBox {
    width: 97%;
    height: 102px;
    flex-shrink: 0;
    margin: auto;
    position: relative;
    top: 2vh;
    border-radius: 3.135px;
    border: 1.045px solid #434343;
    background: rgba(217, 217, 217, 0.04);
}

.totalbox {
    color: #8D8D8D;
    font-family: Satoshi;
    font-size: 12.687px;
    font-style: normal;
    position: relative;
    top: 2vh;
    left: 2vh;
    font-weight: 700;
    line-height: normal;
}

.TotalMoneyBox h6 {
    color: #8D8D8D;
    font-family: SatoshiBold;
    font-size: 41.717px;
    font-style: normal;
    margin: auto;
    position: relative;
    top: 1.7vh;
    left: 2vh;
    font-weight: 500;
    line-height: normal;
}

.FinancePageh6 {
    color: #8D8D8D;
    font-family: Satoshi;
    font-size: 20.926px;
    font-style: normal;
    position: relative;
    left: 1.9vh;
    top: 6vh;
    text-transform: uppercase;
    font-weight: 700;
    line-height: normal;
}

.FinanceBox {
    width: 642.078px;
    height: 33rem;
    flex-shrink: 0;
    position: relative;
    top: 4vh;
    left: 1.8vh;
    border-radius: 2.996px;
    border: 0.999px solid #434343;
    background: rgba(217, 217, 217, 0.04);
}

.girMiktar {
    border-radius: 5px;
    border: 1px solid #717171;
    background: rgba(217, 217, 217, 0.02);
    width: 90%;
    height: 72px;
    flex-shrink: 0;
    padding-left: 3vh;
    margin-left: 1.4vh;
    margin-top: 1.4vh;
    color: #636363;
    font-family: 'SatoshiBold';
    font-size: 21.186px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.typeScript {
    width: 302px;
    height: 65px;
    margin-left: 0.8vh;
    margin-top: 1vh;
    z-index: 2;
    position: relative;
    left: 0.6vh;
    cursor: pointer;
    flex-shrink: 0;
    float: left;
}

.typenonselected {
    border-radius: 0.4vh;
    transition: .4s;
    background: rgba(95, 95, 95, 0.35);
}

.typeselected {
    border-radius: 0.4vh;
    background: #5F5F5F;
}

.typeScript p {
    color: rgba(255, 255, 255, 0.56);
    text-align: center;
    font-family: Satoshi;
    font-size: 17.803px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.typenonselected:hover {
    background-color: #5F5F5F;
    transition: .4s;
}

.minitexts {
    width: 610px;
    height: 105px;
    flex-shrink: 0;
    position: relative;
    top: 1vh;
    z-index: 1;
    margin: auto;
    color: #6A6A6A;
    font-family: Satoshi;
    font-size: 21.803px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.successOnayla {
    width: 96.6%;
    height: 65px;
    flex-shrink: 0;
    border-radius: .4vh;
    background: #17986A;
    color: #FFF;
    text-align: center;
    position: relative;
    top: 23.6vh;
    cursor: pointer;
    left: 1vh;
    border: 1px;
    transition: .4s;
    font-family: Satoshi;
    font-size: 25.662px;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
}

.FinanceHistory {
    width: 600.078px;
    height: 523.733px;
    float: right;
    position: relative;
    right: 2vh;
    bottom: 45vh;
    flex-shrink: 0;
    overflow: auto;
    border-radius: 2.996px;
    border: 0.999px solid #434343;
    background: rgba(217, 217, 217, 0.04);
}

.FinanceHistory-Item {
    width: 582px;
    height: 44px;
    flex-shrink: 0;
    border-radius: 3.783px;
    margin: auto;
    margin-top: 1vh;
    border: 0.946px solid #616161;
    background: rgba(97, 97, 97, 0.11);
}

.George {
    width: 30%;
    float: left;
    height: 100%;
    background: transparent;
}

.George h6 {
    color: #A7A7A7;
    font-family: 'SatoshiBold';
    font-size: 15.379px;
    font-style: normal;
    margin: auto;
    padding: 12px;
    text-transform: uppercase;
    font-weight: 500;
    line-height: normal;
}

.BillingMenu {
    width: 98.5%;
    height: 44px;
    flex-shrink: 0;
    border-radius: 3.783px;
    margin: auto;
    margin-top: 0vh;
    position: relative;
    top: 1vh;
    border: 0.946px solid #616161;
    background: rgba(97, 97, 97, 0.11);
}

.BillingX {
    width: 19%;
    height: 100%;
    margin-left: 1vh;
    background: transparent;
    float: left;
}

.BillingX p {
    color: #c7c6c6;
    font-family: 'SatoshiBold';
    font-size: 15.379px;
    text-align: CENTER;
    font-style: normal;
    font-weight: 700;
    text-transform: uppercase;
    padding: 11px;
    margin: auto;
    line-height: normal;
}

.BillingX h6 {
    color: #A7A7A7;
    font-family: 'Satoshi';
    font-size: 15.379px;
    text-align: center;
    font-style: normal;
    font-weight: 700;
    position: relative;
    top: -4.7vh;
    text-transform: uppercase;
    padding: 11px;
    margin: auto;
    line-height: normal;
}

#Fatura-Tablo {
    background: transparent;
    width: 100%;
    height: 67vh;
    position: relative;
    top: 6vh;
}

.FaturaID {
    display: flex;
    width: 118.4vh;
    height: 2.7rem;
    position: relative;
    top: -5vh;
    margin-top: 1vh;
    border-radius: .3vh;
    border: 0.946px solid #616161;
    background: rgba(97, 97, 97, 0.11);
}

.BillingXX {
    flex: 1; /* İç öğelerin eşit genişlikte olmasını sağlar */
    background: transparent;
    text-align: center;
    padding: 11px;
    box-sizing: border-box; /* Kenar boşlukları içeriğe dahil eder */
}

.BillingXX h6 {
    color: #A7A7A7;
    font-family: 'Satoshi';
    font-size: 15.379px;
    font-style: normal;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0; /* H6 içeriği iç öğenin içine tam sığdırır */
}



.NewOdeme {
    width: 65px;
    height: 24px;
    margin: auto;
    position: relative;
    left: -1vh;
    top: -0.2vh;
    flex-shrink: 0;
}

.NewOdeme-Suc {
    border-radius: 4px;
    color: #1DD794;
    border: 1px solid #1DD794;
    background: rgba(29, 215, 148, 0.21);
}

.NewOdeme-Error {
    border-radius: 4px;
    color: #d71d1d;
    border: 1px solid #d71d1d;
    background: rgba(215, 29, 29, 0.21);
}

.NewOdeme h4 {
    text-align: center;
    font-family: Satoshi;
    font-size: 14.43px;
    font-style: normal;
    padding: 3px;
    text-transform: uppercase;
    margin: auto;
    font-weight: 500;
    line-height: normal;
}

.Part {
    background-color: red;
    width: 10%;
    float: left;
    height: 100%;
}

.ayarlarkutu {
    width: 686px;
    height: 694px;
    float: left;
    position: relative;
    margin-right: 10vh;
    flex-shrink: 0;
    margin-top: -1vh;
    border-radius: 6px;
    box-shadow: 0px 0px 0px 1px rgb(64 64 64 / 47%);
    background: linear-gradient(113deg, rgba(11, 11, 12, 0.40) 0%, rgba(11, 11, 12, 0.40) 100%);
}

.ayarvar {
    width: 92%;
    height: 71.829px;
    margin: auto;
    flex-shrink: 0;
    margin-top: 3vh;
    position: relative;
    top: 0vh;
    border-radius: 2.199px;
    border: 0.733px solid #434343;
    background: rgba(217, 217, 217, 0.04);
}

.ayarvar p {
    color: #676767;
    font-family: Satoshi;
    font-size: 9.5px;
    font-style: normal;
    font-weight: 700;
    position: relative;
    left: 1.3vh;
    line-height: normal;
}

.ayarvar h6 {
    color: #ACACAC;
    font-family: Satoshi;
    font-size: 23.348px;
    font-style: normal;
    margin: auto;
    position: relative;
    left: 1.2vh;
    top: -0.6vh;
    font-weight: 500;
    line-height: normal;
}

.admotelinput {
    width: 38vh;
    height: 2vh;
    border: 1px;
    background-color: transparent;
    color: #ACACAC;
    font-family: Satoshi;
    font-size: 23.348px;
    position: relative;
    left: 0.2vh;
    top: -3.1vh;
    padding-left: 3vh;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}


.admotelinputt {
    width: 38vh;
    height: 2vh;
    border: 1px;
    background-color: transparent;
    color: #ACACAC;
    font-family: Satoshi;
    font-size: 23.348px;
    position: relative;
    left: 0.2vh;
    top: -3.2vh;
    padding-left: 3vh;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.SaveChanges {
    width: 634px;
    height: 65px;
    flex-shrink: 0;
    border-radius: .4vh;
    color: #FFF;
    text-align: center;
    font-family: SatoshiBold;
    transition: .4s;
    position: relative;
    left: 2.5vh;
    top: 3vh;
    text-transform: uppercase;
    border: 1px;
    cursor: pointer;
    font-size: 25.662px;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
    background: #17986A;
}

.ayarlarkutu h4 {
    width: 634px;
    height: 127px;
    flex-shrink: 0;
    color: #868686;
    font-family: Satoshi;
    font-size: 18px;
    text-align: center;
    margin: auto;
    position: relative;
    top: 5vh;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.satMoteli {
    width: 633px;
    color: #B7B7B7;
    text-align: center;
    font-family: SatoshiBold;
    font-size: 25.662px;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
    border: 1px;
    top: 8vh;
    height: 65px;
    position: relative;
    flex-shrink: 0;
    left: 3vh;
    border-radius: .4vh;
    text-transform: uppercase;
    cursor: pointer;
    background: #4A4A4A;
}

.fotox {
    width: 94%;
    height: 160px;
    border: 1px solid;
    flex-shrink: 0;
    position: relative;
    margin: auto;
    top: -0.5vh;
    margin-top: 2vh;
    height: 12vh;
    border-radius: .4vh;
    cursor: pointer;
}



.fotox img {
    width: 100%;
    height: 100%;
    border-radius: 0.3rem;
    cursor: pointer;
    object-fit: cover;
}

.overlay2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 143%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
  }
  
.overlay2 p {
    color: #a3a3a3;
    font-size: 24px;
    font-family: 'SatoshiBold';
    position: relative;
    top: -3vh;
    text-transform: uppercase;
    font-weight: bold;
}

.fotox:hover .overlay2 {
    opacity: 1;
    pointer-events: auto; /* İmleç overlay üzerine geldiğinde overlay elementine izin verir */
}


.bilkibox {
    width: 35rem;
    height: 410px;
    flex-shrink: 0;
    display: none;
    border-radius: 12px;
    background: #141414;
    position: absolute;
    z-index: 9996;
    left: 0;
    right: 0;
    margin: auto;
    bottom: 0;
    top: 0;
}

.uzunbox {
    width: 94%;
    height: 142px;
    flex-shrink: 0;
    border-radius: 12px;
    background: #0c0c0c;
    margin: auto;
    position: relative;
    top: 1.5vh;
}

.imgsr {
    width: 103px;
    height: 99px;
    flex-shrink: 0;
    position: relative;
    left: 0vh;
    top: 2vh;
    border-radius: 16px;
}

.playerxname {
    width: 303px;
    height: 93px;
    flex-shrink: 0;
    color: #FFF;
    font-family: Inter;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.imgsrspan {
    color: #FFF;
    font-family: Inter;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    position: relative;
    margin: auto;
    left: 3vh;
    top: -2.5vh;
    line-height: normal;
}

.imgsrh4 {
    color: #9A9393;
    font-family: Inter;
    font-size: 17px;
    font-style: normal;
    position: absolute;
    left: 15vh;
    top: 7.8vh;
    font-weight: 600;
    line-height: normal;
}

.Addon {
    width: 258px;
    height: 107px;
    flex-shrink: 0;
    float: left;
    position: relative;
    margin-left: 1vh;
    margin-top: 1vh;
    left: 1vh;
    top: 1.5vh;
    border-radius: 12px;
    background: #0c0c0c;
}

.Addon h6 {
    left: 2vh;
    top: 1.7vh;
    color: #848383;
    font-family: Inter;
    position: relative;
    font-size: 15px;
    margin: auto;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.kapaliMeseleler {
    position: absolute;
    float: right;
    height: 3vh;
    width: 3.4vh;
    border: 1px;
    background: #b51919;
    color: #fff;
    cursor: pointer;
    border-radius: .4vh;
    margin: auto;
    right: 1vh;
    top: 1vh;
}

.Addon h4 {
    color: #FFF;
    font-family: Inter;
    font-size: 3.5vh;
    position: relative;
    top: 2vh;
    left: 2vh;
    margin: auto;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.copyPhoneNo {
    border: 1px;
    background: transparent;
    color: #9a9393;
    position: relative;
    transition: .4s;
    top: -0.2vh;
    cursor: pointer;
}

.copyPhoneNo:hover {
    transition: .4s;
    color: #fff;
}

.mikropNecati {
    color: #ada2a2;
    border: 1px;
    position: relative;
    top: -7vh;
    cursor: pointer;
    left: 45.5vh;
    background-color: transparent;
    transition: .4s;
}

.mikropNecati:hover {
    transition: .4s;
    color: #fff;
}

#MotelAdminMenu h1 {
    color: #D3D3D3;
    text-align: left;
    font-family: Inter;
    position: relative;
    top: 2%;
    left: 3%;
    font-size: 32px;
    font-style: normal;
    margin: auto;
    font-weight: 600;
    line-height: normal;
}


#MotelAdminMenu p {
    color: #555353;
    text-align: left;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    position: relative;
    left: 3.3%;
    top: -0.1%;
    line-height: normal;
}

.MotelCizgi {
    width: 718px;
    height: 2px;
    flex-shrink: 0;
    position: relative;
    top: -1.3%;
    margin: auto;
    background: #242222;
}

.MotelTabloListe {
    width: 100%;
    height: 69vh;
    display: block;
    overflow: auto;
    background: transparent;
}

.MotelTabloListe2 {
    width: 100%;
    height: 82vh;
    display: none;
    border: 1px;
    background: transparent;
}

.Motel-Item {
    width: 720px;
    height: 165px;
    flex-shrink: 0;
    transition: .4s;
    cursor: pointer;
    margin: auto;
    position: relative;
    top: -1vh;
    margin-top: 1vh;
    border-radius: 12px;
    background: #0c0c0c;
}

.Motel-Item:hover {
    background-color: #BCBCBC;
    transition: .4s;
}

.Motel-Item:hover * {
    color: black;
    transition: .4s;
}

.Motel-Item h3 {
    color: #BCBCBC;
    text-align: left;
    font-family: Inter;
    font-size: 33px;
    position: relative;
    top: 9%;
    text-transform: uppercase;
    left: 3%;
    margin: auto;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.Motel-Item-Box {
    width: 44vh;
    height: 3vh;
    position: relative;
    left: 3%;
    top: 13%;
    margin-top: 0vh;
    background-color: transparent;
}

.Motel-Item-BoxPart {
    width: 30%;
    height: 100%;
    float: left;
    display: flex;
    background-color: transparent;
}

.Motel-Item-BoxPart h5 {
    color: #4D4D4D;
    text-align: left;
    font-family: Inter;
    font-size: 16px;
    padding-top: 5%;
    font-style: normal;
    margin: 0;
    font-weight: 600;
    line-height: normal;
}

.Motel-Item-BoxPart h6 {
    color: #FFF;
    text-align: left;
    font-family: Inter;
    font-size: 16px;
    margin: 0;
    position: relative;
    top: 12%;
    left: 13%;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.addMotel {
    position: absolute;
    top: 1vh;
    width: 63px;
    height: 59px;
    flex-shrink: 0;
    color: #FFF;
    text-align: center;
    font-family: Inter;
    transition: .4s;
    font-size: 23px;
    font-style: normal;
    font-weight: 600;
    border: 1px;
    line-height: normal;
    left: 74vh;
    cursor: pointer;
    border-radius: 12px;
    background: #0B0B0B;
}

.addMotel:hover {
    transition: .4s;
    background-color: #f0eded;
    color: #000;
}

.angut {
    width: 720px;
    height: 112px;
    position: relative;
    flex-shrink: 0;
    margin-top: 1vh;
    left: 2%;
    top: -1%;
    margin-left: 1vh;
    border-radius: 12px;
    float: left;
    background: #0B0B0B;
}

.angut h5 {
    color: #4E4E4E;
    text-align: left;
    margin: auto;
    font-family: Inter;
    position: relative;
    top: 2vh;
    left: 3vh;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.angut h6 {
    color: #FFF;
    text-align: center;
    font-family: Inter;
    font-size: 36px;
    float: left;
    margin: auto;
    position: relative;
    left: 2.7vh;
    top: 2.2vh;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.anpute {
    background-color: transparent;
    width: 49%;
    border: 1px;
    color: #FFF;
    text-align: left;
    position: relative;
    left: 2.5vh;
    top: 2.5vh;
    font-family: Inter;
    font-size: 36px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.SaveHersey {
    background-color: #119b80c9;
    width: 94%;
    height: 6vh;
    border: 1px;
    position: relative;
    border-radius: .4vh;
    color: #FFF;
    text-align: center;
    transition: .4s;
    cursor: pointer;
    top: 0.5%;
    font-family: Inter;
    margin-top: 1vh;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    left: 2.5vh;
}

.Cennet {
    width: 46.5%;
    height: 112px;
    flex-shrink: 0;
    float: left;
    position: relative;
    left: 2.5vh;
    margin-top: 0.5vh;
    border-radius: 12px;
    background: #0B0B0B;
}

.orospununfoto {
    width: 81px;
    height: 82px;
    left: 2vh;
    top: 1.3vh;
    flex-shrink: 0;
    border-radius: 309px;
    position: relative;
}

.Cennet h5 {
    color: #FFF;
    text-align: left;
    font-family: Inter;
    margin: auto;
    font-size: 26px;
    position: relative;
    text-transform: uppercase;
    left: 12vh;
    top: -5vh;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.Cennet h6 {
    color: #373434;
    text-align: left;
    font-family: Inter;
    font-size: 15px;
    font-style: normal;
    position: relative;
    margin: auto;
    top: -4.8vh;
    left: 12vh;
    font-weight: 600;
    line-height: normal;
}

.haksizlikButonChange {
    color: #21cdabc9;
    text-align: center;
    font-family: Inter;
    width: 39px;
    height: 24px;
    flex-shrink: 0;
    border-radius: 5px;
    position: relative;
    left: 29.3vh;
    top: -12vh;
    transition: .4s;
    border: 1px;
    background: transparent;
    cursor: pointer;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.haksizlikButonChange:hover {
    transition: .4s;
    text-shadow: 0px 0px 19px #21cdabc9;
}

.LeftX {
    background: transparent;
    width: 28vh;
    height: 8vh;
    top: 0vh;
    right: 1vh;
    bottom: 0;
    position: absolute;
    border-radius: .4vh;
}

.buto {
    float: right;
    width: 6vh;
    position: relative;
    top: 1vh;
    cursor: pointer;
    margin-right: 1vh;
    color: #e5dfdf;
    transition: .4s;
    height: 72%;
    border-radius: 1vh;
    background: #1d1d22;
    justify-content: center;
    align-items: center;
}

.delete {
    background: #c72c2c;
}

.buto h6 {
    margin: auto;
    text-align: center;
    font-size: 2vh;
    padding-top: 2vh;
}

.buto:hover {
    transition: .4s;
    background-color: #fff;
    color: black;
}

.addro {
    background: #119b80c9;
}

.roomuuur {
    background: transparent;
    width: 69vh;
    height: 23vh;
    position: relative;
    top: 2%;
    left: 0.5%;
    margin: auto;
    overflow-x: hidden;
    overflow-y: auto;
}

.room-item {
    width: 131px;
    height: 113px;
    flex-shrink: 0;
    cursor: pointer;
    float: left;
    margin-top: 1vh;
    margin-left: 1.3vh;
    top: -1vh;
    left: 0vh;
    position: relative;
    border-radius: 12px;
    transition: .4s;
    border: 1px solid #0B0B0B;
    background: #0e0e0e;
}

.room-item h5 {
    color: #FFF;
    text-align: center;
    margin: auto;
    font-family: Inter;
    margin-top: 22%;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.room-item:hover * {
    color: #000;
    transition: .4s;
}

.room-item:hover {
    background-color: #fff;
    transition: .4s;
}

.room-item h6 {
    color: #BB3E3E;
    text-align: center;
    font-family: Inter;
    text-transform: uppercase;
    font-size: 11px;
    font-style: normal;
    margin: auto;
    margin-top: 4%;
    font-weight: 600;
    line-height: normal;
}


.CreateMotelScreen {
    width: 34rem;
    height: 11rem;
    flex-shrink: 0;
    border-radius: 34px;
    display: none;
    background: #131517;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    left: 0;
    z-index: 9991;
}

.CreateMotelScreen h1 {
    color: #FFF;
    font-family: Inter;
    font-size: 26px;
    font-style: normal;
    position: relative;
    left: 3vh;
    margin: auto;
    top: 3vh;
    font-weight: 600;
    line-height: normal;
}

.CreateMotelScreen h2 {
    float: right;
    color: #fff;
    font-family: Inter;
    font-size: 20px;
    margin: auto;
    position: relative;
    padding-left: 0.7vh;
    padding-right: 0.7vh;
    padding-top: 0.4vh;
    border-radius: 1vh;
    padding-bottom: 0.4vh;
    right: 2vh;
    background: #29A854;
    top: -0.5vh;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.bayinput {
    width: 71%;
    height: 59px;
    flex-shrink: 0;
    border-radius: 12px;
    border: 1px;
    background: #0D0F10;
    color: #B1ABAB;
    float: left;
    font-family: Inter;
    font-size: 20px;
    margin-left: 3vh;
    margin-top: 5vh;
    padding-left: 3vh;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.onay {
    width: 62px;
    height: 59px;
    flex-shrink: 0;
    margin-left: 1vh;
    margin-top: 5vh;
    cursor: pointer;
    font-size: 2vh;
    border-radius: 12px;
    background: #29A854;
    border: 1px;
}

#overlayBey {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9990;
  }


#Left2 {
    display: none;
}

.ChoseOwnerScreen {
    width: 581px;
    height: 508px;
    flex-shrink: 0;
    border-radius: 27px;
    background: #161616;
    position:absolute;
    left: 0;
    display: none;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
}

.ChoseOwnerScreen h1 {
    color: #FFF;
    font-family: Inter;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    position: relative;
    left: 3vh;
    top: 2vh;
    margin: auto;
}

.ChoseOwnerScreen h2 {
    color: #454545;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    margin: auto;
    font-weight: 600;
    position: relative;
    left: 3.2vh;
    top: 1.9vh;
    line-height: normal;
}

.ayx {
    width: 90%;
    margin: auto;
    height: 2px;
    background: #333;
    flex-shrink: 0;
    position: relative;
    top: 2.4vh;
}

.searchPlayer {
    width: 87%;
    height: 3.5vh;
    border-radius: 13px;
    padding-left: 1.5vh;
    font-family: 'Inter';
    font-weight: 500;
    margin-top: 0.4vh;
    color: #ddd;
    background: #252525;
    top: 3vh;
    position: relative;
    border: 1px;
}


.Oyuncular {
    width: 92%;
    height: 39vh;
    background: transparent;
    top: 4vh;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
    margin: auto;
}

.Oyuncular-Item {
    width: 167px;
    height: 147px;
    align-items: center;
    justify-content: center;
    position: relative;
    margin: auto;
    transition: .4s;
    margin-left: 1vh;
    left: -0.2vh;
    cursor: pointer;
    top: -1vh;
    margin-top: 1vh;
    float: left;
    flex-shrink: 0;
    border-radius: 13px;
    background: #1F1F1F;
}

.Oyuncular-Item:hover * {
    color: #000;
    transition: .4s;
}

.Oyuncular-Item:hover {
    background: #fff;
    transition: .4s;
}

.Oyuncular-Item h4 {
    color: #DFDFDF;
    font-family: Inter;
    text-transform: uppercase;
    margin: auto;
    text-align: center;
    font-size: 16px;
    margin-top: 1vh;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.Oyuncular-Item h5 {
    color: #525050;
    font-family: Inter;
    font-size: 10px;
    text-transform: uppercase;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: auto;
    text-align: center;
}

.Res {
    width: 78px;
    height: 78px;
    flex-shrink: 0;
    margin-top: 0.5vh;
    border-radius: 55.5px;
}

.CreateRoomScreen {
    width: 703px;
    flex-shrink: 0;
    border-radius: 12px;
    background: #0E0F11;
    position: absolute;
    display: block;
    height: fit-content;
    padding-bottom: 15vh;
    margin: auto;
    display: none;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
}

.CreateRoomScreen h1 {
    color: #e5e5e5;
    font-family: Inter;
    font-size: 32px;
    margin: auto;
    font-style: normal;
    position: relative;
    top: 2vh;
    left: 4vh;
    font-weight: 600;
    line-height: normal;
}

.CreateRoomScreen h3 {
    color: #5F5F5F;
    font-family: Inter;
    font-size: 15px;
    margin: auto;
    font-style: normal;
    position: relative;
    left: 4.3vh;
    top: 2vh;
    font-weight: 600;
    line-height: normal;
}

.CreateRoomScreen h4 {
    color: #C3C3C3;
    font-family: Inter;
    font-size: 15px;
    margin: auto;
    font-style: normal;
    position: relative;
    left: 4.3vh;
    top: 4vh;
    font-weight: 600;
    line-height: normal;
}

.boxOption {
    width: 44%;
    height: 91px;
    flex-shrink: 0;
    border-radius: 15px;
    position: relative;
    transition: .4s;
    z-index: 7000;
    color: #fff;
    align-items: center;
    justify-content: center;
    top: 5vh;
    cursor: pointer;
    left: 3vh;
    float: left;
    background: #2B2B2B;
    margin-left: 1vh;
}

.boxOption:hover *{
    transition: .4s;
    color: black;
}

.boxSelected {
    background: #BABABA;
    color: #000;
}

.boxOption:hover {
    transition: .4s;
    background: #BABABA;
}

.boxOption h5 {
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    padding: 31px;
    text-align: center;
    margin: auto;
    font-weight: 600;
    line-height: normal;
}

.gaga {
    width: 88.5%;
    height: 2px;
    flex-shrink: 0;
    margin: auto;
    position: relative;
    top: 2.5vh;
    background: #333;
}

.onagore {
    background: transparent;
    width: 89%;
    margin: auto;
    position: relative;
    display: block;
    top: 17vh;
    height: fit-content;
}

.Beyefendi h6 {
    font-family: 'Inter';
    color: #727272;
    font-size: 1.6vh;
    margin: auto;
    position: relative;
    top: 0vh;
    left: 0.1vh;
}

.onagore h6 {
    font-family: 'Inter';
    color: #727272;
    width: 60vh;
    font-size: 1.6vh;
    position: relative;
    top: 0vh;
    margin: auto;
    left: 0.1vh;
}

.mlolist {
    background: transparent;
    display: flex;
    width: 100%;
    height: 34%;
    position: relative;
    overflow-x: auto;
    overflow-y: hidden;
    top: -12vh;
}

.resma {
    width: 239px;
    height: 142px;
    flex-shrink: 0;
    border-radius: 12px;
    justify-content: center;
    left: -1vh;
    position: relative;
    transition: .4s;
    cursor: pointer;
    align-items: center;
    margin-left: 1vh;
    border: 1px solid #101011;
    background: #101011;
}

.resma:hover {
    transition: .4s;
    border: 1px solid #838383;
}

.selectres {
    border: 1px solid #838383;
}

.resma img {
    width: 231px;
    height: 134px;
    position: relative;
    top: 0.3vh;
    border-radius: 12px;
    flex-shrink: 0;
}

.yazodaCoord {
    background: #272727;
    padding-left: 2vh;
    width: 49vh;
    height: 4.5vh;
    border-radius: 5px;
    color: #7E7E7E;
    float: left;
    border: 1px;
    margin-top: 1vh;
    font-family: Inter;
    position: relative;
    top: 0vh;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.jargon {
    width: 5vh;
    position: relative;
    height: 4.7vh;
    top: 0.8vh;
    left: 1vh;
    z-index: 6000;
    border-radius: 5px;
    transition: .4s;
    cursor: pointer;
    background-color: #0bbf6e;
    float: left;
}

.jargon:hover, .OlusturBiOda:hover {
    transition: .4s;
    box-shadow: 0px 0px 24px 0px #1DD794;
}

.jargon p {
    color: #000;
    font-size: 15px;
    text-align: center;
}

.yazpriceRoom {
    width: 55vh;
    height: 52px;
    flex-shrink: 0;
    position: relative;
    top: -8vh;
    padding-left: 2vh;
    color: #7E7E7E;
    border: 1px;
    font-family: Inter;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    left: 0.5vh;
    border-radius: 5px;
    background: #272727;
    
}

.OlusturBiOda {
    width: 99.5%;
    border: 1px;
    border-radius: 7px;
    height: 5vh;
    transition: .4s;
    background: #0bbf6e;
    font-family: 'Inter';
    cursor: pointer;
    font-size: 2vh;
    font-weight: 800;
    color: #000;
    position: relative;
    top: -4vh;
    left: 0vh;
}

#mlokisim {
    display: none;
}

#teleportkisim {
    display: block;
}


  
.ortadaki-yazi {
    position: absolute;
    top: 50%;
    left: 50%;
    transition: .4s;
    transform: translate(-50%, -50%);
    color: white;
    background-color: rgba(0, 0, 0, 0.7);
    opacity: 0;
    padding: 10px;
    width: 89%;
    height: 80%;
    border-radius: 12px;
}


  
.resma:hover .ortadaki-yazi {
    opacity: 1;
}

.resma img:hover {
    background-color: #00000028;
    
}

.ortadaki-yazi h1 {
    color: #fff;
    text-align: center;
    left: 0;
    top: 2.5vh;
    text-transform: uppercase;
    font-size: 2vh;
}

.resma::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: opacity 0.3s;
}

.ortadaki-yazi p {
    color: #a1a1a1;
    font-family: 'Inter';
    position: relative;
    text-align: center;
    width: 19vh;
    font-size: 1.3vh;
    top: 1.2vh;
}

.resma:hover::before {
    opacity: 1;
}
  
.backx {
    background-color: #9b9b9b;
    color: #000;
}

.memc {
    display: none;
    position:absolute;
    width: fit-content;
    height: 5vh;
    left: 0;
    right: 0;
    background-color: transparent;
    top: 74vh;
    bottom: 0;
    margin: auto;
}

.memc h1 {
    font-family: 'Inter';
    font-weight: 500;
    color: #fff;
}

.Yildizlar {
    background-color: transparent;
    width: 23vh;
    height: 4vh;
    margin: auto;
    align-items: center;
    text-align: center;
    left: 1.5vh;
    top: 2.3vh;
    position: relative;
}

.Yildizlar h5 {
    text-align: center;
    color: #adadad;
    font-size: 2vh;
    position: relative;
    float: left;
    cursor: pointer;
    transition: .4s;
    top: 1vh;
    margin: auto;
    margin-left: 1vh;
}

.Coupon {
    height: 4.5vh;
    left: 0px;
    display: none;
    position: relative;
    margin: auto;
    top: 2em;
    width: fit-content;
    padding-left: 2vh;
    padding-right: 2vh;
    right: 0px;
    background: rgb(26, 26, 26);
    border-radius: 2.53925rem;
    border-width: 1.27px;
    border-style: solid;
    border-color: rgba(255, 255, 255, 0.08);
    border-image: initial;
}

.Coupon h5 {
    text-align: center;
    font-family: 'SatoshiBold';
    font-weight: 300;
    margin: auto;
    text-transform: uppercase;
    position: relative;
    top: 1.4vh;
    font-size: 1.35vh;
    color: #ababab;
}

.indirimliOda {
    display: none;
    position: relative;
    bottom: 3vh;
    left: 2vh;
    background: transparent;
}

.indirimliOda h6 {
    text-transform: uppercase;
    margin: auto;
    margin-top: 3vh;
    font-size: 2vh;
    color: #5C5C5C;
    font-size: 1.5vh;
    font-family: 'SatoshiBold';
}

.feedBackList {
    position: relative;
    top: 16vh;
    width: 57%;
    overflow-x: hidden;
    overflow-y: auto;
    height: 64vh;
    background: transparent;
    margin: auto;
}

.feedback-item {
    width: 270px;
    height: 270px;
    flex-shrink: 0;
    float: left;
    margin-left: 1vh;
    margin-top: 1vh;
    border-radius: 14px;
    background: #0d0d0e;
}

.Haxor {
    background: transparent;
    width: 100%;
    height: 10vh;
    border-radius: 14px;
}

.Haxorimg {
    width: 68px;
    height: 68px;
    border-radius: 100%;
    border: 2px;
    position: relative;
    top: 2vh;
    left: 1.7vh;
}

.Haxor h4 {
    color: #fff;
    font-family: 'Inter';
    font-weight: 600;
    margin: auto;
    left: 9.5vh;
    bottom: 3.7vh;
    position: relative;
    text-transform: uppercase;
    text-align: left;
    font-size: 1.7vh;
}

.Haxor h5 {
    color: #979797;
    position: relative;
    left: 9.5vh;
    bottom: 3.5vh;
    text-transform: uppercase;
    font-family: 'Inter';
    margin: auto;
}

.yavrucak {
    background-color: red;
    width: 90%;
    height: 1px;
    border-radius: 100%;
}

.starTv {
    margin: auto;
    text-align: center;
    height: 2vh;
    align-items: center;
    position: relative;
    left: -0.5vh;
    justify-content: center;
    width: fit-content;
    background-color: transparent;
}

.starTv h5 {
    text-align: center;
    color: #adadad;
    font-size: 2vh;
    width: 18px;
    display: flex;
    position: relative;
    float: left;
    top: 1vh;
    margin: auto;
    margin-left: 1vh;
}

.feedback-item p {
    font-family: 'Satoshi';
    width: fit-content;
    height: 8vh;
    padding: 1vh;
    text-align: center;
    margin: auto;
    position: relative;
    top: 2vh;
    color: #a3a2a2;
}

.dateTarih {
    font-family: Satoshi;
    position: relative;
    color: #646464;
    left: 18.5vh;
    top: 0.5vh;
    margin: auto;
    font-size: 1vh;
}

.FeedBackOlustur {
    position: relative;
    left: 40.5vh;
    top: 15vh;
    border-radius: .7vh;
    width: 19vh;
    cursor: pointer;
    text-align: center;
    transition: .4s;
    color: #afafaf;
    align-items: center;
    display: block;
    justify-content: center;
    background: #0d0d0e;
    height: 4vh;
}

.FeedBackOlustur p {
    padding: 11px;
    font-family: SatoshiBold;
    font-size: 1.4vh;
}

.FeedBackOlustur:hover {
    transition: .4s;
    background-color: #c7c7c7;
    color: #000;
}

.CreateFeedBackContainer {
    width: 51%;
    height: 35vh;
    background: transparent;
    display: none;
    margin: auto;
}

.CreateFeedBackContainer h4 {
    color: #c1c1c1;
    font-family: SatoshiBold;
    text-transform: uppercase;
    font-size: 1.5vh;
    margin: auto;
    text-align: left;
}

.CreateFeedBackRoomList {
    position: relative;
    top: 0.5vh;
    width: 100%;
    height: 10vh;
    overflow-x: auto;
    overflow-y: hidden;
}

.CreateFeedBackRoomList-Item {
    background-color: #181818;
    width: 12vh;
    position:relative;
    left: -1vh;
    float: left;
    transition: .4s;
    border-radius: .8vh;
    color: #fff;
    margin-left: 1vh;
    cursor: pointer;
    height: 100%;
}

.CreateFeedBackRoomList-Item h5 {
    margin: auto;
    text-align: center;
    margin-top: 2vh;
    text-transform: uppercase;
    font-size: 1.5vh;
    font-family: 'Satoshi';
}

.CreateFeedBackRoomList-Item h6 {
    margin: auto;
    margin-top: 0.5vh;
    color: #818181;
    text-transform: uppercase;
    text-align: center;
    font-size: 1.2vh;
    font-family: 'Satoshi';
}

.CreateFeedBackRoomList-Item:hover {
    transition: .4s;
    background-color: #119b5b;
}

.CreateFeedBackRoomList-Item:hover * {
    transition: .4s;
    color: #fff;
}

.SelectRoom {
    background-color: #119b5b;
    color: #fff;
}

.YildizlarClub {
    float: left;
    margin-left: -1vh;
}

.YildizlarClub h5 {
    text-align: left;
    color: #adadad;
    font-size: 2vh;
    cursor: pointer;
    position: relative;
    transition: .4s;
    float: left;
    top: 1vh;
    margin: auto;
    margin-left: 1vh;
}

.YildizlarClub .fa-star {
    color: gray;
}
.YildizlarClub .fa-star.active {
    color: rgb(212, 164, 7);
}

.YildizlarClub h5:hover {
    transition: .4s;
    color: rgb(212, 164, 7);
}

.feedback-text {
    background: #202020;
    width: 97%;
    margin-top: 1vh;
    padding-left: 1.5vh;
    height: 5vh;
    border: 1px;
    border-radius: .5vh;
    font-family: Satoshi;
    color: #ddd;
    font-size: 1.5vh;
}

.CreateFaadback {
    border: 1px;
    width: 100%;
    height: 6vh;
    cursor: pointer;
    border-radius: .5vh;
    margin-top: 1vh;
    transition: .4s;
    color: #fff;
    background: #119b5b;
    font-family: SatoshiBold;
    font-size: 2vh;
}

.islemBux {
    background-color: #242424;
    width: 94%;
    height: 3.6vh;
    top: -1vh;
    left: 1vh;
    font-family: 'SatoshiBold';
    text-transform: uppercase;
    cursor: pointer;
    color: #b3b1b1;
    transition: .4s;
    position: relative;
    margin: auto;
    border: 1px;
    margin-top: 0.5vh;
    border-radius: .8vh;
}

.islemBux:hover {
    transition: .4s;
    background-color: #b3b1b1;
    color: #000;
}

.GunDay {
    width: 100%;
    top: -4vh;
    left: 2vh;
    display: none;
    background-color: transparent;
    height: 5.5vh;
    position:relative;
}

.GunDay h4 {
    font-family: 'SatoshiBold';
    color: #8b8080;
    margin-top: 5vh;
    text-transform: uppercase;
}

.degerValue {
    background: #2e2e2e;
    width: 5vh;
    height: 3.3vh;
    border: 1px;
    position: relative;
    font-family: 'Satoshi';
    color: #fff;
    top: -0.2vh;
    text-align: center;
    border-radius: .2vh;
}

.Arttir {
    background: #585555;
    border: 1px;
    width: 3.5vh;
    font-size: 2vh;
    color: #fff;
    border-radius: .2vh;
    cursor: pointer;
    height: 3.5vh;
}

.LifeTime {
    height: 3.5vh;
    position: relative;
    border-radius: .2vh;
    width: fit-content;
    color: #a7a5a5;
    text-transform: uppercase;
    padding-left: 1vh;
    cursor: pointer;
    background: transparent;
    margin-left: 0vh;
    padding-right: 1vh;
    transition: .4s;
    border: 1px solid #a7a5a5;
    top: -0.2vh;
    font-family: SatoshiBold;
}

.LifeTime:hover {
    transition: .4s;
    color: #000;
    background-color: #a7a5a5;
}

.LifeTimeSelected {
    color: #000;
    background-color: #a7a5a5;
}

.BayFont {
    font-size: 4vh;
}

.parx {
    background-color: transparent;
    width: 27vh;
    height: 10vh;
}

.RoomUzatPage2 {
    width: 35rem;
    height: 14rem;
    flex-shrink: 0;
    position: absolute;
    left: 0;
    right: 0;
    display: none;
    border-radius: 16px;
    background: #0E0E0E;
    top: 0;
    bottom: 0;
    z-index: 9997;
    margin: auto;
}

.RoomUzatPage2 h4 {
    color: #606060;
    font-family: SatoshiBold;
    font-size: 1rem;
    font-style: normal;
    position: relative;
    left: 3vh;
    font-weight: 600;
    text-transform: uppercase;
    line-height: normal;
    float: left;
}

.RoomUzatPage2 h2 {
    color: #C7C3C3;
    font-family: SatoshiBold;
    font-size: 35px;
    font-style: normal;
    position: relative;
    top: 4.5vh;
    text-transform: uppercase;
    left: -5.5vh;
    margin: auto;
    float: left;
    font-weight: 600;
    line-height: normal;
}

.RoomUzatPage {
    width: 35rem;
    height: 14rem;
    flex-shrink: 0;
    position: absolute;
    left: 0;
    right: 0;
    border-radius: 16px;
    background: #0E0E0E;
    display: none;
    top: 0;
    bottom: 0;
    z-index: 9997;
    margin: auto;
}

.RoomUzatPage h4 {
    color: #606060;
    font-family: SatoshiBold;
    font-size: 1rem;
    font-style: normal;
    position: relative;
    left: 3vh;
    font-weight: 600;
    line-height: normal;
    float: left;
}

.RoomUzatPage h2 {
    color: #C7C3C3;
    font-family: SatoshiBold;
    font-size: 35px;
    font-style: normal;
    position: relative;
    top: -2.5vh;
    left: 3vh;
    margin: auto;
    float: left;
    font-weight: 600;
    line-height: normal;
}

.ArtBax {
    width: 2rem;
    height: 2rem;
    flex-shrink: 0;
    border-radius: 5px;
    background: #525252;
    color: #A6A6A6;
    position: relative;
    top: 4.7vh;
    font-family: SatoshiBold;
    left: -6vh;
    cursor: pointer;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    border: 1px;
    line-height: normal;
}

.closemark {
    border: 1px;
    background: #3b3838;
    width: 3vh;
    position: relative;
    color: #adacac;
    cursor: pointer;
    height: 3vh;
    border-radius: 5px;
    right: 2vh;
    top: 2vh;
}

.leftOdeme {
    background-color: transparent;
    width: 23vh;
    height: 9vh;
    position: relative;
    bottom: 12vh;
    float: right;
}

.leftOdeme h3 {
    text-align: right;
    color: #5d5c5b;
    margin: auto;
    margin-right: 2vh;
    font-family: 'SatoshiBold';
}

.leftOdeme h6 {
    color: #c3c2c2;
    font-family: SatoshiBold;
    font-size: 35px;
    font-style: normal;
    font-weight: 600;
    text-align: right;
    margin: auto;
    margin-right: 2vh;
    line-height: normal;
}

.OdeV {
    background-color: #26c192;
    width: 13.4vh;
    color: #000;
    height: 3.7vh;
    font-family: SatoshiBold;
    border: 1px;
    text-transform: uppercase;
    position: relative;
    left: 21vh;
    bottom: 4.5vh;
    border-radius: .5vh;
}

.karat {
    background-color: #1c8062;
}

.parx h5 {
    font-family: 'Satoshi';
    text-align: left;
    margin: auto;
    padding: 11px;
    text-transform: uppercase;
    color: #8b8b8b;
    width: 10vh;
    position: absolute;
    left: 24vh;
    top: 4.3vh;
}

.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    top: 2.5vh;
    float: right;
    right: 1vh;
    height: 34px;
  }
  
  /* Hide default HTML checkbox */
  .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  /* The slider */
  .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  .slider:before {
    position: absolute;
    content: "";
    height: 26px;
    width: 26px;
    left: 4px;
    bottom: 4px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
  }
  
  input:checked + .slider {
    background-color: #119b5b;
  }
  
  input:focus + .slider {
    box-shadow: 0 0 1px #119b5b;
  }
  
  input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
  }
  
  /* Rounded sliders */
  .slider.round {
    border-radius: 34px;
  }
  
  .slider.round:before {
    border-radius: 50%;
  }

.NotifyBox {
    position: relative;
    left: 112vh;
    margin-left: 10vh;
    width: 5vh;
    height: 5vh;
    cursor: pointer;
    transition: .4s;
    top: 5.5vh;
    border: 1.27px solid rgba(255, 255, 255, 0.08);
    background: rgba(255, 255, 255, 0.02);
    backdrop-filter: blur(8.059002876281738px);
    border-radius: 100%;
    float: left;
}

.NotifyBox p {
    text-align: center;
    color: #fff;
    font-size: 1.7vh;
}

.NotifyBox:hover {
    transition: .4s;
    background-color: rgb(192, 192, 192);
}

.NotifyBox:hover * {
    transition: .4s;
    color: #000;
}

.NotificationBox {
    width: 327px;
    height: 396px;
    top: 18.5vh;
    display: none;
    border-radius: 12px;
    transition: opacity 0.3s ease;
    position:absolute;
    cursor: pointer;
    overflow-x: hidden;
    overflow-y: auto;
    left: 130vh;
    right: 10vh;
    background: #111;
    flex-shrink: 0;
}

.NotificationBox-List {
    width: 94%;
    margin: auto;
    background: transparent;
    margin-top: 1vh;
    height: 94%;
    border-radius: 12px;
}

.NotificationBox-Item {
    width: 307px;
    height: fit-content;
    padding-bottom: 3vh;
    margin-top: 1vh;
    flex-shrink: 0;
    border-radius: 10px;
    background: #171717;
}

.NotificationBox-Item h5 {
    color: #B7B7B7;
    font-family: Inter;
    margin: auto;
    font-size: 1.4vh;
    padding: 7px;
    text-transform: uppercase;
    padding-top: 11px;
    width: 89%;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.NotificationBox-Item h4 {
    color: #7B7B7B;
    font-family: Inter;
    padding: 8px;
    padding-left: 1.5vh;
    font-size: 1.2vh;
    width: 90%;
    margin: auto;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
}

.NotificationBox-Item h6 {
    color: #8b8b8b;
    font-family: 'Satoshi';
    float: right;
    position: relative;
    top: -1vh;
    right: 1vh;
    font-size: 0.9vh;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.s4 {
    margin: auto;
    width: 89%;
    height: 1px;
    flex-shrink: 0;
    background: #262525;
}


/* Yeni Notify */

    .NotifyPart {
    background: transparent;
    width: fit-content;
    padding-right: 2vh;
    position: absolute;
    right: 0;
    height: 95vh;
    float: right;
  }
  
  .NotifyRow {
    display: none;
  }
  
  .NotifyContainer {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 26vh;
    max-width: 100vh;
    margin-top: 1vh;
    height: fit-content;
    padding-right: 2.5vh;
    position: relative;
    padding-bottom: 0.7vh;
    background: #17181a;
    z-index: 8000;
    border-radius: 16px;
    top: 2vh;
  }
  
  .NotifyContent {
    flex: 1;
  }
  
  .NotifyContainer h3 {
    margin: auto;
    font-size: 4.2vh;
    margin-left: 2vh;
    font-size: 3.4vh;
    padding-top: 6%;
    float: left;
    color: #0dd571;
  }
  
  
  .NotifyContainer h4 {
    color: #C6C6C6;
    font-family: Roboto;
    font-size: 18px;
    font-style: normal;
    margin: auto;
    font-weight: 500;
    line-height: normal;
    position: relative;
    left: 2vh;
    top: 1.5vh;
  }
  
  .NotifyContainer p {
    color: #949494;
    font-family: Roboto;
    font-size: 14px;
    font-style: normal;
    padding-left: 6vh;
    top: 0.5vh;
    padding-right: 1vh;
    position: relative;
    font-weight: 500;
    left: 1.4vh;
    line-height: normal;
  }
  
@keyframes slide-in {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(0);
    }
}
  
select option {
    border:0;
}

.custom-select {
    position: relative;
    position: relative;
    top: 28vh;
    left: .5vh;
    height: 3vh;
    background: red;
    font-family: Arial;
  }
  
  .custom-select select {
    display: block; /*hide original SELECT element: */
  }
  
  .select-selected {
    background-color: DodgerBlue;
  }
  
  /* Style the arrow inside the select element: */
  .select-selected:after {
    position: absolute;
    content: "";
    top: 14px;
    right: 10px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-color: #fff transparent transparent transparent;
  }
  
  /* Point the arrow upwards when the select box is open (active): */
  .select-selected.select-arrow-active:after {
    border-color: transparent transparent #fff transparent;
    top: 7px;
  }
  
  /* style the items (options), including the selected item: */
  .select-items div,.select-selected {
    color: #ffffff;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
  }
  
  /* Style items (options): */
  .select-items {
    position: absolute;
    background-color: DodgerBlue;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
  }
  
  /* Hide the items when the select box is closed: */
  .select-hide {
    display: none;
  }
  
  .select-items div:hover, .same-as-selected {
    background-color: rgba(0, 0, 0, 0.1);
  }

.PlayerMotelRoomList  {
    width: 25rem;
    height: 32rem;
    position: relative;
    left: 2vh;
    top: 2vh;
    flex-shrink: 0;
    display: none;
    border-radius: 14px;
    background: #121212;
}

.PlayerMotelRoomList h1 {
    color: #C2C2C2;
    font-family: Inter;
    font-size: 27px;
    font-style: normal;
    position: relative;
    left: 3vh;
    top: 2vh;
    margin: auto;
    font-weight: 600;
    line-height: normal;
}

.PlayerMotelRoomList p {
    color: #727272;
    font-family: Inter;
    font-size: 15px;
    font-style: normal;
    margin: auto;
    top: 2vh;
    left: 3vh;
    position: relative;
    font-weight: 500;
    line-height: normal;
}

.belirlen {
    width: 85%;
    height: 2px;
    flex-shrink: 0;
    margin: auto;
    margin-top: 3vh;
    background: #272727;
}

.myodalar {
    background: transparent;
    width: 85%;
    height: 40vh;
    overflow-y: auto;
    overflow-x: hidden;
    margin: auto;
}

.roomb {
    width: 100%;
    height: 64px;
    flex-shrink: 0;
    border-radius: 7px;
    top: 0vh;
    position: relative;
    transition: .4s;
    cursor: pointer;
    margin-top: 1vh;
    background: #242424;
}

.roomb h3 {
    color: #A0A0A0;
    text-align: center;
    font-family: Manrope;
    font-size: 16px;
    text-transform: uppercase;
    padding-top: 1vh;
    font-style: normal;
    font-weight: 800;
    margin: auto;
    line-height: normal;
}

.roomb h5 {
    color: #616161;
    text-align: center;
    font-family: Manrope;
    font-size: 14px;
    font-style: normal;
    padding-top: .2vh;
    text-transform: uppercase;
    margin: auto;
    font-weight: 500;
    line-height: normal;
}

.roomb:hover, .roombv2:hover {
    transition: .4s;
    background: #bbbbbb;
}

.roomb:hover * {
    transition: .4s;
    color: black;
} 

.roombv2 {
    width: 62%;
    height: 100%;
    flex-shrink: 0;
    margin-left: 0vh;
    float: right;
    border-radius: 7px;
    top: -1vh;
    position: relative;
    transition: .4s;
    left: 0vh;
    cursor: pointer;
    margin-top: 1vh;
    background: #262626;
}

#playeranahtarlar {display: block;}
#player-secili-anahtar {display: none;}

.BoxOrder {
    width: 813px;
    height: 670px;
    position: relative;
    float: left;
    top: 1em;
    margin: auto;
    margin-left: 6vh;
    left: 5vh;
    flex-shrink: 0;
    border-radius: 6.252px;
    border: 1.042px solid #262626;
    background: linear-gradient(91deg, rgba(11, 11, 12, 0.40) 7.12%, rgba(11, 11, 12, 0.40) 93.17%);
}

.newRoomBox {
    width: 785px;
    height: 11rem;
    flex-shrink: 0;
    border-radius: 6.252px;
    border: 1px solid black;
    position: relative;
    top: -1vh;
    margin-top: 1vh;
}

.bayresim {
    width: 785px;
    height: 11rem;
    flex-shrink: 0;
    position: absolute;
    filter: blur(4px);
    border-radius: 6.252px;
}

.newRoomBoxHalit {
    background-color: red;
    width: 100%;
    height: 100%;
    border-radius: 6.252px;
}

.newRoomBox h4 {
    color: #FFF;
    font-family: Inter;
    font-size: 42px;
    margin: auto;
    text-transform: uppercase;
    position: relative;
    left: 3vh;
    top: 1.5vh;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.newRoomBox h5 {
    flex-direction: column;
    color: #adadad;
    font-family: Inter;
    font-size: 16px;
    position: relative;
    text-transform: uppercase;
    left: 3vh;
    top: 1vh;
    font-style: normal;
    margin: auto;
    margin-top: .7vh;
    font-weight: 600;
    flex-shrink: 0;
}

.DoNotOcluk {
    background-color: transparent;
    width: 12vh;
    height: 9vh;
    margin: auto;
    position: relative;
    bottom: 5.3vh;
    float: right;
}

.DoNotOcluk h6 {
    float: right;
    font-size: 1.4vh;
    color: #a7a7a7;
    font-weight: 500;
    position: relative;
    font-family: 'Inter';
    margin: auto;
    text-transform: uppercase;
    margin-right: 1vh;
    top: 1.4vh;
}

.ButonlarV {
    background-color: transparent;
    width: fit-content;
    position: absolute;
    margin: auto;
    right: -1.9vh;
    top: 1vh;
}

.Anax {
    background: #4a4a4a59;
    border: 1px;
    width: 3.5vh;
    cursor: pointer;
    border-radius: .5vh;
    position: relative;
    float: right;
    margin-right: .9vh;
    right: 1.7vh;
    transition: .4s;
    color: #fff;
    height: 3.5vh;
}

.Anax:hover {
    transition: .4s;
    background: #fff;
    color: black;
}

.RoomPlus {
    left: 84vh;
    top: 25.5vh;
    background: #181818;
    width: 13vh;
    position: absolute;
    height: 7vh;
    cursor: pointer;
    border-radius: .5vh;
    z-index: 60;
}

.Banmit {
    width: 93%;
    display: flex;
    background: #282828;
    height: 3vh;
    margin: auto;
    cursor: pointer;
    color: #bbbbbb;
    margin-top: 0.3vh;
    border-radius: .5vh;
}

.Banmit:hover {
    transition: .4s;
    background: #fff;
    color: #000;
}

.Banmit h5 {
    text-align: center;
    font-weight: 500;
    font-family: 'Inter';
    font-size: 1.1vh;
    margin: auto;
}

#RoomStashWeightBox {
    background-color: #101010;
    width: 47vh;
    height: 15vh;
    position: absolute;
    border-radius: 1vh;
    z-index: 9995;
    top: 0;
    bottom: 0;
    margin: auto;
    display: none;
    left: 0;
    right: 0;
}

#RoomStashWeightBox h1 {
    color: #d9d9d9;
    font-family: Inter;
    font-weight: 500;
    text-align: left;
    position: relative;
    top: 1.3vh;
    left: 2vh;
    margin: auto;
    font-size: 1.8vh;
    text-transform: uppercase;
}

#RoomStashWeightBox p {
    color: gray;
    font-family: Inter;
    font-weight: 600;
    position: relative;
    top: 1.5vh;
    left: 2vh;
    text-align: left;
    font-size: 1vh;
    text-transform: uppercase;
    margin: auto;
}

.UfakCizgi {
    background-color: #454545;
    width: 91.3%;
    height: 1.5px;
    position: relative;
    top: 2vh;
    border-radius: 1vh;
    margin: auto;
}

#RoomStashWeightBox h2 {
    color: #7e7e7e;
    font-family: Inter;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 1.5vh;
    position: relative;
    left: 2vh;
    top: 3vh;
    text-align: left;
    margin: auto;
}

#RoomStashWeightBox input {
    background-color: #333333;
    font-family: Inter;
    color: #b9b9b9;
    border: 1px;
    border-radius: .4vh;
    width: 25vh;
    height: 4vh;
    position: relative;
    top: 3.7vh;
    left: 2vh;
    font-size: 1.5vh;
    padding-left: 2vh;
}

#RoomStashWeightBox button {
    background-color: #39a563;
    width: 15vh;
    height: 4vh;
    left: 2.5vh;
    font-family: 'Inter';
    color: #fff;
    top: 3.5vh;
    text-transform: uppercase;
    cursor: pointer;
    font-weight: 400;
    position: relative;
    border-radius: .4vh;
    border: 1px;
}

#RoomStashWeightBox h3 {
    color: #b1b1b1;
    float: right;
    position: relative;
    margin: auto;
    cursor: pointer;
    bottom: 2vh;
    right: 2vh;
    transition: .4s;
    font-size: 2vh;
}

#RoomStashWeightBox h3:hover {
    transition: .4s;
    color: #fff;
}

#NewMotelScreen {
    width: 448px;
    height: 42.5rem;
    flex-shrink: 0;
    margin: auto;
    display: none;
    position: relative;
    top: 10vh;
    border-radius: 20px;
    background: #0E0F11;
}

#NewMotelScreen h1 {
    color: #C3C3C3;
    font-family: Inter;
    font-size: 24px;
    font-style: normal;
    margin: auto;
    position: relative;
    text-align: left;
    left: 4vh;
    top: 2vh;
    font-weight: 600;
    line-height: normal;
}

#NewMotelScreen h2 {
    color: #3F3F3F;
    font-family: Inter;
    font-size: 15px;
    margin: auto;
    position: relative;
    left: 4vh;
    top: 2vh;
    font-style: normal;
    text-align: left;
    font-weight: 600;
    line-height: normal;
}

.Hasbullah {
    background: #1E1E1E;
    width: 84%;
    margin: auto;
    height: 3px;
    position: relative;
    top: 3vh;
    flex-shrink: 0;
}

.OtelDiv {
    background: transparent;
    width: 84%;
    margin: auto;
    height: 7.2vh;
    position: relative;
    top: 4vh;
}

.OtelDiv h3 {
    color: #555;
    font-family: Inter;
    font-size: 15px;
    font-style: normal;
    font-weight: 600;
    text-align: left;
    line-height: normal;
}

.OtelDiv input {
    border: 1px;
    border-radius: 7px;
    width: 90%;
    padding-left: 1.7vh;
    height: 44px;
    font-family: 'Inter';
    color: #cdcdcd;
    flex-shrink: 0;
    background: #15161A;
}

.EnCokBeniSev {
    width: 47px;
    height: 44px;
    flex-shrink: 0;
    border: 1px;
    cursor: pointer;
    border-radius: 7px;
    background: #44c679;
}

.CreatHotel {
    border-radius: 9px;
    background: #44c679;
    color: #000;
    font-family: Inter;
    border: 1px;
    font-size: 15px;
    width: 83.5%;
    height: 57px;
    position: relative;
    left: 3.4vh;
    top: 7vh;
    cursor: pointer;
    flex-shrink: 0;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.Beyefendi {
    position: relative;
    height: 9vh;
    top: -10vh;
    margin-top:1vh;
    left: .5vh;
    background: transparent;
}

.AreYouRead {
    width: 23rem;
    height: 8rem;
    flex-shrink: 0;
    position: absolute;
    top: 1vh;
    right: -500px;
    border-radius: 1.5rem;
    background: #0C0D0E;
}

.Damla {
    width: 83px;
    height: 83px;
    flex-shrink: 0;
    border-radius: 44.5px;
    position: relative;
    left: 3vh;
    top: 2vh;
    border: 2px solid #2F2F2F;
    background: #0C0D0E;
}

.Damla img {
    width: 7vh;
    height: 7vh;
    position: relative;
    left: 4px;
    top: 4px;
    border-radius: 100%;
}

.AreYouRead h3 {
    color: #A0A0A0;
    font-family: Inter;
    font-size: 1.5vh;
    width: 20vh;
    position: relative;
    text-align: left;
    left: 6vh;
    bottom: 5.1vh;
    margin: auto;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
} 

.AreYouRead h4 {
    color: #d6d6d6;
    float: left;
    margin: auto;
    font-size: 1.3vh;
    position: relative;
    margin-left: 1vh;
    bottom: 4vh;
    text-transform: uppercase;
    left: 12.2vh;
    font-weight: 400;
    font-family: 'Inter';
}

.ChooseColorRoom {
    background-color: #1c1c1cd9;
    width: 114.7rem;
    height: 27vh;
    position: absolute;
    display: none;
    left: 0;
    padding: 20px;
    margin: auto;
    border-radius: 1vh;
    right: 0;
    bottom: 0;
    top: 0;
}

.ChooseColorRoom  h1 {
    color: #cdcdcd;
    font-family: Inter;
    margin: auto;
}

.ChooseColorRoom p {
    margin: auto;
    font-family: 'Inter';
    font-weight: 700;
    color: #777;
}

.Rog {
    background-color: transparent;
    width: 100%;
    margin: auto;
    float: left;
    height: 84%;
}

.SelectT { /** Damla <3 <3 */
    border-color: #fff !important;
}

.SelecTV {
    border-color: #fff !important;
}

.Rog-Item {
    background-color: transparent;
    width: 32.5vh;
    height: 20vh;
    transition: .4s;
    position: relative;
    left: -1vh;
    margin-left: 1vh;
    border-radius: 1vh;
    margin-top: 1vh;
    border: 1px solid;
    display: inline-block; /* İçeriğin genişliğini içerik boyutuna göre ayarlamak için */
}

.Rog-Item img {
    width: 100%;
    height: 100%;
    border-radius: 1vh;
    cursor: pointer;
}

.Rog-Item img:hover {
    transition: .4s;
    background-color:rgba(0, 0, 0, 0.4);
}

.hover-text {
    display: none;
    position: absolute;
    top: 50%;
    transition: .4s;
    left: 50%;
    font-family: 'Inter';
    text-transform: uppercase;
    font-weight: 700;
    transform: translate(-50%, -50%);
    background-color: rgba(0, 0, 0, 0.4);
    color: white;
    padding: 5px;
}

.Rog-Item:hover .hover-text {
    display: block;
    transition: .4s;
}

.AllMotelList {
    border: 0.733px solid #434343;
    background: rgb(0 0 0 / 32%);
    top: 0;
    width: 95%;
    position: relative;
    height: 29.5vh;
    border-radius: .5vh;
    margin: auto;
    margin-top: 1.5vh;
    overflow: auto;
}

.ListOfV {
    border: 0.733px solid #434343;
    background: rgb(0 0 0 / 32%);
    width: 94%;
    position: relative;
    height: 6vh;
    transition: .4s;
    color: #9f9f9f;
    margin: auto;
    margin-top: 1.5vh;
    border-radius: .5vh;
}

.ListOfV h2 {
    margin: auto;
    padding: 17px;
    text-transform: uppercase;
    font-family: 'Inter';
}

.ListOfV:hover {
    transition: .4s;
    color: black;
    background-color: #9f9f9f;
}

.ListOfVV {
    border: 0.733px solid #434343;
    background: rgb(0 0 0 / 32%);
    width: 29.5%;
    float: left;
    position: relative;
    height: 14vh;
    transition: .4s;
    color: #9f9f9f;
    margin-left: 1.5vh;
    margin-top: 1.5vh;
    border-radius: .5vh;
}

.ListOfVV img {
    width: 5vh;
    height: 5vh;
    border-radius: 0.5vh;
    position: relative;
    left: 1vh;
    top: 1vh;
}

.ListOfVV h6 {
    color: #d5d5d5;
    margin: auto;
    font-family: 'roboto';
    font-size: 1.3vh;
    text-align: left;
    font-weight: 500;
    bottom: 3vh;
    position: relative;
    left: 7vh;
}

.ListOfVV h2 {
    color: #8d8585;
    font-family: 'roboto';
    font-weight: 400;
    position: relative;
    left: 7vh;
    bottom: 2.7vh;
    text-align: left;
    margin: auto;
    font-size: 1.2vh;
}

.ListOfVV text {
    color: #fff;
    text-align: center;
    padding: 8px;
    width: fit-content;
    font-size: 1.2vh;
    font-family: 'roboto';
}

.BazIsıkYili {
    position: relative;
    left: 19vh;
    top: -9.5vh;
    color: #fff;
    border-radius: .2vh;
    background: rgb(21 54 39);
    border: 1px solid;
    border-color: rgb(48, 141, 98);
    cursor: pointer;
    font-size: 1.4vh;
    height: 3.5vh;
    font-family: 'Inter';
    width: 18vh;
}

.BazIsıkYili2 {
    position: relative;
    left: 18.5vh;
    background: #383838;
    border-color: #878787;
    top: -9.5vh;
    color: #fff;
    border-radius: .2vh;
    border: 1px solid;
    cursor: pointer;
    font-size: 1.4vh;
    height: 3.5vh;
    font-family: 'Inter';
    width: 18vh;
}

#corridorColors, #garageThemes {
    overflow: auto;
    height: 45vh;
}

.GarageContainer {
    width: 110vh;
    height: 46.5vh;
    position: absolute;
    top: 0;
    display: none;
    bottom: 0;
    left: 0;
    border-radius: 4px;
    border: 1px solid rgba(39, 39, 39, 0.04);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.20) 1.26%, rgba(89, 99, 104, 0.10) 77.03%, rgba(55, 52, 52, 0.12) 100%, rgba(121, 77, 77, 0.00) 100%), #090909;
    right: 0;
    margin: auto;
}

.GarageContainer h1 {
    color: #9C9C9C;
    font-family: Roboto Condensed;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    margin: auto;
    margin-left: 2vh;
    margin-top: 1.5vh;
    text-transform: uppercase;
    line-height: normal;
}

.Uwu {
    width: 96%;
    height: 3px;
    flex-shrink: 0;
    margin: auto;
    margin-top: .5vh;
    background: #1A1919;
}

.GarageList {
    width: 72.5rem;
    height: 419px;
    overflow-x: hidden;
    overflow-y: auto;
    margin: auto;
    flex-shrink: 0;
    background: transparent;
}

.GarageList-Item {
    width: 368px;
    height: 193px;
    flex-shrink: 0;
    background-color: #0E0E0E;
    cursor: pointer;
    float: left;
    border-radius: 3px;
    border: 2px solid;
    margin-left: 1vh;
    margin-top: 1vh;
    border-color: #303030;
}

.GarageList-Item:hover {
    transition: .4s;
    background-color: #b9b9b9;
    border-color: #b9b9b9;
}

.GarageList-Item:hover * {
    color: black;
    transition: .4s;
}

.GarageList-Item h3 {
    color: #a7a7a7;
    text-align: center;
    font-size: 7vh;
    padding: 41px;
    margin: auto;
}

.GarageList-Item h4 {
    color: #535353;
    font-family: Roboto Condensed;
    font-size: 21px;
    font-style: normal;
    font-weight: 500;
    text-align: center;
    margin: auto;
    position: relative;
    top: -2vh;
    line-height: normal;
}

.GarageList-Item img {
    width: 20vh;
    height: 9vh;
    margin-top: 4vh;
}

.ayirbu {
    width: 100%;
    height: 2px;
    flex-shrink: 0;
    margin: auto;
    position: relative;
    top: -1vh;
    background: #313131;
}

.GarageList h5 {
    color: #535353;
    font-family: Inter;
    text-align: left;
    font-size: 17px;
    margin: auto;
    font-style: normal;
    margin-top: -0.8vh;
    text-transform: uppercase;
    margin-left: 1vh;
    font-weight: 700;
    line-height: normal;
}

.NewEditMenu {
    width: 45rem;
    height: fit-content;
    padding-bottom: 2.3vh;
    display: none;
    flex-shrink: 0;
    border-radius: 19px;
    background: #0F0F0F;
    position: absolute;
    margin: auto;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
}

.NewEditMenu h1 {
    color: #B7B7B7;
    font-family: Inter;
    font-size: 36px;
    font-style: normal;
    position: relative;
    left: 3.5vh;
    top: 2vh;
    font-weight: 700;
    text-transform: uppercase;
    line-height: normal;
    margin: auto;
}

.NewEditMenu p {
    color: #595959;
    font-family: Inter;
    font-size: 16px;
    font-style: normal;
    position: relative;
    left: 3.8vh;
    margin-top: 1.5vh;
    font-weight: 600;
    line-height: normal;
}

.onuratmaca {
    width: 90%;
    height: 3px;
    margin: auto;
    margin-top: -1vh;
    flex-shrink: 0;
    background: #222;
}

.BoxUnpat {
    background-color: transparent;
    width: 43%;
    position: relative;
    float: left;
    margin-left: 3.7vh;
    top: 1vh;
    height: 10vh;
}

.BoxUnpat h3 {
    color: #454545;
    font-family: Inter;
    margin: auto;
    font-size: 16px;
    transition: .4s;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}

.ahput {
    width: 91%;
    height: 42px;
    border-radius: 2px;
    border: 1px solid;
    padding-left: 2vh;
    transition: .4s;
    position: relative;
    font-size: 1.5vh;
    text-transform: uppercase;
    top: .5vh;
    font-weight: 600;
    color: #c1c1c1;
    border-color: #3b3b3b;
    font-family: Inter;
    background: #0B0B0B;
    flex-shrink: 0;
}

.ahput:hover {
    transition: .4s;
    border-color: #197152;
}

.BoxUnpat h3:hover {
    transition: .4s;
    color: #197152;
}

.short {
    width: 74%;
}

.RecepFazilYarakKurek {
    background: #43c182;
    width: 4.5vh;
    height: 4.5vh;
    cursor: pointer;
    border-radius: .4vh;
    position: relative;
    top: .3vh;
    left: 0vh;
    float: right;
    border: 1px solid;
    border-color: #000000;
}

.ayarSwitch {
    background: transparent;
    width: 9vh;
    margin-top: -1.7vh;
    margin-left: -1.7vh;
}

.fullV {
    width: 91%;
}

.shortfull {
    width: 87.7%;
}

.BigBoy {
    width: 91%;
    height: 20vh;
    display: flex;
    flex-direction: row; /* Varsayılan olarak zaten yatay olarak sıralanır, bu satırı eklemeniz gerekli değil */
    float: left;
    position: relative;
    top: 1vh;
    background: transparent;
    overflow-x: auto;
}

.BigBoy-Part {
    width: 18vh;
    height: 15vh;
    border-radius: 1.4vh;
    border: 2px solid;
    border-color: transparent;
    margin-left: 1vh;
    position: relative;
    left: -1vh;
    background: transparent;
}

.BigSe {
    border-color: #7b7b7b;
}

.BigBoy-Part img {
    width: 18vh;
    height: 15vh;
    border-radius: 1.4vh;
    object-fit: cover;
    cursor: pointer;
}

.overlay22 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}
  
.overlay22 p {
    color: #a3a3a3;
    font-size: 19px;
    text-align: center;
    font-family: 'SatoshiBold';
    position: relative;
    left: 0vh;
    text-transform: uppercase;
    font-weight: bold;
}

.BigBoy-Part:hover .overlay22 {
    opacity: 1;
    pointer-events: auto; /* İmleç overlay üzerine geldiğinde overlay elementine izin verir */
}

.BabalaTv {
    background: #43c182;
    width: 16vh;
    height: 5vh;
    font-weight: 600;
    border: 1px;
    float: right;
    position: relative;
    right: 2vh;
    text-transform: uppercase;
    font-family: Inter;
    cursor: pointer;
    border-radius: .4vh;
}

.SelectBox {
    background: transparent;
    width: 91%;
    margin: auto;
    margin-top: 1vh;
    height: 10vh;
}

.Rektor {
    background: #1e1e1e;
    width: 49%;
    height: 10vh;
    COLOR: #cdcdcd;
    cursor: pointer;
    border-radius: .4vh;
    transition: .4s;
    float: left;
    margin-left: .5vh;
}

.Rektor h3 {
    text-align: center;
    margin: auto;
    font-weight: 600;
    padding: 42px;
    font-family: Inter;
}

.Rektor:hover {
    transition: .4s;
    color: black;
    background: #a1a1a1;
}

.RektorSec {
    background: #a1a1a1;
    color: black;
}

#Mematiler {display: none;}
#CorridorTheme {display: none;}
#GarageCoordK {display: none;}
#GarageTheme {display: none;}
#CreateBabalarSozunuTutar {display: none;}
#CreateRoomCC {display:none;}
#CreateRoomCCV {display: none;}

#ElevatorMenu {
    background: transparent;
    width: 14rem;
    height: fit-content;
    position: absolute;
    display: none;
    left: 105vh;
    top: 25vh;
}

.ElevatorHaxball {
    width: 262px;
    height: 60px;
    margin-top: .5vh;
    transition: .4s;
    flex-shrink: 0;
    border-radius: 4px;
    background: #141516;
    cursor: pointer;
}

.ElevatorHaxball h1 {
    color: #b9b9b9;
    font-family: Inter;
    font-size: 20px;
    font-style: normal;
    position: relative;
    text-transform: uppercase;
    left: 2vh;
    font-weight: 700;
    top: 1vh;
    line-height: normal;
    margin: auto;
}

.ElevatorHaxball h3 {
    color: #404040;
    font-family: Inter;
    font-size: 13px;
    font-style: normal;
    position: relative;
    margin: auto;
    left: 2vh;
    top: .9vh;
    text-transform: uppercase;
    font-weight: 700;
    line-height: normal;
}

.ElevatorHaxball:hover * {
    color: black;
    transition: .4s;
}

.ElevatorHaxball:hover {
    background: #cdcdcd;
    transition: .4s;
}