#header-content #search-players-container {
    width: 82.4074vh;
    height: 9.2593vh;

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

#search-players-container input {
    width: 52.5vh;
    height: 1.1111vh;

    border-radius: .7292vw;
    outline: 0;
    border: 0;

    padding-left: 1.7593vh;
    padding-top: 1.7593vh;
    padding-bottom: 1.7593vh;

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

    font-size: .8333vw;
    font-weight: 400;
    color: white;

    background-color: rgba(255, 255, 255, 0.05);
}

input:focus {
    outline: 0;
}

#search-players-container input::placeholder {
    font-size: .8333vw;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.30);
}

#right-page-container #player-categories-container {
    width: 100%;
    height: 3.2407vh;

    margin-top: 1.3889vh;

    display: flex;
}

#player-categories-container #player-categories {
    width: 63.2407vh;
    height: 3.2407vh;

    margin-left: 3.4259vh;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

#player-categories-container #registered-characters-count {
    width: 49.2593vh;
    height: 3.2407vh;
    
    display: flex;
    justify-content: right;
    align-items: center;

    font-size: .7813vw;
    font-family: "SF Pro Display";
    opacity: 0.40;
}

#player-categories #player-category {
    width: 6.2037vh;
    height: 3.2407vh;

    border-radius: .4688vw;

    background: rgba(0, 0, 0);

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

    font-family: "SF Pro Display";
    font-size: .7813vw;

    opacity: 0.20;
    transition: 0.1s;

    cursor: pointer;
}

#player-categories #player-category.active,
#player-categories #player-category:hover {
    transition: 0.1s;
    opacity: 1;
    background: linear-gradient(90deg, rgba(188, 148, 255, 0.51) 0%, rgba(154, 127, 211, 0.51) 100%);
    box-shadow: 0px 0px 3.5417vw 0px #876EB2;
}

#right-page-container #real-page-content {
    width: 100%;
    height: 55.3704vh;

    margin-top: 2.3148vh;

    display: flex;
    justify-content: center;
}

#real-page-content #real-page-container {
    width: 112.5vh;
    height: 100%;

    display: flex;
    justify-content: space-between;
}

#real-page-container #players-container {
    width: 86.5741vh;
    max-height: 100%;

    overflow-y: auto;

    display: flex;
    flex-wrap: wrap;
    gap: 0.9259vh;
}

::-webkit-scrollbar {
    display: none;
}

#player-container #online-status-box {
    width: 20.463vh;
    height: auto;

    display: flex;
    justify-content: right;
    
    position: absolute;

    margin-top: 1.1111vh;
}

#player-container #player-information-container {
    height: 4.6296vh;
    width: 100%;

    display: flex;

    margin-top: 1.3889vh;
}

#player-information-container #player-icon-border {
    width: 4.6296vh;
    height: 4.6296vh;

    border: .1042vw solid #CC39FF;
    border-radius: 50%;

    margin-left: 1.3889vh;

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

#player-icon-border #player-icon {
    background-position: center;
    background-size: cover;

    width: 3.8889vh;
    height: 3.8889vh;

    border-radius: 0%;
}

#player-information-container #player-text-information-box {
    margin-left: 1.3889vh;

    width: auto;
    height: 4.6296vh;

    display: flex;
    flex-direction: column;
    justify-content: center;
}

#player-text-information-box span.playerName {
    font-size: .625vw;
    font-weight: 600;
}

#player-text-information-box span.playerId {
    margin-top: 0.2778vh;
    opacity: 0.4;
    font-size: .625vw;
    font-weight: 600;
}

#player-container #player-credentials-container {
    width: 100%;
    height: auto;

    margin-top: 1.5741vh;
}

#player-credentials-container #player-credential {
    width: 90%;
    height: 1.1111vh;

    margin-left: 1.7593vh;
    margin-top: 1.8519vh;

    display: flex;
    align-items: center;
}

#player-credential span.credential {
    font-size: .625vw;
    font-weight: 600;

    margin-left: 1.3889vh;
}

#player-container #seperate-line-container {
    width: 100%;
    height: 0.0926vh;

    display: flex;
    justify-content: center;

    margin-top: 1.3889vh;
}

#player-container #inspect-content {
    width: 100%;
    margin-top: 0.9259vh;

    display: flex;
    justify-content: center;
    align-items: center;
    
    font-size: .625vw;
}

#seperate-line-container #seperate-line {
    width: 14.537vh;
    height: 0.0926vh;

    background-color: white;
    opacity: 0.07;
}

#deleted-characters-button #button-content {
    width: 14.6296vh;
    height: 14.6296vh;
}

#button-content span.button-title {
    font-size: 1.6667vw;
    opacity: 0.5;
    font-weight: 600;
}

#button-content #seperate-line {
    margin-top: 4.6296vh;

    width: 14.537vh;
    height: 0.0926vh;

    background-color: white;

    opacity: 0.41;
}

#button-content span.button-desc {
    font-size: .625vw;
    font-weight: 600;

    opacity: 0.5;
}

/* Player Info CSS */

#right-page-container #info-content-container {
    width: 100%;
    height: 60.8333vh;

    margin-top: 3.7037vh;

    display: flex;
    justify-content: space-evenly;
}

#info-content-container #info-player-info-container {
    width: 76.3889vh;
    height: 60.8333vh;

    background: rgba(0, 0, 0, 0.2);

    border-radius: 1.6146vw .4688vw .4688vw .4688vw;

    display: flex;
}

#info-player-info-container #info-page-content {
    width: 70.3704vh;
    height: 60.8333vh;

    display: flex;
    justify-content: center;
}

#info-page-content #ipage-container {
    width: 65.5556vh;
    height: 60.8333vh;
}

#ipage-container #ipage-player-info-container {
    width: 100%;
    height: 6.1111vh;

    display: flex;
    flex-direction: row;
    align-items: center;
}

#ipage-player-info-container #ipage-player-name-and-status {
    width: 50%;
    height: 3.5185vh;

    display: flex;
    flex-direction: column;
    justify-content: space-around;
}

#ipage-player-info-container #ipage-player-vip-action-container {
    width: 50%;
    height: 3.5185vh;

    display: flex;
    justify-content: right;
}

#ipage-player-vip-action-container #ipage-player-vip-action {
    background: rgba(0, 0, 0, 0.2);
    width: 10.5556vh;
    height: 3.5185vh;

    border-radius: .3646vw;

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

    transition: 0.3s;
}

#ipage-player-vip-action-container #ipage-player-vip-action:hover {
    background: rgba(0, 0, 0, 0.5);
    transition: 0.3s;
}

#ipage-player-vip-action span {
    font-size: .625vw;
    margin-left: 1.1111vh;
    font-weight: 600;
}

#ipage-player-vip-action #ipage-player-vip-icon {
    width: 1.6667vh;
    height: 1.2963vh;

    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#ipage-player-vip-action.take #ipage-player-vip-icon {
    background-image: url(img/OrangeVIP.png);
}

#ipage-player-vip-action.give #ipage-player-vip-icon {
    background-image: url(img/VIPBadge.png);
}

#ipage-player-vip-action.take span {
    color: #FF6230;
}

#ipage-player-vip-action.give span {
    color: #FFDE30;
}

#ipage-player-name-and-status span.playerName {
    font-size: .625vw;

    font-weight: 600;
}

#ipage-player-name-and-status span.onlineStatus {
    font-size: .625vw;

    font-weight: 600;
}

#ipage-container #ipage-seperator {
    width: 100%;
    height: 0.0926vh;

    background-color: rgba(255, 255, 255, 0.07);
}

#ipage-container #ipage-info-page-container {
    width: 100%;
    height: 54.7222vh;

    display: flex;
    flex-direction: column;
}

#ipage-info-page-container span.title {
    width: 100%;
    font-size: 1.0417vw;

    margin-top: 2.3148vh;
    margin-bottom: 2.3148vh;
}

#ipage-info-page-container #ipage-all-boxes {
    width: 100%;
    height: 45.0926vh;

    display: flex;
    justify-content: space-between;
}

#ipage-all-boxes #ipage-left-boxes {
    width: 28.1481vh;
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#ipage-left-boxes #ipage-left-up-box {
    width: 28.1481vh;
    height: 26.4815vh;

    border-radius: .5208vw;

    background-image: url(img/IDLicencesBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
}

#ipage-left-up-box #ipage-left-up-box-container {
    width: 23.5185vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#ipage-left-up-box-container span.boxTitle {
    font-size: 1.0417vw;
    font-weight: 500;

    margin-top: 0.9259vh;
}

#ipage-left-up-box-container #ipage-input-box {
    height: 4.3519vh;
    width: 100%;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    margin-top: 0.9259vh;
}

#ipage-left-up-box-container #ipage-input-box span.inputTitle {
    font-size: .5208vw;
    font-weight: 500;

    color: rgba(255, 255, 255, 0.6);
}

#ipage-left-up-box-container #ipage-input-box input {
    padding: 0.8333vh;
    padding-left: 3.1481vh;
    padding-right: 3.1481vh;

    border-radius: .3646vw;

    height: 1.1111vh;
    border: 0;

    margin-top: 0.9259vh;

    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    background-color: transparent;

    font-size: .625vw;
    color: white;
    font-weight: 600;

    cursor: url(../../../img/cursor.png), auto;
}

#ipage-left-up-box-container #ipage-input-box input.accountId {
    background-image: url(img/AccountIdInputBg.png);
}

#ipage-left-up-box-container #ipage-input-box input.discordId {
    background-image: url(img/DiscordIdInputBg.png);
}

#ipage-left-up-box-container #ipage-input-box input.steamId {
    background-image: url(img/SteamIdInputBg.png);
}

#ipage-left-up-box-container #ipage-input-box input.rockstar {
    background-image: url(img/RockstarLicenseInputBg.png);
}

#ipage-left-down-box-container #ipage-input-box {
    height: 4.3519vh;
    width: 100%;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    margin-top: 0.9259vh;
}

#ipage-left-down-box-container #ipage-input-box span.inputTitle {
    font-size: .5208vw;
    font-weight: 500;

    color: rgba(255, 255, 255, 0.6);
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container {
    width: 100%;
    height: 2.7778vh;
    
    display: flex;
    justify-content: space-between;
    margin-top: 0.9259vh;
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container input {
    padding: 0.8333vh;
    padding-left: 3.1481vh;

    width: 16.4vh;
    height: 1.1111vh;

    border: 0;
    border-radius: .3646vw;

    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    background-color: transparent;

    font-size: .625vw;
    color: white;
    font-weight: 600;

    cursor: url(../../../img/cursor.png), auto;

    transition: 0.2s;
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container.editing input {
    background-color: rgba(204, 57, 255, 0.20);
    color: rgba(255, 255, 255, 0.50);

    transition: 0.2s;
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container.editing #ipage-edit-button {
    background-color: rgba(204, 57, 255, 0.20);

    transition: 0.2s;
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container.editing #ipage-edit-button #ipage-edit-icon {
    width: 1.1111vh;
    height: 1.1111vh;

    background-image: url(img/TikIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    transition: 0.2s;
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container input.job {
    background-image: url(img/JobInputBg.png);
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container input.faction {
    background-image: url(img/FactionInputBg.png);
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container #ipage-edit-button {
    width: 2.7778vh;
    height: 2.7778vh;

    border-radius: .3646vw;
    background-color: rgba(0, 0, 0, 0.2);
    
    display: flex;
    justify-content: center;
    align-items: center;

    transition: 0.2s;
}

#ipage-left-down-box-container #ipage-input-box #ipage-input-container #ipage-edit-button #ipage-edit-icon {
    width: 1.3889vh;
    height: 1.3889vh;

    background-image: url(img/EditButtonIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    transition: 0.2s;
}

#ipage-left-boxes #ipage-left-down-box {
    width: 28.1481vh;
    height: 16.7593vh;

    border-radius: .5208vw;

    background-image: url(img/JobFactionBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
}

#ipage-left-down-box #ipage-left-down-box-container {
    width: 23.5185vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#ipage-left-down-box-container span.boxTitle {
    font-size: 1.0417vw;
    font-weight: 500;

    margin-top: 0.9259vh;
}

#ipage-all-boxes #ipage-right-box {
    width: 35.5556vh;
    height: 100%;

    border-radius: .5208vw;

    background-image: url(img/CharacterInfoBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;

    transition: 0.2s;
}

#ipage-right-box #ipage-right-box-container {
    width: 30.9259vh;
    height: 100%;
}

#ipage-right-box-container #ipage-right-title-container {
    width: 100%;
    height: auto;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

#ipage-right-box-container #ipage-input-box {
    height: 4.3519vh;
    width: 100%;

    display: flex;
    flex-direction: column;
    justify-content: space-between;

    margin-top: 0.9259vh;

    margin-top: 1.2963vh;
}

#ipage-right-box-container #ipage-input-box span.inputTitle {
    font-size: .5208vw;
    font-weight: 500;

    color: rgba(255, 255, 255, 0.6);
}

#ipage-right-box-container #ipage-input-box #ipage-input-container {
    width: 100%;
    height: 2.7778vh;
    
    display: flex;
    justify-content: space-between;
    margin-top: 0.9259vh;
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input {
    padding: 0.8333vh;
    padding-left: 3.1481vh;

    width: 23.7963vh;
    height: 1.1111vh;

    border: 0;
    border-radius: .3646vw;

    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    background-color: transparent;

    font-size: .625vw;
    color: white;
    font-weight: 600;

    cursor: url(../../../img/cursor.png), auto;

    transition: 0.2s;
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input.characterId {
    background-image: url(img/CharacterIdInputBg.png);
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input.characterName {
    background-image: url(img/CharacterNameInputBg.png);
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input.genderInput {
    background-image: url(img/GenderInputBg.png);
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input.birthdayInput {
    background-image: url(img/BirthdayInputBg.png);
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input.nationalityInput {
    background-image: url(img/NationalityInputBg.png);
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input.phoneInput {
    background-image: url(img/PhoneInputBg.png);
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input.playTimeInput {
    background-image: url(img/PlayTimeInputBg.png);
    width: 36%;
}

#ipage-right-box-container #ipage-input-box #ipage-input-container input.creationDateInput {
    background-image: url(img/CreationDateInputBg.png);
    width: 36%;
}

#ipage-right-box-container #ipage-input-box #ipage-input-container #ipage-edit-button {
    width: 2.7778vh;
    height: 2.7778vh;

    border-radius: .3646vw;
    background-color: rgba(0, 0, 0, 0.2);
    
    display: flex;
    justify-content: center;
    align-items: center;

    transition: 0.2s;
}

#ipage-right-box-container #ipage-input-box #ipage-input-container #ipage-edit-button #ipage-edit-icon {
    width: 1.3889vh;
    height: 1.3889vh;

    background-image: url(img/EditButtonIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    transition: 0.2s;
}

#ipage-right-box-container #ipage-input-box #ipage-input-container.editing input {
    background-color: rgba(204, 57, 255, 0.20);
    color: rgba(255, 255, 255, 0.50);

    transition: 0.2s;
}

#ipage-right-box-container #ipage-input-box #ipage-input-container.editing #ipage-edit-button {
    background-color: rgba(204, 57, 255, 0.20);
}

#ipage-right-box-container #ipage-input-box #ipage-input-container.editing #ipage-edit-button #ipage-edit-icon {
    width: 1.1111vh;
    height: 1.1111vh;

    background-image: url(img/TikIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#info-player-info-container #player-info-left-navi {
    height: 100%;
    width: 6.0185vh;
    border-radius: 1.6146vw 0 0 .4688vw;

    background-image: url(img/playerInfoLeftNaviBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    overflow: hidden;

    display: flex;
    flex-direction: column;
    align-items: center;

    transition: 0.3s;
}

#player-info-left-navi span.playerId {
    margin-top: 0.9259vh;
    opacity: .4;
    font-size: .625vw;
    width: 100%;
    
    text-align: center;
}

#player-info-left-navi #vip-badge-icon {
    width: 1.6667vh;
    height: 1.2963vh;

    margin-top: 0.8333vh;

    background-image: url(img/VIPBadge.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#player-info-left-navi #info-left-navi-items {
    height: 36.7593vh;
    width: 5.2778vh;

    display: flex;
    flex-direction: column;

    margin-top: 4.8148vh;
    margin-left: 0.463vh;

    justify-content: space-between;
}

#info-left-navi-items #info-left-navi-item {
    width: 100%;
    height: 3.4259vh;

    display: flex;
    flex-direction: row;
    align-items: center;
}

#info-left-navi-item #info-navi-selector-container {
    width: 0.9259vh;
    height: 100%;

    display: flex;
    align-items: center;
}

#info-navi-selector-container #info-navi-selector {
    width: 0.6944vh;
    height: 2.7778vh;

    background-image: url(img/PlayerInfoLeftNaviSelection.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#info-left-navi-item #info-navi-item-border {
    width: 3.2407vh;
    height: 3.2407vh;

    border-radius: 50%;

    border: .1042vw solid black;
    opacity: 0.2;

    box-shadow: 0 0 .2083vw black;

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

    transition: 0.3s;
}

#info-navi-item-border #info-navi-item-bg {
    width: 2.8704vh;
    height: 2.8704vh;

    background-color: black;
    border-radius: 50%;

    box-shadow: 0px 0px 2.0313vw black;

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

#info-navi-item-bg #info-navi-item-icon {
    width: 1.3889vh;
    height: 1.7593vh;

    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#info-left-navi-item #info-navi-item-border.active,
#info-left-navi-item #info-navi-item-border:hover {
    opacity: 1;
    border: .1042vw solid #7239FF;

    transition: 0.3s;
}

#info-left-navi-item #info-navi-item-border.active #info-navi-item-bg,
#info-left-navi-item #info-navi-item-border:hover #info-navi-item-bg {
    background-color: #CC39FF;
    box-shadow: 0px 0px 2.0313vw #CC39FF;

    transition: 0.3s;
}

#player-info-left-navi #player-info-icon-border {
    width: 5.5556vh;
    height: 5.5556vh;

    margin-top: 0.1852vh;

    border: .1042vw solid #FFDE30;

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

    box-shadow: 0px 0px 1.5208vw -10px #FFDE30;

    border-radius: 50%;
}

#player-info-icon-border #player-info-icon {
    width: 5.0926vh;
    height: 5.0926vh;

    background-image: url(img/DefaultIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    border-radius: 50%;
}

#player-info-left-navi #info-back-button {
    width: 100%;
    height: 1.3796vh;

    margin-top: 5.7407vh;

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

#info-back-button #info-back-button-icon {
    width: 0.7963vh;
    height: 1.3796vh;

    background-image: url(img/BackButton.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#ipage-all-boxes #hearth-left-box {
    width: 28.1481vh;
    height: 100%;

    border-radius: .5208vw;
    
    background-image: url(img/HearthStatusOnlineBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
}

#hearth-left-box #hearth-left-box-container {
    width: 23.5185vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#hearth-left-box-container #hearth-offline-message-box {
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#hearth-left-box-container span.boxTitle {
    font-size: 1.0417vw;
    font-weight: 500;

    margin-top: 0.9259vh;
}

#hearth-left-box-container #hearth-credentials {
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

#hearth-credentials #hearth-credential-box {
    width: 100%;
    height: 4.3519vh;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#hearth-credential-box span.hCredentialTitle {
    font-size: .5208vw;
    opacity: 0.6;
}

#hearth-credential-box #hearth-credential-ibuttons {
    width: 100%;
    height: 2.7778vh;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

#hearth-credential-ibuttons input {
    padding-left: 3.1481vh;

    width: 7.963vh;
    height: 2.7778vh;
    border-radius: .3646vw;
    border: 0;

    color: white;
    font-size: .625vw;
    font-family: 'SF Pro Rounded';

    background-color: rgba(255, 72, 72, 0.20);
    background-repeat: no-repeat;
    background-size:100% 100%;
}

#hearth-credential-ibuttons #hearth-credential-action-button {
    width: 5.463vh;
    height: 2.7778vh;

    border-radius: .3646vw;

    font-size: .625vw;
    font-weight: 600;

    background-color: rgba(255, 72, 72, 0.20);
    display: flex;
    justify-content: center;
    align-items: center;
}

#ipage-all-boxes #hearth-right-box {
    width: 35.5556vh;
    height: 100%;

    border-radius: .5208vw;

    background-image: url(img/HearthLogsBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
}

#hearth-right-box #hearth-right-box-container {
    width: 30.9259vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#hearth-right-box-container span.boxTitle {
    font-size: 1.0417vw;
    font-weight: 500;

    margin-top: 0.9259vh;
}

#hearth-right-box-container input {
    width: 27.6852vh;
    height: 2.963vh;

    margin-top: 1.8519vh;

    padding-left: 1.1111vh;
    padding-right: 2.1296vh;

    background-image: url(img/StatusLogSearchBarBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;

    font-size: .5208vw;
    font-weight: 400;
    color: white;
    font-family: 'SF Pro Display Thin';

    border: 0;
    border-radius: .3646vw;
}

#hearth-right-box-container input::placeholder {
    color: rgba(255, 255, 255, 0.30);
    font-size: .5208vw;
    font-weight: 400;
}

#hearth-right-box-container #hearth-logs-container {
    width: 100%;
    height: 33.7037vh;
    margin-top: 1.8519vh;

    display: flex;
    flex-direction: column;

    overflow-y: auto;
}

#hearth-logs-container span.logSpan {
    font-size: .5208vw;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.60);

    margin-bottom: 0.463vh;
    margin-left: 0.9259vh;
}

#ipage-all-boxes #money-left-box {
    width: 28.1481vh;
    height: 100%;

    border-radius: .5208vw;
    
    background-image: url(img/MoneyMoneysBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
}

#money-left-box #money-left-box-container {
    width: 23.5185vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#money-left-box-container span.boxTitle {
    font-size: 1.0417vw;
    font-weight: 500;

    margin-top: 0.9259vh;
}

#money-left-box-container #money-inputs-container {
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
}

#money-inputs-container #money-inputs-each {
    width: 100%;
    height: 4.3519vh;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#money-inputs-each span.inputTitle {
    opacity: 0.6;
    font-size: .5208vw;
    font-family: 'SF Pro Rounded';
    font-weight: 500;
}

#money-inputs-each #money-input {
    width: 100%;
    height: 2.7778vh;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

#money-input input {
    padding-left: 3.1481vh;
    width: 16.6667vh;
    height: 100%;

    border-radius: .3646vw;
    border: 0;

    color: white;
    font-family: 'SF Pro Rounded';
    font-weight: 600;
    font-size: .625vw;

    background-image: url(img/MoneyCashInputBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;

    transition: 0.2s;
}

#money-input #money-edit-button {
    width: 2.7778vh;
    height: 2.7778vh;

    border-radius: .3646vw;
    background-color: rgba(180, 255, 144, 0.20);
    
    display: flex;
    justify-content: center;
    align-items: center;
}

#money-input #money-edit-button #money-edit-button-icon {
    width: 1.3889vh;
    height: 1.3889vh;

    background-image: url(img/EditButtonIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    transition: 0.1s;
}

#money-input #money-edit-button #money-edit-button-icon.editing {
    width: 1.1111vh;
    height: 1.1111vh;

    background-image: url(img/TikIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    transition: 0.1s;
}

#ipage-info-page-container #car-page-content {
    width: 65.5556vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#car-page-content #car-page-title-box {
    width: 100%;
    height: 5.9259vh;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

#car-page-title-box span.contentTitle {
    font-size: 1.0417vw;
    font-weight: 500;
    color: white;
    font-family: 'SF Pro Rounded';
}

#car-page-title-box #car-page-title-button {
    width: 10.5556vh;
    height: 3.5185vh;

    background-color: rgba(0, 0, 0, 0.2);
    border-radius: .3646vw;

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

    color: white;
    font-size: 1.1111vh;
    font-weight: 600;
    font-family: 'SF Pro Rounded';

    transition: 0.2s;
}

#car-page-title-box #car-page-title-button.goback {
    background-image: url(img/CarGoBackButtonBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-color: rgba(0, 0, 0, 0.2);

    justify-content: right;
}

#car-page-title-box #car-page-title-button:hover {
    background-color: rgba(0, 0, 0, 0.4);
    transition: 0.2s;
}

#car-page-content #car-cars-container {
    width: 100%;
    height: 100%;

    overflow-y: auto;

    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 2.037vh;
}

#car-cars-container #car-box {
    width: 20.463vh;
    height: 24.537vh;
    border-radius: .4688vw;

    background-image: url(img/CarBoxBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

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

    transition: 0.2s;
}

#car-cars-container #car-box.newCar {
    background-image: url(img/CarBoxHoverBg.png);
}

#car-cars-container #car-box:hover {
    background-image: url(img/CarBoxHoverBg.png);
    transition: 0.2s;
}

#car-box #car-box-content {
    width: 17.6852vh;
    height: 21.7593vh;
    display: flex;
    flex-direction: column;
}

#car-box-content #car-basic-infos {
    width: 100%;
    height: 4.6296vh;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#car-box-content #car-basic-infos.newCar {
    width: 100%;
    height: 4.6296vh;

    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

#car-basic-infos span.brandName {
    font-size: 1.1111vh;
    font-weight: 600;
    font-family: 'SF Pro Rounded';
}

#car-basic-infos span.modelName {
    font-size: 1.1111vh;
    font-weight: 600;
    opacity: 0.4;
}

#car-basic-infos span.vehicleStatus {
    font-size: .4167vw;
    font-weight: 600;
    opacity: 0.6;

    color: rgba(139, 255, 48);
}

#car-basic-infos span.vehicleStatus.inGarage {
    color: rgba(255, 48, 48);
}

#car-box-content #car-details-container {
    width: 100%;
    height: 14.8148vh;

    display: flex;
    flex-direction: column;
    justify-content: space-around;
    margin-top: 0.463vh;
}

#car-details-container #car-detail {
    width: 100%;
    height: auto;

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

#car-detail #car-detail-icon {
    width: .8333vw;
    height: .625vw;

    background-image: url(img/CarPlateIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#car-detail span.carDetail {
    font-size: .625vw;
    font-weight: 600;
    font-family: 'SF Pro Rounded';
    color: white;

    margin-left: 1.3889vh;
}

#car-box-content #car-seperate-line-box {
    width: 100%;
    height: 0.0926vh;

    display: flex;
    justify-content: center;
    margin-top: 0.463vh;
}

#car-seperate-line-box #car-seperate-line {
    width: 14.537vh;
    height: 0.0926vh;

    background-color: white;
    opacity: 0.07;
}

#car-box-content #car-details-container.newCar {
    justify-content: start;
    align-items: center;
    height: 12.5926vh;
}

#car-details-container input {
    width: 15.463vh;
    height: 2.7778vh;

    border: 0;
    border-radius: .3646vw;

    text-align: center;
    color: white;
    font-size: .625vw;
    font-family: 'SF Pro Rounded';
    font-weight: 600;

    background-image: url(img/CarVehicleHashInputBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    background-color: transparent;

    margin-bottom: 0.9259vh;
}

#car-details-container input::placeholder {
    color: white;
    opacity: 0.4;
}

#car-page-content #cinfo-all-boxes {
    display: flex;
    flex-direction: row;
    justify-content: space-between;

    width: 100%;
    height: 45.0926vh;
}

#cinfo-all-boxes #cinfo-box {
    height: 100%;

    border-radius: .5208vw;
    
    background-color: rgba(0,0,0,0.2);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
}

#cinfo-all-boxes #cinfo-box.left {
    width: 28.1481vh;
    background-image: url(img/CInfoVehicleInfoBg.png);
}

#cinfo-all-boxes #cinfo-box.right {
    width: 35.5556vh;
    background-image: url(img/CInfoActionsBg.png);
}

#cinfo-box.left #cinfo-box-container {
    width: 23.5185vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#cinfo-box.right #cinfo-box-container {
    width: 30.9259vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#cinfo-box-container span.boxTitle {
    font-size: 1.0417vw;
    font-weight: 500;

    margin-top: 0.9259vh;
}

#cinfo-box-container #cinfo-inputs-container {
    width: 100%;
    height: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;
}

#cinfo-inputs-container #cinfo-input {
    width: 100%;
    height: auto;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#cinfo-input span.inputTitle {
    font-size: .5208vw;
    font-weight: 500;
    opacity: 0.6;
    margin-bottom: 0.463vh;
}

#cinfo-input #cinfo-input-content {
    width: 100%;
    height: auto;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

#cinfo-input-content input {
    padding-left: 3.1481vh;
    width: 16.2037vh;
    height: 2.7778vh;

    border: 0;
    border-radius: .3646vw;

    color: white;
    font-size: .625vw;
    font-family: 'SF Pro Rounded';
    font-weight: 600;

    background-image: url(img/CInfoHashInputBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    background-color: rgba(255,255,255,0.2);

    margin-bottom: 0.9259vh;
    transition: 0.1s;
}

#cinfo-input-content input::placeholder {
    color: white;
}

#cinfo-input-content input.noneditable {
    width: 100%;
}

#cinfo-input-content.editing input {
    background-color: rgba(204, 57, 255, 0.20);
    color: rgba(255,255,255, 0.2);
    transition: 0.1s;
}

#cinfo-input-content.editing input::placeholder {
    color: rgba(255,255,255, 0.2);
}

#cinfo-input-content.editing #cinfo-input-edit-button {
    background-color: rgba(204,57,255,0.2);
}

#cinfo-input-content.editing #cinfo-input-edit-button #cinfo-edit-icon {
    width: 1.1111vh;
    height: 1.1111vh;

    background-image: url(img/TikIcon.png);
}

#cinfo-input-content #cinfo-input-edit-button {
    width: 2.7778vh;
    height: 2.7778vh;

    border-radius: .3646vw;
    background-color: rgba(255, 255, 255, 0.2);
    
    display: flex;
    justify-content: center;
    align-items: center;

    transition: 0.1s;
}

#cinfo-input-content #cinfo-input-edit-button #cinfo-edit-icon {
    width: 1.3889vh;
    height: 1.3889vh;

    background-image: url(img/EditButtonIcon.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    transition: 0.1s;
}

#info-content-container #info-player-actions-container {
    width: 33.5185vh;
    height: 60.8333vh;

    background-image: url(img/PActionsBoxBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    border-radius: .5208vw;

    display: flex;
    justify-content: center;
}

#info-player-actions-container #player-actions-content {
    width: 28.7037vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#player-actions-content #pactions-title-box {
    width: 100%;
    height: 6.1111vh;

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

#pactions-title-box span {
    font-size: 1.0417vw;
    font-weight: 600;
    font-family: 'SF Pro Rounded';
}

#player-actions-content #seperate-line {
    width: 100%;
    height: 0.0926vh;

    opacity: 0.07;
    background-color: white;
}

#player-actions-content span.pactions-actions-title {
    font-size: 1.0417vw;
    font-weight: 600;
    font-family: 'SF Pro Rounded';
}

#player-actions-content #pactions-actions-container {
    width: 100%;
    height: 18.8889vh;

    display: flex;
    flex-wrap: wrap;
    gap: 0.8333vh;
    margin-top: 2.3148vh;
}

#pactions-actions-container #pactions-action {
    width: 8.9815vh;
    height: 8.9815vh;

    border-radius: .5208vw;
    display: flex;
    justify-content: center;
    align-items: center;

    margin: 0;

    background-position: center;
    background-size: 100%;
    background-repeat: no-repeat;

    transition: 0.2s;
}

#pactions-actions-container #pactions-action:hover {
    opacity: 0.5;
    transition: 0.2s;
}

#pactions-action span.pactions-action-text {
    font-size: .5208vw;
    font-weight: 600;
    font-family: 'SF Pro Rounded';
    margin-top: 3.7037vh;
}

#panel-content #pactions-popup-container {
    width: 100%;
    height: 100%;
    position: absolute;

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

    background-color: rgba(0,0,0,0.93);
    z-index: 2;
    border-radius: .7813vw;
}

#pactions-popup-container #pactions-popup-box {
    width: 49.6296vh;
    height: 27.7778vh;
    border-radius: .625vw;

    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    justify-content: center;
}

#pactions-popup-box #pactions-popup-box-container {
    width: 45.9259vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#pactions-popup-box-container #pactions-popup-title-box {
    width: 100%;
    height: 3.7963vh;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

#pactions-popup-title-box span.popupTitle {
    font-size: .7813vw;
    font-weight: 600;
}

#pactions-popup-title-box img {
    width: 1.4815vh;
    height: 1.4815vh;
}

#pactions-popup-box-container #pactions-popup-inputs {
    width: 100%;
    height: 15.8333vh;

    display: flex;
    justify-content: space-between;
}

#pactions-popup-inputs textarea {
    width: 100%;
    height: 13.0556vh;
    padding: 1.3889vh;
    
    border: .1042vw solid rgba(255, 255, 255, 0.22);
    border-radius: .5208vw;
    background-color: rgba(0, 0, 0, 0.2);

    font-family: 'SF Pro Rounded';
    font-size: .5208vw;
    font-weight: 600;
    color: white;

    resize: none;
}

#pactions-popup-inputs textarea:focus {
    outline: 0;
}

#pactions-popup-inputs #pactions-popup-time-selector {
    width: 100%;
    height: 100%;

    border: .1042vw solid rgba(255, 255, 255, 0.22);
    border-radius: .5208vw;
    background-color: rgba(0, 0, 0, 0.2);
    
    margin-left: 1.3889vh;
    display: flex;
    justify-content: center;
}

#pactions-popup-time-selector #pactions-popup-time-selector-content {
    width: 17.5926vh;
    height: 100%;

    display: flex;
    flex-direction: column;
}

#pactions-popup-time-selector-content span.popupTimeSelectorTitle {
    margin-top: 0.9259vh;
    font-size: .5208vw;
    font-weight: 500;
}

#pactions-popup-time-selector-content #pactions-popup-time-fast-boxes {
    width: 100%;
    height: 6.0185vh;

    display: flex;
    flex-wrap: wrap;
    gap: 1.3889vh;

    margin-top: 0.9259vh;
}

#pactions-popup-time-fast-boxes #pactions-popup-time-fast-box {
    width: 4.7222vh;
    height: 2.3148vh;

    border-radius: .1563vw;
    background-color: rgba(217, 217, 217, 0.04);
    display: flex;
    justify-content: center;
    align-items: center;

    font-size: .5208vw;
    color: rgba(255, 255, 255, 0.75);
    font-weight: 500;
}

#pactions-popup-box-container #pactions-popup-buttons {
    width: 100%;
    height: 7.2222vh;

    display: flex;
    justify-content: space-between;
    align-items: center;
}

#pactions-popup-buttons #pactions-popup-button {
    width: 20.3704vh;
    height: 4.2593vh;

    border-radius: .3646vw;
    background-color: rgba(0, 0, 0, 0.33);

    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.2s;
}

#pactions-popup-buttons #pactions-popup-button:hover {
    opacity: 0.7;
    transition: 0.2s;
}

#pactions-popup-button span {
    font-size: .7813vw;
    font-weight: 600;
}

#pactions-popup-time-selector-content #pactions-popup-time-inputs {
    width: 100%;
    height: 2.3148vh;

    margin-top: 0.9259vh;

    display: flex;
    justify-content: space-between;
}

#pactions-popup-time-inputs input {
    width: 4.537vh;
    height: 2.3148vh;

    border-radius: .1563vw;
    font-size: .5208vw;
    font-weight: 500;
    text-align: center;
    color: white;

    background-color: rgba(217, 217, 217, 0.04);
    border: .0521vw solid rgba(217, 217, 217, 0.04);
}

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

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

#car-page-content.inventoryPage #inv-page-boxes {
    width: 100%;
    height: 45.0926vh;
    
    display: flex;
    flex-direction: row;
    justify-content: space-between;

    margin-top: 1.2037vh;
}

#inv-page-boxes #inv-page-left-box {
    width: 100%;
    height: 45.0926vh;

    background: rgba(0, 0, 0, 0.2);
    border-radius: .4688vw;

    display: flex;
    align-items: center;
}

#inv-page-boxes #inv-page-right-box {
    width: 10.5556vh;
    height: 45.0926vh;

    border-radius: .4688vw;
    display: flex;
    justify-content: center;
    align-items: center;

    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
}

#inv-page-left-box #inv-page-left-box-content {
    width: 100%;
    height: 41.3889vh;

    display: flex;
    flex-direction: row;
}

#inv-page-left-box-content #inv-left-inventory-box {
    width: 35.2778vh;
    height: 100%;

    margin-left: 2.1296vh;

    display: flex;
    flex-direction: column;

    background-image: url(img/InvPlayerInventoryBoxBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#inv-left-inventory-box #inv-inventory-box-title {
    width: auto;
    height: 3.5185vh;

    font-size: .625vw;
    font-weight: 600;
    margin-left: 1.3889vh;

    display: flex;
    align-items: center;
}

#inv-left-inventory-box #inv-inventory-items-content {
    margin-top: 1.3889vh;
    margin-left: 1.3889vh;
    
    width: 32.5vh;
    height: 100%;

    overflow-y: auto;

    display: flex;
    flex-wrap: wrap;
    gap: 0.3704vh;
}

#inv-inventory-item-box {
    width: 6.2037vh;
    height: 6.1111vh;

    border-radius: 0.463vh;

    background-image: url(img/InvItemBoxBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    flex-direction: column;
    transition: 0.2s;
}

#inv-inventory-items-content #inv-inventory-item-box:hover {
    background-image: url(img/InvItemBoxHoverBg.png);
    transition: 0.2s;
}

#inv-inventory-item-box img {
    width: 3.1481vh;
    height: 3.1481vh;
}

#inv-inventory-item-box #inv-item-box-header {
    width: 100%;
    height: 1.3889vh;

    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
}

#inv-item-box-header #item-header-slot {
    width: 1.3889vh;
    height: 1.3889vh;

    background-color: #9C39FF;

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

    font-size: 0.9259vh;
    font-family: 'Proxima Nova';

    border-top-left-radius: 0.463vh;
    border-bottom-right-radius: 0.463vh;
}

#inv-page-left-box-content #inv-page-right-actions-box {
    width: 9.2593vh;
    height: 100%;

    margin-left: 9.2593vh;

    display: flex;
    flex-direction: column;
    align-items: center;
}

#inv-page-right-actions-box #inv-actions-button {
    width: 9.2593vh;
    height: 9.2593vh;
    background-color: black;

    border-radius: .4167vw;

    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#inv-actions-button.addItem {
    background-image: url(img/InvActionsPlusBg.png);

    margin-top: 4.9074vh;
    margin-bottom: 2.7778vh;
}

#inv-actions-button.removeItem {
    background-image: url(img/InvActionsTrashBg.png);
    margin-top: 2.7778vh;
}

#inv-page-right-actions-box input.itemAmount {
    width: 9.2593vh;
    height: 3.2407vh;

    padding: 0;
    border: none;
    outline: none;
    margin: 0;

    border-radius: .4167vw;

    text-align: center;
    font-weight: 600;
    font-size: .625vw;
    color: white;

    background-color: rgba(217, 217, 217, 0.05);
}

#panel-content #inv-popup-container {
    position: absolute;
    width: 100%;
    height: 100%;

    z-index: 3;
    display: flex;
    justify-content: center;
    align-items: center;

    border-radius: 1.6667vh;

    background: rgba(15, 16, 24, 0.93);
}

#inv-popup-container #inv-popup-box {
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

    display: flex;
    flex-direction: column;
    align-items: center;
}

#inv-popup-container #inv-popup-box.deleteItem {
    width: 49.6296vh;
    height: 27.7778vh;

    border-radius: 1.1111vh;
    background-image: url(img/InvPopupDeleteBg.png);
}

#inv-popup-container #inv-popup-box.addItem {
    width: 49.6296vh;
    height: 22.7778vh;
    align-items: start;

    border-radius: 1.1111vh;
    background-image: url(img/InvPopupAddBg.png);
}

#inv-popup-container #inv-popup-box.clearInv {
    width: 49.6296vh;
    height: 27.7778vh;

    border-radius: 1.1111vh;
    background-image: url(img/InvPopupClearBg.png);
}

#inv-popup-box.addItem #inv-popup-input {
    width: 43.1481vh;
    height: 3.4259vh;

    border-radius: 0.463vh;
    padding-left: 1.3889vh;
    padding-right: 1.3889vh;

    border: 0;
    color: white;
    font-size: .5208vw;

    margin-left: 1.8519vh;
    margin-top: 1.8519vh;

    background-color: transparent;
    background-image: url(img/InvPopupInputBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#inv-popup-box.addItem #inv-popup-selectmenu {
    width: 45.5556vh;
    height: auto;
    max-height: 35.1852vh;
    position: absolute;

    margin-top: 8.6111vh;
    margin-left: 1.7593vh;

    border: .1042vw solid rgba(255, 255, 255, 0.05);

    border-bottom-left-radius: 0.463vh;
    border-bottom-right-radius: 0.463vh;

    background: linear-gradient(180deg, #251232 0%, #16112B 100%);

    z-index: 5;

    overflow-y: auto;
}

#inv-popup-selectmenu #inv-selectmenu-item {
    width: 100%;
    height: 3.2407vh;

    display: flex;
    align-items: center;

    font-size: .5208vw;
    color: rgba(255, 255, 255, 0.32);

    border-bottom: .1042vw solid rgba(255, 255, 255, 0.05);
    transition: 0.5s;
}

#inv-popup-selectmenu #inv-selectmenu-item.last {
    border-bottom: 0;
}

#inv-selectmenu-item img {
    width: 2.2222vh;
    height: 2.2222vh;

    margin-left: 1.2963vh;
}

#inv-selectmenu-item:hover {
    background: linear-gradient(90deg, #4E2576 0%, #41324D 100%);
    border-bottom-color: rgba(0, 0, 0, 0.0);
    transition: 0.5s;
}

#inv-selectmenu-item:hover span {
    color: white;
}

#inv-popup-box #inv-popup-close {
    width: 1.4815vh;
    height: 1.4815vh;

    margin-right: 1.8519vh;

    background-image: url(img/PActionsPopupCancel.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

#inv-popup-box #inv-popup-button {
    width: 20.3704vh;
    height: 4.2593vh;

    font-size: 1.3889vh;
    font-weight: 600;

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

    border-radius: 0.6481vh;
}

#inv-popup-button.cancelButton {
    background: rgba(0, 0, 0, 0.33);
}

#inv-popup-button.deleteButton {
    background: #FF395D;
    box-shadow: 0 .0521vw 8.5185vh 0 rgba(255, 57, 93, 0.40);
}

#inv-page-right-box.playerPage {
    background-image: url(img/InvStashButtonBg.png);
}

#inv-page-right-box.stashPage {
    background-image: url(img/InvPlayerInventoryButtonBg.png);
}

#logs-content-box {
    width: 65.5556vh;
    height: 45.0926vh;

    border-radius: 0.8333vh;

    background-image: url(img/LogsGeneralBg.png);
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;

    display: flex;
    flex-direction: column;

    transition: 0.2s;
}

#logs-content-box #logs-navbar {
    width: 100%;
    height: 6.0185vh;

    display: flex;
    flex-direction: row;
    align-items: center;
}

#logs-navbar #logs-navbar-item-box {
    width: 8.3333vh;
    height: 3.5648vh;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;

    margin-left: 1.3889vh;
}

#logs-navbar-item-box #logs-navbar-item-button {
    width: 8.3333vh;
    height: 2.7778vh;

    font-size: 1.0185vh;
    color: white;
    font-weight: 600;
    display: flex;
    justify-content: space-evenly;
    align-items: center;

    border-radius: 0.3704vh;
    background: url(img/LogsGeneralButtonBg.png);
}

#logs-content-box #logs-content {
    width: 62.7778vh;
    height: 37.6852vh;

    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 0.8333vh;

    margin-left: 1.3889vh;
}

#logs-content.general {
    display: flex;
    flex-direction: row;

    background-image: url(img/LogsGeneralInLogBg.png);
}

#logs-content.general #logs-logtext-container {
    width: 30.463vh;
    height: 90%;
    margin-top: 2.1296vh;

    display: flex;
    flex-direction: column;

    overflow-y: auto;
}

#logs-logtext-container span {
    font-size: 0.9259vh;
    font-weight: 500;

    color: white;
    opacity: 0.6;
}

#logs-content.general #logs-logtext-right-container {
    width: 39.7222vh;
    height: 100%;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#logs-logtext-right-container input {
    margin-top: 1.8519vh;

    width: 22.037vh;
    height: 2.037vh;
    padding-left: 1.4815vh;
    padding-right: 1.4815vh;

    font-size: .4167vw;
    font-weight: 400;
    color: white;

    border-radius: 1.1111vh;

    background-image: url(img/LogsSearchInputBg.png);
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-color: transparent;

    border: 0;
}

#logs-logtext-right-container #logs-logtext-button {
    margin-top: 1.8519vh;

    width: 7.4074vh;
    height: 2.1296vh;

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

    font-size: 0.9259vh;
    font-weight: 500;

    border-radius: 1.1111vh;
    background: linear-gradient(90deg, rgba(182, 182, 255, 0.61) 0%, rgba(127, 128, 219, 0.61) 100%);
    box-shadow: 0 0 3.7037vh -0.463vh #B6B6FF;
}

#logs-logtext-button img {
    width: 0.8333vh;
    height: 0.8333vh;
}

#logs-content.notGeneral {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#logs-content.warns {
    background-image: url(img/LogsWarnsInLogBg.png);
}
#logs-content.kicks {
    background-image: url(img/LogsKicksInLogBg.png);
}
#logs-content.adminjails {
    background-image: url(img/LogsAJailsInLogBg.png);
}
#logs-content.bans {
    background-image: url(img/LogsBansInLogBg.png);
}


#logs-content #logs-column-container {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 1.8519vh;

    width: 59.0741vh;
    height: 100%;

    overflow-y: auto;
}

#logs-column-container #logs-column-item {
    width: 18.4259vh;
    height: 21.0185vh;
    border-radius: 0.6481vh;
    overflow: hidden;

    display: flex;
    flex-direction: column;
    background-color: rgba(0, 0, 0, 0.33);

    transition: 0.2s;
}

#logs-column-container #logs-column-item.Warn {
    background: rgba(217, 217, 217, 0.10);
}
#logs-column-container #logs-column-item.Warn:hover {
    background: rgba(255, 144, 111, 0.10);
}

#logs-column-container #logs-column-item.Kicks {
    background: rgba(217, 217, 217, 0.10);
}
#logs-column-container #logs-column-item.Kicks:hover {
    background: rgba(255, 175, 101, 0.10);
}

#logs-column-container #logs-column-item.AdminJails {
    background: rgba(217, 217, 217, 0.10);
}
#logs-column-container #logs-column-item.AdminJails:hover {
    background: rgba(73, 255, 211, 0.10);
}

#logs-column-container #logs-column-item.Bans {
    background: rgba(217, 217, 217, 0.10);
}
#logs-column-container #logs-column-item.Bans:hover {
    background: rgba(255, 73, 73, 0.10);
}

#logs-column-item textarea {
    padding: 0.9259vh;

    width: 13.8889vh;
    height: 5.3704vh;

    margin-left: 1.3889vh;

    font-size: .4167vw;
    color: rgba(255, 255, 255, 0.56);
    font-family: 'SF Pro Rounded';
    resize: none;

    border: .0521vw solid rgba(255, 255, 255, 0.03);
    background: rgba(217, 217, 217, 0.04);
    border-radius: 0.2778vh;

    transition: 0.2s;
}

#logs-column-item textarea:focus {
    outline: 0;
}

#logs-column-item span.warn {
    color: #FF906F;
}
#logs-column-item span.kick {
    color: #FFAF65;
}
#logs-column-item span.adminjail {
    color: #49FFD3;
}
#logs-column-item span.ban {
    color: #FF4949;
}

/* Transition Start */

.fade-enter-active,
.fade-leave-active {
    transition: opacity 0.3s ease-out;
}

.fade-enter,
.fade-leave-to {
    opacity: 0;
}

/* Transition End */