@font-face {
    font-family: "NimbusSanL-Reg";
    src: url('../font/NimbusSanL/NimbusSanL-Reg.otf');
}

@font-face {
    font-family: "Comfortaa";
    src: url('../font/Comfortaa/Comfortaa-VariableFont_wght.ttf');
}

@font-face {
    font-family: "Poppins";
    src: url('../font/Poppins/Poppins-Light.ttf');
}


@font-face {
    font-family: "Source Sans Pro";
    src: url('../font/SourceSansPro/SourceSansPro-Regular.ttf');
}




@font-face {
    font-family: "Mirror 82";
    src: url('../font/Mirror82/Mirror_82.otf');
}

 
 

/* Works on Firefox */
* {
    font-family: Europa Regular, Mirror 82, Segoe UI,
                 Overpass, Comfortaa, NimbusSanL-Reg !important;
}

a {
    color: #fff;
    text-decoration: underline;

}

.card {
    --bs-card-cap-padding-y: 0.2rem !important;
    --bs-card-cap-padding-x: 0.2rem !important;
    --bs-card-spacer-y: 0.2rem !important;
    --bs-card-spacer-x: 0.2rem !important;
}


    a:hover {
        color: #979797;
    }

.weak-password {
    color: red;
}

.strong-password {
    color: green;
}


b, strong {
    font-weight: 600;
}

.display-none {
    display: none;
}



.note-editor .note-editing-area .note-editable a {
    color: #fff
}

.d-none-wu {
    display:none;
    position:absolute;
}


.bq-wait-orange {
    background: #aa5230;
    padding: 0.5rem;
    vertical-align: middle;
}



.bq-danger-red {
    background: #802828;
    padding: 0.5rem;
    vertical-align: middle;
}


.bq-success-green {
    background: #587033;
    padding: 0.5rem;
    vertical-align: middle;
}


.bq-primary-blue {
    background: #37518d;
    padding: 0.5rem;
    vertical-align: middle;
}





#load-fake {
    position: relative;
    width: 100%;
    height: 100vh;
    justify-content: center;
    align-items: center;
    background-color: rgb(11, 12, 13);
    z-index: 5;
    display: grid;
    transition: opacity 0.1s;
    opacity: 1;
}


.hr-menu {
    margin: 0;
    height: 1px;
    color: #a1a1a1;
}

.cube-container {
    display: flex;
    justify-content: space-around;
    width: 100px;
}

.cube {
    width: 10px;
    height: 10px;
    background-color: white;
    animation: spin 1s infinite;
    border-radius: 0.2rem;
}


@keyframes spin {
    0% {
        transform: rotateY(0deg);
    }

    100% {
        transform: rotateY(1turn);
    }
}



.nav-fill .nav-item .nav-link, .nav-justified .nav-item .nav-link {
    background: #171717;
}

.checkbox.sn-checkbox-open-in-new-window {
    display: none;
}

.checkbox.sn-checkbox-use-protocol {
    display: none;
}

primary.focus, .note-btn-primary:focus, .note-btn-primary:hover {
    color: #fff;
    text-decoration: none;
    border: 1px solid #18192500 !important;
    background-color: #20212a;
    border-radius: 1px;
    border-radius: 0.7rem;
}

.note-popover {
    position: absolute;
    z-index: 1060;
    display: block;
    font-size: 13px;
    font-family: sans-serif;
    display: none;
    background: #0e0b0b;
    border: 2px solid #541919;
    padding: 0.7rem !important;
    border-radius: 0.7rem;
}


.note-modal-content {
    position: relative;
    margin: 30px 20px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: #131313;
    background-clip: border-box;
    background-clip: border-box;
    outline: 0;
    border-radius: 5px;
    box-shadow: 0 3px 900px rgba(255, 255, 255, 0.5);
    padding: 1.2rem;
    margin: 0 auto
}

.close {
    float: right;
    line-height: 1;
    color: #fff;
    opacity: .2;
}

.note-modal-footer {
    height: 55px;
    padding: 10px;
    text-align: center;
}

.btn-primary.disabled, .btn-primary:disabled {
    color: #fff;
    background-color: #050402;
    border-color: #0d6efd;
    border-radius: 0.5rem;
    border: 2px solid #5a5a5a !important;
}

img {
    border-radius: 0.1rem
}


a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}

.text-gray-light {
    color: #a8a8a8;
}

.drag-handle {
    cursor: move;
    width: 3rem;
    height: 3rem;
    text-align: center;
    font-size: 16px;
    color: #999;
    background: #2c3136;
    background-color: rgb(44, 49, 54);
    padding: 0.45rem;
    font-size: 15pt;
    border-radius: 0.6rem;
}


.item-number-x {
    width: 3rem;
    height: 3rem;
    text-align: center;
    font-size: 16px;
    color: #999;
    background: #2c3136;
    background-color: rgb(44, 49, 54);
    padding: 0.45rem;
    font-size: 15pt;
    border-radius: 0.6rem;
}

.art-work-form {
    background: #0b0f12;
    padding: 1rem;
    margin: 0.4rem;
    border-radius: 1rem;
    min-width: 337px;
}

.dragging {
    background: #2c3136 !important;
    padding: 1rem;
    margin: 0.4rem;
    border-radius: 1rem;
    min-width: 337px;
}

.drag-handle:hover {
    background: #343a40;
}

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}




footer {
    line-height: 15px;
}

body {
    background-color: #151617;
    scrollbar-width: thin;
    scrollbar-color: #3187e2 #988ba4;
}




/* ===== Scrollbar CSS ===== */
/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #4e8577 #272727;
}

    /* Chrome, Edge, and Safari */
    *::-webkit-scrollbar {
        width: 10px;
    }

    *::-webkit-scrollbar-track {
        background: #272727;
    }

    *::-webkit-scrollbar-thumb {
        background: #4e8577;
        border-radius: 25px;
        border: 10px solid #202026;
        border-radius: 1rem !important;
        -webkit-border-radius: 1ex;
        -webkit-box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.75);
    }






.border-top {
    border-top: 1px solid #e5e5e5;
}

.border-bottom {
    border-bottom: 1px solid #e5e5e5;
}

.box-shadow {
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
}

button.accept-policy {
    font-size: 1rem;
    line-height: inherit;
}


.footer {
    white-space: nowrap;
    line-height: 60px;
}


.color-panel-standart {
    background: #f6f6f6;
}

.buy-button-round {
    background: rgb(227, 69, 69) !important;
    margin-top: 0.1rem;
    padding: 0.9rem !important;
    color: #fff !important;
    font-size: 14pt !important;
    font-weight: 600;
    border: 0px solid #f6f6f6 !important;
    border-radius: 0px 0px 1.5rem 1.5rem !important;
}


.buy-button-box {
    background: rgb(227, 69, 69) !important;
    margin-top: 0.1rem;
    padding: 0.9rem !important;
    color: #fff !important;
    font-size: 14pt !important;
    font-weight: 600;
    border: 0px solid #f6f6f6 !important;
    border-radius: 0rem !important;
}


.buy-button-box, .buy-button-round:hover {
    background: rgb(165, 64, 64) !important
}

.buy-button-disable {
    background: black;
    border-radius: 0.6rem !important;
    margin-top: 1rem;
    padding: 0.7rem !important;
    color: #fff !important;
    font-size: 14pt !important;
    font-weight: 600;
}

.nav-tabs .nav-link {
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem;
    padding: 0.6rem 1.4rem;
}


.a-link-footer {
    padding: .5rem 0rem !important;
}

.footer-my {
    position: relative;
    background: #1c1d22;
    padding: 0rem 1rem;
    z-index: 1
}

.grecaptcha-badge {
    z-index: 8
}





.note-editor.note-airframe, .note-editor.note-frame {
    border: 1px solid rgba(0,0,0,.2) !important;
    background: white;
}



.reCaptcha-form {
    position: relative;
}















.cart-panel-item {
    padding: 1rem !important;
    background-image: linear-gradient(150deg, #0000 -0%, #64626282 799%);
    border-radius: 1rem;
    font-size: 15pt;
    font-weight: 600;
    color: #be3535;
}

.color-1 {
    color: #cdd1c0;
}


a.navbar-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
}




.img-bundle-product {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-bundle-col {
    height: 100px;
}


.ok {
    bottom: -170px;
    left: 0;
    right: 0;
    position: absolute;
    -webkit-transition: all 0.2s linear;
    opacity: 0;
    color: #000;
    height: 100%;
    background: #000000d4;
    font-family: Calibri;
}

.card:hover .ok {
    width: 100%;
    bottom: 0px;
    opacity: 1;
}

.card-v2 {
    border: 0px;
    border-radius: 0rem !important;
    min-height: 300px;
}

.card-img-v2 {
    border: 0px;
    border-radius: 0rem !important;
    position: relative;
    object-fit: fill;
    height: 100%;
    min-height: 405px;
    background-size: cover;
    object-fit: cover;
    left: 0;
    object-position: center;
}



.card-img-artwork {
    border: 0px;
    border-radius: 0rem !important;
    position: relative;
    object-fit: fill;
    height: 100%;
    background-size: cover;
    object-fit: cover;
    left: 0;
    object-position: center;
}


.card-img-v3-mini {
    min-height: 260px;
    max-height: 170px;
}


.card-img-v34-mini {
    min-height: 160px;
    max-height: 170px;
}


.card-img-v5-mini {
    min-height: 220px;
    max-height: 255px;
}


.card-img-v12-mini {
    min-height: 100px;
    max-height: 170px;
}

.card-img-v3adv-mini {
    min-height: 483px;
    max-height: 364px;
}

.card-img-v3adv-logo-mini {
    min-height: 220px;
    max-height: 344px;
    width: 70%;
    margin: 12rem auto;
    object-fit: contain;
}



.title-adv-product {
    font-size: 14pt;
    text-transform: uppercase;
    padding: 0.4rem 0.6rem;
    border-radius: 0.6rem;
}


.nav-link {
    color: white;
}

    .nav-link:hover {
        color: #e9ecef;
    }

    .nav-link::before, .nav-link:before, .nav-link:active, .nav-link:focus {
        color: #e9ecef;
    }




.h-menu-list {
    font-size: 12pt;
}





.h-menu-list-category {
    font-size: 12pt;
    padding: 0.4rem;
    text-shadow: 6px 1px 6px #1a2431, 0px 1px 4px #1a2431;
    border-radius: 1.5rem;
    font-weight: 600
}

.p-menu-list {
    font-size: 10pt;
}

.i-menu {
    font-size: 14pt;
}

.my-list-group-item {
    border: 0px !important;
    border-radius: 0.5rem;
}

.my-list-group-item-admin {
    border: 0px !important;
    border-radius: 1.0rem !important;
    background-color: #f9f9f9;
    padding: 2.5rem 2.5rem 2.5rem 2.5rem;
    min-height: 100px;
    overflow: hidden;
}

    .my-list-group-item-admin:hover {
        background-color: #ebebeb;
    }

.my-list-group-item-category {
    background-color: #0c060600 !important
}





.overlay-img {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    top: 0;
    z-index: 0;
}

.block-text-menu {
    z-index: 1;
    text-align: start;
    align-self: center !important;
    align-items: center !important;
    justify-content: flex-start !important;
}

.block-text-menu-2 {
    z-index: 1;
    text-align: center;
}

.i-menu-2 {
    font-size: 15pt;
    z-index: 1;
}

.i-menu-3 {
    font-size: 16pt;
    z-index: 1;
}
/*.my-list-group-item-admin:hover {
    background-color: #f1f1f1;
}*/
.card-footer {
    background-color: rgba(0, 0, 0, 0)
}

.obj-img {
    position: absolute;
    object-fit: cover;
    object-position: center;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: -1
}

.card-menu {
    width: 200px;
    height: 400px;
    overflow: hidden;
    border-radius: 2.5rem;
    object-fit: cover;
    object-position: center;
    margin: 0.5rem;
}


.card-menu-link {
    color: #fff !important;
    text-decoration: underline
}

.card-menu-img {
    width: 100%;
    bottom: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.card-menu-img-overlay {
    background: linear-gradient(180deg, #0000 17%, #A53838 88%);
    z-index: 1;
    top: 0;
    bottom: 0;
    position: absolute;
    left: 0;
    right: 0;
}


    .card-menu-img-overlay:hover {
        background: linear-gradient(180deg, #0000 17%, #0F0101 88%)
    }


.bq-white {
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: #f9f9f9;
    z-index: -1;
}

.bq-dark-filter {
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: #161717;
    z-index: 0;
}


a {
    text-decoration: none
}






.card {
    border: 0px;
}

.my-btn {
    border-radius: 0.2rem;
    background: #6961b5;
    border: 0px;
}

    .my-btn:hover {
        border-radius: 0.2rem;
        background: #4961b5;
        border: 0px;
    }


.form-control {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #202020;
    background-clip: padding-box;
    border: 0px solid #ced4da;
    font-size: 16px;
    font-weight: 500;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.note-editor .note-toolbar .note-color-all .note-dropdown-menu, .note-popover .popover-content .note-color-all .note-dropdown-menu {
    color: #fff;
}

.lib-form-control {
    background-color: #1c1c1f !important;
    color: white;
    border: 2px solid #171717 !important;
    border-radius: 0.4rem !important;
    min-height: 50px;
}

    .lib-form-control:focus {
        color: #fff;
        background-color: #2b3137;
        outline: 0;
        box-shadow: 0px 0px 6px 0.1rem rgba(253, 227, 13, 0.25) !important;
        border: 2px solid #6dbb1f !important;
    }

.form-check.lib-title-product-panel.border-radius-10:hover {
    background: #1b1d20;
}




.btn-primary {
    border: 0px !important;
    outline: 0px !important;
}

    .btn-primary:hover {
        border: 0px !important;
        outline: 0px !important;
    }

    .btn-primary:focus {
        border: 0px !important;
        outline: 0px !important;
        box-shadow: unset !important;
    }

.my-color-1 {
    color: #0c0c0ce8 !important
}



.my-color-2 {
    background: #0c0c0ce8 !important
}

    .my-color-2:hover {
        background: #616161e8 !important
    }

.my-color-3 {
    background: #fff0 !important
}

.soc-facebook {
    background-image: url('../facebook-fake.png');
    background-color: none;
    height: 48px;
    width: 48px;
    background-size: cover;
}

.card-panel {
    border-radius: 2rem;
    max-width: 680px;
    margin: 0.5rem auto
}

.card-panel-2 {
    border-radius: 2rem;
    max-width: 1280px;
    margin: 0.5rem auto
}


.link-box {
    width: 150px;
    height: 150px;
    overflow: hidden;
    border-radius: 2.5rem;
    object-fit: cover;
    object-position: center;
    margin: 0.5rem;
}

.nav-my-1 {
    background: #d2d2d214 !important;
    border: 0;
    border-radius: 0.25rem;
}

    .nav-my-1:hover {
        background: #1e1e1e !important;
        border: 0;
        border-radius: 0.25rem;
    }

.nav-pills .nav-my-1.active, .nav-pills .show > .nav-my-1 {
    background: #78d6c5 !important
}

.form-control:focus {
    border: 2px solid #3e3f4000;
    background: #2b3136;
    box-shadow: 0 0 0 0.0rem rgb(13 110 253 / 25%);
    color: #cdcdcd;
}


.form-control {
    border: 2px solid #3e3f4000;
    background: var(--wenrexa-bg-secondary);
}






/***/

.file {
    opacity: 0;
    width: 0.1px;
    height: 0.1px;
    position: absolute;
}

.file-input {
    width: 100%;
}

    .file-input label {
        display: block;
        position: relative;
        border-radius: 5px;
        /*border: 2px dashed #717171; */
        display: block;
        color: #767474;
        font-weight: 600;
        cursor: pointer;
        background: #ececec;
        text-align: center;
        padding: 1.25rem;
        margin: 5px;
        width: 100%;
    }

        .file-input label:hover {
            background: #ced4da;
        }
/*input:hover + label,
input:focus + label {
    transform: backgrou(1.02);
}

input:focus + label {
     outline: -webkit-focus-ring-color auto 2px; 
 
}
**/



.file-name {
    font-size: 0.85rem;
    color: #555;
    text-align: center;
    margin: 0 auto;
}






.my-list-group-item-admin-2 {
    border: 0px !important;
    border-radius: 1.0rem !important;
    background-color: #f9f9f9;
    padding: 2.5rem 2.0rem 2.5rem 1rem;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    min-height: 100px;
    overflow: hidden;
}


.btn-product-list {
    color: #fff !important;
    background-color: rgb(133, 179, 87);
    border-radius: 0.5rem;
    min-height: 70px;
    width: 80px;
    height: 86px;
    text-align: center;
}

    .btn-product-list:hover {
        background-color: rgba(6, 5, 5, 0.62)
    }

.overlay-product-list {
    background: linear-gradient(-90deg, #5353f859 17%, #f9f9f9 88%);
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.overlay-product-list-title {
    background: linear-gradient(-90deg, #fff0 17%,#090A0A78 88%);
    padding: 1.1rem;
    border-radius: 0.5rem;
    color: white;
    position: relative;
    height: 86px;
}

.overlay-category-list-title {
    background: #47495b;
    padding: 1.1rem;
    border-radius: 0.5rem;
    color: #fff;
    position: relative;
    height: 86px;
    overflow: hidden
}



@media only screen and (max-width: 800px) {
    .flex-wrap-product {
        flex-wrap: wrap !important;
    }
}

.h-menu-list-tools {
    font-size: 10pt
}

.overlay-category-list {
    background: #f9f9f9;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}


.overlay-img-list {
    background: rgba(0, 0, 0, 0.77);
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}



.tag-apps {
    background: #8e435c;
    font-size: 10pt;
    border-radius: 0.4rem;
    color: #fff;
    padding: 0.4rem 0.6rem;
    line-height: normal;
}


.block-info-addon {
    padding: 0.12rem 0.3rem;
    border-radius: 0.5rem;
}

.title-block-info {
    font-size: 12pt;
    font-weight: 500;
    width: 100%;
}

.p-title-1 {
    font-size: 11pt;
    font-weight: 500;
    margin: 0rem 0rem 0.1rem 0rem;
}

.p-title-2 {
    font-size: 10pt;
    margin: 0rem 0rem 0.2rem 0rem;
}

.p-title-3 {
    font-size: 11pt;
    font-weight: 700;
    margin: 0rem 0rem 0.1rem 0rem;
}

.p-title-4 {
    font-size: 11pt;
    margin: 0rem;
}

.p-title-5 {
    font-size: 10pt;
    color: #808a93 !important;
    font-weight: 600 !important;
    margin: 0rem;
}

.warning-border-green {
    box-shadow: 0px 0px 6px 0.1rem rgba(253, 227, 13, 0.25) !important;
    border-color: #6dbb1f !important;
    border: 2px dotted #6dbb1f !important;
    border-style: dotted !important;
    background: #3a4d38;
    color: white !important;
    font-weight: initial;
}

.icon-item {
    width: 26px;
    height: 100%;
    font-size: 12pt;
    text-align: center;
}

.tab-item-1 {
    background: #f7f7f7;
    border-radius: 0.5rem;
    padding: 0.25rem 0.45rem
}

.nav-item-addon {
    font-size: 11pt;
    font-weight: 700;
}

.dropdown-dots-menu {
    background-color: rgba(222, 222, 222, 0) !important;
    border: 0px !important;
    color: #595151;
    font-size: 17pt;
}

    .dropdown-dots-menu:hover {
        color: #595151;
        font-size: 17pt;
    }

    .dropdown-dots-menu:focus {
        border: 0px solid;
        color: #595151;
        box-shadow: 0 0 0 0.0rem rgb(13 110 253 / 0%);
    }


.block-info-div {
    color: #000 !important;
    background: #f9f9f9;
    min-width: 100% !important;
    min-height: 110px;
    padding: 1.1rem 1.42rem !important;
}

.block-info-dd {
    color: #272727 !important;
    min-width: 150px;
}

.block-info-dd-h6 {
    font-size: 17pt;
    font-weight: 600;
}

.block-info-dd-mini-p {
    font-size: 9pt;
    height: 36px;
}

.block-info-dd-mini-icon {
    z-index: 1;
    font-size: 32pt;
}




.section-block-1 {
    background: #0e0e0e 60%;
    padding-bottom: 1.6rem;
    padding-top: 1.6rem;
    padding-left: 3rem;
    padding-right: 3rem;
    z-index: 0 !important;
    position: relative;
}

.section-block-2 {
    background: #15171e;
    padding-bottom: 1.6rem;
    padding-top: 1.6rem;
    z-index: 0 !important;
    position: relative;
    background: linear-gradient(180deg, rgb(16, 14, 14) 0%, rgb(0, 0, 0) 42%, rgb(17, 12, 12) 100%);
    background: #1d202321;
    border-radius: 2rem;
}


.overlay-block-pd {
    padding: 0.4rem 0.9rem;
    background: #ff4141;
    border-radius: 0.6rem;
    margin: 0.5rem;
    z-index: 3;
    width: auto;
}

.overlay-gradient-img {
    z-index: 2;
    bottom: 0px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: linear-gradient(180deg, #0000 6%, #61ffe1b3 90%)
}


.news-title-block {
    padding: 1.2rem;
    position: absolute;
    bottom: 0;
    width: 100%;
}

.nav-tabs-project {
    padding: 0.6rem 1.4rem;
    font-weight: 600;
    font-size: 12pt;
    height: 130px;
    width: 130px;
    padding: 0.5rem;
    background: #f2f2f2 !important;
    border: 0px solid !important;
    border-radius: 0.7rem;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-tabs-project.active {
    background: #f9f9f9 !important;
    border-color: #dee2e6 #dee2e6 #fff;
}

.nav-item-project {
    padding: 0px !important;
}

.nav-tabs-main {
    border-bottom: 0px solid #dee2e6;
}

.my-list-group-item-project {
    border-radius: 0.6rem !important;
    overflow: hidden;
    border: 0px;
    background: #f000;
    color: #aeaeae;
    padding: 0.1rem
}

    .my-list-group-item-project:hover {
        background: linear-gradient(150deg, #0000 -0%, #fff0 299%);
        background-color: rgba(0, 0, 0, 0);
        color: white !important;
    }

    .my-list-group-item-project.active {
        z-index: 1;
        color: #fff;
        background-color: #0d6efd00;
        border-color: #0000;
        color: white !important;
    }

    .my-list-group-item-project.disabled, .my-list-group-item-project:disabled {
        z-index: 1;
        color: #535353;
        background-color: #1b1c1b;
        border-color: #0d6efd;
        pointer-events: none;
    }


.user-auth-style {
    background: #000000d4;
}



.details-card {
    object-fit: cover;
    object-position: center;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: -2;
}

.bq-image-product {
    position: relative;
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
}

.card-page {
    border-radius: 2rem;
    max-width: 1440px;
    margin: 0.5rem auto;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    overflow: hidden;
    padding: 0px;
    background: #1d2124;
    color: #fff;
    min-height: 500px;
    background: linear-gradient(150deg, #29292c -0%, #101214 99%);
    border: 1px solid #212121;
    margin-bottom: 5rem;
    margin-top: 2rem;
}

.card-page-admin {
    border-radius: 2rem;
    max-width: 1440px;
    margin: 0.5rem auto;
    padding: 1.5rem 0rem;
    background: #fff
}

.card-page-body {
    padding: 0rem !important;
    overflow: hidden;
    min-height: 455px;
}



.card-body-img-bq {
    background-repeat: repeat;
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: -1
}

.img-border-n1 {
    width: 100%
}

.img-border-n2 {
    width: 45%;
    border-radius: 2.3rem;
}


.number-order {
    font-size: 8pt;
    color: #6e6e6e !important;
    font-weight: 600
}

.obj-fit-img {
    object-fit: cover;
    object-position: center;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: -2;
}

.obj-fit-img-bq {
    position: relative;
    object-fit: cover;
    object-position: center;
    width: 100%;
    min-height: 1400px;
    margin-top: -10rem
}

.obj-fit-img-gradient {
    z-index: -1;
    background-image: linear-gradient(180deg, #0000 17%, #0e0e0e 60%);
    max-height: 1250px;
    height: 2000px;
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
}






.obj-fit-img-userpage {
    z-index: -1;
    background-image: linear-gradient(180deg, #0000 50%, #0d0707 99%);
    max-height: 1250px;
    height: 100%;
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
}




.design-page-form {
    background: rgb(188, 39, 39);
    z-index: 1;
    height: 50px;
    padding: 1rem;
    width: 50px;
    text-align: center;
    border-radius: 0.5rem;
    align-self: center;
    display: flex;
    color: white;
    align-items: center;
    align-content: center;
}

    .design-page-form:hover {
        background: rgb(208, 66, 66)
    }

.design-page-btn {
    width: 120px;
    background: #b93737;
    z-index: 1;
}


.user-page-bq {
    height: 200px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #bbb9b9;
    object-fit: cover;
    object-position: center;
}

.user-page-header {
    height: 200px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #bbb9b9;
    object-fit: cover;
    object-position: center;
}

.product-page-header {
    height: 200px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid #bbb9b9;
    object-fit: cover;
    object-position: center;
}

.product-page-bq {
    height: 200px;
    border-radius: 5px;
    border: 1px solid #bbb9b9;
    object-fit: cover;
    object-position: center;
    width: 100%
}

.screenshots-img {
    height: 155px;
    object-position: center;
    object-fit: cover;
    border: 2px;
    border-radius: 1.0rem;
    background-color: #212529;
    border-radius: 1.0rem;
    border-style: dashed;
    border-color: #ffffff0d;
}


.tools-img-screenshots {
    position: absolute;
    bottom: 1rem;
    left: 0;
    right: 0;
    text-align: center;
}



.form-range::-moz-range-thumb {
    width: 2rem;
    height: 1rem;
    background-color: #96B936;
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 4px 15px rgba(50, 91, 39, 0.31);
}





.form-range:focus::-moz-range-thumb {
    box-shadow: 0 0 0 2px #dff79c,0 0 0 .25rem rgba(215, 249, 53, 0.25);
}

.form-range:active:hover::-moz-range-thumb {
    width: 2rem;
    height: 1rem;
    background-color: #5a6816;
    border: 0;
    border-radius: 1rem;
    box-shadow: 0 0 0 2px #dff79c,0 0 0 .25rem rgba(160, 249, 53, 0.25);
}



.border-radius-15 {
    border-radius: 1.5rem !important;
    overflow: hidden;
}

.border-radius-full {
    border-radius: 10.5rem !important;
    overflow: hidden;
}

.border-radius-10 {
    border-radius: 1.0rem !important;
    overflow: hidden;
}

.border-radius-bottom-15 {
    border-radius: 0rem 0rem 1.5rem 1.5rem !important;
    overflow: hidden;
}

.discount-block-1 {
    background: #e83232;
    padding: 5px 10px;
    align-content: center;
    display: grid;
    border-radius: 0.5rem;
    font-weight: 600
}

.discount-block-2 {
    padding: 5px 10px;
    background: #000;
    border-radius: 0.5rem;
    align-self: center;
    font-weight: 600;
}

.price-block-angle {
    color: #fff
}

.cart-block-angle {
    padding: 0.9rem 1.5rem !important;
    margin: 0px;
    border-radius: 0rem 2rem 0px 0px !important;
}


.discount-block-free {
    padding: 5px 10px;
    background: #3f5c34ba;
    border-radius: 70.5rem;
    font-weight: 600;
}

.discount-block-free-2 {
    padding: 5px 10px;
    background: #000;
    border-radius: 0.5rem;
    font-weight: 600
}

.card-short-footer {
    font-size: 9pt;
    overflow: hidden;
    text-overflow: ellipsis;
}



.lib-price-custom-1 {
    padding: 0.7rem 1rem;
}

.lib-discount-custom-2 {
    text-align: center;
    text-transform: uppercase;
    color: #8eaa41;
    font-size: 14pt;
    font-weight: 400;
}





.card-buy-info {
    padding: 0.2rem;
    width: inherit;
    height: 100%;
}

.scroll-horz {
    overflow-x: auto;
    overflow-y: hidden;
}

.scroll-vert {
    overflow-x: hidden;
    overflow-y: auto;
}

.bundle-body {
    background: #f7f7f708;
    color: #fff;
    font-weight: lighter;
}

.gradient-main-page {
    z-index: -1;
    background-image: linear-gradient(180deg, #d9d9d900 17%, #f4f4f4 60%);
    max-height: 1250px;
    height: 2000px;
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
}


.header-main-page {
    object-fit: cover;
    object-position: center;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: -2;
}

.imgheader-main-page {
    position: relative;
    object-fit: cover;
    object-position: center;
    width: 100%;
    min-height: 1400px;
    margin-top: -10rem
}

.price-order-summary {
    background: #0b050570;
    border-radius: 0.3rem;
    margin: 0.1rem 0.3rem;
    padding: 3px;
    font-weight: 600;
    width: 120px;
    font-size: 11pt;
    color: #fff;
    text-align: center;
}

.price-order-summary-finish {
    background: #3b4f24;
}

.item-product-cart {
    border-radius: 1.0rem;
    overflow: hidden;
    padding: 0.2rem 0.8rem;
    border: 1px dashed #535353;
    margin-bottom: 0.2rem;
}

    .item-product-cart:hover {
        border: 1px dashed #8b8b8b;
    }

.item-product-cart-img {
    width: 100%;
    height: 100%;
    object-position: center top;
    object-fit: cover;
    position: absolute;
}


.title-name-bundle {
    font-size: 16pt;
    font-weight: 600
}

.btn-ns-1 {
    background-color: #b5b2b200;
    border-color: #e6e6e6;
}

.product-title-cart-x {
    font-size: 12pt;
    color: #fff;
    font-weight: normal;
}

.item-product-cart-pos {
    object-fit: cover;
    object-position: center;
    overflow: hidden;
    position: relative;
    height: 100%;
    width: 100%;
}

.item-bundle-title-order {
    margin-top: 1rem;
    padding: 0.2rem;
    text-align: start;
    color: #fff;
    border: 2px solid #535353;
    border-style: dashed;
    border-radius: 0.7rem;
    margin-bottom: 1rem;
}

.item-product-cart-discount {
    padding: 1rem;
    width: 80px;
    font-weight: 600
}



.title-section {
    margin: 1.5rem 2.5rem 1.5rem 0.5rem;
    color: white
}

.title-item-1 {
    margin: 1.5rem 2.5rem 0.5rem 0.5rem;
    color: white
}

.bundle-body-warning {
    text-transform: none !important;
    color: rgb(89, 96, 103) !important;
    font-weight: 400;
}

.card-news-main-item {
    min-height: 516px;
    background-color: #fff0;
}

.card-news-mini-item {
    min-height: 120px;
    background-color: #fff0;
}

.form-floating > .form-control:focus ~ label, .form-floating > .form-control:not(:placeholder-shown) ~ label, .form-floating > .form-select ~ label {
    color: #8b9aa8 !important;
}

.focus-action-1 {
    border: 2px solid rgba(222, 222, 222, 0);
    -webkit-transition: border 0.3s, -webkit-transform 0.3s;
    transition: border 0.3s, transform 0.3s;
}

    .focus-action-1:hover {
        /*  border: 2px solid #fff;*/
        background-color: #fff0;
    }


.news-title-card {
    position: absolute;
    bottom: 0px;
}

.news-title-cardB {
    width: inherit;
    padding: 1rem 1rem 0rem 1rem;
    height: 105px;
    margin-top: -3rem;
}


.card-news-fill-link {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 5;
    position: absolute;
}


.form-floating > label {
    position: absolute;
    top: 0;
    z-index: 2;
    max-width: 100%;
    height: 100%;
    padding: 1rem .75rem;
    overflow: hidden;
    color: rgba(var(--bs-body-color-rgb),.65);
    text-align: start;
    text-overflow: ellipsis;
    white-space: nowrap;
    pointer-events: none;
    border: var(--bs-border-width) solid transparent;
    transform-origin: 0 0;
    transition: opacity .1s ease-in-out,transform .1s ease-in-out;
    font-weight: 600;
    color: #fff!important
}



 







.warning-border {
    border: 1px dashed;
    border-radius: 0.5rem;
}




.overlay-main-page {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: #222222a6;
    margin-top: -11rem;
}


.p-title-news {
    padding: .5rem 5.5rem .5rem .5rem !important;
}


.tag-edit-tools {
    transition: 0.15s all ease;
    cursor: pointer;
    margin-left: 0.1rem;
    margin-right: 0.1rem;
}


    .tag-edit-tools:hover {
        background: #90c16d;
        cursor: pointer;
        position: static;
        color: #fff !important;
        transform: scale(1.1);
        transition: 0.1s all ease;
    }

.card-header-news {
    height: 340px;
    width: 100%;
    position: relative;
}

.color-panel-standart:hover {
    background: white;
}



.tag-edit-close {
    background: #f7f7f7;
    padding: 0.3rem 0.5rem;
    border-radius: 6px;
}

.avatar-user {
    object-fit: cover;
    height: 35px;
    width: 35px;
    margin-left: 1rem;
    display: flex;
    align-items: center;

}

.avatar-user-control {
    object-fit: cover;
    height: 75px;
    width: 75px;
}


.bq-green-bank {
    background: #213c28d6;
}


.bq-red-bank {
    background: #6f2c2cd6;
}

.bq-orange-bank {
    background: #a45c00d6
}


.bank-account-btn {
    background: #101113;
    border-radius: 1rem;
    padding: 1rem !important;
    min-width: 200px
}

    .bank-account-btn:hover {
        background: #18191c;
    }

    .bank-account-btn.active {
        background: #2c2f35 !important;
    }

.ba-4 {
    height: 170px;
    display: grid;
}

.ba-6 {
    height: 66px;
    display: grid;
}

.panel-item-btn {
    background: #ffffff1f;
    padding: 1rem !important;
    min-width: 200px;
}

    .panel-item-btn:hover {
        background: #eee;
    }

.panel-item-btn-p {
    background: #ffffff1f;
    padding: 1rem !important;
    min-width: 200px;
    opacity: 1
}

    .panel-item-btn-p:hover {
        background: #eee;
        opacity: 0.9
    }

.h-72px {
    height: 72px
}


.bank-account-set-type {
    background: white;
    padding: 2rem;
    border-radius: 1rem !important;
    border: 4px solid transparent;
    color: white;
    background: #131416;
}

.list-group-item.bank-account-set-type {
    cursor: pointer;
    border: 4px solid transparent;
}

.bank-account-set-disabled {
    color: #a8a8a8;
    padding: 0.5rem 1rem;
    background: #1c1c1f;
    border-radius: 1rem !important;
}

.btnCreateAccountBank:disabled {
    color: gray
}

.form-check-input:checked + .list-group-item.bank-account-set-type {
    border-color: #fff;
    box-shadow: 0 0 10px 3px rgba(160, 50, 50, 0.5);
    background: #fff;
    color: black;
}


.partners-card-company {
    position: relative;
    object-fit: contain;
    object-position: center;
    max-width: 500px
}

.partners-card-company-img {
    min-height: 500px;
    width: auto;
    object-fit: contain;
    object-position: center;
}

.gray-light-xs {
    color: #c8c8c8 !important;
}



.category-img-partners {
    z-index: 0;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    position: absolute;
    pointer-events: none
}


.category-img-partners-overlay {
    background: #040404a8;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 0;
}



.width-260px {
    width: 260px !important;
}

.avatar-user-bank {
    object-fit: cover;
    height: 52px;
    width: 52px;
    border: 4px solid #1a1a1a;
}

.account-profile-money {
    font-size: 12pt;
    font-weight: 600;
    color: #bbf713; /*! background: #2f5926; */
    padding: 0.2rem;
    border-radius: 0.5rem;
}



.tag-dark {
    background: #2b231e
}


.license-style-d {
    background: #d24141;
    color: #fff;
}

.op-old-anim {
    opacity: 0;
}


.animation-show-1 {
    /*   background-color: #78e08f;
   opacity: 0;
    transform: scale(0);*/
    visibility: visible;
    opacity: 1;
    /* transition: opacity 0.1s, scale 0.1s, visibility 1.3s;
    */
    transition: all .4s ease-in-out;
    -webkit-animation-name: fadeInShow;
    -webkit-animation-duration: 1s;
    animation-name: fadeInShow;
    animation-duration: 1s;
}


@-webkit-keyframes fadeInShow {
    0% {
        opacity: 0;
    }



    100% {
        opacity: 1;
        /*  transform: scale(1);*/
    }
}

@keyframes fadeInShow {
    0% {
        opacity: 0;
        /*  transform: scale(0.1);*/
    }


    100% {
        opacity: 1;
        /*  transform: scale(1.0);
        */
    }
}














.lib-push {
    padding: 0.3rem 0.6rem;
    border-radius: 1rem;
    color: #fff;
    position: relative;
}

.lib-push-badge {
    width: 40px !important;
    display: inline-block;
    text-align: center;
    padding: 0.2rem 0.6rem
}





.box {
    transition: opacity 4000ms;
    will-change: opacity;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

    .box.faded-out {
        opacity: 0;
        -webkit-transition: width 2s, height 2s, background-color 2s, -webkit-transform 2s;
        transition: width 2s, height 2s, background-color 2s, transform 2s;
    }



.opdacity-anim-overlay {
    display: none;
    opacity: 0;
    -webkit-transition: opacity 2s, -webkit-transform 2s;
    transition: opacity 2s, transform 2s;
    -webkit-transition: all 0.2s linear;
}




.main-page-more-bundle {
    background-color: #e33333;
    padding: 0.7rem 1rem;
    font-size: 17pt;
    border-radius: 0.6rem;
    z-index: 4;
}


    .main-page-more-bundle:hover {
        background-color: #9fb537;
    }






.main-page-more {
    background-color: #e33333;
    padding: 0.8rem;
    font-size: 17pt;
    border-radius: 0.6rem;
    z-index: 4;
    bottom: 220px;
    border-radius: 0rem !important;
}




    .main-page-more:hover {
        background-color: #9fb537;
        border-radius: 0.6rem;
    }


.main-page-more-cart {
    position: absolute;
    left: 4.4rem;
    background: #48a341;
}

.main-page-more-cart-ex {
    background: #3e8939;
}


.cart-br {
    border-radius: 0rem 1rem !important;
}



.card:hover .main-page-more {
    width: 100%;
    bottom: 0px;
    opacity: 1;
    display: block;
    opacity: 1.0;
}

.main-page-author {
    font-size: 11pt;
}

.card-body-d1 {
    padding: 21px;
    border-radius: 1.0rem;
    margin: -13px;
}

.card-body-title-h1 {
    font-size: 12pt;
    text-align: center;
    margin: -5px -10px 0px -10px;
    border-radius: 0.5rem;
    color: #fff;
    font-weight: 400;
    overflow: hidden;
    padding: 1rem;
}

.offcanvas-designer-page {
    background: rgb(27, 31, 34);
    color: #fff;
    padding: 1rem;
}


.tools-img-preview {
    height: 80px;
    width: 150px;
}


.upload-input-style1 {
    position: absolute;
    z-index: 2;
    background: rgba(0, 0, 0, 0.02);
    height: 80px;
    width: 144px;
    cursor: pointer;
    opacity: 0.001;
}


.upload-input-overlay {
    background: #ffffffd1;
    text-align: center;
    padding: 1.5rem;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}


.upload-input-style1-info {
    cursor: pointer;
    /* Style as you please, it will become the visible UI component. */
}



/* Sidebar. */

.bd-placeholder-img {
    font-size: 1.125rem;
    text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}


.b-example-divider {
    height: 3rem;
    background-color: rgba(0, 0, 0, .1);
    border: solid rgba(0, 0, 0, .15);
    border-width: 1px 0;
    box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
}

.b-example-vr {
    flex-shrink: 0;
    width: 1.5rem;
    height: 100vh;
}

.bi {
    vertical-align: -.125em;
    fill: currentColor;
}

.nav-scroller {
    position: relative;
    z-index: 2;
    height: 2.75rem;
    overflow-y: hidden;
}

    .nav-scroller .nav {
        display: flex;
        flex-wrap: nowrap;
        padding-bottom: 1rem;
        margin-top: -1px;
        overflow-x: auto;
        text-align: center;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }




.dropdown-toggle {
    outline: 0;
}

.btn-toggle {
    padding: .25rem .5rem;
    font-weight: 600;
    background-color: transparent;
}

    .btn-toggle:hover,
    .btn-toggle:focus {
        color: #d0d0d0
    }

    .btn-toggle::before {
        width: 1.25em;
        line-height: 0;
        content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba(222,222,222)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
        transition: transform .35s ease;
        transform-origin: .5em 50%;
    }

    .btn-toggle[aria-expanded="true"] {
        color: rgb(74, 74, 74);
    }

        .btn-toggle[aria-expanded="true"]::before {
            transform: rotate(90deg);
        }

.btn-toggle-nav a {
    padding: .1875rem .5rem;
    margin-top: .125rem;
    margin-left: 1.25rem;
}

    .btn-toggle-nav a:hover,
    .btn-toggle-nav a:focus {
        background-color: #657772;
    }

.scrollarea {
    overflow-y: auto;
}

.header-nav {
    /* background: linear-gradient(180deg, rgba(255, 255, 255, 0.64) 2%, rgba(255, 255, 255, 0.82) 80%);*/
    background: #fff;
    z-index: 2;
    width: 100%;
    background: #111315;
    box-shadow: 0px 0px 100px -20px rgb(0, 0, 0) !important;
    box-shadow: 0px -20px 70px rgba(98, 114, 125, 0.11) !important;
}

.news-big-item-container {
    height: 500px !important
}

.news-max-container {
    max-width: 1890px;
}

.global-max-container {
    max-width: 1890px;
}

.news-item-container {
    min-height: 155px !important;
}

.btn-sidebar-filter {
    color: #e5e5e5;
    width: 100%;
    padding: 0.7rem 0.8rem;
    padding-right: 0.8rem;
    padding-left: 0.8rem;
    text-transform: uppercase;
    font-size: 12pt;
    background: #302f34 !important;
    margin: 0.2rem 0.2rem;
    border-radius: 0.5rem !important;
    min-width: 170px;
    text-align: center !important;
    align-content: center;
    align-self: center;
    display: block !important;
    position: relative;
    font-weight: 600;
}

    .btn-sidebar-filter:hover {
        background: #1c1f23 !important;
    }


    .btn-sidebar-filter:disabled {
        background: #343434 !important;
        color: #575757;
    }


.cart-lib-item {
    color: #e5e5e5;
    padding: 0.7rem 0.8rem;
    background: #2c3136 !important;
    text-align: center !important;
    align-content: center;
    align-self: center;
    position: relative;
}

    .cart-lib-item:hover {
        background: #1c1f23 !important;
    }

.nav-bar-main-menu {
    background: #fff0;
    border-radius: 0.5rem;
}

.nav-sidebar-submenu {
    padding: 0.6rem 1.2rem !important;
    padding-left: 1.6rem !important;
    background: rgba(222, 222, 222, 0) !important;
    width: 100%
}

    .nav-sidebar-submenu:hover {
        background: #dfdfdf !important
    }

.sidebar-find-page {
    border-radius: 0.5rem;
    min-width: 260px;
    position: sticky;
    z-index: 2;
    top: 0;
    right: 0;
    padding-top: 0px !important;
    overflow: visible !important;
    height: 100%;
    background: rgba(0, 0, 0, 0.74);
}

.lib-status-public-part {
    position: absolute!important;
    z-index: 1;
    top: 0!important;
    left: 0;
    background: #030303cc;
    padding: 0.4rem;
    border-radius: 0px 0px 5px 0px;
    font-weight: normal;
    text-transform: uppercase;
    font-size: 10pt;
    pointer-events: none;
}

.not-border-radius {
    border-radius: 0rem !important;
}



.range-switch-language {
    width: 30px;
}

.panel-language-product {
    width: 130px;
}



.lib-order-history-price-1 {
    background: #587033;
    padding: 0.5rem;
    border-radius: 0.2rem;
    display: flex;
    max-width: 200px;
}

.lib-order-history-price-2 {
    background: #772d2d;
    padding: 0.5rem;
    border-radius: 0.2rem;
    display: flex;
    max-width: 200px;
}





/* The slider itself */
.slider-c1 {
    -webkit-appearance: none; /* Override default CSS styles */
    appearance: none;
    width: 55px; /* Full-width */
    height: 25px; /* Specified height */
    outline: none; /* Remove outline */
    opacity: 0.7; /* Set transparency (for mouse-over effects on hover) */
    -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    transition: opacity .2s;
}

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

    /* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */
    .slider-c1::-webkit-slider-thumb {
        -webkit-appearance: none; /* Override default look */
        appearance: none;
        width: 25px; /* Set a specific slider handle width */
        background: #04AA6D; /* Green background */
        cursor: pointer; /* Cursor on hover */
    }

    .slider-c1::-moz-range-thumb {
        width: 30px;
        background: #96B936;
        cursor: pointer;
        height: 15px;
    }


.slider-c::-moz-range-track {
    width: 100%;
    height: .7rem;
    color: transparent;
    cursor: pointer;
    background-color: #dee2e6;
    border-color: transparent;
    border-radius: 1rem;
}



.cover-main-filter {
    overflow: hidden;
    width: 100%;
    height: 350px;
}

.cover-main-filter-img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    object-fit: cover;
    object-position: center
}




.nav-bd-x {
    border-radius: 0.5rem !important;
    background: #fff;
    margin-top: 0.5rem
}

    .nav-bd-x:hover {
        background: #e6e6e6;
    }


.nav-pills .nav-link {
    border-radius: 0.5rem;
}

.bq-none {
    background: #0000 !important
}

.bq-filter {
    width: 100%;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    height: 100%;
    overflow: hidden;
    height: 100%;
}

.box-shadow-none {
    box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
}

.bq-filter-overlay {
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    z-index: 0;
    background: rgb(22, 22, 22);
    overflow: hidden;
}

.bq-filter-img {
    width: 100%;
    position: fixed;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    object-fit: cover;
    object-position: center;
    overflow: hidden;
}






.m-center-align {
    margin: 0 auto;
}






/*the container must be positioned relative:*/
.custom-select {
    position: relative;
    width: 100%;
}

    .custom-select select {
        display: none; /*hide original SELECT element:*/
    }

.select-selected {
    background: rgba(222, 222, 222, 0);
    color: #eaeaea !important;
    padding: 0.6rem 0.8rem !important;
    border: 2px solid #8e8383 !important;
    border-radius: 0.6rem;
    font-weight: revert;
}

    /*style the arrow inside the select element:*/
    .select-selected:after {
        position: absolute;
        content: "";
        width: 0;
        height: 0;
        border: 7px solid transparent;
        border-color: #fff transparent transparent transparent;
        top: 14px;
        bottom: 0;
        right: 22px;
        margin-top: 5px;
    }

    /*point the arrow upwards when the select box is open (active):*/
    .select-selected.select-arrow-active:after {
        border-color: transparent transparent #fff transparent;
        top: 7px;
    }

/*style the items (options), including the selected item:*/
.select-items div, .select-selected {
    color: #d2d2d2;
    padding: 8px 16px;
    border: 1px solid #0000;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
    user-select: none;
    background: #fff0;
    border-radius: 0.6rem;
    margin: 0.2rem;
    height: 46px;
    font-size: 11pt;
}


/*style items (options):*/
.select-items {
    position: absolute;
    background-color: #13181e;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
    border-radius: 1rem;
    padding: 0.8rem;
    overflow-y: auto;
}

/*hide the items when the select box is closed:*/
.select-hide {
    display: none;
}

.select-items div:hover, .same-as-selected {
    background-color: rgb(174, 49, 49);
}

.select-selected:focus {
    border-color: #5ab4ea !important;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(0, 0, 0, 0.35);
}















.avatar-user-col-g {
    border-radius: 0.8rem !important;
    margin: 0.3rem;
    overflow: hidden;
    background: black;
    min-height: 100px;
}




.product-col-g {
    border-radius: 0.8rem !important;
    margin: 0.3rem;
    overflow: hidden;
    background: black;
    min-height: 150px
}


.select-list-sidebar {
    border: 0px;
    height: 555px;
}

    .select-list-sidebar:focus {
        border: 0px;
        border-color: #86b7fe;
        box-shadow: 0 0 0 .0rem rgba(13,110,253,.25);
        outline: none;
        outline-style: none
    }




.select-list-sidebar-btn {
    padding: 1rem;
    border-radius: 0.6rem;
    margin: 0.4rem;
    outline: none;
    outline-style: none
}

    .select-list-sidebar-btn:focus {
        outline: none;
        outline-style: none
    }

    .select-list-sidebar-btn::selection {
        outline: none;
        outline-style: none
    }

    .select-list-sidebar-btn:hover {
        padding: 1rem;
        border-radius: 0.6rem;
        margin: 0.4rem;
        outline: none;
        outline-style: none;
    }


.title-sidebar-item1 {
    color: #aaa;
    font-weight: 200;
    font-size: 11pt
}

.title-sidebar-maintitle {
    color: #808a93 !important;
    font-weight: 600;
    font-size: 1.0rem;
}


.sidebar-select-title-list {
    background-color: #1c1f22;
    color: #eaeaea;
    padding: 0.6rem 0.8rem;
    border: 0px solid #3e4144;
    border-radius: 0.6rem;
    font-weight: lighter;
}




    .sidebar-select-title-list:focus {
        border-color: #5ab4ea;
        outline: 0;
        box-shadow: 0 0 0 .25rem rgba(0, 0, 0, 0.35);
    }



option {
    font-size: 18px;
    background-color: none;
}

    option:before {
        content: ">";
        font-size: 20px;
        display: none;
        background: red;
        border-radius: 1rem;
        color: #fff;
    }

    option:focus {
        border-color: #49d1e8;
        outline: 0;
        box-shadow: 0 0 0 .25rem rgba(9, 32, 36, 0.25);
    }



    option:hover:before {
        display: inline;
    }



.carousel-caption-header {
    position: absolute;
    color: #fff;
    text-align: center;
    top: 0;
    width: 100%;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 2rem;
}

.carousel-inner {
    height: 100%;
}

.carousel-indicators {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    padding: 0;
    margin-right: 15%;
    margin-bottom: 5rem;
    margin-left: 15%;
    list-style: none;
}




.library-list-item-product {
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-top: 1px;
    padding: 0rem;
    color: #7d9d9d;
    border: 0px;
    box-shadow: -200px 0px 100px 110px rgba(180, 180, 180, 0.01);
}

.library-list-item-product-v2 {
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-top: 1px;
    padding: 1.1rem 0.4rem;
    color: #7d9d9d;
    border: 0px;
    box-shadow: -200px 0px 100px 110px rgba(180, 180, 180, 0.01);
}


.library-list-item-product-v3 {
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 0.8rem 0.5rem;
    color: #7d9d9d;
    border: 0px;
    box-shadow: -200px 0px 100px 110px rgba(180, 180, 180, 0.01);
    min-height: 85px
}

.library-list-item-product-tab-title {
    background-color: #111213f7;
    padding: 0.4rem 0.2rem;
    min-height: 4rem;
}

.library-list-item-product-active {
    background: #2f3337
}

.library-list-item-product-icon {
    height: 36px;
    width: 36px;
    margin-right: 0.3rem;
}

.library-list-item-product-icon-img {
    font-size: 11pt;
    height: 36px;
    width: 36px;
    padding: 0.05rem;
}

.library-list-item-product-title {
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 11pt;
    position: absolute;
    width: 100%;
    text-align: left;
    padding-left: 43px;
    padding-right: 0.5rem;
}


.library-list-item-product-title2 {
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 11pt;
    position: absolute;
    width: 100%;
    text-align: left;
    padding-left: 10px;
    padding-right: 0.5rem;
}

.library-btn-item-product-title {
    overflow: hidden;
}

    .library-btn-item-product-title:hover {
        box-shadow: -100px 0px 80px 0px rgba(131, 131, 132, 0.82);
        background-color: #3636370d;
    }

.project-main-content {
    overflow-x: hidden
}



.carousel-indicators [data-bs-target] {
    width: 100px;
    opacity: 0.6;
    background: none;
}

    .carousel-indicators [data-bs-target] > img:active {
        width: 100px;
        background: none;
        box-shadow: rgba(42, 49, 40, 0.94) 5px 4px 15px;
    }





.carousel-indicators .active {
    opacity: 1;
}


    .carousel-indicators .active > img {
        opacity: 1;
        border: 4px solid #622626
    }


.bq-filter-overlay-screenshoot {
    width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 0;
    background: linear-gradient(180deg, #2b2b2b1c 60%, #1b1f22 97%);
}


.c-indicators {
    height: 60px;
    object-fit: cover;
    object-position: center;
    border: 2px solid #1b1f22;
}



.carousel-control-custom-l {
    text-align: left;
    background: #c43c3c !important;
    height: 45px !important;
    width: 45px !important;
    border-radius: 5rem;
    margin-top: 1rem;
    margin-right: -1.3rem !important;
    position: relative !important;
    padding: 0px !important;
    border: 0px !important;
    text-indent: 0px !important;
    font-size: 23pt;
}


.carousel-control-custom-r {
    text-align: left;
    background: #c43c3c !important;
    height: 45px !important;
    width: 45px !important;
    border-radius: 5rem;
    margin-top: 1rem;
    margin-left: -1.3rem !important;
    position: relative !important;
    padding: 0px !important;
    border: 0px !important;
    text-indent: 0px !important;
    font-size: 23pt;
}

.info-carousel {
    font-size: 14pt;
    font-weight: lighter;
    text-transform: uppercase;
    color: #fff;
    padding: 0rem 2rem;
}

.icon-scr-arrow {
    margin-top: 0.4rem;
}

.comments-panel-edit {
    color: #cecece;
    background: linear-gradient(150deg, #292d31 -0%, #09090b 99%);
    height: 100%;
}

.h-80px {
    max-height: 82px !important;
}

.library-img-poster {
    width: 100%;
    border-radius: 1rem;
    margin: 1.3rem 1rem;
}

.library-poster-header {
    height: 220px;
    width: 100%;
    object-fit: cover;
    object-position: center;
    overflow: hidden
}

.library-img-poster-header {
    width: 100%;
    object-fit: cover;
    object-position: center;
}







.library-lang-tab-sys {
    width: 83px;
    font-size: 10pt;
}

.tab-btn-main:disabled {
    color: #3e3e3e !important;
    font-weight: 600 !important;
}

.library-socialmedia {
    background: #f7f7f708;
    border-radius: 0.5rem;
    padding: 1.25rem 1.45rem;
    color: aliceblue;
}

.library-carousel {
    position: relative;
    border-radius: 1rem;
    overflow: hidden;
}

.icon-item-library {
    font-size: 18pt;
    text-align: center;
    position: relative;
    align-content: center;
    align-items: center;
    align-self: center;
    display: inherit;
}

.library-item-main-header {
    padding: 0rem 1rem;
    min-width: 200px;
}

.library-item-main-header-title {
    font-size: 11pt;
    margin: 0rem;
    margin-top: 0rem;
    margin-left: 0rem;
    margin-top: -0.2rem;
}

.tab-btn-main {
    background: #e9ecef00 !important;
    padding: 0.5rem 1.3rem;
    margin-right: 0.7rem;
    height: 3rem;
}





.wen-discount-main-price-1 {
    background: #e83232;
    padding: 3px 7px;
    position: absolute;
    margin-top: -25px;
    margin-right: 8px;
    border-radius: 0.5rem;
    font-size: 16pt;
    font-weight: 600;
    top: 0rem;
    right: 0;
    text-align: center;
}






.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff !important;
    background-color: #1f2125 !important;
    border-color: #1861ac;
}


.nav-pills .lib-nav-btn.active, .nav-pills .show > .nav-link {
    color: #fff !important;
    background-color: #1b1f21 !important;
    border-color: #1861ac;
}



.btn-check:focus + .btn, .btn:focus {
    box-shadow: 0 0 0 .25rem rgba(66, 70, 73, 0)
}


.btn-check:active + .btn-dark:focus, .btn-check:checked + .btn-dark:focus, .btn-dark.active:focus, .btn-dark:active:focus, .show > .btn-dark.dropdown-toggle:focus {
    box-shadow: 0 0 0 0rem rgba(66,70,73,.5);
}


/*
* {
    -webkit-transition: linear 2s;
    transition: linear 2s;
    -webkit-transition: all 0.2s linear;
}

    *:hover {
        -webkit-transition: linear 2s;
        transition: linear 2s;
        -webkit-transition: all 0.2s linear;
    }
    */



.sidebar-library-page {
    border-radius: 0.5rem;
    min-width: 260px;
    background: rgba(222, 222, 222, 0);
    position: sticky;
    z-index: 2;
    top: 0;
    right: 0;
    overflow: hidden;
    position: relative
}

.sidebar-lib-bar {
    min-width: 400px;
}

.library-button-buy {
    background-color: #e33333 !important;
    text-transform: uppercase;
}

    .library-button-buy:hover {
        background: #b33e3e !important
    }


    .library-button-buy:disabled {
        background: #4a4a4a !important;
        color: #8c8c8c;
    }

.library-lang-color-x {
    color: #4a4a4a;
}


.library-tab-item-usercontrol {
    background: #222629;
    border-radius: 0.5rem;
    padding: 0.25rem 0.45rem;
    overflow: hidden;
    word-wrap: break-word;
}

.library-tab-item-1 {
    background: #222629;
    border-radius: 0.5rem;
    padding: 0.35rem 0.45rem;
    color: aliceblue;
    overflow: hidden;
    word-wrap: break-word;
}


.library-tab-menu {
    border-radius: 0.5rem !important;
    border: 0px !important;
    text-align: center;
    padding: 0.6rem !important;
    margin: 0.2rem;
    margin-bottom: 0.4rem;
    background: #16191a !important;
    border: 2px solid #ffffff0f !important;
}

    .library-tab-menu:hover {
        background: #1f2425 !important;
        border: 2px solid #ffffff2e !important;
    }

.nav-link::before, .nav-link::before, .nav-link:active, .nav-link:focus {
    color: #e9ecef;
}

.px5-imp {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
}


.library-tab-menu:active, .library-tab-menu:active {
    color: #483e3e;
    background: #fff !important;
}


.library-tab-menu-icon-2 {
    height: 30px;
    width: 30px;
}



.library-tab-menu-icon {
    height: 30px;
    width: 30px;
}

.library-product-avatar-user {
    position: relative;
    margin: 0px;
    object-fit: cover;
    height: 40px;
    width: 40px;
}

.library-product-avatar-user-art {
    position: relative;
    margin: 0px;
    object-fit: cover;
    height: 100px;
    width: 100px;
}

.library-product-avatar-subuser-art {
    position: relative;
    margin: 0px;
    object-fit: cover;
    height: 40px;
    width: 40px;
}



.library-menu-items {
    overflow-y: auto !important;
    overflow-x: hidden;
}

.lib-logo-product-header {
    position: absolute;
    bottom: 0;
    text-align: center;
    margin: 0 auto;
    object-fit: cover;
    object-position: center;
    height: 14rem;
    display: flex;
    align-self: center;
    top: 4rem;
    z-index: -1;
}



.library-discount-block-price {
    margin-top: -5.2rem;
    position: absolute;
    background: #e83232;
    padding: 5px 10px;
    margin-right: 8px;
    border-radius: 0.5rem 0rem 0rem 0.5rem;
    font-weight: 400;
    margin-left: -4.5rem;
    font-size: 12pt;
    z-index: 1;
}


.library-strike-price {
    margin-top: -5.2rem;
    position: absolute;
    font-size: 11pt;
    color: #919191;
    text-align: end;
    margin-left: 2.3rem;
    background: #131313;
    padding: 0.36rem;
    padding-left: 0.4rem;
    border-radius: 0.4rem;
    padding-left: 1.4rem;
}


.library-price-free {
    font-weight: normal;
    text-transform: uppercase;
    font-size: 14pt;
    color: #8eaa41;
}

.library-nav-price {
    font-size: 22pt;
    font-weight: 500;
    line-height: normal;
    min-width: 160px;
}


.lib-tab-content {
    min-height: 160px;
}


.library-tab-menu .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    background: #efefef !important;
    color: black !important;
}

.library-nav-tabs {
    border: 0px !important
}


.lib-nav-mini-menu {
    background: rgb(18, 17, 17);
    border-right: 1px solid #383e407d;
}


.lib-nav-mini-menu-new {
    background: rgb(18, 17, 17);
    border-right: 1px solid #383e407d;
    padding: 1.1rem;
    min-width: 140px;
    background: linear-gradient(90deg, #181a1d 20%, #090909 99%) !important;
}

.lib-nav-mini-menu-link {
    background: #262a2e !important;
    margin: 0.2rem;
    text-align: center;
    padding: 0.8rem 1rem;
}

.h-600imp {
    height: 600px !important;
}



.lib-nav-mini-menu-link:hover {
    background: #1d1f1e !important;
    background: linear-gradient(150deg, #323642 -0%, #090909 99%) !important;
}

.lib-nav-mini-menu-link-notp {
    background: #262a2e00 !important;
    margin: 0.2rem;
    text-align: center;
    padding: 0.8rem 1rem;
    min-width: 117px;
    background: linear-gradient(150deg, #1c1d20 -0%, #090909 99%) !important;
}



.lib-product-item-mini-active {
    box-shadow: 0px 21px 130px -50px rgb(76, 48, 148);
    border: 4px solid #8685a3;
}




.lib-nav-mini-menu-link:disabled {
    color: #4d4d4d;
    background: #ffffff03 !important
}


.text-light-ipm {
    color: #fff !important
}


.lib-menu-sidebar-main {
    min-width: 24rem;
}


.lib-navbar-veritcal {
    background: #171a1c;
    top: 0px;
    z-index: 0;
    width: 100%;
    position: relative;
    overflow: hidden;
}

.lib-nav-price-free {
    border: 2px dotted #8eaa41 !important;
}


.lib-main-panel {
    min-height: 55rem;
}

.lib-nav-pills {
    padding: 1.2rem;
    background: #1b1f22;
    position: relative;
    z-index: 1;
    border-bottom: 1px solid #22272b;
}

.lib-subpanel-product {
    background: #1b1f22;
    padding: 1.0rem;
    width: 100%;
}

.lib-subpanel-product-art {
    background: #0f0f0f;
    width: 100%;
    background: linear-gradient(150deg, #1d2024 0%, #0f0f0f80 99%);
    overflow: hidden;
}

.lib-authorized {
    height: 500px;
    margin-top: 20rem;
}

.lib-content {
    background: #161618;
    overflow-x: auto; /* 👈 добавляем */
}



#art-scroll-panel {
    position: relative;
    flex-direction: column;
    min-width: calc(5% - 2px);
    right: 0px !important;
    top: 0px;
    min-width: 300px;
}

#artworkspage {
}

@media (max-width: 768px) { /* Замените 'md' на конкретное значение, например 768px */
    #artworkspage, #art-scroll-panel {
        position: relative;
    }
}

@media (min-width: 1268px) { /* Замените 'md' на конкретное значение, например 768px */
    #art-scroll-panel {
        max-width: 430px;
    }
}

.nav-link-userpage {
    background: #151515;
}




.nav-pills .nav-link-userpage.active, .nav-pills .show > .nav-link {
    color: #000 !important;
    background-color: #fff !important;
    border-color: #fff0 !important;
}




.lib-item-file {
    font-size: 18pt;
    min-width: 3.3rem;
    font-weight: 300;
    color: #7d7d7d
}

.lib-item-file-b {
    min-width: 3.3rem;
    font-weight: 300;
    color: #7d7d7d
}

.lib-item-file-bytes {
    font-size: 18pt;
    min-width: 5rem;
    font-weight: 300;
    text-align: center;
}

.lib-item-file-info {
    font-size: 11pt;
}

.lib-item-file-h2 {
    color: #4ecaa7;
    font-weight: 600 !important;
}


.lib-item-file-icon {
    font-size: 2.4rem;
}


.lib-tag-file {
    position: absolute;
    top: 0;
    margin-top: -0.9rem;
    background: #a62d33;
    padding: 0.3rem 1rem;
    border-radius: 0.5rem;
    font-size: 10pt;
    font-weight: 600;
    right: 0;
    margin-right: 1rem;
}

.lib-tag-file-2 {
    position: relative;
    margin-top: 0.2rem;
    padding: 0.4rem 0.9rem;
    border-radius: 0.5rem;
    font-size: 10pt;
    font-weight: initial;
    color: #6f8080;
    margin-right: 10px;
    border: 1px #313539;
    border-style: dashed;
    text-align: center !important;
}






.lib-tag-file-4 {
    position: relative;
    margin-top: 0.2rem;
    padding: 0.4rem 0.9rem;
    border-radius: 0.5rem;
    font-size: 10pt;
    font-weight: initial;
    color: #6f8080;
    margin-right: 10px;
    text-align: center !important;
}



.lib-tag-file-warning {
    color: #d37d20 !important;
    border-color: #d37d20 !important;
}





.lib-min-w5 {
    min-width: 5rem;
}


.lib-size-file {
    color: #ff3b3b;
    border-color: #df2929;
    font-weight: 600;
}

.lib-orig-name-file {
    color: #998f70;
    border-color: #fff0;
}


 



/* контейнер и подсветка выбранного диапазона */
.dual-range {
    --track-h: 6px;
    --thumb: 16px;
    --bg: #dee2e6; /* фон трека */
    --fill: #ff4d4f; /* выбранный диапазон */
    position: relative;
    height: 2rem;
    display: block;
}

    /* подсветка: используем псевдоэлемент с CSS-переменными --min%, --max% */
    .dual-range::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: calc(50% - var(--track-h)/2);
        height: var(--track-h);
        border-radius: var(--track-h);
        background: linear-gradient(to right, var(--bg) 0 calc(var(--min) * 1%), var(--fill) calc(var(--min) * 1%) calc(var(--max) * 1%), var(--bg) calc(var(--max) * 1%) 100%);
    }

    /* два слайдера поверх, прозрачный трек, только ручки активны */
    .dual-range .dual {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        width: 100%;
        background: none;
        pointer-events: none; /* трек недоступен... */
        -webkit-appearance: none;
        appearance: none;
        height: 2rem;
        margin: 0;
    }

        .dual-range .dual::-webkit-slider-runnable-track {
            height: var(--track-h);
            background: transparent;
        }

        .dual-range .dual::-moz-range-track {
            height: var(--track-h);
            background: transparent;
        }

        /* ручки */
        .dual-range .dual::-webkit-slider-thumb {
            -webkit-appearance: none;
            appearance: none;
            width: var(--thumb);
            height: var(--thumb);
            border-radius: 50%;
            background: #ff4d4f;
            box-shadow: 0 0 0 2px #fff;
            cursor: pointer;
            pointer-events: auto; /* ...но ручки кликабельны */
        }

        .dual-range .dual::-moz-range-thumb {
            width: var(--thumb);
            height: var(--thumb);
            border: 2px solid #fff;
            border-radius: 50%;
            background: #ff4d4f;
            cursor: pointer;
            pointer-events: auto;
        }

        /* чтобы при перекрытии верхняя ручка была поверх */
        .dual-range .dual.min {
            z-index: 2;
        }

        .dual-range .dual.max {
            z-index: 3;
        }
    .dual-range::before {
        transition: background 180ms ease;
    }
/* мягкая перекраска заполнения */
.price-outputs-fade {
    transition: opacity .18s ease;
}

    .price-outputs-fade.is-hidden {
        opacity: 0;
    }

#priceSlider::before {
    transition: background 180ms ease;
}



.lib-creator-item-sidebar {
    height: 130px;
}

.lib-creator-item {
    height: 60px;
}

.lib-creator-item-img {
    height: 60px;
}



.lib-creator-item-icon {
    margin: 0.3rem 0.2rem;
}

.lib-creator-item-icon-v2 {
    width: 73px;
}


.lib-moderator-border {
    border: 1px solid #abaeb71c;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-radius: 0.5rem;
    border-style: dashed;
}




.lib-creator-item-icon-img {
    font-size: 11pt;
    height: 46px;
    width: 46px;
    padding: 0.1rem;
    opacity: 0.2
}

.lib-creator-item-icon-img-2 {
    font-size: 11pt;
    height: 46px;
    width: 46px;
    padding: 0.1rem;
    opacity: 1
}

.lib-creator-item-icon-img-v3 {
    font-size: 11pt;
    height: 55px;
    width: 55px;
    padding: 0rem;
    opacity: 1;
    margin: 0px !important;
}

.lib-creator-item-title {
    font-size: 12pt;
    position: absolute;
    width: 100%;
    text-align: left;
    padding-left: 70px;
    padding-right: 0.5rem;
    font-weight: normal;
    font-weight: 600;
}


.lib-creator-mini-icon {
    font-size: 20pt !important;
}



.lib-creator-title-info {
    font-size: 10pt;
    font-weight: initial;
    color: #454b51 !important;
    text-align: left
}

.lib-creator-title-type {
    font-size: 10pt;
    font-weight: initial;
    color: #566969 !important;
    text-align: left
}


.font-14 {
    font-size: 14pt;
}

.font-16 {
    font-size: 16pt;
}

.font-25 {
    font-size: 25pt;
}

.library-creator-list-items {
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-top: 3px;
    padding: 0rem;
    color: #cecece;
    background: #212529;
    background: linear-gradient(150deg, #292d31 -0%, #09090b 99%);
    flex-wrap: wrap;
    border-radius: 0.5rem
}

.exclusive-product {
    background: #993030;
    padding: 1.5rem;
    border-radius: 1rem;
}

.exclusive-product-off {
    padding: 1.5rem;
    border-radius: 1rem;
    background: linear-gradient(150deg, #2d3136 -0%, #1a1a1c 99%);
    color: #979797;
}

.cart-exclusive-product-info {
    color: #df9029 !important;
    font-size: 10pt;
    font-weight: 600 !important;
    text-transform: uppercase;
}

.library-creator-list-items-del {
    background: #292121 !important;
}

.library-creator-list-items-success {
    background: #212c1d
}

.library-creator-list-items-warning {
    background: #322d1c
}

.library-creator-list-items-last {
    background: #391315
}




.library-creator-list-link {
    padding: 1rem;
    font-size: 12pt;
    font-weight: 600;
    border: 3px dashed #6b7a27;
}

    .library-creator-list-link:hover {
        padding: 1rem;
        font-size: 12pt;
        font-weight: 600;
        border: 3px dashed #96ab39;
        background: linear-gradient(150deg, #30342f -0%, #09090b 99%);
    }

.lib-disable-product {
    color: #fefefe;
    font-size: 16pt;
}




.lib-list-group {
    border: 0px !important;
    border-radius: 0.4rem !important;
    background-color: #212529;
    padding: 2.5rem 2.5rem 2.5rem 2.5rem;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    min-height: 70px;
    overflow: hidden;
    text-align: center;
    color: #bfc0c0;
}


.lib-list-btn {
    background: #939b9b14;
    border-radius: 0.4rem;
    min-width: 3rem;
}



.lib-listdown-creator {
    background-color: #171717 !important;
    color: white;
    border-color: #fff0;
    border: 2px solid #28212100 !important;
}


    .lib-listdown-creator:focus {
        box-shadow: 0px 0px 6px 0.1rem rgba(253, 227, 13, 0.25) !important;
        border: 2px solid #6dbb1f !important;
    }



.custom-file-upload {
    display: inline-block;
    padding: 1.3rem;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #66666685;
}


    .custom-file-upload:hover {
        background: #6660
    }




.lib-file-checked-viruses-success {
    padding: 0.4rem;
    border-radius: 0.6rem;
    color: #83ffb9;
    margin: 0.5rem;
    position: relative;
    justify-content: center;
}

.lib-file-checked-viruses-inProcess {
    padding: 0.4rem;
    border-radius: 0.6rem;
    color: #646464;
    margin: 0.5rem;
    position: relative;
    justify-content: center;
}

.lib-file-checked-viruses-dangerous {
    border-radius: 0.6rem;
    color: #ff1717;
    margin: 0.2rem;
    position: relative;
    justify-content: center;
}





.lib-file-checked-banned-false {
    border-radius: 0.6rem;
    color: #5e5e5e;
    margin: 0.2rem;
    position: relative;
    justify-content: center;
}



.box-shadow-glow-white {
    box-shadow: 0px -20px 70px rgb(58, 65, 71) !important;
    border-radius: 1rem;
    border: 2px solid #1d1d1d;
    background: linear-gradient(180deg, #0f0f0f 1%, #23272b 98%);
}

.modal {
    background: #0f0f0f78;
}





.lib-panel-color1 {
    background: #212529;
    padding: 1.5rem;
    border-radius: 1rem;
}

.lib-file-checked-banned-true {
    padding: 0.4rem;
    border-radius: 0.6rem;
    color: #ff1717;
    margin: 0.5rem;
    position: relative;
    justify-content: center;
}



.lib-item-rules-product {
    background: #973232;
    border-radius: 0.6rem;
    padding: 1rem;
    padding-left: 1rem;
    padding-left: 2rem;
    margin-top: 1rem
}




.lib-form-upload {
    height: 250px;
    width: 250px;
    overflow: hidden;
}

.h-150px {
    height: 150px;
}

.h-180px {
    height: 180px;
    width: 180px;
}

.h-180x325px {
    height: 180px;
    width: 325px;
}



.font-40 {
    font-size: 40pt;
}

.font-50 {
    font-size: 50pt;
}

.lib-upload-img-poster-1 {
    width: 300px !important;
    height: 300px !important;
    border-radius: 1rem !important;
    overflow: hidden;
    box-shadow: 0px 0px 6px 0.1rem rgba(27, 27, 30, 0.56) !important;
}



.lib-upload-img-2 {
    border-radius: 1rem !important;
    overflow: hidden;
    box-shadow: 0px 0px 6px 0.1rem rgba(27, 27, 30, 0.56) !important;
}

.lib-upload-border {
    font-size: 4rem;
    border: 0.2rem;
    border-color: #7b7b7bbd;
    border-style: dashed;
    border-radius: 1rem;
    opacity: 1
}

    .lib-upload-border:hover {
        opacity: 0.2
    }

.preview-product-img {
    border-radius: 5px;
    width: 100%;
    object-fit: cover;
}

.preview-product-icon-img {
    border-radius: 5px;
    width: 100%;
    object-fit: cover;
}



.lib-p-img-1 {
    min-height: 85px;
}


.lib-creator-tags {
    background: #191d20;
    padding: 0.2rem 0.8rem;
}




input[type="checkbox"] {
    -webkit-appearance: none;
    appearance: none;
    background-color: #171717;
    margin: 0;
    margin-left: 0px;
    font: inherit;
    font-family: inherit;
    color: #fff;
    width: 1.15em;
    height: 1.15em;
    border: 0.13em solid #1b0c0c;
    border-top-color: rgb(55, 55, 55);
    border-right-color: rgb(55, 55, 55);
    border-bottom-color: rgb(55, 55, 55);
    border-left-color: rgb(55, 55, 55);
    border-radius: 0.15em;
    place-content: center;
}




    input[type="checkbox"]:focus {
        outline: max(0px, 0em) solid green;
    }

    input[type="checkbox"]:disabled {
        color: red;
        cursor: not-allowed;
    }



.form-check-input:focus {
    border-color: #494d53;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(1, 4, 9, 0);
}


.form-check-input:checked {
    background-color: #1d202a;
    border-color: #838080;
}


.form-check-input {
    width: 1em;
    height: 1em;
    margin-top: .25em;
    vertical-align: top;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    border: 1px solid rgba(0, 0, 0, 0.91);
    border-top-color: rgba(0, 0, 0, 0.91);
    border-right-color: rgba(0, 0, 0, 0.91);
    border-bottom-color: rgba(0, 0, 0, 0.91);
    border-left-color: rgba(0, 0, 0, 0.91);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-print-color-adjust: exact;
    color-adjust: exact;
}

    .form-check-input[type="checkbox"] {
        border-radius: 0.25em;
        height: 22px !important;
        width: 22px !important;
    }







.lib-nav-btn-creator {
    height: 80px;
    text-align: center;
    font-size: 13pt;
}


.lib-nav-font-h6 {
    font-size: 11.3pt
}


.lib-form-control-color {
    color: #7d878f;
    background-color: #212529;
}

/*sdddddddddddddddddddddddddddddddddddddddddd overlay modal*/
.modal-backdrop {
    display: none
}



.lib-modal {
    color: #fff;
    padding-top: 2rem;
}


.lib-modal-content {
    background-color: #1d2124;
    border-radius: 1rem;
}


.lib-modal-content-border {
    border-radius: 1rem;
}

.lib-modal-dialog {
    border: 0px solid #3aeca1;
}


.lib-modal-overlay {
    background-color: #1d2124c2;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}



.modal-header {
    border-bottom: 1px solid #383b3e;
}

.modal-footer {
    border-top: 1px solid #383b3e;
}



.btn-close {
    color: #000;
    background: #bbb url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath 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 auto no-repeat;
    opacity: 1;
}

    .btn-close:hover {
        opacity: 1;
        background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath 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 auto no-repeat;
    }



.reg-poster-start {
    background: url(/images/main/login-cover4.jpg);
    background-size: cover;
    background-position: center;
    min-height: 900px;
    height: 100%;
    width: 100%
}

.login-poster-start {
    background: url(/images/main/login-cover5.jpg);
    background-size: cover;
    background-position: center;
    height: 900px;
    width: 100%
}


.panel-identity {
    overflow: hidden;
    border-radius: 1.5rem;
    max-width: 1100px;
    min-height: 790px;
}

.main-category-overlay {
    background: linear-gradient(180deg, #0f0f0fab 7%, #3e5352d9 150%);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    z-index: 3;
    /* Эта строка задаёт переход градиента */
    transition: background 2s ease-in-out;
    transition: all .4s ease-in-out;
}

    .main-category-overlay:hover {
        background: linear-gradient(180deg, #242424ab 7%, #3e535287 150%);
        position: absolute;
        bottom: 0;
        top: 0;
        left: 0;
        right: 0;
        z-index: 3;
    }

.main-category {
    background: rgba(62, 74, 81, 0.24);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
}

    .main-category:hover {
        background: rgba(62, 74, 81, 0);
    }

.lib-bundle-item-count {
    display: flex;
    height: 100%;
    font-size: 14pt;
    text-align: center;
    margin: 0px !important;
    font-weight: 600
}



.lib-list-bundles-products {
    background: #212529;
    padding: 1rem !important;
    margin: 0px;
    margin-top: 3px;
}


.lib-bundles-product-li {
    background: #70865b;
    padding: 0.2rem 0.4rem;
    border-radius: 0.3rem;
    color: #184012;
    margin: 6px 6px 0px 0px !important;
    font-size: 9pt;
}


.lib-creator-item-info {
    height: 46px;
    width: 60px;
    margin-right: 0.3rem;
    font-size: 14pt;
}

.font-12 {
    font-size: 12pt;
}


.font-11 {
    font-size: 11pt;
}

.font-10 {
    font-size: 10pt !important;
}

.font-9 {
    font-size: 9pt;
}

.font-17 {
    font-size: 18pt;
}

.font-18 {
    font-size: 18pt;
}

.font-20 {
    font-size: 20pt;
}

.font-27 {
    font-size: 27pt;
}



.lib-bundles-items-product-list {
    background: #292d31;
    color: white;
    border-radius: 0.5rem;
    border: 1px solid #828282;
    border-style: dashed;
}


.lib-bundles-items-product-list-disable {
    color: #d75656;
    border-color: #d93d3d;
    background: #2f2121;
}


.lib-message-popup1 {
    background: #712b2b;
    padding: 1rem;
    border-radius: 0.5rem;
    color: azure;
}



.lib-creator-item-orderinfo {
    height: 46px;
    width: 157px;
    margin-right: 0.3rem;
    font-size: 14pt;
}


.lib-colorbq-red {
    background: #b53333
}

.lib-colorbq-green {
    background: #7f8c3f
}


.lib-dark-color1 {
    background: #1d2124
}


.lib-icon-xv {
    width: 30px;
    text-align: center;
    padding: 0px 5px 0px 5px;
}




.lib-bundle-footer {
    z-index: 3;
    margin-top: 2rem !important;
}

.lib-bundle-author {
    background: #171717;
    padding: 1rem 1rem;
    border-radius: 0.6rem;
    font-weight: 600
}



.lib-bundle-list-product {
    max-width: 730px;
}




.tag-video {
    background: #35383c;
    font-size: 10pt;
    border-radius: 0.4rem;
    color: #fff;
    padding: 0.4rem 0.6rem;
    line-height: normal;
    min-width: 600px;
}






















/* use reverse flexbox to take advantage of flex-direction: reverse */
.rating-area {
    overflow: hidden;
    width: 220px;
    margin-top: 1rem;
}

    .rating-area:not(:checked) > input {
        display: none;
    }

    .rating-area:not(:checked) > label {
        float: right;
        width: 42px;
        padding: 0;
        cursor: pointer;
        font-size: 21pt;
        line-height: 32px;
        color: lightgrey;
        text-shadow: 1px 1px #bbb;
    }

        .rating-area:not(:checked) > label:before {
            content: '★';
        }

    .rating-area > input:checked ~ label {
        color: gold;
        text-shadow: 1px 1px #c60;
    }

    .rating-area:not(:checked) > label:hover,
    .rating-area:not(:checked) > label:hover ~ label {
        color: gold;
    }

    .rating-area > input:checked + label:hover,
    .rating-area > input:checked + label:hover ~ label,
    .rating-area > input:checked ~ label:hover,
    .rating-area > input:checked ~ label:hover ~ label,
    .rating-area > label:hover ~ input:checked ~ label {
        color: gold;
        text-shadow: 1px 1px goldenrod;
    }

.rate-area > label:active {
    position: relative;
}




.rating-result {
    margin: 0 auto;
}

    .rating-result span {
        padding: 0;
        font-size: 18pt;
        margin: 0 3px;
        line-height: 1;
        color: lightgrey;
        text-shadow: 1px 1px #bbb;
    }

    .rating-result > span:before {
        content: '★';
    }

    .rating-result > span.active {
        color: gold;
        text-shadow: 1px 1px #c60;
    }











.lib-review-comment {
    background: #403a68;
    padding: 1rem;
    border-radius: 0.5rem;
    color: azure;
}


.disabled-star-oud > label {
    width: 23px;
    height: 16px;
    font-family: Arial;
    font-size: 17pt;
    transition: 0.2s ease;
    color: #777 !important
}



.lib-review-product-form {
    background: #f7f7f708;
    border-radius: 0.5rem;
    padding: 1.2rem !important;
    position: relative;
}


.lib-comment-form {
    background: #f7f7f708;
    border-radius: 0.5rem;
    padding: 0.5rem !important;
    position: relative;
}

.lib-userchat-form {
    border-radius: 0.5rem;
    position: relative;
}

.lib-review-avatar-user {
    height: 44px;
    width: 44px;
}

.del-btn-comment {
    position: absolute;
    right: 0;
    top: 0;
    margin: 0.5rem;
}



.main-footer-bq {
    background: url('/images/bqfooter.jpg');
    background-size: cover;
}



.lib-header-design-page {
    position: relative;
    height: 400px;
    object-fit: cover;
    object-position: center;
    width: 100%;
    background: url(../vvv.png);
    background-size: auto;
    background-size: 10%;
    overflow: hidden;
}

    .lib-header-design-page > img {
        position: absolute;
        object-fit: cover;
        height: 100%;
        object-position: center;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
    }


.lib-header-design-page-user {
    position: relative;
    height: 400px;
    object-fit: cover;
    object-position: center;
    width: 100%;
    background: url(../vvv.png);
    background-size: auto;
    background-size: 10%;
    overflow: hidden;
}




.lib-cart-cover-product {
    height: 33px;
    width: 33px
}


.lib-nav-tabs {
    border-bottom: 0px;
}

.border-radius-05 {
    border-radius: 0.5rem;
}


.lib-btn-product-tab {
    background: #151515 !important;
    padding: 0.7rem 1rem;
}

    .lib-btn-product-tab:hover {
        background: #2b2b2b !important
    }


.lib-btn-product-tab2 {
    background: #3d3d3d !important;
    padding: 0.7rem 1rem;
}

    .lib-btn-product-tab2:hover {
        background: #2b2b2b !important
    }


.nav-pills .lib-btn-product-tab.active, .nav-pills .show > .nav-link {
    color: #fff !important;
    background-color: #b63b3b !important;
    border-color: #1861ac;
}


.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border: 0px #fff;
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link {
    border: 0px #fff;
}




.artwork-story-preview {
    position: relative;
    width: auto
}


.lib-bq-main-contet {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    z-index: 0;
}

.lib-bq-main-contet-overlay {
    background: rgba(27, 31, 34, 0.98);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
}



.lib-list-notification {
    background: #fff;
    color: #3f3e3e;
}



.lib-btn-violet {
    background-color: #5933e3 !important;
}

    .lib-btn-violet:hover {
        background-color: #7253e1 !important
    }


    .lib-btn-violet:disabled {
        background-color: #23272b !important;
    }
























.theme-color-bundle {
    background: #fff;
}

.theme-color-bundle-back {
    background: #ececec;
}

.theme-color-title {
    color: #474d5e
}

.theme-color-main-title {
    color: #474d5e
}



.section-block-1 {
    background: #f4f4f4 60%;
    background: #191c1e;
}

.section-block-2 {
    background: #f4f4f4 60%;
    background: #191c1e;
}


.nav-bar-main-menu {
    min-height: 74px;
}

.nav-bar-link-1 {
    color: #808a93 !important;
    font-weight: 500 !important;
}

    .nav-bar-link-1:hover {
        color: #757575
    }

.theme-nav-bar-button {
    border-radius: 0.5rem;
    padding: 0.7rem 1.3rem;
    font-weight: 400;
    font-size: calc(14 / 16 * 1rem);
}

    .theme-nav-bar-button:hover {
        background: #303538;
        border-radius: 0.5rem;
        padding: 0.7rem 1.3rem;
    }

.theme-shadow {
    box-shadow: 0 4px 15px rgba(0,0,0,.03)
}

.theme-nav-link-color-1 {
    color: #282424 !important
}










.main-category-cover-img {
    height: 100%;
    width: 100%
}







#skew-2 {
    transform: skew(3deg, -0deg);
}




.main-header-present {
    overflow: hidden;
    position: relative;
    bottom: 0px;
    z-index: 1;
}


.main-header-present-img {
    object-fit: cover;
    height: 100%;
    object-position: center;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.main-header-present-img-h {
    object-fit: cover;
    object-position: center;
    overflow: hidden;
    bottom: 0;
    left: 0;
    right: 0;
}


.main-header-pr-slider-h {
    min-height: 750px;
}

.main-header-pr-slider-minh {
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    object-fit: cover;
    object-position: center;
    border-radius: 0px;
}


.main-header-slider-control-l {
    background: linear-gradient(90deg, rgba(12, 12, 19, 0.79) 0%, rgba(4, 4, 6, 0.69) 34%, rgba(0,212,255,0) 100%);
}

.main-header-slider-control-r {
    background: linear-gradient(280deg, rgb(12, 12, 19) 0%, rgb(4, 4, 6) 5%, rgba(0,0,0,0) 78%)
}


.screenshots-main-img {
    height: 96px;
    object-position: center;
    object-fit: cover;
    padding: 0.3rem;
    border: 0px !important;
    border-radius: 1.0rem;
    border-style: dashed;
    border-color: #ffffff0d;
}



.main-carousel-caption {
    position: relative;
    right: 0;
    bottom: 1.25rem;
    left: 0;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    color: #fff;
    text-align: center;
    margin-bottom: 5rem;
}




.lib-title-product-panel {
    background: #0f0f10;
    padding: 1rem;
}

.lib-title-product-panel-warning {
    background: #5b1d1d;
    padding: 1rem;
    color: #dfd9d9;
}


.lib-min-w80 {
    min-width: 80px;
}

.lib-min-w100 {
    min-width: 100px;
}

.lib-min-w120 {
    min-width: 120px;
}

.lib-min-w150 {
    min-width: 150px;
}

.lib-hr1 {
    background: #6f6f6f;
}




.accordion-item {
    background-color: #f7f7f708;
    border: 0px solid rgba(0,0,0,.125);
}



.lib-card-img {
    height: 300px;
    object-fit: cover;
    object-position: center;
}

.lib-card-mini-img {
    height: 140px;
    object-fit: cover;
    object-position: center;
}

.accordion-button:not(.collapsed) {
    color: #c2c2c2;
    background-color: #18191a;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
}




.accordion-button {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    padding: 1rem 1.25rem;
    font-size: 1rem;
    color: #bfbfbf;
    text-align: left;
    background-color: rgb(23, 27, 30);
    border: 0;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,border-radius .15s ease;
    background-color: rgba(47, 55, 57, 0.32);
}


.z-index-0 {
    z-index: 0
}

.col-x-card {
    max-width: 275px;
    margin-bottom: 0.4rem;
}

.col-card {
    margin: 0.2rem;
}

.col-x-card-games {
    max-width: 360px;
    height: 495px;
    margin-bottom: 0.4rem;
}

.col-card-games {
    max-width: 360px;
    height: 495px;
    margin: 0.2rem;
}

.lib-accordion-body {
    margin: 0px;
    padding: 0px
}


.lib-accordion-button {
    padding: 0.75rem 1rem;
    margin-top: 0.1rem;
    border-radius: 0.2rem;
    border: 0px
}



.accordion-button:not(.collapsed) {
    color: #c2c2c2;
    background-color: #0d0d0d;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
    outline: 0;
    border: 0px
}

.accordion-button:focus {
    z-index: 3;
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 .0rem rgba(13,110,253,.25);
    outline: 0;
    border: 0px
}

.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    transform: rotate(-180deg);
    color: white;
}


.lib-accordion-button-count {
    font-weight: 500;
    color: #606060;
    min-width: 48px;
    margin: 0px 0.1rem;
}


.lib-accordion-button-title {
    font-size: 11pt;
    color: #808a93 !important;
    font-weight: 600 !important;
}


.font-11 {
    font-size: 11pt
}



.login-overlay-cover {
    background: rgba(36, 35, 38, 0.82);
    position: absolute;
    bottom: 0;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1;
}


 

.lib-card-news {
    background: #0000
}



.lib-main-news-overlay-modal {
    background: rgba(7, 7, 7, 0.71);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    z-index: -1;
}






.glow-1 {
    box-shadow: 0px;
    transition: box-shadow 0.3s ease-in-out;
}

    .glow-1:hover {
        box-shadow: -0px 1px 20px -0px rgba(217, 217, 217, 0.05)
    }








.panel-download-file-main {
    font-weight: lighter;
    background: #f7f7f708;
    border-radius: 0.5rem;
    color: aliceblue;
    position: relative;
    padding: 0.9rem 0.9rem !important;
    border: 2px solid #0000 !important;
    max-width: 800px;
    min-width: 400px;
}

    .panel-download-file-main:hover {
        background: #1d222a;
        color: #f2f2f2;
        border: 2px solid #562da06b !important;
    }






.border-radius-0 {
    border-radius: 0rem
}


.lib-userpage-img {
    object-fit: cover;
    width: 100%;
}



.lib-company-logo-page {
    height: 160px;
    width: 160px;
    object-fit: cover;
    object-position: center;
    border-radius: 0.8rem 1.8rem;
    margin: 0.5rem;
    margin-left: 0.5rem;
    position: absolute;
    margin-left: -1rem;
}

.lib-company-logo-page-circle {
    height: 160px;
    width: 160px;
    object-fit: cover;
    object-position: center;
    border-radius: 10rem;
    margin: 0.5rem;
    margin-left: 0.5rem;
    position: absolute;
    margin-left: -1rem;
    border: 7px solid #070707;
}



.lib-userpage-header-company {
    background: rgb(19, 19, 19);
    border-radius: 1.5rem;
}


.w-background-container {
    position: absolute;
    height: 100%;
    width: 100%;
    overflow: hidden;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-size: cover;
    filter: blur(10px);
}


.lib-userpage-header-company-overlay {
    background: #010101a1;
    background: linear-gradient(-90deg, #0000 -20%, #000000ad 121%);
    border-radius: 1.5rem;
}

.lib-userpage-header-company-g {
    min-width: 579px;
    height: 9rem;
    margin-left: 5rem;
    margin-bottom: 1.5rem;
}

.lib-userpage-header-status {
    bottom: 0rem;
    left: 0;
    right: 0;
    z-index: 1;
}

.btn-subscribe {
    background: #bc2727 !important
}

.nav-account {
    height: 94px;
    align-items: center;
    display: flex;
    padding: 1.7rem;
}


.lib-product-card-top-platform {
    background: #1d1c1c;
    border-radius: 0.6rem;
    height: 2.5rem;
    width: 2.5rem;
    text-align: center;
    align-items: center;
    display: grid;
}

.section-subscribers {
    max-width: 1920px;
    margin: 0 auto;
    background: #0000 60%;
    min-height: 500px;
    height: 100vh;
}

.footer-menu-subscribe {
    padding: 0.6rem 1rem;
    margin: 0.2rem;
}

.lib-userpage-subscribers {
    position: relative
}

.btn-check:focus + .btn-primary, .btn-primary:focus {
    color: #fff;
    background-color: #a42727;
    border-color: #0a58ca;
    box-shadow: 0 0 0 .25rem rgba(49,132,253,.5);
}

.lib-userpage-subscribers-avatar {
    height: 70px;
    width: 70px;
}


.lib-userpage-panel {
    background: #e2e2e2;
    padding: 1rem;
    width: 140px;
    text-align: center;
    align-items: center;
    display: flex;
    border-radius: 1.5rem;
    position: relative;
    display: block;
}

    .lib-userpage-panel:hover {
        background: rgb(255, 255, 255)
    }


.lib-item-title-panel {
    padding-right: 4px;
    display: grid !important;
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-top: 1px;
    position: absolute;
    left: 4.5rem;
}

.lib-item-title-panel-2v {
    padding-right: 4px;
    display: grid !important;
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    margin-top: -3px;
    margin-left: 1.5rem;
}



.lib-product-flicker {
    border: 0px #ff8519 solid;
    animation: flicker 1s;
    animation-iteration-count: 3;
}

@keyframes flicker {

    20% {
        border-color: #fff;
        border: 0.5px #ff8519 solid;
    }

    50% {
        border-color: #fff;
        border: 1px #ff8519 solid;
    }
}


.lib-download-disable {
    opacity: 0.5;
    text-decoration: none;
    cursor: not-allowed;
    pointer-events: none;
}

.lib-download-list-lb {
    max-width: 500px;
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border: 0px !important;
}




.lib-footer-overlay-decor1 {
    background: url('../images/element_decor1.png');
    background-repeat: repeat;
    z-index: 1;
    width: 100%;
    background-repeat: no-repeat;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-position: center;
    border-top: 1px solid #3b4e54;
    box-shadow: 0px 5px 40px -10px rgb(75, 94, 103);
}







.lib-filter-form-select {
    display: block;
    width: 100%;
    padding: .375rem 2.25rem .375rem .75rem;
    padding-right: 2.25rem;
    -moz-padding-start: calc(0.75rem - 3px);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #cacaca;
    border-color: none !important;
    background: rgba(5, 6, 6, 0.24) !important;
    background-repeat: no-repeat;
    background-position: right .75rem center;
    background-size: 16px 12px;
    border: 0px solid #ced4da1f;
    border-radius: 0.5rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
}

    .lib-filter-form-select > ::before {
        content: ">";
        font-size: 14px;
        display: none;
        background: red;
        border-radius: 0rem;
        color: #fff;
        border-color: none !important;
    }

    .lib-filter-form-select > option {
        font-size: 14px;
        padding: 0.6rem 0.9rem;
        border-radius: 0.5rem;
        margin: 0.3rem 0rem;
        background: #25292e;
        color: #bcbcbc;
        outline: none;
    }



        .lib-filter-form-select > option::before {
            content: ">";
            font-size: 14px;
            display: none;
            background: red;
            border-radius: 0rem;
            color: #fff;
            border-color: none !important;
        }


    .lib-filter-form-select:focus {
        border-color: none !important;
        outline: 0;
        box-shadow: 0 0 0 .0rem rgba(13,110,253,.25);
    }



.lib-button-select {
    background-color: #1c1f2259;
    color: #eaeaea;
    padding: 0.5rem 0.8rem;
    border: 0px solid #3e4144;
    font-weight: lighter;
    padding-left: 2.2rem;
    text-transform: capitalize;
}

.lib-button-select-group {
    background-color: #252525db;
    color: #eaeaea;
    padding: 0.5rem 0.8rem;
    border: 0px solid #3e4144;
    font-weight: 400;
    padding-left: 2.2rem;
    text-transform: capitalize;
    border-radius: 0.2rem;
    margin: 0.1rem;
    font-weight: 600;
    padding: 0.4rem;
}


.btn-check:active + .btn-secondary, .btn-check:checked + .btn-secondary, .btn-secondary.active, .btn-secondary:active, .show > .btn-secondary.dropdown-toggle {
    color: #fff;
    background-color: #6f2828bf;
    border-color: #51585e;
    border-radius: 0.4rem;
}

.lib-filter-icon-item {
    position: absolute;
    align-content: center;
    align-items: center;
    display: flex;
    height: 100%;
    margin-left: 1.2rem;
}


.footer-card-product-x {
    font-size: 15.5px;
    color: #fff;
    font-weight: 400;
    overflow: hidden;
    padding: 1rem;
    background: #07101100;
    border-radius: 0rem 0rem 1.5rem 1.5rem;
    text-align: start;
}

.footer-small-card-x {
    color: #5f5f5f;
    font-size: 10pt;
    margin-top: 0.2rem !important;
}

.footer-small-platforms-card-x {
    color: #5f5f5f;
    font-size: 14.5px;
}




.list-products-main {
    background: #14171a;
    text-transform: initial;
    color: #fff;
}

    .list-products-main:hover {
        background: #0a0d0f;
        color: #fff !important;
    }

.list-products-main-img {
    width: 46px;
}



.list-cart-mini-div {
    padding: 0.2rem;
    border-radius: 0.6rem;
}

.list-products-main-price {
    padding: 0.8rem 1.2rem !important;
    height: 49px;
    background: linear-gradient(560deg, rgba(8, 7, 7, 0.89) 100%, rgba(176, 42, 42, 0) 100%);
    border-radius: 1.9rem 0px 0.5rem 0px !important;
}


.list-products-main-bundle-header {
    background: #101213;
    text-transform: initial;
    color: #fff;
}

.discount-main-price-1 {
    background: #e83232;
    padding: 3px 7px;
    position: absolute;
    margin-top: -22px;
    margin-right: 8px;
    border-radius: 0.5rem;
    font-weight: 600;
    top: 0rem;
    right: 0;
    text-align: center;
}


.pa-1r {
    padding: 0.6rem;
}

.pl-imp-0 {
    padding-left: 0
}


.lib-line-old-price {
    color: #b0b0b0;
    font-weight: 600;
}



.style-custom-text {
    color: #fff
}





.lib-header-bundle {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: 250px;
}

.lib-header-bundle-img {
    position: relative;
    object-fit: cover;
    object-position: center;
}



.artproject-poster {
    height: 100px;
    width: 100px;
    object-fit: cover;
    object-position: center;
    border-radius: 0rem
}

.artproject-poster-180 {
    height: 190px;
    width: 190px;
    object-fit: cover;
    object-position: center;
    border-radius: 0rem
}


.artproject-poster-100 {
    height: 100px;
    width: 100px;
    object-fit: cover;
    object-position: center;
    border-radius: 0rem
}

.note-editor.note-airframe, .note-editor.note-frame {
    background: rgb(14, 13, 13) !important
}

.note-frame {
    color: #fff !important;
}

.note-toolbar {
    border-color: #1d2124 !important;
    background-color: #212026;
    border-bottom: 0px #fff solid;
}

.note-btn {
    display: inline-block;
    font-weight: 400;
    margin-bottom: 0;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    white-space: nowrap;
    outline: 0;
    color: #9d9d9d !important;
    background-color: #24232a;
    border: 1px solid #1d2124 !important;
    padding: 5px 10px;
    font-size: 14px;
    line-height: 1.4;
    border-radius: 3px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.note-dropdown-menu {
    background: #212026 !important;
    background-clip: border-box;
    border: 0px solid #393a4c !important;
    border-radius: 0.3rem;
}


.modal-artworks {
    background: rgb(27, 31, 34);
    color: #fff;
}

.art-project-preview {
    height: 200px;
    object-position: center;
    object-fit: cover;
    border: 2px;
    background-color: #212529;
    border-radius: 1.0rem;
    border-style: dashed;
    border-color: #ffffff0d;
}




.art-project-btn-tools {
    background-color: #e33333;
    font-size: 12pt;
    border-radius: 0.6rem;
    z-index: 4;
}


    .art-project-btn-tools:hover {
        background-color: #9fb537;
    }

#toast-container > div {
    position: relative;
    pointer-events: auto;
    overflow: hidden;
    margin: 0 0 6px;
    padding: 15px 15px 15px 50px;
    width: 300px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    background-position: 15px center;
    background-repeat: no-repeat;
    -moz-box-shadow: 0 0 12px #999;
    -webkit-box-shadow: 0 0 12px #999;
    box-shadow: 0 0 12px #9990;
    color: #FFF;
    opacity: .8;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    filter: alpha(opacity=80);
    border-radius: 0.5rem;
    font-weight: initial;
}


.overflow-x {
    overflow-x: hidden !important
}


.artwork-story {
    background: #131416bd;
    padding: 1.2rem;
    border-radius: 1rem;
    margin: 1rem 2rem;
}

.artwork-story-message {
    font-size: 14pt;
    color: #fff
}

#wen-modal-media-art {
    background: linear-gradient(150deg, #1d2024 -0%, #0f0f0f66 99%);
    display: contents;
    box-sizing: content-box;
}

@media (max-width: 767px) {
    #wen-modal-media-art {
        height: auto; /* Adjust the height to be automatic or specify a new fixed height /
/ Other responsive styles as needed */
    }
}


.lib-sys-req {
    width: 100%;
    max-width: 600px;
}

.lib-productnews {
    max-width: 800px
}

.lib-additional-panel {
    max-width: 300px
}



.z-index-1 {
    z-index: 1
}

.z-index-9999 {
    z-index: 9999
}


.font-13 {
    font-size: 13pt
}

.font-13-imp {
    font-size: 13pt !important
}

.font-14-imp {
    font-size: 14pt !important
}

.resource-help-button {
    text-transform: capitalize;
    text-align: center !important;
    align-content: center;
    align-self: center;
    display: block !important;
    position: relative;
    background: #2b2e323d !important;
    border: 1px solid #55515166 !important;
}

.btn-resource-download {
    background: rgba(43, 46, 50, 0.24) !important;
    font-size: 24pt;
    padding: 0.5rem 1rem !important;
    color: white
}

    .btn-resource-download:hover {
        background: rgba(70, 74, 80, 0.24) !important
    }


.w-260 {
    width: 260px;
}

.artwork-title-t1 {
    color: #fff !important;
    font-weight: 500 !important;
}

.title-panel-top {
    color: #808a93 !important;
    font-weight: 500 !important;
}

.title-main-achievements {
    color: #fff !important;
    font-weight: 600 !important;
}

.title-2-panel-top {
    color: #808a93 !important;
    font-weight: 500 !important;
}

.title-3-panel-top {
    color: #808a93 !important;
    font-weight: 500 !important;
}


.title-4-img-drop {
    color: #fff !important;
}

.title-5-main-btn {
    color: #dbdbdb !important;
    font-weight: 600 !important;
}


.title-shop-panel-top-1 {
    color: #808a93 !important;
    font-weight: 600 !important;
}

.title-shop-panel-top-2 {
    color: #c95e34 !important;
    font-weight: 600 !important;
}

.title-shop-panel-top-3 {
    color: #808a93 !important;
    font-weight: 400 !important;
}

.title-shop-panel-top-4 {
    color: #fff !important;
    font-weight: 400 !important;
}

.title-shop-panel-top-subhelp {
    color: #a4afb9 !important;
    font-weight: 400 !important;
}


.p-2-5 {
    padding-top: 1.5rem;
}

.video-main {
    z-index: 1;
    color: aliceblue;
    background: #06060942;
    top: 0;
    left: 0;
    right: 0;
}


.video-main-center {
    -webkit-transform: translateX(-50%) translateY(-25%);
    transform: translateX(-50%) translateY(-25%);
    position: absolute;
    top: 25%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    z-index: -1000;
}


.video-main-title {
    color: #fff !important;
    font-weight: 600 !important;
}

.video-main-message {
    color: #b8b8b8 !important;
    font-weight: 400;
}



.video-main-btn {
    border: 2px solid #dbdbdb03 !important;
    color: #ececec;
    background: #e8e8e81c;
    border-radius: 0.5rem;
}

    .video-main-btn:hover {
        border: 2px solid #dbdbdb !important;
        color: #ececec;
        background: #eeeeee61;
        border-radius: 0.5rem;
        box-shadow: -5px 11px 50px -10px rgb(32, 221, 241);
    }


.lib-product-mini-cover {
    height: 416px !important;
    width: 268px !important;
    object-fit: cover;
}

.lib-product-mini-cover-2 {
    height: 116px !important;
    width: 68px !important;
    object-fit: cover;
}



.nav-link-product-library {
    background: #1f2327 !important
}

    .nav-link-product-library:hover {
        background: #101315 !important
    }

.nav-pills .nav-link-product-library.active, .nav-pills .show > .nav-link-product-library {
    color: #808a93 !important;
    font-weight: 600 !important;
    background-color: #101315 !important;
    border-color: #1861ac;
}

    .nav-pills .nav-link-product-library.active, .nav-pills .show > .nav-link-product-library:hover {
        background-color: #101315 !important;
    }


.lib-upload-img-poster-ach {
    width: 150px !important;
    height: 150px !important;
    border-radius: 1rem !important;
    overflow: hidden;
    box-shadow: 0px 0px 6px 0.1rem rgba(27, 27, 30, 0.56) !important;
}

.main-achievements-img {
    height: 100px;
    width: 100px;
    object-position: center;
    object-fit: cover;
    border: 2px;
    background-color: #212529;
    border-style: dashed;
    border-color: #364242;
}



.main-achievements-panel-icon {
    min-height: 130px;
    width: 90px;
    object-position: center;
    object-fit: cover;
    margin: 2px;
    text-align: center;
    justify-content: center;
    align-content: center;
    align-items: center;
}



.main-achievements-panel-title {
    color: #808a93 !important;
    font-weight: 600 !important;
}

.main-achievements-panel-title {
    color: #808a93 !important;
    font-weight: 600 !important;
}

.main-achievements-img-item {
    position: relative;
    transition: all .2s ease-in-out;
    border: 4px solid #fff0;
}

    .main-achievements-img-item:hover {
        transform: scale(1.1);
        border: 4px solid #fff;
        border-radius: 0.6rem;
    }




.main-achievements-img-p {
    height: 70px;
    width: 70px;
    object-position: center;
    object-fit: cover;
    border: 0px;
    background-color: #212529;
    border-style: dashed;
    border-color: #364242;
}




.main-panel-achievements {
    min-width: 330px;
    padding: 1rem;
    background: #1b1f22;
    background: linear-gradient(200deg, #2f2c2c -59%, #070707 91%);
    border-radius: 1.0rem;
    max-width: 600px;
    border: 2px solid #241f1f;
}

.main-achievements-img-icon {
    bottom: 0;
    right: 0;
    margin: 3px;
    color: #fff;
}





.art-project-preview-library {
    height: 100px;
    width: 100px;
    object-position: center;
    object-fit: cover;
    background-color: #212529;
}




.help-btn {
    background-color: #212529;
}

    .help-btn:hover {
        background-color: #112529;
    }





.nav-link-help {
    background: #212529 !important;
    color: #a9afb4;
    font-size: 11pt
}

.nav-pills .nav-link-help.active, .nav-pills .show > .nav-link-help {
    background: #15191c !important
}

.list-group-item-help {
    background: none !important;
    padding: 0.1rem 0.0rem;
    font-weight: normal !important;
    border: 0px;
}



.nav-title-title-menu-help {
    background: #f000 !important;
    color: #99a3ab;
    font-weight: 400;
    margin-bottom: 0.4rem
}


.box-shadow-not {
    box-shadow: none !important
}



.home-carousel-poster-price1 {
    bottom: 0;
    z-index: 2;
    padding: 0.2rem 1.4rem;
    font-size: 22pt;
    font-weight: 600;
    background: #0c0209;
    border-radius: 0.5rem;
    margin: 1rem;
}

.home-carousel-poster-price2 {
    bottom: 0;
    z-index: 2;
    padding: 0.2rem 1.0rem;
    font-weight: 600;
    background: #cd3828;
    border-radius: 0.5rem;
    margin: 1rem;
    margin-bottom: 1rem;
    margin-left: 1rem;
    margin-bottom: 3.5rem;
    margin-left: 3.5rem;
}

.home-carousel-poster-gradient {
    width: 360px;
    background-image: linear-gradient(180deg, #0000 50%, #4a3f98 99%);
    z-index: 1;
    margin-left: -0.5rem;
    border-radius: 1.5rem;
}


.home-carousel-effect1 {
    background-image: linear-gradient(180deg, #0000 -30%, #00000182 99%);
    z-index: 1;
    box-shadow: 0px 5px 400px -10px rgb(0, 0, 0);
}

.home-carousel-effect2 {
    z-index: 1;
    border-bottom: 1px solid #919191ab;
    box-shadow: 0px 15px 300px -100px rgb(154, 154, 154);
    border-bottom: 1px solid #ff62a4;
    box-shadow: 0px 15px 300px -100px rgb(255, 69, 130);
}


.box-shadow-fx-1 {
    box-shadow: 0px 5px 40px -10px rgb(65, 61, 135) !important;
}













.main-logo-product-promotion {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}



.main-logo-product-promotion-img {
    height: 150px;
    width: 200px;
    position: relative;
    text-align: center;
    margin: 2rem;
    z-index: 2;
    bottom: 130px;
    position: absolute;
}


.main-logo-product-promotion-decor {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border: 2px solid #ffffff12;
    z-index: 3;
    margin: .4rem;
    border-radius: 2rem;
    border-style: dashed;
}

}








.pulse {
    display: block;
    cursor: pointer;
    box-shadow: 0 0 0 rgba(65, 61, 135, 0.4);
    animation: pulse 4s infinite;
}

    .pulse:hover {
        animation: none;
    }

@-webkit-keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(65, 61, 135, 23.4);
    }

    70% {
        -webkit-box-shadow: 0 0 0 20px rgba(65, 61, 135, 0);
    }

    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(65, 61, 135, 0);
    }
}

@keyframes pulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(65, 61, 135, 23.4);
        box-shadow: 0 0 0 0 rgba(65, 61, 135, 0.4);
    }

    70% {
        -moz-box-shadow: 0 0 0 20px rgba(65, 61, 135, 0);
        box-shadow: 0 0 0 40px rgba(65, 61, 135, 0);
    }

    100% {
        -moz-box-shadow: 0 0 0 0 rgba(65, 61, 135, 0);
        box-shadow: 0 0 0 0 rgba(65, 61, 135, 0);
    }
}








.title-home-content {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    margin-bottom: 0.5rem;
    font-size: 20pt;
    font-weight: normal;
    color: #fff !important;
    font-weight: normal;
}


    .title-home-content:not(:empty)::before, .title-home-content:not(:empty)::after {
        content: "";
        display: block;
        width: 262px;
        height: 30px;
        background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAgAAAAA9CAYAAADbA9GgAAAJ4klEQVR4nO3de6wcVR3A8e+2Up4Fyqs1VALakBpAQNHGEh+Q1geKCAIRkQDxASiIqEjUmEhE/EOjVPQf4h+KJEIKBsSIYIiJCvIIbwENCggmUBGQUpQCbc25/PZ2O3dmH3d3Zvbx/fyzuzNnZs6Z2bvn3PNsrH3uBdpptN3bhb5PULq9gDcAi+L9IcA84Crg0taLN3LeTe/YNBJpbWs6+j2lY0gSnfNISr9ISaer7462uXKXkar129Dx4vkBKotz6V+fAV2gxBvS309l/9/PQZrVJbs+qLwEzZ07Z/r9a0q7ynDaDtgb2A9YCiyJ95situl1HXAFcOOE3RtJ0gSZhALAAcAbgQOB5cBOmQy/6V/AD4Hr6ouqJEnVGMcCwMKoxn8LsD+wb0GG3+pKYBXwYvXRlSSpeuNSAFgS1fv/Bq6NdBVl9q2eAL4B3FFdVCVJqt+oFwAWA58AjgV+DazPSVNRQeCPwLnASxXEU5KkoTKqBYA9gJOAU1sy+N2iJqDpiajS3xPYKnN8qvL/drVRliRpeIxiAeAM4JPA1pntqc1/ThQIfgxsD7w7Mv+1wJ3ALcBfgbtrirskSUNhzgg9huVRzX8msE3O/pSWm4AT4v1xMbY/Dah8BdgI7GLmL0nS6NQAfA44Pd4XtemvivH75wMrMuFSxn848FCaBwHYUEGcJUkaWqNQAPgWcEyHXv2pP8CTwNXA7gVhUiHiDyXFUZKkkTLsTQDLI/Mv8lz8Z5/ScUN0Dsxzppm/JEmbDWMB4OCYm5/o7FfkMeDQKCT8tE24r0ffAEmSFIatAPBZ4HLgPxG35QXh7gOOAE4DLmhzvktjYiBJktRimPoAnBzt9Gk2v6ejI1+em4FPAV8BTmzpG5DG/N8DPBVzANwRYSVJUsawFABSZv+1yMwfiG3H54S7NTL/7wDvz+zbEEP+7gJWVxBnSZJG1jA0AaQZ/H7Q8vnxeD04E+6umPnvu1H9n5Um/nmbQ/wkSepsGGoAzs7E4+/ArsD8lm1/jur+i4CVBed5NjoNPlRyfCVJGnnDUABYkvn8Ykzr2/TPmNUvzd3/npz5ANLUvvcD34thgZIkqYO6CwDbAksz2w6LpX2TdZHpfxU4qiVM6ih4G3A7cC/wlwrjLEnSyKu7D8AyYIfMtpUtw/9WxOiAkzJh5gFvig6Br68orpIkjY26agAWRJv9bm3CHBaZ/Hk5+3aMPgJfBK4vMZ6SJI2lumoAvhAd/bLr9Dd9PvoCXFKw/+XoF2DmL0nSLNRVADghOv/tmLMvDQn8DfD7gmOfB44GHiw5jpIkja06CgAHxGtzrf5WaUGfH8V0wHm1A5uiP8Aj1UVXkqTxU0cfgA/E66kx53/TGuAs4BTgoIJjHecvSdIA1FEAWBSv+2fG9H8QWBxz/Oet/Z9qBv5UURwlSRprdRQA8podjo1JfG4oOOaOKABIkqQBqKMPwAuZz+fEZD7fBHYuOOYzFcRLkqSJUUcNQHO63rRozzWxfG/6z3/vgqr/NBRwbcVxlCRprNVRAHgpXlOmvhC4rCDjJ+YC+H6FcZMkaSLU0QTQXOVv55Ypf4v8YjIegyRJ1aqjBqCZ6Tcy//mvj9qBp2IFwMft+CdJUjmqLgAcGDMApoz/2mj7/0es+vd8FACynQQlSdKAVV0AuDBe0yp+v/NhSpJUjyr7ALwu1v6/zsxfkqR6VVkDcHq8ftlnLk11gv0QsEdMdNWpULxTTKOdltC+u81iWZLUlapqANL0vx8F7gT+66PRhJsffw97RiF8GXBIm1syP2bLfG2ET2HfPOk3UVJ/qigApB+vn8T7CzuElcbddsDHgAWZdB5akO4U/ricWTKX+U2R1I+yCwDp/BdFz//kLp+WJtg2kfnvmnMLHs3ZtnVk/rvk7HvML5KkfpTdB+BLwGHARuBvPilNsK2j2n+PnFtwX3SObTUvMv/dc8LfD/zWL5OkfpRZADgaOCPG/M+JHzlpEm0FHB9t/tlpr2/O6dCXwh8Tbf7Z8LcCN/ktktSvxtrn2s+705jdBU4Dzps6vDH9A9b6Q5bdVvTaS9gyzzH12pj+3Nhyf0rjpnid/fkHEsd+rtFoTU/X52rUlcaZzyAvLQONR25aZ5+GRv72xmzvQfd/N53SN3Nfl9/tDve9lzj2fsyrN+5/MUpiDTPk/5rN8jeudwO+0MzTDegCJd6Q5vSvs7tEm6Mqe4h9XrLrg8pL0Ny5m1v+y+gDsNd05i9J1Ur9LA7ynkudDboJYIdYvndOTtWlJFUhFQKO6rNGodd9VZyjyv3D8r7bePSyr5+wZXzOO2c31+m0bWPUiL2cc9yUQdYAzI0e/0sHeE5JktS7lL9v2+6oQdYAnAuszJRIUgnkSOCBIX9418UMa5IkTYRB1QB8uGWq31Y/G4HMP7kAeHoI4iFJ0iA0mwAKpVEA2XX5t9BFT74jo+q/WZvQPNc9U+OeG+0jMEo234vMXemva+vQmI5+T+kYkkTnPJLSLzLTO2LeC1r+DtL8F1fFUtfZ0y0H3pkJ/3ADrskNX7r+e1nX+m3oeHFHAczyxAPjKIBSz96V7CiAHWY5rWjK8M8BLs5pSng8hgKOTeYvdZD+hg7PBLkXuKIgM38r8K7MtvsLCwuSNGCpAPB8TCt6PvD2Lk+fwv0yCgDZZoQHgY8AT/qwNCHSwjzvyyT1Fl79T35jzi1Iw9RWZLbdBvyqILwkDVzrREDbxlK9qRrzeuD2ND95A54Fdozx/emH7ghg/zimdchK+uG6LNrT109HdIxmA7AJoO1R9aqvCeCAmPWyuTN9E26IAkCe/WIZ4OYRKfyN8fdWYty7YRNAqWwCsAlgyJoA8mYCTD9QZwPvTVOS5szsRSbj3xDzkq+KKswtWQAYGWNWADgL2MeZACduJsA2YWc8P9rc717j0Xlbx/h13LbF/saMbY2eji/c3yjYPoD36fvR8lPZ4/j+RnG44nvbzedZjfOfef+7+DwzngXHzEhrl8f1tO2VvGGAKRP/NLAwJtNIbZv7xnKkC6LJ4Kmo6r8pMv8ncs4j1Wkf774kFZrbbh6ANTGr3yXeP42gRywESFKhDWUtBjTAEwwPmwDaHlWv6voALAZOjuV901N/Jua7eKbgoLQC4Imxwl+S+tT8fOq1IJL2AZgl+wCUdeKBsQ9AqWfvSmsfgDKXA5bGzaKWzJ9o+kodX9cVpDM1o50Qa/tvipExlwPtS92SVAELAFJ3dgdOiYVmUmb+cPwnv77g6DS19McjfPIosNox/pKGhQUAqTvHAdtHyNRR9soYAVMkTY+9XRQWUofZqzuEl6RKDXI1QGmcLYq0PdxF5k9U/xP/+Zv5Sxo61gBI3UlrW8yPNvxuMvP7YgKt1Wb+koYO8H+ys786l/4F1QAAAABJRU5ErkJggg==) center/cover no-repeat;
        background-size: cover;
        background-size: contain;
    }

    .title-home-content::after {
        margin-left: 36px;
    }

    .title-home-content::before {
        margin-right: 36px;
        transform: rotate(180deg);
    }








.slide-in-left {
    -webkit-animation: slide-in-left 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
    animation: slide-in-left 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

/* ----------------------------------------------
 * Generated by Animista on 2023-1-12 21:24:1
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */
/**
 * ----------------------------------------
 * animation slide-in-left
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-left {
    0% {
        -webkit-transform: translateX(-1000px);
        transform: translateX(-1000px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slide-in-left {
    0% {
        -webkit-transform: translateX(-1000px);
        transform: translateX(-1000px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

.slide-in-right {
    -webkit-animation: slide-in-right 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
    animation: slide-in-right 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}


@-webkit-keyframes slide-in-right {
    0% {
        -webkit-transform: translateX(1000px);
        transform: translateX(1000px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slide-in-right {
    0% {
        -webkit-transform: translateX(1000px);
        transform: translateX(1000px);
        opacity: 0;
    }

    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
        opacity: 1;
    }
}


.nav-home-logo-title {
    font-size: 18pt;
    padding: 0px;
    margin: 0px;
    color: #fff !important;
    font-family: Comfortaa;
    font-weight: 800 !important;
}


.nav-home-author-title {
    color: #808a93 !important;
    font-weight: 300 !important;
    min-height: 87px;
    display: flex !important;
    justify-content: center;
    justify-items: center;
    justify-self: center;
    align-content: center;
    align-items: center;
}


.list-accordion-filter-max {
    max-height: 500px;
    overflow-y: auto;
}

.home-accordion-poster {
    height: 800px;
    min-width: 267px;
    object-fit: cover;
    object-position: center;
    position: relative;
    overflow: hidden;
    padding: 0px;
    margin: 0px;
    transition: all .4s ease-in-out;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
}

    .home-accordion-poster:not(.collapsed)::after {
        background: none;
    }


    .home-accordion-poster.collapsed {
        width: 267px;
    }




    .home-accordion-poster:focus {
        /*width: 800px;*/
    }






    .home-accordion-poster:not(.collapsed) {
        width: 1000px;
        display: visible;
    }

.accordion-collapse {
    transition: all .4s ease-in-out;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
}



.home-accordion-body-poster {
    transition: none 0s ease 0s !important;
    border-radius: 1.5rem;
    padding: 2.5rem;
    padding-bottom: 6rem;
    background: #000000b0;
    padding-bottom: 5rem;
    margin-bottom: 4.5rem;
    bottom: 0;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: 1rem;
    margin-right: 1rem;
}

.home-accordion-collapse {
    padding: 2rem;
    background: rgba(0, 0, 0, 0.76);
    border-radius: 1.5rem;
}

.home-accordion-item {
    z-index: 0;
}


.home-accordion-header-promotion {
    overflow: hidden
}




.cursor-grab {
    cursor: grab;
}


.slide-in-fwd-center {
    animation: slide-in-fwd-center .4s cubic-bezier(.25,.46,.45,.94) .4s both
}
/* ----------------------------------------------
 * Generated by Animista on 2023-1-13 3:48:43
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

@keyframes slide-in-fwd-center {
    0% {
        transform: translateZ(-1400px);
        opacity: 0
    }

    100% {
        transform: translateZ(0);
        opacity: 1
    }
}

html, .accordion {
    scroll-behavior: smooth;
}









.slider-button-gnx {
    width: 130px !important;
    height: 80px !important;
}












.artproject-poster-auto-grid {
    object-fit: cover;
    object-position: center;
    width: 349px;
    height: 100%;
    align-content: center;
    align-items: center;
    align-self: center;
    display: inline-flex;
    top: 0;
    left: -38px;
    position: absolute;
    bottom: 0;
    right: 0;
    border-radius: 0px !important;
}





.section-44 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    grid-template-rows: repeat(1, 1fr);
    grid-auto-flow: dense;
    grid-gap: 0em;
}

.div-5 {
    object-fit: cover;
    object-position: center center;
    height: 280px;
    width: revert;
    align-items: center;
    justify-content: center;
}

    .div-5:before {
        align-items: center;
    }

.section-44 :first-of-type .div-5:nth-child(2) {
    grid-row: auto /span 2;
    grid-column: auto / span 2;
}

.section-44 + .section-44 .div-5:nth-child(3),
.section-44 + .section-44 .div-5:nth-child(5) {
    grid-row: auto /span 2;
    grid-column: auto / span 2;
}



.lib-navbar-cart {
    background: #8b1a1a;
    border-radius: 1rem;
    padding: 0.2rem 0.8rem;
    text-align: center;
    align-content: center;
    align-items: center;
    color: azure;
    display: inline-flex;
    justify-content: center;
}



.lib-navbar-cart-count {
    margin: 0px;
    margin-bottom: 0px;
    padding: 0px;
    line-height: 1;
    margin-bottom: 2px;
}

.lib-navbar {
    background: #16191a;
    border-radius: 1rem;
}

.lib-navbar-lang {
    box-shadow: -10px 0px 80px -20px rgb(73, 127, 127);
    border-bottom: 2px solid #333e3d !important;
    border-radius: 1rem;
}

.lib-navbar-item {
    color: #949494;
    text-align: center;
    padding: 1rem;
    border-radius: 1rem;
    min-width: 100px;
    margin: 0.2rem;
    min-height: 105px;
}



    .lib-navbar-item:hover {
        background: #303538;
    }


.lib-bank-item {
    min-width: 400px;
    background: none;
    color: white;
    font-weight: 600;
}



.support-item {
    min-width: 190px;
    min-height: 190px;
    padding: 1rem;
    border-radius: 1rem;
    color: #fff;
}

    .support-item:hover {
        background: #343434;
    }



.support-item-tab {
    background: #1a1a1a;
    border-radius: 1rem;
    margin: 0.3rem
}

    .support-item-tab.active {
        background: #ff681f;
    }




.support-body {
    padding: 1rem;
    margin-top: 3rem
}


.section-55 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    grid-template-rows: repeat(1, 1fr);
    grid-auto-flow: dense;
    grid-gap: 0em;
}



.section-preview-category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-template-rows: repeat(1, 1fr);
    grid-auto-flow: dense;
    grid-gap: 0em;
}

.div-6 {
    object-fit: cover;
    object-position: center center;
    width: revert;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    height: 100%;
}




.div-6-mini {
    background: #38383829;
    transition: all 0.2s ease-out;
}


    .div-6-mini:hover {
        opacity: 0.7;
        transform: scale(1.01); /* Equal to scaleX(0.7) scaleY(0.7) */
        transition: all 0.2s ease-out;
    }



.div-5:before {
    align-items: center;
}






.section-55 :first-of-type .div-5:nth-child(2) {
    grid-row: auto /span 2;
    grid-column: auto / span 2;
}

.section-55 + .section-55 .div-5:nth-child(3),
.section-55 + .section-55 .div-5:nth-child(5) {
    grid-row: auto /span 2;
    grid-column: auto / span 2;
}



.section-687 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    /* grid-template-rows: repeat(1, 1fr);*/
    grid-auto-flow: dense;
    grid-gap: 0em;
}



    .section-687 :first-of-type .div-5:nth-child(2) {
        grid-row: auto /span 2;
        grid-column: auto / span 2;
    }

    .section-687 + .section-687 .div-5:nth-child(3),
    .section-687 + .section-687 .div-5:nth-child(5) {
        grid-row: auto /span 2;
        grid-column: auto / span 2;
    }



.section-687adv {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-auto-rows: auto;
    grid-gap: 0em;
}

    /* По умолчанию каждый блок div-5 занимает один столбец */
    .section-687adv > .div-6 {
        grid-column: span 1;
    }

        /* Пятый блок (первый блок второго ряда) будет занимать 2 столбца */
        .section-687adv > .div-6:nth-child(5) {
            grid-column: span 2;
        }



.section-icons-907 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    grid-template-rows: repeat(1, 1fr);
    grid-auto-flow: dense;
    grid-gap: 0em;
}



    .section-icons-907 :first-of-type .div-5:nth-child(2) {
        grid-row: auto /span 2;
        grid-column: auto / span 2;
    }

    .section-icons-907 + .section-icons-907 .div-5:nth-child(3),
    .section-icons-907 + .section-icons-907 .div-5:nth-child(5) {
        grid-row: auto /span 2;
        grid-column: auto / span 2;
    }



.color-yellow-light {
    color: #ffcb7a;
}

.section-avatars-907 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(125px, 1fr));
    grid-template-rows: repeat(1, 1fr);
    grid-auto-flow: dense;
    grid-gap: 0em;
}



    .section-avatars-907 :first-of-type .div-5:nth-child(2) {
        grid-row: auto /span 2;
        grid-column: auto / span 2;
    }

    .section-avatars-907 + .section-avatars-907 .div-5:nth-child(3),
    .section-avatars-907 + .section-avatars-907 .div-5:nth-child(5) {
        grid-row: auto /span 2;
        grid-column: auto / span 2;
    }

.slide-in-elliptic-top-fwd {
    -webkit-animation: slide-in-elliptic-top-fwd 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
    animation: slide-in-elliptic-top-fwd 0.4s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}
/* ----------------------------------------------
 * Generated by Animista on 2023-1-13 20:2:50
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-elliptic-top-fwd
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-elliptic-top-fwd {
    0% {
        -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
        transform: translateY(-600px) rotateX(-30deg) scale(0);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotateX(0) scale(1);
        transform: translateY(0) rotateX(0) scale(1);
        -webkit-transform-origin: 50% 1400px;
        transform-origin: 50% 1400px;
        opacity: 1;
    }
}

@keyframes slide-in-elliptic-top-fwd {
    0% {
        -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
        transform: translateY(-600px) rotateX(-30deg) scale(0);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotateX(0) scale(1);
        transform: translateY(0) rotateX(0) scale(1);
        -webkit-transform-origin: 50% 1400px;
        transform-origin: 50% 1400px;
        opacity: 1;
    }
}




img {
    pointer-events: none;
}





.item-block-str {
    display: grid;
    grid-template-rows: auto 1fr auto; /* Creates three rows: top, middle that stretches, and bottom */
    align-items: start; /* Aligns content to the top by default */
    height: 100%;
    width: 100%;
}


.lib-title-panel-artwork {
    padding: 2rem;
    z-index: 1;
    border-radius: 1rem;
    margin: 1rem;
}


.home-poster-artwork-overlay {
    position: absolute !important;
    z-index: 1;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    opacity: 0;
    color: #fff;
}


    .home-poster-artwork-overlay:hover {
        left: 0px !important;
        bottom: 0px !important;
        background: #050a0aad !important;
        opacity: 1;
        z-index: 0;
    }



.home-poster-artwork-overlay-link {
    height: 350px;
    position: absolute;
    width: 350px;
    display: block;
    z-index: 0;
}


.home-poster-artwork-overlay-title {
    bottom: -1500px
}


.home-art-avatar-panel {
    height: 69px !important;
    width: 69px !important;
    display: block;
}

.item-art-avatar-panel-link {
    position: absolute;
    width: auto;
    height: auto;
    display: block;
    z-index: 3;
    top: 0;
}

.item-art-panel-link {
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    z-index: 3;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.subitem-card-art {
    margin-top: 3rem;
    height: 100%;
}

.home-art-poster-fx2 {
    top: 0px !important;
    left: 0px !important;
}

.home-art-poster-fx1 {
    padding: 0;
    top: 0;
    left: 0;
}


.home-art-link-im {
    width: 350px;
    height: 325px;
    position: relative;
    display: block;
}


.home-art-link-title {
    font-weight: 800;
    margin-bottom: 0.4rem;
}


.home-art-link-img-f2 {
    display: contents;
}


.lib-progress {
    border-radius: 1rem;
    background-color: #4d4d4d;
}

.lib-progress-bar {
    background-color: #3f7563;
    padding: 0.5rem;
}


.font-family-segoeui {
    font-family: Segoe UI;
}




.error-art-avatar {
    border-radius: 15rem;
    height: 150px;
    width: 150px;
    object-fit: cover;
    object-position: center;
    overflow: hidden
}




.color-red {
    color: #ff5454;
}


















.error-art-background {
    margin: auto;
    font-family: -apple-system, BlinkMacSystemFont, sans-serif;
    overflow: auto;
    background: linear-gradient(315deg, rgb(22, 20, 22) 3%, rgb(22, 24, 26) 38%, rgb(19, 20, 20) 68%, rgb(24, 24, 27) 98%);
    animation: gradient 15s ease infinite;
    background-size: 400% 400%;
    background-attachment: fixed;
}




@keyframes gradient {
    0% {
        background-position: 0% 0%;
    }

    50% {
        background-position: 100% 100%;
    }

    100% {
        background-position: 0% 0%;
    }
}

.wave {
    background: rgb(0, 0, 0);
    border-radius: 1000% 1000% 0 0;
    position: absolute;
    width: 200%;
    height: 40em;
    animation: wave 10s -3s linear infinite;
    transform: translate3d(10, 0, 0);
    opacity: 0.1;
    bottom: -150px;
    left: 0;
    z-index: 0;
}

    .wave:nth-of-type(2) {
        bottom: -1.25em;
        animation: wave 18s linear reverse infinite;
        opacity: 0.05;
    }

    .wave:nth-of-type(3) {
        bottom: 5.5em;
        animation: wave 20s -1s reverse infinite;
        opacity: 0.08;
    }


    .wave:nth-of-type(5) {
        bottom: 7.5em;
        animation: wave 10s -1s reverse infinite;
        opacity: 0.04;
    }


@keyframes wave {
    2% {
        transform: translateX(1);
    }

    25% {
        transform: translateX(-25%);
    }

    50% {
        transform: translateX(-50%);
    }

    75% {
        transform: translateX(-25%);
    }

    100% {
        transform: translateX(1);
    }
}















.element-cb {
    height: 250px;
    width: 250px;
    margin: 0 auto;
    z-index: 1;
    animation-name: stretch;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-delay: 0;
    animation-direction: alternate;
    animation-iteration-count: infinite;
    animation-fill-mode: none;
    animation-play-state: running;
}
/*
@keyframes stretch {
    0% {


        transform: scale(.3);
      
        border-radius: 100%;
    }

    50% {
      
    }

    100% {
        transform: scale(1.5);
       
    }
}

*/













.error-block {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}



.icon-container {
    position: relative;
    float: left;
    width: 40px;
    height: 40px;
    text-align: center;
}

.icon {
    position: absolute;
}














.puff-out-center {
    -webkit-animation: puff-out-center 2s ease-in-out 2.4s infinite alternate both;
    animation: puff-out-center 2s ease-in-out 2.4s infinite alternate both;
}

/* ----------------------------------------------
 * Generated by Animista on 2023-1-23 4:2:17
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation puff-out-center
 * ----------------------------------------
 */
@-webkit-keyframes puff-out-center {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(2);
        transform: scale(2);
        -webkit-filter: blur(4px);
        filter: blur(4px);
        opacity: 0;
    }
}

@keyframes puff-out-center {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-filter: blur(0px);
        filter: blur(0px);
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(2);
        transform: scale(2);
        -webkit-filter: blur(4px);
        filter: blur(4px);
        opacity: 0;
    }
}













.heartbeat {
    -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
    animation: heartbeat 1.5s ease-in-out infinite both;
}
/* ----------------------------------------------
 * Generated by Animista on 2023-1-23 3:46:27
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    10% {
        -webkit-transform: scale(0.91);
        transform: scale(0.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    17% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    33% {
        -webkit-transform: scale(0.87);
        transform: scale(0.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

@keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    10% {
        -webkit-transform: scale(0.91);
        transform: scale(0.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    17% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    33% {
        -webkit-transform: scale(0.87);
        transform: scale(0.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}




.slide-in-elliptic-top-fwd {
    -webkit-animation: slide-in-elliptic-top-fwd 3s ease-in-out infinite alternate-reverse both;
    animation: slide-in-elliptic-top-fwd 3s ease-in-out infinite alternate-reverse both;
}

/* ----------
    ------------------------------------
 * Generated by Animista on 2023-1-23 4:17:38
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-elliptic-top-fwd
 * ----------------------------------------
 */
@-webkit-keyframes slide-in-elliptic-top-fwd {
    0% {
        -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
        transform: translateY(-600px) rotateX(-30deg) scale(0);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotateX(0) scale(1);
        transform: translateY(0) rotateX(0) scale(1);
        -webkit-transform-origin: 50% 1400px;
        transform-origin: 50% 1400px;
        opacity: 1;
    }
}

@keyframes slide-in-elliptic-top-fwd {
    0% {
        -webkit-transform: translateY(-600px) rotateX(-30deg) scale(0);
        transform: translateY(-600px) rotateX(-30deg) scale(0);
        -webkit-transform-origin: 50% 100%;
        transform-origin: 50% 100%;
        opacity: 0;
    }

    100% {
        -webkit-transform: translateY(0) rotateX(0) scale(1);
        transform: translateY(0) rotateX(0) scale(1);
        -webkit-transform-origin: 50% 1400px;
        transform-origin: 50% 1400px;
        opacity: 1;
    }
}






































.wen-dragdrop-area.h-180px.lib-form-upload:hover {
    background: radial-gradient(circle, rgba(255, 255, 255, 0.83) 0%, rgba(255, 255, 255, 0.64) 35%, rgba(255, 255, 255, 0.99) 100%)
}





.drag-block {
    max-width: 600px;
    height: 230px !important;
    width: 100%;
}





.wen-dragdrop-area {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: 500;
    font-size: 20px;
    cursor: pointer;
    color: #cccccc;
    height: 100%;
    width: 100%;
    overflow: hidden;
    max-width: 600px;
    border-radius: 1rem;
    z-index: 0;
    min-width: 200px;
    min-height: 200px;
    position: relative;
}



.wen-dragdrop-hover-state {
    border-style: solid;
}

.wen-dragdrop-file-input {
    display: none;
}

.wen-dragdrop-preview-thumb {
    width: 100%;
    height: 100%;
    border-radius: 10px;
    overflow: hidden;
    background-color: #cccccc40;
    position: relative;
    background-size: cover;
    background-size: cover !important;
    background-position: center !important;
    border-radius: 1.2rem !important;
}

    .wen-dragdrop-preview-thumb::after {
        content: attr(data-label);
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
        padding: 5px 0px;
        color: rgb(255, 255, 255);
        background: rgba(0, 0, 0, 0.75);
        font-size: 14px;
        text-align: center;
        padding: 1rem;
        word-wrap: anywhere;
        font-size: 9pt;
        display: none;
    }



.wen-dragdrop-hint1 {
    position: absolute !important;
    z-index: 1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    align-content: center;
    align-items: center;
    align-self: center;
    display: inline-grid;
    font-size: 13pt;
    opacity: 1.0;
    border: 7px solid #313131;
    background: #000000a1;
    background: rgb(5,5,5);
    background: -moz-radial-gradient(circle, rgba(5,5,5,0.49) 0%, rgba(20,20,20,0.64) 35%, rgba(27,27,27,0.99) 100%);
    background: -webkit-radial-gradient(circle, rgba(5,5,5,0.49) 0%, rgba(20,20,20,0.64) 35%, rgba(27,27,27,0.99) 100%);
    background: radial-gradient(circle, rgba(5,5,5,0.49) 0%, rgba(20,20,20,0.64) 35%, rgba(27,27,27,0.99) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#050505",endColorstr="#1b1b1b",GradientType=1);
    border-radius: 1rem;
}


    .wen-dragdrop-hint1:hover {
        opacity: 0.5;
        background: #6660;
        background: rgb(5,5,5);
        background: -moz-radial-gradient(circle, rgba(5,5,5,0.19883287787771353) 0%, rgba(20,20,20,0.20443511877407217) 35%, rgba(27,27,27,0.8038748946844363) 100%);
        background: -webkit-radial-gradient(circle, rgba(5,5,5,0.19883287787771353) 0%, rgba(20,20,20,0.20443511877407217) 35%, rgba(27,27,27,0.8038748946844363) 100%);
        background: radial-gradient(circle, rgba(5,5,5,0.19883287787771353) 0%, rgba(20,20,20,0.20443511877407217) 35%, rgba(27,27,27,0.8038748946844363) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#050505",endColorstr="#1b1b1b",GradientType=1);
    }

.drop-icon-c {
    font-size: 27pt !important;
}


.drag-zone-title {
    font-size: 12pt;
    padding: 1rem;
    height: 100%
}


.drag-div {
    height: 170px;
    min-width: 280px;
}





.button-top-fu {
    background: rgb(90, 37, 37);
    z-index: 2;
    right: 6%;
    bottom: 0%;
    font-size: 22pt;
    border: 0px solid rgb(255, 255, 255);
    color: rgb(255, 255, 255);
    border-radius: 1.5rem;
    padding: 1.0rem 1.5rem !important;
    margin: 0.5em;
}

    .button-top-fu:hover {
        background: rgb(91, 79, 177);
    }





.button-top-cart {
    background: #0f0f0f;
    z-index: 2;
    right: 5.5%;
    bottom: 5%;
    font-size: 22pt;
    border: 0px solid rgb(255, 255, 255);
    color: rgb(255, 255, 255);
    border-radius: 1.5rem;
    padding: 1.0rem 1.5rem !important;
}

    .button-top-cart:hover {
        background: rgb(91, 79, 177);
    }













#user-agreement {
    max-height: 250px;
    overflow: auto;
    position: relative;
    margin: 0.4rem;
    background: #212529;
    padding: 1rem;
}



.user-agreement-modal-b1 {
    padding: 2rem;
    background: #181a1b;
    max-width: 800px;
}

.lib-localization-product-body {
    background: #212529;
    padding: 1.5rem;
    border-radius: 1rem;
}

.lib-max-1 {
    max-width: 300px;
}

.lib-maxb-1 {
    height: 420px;
    min-width: 200px;
}























.center {
    width: 50px;
    height: 50px;
    z-index: 555
}

.icon-block {
    width: 50px;
    height: 50px;
    background-image: url("icon1.png");
    background-size: cover;
    opacity: 0;
    position: absolute;
}





.container-gg {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background: #16181a;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.icon-block {
    width: 50px;
    height: 50px;
    background-image: url("/images/icons/04.png");
    background-size: cover;
    opacity: 0
}

#block1 {
    animation: block1 2s ease-in-out;
    animation-duration: 5s;
    animation-iteration-count: infinite;
}

#block2 {
    animation: block2 2s ease-in-out;
}

#block3 {
    animation: block3 2s ease-in-out;
    animation-duration: 1s;
    animation-iteration-count: infinite;
}

#block4 {
    animation: block4 2s ease-in-out;
    animation-duration: 3s;
    animation-iteration-count: infinite;
}





#block5 {
    animation: block4 2s ease-in-out;
    animation-duration: 7s;
    animation-iteration-count: infinite;
}


#block6 {
    animation: block1 2s ease-in-out;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}



#block7 {
    animation: block3 2s ease-in-out;
}

#block8 {
    animation: block5 2s ease-in-out;
}


@keyframes block1 {
    0% {
        transform: translateX(-100px);
        transform: scale(0.7);
        /* Multiple animations */
        animation-delay: 1.1s, 480ms;
    }

    4% {
    }

    25% {
        background-image: url("/images/icons/01.png");
    }

    35% {
        background-image: url("/images/icons/02.png");
        transform: translateX(100px);
    }

    50% {
        background-image: url("/images/icons/03.png");
        opacity: 1;
        transform: scale(1.4);
    }

    71% {
        transform: translateX(0);
    }
}

@keyframes block2 {
    0% {
        transform: scale(0.4);
        transform: translateX(100px);
    }

    8% {
    }

    9% {
        background-image: url("/images/icons/01.png");
        /* Multiple animations */
        animation-delay: 4.1s, 480ms;
    }

    43% {
        background-image: url("/images/icons/02.png");
        transform: scale(1.2);
        transform: translateX(-200px);
    }

    78% {
        background-image: url("/images/icons/03.png");
        opacity: 1
    }

    89% {
        transform: translateX(0);
    }
}

@keyframes block3 {
    0% {
        transform: scale(0.2);
    }

    8% {
        transform: translateX(-50px);
    }

    25% {
        background-image: url("/images/icons/01.png");
    }

    43% {
        background-image: url("/images/icons/02.png");
        transform: scale(0.5);
        transform: translateX(100px);
    }

    88% {
        background-image: url("/images/icons/03.png");
        opacity: 1
    }

    49% {
        transform: translateX(0);
    }
}



@keyframes block4 {
    0% {
        /* Multiple animations */
        animation-delay: 2.1s, 480ms;
    }

    8% {
    }

    9% {
        background-image: url("/images/icons/03.png");
        transform: scale(0.7);
        transform: translateX(-80px);
    }

    33% {
        background-image: url("/images/icons/02.png");
    }

    68% {
        background-image: url("/images/icons/01.png");
        transform: scale(1.1);
        opacity: 1;
        transform: translateX(100px);
    }

    89% {
        transform: translateX(0);
    }
}

@keyframes block10 {
    0% {
    }

    40% {
    }

    41% {
        background-image: url("/images/icons/02.png");
    }

    45% {
        background-image: url("/images/icons/03.png");
        opacity: 1;
        transform: translateX(-100px);
    }

    80% {
        background-image: url("/images/icons/01.png");
    }

    81% {
        transform: translateY(0);
    }
}









.imgTagPreviewX {
    z-index: 1111;
    display: block;
    position: absolute;
    opacity: 0;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}







.btn-adv-1 {
    z-index: 11;
    position: absolute;
    margin: 1rem;
    margin-left: 3rem;
    bottom: 1rem;
}



.main-overlay-adv {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    position: absolute;
    z-index: 1;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(180deg, #0000 -20%, #202020 100%);
}








.btn-accordion-main-lib {
    padding: 0.75rem 1rem;
    margin-top: 0.1rem;
    border-radius: 0.2rem;
    border: 0px;
    color: #c2c2c2;
    background-color: rgb(23, 27, 30);
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

    .btn-accordion-main-lib:hover {
        background-color: #2f3337;
    }

.lib-tab-count-item {
    min-width: 35px;
    display: inline-block;
    position: relative;
}



.btn-lib-category-product {
    font-style: normal;
}

    .btn-lib-category-product:disabled {
        color: #4f4f4f !important;
        background: rgb(32, 32, 32) !important;
    }























#languageList {
    max-height: 175px;
    overflow: hidden;
}

.languageListOpen {
    max-height: 100% !important;
    height: auto !important
}

.btn-lib-expand {
    background: none;
    border: 0px;
    text-align: center;
    width: 100%;
}

    .btn-lib-expand:hover {
        background: none;
        color: #7b858e !important;
    }













.lib-textarea-resize {
    resize: none
}




.dropbtn {
    background-color: #4CAF50;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
}

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

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

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

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

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

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

.vignette, .vignette .inner {
    position: relative;
    overflow: hidden;
}

    .vignette img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .vignette::before,
    .vignette::after,
    .vignette .inner::before,
    .vignette .inner::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
    }

    .vignette::before {
        background: radial-gradient(circle at top left, transparent, transparent, rgba(0, 0, 0, 0.3) 100%);
        );
    }

    .vignette::after {
        background: radial-gradient(circle at bottom left, transparent, transparent, rgba(0, 0, 0, 0.3) 100%);
        );
    }

    .vignette .inner::before {
        background: radial-gradient(circle at top right, transparent, transparent, rgba(0, 0, 0, 0.3) 100%);
        );
    }

    .vignette .inner::after {
        background: radial-gradient(circle at bottom right, transparent, transparent, rgba(0, 0, 0, 0.3) 100%);
        );
    }

.carousel-indicators-lib {
    position: relative;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    display: flex;
    justify-content: center;
    padding: 0;
    margin-right: 0%;
    margin-bottom: 0rem;
    margin-left: 0rem;
    list-style: none;
    overflow-y: scroll;
    z-index: 2;
}

    .carousel-indicators-lib [data-bs-target] {
        padding: 0rem;
        margin: 0rem;
        left: 0;
        box-sizing: inherit;
        width: 260px;
        height: auto;
        border: 0px;
    }

.c-indicators-lib {
    border: 0rem;
    border-radius: 0rem;
    box-shadow: none;
    padding: 0rem;
    margin: 0rem;
    border: 0px solid transparent;
    height: 180px
}

.c-indicators {
    object-fit: cover;
    object-position: center;
    border: 2px solid #1b1f22;
    border: 0px solid transparent;
    height: 100px;
}

.carousel-indicators-lib .active > img {
    opacity: 1;
    box-shadow: none;
    border: #622fbe 3px solid;
}

.bq-danger-type-1 {
    background: #1b1b1b !important;
    color: #b75639;
}

.carousel-control-next:hover {
    background: black;
    transition: opacity .15s ease-in-out;
}

.carousel-control-prev:hover {
    background: black;
    transition: opacity .15s ease-in-out;
}

.carousel-control-prev, .carousel-control-next {
    transition: .25s ease-in-out;
    top: 0;
    position: absolute;
    bottom: 0;
}


.release-announcement-block {
    padding: 5px 10px;
    background: #a02828;
    border-radius: 0.5rem;
    font-weight: 600;
}


.release-preorder-block {
    padding: 5px 5px;
    border-radius: 0.5rem;
    font-weight: 600;
    text-align: center;
    display: flex;
    align-items: end;
    align-self: end;
}

.lib-release-preorder-block {
    background: #000 !important;
    font-weight: 600;
}

.lib-release-announcement {
    text-align: center;
    text-transform: uppercase;
    font-size: 11pt;
    border-radius: 0.5rem;
    font-weight: 600;
    padding: 1rem;
    color: #e37d33;
}

.lib-carousel-max {
    flex-direction: row-reverse;
    z-index: 0;
}

.lib-carousel-max-glow {
    border-right: 1px solid #7767f85c;
    box-shadow: 55px 5px 100px -50px rgb(59, 54, 141);
}


.lib-carousel-max-list-scr {
    max-height: 1000px;
}


.font-weight-600 {
    font-weight: 600;
}


.overflow-y {
    overflow-y: auto;
}


.screenshot-form-xc {
    background: #0b0f12;
    padding: 1rem;
    margin: 0.4rem;
    border-radius: 1rem;
    min-width: 207px;
}



.main-title-dragmoveset {
    font-size: 11pt;
    z-index: 111;
    position: absolute;
    margin-top: -54px;
    background: #0000001c;
    padding: 1rem;
    width: 100%;
    text-align: center;
    color: #fff;
    top: -10px;
}

.lib-list-group-menu {
    min-height: 96px;
}

a.note-dropdown-item, a.note-dropdown-item:hover {
    margin: 5px 0;
    color: #afafaf;
    text-decoration: none;
}

note-modal-content {
    position: relative;
    width: auto;
    margin: 30px 20px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: #121212;
    background-clip: border-box;
    background-clip: border-box;
    outline: 0;
    border-radius: 5px;
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    color: #e5e5e5
}

.note-form-label {
    display: block;
    width: 100%;
    font-size: 16px;
    color: #9a9a9a;
    margin-bottom: 10px;
    font-weight: 700;
}

.note-modal-title {
    font-size: 20px;
    color: #9a9a9a;
    margin: 0;
    line-height: 1.4;
}

.note-modal-header {
    padding: 10px 20px;
    border: 0px solid #00f;
}

.note-btn {
    padding: 0.7rem;
}

.note-dropdown-menu > :last-child {
    margin-right: 0;
    color: aliceblue;
}

.note-input {
    color: #9c9c9c
}







.about-site-img1 {
    background: url('/custom-img/about1.jpg');
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    height: 300px;
    width: 400px;
    background-position: center;
    background-size: cover;
}


.about-site-img2 {
    background: url('/custom-img/about2.jpg');
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    height: 300px;
    width: 400px;
    background-position: center;
    background-size: cover;
}

.about-site-img3 {
    background: url('/custom-img/about3.jpg');
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    height: 380px;
    width: 400px;
    background-position: center;
    background-size: cover;
    background-size: 220%;
}

.border-radius-bg-left {
    border-radius: 12rem 1rem;
}

.border-radius-bg-right {
    border-radius: 1rem 12rem;
}


.border-radius-01 {
    border-radius: 0.2rem !important
}


.fx-glow-accordion {
    box-shadow: 0px 8px 130px -50px rgba(164, 32, 32, 0.38);
}


.fx-btn-g1 {
    box-shadow: 0px 0px 50px -10px rgba(77, 23, 96, 0.00);
}

    .fx-btn-g1:hover {
        box-shadow: 0px 0px 50px -10px rgba(145, 147, 147, 0.93)
    }

.fx-btn-g2 {
    box-shadow: 0px 0px 50px 10px rgb(27, 37, 40, 0);
}

    .fx-btn-g2:hover {
        box-shadow: 0px 0px 50px 10px rgb(27, 37, 40);
    }



.fx-btn-g3 {
    box-shadow: -100px 0px 100px -20px rgba(101, 104, 133, 0.23);
}

    .fx-btn-g3:hover {
        box-shadow: -100px 0px 80px -20px rgba(207, 212, 255, 0.53);
    }



.nav-pills .fx-btn-g3.active, .nav-pills .show > .nav-link {
    box-shadow: -100px 0px 80px -20px rgb(73, 127, 127);
    border-left: 2px solid #5f8e87;
}

.fx-blur {
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -ms-filter: blur(3px);
    -o-filter: blur(3px);
    filter: url("data:image/svg+xml;utf8,<svg height='0' xmlns='http://www.w3.org/2000/svg'><filter id='svgBlur' x='-5%' y='-5%' width='110%' height='110%'><feGaussianBlur in='SourceGraphic' stdDeviation='5'/></filter></svg>#svgBlur");
    filter: progid: DXImageTransform.Microsoft.Blur(PixelRadius = '3');
    filter: blur(3px);
}


.lib-item-title-panel-2 {
    padding-right: 7px;
    width: 100%;
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    position: absolute;
}

.mgb-1 {
    margin: 0px 5.3rem -0.2rem 1.2rem;
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mgb-2v {
    word-wrap: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mgb-text-wrap {
    word-wrap: break-word;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
}















.glass-lib-menu {
    /*background: url('/test_css_blur.jpg');*/
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    filter: blur(20px);
    z-index: -11;
    opacity: 0.2;
}

.glass {
    position: relative;
    background: rgb(11, 12, 13);
    box-shadow: 0 4px 150px rgba(129, 153, 170, 0.22);
    left: 0;
    bottom: 0;
    top: 0;
    right: 0;
}

    .glass::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: inherit;
        filter: blur(10px);
        z-index: -1;
    }

    .glass::after, .glass::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        color: transparent;
        z-index: -1;
        transform: translateY(-5px) translateZ(5px);
    }

    .glass::before {
        color: rgba(255, 0, 0, 0.5);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        transform: translateY(5px) translateZ(-5px);
        mix-blend-mode: screen;
    }

    .glass::after {
        color: rgba(0, 255, 255, 0.5);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
        mix-blend-mode: screen;
    }



.cart-summary-choose-card {
    background: #262b2e;
    border: 1px solid #2b2c2d;
    height: 150px;
    width: 250px;
}



.cart-summary-choose-card-item {
    background: url(/images/cards/payment_sys_logos_card.png);
    height: 100%;
    width: 100%;
    z-index: 1111;
    background-size: 85%;
    background-position: center;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}




.lib-nav-btn-creator > i {
    font-size: 20pt;
}



.modal-del {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    overflow: auto;
    z-index: 9999;
    position: fixed;
}

.modal-del-content {
    background-color: #e63d3d;
    margin: 15% auto;
    padding: 3rem;
    border: 5px solid #ff6666e5;
    max-width: 500px;
    color: #fff;
    border-radius: 1rem;
}

.modal-del-actions {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}


.modal-default-content {
    background-color: #16191c;
    margin: 15% auto;
    max-width: 500px;
    color: #fff;
    border-radius: 1rem;
}


.modal-finance {
    background-color: #16191c;
    margin: 15% auto;
    color: #fff;
    border-radius: 1rem;
}

.modal-default-actions {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}



.hidden {
    display: none;
}


.ba-3 {
    height: 156px;
    display: grid;
}

.p-1d6 {
    padding: 1.1rem 1rem !important;
    height: 156px;
    width: 270px;
    align-content: center;
    align-self: center;
    display: grid;
}


    .p-1d6.active {
        background: #7e7e7e26 !important;
    }




.lib-pagination {
    background: #6c757d;
    color: #fff;
    border: 0px;
}

    .lib-pagination:hover {
        background: #6c757d;
        color: #cecece;
        border: 0px;
    }




.lib-pagination-active.active .page-link {
    background: #8f989f;
}




.video-bin {
    position: absolute;
    z-index: 0;
    bottom: 0px;
    left: 0px;
    right: 0px;
    top: 0;
    height: 800px;
}

.width-80px {
    width: 80px !important;
    min-width: 80px !important;
}

.width-100px {
    width: 100px !important;
    min-width: 100px !important;
}



.width-140px {
    width: 140px !important;
    min-width: 140px !important;
}


.width-160px {
    width: 160px !important;
    min-width: 160px !important;
}


.width-200px {
    width: 200px !important;
    min-width: 200px !important;
}

.width-260px {
    min-width: 260px !important;
}



.width-m860px {
    max-width: 860px !important;
}


.lib-item-file {
    border-radius: 0.6rem !important;
    border-color: #0000;
    background-color: #f9f9f9;
    overflow: hidden;
    background: #212529;
    color: #fff;
    border: 2px solid #ffffff05 !important;
    border-style: dashed !important;
    background: #16191a
}

.lib-item-filet:hover {
    background: #1f2425 !important;
    border: 2px solid #ffffff2e !important;
}

.lib-item-file.active {
    z-index: 1;
    color: #fff;
    background-color: #5b1d1d;
    border-color: #0000;
}

.lib-item-file.disabled, .lib-item-file:disabled {
    z-index: 1;
    color: #535353;
    background-color: #1b1c1b;
    border-color: #0d6efd;
    pointer-events: none;
}





.progress-bar-cux {
    margin: 0.4rem;
    margin-top: 0.4rem;
    border-radius: 1rem;
    height: 26px;
}


.btn-holder-me {
    color: #fff;
    cursor: pointer;
    font-size: 16px;
    border: 0px solid #5a565657;
    transition: background 0.3s, color 0.5s, border 0.3s ease-out;
    background: #0e0c12;
    margin: 0.1rem;
}

/* делаем инпут "невидимым", но кликабельным поверх зоны */
.su-hidden-input {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

/* чтобы оверлеи не блокировали клик/перетаскивание */
.x-upload-img-overlay {
    pointer-events: none;
}

/* красивое подсветка dnd по желанию */
.su-dragover {
    outline: 2px dashed #6ea8fe;
    outline-offset: 2px;
}

.btn-holder-me-active {
    color: #791a1a !important;
    background: #d73535 !important;
    border: 25px solid #e12727 !important;
    transition: background 3.0s, color 2.2s, border 2.45s ease-out;
}



.cart-delete-item {
    background-image: linear-gradient(950deg, #922d2db5 -0%, #f9384a 199%) !important;
    background: none;
}


.library-nav-price-2 {
    font-size: 15pt;
    font-weight: 500;
    line-height: normal;
    min-width: 160px;
}


.discount-main-price-3 {
    background: #e83232;
    padding: 3px 10px 3px 5px;
    position: absolute;
    margin-top: -28px;
    margin-right: 5px;
    border-radius: 0.5rem;
    font-weight: 600;
    top: 0rem;
    right: 0;
    text-align: center;
    font-size: 13pt;
}


.lib-modal-news-product-card {
    width: 100%;
    background: #2f33372b;
    border: 2px solid #05040766;
}




#loadingScreenFilter {
 
    top: 0;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    color: #fff;
    font-size: 2em;
    display: flex;
    text-transform: uppercase;
    font-size: 16pt;
    padding: 10rem 1rem;
}


/* блокировка формы во время AJAX */
.wen-form-lock {
    pointer-events: none;
    opacity: .55;
}

#endContentLoading {
    width: 100%;
    height: 1px; /* минимум для обзора */
    margin: 0;
    padding: 0;
    opacity: 0; /* полностью прозрачен */
    pointer-events: none;
    /* если карточки в CSS-grid и нужно убрать «дырку»: */
    grid-column: 1 / -1; /* занимает всю строку, но толщиной 1 px */
}






.loader-a {
    margin: auto;
    border: 5px solid #EAF0F6;
    border-top-width: 5px;
    border-top-style: solid;
    border-top-color: rgb(234, 240, 246);
    border-radius: 100%;
    border-top: 20px solid #FFF;
    width: 100px;
    height: 100px;
    animation: spinner-a 1.2s linear infinite;
}



@keyframes spinner-a {

    0% {
        transform: rotate(0deg);
        border: 5px solid #EAF0F6;
        border-top: 20px solid #FFF;
        border-radius: 100%;
        width: 100px;
        height: 100px;
        transform: rotate(0);
        animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    }

    50% {
        transform: rotate(360deg);
        border: 10px solid #F00;
        border-top: 14px solid #F00;
        border-radius: 30%;
        width: 60px;
        height: 80px;
        transform: rotate(900deg);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    100% {
        transform: rotate(0deg);
        border: 5px solid #EAF0F6;
        border-top: 20px solid #FFF;
        border-radius: 100%;
        width: 100px;
        height: 100px;
        transform: rotate(1800deg);
    }
}















.bq-gray-1 {
    background: #15181b
}

.color-green {
    color: #80c26e;
}





.context {
    width: 100%;
    position: absolute;
    top: 15rem;
}

    .context h1 {
        text-align: center;
        color: #fff;
        font-size: 50px;
    }


.area {
    background: #141719;
    background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8);
    width: 100%;
    height: 100vh;
}

.circles {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: -1
}

    .circles li {
        position: absolute;
        display: block;
        list-style: none;
        width: 20px;
        height: 20px;
        background: rgba(255, 255, 255, 0.2);
        animation: animate 10s linear infinite;
        bottom: -150px;
        border-radius: 0.5rem !important;
    }

        .circles li:nth-child(1) {
            left: 25%;
            width: 80px;
            height: 80px;
            animation-delay: 0s;
        }


        .circles li:nth-child(2) {
            left: 10%;
            width: 20px;
            height: 20px;
            animation-delay: 2s;
            animation-duration: 12s;
            background: rgba(255, 255, 255, 0.3);
        }

        .circles li:nth-child(3) {
            left: 70%;
            width: 20px;
            height: 20px;
            animation-delay: 4s;
        }

        .circles li:nth-child(4) {
            left: 40%;
            width: 60px;
            height: 60px;
            animation-delay: 0s;
            animation-duration: 5s;
            background: rgba(255, 255, 255, 0.4);
        }

        .circles li:nth-child(5) {
            left: 65%;
            width: 20px;
            height: 20px;
            animation-delay: 0s;
        }

        .circles li:nth-child(6) {
            left: 75%;
            width: 110px;
            height: 110px;
            animation-delay: 3s;
        }

        .circles li:nth-child(7) {
            left: 35%;
            width: 150px;
            height: 150px;
            animation-delay: 7s;
        }

        .circles li:nth-child(8) {
            left: 50%;
            width: 25px;
            height: 25px;
            animation-delay: 15s;
            animation-duration: 45s;
        }

        .circles li:nth-child(9) {
            left: 20%;
            width: 15px;
            height: 15px;
            animation-delay: 2s;
            animation-duration: 35s;
        }

        .circles li:nth-child(10) {
            left: 85%;
            width: 150px;
            height: 150px;
            animation-delay: 0s;
            animation-duration: 11s;
        }

.triangles li {
    position: absolute;
    list-style: none;
    animation: animate 10s linear infinite;
    animation-delay: 0s;
    bottom: -499px;
    border-radius: 10rem;
    background: url(/images/white-logo.svg);
    background-size: auto;
    background-size: cover;
}






.container-1600 {
    width: 75%;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
}


.triangles li:nth-child(1) {
    left: 20%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}


.triangles li:nth-child(2) {
    left: 5%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}

.triangles li:nth-child(3) {
    left: 67%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}

.triangles li:nth-child(4) {
    left: 38%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 5s;
}

.triangles li:nth-child(5) {
    left: 60%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}

.triangles li:nth-child(6) {
    left: 67%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}

.triangles li:nth-child(7) {
    left: 30%;
    width: 150px;
    height: 150px;
    animation-delay: 7s;
}

.triangles li:nth-child(8) {
    left: 44%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
}

.triangles li:nth-child(9) {
    left: 24%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}

.triangles li:nth-child(10) {
    left: 76%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s;
}




@keyframes animate {
    0% {
        transform: translateY(0) rotate(0deg) scale(1);
        opacity: 1;
        border-radius: 0.5rem;
    }

    50% {
        transform: translateY(-500px) rotate(360deg) scale(0.5);
        opacity: 0.5;
        border-radius: 0;
    }

    100% {
        transform: translateY(-1000px) rotate(720deg) scale(0,9);
        opacity: 0;
        border-radius: 2rem;
    }
}



.item-vip-subscription {
    background: #121517;
    padding: 1rem;
    border-radius: 1.4rem;
    align-content: center;
    align-items: center;
    align-self: center;
    color: white;
}

    .item-vip-subscription:hover {
        background-color: #212629;
        color: white;
    }

.avatar-vip-subscription {
    border: 2px solid #ff4f46;
    box-shadow: 0px 0px 50px -10px rgba(255, 69, 60, 0.93);
    border-style: dotted;
}







.section-fill {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    grid-template-rows: repeat(1, 1fr);
    grid-auto-flow: dense;
    grid-gap: 0em;
}

.div-6-fill {
    object-fit: cover;
    object-position: center center;
    width: revert;
    align-items: center;
    justify-content: center;
    background: #090f0f;
    padding: 0.2rem;
    margin: 0.1rem;
    border-radius: 0rem;
    border-radius: 0.2rem;
    z-index: 1;
}

    .div-6-fill:before {
        align-items: center;
    }

.section-fill :first-of-type .div-6-fill:nth-child(2) {
    grid-row: auto /span 2;
    grid-column: auto / span 2;
}

.section-fill + .section-fill .div-6-fill:nth-child(3),
.section-fill + .section-fill .div-6-fill:nth-child(5) {
    grid-row: auto /span 2;
    grid-column: auto / span 2;
}




.my-item-div-6-fill {
    border: 0px !important;
    padding: 2.5rem 2.5rem 2.5rem 2.5rem;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
    min-height: 110px;
    overflow: hidden;
}




.color-dark1 {
    background: #131416 !important;
}

.color-orange {
    color: #f2752b;
}

.p-agreement {
    margin: 0px;
    color: #444;
}

.h-agreement {
    font-size: 24px;
    margin: 30px 0;
    display: block;
    line-height: 1.7;
    text-transform: uppercase;
}



.lib-categories-paneloverlay {
    background: #0909099e;
    padding: 1rem;
}


    .lib-categories-paneloverlay:hover {
        background: #3837375c;
        padding: 1rem;
    }


.color-gray-2 {
    color: #c1c1c1;
}



.lib-overlay-item {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.84); /* Черный фон с прозрачностью 0.7 */
    color: white; /* Белый текст */
    opacity: 1; /* Изначально видим */
    transition: opacity 0.3s; /* Плавный переход opacity */
    margin: 0;
}


.lib-overlay-item-plus {
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
    color: #fff;
}

.my-flex:hover .lib-overlay-item-plus {
    display: flex !important;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 2rem;
    font-size: 15pt;
    align-content: center;
    background: linear-gradient(150deg, #171717de -0%, #202429d6 99%);
}

.my-flex {
    transition: opacity 0.3s; /* Плавный переход opacity */
    background-size: cover !important;
    background-position: center !important;
}

.my-overlay {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.84); /* Черный фон с прозрачностью 0.7 */
    color: white; /* Белый текст */
    opacity: 1; /* Изначально видим */
    transition: opacity 0.3s; /* Плавный переход opacity */
    margin: 0;
}

.my-flex:hover .my-overlay {
    opacity: 0.2; /* При наведении делаем overlay невидимым */
}



.my-overlay-card {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    color: white; /* Белый текст */
    opacity: 1; /* Изначально видим */

    margin: 0;
}



.bq-none {
    background: none !important
}




.category-container {
    min-width: 350px;
    width: 100%;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.my-flex {
    position: relative;
    transition: opacity 0.3s;
}

.my-overlay {
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    opacity: 1;
    transition: opacity 0.3s;
    width: 90%; /* Устанавливаем ширину на 90%, чтобы оставить отступы по краям */
    text-align: center; /* Центрируем текст */
}

.category-container:hover .my-overlay {
    opacity: 0;
}



.wen-news-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
    color: #fff;
    opacity: 0;
    z-index: 2
}

    .wen-news-overlay:hover {
        opacity: 1.0
    }

.my-plus {
    position: absolute;
    width: 100%;
    height: 100%;
    display: none;
    color: #fff;
}


.my-flex:hover .my-plus {
    display: flex !important;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 2rem;
    font-size: 25pt;
    border: 3px dashed #fff;
}

.my-flex:hover .my-plus-lock {
    border: 3px dashed #aa3131;
    color: #ff3737;
}

.category-not-selected-set {
    width: 100%;
    pointer-events: none;
    border: 3px dashed #fff0;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 210px;
    display: flex;
    justify-content: center;
}



.bank-card-item {
    width: 100%;
    background: url('/images/bank/bankcard_bq.jpg');
    background-position: center;
    background-size: cover;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 210px;
    display: flex;
    justify-content: center;
    padding: 2.0rem
}



.adv-not-selected-set {
    width: 100%;
    pointer-events: none;
    border: 3px dashed #fff0;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 500px;
    display: flex;
    justify-content: center;
}







.category-selected-set {
    width: 100%;
    pointer-events: none;
    height: 100%;
    border: 3px dashed #3f6553;
    border-radius: 1rem;
    background: #152117e3;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 210px;
    display: flex;
    justify-content: center;
}



.category-disabled-set {
    width: 100%;
    pointer-events: none;
    height: 100%;
    border-radius: 1rem;
    background: #0000006e;
    border: 3px dashed #fff0;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 210px;
    display: flex;
    justify-content: center;
}

.category-disabled-text {
    color: #8c8c8c;
}


.category-selected-checked {
    position: absolute;
    top: 0;
    font-size: 25pt;
    display: block;
    right: 0;
    padding: 0px 1rem;
}



.form-disabled-color-important {
    color: #adadad3d !important;
}


    .form-disabled-color-important:checked {
        color: #adadad3d !important;
        pointer-events: none;
    }


.font-26 {
    font-size: 26pt
}

.grid-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px; /* Отступ между элементами сетки */
    width: 100%
}

.grid-container-category-main {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px; /* Отступ между элементами сетки */
    width: 100%
}


.grid-container-categories-sets {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px; /* Отступ между элементами сетки */
    width: 100%
}


.grid-container-categories-sets2 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px; /* Отступ между элементами сетки */
    width: 100%
}

.grid-container-lib {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px; /* Отступ между элементами сетки */
    width: 100%
}









.lib-list-products-item-type {
    font-size: 10pt;
    font-weight: initial;
    color: #9d9d9d !important;
    text-align: left;
    position: absolute !important;
    z-index: 5;
    left: 0;
    bottom: 0;
    padding: 0.3rem 0.8rem !important;
    padding-left: 0.8rem;
    background: #00000038;
    padding-left: 2rem !important;
    border-radius: 0px 1rem 0px 0px;
}

.lib-list-products-item-title {
    color: #e7e7e7;
}

.lib-list-products-item-cover {
    object-fit: cover;
    object-position: top center;
    position: absolute;
    left: 0;
    right: 0;
    pointer-events: none;
    z-index: 0;
    top: 0;
    width: 100%;
}


.lib-list-products-item-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    border-bottom: 1px solid #77777726;
    background-image: linear-gradient(-150deg, #21212161 -20%, #000 99%);
}



    .lib-list-products-item-overlay:hover {
        background-image: linear-gradient(180deg, #21212161 -10%, #505050 119%);
    }

.library-list-item-product-active {
    background-image: linear-gradient(80deg, #2c704d96 -20%, #0f110c73 99%) !important;
    background: #000000ab;
}


.log-money-input {
    min-height: 120px;
    padding-top: 5rem !important;
    font-weight: 600;
    margin-top: 1rem
}

.log-money-input-pt {
    padding-top: 1rem !important;
}


.log-panel-money-clear {
    color: #88c26e !important;
    background-color: #121111;
    padding: 1rem;
    width: 100%;
    border-radius: 0.5rem;
    background: linear-gradient(150deg, #2d3136 -0%, #131317 99%);
}

.log-panel-notice {
    color: #fff !important;
    background-color: #121111;
    padding: 1rem;
    width: 100%;
    border-radius: 0.5rem;
    background: linear-gradient(150deg, #a03737 -30%, #131317 99%);
}






.fx-circles-1 {
    background: rgba(255, 255, 255, 0.06);
}




.lib-file-item-title {
    font-size: 10pt;
    margin-bottom: 0.1rem;
    color: #797979;
}

.lib-file-item-line-1 {
    bottom: 0;
    left: 0;
    right: 0;
    background: #0204048a;
}

.lib-file-item-icon {
    align-content: center;
    align-items: center;
    padding: 1.0rem 0.5rem;
    text-align: center;
    justify-content: center;
    padding: 1rem 2rem;
    min-width: 152px;
}

.lib-file-item-titlename {
    align-content: center;
    align-items: center;
    padding: 1.2rem;
    text-align: center;
    justify-content: center;
    font-size: 11pt;
    font-weight: 600;
}


.lib-file-subitem {
    align-content: center;
    align-items: center;
    padding: 1.0rem 0.5rem;
    text-align: center;
    justify-content: center;
}


.lib-file-download-btn {
    background: #522424;
    align-content: center;
    align-items: center;
    text-align: center;
    justify-content: center;
    color: #fff;
    font-weight: 600;
}

    .lib-file-download-btn:hover {
        background: #682b2b;
    }



.lib-file-item-box-shadow {
    width: 100%;
    position: absolute;
    height: 40px;
    box-shadow: 0px 15px 200px -10px rgb(134, 172, 174);
    top: -45px;
    min-width: 500px;
}



.lib-file-item-box-shadow-2 {
    box-shadow: 0px 15px 200px -20px rgb(134, 172, 174);
}


.lib-box-shadow-3 {
    box-shadow: 0px 15px 900px -20px rgb(134, 172, 174);
    position: absolute;
    height: 50px;
    min-width: 4000px;
    top: -50px;
}



.lib-file-subitem-div {
    background-image: linear-gradient(180deg, #0000 -20%, #22262a 99%);
    padding: 0px;
}



.lib-btm-0 {
    bottom: 0;
    left: 0;
    right: 0;
}


.lib-bt-0 {
    top: 0;
    bottom: 0;
    word-wrap: anywhere;
    position: relative;
}


.type-bankAccount-item {
    width: 100%;
    pointer-events: none;
    border: 3px dashed #fff0;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 200px;
    display: flex;
    justify-content: center;
}


.type-project-item {
    width: 100%;
    pointer-events: none;
    border: 3px dashed #fff0;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 300px;
    display: flex;
    justify-content: center;
}


.news-global-item {
    width: 100%;
    pointer-events: visible;
    border: 0px dashed #fff0;
    align-items: center;
    justify-content: center;
    padding: 1.0rem;
    position: absolute;
    height: 100%;
    background: -webkit-linear-gradient(-10deg, #0000004a 20%, #000000f5 99%);
    background: -moz-linear-gradient(-10deg, #0000004a 20%, #000000f5 99%);
    background: -o-linear-gradient(-10deg, #0000004a 20%, #000000f5 99%);
    background: linear-gradient(-10deg, #222121a6 20%, #141414f5 99%);
    -webkit-transition: background 1s ease-out;
    -moz-transition: background 1s ease-out;
    -o-transition: background 1s ease-out;
    transition: background 1s ease-out;
    z-index: 1;
    transition: background 0.2s ease-out;
}

    .news-global-item:hover {
        background: linear-gradient(-10deg, #4f4d4d99 20%, #000000f5 99%);
    }


.lib-product-mini-item {
    background-position: top center !important;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    object-fit: cover !important;
    object-position: center;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    min-height: 250px;
    width: auto;
    min-height: 190px;
}

.grid-container-adv {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(465px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}


.type-adv-item {
    width: 100%;
    pointer-events: none;
    border: 3px dashed #fff0;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 400px;
    display: flex;
    justify-content: center;
}




.grid-container-type-project {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(265px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}



.grid-container-statistics-1 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(255px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}






.grid-container-bank-accounts {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(395px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}



.grid-container-news-global {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(800px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
    min-height: 200px;
}

.max-height-500 {
    height: 500px !important;
}


.product-adv {
    background-size: cover !important;
    background-position: center !important;
    background: linear-gradient(150deg, #272a2d4f -0%, #8996a39e 99%);
}

.product-type-project-x {
    background-size: cover !important;
    background-position: center !important;
    background: linear-gradient(150deg, #272a2d -0%, #8996a3 99%);
    border-radius: 0.4rem;
    overflow: hidden;
}

.lib-startpage-item {
    background-size: cover !important;
    background-position: center !important;
    background: linear-gradient(150deg, #272a2d -0%, #8996a3 99%);
}


.global-news-x {
    background-size: cover !important;
    background-position: center !important;
    object-position: center;
    object-fit: cover;
    background: linear-gradient(150deg, #272a2d00 20%, #8996a3e3 99%);
    max-width: 1055px;
    z-index: 0;
}

.product-type-category-x {
    background-size: cover !important;
    background-position: center !important;
    background: linear-gradient(150deg, #171717de -0%, #202429d6 99%);
    border: 0px;
}

.product-type-rules-x {
    background-size: cover !important;
    background-position: center !important;
    background: linear-gradient(150deg, #171717de -0%, #202429d6 99%);
    border: 0px;
}




.lib-product-item-set {
    width: 100%;
    pointer-events: none;
    border-radius: 1rem;
    background: #152117e3;
    align-items: end;
    height: 210px;
    display: flex;
    justify-content: center;
    background-size: cover !important;
    background-position: center !important;
    background: linear-gradient(180deg, #17171700 -0%, #202429e0 89%);
    background: linear-gradient(180deg, #fff0 -0%, #00000038 89%);
}


.lib-product-overlay-link {
    color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.lib-product-overlay-sublink {
    color: #fff;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background: #100d0d;
    padding: 0.6rem 0.9rem;
    border-radius: 0.3rem;
    display: flex;
    justify-content: start;
    justify-items: center;
    align-items: center;
}


.text-red {
    color: #f64444 !important;
}

.lib-product-item-mini {
    padding: 0.5rem;
    background: #090908;
    background: #1212128c;
    overflow: hidden;
    border-radius: 1rem;
    min-height: 390px;
    height: 100%
}

.lib-product-overlay-sublink:hover {
    color: #fff;
    background: #282323;
}


.lib-product-footer-sublink {
    padding: 1rem !important;
    padding-top: 1rem;
    margin: 0rem !important;
    margin-top: 0rem;
    border-radius: 0rem 0rem 1rem 1rem;
    padding-top: 1rem !important;
    min-height: 160px;
}

.lib-product-header-img {
    background-size: cover !important;
    background-position: center !important;
    box-shadow: 0px 21px 130px -50px rgba(244, 54, 54, 0.82);
}

.grid-container-stats-products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100px, 100px));
    grid-auto-rows: auto;
    grid-gap: 0px;
    width: 100%;
    height: 100px;
}

.rules-not-selected-set {
    width: 100%;
    pointer-events: none;
    border: 3px dashed #fff0;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    height: 350px;
    display: flex;
    justify-content: center;
    background: #f6f6f6 !important;
    color: #414141;
    padding: 3rem;
}


.policy-item-set {
    width: 100%;
    pointer-events: none;
    border: 3px dashed #fff0;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    display: flex;
    justify-content: center;
    background: #f6f6f6 !important;
    color: #414141;
    padding: 3rem;
}

.color-gray-rules {
    color: #606060;
}

.grid-rules-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(600px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}

.stats-overlay-header {
    background: linear-gradient(0deg, #880000d6 -0%, #0a0a0a 99%);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
}




.lib-news-tag-title {
    padding: 5px 10px;
    background: #000;
    border-radius: 0.5rem;
    align-self: center;
    align-content: center;
    align-items: center;
    justify-content: center;
    display: flex;
}






.lib-news-img-cover {
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%;
    background-size: cover !important;
    background-position: center !important;
    height: 100%;
    z-index: 0;
    pointer-events: none
}





.email-confirmed {
    background: #3b5b36;
    color: white;
}

.email-not-confirmed {
    color: #ff9814;
}

.deletion-requested {
    background: #3b5b36;
    color: white;
}

.deletion-not-requested {
    color: #ff9814;
}



.lib-upload-img-profile {
    border-radius: 10rem !important;
    overflow: hidden;
    box-shadow: 0px 0px 144px 0.1rem rgba(255, 255, 255, 0.23) !important;
    height: 100px;
    width: 100px;
    border: 2px solid #272727;
}


.custom-file-profile-upload {
    display: inline-block;
    padding: 1.0rem;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #3f3f3fd6;
}


.lib-user-account-item {
    border-radius: 1rem;
    position: relative;
    z-index: 0;
    margin: 1rem 0rem 1rem 0rem;
}

.tooltip-inner {
    max-width: 380px;
}


.wen-icon-tooltip {
    border-radius: 1rem;
    height: 25px;
    width: 25px;
    display: inline-block;
    align-content: center;
    text-align: center;
    color: #c8c8c8;
    font-weight: 800;
    font-size: 15pt;
}

.min-h80 {
    min-height: 80px;
}

.rules-license-item {
    background-color: #fff !important;
    border: 1px solid #efefef;
}

.nav-pills .rules-license-item.active, .nav-pills .show > .rules-license-item {
    background-color: #f4f4f4 !important;
    border: 1px solid #dbdbdb;
}



.list-group-item-refund {
    padding: 1.5rem;
    margin: 0.2rem 0rem;
    border: 0 !important;
    border-top-width: 0px;
    border-radius: 2rem !important;
    background: white;
}

.list-group-item-startpage {
    padding: 1.2rem;
    margin: 0.2rem 0rem;
    border: 0 !important;
    border-top-width: 0px;
    border-radius: 2rem !important;
    background: white;
}

.panel-allBankAccount {
    display: none
}


.text-orange {
    color: #db751b !important;
}


.lib-product-price-info {
    min-width: 90px;
}


.text-green {
    color: #86d04a !important
}


.lib-title-muted {
    color: #96989f;
    font-weight: 400;
    margin-bottom: 0rem;
    padding-bottom: 0rem;
    line-height: 1;
    border: 0px !important;
}

.page-partners-about-img {
    position: relative;
    z-index: 1;
    background-position: center;
    height: 1000px;
    width: 100%;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
}
.list-group-horizontal > .list-group-item:last-child:not(:first-child) {
  
    border: 0px !important;
}
.page-partners-about-img-header {
    position: relative;
    z-index: 1;
    background-position: center;
    height: 250px;
    width: 700px;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    margin: 0 auto;
    background-position: center !important;
}

.page-partners-about-button {
    padding: 1.5rem 2rem;
    min-width: 200px
}



.bank-account-nametag {
    background: #639a2f;
    padding: 0.5rem 1rem;
    border-radius: 0.3rem;
    color: #000;
    margin: 6px 6px 0px 0px !important;
    font-size: 12pt;
    width: 420px;
    font-weight: 600;
}



.input-color-container {
    position: relative;
    overflow: hidden;
    width: 40px;
    height: 40px;
    border-radius: 40px;
}


input[type="color"] {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: none;
    border: 0;
    cursor: pointer;
    height: 55px;
    padding: 0;
    width: 55px;
}

.input-color {
    position: absolute;
    right: -8px;
    top: -8px;
    width: 56px;
    height: 56px;
    border: none;
    transform: scale(1.7);
}





::-webkit-color-swatch-wrapper {
    padding: 0;
}

::-webkit-color-swatch {
    border: 0;
    border-radius: 0;
}

::-moz-color-swatch,
::-moz-focus-inner {
    border: 0;
}

::-moz-focus-inner {
    padding: 0;
}



.filter-body {
    padding: 0.4rem;
    background: linear-gradient(150deg, #0e0e0e -0%, #222 99%);
    z-index: 0;
    position: relative;
    border-radius: 1rem;
    min-height:700px
}




.push-menu-lib {
    min-width: 420px;
    overflow: auto;
}


.dropdown-menu {
    transform: translate(-50px, 36px) !important;
    inset: 0px !important;
}



.nav-notifications-item {
    background: #fff;
    border-radius: 0.6rem;
    color: #1c0707;
    border: 1px solid #d7d7d7;
    padding: 1.0rem 0.8rem !important;
}

.nav-drobdown-menu.show {
    border-radius: 0.7rem;
    position: absolute;
    right: 0px !important;
    inset: 0px !important;
}


.color-none {
    background: none !important;
}


.nav-profile-lib {
    padding: 1rem;
    display: flex;
    justify-content: center;
    background: #f3f3f3f2;
    border-radius: 1rem;
    border: 2px solid #353535;
    right: 0px;
    position: absolute;
    top: 20px;
    max-height: 90vh;
}

.color-none {
    background-color: none
}

 


.lib-item-empty {
    background: #000000f2;
    color: #a5a5a5 !important;
    font-weight: 600;
    font-size: 13pt;
    padding: 0px;
    margin: 0px;
}

    .lib-item-empty:hover {
        background: #8b2227f2;
        color: #d2d2d2 !important;
        font-weight: 600;
        font-size: 13pt;
    }

.lib-card-icon {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-content: center;
    align-items: center;
    display: flex;
    text-align: center;
    z-index: 1;
    pointer-events: none
}

.lib-bank-title {
    background: #232323;
    padding: 0.5rem 1rem;
    color: #fff;
    border-radius: 0.4rem;
}



.lib-mini-product-list {
    background: #d55d23;
    padding: 0.4rem;
    min-width: 50px;
    font-size: 20pt;
    text-align: center;
    display: flex;
    justify-content: center;
    border-radius: 0.5rem;
}


.bq-red {
    background: #c2273d;
}













.x-upload-img-form {
    position: relative;
    height: 470px;
    width: 300px;
    text-align: center;
    display: grid;
    justify-items: center;
    align-content: center;
}


.x-sqrt {
    height: 260px;
    width: 260px;
}

.x-rectangle {
    height: 260px;
    width: 350px;
}



.x-upload-img-overlay {
    position: absolute;
    text-align: center;
    padding: 2rem;
    font-size: 12pt;
    font-weight: 600;
    color: #fff;
    width: 100%;
    height: 100%;
    justify-content: center;
    align-items: center;
    display: flex;
    background: #000000b2;
    transition: all .2s ease-in-out;
    border: 4px solid #000;
    border-radius: 0.9rem;
}





.x-label-12 {
    font-weight: 600;
    font-size: 12pt
}

.x-label-20 {
    font-weight: 600;
    font-size: 20pt;
    line-height: 0.8
}


.x-icon-img {
    align-items: center;
    vertical-align: middle;
    margin: 0.5rem;
}

.x-upload-img-overlay:hover {
    background: #0006;
    color: #fff;
    text-shadow: #000 1px 0px 10px;
    opacity: 0.3;
}


.dragover {
    border: 3px dashed #ccc;
}



.x-upload-modal-bottom {
    background: #181818;
    bottom: 0;
    text-align: center;
    justify-items: center;
    display: flex;
    border-radius: 1rem !important;
    margin: 1rem auto;
    border: 0px;
    width: 500px;
    align-items: center;
    text-align: center;
    justify-content: center;
}




    .x-upload-modal-bottom :hover {
        background: #222 !important
    }


.result {
    min-width: 100px;
    min-height: 150px;
    overflow: hidden;
}

.x-upload-modal-content {
    background: #1e1e1e;
    border-radius: 1rem;
    border: 1px solid #2a2a2a;
}

.x-upload-modal-btn {
    color: #a4a4a4;
    font-weight: 600;
}


    .x-upload-modal-btn:hover {
        color: #fff;
    }

.x-upload-text {
    padding: 10px;
    display: flex;
    pointer-events: none
}




.file-drag-area {
    width: 500px;
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px dashed #000;
    cursor: pointer;
    margin: 0 auto;
}

.result-box {
    margin: 20px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    position: relative;
}

.box-2.img-result {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    cursor: pointer;
    overflow: hidden;
    background: #474747;
    padding: 1rem;
    border-radius: 1rem;
    z-index: 0;
}

.hide {
    display: none;
}

.cropped {
    object-fit: cover;
    object-position: center;
    background-position: center;
    background-size: cover;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
}




.lib-dev-edit-product {
    background: linear-gradient(50deg, #151718 -0%, #1b1f22 99%) !important;
    border-left: 0;
    border-right: 0;
    border-top: 1px solid #050505;
}







.color-gray-3 {
    color: #707070;
    font-weight: 400;
}



.ban-image {
    width: 294px;
    height: 367px
}

.btn-preview-product {
    background-color: #ae3232bf !important;
}

    .btn-preview-product:hover {
        background-color: #6f2828bf !important;
    }






@keyframes growProgressBar {
    0%, 33% {
        --pgPercentage: 0;
    }

    100% {
        --pgPercentage: var(--value);
    }
}

@property --pgPercentage {
    syntax: '<number>';
    inherits: false;
    initial-value: 0;
}

div[role="progressbarCircle"] {
    --size: 12rem;
    --fg: green;
    --bg: lightgreen;
    --pgPercentage: var(--value);
    animation: growProgressBar 3s 1 forwards;
    width: var(--size);
    height: var(--size);
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: radial-gradient(closest-side, white 80%, transparent 0 99.9%, white 0), conic-gradient(var(--fg) calc(var(--pgPercentage) * 1%), var(--bg) 0);
    font-family: Helvetica, Arial, sans-serif;
    font-size: calc(var(--size) / 5);
    color: var(--fg);
}

    div[role="progressbarCircle"]::before {
        counter-reset: percentage var(--value);
        content: counter(percentage) '%';
    }








.accordion-item {
    color: #c2c2c2;
}



.wen-nav-bardark {
    background: #0f0f0f6e;
    font-size: 11pt;
    font-weight: 600;
}

.wen-mega-menu {
    width: 100%;
    padding: 20px;
}





.wen-mega-menu-item {
    background: none !important;
    padding: 0.4rem 0.8rem;
    border-radius: 0.8rem;
    margin: 0px;
    box-sizing: border-box;
}


    .wen-mega-menu-item:hover {
        background: #efefef !important;
    }


.wen-search-menu {
    margin-right: -3.2rem !important;
    z-index: 1;
    pointer-events: none;
    position: absolute;
    align-items: center;
    height: 100%;
    margin: 0rem 0.6rem;
    color: #7a7a7a;
    border: 0px;
    font-size: 14pt;
    font-weight: lighter;
}




.dropdown-menu-megamenu {
    position: absolute;
    box-sizing: border-box;
    display: none;
    background: aquamarine;
    width: auto;
    padding: 24px;
    box-shadow: 0px 8px 8px 0px rgba(24,26,32,.08);
    background: none;
}





.wen-mega-menu .d-flex.flex-wrap > * {
    flex: 1;
}



.wen-mega-menu .d-flex.flex-wrap {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min-content, 1fr));
    grid-gap: 36px;
}





.nav-item.dropdown:hover .dropdown-menu-megamenu {
    position: absolute;
    background: none;
}




.wen-mega-item-title {
    padding: 0.1rem 0.5rem;
    color: #838383;
}

.wen-mega-menu-subbody {
    position: relative;
    box-shadow: 0px 8px 8px 0px rgba(24,26,32,.08);
    background: #fff;
    padding: 1.3rem;
    border-radius: 1rem;
    width: fit-content;
}


.dropdown-menu-megamenu {
    width: auto;
    min-width: 300px;
}



.bq-none-color, .bq-none-color:active, .bq-none-color:hover, .bq-none-color:visited, .bq-none-color:focus {
    background: none !important;
    color: inherit;
}

    .bq-none-color:hover {
        background: none !important;
    }

.color-gray-title {
    color: #555 !important
}



.max-width400 {
    max-width: 400px;
}

.min-heigt40 {
    min-height: 40px;
}



.wen-price-product {
    border: 0px !important;
    background: #b33737 !important;
    border-radius: 1.2rem !important;
    padding: 0.3rem 1.5rem !important;
    width: auto;
    display: inline-grid;
    min-width: 150px;
    max-width: 350px;
}



.wen-additional-art-info {
    position: relative;
    bottom: 0;
}

.modal-art {
    position: relative;
    overflow: hidden;
}


.wen-lib-mini-menu-item {
    display: flex;
    align-content: center;
    align-items: center;
    align-self: center;
    width: 100%;
    padding: 1rem;
    justify-content: center;
    justify-items: center;
    justify-self: center;
}


.img-thumbnail-art {
    border-radius: .25rem;
    width: 100%; /* Makes the image responsive */
    height: auto; /* Maintains aspect ratio */
    object-fit: cover; /* Ensures the image covers the area without stretching */
}

.wen-additional-info {
    position: absolute;
    bottom: 0;
    padding: 2rem 1rem;
    left: 5%;
    right: 5%;
}
/* если внутри label есть выбранный radio, то перекрашиваем .text-muted */
.w-tileset-btn:has(input[type="radio"]:checked) .text-muted {
    color: #fff !important;
}


.wen-search-placholder {
    padding: 0.8rem;
    border-radius: 1rem !important;
    color: #ebebeb !important;
}

    .wen-search-placholder::placeholder {
        color: rgb(87, 87, 87);
        opacity: 1; /* Firefox */
    }

.wen-modal-media {
    background-color: #110e0e91;
}


.card-img-art {
    position: relative;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1rem;
    border-radius: calc(.25rem - 1px);
}




.wen-modal-img {
    max-width: 100%; /* максимальная ширина изображения - 100% ширины модального окна */
    max-height: 100%; /* максимальная высота изображения - 100% высоты модального окна */
    object-fit: contain; /* сохранение пропорций изображения */
    border-radius: 1rem !important;
    overflow: hidden;
}

.full-screen-img {
    width: 100vw; /* ширина изображения равна 100% ширины окна просмотра */
    height: 100vh; /* высота изображения равна 100% высоты окна просмотра */
    object-fit: contain; /* масштабирует изображение, сохраняя пропорции */
    position: fixed; /* фиксированное позиционирование */
    top: 50%; /* центрирование по вертикали */
    left: 50%; /* центрирование по горизонтали */
    transform: translate(-50%, -50%); /* выравнивание по центру */
    z-index: 1; /* установка высокого Z-индекса, чтобы изображение было поверх других элементов */
}



form.search-form {
    display: flex;
    align-items: center;
    width: 100%;
}



.wen-brand {
    white-space: normal;
    text-align: center;
    word-break: break-all;
    padding: 1.7rem;
    border-radius: 5rem;
    position: relative;
}



.wen-brand-body {
    background: #6e2020;
    height: 115px;
    width: 100px;
    position: absolute;
    top: -1rem;
    z-index: 0;
    margin: 0 auto;
    text-align: center;
    left: 0;
    right: 0;
    border-radius: 0rem 0rem 5rem 5rem;
    border: 0.4rem solid #0f0f0f;
    border-top: 0px;
    background-image: linear-gradient(180deg, #0f0f0f 00%, #b72929fa 99%);
}




.wen-cover-info-product {
    background-image: linear-gradient(90deg, #131313f7 30%, #46454500 119%);
    position: absolute;
    top: 0%;
    left: 0%;
    right: 0%;
    bottom: 0%;
    height: 700px !important;
}


.wen-grid-info-product {
    position: absolute;
    width: auto;
    left: 5%;
    right: 5%;
    top: 15%;
    bottom: 15%;
    color: #fff;
    grid-template-columns: 1.8fr 1fr;
    gap: 20px;
    -moz-column-gap: 1.5rem;
    column-gap: 1.5rem;
    display: grid;
}



.wen-media-object-item {
    color: #fff;
    height: 100%;
    display: flex;
    width: 100%;
    position: relative;
    box-sizing: content-box;
    border-radius: 2rem !important;
    overflow: hidden;
    min-height: 300px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}


    .wen-media-object-item:hover {
        background: #2d2d2d;
        cursor: pointer;
        box-shadow: 0px 0px 40px -20px rgb(255, 255, 255);
        transform: scale(1.01);
        transform: scale(1.01);
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }



.wen-carousel {
    background-image: linear-gradient(0deg, #181a1c 30%, #141414 89%);
}

.wen-overlay-price {
    border-radius: 0.5rem;
    background-image: linear-gradient(90deg, #0000 20%, #2424249c 99%)
}


.wen-items-nav-product {
    background: none !important
}


 


.blur-background {
    position: absolute;
    background-position: center !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Применение размытия к фону за элементом */
    backdrop-filter: blur(0.5rem);
    filter: blur(0.5rem);
    -webkit-filter: blur(0.5rem);
    /* Для обеспечения совместимости с браузерами, которые не поддерживают backdrop-filter */
    -webkit-backdrop-filter: blur(0.5rem);
    /* Прозрачный фон, чтобы было видно размытый фон */
    background-color: rgba(255, 255, 255, 0.5);
    opacity: 0.2;
}

.blur-image {
    /* Применение размытия к изображению */

    filter: blur(3rem);
    /* Для обеспечения совместимости с браузерами, которые не поддерживают filter */
    -webkit-filter: blur(10px);
}

.wen-product-page-header-cover {
    position: relative;
    object-fit: fill;
    height: 100%;
    max-height: 1000px;
    min-height: 700px !important;
    background-size: cover;
    object-fit: cover;
    left: 0;
    object-position: center;
    width: 100%;
    object-position: 90% 50%;
}

#gameFrameContainer {
    border: 0px !important;
    border-radius: 0rem !important;
    overflow: hidden;
    height: 80vh;
}

.pointer-event-none {
    pointer-events: none
}

.wen-cover-container {
    height: 700px !important;
    width: 100%;
    object-fit: cover;
    object-position: center;
    margin: 0 auto;
    display: contents;
    position: relative;
    max-height: 1100px;
    min-height: 700px !important;
    box-shadow: 0px 0px 100px 20px rgba(0, 0, 0, 0.62);
    z-index: 1
}

.wen-list-files-item {
    background: #131416;
    padding: 1rem 1.2rem;
    display: flex;
    align-items: center;
    border-radius: 0.6rem;
    gap: .5rem !important;
    color: #96c65c;
    font-weight: 600;
    margin: 0.3rem 0rem;
}

.snow-flakes {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 9999;
    width: 100%;
}





@media (max-width: 1799px) {
    .wen-grid-info-product {
        grid-template-columns: 1fr;
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem;
        display: grid;
    }





    .wen-cover-info-product {
        max-height: 1100px !important;
        min-height: 880px !important;
    }

    .wen-cover-container {
        height: auto;
        max-height: 1100px;
        min-height: 880px !important;
    }

    .lib-additional-panel {
        max-width: 100%;
        min-width: 350px;
    }
}










@media (max-width: 1399px) {
    .wen-grid-info-product {
        grid-template-columns: 1fr;
        -moz-column-gap: 1.5rem;
        column-gap: 1.5rem;
        display: grid;
    }

    .dropdown-menu-megamenu {
        position: static;
        margin-bottom: 5rem;
    }

    .wen-mega-menu-item {
        color: #fff
    }

    .nav-item.dropdown:hover .dropdown-menu-megamenu {
        position: static;
        background: none;
    }


    .wen-mega-menu-subbody {
        background: none;
    }



    .section-687adv {
        grid-template-columns: repeat(2, 1fr);
    }
}

.wen-brand {
    margin-bottom: 0.5rem;
}

.wen-product-page-header-cover {
    object-position: 80% 50%;
}








@media (max-width: 999px) {
    .wen-product-page-header-cover {
        max-height: 1700px !important;
        min-height: 1180px !important;
    }

    .wen-cover-info-product {
        max-height: 1700px !important;
        min-height: 1180px !important;
    }

    .wen-cover-container {
        height: auto;
        max-height: 1800px;
        min-height: 1180px !important;
    }
}



@media (max-width: 699px) {
    .section-687adv {
        grid-template-columns: repeat(1, 1fr);
    }

        /* По умолчанию каждый блок div-5 занимает один столбец */
        .section-687adv > .div-6 {
            grid-column: span 1;
        }

            /* Пятый блок (первый блок второго ряда) будет занимать 2 столбца */
            .section-687adv > .div-6:nth-child(5) {
                grid-column: span 1;
            }
}




@media (max-width: 899px) {

    .wen-product-page-header-cover {
        max-height: 1700px !important;
        min-height: 1380px !important;
    }

    .wen-cover-info-product {
        max-height: 1700px !important;
        min-height: 1380px !important;
    }

    .wen-cover-container {
        height: auto;
        max-height: 1800px;
        min-height: 1380px !important;
    }

   
}




.max-width-1600 {
    max-width: 1600px
}

.max-width-400 {
    max-width: 400px
}

.max-width-500 {
    max-width: 500px
}

.lib-min-w35 {
    min-width: 35px
}


.disabled-btn {
    pointer-events: none !important;
    color: #626262 !important;
}



.wen-success-panel-product {
    background: #74212100 !important;
    border: 2px solid #aee21c;
    color: #b4ec1c !important;
    font-weight: 600;
    text-transform: uppercase;
}


.wen-warning-panel-product {
    background: #74212100 !important;
    border: 2px solid #f9553a;
    color: #f9553a !important;
    font-weight: 600;
    text-transform: uppercase;
}

.wen-line-success {
    background: linear-gradient(50deg, #293f21 -0%, #1b1f22 99%) !important;
}



.wen-line-danger {
    background: linear-gradient(50deg, #4b1a1a -0%, #1b1f22 99%) !important;
}

.log-panel-green {
    color: #fff !important;
    background-color: #121111;
    padding: 1rem;
    width: 100%;
    border-radius: 0.5rem;
    background: linear-gradient(150deg, #8fab2d -0%, #131317 99%);
    font-weight: 600 !important;
}




.wen-artwork-mini {
    position: absolute;
    top: 0;
    bottom: 0px;
    left: 0px;
    right: 0px;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(-90deg, #26262626 -200%, #0e0e0ee0 99%);
    padding: 2rem !important
}

.wen-artwork-link {
    position: relative;
}

.wen-artwork-mini-title {
    font-weight: 600;
    text-transform: uppercase;
    margin: 0px
}


.wen-artwork-mini-description {
    margin: 0px;
    font-size: 10pt;
    text-transform: initial;
    color: #848484;
    font-weight: 400;
}



.text-ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}


.wen-product-steps {
 
    position: relative
}

.wen-product-steps-item {
    border-radius: 5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 55px;
    width: 55px;
}



.wen-product-steps-icon {
    align-self: center !important;
    font-size: 20pt;
}


.wen-products-item-title {
    font-size: 12pt;
    font-weight: 600;
    pointer-events: none
}



.rc-anchor-light {
    background: #84848400 !important;
    color: #fff !important;
    width: 150px;
    border: 0px !important;
}


.category-selected-sets-x {
    height: 130px;
}


.category-list {
    cursor: pointer;
    user-select: none;
}

.category-description-sets-x {
    display: none;
}

.category-item-sets-x:hover .category-description-sets-x {
    display: block;
}





.carousel-control-prev-main {
    height: 90px;
    position: relative;
    margin-top: -5.6rem;
    padding: 2rem;
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 2;
}



.carousel-control-next-main {
    height: 90px;
    position: relative;
    margin-top: -5.6rem;
    padding: 2rem;
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 2;
}




.wen-waveform {
    padding: 2rem;
    background: #c6c6c6;
    margin: 1rem;
    border-radius: 1.5rem;
}





.slider-slc-mini {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    overflow: hidden;
    opacity: 0;
    transition: opacity 0.3s ease;
}









.slider-main-big {
 
    position: relative;
    z-index: 0
}

.time-stripe-content {
    position: absolute;
    left: 0;
    z-index: 9999;
    width: 100%;
    bottom: 3rem;
}

.slider-slc {
    margin: auto;
    position: relative;
    border-radius: 0rem 1.5rem 1.5rem 1.5rem;
    overflow: hidden;
}

    .slider-slc img {
        width: 100%;
        height: auto;
        object-position: 45% 20%;
        min-height: 600px;
        object-fit: cover;
        max-height: 740px;
    }

.slick-slide {
    transition: transform 0.3s, opacity 0.3s;
}

.slick-center {
    z-index: 2;
    opacity: 1.0;
}

.slick-slide:not(.slick-center) {
    border-radius: 1.5rem;
    opacity: 0.7;
}

.slider .slick-prev,
.slider .slick-next {
    position: absolute;
    height: 100%;
    bottom: 0;
    width: 3rem;
    background: rgba(0, 0, 0, 0.5);
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: white;
    font-size: 24px;
    margin: 1rem;
}


.slider-slc .slick-prev {
    left: 0;
    flex-direction: column;
    justify-content: center;
    z-index: 1;
    height: 100%;
    width: 3rem;
    display: flex;
    align-content: center;
    align-items: center;
}

.slider-slc .slick-next {
    right: 0;
    flex-direction: column;
    justify-content: center;
    z-index: 1;
    height: 100%;
    width: 3rem;
    display: flex;
    align-content: center;
    align-items: center;
}

.time-stripes {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

.time-stripe, .time-stripe-main, time-stripe-mini {
    width: 10%;
    height: 4px;
    background-color: gray;
    margin: 0 5px;
    position: relative;
    overflow: hidden;
}

    .time-stripe .progress-slc {
        height: 100%;
        background-color: white;
        position: absolute;
        top: 0;
        left: 0;
        width: 0%;
    }

.slider-content {
    position: absolute;
    color: white;
    padding: 10px;
    border-radius: 5px;
    z-index: 2;
    pointer-events: auto;
    user-select: auto;
    bottom: 0;
    left: 0;
    left: 4%;
    right: 4%;
    bottom: 5rem;
    display: none; /* Hide by default */
}

.slider-content-slc-mini {
    bottom: 8rem;
}

.slider-content-btn {
    background: #111;
    color: black;
    padding: 0.5rem 1rem;
    border-radius: 0.6rem;
    display: flex;
    width: auto;
    position: relative;
    pointer-events: all;
    user-select: all;
    color: #fff;
    font-weight: 600;
    min-width: 120px;
    text-align: center;
    justify-content: center;
    bottom: 0;
    position: absolute;
    margin: 1rem;
    right: 0;
    border: #2f2f2f00 3px solid;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

    .slider-content-btn:hover {
        background: #2f2f2f00;
        border: #fff 3px solid;
    }

.slick-center .slider-content {
    display: block; /* Show only on the central slide */
}




.slide-overlay-content {
    background-image: linear-gradient(180deg, #0000 -30%, #19191af7 99%);
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}




.slide-logo-product {
    width: 197px !important;
    min-height: auto !important;
}

.slide-logo-product-100 {
    width: 100% !important;
    min-height: auto !important;
    object-position: 50% 50% !important;
    margin: 0 auto;
}





.wen-player {
    display: grid;
    grid-template-columns: 10rem 1fr;
    width: 40rem;
    background-color: #16191b;
    border-radius: 0.5rem;
    box-shadow: 0 1rem 1.0rem #3a373724;
    overflow: hidden;
    color: #fff;
}

.wen-thumb {
    background: #121619
}

.wen-player .wen-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.wen-player .info {
    padding: 1rem;
}

.wen-player .detail {
    display: grid;
    grid-template-columns: 1fr 4rem;
    margin-bottom: 1rem;
}

.wen-player .title {
    font-size: 1.5rem;
    padding-bottom: 1rem;
}

    .wen-player .title .time {
        font-size: 0.9rem;
        color: #777;
        margin-top: 0.25rem;
    }

.wen-player .control i {
    width: 3.5rem;
    height: 3.5rem;
    display: grid;
    place-content: center;
    font-size: 1.25rem;
    background-color: #C46638;
    color: white;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 0 0rem #1AAFFFAA;
}

    .wen-player .control i:hover {
        box-shadow: 0 0 1.5rem #753415AB;
        font-size: 1.5rem;
    }



.loading-indicator {
    display: none;
    /* Add more styling as needed */
}

.wen-img-stat-preview {
    position: absolute;
    z-index: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    border: 0px !important;
}

.wen-img-stat-overlay-preview {
    background: linear-gradient(140deg, #262626e8 40%, #3f3f3f7d 99%);
}





.font-40 {
    font-size: 40pt
}

.wen-rotate-10 {
    transform: rotate(-10deg);
    /* Safari */
    -webkit-transform: rotate(-10deg);
    /* Firefox */
    -moz-transform: rotate(-10deg);
    /* IE */
    -ms-transform: rotate(-10deg);
    /* Opera */
    -o-transform: rotate(-10deg);
    /* Internet Explorer */
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}








.wen-bq-tag-top {
    border: 2px solid #b3c5d5;
    color: #94a5b5;
}

.wen-bq-tag-top-2 {
    border: 2px solid #4f5a64;
    color: #94a5b5;
}

.wen-bq-tag-top-3 {
    background: #47505a00;
    border: 2px solid #252a2f;
    color: #545f6a;
}



.font-15 {
    font-size: 15pt
}

.menu-product-title {
    padding: 0.6rem 0.7rem 0.2rem 0.6rem;
    color: #e5a936;
}

.wen-custom-select {
    position: relative; /* якорь для выпадашки */
    display: inline-block;
    min-width: 200px;
    cursor: pointer;
    font:10pt
}

.wen-custom-select-trigger {
    position: relative;
    padding: 0.6rem 1.5rem 0.8rem 0.8rem;
    border: 1px solid #2f2f2f;
    background-color: #0c0c0c;
    border-radius: 1rem;
    color: #cfcfcf;
}

    /* стрелочка */
    .wen-custom-select-trigger::after {
        content: '';
        position: absolute;
        top: 50%;
        right: 1rem;
        transform: translateY(-50%) rotate(45deg);
        border: solid white;
        border-width: 0 2px 2px 0;
        display: inline-block;
        padding: 3px;
        transition: transform 0.1s ease-in-out;
        pointer-events: none; /* чтобы не блокировать клик */
    }

.wen-custom-select.open .wen-custom-select-trigger::after {
    transform: translateY(-50%) rotate(-135deg);
}

/* выпадающий список */
.wen-custom-select-options {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1000; /* поверх всего */
    border: 1px solid #ddd;
    border-top: none;
    background-color: #fff;
    display: none;
    border-radius: 1rem;
    overflow: hidden;
    max-height: 260px; /* если вариантов много */
    overflow-y: auto;
}

.wen-custom-select.open .wen-custom-select-options {
    display: block;
}

.wen-custom-option {
    padding: 1rem;
    border-bottom: 1px solid #eee;
    background-color: #fff;
}

    .wen-custom-option:hover {
        background-color: #f7f7f7;
    }

    /* единый стиль выбранного пункта */
    .wen-custom-option.wen-selected {
        background-color: #eaeaea;
        color: #000;
    }



.note-editor.note-airframe .note-editing-area .note-editable, .note-editor.note-frame .note-editing-area .note-editable {
    min-height: 320px;
}



.section-265 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(265px, 1fr));
    grid-template-rows: repeat(1, 1fr);
    grid-auto-flow: dense;
    grid-gap: 0em;
}


.item-mi-product {
    position: relative
}



.item-mi-img {
    position: relative;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
    border-radius: 0.3rem;
    min-height: 50px;
}

.item-mi-img-400 {
    min-height: 400px
}




.item-mi-product-type {
    font-weight: 600;
    color: #979797;
    padding: 0.2rem;
}

.item-mi-product-title {
    font-weight: 600;
    color: #f5f5f5;
    padding: 0rem 0.2rem 0rem 0.2rem;
    font-size: 10pt;
    letter-spacing: 0;
    display: -webkit-box;
    line-clamp: 2;
    overflow: hidden;
    word-break: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    min-height: 45px;
}

.item-mi-product-badge {
    position: absolute;
    z-index: 1;
    background: #a5001e;
    padding: 0.4rem 1rem;
    right: 0.5rem;
    top: 0.5rem;
    border-radius: 5rem;
    font-size: 10pt;
    font-weight: 600;
    text-transform: uppercase;
    max-height: 35px;
}

.item-mi-product-art-price {
    position: absolute;
    bottom: 0;
    right: 0;
    z-index: 1;
    background: black;
    padding: 0.3rem;
    border-radius: 0.8rem 0px 0px 0px;
}

.item-mi-product-badge-type {
    position: absolute;
    z-index: 1;
    background: #000000c2;
    padding: 0.3rem;
    right: 0;
    top: 0;
    border-radius: 0.3rem;
    font-size: 10pt;
    font-weight: 600;
    text-transform: uppercase;
    max-height: 35px;
    align-content: center;
    align-self: center;
    justify-content: end;
    justify-items: center;
    justify-self: center;
    display: flex;
}

.item-mi-product-addon {
    font-weight: 600;
    color: #f5f5f5;
    padding: 0rem 0.2rem 0rem 0.2rem;
    font-size: 11pt;
    letter-spacing: 0;
    display: -webkit-box;
    line-clamp: 2;
    overflow: hidden;
    word-break: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.item-mi-product-discount {
    padding: 0.3rem 0.5rem;
    background: #bb2743;
    border-radius: 0.6rem;
    font-size: 12pt;
    text-align: center;
    font-weight: 600;
    min-width: 65px;
}

.item-mi-product-free {
    padding: 0.3rem 0.5rem;
    background: #578642;
    border-radius: 0.6rem;
    font-size: 12pt;
    text-align: center;
    font-weight: 600;
    min-width: 58px;
}


.item-mi-product-price {
    padding: 0.3rem 0.5rem;
    justify-content: end;
    border-radius: 0.6rem;
    font-size: 12pt;
    text-align: center;
    font-weight: 600;
    flex-flow: wrap;
}


.item-mi-product-release-announce {
    justify-content: end;
    font-size: 12pt;
    text-align: center;
    font-weight: 600;
    color: #f0802d;
    text-transform: uppercase;
}


.item-mi-product-release-preorder {
    justify-content: end;
    font-size: 12pt;
    text-align: center;
    font-weight: 600;
    color: #f0802d;
    text-transform: uppercase;
}

.item-mi-product-overaly {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7); /* Полупрозрачный черный фон */
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s, visibility 0.5s;
    pointer-events: none;
    z-index: 1;
}

.item-mi-subimg {
    position: relative
}

.item-mi-subimg-2 {
    position: relative;
    background: #131313;
    border-radius: 1rem;
}



/* Показывать кнопки при наведении */
.item-mi-subimg:hover .item-mi-product-overaly {
    opacity: 1;
    visibility: visible;
    border-radius: 0.3rem;
}

/* Показывать кнопки при наведении */
.item-mi-subimg-2:hover .item-mi-product-overaly {
    opacity: 1;
    visibility: visible;
    border-radius: 1rem;
}




.item-mi-product-buttons {
    z-index: 1;
    pointer-events: auto;
    font-size: 18pt;
    height: 50px;
    width: 50px;
    text-align: center;
    align-items: center;
    justify-items: center;
    display: grid;
    background: #0009;
    border-radius: 1rem;
}

.item-mi-product-platform {
    position: absolute;
    z-index: 1;
    right: 0.5rem;
    border-radius: 5rem;
    font-size: 10pt;
    font-weight: 600;
    text-transform: uppercase;
    max-height: 35px;
    bottom: 0.5rem;
}

.item-mi-like-add {
    border: 0px;
    color: #fff;
}

.item-mi-favorite-add {
    border: 0px;
    color: #fff;
}

.item-mi-edit-product {
    border: 0px;
    color: #fff;
}

.item-mi-download {
    border: 0px;
    color: #fff;
}

.item-mi-cart-add {
    border: 0px;
    color: #fff;
}

.item-mi-buyed {
    position: absolute;
    z-index: 1;
    right: 0;
    color: #b7b7b7;
    background: #202020;
    height: 35px;
    width: 35px;
    text-align: center;
    border-radius: 0rem 0.3rem 0rem 1rem;
    display: grid;
    align-content: center;
    pointer-events: none
}

.item-mi-avatar-70 {
    position: relative;
    margin: 0px;
    object-fit: cover;
    height: 70px;
    width: 70px;
    align-content: center;
    align-items: center;
    align-self: center;
    display: grid;
    border-radius: 10rem;
    pointer-events: auto;
    transition: box-shadow 0.3s, border 0.3s;
    border: 2px solid #fff0
}

.item-mi-avatar-50 {
    position: relative;
    margin: 0px;
    object-fit: cover;
    height: 50px;
    width: 50px;
    align-content: center;
    align-items: center;
    align-self: center;
    display: grid;
    border-radius: 10rem;
    pointer-events: auto;
    transition: box-shadow 0.3s, border 0.3s;
    border: 2px solid #fff0
}


    .item-mi-avatar-50:hover {
        border: 2px solid #fff;
        box-shadow: 0px 0px 50px 10px rgba(255, 255, 255, 0.45);
    }

.item-mi-avatar-70:hover {
    border: 2px solid #fff;
    box-shadow: 0px 0px 50px 10px rgba(255, 255, 255, 0.45);
}
/* блокируем клики по виджету пока идёт отправка */
[data-uploader].wu--busy {
    opacity: .6;
    pointer-events: none;
}


.item-mi-avatar-title {
    font-size: 10pt;
    margin-top: 0.6rem;
    font-weight: 600;
}


.item-mi-avatar-username {
    font-size: 12pt;
    margin-top: 0.6rem;
    font-weight: 600;
    z-index: 2;
    pointer-events: auto
}

    .item-mi-avatar-username:hover {
        color: #cecece;
    }

.item-mi-addons-tag-icons {
    z-index: 1;
    pointer-events: auto;
    font-size: 18pt;
    height: 50px;
    width: 50px;
    text-align: center;
    align-items: center;
    justify-items: center;
    display: grid;
    border-radius: 1rem;
    background: #0009;
}


.item-mi-addons-title-art {
    font-weight: 600;
    color: #f5f5f5;
    font-size: 10pt;
    letter-spacing: 0;
    display: -webkit-box;
    line-clamp: 2;
    overflow: hidden;
    word-break: break-word;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.item-mi-addons-stat {
    padding: 1rem 1rem 0.8rem 1rem;
    padding-top: 0px
}

.item-mi-product-type-top {
    font-weight: 600;
    color: #eee;
    padding: 0.2rem 0.6rem;
    background: #000000c4;
    position: absolute;
    top: 0;
    left: 0;
    border-radius: 0.2rem 0.8rem 0.8rem 0rem;
    margin: 0.2rem 0.2rem 0.2rem 0rem;
    margin-bottom: 0.2rem;
    align-content: center;
    align-items: center;
    align-self: center;
    display: grid;
    min-width: 80px;
}

.item-mi-product-type-nooverlay {
    display: flex;
    opacity: 1; /* Элемент полностью видим */
    transition: opacity 0.3s ease; /* Переход с анимацией */
}

/* Состояние элемента при наведении на .item-mi-subimg */
.item-mi-subimg:hover .item-mi-product-type-nooverlay {
    opacity: 0; /* Элемент полностью скрыт */
}

.item-mi-subimg:hover .item-mi-product-overaly {
}


.grid-container-categories-200 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}


.grid-container-categories-220 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}


.grid-container-categories-240 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}

.grid-container-categories-400 {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 10px;
    width: 100%;
}


/* Исходный стиль для кнопки */
.anim-fx-bounce {
    transition: all 0.3s ease-in-out;
    border-radius: 5px;
}

    /* Эффект при наведении мыши */
    .anim-fx-bounce:hover {
        transform: scale(1.1);
    }

    .anim-fx-bounce:after {
        content: "";
        position: absolute;
        opacity: 0;
        transition: all 0.3s;
        box-shadow: 0 0 8px 40px white;
    }

    .anim-fx-bounce:active:after {
        box-shadow: 0 0 0 0 white;
        opacity: 1;
        transition: 0s;
    }





.wen-checkbox {
    display: flex;
    align-items: center;
    position: relative;
    margin-bottom: 0.2rem;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,border-radius .15s ease;
}

    .wen-checkbox input[type="checkbox"] {
        display: none;
    }

    .wen-checkbox label {
        position: relative;
        cursor: pointer;
        display: flex;
        align-items: center;
        color: #aaa;
        width: 100%;
        user-select: none; 
    }

        .wen-checkbox label:before {
            content: '\f096'; /* Font Awesome square icon */
            font-family: 'Font Awesome 5 Free';
            font-weight: 900;
            display: flex;
            align-items: center;
            justify-content: center;
            width: 20px;
            font-size: 16pt;
            height: 20px;
            border: 0px solid #ccc;
            border-radius: 5px;
            margin-right: 10px;
            transition: all 0.3s ease;
            color: #ccc;
            margin-top: 3px;
        }

    .wen-checkbox input[type="checkbox"]:checked + label:before {
        content: '\f14a'; /* Font Awesome check icon */
        color: #fff;
        background-color: none;
        border: 0px;
    }

    .wen-checkbox label:hover:before {
        border-color: #007bff;
    }

    .wen-checkbox label:hover {
        color: #fff;
    }

    .wen-checkbox label, .wen-checkbox label:before {
        transition: all 0.3s ease;
    }



    /* Состояние disabled: стиль метки и “квадратика” */
    .wen-checkbox input[type="checkbox"]:disabled + label {
        cursor: not-allowed;
        opacity: .6;
        color: #777;
        pointer-events: none; /* отключить hover-эффекты */
    }

        .wen-checkbox input[type="checkbox"]:disabled + label:before {
            content: '\f096'; /* тот же пустой квадрат */
            color: #666;
        }

        /* На всякий случай приглушим hover для disabled (если уберёшь pointer-events) */
        .wen-checkbox input[type="checkbox"]:disabled + label:hover,
        .wen-checkbox input[type="checkbox"]:disabled + label:hover:before {
            color: #777;
            border-color: #ccc;
        }

    /* Выключенные — некликабельные */
    .wen-checkbox input[type="checkbox"]:disabled + label {
        cursor: not-allowed;
        opacity: .6;
        color: #777;
        pointer-events: none; /* на всякий случай, если есть JS на label */
    }

        /* Иконка остаётся пустым квадратом */
        .wen-checkbox input[type="checkbox"]:disabled + label:before {
            content: '\f096';
            color: #666;
        }

    /* Если по проекту удобнее — можно таргетить класс */
    .wen-checkbox label.is-disabled {
        pointer-events: none;
    }



/* Disabled-контейнер (8) — полностью блокируем взаимодействие лейбла */
.wen-checkbox-disabled {
    pointer-events: none;
    opacity: .6;
}

/* Если хотите дополнительно стилизовать disabled input — сохраните ваши правила: */
.wen-checkbox_input:disabled + label {
    cursor: not-allowed;
    color: #777;
}

    .wen-checkbox_input:disabled + label:before {
        color: #666;
    }















.toggle-menu {
    display: none;
}

    .toggle-menu:checked ~ .form-group .filtersProduct {
        display: none;
    }

.wen-group-label {
 
    font-size: 12pt;
    cursor: pointer;
    color: #cecece;
    user-select: none;
    background: #242428;
    width: 100%;
    padding: 0.4rem 1.1rem;
    border-radius: 1rem;
    margin-bottom: 0.5rem;
    font-weight: 600;
    transition: all 0.3s ease;
    position: relative;
}

    .wen-group-label:hover {
        background: #3c3c3c;
        color: #fff;
    }

.wen-max-270 {
    max-height: 270px;
    overflow-y: auto;
    /* Сохранение позиции скролла */
    scroll-behavior: smooth;
}

.toggle-icon {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 1.2rem;
    transition: all 0.3s ease;
    content: '\f0da'; /* Font Awesome down arrow */
}

.toggle-menu:checked + .wen-group-label .toggle-icon {
    display: none;
}

.toggle-menu:not(:checked) + .wen-group-label .toggle-icon {
    display: inline-block;
    color: #a6a6a6;
    padding: 0.4rem;
}



.wen-category-overlay {
    pointer-events: none;
    align-items: center;
    justify-items: center;
    justify-self: center;
    align-items: center;
    display: flex;
    justify-content: center;
    background: rgba(8, 1, 1, 0.87);
    color: white;
    opacity: 1;
    text-align: center;
    z-index: 1;
    position: relative !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 190px !important;
    width: 100%;
    transition: background 0.3s;
    pointer-events: all;
    word-wrap: break-word;
    word-break: break-all;
    padding-top: 1.1rem;
}


    .wen-category-overlay:hover {
        background: rgba(39, 40, 43, 0);
    }

.grid-categories {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
    grid-auto-rows: auto;
    grid-gap: 4px;
    width: 100%;
}














.game-block {
    position: relative;
    background-size: cover;
    background-position: center;
    color: white;
    padding: 20px;
}

    .game-block .overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
    }

    .game-block .content {
        position: relative;
        z-index: 1;
    }

    .game-block img {
        width: 100%;
        height: auto;
    }
























.wen-card-container {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
    transition: all 0.3s ease-in-out;
}

.wen-card-image {
    width: 100%;
    height: auto;
}

.wen-card-gradient {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
    z-index: 1;
}

.wen-card-logo {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
}

.wen-card-title {
    position: absolute;
    bottom: 10px;
    left: 10px;
    z-index: 2;
    color: white;
}

.wen-card-icons {
    position: absolute;
    bottom: 10px;
    right: 10px;
    z-index: 2;
}

.wen-hover-menu {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    color: white;
    display: none;
    z-index: 3;
    padding: 20px;
    box-sizing: border-box;
}

.wen-card-container:hover .wen-hover-menu {
    display: block;
}








.carousel-control-next, .carousel-control-prev {
    width: 8rem;
}


.wen-rating-top {
    font-size: 10pt;
    margin-top: 10px;
    margin-left: 5px;
}

.wen-data-product-header {
    z-index: 1;
    position: absolute;
    bottom: 0;
    display: block;
    left: 5%;
    right: 5%;
    margin-bottom: 2.5rem;
}

.wen-data-product-header-webgame {
    z-index: 1;
    position: relative;
    margin: 0rem;
    background: #0f0f0f;
    padding: 1rem;
}

.item-mi-product-buttons-big {
    z-index: 1;
    pointer-events: auto;
    font-size: 16pt;
    font-weight: 600;
    height: 50px;
    min-width: 220px;
    text-align: center;
    align-items: center;
    justify-items: center;
    display: grid;
    background: #aa2c2c;
    border-radius: 0.4rem;
    padding: 1.5rem;
    color: #fff;
}



.wen-item-author {
    display: flex;
    font-weight: 600;
    margin-top: 0.5rem;
    margin: 0.3rem;
}




.h-100imp {
    height: 100% !important;
}

.slide-slc-zoom {
    position: absolute;
    right: 0;
    bottom: 0;
    height: 100px;
    width: 100px;
    font-size: 25pt;
    text-align: center;
    justify-content: center;
    justify-items: center;
    align-content: center;
    background: #262626db;
    color: #fff;
    border-radius: 2rem;
    margin: 1rem;
}

    .slide-slc-zoom:hover {
        color: #fff;
        background: #050909db;
    }
.text-muted {
    --bs-text-opacity: 1;
    color: rgb(88, 93, 99) !important;
}
.readonly-select {
    pointer-events: none;
    background-color: #e9ecef; /* Цвет фона для неактивного состояния */
}

/* добавьте в свой CSS-файл */
.slider-slc-mini .slick-track {
    display: flex !important; /* вместо block          */
    flex-wrap: nowrap !important;
}



.lib-qr-img {
    height: 120px;
    width: 120px;
}


.sun-editor, .sun-editor .se-container, .sun-editor .se-toolbar, .sun-editor .se-menu-list, .sun-editor .se-dialog {
    background-color: rgba(27, 31, 34, 0.98) !important;
    color: #e5e7eb !important;
    border-color: rgba(255,255,255,0.08) !important;
    border-radius: 0.6rem;
}
    .sun-editor .se-btn-module-border, .sun-editor .se-toolbar, .sun-editor .se-toolbar-line, .sun-editor .se-dialog .se-dialog-inner {
        border-color: rgba(255,255,255,0.08) !important;
        overflow: hidden !important;
        border-radius: 0.6rem;
    }


/* фиксированная ширина правой колонки только на xl+ */
@media (min-width: 1200px) {
    .wen-sidebar-xl {
        width: 360px;
        flex: 0 0 auto;
    }
}
/* на <1200px ширина авто (100%), так что колонка станет полноширинной) */
















.wen-btn-green {
    background: #53812c;
    padding: 0.5rem 1.2rem;
    color: white;
    font-weight: initial;
    border-radius: 0.5rem;
    text-align: center;
}
.wen-btn-green:hover {
    background: #6b9a44 !important;
}




/* ============================ WU — Wenrexa Uploader ============================ */
/* Старается не конфликтовать с Bootstrap. Никаких позиций поверх сетки. */
/* Обёртка helper'а, чтобы виджет занимал ровно одну колоночную «ячейку» */
.wu-stack {
    display: block;
    width: 100%;
    min-width: 200px;
}

/* Контейнер виджета */
.wu {
    position: relative;
    display: block;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.06);
    min-height: 220px;
    background: #1c1c1e;
    cursor: pointer;
    transition: .18s;
    overflow: hidden;
}

    .wu:hover {
        box-shadow: 0 6px 16px rgba(16,24,40,.06);
        background: #2e3136;
    }

    .wu.wu--drag {
        border-color: #2563eb;
        transform: translateY(-1px);
    }

    /* ————— Оверлей (нажимается, т.к. это <label>) ————— */
    .wu .wu-overlay {
        position: absolute;
        inset: 0;
        display: grid;
        place-items: center;
        color: #6b7280;
        cursor: pointer; /* указатель */
        pointer-events: auto;
        outline: 0;
        z-index: 12;
    }

        .wu .wu-overlay:focus-visible { /* доступность клавиатурой */
            outline: 2px solid #2563eb;
            outline-offset: 2px;
        }

.wu-overlay-inner { /* внутренний блок с текстом */
    display: grid;
    place-items: center;
    text-align: center;
    padding: 12px;
    color:#fff
}

.wu .wu-title {
    display: block;
 
    font-size: 18px;
    font-weight: 600;
    color: #ffffff;
    margin-bottom: 8px;
}
.wu .wu-icon {
    display: block;
    color: #4d4d4e;
    width: 72px;
    height: 72px;
    background: #1c1c1e;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}


.wu .wu-hint {
    display: block;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.4);
}

/* Оверлей оставляем кликабельным (label[for] открывает диалог),
   прячем лишь контент внутри оверлея */
.wu.wu--hasfile .wu-overlay {
    pointer-events: auto;
}

 

/* Превью (для постера). Остаётся под label, клики идут в label */
.wu .wu-preview {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: none;
    user-select: none;
    -webkit-user-drag: none;
    z-index: 10;
}
/* Фон оверлея рисуем псевдо-элементом, текст не трогаем */
.wu .wu-overlay::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: #000; /* цвет подложки */
    opacity: .4; /* базовая «тёмность» 40% */
    transition: opacity .15s ease;
    z-index: -1; /* под текстом оверлея */
}

/* Фон оверлея рисуем псевдо-элементом, текст не трогаем */
.wu .wu-overlay:hover::before {
    background: #000; /* цвет подложки */
    opacity: .2; /* базовая «тёмность» 40% */
}



/* Во время перетаскивания делаем фон чуть светлее (20%) */
.wu.wu--drag .wu-overlay::before {
    opacity: .2;
}
/* ————— Реальный input — «визуально скрытый», но доступный ————— */
/* Используем корректный accessible-hidden паттерн вместо left:-9999px */
.wu .wu-input {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    border: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
}

.wu.wu--hasfile .wu-title,
.wu.wu--hasfile .wu-hint {
    opacity: 1;
}
/* ————— Локальный список выбранных файлов ————— */
.wu-list {
    padding: 0.2rem;
    display: grid;
    gap: 4px;
}

.wu-item {
    display: flex;
    align-items: center;
    gap: .6rem;
    background: #0d0d0e;
    border-radius: 10px;
    padding: 8px 15px;
}

.wu-thumb { /* мини-превью для изображений слева */
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: #f3f4f6 center/cover no-repeat; 
    flex: 0 0 auto;
}

.wu-ext { /* «иконка» для не-картинок */
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #f8f9fa;
    border: 1px solid #eceff3;
    display: grid;
    place-items: center;
    color: #6c757d;
    flex: 0 0 auto;
}

.wu-name {
    flex: 1 1 auto;
    min-width: 0;
}




    .wu-name > div {
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        font-size: 10pt;
        font-weight: 600;
    }

    .wu-name small {
        color: #6b7280;
    }

.wu-rm {
    background: #fff;
    border-radius: 8px;
    padding: 0.2rem 0.5rem;
    cursor: pointer;
}

    .wu-rm:hover {
 
        color: #000;
    }

/* ————— Локальный прогресс каждого виджета ————— */
.wu-progress {
    height: 10px;
    border-radius: 10px;
    background: #222225;
    overflow: hidden;
    position: relative;
}

.wu-progress__bar {
    height: 100%;
    width: 0;
    background: #2563eb;
    transition: width .15s;
}

.wu-progress__text {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 10px;
    color: #7b7b7b;
}

/* ————— Кнопка «Загрузить» скрыта, когда нечего грузить ————— */
.wu-send-hidden {
    display: none !important;
}

/* ============================ КРОП-модалка (общая одна) ============================ */
#wuCropModal[hidden] {
    display: none !important;
}

#wuCropModal {
    position: fixed;
    inset: 0;
    z-index: 1060;
    background: rgba(17,24,39,.55);
    display: grid;
    place-items: center;
    padding: 24px;
}

    #wuCropModal .wu-modal {
        width: min(92vw,760px);
        border-radius: 16px;
        padding: 16px;
        display: grid;
        gap: 12px;
        color: #fff;
        box-shadow: 0 12px 30px rgba(0,0,0,.2);
    }

    #wuCropModal .wu-cropbox {
        width: min(86vw,560px);
        aspect-ratio: 1/1;
        margin: 0 auto;
        border-radius: 12px;
        overflow: hidden;
        background: #f9fafb;
    }

    #wuCropModal .btn {
        border: 1px solid #d9d9e3;
        border-radius: 10px;
        padding: 8px 12px;
        font-weight: 600;
    }

        #wuCropModal .btn.primary {
            background: #2563eb;
            color: #fff;
            border-color: transparent;
        }

/* ============================ «Пилюли» уже загруженных файлов ============================ */
.file-pill {
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    gap: .9rem;
    background: #0d0d0e;
    border-radius: 0.5rem;
    padding: .9rem 1rem;
    box-shadow: 0 1px 0 rgba(16,24,40,.02);
    cursor: grab;
}


    .file-pill:hover {
        box-shadow: 0 6px 16px rgba(16,24,40,.06);
    }

.file-thumb {
    width: 44px;
    height: 56px;
    border-radius: .5rem; 
    display: grid;
    place-items: center;
    flex: 0 0 auto;
}

.file-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem .75rem;
    color: #677489;
}

.btn-kebab {
    width: 2.25rem;
    height: 2.25rem; 
    border-radius: .6rem;
}

.badge-soft-success {
    color: #198754;
    border: 1px solid #198754;
}

.badge-soft-danger {
    background: #fdeeee;
    color: #dc3545; 
}



.btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.25rem;
    height: 2.25rem;
    padding: 0;
    border-radius: .5rem;
    line-height: 1
}

.js-drag-handle {
    cursor: grab;
}

.drag-ghost {
    opacity: .35;
}

.drag-chosen {
    outline: 2px dashed currentColor;
    outline-offset: -2px;
}

.drag-moving {
    opacity: .6;
}



/* «Красные» элементы — отклонённые файлы */
.wu-item--rejected {
    border: 1px dashed #dc3545;
    background: rgba(220,53,69,.08);
    color: #dc3545;
}

    .wu-item--rejected .wu-name div {
        text-decoration: line-through;
    }


/* Контент должен уметь сжиматься, иначе выталкивает кнопки */
.file-main {
    min-width: 0;
}

    .file-main .fw-semibold {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

/* Метаданные — уже у тебя с wrap */
.file-meta {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem .75rem;
}

/* Кнопки справа как компактный флекс-контейнер */
.file-actions {
    display: flex;
    align-items: center;
    gap: .4rem;
    flex-wrap: wrap; /* можно завернуть во 2 строку, если их много */
    justify-self: end; /* прижать к правому краю колонки */
    min-width: 0;
}

/* Размер кнопок */
.btn-kebab {
    width: 2.25rem;
    height: 2.25rem;
    border-radius: .6rem;
}

/* На узких экранах переносим блок кнопок на вторую строку */
@media (max-width: 640px) {
    .file-pill {
        grid-template-columns: auto minmax(0,1fr); /* 2 колонки: иконка + контент */
    }

    .file-actions {
        grid-column: 1 / -1; /* занять всю ширину ниже */
        justify-self: end; /* и прижаться вправо */
        margin-top: .5rem;
    }
}




.form-check { 
    padding-left: 0.5em; 
}



.form-control::placeholder {
    color: #999; /* свой цвет */
    opacity: 1; /* по умолчанию в bootstrap стоит 0.65, поэтому ставим 1 */

}

 

.bg-body-tertiary {
    background-color: rgb(28, 29, 30) !important;
}
    /*Карточка downloads */

    .w-item-bq {
    background-color: rgb(36, 37, 38) !important;
}


.btn {
 
 
    padding: 0.5rem 2rem;
    border: 0px !important;
    background: #18181b;
}



.w-item-card-art {
    background: #111113;
    color: #fff;
}
.w-item-card {
    background: #1c1d1e;
    color: #fff;
}

.w-cart-page {
    background: #1c1d1e;
    padding: 0.75rem;
    border-radius: 1rem;
}







.accordion-item-edit-pr {
    color: #c2c2c2;
 
    border-radius: 0.9rem !important;
    overflow: hidden;
    background: #111;
    border: 1px solid #121212 !important;
}


 



.accordion-button:hover {
    background: #141516;
}



.navbar .nav-link {
    white-space: nowrap;
}






.dropdown-menu.show {
    min-height: 240px;
}


.form-select:disabled {
    background-color: #5d5d5d;
    border: 1px solid #5d5d5d !important;
    color: #0e0e0e;
}

































































 


/* --- FILTERBAR --- */
.filterbar {
    position: sticky;
    top: 64px;
    z-index: 11;
 
    z-index: 11;
    background: rgba(0,0,0,0.55);
 
}

.filterbar-inner {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    padding: .75rem 1rem;
    justify-content: center !important;
    backdrop-filter: saturate(1.05) blur(6px);
    -webkit-backdrop-filter: saturate(1.05) blur(6px);
    background: rgba(0,0,0,0);
 
    border-bottom: 1px solid #1d1d1d;
}

/* каждая пара: чип + выпадашка */
.chip-wrap {
    position: relative; /* <-- теперь меню привязано к оболочке */
}
 

.chip-label {
    font-weight: 600;
    font-size: .9rem;
}

.chip-value {
    font-size: .85rem;
    opacity: .85;
}

.caret {
    width: .8rem;
    height: .8rem;
    margin-left: .25rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: .8;
}

 
/* выпадающее меню */
 
.chip-wrap[data-open="1"] .chip-menu {
    display: block;
}







.ps-busy {
    opacity: .6;
    pointer-events: none;
}

.chip-picker {
    border: 1px solid var(--bs-border-color);
    border-radius: .375rem;
    padding: .5rem;
    background: #fff;
}

    .chip-picker .cp-head {
        display: flex;
        gap: .5rem;
        align-items: center;
    }

    .chip-picker .cp-search {
        flex: 1;
    }

    .chip-picker .cp-chips {
        display: flex;
        flex-wrap: wrap;
        gap: .375rem;
        margin-top: .35rem;
    }

.chip {
    display: inline-flex;
    align-items: stretch;
    background: #f3f3f3;
    color: #090909;
    cursor: pointer;
    user-select: none;
    transition: border-color .15s, background .15s, color .15s;
    padding: 0;
    font-weight: 400;
    border-radius: 999px;
}

    .chip .x {
        cursor: pointer;
        font-weight: 700;
    }

.cp-menu {
    max-height: 180px;
    overflow: auto;
 
    border-radius: .375rem;
    display: none;
    background: #fff;
    position: absolute;
    z-index: 10;
    width: 100%;
}

.cp-item {
    padding: .25rem .5rem;
    cursor: pointer;
}

    .cp-item:hover {
        background-color: var(--bs-light);
    }

.cp-wrap {
    position: relative;
}





.af-product-desc .af-desc-body {
    color: #fff;
    font-size: 1rem;
}


.p-filter {
    height: 48px!important;
    min-width:48px
}




/* сетка внутри меню */
.menu-grid {
    display: grid;
    gap: .4rem .75rem;
    grid-template-columns: repeat(auto-fill, minmax(160px,1fr));
    max-height: 52vh;
    overflow: auto;
    padding: .25rem;
}

    .menu-grid .form-check {
        margin: 0;
        padding: .25rem;
        border-radius: .5rem;
        cursor: pointer;
        align-items: center !important;
        display: flex !important;
    }

        .menu-grid .form-check:hover {
            background: rgba(255,255,255,.05);
        }

.count-badge {
    display: inline-block;
    min-width: 1.6em;
    padding: .1em .45em;
    border-radius: 999px;
    font-size: .75rem;
    text-align: center;
    background: #1f1f1f;
    color: #bbb;
    margin-left: .35rem;
}

/* --- ACTIVE FILTERS (под баром) --- */
.active-filters {
    display: flex!important;
    flex-wrap: wrap;
    gap: .5rem;
    padding: 0.7rem;
}
 

 

/* адаптив */
@media (max-width: 640px) {
  

    .chip-menu {
        left: 50%;
        transform: translateX(-50%);
        max-width: 92vw;
    }
}
.chip-menu {
    position: absolute;
    right: 0;
   left:auto;
}
 
/* Левая часть: лейбл + значение + стрелка */
.chip-body {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .5rem .85rem;
    border-top-left-radius: 999px;
    border-bottom-left-radius: 999px;
    min-width: 0;
}

    .chip-body .chip-label {
        font-weight: 700;
        font-size: .92rem;
    }

    .chip-body .chip-value {
        font-size: .88rem;
        opacity: .9;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .chip-body .caret {
        width: .4rem;
        height: .4rem;
        border-right: 2px solid currentColor;
        border-bottom: 2px solid currentColor;
        transform: rotate(45deg);
        opacity: .8;
        margin-left: .25rem;
    }
/* иконка в чипе слева от текста */
.chip-icon {
    font-size: .95rem;
    opacity: .9;
    margin-right: .5rem;
    width: 1.1rem; /* фикс ширина = ровное выравнивание */
    text-align: center;
}
/* Правая часть: крестик (по умолчанию скрыт) */
.chip-clear {
    display: none;
    align-items: center;
    justify-content: center;
    padding: .5rem .65rem;
    background: #1a1a1a;
    border-top-right-radius: 999px;
    border-bottom-right-radius: 999px;
    font-size: .95rem;
    background: #f3f3f3;
    line-height: 1;
    cursor: pointer;
    opacity: .95;
    margin-left: -.25rem;
}

    .chip-clear:hover {
        background: #262626;
    }

/* Появляется только у "грязных" чипов */
.chip--dirty .chip-clear {
    display: inline-flex;
}

/* В дефолтном состоянии чип снова становится цельным */
.chip:not(.chip--dirty) {
    border-radius: 999px;
}

    .chip:not(.chip--dirty) .chip-body {
        border-radius: 999px;
        padding-right: .85rem; /* выравниваем визуально */
    }

.chip--dirty .chip-body {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    padding-right: .6rem; /* чуть меньше, чтобы крест был ближе */
}



/* Когда чип «грязный» (не дефолт) — освобождаем правую часть под крест */
.chip--dirty {
    padding-right: 0; /* крест будет отдельным сегментом */
}

 
 

.chip--dirty .caret {
    margin-right: .35rem;
}

/* небольшой контраст всей пилюли при hover */
.chip:hover {
 
    background: #cecece;
}


.active-chip {
    align-items: center;
    justify-content: center;
    background: #262626;
    width: auto;
    margin-left: .35rem;
    cursor: pointer;
    opacity: .95;
    border-radius: 1.5rem;
    color: #fff;
    font-size: 11pt;
    text-align: center;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: fit-content;
}
.active-chip-label {
    padding: .3rem 0.8rem .3rem 0.8rem
}
.active-chip .active-chip-close {
    border-left: 1px solid rgba(255,255,255,.18);
    background: #0c0909;
    border-top-right-radius: 100rem;
    border-bottom-right-radius: 100rem;
    width: auto;
    margin-left: .35rem;
    cursor: pointer;
    opacity: .95;
 
    border-radius: 0.1rem 100rem 100rem 0.1rem;
    padding: .5rem .65rem .5rem .5rem;
    height: 100%;
    display: flex; /* Добавьте это */
    align-items: center; /* Добавьте это */
    justify-content: center; /* Добавьте это */
}

        .active-chip .active-chip-close:hover {
            background: #2f2f2f;
        }

        .active-chip .active-chip-close:active {
            background: #373737;
        }
 
 
/* ← «грязный» чип = виден крест */

/* подсветка открытого чипа */
.chip-wrap[data-open="1"] .chip {
    border-color: #7c5cff;
    box-shadow: 0 0 0 2px rgba(124,92,255,.25) inset;
}

/* меню остаётся привязанным к оболочке */
.chip-wrap {
    position: relative;
}

.chip-menu {
    position: absolute;
    left: 0;
    top: calc(100% + .5rem);
    min-width: 260px;
    max-width: min(90vw, 720px);
    background: #1a1a1a;
    color: #ddd;
    border-radius: .75rem;
    padding: .75rem;
    box-shadow: 0 16px 40px rgba(0,0,0,.45);
    display: none;
    z-index: 20;
    pointer-events:auto;
}

.chip-wrap[data-open="1"] .chip-menu {
    display: block;
}












 

    /* слой с фоном, чуть больше радиуса — убираем белые пиксели по краям */
    .wenrexa-type-card::before {
        content: "";
        position: absolute;
        inset: -2px; /* чуть вылезаем за границу */
        border-radius: inherit;
        background: inherit; /* забираем background-image c .wenrexa-type-card */
        background-size: inherit;
        background-position: inherit;
        background-repeat: inherit;
        z-index: -2;
    }
    /* тёмный оверлей сверху */
    .wenrexa-type-card::after {
        content: "";
        position: absolute;
        inset: -2px;
        border-radius: inherit;
        background: rgba(0, 0, 0, 0.75);
        z-index: -1;
        transition: background .18s ease;
    }
wenrexa-type-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(0,0,0,0.45);
}
.wenrexa-type-card:hover .wenrexa-type-card-ovrl {
    background: rgba(0,0,0,0.6);
}

.wenrexa-type-card--active .wenrexa-type-card-ovrl {
    background: rgba(0,0,0,0.5);
}
.wenrexa-type-card--disabled .wenrexa-type-card-ovrl {
    background: rgba(0,0,0,0.85);
}
.wenrexa-type-card--active::before {
    background: rgba(0,0,0,0.25);
}
.wenrexa-type-card--disabled::after {
    background: rgba(0,0,0,0.78);
}
.wenrexa-type-card--disabled {
    opacity: 0.35;
    cursor: default;
    box-shadow: none;
}
.wenrexa-type-card--active::after {
    background: rgba(0, 0, 0, 0.25);
}


.wenrexa-type-card-content {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
    font-weight: 600;
    font-size: 0.92rem;
    white-space: nowrap;
}

.wenrexa-type-card-icon {
    font-size: 1.1rem;
}
.wenrexa-type-card-ovrl {
    position: absolute;
    inset: -1px; /* чуть больше, чтобы точно не было ореолов */
    border-radius: inherit;
    background: rgba(15, 15, 15, 0.82);
    pointer-events: none;
    z-index: 0;
    transition: background .18s ease;
}
/* правая часть: счётчик */
.wenrexa-type-card-count {
    font-size: 0.82rem;
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    background: rgba(255,255,255,0.14);
    box-shadow: 0 0 0 1px rgba(255,255,255,0.12);
    flex-shrink: 0;
}
.wenrexa-type-card-title {
    text-shadow: 0 1px 3px rgba(0,0,0,0.85);
    overflow: hidden;
    text-overflow: ellipsis;
}
/* левая часть: иконка + название */
.wenrexa-type-card-main {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
    min-width: 0;
}
    .wenrexa-type-card--disabled::before {
        background: rgba(0,0,0,0.7);
    }

.wenrexa-type-card-content {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
    font-weight: 600;
    font-size: 0.92rem;
    white-space: nowrap;
}

.wenrexa-type-card-icon {
    font-size: 1.1rem;
}

.wenrexa-type-card-title {
    text-shadow: 0 1px 3px rgba(0,0,0,0.8);
}

/* Базовый фон + примеры под типы.
   Тут просто подставь свои реальные картинки. */

.wenrexa-type-bg-default,
.wenrexa-type-bg-all {
    background-image: linear-gradient(135deg, #444, #111);
}

.wenrexa-type-bg-user {
    background-image: linear-gradient(135deg, #4e54c8, #24243e);
}

.wenrexa-type-bg-art,
.wenrexa-type-bg-artwork,
.wenrexa-type-bg-adopt {
    background-image: url("/images/type/artwork.jpg");
}

.wenrexa-type-bg-assets {
    background-image: url("/images/type/assets.jpg");
}

.wenrexa-type-bg-games,
.wenrexa-type-bg-dlc,
.wenrexa-type-bg-webgame {
    background-image: url("/images/types/games.jpg");
}

.wenrexa-type-bg-sounds {
    background-image: url("/images/types/sounds.jpg");
}

.wenrexa-type-bg-templates {
    background-image: url("/images/types/templates.jpg");
}

.wenrexa-type-bg-utilities {
    background-image: url("/images/types/utilities.jpg");
}

.wenrexa-type-bg-software,
.wenrexa-type-bg-source-soft,
.wenrexa-type-bg-source-web {
    background-image: url("/images/types/software.jpg");
}

.wenrexa-type-bg-font {
    background-image: url("/images/types/font.jpg");
}

.wenrexa-type-bg-video {
    background-image: url("/images/types/video.jpg");
}

.wenrexa-type-bg-photobank {
    background-image: url("/images/types/photo.jpg");
}

.wenrexa-type-bg-plugins {
    background-image: url("/images/types/plugins.jpg");
}

.wenrexa-type-bg-platform {
    background-image: url("/images/types/platform.jpg");
}

.wenrexa-type-bg-shop,
.wenrexa-type-bg-shop-avatar,
.wenrexa-type-bg-shop-header,
.wenrexa-type-bg-shop-bg,
.wenrexa-type-bg-shop-theme {
    background-image: url("/images/types/shop.jpg");
}









.chip-wrap {
 
    outline: none; /* чтобы не было рамки при фокусе */
}

.chip-menu {
    display: none;
 
}

.chip-wrap:focus-within .chip-menu {
    display: block;
}




.wenrexa-type-strip-inner {
    display: flex;
    gap: 0.3rem;
    overflow-x: auto;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    margin: 0;
    padding: 0rem 1rem;
    scrollbar-width: none;
    -ms-overflow-style: none;
}


    .wenrexa-type-strip-inner::-webkit-scrollbar {
        display: none;
    }

.wenrexa-type-strip-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #333;
}

    .wenrexa-type-strip-arrow:hover {
        background: white;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
        transform: translateY(-50%) scale(1.05);
    }

.wenrexa-type-strip-arrow--prev {
    left: 0;
}

.wenrexa-type-strip-arrow--next {
    right: 0;
}

.wenrexa-type-strip-arrow:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    transform: translateY(-50%);
}

    .wenrexa-type-strip-arrow:disabled:hover {
        background: rgba(255, 255, 255, 0.9);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        transform: translateY(-50%);
    }


.wenrexa-type-strip {
    position: relative;
    padding: 7px 40px;
    backdrop-filter: saturate(1.05) blur(6px);
    -webkit-backdrop-filter: saturate(1.05) blur(6px);
    background: rgba(0, 0, 0, 0);
}


/* Адаптивность */
@media (max-width: 768px) {
    .wenrexa-type-strip {
        padding: 0 32px;
    }

    .wenrexa-type-card {
        width: 160px;
    }
}

@media (max-width: 576px) {
    .wenrexa-type-strip {
        padding: 0 28px;
    }

    .wenrexa-type-card {
        width: 140px;
    }
}


 

    .wenrexa-type-strip-inner::-webkit-scrollbar {
        display: none;
    }

.wenrexa-type-strip-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #333;
    font-size: 14px;
    margin: 0rem 1rem;
}

    .wenrexa-type-strip-arrow:hover {
        background: white;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
        transform: translateY(-50%) scale(1.05);
    }

.wenrexa-type-strip-arrow--prev {
    left: 0;
}

.wenrexa-type-strip-arrow--next {
    right: 0;
}

.wenrexa-type-strip-arrow:disabled {
    opacity: 0.4;
    cursor: not-allowed;
    transform: translateY(-50%);
}

    .wenrexa-type-strip-arrow:disabled:hover {
        background: rgba(255, 255, 255, 0.9);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
        transform: translateY(-50%);
    }

/* Адаптивность */
@media (max-width: 768px) {
    .wenrexa-type-strip {
        padding: 0 32px;
    }

    .wenrexa-type-card {
        width: 160px;
    }
}

@media (max-width: 576px) {
    .wenrexa-type-strip {
        padding: 0 28px;
    }

    .wenrexa-type-card {
        width: 140px;
    }
}







.wenrexa-sort-item {
    position: relative;
}

.wenrexa-sort-label {
    display: flex;
    align-items: center;
    width: 100%;
    height: 100%;
    cursor: pointer;
   pointer-events:auto;
}







.wenrexa-loading-overlay {
    position: fixed;
    inset: 0; /* top:0; right:0; bottom:0; left:0 */
    z-index: 5000; /* поверх всего, включая хедер и фильтры */
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(39, 39, 39, 0.92);
    transition: opacity .25s ease-out, visibility .25s ease-out;
    opacity: 1;
    visibility: visible;
    display: none
}

    .wenrexa-loading-overlay.wenrexa-loading-overlay--hidden {
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
    }


        /* панель фильтров в центре (над карточками) */
.filter-panel-navbar {
    top: 0;
    padding-top: 0px;
    padding-bottom:0px;
    position: sticky !important;
    top: calc(var(--topbar-h) + 0.0rem); /* под верхней шапкой Wenrexa */
    z-index: 60; /* выше карточек, ниже модалок */
    min-width: 265px;
}
/* ---- Верхняя строка: поиск + кнопка фильтров ---- */
.searchbar {
    position: sticky;
    top: 0;
    z-index: 12;
    backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(255,255,255,.06);
    backdrop-filter: saturate(1.05) blur(6px);
    -webkit-backdrop-filter: saturate(1.05) blur(6px);
    background: rgba(0, 0, 0, 0);
}

.searchbar-inner {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: #313131;
    max-width: 1100px;
    margin: 0 auto;
    padding: .75rem 1rem;
}



 





/* сам инпут поиска */
.searchbar-input {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    gap: .5rem;
    background: #000;
    border-radius: 2rem;
    padding: .6rem .9rem;
    background: #f9f9f9;
}


    .searchbar-input input {
        padding: 0.2rem 0.9rem 0.2rem 2.3rem;
        border-radius: 999px;
        border: 0;
        width: 100%;
        outline: none;
        font-size: 0.95rem;
        background: #f000;
    }

        .searchbar-input input::placeholder {
            color: rgba(28, 27, 27, 0.57);
            font-weight: 400;
        } 


/* иконка лупы */
.searchbar-icon {
    position: absolute;
    left: 1.18rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 14pt;
    pointer-events: none;
}

/* кнопка-переключатель фильтров справа */
.searchbar-filters-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.4rem;
    height: 2.4rem;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(0,0,0,.8);
    color: rgba(255,255,255,.8);
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease, transform .1s ease;
}

    .searchbar-filters-btn i {
        font-size: 1rem;
    }

    .searchbar-filters-btn:hover {
        background: #fff;
        color: #111;
        border-color: #fff;
        transform: translateY(-1px);
    }

/* чекбокс-переключатель (прячем) */
#FiltersToggle {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

/* по умолчанию фильтры видны */
.filterbar,
.wenrexa-type-strip,
#ActiveFilters {
    display: block;
}



/* Когда свернуто — bootstrap сам ставит .collapsed */
.searchbar-filters-btn.collapsed {
    background-color: #fff !important;
    color: #111 !important;
    border-color: #fff !important;
}

/* Когда развернуто */
.searchbar-filters-btn {
    background: rgba(0,0,0,.8);
    color: rgba(255,255,255,.85);
}
.wenrexa-type-card {
    position: relative;
    flex: 0 0 auto;
    width: 210px;
    height: 46px;
    border: 0;
    padding: 0 16px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    cursor: pointer;
    background: transparent; /* НЕТ фона, чтобы нечему было просвечивать */

    border-radius: 999px;
    overflow: hidden; /* режем всё по радиусу */

    color: #fff;
    text-align: left;
    box-shadow: 0 4px 12px rgba(0,0,0,0.35);
    transition: transform .15s ease, box-shadow .15s ease;
}
.wenrexa-type-card-bg {
    position: absolute;
    inset: -2px;                     /* чуть больше, чтобы точно перекрыть края */
    border-radius: inherit;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
}

/* твои классы фонов – переназначаем сюда */
.wenrexa-type-bg-default,
.wenrexa-type-bg-all {
    background-image: linear-gradient(135deg, #444, #111);
}

.wenrexa-type-bg-art,
.wenrexa-type-bg-artwork,
.wenrexa-type-bg-adopt {
    background-image: url("/images/type/artwork.jpg");
}

/* и дальше все wenrexa-type-bg-* классы оставляешь как есть */
/* Блок приглашения */
.wenrexa-signup-callout {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: rgba(0,0,0,0.55);
    border-radius: 1rem 1rem 0rem 0rem;
    padding: 0.4rem 1rem;
    margin-bottom: 0.1rem;
    color: #fff;
}

/* Текст */
.wenrexa-signup-text {
    font-size: 0.92rem;
    font-weight: 500;
    line-height: 1.35;
    margin-right: 1rem;
    flex: 1 1 auto;
}

/* Кнопка регистрации */
.wenrexa-signup-btn {
    white-space: nowrap;
    padding: 0.55rem 1.2rem;
    font-weight: 400;
    border-radius: 8px;
    font-size: 0.9rem;
    background: #ff692d;
}

/* Мобильная адаптация */
@media (max-width: 576px) {
    .wenrexa-signup-callout {
        flex-direction: column;
        gap: 0.7rem;
        text-align: center;
    }

    .wenrexa-signup-text {
        margin-right: 0;
    }
}
























/* =============================================
   WENREXA PICKER — Universal chip selector
   Usage: Genres, Categories, Tags, Features, etc.
   ============================================= */

.wenrexa-picker-container {
    max-width: 680px;
}

.wenrexa-picker-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;
}

.wenrexa-picker-title {
    display: flex;
    align-items: center;
    gap: 12px;
}

    .wenrexa-picker-title h5 {
        font-size: 17px;
        font-weight: 600;
        color: #f5f5f7;
        margin: 0;
    }

.wenrexa-picker-counter {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    background: #2c2c2e;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    color: #86868b;
}

.wenrexa-picker-counter-current {
    color: #f5f5f7;
    font-weight: 600;
}

.wenrexa-picker-counter-full {
    background: rgba(52, 199, 89, 0.15);
}

    .wenrexa-picker-counter-full .wenrexa-picker-counter-current {
        color: #34c759;
    }

/* Search */
.wenrexa-picker-search {
    position: relative;
    margin-bottom: 24px;
}

.wenrexa-picker-search-icon {
    position: absolute;
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #6e6e73;
    font-size: 14px;
    pointer-events: none;
}

.wenrexa-picker-search-input {
    width: 100%;
    padding: 12px 14px 12px 40px;
    background: #1c1c1e;
    border: 1px solid #38383a;
    border-radius: 12px;
    font-size: 15px;
    color: #f5f5f7;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

    .wenrexa-picker-search-input::placeholder {
        color: #6e6e73;
    }

    .wenrexa-picker-search-input:focus {
        border-color: #0a84ff;
        box-shadow: 0 0 0 3px rgba(10, 132, 255, 0.15);
    }

/* Sections */
.wenrexa-picker-section {
    margin-bottom: 24px;
}

.wenrexa-picker-section-label {
    font-size: 12px;
    font-weight: 500;
    color: #86868b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 12px;
}

.wenrexa-picker-selected-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-height: 40px;
    padding: 12px;
    background: #1c1c1e;
    border-radius: 12px;
    border: 1px solid #38383a;
}

.wenrexa-picker-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    color: #48484a;
    font-size: 14px;
}

.wenrexa-picker-available-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* Chips */
.wenrexa-chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #2c2c2e;
    border: 1px solid transparent;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 500;
    color: #f5f5f7;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
    animation: wenrexa-chip-in 0.2s ease;
}

    .wenrexa-chip:hover {
        background: #3a3a3c;
    }

    .wenrexa-chip.is-selected {
        background: rgba(10, 132, 255, 0.15);
        border-color: rgba(10, 132, 255, 0.3);
        color: #0a84ff;
    }

        .wenrexa-chip.is-selected:hover {
            background: rgba(10, 132, 255, 0.25);
        }

.wenrexa-chip-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    font-size: 12px;
    transition: all 0.15s;
}

    /* Add icon (available state) */
    .wenrexa-chip-icon.is-add {
        background: transparent;
        color: #86868b;
    }

.wenrexa-chip:hover .wenrexa-chip-icon.is-add {
    color: #34c759;
}

/* Remove icon (selected state) */
.wenrexa-chip-icon.is-remove {
    background: rgba(10, 132, 255, 0.2);
    color: #0a84ff;
}

.wenrexa-chip.is-selected:hover .wenrexa-chip-icon.is-remove {
    background: #ff453a;
    color: #fff;
}

/* Locked state */
.wenrexa-chip.is-locked {
    opacity: 0.4;
    cursor: not-allowed;
}

    .wenrexa-chip.is-locked:hover {
        background: #2c2c2e;
    }

    .wenrexa-chip.is-locked .wenrexa-chip-icon {
        color: #48484a;
    }

/* Busy state */
.wenrexa-chip.is-busy {
    opacity: 0.6;
    pointer-events: none;
}

/* Messages */
.wenrexa-picker-message {
    display: none;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 13px;
    margin-top: 16px;
}

    .wenrexa-picker-message.is-visible {
        display: block;
    }

    .wenrexa-picker-message.is-warning {
        background: rgba(255, 149, 0, 0.1);
        color: #ff9500;
    }

    .wenrexa-picker-message.is-error {
        background: rgba(255, 69, 58, 0.1);
        color: #ff453a;
    }

    .wenrexa-picker-message.is-info {
        background: rgba(10, 132, 255, 0.1);
        color: #0a84ff;
    }

.wenrexa-picker-no-edit {
    padding: 12px 16px;
    background: rgba(255, 69, 58, 0.1);
    border-radius: 10px;
    font-size: 13px;
    color: #ff453a;
}

/* Animation */
@@keyframes wenrexa-chip-in {
    from {
        opacity: 0;
        transform: scale(0.9);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}