:root {
    --color-primary-dark: #444d83;
    --color-drop-down-list-back: #F6F6F6;
    --color-drop-down-list-text: #232b4f;
    --color-drop-down-list-selected-back: #ADADB3;
    --color-drop-down-list-selected-color: #232b4f;

    --color-primary: #1323b2;
    --color-secondary: #2a2b35;
    --color-bg: #ebf6fe;
    --color-light: #c2c3c5;
    --color-main-bg-darkmode: #121730;
    --color-secondary-bg-darkmode: #232b4f;
    --color-main-text-darkmode: #fff;
    --color-secondary-text-darkmode: #ccd0e3;
    --fs-large: 3.2rem;
    --fs-medium: 2.8rem;
    --fs-normal: 1.4rem;
    --fs-small: 1.2rem;
    --lh-large: 3.584rem;
    --lh-medium: 3.36rem;
    --lh-normal: 2.128rem;
    --lh-small: 1.82rem
}
.select2-container--open .select2-results__options {
  max-height: 700px !important;
  overflow-y: auto;
  
}

#orders-drop {
  max-height: 500px !important;
  overflow-y: auto;
   
}


@media (min-width:768px) {
    
    .container {
        max-width: 932px
    }
    .btn {
        gap: 1rem
    }
    :root {
        --fs-large: 4rem;
        --fs-medium: 3.2rem;
        --fs-small: 1.2rem;
        --lh-large: 4.48rem;
        --lh-medium: 3.84rem;
        --lh-small: 1.92rem
    }
    .subtitle,
    .suptitle {
        text-align: left
    }

    .container {
        max-width: 1140px
    }
}

.header {
    border-bottom: 1px solid #e1e1e2;
    padding: 0 1.6rem
}
.fix-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background-color: #fff;
    z-index: 3
}
.header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.1rem 0;
    position: relative
}
.header__logo img {
    max-width: 200px
}
.header__nav {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 3.2rem
}
.nav-link {
    font-size: var(--fs-small);
    color: #67686e;
    font-weight: 500;
    position: relative
}
.nav-link,
.nav-link:after {
    transition: all .15s linear
}
.nav-link:after {
    position: absolute;
    top: 4.2rem;
    left: 0;
    content: "";
    width: 0;
    height: 4px;
    background-color: var(--color-primary)
}
.nav-link:hover {
    color: var(--color-primary)
}
.nav-link:hover:after {
    width: 100%
}
.header__right {
    display: flex;
    align-items: center;
    gap: 2rem
}
.hide-header__right {
    display: none
}
.header_right_btns {
    display: flex;
    align-items: center;
    gap: 1.6rem
}
.dark-mode-btns {
    padding: .3rem;
    border-radius: 100px;
    display: flex;
    gap: 6px;
    display: none
}
.dark-mode-btns,
.moon-btn {
    background-color: #e1e1e2;
    justify-content: center;
    align-items: center
}
.moon-btn,.sun-btn {
    padding: .4rem;
    display: flex;
    border: none;
    border-radius: 50%
}
.sun-btn {
    background-color: #fff;
    justify-content: center;
    align-items: center
}
.header__btn {
    padding: .6rem .8rem;
    gap: .4rem;
    transition: all .3s ease-out
}
.hamburger {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: .56rem
}
.hamburger>div {
    height: .24rem;
    background-color: #02030e;
    border-radius: 15px
}
.hamburger-line1 {
    width: 24px
}
.hamburger-line2 {
    width: 15px;
    align-self: flex-end
}
.hamburger-line3 {
    width: 20px;
    align-self: flex-end
}
.exit-btn,.mobile-exit-btns {
    display: none
}
.show-exit-btn {
    display: flex !important;
    align-items: center;
    gap: 1rem
}
.nav-small {
    transform: translateX(100%);
    transition: all .2s linear;
    position: fixed;
    top: 63px;
    height: calc(100vh - 70px);
    left: 0;
    right: 0;
    background-color: #fff;
    z-index: 3;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    align-items: stretch
}
.nav-small-open {
    transform: translateX(0)
}
.nav-small__illustrator2 {
    position: absolute;
    top: -23px;
    right: 5%;
    width: 101px;
    z-index: -1
}
.nav-links {
    padding: 7.2rem 0 10rem;
    flex-direction: column;
    gap: 4.4rem;
    height: 100%;
    z-index: 1;
    position: relative
}
.nav-links,.nav-small__social {
    display: flex;
    align-items: center
}
.nav-small__social {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 0 16.07px 32px rgba(0, 0, 0, .12);
    justify-content: center;
    position: absolute;
    z-index: 2
}
.nav-small__social img {
    width: 29.7px;
    height: 29.7px
}
.nav-small__instagram {
    left: 10%;
    top: 15%
}
.nav-small__tiktok {
    right: 7%;
    bottom: -10px
}
.nav-small__illustrator9 {
    width: 115px;
    position: absolute;
    bottom: 0;
    left: 18%
}
.nav-links .nav-link {
    font-size: 2rem;
    line-height: 2.48rem;
    font-weight: 400;
    color: #67686e
}
.nav-small__bottom {
    margin-top: auto;
    padding: 2.4rem 1.6rem;
    border-top: 1px solid #e1e1e2
}
.nav-small__btn {
    padding: 2rem 0
}
.for_mobile_darkmode {
    display: none
}
@media (min-width:768px) {
    .for_mobile_darkmode {
        display: none !important;
    }
    .dark-mode-btns {
        display: flex;
    }
    .moon-btn,.sun-btn {
        padding: .5rem;
    }
    .dark-mode-btns {
        padding: .6rem;
    }
    .header {
        padding: 0 4rem;
    }
    .header__inner {
        padding-right: 5.5rem;
    }
    .header__nav {
        display: flex;
    }
    .header__btn {
        padding: 1.2rem 2.3rem 1.2rem 2.7rem;
    }
    .hamburger {
        display: none;
    }
}
.welcome {
    padding: 2rem;
    background-color: #ffffff;
}
.body-dark .welcome{
    background-color: var(--color-main-bg-darkmode) !important;
    
}
.welcome__inner {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 4.8rem
}
.welcome__left .suptitle {
    text-align: left
}
.welcome__title {
    margin-bottom: 1.6rem
}
form {
    display: flex;
    flex-direction: column;
    gap: 1.2rem
}
.input-field {
    display: flex;
    align-items: center;
    gap: .8rem;
    padding: 1rem 1.2rem;
    border: 1px solid #e1e1e2;
    border-radius: .8rem
}
.input-field input {
    font-size: var(--fs-small);
    line-height: var(--lh-small);
    color: var(--color-light);
    border: none;
    outline: none;
    text-indent: .4rem;
    width: 100%
}
.form-info {
    margin-top: .4rem;
    margin-bottom: 1.2rem;
    justify-content: space-between
}
.form-info,.form-info div {
    display: flex;
    align-items: center
}
.form-info div {
    gap: .8rem
}
.form-info input,.form-info label {
    user-select: none;
    cursor: pointer
}
.form-btns {
    display: flex;
    align-items: center;
    gap: 1.2rem
}
.form-btn--dark {
    padding: 1.4rem 3.6rem
}
.black-welcome__img {
    display: none
}
@media (min-width:768px) {
    .welcome {
        padding: 2rem;
    }
    .welcome__inner {
        flex-direction: row;
        gap: 5rem;
    }
    .welcome__left{
        text-align: left;
    }
    .welcome__left,.welcome__right {
        width: 50%;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        justify-content: center;

    }
    .black-welcome__img {
        display: none
    }
}
.social-media {
    padding: 1.6rem 1.6rem 0;
    margin-bottom: 7.2rem
}
.social-media__inner {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(127.5px, 1fr));
    gap: 2.4rem;
    padding: 3.2rem;
    background-color: var(--color-bg);
    border-radius: 1.6rem;
    >div {
        height: 56px;
        border-radius: 1.2rem;
        display: flex;
        align-items: center;
        justify-content: center
    }
    .sm__facebook {
        background-color: #0963f7
    }
    .sm__whatsup {
        background-color: #5cbc68
    }
    .sm__instagram {
        background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, transparent 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, transparent 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, transparent 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, transparent), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d)
    }
    .sm__youtube {
        background-color: #f60001
    }
    .sm__linkedin {
        background-color: #077bb9
    }
    .sm__tiktok {
        background-color: #02030e
    }
    .sm__telegram {
        background-color: #33a4d9
    }
}
@media (min-width:768px) {
    .social-media {
        padding-left: 4rem;
        padding-right: 4rem
    }
    .social-media__inner {
        padding: 4rem 4.8rem;
        grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
        gap: 3.2rem;
        >div {
            height: 80px;
            border-radius: 1.6rem
        }
    }
}
@media (min-width:1030px) {
    .social-media__inner {
        gap: 4.6rem
    }
}
.benefit {
    padding: 6.4rem 1.6rem;
    margin-bottom: 6.4rem;
    background-color: var(--color-bg)
}
.benefit__inner {
    position: relative
}
.illustrator-1 {
    max-width: 136px;
    position: absolute;
    top: -121px;
    left: -16px
}
.illustrator-2 {
    position: absolute;
    transform: rotateX(180deg);
    bottom: -63px;
    right: -17px;
    z-index: 0;
    max-width: 220px
}
.benefit__top {
    margin-bottom: 4rem;
    display: grid;
    gap: 1.6rem
}
.benefit__top p {
    text-align: center;
    max-width: 600px
}
.benefit__grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(294px, 1fr));
    grid-auto-rows: minmax(206px, 263px);
    gap: 2.4rem;
    z-index: 1
}
.benefit__card {
    background-color: #fff;
    border-radius: 1.2rem;
    border: 1px solid #f5f5f5;
    flex-direction: column;
    gap: 1.6rem;
    padding: 4rem 3.2rem;
    filter: drop-shadow(15px 17px 21px -3.61px rgb(0 0 0/.03))
}
.benefit__card,
.benefit__card_img {
    display: flex;
    align-items: center;
    justify-content: center
}
.benefit__card_img {
    width: 48px;
    height: 48px;
    background-color: var(--color-primary);
    border-radius: 50%
}
.benefit__card_content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .8rem
}
.benefit__card_title {
    font-size: var(--fs-normal);
    line-height: 1.568rem;
    font-weight: 800;
    color: #02030e;
    text-align: center
}
.benefit__card_text {
    font-size: var(--fs-small);
    line-height: 1.872rem;
    text-align: center
}
@media (min-width:768px) {
    .benefit {
        padding: 9.6rem 4rem 7.5rem;
        margin-bottom: 4.3rem
    }
    .illustrator-1 {
        max-width: 188px;
        top: -178px;
        left: -102px
    }
    .illustrator-2 {
        bottom: -75px;
        right: -40px;
        max-width: 332px
    }
    .benefit__top h2 {
        padding-right: 4rem
    }
    .benefit__top p {
        text-align: left
    }
    .benefit__grid {
        grid-auto-rows: minmax(215px, 1fr)
    }
    .benefit__card {
        padding: 2.4rem;
        justify-content: flex-start;
        gap: 2.4rem
    }
    .benefit__card,
    .benefit__card_content {
        align-items: flex-start
    }
    .benefit__card_text,
    .benefit__card_title {
        text-align: left
    }
}

@media (min-width:932px) {
    .benefit__top {
        grid-template-columns: minmax(458px, 1fr) minmax(372px, 1fr)
    }
}
@media (min-width:972px) {
    .benefit__top {
        gap: 10.2rem
    }
}
@media (min-width:1150px) {
    .illustrator-2 {
        right: -110px
    }
}
.quick-response {
    padding: 2rem 2.6rem;
}
.quick-response__inner {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: 2.4rem
}
.black-response__img,.quick-response__img {
    position: relative;
    width: 100%;
    z-index: 1
}
.black-response__img {
    display: none
}
.quick-response__right {
    display: flex;
    flex-direction: column
}
.quick-response__subtitle {
    margin-bottom: 1.6rem
}
.quick-response__text {
    margin-bottom: 3.2rem;
    text-align: center
}
.quick-response__btn {
    align-self: center;
    padding: 1rem 2.85rem
}
.quick-response__bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    height: 40px;
    background-color: var(--color-bg)
}
@media (min-width:768px) {
    .quick-response {
        padding: 4rem 4rem
    }
    .quick-response__inner {
        flex-direction: row;
        gap: 4.5rem
    }
    .quick-response__left {
        width: 50%
    }
    .black-response__img,.quick-response__img {
        width: 113%;
        transform: translateX(-34px)
    }
    .black-response__img {
        display: none
    }
    .quick-response__right {
        display: flex;
        flex-direction: column;
        width: 50%
    }
    .quick-response__text {
        margin-bottom: 4rem;
        text-align: left
    }
    .quick-response__btn {
        align-self: start
    }
}

@media (min-width:1024px) {
    .black-response__img,
    .quick-response__img {
        width: 113%;
        transform: translateX(-54px)
    }
    .black-response__img {
        display: none
    }
}
.quick-response-details {
    padding: 0 1.6rem;
    background-color: var(--color-bg);
    margin-bottom: 4.6rem;
    overflow-x: hidden
}
.quick-response-details__inner {
    padding-top: 1.6rem;
    padding-bottom: 4.8rem;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 1.6rem
}
.quick-response-detail {
    flex: 1;
    background-color: #fff;
    padding: 2.4rem;
    display: flex;
    align-items: center;
    gap: 2.4rem;
    border: 1px solid #f5f5f5;
    border-radius: 1.2rem;
    filter: drop-shadow(10px 18px 22px -3.61 rgb(0 0 0/.05));
    position: relative;
    z-index: 2
}
.quick-response-detail__img {
    width: 64px;
    height: 64px;
    background-color: var(--color-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
}
.quick-response-detail__content {
    display: flex;
    flex-direction: column;
    gap: .8rem
}
.quick-response-detail__content span:first-child {
    font-size: 2rem;
    line-height: 2.48rem;
    color: #02030e;
    font-weight: 800
}
.quick-response-detail__content span:last-child {
    font-size: var(--fs-small);
    line-height: 1.872rem;
    color: var(--color-secondary);
    font-weight: 400
}
.quick-response-details__illustrator {
    position: absolute;
    width: 337px;
    bottom: 0;
    left: 80%;
    transform: translateX(-50%);
    z-index: 1
}
@media (min-width:932px) {
    .quick-response-details {
        padding: 0 4rem;
        background-color: var(--color-bg);
        position: relative;
        overflow-x: visible
    }
    .quick-response-details__inner {
        padding-top: 2.4rem;
        padding-bottom: 6.4rem;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 2.4rem
    }
    .quick-response-details__illustrator {
        position: absolute;
        width: 337px;
        top: -19%;
        left: 87%;
        z-index: 1
    }
}
@media (min-width:1140px) {
    .quick-response-details__illustrator {
        left: 93%
    }
}
.faq {
    padding-left: 1.6rem;
    padding-right: 1.6rem;
    margin-bottom: 6.4rem
}
.faq__inner {
    display: flex;
    flex-direction: column;
    gap: 2.4rem
}
.faq__subtitle {
    margin-bottom: 2.4rem
}
.possible-faqs {
    gap: 1.6rem
}
.accordion,.possible-faqs {
    display: flex;
    flex-direction: column
}
.accordion__label {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: var(--color-bg);
    padding: .8rem 2.4rem;
    font-size: var(--fs-normal);
    line-height: 2.24rem;
    font-weight: 500;
    border: 1px solid #85c7f7;
    border-radius: 4px;
    cursor: pointer
}
.accordion__label:before {
    content: "+";
    position: absolute;
    top: 50%;
    right: 2.4rem;
    transform: translateY(-50%)
}
.accordion__body__active .accordion__label:before {
    content: "-"
}
.accordion__body {
    position: relative;
    padding: 0 2.4rem;
    font-size: var(--fs-small);
    line-height: 1.872rem;
    color: var(--color-secondary);
    height: 0;
    overflow: hidden;
    transition: all .3s linear
}
.accordion__body__active .accordion__body {
    height: 150px;
    padding-top: 1rem;
    height: 100%
}
.faq__img {
    width: 100%
}
.black__faq__img {
    width: 100%;
    display: none
}
@media (min-width:768px) {
    .faq {
        margin-bottom: 1.4rem;
        padding-left: 4rem;
        padding-right: 4rem
    }
    .faq__inner {
        flex-direction: row;
        gap: 8rem
    }
    .faq__left {
        width: 50%
    }
    .faq__subtitle {
        margin-bottom: 2rem
    }
    .faq__right {
        width: 50%
    }
    .faq__img {
        width: 120%
    }
    .black__faq__img {
        width: 100%;
        display: none
    }
}
.why-us {
    padding: 6.4rem 1.6rem;
    background-color: var(--color-bg);
    position: relative
}
.why-us__inner {
    display: flex;
    flex-direction: column-reverse;
    gap: 3.2rem
}
.why-us__left {
    display: grid;
    align-items: center;
    gap: 2rem;
    position: relative;
    z-index: 1
}
.why-us__reason {
    background-color: #fff;
    border-radius: 1.2rem;
    border: 1px solid #f5f5f5;
    filter: drop-shadow(10px 18px 22px -3.61px rgb(0 0 0/.05));
    padding: 5rem 4.8rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2rem
}
.why-us__reason_img {
    width: 64px;
    height: 64px;
    background-color: var(--color-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center
}
.why-us__reason_title {
    font-size: 1.6rem;
    line-height: 1.792rem;
    color: #02030e;
    font-weight: 800;
    text-align: center
}
.why-us__right {
    display: flex;
    flex-direction: column;
    align-items: center
}
.why-us__subtitle {
    margin-bottom: 1.6rem
}
.why-us__text {
    margin-bottom: 3.2rem;
    text-align: center;
    max-width: 600px
}
.why-us__btn {
    padding: 1.4rem 2.85rem
}
.why-us__illustrator {
    position: absolute;
    bottom: 0;
    right: 50%;
    transform: translateX(50%);
    width: 234px;
    z-index: 0
}
@media (min-width:768px) {
    .why-us {
        padding: 6.4rem 4rem;
        background-color: var(--color-bg);
        position: relative
    }
    .why-us__left {
        grid-template-columns: repeat(auto-fit, minmax(343px, 1fr));
        align-items: stretch
    }
    .why-us__reason {
        padding: 4rem 2.4rem 4.2rem;
        align-items: flex-start
    }
    .why-us__reason_title {
        text-align: left
    }
    .why-us__right {
        align-items: flex-start
    }
    .why-us__text {
        margin-bottom: 4rem;
        text-align: left
    }
    .why-us__btn {
        padding: 1.4rem 2.85rem;
        align-self: flex-start
    }
    .why-us__illustrator {
        position: absolute;
        bottom: 0;
        right: 11%;
        transform: translateX(0);
        right: 0;
        width: 338px
    }
}
@media (min-width:932px) {
    .why-us__inner {
        flex-direction: row;
        gap: 8rem
    }
    .why-us__left {
        width: 50%;
        width: 454px;
        grid-template-columns: repeat(auto-fit, minmax(217px, 1fr))
    }
    .why-us__right {
        width: 50%;
        padding-top: 43px
    }
    .why-us__reason_title {
        text-align: left
    }
    .why-us__subtitle {
        margin-bottom: 1.6rem
    }
    .why-us__text {
        margin-bottom: 4rem
    }
    .why-us__btn {
        padding: 1.4rem 2.85rem
    }
    .why-us__illustrator {
        position: absolute;
        bottom: 0;
        right: 11%;
        width: 338px
    }
}

.reseller {
    position: relative;
    padding: 8.8rem 1.6rem 0;
    margin-bottom: 6.4rem
}

.reseller__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3.2rem
}

.reseller__left .suptitle {
    text-align: left
}

.reseller__left .reseller__title {
    margin-bottom: 1.6rem;
    text-align: left
}

.reseller__text {
    margin-bottom: 1.6rem
}

.reseller__quesions {
    display: flex;
    flex-direction: column;
    gap: 1.2rem
}

.reseller__question {
    background-color: #fff;
    font-size: 1.6rem;
    line-height: 1.76rem;
    color: #293239;
    font-weight: 700;
    padding: 1.8rem 2.4rem;
    border: 1px solid #85c7f7;
    border-radius: 1.2rem;
    transition: all .15s ease-out;
    display: flex;
    align-items: center;
    gap: 1.8rem
}

.reseller__right {
    background-color: var(--color-bg);
    padding: 3.2rem 2.4rem;
    border-radius: 1.6rem;
    display: flex;
    flex-direction: column;
    gap: 3.2rem;
    overflow-y: scroll;
    scrollbar-width: 2px;
    scrollbar-color: var(--color-primary);
    max-height: 504px
}

.services__right {
    max-height: 661px
}

.reseller__info {
    display: flex;
    flex-direction: column;
    gap: 1.2rem
}

.reseller__info_title {
    font-size: 1.6rem;
    line-height: 1.76rem;
    font-weight: 700;
    color: #02030e
}

.reseller__info_text {
    font-size: var(--fs-small);
    line-height: 1.872rem;
    font-weight: 400;
    color: var(--color-secondary)
}

._auth.nightmode .reseller__info_text {
    color: #b1bae5 !important
}

._auth.nightmode .reseller__info_title {
    color: #fff !important
}

.reseller__illustrator {
    position: absolute;
    width: 104px;
    top: 0;
    left: 0
}

@media (min-width:768px) {
    .reseller {
        padding: 6.4rem 4rem 0;
        margin-bottom: 6.8rem
    }

    .reseller__inner {
        flex-direction: row;
        gap: 5.2rem
    }

    .reseller__left {
        width: 50%
    }

    .reseller__question:hover {
        cursor: pointer;
        background-color: var(--color-primary) !important;
        border-color: var(--color-primary);
        color: #fff
    }

    .reseller__question:hover .svg-path {
        fill: #fff
    }

    .reseller__right {
        padding: 4.8rem;
        width: 50%
    }

    .services__right {
        max-height: 661px
    }

    .reseller__illustrator {
        width: 175px
    }
}

.services {
    margin-bottom: 0;
    padding: 0 1.6rem 7.2rem
}

.services__inner {
    position: relative
}

.services__left,
.services__right {
    position: relative;
    z-index: 2
}

.services__illustrator {
    position: absolute;
    max-width: 273px;
    left: 50%;
    transform: translateX(-40%);
    bottom: -72px;
    z-index: 1
}

@media (min-width:768px) {
    .services {
        padding-bottom: 5.1rem;
        padding-left: 4rem;
        padding-right: 4rem
    }

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

    .services__illustrator {
        position: absolute;
        max-width: 273px;
        left: 37%;
        transform: translateY(-50%);
        bottom: -110px;
        z-index: 1
    }
}

.testimonials {
    background-color: var(--color-bg);
    padding: 6.4rem 1.6rem;
    margin-bottom: 6.4rem;
    position: relative;
    overflow: hidden
}

.testimonials__title {
    margin-bottom: 3.2rem
}

.testimonials__slider-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center
}

.slider__quote {
    width: 72px;
    height: 72px;
    background-color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.6rem
}

.testimonials__slider {
    width: 100%;
    position: relative;
    max-width: 614px;
    margin-bottom: 4rem
}

.testimonials__slider .carousel {
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: calc(100% - 12px);
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 16px;
    scroll-behavior: smooth;
    scrollbar-width: none
}

.carousel::-webkit-scrollbar {
    display: none
}

.carousel.no-transition {
    scroll-behavior: auto
}

.carousel.dragging {
    scroll-snap-type: none;
    scroll-behavior: auto
}

.carousel.dragging .card {
    cursor: grab;
    user-select: none
}

.carousel .card {
    scroll-snap-align: start;
    list-style: none;
    cursor: pointer;
    padding-bottom: 15px;
    flex-direction: column
}

.slider__text {
    font-size: 2.2rem;
    line-height: 3.344rem;
    color: var(--color-secondary);
    font-weight: 500;
    text-align: center
}

.user__info {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.2rem
}

.user__details {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    gap: .2rem
}

.username {
    font-size: 1.6rem;
    line-height: 1.76rem;
    color: #000b13;
    font-weight: 700
}

.user-status {
    color: #67686e
}

.slider__navigation {
    align-self: center;
    display: flex;
    align-items: center;
    gap: 1.6rem
}

.sldier-btn {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: none;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    transition: all .12s linear
}

.sldier-btn:active {
    transform: scale(.95)
}

.testimonials__illustrator {
    position: absolute;
    max-width: 76px;
    top: 124px;
    right: -37px
}

@media (min-width:768px) {

    .testimonials__top .suptitle,
    .testimonials__top .testimonials__title {
        text-align: center
    }

    .testimonials__illustrator {
        max-width: 140px
    }
}

@media (min-width:932px) {
    .testimonials {
        padding: 6.4rem 4rem;
        margin-bottom: 9.6rem
    }

    .testimonials__top .suptitle {
        text-align: left
    }

    .testimonials__top .testimonials__title {
        text-align: left;
        margin-bottom: 6rem
    }

    .testimonials__slider-wrapper {
        flex-direction: row;
        align-items: flex-start;
        justify-content: space-between
    }

    .slider__quote {
        width: 88px;
        height: 88px;
        margin-bottom: 0
    }

    .testimonials__slider {
        gap: 4rem;
        margin-bottom: 0
    }

    .slider__text {
        font-size: 2.4rem;
        line-height: 3.648rem;
        text-align: left
    }

    .user__info {
        align-items: flex-start;
        justify-content: flex-start
    }

    .slider__navigation {
        align-self: flex-end
    }

    .sldier-btn:hover {
        cursor: pointer;
        background-color: var(--color-primary)
    }

    .sldier-btn:active {
        transform: scale(.95)
    }

    .sldier-btn:hover .nav-svg {
        stroke: #fff
    }

    .testimonials__illustrator {
        max-width: 140px;
        top: 64px
    }
}

.qaa {
    padding-left: 1.6rem;
    padding-right: 1.6rem;
    margin-bottom: 6.4rem
}

.qaa__inner {
    gap: 2.4rem
}

.qaa__inner,
.qaa__top {
    display: flex;
    flex-direction: column
}

.qaa__top {
    align-items: flex-start;
    gap: 1.6rem
}

.qaa__top .suptitle {
    text-align: left
}

.qaa__bottom {
    align-items: flex-start
}

.qaa__bottom,
.qaa__bottom>div {
    display: flex;
    flex-direction: column;
    gap: 1.6rem
}

@media (min-width:768px) {
    .qaa {
        padding-left: 4rem;
        padding-right: 4rem;
        margin-bottom: 3.5rem
    }

    .qaa__inner {
        gap: 4rem
    }

    .qaa__top {
        flex-direction: row;
        gap: 3.2rem
    }

    .qaa__top>div {
        width: 50%
    }

    .qaa__bottom {
        flex-direction: row;
        gap: 3.2rem
    }

    .qaa__bottom>div {
        width: 50%;
        display: flex;
        flex-direction: column;
        gap: 1.6rem
    }
}

.subscribe {
    margin-bottom: 2.4rem;
    padding-left: 1.6rem;
    padding-right: 1.6rem;
    z-index: 3
}

.subscribe__inner {
    display: flex;
    flex-direction: column;
    gap: 4rem;
    background-color: #1323b2;
    padding: 4.8rem 1.6rem 2rem;
    border-radius: 1.6rem;
    justify-content: center;
}

.subscribe__left .subscribe__title {
    color: #fff;
    margin-bottom: .8rem;
    text-align: left
}

.subscribe__text {
    font-size: var(--fs-small);
    line-height: 1.824rem;
    font-weight: 500;
    color: #ebf6fe;
    margin-bottom: 3.2rem
}

.subscribe__field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
    padding: .4rem .4rem .4rem 2rem;
    background-color: #fff;
    border-radius: 100px;
    filter: drop-shadow(10px 10px 11.5rem -3.61px rgb(8 63 103/.23))
}

.subscribe__field_input {
    flex: 1;
    font-size: var(--fs-small);
    line-height: 1.824rem;
    color: #c2c3c5;
    font-weight: 500;
    border: none;
    outline: none
}

.subscribe__field_btn {
    font-size: var(--fs-small);
    color: #fff;
    padding: 1.4rem 1.95rem;
    background-color: var(--color-primary);
    border-radius: 10rem;
    border: none;
    font-weight: 700;
    filter: 2px 2px 6px 0 rgb(0 139 239/.25);
    transition: all .1s linear;

    &:active {
        transform: scale(.95)
    }
}

.panel,
.subscribe__right {
    position: relative
}

.panel {
    display: block;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
    z-index: 1
}

.panel-large {
    display: none
}

.black-subscribers,
.subscribers {
    position: absolute;
    bottom: 35px;
    right: -7px;
    width: 60%;
    max-width: 300px;
    z-index: 2;
    border-radius: 8px
}

.black-subscribers,
.hide-imgs {
    display: none
}

@media (min-width:768px) {
    .subscribe {
        margin-bottom: 4rem;
        padding-left: 4rem;
        padding-right: 4rem;
        overflow-x: hidden
    }
}

@media (min-width:932px) {
    .subscribe {
        padding-top: 5rem
    }

    .subscribe__inner {
        flex-direction: row;
        padding: 6.2rem 5.6rem
    }

    .subscribe__left {
        width: 50%
    }

    .subscribe__field {
        padding: .4rem .4rem .4rem 2.4rem
    }

    .subscribe__field_btn {
        padding: 1.4rem 4.2rem;

        &:hover {
            cursor: pointer
        }
    }

    .subscribe__right {
        width: 50%
    }

    .subscribe__right img {
        position: absolute
    }

    .panel {
        display: none
    }

    .panel-large {
        display: block;
        max-width: 374px;
        bottom: -62px;
        right: -56px;
        border-bottom-right-radius: 1.6rem
    }

    .black-subscribers,
    .subscribers {
        right: -46px;
        bottom: -18px;
        max-width: 189px
    }
}

@media (min-width:1140px) {

    .black-subscribers,
    .subscribers {
        right: -114px
    }
}

.payment {
    padding-left: 1.6rem;
    padding-right: 1.6rem;
    margin-bottom: 2.4rem
}

.payment-none,
.payment__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.685rem
}

.payment-none img,
.payment__inner img {
    max-width: 122px;
    min-width: 95px
}

@media (min-width:768px) {
    .payment {
        padding-left: 4rem;
        padding-right: 4rem;
        margin-bottom: 4rem
    }

    .payment-none,
    .payment__inner {
        gap: 3.6rem
    }
}

.footer {
    background-color: var(--color-primary);
    padding: 3.2rem
}

.footer__inner {
    display: flex;
    flex-direction: column-reverse;
    align-items: center;
    gap: 4rem;
    justify-content: space-between
}

.footer__inner .footer__copyright {
    color: #fff;
    text-align: center
}

.footer__contact {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .8rem
}

.footer__phone {
    display: flex;
    align-items: center;
    gap: 1.2rem
}

.footer__contact>span,
.footer__phone>a {
    color: #fff
}

.footer__contact>button {
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    padding: 1.4rem 6.7rem;
    background-color: #ff8b00;
    border-radius: 100px;
    border: 1px solid #fff;
    transition: all .1s linear;

    &:active {
        transform: scale(.95)
    }
}

@media (min-width:768px) {
    .footer {
        padding: 1.6rem 4rem
    }
}

@media (min-width:827px) {
    .footer__inner {
        flex-direction: row;
        gap: 2rem
    }

    .footer__inner .footer__copyright {
        color: #fff;
        text-align: left
    }

    .footer__contact {
        flex-direction: row;
        gap: 1.2rem
    }

    .footer__contact>span {
        margin-right: .4rem
    }

    .footer__contact>button {
        padding: 1.4rem 2.25rem;

        &:hover {
            cursor: pointer
        }
    }
}

.signUp {
    width: 100%;
    height: auto;
    background-color: var(--color-bg);
    padding: 6.4rem 10.4rem
}

.bg-img {
    width: 33.2rem;
    height: 26.6rem;
    position: absolute;
    top: 75px;
    right: -1px;
    z-index: 0
}

.signUp_inner {
    position: relative;
    width: 100%;
    background-color: #fff;
    border-radius: 2.4rem
}

.signUp_head_text {
    display: flex;
    flex-direction: column;
    padding: 0 3.6rem
}

.signUp_top {
    width: 95%;
    padding: 8rem 8rem 4rem 0;
    border-bottom: 1px solid #e1e1e2;
    margin: 0 auto
}

.signUp_h1 {
    width: auto;
    height: auto;
    text-align: left
}

.signUp_bottom {
    display: flex;
    justify-content: center;
    gap: 3.2rem;
    padding: 4rem 8rem
}

.signUp_left,
.signUp_right {
    gap: 2.4rem
}

.label,
.signUp_left,
.signUp_right {
    width: 100%;
    display: flex;
    flex-direction: column
}

.label {
    height: 4rem;
    border-radius: .8rem;
    border: 1px solid #e1e1e2
}

.label input[type=text] {
    font-size: var(--fs-small);
    line-height: var(--lh-small);
    color: var(--color-light);
    border: none;
    outline: none;
    text-indent: .4rem;
    padding: .8rem;
    border-radius: .8rem
}

.label span {
    font-family: Manrope;
    font-size: 1.1rem;
    font-weight: 400;
    line-height: 1.65rem
}

.sign_up_btn {
    width: 18.65rem;
    height: 4rem;
    border: none
}

.recaptcha_ {
    display: flex;
    flex-direction: column;
    gap: 2.4rem;
    padding: 4rem 0 0 8rem
}

.sign_in_account {
    display: flex;
    font-family: Manrope;
    font-size: 1.2rem;
    gap: 10px
}

.sign_in_account p {
    font-weight: 400;
    line-height: 1.872rem
}

.sign_in_account a {
    font-weight: 800;
    line-height: 1.824rem;
    color: var(--color-primary)
}

.checkbox_sign_up {
    display: flex;
    flex-direction: column;
    gap: 1.2rem
}

.sign_checkbox {
    display: flex;
    align-items: center;
    gap: .8rem
}

.sign_checkbox span b {
    color: var(--color-primary);
    font-family: Manrope;
    font-weight: 800
}

.subscribe_for_img {
    position: relative
}

.position_img {
    width: 17.5rem;
    height: 18.3rem;
    left: 40%;
    bottom: -52%;
    z-index: 2
}

@media (max-width:932px) {
    .signUp_h1 {
        width: 100%
    }

    .signUp {
        height: auto;
        padding: 3rem
    }

    .signUp_inner {
        width: auto;
        height: auto;
        padding-bottom: 3rem
    }

    .signUp_head_text {
        font-size: 3.2rem;
        display: flex;
        flex-direction: column;
        align-items: start
    }

    .position_img {
        width: 15rem;
        height: 12rem;
        bottom: -20%
    }
}

@media (max-width:768px) {
    .position_img {
        width: 12rem;
        height: 10rem;
        bottom: -22%
    }

    .signUp {
        height: auto;
        padding: 3rem
    }

    .signUp_inner {
        width: auto;
        height: auto;
        padding-bottom: 3rem
    }

    .signUp_head_text {
        display: flex;
        flex-direction: column;
        align-items: start
    }

    .g-recaptcha {
        width: 100% !important
    }

    .signUp_bottom {
        flex-direction: column
    }

    .signUp_left,
    .signUp_right {
        padding: 0
    }

    .label,
    .label input[type=text] {
        width: 100%
    }

    .recaptcha_ {
        padding: 2rem 0 0 4rem
    }
}

@media (max-width:375px) {
    .position_img {
        width: 6rem;
        height: 6rem;
        bottom: -10%
    }

    .signUp_bottom {
        padding: 2rem
    }

    .label {
        width: 100%
    }

    .signUp {
        height: auto;
        padding: 3rem
    }

    .signUp_inner {
        width: auto;
        height: auto;
        padding-bottom: 10rem
    }

    .signUp_head_text {
        display: flex;
        flex-direction: column;
        align-items: start
    }

    .signUp {
        padding: 2rem
    }

    .signUp_head_text {
        font-size: 2.5rem
    }

    .signUp_inner {
        padding: 1rem
    }

    .signUp_top {
        padding: 1rem 0 3rem
    }

    .signUp_bottom {
        flex-direction: column;
        gap: 2rem
    }

    .signUp_h1 {
        font-size: 2.2rem !important
    }

    .recaptcha_ {
        padding: 2rem 0 0 2rem
    }
}

.blog_page {
    width: 100%;
    display: flex
}

.blog_left {
    width: 50%;
    height: 14.7rem;
    display: flex;
    flex-direction: column;
    gap: 1.6rem
}

.blog_inner {
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative
}

.blog_text_header {
    display: flex;
    flex-direction: column;
    align-items: start
}

.blog_right {
    width: 50%
}

.blog_boy {
    width: 120%
}

.black_blog_boy {
    width: 110%;
    display: none
}

.black_twitter,
.twitter {
    position: absolute;
    bottom: -90px;
    right: 60%
}

.black_twitter {
    display: none
}

.blog_bg_img {
    position: absolute;
    width: 18.4rem;
    height: 14.8rem
}

.showing_blogs {
    width: 100%;
    height: auto;
    display: flex;
    margin-bottom: 15.6rem
}

.showing_blogs_container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3.2rem
}

.content_headers {
    padding: 10rem;
    width: 100%;
    height: 6.1rem;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.filter_blogs {
    display: flex;
    flex-direction: column
}

.filter_blogs select {
    width: 12.5rem;
    height: 4rem;
    padding: 1rem
}

.content_blogs {
    display: flex;
    flex-direction: column;
    gap: 3.2rem
}

.blog_card {
    width: 77.2rem;
    height: 26rem;
    border: 1px solid #c2c3c5;
    border-radius: 1.2rem;
    display: flex
}

.blog_card img {
    border-radius: 1.2rem 0 0 1.2rem
}

.blog_right {
    width: 38.1rem;
    height: 32.5rem;
    margin-top: 1.8rem
}

.card_content {
    padding: 4rem;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    gap: 1.5rem
}

.card_content h2 {
    font-family: Manrope;
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 2.232rem;
    color: #111
}

.card_content p {
    font-family: Manrope;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.872rem
}

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

.read_more a {
    font-family: Manrope;
    font-size: 12px;
    font-weight: 700;
    line-height: 11.52px;
    color: var(--color-primary)
}

.blog_pagenation {
    display: flex;
    justify-content: center;
    align-items: center
}

.blog_pagenation .suptitle {
    font-size: 1.6rem;
    line-height: 1.76rem;
    font-weight: 800;
    padding-top: 1rem
}

.btn_pagenation {
    width: 3.6rem;
    height: 3.6rem;
    border: none;
    color: #fff;
    border-radius: 50%;
    font-weight: 600;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--color-primary);
    margin: 0 .181rem
}

.blog__subscribe {
    padding-top: 10rem !important
}

@media (max-width:1140px) {
    .blog_boy {
        width: 110%;
        height: 113%
    }

    .black_blog_boy {
        width: 110%;
        height: 101%;
        display: none
    }
}

.disabled {
    color: rgba(12, 16, 41, .5);
    cursor: default
}

.control:not(.disabled):hover,
.pageNumbers a:hover {
    background-color: #09094b;
    color: #fff
}

a.active {
    color: #909095
}

.hidden {
    display: none
}

@media only screen and (max-width:768px) {
    .blog_boy {
        width: 90%
    }

    .black_blog_boy {
        width: 90%;
        display: none
    }

    .blog_inner {
        flex-direction: column;
        padding: 3.2rem 1.6rem 0
    }

    .blog_inner,
    .blog_page {
        align-items: center;
        height: auto
    }

    .blog_page {
        justify-content: center
    }

    .blog_left {
        width: 100%
    }

    .blog_right {
        width: 100%;
        margin-top: 3.2rem
    }

    .blog_bg_img {
        display: none
    }

    .showing_blogs {
        height: auto;
        margin-bottom: 6.4rem
    }

    .content_headers {
        padding: 5rem
    }

    .filter_blogs select {
        width: 100%
    }

    .content_blogs {
        align-items: center;
        padding: 3.2rem 1.6rem
    }

    .blog_card {
        width: auto;
        height: auto;
        flex-direction: column
    }

    .blog_card img {
        width: auto;
        height: 21.8rem;
        border-radius: 1.2rem 1.2rem 0 0
    }
}

@media only screen and (max-width:375px) {
    .blog_boy {
        height: 113%
    }

    .black_blog_boy,
    .blog_boy {
        width: 110%;
        padding-top: 5rem
    }

    .black_blog_boy {
        height: 101%;
        display: none
    }

    .blog_inner,
    .footer__inner {
        flex-direction: column;
        align-items: center
    }

    .footer__inner {
        text-align: center
    }
}

.blogs_info {
    margin-top: 6.4rem;
    display: flex;
    justify-content: center;
    position: relative;
    margin-bottom: 8.4rem
}

.bg_img_blogInfo {
    width: 18.4rem;
    height: 14.8rem;
    position: absolute;
    top: -46px;
    right: -20px;
    transform: rotate(90deg)
}

.blogs_info_container {
    display: flex;
    flex-direction: column;
    gap: 3.2rem
}

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

.arrow-back a {
    font-family: Manrope;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.152rem;
    color: #1323b2
}

.blogs_info_container h1 {
    font-family: Manrope;
    font-size: 3.2rem;
    font-weight: 800;
    line-height: 3.84rem;
    width: 77.2rem;
    color: #010101
}

.blogs_info_container img {
    width: 77.2rem;
    height: 42.1rem;
    border-radius: 1.2rem;
    object-fit: cover
}

.blogs_info_container p {
    width: 77.2rem;
    font-family: Manrope;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.872rem;
    color: #2a2b35
}

.blogs_info_container h4 {
    font-family: Manrope;
    font-size: 1.8rem;
    font-weight: 800;
    line-height: 2.232rem;
    color: #2a2b35
}

.blogs_info_descriptions {
    display: flex;
    flex-direction: column;
    gap: 1.6rem
}

.subscribe_for_bg {
    padding-top: 6.4rem
}

.payment_for_bg,
.subscribe_for_bg {
    background-color: var(--color-bg)
}

.subscribe {
    padding-top: 10rem !important
}

@media (max-width:932px) {
    .blogs_info_container {
        padding: 3.2rem 1.6rem
    }
}

@media only screen and (max-width:768px) {
    .blogs_info {
        margin-top: 3.2rem;
        height: auto
    }

    .bg_img_blogInfo {
        display: none
    }

    .blogs_info_container {
        padding: 3.2rem 1.6rem
    }

    .blogs_info_container h1 {
        width: 100%
    }

    .blogs_info_container img {
        width: 100%;
        height: auto
    }

    .blogs_info_container h4,
    .blogs_info_container p {
        width: 100%
    }
}

@media only screen and (max-width:375px) {
    .bg_img_blogInfo {
        display: none
    }

    .blogs_info_container h1 {
        font-size: 2.4rem;
        line-height: 2.88rem;
        width: 100%
    }

    .blogs_info_container img {
        width: 100%;
        height: auto
    }

    .blogs_info_container h4,
    .blogs_info_container p {
        font-size: 1.4rem;
        line-height: 1.68rem;
        width: 100%
    }
}

.terms {
    padding: 4rem 6.5rem
}

.terms_inner {
    display: flex;
    gap: 1.6rem;
    padding-bottom: 5rem;
    border-bottom: 1px solid #e1e1e2
}

@media (max-width:768px) {

    .service_inner,
    .terms_inner {
        flex-direction: column
    }
}

.terms_text {
    width: 50%;
    height: 12.6rem
}

.terms_h1 {
    text-align: left
}

.terms_left {
    display: flex;
    flex-direction: column;
    align-items: start;
    width: 50%;
    height: 9rem
}

.service {
    padding: 8rem 6.5rem;
    display: flex;
    justify-content: center;
    align-items: center
}

.service_inner {
    display: flex;
    gap: 5.2rem
}

.service_left {
    width: 50%;
    height: 252px
}

.service_left ul {
    display: flex;
    flex-direction: column;
    gap: 1.2rem
}

.service_right {
    width: 50%;
    height: auto;
    border-radius: 16px
}

.right_text_service {
    font-size: 2rem;
    line-height: 2.48rem;
    font-weight: 800;
    color: #02030e
}

.service_right_inner {
    max-height: 410px;
    overflow-y: auto;
    padding: 4.8rem
}

.service_right_head {
    display: flex;
    gap: 1.2rem
}

.service_right_head span {
    font-family: Manrope;
    font-size: 2rem;
    font-weight: 800;
    line-height: 2.48rem
}

.service_right_inner ul {
    display: flex;
    flex-direction: column;
    gap: 1.2rem
}

.service_right_inner ul li {
    font-family: Manrope;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 1.872rem
}

.service_right_inner ul b {
    font-family: Manrope;
    font-size: 1.2rem;
    font-weight: 800;
    line-height: 1.824rem
}

@media (max-width:768px) {
    .terms {
        padding: 4rem 2rem;
    }
    .terms_inner {
        flex-direction: column;
        gap: 2rem;
    }
    .terms_left,
    .terms_text {
        width: auto;
        height: auto;
    }
    .service {
        padding: 4rem 2rem
    }
    .service_inner {
        flex-direction: column;
        align-items: center;
        gap: 3rem;
    }
    .service_left,
    .service_right {
        width: 100%;
        height: auto;
    }
    .subscribe_for_img {
        position: relative
    }

    .subscribe {
        padding-top: 10rem;
    }
}

.faq_page {
    padding: 6.4rem;
    margin-bottom: 4rem;
}

.faq_container {
    display: flex;
    justify-content: space-between;
    gap: 3rem;
}

.faq__left {
    width: 50%;
    height: 11.3rem;
    display: flex;
    flex-direction: column;
    gap: .8rem
}

.faq_left span {
    font-size: 1.4rem;
    line-height: 1.456rem;
    color: #1323b2
}

.faq_left h1,
.faq_left span {
    font-family: Manrope;
    font-weight: 800
}

.faq_left h1 {
    font-size: 4rem;
    line-height: 4.48rem;
    color: #010101
}

.faq_right {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 1.6rem
}

.question_panel {
    width: 100%;
    height: 3.8rem;
    border: 1px solid #85c7f7;
    padding: .8rem 2.4rem;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.question_panel span {
    font-family: Manrope;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2.24rem;
    color: #02030e
}

.subscribe {
    overflow: visible
}

.subscribe__inner {
    position: relative;
    overflow: visible
}

.position_img {
    width: 13.5rem;
    height: 12.8rem;
    position: absolute;
    top: -95px;
    left: 40px
}

.faq__subscribe {
    padding-top: 10rem !important
}

@media only screen and (max-width:768px) {
    .faq_container {
        flex-direction: column;
        align-items: center
    }

    .faq__left {
        width: auto;
        text-align: center;
        margin-bottom: 2rem
    }

    .faq_right {
        width: 100%;
        padding: 2.4rem 1rem
    }

    .question_panel {
        width: 100%;
        height: auto;
        padding: 1rem
    }

    .faq_page {
        padding: 3rem 1rem
    }
}

@media only screen and (max-width:375px) {
    .faq__left h1 {
        font-size: 3rem;
        line-height: 3.4rem
    }

    .question_panel {
        width: 100%;
        padding: 1rem
    }

    .faq_right {
        width: 100%
    }

    .faq_page {
        padding: 3rem 1rem
    }
}

a.btn_pagenation:hover {
    color: #fff;
    text-decoration: none
}

li.btn_pagenation>a {
    display: inline-flex
}

.btn-dark.focus,
.btn-dark:focus,
.btn-dark:hover {
    color: #fff
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

html {
    scroll-behavior: smooth;
    font-size: 10px;
    font-family: Manrope, sans-serif
}

li {
    list-style: none
}

a {
    color: inherit;
    text-decoration: none
}

::-webkit-scrollbar {
    width: 6px
}

::-webkit-scrollbar-track {
    background: var(--color-light);
    border-radius: 100px;
    margin-block: 4.8rem
}

::-webkit-scrollbar-thumb {
    background: var(--color-primary);
    border-radius: 100px
}
.btn {
    border-radius: 10rem;
    font-size: var(--fs-small);
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem
}

.btn,
.btn img {
    transition: all .12s linear
}

.btn:hover img {
    transform: translateX(3px)
}

.btn-dark {
    background-color: var(--color-primary);
    color: #fff;
    filter: drop-shadow(2px, 2px, 6px, rgb(19 35 178/.25))
}

.btn-outlined {
    color: var(--color-primary)
}

.title {
    font-size: var(--fs-large);
    line-height: var(--lh-large);
    color: #02030e;
    font-weight: 600
}

.suptitle {
    font-size: var(--fs-normal);
    line-height: 1.456rem;
    color: var(--color-primary);
    margin-bottom: .8rem;
    text-transform: uppercase;
    letter-spacing: 2.6px
}

.subtitle,
.suptitle {
    font-weight: 800;
    text-align: center
}

.subtitle {
    font-size: var(--fs-medium);
    line-height: var(--lh-medium)
}

.text {
    font-size: var(--fs-normal);
    line-height: var(--lh-normal)
}

.text,
.text-small {
    color: var(--color-secondary);
    font-weight: 400
}

.text-small {
    font-size: var(--fs-small);
    line-height: var(--lh-small)
}

.section-bg {
    background-color: var(--color-bg)
}

.footer_input_dark,
.some_sections {
    background-color: #fff
}

.faq_text {
    font-size: var(--fs-normal);
    line-height: 2.224rem;
    font-weight: 500;
    color: #02030e
}

.blog_text {
    font-size: 1.8rem;
    line-height: 2.232rem;
    font-weight: 800;
    color: #111
}

.signUp_label {
    font-size: 1.1rem;
    line-height: 1.65rem;
    font-weight: 400;
    color: var(--color-secondary)
}

.body-dark {
    background-color: var(--color-main-bg-darkmode) !important
}

.section-dark {
    background-color: var(--color-secondary-bg-darkmode) !important
}

.title-dark {
    color: var(--color-main-text-darkmode) !important
}

.text-dark {
    color: var(--color-secondary-text-darkmode) !important
}

.service_icons {
    fill: var(--color-main-text-darkmode)
}

.border_dark {
    border-color: #3d4670 !important
}

.show-imgs {
    display: block !important
}

.none-imgs {
    display: none
}

.active-link {
    color: var(--color-primary)
}

.exit_icon-white {
    stroke: var(--color-main-text-darkmode)
}

.white-bg {
    background-color: var(--color-main-text-darkmode) !important
}

.terms-active {
    background-color: var(--color-primary) !important;
    color: #fff
}

.terms-active svg path {
    fill: #fff
}


.dark_mode_site {
    background-color: var(--color-bg-darkmode);
    color: #fff
}

body {
    padding-bottom: 0
}

.blog-excerpt {
    width: 100%;
    overflow: hidden;
    text-overflow: clip;
    white-space: normal
}

.form-info.text #remember+label {
    padding: 0;
    margin: 0
}

.form-info.text input {
    margin-top: 0
}

body {
    color: #2a2b35
}

.sidebar-wrap {
    width: 245px;
    border-right: 1px solid #c9caca;
    background-color: #fefefe;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 999;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 15px 15px 200px
}

.sidebar-wrap::-webkit-scrollbar {
    width: 5px;
    height: 5px
}

.sidebar-wrap::-webkit-scrollbar-track {
    background: rgba(46, 126, 255, .12941176470588237)
}

.sidebar-wrap::-webkit-scrollbar-thumb {
    background: #ff5722
}

.sidebar-wrap::-webkit-scrollbar-thumb:hover {
    background: #2e7eff
}

.sidebar-logo {
    text-align: center;
    color: #2e7eff;
    font-weight: 700;
    font-size: 20px;
    text-transform: uppercase
}

.sidebar-logo img {
    display: block;
    margin: auto
}

.sidebar-profile {
    position: relative;
    padding-top: 15px;
    border: 1px solid #90bbff;
    border-radius: 12px;
    text-align: center;
    background-color: hsla(0, 0%, 100%, .85)
}

.user-pic {
    display: block;
    margin: auto auto 15px
}

.username {
    font-size: 14px;
    font-weight: 400;
    color: #000;
    margin-bottom: 12px
}

.user-balance {
    background-color: #ff4b36;
    display: block;
    padding: 15px;
    border-radius: 12px;
    color: #fff !important;
    font-size: 12px;
    font-weight: 300;
    text-decoration: none !important
}

.sidebar-profile:after {
    content: "";
    position: absolute;
    background-image: url(https://i.imgur.com/p7i1COs.png);
    width: 324px;
    height: 373px;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: -1
}

.sidebar {
    margin-top: 20px
}

.sidebar-nav {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    list-style: none;
    padding: 0;
    margin: 0
}

.sidebar-nav li a {
    color: #838383;
    font-size: 16px;
    font-weight: 400;
    display: block;
    padding: 12px 20px;
    border-radius: 10px;
    margin-bottom: 3px
}

.sidebar-nav li.active a,
.sidebar-nav li.active a:hover,
.sidebar-nav li a:focus,
.sidebar-nav li a:focus-visible,
.sidebar-nav li a:hover {
    background-color: #e3edfe;
    color: #2e7eff
}

.inner-wraper {
    padding: 15px 15px 15px 260px;
    position: relative
}

.top-nav .container-fluid {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

.top-nav .top-nav-left,
.top-nav .top-nav-right {
    flex: 0 0 50%;
    max-width: 50%
}

.top-nav .top-nav-left ul,
.top-nav .top-nav-right ul {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    align-content: center;
    list-style: none;
    padding: 0;
    margin: 0
}

.top-nav .container-fluid {
    background-color: #fff;
    padding: 15px;
    border-radius: 12px;
    margin-bottom: 15px
}

.top-nav .top-nav-right ul {
    justify-content: flex-end
}

.top-nav .top-nav-left ul li a,
.top-nav .top-nav-right ul li a {
    margin-right: 15px
}

.top-nav .top-nav-left ul li:last-child a,
.top-nav .top-nav-right ul li:last-child a {
    margin-right: 0
}

.pinner {
    font-size: 20px;
    color: #bdbdbd
}

.bread {
    font-size: 16px;
    font-weight: 400;
    color: #2e7eff
}

.bread span {
    color: #838383
}

.top-nav-right ul li a {
    height: 40px;
    width: 40px;
    background-color: #ff4b36;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    border-radius: 8px;
    font-size: 20px;
    text-decoration: none !important;
    box-shadow: 0 0 15px 0 rgba(255, 75, 54, .4392156862745098)
}

.auth {
    background-color: #f2f2f2
}

.bread:hover {
    text-decoration: none
}

.dash-title {
    font-size: 20px;
    font-weight: 600;
    color: #000
}

.statics-wrap {
    background-color: #fff;
    padding: 15px;
    border-radius: 20px;
    display: flex;
    flex-wrap: wrap;
    box-shadow: 0 0 40px 0 rgba(46, 126, 255, .3137254901960784);
    height: 107px
}

.statics-left {
    flex: 0 0 30%;
    max-width: 30%
}

.statics-right {
    flex: 0 0 70%;
    max-width: 70%;
    padding-left: 24px
}

.statics-icon-wrap {
    height: 50px;
    width: 50px;
    background-color: #2e7eff;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    border-radius: 8px
}

.statics-title {
    font-size: 16px;
    font-weight: 600;
    color: #2e7eff;
    margin-bottom: 0;
    line-height: 1.4
}

.statics-txt {
    font-size: 15px;
    font-weight: 400;
    color: #767676
}

.statics-wrap:hover {
    background-color: #2e7eff
}

.statics-wrap:hover .statics-txt {
    color: #fff
}

.statics-wrap:hover .statics-icon-wrap {
    background-color: #f2f2f2
}

.statics-wrap:hover .statics-title {
    color: #fff
}

.row.statics-row {
    margin-bottom: 36px
}

.auth .well {
    background-color: #fbfbfb;
    border: 1px solid #fbfbfb;
    border-radius: 12px;
    box-shadow: none
}

.auth .nav-tabs li a {
    font-size: 15px;
    font-weight: 500;
    color: rgba(14, 126, 255, .5) !important;
    padding-left: 0;
    margin-right: 22px;
    background: transparent !important;
    text-decoration: none !important;
    box-shadow: none;
    border: 0 !important;
    padding-right: 0;
    position: relative
}

.auth .nav-tabs li.active a,
.auth .nav-tabs li.active a:hover,
.auth .nav-tabs li a.focus-visible,
.auth .nav-tabs li a:focus,
.auth .nav-tabs li a:hover {
    color: rgba(14, 126, 255, .99)
}

.nightmode .auth .nav-tabs li.active a,
.nightmode .auth .nav-tabs li.active a:hover,
.nightmode .auth .nav-tabs li a.focus-visible,
.nightmode .auth .nav-tabs li a:focus,
.nightmode .auth .nav-tabs li a:hover {
    color: hsla(0, 0%, 100%, .99) !important
}

.auth .nav-tabs li.active a:after,
.auth .nav-tabs li.active a:hover:after,
.auth .nav-tabs li a.focus-visible:after,
.auth .nav-tabs li a:focus:after,
.auth .nav-tabs li a:hover:after {
    content: "";
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 0;
    background-color: #2e7eff;
    height: 1px
}

.auth .tab-content {
    margin-top: 30px
}

.auth label {
    font-size: 15px;
    font-weight: 400;
    color: #838383;
    margin-bottom: 8px
}

.auth .form-control {
    background-color: #f2f2f2;
    height: 55px;
    font-size: 14px;
    color: #838383
}

#select2-orderform-category-container,
#select2-orderform-service-container {
    height: 40px !important;
    line-height: 40px
}

#service_description .panel-body {
    font-size: 14px;
    color: #838383;
    background-color: #f2f2f2;
    border-color: #f2f2f2;
    line-height: 1.6
}

.auth .btn.btn-primary {
    background-color: #ff4b36;
    border-color: #ff4b36;
    width: 100%;
    box-shadow: 0 10px 20px 0 rgba(255, 75, 54, .5019607843137255)
}

.help-block.min-max {
    margin-left: auto;
    width: max-content;
    font-size: 15px;
    color: #2e7eff
}

table tbody tr td {
    background-color: #f2f2f2;
    border: 0 !important;
    color: #111625;
    font-size: 14px;
    font-weight: 300
}

.auth table thead tr th {
    padding: 20px !important
}

.dash-title2 {
    font-size: 18px;
    font-weight: 500;
    color: #838383;
    margin-bottom: 10px
}

.nav-tabs.fund-tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin: 0;
    border: 0
}

.auth .nav-tabs.fund-tabs li a:after {
    display: none
}

.auth .nav-tabs.fund-tabs li.active a:hover span,
.auth .nav-tabs.fund-tabs li.active a span,
.auth .nav-tabs.fund-tabs li a:focus-visible span,
.auth .nav-tabs.fund-tabs li a:focus span,
.auth .nav-tabs.fund-tabs li a:hover span {
    background-color: #2e7eff !important
}

.auth .nav-tabs.fund-tabs li a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 95px;
    background-size: 100% 100%;
    background-image: url(https://i.imgur.com/FCFBABy.png);
    left: 0;
    right: 0;
    margin: auto;
    top: 60%;
    transform: translateY(-50%);
    z-index: 0;
    display: block;
    visibility: visible
}

.auth .nav-tabs.fund-tabs li a.webmoney i {
    color: #ff4b36
}

.auth .nav-tabs.fund-tabs li a.perfect-money i {
    color: #2e7eff
}

.auth .nav-tabs.fund-tabs li a.crypto i {
    color: #ff4b36
}

.auth .nav-tabs.fund-tabs li a.free i {
    color: #2e7eff
}

.auth .nav-tabs.fund-tabs li a.other i {
    color: #ff4b36
}

.auth .nav-tabs.fund-tabs li a {
    border: 0;
    padding: 0;
    background-color: transparent !important;
    color: #fff;
    margin: 0
}

.auth .nav-tabs.fund-tabs li a span {
    background-color: hsla(0, 0%, 100%, .73) !important;
    padding: 12px 20px;
    border-radius: 8px;
    border: 0 !important;
    position: relative;
    font-size: 14px;
    z-index: 999999999;
    display: block;
    margin: 0 1px
}

.auth .nav-tabs.fund-tabs li a.crypto:before,
.auth .nav-tabs.fund-tabs li a.other:before,
.auth .nav-tabs.fund-tabs li a.webmoney:before {
    background-image: url(https://i.imgur.com/iV9exPz.png)
}

.nav-tabs.fund-tabs+.tab-content {
    margin-top: 50px
}

.fund-txt {
    font-size: 15px;
    font-weight: 400;
    color: #02030e;
    line-height: 1.6
}

.fund-txt b {
    font-weight: 600;
    font-size: 18px;
    color: #2e7eff
}

pre {
    background-color: #f2f2f2;
    border-color: #f2f2f2;
    color: #838383;
    font-size: 16px
}

.auth .form-control#links {
    height: 250px !important
}

.auth .term-tabs li .nav-link {
    min-width: auto !important;
    background-color: hsla(0, 0%, 100%, .73) !important;
    background-color: hsla(0, 0%, 100%, .75) !important;
    border: 1px solid #d3d3d3
}

.auth .term-tabs li.active .nav-link:after,
.auth .term-tabs li.active .nav-link:hover:after,
.auth .term-tabs li .nav-link:after,
.auth .term-tabs li .nav-link:focus-visible:after,
.auth .term-tabs li .nav-link:focus:after,
.auth .term-tabs li .nav-link:hover:after {
    content: "";
    position: absolute;
    background-image: url(https://i.imgur.com/L4AE2j7.png);
    width: 271px;
    height: 106px;
    left: 0;
    right: 0;
    bottom: -50px;
    z-index: -1;
    background-color: hsla(0, 0%, 100%, 0)
}

.top-nav {
    margin-bottom: 40px
}

.bread {
    font-size: 18px;
    color: #1323b2;
    font-weight: 500;
    letter-spacing: .3px
}

.bread span {
    color: #02030e
}

.toggle .pinner {
    left: 0;
    transform: rotate(180deg)
}

.pinner {
    transition: all .2s
}

.well {
    padding: 40px
}

button.btn.btn-primary {
    font-weight: 400;
    font-size: 14px;
    padding: 5px 16px;
    height: 40px;
    background: #1323b2;
    box-shadow: 2px 2px 6px rgba(0, 139, 239, .25);
    border-radius: 100px
}

.inner-wraper {
    background: #ebf6fe
}

.well {
    background: #fff;
    border: none;
    border-radius: 14px;
    padding: 15px
}

.form-control {
    border: 1px solid #e5e5e6;
    appearance: inherit;
    border-radius: 8px;
    padding: 6px 12px;
    min-height: 45px
}

#service_description .panel-body {
    border-radius: 14px;
    background: #f5f5f5;
    padding: 40px
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background: #f5f5f5;
    border-color: hsla(0, 0%, 100%, 0)
}

label.control-label {
    font-weight: 400
}

.btn.btn-default,
button.btn.btn-primary {
    background: #1323b2;
    padding: 14px 32px;
    font-weight: 400;
    font-size: 14px;
    width: 100%;
    color: #fff
}

.user-pic {
    border-radius: 50%
}

.username {
    font-weight: 500;
    font-size: 1.7rem
}

a.user-balance {
    background: none;
    color: #2a2b35 !important;
    font-size: 13px;
    padding: 0
}

.wrapper.toggle .sidebar-wrap {
    left: -285px
}

.inner-wraper,
.sidebar-wrap {
    transition: .3s linear
}

.wrapper.toggle .inner-wraper {
    padding-left: 15px
}

.sidebar-profile {
    border: none;
    box-shadow: none;
    background: none
}

.sidebar-profile:after {
    content: none
}

.sidebar-nav li a {
    display: flex;
    gap: 10px;
    align-items: center
}

.sidebar-nav li.active a>svg path,
.sidebar-nav li a:active>svg path,
.sidebar-nav li a:hover>svg path {
    fill: #fff
}

::-webkit-scrollbar-thumb {
    background: #8e95da !important
}

.sidebar-nav * {
    font-size: 15px !important
}

.sidebar-nav li.active a,
.sidebar-nav li.active a:hover,
.sidebar-nav li a:focus,
.sidebar-nav li a:focus-visible,
.sidebar-nav li a:hover {
    background-color: #1323b2;
    color: #fff;
    text-decoration: none
}

.top-nav .container-fluid {
    background: hsla(0, 0%, 100%, 0);
    padding: 0
}

.top-nav-left {
    padding: 12px;
    background: #fff;
    border-radius: 11px
}

.top-nav-right ul li a {
    background: #fff;
    color: #02030e;
    box-shadow: none;
    border-radius: 50%;
    padding: 24px;
    font-size: 17px
}

.nav-pills>li.active a {
    background: #1323b2
}

.nav-pills>li a {
    border-radius: 8px
}

.table>thead>tr>th {
    border: none;
    padding: 20px 10px
}

table tbody tr td {
    background: #fff;
    padding: 10px 0
}

table tbody tr {
    border-bottom: 1px solid #e1e1e2
}

.alert-info {
    color: #1422b2;
    background-color: #e8eafe;
    border-color: hsla(0, 0%, 100%, 0);
    border-radius: 7px
}

.table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
    padding: 5px 12px;
    vertical-align: middle
}

table tbody tr td:first-child,
table thead tr th:first-child {
    border-radius: 12px 0 0 12px
}

table tbody tr td:last-child,
table thead tr th:last-child {
    border-radius: 0 12px 12px 0
}

table thead tr th {
    padding: 25px 12px !important;
    background: #ebf6fe
}

nav.navbar.navbar-static-top {
    display: none
}

.service-description__th {
    width: 15% !important
}

pre {
    background: #f5f5f5;
    border-radius: 10px;
    padding: 20px;
    color: #2a2b35;
    font-size: 13px
}

.well {
    margin: 30px 0
}

.form-control {
    box-shadow: none
}

button#order-dd {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 20px
}

ul.nav.nav-pills .dropdown button {
    border-radius: 11px;
    background: #fff;
    border: none;
    color: #2a2b35
}

li.pull-right.search {
    background: #fff;
    border-radius: 10px;
    border: none;
    padding: 0 20px
}

.input-group-btn button {
    color: #fff;
    background: #1323b2;
    padding: 4px 20px;
    border: none;
    border-radius: 4px !important
}

li.pull-right.search input {
    border: none;
    box-shadow: none;
    padding: 13px 0;
    min-height: auto
}

.form-control:focus {
    box-shadow: none;
    border-color: #1323b2
}

.search-dropdown input {
    background: #f5f5f5;
    box-shadow: none;
    padding: 26px
}

.search-dropdown button {
    font-size: 19px
}

.nav-pills {
    display: flex
}

ul.nav.nav-pills li {
    flex-grow: 1;
    flex: 1;
    text-align: center
}

ul.nav.nav-pills li a {
    background: #fff;
    margin: 0 8px
}

.nav-pills>li.active a {
    background: #1323b2 !important
}

.fund-tabs .nav-tabs>li>a {
    border-radius: 8px
}

.nav-tabs>li>a:hover {
    background: #fff
}

.statics-title {
    color: #02030e;
    font-size: 1.9rem;
    font-weight: 400
}

#social-btn {
    background-color: #ff4b36;
    padding: 40px 0;
    background-image: url(https://storage.perfectcdn.com/9b5331/ttltxr4cyiqn1wmw.png);
    background-repeat: no-repeat;
    background-position: 100%
}

.social-btn-wrap {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    list-style: none;
    padding: 0;
    margin-bottom: 6px
}

ul.social-btn-wrap li {
    flex-grow: 1
}

.social-button {
    min-width: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #fff;
    padding: 15px;
    color: #2a2b35 !important;
    border-radius: 5px;
    font-size: 16px;
    text-decoration: none !important;
    margin: 9px;
    gap: 10px
}

.social-button i {
    font-size: 20px;
    margin-right: 10px
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
    color: #1323b2;
    border: none;
    border-bottom: 2px solid #1323b2;
    font-weight: 600
}

.nav-tabs>li>a {
    border: none;
    padding: 7px 15px;
    line-height: 2.328571;
    font-size: 1.4rem;
    font-weight: 400;
    background: #fff;
    color: #02030e
}

.nav-tabs>li>a:after {
    content: none
}

.nav-tabs {
    margin-bottom: 32px
}

.nav-tabs.fund-tabs {
    gap: 10px
}

.fund-tabs li.nav-item {
    border: 1px solid #e1e1e2;
    border-radius: 8px;
    flex-grow: 1;
    text-align: center
}

.nav-tabs>li {
    float: left;
    margin-bottom: -1px;
    flex-grow: 1;
    text-align: center
}

.fund-tabs>li.active>a,
.fund-tabs>li.active>a:focus,
.fund-tabs>li.active>a:hover {
    cursor: default;
    background-color: #1323b2 !important;
    color: #fff;
    border-radius: 7px;
    border: none;
    font-weight: 400;
    margin: 0
}

.fund-tabs li.nav-item a {
    margin: 0;
    background: hsla(0, 0%, 100%, 0)
}

.fund-tabs li.nav-item.active {
    border-color: #1323b2
}

.head-well label,
.well.card .card-header h3 {
    font-size: 2rem;
    font-weight: 500 !important;
    display: block;
    border-bottom: 1px solid #e1e1e2;
    padding-bottom: 20px;
    margin-bottom: 32px
}

.dash-title {
    font-size: 2.5rem;
    font-weight: 500;
    color: #02030e;
    margin: 36px auto
}

tr.catetitle.cate-row td {
    padding: 32px 0 14px
}

tr.catetitle.cate-row h2 {
    font-size: 2.1rem
}

span.badge {
    width: 100%;
    padding: 7px
}

span.badge.min-badge {
    color: #ff8b00;
    background: #fff0de
}

.badge.max-badge,
span.badge.min-badge {
    border-radius: 100px;
    padding: 8px 30px;
    width: 100%
}

.badge.max-badge {
    color: #1323b2;
    background: #e8eafe
}

table tbody tr td {
    color: #2a2b35
}

.modal-title {
    display: inline
}

.search-wrap {
    background: #fff;
    padding: 8px;
    margin-bottom: 32px;
    border-radius: 8px
}

.search-wrap form {
    margin: 0
}

.search-wrap input {
    border: none
}

.search-wrap button.btn.btn-default {
    width: 100%;
    font-size: 14px;
    line-height: 1.42857143;
    padding: 6px 12px;
    min-height: 45px;
    border-radius: 8px !important
}

.alert.alert-warning {
    padding: 26px;
    background: #fff0de;
    border-radius: 6px;
    color: #ff8b00;
    line-height: 2.5rem
}

.alert ul li {
    list-style: disc
}

.ticket ul {
    display: flex;
    display: inline-block;
    list-style: none;
    padding: 0;
    margin: 0 -10px
}

.daymode .ticket ul li.active {
    background: #daecff
}

.ticket ul li {
    text-decoration: none;
    border: 1px solid #e1e1e2;
    display: inline-block;
    border-radius: 5px;
    margin: 10px;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    position: relative
}

input.designradio {
    position: absolute;
    z-index: 9999999;
    width: 100px;
    height: 72px;
    left: 0;
    top: 0;
    opacity: 0;
    display: none
}

.subject_box {
    margin: auto;
    text-align: center;
    padding: 12px 10px;
    min-width: 120px
}

.ticket .top_radio img {
    width: 40px;
    height: 40px
}

.subject_box p {
    margin: 0;
    font-size: 15px;
    font-weight: 400
}

.ticket .top_radio .subject_box p {
    padding-top: 15px
}

.request .subject_box {
    position: relative;
    margin: auto;
    text-align: center;
    align-items: center;
    display: flex;
    justify-content: center
}

.ticket .custom-radio li a:focus,
.ticket .custom-radio li a:hover {
    text-decoration: none;
    background: rgba(46, 126, 255, .45098039215686275)
}

.ticket-list-name .fa-envelope,
.ticket-list-name .fa-envelope-open {
    color: #2e7eff
}

.sorting_disabled {
    display: none
}

span.input-group-btn-filter.form-control.dropdown {
    padding: 0;
    border: none
}

button#catFilter {
    display: flex;
    justify-content: space-between;
    background: #fff;
    border-radius: 8px;
    padding: 20px 12px;
    min-height: 45px;
    width: 100%
}

.statics-wrap {
    border-radius: 12px;
    box-shadow: none;
    flex-wrap: nowrap;
    align-items: center
}

.statics-icon-wrap {
    background: hsla(0, 0%, 100%, 0);
    overflow: hidden;
    height: 80px;
    width: 80px
}

.statics-icon-wrap img {
    max-width: 100%
}

.statics-wrap:hover {
    background-color: #1323b2;
    color: #fff
}

.input-group.search-input {
    background: #fff;
    padding: 6px;
    border-radius: 8px
}

.input-group.search-input input {
    border: none
}

.input-group-addon:last-child,
.input-group-addon:last-child button {
    background: #1323b2;
    color: #fff;
    border-radius: 8px;
    font-size: 14px
}

.service-item {
    width: 100%;
    height: fit-content;
    padding-bottom: 10px;
    padding-top: 10px;
    border: none;
    border-bottom: 1px solid #e1e1e2;
    text-align: left;
    padding-left: 10px;
    font-size: 14px;
    background: none
}

#service-table span.fav_b {
    display: block
}

#service-table tbody tr td:first-child,
#service-table thead tr th:first-child {
    text-align: center
}

.dropdown-menu>.active>a,
.dropdown-menu>.active>a:focus,
.dropdown-menu>.active>a:hover {
    background-color: var(--color-drop-down-list-selected-back);
    background-color: var(--color-drop-down-list-selected-color)
}

.pinner {
    position: absolute;
    left: 217px;
    z-index: 1030;
    background: #fff;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 3px solid #ebf6fe
}

.fund-txt b {
    color: #1323b2
}

xauth .faq_container {
    flex-direction: column !important
}

.xauth .container.faq_container {
    flex-direction: column;
    width: 100%;
    max-width: none
}

.xauth section.faq_page {
    background: #fff;
    border-radius: 14px;
    padding: 40px
}

.xauth .container.faq_container>div {
    width: 100%
}

.api h4 {
    font-size: 2.3rem;
    font-weight: 500 !important;
    display: block;
    margin-top: 60px;
    margin-bottom: 32px
}

.ticket>.tab-content {
    margin: 30px 0
}

.ticket ul li.active {
    border: 1px solid #1323b2;
    background: #1323b2;
    color: #fff
}

.input-group.search-input {
    margin-bottom: 20px
}

@media (min-width:767.98px) {
    footer.footer {
        padding: 15px 15px 15px 15px;
    }
    ._auth footer.footer {
        padding: 15px 15px 15px 300px;
    }
}

.orders .nav-tabs.fund-tabs li a {
    background: hsla(0, 0%, 100%, 0)
}

.orders .orders .nav-tabs.fund-tabs li {
    background: #fff !important;
    border-radius: 8px
}

.orders .nav-tabs.fund-tabs li {
    background: #fff;
    border-radius: 6px
}

div#desc-new-content {
    border: none;
    padding: 0
}

.alert-success {
    color: #1323b2;
    background-color: #e8eafe;
    border-color: #e8eafe
}

@media (max-width:767.98px) {
    .table-responsive {
        border: none !important
    }
}

@media (max-width:575.98px) {
    .new-order-form .head-well {
        padding: 5px !important;
        margin-bottom: 10px !important;
        justify-content: center !important;
        flex-wrap: nowrap !important;
        align-items: center !important
    }

    .new-order-form .nav-tabs {
        display: flex;
        flex-wrap: wrap;
        align-content: center;
        justify-content: center;
        align-items: center
    }

    .new-order-form .nav-item {
        margin: 3px 0 !important
    }

    .guest .navbar-collapse {
        display: none !important
    }

    .guest .navbar-collapse.in {
        display: block !important
    }

    #top-sec {
        padding: 35px 0
    }

    #top-sec .container>.row {
        display: block
    }

    .maint-title {
        font-size: 32px;
        margin-top: 12px
    }

    .main-title-top-txt {
        font-size: 20px;
        margin-bottom: 0
    }

    .txt {
        font-size: 14px;
        line-height: 1.6
    }

    #top-sec form {
        margin-top: 15px
    }

    .form-control {
        height: 50px
    }

    .inpt-icon {
        width: 35px;
        height: 35px;
        border-radius: 7px;
        font-size: 20px
    }

    .inpt-icon+.form-control {
        padding-left: 55px
    }

    .forgot-password1 {
        text-align: left
    }

    .btn.btn-primary {
        min-width: 120px;
        height: 45px;
        border-radius: 5px;
        font-size: 16px
    }

    #social-btn {
        padding: 15px 0
    }

    .social-btn-wrap li {
        flex: 0 0 48%;
        max-width: 48%
    }

    .social-button {
        min-width: auto;
        padding: 10px;
        border-radius: 5px;
        font-size: 14px;
        margin: 5px
    }

    #benefit {
        padding: 20px 0
    }

    .title {
        font-size: 26px
    }

    #benefit .title {
        margin-bottom: 20px
    }

    .benefit-box {
        padding: 15px;
        margin-bottom: 15px
    }

    #quick {
        padding: 20px 0
    }

    #quick .container>.row {
        display: block
    }

    #quick .btn.btn-secondary {
        margin-top: 15px
    }

    .btn.btn-secondary {
        height: 45px;
        width: 200px
    }

    #stats .container>.row {
        width: 100%;
        margin: auto;
        padding: 20px 15px
    }

    .gambling-boy {
        position: unset;
        margin: 25px auto auto;
        display: block;
        max-width: 100%
    }

    .stats-wrap {
        margin-bottom: 20px
    }

    #stats {
        padding: 40px 0 0
    }

    #choose {
        padding: 25px 0
    }

    #choose .container>.row {
        display: block
    }

    .row.highest-row {
        margin-top: 25px
    }

    .choose-box {
        padding: 15px
    }

    .choose-box-icon {
        height: auto
    }

    .choose-box .txt {
        min-height: auto
    }

    .row.faq-row {
        margin-top: 30px
    }

    .row.faq-row .panel-default .panel-heading .panel-title a {
        line-height: 1.4;
        font-size: 15px
    }

    #choose .btn.btn-secondary {
        margin: 15px auto auto
    }

    #clients {
        padding: 25px 0
    }

    #clients .container>.row {
        display: block
    }

    .client-img {
        max-width: 100%;
        margin: 15px auto auto
    }

    .top-ftr {
        padding: 30px 0
    }

    .new-letter-frm {
        width: 100%
    }

    .news-letter-btn {
        right: 5px;
        height: 35px !important
    }

    .btm-ftr:after,
    .btm-ftr:before,
    .guest.darkmode #stats .container>.row:before,
    .quick-img-wrap:after,
    .top-img-wrap:after {
        display: none
    }

    .guest .navbar-default .navbar-toggle,
    .guest .navbar-default .navbar-toggle:focus,
    .guest .navbar-default .navbar-toggle:hover {
        border-color: #ff4b3a;
        background-color: #ff4b3a
    }

    .guest .navbar-default .navbar-toggle .icon-bar {
        background-color: #fff
    }

    .guest.darkmode #social-btn {
        padding: 20px 0
    }

    .title.top-spacing {
        margin-bottom: 15px
    }

    .top-spacing {
        margin-top: 20px
    }

    .cat-name {
        font-size: 25px
    }

    .table-responsive {
        border: 0
    }

    table thead tr th {
        padding: 15px !important
    }

    table tbody tr td {
        padding: 5px 15px !important
    }

    .ser-well:after,
    .ser-well:before {
        display: none
    }

    .payment-img-wrap img {
        display: block;
        margin: 25px auto 0
    }

    .auth .term-tabs li .nav-link,
    .term-tabs li .nav-link {
        min-width: auto
    }

    .auth .term-tabs .nav-item,
    .term-tabs .nav-item {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 10px
    }

    .post-title {
        font-size: 20px;
        font-weight: 700;
        margin-bottom: 10px
    }

    .blog-content {
        font-size: 14px;
        margin-bottom: 20px
    }

    .blog-img {
        margin: auto auto 15px
    }

    .signup-img-wrap {
        display: none
    }

    #signup {
        padding-bottom: 30px
    }

    .top-nav .container-fluid {
        padding: 12px;
        margin-bottom: 0
    }

    .top-nav {
        margin-bottom: 0
    }

    .top-nav-right ul li a {
        height: 30px;
        width: 30px;
        font-size: 14px
    }

    .bread {
        font-size: 14px
    }

    .top-nav .top-nav-left {
        flex: 0 0 40%;
        max-width: 40%
    }

    .top-nav .top-nav-right {
        flex: 0 0 60%;
        max-width: 60%
    }

    .dash-title {
        margin: 8px auto 15px
    }

    .statics-wrap {
        margin-bottom: 15px;
        padding: 12px;
        border-radius: 10px
    }

    .statics-left {
        flex: 0 0 20%;
        max-width: 20%
    }

    .statics-wrap:hover .statics-txt {
        color: #fff
    }

    .row.statics-row {
        margin-bottom: 10px
    }

    .auth .tab-content {
        margin-top: 10px
    }

    .auth label {
        font-size: 13px
    }

    .help-block.min-max {
        font-size: 12px
    }

    .auth .form-control {
        height: fit-content !important;
        font-size: 14px;
        border-radius: 10px
    }

    .auth footer {
        padding: 10px 0
    }

    .auth footer .copyright {
        margin-bottom: 10px
    }

    .auth footer .copyright,
    .auth footer .ftr-email {
        text-align: center;
        font-size: 13px
    }

    #select2-orderform-category-container,
    #select2-orderform-service-container {
        height: 20px !important;
        line-height: 20px
    }

    .wrapper .bread,
    .wrapper .top-nav-right {
        display: none
    }

    .wrapper.toggle .bread,
    .wrapper.toggle .top-nav-right {
        display: block
    }

    .inner-wraper {
        padding-left: 15px
    }

    .wrapper .top-nav .container-fluid {
        justify-content: flex-end
    }

    .wrapper.toggle .top-nav .container-fluid {
        justify-content: space-between
    }

    .wrapper .top-nav .container-fluid .top-nav-left ul {
        justify-content: flex-end
    }

    .wrapper.toggle .top-nav .container-fluid .top-nav-left ul {
        justify-content: flex-start
    }

    .auth .search-wrap .btn.btn-default {
        height: 40px
    }

    .auth .ser-cat-name {
        margin-bottom: 0
    }

    .auth .nav-tabs.fund-tabs li {
        flex: 0 0 100%;
        max-width: 100%
    }

    .sidebar-wrap {
        overflow-y: auto;
        overflow-x: hidden !important;
        z-index: 9999
    }

    .auth .nav-tabs li a {
        z-index: 1
    }

    .nav-tabs.fund-tabs li {
        flex: 0 0 100%;
        max-width: 100%;
        margin-bottom: 10px
    }

    .auth .nav-tabs.fund-tabs li a:before {
        display: none
    }

    .auth .nav-tabs.fund-tabs li a span {
        box-shadow: 0 0 10px 0 #2e7eff
    }

    .auth textarea.form-control {
        height: 180px !important
    }

    .auth .row.faq-row .panel-default .panel-heading .panel-title a {
        padding: 12px 40px 12px 12px;
        font-size: 14px;
        font-weight: 500
    }

    .auth .row.faq-row .panel-default .panel-body p {
        font-size: 14px
    }

    #choose .container>.row.choose-row1 {
        margin-top: 15px
    }

    #choose .row.choose-row1 .choose-box {
        min-height: auto
    }
}

@media (max-width:360.98px) {
    .search-wrap .btn.btn-default {
        height: 50px
    }

    .search-wrap .input-group {
        margin-top: 10px
    }

    .search-wrap .form-control {
        width: 100%;
        margin-bottom: 0
    }

    .search-wrap .input-group-btn-search {
        width: 100%
    }

    .search-wrap .input-group-btn-filter {
        margin-left: 0 !important;
        width: 100%;
        margin-top: 15px
    }
}

@media (min-width:767.98px) {

    .top-nav .top-nav-left,
    .top-nav .top-nav-right {
        max-width: 100%;
        flex: none
    }

    .top-nav .top-nav-left {
        width: 70%
    }

    .top-nav .top-nav-right {
        width: 30%
    }
}

.nightmode .sidebar-wrap {
    background-color: #121730
}

.nightmode .sidebar-profile {
    background-color: #121730;
    border: 1px solid #121730;
    box-shadow: 0 1px 5px 0 #121730
}

.nightmode .username {
    color: #fff
}

.nightmode .sidebar-nav li.active a,
.nightmode .sidebar-nav li.active a:hover,
.nightmode .sidebar-nav li a:focus,
.nightmode .sidebar-nav li a:focus-visible,
.nightmode .sidebar-nav li a:hover {
    background-color: #1323b2;
    color: #fff
}

.nightmode .inner-wraper,
.nightmode .more-btn button {
    background-color: #121730
}

.nightmode .bread span {
    color: #121730
}

.nightmode .social-button,
.nightmode .statics-wrap {
    background-color: #242b50;
    color: #fff !important
}

.nightmode .statics-txt {
    color: #fff
}

.nightmode._auth .well {
    background-color: #242b50;
    color: #b1bae5;
    border: none
}

.nav-tabs {
    border-bottom: none !important
}

.nightmode._auth #service_description .panel-body,
.nightmode._auth .form-control {
    border-color: #1323b2;
    border-color: var(--color-light) !important
}

.nightmode .cat-name {
    color: #fff
}

.nightmode table tbody tr td {
    background-color: hsla(0, 0%, 100%, 0);
    color: #a0b8df
}

.nightmode table tbody tr {
    border-bottom: 1px solid #363a65
}

.nightmode .service-description .modal-content {
    background-color: #242941
}

.nightmode .order-tabs {
    border-bottom: 0
}

.nightmode._auth table thead tr th,
.nightmode .nav-tabs.fund-tabs {
    border: 0
}

._auth.nightmode {
    background-color: #121730
}

.nightmode .nav-tabs.term-tabs {
    border: 0
}

.nightmode .nav-tabs.term-tabs li a {
    background-color: #1323b2 !important;
    color: #828ea5 !important
}

.nightmode._auth .term-tabs li.active .nav-link,
.nightmode._auth .term-tabs li.active .nav-link:hover,
.nightmode._auth .term-tabs li .nav-link:focus,
.nightmode._auth .term-tabs li .nav-link:focus-visible,
.nightmode._auth .term-tabs li .nav-link:hover {
    background-color: #2e7eff !important;
    color: #fff !important
}

._auth.nightmode .term-tab-content {
    background-color: #1323b2;
    border-color: #1323b2
}

._auth.nightmode .term-tab-content .term-title,
._auth.nightmode .term-tab-content .term-title i {
    color: #fff
}

._auth.nightmode .term-tab-content .txt {
    color: hsla(0, 0%, 100%, .39)
}

.nightmode._auth .panel-default .panel-heading .panel-title a[aria-expanded=true] {
    border-radius: 12px 12px 0 0;
    background-color: #121730;
    color: #fff
}

.nightmode .panel-default .panel-heading .panel-title a {
    color: hsla(0, 0%, 100%, .64);
    background-color: #121730;
    border-radius: 5px
}

.nightmode._auth #faq-sec .panel-default .panel-heading .panel-title a:after {
    background-color: #ff4b36;
    color: #1323b2
}

.nightmode._auth .panel-default .panel-heading .panel-title a[aria-expanded=true]:after {
    background-color: #fff !important;
    color: #2e7eff !important
}

.nightmode._auth #faq-sec .panel-body {
    background-color: #1323b2
}

.nightmode._auth #faq-sec .panel-body p {
    color: hsla(0, 0%, 100%, .39)
}

._auth.nightmode .fund-txt {
    color: #fff
}

._auth.nightmode .api h1,
._auth.nightmode .api h4,
._auth.nightmode .fund-txt b,
._auth.nightmode .head-well label,
._auth.nightmode .nav-tabs>li>a,
._auth.nightmode .user-balance,
._auth.nightmode .well.card .card-header h3,
._auth.nightmode div#desc-content,
._auth.nightmode h2,
._auth.nightmode h3,
._auth.nightmode label,
._auth.nightmode pre,
._auth.nightmode tr.catetitle.cate-row h2 {
    color: #fff !important
}

._auth.nightmode thead tr {
    color: #2a2b35
}

._auth.nightmode .new-order-form .nav-tabs,
._auth.nightmode pre {
    background: #121730
}

._auth.nightmode .massorder .nav-tabs>li.active>a,
._auth.nightmode .massorder .nav-tabs>li.active>a:focus,
._auth.nightmode .massorder .nav-tabs>li.active>a:hover {
    border-color: #fff
}

._auth.nightmode .massorder .nav-tabs>li,
._auth.nightmode .massorder .nav-tabs>li>a,
._auth.nightmode .massorder .nav-tabs>li>a:focus,
._auth.nightmode .massorder .nav-tabs>li>a:hover {
    background: transparent !important
}

._auth.nightmode .form-control,
._auth.nightmode div#desc-content {
    background: #121730;
    border-color: #ededed !important
}

._auth.nightmode input#search-term {
    background: hsla(0, 0%, 100%, 0)
}

._auth.nightmode .input-group.search-input {
    background: #242b50
}

._auth.nightmode .input-group-addon:last-child,
._auth.nightmode .input-group-addon:last-child button {
    border: none;
    background: #fff;
    color: #121730
}

._auth.nightmode button#catFilter {
    color: #fff;
    background: #242b50
}

._auth.nightmode .ticket ul li.active {
    border: 1px solid #2d7dfd;
    background: #121730
}

._auth.nightmode .subject_box p,
._auth.nightmode .ticket .card-header {
    color: #bac9e1
}

._auth.nightmode .top-nav-left {
    background: #242b50
}

._auth.nightmode .nightmode .bread span,
._auth.nightmode .top-nav-left * {
    color: #fff
}

._auth.nightmode .top-nav-right ul li a {
    background: #242b50
}

._auth.nightmode .top-nav-right ul li a svg path {
    fill: #fff
}

.nightmode .fund-tabs li.nav-item {
    border-color: #797a7d
}

.nightmode .fund-tabs li.nav-item.active a {
    background: #1323b2 !important
}

.nightmode .orders .nav-tabs.fund-tabs li a {
    color: #2a2b35 !important
}

._auth.nightmode .orders .nav-tabs>li {
    background: #242b50 !important
}

._auth.nightmode .orders .nav-tabs>li>a {
    color: #fff !important
}

h4.home-text {
    font-size: 14px
}

ul.reseller__quesions h3 {
    font-size: 1.6rem;
    line-height: 1.76rem;
    font-weight: 700;
    margin-bottom: 0
}

.accordion__label h3 {
    font-size: var(--fs-normal);
    line-height: 2.24rem;
    font-weight: 500;
    margin-bottom: 0
}

.accordion__label.text-dark {
    color: var(--color-secondary-text-darkmode) !important;
    background-color: var(--color-secondary-bg-darkmode) !important
}

@media screen and (min-width:767px) and (max-width:1050px) {
    .row.statics-row {
        display: flex;
        flex-wrap: wrap;
        row-gap: 25px
    }

    .row.statics-row>div {
        flex-basis: 50% !important
    }
}

@media screen and (max-width:1240px) and (min-width:1050px) {
    .statics-icon-wrap {
        width: 40px;
        height: 40px
    }

    .statics-title {
        font-size: 16px
    }

    .statics-right {
        padding-left: 8px
    }
}

#accountStatusModal .modal-body,
#redeemModal .modal-body {
    padding: 20px;
    background-color: #f9f9f9
}

#accountStatusModal a,
#redeemModal a {
    color: #007bff;
    text-decoration: none
}

#accountStatusModal .card,
#redeemModal .card {
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    background-color: #fff;
    margin-bottom: 20px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .02);
    margin-top: 40px
}

#accountStatusModal .card-header,
#redeemModal .card-header {
    background-color: rgba(193, 193, 213, .3686274509803922);
    border-bottom: 1px solid #e0e0e0;
    padding: 10px;
    text-align: center
}

#accountStatusModal .card-redeem-body,
#redeemModal .card-redeem-body {
    display: flex;
    flex-direction: column;
    align-items: center
}

#accountStatusModal .card-redeem-body .option,
#redeemModal .card-redeem-body .option {
    display: block;
    margin: 5px 0;
    padding: 5px 10px;
    border-radius: 3px;
    text-align: center
}

.card-redeem-body .option.enabled {
    background-color: #edf7ef;
    color: #155724
}

.card-redeem-body .option.disabled {
    background-color: #f2f2f2;
    color: #353535
}

.top-nav-left {
    justify-content: space-between;
    font-size: 14px
}

.stat-status,
.top-nav-left {
    display: flex;
    align-items: center
}

.stat-status {
    gap: 8px
}

@media screen and (max-width:768px) {
    .top-nav {
        flex-direction: column
    }

    .top-nav .container-fluid {
        flex-direction: column-reverse;
        align-items: end
    }

    .top-nav-left {
        flex-wrap: nowrap;
        flex-basis: 100%;
        align-self: self-start;
        max-width: 100% !important;
        margin-top: 10px
    }

    .stat-wrapper {
        display: flex;
        flex-direction: column
    }
}

@media screen and (max-width:1030px) {
    .stat-status {
        flex-basis: 50%;
        font-size: 12px
    }

    .top-nav-left {
        flex-wrap: wrap;
        row-gap: 6px
    }
}

span#order-services {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.stat-status .stat-wrapper {
    cursor: pointer
}

#orderform-service {
    display: none
}

.services-list .dropdown-menu button {
    background: none !important
}

.new-order-form .well {
    background-color: #2e7eff;
    border: none;
    border-radius: 8px;
    padding: 20px;
    margin: 20px 0
}

.new-order-form .head-well {
    margin-bottom: 20px;
    display: flex;
    justify-content: flex-end;
    flex-wrap: nowrap;
    align-items: center
}

.new-order-form .nav-tabs {
    border-bottom: none;
    background: #fff;
    padding: 10px;
    border-radius: 10px;
    margin: 0
}

.new-order-form .nav-item {
    margin-bottom: 0
}

.new-order-form .nav-link {
    border: 1px solid hsla(0, 0%, 100%, 0);
    border-radius: 8px;
    color: #fff;
    padding: 10px 15px;
    margin: 0 10px;
    background-color: #b5b5b5;
    font-weight: 700;
    font-size: 14px
}

.new-order-form .nav-item.active .nav-link,
.new-order-form .nav-item:hover .nav-link {
    color: #fff;
    background-color: #1323b2
}

.auth .new-order-form.well {
    padding: 0 !important
}

.new-order-form .head-well {
    border-radius: 15px 15px 0 0 !important;
    background-color: #1323b2;
    background-size: cover;
    background-position: 50%;
    padding: 10px 15px;
    border: 1px solid hsla(0, 0%, 100%, 0)
}

.bootstrap-datetimepicker-widget.dropdown-menu {
    width: auto !important
}

.sidebar-logo .logo {
    padding: 2px 15px
}

.dataTables_paginate .pagination {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-evenly
}

.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
    background-color: #1323b2 !important;
    border-radius: 50% !important;
    border: none !important
}

#history-search,
#tickets_list {
    width: 100% !important
}

.updates .dropdown-menu .active .dropdown-item {
    background-color: #1323b2 !important
}

.nightmode #desc-new-content {
    background-color: #242b50 !important
}

.telegram-supp {
    font-weight: 500;
    color: #fff;
    padding: 8px;
    background-image: url(https://storage.perfectcdn.com/9b5331/dkp9qktlfhqsbc2u.jpg);
    border-radius: 5px;
    background-repeat: no-repeat;
    background-size: cover
}

.center-fixed {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center
}

.text-left {
    text-align: left !important
}

.text-right {
    text-align: right !important
}

.text-center {
    text-align: center !important
}

.smm-btn {
    font-size: 1.2rem;
    font-weight: 700;
    color: #fff;
    padding: 1.4rem 6.7rem;
    background-color: #ff8b00;
    border-radius: 100px;
    border: 1px solid #fff;
    transition: all .1s linear
}

.smm-btn:active,
.smm-btn:hover {
    background-color: #fff !important;
    color: #1323b2
}

.order-link {
    width: 40%
}

.order-service {
    width: 50%
}

.order-font,
.order-service {
    font-family: Trebuchet MS
}

[data-status] {
    padding: 5px 10px;
    margin-bottom: 2px
}

[data-status=Canceled] {
    background-color: #dc3545 !important;
    color: #fff !important
}

[data-status="In progress"] {
    background: #1777ff !important
}

[data-status=Processing] {
    background-color: #17a2b8 !important;
    color: #fff !important
}

[data-status=Partial] {
    background-color: #ffc107 !important;
    color: #fff !important
}

[data-status=Completed] {
    background-color: #28a745 !important;
    color: #fff !important
}

[data-status=Pending] {
    background-color: orange !important;
    color: #fff !important
}

[data-status=Refill] {
    background-color: #00a194 !important;
    color: #fff !important;
    cursor: pointer
}

._auth .nav-tabs.fund-tabs li a span .icon {
    display: inline-block;
    width: 15px !important;
    height: 15px !important;
    background-color: #fff !important;
    padding: 0;
    margin-bottom: -3px;
    margin-left: 15px;
    border: 4px solid #000 !important;
    margin-left: 0;
    margin-right: 5px
}

._auth .nav-tabs.fund-tabs li a.All span .icon {
    border-color: #273fdf !important
}

._auth .nav-tabs.fund-tabs li a.Pending span .icon {
    border-color: orange !important
}

._auth .nav-tabs.fund-tabs li a.In.progress- span .icon {
    border-color: #1777ff !important
}

._auth .nav-tabs.fund-tabs li a.Completed span .icon {
    border-color: #28a745 !important
}

._auth .nav-tabs.fund-tabs li a.Partial span .icon {
    border-color: #ffc107 !important
}

._auth .nav-tabs.fund-tabs li a.Processing span .icon {
    border-color: #17a2b8 !important
}

._auth .nav-tabs.fund-tabs li a.Canceled span .icon {
    border-color: #dc3545 !important
}

.nightmode .sidebar-logo .logo {
    filter: brightness(20)
}

.nightmode .form-control {
    color: #b1bae5
}

.equal-height-container,
.equal-height-container .col-sm-4,
.equal-height-container .col-sm-8 {
    display: flex;
    flex-direction: column
}

.equal-height-container .well {
    flex: 1;
    display: flex;
    flex-direction: column
}

.dropdown-currencies .dropdown-menu {
    min-width: 100%
}

.dropdown-currencies .dropdown-menu a {
    min-width: 100%;
    margin: 0 !important
}

._auth.nightmode .dropdown-currencies .dropdown-menu a {
    border-radius: 0;
    background: none
}

.guest.body-dark .header__logo img {
    filter: brightness(20)
}

.guest.body-dark .suptitle {
    color: #fff
}

.guest.body-dark .btn-outlined,
.guest.body-dark .sign_in_account a {
    color: #90b9fb
}

.cate-row td {
    border-top: none !important
}

.child-panel .well .accordion {
    margin-bottom: 3px
}

._auth.nightmode .accordion .accordion__label {
    background-color: #121730
}

._auth.nightmode .accordion .accordion__body .reseller__info .reseller__info_text,
._auth.nightmode .accordion .accordion__label .home-text,
._auth.nightmode .faq_left .suptitle {
    color: #b1bae5 !important
}

._auth.nightmode .faq_left .title {
    color: #fff !important
}

.select2-container--open .select2-dropdown--below,
.select2-results__option {
    background: var(--color-drop-down-list-back)
}

.select2-container--open .select2-dropdown--below a,
.select2-results__option a {
    color: var(--color-drop-down-list-text)
}

.select2-results__option {
    border-bottom: 1px solid hsla(0, 0%, 100%, .1411764705882353)
}

.select2-results__option a {
    color: var(--color-drop-down-list-text) !important;
    font-weight: 600 !important
}

.select2-results__option a:focus,
.select2-results__option a:hover {
    color: #262626 !important
}

.select2-container .dropdown-menu>li>a {
    display: flex;
    align-items: center;
    min-height: 40px
}

.select2-container--default .select2-results__option[aria-selected=true] a {
    background-color: var(--color-drop-down-list-selected-back) !important;
    color: var(--color-drop-down-list-selected-color) !important
}

.services-list .first-btn {
    border: 1px solid #e5e5e6
}

.services-list .dropdown-menu {
    padding: 0 !important;
    width: 100%;
    max-height: 320px;
    overflow-y: auto;
     background-color: var(--color-drop-down-list-back)
}

.services-list .dropdown-menu>button {
    display: block;
    padding: 3px 10px;
    clear: both;
    font-weight: 600;
    line-height: 1.42857143;
    color: var(--color-drop-down-list-text);
    text-align: left;
    width: 100%;
    border: none;
    border-bottom: 1px solid hsla(0, 0%, 100%, .1411764705882353);
    min-height: 40px
}

.services-list .dropdown-menu>button:active,
.services-list .dropdown-menu>button:focus,
.services-list .dropdown-menu>button:hover {
    background-color: #f5f5f5 !important;
    color: #262626 !important
}

.select2-search--dropdown.select2-search--hide {
    display: block !important
}

#bonusModal .body-img img {
    width: 100% !important;
}

#bonusModal h2 {
    font-size: 18px
}

#bonusModal h3 {
    font-size: 25px
}

.ticket-message-right .ticket-message {
    background: #ebf6fe
}

.ticket-message-left .ticket-message {
    background: #ebebeb
}

.allined {
    justify-content: center
}

.copy-icon {
    margin-right: 2px;
    cursor: pointer
}

.ggl-btn {
    display: flex;
    justify-content: center
}

.btns-row {
    background: #ebf6fe;
    padding: 15px;
    text-align: center;
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap
}

.google-login-wrap {
    position: relative;
    width: 100%;
    padding-top: 0;
    padding-bottom: 0;
    border-radius: 10px;
    background-color: #1323b2;
    border-color: rgba(19, 35, 178, .24);
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: space-around;
    margin-left: 12px;
    border-radius: 10rem;
}

.signin_btns {
    display: flex;
    justify-content: center;
}

.google-login {
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
}

.google-btn {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    height: 50px;
    width: 100%;
    overflow: hidden;
    opacity: 0;
}

.frm-btn-wrap .btn.btn-primary,
.signin_btns button, .signin_btns .google-login-wrap{
    border-radius: 10px !important;
}

.welcome__right .notacc{
    justify-content: flex-start !important;
}

/* Disable any transition on table rows and remove hover background */
#service-table .table_body .my_tr {
  transition: none !important;
}

#service-table .table_body .my_tr:hover {
  background-color: transparent !important;
}
/* Remove hover background and transition, force GPU acceleration */
#service-table .table_body .my_tr {
  transition: none !important;
  background-color: transparent !important;
  transform: translateZ(0);
  will-change: background-color;
}

#service-table .table_body .my_tr:hover {
  background-color: transparent !important;
}
/* ----- Disable Table Hover Effects to Reduce Repaints ----- */

/* Remove the hover background change and disable transitions on table rows */
.table_body .my_tr:hover {
  background-color: inherit !important;
  transition: none !important;
}

/* Remove transitions from table cells and headers */
#service-table .my_td,
#service-table .my_th {
  transition: none !important;
}

/* ----- Optional: Reduce Other Potentially Heavy Effects ----- */

/* If you suspect that box shadows are contributing to the lag, you can disable them on elements where they aren’t critical */
.benefit__card, /* example element with drop shadows */
.modal-content {
  filter: none !important;
  box-shadow: none !important;
}

/* If you have any CSS filters (like drop-shadow or blur) causing heavy repaints, disable them here */
* {
 filter: none !important;
}
/* Global disable transitions and filters for testing */
* {
  transition: none !important;
  filter: none !important;
  box-shadow: none !important;
}

/* Remove table hover effects */
.table_body .my_tr:hover {
  background-color: inherit !important;
}

/* If you have any other heavy effects on your wrapper, try disabling them */
.inner-wraper {
  box-shadow: none !important;
}

/* Optionally disable animations on the whole page */
html, body {
  animation: none !important;
}
/* Force GPU acceleration on key elements 
#service-table,
.inner-wraper {
  transform: translateZ(0);
  will-change: transform;
}
*/
/* Disable smooth scrolling to reduce repaints */
html {
  scroll-behavior: auto !important;
}

/* (Optional) Temporarily disable any remaining transitions */
* {
  transition: none !important;
}

/* Remove heavy box-shadows on the table and main wrapper */
.my_table,
.inner-wraper {
  box-shadow: none !important;
}
.btn-custom{
    border-radius: 8px;
    padding: 10px 15px;
    background-color: #f5680a;
}
.input-group-addon.pink-gradient {
  background: linear-gradient(45deg, #f472b6, #ec4899);
  color: white;
  border: none;
}