@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

body {
    background: #0C0C0E;
    font-family: "Montserrat", sans-serif !important;
    /*padding-left: 268px;*/
    padding-top: 70px;
    color: #fff;

}

.picture__image {
    font-family: "Montserrat", sans-serif !important;
}

.btn {
    outline: none;
    box-shadow: 0px;
}

.ID-NB {
    background: rgba(114, 114, 114, 0.55);
    min-width: 100px;
    height: 100px;
    align-items: center;
    text-align: center;
    border-radius: .875rem;
}

.pagination {
    --bs-border-radius: 0.875rem;
}

.disabled>.page-link, .page-link.disabled {
    background: #121216;
    border: 2px solid #16161b !important;
    color: #683131;
    outline: none;
    box-shadow: none;
    padding: .575rem .875rem;
}

.btn.active {
    border: 1px solid #dc3545 !important;
    background: #dc3545 !important;
}

.btn-icon-log {
    transition: .1s;
}

.btn-icon-log:active {
    transform: scale(1.1);
}

.alert-danger {
    color: #ffffff;
    background-color: #dc3545;
    border-color: #dc3545;
    border-radius: .675rem;
}

.btn-icon-log:hover {
    margin-top: -3px;
    margin-bottom: 3px;
}

.active>.page-link, .page-link.active {
    z-index: 3;
    background: #D23C3C;
    border: 2px solid #D23C3C !important;
    color: #ffffff;
    outline: none;
    box-shadow: none;
    padding: .575rem .875rem;
}

.page-link {

    background: #121216;
    border: 2px solid #16161b !important;
    color: #D23C3C;
    outline: none !important;
    box-shadow: none !important;
    padding: .575rem .875rem;
}

.page-link:hover {
    border: 2px solid #D23C3C !important;
    background: #121216;
    color: #fff;
}



[data-bs-theme=dark] {
    color-scheme: dark;
    --bs-body-color: #dee2e6;
    --bs-body-color-rgb: 222, 226, 230;
    --bs-body-bg: #212529;
    --bs-body-bg-rgb: 33, 37, 41;
    --bs-emphasis-color: #fff;
    --bs-emphasis-color-rgb: 255, 255, 255;
    --bs-secondary-color: rgba(222, 226, 230, 0.75);
    --bs-secondary-color-rgb: 222, 226, 230;
    --bs-secondary-bg: #343a40;
    --bs-secondary-bg-rgb: 52, 58, 64;
    --bs-tertiary-color: rgba(222, 226, 230, 0.5);
    --bs-tertiary-color-rgb: 222, 226, 230;
    --bs-tertiary-bg: #2b3035;
    --bs-tertiary-bg-rgb: 43, 48, 53;
    --bs-primary-text-emphasis: #6ea8fe;
    --bs-secondary-text-emphasis: #a7acb1;
    --bs-success-text-emphasis: #75b798;
    --bs-info-text-emphasis: #6edff6;
    --bs-warning-text-emphasis: #ffda6a;
    --bs-danger-text-emphasis: #ea868f;
    --bs-light-text-emphasis: #f8f9fa;
    --bs-dark-text-emphasis: #dee2e6;
    --bs-primary-bg-subtle: #031633;
    --bs-secondary-bg-subtle: #161719;
    --bs-success-bg-subtle: #051b11;
    --bs-info-bg-subtle: #032830;
    --bs-warning-bg-subtle: #332701;
    --bs-danger-bg-subtle: #2c0b0e;
    --bs-light-bg-subtle: #343a40;
    --bs-dark-bg-subtle: #1a1d20;
    --bs-primary-border-subtle: #084298;
    --bs-secondary-border-subtle: #41464b;
    --bs-success-border-subtle: #0f5132;
    --bs-info-border-subtle: #087990;
    --bs-warning-border-subtle: #997404;
    --bs-danger-border-subtle: #842029;
    --bs-light-border-subtle: #495057;
    --bs-dark-border-subtle: #343a40;
    --bs-heading-color: inherit;
    --bs-link-color: #6ea8fe;
    --bs-link-hover-color: #8bb9fe;
    --bs-link-color-rgb: 110, 168, 254;
    --bs-link-hover-color-rgb: 139, 185, 254;
    --bs-code-color: #e685b5;
    --bs-highlight-color: #dee2e6;
    --bs-highlight-bg: #664d03;
    --bs-border-color: #495057;
    --bs-border-color-translucent: rgba(255, 255, 255, 0.15);
    --bs-form-valid-color: #75b798;
    --bs-form-valid-border-color: #75b798;
    --bs-form-invalid-color: #ea868f;
    --bs-form-invalid-border-color: #ea868f;
}

.offcanvas,
.offcanvas-lg,
.offcanvas-md,
.offcanvas-sm,
.offcanvas-xl,
.offcanvas-xxl {
    --bs-offcanvas-zindex: 1045;
    --bs-offcanvas-width: 400px;
    --bs-offcanvas-height: 30vh;
    --bs-offcanvas-padding-x: 1rem;
    --bs-offcanvas-padding-y: 1rem;
    --bs-offcanvas-color: var(--bs-body-color);
    --bs-offcanvas-bg: var(--bs-body-bg);
    --bs-offcanvas-border-width: var(--bs-border-width);
    --bs-offcanvas-border-color: var(--bs-border-color-translucent);
    --bs-offcanvas-box-shadow: var(--bs-box-shadow-sm);
    --bs-offcanvas-transition: transform 0.3s ease-in-out;
    --bs-offcanvas-title-line-height: 1.5;
    --bs-btn-close-white-filter: invert(1) grayscale(100%) brightness(200%);
}

.offcanvas {
    position: fixed;
    bottom: 0;
    z-index: var(--bs-offcanvas-zindex);
    display: flex;
    flex-direction: column;
    max-width: 100%;
    color: var(--bs-offcanvas-color) !important;
    visibility: hidden;
    background-color: var(--bs-offcanvas-bg) !important;
    background-clip: padding-box;
    outline: 0;
    transition: var(--bs-offcanvas-transition) !important;
}

[data-bs-theme=dark] .btn-close {
    filter: var(--bs-btn-close-white-filter);
}


.nav {
    --bs-nav-link-padding-x: 1rem;
    --bs-nav-link-padding-y: 0.5rem;
    --bs-nav-link-font-weight: ;
    --bs-nav-link-color: var(--bs-link-color);
    --bs-nav-link-hover-color: var(--bs-link-hover-color);
    --bs-nav-link-disabled-color: var(--bs-secondary-color);
    display: flex;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}


.toast {
    box-shadow: none !important;
    border-radius: .375rem !important;
}

.sidebar {
    height: 100vh;
    width: 268px;
    background: #111114;
    position: fixed;
    left: 0;
    top: 0;
}

.h-d-none {
    display: none !important;
}

.sidebar_nav_btn {
    width: 100%;
    height: 54px;
    padding: 0px 16px;
    justify-content: space-between;
    display: flex;
    align-items: center;
}

.site_title {
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}

.ck-editor__top {
    display: none !important;
}

.search_input {
    background: #070709 !important;
    outline: 0px;
    border: 0px;
    box-shadow: none !important;
    color: #fff !important;
    width: 100% !important;
    margin: 0px !important;
    font-weight: 500;
    border-radius: 0px 10px 10px 0px;
    padding-left: 8px;
}

.search_input::placeholder {
    color: #48485B !important;
    font-weight: 600;
}

.search_icon {
    height: 36;
    padding: 0px 12px;
    padding-right: 0px;
    align-items: center;
    display: flex;
    background: #070709;
    border-radius: 10px 0px 0px 10px;

}

a {
    text-decoration: none;
}

.nam_btSb {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
}

.cont_navbt_link {
    display: flex;
    align-items: center;
    gap: 10px;
}

.link_btnSb {
    transition: .2s;
}

.link_btnSb:hover {
    background: #17171f;
}

.contur_bb1 {
    filter: blur(200px);
    background: #D23C3C;
    width: 200px;
    height: 300px;
    position: fixed;
    bottom: 0;
    left: 0;
}

.contur_bb2 {
    filter: blur(200px);
    background: #D23C3C;
    width: 200px;
    height: 300px;
    position: fixed;
    top: 30px;
    right: -210px;
}

.reg-card {
    border-radius: 2rem !important;
}

.text-body-secondary_2 {
    color: #4e4f5f !important;
}

.contur_bb3 {
    filter: blur(200px);
    background: #D23C3C;
    width: 350px;
    height: 350px;
}

.dropdown-menu {
    background: #111114;
    border-radius: 10px;
}

.dropdown-item {
    color: #fff !important;
}

.dropdown-item:hover {
    background: #17171f;
}

.collapse .sidebar_nav_btn {
    padding-left: 26px;
}

.story {
    position: relative;
    width: 100% !important;
    height: 100%;
    border-radius: 10px;
    transition: .15s !important;
    overflow: hidden;
}

.img-story-container {
    overflow: hidden;
    display: block;
    position: relative;
    height: 0;
    padding-top: 100%;
    border-radius: 10px;
}

.img-story-container span {
    transform: scale(1.01);
    background-position: center !important;
    z-index: 1;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-size: cover;
    background-repeat: no-repeat;
    transition: opacity .3s linear;
    border-radius: 10px;
}

.story span {
    transition: .2s !important;
}

.info-story {
    opacity: 0;
    position: absolute;
    margin-top: -35px;
    margin-left: 5px;
    z-index: 1;
    transition: 0.2s;
}

.info-story .badge {
    border-radius: 10px;
}

.story-title {
    font-size: 18px;
    font-weight: 600;
    color: #fff;
}

.cat-btn {
    color: #D23C3C !important;
    font-weight: 600 !important;
    border: 2px solid #D23C3C !important;
    padding: 4px 13px !important;
    border-radius: 10px !important;
    margin-right: 15px;
    font-size: 13px;
    max-width: 130px;
}

.btn-data {
    padding-left: 0px !important;
}

.color-light-primary {
    color: rgba(161, 167, 180, 1) !important;
}

.story-content {
    display: grid;
    grid-gap: 2rem;
    grid-auto-flow: row dense;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

.story:hover span {
    transform: scale(1.05);
}

.story:hover .info-story {
    opacity: 1;
}

.btn_info {
    display: flex;
    align-items: center;
}

.number-info {
    font-size: 13px;
    padding-left: 3px;
}

.infoblock_top {
    height: 60px;
    width: 100%;
    background: #D23C3C;
    border-radius: 10px;
    align-items: center;
    display: flex;
    padding: 0px 20px;
    font-weight: 500;
    color: #fff;
}

.card_profile_user {
    width: 100%;
    height: 20em;
    background: #00000040;
    border-radius: 1rem;
    backdrop-filter: blur(25px);
    position: relative;
    overflow: hidden;
    text-align: center;
    align-items: center;
    display: grid;
    padding: 3rem;
}

.background_image_profile {
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    filter: blur(50px);
}

.user_profile_avatar {
    width: 5rem;
    height: 5rem;
    border-radius: 20%;
    border: 2px solid #1b1b1b;
}

.user_profile_avatar_2 {
    width: 10rem;
    height: 10rem;
    border-radius: 10%;
}

.container-tovar {
    max-width: 1700px;
    margin: 0 auto;
    position: relative;
    z-index: 3;
    display: flex;
    justify-content: center;
}

.tovar_block {
    display: flex;
    gap: 20px;
    max-width: 600px;
    height: 100%;

}

.tovar-price {
    color: #e45555;
    margin-bottom: 0.5rem;
}

.tovar_image {
    max-width: 50%;
}


.tovar_image img {
    width: 100%;
    border-radius: 15px;
}

.description_tovar {
    max-width: 700px;
    width: 100%;
}

/* (A) MATERIAL ICONS */
.aWrap .svg-inline--fa {
    color: white !important;
}

/* (B) WRAPPER */
.aWrap {
    font-family: Arial, Helvetica, sans-serif;
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* allow buttons to wrap into another row on small screens */
    /* flex-wrap: wrap; */
    max-width: 650px;
    padding: 10px 15px;
    background: #121216;
    gap: 1rem;
    border-radius: 15px;
    border: 2px solid #16161b;
}

.card_tovar-block {
    width: 80%;
}

.aWrap,
.aWrap * {
    box-sizing: border-box;
}

/* (C) PLAY/PAUSE BUTTON */
.aPlay {
    padding: 0;
    margin: 0;
    background: 0;
    border: 0;
    cursor: pointer;
}

/* (D) TIME */
.aCron {
    font-size: 14px;
    color: #cbcbcb;
    margin: 0 10px;
}

/* (E) RANGE SLIDERS */
/* (E1) HIDE DEFAULT */
.aWrap input[type="range"] {
    appearance: none;
    border: none;
    outline: none;
    box-shadow: none;
    width: 150px;
    padding: 0;
    margin: 0;
    background: 0;
}

.range,
.range-volume {
    position: relative;
    display: flex;
    align-items: center;
}

.range input,
.range-volume input {
    position: relative;
    z-index: 1;
}

.range .change-range,
.range-volume .change-range {
    position: absolute;
    left: 0;
    top: 0;
    height: 6px;
    width: 0px;
    background-color: rgb(187, 187, 187);
    border-radius: 10px 0 0 10px;
}

.range-volume .change-range {
    height: 10px;
    width: 95%;
}

.under-ranger {
    position: absolute;
    left: 0;
    top: 0;
    height: 6px;
    width: 100%;
    background-color: rgb(63, 63, 63);
    border-radius: 10px;
}

.range-volume .under-ranger {
    height: 10px;
}

.aWrap input[type="range"]::-webkit-slider-thumb {
    appearance: none;
}

/* (E2) CUSTOM SLIDER TRACK */
.aWrap input[type="range"]::-webkit-slider-runnable-track {
    background: transparent;
    height: 6px;
    border-radius: 10px;
}

/* (E3) CUSTOM SLIDER BUTTON */
.aWrap input[type="range"]::-webkit-slider-thumb {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 0;
    background: #fff;
    position: relative;
    cursor: pointer;
    margin-top: -5px;
}

.aWrap input[type="range"]::-moz-range-thumb {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 0;
    background: #fff;
    position: relative;
    cursor: pointer;
    margin-top: -5px;
}

.btn,
.form-control {
    font-size: .875rem;
    line-height: 1.25rem;
    padding: 10px 16px;
    border-radius: .95rem !important;
}

.ck-editor__editable_inline {
    font-size: .875rem;
    line-height: 1.25rem;
    padding: 10px 16px;
    border-radius: .95rem !important;
    background: none !important;
    outline: 0px !important;
    box-shadow: none !important;
    color: #fff !important;
    width: 100% !important;
    margin: 0px !important;
    font-weight: 500;
    padding: 10px 16px;
    border-radius: 15px !important;
    border: 1px solid #232329;
    font-size: 14px;
}

/* (F) VOLUME */
.aVolIco {
    margin: 0 10px;
    cursor: pointer;
}

input.aVolume {
    width: 100px !important;
}

.aVolume::-webkit-slider-runnable-track {
    height: 10px !important;
}

.aVolume::-webkit-slider-thumb {
    margin-top: -3px !important;
}

.aVolume::-moz-range-thumb {
    margin-top: -3px !important;
}

.volume-container {
    display: flex;
    align-items: center;
}

/*----------------------------------------*/

.plans {
    width: 96%;
    max-width: 1128px;
    margin: 0 auto;
}

.plans__container {
    padding: 1rem 0 2rem;
}

.plansHero {
    text-align: center;
    padding: 3rem 0 1.5rem;
    line-height: 1.21;
}

.plansHero__title {
    font-weight: 700;
    font-size: 2rem;
    margin: 0 0 1rem 0;
    color: #000;
}

.plansHero__subtitle {
    margin: 0;
}

.planItem {
    --border: 1px solid #e6e6e6;
    --bgColor: #fff;
    --boxShadow: none;
    background-color: var(--bgColor);
    border: var(--border);
    border-radius: 1rem;
    box-shadow: var(--boxShadow);
    padding: 2rem 1.5rem;
    display: inline-flex;
    flex-direction: column;
    max-width: 350px;
}

.planItem__container {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    justify-content: center;
    gap: 1.5rem;
}

.planItem .price {
    --priceMargin: 2rem 0;
}

.planItem--pro {
    --border: 0;
    --boxShadow: 0px 14px 30px rgba(204, 204, 204, 0.32);
}

.planItem--pro .label {
    --labelBg: #fdb72e;
    --labelColor: #fff;
}

.planItem--entp {
    --bgColor: var(--blue);
}

.planItem--entp .card {
    --titleColor: #fff;
    --descColor: rgb(255 255 255 / 80%);
}

.planItem--entp .card__icon {
    background-image: var(--entpIcon);
    background-size: cover;
}

.planItem--entp .price,
.planItem--entp .featureList {
    --color: #fff;
}

.planItem--entp .featureList {
    --icon: var(--whiteTick);
}

.planItem .button {
    margin-top: auto;
}

.button {
    --color: var(--pink);
    --shadowColor: rgb(234 76 137 / 30%);
    --outline: var(--pink);
    border-radius: 0.5rem;
    display: block;
    width: 100%;
    padding: 1rem 1.5rem;
    border: 0;
    line-height: inherit;
    font-family: inherit;
    font-size: 1rem;
    font-weight: 600;
    background-color: #D23C3C;
    color: var(--color);
    cursor: pointer;
    transition: all 0.1s ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.button--pink {
    --bgColor: var(--pink);
    --color: #fff;
    --shadowColor: rgba(247, 44, 44, 0.5);
}

.button--white {
    --bgColor: #fff;
    --shadowColor: rgb(255 255 255 / 30%);
    --outline: #fff;
}

.button:hover {
    transform: translateY(-2px);
    box-shadow: 0px 6px 10px rgba(247, 44, 44, 0.5);
}

.button:focus-visible {
    outline-offset: 2px;
    outline: 2px solid var(--outline);
}

.planItem--ex {
    border: 2px solid #D23C3C !important;
    margin-top: -20px;
}

.form-control {
    background: none !important;
    outline: 0px !important;
    box-shadow: none !important;
    color: #fff !important;
    width: 100% !important;
    margin: 0px !important;
    font-weight: 500;
    padding: 10px 16px;
    border-radius: 15px;
    border: 1px solid #232329;
    font-size: 14px;
}

option {
    background: #111114;
}

option:hover {
    background: #D23C3C !important;
}

.btn {
    border-radius: 12px !important;
}

.card_edit_profile {
    max-width: 900px;
    margin: 0 auto;
}

#picture__input {
    display: none;
}

.picture {
    border-radius: 1rem;
    aspect-ratio: 16/9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #aaa;
    border: 2px dashed currentcolor;
    cursor: pointer;
    font-family: sans-serif;
    transition: color 300ms ease-in-out, background 300ms ease-in-out;
    outline: none;
    overflow: hidden;
    width: 300px !important;
    height: 250px !important;
}

.picture:hover {
    color: #777;
}

.picture:active {
    border-color: #e45555;
    color: #e45555;
}

.picture:focus {
    color: #777;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.picture__img {
    max-width: 100%;
}


.form-control:focus {
    border: 1px solid #D23C3C !important;
}

.form-text {
    color: #b1b8c9;
}

.sidebar_nav_btn .dropdown {
    position: relative;
    z-index: 99;
}

.card_profile_user {
    position: relative;
    z-index: 2;
}

::-webkit-scrollbar {
    width: 6px;
    height: 6px;
    border-radius: .75rem;
}

::-webkit-scrollbar-thumb {
    background: #6b6b6b4f;
}

::-webkit-scrollbar-track {
    background: 0 0;
}

.card {
    border-radius: 1rem;
    background: #121216;
    border: 2px solid #16161b;
    color: #ffffff;
}

.card__header {
    display: flex;
    gap: 1rem;
    align-items: center;
}

.card__icon {
    width: 2.625rem;
    height: 2.625rem;
}

.card h2 {
    color: var(--titleColor);
    font-size: 1.5rem;
    line-height: 1.2;
    font-weight: 400;
    margin: 0;
    flex-grow: 1;
}

.card__desc {
    margin: 1.5rem 0 0;
    color: var(--descColor);
}

.label {
    --labelColor: var(--baseColor);
    --labelBg: #e5e5e5;
    font-weight: 600;
    line-height: 1.25;
    font-size: 1rem;
    text-align: center;
    padding: 0.625rem 1.125rem;
    border-radius: 2rem;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: var(--labelBg);
    color: var(--labelColor);
}

.price {
    --priceMargin: 0;
    display: flex;
    color: var(--color);
    align-items: center;
    gap: 0.5625rem;
    font-weight: 600;
    font-size: 2rem;
    margin: var(--priceMargin);
}

.price span {
    font-size: 1rem;
    font-weight: 400;
    color: var(--baseColor);
}

.featureList {
    --icon: var(--redTick);
    --height: 0.875rem;
    margin: 0 0 2.75rem;
    padding: 0;
    font-weight: 500;
}

.featureList li {
    color: var(--color);
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/*.featureList li:before {
    content: "";
    background-image: var(--icon);
    background-size: cover;
    display: block;
    width: 1.125rem;
    height: var(--height);
}*/

.featureList li:last-child {
    margin-bottom: 0;
}

.featureList li.disabled {
    --color: #b1b8c9;
    --height: 1.125rem;
    --icon: var(--close);
}

.symbol {
    --big: 2.625rem;
    --small: 1.5rem;
    --radius: 0.25rem;
    border: 2px solid var(--blue);
    width: var(--big);
    height: var(--big);
    border-radius: var(--radius);
    position: relative;
}

.symbol--rounded {
    --radius: 2rem;
}

.symbol:after {
    content: "";
    box-sizing: border-box;
    display: block;
    position: absolute;
    border: 2px solid var(--pink);
    width: var(--small);
    height: var(--small);
    border-radius: var(--radius);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

@media screen and (max-width: 640px) {
    .plans {
        max-width: 480px;
        width: 90%;
    }

    .planItem__container {
        --direction: row;
    }
}

@media screen and (min-width: 641px) and (max-width: 768px) {
    :root {
        --baseSize: 12px;
    }
}

#btn_menu {
    display: none;
}

.d-flex-mob-991 {
    display: flex !important;
}

.close-m {
    display: none;
}

.nav-pills {
    padding-left: 1rem;
}

.offcanvas {
    width: 100% !important;
}

.btn_menu_mob {
    display: none;
}

.tovar_block {
    padding-right: 1.5rem !important;
}

.border-radius-none {
    border-radius: 0px !important;
}

@media(max-width: 991px) {

    .navbar-nav {
        display: none;
    }

    .t-b-b {
        display: block !important;
    }
}

.tovar_blockk {
    display: flex;
}

@media(max-width: 991px) {

    .container-tovar {
        display: grid;
        justify-content: center;
    }

    .tovar_blockk {
        display: block;
    }

    .tovar_block {
        max-width: 100%;
    }

    .description_tovar,
    .tovar_block {
        padding: 0 1.5rem;
    }

    .description_tovar {
        margin-top: 2rem;
    }

    .d-text_mob {
        font-size: 1rem !important;
    }

    .d-flex-mob-991 {
        display: block !important;
    }
}

@media(max-width: 991px) {

    .story-content {
        grid-gap: 1rem;
        grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    }

    .story-title {
        font-size: 1rem;
    }

    .btn_menu_mob {
        display: block;
    }

    .wrap-media-991 {
        flex-wrap: wrap;
    }

}

@media(max-width: 520px) {
    .picture {
        width: 270px;
        height: 270px;
    }

    .wrap-media-520 {
        flex-wrap: wrap;
    }
}

.btn-dark {
    background: none !important;
}

@media(max-width: 420px) {

    .story-content {
        grid-gap: 1rem;
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    }

    .story-title {
        font-size: 1rem;
    }

}

.btn {
    font-weight: 500;
}

.user_imG {
    border-radius: 5px;
}

.load {
    display: none;
}

.loaded .load {
    display: grid;
}

.loaded #preloader {
    display: none !important;
}

@media screen and (min-width: 769px) and (max-width: 1080px) {
    :root {
        --baseSize: 14px;
    }
}

.planItem {
    background: #121216;
    border: 2px solid #16161b;
    box-shadow: none;
    color: #ffffff !important;
}

.audio_img {
    width: 50px;
    height: 50px;
}

.audio_img img {
    width: 50px;
    border-radius: 10px;
}

.modal-content {
    background-color: #121216;
}

.modal-backdrop {
    --bs-backdrop-opacity: 0.8;
}

.modal-content {
    border-radius: 0.85rem;
}

.h-modal {
    align-items: center;
}

.nav-link {
    display: block;
    padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
    font-size: var(--bs-nav-link-font-size);
    font-weight: var(--bs-nav-link-font-weight);
    color: rgba(255, 255, 255, 0.55) !important;
    text-decoration: none;
    background: 0 0;
    border: 0;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

.ck.ck-editor__editable_inline {
    color: #454552 !important;
    font-weight: 600;
    background: none !important;
    outline: 0px !important;
    box-shadow: none !important;
    color: #fff !important;
    width: 100% !important;
    margin: 0px !important;
    font-weight: 500 !important;
    padding: 10px 16px !important;
    border-radius: 15px !important;
    border: 1px solid #232329 !important;
    font-size: 14px !important;
}

.ck-placeholder {
    padding: 0 !important;
    margin: 0 !important;
    color: #454552 !important;
}

input::placeholder {
    color: #454552 !important;
    font-weight: 600;
}

.card {
    overflow: hidden;
}

.close-m {
    max-width: 28px;
    max-height: 28px;
}

.close-m {
    padding: 7px;
    cursor: pointer;
    border-radius: 0.5rem;
    transition: 0.2s;
}

.close-m:hover {
    background-color: #D23C3C;
}

th,
td {
    background-color: #121216 !important;
    color: #fff !important;
    border: 0px;
    align-items: center;
}

.card_wallet_h {
    padding: 0px 6px;
}

.big_input_search input {
    padding: 1rem 2rem;
}

.big_input_search .btn {
    border-radius: 20px !important;
    padding-left: .875rem !important;
    padding-right: .875rem !important;
    font-size: .875rem !important;
    font-weight: 500;
}

nav {
    position: fixed !important;
    width: 100%;
    top: 0;
    z-index: 999;
    align-items: center;
    height: 70px;
    background: #121216 !important;
}

.navbar-brand {
    color: #fff !important;
    font-weight: bold;
}

.navbar-brand {
    padding-right: 1rem;
}

footer {
    background: #0f0f11 !important;
    position: relative;
    z-index: 2;
    color: #fff !important;

    border-radius: 20px;
    border: 1.5px solid #1b1b1b;
}

a {
    color: #D23C3C;
}

.btn-danger {
    color: #fff !important;
    transition: 0.2s;
}

.btn {
    box-shadow: none !important;
}

#myCarousel {
    border-radius: .875rem !important;
    overflow: hidden;
}

/*-----------------------------FANCYAPPS--------------------------*/

.gallery-f img {
    border-radius: .85rem;
}

#myPanzoom {
    width: 100%;
    background: none;
    margin: 0 auto;
    justify-content: center;
    border-radius: 15px;
    border: 1px solid #232329;
}


.f-custom-controls {
    position: absolute;

    border-radius: 4px;
    overflow: hidden;
    z-index: 1;
}

.f-custom-controls.top-right {
    right: 16px;
    top: 16px;
}

.f-custom-controls.bottom-right {
    right: 16px;
    bottom: 16px;
}

.f-custom-controls button {
    width: 32px;
    height: 32px;
    background: none;
    border: none;
    margin: 0;
    padding: 0;
    background: #222;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.f-custom-controls svg {
    pointer-events: none;
    width: 18px;
    height: 18px;
    stroke: #fff;
    stroke-width: 2;
}

.f-custom-controls button[disabled] svg {
    opacity: 0.7;
}

[data-panzoom-action=toggleFS] g:first-child {
    display: flex
}

[data-panzoom-action=toggleFS] g:last-child {
    display: none
}

.in-fullscreen [data-panzoom-action=toggleFS] g:first-child {
    display: none
}

.in-fullscreen [data-panzoom-action=toggleFS] g:last-child {
    display: flex
}

.btn-lg {
    padding: .875rem !important;
    border-radius: .975rem !important;
}

.file-input-container {
    display: inline;
    margin: 2px;
}

.sm-input-file {
    border: 1px solid #333;
    background: #ccc;
    color: #777;
    width: 82px;
    opacity: 0;
}

.for-sm-input-file {
    width: 90px;
    height: 24px;
    border: 1px solid darkorange;
    position: absolute;
    padding: 6px;
    font-weight: bold;
    cursor: pointer;
    z-index: 30;
    text-align: center;
    font-family: consolas;
    left: 10px;
    /* box-shadow: 0px 0px 2px darkorange; */
    /* text-shadow:0px 0px 4px darkorange; */
    color: darkorange;
    padding-top: 10px;
    border-top-left-radius: 2px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 2px;
}

.for-sm-input-file:hover {
    background: rgba(241, 160, 22, 0.74);
    color: #fff;
}

.span-text {
    display: inline-flex;
    padding: 12px;
    border: 1px solid darkorange;
    border-radius: 2px;
    margin-left: 15px;
    height: 16px;
    font-family: consolas;
    background: rgba(241, 140, 22, 0.94);
    color: #fff;
    min-width: 100px;
    border-top-left-radius: 0px;
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 0px;
}