@import url('https://fonts.googleapis.com/css2?family=Orbitron&family=Titillium+Web&display=swap');

:root {
    --gradient-grey-bottom: linear-gradient(180deg, rgba(55, 64, 74, 0) 0%, rgba(55, 64, 74, 1) 50%, rgba(55, 64, 74, 1) 100%);
    --gradient-grey-bottom-0: linear-gradient(180deg, rgba(55, 64, 74, 0) 0%, rgba(55, 64, 74, 1) 50%, rgba(55, 64, 74, 0) 100%);
    --gradient-black-bottom: linear-gradient(180deg, rgba(20, 20, 20, 0) 0%, rgba(30, 30, 30, 1) 50%, rgba(30, 30, 30, 1) 100%);
    --gradient-black-bottom-0: linear-gradient(180deg, rgba(20, 20, 20, 0) 0%, rgba(30, 30, 30, 1) 50%, rgba(30, 30, 30, 0) 100%);
    --gradient-black-bottom-100-0-100: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 0) 50%, rgba(30, 30, 30, 1) 100%);
    --gradient-black-bottom-sized: linear-gradient(180deg, rgba(20, 20, 20, 0) 0%, rgba(30, 30, 30, 1) 200px, rgba(30, 30, 30, 1) 100%);
    --fc_chart: url('assets/galaxy_stargaze/star/0_3cujnlcegfs/2048/_nx.jpg');
    --skybox: url('assets/galaxy_stargaze/star/0_3cujnlcegfs/2048/_nx.jpg');
}

*::-webkit-scrollbar {
    width: 0.3rem;
    height: 0.25rem;
    -webkit-transition: all ease 0.05s;
    transition: all ease 0.05s;
    background: rgba(0, 0, 0, 0.2);
}

*::-webkit-scrollbar-thumb {
    background: rgba(202, 233, 249, 0.35);
}

*:hover::-webkit-scrollbar-thumb {
    background: rgba(202, 233, 249, 0.5);
}

#renderCanvas {
    padding: 0;
    margin: auto;
    display: block;
    position: fixed;
    background: transparent;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
}

.bg-amora {
    background: rgb(235, 69, 182);
}

.bg-style-1 {
    background-image: url(assets/scifi-bs-html/bg/1.png) !important;
}

.bg-style-2 {
    background-image: url(assets/scifi-bs-html/bg/2.png) !important;
}

.bg-style-3 {
    background-image: url(assets/scifi-bs-html/bg/3.svg) !important;
}

.bg-style-4 {
    background-image: url(assets/scifi-bs-html/bg/4.svg) !important;
}

.bg-style-5 {
    background-image: url(assets/scifi-bs-html/bg/5.png) !important;
}

.bg-style-6 {
    background-image: url(assets/scifi-bs-html/bg/6.svg) !important;
}

.bg-style-7 {
    background-image: url(assets/scifi-bs-html/bg/7.png) !important;
}

.bg-style-8 {
    background-image: url(assets/scifi-bs-html/bg/8.svg) !important;
}

.bg-style-9 {
    background-image: url(assets/scifi-bs-html/bg/9.png) !important;
}

.bg-style-10 {
    background-image: url(assets/scifi-bs-html/bg/10.png) !important;
}

.bg-res-901, .bg-building-1 {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(217, 176, 61) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(217, 176, 61);
}

.bg-res-902, .bg-building-2 {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(79, 198, 225) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(79, 198, 225);
}

.bg-res-903, .bg-building-3 {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(26, 188, 156) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(26, 188, 156);
}

.bg-res-904, .bg-building-4 {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(255, 255, 0) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(255, 255, 0);
}

@keyframes shipGlow {
    from {
        opacity: 0.5;
    }
    to {
        opacity: 1;
    }
}

html.alarm-full-screen {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden; /* Prevents the glow from extending beyond the viewport */
}

html.alarm-full-screen::after {
    content: "";
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    pointer-events: none; /* Allows clicks to pass through the glow */
    z-index: 9999; /* Make sure it's above other content */
    animation: alarm-full-screen 1s infinite alternate;
}

@keyframes alarm-full-screen {
    from {
        box-shadow: inset 0 0 5px #ff0000;
    }
    to {
        box-shadow: inset 0 0 25px #ff0000;
    }
}

[data-bs-theme=dark] .carousel .carousel-control-next-icon, [data-bs-theme=dark] .carousel .carousel-control-prev-icon, [data-bs-theme=dark].carousel .carousel-control-next-icon, [data-bs-theme=dark].carousel .carousel-control-prev-icon {
    filter: brightness(0) saturate(100%) invert(63%) sepia(19%) saturate(490%) hue-rotate(17deg) brightness(87%) contrast(80%);
}

.f-x-small {
    font-size: x-small;
}

.text-shadow-game {
    text-shadow: 0 0 5px rgba(30, 30, 30, 1) !important;
}

.text-shadow-none {
    text-shadow: none !important;
}

.p {
    font-family: 'Titillium Web', sans-serif;
}

.grayscale {
    filter: grayscale(1);
}

hr {
    border-color: rgba(170, 255, 252, 0.2);
    border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%) 1 !important;
    border-width: 1px !important;
}

.fs-x-small {
    font-size: x-small !important;
}

.bg-gradient-success {
    background-image: linear-gradient(180deg, rgba(79, 227, 139, 0.15), rgba(255, 255, 255, 0)) !important;
}

.bg-gradient-grey-bottom {
    background: var(--gradient-grey-bottom);
}

.bg-gradient-grey-bottom-0 {
    background: var(--gradient-grey-bottom-0);
}

.bg-gradient-black-bottom {
    background: var(--gradient-black-bottom);
}

.bg-gradient-black-bottom-0 {
    background: var(--gradient-black-bottom-0);
}

.bg-gradient-black-bottom-100-0-100 {
    background: var(--gradient-black-bottom-100-0-100);
}

body {
    font-family: 'Orbitron', sans-serif !important;
    padding-bottom: 0;
}

html, body {
    display: flex;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
}

.shepherd-step-highlight {
    box-shadow: inset 0 0 10px 1px #48abe0;
    animation: shepherd-step-highlight-glow 2s ease-in-out infinite;
    border: 2px solid #48abe0 !important;
}

@keyframes shepherd-step-highlight-glow {
    0% {
        box-shadow: inset 0 0 10px 1px #48abe0;
    }
    50% {
        box-shadow: inset 0 0 20px 2px #48abe0;
    }
    100% {
        box-shadow: inset 0 0 10px 1px #48abe0;
    }
}

.shepherd-content {
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 1), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url(/styles/startrek/assets/galaxy_stargaze/star/0_3cujnlcegfs/4096/_nx.jpg) center / cover;
    border: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.shepherd-text {
    color: white !important;
}

.shepherd-footer {
    background: transparent;
    border: 0;
    justify-content: space-around;
}

.shepherd-button {
    background: linear-gradient(to bottom, rgb(27, 79, 114) 0%, rgb(33, 33, 33) 100%) !important;
    border-color: rgb(40, 116, 166) !important;
    color: #fff !important;
    width: 100%;
    border: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
}

.shepherd-button:hover {
    background: linear-gradient(to bottom, rgb(27, 79, 114) 50%, rgba(33, 33, 33, 0.1) 100%), linear-gradient(to left, rgb(33, 33, 33) 0%, rgb(40, 116, 166) 50%, rgb(33, 33, 33) 100%) !important;
    border-color: rgb(40, 116, 166) !important;
    color: #fff !important;
}

.orbitron {
    font-family: 'Orbitron', sans-serif !important;
}

.offcanvas-body, .offcanvas-footer, .offcanvas-header {
    background: rgba(20, 20, 20, 1) !important;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-width: 2px !important;
    /* border-radius: 0.5rem !important; */
    border-radius: 0rem !important;
    border-bottom: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
    border-top: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
}

.offcanvas-header {
    background: transparent !important;
    border-top: 0 !important
}

.offcanvas-bottom-60 {
    background: transparent !important;
    bottom: 60px;
    height: fit-content;
}

.vertical-lr {
    writing-mode: vertical-lr;
}

.vertical-rl {
    writing-mode: vertical-rl;
}

.card {
    background: rgba(20, 20, 20, 1);
}

p, li, td {
    font-family: 'Titillium Web', sans-serif;
}

@media (max-width: 767.98px) {
    .content-page {
        /* padding: 0 0 var(--ct-footer-height); */
        padding: 0;
        min-height: 0;
        margin-top: 2.25rem;
    }

    .content-page, .footer, .navbar-custom {
        transition: transform 0.3s ease;
        /* transition: margin-left 0.3s ease; */
    }

    .navbar-custom {
        position: fixed;
    }

    .offcanvas-transition {
        transform: translateX(90%); /* Push content by 90% of its width */
        /* margin-left: 90%; */
    }

    .content-page > .x-row > .game > .card {
        padding-top: 1.25rem !important;
    }

    .content-page .game > :not(.swiper-slide) > .card {
        padding-bottom: 2.25rem !important;
        min-height: 100%;
    }
}

@media (min-width: 767.98px) {
    .content-page {
        padding: 5rem;
        margin-top: 3.5rem;
    }
}

.content-page {
    pointer-events: none;
}

.content-page > * {
    pointer-events: auto;
}

/*
li::marker {
    content: "♦ ";
}
 */

@media (min-width: 700px) {
    .game-outliner {
        z-index: 1000;
        top: 75px;
        right: 0;
        position: fixed;
        width: 250px;
        -webkit-transition: all .25s ease-in-out;
        transition: all .25s ease-in-out;
        overflow: auto;
    }
}

.bg-outliner-top {
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.3) 0%, rgba(30, 30, 30, 0.1) 100%);
    color: var(--ct-menu-item-color);
}

.bg-selected {
    background: radial-gradient(circle, rgba(79, 227, 139, 1) 0%, rgba(79, 227, 139, 0.3) 5%, rgba(0, 0, 0, 0) 50%)
}

.h-nms-selected {
    margin-top: 0;
    font-family: 'Orbitron', sans-serif !important;
    /*! font-size: 1.4rem; */
    font-weight: 700;
    letter-spacing: .3rem;
    line-height: 1.2;
    text-transform: uppercase;
    /* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20id%3D%22layer%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20335%2024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20%23928F6E%3B%20%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eh3-background-export%3C%2Ftitle%3E%3Cpolygon%20id%3D%22shape%22%20class%3D%22cls-1%22%20points%3D%22311.69%200%2035%200%2034%200%200%200%200%204%2031%204%2034%201%20311.31%201%20334.31%2024%20335%2023.31%20311.69%200%22%2F%3E%3C%2Fsvg%3E"); */
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20id%3D%22layer%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20335%2024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20rgba%2896%2C%20125%2C%20139%29%3B%20%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eh3-background-export%3C%2Ftitle%3E%3Cpolygon%20id%3D%22shape%22%20class%3D%22cls-1%22%20points%3D%22311.69%200%2035%200%2034%200%200%200%200%204%2031%204%2034%201%20311.31%201%20334.31%2024%20335%2023.31%20311.69%200%22%2F%3E%3C%2Fsvg%3E");
    /*! margin-bottom: 20.4px; */
    /*! margin-bottom: 2.04rem; */
    /*! padding-left: 20px; */
    /*! padding-left: 2rem; */
    /*! padding-right: 20px; */
    /*! padding-right: 2rem; */
    /*! padding-top: 9px; */
    /*! padding-top: .9rem; */
    /*! padding-top: 48.96px; */
    padding-top: 0.5rem;
    background-size: 100% 25px;
    /*! background-position: 2rem bottom; */
    background-repeat: no-repeat;
    color: #f6fbff;
}


.nms-header {
    margin-top: 0;
    font-family: 'Orbitron', sans-serif !important;
    font-weight: 700;
    letter-spacing: .3rem;
    line-height: 1.2;
    text-transform: uppercase;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20id%3D%22layer%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20335%2024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20%23928F6E%3B%20%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eh3-background-export%3C%2Ftitle%3E%3Cpolygon%20id%3D%22shape%22%20class%3D%22cls-1%22%20points%3D%22311.69%200%2035%200%2034%200%200%200%200%204%2031%204%2034%201%20311.31%201%20334.31%2024%20335%2023.31%20311.69%200%22%2F%3E%3C%2Fsvg%3E");
    padding-top: 0.5rem;
    background-size: 100% 25px;
    background-repeat: no-repeat;
    color: #f6fbff;
}

@media (max-width: 767.98px) {
    .nav-fill .nav-item, .nav-fill > .nav-link {
        font-size: x-small;
        letter-spacing: 0 !important;
        padding-right: .375rem !important;
        padding-left: .375rem !important;
        color: white;
    }

    .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
        text-shadow: 0 0 5px rgba(176, 173, 140, 0.3);
        --ct-text-opacity: 1;
        color: rgb(176, 173, 140) !important;
        background: none;
        border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 100%) 1 !important;
        border-width: 10px !important;
        border-bottom: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
        border-top: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
    }
}

.disabled {
    opacity: 0.5;
}

.nav-link.disabled {
    opacity: 0.5;
}

@media (min-width: 767.98px) {
    .nav-fill .nav-item, .nav-fill > .nav-link {
        margin-top: 0;
        font-family: 'Orbitron', sans-serif !important;
        /*! font-size: 1.4rem; */
        font-weight: 700;
        letter-spacing: .3rem;
        line-height: 1.2;
        text-transform: uppercase;
        /* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20id%3D%22layer%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20335%2024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20%23608aab%3B%20%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eh3-background-export%3C%2Ftitle%3E%3Cpolygon%20id%3D%22shape%22%20class%3D%22cls-1%22%20points%3D%22311.69%200%2035%200%2034%200%200%200%200%204%2031%204%2034%201%20311.31%201%20334.31%2024%20335%2023.31%20311.69%200%22%2F%3E%3C%2Fsvg%3E"); */
        /*! margin-bottom: 20.4px; */
        /*! margin-bottom: 2.04rem; */
        /*! padding-left: 20px; */
        /*! padding-left: 2rem; */
        /*! padding-right: 20px; */
        /*! padding-right: 2rem; */
        /*! padding-top: 9px; */
        /*! padding-top: .9rem; */
        /*! padding-top: 48.96px; */
        padding-top: 0.5rem;
        background-size: 100% 25px;
        /*! background-position: 2rem bottom; */
        background-repeat: no-repeat;
    }

    .nav-pills .nav-link.active, .nav-pills .show > .nav-link {
        margin-top: 0;
        font-family: 'Orbitron', sans-serif !important;
        /*! font-size: 1.4rem; */
        font-weight: 700;
        letter-spacing: .3rem;
        line-height: 1.2;
        text-transform: uppercase;
        /* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20id%3D%22layer%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20335%2024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20%23928F6E%3B%20%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eh3-background-export%3C%2Ftitle%3E%3Cpolygon%20id%3D%22shape%22%20class%3D%22cls-1%22%20points%3D%22311.69%200%2035%200%2034%200%200%200%200%204%2031%204%2034%201%20311.31%201%20334.31%2024%20335%2023.31%20311.69%200%22%2F%3E%3C%2Fsvg%3E"); */
        background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20id%3D%22layer%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20335%2024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20rgba%2896%2C%20125%2C%20139%29%3B%20%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eh3-background-export%3C%2Ftitle%3E%3Cpolygon%20id%3D%22shape%22%20class%3D%22cls-1%22%20points%3D%22311.69%200%2035%200%2034%200%200%200%200%204%2031%204%2034%201%20311.31%201%20334.31%2024%20335%2023.31%20311.69%200%22%2F%3E%3C%2Fsvg%3E");
        /*! margin-bottom: 20.4px; */
        /*! margin-bottom: 2.04rem; */
        /*! padding-left: 20px; */
        /*! padding-left: 2rem; */
        /*! padding-right: 20px; */
        /*! padding-right: 2rem; */
        /*! padding-top: 9px; */
        /*! padding-top: .9rem; */
        /*! padding-top: 48.96px; */
        padding-top: 0.5rem;
        background-size: 100% 25px;
        /*! background-position: 2rem bottom; */
        background-repeat: no-repeat;
        background-color: transparent;
    }
}

.h-nms {
    margin-top: 0;
    font-family: 'Orbitron', sans-serif !important;
    /*! font-size: 1.4rem; */
    font-weight: 700;
    letter-spacing: .3rem;
    line-height: 1.2;
    text-transform: uppercase;
    /* background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20id%3D%22layer%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20335%2024%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%20%7B%20fill%3A%20%23608aab%3B%20%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ctitle%3Eh3-background-export%3C%2Ftitle%3E%3Cpolygon%20id%3D%22shape%22%20class%3D%22cls-1%22%20points%3D%22311.69%200%2035%200%2034%200%200%200%200%204%2031%204%2034%201%20311.31%201%20334.31%2024%20335%2023.31%20311.69%200%22%2F%3E%3C%2Fsvg%3E"); */
    /*! margin-bottom: 20.4px; */
    /*! margin-bottom: 2.04rem; */
    /*! padding-left: 20px; */
    /*! padding-left: 2rem; */
    /*! padding-right: 20px; */
    /*! padding-right: 2rem; */
    /*! padding-top: 9px; */
    /*! padding-top: .9rem; */
    /*! padding-top: 48.96px; */
    padding-top: 0.5rem;
    background-size: 100% 25px;
    /*! background-position: 2rem bottom; */
    background-repeat: no-repeat;
    color: #f6fbff;
}

html[data-sidenav-size="condensed"]:not([data-layout="topnav"]) .wrapper .content-page {
    min-height: 0 !important;
}

.text-warning-shadow {
    text-shadow: 0 0 5px rgba(250, 146, 29, 0.5);
}


@media (min-width: 767.98px) {
    .modal-backdrop, .fancybox__backdrop, .offcanvas-backdrop {
        background: rgb(20, 20, 20, 0) !important;

    }
}


.modal {
    text-align: inherit !important;
}

.modal-header, .modal-body {
    background: none !important;
}

.modal-content {
    border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgba(18, 22, 24, 0) 25%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 75%, rgba(18, 22, 24, 0) 100%) 1 !important;
    border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 100%) 1 !important;
    border-radius: 1rem !important;
    border-bottom: 2px solid #464f5b !important;
    border-top: 2px solid #464f5b !important;
}

.modal-title {
    font-family: 'Orbitron', sans-serif !important;
    text-transform: uppercase !important;
    width: 100%;
}

@media (min-width: 767.98px) {
    .modal-content {
        min-height: 0;
        max-height: 75vh !important;
    }
}

.modal > .modal-dialog > .modal-content > .modal-game-fetch {
    padding: 0;
}

@media (max-width: 767.98px) {
    .modal-content, .modal-game-fetch > .card, .modal-game-fetch > .card-startrek {
        border: none !important;
    }
}

.modal > .modal-dialog > .modal-content > .modal-game-fetch > .card-startrek #treant-tech {
    height: 50vh;
}

.modal-isChild {
    border-radius: 1rem !important;
    border: 2px solid rgba(250, 146, 29, 0.3) !important;
    box-shadow: 0 0 35px 0 rgba(250, 146, 29, 0.3) !important;
    background: rgba(20, 20, 20, 1);
    background: linear-gradient(180deg, rgba(20, 20, 20, 0.25) 0%, rgba(30, 30, 30, 0.5) 100%), url('assets/scifi-bs-html/bg/4.svg'), rgb(22, 22, 22) !important;
}

.leftside-menu {
    position: fixed !important;
    background: rgb(20, 20, 20);
    background: -moz-linear-gradient(90deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    background: linear-gradient(90deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#141414", endColorstr="#121618", GradientType=1);
    padding-bottom: 0;
    bottom: inherit;
    /* box-shadow: none; */
}

.body-border-top {
    z-index: 999;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 36px !important;
    border-bottom: 1px solid rgba(38, 48, 64, 1);
}

.body-border-left {
    z-index: 999;
    position: fixed;
    bottom: 0;
    top: 0;
    width: 35px;
    min-height: 36px !important;
    /*background: url(assets/scifi-bs-html/bg/_4.svg), url(_xt.png), linear-gradient(to bottom, rgba(0, 175, 255, 0.1) 0%, rgb(20, 20, 20) 100%), rgb(20, 20, 20);*/
    /*background: radial-gradient(circle at top right, #141e30f2, #000000fa);*/
    border-right: 1px solid rgba(38, 48, 64, 1);
}

.body-border-top::before, .body-border-left::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: radial-gradient(circle at top left, rgba(20, 30, 48, 0.5), rgba(0, 0, 0, 0.98)), linear-gradient(90deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url(/styles/startrek/assets/galaxy_stargaze/star/0_3cujnlcegfs/4096/_nx.jpg) center / cover, rgba(0, 0, 0, 1);
    filter: brightness(2);
}

.body-border-bottom {
    background: url(assets/scifi-bs-html/bg/5.png), rgb(22, 22, 22);
    min-height: 20px !important;
    bottom: 0;
    position: fixed;
    width: 100%;
}

.body-border-right {
    background: rgb(20, 20, 20);
    background: -moz-linear-gradient(90deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    background: linear-gradient(90deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#141414", endColorstr="#121618", GradientType=1);
    z-index: 999;
    bottom: 0;
    top: 0;
    position: fixed;
    width: 35px;
    right: 0;
}

.leftside-menu {
    clip-path: polygon(0 0, 500% 0, 500% 52%, 500% 60%, 500% calc(100% - 90px), 100% calc(100% - 90px), 100% calc(100% - 70px), 0 100%);
    clip-path: polygon(0 0, 500% 0, 500% 52%, 500% 60%, 500% calc(100% - 90px), 100% 100%, 100% calc(100% - 70px), 0% 100%);
    padding-bottom: 5rem;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.leftside-menu::after {
    content: '';
    position: absolute;
    top: auto;
    left: 100%;
    bottom: 0;
    right: auto;
    z-index: 2;
    width: 6px;
    height: 71px;
    -webkit-transform: skew(135deg);
    transform: skew(135deg);
    -webkit-transform-origin: top right;
    transform-origin: top right;
    background: rgba(202, 233, 249, 1);
    box-shadow: 4px 4px 10px rgba(202, 233, 249, 0.7), -4px -4px 10px rgba(202, 233, 249, 0.7), -4px 4px 10px rgba(202, 233, 249, 0.7), 4px -4px 10px rgba(202, 233, 249, 0.7);
    clip-path: polygon(-100vw -100vw, 1px 0, 100% 100%, 0% 100%); /* removes edging shadow */
}

.leftside-menu-border-left {
    left: 0;
    width: 1px;
    background: linear-gradient(to bottom, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%);
}

.leftside-menu-border-right {
    right: 0;
    width: 1px;
    background: linear-gradient(to bottom, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%);
}

.navbar-custom-start {
    clip-path: polygon(0 0, 55px 30px, 55px 100px, 100% 100px, 100% 0);
}

@media (min-width: 767.98px) {
    .navbar-clip-left {
        clip-path: polygon(0 0, 0 100px, calc(100% - 80px) 100px, calc(100% - 50px) 35px, calc(100% - 20px) 35px, 100% 0);
    }
}

.navbar-clip-right {
    clip-path: polygon(0 0, calc(0% + 20px) 35px, calc(0% + 50px) 35px, calc(0% + 80px) 100px, 100% 100px, 100% 0);
}

.navbar-custom-bg {
    background: rgb(20, 20, 20);
    background: -moz-linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    background: -webkit-linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    box-shadow: var(--ct-box-shadow);
}


@media (max-width: 767.98px) {
    .navbar-custom {
        padding: 0 0;
    }
}

@media (min-width: 767.98px) {
    .navbar-custom {
        position: fixed !important;
        background: none;
        box-shadow: none;
    }
}


.map-hexagon {
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}


.map-mine {
    clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

html[data-sidenav-size=condensed]:not([data-layout=topnav]) .wrapper .leftside-menu .side-nav .side-nav-item:hover .side-nav-link {
    position: relative;
    color: #fff;
    background: none; /* Move background to ::before */
    width: var(--ct-leftbar-width);
    border-image: linear-gradient(to right, rgba(18, 22, 24, 0) 10%, rgba(202, 233, 249, 0.6) 50%, rgba(202, 233, 249, 0.6) 90%) 1 !important;
    border-width: 1px !important;
    border-top: 1px solid;
    border-bottom: 1px solid;
    overflow: hidden; /* Ensure child doesn't overflow rounded border */
}

html[data-sidenav-size=condensed]:not([data-layout=topnav]) .wrapper .leftside-menu .side-nav .side-nav-item:hover .side-nav-link::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: radial-gradient(circle at top left, rgba(20, 30, 48, 1), rgba(0, 0, 0, 0.98)), rgba(0, 0, 0, 0.98);
    -webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 100%);
    mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 100%);
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    mask-repeat: no-repeat;
}

html[data-sidenav-size=condensed]:not([data-layout=topnav]) .wrapper .leftside-menu .side-nav .side-nav-item:hover .side-nav-link > * {
    position: relative;
    z-index: 1;
}

html[data-sidenav-size=condensed]:not([data-layout=topnav]) .wrapper .leftside-menu .side-nav .side-nav-item:hover .side-nav-link > .border-scifi {
    position: absolute;
    z-index: 1;
}

.side-nav {
    margin-top: 5rem !important;
}

.side-nav-second-level .side-nav-item .side-nav-link {
    margin: 0 !important;
    padding: .375rem !important;
}

.side-nav-second-level .side-nav-item {
    background: url(assets/scifi-bs-html/bg/4.svg), url(xt.png), rgb(20, 20, 20);
}

.no-clip-path {
    clip-path: none;
}

.footer-desktop {
    z-index: 3;
    height: auto;
    background: none;
    border: none;
}

.mobile-footer-btn-center {
    border: 1px solid #000 !important;
    border-image: linear-gradient(to top, rgba(60, 60, 60, 0.5) 0%, rgba(60, 60, 60, 0.25) 50%, rgba(0, 0, 0, 0) 100%) 1 !important;
    border-top-width: 0 !important;
    border-right-width: 1px !important;
    border-bottom-width: 0 !important;
    border-left-width: 1px !important;
    border-radius: 0rem !important;
}

.mobile-footer-btn-left {
    border: 1px solid #000 !important;
    border-image: linear-gradient(to top, rgba(60, 60, 60, 0.5) 0%, rgba(60, 60, 60, 0.25) 50%, rgba(0, 0, 0, 0) 100%) 1 !important;
    border-top-width: 0 !important;
    border-right-width: 0 !important;
    border-bottom-width: 0 !important;
    border-left-width: 1px !important;
    border-radius: 0rem !important;
}

.mobile-footer-btn-right {
    border: 1px solid #000 !important;
    border-image: linear-gradient(to top, rgba(60, 60, 60, 0.5) 0%, rgba(60, 60, 60, 0.25) 50%, rgba(0, 0, 0, 0) 100%) 1 !important;
    border-top-width: 0 !important;
    border-right-width: 1px !important;
    border-bottom-width: 0 !important;
    border-left-width: 0 !important;
    border-radius: 0rem !important;
}

.mobile-footer-btn-active {
    background: linear-gradient(0deg, rgba(202, 233, 249, 0.15), rgba(202, 233, 249, 0));
    border-image: linear-gradient(to top, rgba(202, 233, 249, 0.5) 0%, rgba(202, 233, 249, 0.25) 33%, rgba(202, 233, 249, 0) 66%, rgba(202, 233, 249, 0) 100%) 1 !important;
    border-right-width: 1px !important;
    border-left-width: 1px !important;
    color: #aafffc;
}


.mobile-fleet-btn, .mobile-queue-btn, .mobile-submenu {
    display: none !important;
}

.col-navbar-mobile-resource {
    line-height: 0.5rem;
}

@media (max-width: 767.98px) {
    .navbar-mobile-queue {
        display: block !important;
        position: fixed;
        top: 1.85rem;
        z-index: 2;
        background: linear-gradient(to bottom, rgb(27, 79, 114) 0%, rgb(33, 33, 33) 100%);
        border-color: rgb(40, 116, 166);
        color: #fff;
        width: 90%;
        left: 50%;
        transform: translateX(-50%);
        clip-path: polygon(0% 0%, 100% 0%, calc(100% - 1rem) 100%, 1rem 100%);
    }

    .mobile-submenu {
        display: block !important;
        position: fixed;
        top: 5vh;
        width: 100%;
        padding: 0.2rem;
        left: 0;
        x-clip-path: polygon(0 0, 75% 0%, 100% 50%, 75% 100%, 0 100%, 0% 50%);
        z-index: 2;
        background: linear-gradient(to bottom, rgb(27, 79, 114) 0%, rgb(33, 33, 33) 100%);
        border-color: rgb(40, 116, 166);
        color: #fff;
        -webkit-mask: linear-gradient(to right, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.5) 75%, rgba(0, 0, 0, 0.25) 100%);
        mask: linear-gradient(to right, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.5) 75%, rgba(0, 0, 0, 0.25) 100%);
    }

    .mobile-fleet-btn {
        display: block !important;
        position: fixed;
        top: 5vh;
        padding: 0.2rem;
        left: 0;
        x-clip-path: polygon(0 0, 75% 0%, 100% 50%, 75% 100%, 0 100%, 0% 50%);
        z-index: 2;
        background: linear-gradient(to bottom, rgb(27, 79, 114) 0%, rgb(33, 33, 33) 100%);
        border-color: rgb(40, 116, 166);
        color: #fff;
        -webkit-mask: linear-gradient(to right, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.5) 75%, rgba(0, 0, 0, 0.25) 100%);
        mask: linear-gradient(to right, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.5) 75%, rgba(0, 0, 0, 0.25) 100%);
    }

    .mobile-queue-btn {
        display: block !important;
        position: fixed;
        top: 10.5vh;
        padding: 0.2rem;
        left: 0;
        x-clip-path: polygon(0 0, 75% 0%, 100% 50%, 75% 100%, 0 100%, 0% 50%);
        z-index: 2;
        background: linear-gradient(to bottom, rgb(27, 79, 114) 0%, rgb(33, 33, 33) 100%);
        border-color: rgb(40, 116, 166);
        color: #fff;
        -webkit-mask: linear-gradient(to right, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.5) 75%, rgba(0, 0, 0, 0.25) 100%);
        mask: linear-gradient(to right, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 25%, rgba(0, 0, 0, 0.75) 50%, rgba(0, 0, 0, 0.5) 75%, rgba(0, 0, 0, 0.25) 100%);
    }
}

.border-game-h-r0-w1-b0 {
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-width: 1px !important;
    border-bottom: none;
}

.border-game-h-r0-w1 {
    border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgba(18, 22, 24, 0) 25%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 75%, rgba(18, 22, 24, 0) 100%) 1 !important;
    border-width: 1px !important;
}

.border-game-v-r0-w1 {
    border-image: linear-gradient(to left, rgb(202, 233, 249) 0%, rgb(18, 22, 24) 50%, rgb(202, 233, 249) 100%) 1 !important;
    border-width: 1px !important;
}

.border-game-h-r0-w2 {
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-width: 2px !important;
}

.border-game-v-r0-w2 {
    border-image: linear-gradient(to left, rgb(202, 233, 249) 0%, rgb(18, 22, 24) 50%, rgb(202, 233, 249) 100%) 1 !important;
    border-width: 2px !important;
}

.border-game-h {
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-width: 2px !important;
    border-radius: 0.5rem !important;
}

.border-game-danger-h {
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, #7b1d1d 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-width: 2px !important;
    border-radius: 0.5rem !important;
}

.border-game-selected-h {
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, #aafffc 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-width: 2px !important;
    border-radius: 0.5rem !important;
}

.border-game-v {
    border-image: linear-gradient(to bottom, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-width: 2px !important;
    border-radius: 0.5rem !important;
}


.border-game-v-w1 {
    border-image: linear-gradient(to bottom, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 0.5) 25%, rgb(202, 233, 249) 50%, rgba(202, 233, 249, 0.5) 75%, rgba(18, 22, 24, 0) 100%) 1 !important;
    border-width: 1px !important;
    x-border-radius: 0.5rem !important;
}


.bg-resource-good {
    background: -webkit-radial-gradient(center bottom, #4fe38b, #277145);
}

.bg-resource-almost-full {
    background: -webkit-radial-gradient(center bottom, #fa921d, #7d490e);
}


.bg-resource-full {
    background: -webkit-radial-gradient(center bottom, #ed3737, #761B1B);
}


.bg-resource-901 {
    background: -webkit-radial-gradient(center bottom, #d9b03d, #dd5c03);
}

.bg-resource-902 {
    background: -webkit-radial-gradient(center bottom, #4fc6e1, #0070bb);
}

.bg-resource-903 {
    background: -webkit-radial-gradient(center bottom, #1abc9c, #0b5244);
}

.bg-resource-911 {
    background: -webkit-radial-gradient(center bottom, #ff0, #daa520);
}

.bg-resource-921 {
    background: -webkit-radial-gradient(center bottom, #594fb9, #32517c);
}

.progress-glow-success {
    border: none !important;
    box-shadow: 0 0 3px #96c902;
}

.bg-progress-success {
    background-color: #96c902 !important;
}

.card-ResearchController {
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 0.5) 50%, rgba(30, 30, 30, 1) 100%), url('assets/scifi-bs-html/bg/5.png'), url('gfx_dev/research_page/2.png') top center no-repeat !important;
}

.card-ogame:after {
    background: url('../../styles/legacy/ogame/navigation/sp_t_a_l.png') bottom left no-repeat, url('../../styles/legacy/ogame/navigation/sp_t_a_r.png') bottom right no-repeat;
    bottom: -4px;
    content: "";
    height: 50px;
    left: -9px;
    position: absolute;
    width: calc(100% + 18px);
    z-index: -1;
}


.card-game {
    background: linear-gradient(90deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 100%);
    background: rgba(20, 20, 20, 1);
    border: 0 solid rgba(255, 255, 255, 0.2);
    border-radius: 0;
    border-width: 1px 0;
    margin-bottom: 1rem;
    box-shadow: 0 0 35px 0 rgba(255, 255, 255, 0.15);
}

.card-game-selected {
    background: linear-gradient(to bottom, rgba(170, 255, 252, 0.02) 0%, rgba(170, 255, 252, 0.09) 100%);
    border: 0 solid rgba(170, 255, 252, 0.2);
    border-radius: 0;
    border-width: 1px 0;
    margin-bottom: 1rem;
    box-shadow: 0 0 35px 0 rgba(170, 255, 252, 0.15);
}

.card-game-success {
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.02) 0%, rgba(202, 233, 249, 0.09) 100%);
    border: 0 solid rgba(202, 233, 249, 0.2);
    border-radius: 0;
    border-width: 1px 0;
    margin-bottom: 1rem;
    box-shadow: 0 0 35px 0 rgba(202, 233, 249, 0.15);
}

.card-game-danger {
    background: linear-gradient(to bottom, rgba(237, 55, 55, 0.05) 0%, rgba(237, 55, 55, 0.1) 100%);
    border: 0 solid rgba(237, 55, 55, 0.2);
    border-radius: 0;
    border-width: 1px 0;
    margin-bottom: 1rem;
    box-shadow: 0 0 35px 0 rgba(237, 55, 55, 0.15);
}

.g-b-i-v {
    width: 2px;
    background: linear-gradient(to bottom, rgba(18, 22, 24, 0) 0%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 100%);
    height: 75%;
    clip-path: ellipse(100% 50% at 50% 50%);
}

.g-b-i-h {
    height: 2px;
    background: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 100%);
    width: 100%;
    /* clip-path: ellipse(100% 50% at 50% 50%); */
}

.bg-stars {
    background: url('../../styles/theme/backgrounds/stars.gif') !important;
}


.bg-stars.alert-danger {
    background: repeating-linear-gradient(0deg, rgba(237, 55, 55, 0) 0, rgba(237, 55, 55, 0) 2px, rgba(237, 55, 55, 0.1) 2px, rgba(237, 55, 55, 0.1) 4px), linear-gradient(to bottom, rgba(237, 55, 55, 0.05) 0%, rgba(237, 55, 55, 0.1) 100%), url('../../styles/theme/backgrounds/stars.gif') !important;
}

.bg-fancybox {
    background: linear-gradient(180deg, rgba(20, 20, 20, 0.25) 0%, rgba(30, 30, 30, 0.5) 100%), url(assets/scifi-bs-html/bg/4.svg), url(gfx_dev/wwwtyro/1yd9bkn02dgg/2048/back.webp) center / cover fixed;
}

.corner-border-top:before,
.corner-border-top:after,
.corner-border-bottom:before,
.corner-border-bottom:after {
    border: 0 solid #aafffc;
    content: "";
    height: 5px;
    position: absolute;
    width: 5px
}

.corner-border-top::before {
    border-left-width: 1px;
    border-top-width: 1px;
    left: 0;
    top: -1px;
}

.corner-border-top::after {
    border-right-width: 1px;
    border-top-width: 1px;
    right: 0;
    top: -1px;
}

.corner-border-bottom::before {
    border-bottom-width: 1px;
    border-left-width: 1px;
    bottom: -1px;
    left: 0;
}

.corner-border-bottom::after {
    border-bottom-width: 1px;
    border-right-width: 1px;
    bottom: -1px;
    right: 0;
}


.card-game-danger .corner-border-top:before, .card-game-danger .corner-border-top:after, .card-game-danger .corner-border-bottom:before, .card-game-danger .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #ed3737;
}

.card-game-danger .corner-border-top:before, .card-game-danger .corner-border-top:after, .card-game-danger .corner-border-bottom:before, .card-game-danger .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #ed3737;
}

.card-game-danger .corner-border-top:before, .card-game-danger .corner-border-top:after, .card-game-danger .corner-border-bottom:before, .card-game-danger .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #ed3737;
}

.card-game-danger .corner-border-top:before, .card-game-danger .corner-border-top:after, .card-game-danger .corner-border-bottom:before, .card-game-danger .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #ed3737;
}

.alert-danger .corner-border-top:before, .alert-danger .corner-border-top:after, .alert-danger .corner-border-bottom:before, .alert-danger .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #ed3737;
}

.alert-danger .corner-border-top:before, .alert-danger .corner-border-top:after, .alert-danger .corner-border-bottom:before, .alert-danger .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #ed3737;
}

.alert-danger .corner-border-top:before, .alert-danger .corner-border-top:after, .alert-danger .corner-border-bottom:before, .alert-danger .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #ed3737;
}

.alert-danger .corner-border-top:before, .alert-danger .corner-border-top:after, .alert-danger .corner-border-bottom:before, .alert-danger .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #ed3737;
}

.card-game .corner-border-top:before, .card-game .corner-border-top:after, .card-game .corner-border-bottom:before, .card-game .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: rgba(255, 255, 255, 0.2);
}

.card-game .corner-border-top:before, .card-game .corner-border-top:after, .card-game .corner-border-bottom:before, .card-game .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: rgba(255, 255, 255, 0.2);
}

.card-game .corner-border-top:before, .card-game .corner-border-top:after, .card-game .corner-border-bottom:before, .card-game .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: rgba(255, 255, 255, 0.2);
}

.card-game .corner-border-top:before, .card-game .corner-border-top:after, .card-game .corner-border-bottom:before, .card-game .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: rgba(255, 255, 255, 0.2);
}

.card-game-selected .corner-border-top:before, .card-game-selected .corner-border-top:after, .card-game-selected .corner-border-bottom:before, .card-game-selected .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #aafffc;
}

.card-game-selected .corner-border-top:before, .card-game-selected .corner-border-top:after, .card-game-selected .corner-border-bottom:before, .card-game-selected .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #aafffc;
}

.card-game-selected .corner-border-top:before, .card-game-selected .corner-border-top:after, .card-game-selected .corner-border-bottom:before, .card-game-selected .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #aafffc;
}

.card-game-selected .corner-border-top:before, .card-game-selected .corner-border-top:after, .card-game-selected .corner-border-bottom:before, .card-game-selected .corner-border-bottom:after, .bg-danger .corner-border-top:before, .bg-danger .corner-border-top:after, .bg-danger .corner-border-bottom:before, .bg-danger .corner-border-bottom:after {
    border-color: #aafffc;
}

.form-control-startrek {
    display: inline;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.2) 100%);
    border: 1px solid rgba(202, 233, 249, 0.7);
    color: #aafffc;
    padding: .125rem .5rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    -webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
}

.form-control-startrek:focus {
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.1) 0%, rgba(202, 233, 249, 0.2) 100%);
    border: 1px solid #2bede6;
    box-shadow: none;
    color: #aafffc
}

.form-control-startrek::placeholder {
    color: rgba(170, 255, 252, 0.28)
}

/* Styles for the overall appearance of the select element */
select {
    border: 1px solid rgba(0, 0, 0, 0.7);
    color: #000;
    padding: .125rem .5rem;
}

/* Styles for the selected option */
option:checked {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.2) 100%);
    border: 1px solid #000;
    color: #000;
}

/* Styles for the dropdown menu */
select,
option {
    background: #000;
    border: 1px solid rgba(202, 233, 249, 0.7);
    color: #aafffc;
}

/* Styles for the active and hovered states of dropdown options */
option.active,
option:hover,
option.selected {
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.1) 0%, rgba(202, 233, 249, 0.2) 100%);
    border-color: #2bede6;
}

.select2-container--default .select2-selection--single {
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.1) 0, rgba(30, 30, 30, 0.2) 100%);
    border: 1px solid rgba(30, 30, 30, 0.7);
    color: #aafffc;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: inherit;
}

.select2-dropdown {
    background: #000000 !important;
    border: 1px solid rgba(30, 30, 30, 0.7);
    color: #aafffc;
}

.select2-container--default .select2-results__option--selected {
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.1) 0, rgba(30, 30, 30, 0.2) 100%);
    border: 1px solid #2bede6;
    border-width: 1px 0;
    color: #aafffc;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.1) 0, rgba(30, 30, 30, 0.2) 100%);
    color: white;
}

/**
Start of Treantjs
 */
.Treant {
    position: relative;
    overflow: hidden;
    padding: 0 !important;
}

.Treant > .node,
.Treant > .pseudo {
    position: absolute;
    display: block;
    visibility: hidden;
}

.Treant.Treant-loaded .node,
.Treant.Treant-loaded .pseudo {
    visibility: visible;
}

.Treant > .pseudo {
    width: 0;
    height: 0;
    border: none;
    padding: 0;
}

.Treant .collapse-switch {
    width: 3px;
    height: 3px;
    display: block;
    border: 1px solid black;
    position: absolute;
    top: 1px;
    right: 1px;
    cursor: pointer;
}

.Treant .collapsed .collapse-switch {
    background-color: #868DEE;
}

.Treant > .node img {
    border: none;
    float: left;
}

.Treant > .node img {
    width: 50px;
    height: 50px;
}


/* optional Container STYLES */
.chart {
    border: none;
    overflow: scroll
}

.Treant > .node {
    cursor: pointer;
}

.Treant > p {
    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
    font-weight: bold;
    font-size: 12px;
}

#treant-container {
    position: relative;
}

#treant-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* Semi-transparent overlay */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1000; /* Ensure overlay is on top */
}

#treant-tech {
    background: radial-gradient(circle, rgba(22, 22, 22, 0) 0%, rgba(22, 22, 22, 0.75) 50%, rgb(22, 22, 22) 100%) fixed, url(assets/scifi-bs-html/bg/6.svg), rgb(20, 20, 20);
}

/**
End of treantjs
 */
/**
Start of Leaflet
 */

.leaflet-building-hex {
    position: relative;
    overflow: hidden;
    clip-path: polygon(26% 8%, 74% 8%, 98% 50%, 74% 92%, 26% 92%, 1% 50%);
}

.leaflet-building-hex::after, .leaflet-building-complete::after, .leaflet-building-warning::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 33%, rgba(0, 0, 0, 0.5) 66%, rgba(0, 0, 0, 0) 100%);
    width: 100%;
    height: 100%;
    z-index: -1;
}

.leaflet-building-complete::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(45deg, rgba(138, 150, 156, 0) 0px, rgba(138, 150, 156, 0) 2px, rgba(138, 150, 156, calc(0.1 * 2)) 2px, rgba(138, 150, 156, calc(0.1 * 2)) 4px), linear-gradient(45deg, rgba(138, 150, 156, calc(0.05 * 2)) 0%, rgba(138, 150, 156, calc(0.1 * 2)) 100%);
    z-index: -1;
}

.leaflet-building-warning::before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: repeating-linear-gradient(45deg, rgba(255, 195, 90, 0) 0px, rgba(255, 195, 90, 0) 2px, rgba(255, 195, 90, calc(0.1 * 4)) 2px, rgba(255, 195, 90, calc(0.1 * 4)) 4px), linear-gradient(45deg, rgba(255, 195, 90, calc(0.05 * 4)) 0%, rgba(255, 195, 90, calc(0.1 * 4)) 100%);
    z-index: -1;
}

.leaflet-container .leaflet-control-mouseposition {
    background-color: rgba(255, 255, 255, 0.7);
    box-shadow: 0 0 5px #bbb;
    padding: 0 5px;
    margin: 0;
    color: #333;
    font-size: 10px;
    font-family: 'Orbitron';
}

.leaflet-left .leaflet-control {
    margin-left: 3.5em;
}

.leaflet-marker-pane {
    z-index: -1;
}

.leaflet-control-container {
    z-index: 1000 !important;
}

.leaflet-marker-icon {
    z-index: 1000 !important;
}

.leaflet-fleet-icon, .leaflet-fleet-popup {
    transition: transform 1s linear;
}

.leaflet-overlay-pane {
    z-index: 1001 !important;
}

.leaflet-popup-pane {
    z-index: 1100 !important;
}

.leaflet-tooltip-pane-z8 {
    z-index: 1100 !important;
}

.leaflet-z-2000 {
    z-index: 2000 !important;
}

.leaflet-popup-galaxy {
    width: 15vw !important;
}

@media (max-width: 767.98px) {
    .leaflet-popup-galaxy {
        width: 75vw !important;
    }
}

.leaflet-popup {
    border-color: #aafffc !important;
    color: #aafffc !important;
    background: linear-gradient(to bottom, rgba(170, 255, 252, 0.1) 0%, rgba(170, 255, 252, 0.2) 100%), #000 !important;
}

.leaflet-popup-content-wrapper, .leaflet-popup-tip {
    background: none !important;
    border-radius: var(--ct-border-radius) !important;
    border: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
}

.leaflet-popup::before {
    content: none !important;
}

.leaflet-popup::before, .leaflet-tooltip::before {
    content: none !important;
}

.leaflet-game-success {
    border-color: #4fe38b !important;
    color: #4fe38b !important;
    background: linear-gradient(to bottom, rgba(79, 227, 139, 0.1) 0%, rgba(79, 227, 139, 0.2) 100%), #000 !important;
}

.leaflet-game-warning {
    border-color: #fa921d !important;
    color: #fa921d !important;
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%), #000 !important;
}

.leaflet-game-danger {
    border-color: #e91515 !important;
    color: #e91515 !important;
    background: linear-gradient(to bottom, rgba(237, 55, 55, 0.05) 0%, rgba(237, 55, 55, 0.1) 100%), #000 !important;
}

.leaflet-game-event {
    border-color: #2bede6 !important;
    color: #2bede6 !important;
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.1) 0%, rgba(202, 233, 249, 0.2) 100%), #000 !important;
}

.leaflet-game-empty {
    border-color: #222 !important;
    color: #222 !important;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.1) 100%), #000 !important;
}


.leaflet-game-self {
    border-color: #4fe38b !important;
    color: #4fe38b !important;
    background: linear-gradient(to bottom, rgba(79, 227, 139, 0.1) 0%, rgba(79, 227, 139, 0.2) 100%), #000 !important;
}

.leaflet-game-marauders {
    border-color: #e91515 !important;
    color: #e91515 !important;
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.50) 0%, rgba(30, 30, 30, 1) 100%), url(assets/galaxy_npc/marauders/portrait.webp) 90% center / contain no-repeat, url(assets/galaxy_npc/marauders/frame.webp) center / contain, url(assets/galaxy_stargaze/nebula/red_strawberry_jam/_ny.jpg) center / cover fixed no-repeat, #000 !important;
}

.leaflet-game-caravaneers {
    border-color: #e91515 !important;
    color: #e91515 !important;
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.50) 0%, rgba(30, 30, 30, 1) 100%), url(assets/galaxy_npc/caravaneers/portrait.webp) 90% center / contain no-repeat, url(assets/galaxy_npc/caravaneers/frame.webp) center / contain, url(assets/galaxy_stargaze/nebula/turquoise_spiralled/_px.jpg) center / cover fixed no-repeat, #000 !important;
}

/**
Leaflet for Buildings
 */

#overview-view-toggle {
    bottom: 80%;
    left: 50%;
    transform: translateX(-50%);
    position: fixed;
    font-size: xx-small;
}

@media (min-width: 767.98px) {

    #overview-view-toggle {
        bottom: 10%;
        left: 50%;
        transform: translateX(-50%);
        position: fixed;
        font-size: inherit;
    }
}

#planetMap {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.galaxy-effect-1 {
    z-index: -1 !important;
    opacity: 0.5;
}

.galaxy-effect-no-opacity {
    opacity: 1 !important;
}

.leaflet-game-nameplate {
    background: linear-gradient(180deg, rgba(20, 20, 20, 0) 0%, rgba(20, 20, 20, 1) 50%, rgba(20, 20, 20, 0) 100%);
    box-shadow: none;
    border: none;
}

.leaflet-game-top-hex-neutral {
    border-color: #aaa !important;
    color: #fff !important;
    font-weight: bolder;
    background: linear-gradient(to top, rgba(66, 66, 66, 0) 0%, rgba(66, 66, 66, 1) 50%, rgba(66, 66, 66, 1) 100%) !important;
}

.leaflet-game-top-hex-success {
    border-color: #4fe38b !important;
    color: #4fe38b !important;
    background: linear-gradient(to top, rgba(79, 227, 139, 0) 0%, rgba(0, 51, 0, 1) 50%, rgba(0, 51, 0, 1) 100%) !important;
}

.leaflet-game-top-hex-primary {
    border-color: #0f8bcb !important;
    color: #fff !important;
    background: linear-gradient(to top, rgba(79, 227, 139, 0) 0%, rgba(0, 51, 102, 1) 50%, rgba(0, 51, 102, 1) 100%) !important;
}

.leaflet-game-top-hex-warning {
    border-color: #fa921d !important;
    color: #fa921d !important;
    background: linear-gradient(to top, rgba(250, 146, 29, 0) 0%, rgba(102, 51, 0, 1) 50%, rgba(102, 51, 0, 1) 100%) !important;
}

.leaflet-game-top-hex-danger {
    border-color: #e91515 !important;
    color: #e91515 !important;
    background: linear-gradient(to top, rgba(237, 55, 55, 0) 0%, rgba(51, 0, 0, 1) 50%, rgba(51, 0, 0, 1) 100%) !important;
}

.leaflet-game-bottom-hex-neutral {
    border-color: #aaa !important;
    color: #fff !important;
    font-weight: bolder;
    background: linear-gradient(to bottom, rgba(66, 66, 66, 0) 0%, rgba(66, 66, 66, 1) 50%, rgba(66, 66, 66, 1) 100%) !important;
}

.leaflet-game-bottom-hex-success {
    border-color: #4fe38b !important;
    color: #4fe38b !important;
    background: linear-gradient(to bottom, rgba(79, 227, 139, 0) 0%, rgba(0, 51, 0, 1) 50%, rgba(0, 51, 0, 1) 100%) !important;
}

.leaflet-game-bottom-hex-primary {
    border-color: #0f8bcb !important;
    color: #0f8bcb !important;
    background: linear-gradient(to bottom, rgba(79, 227, 139, 0) 0%, rgba(0, 51, 102, 1) 50%, rgba(0, 51, 102, 1) 100%) !important;
}

.leaflet-game-bottom-hex-warning {
    border-color: #fa921d !important;
    color: #fa921d !important;
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0) 0%, rgba(102, 51, 0, 1) 50%, rgba(102, 51, 0, 1) 100%) !important;
}

.leaflet-game-bottom-hex-danger {
    border-color: #e91515 !important;
    color: #e91515 !important;
    background: linear-gradient(to bottom, rgba(237, 55, 55, 0) 0%, rgba(51, 0, 0, 1) 50%, rgba(51, 0, 0, 1) 100%) !important;
}

.leaflet-game-village {
    width: 85px !important;
    height: 100px !important;
    /* border-radius: 50% !important; */
    font-weight: 400;
    box-shadow: inset 0 0 2px 0 #fff;
    text-align: center;
    padding-top: 15px !important;
    border: none !important;
    clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
}

.leaflet-tooltip-top:before, .leaflet-tooltip-bottom:before, .leaflet-tooltip-left:before, .leaflet-tooltip-right:before {
    display: none !important;
    content: none !important;
}

.leaflet-game-top-hex {
    width: 115px;
    height: 32px;
    margin-top: 0.025rem;
    clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
    border: none;
    z-index: 12901 !important;
}

.leaflet-game-bottom-hex {
    width: 130px;
    height: 40px;
    margin-top: -0.5rem;
    clip-path: polygon(50% 100%, 0 0, 100% 0);
    border: none;
    z-index: 12901 !important;
}

@media (max-height: 549px) {
    .leaflet-game-top-hex {
        clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
        margin: 1px;
        width: 66px;
        height: 19px;
        line-height: 0;
        border: none;
        font-size: x-small;
    }

    .leaflet-game-bottom-hex {
        display: none;
    }
}

@media (max-width: 991px) {
    .leaflet-game-top-hex {
        clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
        margin: 1px;
        width: 66px;
        height: 19px;
        line-height: 0;
        border: none;
        font-size: x-small;
    }

    .leaflet-game-bottom-hex {
        display: none;
    }
}

@media (hover: none) {
    .leaflet-game-top-hex {
        clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
        margin: 1px;
        width: 66px;
        height: 19px;
        line-height: 0;
        border: none;
        font-size: x-small;
    }

    .leaflet-game-bottom-hex {
        display: none;
    }
}

@media (pointer: coarse) {
    .leaflet-game-top-hex {
        clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
        margin: 1px;
        width: 66px;
        height: 19px;
        line-height: 0;
        border: none;
        font-size: x-small;
    }

    .leaflet-game-bottom-hex {
        display: none;
    }
}


@keyframes leaflet-building-hover {
    0% {
        -webkit-filter: brightness(1) drop-shadow(0 0 3px rgba(255, 255, 255, 0.8));
        filter: brightness(1) drop-shadow(0 0 3px rgba(255, 255, 255, 0.8));
    }
    50% {
        -webkit-filter: brightness(1.25) drop-shadow(0 0 5px rgba(255, 255, 255, 1));
        filter: brightness(1.25) drop-shadow(0 0 5px rgba(255, 255, 255, 1));
    }
    100% {
        -webkit-filter: brightness(1) drop-shadow(0 0 3px rgba(255, 255, 255, 0.8));
        filter: brightness(1) drop-shadow(0 0 3px rgba(255, 255, 255, 0.8));
    }
}

.leaflet-building-hover {
    /*
    -webkit-filter: brightness(1.25) drop-shadow(0 0 3px rgba(255, 255, 0, 1));
    filter: brightness(1.25) drop-shadow(0 0 3px rgba(255, 255, 0, 1));
     */
    animation: leaflet-building-hover 1.5s ease-in-out infinite;
}

.leaflet-building-locked {
    filter: brightness(50%) grayscale(1);
}

@keyframes glowing {
    0% {
        -webkit-filter: brightness(1) drop-shadow(0 0 3px rgba(255, 255, 0, 0.8));
        filter: brightness(1) drop-shadow(0 0 3px rgba(255, 255, 0, 0.8));
    }
    50% {
        -webkit-filter: brightness(1.25) drop-shadow(0 0 5px rgba(255, 255, 0, 1));
        filter: brightness(1.25) drop-shadow(0 0 5px rgba(255, 255, 0, 1));
    }
    100% {
        -webkit-filter: brightness(1) drop-shadow(0 0 3px rgba(255, 255, 0, 0.8));
        filter: brightness(1) drop-shadow(0 0 3px rgba(255, 255, 0, 0.8));
    }
}


.PolygonGlowImageCSS {
    animation: glowing 1.5s ease-in-out infinite;
}

/**
noUI Sliders
 */

.noUi-horizontal .noUi-handle {
    width: 1rem !important;
    height: 1rem !important;
    inset-inline-end: -0.063rem !important;
    top: -0.375rem !important;
}

.noUi-handle:after,
.noUi-handle:before {
    height: 0.35rem !important;
    width: 1px !important;
    inset-inline-start: 0.3rem !important;
    top: 0.25rem !important;
}

.noUi-handle:after {
    inset-inline-start: 0.45rem !important;
}

.noUi-horizontal {
    height: 0.35rem !important;
}

.noUi-vertical {
    width: 0.35rem !important;
}

.noUi-vertical .noUi-handle {
    width: 1rem !important;
    height: 1rem !important;
}

.noUi-target {
    background: linear-gradient(to bottom right, rgb(32, 32, 37) 0%, #021e18 25%, rgb(32, 32, 37) 100%) !important;
    border: 1px solid #e8e8e8 !important;
    box-shadow: 0px 0.125rem 0.25rem rgba(0, 0, 0, 0.05) !important;
}

.noUi-handle {
    border: 1px solid #e8e8e8 !important;
    background: #010a07 !important;
    box-shadow: 0px 0.125rem 0.25rem rgba(0, 0, 0, 0.05) !important;
}

#result {
    border: 1px solid #e8e8e8 !important;
}

.noUi-handle:after,
.noUi-handle:before {
    background: var(rgba(0, 0, 0, 0.3)) !important;
}

.noUi-marker {
    position: absolute;
    background: #e8e8e8 !important;
}

.noUi-tooltip {
    border: 1px solid #e8e8e8 !important;
    border-radius: 0.25rem !important;
    background: #010a07 !important;
    color: rgb(255, 255, 255) !important;
    padding: 0.25rem 0.75rem !important;
    font-size: 0.95rem !important;
    line-height: 1 !important;
}

#slider-fit {
    padding: 0 1rem;
}

.noUi-connect {
    background: rgb(202, 233, 249) !important;
}

.noUi-fleet .noUi-marker {
    background: rgb(50, 50, 50) !important;
}

.noUi-fleet .noUi-connect {
    background: rgba(255, 255, 255, 0.25) !important;
}

.noUi-fleet .noUi-base {
    background: linear-gradient(90deg, rgba(100, 0, 0, 1) 0%, rgba(0, 100, 0, 1) 50%, rgba(100, 0, 0, 1) 100%);
}

.noUi-fleet .noUi-pips-horizontal {
    padding: 0;
}

.noUi-vertical .noUi-handle {
    bottom: -0.275rem !important;
    inset-inline-end: -0.375rem;
}

#secondary-colored-slider .noUi-connect {
    background-color: rgb(var(--secondary-rgb)) !important;
}

#warning-colored-slider .noUi-connect {
    background-color: rgb(var(--warning-rgb)) !important;
}

#info-colored-slider .noUi-connect {
    background-color: rgb(72, 247, 238) !important;
}

#success-colored-slider .noUi-connect {
    background-color: rgb(var(--success-rgb)) !important;
}

#danger-colored-slider .noUi-connect {
    background-color: rgb(var(--danger-rgb)) !important;
}

.noUi-slider-round {
    height: 0.625rem !important;
}

.noUi-slider-round .noUi-handle {
    height: 1.125rem !important;
    width: 1.125rem !important;
    inset-block-start: -0.313rem !important;
    inset-inline-end: -0.563rem;
    border-radius: 50px !important;
    background-color: rgb(202, 233, 249) !important;
    border: 1px solid #010a07 !important;
}

.noUi-slider-round .noUi-handle:before,
.noUi-slider-round .noUi-handle:after {
    display: none !important;
}

#slider-square {
    border-radius: 0 !important;
}

#slider-square .noUi-handle {
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    background: rgb(202, 233, 249) !important;
    height: 1.125rem !important;
    width: 1.125rem !important;
    inset-block-start: -0.45rem !important;
    inset-inline-end: -0.563rem !important;
}

#slider-square .noUi-handle:before,
#slider-square .noUi-handle:after {
    display: none !important;
}

#color1,
#color2,
#color3 {
    margin: 0.625rem !important;
    display: inline-block !important;
    height: 12.5rem !important;
}

#colorpicker {
    height: 15rem !important;
    width: 19.375rem !important;
    margin: 0 auto !important;
    padding: 0.625rem !important;
    border: 1px solid #e8e8e8 !important;
}

#result {
    margin: 4.25rem 0 4.25rem 4rem;
    height: 6.25rem;
    width: 6.25rem;
    display: inline-block;
    vertical-align: top;
    color: #949eb7;
    background: #949eb7;
    border: 1px solid #fff;
    box-shadow: 0 0 0.625rem;
}

#color1 .noUi-connect {
    background: rgb(var(--danger-rgb)) !important;
}

#color2 .noUi-connect {
    background: rgb(var(--secondary-rgb)) !important;
}

#color3 .noUi-connect {
    background: rgb(202, 233, 249) !important;
}

#slider-hide .noUi-tooltip {
    display: none;
}

#slider-hide .noUi-active .noUi-tooltip {
    display: block;
}

/**
Start of Leaflet Galaxy
 */
#galaxyMap {
    background: url('../../styles/legacy/backgrounds/stars.gif') center !important;
}

#galaxyMiniMap {
    width: 200px;
    height: 200px;
    position: absolute;
    border: 1px solid #ccc;
    z-index: 1000;
    top: 0;
}

#galaxyMap {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.sq-15px {
    width: 15px;
    height: 15px
}

.sq-20px {
    width: 20px;
    height: 20px
}

.sq-25px {
    width: 25px;
    height: 25px
}

.sq-35px {
    width: 35px;
    height: 35px
}

.sq-50px {
    width: 50px;
    height: 50px
}

.w-50px {
    width: 50px !important;
}

.w-100px {
    width: 100px !important;
}

.w-150px {
    width: 150px !important;
}

.w-200px {
    width: 200px !important;
}

.h-100px {
    height: 100px !important;
}

.h-200px {
    height: 200px !important;
}

.galaxy-username-5 {
    margin: 0 0 0 15px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    z-index: 2;
}

.galaxy-username-6 {
    margin: 0 0 0 17px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    z-index: 2;
}

.galaxy-username-7 {
    margin: 0 0 0 22px;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    z-index: 2;
}

.leaflet-pointer-events-none {
    pointer-events: none !important;
}

.leaflet-pointer-events {
    pointer-events: auto !important;
}

.leaflet-galaxy-loading-spinner {
    pointer-events: none;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1050;
    z-index: 1 !important;
    width: 100vw;
    height: 100vh;
    /* background: repeating-linear-gradient(-45deg, rgba(170, 170, 170, 0) 0px, rgba(170, 170, 170, 0) 20px, rgba(170, 170, 170, 0.1) 20px, rgba(170, 170, 170, 0.1) 40px), rgb(20, 20, 20, 0.25); */
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    flex-direction: column;
}

.leaflet-galaxy-core {
    z-index: -1 !important;
    opacity: 0.85 !important;
}

.leaflet-galaxy-effect-centered {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.leaflet-translucid-nebula {
    opacity: 0.75;
}

.leaflet-galaxy-size-8192-8192 {
    position: relative;
    width: 8192px;
    height: 8192px;
}

.leaflet-galaxy-size-4096-4096 {
    position: relative;
    width: 4096px;
    height: 4096px;
}

.leaflet-galaxy-size-2048-2048 {
    position: relative;
    width: 2048px;
    height: 2048px;
}

.leaflet-galaxy-size-1024-1024 {
    position: relative;
    width: 1024px;
    height: 1024px;
}

.leaflet-galaxy-size-512-512 {
    position: relative;
    width: 512px;
    height: 512px;
}

.leaflet-galaxy-size-256-256 {
    position: relative;
    width: 256px;
    height: 256px;
}

.leaflet-hue-1, .image-hue-45 {
    filter: hue-rotate(45deg);
}

.leaflet-hue-2, .image-hue-90 {
    filter: hue-rotate(90deg);
}

.leaflet-hue-3, .image-hue-135 {
    filter: hue-rotate(180deg);
}

.leaflet-hue-4, .image-hue-180 {
    filter: hue-rotate(180deg);
}

.leaflet-hue-5, .image-hue-225 {
    filter: hue-rotate(225deg);
}

.leaflet-hue-6, .image-hue-270 {
    filter: hue-rotate(270deg);
}

.leaflet-hue-7, .image-hue-315 {
    filter: hue-rotate(315deg);
}

.leaflet-galaxy-core-rotate {
    z-index: -1 !important;
    opacity: 0.85 !important;
    -webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    -ms-transform-origin: center center;
    -o-transform-origin: center center;
    transform-origin: center center;
    animation: galaxy-move-self 1000s linear infinite;
}

@keyframes galaxy-move-self {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

.leaflet-galaxy-effect-circle {
    z-index: -1 !important;
    opacity: 0.85 !important;
    -webkit-transform-origin: center center;
    -moz-transform-origin: center center;
    -ms-transform-origin: center center;
    -o-transform-origin: center center;
    transform-origin: center center;
    animation: galaxy-move-circle 30s linear infinite;
}

@keyframes galaxy-move-circle {
    0% {
        transform: translate(10px, 0px);
    }
    12.5% {
        transform: translate(7.07px, 7.07px);
    }
    25% {
        transform: translate(0px, 10px);
    }
    37.5% {
        transform: translate(-7.07px, 7.07px);
    }
    50% {
        transform: translate(-10px, 0px);
    }
    62.5% {
        transform: translate(-7.07px, -7.07px);
    }
    75% {
        transform: translate(0px, -10px);
    }
    87.5% {
        transform: translate(7.07px, -7.07px);
    }
    100% {
        transform: translate(10px, 0px);
    }
}

.leaflet-game-star {
    border-color: #fa921d !important;
    color: #fa921d !important;
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%), #000 !important;
}


.leaflet-game-star-F {
    border-color: #fa921d !important;
    color: #fa921d !important;
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%), linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 1) 50px, rgba(0, 0, 0, 1) 100px, rgba(0, 0, 0, 1) 100%), url('universe/xyheaders/F.webp') bottom left / 200px no-repeat, url('../../styles/legacy/backgrounds/stars.gif') center !important
}


.leaflet-game-star-G {
    border-color: #fa921d !important;
    color: #fa921d !important;
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%), linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 1) 50px, rgba(0, 0, 0, 1) 100px, rgba(0, 0, 0, 1) 100%), url('universe/xyheaders/G.webp') bottom left / 200px no-repeat, url('../../styles/legacy/backgrounds/stars.gif') center !important
}

.leaflet-game-star-K {
    border-color: #fa921d !important;
    color: #fa921d !important;
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%), linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 1) 50px, rgba(0, 0, 0, 1) 100px, rgba(0, 0, 0, 1) 100%), url('universe/xyheaders/K.webp') bottom left / 200px no-repeat, url('../../styles/legacy/backgrounds/stars.gif') center !important
}

.leaflet-game-star-M {
    border-color: #fa921d !important;
    color: #fa921d !important;
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%), linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 1) 50px, rgba(0, 0, 0, 1) 100px, rgba(0, 0, 0, 1) 100%), url('universe/xyheaders/M.webp') bottom left / 200px no-repeat, url('../../styles/legacy/backgrounds/stars.gif') center !important
}

.leaflet-user {
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    top: 17px;
    height: 15px;
    width: 64px;
    font-size: x-small;
    line-height: 0;
    border: none;
    border-radius: 0;
    z-index: 2001 !important;
}

.leaflet-user-5, .leaflet-user-6, .leaflet-user-7 {
    background: none;
    padding: 0 0 0 0;
    margin: 0 0 0 0;
    height: auto;
    border: none;
    border-radius: 0;
    z-index: 2001 !important;
}

.leaflet-user-5 {
    top: 0;
    width: 0;
    display: none;
}

.leaflet-user-6 {
    top: 15px;
    width: 65px;
    font-size: xx-small;
    line-height: 1.5;
}

.leaflet-user-7 {
    top: 30px;
    width: 120px;
    font-size: x-small;
    line-height: 2;
}

.leaflet-user-5:before, .leaflet-user-6:before, .leaflet-user-7:before {
    border-bottom-color: transparent;
}

.leaflet-user-5-npc, .leaflet-user-6-npc, .leaflet-user-7-npc {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(202, 233, 249);
}

.leaflet-user-5-asteroid_901, .leaflet-user-6-asteroid_901, .leaflet-user-7-asteroid_901 {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(217, 176, 61) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(217, 176, 61);
}

.leaflet-user-5-asteroid_902, .leaflet-user-6-asteroid_902, .leaflet-user-7-asteroid_902 {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(79, 198, 225) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(79, 198, 225);
}

.leaflet-user-5-asteroid_903, .leaflet-user-6-asteroid_903, .leaflet-user-7-asteroid_903,
.leaflet-user-5-debris, .leaflet-user-6-debris, .leaflet-user-7-debris {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(26, 188, 156) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(26, 188, 156);
}

.leaflet-user-5-asteroid_911, .leaflet-user-6-asteroid_911, .leaflet-user-7-asteroid_911 {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(255, 255, 0) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(255, 255, 0);
}

.leaflet-user-5-event, .leaflet-user-6-event, .leaflet-user-7-event {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(0, 112, 187) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(0, 112, 187);
}

.leaflet-user-5-neutral, .leaflet-user-6-neutral, .leaflet-user-7-neutral {
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(127, 127, 127) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(127, 127, 127);
}

.leaflet-user-nameplate-default {
    /*border: 1px solid;*/
    /*border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;*/
    /*border-radius: 0 !important;*/
    border: 1px solid;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(127, 127, 127) 50%, rgb(127, 127, 127) 100%) 1 !important;
    border-radius: 0 !important;
    background: linear-gradient(180deg, rgba(20, 20, 20, 1) 0%, rgba(30, 30, 30, 1) 200px, rgba(20, 20, 20, 1) 100%);
    color: rgb(127, 127, 127);
    text-align: end;
    padding-right: 1px;
}

.leaflet-user-nameplate-anim {
    top: 0;
    height: 100%;
    inset-inline-end: 0;
    object-position: right;
    pointer-events: none;
    position: absolute;
    transition: opacity .3s ease, transform .3s ease;
    width: 100%;
}

.galaxy-username-6 > .leaflet-user-nameplate-anim-img {
    top: 0;
    left: -60%;
    width: 200%;
    object-fit: none;
}

.galaxy-username-7 > .leaflet-user-nameplate-anim-img {
    top: 0;
    left: -80%;
    width: 200%;
    object-fit: none;
}

.position-relative > .leaflet-user-nameplate-anim-img {
    top: 0;
    left: 0;
    width: 110%;
    height: 200%;
    object-fit: none;
}

@property --x {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 100%;
}

.leaflet-planet-night {
    /*
    mix-blend-mode: multiply;
    animation: nightCycle 60s ease-in-out infinite;
    mask-image: radial-gradient(circle at var(--x, 100%) center, rgba(0, 0, 0, 0.85) 45%, rgba(0, 0, 0, 0) 75%);
    -webkit-mask-image: radial-gradient(circle at var(--x, 100%) center, rgba(0, 0, 0, 0.85) 45%, rgba(0, 0, 0, 0) 75%);
     */
}

.leaflet-planet-day-alpine {
    filter: drop-shadow(0 0 0.75rem #687672);
}

.leaflet-planet-day-arctic {
    filter: drop-shadow(0 0 0.75rem #5e717f);
}

.leaflet-planet-day-tundra {
    filter: drop-shadow(0 0 0.75rem #838a84);
}

.leaflet-planet-day-arid {
    filter: drop-shadow(0 0 0.75rem #8d8270);
}

.leaflet-planet-day-desert {
    filter: drop-shadow(0 0 0.75rem #8b7157);
}

.leaflet-planet-day-savanna {
    filter: drop-shadow(0 0 0.75rem #988c72);
}

.leaflet-planet-day-continental {
    filter: drop-shadow(0 0 0.75rem #38586d);
}

.leaflet-planet-day-ocean {
    filter: drop-shadow(0 0 0.75rem #58756f);
}

.leaflet-planet-day-tropical {
    filter: drop-shadow(0 0 0.75rem #488175);
}

.leaflet-planet-day-gaia {
    filter: drop-shadow(0 0 0.75rem #1a6b55);
}


.zindex0 {
    z-index: 0 !important;
}

/**
End of Leaflet
 */
/**
Start of Medieval map
 */

#planetMap-container .btn-district.planetMap-district-slot-1:hover ~ svg.planetMap-field .planetMap-district-slot-1,
#planetMap-container .btn-district.planetMap-district-slot-2:hover ~ svg.planetMap-field .planetMap-district-slot-2,
#planetMap-container .btn-district.planetMap-district-slot-3:hover ~ svg.planetMap-field .planetMap-district-slot-3,
#planetMap-container .btn-district.planetMap-district-slot-4:hover ~ svg.planetMap-field .planetMap-district-slot-4,
#planetMap-container .btn-district.planetMap-district-slot-5:hover ~ svg.planetMap-field .planetMap-district-slot-5,
#planetMap-container .btn-district.planetMap-district-slot-6:hover ~ svg.planetMap-field .planetMap-district-slot-6,
#planetMap-container .btn-district.planetMap-district-slot-7:hover ~ svg.planetMap-field .planetMap-district-slot-7,
#planetMap-container .btn-district.planetMap-district-slot-8:hover ~ svg.planetMap-field .planetMap-district-slot-8,
#planetMap-container .btn-district.planetMap-district-slot-9:hover ~ svg.planetMap-field .planetMap-district-slot-9,
#planetMap-container .btn-district.planetMap-district-slot-10:hover ~ svg.planetMap-field .planetMap-district-slot-10,
#planetMap-container .btn-district.planetMap-district-slot-11:hover ~ svg.planetMap-field .planetMap-district-slot-11,
#planetMap-container .btn-district.planetMap-district-slot-12:hover ~ svg.planetMap-field .planetMap-district-slot-12,
#planetMap-container .btn-district.planetMap-district-slot-13:hover ~ svg.planetMap-field .planetMap-district-slot-13,
#planetMap-container .btn-district.planetMap-district-slot-14:hover ~ svg.planetMap-field .planetMap-district-slot-14,
#planetMap-container .btn-district.planetMap-district-slot-15:hover ~ svg.planetMap-field .planetMap-district-slot-15,
#planetMap-container .btn-district.planetMap-district-slot-16:hover ~ svg.planetMap-field .planetMap-district-slot-16,
#planetMap-container .btn-district.planetMap-district-slot-17:hover ~ svg.planetMap-field .planetMap-district-slot-17,
#planetMap-container .btn-district.planetMap-district-slot-18:hover ~ svg.planetMap-field .planetMap-district-slot-18,
#planetMap-container .btn-district.planetMap-district-slot-19:hover ~ svg.planetMap-field .planetMap-district-slot-19,
#planetMap-container .btn-district.planetMap-district-slot-20:hover ~ svg.planetMap-field .planetMap-district-slot-20,
#planetMap-container .btn-district.planetMap-district-slot-21:hover ~ svg.planetMap-field .planetMap-district-slot-21,
#planetMap-container .btn-district.planetMap-district-slot-22:hover ~ svg.planetMap-field .planetMap-district-slot-22,
#planetMap-container .btn-district.planetMap-district-slot-23:hover ~ svg.planetMap-field .planetMap-district-slot-23,
#planetMap-container .btn-district.planetMap-district-slot-24:hover ~ svg.planetMap-field .planetMap-district-slot-24,
#planetMap-container .btn-district.planetMap-district-slot-25:hover ~ svg.planetMap-field .planetMap-district-slot-25,
#planetMap-container .btn-district.planetMap-district-slot-26:hover ~ svg.planetMap-field .planetMap-district-slot-26,
#planetMap-container .btn-district.planetMap-district-slot-27:hover ~ svg.planetMap-field .planetMap-district-slot-27,
#planetMap-container .btn-district.planetMap-district-slot-28:hover ~ svg.planetMap-field .planetMap-district-slot-28,
#planetMap-container .btn-district.planetMap-district-slot-29:hover ~ svg.planetMap-field .planetMap-district-slot-29,
#planetMap-container .btn-district.planetMap-district-slot-30:hover ~ svg.planetMap-field .planetMap-district-slot-30,
#planetMap-container .btn-district.planetMap-district-slot-31:hover ~ svg.planetMap-field .planetMap-district-slot-31,
#planetMap-container .btn-district.planetMap-district-slot-32:hover ~ svg.planetMap-field .planetMap-district-slot-32,
#planetMap-container .btn-district.planetMap-district-slot-33:hover ~ svg.planetMap-field .planetMap-district-slot-33,
#planetMap-container .btn-district.planetMap-district-slot-34:hover ~ svg.planetMap-field .planetMap-district-slot-34,
#planetMap-container .btn-district.planetMap-district-slot-35:hover ~ svg.planetMap-field .planetMap-district-slot-35,
#planetMap-container svg.planetMap-field > path:hover, #planetMap-container svg.villageCenter > path:hover {
    fill: rgba(255, 255, 255, 0.2);
    stroke: rgba(255, 255, 255, 0.5);
    stroke-width: 2
}

#planetMap-container .btn-district.planetMap-district-slot-1:active ~ svg.planetMap-field .planetMap-district-slot-1,
#planetMap-container .btn-district.planetMap-district-slot-2:active ~ svg.planetMap-field .planetMap-district-slot-2,
#planetMap-container .btn-district.planetMap-district-slot-3:active ~ svg.planetMap-field .planetMap-district-slot-3,
#planetMap-container .btn-district.planetMap-district-slot-4:active ~ svg.planetMap-field .planetMap-district-slot-4,
#planetMap-container .btn-district.planetMap-district-slot-5:active ~ svg.planetMap-field .planetMap-district-slot-5,
#planetMap-container .btn-district.planetMap-district-slot-6:active ~ svg.planetMap-field .planetMap-district-slot-6,
#planetMap-container .btn-district.planetMap-district-slot-7:active ~ svg.planetMap-field .planetMap-district-slot-7,
#planetMap-container .btn-district.planetMap-district-slot-8:active ~ svg.planetMap-field .planetMap-district-slot-8,
#planetMap-container .btn-district.planetMap-district-slot-9:active ~ svg.planetMap-field .planetMap-district-slot-9,
#planetMap-container .btn-district.planetMap-district-slot-10:active ~ svg.planetMap-field .planetMap-district-slot-10,
#planetMap-container .btn-district.planetMap-district-slot-11:active ~ svg.planetMap-field .planetMap-district-slot-11,
#planetMap-container .btn-district.planetMap-district-slot-12:active ~ svg.planetMap-field .planetMap-district-slot-12,
#planetMap-container .btn-district.planetMap-district-slot-13:active ~ svg.planetMap-field .planetMap-district-slot-13,
#planetMap-container .btn-district.planetMap-district-slot-14:active ~ svg.planetMap-field .planetMap-district-slot-14,
#planetMap-container .btn-district.planetMap-district-slot-15:active ~ svg.planetMap-field .planetMap-district-slot-15,
#planetMap-container .btn-district.planetMap-district-slot-16:active ~ svg.planetMap-field .planetMap-district-slot-16,
#planetMap-container .btn-district.planetMap-district-slot-17:active ~ svg.planetMap-field .planetMap-district-slot-17,
#planetMap-container .btn-district.planetMap-district-slot-18:active ~ svg.planetMap-field .planetMap-district-slot-18,
#planetMap-container .btn-district.planetMap-district-slot-19:active ~ svg.planetMap-field .planetMap-district-slot-19,
#planetMap-container .btn-district.planetMap-district-slot-20:active ~ svg.planetMap-field .planetMap-district-slot-20,
#planetMap-container .btn-district.planetMap-district-slot-21:active ~ svg.planetMap-field .planetMap-district-slot-21,
#planetMap-container .btn-district.planetMap-district-slot-22:active ~ svg.planetMap-field .planetMap-district-slot-22,
#planetMap-container .btn-district.planetMap-district-slot-23:active ~ svg.planetMap-field .planetMap-district-slot-23,
#planetMap-container .btn-district.planetMap-district-slot-24:active ~ svg.planetMap-field .planetMap-district-slot-24,
#planetMap-container .btn-district.planetMap-district-slot-25:active ~ svg.planetMap-field .planetMap-district-slot-25,
#planetMap-container .btn-district.planetMap-district-slot-26:active ~ svg.planetMap-field .planetMap-district-slot-26,
#planetMap-container .btn-district.planetMap-district-slot-27:active ~ svg.planetMap-field .planetMap-district-slot-27,
#planetMap-container .btn-district.planetMap-district-slot-28:active ~ svg.planetMap-field .planetMap-district-slot-28,
#planetMap-container .btn-district.planetMap-district-slot-29:active ~ svg.planetMap-field .planetMap-district-slot-29,
#planetMap-container .btn-district.planetMap-district-slot-30:active ~ svg.planetMap-field .planetMap-district-slot-30,
#planetMap-container .btn-district.planetMap-district-slot-31:active ~ svg.planetMap-field .planetMap-district-slot-31,
#planetMap-container .btn-district.planetMap-district-slot-32:active ~ svg.planetMap-field .planetMap-district-slot-32,
#planetMap-container .btn-district.planetMap-district-slot-33:active ~ svg.planetMap-field .planetMap-district-slot-33,
#planetMap-container .btn-district.planetMap-district-slot-34:active ~ svg.planetMap-field .planetMap-district-slot-34,
#planetMap-container .btn-district.planetMap-district-slot-35:active ~ svg.planetMap-field .planetMap-district-slot-35,
#planetMap-container svg.planetMap-field > path:active,
#planetMap-container svg.villageCenter > path:active {
    fill: rgba(255, 255, 255, 0.35);
    stroke: rgba(255, 255, 255, 0.5);
    stroke-width: 2
}

#planetMap-container .btn-district.planetMap-district-slot-1:hover ~ svg.planetMap-field .planetMap-district-slot-1.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-2:hover ~ svg.planetMap-field .planetMap-district-slot-2.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-3:hover ~ svg.planetMap-field .planetMap-district-slot-3.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-4:hover ~ svg.planetMap-field .planetMap-district-slot-4.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-5:hover ~ svg.planetMap-field .planetMap-district-slot-5.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-6:hover ~ svg.planetMap-field .planetMap-district-slot-6.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-7:hover ~ svg.planetMap-field .planetMap-district-slot-7.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-8:hover ~ svg.planetMap-field .planetMap-district-slot-8.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-9:hover ~ svg.planetMap-field .planetMap-district-slot-9.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-10:hover ~ svg.planetMap-field .planetMap-district-slot-10.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-11:hover ~ svg.planetMap-field .planetMap-district-slot-11.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-12:hover ~ svg.planetMap-field .planetMap-district-slot-12.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-13:hover ~ svg.planetMap-field .planetMap-district-slot-13.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-14:hover ~ svg.planetMap-field .planetMap-district-slot-14.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-15:hover ~ svg.planetMap-field .planetMap-district-slot-15.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-16:hover ~ svg.planetMap-field .planetMap-district-slot-16.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-17:hover ~ svg.planetMap-field .planetMap-district-slot-17.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-18:hover ~ svg.planetMap-field .planetMap-district-slot-18.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-19:hover ~ svg.planetMap-field .planetMap-district-slot-19.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-20:hover ~ svg.planetMap-field .planetMap-district-slot-20.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-21:hover ~ svg.planetMap-field .planetMap-district-slot-21.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-22:hover ~ svg.planetMap-field .planetMap-district-slot-22.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-23:hover ~ svg.planetMap-field .planetMap-district-slot-23.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-24:hover ~ svg.planetMap-field .planetMap-district-slot-24.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-25:hover ~ svg.planetMap-field .planetMap-district-slot-25.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-26:hover ~ svg.planetMap-field .planetMap-district-slot-26.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-27:hover ~ svg.planetMap-field .planetMap-district-slot-27.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-28:hover ~ svg.planetMap-field .planetMap-district-slot-28.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-29:hover ~ svg.planetMap-field .planetMap-district-slot-29.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-30:hover ~ svg.planetMap-field .planetMap-district-slot-30.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-31:hover ~ svg.planetMap-field .planetMap-district-slot-31.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-32:hover ~ svg.planetMap-field .planetMap-district-slot-32.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-33:hover ~ svg.planetMap-field .planetMap-district-slot-33.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-34:hover ~ svg.planetMap-field .planetMap-district-slot-34.planetMap-district-class-mine-1,
#planetMap-container .btn-district.planetMap-district-slot-35:hover ~ svg.planetMap-field .planetMap-district-slot-35.planetMap-district-class-mine-1,
#planetMap-container svg.planetMap-field > path.planetMap-district-class-mine-1:hover {
    fill: rgba(128, 76, 0, 0.75);
    stroke: rgba(255, 152, 0, 0.75);
    stroke-width: 2;
}

#planetMap-container .btn-district.planetMap-district-slot-1:hover ~ svg.planetMap-field .planetMap-district-slot-1.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-2:hover ~ svg.planetMap-field .planetMap-district-slot-2.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-3:hover ~ svg.planetMap-field .planetMap-district-slot-3.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-4:hover ~ svg.planetMap-field .planetMap-district-slot-4.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-5:hover ~ svg.planetMap-field .planetMap-district-slot-5.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-6:hover ~ svg.planetMap-field .planetMap-district-slot-6.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-7:hover ~ svg.planetMap-field .planetMap-district-slot-7.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-8:hover ~ svg.planetMap-field .planetMap-district-slot-8.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-9:hover ~ svg.planetMap-field .planetMap-district-slot-9.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-10:hover ~ svg.planetMap-field .planetMap-district-slot-10.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-11:hover ~ svg.planetMap-field .planetMap-district-slot-11.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-12:hover ~ svg.planetMap-field .planetMap-district-slot-12.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-13:hover ~ svg.planetMap-field .planetMap-district-slot-13.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-14:hover ~ svg.planetMap-field .planetMap-district-slot-14.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-15:hover ~ svg.planetMap-field .planetMap-district-slot-15.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-16:hover ~ svg.planetMap-field .planetMap-district-slot-16.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-17:hover ~ svg.planetMap-field .planetMap-district-slot-17.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-18:hover ~ svg.planetMap-field .planetMap-district-slot-18.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-19:hover ~ svg.planetMap-field .planetMap-district-slot-19.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-20:hover ~ svg.planetMap-field .planetMap-district-slot-20.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-21:hover ~ svg.planetMap-field .planetMap-district-slot-21.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-22:hover ~ svg.planetMap-field .planetMap-district-slot-22.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-23:hover ~ svg.planetMap-field .planetMap-district-slot-23.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-24:hover ~ svg.planetMap-field .planetMap-district-slot-24.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-25:hover ~ svg.planetMap-field .planetMap-district-slot-25.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-26:hover ~ svg.planetMap-field .planetMap-district-slot-26.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-27:hover ~ svg.planetMap-field .planetMap-district-slot-27.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-28:hover ~ svg.planetMap-field .planetMap-district-slot-28.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-29:hover ~ svg.planetMap-field .planetMap-district-slot-29.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-30:hover ~ svg.planetMap-field .planetMap-district-slot-30.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-31:hover ~ svg.planetMap-field .planetMap-district-slot-31.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-32:hover ~ svg.planetMap-field .planetMap-district-slot-32.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-33:hover ~ svg.planetMap-field .planetMap-district-slot-33.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-34:hover ~ svg.planetMap-field .planetMap-district-slot-34.planetMap-district-class-mine-2,
#planetMap-container .btn-district.planetMap-district-slot-35:hover ~ svg.planetMap-field .planetMap-district-slot-35.planetMap-district-class-mine-2,
#planetMap-container svg.planetMap-field > path.planetMap-district-class-mine-2:hover {
    fill: rgba(1, 84, 122, 0.75);
    stroke: rgba(3, 169, 244, 0.75);
    stroke-width: 2;
}

#planetMap-container .btn-district.planetMap-district-slot-1:hover ~ svg.planetMap-field .planetMap-district-slot-1.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-2:hover ~ svg.planetMap-field .planetMap-district-slot-2.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-3:hover ~ svg.planetMap-field .planetMap-district-slot-3.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-4:hover ~ svg.planetMap-field .planetMap-district-slot-4.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-5:hover ~ svg.planetMap-field .planetMap-district-slot-5.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-6:hover ~ svg.planetMap-field .planetMap-district-slot-6.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-7:hover ~ svg.planetMap-field .planetMap-district-slot-7.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-8:hover ~ svg.planetMap-field .planetMap-district-slot-8.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-9:hover ~ svg.planetMap-field .planetMap-district-slot-9.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-10:hover ~ svg.planetMap-field .planetMap-district-slot-10.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-11:hover ~ svg.planetMap-field .planetMap-district-slot-11.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-12:hover ~ svg.planetMap-field .planetMap-district-slot-12.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-13:hover ~ svg.planetMap-field .planetMap-district-slot-13.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-14:hover ~ svg.planetMap-field .planetMap-district-slot-14.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-15:hover ~ svg.planetMap-field .planetMap-district-slot-15.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-16:hover ~ svg.planetMap-field .planetMap-district-slot-16.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-17:hover ~ svg.planetMap-field .planetMap-district-slot-17.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-18:hover ~ svg.planetMap-field .planetMap-district-slot-18.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-19:hover ~ svg.planetMap-field .planetMap-district-slot-19.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-20:hover ~ svg.planetMap-field .planetMap-district-slot-20.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-21:hover ~ svg.planetMap-field .planetMap-district-slot-21.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-22:hover ~ svg.planetMap-field .planetMap-district-slot-22.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-23:hover ~ svg.planetMap-field .planetMap-district-slot-23.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-24:hover ~ svg.planetMap-field .planetMap-district-slot-24.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-25:hover ~ svg.planetMap-field .planetMap-district-slot-25.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-26:hover ~ svg.planetMap-field .planetMap-district-slot-26.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-27:hover ~ svg.planetMap-field .planetMap-district-slot-27.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-28:hover ~ svg.planetMap-field .planetMap-district-slot-28.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-29:hover ~ svg.planetMap-field .planetMap-district-slot-29.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-30:hover ~ svg.planetMap-field .planetMap-district-slot-30.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-31:hover ~ svg.planetMap-field .planetMap-district-slot-31.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-32:hover ~ svg.planetMap-field .planetMap-district-slot-32.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-33:hover ~ svg.planetMap-field .planetMap-district-slot-33.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-34:hover ~ svg.planetMap-field .planetMap-district-slot-34.planetMap-district-class-mine-3,
#planetMap-container .btn-district.planetMap-district-slot-35:hover ~ svg.planetMap-field .planetMap-district-slot-35.planetMap-district-class-mine-3,
#planetMap-container svg.planetMap-field > path.planetMap-district-class-mine-3:hover {
    fill: rgba(70, 98, 37, 0.75);
    stroke: rgba(139, 195, 74, 0.75);
    stroke-width: 2;
}

#planetMap-container .btn-district.planetMap-district-slot-1:hover ~ svg.planetMap-field .planetMap-district-slot-1.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-2:hover ~ svg.planetMap-field .planetMap-district-slot-2.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-3:hover ~ svg.planetMap-field .planetMap-district-slot-3.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-4:hover ~ svg.planetMap-field .planetMap-district-slot-4.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-5:hover ~ svg.planetMap-field .planetMap-district-slot-5.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-6:hover ~ svg.planetMap-field .planetMap-district-slot-6.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-7:hover ~ svg.planetMap-field .planetMap-district-slot-7.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-8:hover ~ svg.planetMap-field .planetMap-district-slot-8.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-9:hover ~ svg.planetMap-field .planetMap-district-slot-9.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-10:hover ~ svg.planetMap-field .planetMap-district-slot-10.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-11:hover ~ svg.planetMap-field .planetMap-district-slot-11.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-12:hover ~ svg.planetMap-field .planetMap-district-slot-12.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-13:hover ~ svg.planetMap-field .planetMap-district-slot-13.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-14:hover ~ svg.planetMap-field .planetMap-district-slot-14.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-15:hover ~ svg.planetMap-field .planetMap-district-slot-15.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-16:hover ~ svg.planetMap-field .planetMap-district-slot-16.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-17:hover ~ svg.planetMap-field .planetMap-district-slot-17.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-18:hover ~ svg.planetMap-field .planetMap-district-slot-18.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-19:hover ~ svg.planetMap-field .planetMap-district-slot-19.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-20:hover ~ svg.planetMap-field .planetMap-district-slot-20.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-21:hover ~ svg.planetMap-field .planetMap-district-slot-21.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-22:hover ~ svg.planetMap-field .planetMap-district-slot-22.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-23:hover ~ svg.planetMap-field .planetMap-district-slot-23.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-24:hover ~ svg.planetMap-field .planetMap-district-slot-24.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-25:hover ~ svg.planetMap-field .planetMap-district-slot-25.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-26:hover ~ svg.planetMap-field .planetMap-district-slot-26.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-27:hover ~ svg.planetMap-field .planetMap-district-slot-27.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-28:hover ~ svg.planetMap-field .planetMap-district-slot-28.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-29:hover ~ svg.planetMap-field .planetMap-district-slot-29.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-30:hover ~ svg.planetMap-field .planetMap-district-slot-30.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-31:hover ~ svg.planetMap-field .planetMap-district-slot-31.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-32:hover ~ svg.planetMap-field .planetMap-district-slot-32.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-33:hover ~ svg.planetMap-field .planetMap-district-slot-33.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-34:hover ~ svg.planetMap-field .planetMap-district-slot-34.planetMap-district-class-mine-4,
#planetMap-container .btn-district.planetMap-district-slot-35:hover ~ svg.planetMap-field .planetMap-district-slot-35.planetMap-district-class-mine-4,
#planetMap-container svg.planetMap-field > path.planetMap-district-class-mine-4:hover {
    fill: rgba(128, 118, 30, 0.75);
    stroke: rgba(255, 235, 59, 0.75);
    stroke-width: 2;
}

#planetMap-container svg.planetMap-field > path.planetMap-district-stroke-queue {
    stroke: rgba(0, 128, 255, 1) !important;
}

#planetMap-container svg.planetMap-field > path.planetMap-district-stroke-level {
    stroke: rgba(0, 0, 0, 0) !important;
}

#planetMap-container svg.planetMap-field > path.planetMap-district-stroke-locked {
    stroke: rgba(255, 128, 0, 1) !important;
}

#planetMap-container svg.planetMap-field > path.planetMap-district-stroke-available {
    stroke: rgba(0, 255, 0, 1) !important;
}

#planetMap-container .btn-district {
    position: absolute;
    z-index: 21;
    cursor: pointer;
    /* align-content: center; */
    line-height: 12.5px;
    width: 25px;
    height: 25px;
    /* border-radius: 50%; */
    font-size: 12px !important;
    font-family: 'Orbitron';
    background: radial-gradient(circle, rgba(0, 0, 0, 1) 0%, rgba(64, 64, 64, 1) 100%);
}

#planetMap-container .btn-district.level0 {
    opacity: 0.5;
    transition: opacity 0.3s ease-in-out;
}

#planetMap-container .btn-district:hover {
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-1 {
    top: 70px;
    left: 160px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-2 {
    top: 70px;
    left: 210px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-3 {
    top: 80px;
    left: 260px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-4 {
    top: 102px;
    left: 476px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-5 {
    top: 70px;
    left: 329px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-6 {
    top: 136px;
    left: 268px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-7 {
    top: 126px;
    left: 329px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-8 {
    top: 221px;
    left: 46px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-9 {
    top: 205px;
    left: 141px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-10 {
    top: 226px;
    left: 190px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-11 {
    top: 225px;
    left: 319px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-12 {
    top: 0;
    left: 0;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-13 {
    top: 258px;
    left: 407px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-14 {
    top: 289px;
    left: 31px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-15 {
    top: 355px;
    left: 125px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-16 {
    top: 345px;
    left: 273px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-17 {
    top: 323px;
    left: 481px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-18 {
    top: 333px;
    left: 379px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-19 {
    top: 350px;
    left: 60px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-20 {
    top: 340px;
    left: 200px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-21 {
    top: 410px;
    left: 420px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-22 {
    top: 395px;
    left: 80px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-23 {
    top: 410px;
    left: 260px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-24 {
    top: 470px;
    left: 300px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-25 {
    top: 450px;
    left: 210px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-26 {
    top: 450px;
    left: 110px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-27 {
    top: 440px;
    left: 40px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-28 {
    top: 470px;
    left: 510px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-29 {
    top: 510px;
    left: 50px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-30 {
    top: 500px;
    left: 430px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-31 {
    top: 510px;
    left: 140px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-32 {
    top: 520px;
    left: 220px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-33 {
    top: 510px;
    left: 350px;
}

#planetMap-container .btn-district.btn-district-desktop.btn-district-type-1.planetMap-district-slot-34 {
    top: 530px;
    left: 490px;
}


#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-1 {
    top: 70px;
    left: 160px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-2 {
    top: 70px;
    left: 210px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-3 {
    top: 80px;
    left: 260px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-4 {
    top: 102px;
    left: 476px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-5 {
    top: 70px;
    left: 329px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-6 {
    top: 136px;
    left: 268px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-7 {
    top: 126px;
    left: 329px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-8 {
    top: 221px;
    left: 46px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-9 {
    top: 205px;
    left: 141px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-10 {
    top: 226px;
    left: 190px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-11 {
    top: 225px;
    left: 319px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-12 {
    top: 0;
    left: 0;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-13 {
    top: 258px;
    left: 407px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-14 {
    top: 289px;
    left: 31px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-15 {
    top: 355px;
    left: 125px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-16 {
    top: 345px;
    left: 273px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-17 {
    top: 323px;
    left: 481px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-18 {
    top: 333px;
    left: 379px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-19 {
    top: 350px;
    left: 60px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-20 {
    top: 340px;
    left: 200px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-21 {
    top: 410px;
    left: 420px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-22 {
    top: 395px;
    left: 80px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-23 {
    top: 410px;
    left: 260px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-24 {
    top: 470px;
    left: 300px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-25 {
    top: 450px;
    left: 210px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-26 {
    top: 450px;
    left: 110px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-27 {
    top: 440px;
    left: 40px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-28 {
    top: 470px;
    left: 510px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-29 {
    top: 510px;
    left: 50px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-30 {
    top: 500px;
    left: 430px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-31 {
    top: 510px;
    left: 140px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-32 {
    top: 520px;
    left: 220px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-33 {
    top: 510px;
    left: 350px;
}

#planetMap-container .btn-district.btn-district-mobile.btn-district-type-1.planetMap-district-slot-34 {
    top: 530px;
    left: 490px;
}

#planetMap-container svg.planetMap-field, #planetMap-container svg.villageCenter {
    position: absolute;
    pointer-events: none
}

#planetMap-container svg.planetMap-field > path:not(.planetMap-district-filled), .leaflet-building-svg {
    pointer-events: auto;
    cursor: pointer;
    transition-duration: 150ms;
    transition-timing-function: ease-in;
    fill: rgba(255, 255, 255, 0);
    stroke: rgba(255, 255, 255, 0.25);
}

#planetMap-container svg.planetMap-field > path.planetMap-district-class-mine-1 {
    fill: rgba(128, 76, 0, 0.5);
    stroke: rgba(255, 152, 0, 0.5);
}

#planetMap-container svg.planetMap-field > path.planetMap-district-class-mine-2 {
    fill: rgba(1, 84, 122, 0.5);
    stroke: rgba(3, 169, 244, 0.5);
}

#planetMap-container svg.planetMap-field > path.planetMap-district-class-mine-3 {
    fill: rgba(70, 98, 37, 0.5);
    stroke: rgba(139, 195, 74, 0.5);
}

#planetMap-container svg.planetMap-field > path.planetMap-district-class-mine-4 {
    fill: rgba(128, 118, 30, 0.5);
    stroke: rgba(255, 235, 59, 0.5);
}

#planetMap-container svg.planetMap-field {
    z-index: 1
}

#planetMap-container svg.villageCenter {
    z-index: 2
}

/**
Start of ShopController
 */
.shop-c-textshadow {
    text-shadow: rgba(123, 121, 107, .3) 3px 1px, rgba(123, 121, 107, .2) 6px 2px;
}

.shop-c-pack-dm {
    background: linear-gradient(to right, rgba(176, 173, 140, 0.5) 0%, rgba(30, 30, 30, 0) 50%, rgba(176, 173, 140, 0) 100%);
}

.shop-c-pack-core_fastPack {
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.9) 0%, rgba(30, 30, 30, 0.5) 25%, rgba(30, 30, 30, 0.75) 50%, rgba(30, 30, 30, 0.75) 75%, rgba(30, 30, 30, 0.9) 100%), url(gfx/shop/core_fastPack.webp) center / cover no-repeat;
}

.shop-c-pack-core_fastPack {
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.9) 0%, rgba(30, 30, 30, 0.5) 25%, rgba(30, 30, 30, 0.75) 50%, rgba(30, 30, 30, 0.75) 75%, rgba(30, 30, 30, 0.9) 100%), url(gfx/shop/core_buildingPack.webp) center / cover no-repeat;
}

.shop-c-pack-core_shipyardPack {
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.9) 0%, rgba(30, 30, 30, 0.5) 25%, rgba(30, 30, 30, 0.75) 50%, rgba(30, 30, 30, 0.75) 75%, rgba(30, 30, 30, 0.9) 100%), url(gfx/shop/core_shipyardPack.webp) center / cover no-repeat;
}

.shop-c-pack-core_researchPack {
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.9) 0%, rgba(30, 30, 30, 0.5) 25%, rgba(30, 30, 30, 0.75) 50%, rgba(30, 30, 30, 0.75) 75%, rgba(30, 30, 30, 0.9) 100%), url(gfx/shop/core_researchPack.webp) center / cover no-repeat;
}

.shop-c-pack-core_resourcePack {
    background: linear-gradient(to bottom, rgba(30, 30, 30, 0.9) 0%, rgba(30, 30, 30, 0.5) 25%, rgba(30, 30, 30, 0.75) 50%, rgba(30, 30, 30, 0.75) 75%, rgba(30, 30, 30, 0.9) 100%), url(gfx/shop/core_resourcePack.webp) center / cover no-repeat;
}

.shop-c-credit-1 {
    background: linear-gradient(to right, rgba(176, 173, 140, 0.15) 0%, rgba(30, 30, 30, 0.15) 50%, rgba(176, 173, 140, 0.15) 100%), url(../theme/shared/darkMatter/paypal/1.png) right / 25% no-repeat, url(../theme/backgrounds/stars.gif) center / cover no-repeat;
}

.shop-c-credit-2 {
    background: linear-gradient(to right, rgba(176, 173, 140, 0.15) 0%, rgba(30, 30, 30, 0.15) 50%, rgba(176, 173, 140, 0.15) 100%), url(../theme/shared/darkMatter/paypal/2.png) right / 25% no-repeat, url(../theme/backgrounds/stars.gif) center / cover no-repeat;
}

.shop-c-credit-3 {
    background: linear-gradient(to right, rgba(176, 173, 140, 0.15) 0%, rgba(30, 30, 30, 0.15) 50%, rgba(176, 173, 140, 0.15) 100%), url(../theme/shared/darkMatter/paypal/3.png) right / 25% no-repeat, url(../theme/backgrounds/stars.gif) center / cover no-repeat;
}

/**
Start of LeadersController
 */

.render-alliance-diplomacy-1, .render-council, .render-official, .render-scientist, .render-admiral {
    position: relative;
    overflow: hidden;
    background: none;
    z-index: 1 !important;
}

.render-alliance-diplomacy-1::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('gfx/headers/alliance.webp') center / cover no-repeat;
    -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 35%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 35%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 35%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 35%);
    mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 35%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 35%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 35%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 35%);
    -webkit-mask-composite: destination-in;
    mask-composite: intersect;
    animation: x-galaxy-move-circle 30s linear infinite;
    z-index: -1;
}

.render-council::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('gfx/portraits/controller/council_room_common.webp') center / cover no-repeat;
    -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 35%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 35%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 35%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 35%);
    mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 35%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 35%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 35%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 35%);
    -webkit-mask-composite: destination-in;
    mask-composite: intersect;
    animation: x-galaxy-move-circle 30s linear infinite;
    z-index: -1;
}

.bg-leader-official {
    background: -webkit-linear-gradient(#422100, #210c00);
    color: var(--ct-body-color) !important;
}

.bg-leader-official-scroll {
    height: 100px;
    overflow-y: scroll;
    background: #210c00;
    color: var(--ct-body-color);
}

.bg-leader-admiral {
    background: -webkit-linear-gradient(#420000, #210000);
    color: var(--ct-body-color) !important;
}

.bg-leader-admiral-scroll {
    height: 100px;
    overflow-y: scroll;
    background: #210000;
    color: var(--ct-body-color);
}

.bg-leader-scientist {
    background: -webkit-linear-gradient(#000042, #000021);
    color: var(--ct-body-color) !important;
}

.bg-leader-scientist-scroll {
    height: 100px;
    overflow-y: scroll;
    background: #000021;
    color: var(--ct-body-color);
}

.bg-leader-scroll {
    height: 50px;
    overflow-y: scroll;
}

/**
Start of MaraudersController
 */
.npc-marauders-glitch {
    background: var(--gradient-black-bottom-sized), url(assets/galaxy_npc/marauders/portrait-glitch.webp) 90% center / contain no-repeat, url(assets/galaxy_npc/marauders/frame-glitch.webp) center / contain, url(assets/galaxy_stargaze/nebula/red_strawberry_jam/_ny.jpg) center / cover fixed no-repeat
}

.npc-marauders {
    background: var(--gradient-black-bottom-sized), url(assets/galaxy_npc/marauders/portrait.webp) 90% center / contain no-repeat, url(assets/galaxy_npc/marauders/frame.webp) center / contain, url(assets/galaxy_stargaze/nebula/red_strawberry_jam/_ny.jpg) center / cover fixed no-repeat
}

/**
Start of CaravaneersController
 */
.npc-caravaneers-glitch {
    background: var(--gradient-black-bottom-sized), url(assets/galaxy_npc/caravaneers/portrait-glitch.webp) 90% center / contain no-repeat, url(assets/galaxy_npc/caravaneers/frame-glitch.webp) center / contain, url(assets/galaxy_stargaze/nebula/turquoise_spiralled/_px.jpg) center / cover fixed no-repeat
}

.npc-caravaneers {
    background: var(--gradient-black-bottom-sized), url(assets/galaxy_npc/caravaneers/portrait.webp) 90% center / contain no-repeat, url(assets/galaxy_npc/caravaneers/frame.webp) center / contain, url(assets/galaxy_stargaze/nebula/turquoise_spiralled/_px.jpg) center / cover fixed no-repeat
}

.card-caravaneers-lottery {
    overflow-y: scroll;
    height: 400px;
    max-height: 400px;
}

.reel {
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border: 2px solid #ccc;
    position: relative;
}

.slot-image {
    object-fit: cover;
    transition: transform 0.5s ease-out;
}

/* Blinking effect */
.effect-pulse {
    animation: effect-pulse 0.2s infinite;
}

.effect-pulse-1s {
    animation: effect-pulse 1s infinite;
}

.effect-pulse-2s {
    animation: effect-pulse 2s infinite;
}

@keyframes effect-pulse {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}

/**
Swiper for BP
 */
/* Scope all styles to this Swiper only */
#swiper-bp {
    width: 80%;
    overflow: visible;
    position: relative;
    margin: auto;

    /* Apply transparency gradient to edges */
    -webkit-mask-image: linear-gradient(
            to right,
            transparent 0%,
            black 10%,
            black 90%,
            transparent 100%
    );
    mask-image: linear-gradient(
            to right,
            transparent 0%,
            black 10%,
            black 90%,
            transparent 100%
    );
}

#swiper-bp .swiper-wrapper {
    align-items: center;
}

/* Style each slide */
#swiper-bp .swiper-slide {
    width: 300px;
    height: 225px;
    /*background: #eee;*/
    /*border-radius: 10px;*/
    /*display: flex;*/
    /*align-items: center;*/
    /*justify-content: center;*/
    /*font-size: 1.4rem;*/
    transition: transform 0.3s ease, opacity 0.3s ease;
}

@media (max-width: 767.97px) {
    #swiper-bp .swiper-slide {
        width: 275px !important;
    }

    #swiper-bp .swiper-wrapper .swiper-slide .card {
        min-height: 0 !important;
        padding-bottom: .375rem !important;
    }
}

/* Dim and slightly scale inactive slides */
#swiper-bp .swiper-slide:not(.swiper-slide-active) {
    opacity: 0.5;
    transform: scale(0.9);
}

.swiper-horizontal > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal {
    height: 10px !important;
    border: 1px solid #50a8ff
}

.swiper-scrollbar-drag {
    background: #50a8ff !important;
}

.bp-card-reward {
    position: relative;
    overflow: hidden;
    transition: 0.3s ease;
}

/* inner shadow appears on hover */
.bp-card-reward:hover {
    box-shadow: inset 0 0 20px rgba(0, 0, 0, 0.35);
}

/* the normal card content */
.bp-card-content {
    transition: opacity 0.25s ease, filter 0.25s ease, transform 0.25s ease;
}

/* hide original content on hover */
.bp-card-reward:hover .bp-card-content {
    opacity: 0.5;
    filter: blur(2.5px);
    transform: scale(1.1);
}

/* overlay text for "Redeem" */
.bp-card-overlay {
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    font-weight: 600;
    color: #333;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.25s ease, transform 0.25s ease;
}

/* show "Redeem" on hover */
.bp-card-reward:hover .bp-card-overlay {
    transform: scale(1.1);
    opacity: 1;
}

/**
Start of ShipyardController
 */

#swiper-shipyard {
    height: max-content;
}

.swiper-pagination-shipyard-bullet img {
    filter: grayscale(100%);
    transition: filter 0.3s ease;
    opacity: 0.5;
}

.swiper-pagination-shipyard-bullet-active img {
    filter: grayscale(0%);
    opacity: 1;
}

.ship-preview {
    position: relative;
    overflow: hidden;
    background: none;
    z-index: 1 !important;
}

.babylon-ship {
    position: absolute;
    z-index: 0;
    touch-action: none;
    width: 100%;
    height: 100%;
    background-color: transparent;
    padding-right: 4.5rem;
    padding-left: 3.5rem;
    padding-bottom: 4.5rem;
}

@media (max-width: 767.98px) {
    .babylon-ship {
        position: absolute;
        z-index: -1;
        width: inherit;
        padding: 0;
    }
}

.ship-preview-btns {
    position: relative;
    z-index: 1;
}

.ship-preview-nebula::before, .ship-preview-211::before, .ship-preview-212::before, .ship-preview-213::before, .ship-preview-214::before, .ship-preview-215::before, .ship-preview-216::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /*-webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%);*/
    -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 100%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 20%), linear-gradient(to left, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 20%), linear-gradient(to right, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 20%);
    /*mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%);*/
    mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 100%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 20%), linear-gradient(to left, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 20%), linear-gradient(to right, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 1) 20%);
    -webkit-mask-composite: destination-in;
    mask-composite: intersect;
    /* animation: shipyard-move-circle 30s linear infinite; */
    z-index: -1;
    background: url(/styles/startrek/assets/galaxy_stargaze/star/0_3cujnlcegfs/2048/_nx.jpg) center / cover;
}

.ship-preview-211::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('elements/211.webp') center / contain no-repeat;
    z-index: -1 !important;
}

.ship-preview-212::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('elements/212.webp') center / contain no-repeat;
    z-index: -1 !important;
}

.ship-preview-213::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('elements/213.webp') center / contain no-repeat;
    z-index: -1 !important;
}

.ship-preview-214::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('elements/214.webp') center / contain no-repeat;
    z-index: -1 !important;
}

.ship-preview-215::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('elements/215.webp') center / contain no-repeat;
    z-index: -1 !important;
}

@keyframes shipyard-move-circle {
    0% {
        transform: translate(10px, 0px);
    }
    12.5% {
        transform: translate(7.07px, 7.07px);
    }
    25% {
        transform: translate(0px, 10px);
    }
    37.5% {
        transform: translate(-7.07px, 7.07px);
    }
    50% {
        transform: translate(-10px, 0px);
    }
    62.5% {
        transform: translate(-7.07px, -7.07px);
    }
    75% {
        transform: translate(0px, -10px);
    }
    87.5% {
        transform: translate(7.07px, -7.07px);
    }
    100% {
        transform: translate(10px, 0px);
    }
}

/**
Start of FleetController
 */

.FleetController-card-fleet {
    background: linear-gradient(180deg, rgba(30, 30, 30, 0.2) 0%, rgba(30, 30, 30, 0.1) 50%, rgba(30, 30, 30, 0.2) 100%), url(assets/scifi-bs-html/bg/1.png), url(gfx_dev/research_page/2.png) top center no-repeat;
}

.render-charted-land, .render-uncharted-land {
    position: relative;
    overflow: hidden;
    background: none;
    z-index: 1 !important;
}

.render-charted-land::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to left, rgb(0, 0, 0, 0) 0%, rgb(0, 0, 0, 0.75) 50%, rgb(0, 0, 0, 0) 100%), var(--fc_origin) -10% center / 20% no-repeat, var(--fc_target) center / 20% no-repeat, var(--fc_origin) 110% center / 20% no-repeat, var(--fc_chart) center / cover no-repeat;
    -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%);
    mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%);
    -webkit-mask-composite: destination-in;
    mask-composite: intersect;
    animation: x-galaxy-move-circle 30s linear infinite;
    z-index: -1;
}

.render-uncharted-land::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: var(--fc_chart);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    -webkit-mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%);
    mask-image: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%), linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%);
    -webkit-mask-composite: destination-in;
    mask-composite: intersect;
    animation: x-galaxy-move-circle 30s linear infinite;
    z-index: -1;
}

@keyframes galaxy-move-circle {
    0% {
        transform: translate(10px, 0px);
    }
    12.5% {
        transform: translate(7.07px, 7.07px);
    }
    25% {
        transform: translate(0px, 10px);
    }
    37.5% {
        transform: translate(-7.07px, 7.07px);
    }
    50% {
        transform: translate(-10px, 0px);
    }
    62.5% {
        transform: translate(-7.07px, -7.07px);
    }
    75% {
        transform: translate(0px, -10px);
    }
    87.5% {
        transform: translate(7.07px, -7.07px);
    }
    100% {
        transform: translate(10px, 0px);
    }
}

/**
End of game.php?page=fleet
 */

blockquote {
    border-left: .125rem solid #11d6d6;
    border-right: .125rem solid #11d6d6;
    padding: 1rem 1rem 1rem 1.125rem;
    width: 100%;
    text-align: left !important;
    -webkit-clip-path: polygon(
            .75rem 0, /* top-left inset */ calc(100% - .75rem) 0, /* top-right inset */ 100% .75rem, /* slant at top-right */ 100% calc(100% - .75rem), /* bottom-right inset */ calc(100% - .75rem) 100%, /* bottom-right corner */ .75rem 100%, /* bottom-left inset */ 0 calc(100% - .75rem), /* slant at bottom-left */ 0 .75rem /* slant at top-left */
    );
    clip-path: polygon(
            .75rem 0,
            calc(100% - .75rem) 0,
            100% .75rem,
            100% calc(100% - .75rem),
            calc(100% - .75rem) 100%,
            .75rem 100%,
            0 calc(100% - .75rem),
            0 .75rem
    );
}

blockquote.alert.alert-light {
    border-left: .125rem solid #777 !important;
    border-right: .125rem solid #777 !important;
    border-top: none;
    border-bottom: none;
    box-shadow: -10px 0 10px -5px #777;
    background: repeating-linear-gradient(0deg, rgba(128, 128, 128, 0) 0, rgba(128, 128, 128, 0) 2px, rgba(128, 128, 128, 0.1) 2px, rgba(128, 128, 128, 0.1) 4px), linear-gradient(to bottom, rgba(128, 128, 128, 0.05) 0%, rgba(128, 128, 128, 0.1) 100%), rgba(30, 30, 30, 0.8);
}

blockquote.alert.alert-info {
    border-left: .125rem solid #11d6d6 !important;
    border-right: .125rem solid #11d6d6 !important;
    border-top: none;
    border-bottom: none;
}

blockquote.alert.alert-danger {
    border-left: .125rem solid #e91515 !important;
    border-right: .125rem solid #e91515 !important;
    border-top: none;
    border-bottom: none;
}

blockquote.alert.alert-warning {
    border-left: .125rem solid #fa921d !important;
    border-right: .125rem solid #fa921d !important;
    border-top: none;
    border-bottom: none;
}

blockquote.alert.alert-success {
    border-left: .125rem solid #4fe38b !important;
    border-right: .125rem solid #4fe38b !important;
    border-top: none;
    border-bottom: none;
}

.alert {
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem
}

.alert-heading {
    color: inherit
}

.alert-link {
    font-weight: 700
}

.alert-dismissible {
    padding-right: 4rem
}

.alert-dismissible .close {
    position: absolute;
    top: 0;
    right: 0;
    padding: .75rem 1.25rem;
    color: inherit
}

.alert-primary {
    color: #588583;
    background-color: #eefffe;
    border-color: #e7fffe
}

.alert-primary hr {
    border-top-color: #cefffd
}

.alert-primary .alert-link {
    color: #446665
}

.alert-secondary {
    color: #167b78;
    background-color: #d5fbfa;
    border-color: #c4faf8
}

.alert-secondary hr {
    border-top-color: #acf8f5
}

.alert-secondary .alert-link {
    color: #0e504e
}

.alert-success {
    color: #297648;
    background-color: #dcf9e8;
    border-color: #cef7df
}

.alert-success hr {
    border-top-color: #b8f3d1
}

.alert-success .alert-link {
    color: #1c5031
}

.alert-info {
    color: #167b78;
    background-color: #d5fbfa;
    border-color: #c4faf8
}

.alert-info hr {
    border-top-color: #acf8f5
}

.alert-info .alert-link {
    color: #0e504e
}

.alert-warning {
    color: #824c0f;
    background-color: #fee9d2;
    border-color: #fee0c0
}

.alert-warning hr {
    border-top-color: #fed4a7
}

.alert-warning .alert-link {
    color: #54310a
}

.alert-danger {
    color: #7b1d1d;
    background-color: #fbd7d7;
    border-color: #fac7c7
}

.alert-danger hr {
    border-top-color: #f8b0b0
}

.alert-danger .alert-link {
    color: #521313
}

.alert-light {
    color: #858585;
    background-color: #fff;
    border-color: #fff
}

.alert-light hr {
    border-top-color: #f2f2f2
}

.alert-light .alert-link {
    color: #6c6c6c
}

.alert-dark {
    color: #000;
    background-color: #ccc;
    border-color: #b8b8b8
}

.alert-dark hr {
    border-top-color: #ababab
}

.alert-dark .alert-link {
    color: #000
}

.alert-highlight {
    color: #167b78;
    background-color: #d5fbfa;
    border-color: #c4faf8
}

.alert-highlight hr {
    border-top-color: #acf8f5
}

.alert-highlight .alert-link {
    color: #0e504e
}

.alert-black {
    color: #000;
    background-color: #ccc;
    border-color: #b8b8b8
}

.alert-black hr {
    border-top-color: #ababab
}

.alert-black .alert-link {
    color: #000
}

.alert-white {
    color: #858585;
    background-color: #fff;
    border-color: #fff
}

.alert-white hr {
    border-top-color: #f2f2f2
}

.alert-white .alert-link {
    color: #6c6c6c
}

.alert-phosphor-amber {
    color: #855c00;
    background-color: #ffefcc;
    border-color: #ffe9b8
}

.alert-phosphor-amber hr {
    border-top-color: #ffe19f
}

.alert-phosphor-amber .alert-link {
    color: #523900
}

.alert-phosphor-green {
    color: #1b8500;
    background-color: #d6ffcc;
    border-color: #c6ffb8
}

.alert-phosphor-green hr {
    border-top-color: #b2ff9f
}

.alert-phosphor-green .alert-link {
    color: #115200
}

.alert-phosphor-purple {
    color: #680068;
    background-color: #f4ccf4;
    border-color: #f0b8f0
}

.alert-phosphor-purple hr {
    border-top-color: #eca3ec
}

.alert-phosphor-purple .alert-link {
    color: #350035
}

.alert-phosphor-grey {
    color: #151515;
    background-color: #d4d4d4;
    border-color: #c3c3c3
}

.alert-phosphor-grey hr {
    border-top-color: #b6b6b6
}

.alert-phosphor-grey .alert-link {
    color: #000
}

.alert-disabled {
    color: #585858;
    background-color: #eee;
    border-color: #e7e7e7
}

.alert-disabled hr {
    border-top-color: #dadada
}

.alert-disabled .alert-link {
    color: #3f3f3f
}

.alert {
    border-radius: 0;
    border-width: 1px 0;
    text-align: center;
    background: repeating-linear-gradient(0deg, rgba(170, 255, 252, 0) 0, rgba(170, 255, 252, 0) 2px, rgba(170, 255, 252, 0.1) 2px, rgba(170, 255, 252, 0.1) 4px), linear-gradient(to bottom, rgba(170, 255, 252, 0.05) 0%, rgba(170, 255, 252, 0.1) 100%);
    border-color: #aafffc;
    color: #aafffc
}

.alert .alert-link {
    color: #aafffc
}

.alert .close:not(:disabled):hover,
.alert .close:not(:disabled):focus {
    color: #aafffc
}

.alert hr {
    border-color: #aafffc
}

.alert.alert-highlight {
    background: repeating-linear-gradient(0deg, rgba(202, 233, 249, 0) 0, rgba(202, 233, 249, 0) 2px, rgba(202, 233, 249, 0.1) 2px, rgba(202, 233, 249, 0.1) 4px), linear-gradient(to bottom, rgba(202, 233, 249, 0.05) 0%, rgba(202, 233, 249, 0.1) 100%);
    border-color: #2bede6;
    color: #2bede6
}

.alert.alert-highlight .alert-link {
    color: #2bede6
}

.alert.alert-highlight .close:not(:disabled):hover,
.alert.alert-highlight .close:not(:disabled):focus {
    color: #2bede6
}

.alert.alert-highlight hr {
    border-color: #2bede6
}

.alert.alert-success {
    background: repeating-linear-gradient(0deg, rgba(79, 227, 139, 0) 0, rgba(79, 227, 139, 0) 2px, rgba(79, 227, 139, 0.1) 2px, rgba(79, 227, 139, 0.1) 4px), linear-gradient(to bottom, rgba(79, 227, 139, 0.05) 0%, rgba(79, 227, 139, 0.1) 100%);
    border-color: #4fe38b;
    color: #4fe38b
}

.alert.alert-success .alert-link {
    color: #4fe38b
}

.alert.alert-success .close:not(:disabled):hover,
.alert.alert-success .close:not(:disabled):focus {
    color: #4fe38b
}

.alert.alert-success hr {
    border-color: #4fe38b
}

.alert.alert-warning {
    background: repeating-linear-gradient(0deg, rgba(250, 146, 29, 0) 0, rgba(250, 146, 29, 0) 2px, rgba(250, 146, 29, 0.1) 2px, rgba(250, 146, 29, 0.1) 4px), linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%);
    border-color: #fa921d;
    color: #fa921d
}

.alert.alert-warning .alert-link {
    color: #fa921d
}

.alert.alert-warning .close:not(:disabled):hover,
.alert.alert-warning .close:not(:disabled):focus {
    color: #fa921d
}

.alert.alert-warning hr {
    border-color: #fa921d
}

.alert.alert-danger {
    background: repeating-linear-gradient(0deg, rgba(237, 55, 55, 0) 0, rgba(237, 55, 55, 0) 2px, rgba(237, 55, 55, 0.1) 2px, rgba(237, 55, 55, 0.1) 4px), linear-gradient(to bottom, rgba(237, 55, 55, 0.05) 0%, rgba(237, 55, 55, 0.1) 100%);
    border-color: #ed3737;
    color: #ed3737
}

.alert.alert-danger .alert-link {
    color: #ed3737
}

.alert.alert-danger .close:not(:disabled):hover,
.alert.alert-danger .close:not(:disabled):focus {
    color: #ed3737
}

.alert.alert-danger hr {
    border-color: #ed3737
}

.alert.alert-light {
    background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0) 2px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.1) 4px), linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-color: #fff;
    color: #fff
}

.alert.alert-light .alert-link {
    color: #fff
}

.alert.alert-light .close:not(:disabled):hover,
.alert.alert-light .close:not(:disabled):focus {
    color: #fff
}

.alert.alert-light hr {
    border-color: #fff
}

.alert .close:not(:disabled) {
    text-shadow: none
}

.alert .close:not(:disabled):hover,
.alert .close:not(:disabled):focus {
    opacity: 1
}

.headline-alert, .alert .alert-heading {
    font-family: "Pro Font Windows";
    font-size: 48px;
    line-height: 72px;
    text-transform: uppercase;
}


.alert-primary .corner-border-top:before,
.alert-primary .corner-border-top:after,
.alert-primary .corner-border-bottom:before,
.alert-primary .corner-border-bottom:after,
.bg-primary .corner-border-top:before,
.bg-primary .corner-border-top:after,
.bg-primary .corner-border-bottom:before,
.bg-primary .corner-border-bottom:after,
.bg-primary-gradient .corner-border-top:before,
.bg-primary-gradient .corner-border-top:after,
.bg-primary-gradient .corner-border-bottom:before,
.bg-primary-gradient .corner-border-bottom:after {
    border-color: #aafffc
}

.alert-highlight .corner-border-top:before,
.alert-highlight .corner-border-top:after,
.alert-highlight .corner-border-bottom:before,
.alert-highlight .corner-border-bottom:after,
.bg-highlight .corner-border-top:before,
.bg-highlight .corner-border-top:after,
.bg-highlight .corner-border-bottom:before,
.bg-highlight .corner-border-bottom:after,
.bg-highlight-gradient .corner-border-top:before,
.bg-highlight-gradient .corner-border-top:after,
.bg-highlight-gradient .corner-border-bottom:before,
.bg-highlight-gradient .corner-border-bottom:after {
    border-color: #2bede6
}

.alert-success .corner-border-top:before,
.alert-success .corner-border-top:after,
.alert-success .corner-border-bottom:before,
.alert-success .corner-border-bottom:after,
.bg-success .corner-border-top:before,
.bg-success .corner-border-top:after,
.bg-success .corner-border-bottom:before,
.bg-success .corner-border-bottom:after,
.bg-success-gradient .corner-border-top:before,
.bg-success-gradient .corner-border-top:after,
.bg-success-gradient .corner-border-bottom:before,
.bg-success-gradient .corner-border-bottom:after {
    border-color: #4fe38b
}

.alert-warning .corner-border-top:before,
.alert-warning .corner-border-top:after,
.alert-warning .corner-border-bottom:before,
.alert-warning .corner-border-bottom:after,
.bg-warning .corner-border-top:before,
.bg-warning .corner-border-top:after,
.bg-warning .corner-border-bottom:before,
.bg-warning .corner-border-bottom:after,
.bg-warning-gradient .corner-border-top:before,
.bg-warning-gradient .corner-border-top:after,
.bg-warning-gradient .corner-border-bottom:before,
.bg-warning-gradient .corner-border-bottom:after {
    border-color: #fa921d
}

.alert-danger .corner-border-top:before,
.alert-danger .corner-border-top:after,
.alert-danger .corner-border-bottom:before,
.alert-danger .corner-border-bottom:after,
.bg-danger .corner-border-top:before,
.bg-danger .corner-border-top:after,
.bg-danger .corner-border-bottom:before,
.bg-danger .corner-border-bottom:after,
.bg-danger-gradient .corner-border-top:before,
.bg-danger-gradient .corner-border-top:after,
.bg-danger-gradient .corner-border-bottom:before,
.bg-danger-gradient .corner-border-bottom:after {
    border-color: #ed3737
}

.bg-secondary,
.bg-info {
    background-color: rgba(202, 233, 249, 0.3) !important;
    color: #2bede6 !important
}

.bg-success {
    background-color: rgba(79, 227, 139, 0.3) !important;
    color: #4fe38b !important
}

.bg-success-gradient {
    background: linear-gradient(to bottom, rgba(79, 227, 139, 0.05) 0%, rgba(79, 227, 139, 0.1) 100%);
    color: #4fe38b !important
}

.bg-warning {
    background-color: rgba(250, 146, 29, 0.3) !important;
    color: #fa921d !important
}

.bg-warning-gradient {
    background: repeating-linear-gradient(0deg, rgba(250, 146, 29, 0) 0, rgba(250, 146, 29, 0) 2px, rgba(250, 146, 29, 0.1) 2px, rgba(250, 146, 29, 0.1) 4px), linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%);
    color: #fa921d !important
}

.bg-danger {
    background-color: rgba(237, 55, 55, 0.3) !important;
    color: #ed3737 !important
}

.bg-danger-gradient {
    background: linear-gradient(to bottom, rgba(237, 55, 55, 0.05) 0%, rgba(237, 55, 55, 0.1) 100%);
    color: #ed3737 !important
}

.bg-light {
    background-color: rgba(255, 255, 255, 0.3) !important;
    color: #fff !important
}

.bg-dark {
    background-color: rgba(0, 0, 0, 0.3) !important;
    color: #fff !important
}


.bg-light-gradient {
    background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0) 2px, rgba(255, 255, 255, 0.1) 2px, rgba(255, 255, 255, 0.1) 4px), linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.1) 100%);
    color: #fff
}


.bg-highlight-gradient {
    background: repeating-linear-gradient(0deg, rgba(202, 233, 249, 0) 0, rgba(202, 233, 249, 0) 2px, rgba(202, 233, 249, 0.1) 2px, rgba(202, 233, 249, 0.1) 4px), linear-gradient(to bottom, rgba(202, 233, 249, 0.05) 0%, rgba(202, 233, 249, 0.1) 100%);
    color: #2bede6
}

.popover {
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 0.98), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png');
}

.popover-resource-901 {
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 0.98), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url('/styles/startrek/assets/elements/krasni3/1.webp') center / cover no-repeat;
}

.popover-resource-902 {
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 0.98), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url('/styles/startrek/assets/elements/krasni3/2.webp') center / cover no-repeat;
}

.popover-resource-903 {
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 0.98), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url('/styles/startrek/assets/elements/krasni3/3.webp') center / cover no-repeat;
}

.popover-resource-911 {
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 0.98), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url('/styles/startrek/assets/elements/krasni3/4.webp') center / cover no-repeat;
}

.popover-resource-921 {
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 0.98), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url('/styles/startrek/assets/elements/krasni2/42.webp') center / cover no-repeat;
}

.popover .popover-header, .popover-body {
    background-color: transparent;
    border: none;
}

.btn {
    display: inline-block;
    font-weight: 400;
    color: #aafffc;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out
}


.btn:hover {
    color: #aafffc;
    text-decoration: none
}

.btn:focus,
.btn.focus {
    outline: 0;
    box-shadow: 0 0 0 .2rem rgba(170, 255, 252, 0.25)
}

.btn.disabled,
.btn:disabled {
    opacity: .65
}

a.btn.disabled,
fieldset:disabled a.btn {
    pointer-events: none
}

.btn-primary {
    color: #212529;
    background-color: #aafffc;
    border-color: #aafffc
}

.btn-primary:hover {
    color: #212529;
    background-color: #84fffb;
    border-color: #77fffa
}

.btn-primary:focus,
.btn-primary.focus {
    color: #212529;
    background-color: #84fffb;
    border-color: #77fffa;
    box-shadow: 0 0 0 .2rem rgba(149, 222, 220, 0.5)
}

.btn-primary.disabled,
.btn-primary:disabled {
    color: #212529;
    background-color: #aafffc;
    border-color: #aafffc
}

.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
    color: #212529;
    background-color: #77fffa;
    border-color: #6afffa
}

.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(149, 222, 220, 0.5)
}

.btn-secondary {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-secondary:hover {
    color: #212529;
    background-color: #13dfd7;
    border-color: #12d3cc
}

.btn-secondary:focus,
.btn-secondary.focus {
    color: #212529;
    background-color: #13dfd7;
    border-color: #12d3cc;
    box-shadow: 0 0 0 .2rem rgba(42, 207, 202, 0.5)
}

.btn-secondary.disabled,
.btn-secondary:disabled {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-secondary:not(:disabled):not(.disabled):active,
.btn-secondary:not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle {
    color: #212529;
    background-color: #12d3cc;
    border-color: #11c7c1
}

.btn-secondary:not(:disabled):not(.disabled):active:focus,
.btn-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(42, 207, 202, 0.5)
}

.btn-close {
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23aafffc' d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center / 1em no-repeat, linear-gradient(to bottom, rgba(170, 255, 252, 0.05), rgba(170, 255, 252, 0.1)), rgb(10, 10, 10);
    --ct-btn-close-white-filter: none;
    color: #aafffc;
    border: 1px solid #aafffc;
    padding: 0.3rem !important;
    opacity: 1;
}

.btn-close:hover,
.btn-close:active,
.btn-close:focus {
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23aafffc' d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center / 1em no-repeat, linear-gradient(to bottom, rgba(170, 255, 252, 0.1), rgba(170, 255, 252, 0.2)), rgb(10, 10, 10);
}

.btn-success {
    color: #212529;
    background-color: #4fe38b;
    border-color: #4fe38b
}

.btn-success:hover {
    color: #212529;
    background-color: #2ede75;
    border-color: #23dc6e
}

.btn-success:focus,
.btn-success.focus {
    color: #212529;
    background-color: #2ede75;
    border-color: #23dc6e;
    box-shadow: 0 0 0 .2rem rgba(72, 199, 124, 0.5)
}

.btn-success.disabled,
.btn-success:disabled {
    color: #212529;
    background-color: #4fe38b;
    border-color: #4fe38b
}

.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
    color: #212529;
    background-color: #23dc6e;
    border-color: #21d169
}

.btn-success:not(:disabled):not(.disabled):active:focus,
.btn-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(72, 199, 124, 0.5)
}

.btn-info {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-info:hover {
    color: #212529;
    background-color: #13dfd7;
    border-color: #12d3cc
}

.btn-info:focus,
.btn-info.focus {
    color: #212529;
    background-color: #13dfd7;
    border-color: #12d3cc;
    box-shadow: 0 0 0 .2rem rgba(42, 207, 202, 0.5)
}

.btn-info.disabled,
.btn-info:disabled {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-info:not(:disabled):not(.disabled):active,
.btn-info:not(:disabled):not(.disabled).active,
.show > .btn-info.dropdown-toggle {
    color: #212529;
    background-color: #12d3cc;
    border-color: #11c7c1
}

.btn-info:not(:disabled):not(.disabled):active:focus,
.btn-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-info.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(42, 207, 202, 0.5)
}

.btn-warning {
    color: #212529;
    background-color: #fa921d;
    border-color: #fa921d
}

.btn-warning:hover {
    color: #fff;
    background-color: #ec7f05;
    border-color: #df7805
}

.btn-warning:focus,
.btn-warning.focus {
    color: #fff;
    background-color: #ec7f05;
    border-color: #df7805;
    box-shadow: 0 0 0 .2rem rgba(217, 130, 31, 0.5)
}

.btn-warning.disabled,
.btn-warning:disabled {
    color: #212529;
    background-color: #fa921d;
    border-color: #fa921d
}

.btn-warning:not(:disabled):not(.disabled):active,
.btn-warning:not(:disabled):not(.disabled).active,
.show > .btn-warning.dropdown-toggle {
    color: #fff;
    background-color: #df7805;
    border-color: #d37205
}

.btn-warning:not(:disabled):not(.disabled):active:focus,
.btn-warning:not(:disabled):not(.disabled).active:focus,
.show > .btn-warning.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(217, 130, 31, 0.5)
}

.btn-danger {
    color: #fff;
    background-color: #ed3737;
    border-color: #ed3737
}

.btn-danger:hover {
    color: #fff;
    background-color: #e91515;
    border-color: #dd1414
}

.btn-danger:focus,
.btn-danger.focus {
    color: #fff;
    background-color: #e91515;
    border-color: #dd1414;
    box-shadow: 0 0 0 .2rem rgba(240, 85, 85, 0.5)
}

.btn-danger.disabled,
.btn-danger:disabled {
    color: #fff;
    background-color: #ed3737;
    border-color: #ed3737
}

.btn-danger:not(:disabled):not(.disabled):active,
.btn-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle {
    color: #fff;
    background-color: #dd1414;
    border-color: #d11313
}

.btn-danger:not(:disabled):not(.disabled):active:focus,
.btn-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-danger.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(240, 85, 85, 0.5)
}

.btn-light {
    color: #212529;
    background-color: #fff;
    border-color: #fff
}

.btn-light:hover {
    color: #212529;
    background-color: #ececec;
    border-color: #e6e6e6
}

.btn-light:focus,
.btn-light.focus {
    color: #212529;
    background-color: #ececec;
    border-color: #e6e6e6;
    box-shadow: 0 0 0 .2rem rgba(222, 222, 223, 0.5)
}

.btn-light.disabled,
.btn-light:disabled {
    color: #212529;
    background-color: #fff;
    border-color: #fff
}

.btn-light:not(:disabled):not(.disabled):active,
.btn-light:not(:disabled):not(.disabled).active,
.show > .btn-light.dropdown-toggle {
    color: #212529;
    background-color: #e6e6e6;
    border-color: #dfdfdf
}

.btn-light:not(:disabled):not(.disabled):active:focus,
.btn-light:not(:disabled):not(.disabled).active:focus,
.show > .btn-light.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(222, 222, 223, 0.5)
}

.btn-dark {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-dark:hover {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-dark:focus,
.btn-dark.focus {
    color: #fff;
    background-color: #000;
    border-color: #000;
    box-shadow: 0 0 0 .2rem rgba(38, 38, 38, 0.5)
}

.btn-dark.disabled,
.btn-dark:disabled {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-dark:not(:disabled):not(.disabled):active,
.btn-dark:not(:disabled):not(.disabled).active,
.show > .btn-dark.dropdown-toggle {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-dark:not(:disabled):not(.disabled):active:focus,
.btn-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(38, 38, 38, 0.5)
}

.btn-highlight {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-highlight:hover {
    color: #212529;
    background-color: #13dfd7;
    border-color: #12d3cc
}

.btn-highlight:focus,
.btn-highlight.focus {
    color: #212529;
    background-color: #13dfd7;
    border-color: #12d3cc;
    box-shadow: 0 0 0 .2rem rgba(42, 207, 202, 0.5)
}

.btn-highlight.disabled,
.btn-highlight:disabled {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-highlight:not(:disabled):not(.disabled):active,
.btn-highlight:not(:disabled):not(.disabled).active,
.show > .btn-highlight.dropdown-toggle {
    color: #212529;
    background-color: #12d3cc;
    border-color: #11c7c1
}

.btn-highlight:not(:disabled):not(.disabled):active:focus,
.btn-highlight:not(:disabled):not(.disabled).active:focus,
.show > .btn-highlight.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(42, 207, 202, 0.5)
}

.btn-black {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-black:hover {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-black:focus,
.btn-black.focus {
    color: #fff;
    background-color: #000;
    border-color: #000;
    box-shadow: 0 0 0 .2rem rgba(38, 38, 38, 0.5)
}

.btn-black.disabled,
.btn-black:disabled {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-black:not(:disabled):not(.disabled):active,
.btn-black:not(:disabled):not(.disabled).active,
.show > .btn-black.dropdown-toggle {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-black:not(:disabled):not(.disabled):active:focus,
.btn-black:not(:disabled):not(.disabled).active:focus,
.show > .btn-black.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(38, 38, 38, 0.5)
}

.btn-white {
    color: #212529;
    background-color: #fff;
    border-color: #fff
}

.btn-white:hover {
    color: #212529;
    background-color: #ececec;
    border-color: #e6e6e6
}

.btn-white:focus,
.btn-white.focus {
    color: #212529;
    background-color: #ececec;
    border-color: #e6e6e6;
    box-shadow: 0 0 0 .2rem rgba(222, 222, 223, 0.5)
}

.btn-white.disabled,
.btn-white:disabled {
    color: #212529;
    background-color: #fff;
    border-color: #fff
}

.btn-white:not(:disabled):not(.disabled):active,
.btn-white:not(:disabled):not(.disabled).active,
.show > .btn-white.dropdown-toggle {
    color: #212529;
    background-color: #e6e6e6;
    border-color: #dfdfdf
}

.btn-white:not(:disabled):not(.disabled):active:focus,
.btn-white:not(:disabled):not(.disabled).active:focus,
.show > .btn-white.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(222, 222, 223, 0.5)
}

.btn-phosphor-amber {
    color: #212529;
    background-color: #ffb000;
    border-color: #ffb000
}

.btn-phosphor-amber:hover {
    color: #212529;
    background-color: #d99600;
    border-color: #cc8d00
}

.btn-phosphor-amber:focus,
.btn-phosphor-amber.focus {
    color: #212529;
    background-color: #d99600;
    border-color: #cc8d00;
    box-shadow: 0 0 0 .2rem rgba(222, 155, 6, 0.5)
}

.btn-phosphor-amber.disabled,
.btn-phosphor-amber:disabled {
    color: #212529;
    background-color: #ffb000;
    border-color: #ffb000
}

.btn-phosphor-amber:not(:disabled):not(.disabled):active,
.btn-phosphor-amber:not(:disabled):not(.disabled).active,
.show > .btn-phosphor-amber.dropdown-toggle {
    color: #fff;
    background-color: #cc8d00;
    border-color: #bf8400
}

.btn-phosphor-amber:not(:disabled):not(.disabled):active:focus,
.btn-phosphor-amber:not(:disabled):not(.disabled).active:focus,
.show > .btn-phosphor-amber.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(222, 155, 6, 0.5)
}

.btn-phosphor-green {
    color: #212529;
    background-color: #3f0;
    border-color: #3f0
}

.btn-phosphor-green:hover {
    color: #fff;
    background-color: #2bd900;
    border-color: #29cc00
}

.btn-phosphor-green:focus,
.btn-phosphor-green.focus {
    color: #fff;
    background-color: #2bd900;
    border-color: #29cc00;
    box-shadow: 0 0 0 .2rem rgba(48, 222, 6, 0.5)
}

.btn-phosphor-green.disabled,
.btn-phosphor-green:disabled {
    color: #212529;
    background-color: #3f0;
    border-color: #3f0
}

.btn-phosphor-green:not(:disabled):not(.disabled):active,
.btn-phosphor-green:not(:disabled):not(.disabled).active,
.show > .btn-phosphor-green.dropdown-toggle {
    color: #fff;
    background-color: #29cc00;
    border-color: #26bf00
}

.btn-phosphor-green:not(:disabled):not(.disabled):active:focus,
.btn-phosphor-green:not(:disabled):not(.disabled).active:focus,
.show > .btn-phosphor-green.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(48, 222, 6, 0.5)
}

.btn-phosphor-purple {
    color: #fff;
    background-color: #c800c8;
    border-color: #c800c8
}

.btn-phosphor-purple:hover {
    color: #fff;
    background-color: #a200a2;
    border-color: #950095
}

.btn-phosphor-purple:focus,
.btn-phosphor-purple.focus {
    color: #fff;
    background-color: #a200a2;
    border-color: #950095;
    box-shadow: 0 0 0 .2rem rgba(208, 38, 208, 0.5)
}

.btn-phosphor-purple.disabled,
.btn-phosphor-purple:disabled {
    color: #fff;
    background-color: #c800c8;
    border-color: #c800c8
}

.btn-phosphor-purple:not(:disabled):not(.disabled):active,
.btn-phosphor-purple:not(:disabled):not(.disabled).active,
.show > .btn-phosphor-purple.dropdown-toggle {
    color: #fff;
    background-color: #950095;
    border-color: #808
}

.btn-phosphor-purple:not(:disabled):not(.disabled):active:focus,
.btn-phosphor-purple:not(:disabled):not(.disabled).active:focus,
.show > .btn-phosphor-purple.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(208, 38, 208, 0.5)
}

.btn-phosphor-grey {
    color: #fff;
    background-color: #282828;
    border-color: #282828
}

.btn-phosphor-grey:hover {
    color: #fff;
    background-color: #151515;
    border-color: #0f0f0f
}

.btn-phosphor-grey:focus,
.btn-phosphor-grey.focus {
    color: #fff;
    background-color: #151515;
    border-color: #0f0f0f;
    box-shadow: 0 0 0 .2rem rgba(72, 72, 72, 0.5)
}

.btn-phosphor-grey.disabled,
.btn-phosphor-grey:disabled {
    color: #fff;
    background-color: #282828;
    border-color: #282828
}

.btn-phosphor-grey:not(:disabled):not(.disabled):active,
.btn-phosphor-grey:not(:disabled):not(.disabled).active,
.show > .btn-phosphor-grey.dropdown-toggle {
    color: #fff;
    background-color: #0f0f0f;
    border-color: #080808
}

.btn-phosphor-grey:not(:disabled):not(.disabled):active:focus,
.btn-phosphor-grey:not(:disabled):not(.disabled).active:focus,
.show > .btn-phosphor-grey.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(72, 72, 72, 0.5)
}

.btn-disabled {
    color: #212529;
    background-color: #aaa;
    border-color: #aaa
}

.btn-disabled:hover {
    color: #212529;
    background-color: #979797;
    border-color: #919191
}

.btn-disabled:focus,
.btn-disabled.focus {
    color: #212529;
    background-color: #979797;
    border-color: #919191;
    box-shadow: 0 0 0 .2rem rgba(149, 150, 151, 0.5)
}

.btn-disabled.disabled,
.btn-disabled:disabled {
    color: #212529;
    background-color: #aaa;
    border-color: #aaa
}

.btn-disabled:not(:disabled):not(.disabled):active,
.btn-disabled:not(:disabled):not(.disabled).active,
.show > .btn-disabled.dropdown-toggle {
    color: #fff;
    background-color: #919191;
    border-color: #8a8a8a
}

.btn-disabled:not(:disabled):not(.disabled):active:focus,
.btn-disabled:not(:disabled):not(.disabled).active:focus,
.show > .btn-disabled.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(149, 150, 151, 0.5)
}

.btn-outline-primary {
    color: #aafffc;
    border-color: #aafffc
}

.btn-outline-primary:hover {
    color: #212529;
    background-color: #aafffc;
    border-color: #aafffc
}

.btn-outline-primary:focus,
.btn-outline-primary.focus {
    box-shadow: 0 0 0 .2rem rgba(170, 255, 252, 0.5)
}

.btn-outline-primary.disabled,
.btn-outline-primary:disabled {
    color: #aafffc;
    background-color: transparent
}

.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
    color: #212529;
    background-color: #aafffc;
    border-color: #aafffc
}

.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(170, 255, 252, 0.5)
}

.btn-outline-secondary {
    color: #2bede6;
    border-color: #2bede6
}

.btn-outline-secondary:hover {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-outline-secondary:focus,
.btn-outline-secondary.focus {
    box-shadow: 0 0 0 .2rem rgba(202, 233, 249, 0.5)
}

.btn-outline-secondary.disabled,
.btn-outline-secondary:disabled {
    color: #2bede6;
    background-color: transparent
}

.btn-outline-secondary:not(:disabled):not(.disabled):active,
.btn-outline-secondary:not(:disabled):not(.disabled).active,
.show > .btn-outline-secondary.dropdown-toggle {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-outline-secondary:not(:disabled):not(.disabled):active:focus,
.btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-secondary.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(202, 233, 249, 0.5)
}

.btn-outline-success {
    color: #4fe38b;
    border-color: #4fe38b
}

.btn-outline-success:hover {
    color: #212529;
    background-color: #4fe38b;
    border-color: #4fe38b
}

.btn-outline-success:focus,
.btn-outline-success.focus {
    box-shadow: 0 0 0 .2rem rgba(79, 227, 139, 0.5)
}

.btn-outline-success.disabled,
.btn-outline-success:disabled {
    color: #4fe38b;
    background-color: transparent
}

.btn-outline-success:not(:disabled):not(.disabled):active,
.btn-outline-success:not(:disabled):not(.disabled).active,
.show > .btn-outline-success.dropdown-toggle {
    color: #212529;
    background-color: #4fe38b;
    border-color: #4fe38b
}

.btn-outline-success:not(:disabled):not(.disabled):active:focus,
.btn-outline-success:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-success.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(79, 227, 139, 0.5)
}

.btn-outline-info {
    color: #2bede6;
    border-color: #2bede6
}

.btn-outline-info:hover {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-outline-info:focus,
.btn-outline-info.focus {
    box-shadow: 0 0 0 .2rem rgba(202, 233, 249, 0.5)
}

.btn-outline-info.disabled,
.btn-outline-info:disabled {
    color: #2bede6;
    background-color: transparent
}

.btn-outline-info:not(:disabled):not(.disabled):active,
.btn-outline-info:not(:disabled):not(.disabled).active,
.show > .btn-outline-info.dropdown-toggle {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-outline-info:not(:disabled):not(.disabled):active:focus,
.btn-outline-info:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-info.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(202, 233, 249, 0.5)
}

.btn-outline-warning {
    color: #fa921d;
    border-color: #fa921d
}

.btn-outline-warning:hover {
    color: #212529;
    background-color: #fa921d;
    border-color: #fa921d
}

.btn-outline-warning:focus,
.btn-outline-warning.focus {
    box-shadow: 0 0 0 .2rem rgba(250, 146, 29, 0.5)
}

.btn-outline-warning.disabled,
.btn-outline-warning:disabled {
    color: #fa921d;
    background-color: transparent
}

.btn-outline-warning:not(:disabled):not(.disabled):active,
.btn-outline-warning:not(:disabled):not(.disabled).active,
.show > .btn-outline-warning.dropdown-toggle {
    color: #212529;
    background-color: #fa921d;
    border-color: #fa921d
}

.btn-outline-warning:not(:disabled):not(.disabled):active:focus,
.btn-outline-warning:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-warning.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(250, 146, 29, 0.5)
}

.btn-outline-danger {
    color: #ed3737;
    border-color: #ed3737
}

.btn-outline-danger:hover {
    color: #fff;
    background-color: #ed3737;
    border-color: #ed3737
}

.btn-outline-danger:focus,
.btn-outline-danger.focus {
    box-shadow: 0 0 0 .2rem rgba(237, 55, 55, 0.5)
}

.btn-outline-danger.disabled,
.btn-outline-danger:disabled {
    color: #ed3737;
    background-color: transparent
}

.btn-outline-danger:not(:disabled):not(.disabled):active,
.btn-outline-danger:not(:disabled):not(.disabled).active,
.show > .btn-outline-danger.dropdown-toggle {
    color: #fff;
    background-color: #ed3737;
    border-color: #ed3737
}

.btn-outline-danger:not(:disabled):not(.disabled):active:focus,
.btn-outline-danger:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-danger.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(237, 55, 55, 0.5)
}

.btn-outline-light {
    color: #fff;
    border-color: #fff
}

.btn-outline-light:hover {
    color: #212529;
    background-color: #fff;
    border-color: #fff
}

.btn-outline-light:focus,
.btn-outline-light.focus {
    box-shadow: 0 0 0 .2rem rgba(255, 255, 255, 0.5)
}

.btn-outline-light.disabled,
.btn-outline-light:disabled {
    color: #fff;
    background-color: transparent
}

.btn-outline-light:not(:disabled):not(.disabled):active,
.btn-outline-light:not(:disabled):not(.disabled).active,
.show > .btn-outline-light.dropdown-toggle {
    color: #212529;
    background-color: #fff;
    border-color: #fff
}

.btn-outline-light:not(:disabled):not(.disabled):active:focus,
.btn-outline-light:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-light.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 255, 255, 0.5)
}

.btn-outline-dark {
    color: #000;
    border-color: #000
}

.btn-outline-dark:hover {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-outline-dark:focus,
.btn-outline-dark.focus {
    box-shadow: 0 0 0 .2rem rgba(0, 0, 0, 0.5)
}

.btn-outline-dark.disabled,
.btn-outline-dark:disabled {
    color: #000;
    background-color: transparent
}

.btn-outline-dark:not(:disabled):not(.disabled):active,
.btn-outline-dark:not(:disabled):not(.disabled).active,
.show > .btn-outline-dark.dropdown-toggle {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-outline-dark:not(:disabled):not(.disabled):active:focus,
.btn-outline-dark:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(0, 0, 0, 0.5)
}

.btn-outline-highlight {
    color: #2bede6;
    border-color: #2bede6
}

.btn-outline-highlight:hover {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-outline-highlight:focus,
.btn-outline-highlight.focus {
    box-shadow: 0 0 0 .2rem rgba(202, 233, 249, 0.5)
}

.btn-outline-highlight.disabled,
.btn-outline-highlight:disabled {
    color: #2bede6;
    background-color: transparent
}

.btn-outline-highlight:not(:disabled):not(.disabled):active,
.btn-outline-highlight:not(:disabled):not(.disabled).active,
.show > .btn-outline-highlight.dropdown-toggle {
    color: #212529;
    background-color: #2bede6;
    border-color: #2bede6
}

.btn-outline-highlight:not(:disabled):not(.disabled):active:focus,
.btn-outline-highlight:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-highlight.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(202, 233, 249, 0.5)
}

.btn-outline-black {
    color: #000;
    border-color: #000
}

.btn-outline-black:hover {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-outline-black:focus,
.btn-outline-black.focus {
    box-shadow: 0 0 0 .2rem rgba(0, 0, 0, 0.5)
}

.btn-outline-black.disabled,
.btn-outline-black:disabled {
    color: #000;
    background-color: transparent
}

.btn-outline-black:not(:disabled):not(.disabled):active,
.btn-outline-black:not(:disabled):not(.disabled).active,
.show > .btn-outline-black.dropdown-toggle {
    color: #fff;
    background-color: #000;
    border-color: #000
}

.btn-outline-black:not(:disabled):not(.disabled):active:focus,
.btn-outline-black:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-black.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(0, 0, 0, 0.5)
}

.btn-outline-white {
    color: #fff;
    border-color: #fff
}

.btn-outline-white:hover {
    color: #212529;
    background-color: #fff;
    border-color: #fff
}

.btn-outline-white:focus,
.btn-outline-white.focus {
    box-shadow: 0 0 0 .2rem rgba(255, 255, 255, 0.5)
}

.btn-outline-white.disabled,
.btn-outline-white:disabled {
    color: #fff;
    background-color: transparent
}

.btn-outline-white:not(:disabled):not(.disabled):active,
.btn-outline-white:not(:disabled):not(.disabled).active,
.show > .btn-outline-white.dropdown-toggle {
    color: #212529;
    background-color: #fff;
    border-color: #fff
}

.btn-outline-white:not(:disabled):not(.disabled):active:focus,
.btn-outline-white:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-white.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 255, 255, 0.5)
}

.btn-outline-phosphor-amber {
    color: #ffb000;
    border-color: #ffb000
}

.btn-outline-phosphor-amber:hover {
    color: #212529;
    background-color: #ffb000;
    border-color: #ffb000
}

.btn-outline-phosphor-amber:focus,
.btn-outline-phosphor-amber.focus {
    box-shadow: 0 0 0 .2rem rgba(255, 176, 0, 0.5)
}

.btn-outline-phosphor-amber.disabled,
.btn-outline-phosphor-amber:disabled {
    color: #ffb000;
    background-color: transparent
}

.btn-outline-phosphor-amber:not(:disabled):not(.disabled):active,
.btn-outline-phosphor-amber:not(:disabled):not(.disabled).active,
.show > .btn-outline-phosphor-amber.dropdown-toggle {
    color: #212529;
    background-color: #ffb000;
    border-color: #ffb000
}

.btn-outline-phosphor-amber:not(:disabled):not(.disabled):active:focus,
.btn-outline-phosphor-amber:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-phosphor-amber.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 176, 0, 0.5)
}

.btn-outline-phosphor-green {
    color: #3f0;
    border-color: #3f0
}

.btn-outline-phosphor-green:hover {
    color: #212529;
    background-color: #3f0;
    border-color: #3f0
}

.btn-outline-phosphor-green:focus,
.btn-outline-phosphor-green.focus {
    box-shadow: 0 0 0 .2rem rgba(51, 255, 0, 0.5)
}

.btn-outline-phosphor-green.disabled,
.btn-outline-phosphor-green:disabled {
    color: #3f0;
    background-color: transparent
}

.btn-outline-phosphor-green:not(:disabled):not(.disabled):active,
.btn-outline-phosphor-green:not(:disabled):not(.disabled).active,
.show > .btn-outline-phosphor-green.dropdown-toggle {
    color: #212529;
    background-color: #3f0;
    border-color: #3f0
}

.btn-outline-phosphor-green:not(:disabled):not(.disabled):active:focus,
.btn-outline-phosphor-green:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-phosphor-green.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(51, 255, 0, 0.5)
}

.btn-outline-phosphor-purple {
    color: #c800c8;
    border-color: #c800c8
}

.btn-outline-phosphor-purple:hover {
    color: #fff;
    background-color: #c800c8;
    border-color: #c800c8
}

.btn-outline-phosphor-purple:focus,
.btn-outline-phosphor-purple.focus {
    box-shadow: 0 0 0 .2rem rgba(200, 0, 200, 0.5)
}

.btn-outline-phosphor-purple.disabled,
.btn-outline-phosphor-purple:disabled {
    color: #c800c8;
    background-color: transparent
}

.btn-outline-phosphor-purple:not(:disabled):not(.disabled):active,
.btn-outline-phosphor-purple:not(:disabled):not(.disabled).active,
.show > .btn-outline-phosphor-purple.dropdown-toggle {
    color: #fff;
    background-color: #c800c8;
    border-color: #c800c8
}

.btn-outline-phosphor-purple:not(:disabled):not(.disabled):active:focus,
.btn-outline-phosphor-purple:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-phosphor-purple.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(200, 0, 200, 0.5)
}

.btn-outline-phosphor-grey {
    color: #282828;
    border-color: #282828
}

.btn-outline-phosphor-grey:hover {
    color: #fff;
    background-color: #282828;
    border-color: #282828
}

.btn-outline-phosphor-grey:focus,
.btn-outline-phosphor-grey.focus {
    box-shadow: 0 0 0 .2rem rgba(40, 40, 40, 0.5)
}

.btn-outline-phosphor-grey.disabled,
.btn-outline-phosphor-grey:disabled {
    color: #282828;
    background-color: transparent
}

.btn-outline-phosphor-grey:not(:disabled):not(.disabled):active,
.btn-outline-phosphor-grey:not(:disabled):not(.disabled).active,
.show > .btn-outline-phosphor-grey.dropdown-toggle {
    color: #fff;
    background-color: #282828;
    border-color: #282828
}

.btn-outline-phosphor-grey:not(:disabled):not(.disabled):active:focus,
.btn-outline-phosphor-grey:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-phosphor-grey.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(40, 40, 40, 0.5)
}

.btn-outline-disabled {
    color: #aaa;
    border-color: #aaa
}

.btn-outline-disabled:hover {
    color: #212529;
    background-color: #aaa;
    border-color: #aaa
}

.btn-outline-disabled:focus,
.btn-outline-disabled.focus {
    box-shadow: 0 0 0 .2rem rgba(170, 170, 170, 0.5)
}

.btn-outline-disabled.disabled,
.btn-outline-disabled:disabled {
    color: #aaa;
    background-color: transparent
}

.btn-outline-disabled:not(:disabled):not(.disabled):active,
.btn-outline-disabled:not(:disabled):not(.disabled).active,
.show > .btn-outline-disabled.dropdown-toggle {
    color: #212529;
    background-color: #aaa;
    border-color: #aaa
}

.btn-outline-disabled:not(:disabled):not(.disabled):active:focus,
.btn-outline-disabled:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-disabled.dropdown-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(170, 170, 170, 0.5)
}

.btn-link {
    font-weight: 400;
    color: #aafffc;
    text-decoration: none
}

.btn-link:hover {
    color: #5efff9;
    text-decoration: underline
}

.btn-link:focus,
.btn-link.focus {
    text-decoration: underline;
    box-shadow: none
}

.btn-link:disabled,
.btn-link.disabled {
    color: #6c757d;
    pointer-events: none
}

.btn-lg,
.btn-group-lg > .btn {
    padding: .5rem 1rem;
    /*
    font-size: 1.25rem;
     */
    /*
    line-height: 1.5;
     */
    border-radius: .3rem
}

.btn-sm,
.btn-group-sm > .btn {
    padding: .25rem .5rem;
    font-size: .875rem;
    line-height: 1.5;
    border-radius: .2rem
}

.btn-block {
    display: block;
    width: 100%
}

.btn-block + .btn-block {
    margin-top: .5rem
}

input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
    width: 100%
}


.btn-group,
.btn-group-vertical {
    position: relative;
    display: inline-flex;
    vertical-align: middle
}

.btn-group > .btn,
.btn-group-vertical > .btn {
    position: relative;
    flex: 1 1 auto
}

.btn-group > .btn:hover,
.btn-group-vertical > .btn:hover {
    z-index: 1
}

.btn-group > .btn:focus,
.btn-group > .btn:active,
.btn-group > .btn.active,
.btn-group-vertical > .btn:focus,
.btn-group-vertical > .btn:active,
.btn-group-vertical > .btn.active {
    z-index: 1
}

.btn-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start
}

.btn-toolbar .input-group {
    width: auto
}

.btn-group > .btn:not(:first-child),
.btn-group > .btn-group:not(:first-child) {
    margin-left: -1px
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle),
.btn-group > .btn-group:not(:last-child) > .btn {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0
}

.btn-group > .btn:not(:first-child),
.btn-group > .btn-group:not(:first-child) > .btn {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0
}

.dropdown-toggle-split {
    padding-right: .5625rem;
    padding-left: .5625rem
}

.dropdown-toggle-split::after,
.dropup .dropdown-toggle-split::after,
.dropright .dropdown-toggle-split::after {
    margin-left: 0
}

.dropleft .dropdown-toggle-split::before {
    margin-right: 0
}

.btn-sm + .dropdown-toggle-split,
.btn-group-sm > .btn + .dropdown-toggle-split {
    padding-right: .375rem;
    padding-left: .375rem
}

.btn-lg + .dropdown-toggle-split,
.btn-group-lg > .btn + .dropdown-toggle-split {
    padding-right: .75rem;
    padding-left: .75rem
}

.btn-group-vertical {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center
}

.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group {
    width: 100%
}

.btn-group-vertical > .btn:not(:first-child),
.btn-group-vertical > .btn-group:not(:first-child) {
    margin-top: -1px
}

.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle),
.btn-group-vertical > .btn-group:not(:last-child) > .btn {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.btn-group-vertical > .btn:not(:first-child),
.btn-group-vertical > .btn-group:not(:first-child) > .btn {
    border-top-left-radius: 0;
    border-top-right-radius: 0
}

.btn-group-toggle > .btn,
.btn-group-toggle > .btn-group > .btn {
    margin-bottom: 0
}

.btn-group-toggle > .btn input[type="radio"],
.btn-group-toggle > .btn input[type="checkbox"],
.btn-group-toggle > .btn-group > .btn input[type="radio"],
.btn-group-toggle > .btn-group > .btn input[type="checkbox"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none
}

.btn {
    box-shadow: none;
}

.btn[class*="btn-"]:disabled,
.btn[class*="btn-"].disabled {
    background: linear-gradient(to bottom, rgba(170, 170, 170, 0.05) 0%, rgba(170, 170, 170, 0.1) 100%);
    border-color: #aaa;
    color: #aaa
}

.btn[class*="btn-"]:disabled.btn-link,
.btn[class*="btn-"].disabled.btn-link {
    background: transparent;
    border-color: transparent
}

.btn[class*="btn-"]:disabled:hover,
.btn[class*="btn-"]:disabled:active,
.btn[class*="btn-"]:disabled:focus,
.btn[class*="btn-"].disabled:hover,
.btn[class*="btn-"].disabled:active,
.btn[class*="btn-"].disabled:focus {
    background: linear-gradient(to bottom, rgba(170, 170, 170, 0.05) 0%, rgba(170, 170, 170, 0.1) 100%)
}

.btn.btn-light {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.1) 100%);
    border-color: #fff;
    color: #fff
}

.btn.btn-light:hover,
.btn.btn-light:active,
.btn.btn-light:focus {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.2) 100%)
}

.btn.btn-921 {
    background: linear-gradient(to bottom, rgb(91, 44, 111) 0%, rgb(74, 35, 90) 100%);
    border-color: rgb(125, 60, 152);
    color: #fff;
}

.btn.btn-921:hover,
.btn.btn-921:active,
.btn.btn-921:focus {
    background: linear-gradient(to bottom, rgb(125, 60, 152) 50%, rgba(74, 35, 90, 0.1) 100%), linear-gradient(to left, rgb(33, 33, 33) 0%, rgb(187, 143, 206) 50%, rgb(33, 33, 33) 100%);
    border-color: rgb(187, 143, 206);
    color: #fff;
}

.btn.btn-primary {
    background: linear-gradient(to bottom, rgba(170, 255, 252, 0.05) 0%, rgba(170, 255, 252, 0.1) 100%), rgb(10, 10, 10);
    border-color: #aafffc;
    color: #aafffc
}

.btn.btn-primary:hover,
.btn.btn-primary:active,
.btn.btn-primary:focus {
    background: linear-gradient(to bottom, rgba(170, 255, 252, 0.1) 0%, rgba(170, 255, 252, 0.2) 100%), rgb(10, 10, 10)
}

.btn.btn-highlight {
    background: linear-gradient(to bottom, rgba(43, 237, 230, 0.05) 0%, rgba(43, 237, 230, 0.1) 100%), rgb(10, 10, 10);
    border-color: #2bede6;
    color: #2bede6
}

.btn.btn-highlight:hover,
.btn.btn-highlight:active,
.btn.btn-highlight:focus {
    background: linear-gradient(to bottom, rgba(43, 237, 230, 0.1) 0%, rgba(43, 237, 230, 0.2) 100%), rgb(10, 10, 10)
}

.btn.btn-info,
.btn.btn-secondary {
    background: linear-gradient(to bottom, rgba(43, 237, 230, 0.05) 0%, rgba(43, 237, 230, 0.1) 100%), rgb(10, 10, 10);
    border-color: #2bede6;
    color: #2bede6
}

.btn.btn-info:hover,
.btn.btn-info:active,
.btn.btn-info:focus,
.btn.btn-secondary:hover,
.btn.btn-secondary:active,
.btn.btn-secondary:focus {
    background: linear-gradient(to bottom, rgba(43, 237, 230, 0.1) 0%, rgba(43, 237, 230, 0.2) 100%), rgb(10, 10, 10)
}

.btn.btn-success {
    background: linear-gradient(to bottom, rgba(79, 227, 139, 0.05) 0%, rgba(79, 227, 139, 0.1) 100%), rgb(10, 10, 10);
    border-color: #4fe38b;
    color: #4fe38b
}

.btn.btn-success:hover,
.btn.btn-success:active,
.btn.btn-success:focus {
    background: linear-gradient(to bottom, rgba(79, 227, 139, 0.1) 0%, rgba(79, 227, 139, 0.2) 100%), rgb(10, 10, 10)
}

.btn.btn-warning {
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%), rgb(10, 10, 10);
    border-color: #fa921d;
    color: #fa921d
}

.btn.btn-warning:hover,
.btn.btn-warning:active,
.btn.btn-warning:focus {
    background: linear-gradient(to bottom, rgba(250, 146, 29, 0.1) 0%, rgba(250, 146, 29, 0.2) 100%), rgb(10, 10, 10)
}

.btn.btn-danger {
    background: linear-gradient(to bottom, rgba(237, 55, 55, 0.05) 0%, rgba(237, 55, 55, 0.1) 100%), rgb(10, 10, 10);
    border-color: #ed3737;
    color: #ed3737
}

.btn.btn-danger:hover,
.btn.btn-danger:active,
.btn.btn-danger:focus {
    background: linear-gradient(to bottom, rgba(237, 55, 55, 0.1) 0%, rgba(237, 55, 55, 0.2) 100%), rgb(10, 10, 10)
}

.btn.btn-light {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.1) 100%), rgb(10, 10, 10);
    border-color: #fff;
    color: #fff
}

.btn.btn-light:hover,
.btn.btn-light:active,
.btn.btn-light:focus {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.2) 100%), rgb(10, 10, 10)
}

.btn.btn-dark {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.05) 0%, rgba(0, 0, 0, 0.1) 100%), rgb(10, 10, 10);
    border-color: #000;
    color: #000
}

.btn.btn-dark:hover,
.btn.btn-dark:active,
.btn.btn-dark:focus {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.2) 100%), rgb(10, 10, 10)
}

.btn-group-vertical .btn {
    margin-bottom: 0
}

.btn-group-vertical .btn:last-child {
    margin-bottom: 1rem
}

.fa-stellaron-resource-901 {
    color: #d9b03d;
    background: -webkit-linear-gradient(#d9b03d, #dd5c03);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-resource-902 {
    color: #4fc6e1;
    background: -webkit-linear-gradient(#4fc6e1, #0070bb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-resource-903 {
    color: #1abc9c;
    background: -webkit-radial-gradient(center bottom, #1abc9c, #0b5244);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-resource-911 {
    color: #ff0;
    background: -webkit-radial-gradient(center bottom, #ff0, #daa520);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-resource-921 {
    color: #594fb9;
    background: -webkit-radial-gradient(center, #594fb9, #32517c);
    color: #4CAF50;
    background: -webkit-radial-gradient(center, #8BC34A, #4CAF50);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-resource-922 {
    color: #00bcd4;
    background: -webkit-radial-gradient(center, #00bcd4, #9c27b0);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-resource-923 {
    color: #cddc39;
    background: -webkit-radial-gradient(center, #cddc39, #daa520);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-resource-924 {
    color: #9e9e9e;
    background: -webkit-radial-gradient(center, #9e9e9e, #daa520);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-resource-925 {
    color: #f44336;
    background: -webkit-radial-gradient(center, #f44336, #daa520);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-terraform-Special {
    color: #ff0;
    background: -webkit-radial-gradient(center bottom, #ff0, #daa520);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-terraform-Hot {
    color: #d9b03d;
    background: -webkit-linear-gradient(#d9b03d, #dd5c03);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-terraform-Cold {
    color: #4fc6e1;
    background: -webkit-linear-gradient(#4fc6e1, #0070bb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-terraform-Temperate {
    color: #1abc9c;
    background: -webkit-radial-gradient(center bottom, #1abc9c, #0b5244);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-shipdesigner-cost901 {
    color: #d9b03d;
    background: -webkit-linear-gradient(#d9b03d, #dd5c03);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-shipdesigner-cost902 {
    color: #4fc6e1;
    background: -webkit-linear-gradient(#4fc6e1, #0070bb);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-shipdesigner-cost903 {
    color: #1abc9c;
    background: -webkit-radial-gradient(center bottom, #1abc9c, #0b5244);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-shipdesigner-cost911 {
    color: #ff0;
    background: -webkit-radial-gradient(center bottom, #ff0, #daa520);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-shipdesigner-cost921 {
    color: #594fb9;
    background: -webkit-radial-gradient(center, #594fb9, #32517c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-shipdesigner-attack {
    color: #ff5722
}

.fa-stellaron-shipdesigner-capacity {
    color: #607d8b
}

.fa-stellaron-shipdesigner-consumption {
    color: #607d8b
}

.fa-stellaron-shipdesigner-integrity {
    color: #607d8b
}

.fa-stellaron-shipdesigner-rapidfire {
    color: inherit
}

.fa-stellaron-shipdesigner-shield {
    color: #00bcd4
}

.fa-stellaron-shipdesigner-speed {
    color: #00bcd4
}

.fa-stellaron-vars-attack {
    color: #ff5722
}

.fa-stellaron-vars-capacity {
    color: #607d8b
}

.fa-stellaron-vars-consumption {
    color: #607d8b
}

.fa-stellaron-vars-integrity {
    color: #607d8b
}

.fa-stellaron-vars-rapidfire {
    color: inherit
}

.fa-stellaron-vars-shield {
    color: #00bcd4
}

.fa-stellaron-vars-speed {
    color: #00bcd4
}

.fa-stellaron-shipyard-1 {
    color: #87ceeb;
    background: -webkit-radial-gradient(circle, #4fc6e1, #14806b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-shipyard-2 {
    color: #87ceeb;
    background: -webkit-radial-gradient(circle, #4fc6e1, #14806b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-shipyard-3 {
    color: #87ceeb;
    background: -webkit-radial-gradient(circle, #4fc6e1, #14806b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-building-1 {
    color: #87ceeb;
    background: -webkit-radial-gradient(circle, #4fc6e1, #14806b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-building-2 {
    color: #942940;
    background: -webkit-linear-gradient(#f1556c, #45525f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-building-3 {
    color: #fa924c;
    background: -webkit-radial-gradient(circle, #c4a86b, #9f6b4a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-building-4 {
    color: 594 fb9;
    background: -webkit-linear-gradient(#cc9225, #742c00);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-research-1 {
    color: #b8905e;
    background: -webkit-radial-gradient(circle, #c4a86b, #9f6b4a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-research-2 {
    color: #33a0b4;
    background: -webkit-radial-gradient(circle, #1e9ab9, #0f4660);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-research-3 {
    color: #51ba88;
    background: -webkit-radial-gradient(circle, #66daa8, #103f37);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-ogame_perk-1001 {
    color: #ffbd4a;
    background: -webkit-radial-gradient(circle, #ffbd4a, #1b1710);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-ogame_perk-1002 {
    color: #f05050;
    background: -webkit-radial-gradient(circle, #f05050, #251414);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-ogame_perk-1003 {
    color: #b8905e;
    background: -webkit-radial-gradient(circle, #3b5d95, #040f1a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-ogame_perk_ext-1001 {
    color: #ffbd4a;
    background: -webkit-radial-gradient(circle, #ffbd4a, #1b1710);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-ogame_perk_ext-1002 {
    color: #f05050;
    background: -webkit-radial-gradient(circle, #f05050, #251414);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.fa-stellaron-ogame_perk_ext-1003 {
    color: #5d9cec;
    background: -webkit-radial-gradient(circle, #5d9cec, #040f1a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
}

.icon-glow {
    text-shadow: 0 0 10px
}

.c-h-1 {
    border: 1px solid transparent;
    border-image: linear-gradient(to bottom, rgba(202, 233, 249, 0.35) 0%, rgba(202, 233, 249, 0) 100%);
    border-image-slice: 100%;
    border-image-slice: 1;
    position: relative;
    background: rgba(202, 233, 249, 0.05);
    justify-content: space-evenly;
    margin-bottom: .25rem
}

.c-b-1 {
    background: rgba(202, 233, 249, 0.03);
}

.c-f-1 {
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.05) 0%, rgba(202, 233, 249, 0.1) 100%);
    border: none;
    border-radius: 0;
    color: #aafffc;
    flex-grow: 1;
    margin-bottom: 0;
    margin-top: .25rem;
}

/*
.fancybox__backdrop, .fancybox__caption, .fancybox__nav {
    opacity: 0 !important;
}
*/

.fancybox__content {
    background: #000 !important;
    background-repeat: no-repeat;
    /* border: 1px solid #000 !important; */
    /* border-image: linear-gradient(to left, rgb(202, 233, 249) 0%, rgb(18, 22, 24) 50%, rgb(202, 233, 249) 100%) 1 !important; */
    margin: 0;
    padding: 0;
    position: relative;
}

.fancybox__content > .carousel__button.is-close {
    position: absolute;
    top: 0;
    right: 0;
    color: #8391a2;
}

.fancybox__content > .carousel__button.is-close:hover {
    position: absolute;
    top: 0;
    right: 0;
    color: #c1c8d0;
}

/**

 */

.navbar-desktop {
    x-clip-path: polygon(0 0, 100% 0, calc(100% - 75px) 100%, 0% 100%);
    clip-path: polygon(0 0, calc(100% - 4px) 0, calc(100% - 74px) 100%, 0% 100%);
}

.navbar-mobile-row-1 {
    margin-top: .375rem !important;
    margin-bottom: .1875rem !important;
}

.navbar-border-to-top {
    top: 0;
    background: linear-gradient(90deg, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%);
    height: 1px !important;
}

.navbar-border-to-top-2 {
    top: 0;
    background: linear-gradient(90deg, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%);
    height: 2px !important;
}

.navbar-border-to-bottom {
    bottom: 0;
    background: linear-gradient(90deg, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%);
    height: 1px !important;
}

.navbar-border-to-bottom-2 {
    bottom: 0;
    background: linear-gradient(90deg, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%);
    height: 2px !important;
}

.navbar-horizontal-separator {
    min-width: 1px;
    height: 4rem;
    background: linear-gradient(to bottom, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%);
}

.nav .nav-item .nav-link.active,
.nav .nav-item .nav-link:hover {
    color: #2bede6;
    font-weight: 700
}

.nav.nav-tabs .nav-item .nav-link.active,
.nav.nav-tabs .nav-item .nav-link:hover,
.nav.nav-pills .nav-item .nav-link.active,
.nav.nav-pills .nav-item .nav-link:hover {
    background-color: #000;
    border-color: #2bede6;
    font-weight: 300
}

.nav.nav-tabs {
    border-bottom-color: #2bede6
}

.nav.nav-tabs .nav-item .nav-link.active,
.nav.nav-tabs .nav-item .nav-link:hover {
    border-color: #2bede6 #2bede6 transparent
}

.nav.nav-tabs.nav-tabs-alt .nav-item .nav-link {
    border: none;
    border-bottom: 4px solid transparent;
    text-transform: uppercase;
    padding-bottom: 1rem;
    padding-top: 1rem
}

.nav.nav-tabs.nav-tabs-alt .nav-item .nav-link.active,
.nav.nav-tabs.nav-tabs-alt .nav-item .nav-link:hover {
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.05) 0%, rgba(202, 233, 249, 0.1) 100%);
    border-color: #2bede6;
    font-weight: 700
}

.nav.nav-pills .nav-item .nav-link {
    border: 1px solid transparent
}

.tab-content .tab-pane {
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0) 0%, rgba(202, 233, 249, 0.1) 100%);
    background: transparent;
    padding: 1rem
}

.navbar .navbar-brand img {
    max-height: 50px
}

.navbar.navbar-dark .navbar-brand {
    color: #aafffc
}

.navbar.navbar-dark .navbar-toggler {
    color: #aafffc;
    border-color: #aafffc
}

.navbar.navbar-dark .navbar-nav .nav-link {
    color: #aafffc
}

.navbar.navbar-dark .navbar-nav .nav-link:focus,
.navbar.navbar-dark .navbar-nav .nav-link:hover {
    color: #2bede6
}

.navbar.navbar-dark .navbar-nav .nav-link.disabled {
    color: rgba(170, 255, 252, 0.3);
}

.navbar.navbar-dark .navbar-nav .active > .nav-link,
.navbar.navbar-dark .navbar-nav .nav-link.active,
.navbar.navbar-dark .navbar-nav .nav-link.show,
.navbar.navbar-dark .navbar-nav .show > .nav-link {
    color: #2bede6
}

.nav.nav-tabs {
    border-color: rgba(170, 255, 252, 0.2) !important;
    border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 1) 50%, rgba(18, 22, 24, 0) 100%) 1 !important;
    border-width: 1px !important;
}

.nav.nav-tabs.nav-tabs-alt .nav-item .nav-link.active, .nav.nav-tabs.nav-tabs-alt .nav-item .nav-link:hover {
    border-color: rgb(202, 233, 249);
}

.nav .nav-item .nav-link.active, .nav .nav-item .nav-link:hover {
    color: rgb(202, 233, 249);
}

/**
jquery toast
 */

.jq-toast-wrap {
    width: 450px;
}

@media (max-width: 767.98px) {
    .jq-toast-wrap {
        width: 90%;
    }
}

.jq-icon-warning {
    background: repeating-linear-gradient(0deg, rgba(250, 146, 29, 0) 0, rgba(250, 146, 29, 0) 2px, rgba(250, 146, 29, 0.1) 2px, rgba(250, 146, 29, 0.1) 4px), linear-gradient(to bottom, rgba(250, 146, 29, 0.05) 0%, rgba(250, 146, 29, 0.1) 100%), rgb(33, 28, 22);
    border-color: #fa921d;
    border-left: .125rem solid #fa921d !important;
    border-top: none;
    border-bottom: none;
    color: #fa921d;
}

/**
Tables
 */
.table {
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid transparent;
    border-image: linear-gradient(to bottom, rgba(176, 173, 140, 0.75) 0%, rgba(176, 173, 140, 0) 25%, rgba(176, 173, 140, 0) 75%, rgba(176, 173, 140, 0.75) 100%);
    border-image-slice: 1;
    font-size: 12px;
    text-transform: uppercase;
    width: 100%;
}

.table-layout-fixed {
    table-layout: fixed;
}

table thead {
    background: linear-gradient(to bottom, rgba(176, 173, 140, 0.15) 0%, rgba(176, 173, 140, 0) 100%);
}


table thead > tr > th:first-child {
    border-image: linear-gradient(to right, rgba(202, 233, 249, 0) 0%, rgba(202, 233, 249, 0.25) 100%) 1 !important;
    border-width: 0 0 1px 0 !important;
}

table thead > tr > th {
    border: 1px solid rgba(202, 233, 249, 0.25) !important;
    border-width: 0 0 1px 0 !important;
}

table thead > tr > th:last-child {
    background-color: transparent;
    border-image: linear-gradient(to right, rgba(202, 233, 249, 0.25) 0%, rgba(202, 233, 249, 0) 100%) 1 !important;
    border-width: 0 0 1px 0 !important;
}

table tbody > tr > td:first-child {
    background-color: transparent;
    border-image: linear-gradient(to right, rgba(202, 233, 249, 0) 0%, rgba(202, 233, 249, 0.25) 100%) 1 !important;
    border-width: 0 0 1px 0 !important;
}

table tbody > tr > td {
    border: 1px solid rgba(202, 233, 249, 0.25) !important;
    border-width: 0 0 1px 0 !important;
}

table tbody > tr > td {
    padding: .5rem !important;
    -ms-flex-line-pack: center !important;
    align-content: center !important;
}

table tbody > tr > td:last-child {
    background-color: transparent;
    border-image: linear-gradient(to right, rgba(202, 233, 249, 0.25) 0%, rgba(202, 233, 249, 0) 100%) 1 !important;
    border-width: 0 0 1px 0 !important;
}

table tbody > tr:first-child > td:first-child {
    background-color: transparent;
    border-image: linear-gradient(to right, rgba(18, 22, 24, 0) 0%, rgba(202, 233, 249, 0.25) 100%) 1 !important;
    border-width: 0 0 1px 0 !important;
}

table tbody > tr:last-child > td:first-child {
    background-color: transparent;
    border: none;
}

.col-12 > table {
    overflow-x: auto; /* Ensure the table itself can handle horizontal scrolling */
}

.col-12:has(> table) {
    overflow-x: scroll;
    overflow-x: auto;
}

/**
Tinymce
Important must be declared, otherwise Tinymce core css is loaded over
 */

.tox-tinymce {
    border: none !important;
}

.tox:not(.tox-tinymce-inline) .tox-editor-header {
    background-color: transparent !important;
}

.tox-promotion {
    display: none !important;
}

.tox .tox-menubar {
    background-color: transparent !important;
}

.tox .tox-mbtn {
    color: white !important;
    background: transparent !important;
}

.tox .tox-toolbar-overlord {
    background-color: transparent !important;
}

.tox .tox-toolbar, .tox .tox-toolbar__overflow, .tox .tox-toolbar__primary {
    background-color: transparent !important;
}

.tox .tox-tbtn {
    background-color: transparent !important;
}

.tox .tox-tbtn--disabled, .tox .tox-tbtn--disabled:hover, .tox .tox-tbtn:disabled, .tox .tox-tbtn:disabled:hover {
    background-color: transparent !important;
}

.tox .tox-tbtn--disabled svg, .tox .tox-tbtn--disabled:hover svg, .tox .tox-tbtn:disabled svg, .tox .tox-tbtn:disabled:hover svg {
    fill: white !important;
}

.tox .tox-tbtn svg {
    fill: white !important;
}

.tox .tox-statusbar {
    background-color: transparent !important;
    color: white !important;
}

.tox .tox-statusbar a, .tox .tox-statusbar__path-item, .tox .tox-statusbar__wordcount {
    color: white !important;
}

.tox-statusbar__right-container {
    display: none !important;
}

.tox .tox-statusbar__resize-handle svg {
    fill: white !important;
}

.mce-content-body {
    background-color: transparent !important;
}

/**
Others
 */

.cursor-pointer {
    cursor: pointer;
}

.unread {
    font-weight: bold !important;
    color: orange;
}

.game-pm {
    /* position: relative; */
    /* height: 51px; */
    /* line-height: 50px; */
    cursor: default;
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
}

.game-pm:hover {
    background: linear-gradient(to right, rgba(20, 20, 20, 0.5) 50%, rgba(30, 30, 30, 1) 100%);
    -webkit-transition-duration: 10ms;
    transition-duration: 10ms;
    border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;
    border-width: 10px !important;
    border-bottom: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
    border-top: var(--ct-border-width) var(--ct-border-style) var(--ct-border-color) !important;
}

.resbar_bar_desktop {
    height: 5px;
    width: 50px;
}

.resbar_bar_mobile {
    height: 5px;
}

.resbar_bar {
    width: 0;
}

/**
Avatars
 */

.af-class {
    z-index: 1010 !important;
}

@media (max-width: 767.98px) {
    .af-class {
        position: fixed;
        top: 0;
        left: 0;
        width: 50px !important;
        height: 50px !important;
    }
}


@media (min-width: 767.98px) {
    .af-class {
        position: fixed;
        height: 70px !important;
        width: 70px !important;
        padding: 1px;
    }
}

.af-default-galaxy-6 {
    /* border: 1px solid;
    border-image: linear-gradient(to left, rgb(202, 233, 249) 0%, rgb(18, 22, 24) 50%, rgb(202, 233, 249) 100%) 1 !important; */
    width: 1rem !important;
    position: absolute;
    top: 0;
    left: 0;
}

.af-default-galaxy-7 {
    /* border: 1px solid;
    border-image: linear-gradient(to left, rgb(202, 233, 249) 0%, rgb(18, 22, 24) 50%, rgb(202, 233, 249) 100%) 1 !important; */
    width: 1.4rem !important;
    position: absolute;
    top: 0;
    left: 0;
}

.af-default-mask {
    height: inherit;
}

.af-default-display-mask {
    height: 2rem;
}

.af-default-displayprofile-mask {
    height: 6rem;
}

.af-config-galaxy-6-mask {
    width: 1.1rem !important;
    position: absolute;
    top: -1px;
    left: -1px;
    z-index: 2;
}

.af-config-galaxy-6-image {
    width: 1rem !important;
    position: absolute;
    top: 0;
    left: 0;
}

.af-config-galaxy-7-mask {
    width: 1.5rem !important;
    position: absolute;
    top: -1px;
    left: -1px;
    z-index: 2;
}

.af-config-galaxy-7-image {
    width: 1.25rem !important;
    position: absolute;
    top: 1px;
    left: 1px;
}

.af-config-mobile-mask {
    width: 55px !important;
    position: absolute;
    z-index: 2;
    top: -2px;
    left: -2px;
}

.af-config-mobile-image {
    position: absolute;
    width: 90% !important;
    height: 90%;
    z-index: 1;
    top: 0.1rem;
    left: 0.1rem;
}

.af-config-desktop-mask {
    width: 5rem !important;
    position: absolute;
    z-index: 2;
    top: -5px;
    left: -5px;
}

.af-config-desktop-image {
    position: absolute;
    width: inherit !important;
    height: inherit;
    padding: 1px;
    border: 1px solid rgb(202, 233, 249);
    border: none !important;
    background: rgb(202, 233, 249);
    background: transparent !important;
}

.af-config-display-div {
    width: 2rem !important;
}

.af-config-display-mask {
    width: 2.25rem !important;
    position: absolute;
    z-index: 2;
    top: -2px;
    left: -2px;
}

.af-config-display-image {
    width: inherit !important;
    height: inherit;
}

.af-config-displayprofile-div {
    width: 6rem !important;
}

.af-config-displayprofile-mask {
    width: 7.25rem !important;
    position: absolute;
    z-index: 2;
    top: -10px;
    left: -10px;
}

.af-config-lobby-div {
    width: 3rem !important;
}

.af-config-lobby-mask {
    width: inherit;
    position: absolute;
    z-index: 2;
}

/**
Sci-fi borders
 */

.border-style-1.app-sidebar .top-left:before,
.border-style-1.card.custom-card .top-left:before,
.border-style-1.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100%;
    background: linear-gradient(to right, transparent, rgb(202, 233, 249));
    inset-inline-end: 0;
}

.border-style-1.app-sidebar .top-right,
.border-style-1.card.custom-card .top-right,
.border-style-1.page-header-breadcrumb .top-right {
    position: absolute;
    top: 0;
    height: 2px;
    inset-inline-end: 0;
    background: rgba(255, 255, 255, 0.1);
    width: 20px;
}

.border-style-1.app-sidebar .top-right:before,
.border-style-1.card.custom-card .top-right:before,
.border-style-1.page-header-breadcrumb .top-right:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100%;
    background: linear-gradient(to left, transparent, rgb(202, 233, 249));
    inset-inline-start: 0;
}

.border-style-1.app-sidebar .bottom-left,
.border-style-1.card.custom-card .bottom-left,
.border-style-1.page-header-breadcrumb .bottom-left {
    position: absolute;
    bottom: 0;
    height: 2px;
    inset-inline-start: 0;
    background: rgba(255, 255, 255, 0.1);
    width: 20px;
}

.border-style-1.app-sidebar .bottom-left:before,
.border-style-1.card.custom-card .bottom-left:before,
.border-style-1.page-header-breadcrumb .bottom-left:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100%;
    background: linear-gradient(to right, transparent, rgb(202, 233, 249));
    inset-inline-end: 0;
}

.border-style-1.app-sidebar .bottom-right,
.border-style-1.card.custom-card .bottom-right,
.border-style-1.page-header-breadcrumb .bottom-right {
    position: absolute;
    bottom: 0;
    height: 2px;
    inset-inline-end: 0;
    background: rgba(255, 255, 255, 0.1);
    width: 20px;
}

.border-style-1.app-sidebar .bottom-right:before,
.border-style-1.card.custom-card .bottom-right:before,
.border-style-1.page-header-breadcrumb .bottom-right:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100%;
    background: linear-gradient(to left, transparent, rgb(202, 233, 249));
    inset-inline-start: 0;
}

.border-style-1.background-style-1 .app-sidebar,
.border-style-1.background-style-1 .card.custom-card,
.border-style-1.background-style-1 .page-header-breadcrumb {
    border-inline: 1px solid rgba(255, 255, 255, 0.1);
}

.border-style-2.app-sidebar,
.border-style-2.page-header-breadcrumb {
    border: 0;
    background: rgba(202, 233, 249, 0.025);
}

.border-style-2.app-sidebar .top-left,
.border-style-2.page-header-breadcrumb .top-left {
    position: absolute;
    width: 100%;
    height: 1px;
    background: linear-gradient(to right, rgb(202, 233, 249), transparent);
    inset-block-start: 0;
    inset-inline-start: 0;
}

.border-style-2.app-sidebar .top-left:before,
.border-style-2.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    width: 15px;
    height: 3px;
    background-color: rgb(202, 233, 249);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-style-2.app-sidebar .top-right,
.border-style-2.page-header-breadcrumb .top-right {
    position: absolute;
    height: 100%;
    width: 1px;
    background: rgba(202, 233, 249, 0.1);
    inset-block-start: 0;
    inset-inline-end: 0;
}

.border-style-2.app-sidebar .top-right:before,
.border-style-2.page-header-breadcrumb .top-right:before {
    content: "";
    position: absolute;
    width: 3px;
    height: 15px;
    background-color: rgb(202, 233, 249);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-style-2.app-sidebar .bottom-left,
.border-style-2.page-header-breadcrumb .bottom-left {
    position: absolute;
    width: 1px;
    height: 100%;
    background: linear-gradient(to bottom, rgb(202, 233, 249), transparent);
    inset-block-start: 0;
    inset-inline-start: 0;
}

.border-style-2.app-sidebar .bottom-right,
.border-style-2.page-header-breadcrumb .bottom-right {
    position: absolute;
    width: 100%;
    height: 1px;
    background: rgba(202, 233, 249, 0.1);
    inset-block-end: 0;
    inset-inline-start: 0;
}

.border-style-2.card.custom-card {
    border: 0;
    background: rgba(202, 233, 249, 0.025);
    background: url('assets/scifi-bs-html/bg/4.svg'), rgba(202, 233, 249, 0.025);
}

.border-style-2.card.custom-card:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: transparent;
    transform: rotate(45deg);
    inset-inline-end: -14px;
    inset-block-start: -14px;
    border-block-end: 1px solid rgba(202, 233, 249, 0.1);
}

.border-style-2.card.custom-card .top-left {
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(to top, transparent, rgb(202, 233, 249));
}

.border-style-2.card.custom-card .top-left:before {
    z-index: 1;
    content: "";
    position: absolute;
    height: 15px;
    width: 3px;
    background-color: rgb(202, 233, 249);
    inset-inline-start: 0;
    inset-block-end: 0px;
}

.border-style-2.card.custom-card .top-right {
    position: absolute;
    height: 1px;
    inset-block-start: 0;
    inset-inline-start: 0;
    inset-inline-end: 20px;
    background-color: rgba(202, 233, 249, 0.1);
}

.border-style-2.card.custom-card .top-right:before {
    z-index: 1;
    content: "";
    position: absolute;
    transform: rotate(45deg);
    width: 0;
    height: 0;
    inset-inline-end: -28px;
    inset-block-start: -2px;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid rgb(202, 233, 249);
}

.border-style-2.card.custom-card .bottom-left {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(to right, transparent, rgb(202, 233, 249));
}

.border-style-2.card.custom-card .bottom-left:before {
    content: "";
    position: absolute;
    width: 15px;
    height: 3px;
    background-color: rgb(202, 233, 249);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-2.card.custom-card .bottom-right {
    position: absolute;
    width: 1px;
    top: 20px;
    bottom: 0;
    inset-inline-end: 0;
    background-color: rgba(202, 233, 249, 0.1);
}

.border-style-2.card.custom-card .bottom-right:before {
    content: "";
    position: absolute;
    height: 2.125rem;
    width: 4px;
    background-color: rgb(202, 233, 249);
    inset-inline-end: 0px;
    inset-block-end: 1rem;
    border-start-start-radius: 20px;
    border-start-end-radius: 0px;
    border-end-end-radius: 0px;
    border-end-start-radius: 20px;
}

.border-style-2.background-style-1 .app-sidebar,
.border-style-2.background-style-1 .card.custom-card,
.border-style-2.background-style-1 .page-header-breadcrumb {
    border: 0;
}

.border-style-3.card.custom-card,
.border-style-3.app-sidebar,
.border-style-3.page-header-breadcrumb {
    border: 0;
    border-block: 1px solid rgba(202, 233, 249, 0.1);
}

.border-style-3.card.custom-card:before,
.border-style-3.app-sidebar:before,
.border-style-3.page-header-breadcrumb:before {
    content: "";
    position: absolute;
    width: 50px;
    height: 3px;
    background-color: rgba(202, 233, 249, 0.7);
    inset-block-start: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 0;
}

.border-style-3.card.custom-card:after,
.border-style-3.app-sidebar:after,
.border-style-3.page-header-breadcrumb:after {
    content: "";
    position: absolute;
    width: 50px;
    height: 3px;
    background-color: rgba(202, 233, 249, 0.7);
    inset-block-end: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 0;
}

.border-style-3.card.custom-card .top-left,
.border-style-3.app-sidebar .top-left,
.border-style-3.page-header-breadcrumb .top-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-3.card.custom-card .top-left:before,
.border-style-3.app-sidebar .top-left:before,
.border-style-3.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: linear-gradient(to right, rgb(202, 233, 249), transparent);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-3.card.custom-card .top-left:after,
.border-style-3.app-sidebar .top-left:after,
.border-style-3.page-header-breadcrumb .top-left:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 30px;
    background: linear-gradient(to bottom, rgb(202, 233, 249), transparent);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-3.card.custom-card .top-right,
.border-style-3.app-sidebar .top-right,
.border-style-3.page-header-breadcrumb .top-right {
    inset-block-start: 0;
    inset-inline-end: 0;
    position: absolute;
}

.border-style-3.card.custom-card .top-right:before,
.border-style-3.app-sidebar .top-right:before,
.border-style-3.page-header-breadcrumb .top-right:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: linear-gradient(to left, rgb(202, 233, 249), transparent);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-style-3.card.custom-card .top-right:after,
.border-style-3.app-sidebar .top-right:after,
.border-style-3.page-header-breadcrumb .top-right:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 30px;
    background: linear-gradient(to bottom, rgb(202, 233, 249), transparent);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-style-3.card.custom-card .bottom-left,
.border-style-3.app-sidebar .bottom-left,
.border-style-3.page-header-breadcrumb .bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-3.card.custom-card .bottom-left:before,
.border-style-3.app-sidebar .bottom-left:before,
.border-style-3.page-header-breadcrumb .bottom-left:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: linear-gradient(to right, rgb(202, 233, 249), transparent);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-3.card.custom-card .bottom-left:after,
.border-style-3.app-sidebar .bottom-left:after,
.border-style-3.page-header-breadcrumb .bottom-left:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 30px;
    background: linear-gradient(to top, rgb(202, 233, 249), transparent);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-3.card.custom-card .bottom-right,
.border-style-3.app-sidebar .bottom-right,
.border-style-3.page-header-breadcrumb .bottom-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-style-3.card.custom-card .bottom-right:before,
.border-style-3.app-sidebar .bottom-right:before,
.border-style-3.page-header-breadcrumb .bottom-right:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: linear-gradient(to left, rgb(202, 233, 249), transparent);
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-style-3.card.custom-card .bottom-right:after,
.border-style-3.app-sidebar .bottom-right:after,
.border-style-3.page-header-breadcrumb .bottom-right:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 30px;
    background: linear-gradient(to top, rgb(202, 233, 249), transparent);
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-style-3.background-style-1 .app-sidebar,
.border-style-3.background-style-1 .card.custom-card,
.border-style-3.background-style-1 .page-header-breadcrumb {
    border: 0;
}

.border-style-3.card.custom-card.bg-danger {
    border: 0;
    border-block: 1px solid rgba(237, 55, 55, 0.1);
}

.border-style-3.card.custom-card.bg-danger:before {
    background-color: rgba(237, 55, 55, 0.7);
}

.border-style-3.card.custom-card.bg-danger:after {
    background-color: rgba(237, 55, 55, 0.7);
}

.border-style-3.card.custom-card.bg-danger .top-left:before {
    background: linear-gradient(to right, rgb(237, 55, 55), transparent);
}

.border-style-3.card.custom-card.bg-danger .top-left:after {
    background: linear-gradient(to bottom, rgb(237, 55, 55), transparent);
}

.border-style-3.card.custom-card.bg-danger .top-right:before {
    background: linear-gradient(to left, rgb(237, 55, 55), transparent);
}

.border-style-3.card.custom-card.bg-danger .top-right:after {
    background: linear-gradient(to bottom, rgb(237, 55, 55), transparent);
}

.border-style-3.card.custom-card.bg-danger .bottom-left:before {
    background: linear-gradient(to right, rgb(237, 55, 55), transparent);
}

.border-style-3.card.custom-card.bg-danger .bottom-left:after {
    background: linear-gradient(to top, rgb(237, 55, 55), transparent);
}

.border-style-3.card.custom-card.bg-danger .bottom-right:before {
    background: linear-gradient(to left, rgb(237, 55, 55), transparent);
}

.border-style-3.card.custom-card.bg-danger .bottom-right:after {
    background: linear-gradient(to top, rgb(237, 55, 55), transparent);
}

.border-style-3.card.custom-card.bg-warning {
    border: 0;
    border-block: 1px solid rgba(250, 146, 29, 0.1);
}

.border-style-3.card.custom-card.bg-warning:before {
    background-color: rgba(250, 146, 29, 0.7);
}

.border-style-3.card.custom-card.bg-warning:after {
    background-color: rgba(250, 146, 29, 0.7);
}

.border-style-3.card.custom-card.bg-warning .top-left:before {
    background: linear-gradient(to right, rgb(250, 146, 29), transparent);
}

.border-style-3.card.custom-card.bg-warning .top-left:after {
    background: linear-gradient(to bottom, rgb(250, 146, 29), transparent);
}

.border-style-3.card.custom-card.bg-warning .top-right:before {
    background: linear-gradient(to left, rgb(250, 146, 29), transparent);
}

.border-style-3.card.custom-card.bg-warning .top-right:after {
    background: linear-gradient(to bottom, rgb(250, 146, 29), transparent);
}

.border-style-3.card.custom-card.bg-warning .bottom-left:before {
    background: linear-gradient(to right, rgb(250, 146, 29), transparent);
}

.border-style-3.card.custom-card.bg-warning .bottom-left:after {
    background: linear-gradient(to top, rgb(250, 146, 29), transparent);
}

.border-style-3.card.custom-card.bg-warning .bottom-right:before {
    background: linear-gradient(to left, rgb(250, 146, 29), transparent);
}

.border-style-3.card.custom-card.bg-warning .bottom-right:after {
    background: linear-gradient(to top, rgb(250, 146, 29), transparent);
}

.border-style-4.card.custom-card,
.border-style-4.app-sidebar,
.border-style-4.page-header-breadcrumb {
    border: 0;
}

.border-style-4.card.custom-card .top-left,
.border-style-4.app-sidebar .top-left,
.border-style-4.page-header-breadcrumb .top-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-4.card.custom-card .top-left:before,
.border-style-4.app-sidebar .top-left:before,
.border-style-4.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background: rgb(202, 233, 249);
    inset-inline-start: 3px;
    inset-block-start: 3px;
}

.border-style-4.card.custom-card .top-left:after,
.border-style-4.app-sidebar .top-left:after,
.border-style-4.page-header-breadcrumb .top-left:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    background: rgb(202, 233, 249);
    inset-inline-start: 3px;
    inset-block-start: 3px;
}

.border-style-4.card.custom-card .top-right,
.border-style-4.app-sidebar .top-right,
.border-style-4.page-header-breadcrumb .top-right {
    inset-block-start: 0;
    inset-inline-end: 0;
    position: absolute;
}

.border-style-4.card.custom-card .top-right:before,
.border-style-4.app-sidebar .top-right:before,
.border-style-4.page-header-breadcrumb .top-right:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background: rgb(202, 233, 249);
    inset-inline-end: 3px;
    inset-block-start: 3px;
}

.border-style-4.card.custom-card .top-right:after,
.border-style-4.app-sidebar .top-right:after,
.border-style-4.page-header-breadcrumb .top-right:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    background: rgb(202, 233, 249);
    inset-inline-end: 3px;
    inset-block-start: 3px;
}

.border-style-4.card.custom-card .bottom-left,
.border-style-4.app-sidebar .bottom-left,
.border-style-4.page-header-breadcrumb .bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-4.card.custom-card .bottom-left:before,
.border-style-4.app-sidebar .bottom-left:before,
.border-style-4.page-header-breadcrumb .bottom-left:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background: rgb(202, 233, 249);
    inset-inline-start: 3px;
    inset-block-end: 3px;
}

.border-style-4.card.custom-card .bottom-left:after,
.border-style-4.app-sidebar .bottom-left:after,
.border-style-4.page-header-breadcrumb .bottom-left:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    background: rgb(202, 233, 249);
    inset-inline-start: 3px;
    inset-block-end: 3px;
}

.border-style-4.card.custom-card .bottom-right,
.border-style-4.app-sidebar .bottom-right,
.border-style-4.page-header-breadcrumb .bottom-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-style-4.card.custom-card .bottom-right:before,
.border-style-4.app-sidebar .bottom-right:before,
.border-style-4.page-header-breadcrumb .bottom-right:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background: rgb(202, 233, 249);
    inset-inline-end: 3px;
    inset-block-end: 3px;
}

.border-style-4.card.custom-card .bottom-right:after,
.border-style-4.app-sidebar .bottom-right:after,
.border-style-4.page-header-breadcrumb .bottom-right:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    background: rgb(202, 233, 249);
    inset-inline-end: 3px;
    inset-block-end: 3px;
}

.border-style-4.background-style-1 .app-sidebar,
.border-style-4.background-style-1 .card.custom-card,
.border-style-4.background-style-1 .page-header-breadcrumb {
    border: 1px solid rgba(202, 233, 249, 0.1);
}

.border-style-5.app-sidebar,
.border-style-5.card.custom-card,
.border-style-5.page-header-breadcrumb {
    border-inline: 1px solid rgba(202, 233, 249, 0.5);
}

.border-style-5.card.custom-card,
.border-style-5.app-sidebar,
.border-style-5.page-header-breadcrumb {
    /* background: transparent; */
}

.border-style-5.card.custom-card .top-left,
.border-style-5.app-sidebar .top-left,
.border-style-5.page-header-breadcrumb .top-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-5.card.custom-card .top-left:before,
.border-style-5.app-sidebar .top-left:before,
.border-style-5.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: rgba(202, 233, 249, 0.5);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-5.card.custom-card .top-left:after,
.border-style-5.app-sidebar .top-left:after,
.border-style-5.page-header-breadcrumb .top-left:after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.5);
    inset-inline-start: 30px;
    inset-block-start: -2px;
    border-radius: 50%;
}

.border-style-5.card.custom-card .top-right,
.border-style-5.app-sidebar .top-right,
.border-style-5.page-header-breadcrumb .top-right {
    inset-block-start: 0;
    inset-inline-end: 0;
    position: absolute;
}

.border-style-5.card.custom-card .top-right:before,
.border-style-5.app-sidebar .top-right:before,
.border-style-5.page-header-breadcrumb .top-right:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: rgba(202, 233, 249, 0.5);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-style-5.card.custom-card .top-right:after,
.border-style-5.app-sidebar .top-right:after,
.border-style-5.page-header-breadcrumb .top-right:after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.5);
    inset-inline-end: 30px;
    inset-block-start: -2px;
    border-radius: 50%;
}

.border-style-5.card.custom-card .bottom-left,
.border-style-5.app-sidebar .bottom-left,
.border-style-5.page-header-breadcrumb .bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-5.card.custom-card .bottom-left:before,
.border-style-5.app-sidebar .bottom-left:before,
.border-style-5.page-header-breadcrumb .bottom-left:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: rgba(202, 233, 249, 0.5);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-5.card.custom-card .bottom-left:after,
.border-style-5.app-sidebar .bottom-left:after,
.border-style-5.page-header-breadcrumb .bottom-left:after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.5);
    inset-inline-start: 30px;
    inset-block-end: -2px;
    border-radius: 50%;
}

.border-style-5.card.custom-card .bottom-right,
.border-style-5.app-sidebar .bottom-right,
.border-style-5.page-header-breadcrumb .bottom-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-style-5.card.custom-card .bottom-right:before,
.border-style-5.app-sidebar .bottom-right:before,
.border-style-5.page-header-breadcrumb .bottom-right:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: rgba(202, 233, 249, 0.5);
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-style-5.card.custom-card .bottom-right:after,
.border-style-5.app-sidebar .bottom-right:after,
.border-style-5.page-header-breadcrumb .bottom-right:after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.5);
    inset-inline-end: 30px;
    inset-block-end: -2px;
    border-radius: 50%;
}

.border-style-5.background-style-1 .app-sidebar,
.border-style-5.background-style-1 .card.custom-card,
.border-style-5.background-style-1 .page-header-breadcrumb {
    border-inline: 1px solid rgba(202, 233, 249, 0.5);
}


.border-style-5.card.custom-card.bg-danger {
    border-inline: 1px solid rgba(237, 55, 55, 0.5);
}

.border-style-5.card.custom-card.bg-danger:before {
    background-color: rgba(237, 55, 55, 0.7);
}

.border-style-5.card.custom-card.bg-danger:after {
    background-color: rgba(237, 55, 55, 0.7);
}

.border-style-5.card.custom-card.bg-danger .top-left:before {
    background: linear-gradient(to right, rgb(237, 55, 55), transparent);
}

.border-style-5.card.custom-card.bg-danger .top-left:after {
    background: linear-gradient(to bottom, rgb(237, 55, 55), transparent);
}

.border-style-5.card.custom-card.bg-danger .top-right:before {
    background: linear-gradient(to left, rgb(237, 55, 55), transparent);
}

.border-style-5.card.custom-card.bg-danger .top-right:after {
    background: linear-gradient(to bottom, rgb(237, 55, 55), transparent);
}

.border-style-5.card.custom-card.bg-danger .bottom-left:before {
    background: linear-gradient(to right, rgb(237, 55, 55), transparent);
}

.border-style-5.card.custom-card.bg-danger .bottom-left:after {
    background: linear-gradient(to top, rgb(237, 55, 55), transparent);
}

.border-style-5.card.custom-card.bg-danger .bottom-right:before {
    background: linear-gradient(to left, rgb(237, 55, 55), transparent);
}

.border-style-5.card.custom-card.bg-danger .bottom-right:after {
    background: linear-gradient(to top, rgb(237, 55, 55), transparent);
}

.border-style-5.card.custom-card.bg-warning {
    border-inline: 1px solid rgba(250, 146, 29, 0.5);
}

.border-style-5.card.custom-card.bg-warning:before {
    background-color: rgba(250, 146, 29, 0.7);
}

.border-style-5.card.custom-card.bg-warning:after {
    background-color: rgba(250, 146, 29, 0.7);
}

.border-style-5.card.custom-card.bg-warning .top-left:before {
    background: linear-gradient(to right, rgb(250, 146, 29), transparent);
}

.border-style-5.card.custom-card.bg-warning .top-left:after {
    background: linear-gradient(to bottom, rgb(250, 146, 29), transparent);
}

.border-style-5.card.custom-card.bg-warning .top-right:before {
    background: linear-gradient(to left, rgb(250, 146, 29), transparent);
}

.border-style-5.card.custom-card.bg-warning .top-right:after {
    background: linear-gradient(to bottom, rgb(250, 146, 29), transparent);
}

.border-style-5.card.custom-card.bg-warning .bottom-left:before {
    background: linear-gradient(to right, rgb(250, 146, 29), transparent);
}

.border-style-5.card.custom-card.bg-warning .bottom-left:after {
    background: linear-gradient(to top, rgb(250, 146, 29), transparent);
}

.border-style-5.card.custom-card.bg-warning .bottom-right:before {
    background: linear-gradient(to left, rgb(250, 146, 29), transparent);
}

.border-style-5.card.custom-card.bg-warning .bottom-right:after {
    background: linear-gradient(to top, rgb(250, 146, 29), transparent);
}

.border-style-6 body {
    background: rgb(10, 10, 10);
}

.border-style-6.card.custom-card,
.border-style-6.app-sidebar,
.border-style-6.page-header-breadcrumb {
    border-inline: 0;
    background: rgba(66, 66, 66, 0.4);
    border: 1px solid rgb(95, 95, 95);
}

.border-style-6.card.custom-card .top-left,
.border-style-6.app-sidebar .top-left,
.border-style-6.page-header-breadcrumb .top-left {
    position: absolute;
}

.border-style-6.card.custom-card .top-right,
.border-style-6.app-sidebar .top-right,
.border-style-6.page-header-breadcrumb .top-right {
    position: absolute;
}

.border-style-6.card.custom-card .bottom-left,
.border-style-6.app-sidebar .bottom-left,
.border-style-6.page-header-breadcrumb .bottom-left {
    position: absolute;
}

.border-style-6.card.custom-card .bottom-right,
.border-style-6.app-sidebar .bottom-right,
.border-style-6.page-header-breadcrumb .bottom-right {
    position: absolute;
}

.border-style-6.background-style-1 .app-sidebar,
.border-style-6.background-style-1 .card.custom-card,
.border-style-6.background-style-1 .page-header-breadcrumb {
    border-inline: 0;
    border: 1px solid rgba(95, 95, 95, 0.3);
}

.border-style-7.app-sidebar,
.border-style-7.card.custom-card,
.border-style-7.page-header-breadcrumb {
    border-inline: 1px solid rgba(202, 233, 249, 0.5);
}

.border-style-7.card.custom-card,
.border-style-7.app-sidebar,
.border-style-7.page-header-breadcrumb {
    /* background: rgba(202, 233, 249, 0.05); */
}

.border-style-7.card.custom-card .top-left,
.border-style-7.app-sidebar .top-left,
.border-style-7.page-header-breadcrumb .top-left {
    position: absolute;
    width: 100%;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-7.card.custom-card .top-left:before,
.border-style-7.app-sidebar .top-left:before,
.border-style-7.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    width: 25%;
    height: 1px;
    background: linear-gradient(to right, rgba(202, 233, 249, 0.5), transparent);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-7.card.custom-card .top-left:after,
.border-style-7.app-sidebar .top-left:after,
.border-style-7.page-header-breadcrumb .top-left:after {
    content: "";
    position: absolute;
    width: 75%;
    height: 1px;
    background: linear-gradient(to left, rgba(202, 233, 249, 0.5), transparent);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-style-7.card.custom-card .top-right,
.border-style-7.app-sidebar .top-right,
.border-style-7.page-header-breadcrumb .top-right {
    position: absolute;
    width: 50px;
    inset-inline-start: 15%;
    inset-block-start: 0;
}

.border-style-7.card.custom-card .top-right:before,
.border-style-7.app-sidebar .top-right:before,
.border-style-7.page-header-breadcrumb .top-right:before {
    content: "";
    width: 30px;
    height: 2px;
    inset-inline-start: 25%;
    top: -2px;
    background-color: rgba(202, 233, 249, 0.8);
    position: absolute;
}

.border-style-7.card.custom-card .top-right:after,
.border-style-7.app-sidebar .top-right:after,
.border-style-7.page-header-breadcrumb .top-right:after {
    content: "";
    width: 30px;
    height: 2px;
    inset-inline-start: 55%;
    top: 0;
    background-color: rgba(202, 233, 249, 0.8);
    position: absolute;
}

.border-style-7.card.custom-card .bottom-left,
.border-style-7.app-sidebar .bottom-left,
.border-style-7.page-header-breadcrumb .bottom-left {
    position: absolute;
    width: 100%;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-7.card.custom-card .bottom-left:before,
.border-style-7.app-sidebar .bottom-left:before,
.border-style-7.page-header-breadcrumb .bottom-left:before {
    content: "";
    position: absolute;
    width: 75%;
    height: 1px;
    background: linear-gradient(to right, rgba(202, 233, 249, 0.5), transparent);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-7.card.custom-card .bottom-left:after,
.border-style-7.app-sidebar .bottom-left:after,
.border-style-7.page-header-breadcrumb .bottom-left:after {
    content: "";
    position: absolute;
    width: 25%;
    height: 1px;
    background: linear-gradient(to left, rgba(202, 233, 249, 0.5), transparent);
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-style-7.card.custom-card .bottom-right,
.border-style-7.app-sidebar .bottom-right,
.border-style-7.page-header-breadcrumb .bottom-right {
    position: absolute;
    width: 50px;
    inset-inline-end: 15%;
    inset-block-end: 0;
}

.border-style-7.card.custom-card .bottom-right:before,
.border-style-7.app-sidebar .bottom-right:before,
.border-style-7.page-header-breadcrumb .bottom-right:before {
    content: "";
    width: 30px;
    height: 2px;
    inset-inline-end: 25%;
    top: -2px;
    background-color: rgba(202, 233, 249, 0.8);
    position: absolute;
}

.border-style-7.card.custom-card .bottom-right:after,
.border-style-7.app-sidebar .bottom-right:after,
.border-style-7.page-header-breadcrumb .bottom-right:after {
    content: "";
    width: 30px;
    height: 2px;
    inset-inline-end: 55%;
    top: 0;
    background-color: rgba(202, 233, 249, 0.8);
    position: absolute;
}

.border-style-7.background-style-1 .app-sidebar,
.border-style-7.background-style-1 .card.custom-card,
.border-style-7.background-style-1 .page-header-breadcrumb {
    border-inline: 1px solid rgba(202, 233, 249, 0.5);
}

.border-style-8 body {
    background: rgb(10, 10, 10);
}

.border-style-8.card.custom-card,
.border-style-8.app-sidebar,
.border-style-8.page-header-breadcrumb {
    /* background: transparent; */
}

.border-style-8-top-left,
.border-style-8.card.custom-card .top-left,
.border-style-8.app-sidebar .top-left,
.border-style-8.page-header-breadcrumb .top-left {
    width: 100%;
    height: 100%;
    position: absolute;
    inset-inline-start: 0;
    z-index: 0;
    pointer-events: none;
}

.border-style-8-top-left:before,
.border-style-8.card.custom-card .top-left:before,
.border-style-8.app-sidebar .top-left:before,
.border-style-8.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.8);
}

.border-style-8-top-left:after,
.border-style-8.card.custom-card .top-left:after,
.border-style-8.app-sidebar .top-left:after,
.border-style-8.page-header-breadcrumb .top-left:after {
    content: "";
    position: absolute;
    height: 1px;
    background: rgba(202, 233, 249, 0.2);
    inset-block-start: 0;
    inset-inline-end: 10px;
    inset-inline-start: 10px;
}

.border-style-8-top-right,
.border-style-8.card.custom-card .top-right,
.border-style-8.app-sidebar .top-right,
.border-style-8.page-header-breadcrumb .top-right {
    position: absolute;
    width: 100%;
    height: 100%;
    inset-inline-end: 0;
    z-index: 0;
    pointer-events: none;
}

.border-style-8-top-right:before,
.border-style-8.card.custom-card .top-right:before,
.border-style-8.app-sidebar .top-right:before,
.border-style-8.page-header-breadcrumb .top-right:before {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 0;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.8);
}

.border-style-8-top-right:after,
.border-style-8.card.custom-card .top-right:after,
.border-style-8.app-sidebar .top-right:after,
.border-style-8.page-header-breadcrumb .top-right:after {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 10px;
    inset-block-end: 10px;
    width: 1px;
    background: rgba(202, 233, 249, 0.2);
}

.border-style-8-bottom-left,
.border-style-8.card.custom-card .bottom-left,
.border-style-8.app-sidebar .bottom-left,
.border-style-8.page-header-breadcrumb .bottom-left {
    width: 100%;
    position: absolute;
    inset-block-end: 0;
    inset-inline-start: 0;
    z-index: 0;
    pointer-events: none;
}

.border-style-8-bottom-left:before,
.border-style-8.card.custom-card .bottom-left:before,
.border-style-8.app-sidebar .bottom-left:before,
.border-style-8.page-header-breadcrumb .bottom-left:before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.8);
}

.border-style-8-bottom-left:after,
.border-style-8.card.custom-card .bottom-left:after,
.border-style-8.app-sidebar .bottom-left:after,
.border-style-8.page-header-breadcrumb .bottom-left:after {
    content: "";
    position: absolute;
    height: 1px;
    background: rgba(202, 233, 249, 0.2);
    inset-block-end: 0;
    inset-inline-end: 10px;
    inset-inline-start: 10px;
}

.border-style-8-bottom-right,
.border-style-8.card.custom-card .bottom-right,
.border-style-8.app-sidebar .bottom-right,
.border-style-8.page-header-breadcrumb .bottom-right {
    position: absolute;
    height: 100%;
    width: 100%;
    inset-inline-end: 0;
    z-index: 0;
    pointer-events: none;
}

.border-style-8-bottom-right:before,
.border-style-8.card.custom-card .bottom-right:before,
.border-style-8.app-sidebar .bottom-right:before,
.border-style-8.page-header-breadcrumb .bottom-right:before {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.8);
}

.border-style-8-bottom-right:after,
.border-style-8.card.custom-card .bottom-right:after,
.border-style-8.app-sidebar .bottom-right:after,
.border-style-8.page-header-breadcrumb .bottom-right:after {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 10px;
    inset-block-end: 10px;
    width: 1px;
    background: rgba(202, 233, 249, 0.2);
}

.border-style-8.background-style-1 .app-sidebar,
.border-style-8.background-style-1 .card.custom-card,
.border-style-8.background-style-1 .page-header-breadcrumb {
    border: 0;
}

.border-style-9.card.custom-card:before,
.border-style-9.app-sidebar:before,
.border-style-9.page-header-breadcrumb:before {
    z-index: 1;
    content: "";
    position: absolute;
    transform: rotate(45deg);
    width: 0;
    height: 0;
    inset-inline-end: -2px;
    inset-block-start: 2px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid rgba(202, 233, 249, 0.6);
}

.border-style-9.card.custom-card:after,
.border-style-9.app-sidebar:after,
.border-style-9.page-header-breadcrumb:after {
    z-index: 1;
    content: "";
    position: absolute;
    transform: rotate(225deg);
    width: 0;
    height: 0;
    inset-inline-start: -2px;
    inset-block-end: 2px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-bottom: 8px solid rgba(202, 233, 249, 0.6);
}

.border-style-9.card.custom-card .top-left,
.border-style-9.app-sidebar .top-left,
.border-style-9.page-header-breadcrumb .top-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-9.card.custom-card .top-left:before,
.border-style-9.app-sidebar .top-left:before,
.border-style-9.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: -1px;
    inset-block-start: -1px;
}

.border-style-9.card.custom-card .top-left:after,
.border-style-9.app-sidebar .top-left:after,
.border-style-9.page-header-breadcrumb .top-left:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 18px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: -1px;
    inset-block-start: -1px;
}

.border-style-9.card.custom-card .top-right,
.border-style-9.app-sidebar .top-right,
.border-style-9.page-header-breadcrumb .top-right {
    inset-block-start: 0;
    inset-inline-end: 0;
    position: absolute;
}

.border-style-9.card.custom-card .top-right:before,
.border-style-9.app-sidebar .top-right:before,
.border-style-9.page-header-breadcrumb .top-right:before {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: -1px;
    inset-block-start: -1px;
}

.border-style-9.card.custom-card .top-right:after,
.border-style-9.app-sidebar .top-right:after,
.border-style-9.page-header-breadcrumb .top-right:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 18px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: -1px;
    inset-block-start: -1px;
}

.border-style-9.card.custom-card .bottom-left,
.border-style-9.app-sidebar .bottom-left,
.border-style-9.page-header-breadcrumb .bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-9.card.custom-card .bottom-left:before,
.border-style-9.app-sidebar .bottom-left:before,
.border-style-9.page-header-breadcrumb .bottom-left:before {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: -1px;
    inset-block-end: -1px;
}

.border-style-9.card.custom-card .bottom-left:after,
.border-style-9.app-sidebar .bottom-left:after,
.border-style-9.page-header-breadcrumb .bottom-left:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 18px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: -1px;
    inset-block-end: -1px;
}

.border-style-9.card.custom-card .bottom-right,
.border-style-9.app-sidebar .bottom-right,
.border-style-9.page-header-breadcrumb .bottom-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-style-9.card.custom-card .bottom-right:before,
.border-style-9.app-sidebar .bottom-right:before,
.border-style-9.page-header-breadcrumb .bottom-right:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 2px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: -1px;
    inset-block-end: -1px;
}

.border-style-9.card.custom-card .bottom-right:after,
.border-style-9.app-sidebar .bottom-right:after,
.border-style-9.page-header-breadcrumb .bottom-right:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 16px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: -1px;
    inset-block-end: -1px;
}

.border-style-9.app-sidebar,
.border-style-9.card.custom-card,
.border-style-9.page-header-breadcrumb {
    border: 1px solid rgba(202, 233, 249, 0.1);
}


.border-style-10.card.custom-card,
.border-style-10.app-sidebar,
.border-style-10.page-header-breadcrumb {
    border-radius: 0 0 25px 0;
}

.border-style-10.card.custom-card .top-left,
.border-style-10.app-sidebar .top-left,
.border-style-10.page-header-breadcrumb .top-left {
    position: absolute;
    width: 100%;
    height: 100%;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-10.card.custom-card .top-left:before,
.border-style-10.app-sidebar .top-left:before,
.border-style-10.page-header-breadcrumb .top-left:before {
    content: "";
    position: absolute;
    height: 4px;
    width: 4px;
    background: rgb(202, 233, 249);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-style-10.card.custom-card .top-left:after,
.border-style-10.app-sidebar .top-left:after,
.border-style-10.page-header-breadcrumb .top-left:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    background: rgba(202, 233, 249, 0.2);
    inset-block-start: 4px;
    inset-inline-start: 0;
}

.border-style-10.card.custom-card .top-right,
.border-style-10.app-sidebar .top-right,
.border-style-10.page-header-breadcrumb .top-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-style-10.card.custom-card .top-right:before,
.border-style-10.app-sidebar .top-right:before,
.border-style-10.page-header-breadcrumb .top-right:before {
    content: "";
    position: absolute;
    height: 4px;
    width: 4px;
    background: rgb(202, 233, 249);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-style-10.card.custom-card .bottom-left,
.border-style-10.app-sidebar .bottom-left,
.border-style-10.page-header-breadcrumb .bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
    height: 100%;
}

.border-style-10.card.custom-card .bottom-left:before,
.border-style-10.app-sidebar .bottom-left:before,
.border-style-10.page-header-breadcrumb .bottom-left:before {
    content: "";
    position: absolute;
    height: 4px;
    width: 4px;
    background: rgb(202, 233, 249);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-style-10.card.custom-card .bottom-left:after,
.border-style-10.app-sidebar .bottom-left:after,
.border-style-10.page-header-breadcrumb .bottom-left:after {
    content: "";
    position: absolute;
    height: 100%;
    width: 1px;
    background: rgba(202, 233, 249, 0.2);
    inset-inline-start: 4px;
    inset-block-end: 0;
}

.border-style-10.card.custom-card .bottom-right,
.border-style-10.app-sidebar .bottom-right,
.border-style-10.page-header-breadcrumb .bottom-right {
    position: absolute;
}


/**
b1
 */
.border-1-top-left {
    position: absolute;
    top: 0;
    height: 2px;
    inset-inline-start: 0;
    background: rgba(255, 255, 255, 0.1);
    width: 20px;
}

.border-1-top-left:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100%;
    background: linear-gradient(to right, transparent, rgb(202, 233, 249));
    inset-inline-end: 0;
}

.border-1-top-right {
    position: absolute;
    top: 0;
    height: 2px;
    inset-inline-end: 0;
    background: rgba(255, 255, 255, 0.1);
    width: 20px;
}

.border-1-top-right:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100%;
    background: linear-gradient(to left, transparent, rgb(202, 233, 249));
    inset-inline-start: 0;
}

.border-1-bottom-left {
    position: absolute;
    bottom: 0;
    height: 2px;
    inset-inline-start: 0;
    background: rgba(255, 255, 255, 0.1);
    width: 20px;
}

.border-1-bottom-left:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100%;
    background: linear-gradient(to right, transparent, rgb(202, 233, 249));
    inset-inline-end: 0;
}

.border-1-bottom-right {
    position: absolute;
    bottom: 0;
    height: 2px;
    inset-inline-end: 0;
    background: rgba(255, 255, 255, 0.1);
    width: 20px;
}

.border-1-bottom-right:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 100%;
    background: linear-gradient(to left, transparent, rgb(202, 233, 249));
    inset-inline-start: 0;
}

/**
b2
 */

.card.custom-card-2 {
    border: 0;
    background: linear-gradient(to bottom right, rgba(20, 20, 20, 0.8) 0%, rgba(20, 20, 20, 0.8) 100%), url('assets/scifi-bs-html/bg/6.svg') !important;
}

.card.custom-card-2:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 30px;
    background-color: transparent;
    transform: rotate(45deg);
    inset-inline-end: -14px;
    inset-block-start: -14px;
    border-block-end: 1px solid rgb(202, 233, 249);
}

.card.custom-card-2 .border-2-top-left {
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(to top, transparent, rgba(202, 233, 249, 0.6));
}

.card.custom-card-2 .border-2-top-left:before {
    z-index: 1;
    content: "";
    position: absolute;
    height: 15px;
    width: 3px;
    background-color: rgba(202, 233, 249, 0.6);
    inset-inline-start: 0;
    inset-block-end: 0px;
}

.card.custom-card-2 .border-2-top-right {
    position: absolute;
    height: 1px;
    inset-block-start: 0;
    inset-inline-start: 0;
    inset-inline-end: 20px;
    background-color: rgba(var(--primary-rgb), 0.1);
}

.card.custom-card-2 .border-2-top-right:before {
    z-index: 1;
    content: "";
    position: absolute;
    transform: rotate(45deg);
    width: 0;
    height: 0;
    inset-inline-end: -28px;
    inset-block-start: -2px;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid rgba(202, 233, 249, 0.6);
}

.card.custom-card-2 .border-2-bottom-left {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(202, 233, 249, 0.6));
}

.card.custom-card-2 .border-2-bottom-left:before {
    content: "";
    position: absolute;
    width: 15px;
    height: 3px;
    background-color: rgba(202, 233, 249, 0.6);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.card.custom-card-2 .border-2-bottom-right {
    position: absolute;
    width: 1px;
    top: 20px;
    bottom: 0;
    inset-inline-end: 0;
    background-color: rgba(var(--primary-rgb), 0.1);
}

.card.custom-card-2 .border-2-bottom-right:before {
    content: "";
    position: absolute;
    height: 2.125rem;
    width: 4px;
    background-color: rgba(202, 233, 249, 0.6);
    inset-inline-end: 0px;
    inset-block-end: 1rem;
    border-start-start-radius: 20px;
    border-start-end-radius: 0px;
    border-end-end-radius: 0px;
    border-end-start-radius: 20px;
}

.card.custom-card-2.bg-amora:before {
    border-block-end: 1px solid rgb(235, 69, 182);
}

.card.custom-card-2.bg-amora .border-2-top-left {
    background: linear-gradient(to top, transparent, rgba(235, 69, 182, 0.6));
}

.card.custom-card-2.bg-amora .border-2-top-left:before {
    background-color: rgba(235, 69, 182, 0.6);
}

.card.custom-card-2.bg-amora .border-2-top-right {
    background-color: rgba(235, 69, 182, 0.1);
}

.card.custom-card-2.bg-amora .border-2-top-right:before {
    border-bottom: 12px solid rgba(235, 69, 182, 0.6);
}

.card.custom-card-2.bg-amora .border-2-bottom-left {
    background: linear-gradient(to right, transparent, rgba(235, 69, 182, 0.6));
}

.card.custom-card-2.bg-amora .border-2-bottom-left:before {
    background-color: rgba(235, 69, 182, 0.6);
}

.card.custom-card-2.bg-amora .border-2-bottom-right {
    background-color: rgba(235, 69, 182, 0.1);
}

.card.custom-card-2.bg-amora .border-2-bottom-right:before {
    background-color: rgba(235, 69, 182, 0.6);
}

.card.custom-card-2.bg-success:before {
    border-block-end: 1px solid rgb(79, 227, 139);
}

.card.custom-card-2.bg-success .border-2-top-left {
    background: linear-gradient(to top, transparent, rgba(79, 227, 139, 0.6));
}

.card.custom-card-2.bg-success .border-2-top-left:before {
    background-color: rgba(79, 227, 139, 0.6);
}

.card.custom-card-2.bg-success .border-2-top-right {
    background-color: rgba(79, 227, 139, 0.1);
}

.card.custom-card-2.bg-success .border-2-top-right:before {
    border-bottom: 12px solid rgba(79, 227, 139, 0.6);
}

.card.custom-card-2.bg-success .border-2-bottom-left {
    background: linear-gradient(to right, transparent, rgba(79, 227, 139, 0.6));
}

.card.custom-card-2.bg-success .border-2-bottom-left:before {
    background-color: rgba(79, 227, 139, 0.6);
}

.card.custom-card-2.bg-success .border-2-bottom-right {
    background-color: rgba(79, 227, 139, 0.1);
}

.card.custom-card-2.bg-success .border-2-bottom-right:before {
    background-color: rgba(79, 227, 139, 0.6);
}

.card.custom-card-2.bg-danger:before {
    border-block-end: 1px solid rgb(237, 55, 55);
}

.card.custom-card-2.bg-danger .border-2-top-left {
    background: linear-gradient(to top, transparent, rgba(237, 55, 55, 0.6));
}

.card.custom-card-2.bg-danger .border-2-top-left:before {
    background-color: rgba(237, 55, 55, 0.6);
}

.card.custom-card-2.bg-danger .border-2-top-right {
    background-color: rgba(237, 55, 55, 0.1);
}

.card.custom-card-2.bg-danger .border-2-top-right:before {
    border-bottom: 12px solid rgba(237, 55, 55, 0.6);
}

.card.custom-card-2.bg-danger .border-2-bottom-left {
    background: linear-gradient(to right, transparent, rgba(237, 55, 55, 0.6));
}

.card.custom-card-2.bg-danger .border-2-bottom-left:before {
    background-color: rgba(237, 55, 55, 0.6);
}

.card.custom-card-2.bg-danger .border-2-bottom-right {
    background-color: rgba(237, 55, 55, 0.1);
}

.card.custom-card-2.bg-danger .border-2-bottom-right:before {
    background-color: rgba(237, 55, 55, 0.6);
}

.card.custom-card-2.bg-warning:before {
    border-block-end: 1px solid rgb(250, 146, 29);
}

.card.custom-card-2.bg-warning .border-2-top-left {
    background: linear-gradient(to top, transparent, rgba(250, 146, 29, 0.6));
}

.card.custom-card-2.bg-warning .border-2-top-left:before {
    background-color: rgba(250, 146, 29, 0.6);
}

.card.custom-card-2.bg-warning .border-2-top-right {
    background-color: rgba(250, 146, 29, 0.1);
}

.card.custom-card-2.bg-warning .border-2-top-right:before {
    border-bottom: 12px solid rgba(250, 146, 29, 0.6);
}

.card.custom-card-2.bg-warning .border-2-bottom-left {
    background: linear-gradient(to right, transparent, rgba(250, 146, 29, 0.6));
}

.card.custom-card-2.bg-warning .border-2-bottom-left:before {
    background-color: rgba(250, 146, 29, 0.6);
}

.card.custom-card-2.bg-warning .border-2-bottom-right {
    background-color: rgba(250, 146, 29, 0.1);
}

.card.custom-card-2.bg-warning .border-2-bottom-right:before {
    background-color: rgba(250, 146, 29, 0.6);
}


.card.custom-card-2.bg-highlight:before {
    border-block-end: 1px solid rgb(202, 233, 249);
}

.card.custom-card-2.bg-highlight .border-2-top-left {
    background: linear-gradient(to top, transparent, rgba(202, 233, 249, 0.6));
}

.card.custom-card-2.bg-highlight .border-2-top-left:before {
    background-color: rgba(202, 233, 249, 0.6);
}

.card.custom-card-2.bg-highlight .border-2-top-right {
    background-color: rgba(202, 233, 249, 0.1);
}

.card.custom-card-2.bg-highlight .border-2-top-right:before {
    border-bottom: 12px solid rgba(202, 233, 249, 0.6);
}

.card.custom-card-2.bg-highlight .border-2-bottom-left {
    background: linear-gradient(to right, transparent, rgba(202, 233, 249, 0.6));
}

.card.custom-card-2.bg-highlight .border-2-bottom-left:before {
    background-color: rgba(202, 233, 249, 0.6);
}

.card.custom-card-2.bg-highlight .border-2-bottom-right {
    background-color: rgba(202, 233, 249, 0.1);
}

.card.custom-card-2.bg-highlight .border-2-bottom-right:before {
    background-color: rgba(202, 233, 249, 0.6);
}


.border-2-top-left {
    position: absolute;
    top: 0;
    inset-inline-start: 0;
    width: 1px;
    height: 100%;
    background: linear-gradient(to top, transparent, rgba(202, 233, 249, 0.6));
}

.border-2-top-left:before {
    z-index: 1;
    content: "";
    position: absolute;
    height: 15px;
    width: 3px;
    background-color: rgba(202, 233, 249, 0.6);
    inset-inline-start: 0;
    inset-block-end: 0px;
}

.border-2-top-right {
    position: absolute;
    height: 1px;
    inset-block-start: 0;
    inset-inline-start: 0;
    inset-inline-end: 20px;
    background-color: rgba(var(--primary-rgb), 0.1);
}

.border-2-top-right:before {
    z-index: 1;
    content: "";
    position: absolute;
    transform: rotate(45deg);
    width: 0;
    height: 0;
    inset-inline-end: -28px;
    inset-block-start: -2px;
    border-left: 12px solid transparent;
    border-right: 12px solid transparent;
    border-bottom: 12px solid rgba(202, 233, 249, 0.6);
}

.border-2-bottom-left {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background: linear-gradient(to right, transparent, rgba(202, 233, 249, 0.6));
}

.border-2-bottom-left:before {
    content: "";
    position: absolute;
    width: 15px;
    height: 3px;
    background-color: rgba(202, 233, 249, 0.6);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-2-bottom-right {
    position: absolute;
    width: 1px;
    top: 20px;
    bottom: 0;
    inset-inline-end: 0;
    background-color: rgba(var(--primary-rgb), 0.1);
}

.border-2-bottom-right:before {
    content: "";
    position: absolute;
    height: 2.125rem;
    width: 4px;
    background-color: rgba(202, 233, 249, 0.6);
    inset-inline-end: 0px;
    inset-block-end: 1rem;
    border-start-start-radius: 20px;
    border-start-end-radius: 0px;
    border-end-end-radius: 0px;
    border-end-start-radius: 20px;
}

/**
b3
 */
.border-3-top-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-3-top-left:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: linear-gradient(to right, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-3-top-left:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 30px;
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-3-top-right {
    inset-block-start: 0;
    inset-inline-end: 0;
    position: absolute;
}

.border-3-top-right:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: linear-gradient(to left, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-3-top-right:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 30px;
    background: linear-gradient(to bottom, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-3-bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-3-bottom-left:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: linear-gradient(to right, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-3-bottom-left:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 30px;
    background: linear-gradient(to top, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-3-bottom-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-3-bottom-right:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: linear-gradient(to left, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-3-bottom-right:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 30px;
    background: linear-gradient(to top, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-premium.border-3-top-left:before {
    background: linear-gradient(to right, rgba(255, 255, 0, 0.6), transparent);
}

.border-premium.border-3-top-left:after {
    background: linear-gradient(to bottom, rgba(255, 255, 0, 0.6), transparent);
}

.border-premium.border-3-top-right:before {
    background: linear-gradient(to left, rgba(255, 255, 0, 0.6), transparent);
}

.border-premium.border-3-top-right:after {
    background: linear-gradient(to bottom, rgba(255, 255, 0, 0.6), transparent);
}

.border-premium.border-3-bottom-left:before {
    background: linear-gradient(to right, rgba(255, 255, 0, 0.6), transparent);
}

.border-premium.border-3-bottom-left:after {
    background: linear-gradient(to top, rgba(255, 255, 0, 0.6), transparent);
}

.border-premium.border-3-bottom-right:before {
    background: linear-gradient(to left, rgba(255, 255, 0, 0.6), transparent);
}

.border-premium.border-3-bottom-right:after {
    background: linear-gradient(to top, rgba(255, 255, 0, 0.6), transparent);
}


/**
b4
 */
.border-4-top-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-4-top-left:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: 3px;
    inset-block-start: 3px;
}

.border-4-top-left:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: 3px;
    inset-block-start: 3px;
}

.border-4-top-right {
    inset-block-start: 0;
    inset-inline-end: 0;
    position: absolute;
}

.border-4-top-right:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: 3px;
    inset-block-start: 3px;
}

.border-4-top-right:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: 3px;
    inset-block-start: 3px;
}

.border-4-bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-4-bottom-left:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: 3px;
    inset-block-end: 3px;
}

.border-4-bottom-left:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: 3px;
    inset-block-end: 3px;
}

.border-4-bottom-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-4-bottom-right:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 1px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: 3px;
    inset-block-end: 3px;
}

.border-4-bottom-right:after {
    content: "";
    position: absolute;
    width: 1px;
    height: 10px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: 3px;
    inset-block-end: 3px;
}

/**
b5
 */

.border-5-top-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-5-top-left:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-5-top-left:after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: 30px;
    inset-block-start: -2px;
    border-radius: 50%;
}

.border-5-top-right {
    inset-block-start: 0;
    inset-inline-end: 0;
    position: absolute;
}

.border-5-top-right:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-5-top-right:after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: 30px;
    inset-block-start: -2px;
    border-radius: 50%;
}

.border-5-bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-5-bottom-left:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-5-bottom-left:after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: 30px;
    inset-block-end: -2px;
    border-radius: 50%;
}

.border-5-bottom-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-5-bottom-right:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 1px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-5-bottom-right:after {
    content: "";
    position: absolute;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: 30px;
    inset-block-end: -2px;
    border-radius: 50%;
}

/**
b7
 */

.border-7-top-left {
    position: absolute;
    width: 100%;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-7-top-left:before {
    content: "";
    position: absolute;
    width: 25%;
    height: 1px;
    background: linear-gradient(to right, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-7-top-left:after {
    content: "";
    position: absolute;
    width: 75%;
    height: 1px;
    background: linear-gradient(to left, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-end: 0;
    inset-block-start: 0;
}

.border-7-top-right {
    position: absolute;
    width: 50px;
    inset-inline-start: 15%;
    inset-block-start: 0;
}

.border-7-top-right:before {
    content: "";
    width: 30px;
    height: 2px;
    inset-inline-start: 25%;
    top: -2px;
    background-color: rgba(202, 233, 249, 0.6);
    position: absolute;
}

.border-7-top-right:after {
    content: "";
    width: 30px;
    height: 2px;
    inset-inline-start: 55%;
    top: 0;
    background-color: rgba(202, 233, 249, 0.6);
    position: absolute;
}

.border-7-bottom-left {
    position: absolute;
    width: 100%;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-7-bottom-left:before {
    content: "";
    position: absolute;
    width: 75%;
    height: 1px;
    background: linear-gradient(to right, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-7-bottom-left:after {
    content: "";
    position: absolute;
    width: 25%;
    height: 1px;
    background: linear-gradient(to left, rgba(202, 233, 249, 0.6), transparent);
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-7-bottom-right {
    position: absolute;
    width: 50px;
    inset-inline-end: 15%;
    inset-block-end: 0;
}

.border-7-bottom-right:before {
    content: "";
    width: 30px;
    height: 2px;
    inset-inline-end: 25%;
    top: -2px;
    background-color: rgba(202, 233, 249, 0.6);
    position: absolute;
}

.border-7-bottom-right:after {
    content: "";
    width: 30px;
    height: 2px;
    inset-inline-end: 55%;
    top: 0;
    background-color: rgba(202, 233, 249, 0.6);
    position: absolute;
}

/**
b8
 */

.border-8-top-left:before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.8);
}

.border-8-top-left:after {
    content: "";
    position: absolute;
    height: 1px;
    background: rgba(202, 233, 249, 0.2);
    inset-block-start: 0;
    inset-inline-end: 10px;
    inset-inline-start: 10px;
}

.border-8-top-right:before {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 0;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.8);
}

.border-8-top-right:after {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    inset-block-start: 10px;
    inset-block-end: 10px;
    width: 1px;
    background: rgba(202, 233, 249, 0.2);
}

.border-8-bottom-left:before {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.8);
}

.border-8-bottom-left:after {
    content: "";
    position: absolute;
    height: 1px;
    background: rgba(202, 233, 249, 0.2);
    inset-block-end: 0;
    inset-inline-end: 10px;
    inset-inline-start: 10px;
}

.border-8-bottom-right:before {
    content: "";
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
    width: 5px;
    height: 5px;
    background: rgba(202, 233, 249, 0.8);
}

.border-8-bottom-right:after {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 10px;
    inset-block-end: 10px;
    width: 1px;
    background: rgba(202, 233, 249, 0.2);
}

/**
b9
 */

.border-9-top-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
}

.border-9-top-left:before {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: -1px;
    inset-block-start: -1px;
}

.border-9-top-left:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 18px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: -1px;
    inset-block-start: -1px;
}

.border-9-top-right {
    inset-block-start: 0;
    inset-inline-end: 0;
    position: absolute;
}

.border-9-top-right:before {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: -1px;
    inset-block-start: -1px;
}

.border-9-top-right:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 18px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: -1px;
    inset-block-start: -1px;
}

.border-9-bottom-left {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
}

.border-9-bottom-left:before {
    content: "";
    position: absolute;
    width: 18px;
    height: 2px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: -1px;
    inset-block-end: -1px;
}

.border-9-bottom-left:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 18px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-start: -1px;
    inset-block-end: -1px;
}

.border-9-bottom-right {
    position: absolute;
    inset-inline-end: 0;
    inset-block-end: 0;
}

.border-9-bottom-right:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 2px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: -1px;
    inset-block-end: -1px;
}

.border-9-bottom-right:after {
    content: "";
    position: absolute;
    width: 2px;
    height: 16px;
    background: rgba(202, 233, 249, 0.6);
    inset-inline-end: -1px;
    inset-block-end: -1px;
}

/**
EOF Boss Changes
 */
.conversation-list .chat-avatar img[class^="af-"] {
    border-radius: 0;
}

.conversation-list .chat-avatar img:not([class^="af-"]) {
    border-radius: 100%;
    width: 100%;
}

/* Subtle hover animation effect for icons */
.side-nav-link i {
    transition: transform 0.3s ease, color 0.3s ease, text-shadow 0.3s ease;
    display: inline-block;
    color: #fff; /* Default icon color */
}

/* Scale, rotate, change color, and add glow on hover */
.side-nav-link:hover i {
    transform: scale(1.1) rotate(5deg);
    color: rgba(202, 233, 249, 1); /* New hover color */
    text-shadow: 0 0 10px rgba(202, 233, 249, 1), 0 0 20px rgba(202, 233, 249, 1), 0 0 30px rgba(202, 233, 249, 1); /* Glow effect */
}

/* Optional: Add background color change on hover for the link */
.side-nav-link:hover {
    background-color: #333;
}

/* Change text color on hover */
.side-nav-link:hover span {
    color: rgba(202, 233, 249, 1); /* Text color change on hover */
}

/* Optional: Make sure icons stay centered and aligned */
.side-nav-link i {
    display: inline-block;
}

.btn-topbar-messages {
    transition: all 0.3s ease;
}

.btn-topbar-messages:hover {
    color: rgba(202, 233, 249, 1); /* Change text color to the glowing color */
    box-shadow: 0 0 10px rgba(202, 233, 249, 1), 0 0 20px rgba(202, 233, 249, 1); /* Greenish glow effect */
    transform: scale(1.1); /* Slightly enlarge the link on hover */
}

.btn-topbar-messages:hover i {
    text-shadow: 0 0 15px rgba(202, 233, 249, 1), 0 0 25px rgba(202, 233, 249, 1); /* Apply glow effect on icon */
}

#_f_d_chat {
    opacity: 0.5;
    background: radial-gradient(circle at left bottom, rgba(20, 30, 48, 1) 0%, rgba(0, 0, 0, 0) 70%);
    z-index: 0;
}

#_f_d_chat {
    padding-left: 3.0rem !important;
}

#_f_d_chat:hover, #_f_d_chat.shepherd-enabled {
    background: radial-gradient(circle at left bottom, rgba(20, 30, 48, 1) 0%, rgba(0, 0, 0, 0) 80%);
    opacity: 1;
}

#_p_q_d_div {
    position: relative;
}

#_p_q_d_div::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    opacity: 1;
    background: radial-gradient(circle at top, rgba(20, 30, 48, 1), rgba(0, 0, 0, 0.5));
    mask-image: radial-gradient(circle at top, white, transparent);
    -webkit-mask-image: radial-gradient(circle at top, white, transparent);
}

body:has(#galaxyMap) #_p_q_d_div {
    background: radial-gradient(circle at right top, rgba(20, 30, 48, 1), rgba(0, 0, 0, 1));
}

/*
#_p_q_d_div:hover, #_p_q_d_div.shepherd-enabled {
    background: radial-gradient(circle at right top, rgba(20, 30, 48, 1) 0%, rgba(0, 0, 0, 0) 80%);
    opacity: 1;
}
*/

#_f_d_task {
    opacity: 0.5;
    background: radial-gradient(circle at right bottom, rgba(20, 30, 48, 1) 0%, rgba(0, 0, 0, 0) 70%);
    z-index: 0;
}

#_f_d_task:hover, #_f_d_task.shepherd-enabled {
    background: radial-gradient(circle at right bottom, rgba(20, 30, 48, 1) 0%, rgba(0, 0, 0, 0) 80%);
    opacity: 1;
}

.modal .modal-content {
    border: none !important;
}

.modal-header {
    border-bottom: 1px solid rgba(255, 255, 255, .05);
    padding: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(to right, rgba(0, 0, 0, .5), transparent), #0006 !important;
    margin-bottom: 0 !important;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

#_f_d_fleet {
    clip-path: polygon(1rem 0%, calc(100% - 1rem) 0%, 100% 100%, 0% 100%);
    border-radius: 0 0 10px 10px !important;
    overflow: hidden;
    border-image: linear-gradient(to left, rgba(0, 0, 0, 0.98) 0%, rgba(20, 30, 48, 0.95) 50%, rgba(0, 0, 0, 0.98) 100%) 1;
    border-width: 1px;
    margin-bottom: 0;
    padding: 0;
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 1), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url(/styles/startrek/assets/galaxy_stargaze/star/0_3cujnlcegfs/4096/_nx.jpg) center / cover;
    box-shadow: 0 0 50px #000c, inset 0 0 100px #00000080;
    position: relative;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.modal-body {
    border-radius: 0 0 10px 10px !important;
    border-image: linear-gradient(to left, rgba(0, 0, 0, 0.98) 0%, rgba(20, 30, 48, 0.95) 50%, rgba(0, 0, 0, 0.98) 100%) 1;
    border-width: 1px;
    margin-bottom: 0;
    padding: 0;
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 1), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url(/styles/startrek/assets/galaxy_stargaze/star/0_3cujnlcegfs/4096/_nx.jpg) center / cover !important;
    box-shadow: 0 0 50px #000c, inset 0 0 100px #00000080;
    position: relative;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.card.card-startrek {
    border-image: linear-gradient(to left, rgba(0, 0, 0, 0.98) 0%, rgba(20, 30, 48, 0.95) 50%, rgba(0, 0, 0, 0.98) 100%) 1;
    border-width: 1px;
    border-radius: 0.5rem;
    margin-bottom: 0;
    padding: 0;
    background: radial-gradient(circle at top center, rgba(20, 30, 48, 1), rgba(0, 0, 0, 0.9)), url('/styles/startrek/assets/scifi-bs-html/bg/1.png'), url(/styles/startrek/assets/galaxy_stargaze/star/0_3cujnlcegfs/4096/_nx.jpg) center / cover;
    box-shadow: 0 0 50px #000c, inset 0 0 100px #00000080;
    position: relative;
    overflow: hidden;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
}

.modal-body::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: inherit;
    filter: brightness(2);
}

.modal-body .card-startrek, .modal-body .card-startrek::before {
    background: transparent;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
}

.card-startrek-leadership::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: url(/styles/startrek/gfx/portraits/controller/council_room_common.webp) top / 100% no-repeat fixed;
    mask-image: radial-gradient(circle at top center, white 0, transparent 50vh);
    -webkit-mask-image: radial-gradient(circle at top center, white 0, transparent 50vh);
}

@media (max-width: 768px) {
    body {
        font-size: 0.75rem;
    }

    .modal-content {
        max-height: 75% !important;
        border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 100%) 1 !important;
        border-radius: 0 !important;
        border-bottom: 1px solid #464f5b !important;
        border-top: 0 solid #464f5b !important;
    }

    .modal-body .card-startrek {
        border: 0 !important;
    }

    .btn {
        font-size: 0.75rem !important;
    }

    .small, small {
        font-size: 0.6rem;
    }

    h1, .h1 {
        font-size: calc(2.25rem * 0.9);
    }

    h2, .h2 {
        font-size: calc(1.872rem * 0.9);
    }

    h3, .h3 {
        font-size: calc(1.503rem * 0.9);
    }

    h4, .h4 {
        font-size: calc(1.125rem * 0.9);
    }

    h5, .h5 {
        font-size: calc(0.936rem * 0.9);
    }

    h6, .h6 {
        font-size: calc(0.765rem * 0.9);
    }

    .content-page {
        margin-bottom: 4.5rem !important;
        margin-top: 0 !important;
    }

    .fs-mobile {
        font-size: x-small;
    }

    .fs-mobile-small {
        font-size: small !important;
    }

    .fs-mobile-x-small {
        font-size: x-small !important;
    }

    .game > .card.card-startrek:first-of-type {
        min-height: 100vh !important;
        background: radial-gradient(circle at top center, rgba(20, 30, 48, 0.66), rgba(0, 0, 0, 1)) fixed, url('/styles/startrek/assets/scifi-bs-html/bg/1.png');
    }

    .offcanvas-game-fetch {
        height: auto !important;
        max-height: 90% !important;
    }

    .offcanvas-game-fetch > .offcanvas-body > .modal-dialog > .modal-content > .modal-header {
        position: fixed;
        z-index: 5;
        width: 100%;
    }

    .offcanvas-game-fetch > .btn-close {
        z-index: 6 !important;
    }

    .card.card-startrek:first-of-type > .card-body:first-child {
        margin-top: 3.5rem;
        margin-bottom: 3.5rem;
    }

    .modal-body .card-body:first-of-type {
        margin-top: 0 !important;
    }

    .modal-body .card {
        border-radius: 0 !important;
    }

    .modal-body .card-body {
        padding: 1rem 0.75rem;
    }

    .modal-backdrop, .fancybox__backdrop, .offcanvas-backdrop {
        background: rgb(20, 20, 20, 0.75);
    }

    .offcanvas-game-fetch .offcanvas-body .card-body:first-of-type {
        margin-top: 0 !important;
    }

    /*
    .offcanvas-game-fetch-wmenu {
        top: 1.75rem !important;
        width: 100% !important;
        bottom: 4rem;
        border-image: linear-gradient(to left, rgb(18, 22, 24) 0%, rgb(202, 233, 249) 50%, rgb(18, 22, 24) 100%) 1 !important;
    }

    .offcanvas-game-fetch-wmenu {
        width: 90% !important;
        bottom: 0;
    }
     */
    .btn-fleet-activity {
        font-size: xx-small !important;
        padding: 0.2rem;
    }

    .leaflet-popup-content {
        width: auto;
        margin: 0.5rem;
    }

    .leaflet-popup-content p {
        font-size: 0.75rem;
        margin: 0.5rem 0;
    }

    .coordinatePicker-footer {
        z-index: 1;
        height: 5rem;
        bottom: 5rem;
        border: none !important;
        padding-top: 0.35rem !important;
        background: radial-gradient(circle at center, rgba(20, 30, 48, 1), rgba(0, 0, 0, 0)), url(/styles/startrek/assets/scifi-bs-html/bg/1.png), url(/styles/startrek/assets/galaxy_stargaze/star/0_3cujnlcegfs/4096/_nx.jpg) center / cover;
        mask-image: radial-gradient(circle at center, white 0, transparent 50vh);
        -webkit-mask-image: radial-gradient(circle at center, white 0, transparent 50vh);
    }
}

@media (min-width: 768px) {
    .fs-mobile {
        font-size: inherit;
    }

    .fs-mobile-small {
        font-size: inherit;
    }

    .fs-mobile-x-small {
        font-size: small !important;
    }

    .modal-content {
        max-height: 75% !important;
        border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 100%) 1 !important;
        border-radius: 0 !important;
        border-bottom: 1px solid #464f5b !important;
        border-top: 0 solid #464f5b !important;
    }

    .modal-body .card-startrek {
        border: 0 !important;
    }

    .modal-body .card {
        border-radius: 0 !important;
    }

    .coordinatePicker-footer {
        z-index: 1 !important;
        background: linear-gradient(to right, rgba(20, 20, 20, 0) 0%, rgba(20, 20, 20, 0) 30%, rgba(30, 30, 30, 1) 50%, rgba(20, 20, 20, 0) 70%, rgba(20, 20, 20, 0) 100%);
        height: 95px;
        bottom: 0;
        border-image: linear-gradient(to left, rgba(18, 22, 24, 0) 0%, rgba(18, 22, 24, 0) 30%, rgb(202, 233, 249) 50%, rgba(18, 22, 24, 0) 70%, rgba(18, 22, 24, 0) 100%) 1 !important;
        border-width: 1px !important;
        background: radial-gradient(circle at center, rgba(20, 30, 48, 1), rgba(0, 0, 0, 0)), url(/styles/startrek/assets/scifi-bs-html/bg/1.png), url(/styles/startrek/assets/galaxy_stargaze/star/0_3cujnlcegfs/4096/_nx.jpg) center / cover;
        mask-image: radial-gradient(circle at center, white 0, transparent 50vh);
        -webkit-mask-image: radial-gradient(circle at center, white 0, transparent 50vh);
    }
}

/**
Login PWA
 */
#pwa-install-close {
    background: none;
    border: none;
    color: white;
    font-size: 16px;
    cursor: pointer;
}

/**
BattlePass 1
 */

@font-face {
    font-family: 'Renegent';
    src: url('assets/cosmetic/fonts/bp1_renegent/renegentstraight.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.pfont_bp1_username_font_premium {
    font-family: 'Renegent', sans-serif;
}

.si_layer_bp1 {
    --font-size: 16px;
    --color: white;
    --background-inner: linear-gradient(to right, rgba(20, 20, 20, 0.5) 0%, rgba(30, 30, 30, 1) 200px, rgba(30, 30, 30, 1) 100%), url(/styles/startrek/assets/galaxy_stargaze/nebula/orange_crush/2048/_nx.jpg) top / cover no-repeat !important;
    --border-color: #b30b0b;
    --border-width: 1px;
    --border-cut: 8px;
    --button-shape: polygon(calc(100% - var(--border-cut)) 0, 100% var(--border-cut), 100% 100%, var(--border-cut) 100%, 0 calc(100% - var(--border-cut)), 0 0);
}

.si_layer_bp1_prestige {
    --font-size: 16px;
    --color: #DAA520;
    --background-inner: #0d0a11;
    --border-color: #DAA520;
    --border-width: 1px;
    --border-cut: 8px;
    --button-shape: polygon(calc(100% - var(--border-cut)) 0, 100% var(--border-cut), 100% 100%, var(--border-cut) 100%, 0 calc(100% - var(--border-cut)), 0 0);
}

.si_layer_bp1 {
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    justify-self: center;
    align-self: center;
    vertical-align: middle;
    appearance: none;
    box-sizing: border-box;
    text-decoration: none;
    position: relative;
    word-spacing: 3px;
    letter-spacing: 0.4px;
    cursor: pointer;
    transition: 0.3s;
    line-height: initial;
    width: 100%;
    white-space: nowrap;
    z-index: 1;
    user-select: none;
    outline: 0;
    padding: 2px;
    color: var(--color);
}

.si_layer_bp1:after,
.si_layer_bp1:before {
    content: '';
    position: absolute;
    inset: var(--border-width);
    background: var(--background-inner);
    z-index: -1;
    clip-path: var(--button-shape);
    box-shadow: inset 0 0 25px -10px var(--border-color);
}

.si_layer_bp1:before {
    inset: 0;
    background: var(--border-color);
}

.si_layer_bp1 helper-1:before,
.si_layer_bp1 helper-1:after {
    content: '';
    position: absolute;
    height: 35%;
    width: 3px;
    background: var(--border-color);
    left: -1px;
    top: 50%;
    transform: translateY(-50%);
}

.si_layer_bp1 helper-1:after {
    left: unset;
    right: -1px;
}

[class*='si_layer_bp1'].disabled,
[class*='si_layer_bp1']:disabled {
    pointer-events: none;
    opacity: 0.5;
    cursor: default;
}


/* Ripple Animation */
[class*='si_layer_bp1'] ripple {
    inset: 0;
    position: absolute;
    overflow: hidden;
    -webkit-clip-path: var(--button-shape);
    clip-path: var(--button-shape);
}

[class*='si_layer_bp1'].disabled ripple,
[class*='si_layer_bp1']:disabled ripple {
    display: none
}

[class*='si_layer_bp1'] ripple:after {
    content: '';
    --ripple-gradient: rgb(255, 255, 255);
    position: absolute;
    inset: 0 auto 0 -200%;
    width: 200%;
    transform: skewX(-20deg);
    opacity: 0.5;
    background-image: linear-gradient(to right, transparent, var(--ripple-gradient), transparent);
}

[mode*='light'] ripple:after {
    --ripple-gradient: var(--border-color);
}

[class*='si_layer_bp1']:hover ripple:after {
    left: 200%;
    transition: 1.6s ease;
}

[class*='si_layer_bp1'] ripple:before {
    content: '';
    --ripple-color: rgb(255, 255, 255);
    position: absolute;
    inset: 50%;
    transform: skewX(-10deg);
    border-radius: 100vh;
}

[mode*='light'] ripple:before {
    --ripple-color: var(--border-color);
}

[class*='si_layer_bp1']:focus ripple:before {
    animation: ripple-animation 0.7s ease-in-out forwards;
}

[class*='si_layer_bp1']:active ripple:before {
    animation: unset;
}

@keyframes ripple-animation {
    0% {
        box-shadow: 0 0 0 0 var(--ripple-color);
        opacity: 0.6
    }
    100% {
        box-shadow: 0 0 0 150px var(--ripple-color);
        opacity: 0
    }
}


[class*="si_layer_"][class*="_aframe"] {
    padding: 2px;
}

[class*="si_layer_"][class*="_uframe"] {
    padding: 5px;
}

[class*="si_layer_"][class*="_uframe"]:has(span) span {
    width: 100%;
    text-align: end;
    color: var(--color);
    padding-right: 1px;
}

.leaflet-user-6:has([class*="si_layer_"][class*="_uframe"]) [class*="si_layer_"][class*="_uframe"] {
    padding: 3px;
}

[class*="si_layer_"] img {
    clip-path: var(--button-shape);
    z-index: -1 !important;
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
}

.af-config-galaxy-7-mask:has([class*="si_layer_"][class*="_aframe"]) [class*="si_layer_"][class*="_aframe"],
.af-config-galaxy-6-mask:has([class*="si_layer_"][class*="_aframe"]) [class*="si_layer_"][class*="_aframe"] {
    margin: 0 !important;
    padding: 1px !important;
    --border-cut: 4px;
}

.af-config-galaxy-7-mask:has([class*="si_layer_"][class*="_aframe"]) [class*="si_layer_"][class*="_aframe"]::after {
    box-shadow: inset 0 0 20px -10px var(--border-color);
}

.af-config-galaxy-6-mask:has([class*="si_layer_"][class*="_aframe"]) [class*="si_layer_"][class*="_aframe"]::after {
    box-shadow: inset 0 0 15px -10px var(--border-color);
}

[class*="si_layer_"][class*="_aframe"]:has(.af-config-galaxy-7-image) .af-config-galaxy-7-image,
[class*="si_layer_"][class*="_aframe"]:has(.af-config-galaxy-6-image) .af-config-galaxy-6-image {
    top: 0 !important;
    left: 0 !important;
}

[class*="si_layer_"]:has(span img)::after {
    background: transparent !important;
}
