:root {
    --metaHeader: #1e3973;
    --primary: #1e3973;
    --secondary: #3458a0;
    --color1: #234076;
    --color2: #a7b8dd;
    --color3: #f2f3f5;
    --color4: #d8dce4;
    --color5: #162d5d;
    --color6: #3e5ea1;
    --color7: #ffffff;
    --color8: #c9a887;
    --color9: #f36f1d;
    --color11: #e6effe;
    --color12: #aecaf9;
    --color13: #cfddef;
    --metaVip: #1c4385;
    --metaSecurity: #1e3973;
    --color14: #ffffff;
    --color10: #416cb6;
    --bs-gutter-x: 5px;
    --max-width: 768px;
    --bgTheme: #1e3973;
    --textTheme: #ffffff
}

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

body {
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    font-weight: normal;
    color: var(--clr-common-text);
    line-height: 26px;
    background-color: #fff;
    max-width: var(--max-width);
    margin: 0 auto
}

a {
    text-decoration: none !important
}

.w-img img {
    width: 100%
}

.m-img img {
    max-width: 100%
}

a:focus,
.button:focus {
    text-decoration: none;
    outline: none
}

a:focus,
a:hover {
    color: inherit;
    text-decoration: none
}

a,
button {
    color: inherit;
    outline: none;
    border: none;
    background: rgba(0, 0, 0, 0)
}

button:hover {
    cursor: pointer
}

button:focus {
    outline: 0;
    border: 0
}

.uppercase {
    text-transform: uppercase
}

.capitalize {
    text-transform: capitalize
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Roboto", sans-serif;
    color: var(--clr-common-heading);
    margin-top: 0px;
    font-weight: 600;
    line-height: 1.2
}

ul {
    margin: 0px;
    padding: 0px
}

li {
    list-style: none
}

p {
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    font-weight: normal;
    color: var(--clr-common-text);
    line-height: 26px
}

*::-moz-selection {
    background: var(--clr-common-black);
    color: var(--clr-common-white);
    text-shadow: none
}

::-moz-selection {
    background: var(--clr-common-black);
    color: var(--clr-common-white);
    text-shadow: none
}

::selection {
    background: var(--clr-common-black);
    color: var(--clr-common-white);
    text-shadow: none
}

*::-moz-placeholder {
    color: var(--clr-common-placeholder);
    font-size: 16px;
    opacity: 1
}

*::placeholder {
    color: var(--clr-common-placeholder);
    font-size: 16px;
    opacity: 1
}

.fix {
    overflow: hidden
}

.clear {
    clear: both
}

.f-left {
    float: left
}

.f-right {
    float: right
}

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

.z-index-11 {
    z-index: 11
}

.overflow-y-visible {
    overflow-x: hidden;
    overflow-y: visible
}

.p-relative {
    position: relative
}

.p-absolute {
    position: absolute
}

.pos-rel {
    position: relative
}

.pos-abs {
    position: absolute
}

.theme-bg {
    background-color: var(--clr-theme-1)
}

.grey-bg {
    background: var(--clr-bg-grey)
}

.off-green-bg {
    background-color: var(--clr-bg-off-green-bg)
}

.warning-bg {
    background-color: var(--clr-bg-warning-bg)
}

.danger-bg {
    background-color: var(--clr-bg-danger-bg)
}

.information-bg {
    background-color: var(--clr-bg-information-bg)
}

.grey2-bg {
    background: var(--clr-bg-grey2-bg)
}

.grey3-bg {
    background: var(--clr-bg-grey3-bg)
}

.brand2-bg {
    background-color: var(--clr-bg-brand2-bg)
}

.box-bg {
    background-color: var(--clr-common-box-bg)
}

.pink-bg {
    background: var(--clr-common-black)
}

.white-bg {
    background: var(--clr-common-white)
}

.black-bg {
    background: var(--clr-common-black)
}

.notice-success-bg {
    background-color: var(--clr-bg-notice-success)
}

.notice-warning-bg {
    background-color: var(--clr-bg-notice-warning)
}

.notice-danger-bg {
    background-color: var(--clr-bg-notice-danger)
}

.footer-bg {
    background: var(--clr-bg-footer)
}

.text-white h1,
.text-white h2,
.text-white h3,
.text-white h4,
.text-white h5,
.text-white h6,
.text-white p,
.text-white span,
.text-white li,
.text-white a {
    color: var(--clr-common-white) !important
}

.white-color {
    color: var(--clr-common-white)
}

.tcolor {
    color: var(--clr-common-black) !important
}

.black-color {
    color: var(--clr-common-black)
}

.body-overlay {
    background-color: rgba(0, 0, 0, .5);
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 99;
    left: 0;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.body-overlay:hover {
    cursor: pointer
}

.body-overlay.opened {
    opacity: 1;
    visibility: visible
}

.theme-btn {
    font-size: 16px;
    color: var(--clr-common-white);
    height: 55px;
    line-height: 55px;
    text-align: center;
    padding: 0px 45px;
    border-radius: 5px;
    display: inline-block;
    background: var(--clr-common-blue);
    font-weight: 500;
    border: 1px solid var(--clr-theme-1);
    outline: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    white-space: nowrap
}

.theme-btn:before {
    background-color: var(--cl-bg-white);
    content: "";
    height: 150px;
    left: -75px;
    position: absolute;
    top: -35px;
    transform: rotate(35deg);
    transition: all 1600ms cubic-bezier(0.19, 1, 0.22, 1);
    width: 40px;
    opacity: 0
}

.theme-btn.theme-btn-white {
    background-color: var(--cl-bg-white);
    color: var(--clr-common-blue)
}

.theme-btn.theme-btn-white:hover {
    background: var(--clr-common-blue);
    color: var(--clr-common-white)
}

.theme-btn:hover {
    background: rgba(0, 0, 0, 0);
    color: var(--clr-theme-1);
    border: 1px solid var(--clr-theme-1)
}

.theme-btn:hover:before {
    left: 120%;
    transition: all 1300ms cubic-bezier(0.19, 1, 0.22, 1);
    opacity: .25
}

.link-btn {
    position: relative;
    font-size: 15px;
    font-weight: 500;
    color: var(--clr-common-black);
    text-transform: uppercase;
    padding-right: 15px
}

.link-btn i {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    transition: all ease .2s;
    -webkit-transition: all ease .2s;
    -moz-transition: all ease .2s;
    -ms-transition: all ease .2s;
    -o-transition: all ease .2s
}

.link-btn i:first-child {
    left: -100%;
    visibility: hidden;
    opacity: 0
}

.link-btn i:last-child {
    right: 0
}

.link-btn:hover {
    color: var(--clr-common-black)
}

.link-btn:hover i:first-child {
    left: 0;
    visibility: visible;
    opacity: 1
}

.link-btn:hover i:last-child {
    right: -100%;
    visibility: hidden;
    opacity: 0
}

.link-btn-2 {
    position: relative;
    font-size: 14px;
    color: var(--clr-common-black);
    font-weight: 500;
    padding-right: 22px;
    display: inline-block;
    text-transform: uppercase;
    font-family: "Roboto", sans-serif
}

.link-btn-2 i {
    position: absolute;
    top: 45%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    transition: all ease .2s;
    -webkit-transition: all ease .2s;
    -moz-transition: all ease .2s;
    -ms-transition: all ease .2s;
    -o-transition: all ease .2s;
    font-size: 12px
}

.link-btn-2 i:first-child {
    right: 10%;
    visibility: hidden;
    opacity: 0
}

.link-btn-2 i:last-child {
    right: 0
}

.link-btn-2:hover {
    color: var(--clr-common-black)
}

.link-btn-2:hover i:first-child {
    right: 0;
    visibility: visible;
    opacity: 1
}

.link-btn-2:hover i:last-child {
    right: -10%;
    visibility: hidden;
    opacity: 0
}

.link-btn-2.pink {
    color: var(--clr-common-black)
}

.link-btn-2.pink:hover {
    color: var(--clr-common-black)
}

.pulse-btn {
    display: inline-block;
    width: 80px;
    height: 80px;
    line-height: 84px;
    text-align: center;
    background-color: var(--clr-common-white);
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    color: var(--clr-common-black);
    animation: pulse 2s infinite
}

.pulse-btn:hover {
    background-color: var(--clr-common-black);
    color: var(--clr-common-white)
}

.pulse-btn i {
    padding-left: 2px
}

@-webkit-keyframes pulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(95, 64, 255, .4)
    }

    70% {
        -webkit-box-shadow: 0 0 0 45px rgba(95, 64, 255, 0)
    }

    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(95, 64, 255, 0)
    }
}

@keyframes pulse {
    0% {
        -moz-box-shadow: 0 0 0 0 rgba(95, 64, 255, .4);
        box-shadow: 0 0 0 0 rgba(95, 64, 255, .4)
    }

    70% {
        -moz-box-shadow: 0 0 0 45px rgba(95, 64, 255, 0);
        box-shadow: 0 0 0 45px rgba(95, 64, 255, 0)
    }

    100% {
        -moz-box-shadow: 0 0 0 0 rgba(95, 64, 255, 0);
        box-shadow: 0 0 0 0 rgba(95, 64, 255, 0)
    }
}

.border-left {
    position: relative
}

.border-left:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    background: #eaebee;
    left: 0;
    top: 0
}

.border-none {
    border: none
}

:root {
    --clr-common-white: #fff;
    --clr-common-black: #000;
    --clr-common-blue: #3817E3;
    --clr-common-blue2: #348CFF;
    --clr-common-tb-color: #4F32E2;
    --clr-common-td-color: #6B51F1;
    --clr-common-heading: #1D1D1D;
    --clr-common-body: #666;
    --clr-common-text: #666;
    --clr-common-border: #eaebee;
    --clr-common-placeholder: #707070;
    --clr-common-breadcrumb-bg: #F9F9FB;
    --clr-common-nselect: #0f1d39;
    --clr-common-f-social: #95989b;
    --clr-common-f-border: #ebebeb;
    --clr-common-fcopy-border: #f1f1f1;
    --clr-common-box-bg: #f9fbff;
    --clr-common-du-color: #9A85FF;
    --clr-common-typed-text: #D4AD2F;
    --clr-common-hover: #2F92D4;
    --clr-common-shrik-text: #2F92D4;
    --clr-common-slide-text: #a22bdc;
    --clr-common-newsletter-form: #e7ebf5;
    --clr-common-newsletter-input: #F4F4F6;
    --clr-common-newsletter-btn: #D19631;
    --clr-common-table-default: #a5a5a5;
    --clr-common-table-black: #1d1d1d;
    --clr-common-code-block: #D41F63;
    --clr-common-green1: #2bcc6c;
    --clr-common-green2: #08FF00;
    --clr-common-green3: #4BC273;
    --clr-common-green4: #31CF8B;
    --clr-common-red1: #f22828;
    --clr-common-red2: #D93535;
    --clr-common-red3: #D62323;
    --clr-common-fborder: #ebeff2;
    --clr-common-blockquote: #F8F8F8;
    --clr-theme-1: #3817E3;
    --clr-theme-2: #fb5050;
    --clr-bg-gray: #EFEDF5;
    --clr-bg-black: #000;
    --clr-bg-white: #fff;
    --clr-bg-bselect: #f6f6f6;
    --clr-bg-tcolor: #3817E3;
    --clr-bg-btag: #381bcf;
    --clr-bg-manu-bar: #442AC8;
    --clr-bg-features-bg: #F3F2ED;
    --clr-bg-features-bg2: #EAF0F8;
    --clr-bg-features-bg3: #EAF6F2;
    --clr-bg-grey-bg: #f6f8f9;
    --clr-bg-grey2-bg: #F9F9FB;
    --clr-bg-grey3-bg: #fcfcfc;
    --clr-bg-off-green-bg: #eefbf3;
    --clr-bg-warning-bg: #fcf9f2;
    --clr-bg-danger-bg: #fef2f2;
    --clr-bg-information-bg: #f6f6ff;
    --clr-bg-brand2-bg: #f8f5f4;
    --clr-bg-secondary: #1e1e20;
    --clr-bg-success: #16c149;
    --clr-bg-warning: #efa904;
    --clr-bg-danger: #d82525;
    --clr-bg-information: #17a2b8;
    --clr-bg-notice-success: #dbffe9;
    --clr-bg-notice-warning: #fff9eb;
    --clr-bg-notice-danger: #ffecec
}

.bg-gray {
    background-color: var(--clr-bg-gray)
}

.breadcrumb-bg {
    background-color: var(--clr-common-breadcrumb-bg)
}

.white-bg {
    background-color: var(--clr-common-white)
}

.fill-btn {
    font-size: 16px;
    color: var(--clr-common-white);
    font-weight: 600;
    background: var(--clr-common-heading);
    border: 1px solid var(--clr-common-heading);
    height: 60px;
    display: inline-block;
    line-height: 58px;
    border-radius: 5px;
    padding: 0 52px;
    position: relative;
    overflow: hidden
}

.fill-btn:hover {
    color: var(--clr-common-heading);
    background: var(--clr-common-white)
}

.border-btn {
    font-size: 16px;
    color: var(--clr-common-heading);
    border: 1px solid var(--clr-common-heading);
    padding: 0 40px;
    height: 50px;
    border-radius: 5px;
    display: inline-block;
    line-height: 48px;
    font-weight: 600
}

.border-btn:hover {
    color: var(--clr-common-white);
    background: var(--clr-common-heading)
}

.section-title {
    font-size: 30px;
    line-height: 1.2;
    font-weight: 700;
    color: var(--clr-common-heading);
    margin-bottom: 23px
}

@media(max-width: 450px) {
    .section-title {
        font-size: 24px
    }

    .section-title br {
        display: none
    }
}

.section-subtitle {
    font-size: 16px
}

.hr1 {
    border-bottom: 1px solid #dcdcdc
}

@media(max-width: 575px) {
    .error-thumb img {
        width: 100%
    }
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl {
    width: 100%;
    padding-right: var(--bs-gutter-x, 15px);
    padding-left: var(--bs-gutter-x, 15px);
    margin-right: auto;
    margin-left: auto
}

.row {
    --bs-gutter-x: 30px
}

@media(min-width: 1400px) {
    .header-container {
        max-width: 1820px;
        overflow: hidden
    }
}

@media(min-width: 992px) {
    .header-container {
        overflow: hidden
    }
}

.page__title-wrapper h3 {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 50px;
    line-height: 60px;
    color: var(--clr-common-heading)
}

@media(max-width: 575px) {
    .page__title-wrapper h3 {
        font-size: 30px;
        line-height: 40px
    }
}

.breadcurms-area {
    border-bottom: 1px solid var(--clr-common-fcopy-border)
}

.trail-items li {
    position: relative;
    display: inline-block;
    margin-right: 25px
}

.trail-items li:not(:last-child)::after {
    display: inline-block;
    color: #707070;
    content: "";
    position: absolute;
    right: -17px;
    top: 0px;
    font-family: "Font Awesome 5 Pro";
    font-size: 18px
}

.trail-items a {
    font-family: "Roboto", sans-serif;
    font-size: 15px;
    line-height: 25px;
    color: var(--clr-common-body);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.trail-items a:hover {
    color: var(--clr-theme-1)
}

.trail-items a i {
    margin-right: 10px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .breadcrumb__dates {
        text-align: left !important
    }
}

.breadcrumb__dates p {
    margin-bottom: 0px;
    font-size: 15px
}

.breadcrumb__dates p i {
    margin-right: 10px
}

.flex-row {
    display: flex;
    flex-direction: row
}

.flex-left {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start
}

.flex-right {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end
}

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

.flex-top {
    display: flex;
    align-items: flex-start
}

.jc-start {
    justify-content: flex-start
}

.jc-end {
    justify-content: flex-end
}

.jc-center {
    justify-content: center
}

.jc-around {
    justify-content: space-around
}

.jc-between {
    justify-content: space-between
}

.ai-start {
    align-items: flex-start
}

.ai-end {
    align-items: flex-end
}

.ai-center {
    align-items: center
}

.mt-\[10px\] {
    margin-top: 10px !important
}

.mr-\[10px\] {
    margin-right: 10px !important
}

textarea:focus-visible {
    outline: none
}

.banner1-height {
    min-height: 750px;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center
}

.dbanner-title {
    color: var(--clr-common-white);
    font-weight: 700;
    font-size: 50px;
    margin-bottom: 20px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .dbanner-title {
        font-size: 38px
    }
}

.banner-subtitle {
    color: var(--clr-common-white);
    margin-bottom: 42px;
    font-size: 16px
}

.banner__input.banner-niceselect {
    height: 60px;
    line-height: 60px;
    border: none;
    width: 100px
}

.single-banner__img {
    position: absolute;
    right: 40px;
    bottom: 0;
    width: 23%
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px),
only screen and (min-width: 768px)and (max-width: 991px) {
    .single-banner__img {
        display: none
    }
}

.single-banner__img img {
    width: 100%
}

.single-banner__shape1 {
    position: absolute;
    top: 105px;
    right: 35%;
    filter: blur(2px);
    animation: hero-circle-1 7s linear 0s infinite alternate
}

@media(max-width: 575px) {
    .single-banner__shape1 {
        display: none
    }
}

.single-banner__shape2 {
    position: absolute;
    left: 23.5%;
    animation: hero-thumb-sm-2-animation 4s linear infinite alternate
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .single-banner__shape2 {
        display: none
    }
}

.single-banner__shape3 {
    position: absolute;
    bottom: 0;
    left: 20px
}

.single-banner__shape4 {
    position: absolute;
    right: 0px;
    top: 315px;
    filter: blur(3px)
}

@media(max-width: 575px) {
    .single-banner__shape4 {
        display: none
    }
}

.search-form {
    position: relative;
    width: 100%;
    max-width: 765px;
    margin: 0 auto;
    margin-bottom: 30px
}

.search-form input {
    width: 100%;
    height: 60px;
    line-height: 60px;
    padding: 0 135px 0 120px;
    color: var(--clr-common-heading);
    border-radius: 5px;
    background: var(--clr-common-white);
    border: none
}

@media(max-width: 575px) {
    .search-form input {
        padding: 0 56px 0 115px
    }
}

.search-form input::placeholder {
    font-size: 14px;
    color: #b1b1b1
}

.search-form input::focus {
    border: 0
}

.search-form button {
    font-size: 16px;
    font-weight: 700;
    text-transform: inherit;
    line-height: 50px;
    text-align: center;
    height: 50px;
    color: var(--clr-common-black);
    border: none;
    position: absolute;
    top: 7px;
    right: -5px;
    bottom: 0;
    border-radius: 5px;
    overflow: hidden;
    padding: 0 30px
}

.search-form button i {
    color: var(--clr-common-black);
    margin-left: 10px
}

.search-form .nice-select::after {
    border-bottom: 2px solid #0f1d39;
    border-right: 2px solid #0f1d39;
    content: "";
    display: block;
    height: 6px;
    margin-top: -4px;
    pointer-events: none;
    position: absolute;
    right: 20px;
    top: 50%;
    -webkit-transform-origin: 66% 66%;
    -ms-transform-origin: 66% 66%;
    transform-origin: 66% 66%;
    -webkit-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out;
    width: 6px
}

.banner-niceselect {
    position: absolute;
    left: 0;
    height: 60px;
    line-height: 60px;
    color: var(--clr-common-nselect);
    width: auto;
    min-width: 100px;
    border: none;
    border-radius: 5px 0px 0px 5px;
    background-color: var(--clr-bg-bselect);
    font-weight: 500
}

@media(max-width: 575px) {
    .banner-niceselect {
        width: 75px
    }
}

.banner-niceselect span {
    font-size: 15px;
    font-weight: 500
}

.banner-tag {
    text-align: center
}

.banner-tag span {
    font-size: 14px;
    color: var(--clr-common-white);
    margin-right: 5px
}

.banner-tag a {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    text-align: center;
    padding: 0 13px;
    font-size: 14px;
    margin-left: 8px;
    background-color: var(--clr-bg-btag);
    color: var(--clr-common-white);
    border-radius: 2px;
    margin-bottom: 5px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.banner-tag a:hover {
    background-color: var(--clr-common-hover)
}

@media(max-width: 575px) {
    .banner-tag a {
        padding: 0px 10px;
        margin-left: 2px
    }
}

.search-form input:focus-visible {
    outline: none
}

@keyframes hero-thumb-sm-animation {
    0% {
        -webkit-transform: translateY(-20px) translateX(50px);
        -moz-transform: translateY(-20px) translateX(50px);
        -ms-transform: translateY(-20px) translateX(50px);
        transform: translateY(-20px) translateX(50px)
    }

    100% {
        -webkit-transform: translateY(-20px) translateX(0px);
        -moz-transform: translateY(-20px) translateX(0px);
        -ms-transform: translateY(-20px) translateX(0px);
        transform: translateY(-20px) translateX(0px)
    }
}

@keyframes hero-thumb-sm-2-animation {
    0% {
        -webkit-transform: translateY(-50px);
        -moz-transform: translateY(-50px);
        -ms-transform: translateY(-50px);
        transform: translateY(-50px)
    }

    100% {
        -webkit-transform: translateY(0px);
        -moz-transform: translateY(0px);
        -ms-transform: translateY(0px);
        transform: translateY(0px)
    }
}

@keyframes hero-circle-2 {
    0% {
        -webkit-transform: translateX(-200px);
        -moz-transform: translateX(-200px);
        -ms-transform: translateX(-200px);
        transform: translateX(-200px)
    }

    100% {
        -webkit-transform: translateX(0px);
        -moz-transform: translateX(0px);
        -ms-transform: translateX(0px);
        transform: translateX(0px)
    }
}

@keyframes hero-bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0)
    }

    40% {
        transform: translateY(-30px)
    }

    60% {
        transform: translateY(-15px)
    }
}

@keyframes hero-circle-1 {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes hero-triangle-1 {
    0% {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    100% {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -ms-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes services-triangle {
    0% {
        -webkit-transform: rotate(0deg) translateX(-50px);
        -moz-transform: rotate(0deg) translateX(-50px);
        -ms-transform: rotate(0deg) translateX(-50px);
        transform: rotate(0deg) translateX(-50px)
    }

    100% {
        -webkit-transform: rotate(360deg) translateY(100px);
        -moz-transform: rotate(360deg) translateY(100px);
        -ms-transform: rotate(360deg) translateY(100px);
        transform: rotate(360deg) translateY(100px)
    }
}

.banner2-height {
    padding: 295px 0px 100px 0px;
    background: linear-gradient(#edecff 0%, rgba(255, 255, 255, 0) 100%)
}

@media(max-width: 575px) {
    .banner2-height {
        padding: 200px 0px 100px 0px
    }
}

.dbanner2-title {
    color: var(--clr-common-heading)
}

.banner2-subtitle {
    color: var(--clr-common-heading)
}

.banner2-tag {
    min-width: 450px;
    margin: 0 auto;
    margin-bottom: 15px;
    border: 1px solid #ddd;
    border-radius: 30px;
    display: inline-block;
    font-weight: 500;
    font-size: 14px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .banner2-tag {
        min-width: 285px
    }
}

@media(max-width: 575px) {
    .banner2-tag {
        border: none
    }
}

.banner2-tag a {
    height: 40px;
    display: inline-block;
    padding: 0px 20px;
    background: rgba(0, 0, 0, 0);
    line-height: 40px;
    border-radius: 30px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.banner2-tag a:hover {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
    position: relative;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.banner2-tag .active {
    background: var(--clr-theme-1);
    color: var(--clr-common-white);
    position: relative
}

.banner2-tag .active:before {
    position: absolute;
    content: "";
    width: 11px;
    height: 5px;
    background-color: var(--clr-theme-1);
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    left: 45%;
    bottom: -5px
}

.search2-form input {
    height: 70px;
    border-radius: 50px;
    padding: 0 60px 0 160px;
    box-shadow: 0px 5px 30px rgba(6, 21, 62, .1)
}

@media(max-width: 575px) {
    .search2-form input {
        padding: 0 45px 0 143px
    }
}

.search2-form button {
    font-size: 15px;
    top: 12px;
    right: 0px;
    bottom: 0;
    border-radius: 5px;
    padding: 0 23px
}

.search2-form button i {
    margin-left: 0
}

.search2-form .nice-select::after {
    content: "";
    display: block;
    height: 6px;
    margin-top: -4px;
    right: 30px;
    top: 50%;
    width: 6px
}

@media(max-width: 575px) {
    .search2-form .nice-select::after {
        right: 20px
    }
}

.banner2-niceselect {
    left: 5px;
    height: 60px;
    width: 130px;
    border-radius: 30px 0px 0px 30px;
    top: 5px
}

.header-transparent {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999
}

.header1.du-sticky-header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--clr-common-tb-color);
    z-index: 999;
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    display: block;
    box-shadow: 0px 10px 20px 0px rgba(8, 0, 42, .08)
}

.header2.du-sticky-header.sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--bgTheme);
    z-index: 999;
    animation: 300ms ease-in-out 0s normal none 1 running fadeInDown;
    display: block;
    box-shadow: 0px 10px 20px 0px rgba(8, 0, 42, .08)
}

.bar-icon {
    width: 20px;
    height: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden
}

.bar-icon span {
    width: 100%;
    height: 2px;
    background: var(--clr-common-white);
    display: inline-block
}

.bar-icon span:nth-child(2) {
    margin-left: 9px;
    transition: .3s
}

.bar-icon:hover span:nth-child(2) {
    margin-left: 0
}

.menu-bar a {
    height: 50px;
    width: 50px;
    background: var(--clr-bg-manu-bar);
    padding: 17px 0px 0px 15px;
    border-radius: 50%;
    display: inline-block
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 1200px)and (max-width: 1399px) {
    .main-menu {
        margin-right: 0px
    }
}

.main-menu ul li {
    display: inline-block;
    margin: 0px 18px;
    position: relative
}

@media only screen and (min-width: 1400px)and (max-width: 1600px) {
    .main-menu ul li {
        margin: 0px 16px
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .main-menu ul li {
        margin: 0px 13px
    }
}

.main-menu ul li a {
    font-size: 15px;
    color: var(--clr-common-heading);
    display: block;
    padding: 32px 0px;
    font-weight: 500;
    text-transform: capitalize;
    line-height: 1
}

.main-menu ul li .sub-menu {
    background: var(--clr-common-white) none repeat scroll 0 0;
    box-shadow: 0 6px 12px rgba(0, 0, 0, .176);
    left: 0;
    opacity: 0;
    position: absolute;
    top: 120%;
    transition: all .3s ease 0s;
    visibility: hidden;
    width: 240px;
    z-index: 9;
    border-top: 3px solid var(--clr-theme-1);
    text-align: left;
    padding: 15px 0
}

.main-menu ul li .sub-menu li {
    display: block;
    margin: 0px;
    padding: 8px 25px 8px 25px
}

.main-menu ul li .sub-menu li:hover>.sub-menu {
    top: 0%
}

.main-menu ul li .sub-menu li .sub-menu {
    left: 100%;
    top: 20%;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.main-menu ul li .sub-menu li a {
    padding: 0px;
    display: inline-block;
    color: #212237;
    position: relative
}

.main-menu ul li .sub-menu li a:hover {
    color: var(--clr-theme-1)
}

.main-menu ul li .sub-menu li a:before {
    width: 100%;
    left: 0;
    right: auto
}

.main-menu ul li:hover a {
    color: var(--clr-theme-1)
}

.main-menu ul li:hover.menu-item-has-children::after {
    color: var(--clr-theme-1)
}

.main-menu ul li:hover>.sub-menu {
    opacity: 1;
    visibility: visible;
    top: 100%
}

.main-menu ul li ul li.menu-item-has-children::after {
    right: 14px
}

.duheader-btn {
    font-size: 15px;
    color: var(--clr-theme-1);
    height: 45px;
    line-height: 44px;
    text-align: center;
    padding: 0px 28px;
    display: inline-block;
    background: rgba(0, 0, 0, 0);
    font-weight: 500;
    border: 1px solid var(--clr-theme-1);
    outline: none;
    cursor: pointer;
    overflow: hidden;
    transition: all .3s ease-out 0s;
    border-radius: 30px
}

.duheader-btn:hover {
    background-color: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.sidebar-toggle-btn:hover {
    cursor: pointer
}

.offcanvas-overlay {
    position: fixed;
    height: 100%;
    width: 100%;
    background: #000;
    z-index: 1000;
    top: 0;
    opacity: 0;
    visibility: hidden
}

.offcanvas-overlay.overlay-open {
    opacity: .3;
    visibility: visible
}

.offcanvas-overlay-white {
    position: fixed;
    height: 100%;
    width: 100%;
    background: #fff;
    z-index: 1000;
    top: 0;
    opacity: 0;
    visibility: hidden
}

.offcanvas-overlay-white.overlay-open {
    opacity: 0;
    visibility: visible
}

.side-info-close {
    background: none;
    border: 0;
    color: var(--clr-common-heading);
    font-size: 20px;
    padding: 0;
    -webkit-transition: all .5s ease-out 0s;
    -moz-transition: all .5s ease-out 0s;
    -ms-transition: all .5s ease-out 0s;
    -o-transition: all .5s ease-out 0s;
    transition: all .5s ease-out 0s
}

.side-info {
    background: #fff;
    height: 100%;
    position: fixed;
    z-index: 99999;
    right: -100%;
    top: 0;
    width: 365px;
    padding: 70px 35px 45px 45px;
    transition: .6s;
    overflow-y: scroll;
    opacity: 0
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .side-info {
        width: 300px;
        padding: 65px 25px
    }
}

.side-info.info-open {
    right: 0;
    opacity: 1
}

div.mean-container .mean-nav {
    background: none;
    margin-bottom: 10px;
    margin-top: 6px;
    overflow: hidden
}

div.mean-container .mean-nav>ul {
    display: block !important
}

div.mean-container .mean-nav ul li a {
    width: 100%;
    color: var(--clr-common-heading);
    border-top: none;
    border-bottom: 1px solid var(--clr-common-border);
    font-size: 16px;
    text-transform: capitalize;
    opacity: 1;
    color: var(--clr-common-heading);
    display: flex;
    align-items: center
}

div.mean-container .mean-nav ul li a i {
    display: none
}

div.mean-container .mean-nav ul li a img {
    display: inline-block;
    margin-right: 8px;
    width: 25px
}

div.mean-container .mean-nav ul li a.mean-expand {
    height: 26px;
    border: none
}

div.mean-container .mean-nav ul li a.mean-expand::before {
    position: absolute;
    content: "+";
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

div.mean-container .mean-nav ul li a.mean-expand.mean-clicked::before {
    content: "-"
}

div.mean-container a.meanmenu-reveal {
    display: none !important
}

.header-menu-top-icon a {
    display: block;
    font-size: 16px;
    margin-bottom: 5px
}

.header-menu-top-icon a:hover {
    color: var(--clr-theme-1)
}

.header-menu-top-icon i {
    margin-right: 10px;
    color: var(--clr-theme-1);
    width: 16px
}

.bar-icon {
    width: 26px;
    height: 16px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden
}

.bar-icon span {
    width: 100%;
    height: 2px;
    background: var(--clr-common-white);
    display: inline-block
}

.bar-icon span:nth-child(2) {
    margin-left: 9px;
    transition: .3s
}

.bar-icon:hover span:nth-child(2) {
    margin-left: 0
}

.filter-search-input input {
    width: 100%;
    height: 55px;
    padding: 0 35px 0 15px;
    font-size: 14px;
    color: var(--clr-common-body);
    outline: none;
    border: 1px solid #edeef2;
    border-radius: 5px
}

.filter-search-input button {
    position: absolute;
    top: 50%;
    right: 15px;
    content: "";
    background: #fff;
    transform: translateY(-50%);
    color: var(--clr-theme-1);
    font-size: 14px
}

.header2 {
    padding: 6px 0;
    max-width: var(--max-width);
    margin: 0 auto;
    background: var(--bgTheme)
}

.header2 .header-right svg {
    width: 40px
}

.header2 .header-right svg path {
    fill: var(--textTheme) !important
}

.header2 .header-left svg {
    width: 40px
}

.header2 .header-left path {
    stroke: var(--textTheme) !important
}

.header2 .header1-logo {
    color: var(--textTheme) !important
}

.header2 .header1-logo .logo-bl img {
    height: 40px
}

.bar2-icon span {
    background-color: var(--textTheme);
    display: inline-block
}

.offset-logo {
    position: absolute;
    top: 0;
    width: 100%;
    background: var(--bgTheme);
    left: 0;
    padding: 7px 35px 7px 45px
}

.offset-logo .col-9 a img {
    height: 40px
}

.fa-times:before {
    color: var(--textTheme)
}

.mean-container .mean-bar {
    background: #fff;
    padding: 10px 0
}

.nav-top {
    height: 40px;
    position: relative;
    background: var(--bgTheme)
}

.nav-top .btn-back {
    position: relative !important
}

.nav-top .btn-back svg path {
    stroke: var(--textTheme) !important
}

.nav-top label {
    color: var(--textTheme) !important
}

.nav-top .blank-btn {
    width: 2.5rem
}

.nav-top .svg-theme {
    width: 40px
}

.nav-top .svg-theme path {
    fill: var(--textTheme) !important
}

.fixed-header {
    max-width: var(--max-width);
    margin: 0 auto;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    z-index: 99
}

.brand2-bg {
    padding-left: 15px;
    padding-right: 15px;
    border-radius: 15px
}

.f-shape-1 {
    position: absolute;
    right: 29.1%;
    bottom: 29%
}

.f-shape-2 {
    position: absolute;
    top: 0;
    left: 29.5%
}

.brand-subtitle p {
    font-size: 18px;
    color: #666
}

.brand-subtitle p span {
    color: #000;
    font-weight: 700
}

.brand-shape {
    position: absolute;
    top: 0;
    right: 250px;
    z-index: -1
}

@media only screen and (min-width: 1200px)and (max-width: 1399px),
only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .brand-shape {
        right: 0px
    }
}

.duservices__single {
    padding: 38px 25px 43px 30px;
    background: linear-gradient(#f1f4fe 0%, #fff 100%);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    border-radius: 10px
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
(max-width: 575px) {
    .duservices__single {
        padding: 43px 25px 40px 30px
    }
}

.duservices__single-title {
    font-size: 20px;
    font-weight: 700;
    color: var(--clr-common-heading);
    margin-bottom: 20px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.duservices__single-title:hover {
    color: var(--clr-theme-1)
}

.duservices__single p {
    font-size: 15px
}

.duservices__single .read-more {
    font-size: 15px;
    color: var(--clr-theme-1);
    font-weight: 500;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.duservices__single .read-more:hover {
    color: var(--clr-common-hover)
}

.duservices__single-icon {
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
(max-width: 575px) {
    .duservices__single-icon {
        margin-right: 20px
    }
}

.duservices__single:hover {
    box-shadow: 0px 3px 2px 0px #d0d4f3
}

.duservices__single:hover .duservices__single-icon {
    transform: translateY(-10px)
}

.duservices__single2 {
    background: linear-gradient(#f1fef8 0%, #fff 100%)
}

.duservices__single2:hover {
    box-shadow: 0px 6px 2px 2px #f2fef9
}

.duservices__single3 {
    background: linear-gradient(#fef8f1 0%, #fff 100%)
}

.duservices__single3:hover {
    box-shadow: 0px 6px 2px 0px #fef8f1
}

.duservices2__single {
    box-shadow: 0px 20px 30px rgba(8, 25, 74, .08);
    filter: drop-shadow(0px 20px 30px rgba(8, 25, 74, 0.08));
    background: rgba(0, 0, 0, 0);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.duservices2__single:hover {
    box-shadow: 0px 70px 60px rgba(8, 25, 74, .08);
    filter: drop-shadow(0px 70px 60px rgba(8, 25, 74, 0.08))
}

.featured-area {
    z-index: 2
}

.featured-bg {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat
}

.featured-shape {
    position: absolute;
    right: 14%;
    top: 23%;
    z-index: -1
}

@media only screen and (min-width: 1400px)and (max-width: 1600px) {
    .featured-shape {
        right: 6%;
        top: 21%
    }
}

@media only screen and (min-width: 1200px)and (max-width: 1399px) {
    .featured-shape {
        right: 0%;
        top: 22%
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .featured-shape {
        right: 0%;
        top: 15%
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .featured-shape {
        right: 0%;
        top: 15%
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .featured-shape {
        display: none
    }
}

.featureds {
    padding: 35px 30px 30px 30px;
    background: var(--clr-bg-gray);
    border-radius: 10px
}

.featureds__img {
    margin-bottom: 25px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.featureds__title {
    font-size: 20px;
    color: var(--clr-common-heading);
    margin-bottom: 20px;
    font-weight: 700;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.featureds__title:hover {
    color: var(--clr-theme-1)
}

.featureds__content ul li {
    list-style: none;
    margin-bottom: 2px;
    font-size: 15px
}

.featureds__content ul li a {
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.featureds__content ul li a:hover {
    color: var(--clr-theme-1)
}

.featureds__content ul li a:hover i {
    color: var(--clr-theme-1)
}

.featureds__content ul li:last-child {
    margin-bottom: 0px
}

.featureds__content ul li i {
    margin-right: 12px;
    vertical-align: middle;
    color: var(--clr-common-heading)
}

.featureds:hover .featureds__img {
    transform: translateY(-10px)
}

.featureds:hover .featureds__img {
    transform: translateY(-10px)
}

.featureds2 {
    background-color: var(--clr-bg-features-bg)
}

.featureds3 {
    background-color: var(--clr-bg-features-bg2)
}

.featureds4 {
    background-color: var(--clr-bg-features-bg3)
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .single-featured2 {
        margin-left: 0
    }
}

.featured2 {
    padding: 42px 35px 42px 35px;
    border-radius: 10px
}

.featured2-title {
    font-size: 28px
}

.featured2 p {
    font-size: 16px
}

.featured2-item-left-icon {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    box-shadow: 0px 20px 30px rgba(8, 25, 74, .08);
    line-height: 90px;
    text-align: center
}

.featured2-item-right-title {
    font-size: 20px
}

.featured2-item-right-title a {
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.featured2-item-right-title a:hover {
    color: var(--clr-theme-1)
}

.featured2-item-right p {
    font-size: 15px;
    margin-bottom: 0px
}

.featured2-item:hover .featured2-item-left .featured2-item-left-icon img {
    transform: translateY(-10px)
}

@media only screen and (min-width: 1200px)and (max-width: 1399px),
only screen and (min-width: 992px)and (max-width: 1199px) {
    .features-tabs {
        padding-bottom: 90px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
(max-width: 575px) {
    .features-tabs {
        padding-bottom: 70px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px) {
    .features-tabs {
        padding-bottom: 80px
    }
}

.fearured-tabs-menu {
    text-align: center;
    margin: 0 auto
}

.fearured-tabs-menu .nav-tabs {
    border-bottom: 1px solid var(--clr-theme-1);
    display: flex;
    justify-content: center
}

.fearured-tabs-menu .nav-tabs .nav-link {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px
}

.fearured-tabs-menu .nav-tabs {
    border-bottom: 1px solid var(--clr-theme-1)
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .fearured-tabs-menu .nav-tabs {
        border-bottom: none
    }
}

.fearured-tabs-menu .nav-link.active {
    border-color: var(--clr-theme-1) var(--clr-theme-1) #fff;
    position: relative
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .fearured-tabs-menu .nav-link.active {
        border: 1px solid var(--clr-theme-1);
        border-radius: 5px
    }
}

.fearured-tabs-menu .nav-link.active:before {
    position: absolute;
    content: "";
    width: 11px;
    height: 5px;
    background-color: var(--clr-theme-1);
    clip-path: polygon(0 0, 50% 100%, 100% 0);
    left: 45%;
    bottom: -5px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .fearured-tabs-menu .nav-link.active:before {
        display: none
    }
}

.fearured-tabs-menu .nav-tabs .nav-link {
    height: 50px;
    padding: 0px 30px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .fearured-tabs-menu .nav-tabs .nav-link {
        padding: 0px 20px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .fearured-tabs-menu .nav-tabs .nav-link:hover {
        border-radius: 5px
    }
}

.featureds-3 {
    padding: 40px 50px 32px;
    box-shadow: 0px 20px 50px rgba(8, 25, 74, .08);
    border-radius: 10px
}

@media(max-width: 450px) {
    .featureds-3 {
        padding: 40px 30px 32px
    }
}

.featureds-3__img {
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.featureds-3__title {
    font-size: 24px;
    font-family: "Roboto", sans-serif;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.featureds-3__title:hover {
    color: var(--clr-theme-1)
}

.featureds-3__content ul li {
    list-style: none;
    margin-bottom: 7px;
    font-size: 15px
}

.featureds-3__content ul li a {
    font-size: 16px;
    color: var(--clr-common-body);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.featureds-3__content ul li a:hover {
    color: var(--clr-theme-1)
}

.featureds-3__content ul li:last-child {
    margin-bottom: 0px
}

.featureds-3__content ul li i {
    margin-right: 12px;
    vertical-align: middle
}

.featureds-3:hover .featureds-3__img {
    transform: translateY(-10px)
}

.about-main-img img {
    width: 100%
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .about-content {
        margin-left: 0px
    }
}

.about-choose-list ul li {
    list-style: none;
    margin-bottom: 6px;
    font-size: 16px
}

.about-choose-list ul li i {
    margin-right: 8px;
    color: var(--clr-common-blue)
}

.about-shape {
    position: absolute;
    left: -3px;
    top: 9px;
    animation: hero-circle-1 7s linear 0s infinite alternate
}

.about-shape2 {
    position: absolute;
    top: 34%;
    left: 12%;
    animation: hero-thumb-sm-2-animation 4s linear infinite alternate
}

@media only screen and (min-width: 1200px)and (max-width: 1399px) {
    .about-shape2 {
        top: 40%;
        left: 6%
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .about-shape2 {
        display: none
    }
}

.about-shape3 {
    position: absolute;
    right: 9%;
    top: -18%;
    animation: hero-thumb-sm-2-animation 4s linear infinite alternate
}

@media only screen and (min-width: 1200px)and (max-width: 1399px) {
    .about-shape3 {
        top: -9%
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .about-shape3 {
        top: 0
    }
}

@media(max-width: 575px) {
    .about-shape3 {
        display: none
    }
}

.blog__wrapper {
    margin-bottom: 50px
}

.blog__item {
    border: 1px solid #f6f6f8;
    border-radius: 10px
}

.blog__item-thumb {
    overflow: hidden;
    border-radius: 10px 10px 0px 0px
}

.blog__item-thumb img {
    border-radius: 10px 10px 0 0;
    width: 100%;
    transform: scale(1);
    transition: .4s ease-in-out
}

.blog__item-content {
    padding: 32px 40px 32px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .blog__item-content {
        padding: 25px 20px
    }
}

@media(max-width: 450px) {
    .blog__item-content {
        padding: 20px 15px
    }
}

.blog__item-title {
    font-size: 30px;
    margin-bottom: 20px;
    text-transform: capitalize;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    line-height: 40px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .blog__item-title {
        font-size: 24px;
        line-height: 34px
    }
}

@media(max-width: 450px) {
    .blog__item-title {
        font-size: 20px;
        line-height: 30px
    }
}

.blog__item-title:hover {
    color: var(--clr-theme-1)
}

.blog__item:hover .blog__item-thumb img {
    transform: scale(1.1)
}

.post-meta span {
    transition: .3s;
    font-weight: 500;
    text-transform: capitalize;
    color: var(--clr-common-body);
    margin-right: 20px;
    font-size: 15px;
    display: inline-block;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

@media(max-width: 575px) {
    .post-meta span {
        margin-right: 5px
    }
}

.post-meta span a {
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.post-meta span a:hover {
    color: var(--clr-theme-1)
}

.post-meta span i {
    color: var(--clr-common-heading);
    font-size: 14px;
    margin-right: 5px;
    color: var(--clr-theme-1)
}

.post-text p span {
    background: var(--clr-common-heading);
    color: var(--clr-common-heading)
}

.post-text p img {
    width: 100%
}

.post-text h3 {
    text-transform: capitalize;
    font-size: 27px
}

@media(max-width: 575px) {
    .post-text h3 {
        font-size: 25px
    }
}

.post-text blockquote {
    margin: 35px 0px !important;
    padding: 40px 40px 35px 40px;
    color: var(--clr-common-body);
    position: relative;
    background: var(--clr-common-blockquote);
    font-style: normal;
    text-align: left;
    clear: both;
    font-weight: 400;
    border-radius: 10px;
    box-shadow: 0 1px 2px 0 rgba(10, 0, 58, .14);
    border: 1px solid #f6f6f8
}

@media(max-width: 575px) {
    .post-text blockquote {
        padding: 40px 20px 35px 20px
    }
}

.post-text blockquote::before {
    content: "";
    position: static;
    font-family: "Font Awesome 5 Pro";
    font-size: 32px;
    color: var(--clr-theme-1);
    line-height: 1;
    margin-bottom: 18px;
    display: inline-block
}

.post-text blockquote cite {
    font-size: 18px;
    display: block;
    margin-top: 10px;
    color: var(--clr-common-heading);
    font-style: inherit;
    font-family: "Roboto", sans-serif;
    font-weight: 900
}

.post-text blockquote cite::before {
    content: "";
    font-size: 28px;
    color: #ff5421;
    padding-bottom: 0;
    display: inline-block;
    background: var(--clr-theme-1);
    height: 2px;
    width: 40px;
    font-weight: 400;
    text-align: center;
    top: -4px;
    margin-right: 10px;
    position: relative
}

.blog__tag {
    overflow: hidden;
    clear: both
}

.blog__tag span {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    color: var(--clr-common-heading);
    margin-right: 5px;
    font-weight: 700
}

.blog__tag a {
    display: inline-block;
    height: 30px;
    line-height: 26px;
    text-align: center;
    padding: 0 13px;
    font-size: 14px;
    font-weight: 700;
    border: 2px solid #e8e7ec;
    border-radius: 6px;
    margin-right: 8px;
    margin-bottom: 10px;
    text-transform: capitalize
}

.blog__tag a:hover {
    color: var(--clr-common-white);
    background: var(--clr-theme-1);
    border-color: var(--clr-theme-1)
}

.blog__share span {
    font-family: "Roboto", sans-serif;
    font-size: 18px;
    color: var(--clr-common-heading);
    margin-right: 5px;
    font-weight: 700;
    display: inline-block;
    margin-bottom: 5px
}

.blog__social ul {
    display: inline-block
}

.blog__social ul li {
    display: inline-block;
    margin-right: 8px
}

.blog__social ul li a {
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    border-radius: 10px;
    background: #f1f1f1;
    display: inline-block;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.blog__social ul li a:hover {
    background: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.blog__author {
    padding: 30px 40px;
    box-shadow: 0px 1px 4px 0px rgba(10, 0, 58, .14);
    border-radius: 10px
}

@media(max-width: 575px) {
    .blog__author {
        padding: 30px 15px
    }
}

@media(max-width: 575px) {
    .blog__author-img {
        margin-right: 0px
    }
}

.blog__author-img img {
    border-radius: 5px
}

@media(max-width: 575px) {
    .blog__author-img img {
        width: 100%
    }
}

@media(max-width: 575px) {
    .blog__author-content {
        margin-top: 30px
    }
}

.blog__author-content h5 {
    font-size: 18px;
    margin-bottom: 0;
    text-transform: capitalize
}

.blog__author-content span {
    display: inline-block;
    margin-bottom: 5px
}

@media(max-width: 575px) {
    .blog__author-content span {
        margin-bottom: 17px
    }
}

.blog__author-content p {
    margin-bottom: 0px
}

.post-comment-title h3 {
    font-size: 22px;
    text-transform: capitalize
}

.comments-avatar {
    float: left;
    margin-right: 20px
}

.comments-avatar img {
    border-radius: 50%
}

.avatar-name {
    margin-bottom: 10px;
    overflow: hidden;
    position: relative
}

.avatar-name h5 {
    font-size: 18px;
    margin-bottom: 0px;
    text-transform: capitalize
}

.avatar-name span {
    font-size: 14px;
    font-weight: 500
}

.comments-text {
    overflow: hidden;
    border-bottom: 1px solid #f1f0f7;
    padding-bottom: 30px;
    margin-bottom: 30px
}

.comments-text p {
    margin-bottom: 20px
}

.comment-reply {
    font-weight: 600;
    font-size: 14px;
    color: var(--clr-common-heading);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.comment-reply:hover {
    color: var(--clr-theme-1)
}

.comment-reply i {
    padding-right: 4px
}

.latest-comments li.children {
    margin-left: 105px
}

@media only screen and (min-width: 576px)and (max-width: 767px) {
    .latest-comments li.children {
        margin-left: 60px
    }
}

@media(max-width: 575px) {
    .latest-comments li.children {
        margin-left: 15px
    }
}

.latest-comments li:first-child .comments-box {
    border-top: 0;
    padding-top: 0
}

.post-input input {
    color: var(--clr-common-body);
    font-size: 16px;
    display: block;
    width: 100%;
    height: 55px;
    background: var(--clr-common-white);
    font-weight: 400;
    outline: none;
    padding: 0px 20px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid var(--clr-common-fcopy-border)
}

.post-input input:focus {
    border-color: none;
    outline: none;
    background: var(--clr-common-white)
}

.post-input input:focus::placeholder {
    opacity: 0
}

.post-input textarea {
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding: 0 30px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: 2px solid #f5f5f5;
    background: #f5f5f5
}

.post-input textarea::placeholder {
    font-weight: 500;
    color: #686777
}

.post-input textarea:focus {
    border-color: none;
    outline: none;
    background: var(--clr-common-white)
}

.post-input textarea:focus::placeholder {
    opacity: 0
}

.post-input textarea {
    height: 170px;
    width: 100%;
    background: var(--clr-common-white);
    border: none;
    padding: 15px 20px;
    border-radius: 4px;
    resize: none;
    outline: 0;
    border: 1px solid var(--clr-common-fcopy-border)
}

.post-input textarea:focus {
    outline: none
}

.post-comment-form h4 {
    font-size: 22px;
    margin-bottom: 0;
    text-transform: capitalize
}

.post-comment-form>span {
    display: inline-block;
    margin-bottom: 50px
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .basic-pagination {
        margin-bottom: 60px
    }
}

.basic-pagination ul {
    padding-left: 0;
    line-height: 1
}

.basic-pagination ul li {
    display: inline-block;
    margin-right: 10px
}

.basic-pagination ul li span.current {
    color: #fff;
    background: var(--clr-theme-1)
}

.basic-pagination ul li a,
.basic-pagination ul li span {
    position: relative;
    overflow: hidden;
    background: #f1f1f1;
    color: var(--clr-common-heading);
    font-size: 20px;
    display: inline-block;
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px
}

.basic-pagination ul li a:hover,
.basic-pagination ul li span.current {
    background: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.basic-pagination ul li a:hover i:first-child,
.basic-pagination ul li a:hover span:first-child {
    left: -130%
}

.basic-pagination ul li a:hover i:last-child,
.basic-pagination ul li a:hover span:last-child {
    left: 50%
}

.basic-pagination ul li a i,
.basic-pagination ul li a span {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    transition: all .2s ease-out 0s
}

.basic-pagination ul li a i:last-child,
.basic-pagination ul li a span:last-child {
    left: 130%
}

.sidebar-widget-wrapper {
    padding-left: 30px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .sidebar-widget-wrapper {
        padding-left: 10px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .sidebar-widget-wrapper {
        padding-left: 0px
    }
}

.page-sidebar {
    padding-left: 30px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .page-sidebar {
        padding-left: 10px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .page-sidebar {
        padding-left: 0px
    }
}

.blog__sidebar {
    padding-left: 30px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .blog__sidebar {
        padding-left: 10px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .blog__sidebar {
        padding-left: 0px
    }
}

.blog__sidebar ul,
.blog__sidebar ol li {
    list-style: none
}

.sidebar__widget ul li {
    margin-bottom: 15px;
    list-style: none
}

.sidebar__widget ul li:last-child {
    margin-bottom: 0
}

.sidebar__widget ul li a {
    padding-left: 20px;
    position: relative;
    font-weight: 500;
    color: var(--clr-common-body)
}

.sidebar__widget ul li a::after {
    position: absolute;
    content: "";
    left: 0;
    top: -4px;
    font-family: "Font Awesome 5 Pro";
    font-size: 16px;
    color: var(--clr-common-heading);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.sidebar__widget ul li a:hover {
    color: var(--clr-theme-1)
}

.sidebar__widget ul li a:hover::after {
    left: 5px;
    color: var(--clr-theme-1)
}

.sidebar__widget-title {
    font-size: 22px;
    position: relative;
    padding-bottom: 12px;
    text-transform: capitalize
}

.sidebar__widget-title::after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 0;
    width: 60px;
    height: 2px;
    background: var(--clr-common-heading)
}

.sidebar__widget select {
    width: 100%;
    height: 50px;
    padding: 0 15px;
    border: 1px solid #ddd
}

.sidebar__widget-content .search {
    position: relative
}

.sidebar__widget-content .search input {
    width: 100%;
    height: 50px;
    line-height: 50px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: none;
    outline: none;
    padding: 0px 40px 0px 15px;
    background: #f7f7f7;
    color: var(--clr-common-heading)
}

.sidebar__widget-content .search input::placeholder {
    color: #8f8f9a
}

.sidebar__widget-content .search button {
    position: absolute;
    top: 0;
    right: 0;
    height: 50px;
    width: 50px;
    line-height: 50px;
    color: var(--clr-common-heading);
    background: rgba(0, 0, 0, 0);
    border: none
}

.sidebar__widget.widget_recent_comments ul li a::after,
.widget_rss ul li a::after,
.sidebar__widget.widget_recent_entries ul li a::after {
    display: none
}

.sidebar__widget.widget_recent_comments ul li a,
.sidebar__widget.widget_recent_entries ul li a,
.widget_rss ul li a {
    padding-left: 0
}

.du-thumb img {
    border-radius: 10px
}

.sidebar-posts-bg-thumb {
    height: 90px;
    width: 80px;
    border-radius: 10px;
    background-size: cover;
    background-position: left
}

.du-text h6 {
    font-size: 18px;
    line-height: 1.3;
    margin-bottom: 5px;
    text-transform: capitalize
}

@media(max-width: 450px) {
    .du-text h6 {
        font-size: 16px
    }
}

.du-text h6 a:hover {
    color: var(--clr-theme-1)
}

.du-meta span {
    font-weight: 500
}

.du__comments ul li:hover .rc__comments-icon i {
    background: var(--clr-theme-1);
    border-color: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.du__comments-icon i {
    display: inline-block;
    font-size: 22px;
    width: 70px;
    height: 70px;
    line-height: 66px;
    text-align: center;
    color: #4636ff;
    border: 2px solid #dbdae0;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%
}

.du__comments-content h6 {
    font-size: 14px;
    color: #1b133f;
    margin-bottom: 7px;
    font-family: "Roboto", sans-serif;
    font-weight: 700
}

.du__comments-content p {
    margin-bottom: 2px
}

.tagcloud a {
    display: inline-block;
    height: 34px;
    line-height: 30px;
    text-align: center;
    padding: 0 19px;
    font-size: 14px;
    font-weight: 700;
    border: 2px solid #e8e7ec;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    margin-right: 8px;
    margin-bottom: 10px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.tagcloud a:hover {
    color: var(--clr-common-white);
    background: var(--clr-theme-1);
    border-color: var(--clr-theme-1)
}

.footer__widget .tagcloud a {
    background: var(--clr-theme-1)
}

.forum-search-bar .filter-by-search {
    display: grid;
    grid-template-columns: 220px auto
}

@media(max-width: 575px) {
    .forum-search-bar .filter-by-search {
        display: inherit
    }
}

.forum-search-bar .question-category-select {
    height: 60px;
    line-height: 60px;
    z-index: 1
}

@media(max-width: 575px) {
    .forum-search-bar .question-category-select {
        margin-bottom: 30px
    }
}

.forum-search-bar .filter-search-input-forum {
    position: relative
}

.forum-search-bar .filter-search-input-forum input {
    width: 100%;
    height: 60px;
    padding: 0 35px 0 15px;
    font-size: 14px;
    color: var(--clr-common-body);
    outline: none;
    border: 1px solid #edeef2;
    border-radius: 0 10px 10px 0;
    z-index: -1
}

@media(max-width: 575px) {
    .forum-search-bar .filter-search-input-forum input {
        border-radius: 10px
    }
}

.forum-search-bar .filter-search-input-forum button {
    position: absolute;
    top: 50%;
    right: 15px;
    content: "";
    background: #fff;
    transform: translateY(-50%);
    color: var(--clr-theme-1);
    font-size: 14px
}

@media(max-width: 575px) {
    .forum-search-bar .filter-search-input-forum button {
        top: 82%
    }
}

.forum-search-bar .nice-select:hover {
    border-color: #edeef2
}

.filter-by-search .nice-select:active,
.nice-select.open,
.nice-select:focus {
    border-color: #edeef2
}

.filter-by-search .nice-select::after {
    width: 8px;
    height: 8px;
    right: 18px;
    margin-top: -5px
}

.question-category-select {
    width: 223px;
    height: 50px;
    line-height: 50px;
    border: 1px solid var(--clr-common-fborder);
    border-radius: 10px 0 0 10px;
    color: var(--clr-common-heading);
    font-weight: 700
}

@media(max-width: 575px) {
    .question-category-select {
        border-radius: 10px
    }
}

.create-question-wrapper {
    padding-left: 30px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .create-question-wrapper {
        padding-left: 10px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .create-question-wrapper {
        padding-left: 0px
    }
}

.create-question-btn {
    height: 60px;
    background: var(--clr-theme-1);
    width: 100%;
    display: block;
    text-align: center;
    border: 1px solid var(--clr-theme-1);
    border-radius: 10px;
    line-height: 58px;
    color: var(--clr-common-white);
    font-weight: 700;
    position: relative;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.create-question-btn:focus {
    color: var(--clr-common-white)
}

.create-question-btn:before {
    position: absolute;
    content: "";
    font-family: "Font Awesome 5 Pro";
    width: 40px;
    height: 40px;
    left: 10px;
    top: 10px;
    background: #4756e3;
    border-radius: 5px;
    font-weight: 500;
    line-height: 40px
}

.create-question-btn:hover {
    background-color: var(--clr-common-hover);
    color: var(--clr-common-white);
    border-color: var(--clr-common-hover)
}

.q-single-wrapper {
    border: 1px solid var(--clr-common-fborder);
    border-radius: 10px
}

.q-single-content {
    padding: 40px 40px 15px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .q-single-content {
        padding: 30px 20px 15px
    }
}

@media(max-width: 575px) {
    .q-single-content {
        padding: 30px 15px 15px
    }
}

.q-single-content .profile-img img {
    width: 70px;
    border: 0
}

.author-name-time {
    display: flex;
    gap: 20px;
    align-items: center;
    margin-bottom: 20px
}

.name-post-time .artist-name {
    font-size: 20px;
    margin-bottom: 7px
}

.post-date-time {
    display: flex;
    gap: 20px
}

.post-date {
    font-size: 14px;
    color: var(--clr-common-body);
    line-height: 1
}

.post-time {
    font-size: 14px;
    color: var(--clr-common-body);
    line-height: 1
}

.item-border-before {
    position: relative
}

.item-border-before:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    background: #b9b9b9;
    left: -10px;
    top: -1px
}

.post-question {
    font-size: 24px;
    margin-bottom: 13px
}

@media(max-width: 575px) {
    .post-question {
        font-size: 22px
    }
}

.post-inner-tags .tag {
    color: var(--clr-theme-1);
    font-size: 15px;
    font-weight: 400;
    padding: 0;
    height: inherit;
    border: 0;
    background: none;
    line-height: 1;
    border-radius: 0
}

.tags-list.post-inner-tags {
    display: flex;
    gap: 15px;
    flex-wrap: wrap;
    margin-top: 25px;
    margin-bottom: 8px
}

.q-meta-type {
    font-size: 15px;
    color: var(--clr-common-heading);
    line-height: 1
}

.q-meta-likes {
    font-size: 15px;
    color: var(--clr-common-heading);
    line-height: 1
}

.q-meta-comments {
    font-size: 15px;
    color: var(--clr-common-heading);
    line-height: 1
}

.q-meta-shares {
    font-size: 15px;
    color: var(--clr-common-heading);
    line-height: 1
}

.q-meta-icon {
    font-size: 15px;
    color: var(--clr-common-heading);
    line-height: 1;
    margin-right: 5px
}

.q-meta-item {
    display: flex;
    gap: 5px;
    align-items: center
}

.q-meta-item a {
    display: flex;
    gap: 5px;
    align-items: center
}

.q-meta-item button {
    display: flex;
    gap: 5px;
    align-items: center
}

.q-meta-views {
    font-size: 15px;
    color: var(--clr-common-heading);
    line-height: 1
}

.profile-img img {
    border: 5px solid var(--clr-bg-white);
    border-radius: 50%;
    background: var(--clr-bg-white)
}

.q-meta-viewed-member {
    padding-left: 19px;
    line-height: 1;
    margin-right: 5px
}

.q-meta-viewed-member .profile-img {
    display: inline-block
}

.q-meta-viewed-member .profile-img img {
    width: 32px;
    border-width: 3px;
    margin-left: -19px;
    border: 3px solid var(--clr-common-white);
    border-radius: 50%
}

.q-meta-content {
    display: flex;
    flex-wrap: wrap
}

.q-meta-content .q-meta-item {
    border-top: 1px solid var(--clr-common-fborder);
    border-right: 1px solid var(--clr-common-fborder);
    height: 50px;
    flex-grow: 1;
    justify-content: center;
    padding: 0 10px
}

.q-meta-content .q-meta-item:last-child {
    border-right: 0
}

.comments-show .q-meta-content .q-meta-item {
    border-bottom: 1px solid var(--clr-common-fborder)
}

.q-write-answer {
    padding: 30px 40px;
    display: flex;
    gap: 20px;
    flex-wrap: wrap
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .q-write-answer {
        padding: 30px 20px
    }
}

@media(max-width: 575px) {
    .q-write-answer {
        padding: 30px 15px
    }
}

.q-write-answer .profile-img img {
    width: 60px;
    border: 0
}

.q-write-answer .answer-submit {
    flex-grow: 1
}

.answer-submit textarea {
    border: 1px solid var(--clr-common-fborder);
    border-radius: 10px;
    height: 150px;
    width: 100%;
    resize: none;
    padding: 15px 20px;
    margin-bottom: 20px
}

.answer-submit-btn {
    text-align: right
}

.q-answers {
    padding: 0 40px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .q-answers {
        padding: 0 20px
    }
}

@media(max-width: 575px) {
    .q-answers {
        padding: 0 15px
    }
}

.q-answers .q-single-answer:last-child {
    border-bottom: 0
}

.q-single-answer {
    border-bottom: 1px solid var(--clr-common-fborder);
    margin-bottom: 30px
}

.q-single-answer .profile-img img {
    width: 50px;
    border: 0
}

.q-single-answer .name-post-time .artist-name {
    font-size: 18px
}

.q-single-answer .post-date {
    font-size: 12px
}

.q-single-answer .post-time {
    font-size: 12px
}

.q-single-answer .author-name-time {
    gap: 10px
}

.ans-meta-content {
    display: flex;
    gap: 20px;
    margin-top: 20px;
    margin-bottom: 30px
}

.ans-meta-content .q-meta-item {
    padding-right: 20px;
    border-right: 1px solid #e3e3e3
}

.ans-meta-content .q-meta-item:last-child {
    padding-right: 0;
    border-right: 0
}

.ans-meta-content .q-meta-item button * {
    color: var(--clr-theme-1)
}

.ans-meta-content .q-meta-icon {
    font-size: 15px
}

.ans-meta-content .q-meta-likes {
    font-size: 14px
}

.ans-meta-content .q-meta-type {
    font-size: 14px
}

.answer-text {
    margin-bottom: 15px
}

.q-answers-btn {
    text-align: center;
    margin-top: 60px;
    margin-bottom: 30px
}

.grey-bg {
    background-color: var(--clr-bg-grey-bg)
}

.du-testimonial-item .du-testimonial-icon i {
    font-size: 50px;
    line-height: 1;
    display: inline-block;
    color: var(--clr-theme-1)
}

.du-testimonial-item p {
    font-size: 20px;
    line-height: 1.6;
    font-style: italic
}

@media(max-width: 575px) {
    .du-testimonial-item p {
        font-size: 18px
    }
}

.du-testimonial-item .du-testimonial-title {
    font-size: 20px;
    line-height: 1.12;
    font-weight: 700;
    margin-bottom: 3px
}

.du-testimonial-item span {
    font-size: 14px;
    display: block
}

.testimonial-nav {
    width: 350px;
    margin: 0 auto
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .testimonial-nav {
        width: 300px
    }
}

.testimonial-nav .swiper-slide {
    width: 90px;
    text-align: center
}

.testimonial-nav .swiper-slide .du-testimonial-img {
    height: 80px;
    width: 80px;
    object-fit: cover;
    border-radius: 50%;
    border: 5px solid var(--clr-common-white);
    display: inline-block
}

.testimonial-nav .swiper-slide .du-testimonial-img img {
    cursor: pointer;
    height: 100%;
    width: 100%;
    object-fit: cover;
    border-radius: 50%
}

.testimonial-nav .swiper-slide.swiper-slide-prev+.swiper-slide-active .du-testimonial-img {
    height: 104px;
    width: 104px;
    border: 7px solid var(--clr-common-white);
    transform: translateX(-12px)
}

.testimonial-nav .swiper-slide.swiper-slide-prev .du-testimonial-img,
.testimonial-nav .swiper-slide.swiper-slide-next .du-testimonial-img {
    margin-top: 13px
}

.du-testimonial2 p {
    font-size: 24px;
    line-height: 1.4;
    font-family: "Roboto", sans-serif
}

@media only screen and (min-width: 768px)and (max-width: 991px),
(max-width: 575px) {
    .du-testimonial2 p {
        font-size: 18px
    }
}

.du-testimonial2-icon i {
    font-size: 35px;
    color: var(--clr-theme-1)
}

.du-testimonial2__client-img {
    width: 60px;
    height: 60px;
    border-radius: 50%
}

.du-testimonial2__client-info-title {
    font-family: "Roboto", sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: var(--clr-common-heading);
    margin-bottom: 3px
}

.du-testimonial2__client-info span {
    font-family: "Roboto", sans-serif;
    font-size: 14px;
    color: var(--clr-common-body)
}

.swiper-pagination-team {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 20px
}

.swiper-pagination-team span {
    display: inline-block;
    margin-right: 15px;
    width: 10px;
    height: 10px
}

.swiper-pagination-team .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--clr-theme-1)
}

.price-tabs {
    background-color: rgba(0, 0, 0, 0)
}

.price__tab ul li {
    margin-right: 20px;
    margin-bottom: 9px
}

@media(max-width: 575px) {
    .price__tab ul li {
        margin-right: 10px
    }
}

.price__tab ul li:last-child {
    margin-right: 0px
}

.price__tab .nav-pills .nav-link {
    border-radius: .25rem;
    padding: 7px 30px;
    font-size: 15px;
    color: var(--clr-common-heading);
    border: 1px solid var(--clr-common-fcopy-border);
    background-color: var(--clr-bg-white);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.price__tab .nav-pills .nav-link:hover {
    background-color: var(--clr-theme-1);
    color: var(--clr-bg-white);
    border-color: var(--clr-theme-1)
}

.price__tab .nav-pills .nav-link.active {
    border: 1px solid rgba(0, 0, 0, 0)
}

.price__tab .nav-pills .nav-link.active,
.price__tab .nav-pills .show>.nav-link {
    color: #fff;
    background-color: var(--clr-theme-1)
}

.duprice {
    padding: 30px 35px;
    box-shadow: 0px 10px 80px rgba(8, 18, 71, .08);
    border-radius: 10px;
    background: var(--clr-common-white);
    box-shadow: 0px 10px 80px rgba(8, 18, 71, .08)
}

.duprice__top {
    text-align: center;
    border-bottom: 1px solid var(--clr-common-fcopy-border);
    padding-bottom: 24px
}

.duprice__top span {
    color: var(--clr-common-heading);
    margin-bottom: 6px;
    display: inline-block
}

.duprice__top .price-title {
    font-size: 36px;
    font-family: "Roboto", sans-serif;
    font-weight: 700
}

.duprice__bottom {
    margin-top: 30px
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .duprice__bottom ul {
        width: fit-content;
        margin-left: auto;
        margin-right: auto
    }
}

.duprice__bottom ul li {
    margin-bottom: 7px;
    font-size: 15px
}

.duprice__bottom ul li i {
    margin-right: 12px;
    color: var(--clr-theme-1)
}

.duprice .price-btn {
    padding: 0px 55px;
    height: 50px;
    line-height: 50px
}

.duprice-color {
    background: linear-gradient(#8067ff 0%, #3817e3 100%)
}

.duprice-color .duprice__top span {
    color: var(--clr-common-white)
}

.duprice-color .duprice__top .price-title {
    color: var(--clr-common-white)
}

.duprice-color .bottom-ulcolor li {
    color: var(--clr-common-white)
}

.duprice-color .bottom-ulcolor li i {
    color: var(--clr-common-white)
}

.duprice-color .price-color-white .price-btn {
    background-color: var(--clr-bg-white);
    color: var(--clr-common-heading);
    border: 1px solid var(--clr-common-white)
}

.duprice-color .price-color-white .price-btn:hover {
    background-color: var(--clr-theme-1);
    color: var(--clr-common-white);
    border: 1px solid var(--clr-common-white)
}

.price-shape1 {
    position: absolute;
    right: 0;
    animation: hero-thumb-sm-2-animation 4s linear infinite alternate
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .price-shape1 {
        display: none
    }
}

.price-shape2 {
    position: absolute;
    top: 67%;
    left: -28%;
    animation: hero-thumb-sm-2-animation 4s linear infinite alternate
}

@media only screen and (min-width: 1400px)and (max-width: 1600px),
only screen and (min-width: 1200px)and (max-width: 1399px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .price-shape2 {
        display: none
    }
}

.price-shape3 {
    position: absolute;
    right: 0;
    top: 42%;
    z-index: -1
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .price-shape3 {
        display: none
    }
}

.duprice-icon {
    position: absolute;
    right: 13px;
    top: 9px
}

.duprice-icon i {
    color: var(--clr-common-white)
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .video__left {
        margin-bottom: 30px
    }
}

.video__left-shape {
    position: absolute;
    left: 10%;
    top: 4%;
    z-index: -1
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .video__left-shape {
        left: 0%;
        top: -15%
    }
}

@media(max-width: 575px) {
    .video__left-shape {
        display: none
    }
}

.video__right {
    box-shadow: 0px 20px 80px rgba(8, 18, 71, .2);
    border-radius: 10px;
    margin-left: -30px
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .video__right {
        margin-left: 0px
    }
}

.video__right img {
    width: 100%
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .video__right {
        margin-top: 0px
    }
}

.video__right .play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 70px;
    height: 70px;
    background: linear-gradient(#5f40ff 0%, #905bfa 55.3%, #b870f6 100%);
    display: block;
    line-height: 70px;
    border-radius: 50%;
    text-align: center;
    transform: translate(-50%, -50%);
    animation: pulse 2s infinite;
    color: var(--clr-common-white);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.video__right .play-btn:hover {
    color: var(--clr-bg-information)
}

.video__left-item {
    padding: 20px 20px 18px 20px;
    max-width: 275px;
    box-shadow: 0px 20px 30px rgba(8, 18, 71, .08);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    border-radius: 5px
}

.video__left-item-title {
    font-size: 16px;
    color: var(--clr-common-heading);
    font-weight: 500;
    margin-bottom: 0px;
    line-height: 26px
}

.video__left-item2,
.video__left-item2,
.video__left-item3 {
    box-shadow: none
}

.video__left-item2:hover,
.video__left-item2:hover,
.video__left-item3:hover {
    box-shadow: 0px 20px 30px rgba(8, 18, 71, .08)
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .faq-area {
        padding-top: 100px
    }
}

.faq-content .accordion-body {
    padding: 20px 30px 20px
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .faq-content .accordion-body {
        padding: 20px 20px 20px
    }
}

@media(max-width: 575px) {
    .faq-content .accordion-body {
        padding: 20px 15px 20px
    }
}

.faq-content .accordion-body p {
    margin-bottom: 0px;
    font-size: 16px
}

.faq-content .accordion-item {
    background: #fff;
    box-shadow: 0px 0px 30px rgba(10, 31, 90, .08);
    border-radius: 10px;
    margin-bottom: 15px
}

.faq-content .accordion-item .accordion-header {
    padding: 0px 30px
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .faq-content .accordion-item .accordion-header {
        padding: 0px 20px
    }
}

@media(max-width: 575px) {
    .faq-content .accordion-item .accordion-header {
        padding: 0px 15px
    }
}

.faq-content .accordion-item .accordion-button {
    border-radius: 0;
    font-size: 18px;
    font-weight: 500;
    height: 70px;
    padding: 0px 0px;
    color: var(--clr-common-heading);
    text-align: left
}

@media(max-width: 575px) {
    .faq-content .accordion-item .accordion-button {
        font-size: 16px
    }
}

.faq-white .accordion-button {
    color: #222429;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0);
    font-size: 18px;
    font-weight: 500;
    color: #1a1c20
}

.faq-white .accordion-button:focus {
    z-index: 3;
    border-color: none;
    outline: 0;
    box-shadow: none
}

.accordion-button::after {
    font-family: "Font Awesome 5 pro";
    width: auto;
    height: auto;
    margin-left: auto;
    content: "";
    background: none !important;
    color: var(--clr-common-heading);
    font-size: 16px
}

.accordion-button:not(.collapsed)::after {
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: var(--clr-common-heading);
    font-size: 16px
}

.faq-content .accordion-collapse {
    border: none
}

.accordion-button:not(.collapsed) {
    border-bottom: 1px solid #f1f1f1
}

.course-tabs {
    margin-right: -30px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px),
only screen and (min-width: 768px)and (max-width: 991px) {
    .course-tabs {
        margin-right: 0px
    }
}

.home2-faq {
    padding: 30px 30px 30px;
    border-radius: 10px;
    background: var(--clr-common-white);
    margin-left: 70px;
    background: var(--clr-common-white)
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .home2-faq {
        padding: 20px 20px;
        margin-left: 40px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .home2-faq {
        padding: 30px 20px 30px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px),
only screen and (min-width: 768px)and (max-width: 991px) {
    .home2-faq {
        margin-left: 0px
    }
}

@media(max-width: 575px) {
    .home2-faq {
        padding: 15px
    }
}

.home2-faq .nav-pills .nav-link.active,
.home2-faq .nav-pills .show>.nav-link {
    color: var(--clr-common-white);
    background-color: var(--clr-theme-1);
    font-weight: 500
}

.home2-faq .nav-pills .nav-link {
    text-align: left;
    color: var(--clr-common-heading);
    font-size: 16px;
    font-weight: 400;
    height: 55px;
    position: relative;
    padding-left: 20px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .home2-faq .nav-pills .nav-link {
        padding-left: 15px
    }
}

.home2-faq .nav-pills .nav-link:hover:before {
    opacity: 1;
    visibility: visible
}

.home2-faq .nav-pills .nav-link::before {
    position: absolute;
    content: "";
    height: 30px;
    width: 3px;
    left: 0;
    background: var(--clr-theme-1);
    opacity: 0;
    visibility: hidden
}

.duteam-social a {
    color: var(--clr-common-f-social);
    font-size: 15px;
    height: 40px;
    width: 40px;
    text-align: center;
    line-height: 40px;
    background: var(--clr-common-white);
    display: inline-block;
    border-radius: 100%;
    margin: 0 2px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.duteam-social a:hover {
    background-color: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.duteam-img {
    overflow: hidden;
    border-radius: 10px
}

.duteam-img img {
    border-radius: 10px;
    width: 100%;
    transform: scale(1);
    transition: .4s ease-in-out;
    overflow: hidden
}

.duteam-img::before {
    position: absolute;
    background: linear-gradient(rgba(26, 28, 32, 0.02) 60%, #352874 100%);
    content: "";
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
    opacity: 0;
    visibility: hidden;
    border-radius: 10px
}

.duteam-thumb-info {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 30px 30px;
    padding-bottom: 10px;
    z-index: 2;
    opacity: 0;
    visibility: hidden
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .duteam-thumb-info {
        padding: 20px 30px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .duteam-thumb-info {
        padding: 0px
    }
}

.duteam:hover .duteam-thumb-info {
    opacity: 1;
    visibility: visible;
    padding-bottom: 30px
}

.duteam:hover .duteam-img::before {
    opacity: 1;
    visibility: visible
}

.duteam-info-author {
    margin-bottom: 3px;
    font-family: "Roboto", sans-serif;
    font-weight: 500;
    font-size: 20px;
    color: var(--clr-common-heading);
    margin-bottom: 0px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.duteam-info-author:hover {
    color: var(--clr-theme-1)
}

.duteam-info span {
    font-size: 14px;
    color: var(--clr-common-body)
}

.duteam:hover .duteam-img img {
    transform: scale(1.1)
}

.du_team-right {
    margin-bottom: 20px
}

.du_team-right-btn {
    background-color: rgba(0, 0, 0, 0);
    color: var(--clr-theme-1)
}

.du_team-right-btn:hover {
    background-color: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.duteam__sidebar-widget-single {
    padding: 20px 20px 10px 20px;
    background-color: #f6f7f8;
    border-radius: 10px
}

.team__sidebar--widget__info li {
    margin-bottom: 10px
}

.team__sidebar--widget__info-text h5 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 5px
}

.team__sidebar--widget__info-text h5 i {
    margin-right: 10px
}

.team__sidebar--widget__info-text span {
    padding-left: 26px
}

.team__sidebar--widget__info-text span a:hover {
    color: var(--clr-theme-1)
}

.team-details-wrapper {
    padding-left: 30px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .team-details-wrapper {
        padding-left: 10px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .team-details-wrapper {
        padding-left: 0
    }
}

.team-details-subtitle {
    font-size: 26px;
    text-transform: capitalize
}

.team-single-portfolio-img img {
    width: 100%
}

.team__qualification-single-title {
    font-size: 18px;
    text-transform: capitalize;
    color: var(--clr-theme-1)
}

.team__qualification-single span {
    margin-bottom: 3px;
    display: inline-block
}

.terms-bg {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 10px
}

.terms-shape {
    position: absolute;
    top: -89%;
    z-index: -1;
    left: 5%
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .terms-shape {
        top: -23%;
        width: 50%
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .terms-shape {
        display: none
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .terms__section {
        padding: 0px 50px
    }
}

@media(max-width: 575px) {
    .terms__section {
        padding: 0px 15px
    }
}

.terms__section-img img {
    margin-top: 25px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .terms__section-img img {
        width: 100%
    }
}

.terms-content {
    padding: 90px 0px 72px 0px
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .terms-content {
        padding: 50px 0px 60px 0px
    }
}

.cta-btn {
    text-align: right
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .cta-btn {
        text-align: inherit;
        margin-top: 30px
    }
}

.cta-title h2 {
    font-size: 30px;
    color: var(--clr-common-white);
    margin-bottom: 0px
}

@media(max-width: 450px) {
    .cta-title h2 {
        font-size: 24px
    }
}

.theme_btn_bg {
    border: 1px solid var(--clr-common-white)
}

.theme_btn_bg:hover {
    border: 1px solid var(--clr-common-white);
    color: var(--clr-theme-1);
    background-color: var(--clr-common-white)
}

.cta__shape1 {
    position: absolute;
    top: 0;
    left: 48.2%
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .cta__shape1 {
        left: 38%
    }
}

.cta__shape2 {
    position: absolute;
    bottom: 0;
    left: 10.5%
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .documy-pb {
        padding-bottom: 45px
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .sidebar-du-featured {
        margin-right: 0px
    }
}

.search-common {
    max-width: 630px
}

.search-common input {
    border-radius: 30px;
    padding: 0 50px 0 30px;
    box-shadow: 0px 5px 20px rgba(6, 21, 62, .1)
}

.du__docs {
    border-left: 1px solid var(--clr-common-fcopy-border)
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .du__docs {
        padding-left: 60px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .du__docs {
        padding-left: 40px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .du__docs {
        padding-left: 0px;
        border-left: none
    }
}

.du__docs-right-title h2 {
    font-size: 30px
}

@media(max-width: 450px) {
    .du__docs-right-title h2 {
        font-size: 24px
    }
}

.du__docs-tag {
    border-bottom: 1px solid var(--clr-common-fcopy-border)
}

.du__docs-tag span {
    font-size: 16px;
    color: var(--clr-common-body);
    margin-right: 5px;
    font-weight: 500
}

.du__docs-tag a {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    text-align: center;
    padding: 0 13px;
    font-size: 14px;
    margin-left: 8px;
    background-color: #f3f2f6;
    color: var(--clr-common-body);
    border-radius: 5px;
    margin-bottom: 5px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.du__docs-tag a:hover {
    background-color: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.du__docs-suppport-left p {
    font-size: 16px
}

.du__docs-suppport-left p i {
    margin-right: 10px
}

.du__docs-suppport-left p a {
    color: var(--clr-theme-1);
    margin-left: 10px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.du__docs-suppport-left p a:hover {
    color: var(--clr-common-hover)
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .du__docs-suppport-right {
        text-align: left !important
    }
}

.du__docs-suppport-right span {
    font-size: 16px;
    color: var(--clr-common-body)
}

.du__docs-suppport-right a {
    display: inline-block;
    height: 30px;
    line-height: 30px;
    text-align: center;
    padding: 0 22px;
    font-size: 14px;
    margin-left: 16px;
    background-color: var(--clr-common-green3);
    color: var(--clr-common-white);
    border-radius: 3px;
    margin-bottom: 5px
}

.du__docs-suppport-right a:last-child {
    background-color: var(--clr-common-red2)
}

.du__docs-bottom-box {
    padding: 30px 30px 22px 30px;
    border: 1px solid #f1f1f1;
    border-radius: 10px
}

.du__docs-bottom-box h3 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 20px
}

.du__docs-bottom-box-author-img img {
    width: 50px;
    height: 50px;
    border-radius: 50%
}

.du__docs-bottom-box-author-content h4 {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 0px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.du__docs-bottom-box-author-content h4:hover {
    color: var(--clr-theme-1)
}

.du__docs-bottom-box-author-content span {
    font-size: 14px
}

.du__docs-bottom-box-author-content ul li {
    margin-bottom: 5px
}

.du__docs-bottom-box-author-content ul li:last-child {
    margin-bottom: 0px
}

.du__docs-bottom-box-author-content ul li i {
    margin-right: 10px;
    vertical-align: middle
}

.du__docs-bottom-box-author-content ul li a {
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    color: var(--clr-common-body);
    text-decoration: none
}

.du__docs-bottom-box-author-content ul li a:hover {
    color: var(--clr-theme-1)
}

.box-color {
    background: var(--clr-common-box-bg);
    border: 1px solid #ebeffe
}

.du__sidebar-left {
    margin-right: -15px
}

.du__sidebar-left-topics h4 {
    font-size: 24px;
    font-family: "Roboto", sans-serif
}

@media(max-width: 450px) {
    .du__sidebar-left-topics h4 {
        font-size: 22px
    }
}

.sidebar-nav ul {
    list-style: none
}

.sidebar-nav .metismenu {
    display: flex;
    flex-direction: column
}

.sidebar-nav .metismenu>li {
    display: flex;
    flex-direction: column;
    position: relative
}

.sidebar-nav .metismenu .mm-active>a {
    background: rgba(0, 0, 0, 0);
    border-radius: 3px;
    color: var(--clr-theme-1)
}

.sidebar-nav .metismenu .mm-active>a:hover {
    color: var(--clr-theme-1)
}

.sidebar-nav .metismenu .mm-active>a:focus {
    color: var(--clr-theme-1)
}

.sidebar-nav .metismenu li+li:first-child {
    margin-top: 5px
}

.sidebar-nav .metismenu a {
    position: relative;
    display: block;
    padding: 11px 0px;
    font-size: 16px;
    font-weight: 500;
    color: var(--clr-common-heading);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    text-decoration: none
}

.sidebar-nav .metismenu a:hover {
    color: var(--clr-theme-1) !important
}

.sidebar-nav .metismenu a img {
    margin-right: 15px
}

.sidebar-nav .metismenu ul li {
    margin-bottom: 2px;
    padding-left: 5px;
    padding-right: 10px
}

.sidebar-nav .metismenu ul li:first-child {
    padding-top: 15px
}

.sidebar-nav .metismenu ul li:last-child {
    padding-bottom: 5px
}

.sidebar-nav .metismenu ul a {
    padding: 0px;
    font-size: 15px;
    color: var(--clr-common-body);
    font-weight: 400;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    display: flex
}

.sidebar-nav .metismenu ul a:hover {
    color: var(--clr-theme-1)
}

.sidebar-nav .metismenu ul a:hover i {
    color: var(--clr-theme-1);
    vertical-align: middle
}

.sidebar-nav .metismenu ul a i {
    margin-right: 13px;
    vertical-align: middle;
    color: var(--clr-common-heading)
}

.sidebar-nav .metismenu ul ul a {
    padding: 10px 15px 10px 45px
}

.sidebar-nav .metismenu a:hover,
.sidebar-nav .metismenu a:focus,
.sidebar-nav .metismenu a:active,
.sidebar-nav .metismenu .mm-active>a {
    color: #0c63e4;
    text-decoration: none
}

.component-wigdets-items ul li {
    min-width: 300px;
    margin-right: 30px;
    margin-bottom: 30px;
    display: inline-block
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .component-wigdets-items ul li {
        margin-right: 0px;
        min-width: 290px
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .component-wigdets-items ul li {
        margin-right: 5px
    }
}

.component-wigdets-items ul li a {
    height: 80px;
    display: inline-block;
    line-height: 80px;
    padding: 0px 30px;
    background: var(--clr-bg-grey2-bg);
    color: var(--clr-common-body);
    font-size: 16px;
    width: 100%;
    border-radius: 5px;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.component-wigdets-items ul li a:hover {
    background-color: var(--clr-theme-1);
    color: var(--clr-common-white);
    box-shadow: 0px 30px 50px rgba(6, 21, 62, .1)
}

.component-wigdets-items ul li a:hover i {
    color: var(--clr-common-white)
}

.component-wigdets-items ul li a i {
    margin-right: 10px;
    vertical-align: middle;
    color: var(--clr-theme-1);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.list__widgets-title h3 {
    font-size: 20px;
    font-weight: 500;
    color: var(--clr-common-heading)
}

.list__widgets-items ul {
    margin-left: 45px
}

.list__widgets-items ul li {
    font-size: 16px;
    margin-bottom: 8px
}

.list__widgets .order-list li {
    list-style-type: decimal
}

.list__widgets .unorder-list li {
    list-style-type: disc
}

.list__widgets .roman-list li {
    list-style-type: upper-roman
}

.list__widgets .check-list li i {
    margin-left: -24px;
    margin-right: 9px;
    color: var(--clr-theme-1)
}

.message__widgets {
    padding: 30px 40px 20px;
    border: 1.5px solid #e8e8e8;
    border-radius: 10px;
    margin-bottom: 30px
}

@media(max-width: 450px) {
    .message__widgets {
        padding: 30px 19px 20px
    }
}

.message__widgets-title h4 {
    margin-bottom: 16px;
    font-size: 18px;
    font-weight: 500
}

.message__widgets-icons i {
    font-size: 25px;
    margin-right: 15px
}

.message__widgets-2 {
    border: 1.5px solid #25b55f
}

.message__widgets-2 i {
    color: #25b55f
}

.message__widgets-nborder {
    border: none !important
}

.message__widgets-3 {
    border: 1.5px solid #f8b61b
}

.message__widgets-3 i {
    color: #f8b61b
}

.message__widgets-4 {
    border: 1.5px solid #db1a1a
}

.message__widgets-4 i {
    color: #db1a1a
}

.message__widgets-5 {
    border: 1.5px solid #1a47db
}

.message__widgets-5 i {
    color: #1a47db
}

.message__widgets-alert-icon {
    position: absolute;
    right: 18px;
    top: 19px
}

.message__widgets-alert-icon i {
    font-size: 20px
}

.button__widets-title h4 {
    font-size: 20px;
    font-weight: 500
}

.button__widets-group {
    display: flex;
    flex-wrap: wrap;
    gap: 30px
}

.primary-btn {
    font-size: 16px;
    color: var(--clr-common-white);
    height: 55px;
    line-height: 55px;
    text-align: center;
    width: 160px;
    border-radius: 3px;
    display: inline-block;
    background: var(--clr-common-blue);
    font-weight: 500;
    border: none;
    outline: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.primary-btn:hover {
    color: var(--clr-theme-1);
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-theme-1)
}

.primary-btn-radius {
    font-size: 16px;
    color: var(--clr-common-white);
    height: 55px;
    line-height: 55px;
    text-align: center;
    width: 160px;
    border-radius: 30px;
    display: inline-block;
    background: var(--clr-common-blue);
    font-weight: 500;
    border: none;
    outline: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0)
}

.primary-btn-radius:hover {
    color: var(--clr-theme-1);
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-theme-1)
}

.primary-btn-transparent {
    font-size: 16px;
    color: var(--clr-theme-1);
    height: 55px;
    line-height: 55px;
    text-align: center;
    width: 160px;
    border-radius: 30px;
    display: inline-block;
    background: rgba(0, 0, 0, 0);
    font-weight: 500;
    border: 1px solid var(--clr-theme-1);
    outline: none;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.primary-btn-transparent:hover {
    background-color: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.primary-btn-text {
    font-size: 16px;
    color: var(--clr-common-heading);
    height: 55px;
    line-height: 55px;
    text-align: center;
    border-radius: 30px;
    display: inline-block;
    background: none;
    font-weight: 500;
    border: none;
    outline: none;
    cursor: pointer;
    position: relative;
    overflow: hidden
}

.primary-btn-text:hover {
    color: var(--clr-theme-1)
}

.primary-btn-border-btm:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 75px;
    bottom: 15px;
    background-color: var(--clr-theme-1)
}

.secondary-btn-border-btm:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 75px;
    bottom: 15px;
    background-color: var(--clr-bg-secondary)
}

.secondary-btn-border-btm:hover {
    color: var(--clr-common-heading)
}

.success-btn-border-btm:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 75px;
    bottom: 15px;
    background-color: var(--clr-bg-success)
}

.success-btn-border-btm:hover {
    color: var(--clr-bg-success)
}

.warning-btn-border-btm:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 75px;
    bottom: 15px;
    background-color: var(--clr-bg-warning)
}

.warning-btn-border-btm:hover {
    color: var(--clr-bg-warning)
}

.danger-btn-border-btm:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 75px;
    bottom: 15px;
    background-color: var(--clr-bg-danger)
}

.danger-btn-border-btm:hover {
    color: var(--clr-bg-danger)
}

.information-btn-border-btm:before {
    position: absolute;
    content: "";
    height: 1px;
    width: 75px;
    bottom: 15px;
    background-color: var(--clr-bg-information)
}

.information-btn-border-btm:hover {
    color: var(--clr-bg-information)
}

.secondary-btn {
    background-color: var(--clr-bg-secondary)
}

.secondary-btn:hover {
    background-color: rgba(0, 0, 0, 0);
    color: var(--clr-common-heading);
    border: 1px solid var(--clr-common-heading)
}

.secondary-btn-radius {
    background-color: var(--clr-bg-secondary);
    border-radius: 30px
}

.secondary-btn-radius:hover {
    background-color: rgba(0, 0, 0, 0);
    color: var(--clr-common-heading);
    border: 1px solid var(--clr-common-heading)
}

.secondary-btn-transparent {
    border: 1px solid var(--clr-common-heading);
    color: var(--clr-common-heading)
}

.secondary-btn-transparent:hover {
    background-color: var(--clr-common-heading);
    color: var(--clr-common-white);
    border: 1px solid var(--clr-common-heading)
}

.success-btn {
    background-color: var(--clr-bg-success)
}

.success-btn:hover {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-bg-success);
    color: var(--clr-bg-success)
}

.success-btn-radius {
    background-color: var(--clr-bg-success);
    border-radius: 30px
}

.success-btn-radius:hover {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-bg-success);
    color: var(--clr-bg-success)
}

.success-btn-transparent {
    border: 1px solid var(--clr-bg-success);
    color: var(--clr-bg-success)
}

.success-btn-transparent:hover {
    background-color: var(--clr-bg-success);
    border: 1px solid var(--clr-bg-success);
    color: var(--clr-common-white)
}

.warning-btn {
    background-color: var(--clr-bg-warning)
}

.warning-btn:hover {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-bg-warning);
    color: var(--clr-bg-warning)
}

.warning-btn-radius {
    background-color: var(--clr-bg-warning);
    border-radius: 30px
}

.warning-btn-radius:hover {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-bg-warning);
    color: var(--clr-bg-warning)
}

.warning-btn-transparent {
    border: 1px solid var(--clr-bg-warning);
    color: var(--clr-bg-warning)
}

.warning-btn-transparent:hover {
    background-color: var(--clr-bg-warning);
    border: 1px solid var(--clr-bg-warning);
    color: var(--clr-common-white)
}

.danger-btn {
    background-color: var(--clr-bg-danger)
}

.danger-btn:hover {
    background-color: rgba(0, 0, 0, 0);
    color: var(--clr-bg-danger);
    border: 1px solid var(--clr-bg-danger)
}

.danger-btn-radius {
    background-color: var(--clr-bg-danger);
    border-radius: 30px
}

.danger-btn-radius:hover {
    background-color: rgba(0, 0, 0, 0);
    color: var(--clr-bg-danger);
    border: 1px solid var(--clr-bg-danger)
}

.danger-btn-transparent {
    border: 1px solid var(--clr-bg-danger);
    color: var(--clr-bg-danger)
}

.danger-btn-transparent:hover {
    background-color: var(--clr-bg-danger);
    color: var(--clr-common-white);
    border: 1px solid var(--clr-bg-danger)
}

.information-btn {
    background-color: var(--clr-bg-information)
}

.information-btn:hover {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-bg-information);
    color: var(--clr-bg-information)
}

.information-btn-radius {
    background-color: var(--clr-bg-information);
    border-radius: 30px
}

.information-btn-radius:hover {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-bg-information);
    color: var(--clr-bg-information)
}

.information-btn-transparent {
    border: 1px solid var(--clr-bg-information);
    color: var(--clr-bg-information)
}

.information-btn-transparent:hover {
    background-color: var(--clr-bg-information);
    border: 1px solid var(--clr-bg-information);
    color: var(--clr-common-white)
}

.tabs__widgets-title h4 {
    font-size: 20px;
    font-weight: 500
}

.tabs__widets-default-menu-link {
    border-bottom: 1px solid var(--clr-common-fcopy-border);
    width: 511px
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .tabs__widets-default-menu-link {
        width: auto;
        border-bottom: none
    }
}

.tabs__widets-default-menu-link .nav-link {
    border-top: none;
    border-right: none;
    border-left: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0);
    font-size: 15px;
    font-weight: 500;
    color: var(--clr-common-heading);
    padding: 8px 23px
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .tabs__widets-default-menu-link .nav-link {
        padding: 8px 15px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .tabs__widets-default-menu-link .nav-link {
        padding: 8px 14px
    }
}

@media(max-width: 575px) {
    .default-tabs {
        flex-direction: column;
        align-items: start !important
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .default-tabs-img {
        margin-right: 30px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .default-tabs-img {
        margin-right: 0px;
        margin-bottom: 20px
    }
}

.tabs__widets-default-menu-link .nav-link.active {
    border-bottom: 1px solid var(--clr-theme-1);
    color: var(--clr-common-heading)
}

.tabs__widets-box-menu-link .nav-link {
    font-size: 15px;
    font-weight: 500;
    color: var(--clr-common-heading);
    padding: 7px 23px;
    background-color: #f4f4f9;
    border-left: 1px solid #e4e4f5;
    border-radius: 0px;
    z-index: 1;
    margin-bottom: 0px
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .tabs__widets-box-menu-link .nav-link {
        padding: 7px 16px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px) {
    .tabs__widets-box-menu-link .nav-link {
        padding: 7px 20px
    }
}

@media(max-width: 575px) {
    .tabs__widets-box-menu-link .nav-link {
        padding: 7px 19px;
        margin-bottom: 5px
    }
}

.tabs__widets-box-menu-link .nav-link.active {
    border-color: var(--clr-theme-1) var(--clr-theme-1) var(--clr-common-white);
    position: relative;
    border-radius: 0px 0px 0px 0px
}

@media(max-width: 575px) {
    .tabs__widets-box-menu-link .nav-link.active {
        border: 1px solid var(--clr-theme-1)
    }
}

.tabs__widets-box-menu-link .nav-link:first-child {
    border-radius: 5px 0px 0px 0px
}

@media(max-width: 575px) {
    .tabs__widets-box-menu-link .nav-link:first-child {
        border-radius: 0px
    }
}

.tabs__widets-box-menu-link .nav-link:last-child {
    border-radius: 0px 5px 0px 0px
}

@media(max-width: 575px) {
    .tabs__widets-box-menu-link .nav-link:last-child {
        border-radius: 0px
    }
}

.tabs__widets-box-menu-link {
    border-bottom: none
}

.box-tabs-content {
    padding: 40px 30px 22px 30px;
    border: 1px solid var(--clr-theme-1);
    margin-top: -1px;
    z-index: -1;
    border-radius: 0px 5px 5px 5px
}

@media(max-width: 450px) {
    .box-tabs-content {
        padding: 30px 20px 12px;
        border-radius: 5px
    }
}

.tabs__widgets-standard-menu .nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    color: var(--clr-common-white);
    background-color: var(--clr-theme-1)
}

.tabs__widgets-standard-menu .nav-link {
    padding: 8px 24px;
    font-size: 15px;
    font-weight: 500;
    color: var(--clr-common-heading);
    margin-right: 15px
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .tabs__widgets-standard-menu .nav-link {
        padding: 8px 15px;
        margin-right: 5px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .tabs__widgets-standard-menu .nav-link {
        margin-bottom: 5px
    }
}

.tabs__widgets-processing-menu .nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    color: var(--clr-theme-1);
    background-color: rgba(0, 0, 0, 0)
}

.tabs__widgets-processing-menu .nav-link {
    padding: 0px 0px;
    font-size: 15px;
    font-weight: 500;
    color: var(--clr-common-heading);
    margin-right: 40px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .tabs__widgets-processing-menu .nav-link {
        margin-right: 27px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .tabs__widgets-processing-menu .nav-link {
        margin-right: 6px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .tabs__widgets-processing-menu .nav-link {
        margin-right: 6px
    }
}

@media(max-width: 450px) {
    .tabs__widgets-processing-menu .nav-link {
        margin-bottom: 5px
    }
}

.tabs__widgets-processing-menu .nav-link span {
    width: 22px;
    height: 22px;
    border-radius: 11px;
    background: #f1f1f1;
    display: inline-block;
    line-height: 22px;
    font-size: 12px;
    font-weight: 500;
    margin-right: 5px
}

.tabs__widgets-processing-menu .nav-link.active span {
    background-color: var(--clr-theme-1);
    color: var(--clr-common-white)
}

.processing-author {
    border-radius: 5px;
    background: #f9f9fb;
    padding: 40px 40px 40px
}

@media(max-width: 450px) {
    .processing-author {
        padding: 20px 20px 20px
    }
}

.processing-author ul li {
    font-size: 16px;
    font-style: italic;
    font-weight: 400;
    list-style: none;
    color: var(--clr-common-body)
}

.processing-author ul li span {
    color: var(--clr-theme-1)
}

.notice__highlight-items-first {
    padding: 40px 80px 25px 80px;
    border-left: 8px solid var(--clr-common-green1)
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .notice__highlight-items-first {
        padding: 40px 50px 25px 50px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .notice__highlight-items-first {
        padding: 20px 30px 5px 30px
    }
}

@media(max-width: 450px) {
    .notice__highlight-items-first {
        padding: 20px 20px 5px 20px
    }
}

.notice__highlight-items-first p {
    font-size: 16px
}

.notice__highlight-items-first p span {
    background-color: var(--clr-common-green1);
    padding: 0px 7px;
    color: var(--clr-common-white);
    border-radius: 4px;
    height: 25px;
    line-height: 25px;
    display: inline-block;
    text-align: center
}

.notice__highlight-items-second {
    padding: 20px 80px 5px 80px;
    border-left: 8px solid #ff8a24
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .notice__highlight-items-second {
        padding: 40px 50px 25px 50px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .notice__highlight-items-second {
        padding: 20px 30px 5px 30px
    }
}

@media(max-width: 450px) {
    .notice__highlight-items-second {
        padding: 20px 20px 5px 20px
    }
}

.notice__highlight-items-second span {
    font-weight: 500
}

.notice__highlight-items-third {
    padding: 40px 80px 25px 80px;
    border-left: 8px solid #e11c1c
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .notice__highlight-items-third {
        padding: 40px 50px 25px 50px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .notice__highlight-items-third {
        padding: 20px 30px 5px 30px
    }
}

@media(max-width: 450px) {
    .notice__highlight-items-third {
        padding: 20px 20px 5px 20px
    }
}

.notice__highlight-items-third span {
    font-weight: 500
}

.notice__highlight-items-highlight {
    padding: 25px 40px 11px 45px;
    border: 1px solid #eee
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .notice__highlight-items-highlight {
        padding: 25px 30px 11px 30px
    }
}

@media(max-width: 450px) {
    .notice__highlight-items-highlight {
        padding: 25px 20px 11px 20px
    }
}

.notice__highlight-items-highlight-title h4 {
    font-size: 18px;
    font-weight: 500
}

.notice__highlight-items-highlight span {
    background-color: #fe0;
    color: var(--clr-common-heading)
}

.notice__highlight-items-highlight2 span {
    background-color: var(--clr-common-green2);
    color: var(--clr-common-heading)
}

.notice__highlight-items-highlight3 span {
    background-color: var(--clr-common-red1);
    color: var(--clr-common-heading)
}

.notice__explanation {
    padding: 20px;
    border-radius: 10px;
    border: 1px solid #8bd6fc
}

.notice__explanation-items {
    padding: 35px 35px 20px 40px;
    background: linear-gradient(#9addff 0%, #ecf9ff 100%);
    border-radius: 5px
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .notice__explanation-items {
        padding: 35px 30px 20px 30px
    }
}

@media(max-width: 450px) {
    .notice__explanation-items {
        padding: 35px 20px 20px 20px
    }
}

.notice__explanation-items p {
    color: var(--clr-common-heading)
}

.notice__explanation-title {
    position: absolute;
    top: -8px;
    background: var(--clr-common-white);
    padding: 0px 8px
}

.notice__explanation-title h4 {
    font-size: 12px;
    text-transform: uppercase;
    margin-bottom: 0px
}

.notice__explanation2 {
    border: 1px solid #97ffcb
}

.notice__explanation2-title h4 {
    color: #15cf72
}

.notice__explanation-items2 {
    background: linear-gradient(#cbf8d4 0%, #ebfff9 100%)
}

.notice__explanation3 {
    border: 1px solid #ffe1e1
}

.notice__explanation3-title h4 {
    color: #cf1515
}

.notice__explanation-items3 {
    background: linear-gradient(#ffe1e1 0%, #fff8eb 100%)
}

.according-tabs-title {
    font-size: 20px;
    color: var(--clr-common-heading)
}

.faq__content-widgets .accordion-item:first-of-type .accordion-button {
    border-radius: 0;
    font-size: 18px;
    font-weight: 500;
    border-radius: 5px 5px 0px 0px;
    height: 55px
}

.faq__content-widgets .accordion-button::after {
    font-family: "Font Awesome 5 pro";
    width: auto;
    height: auto;
    margin-left: auto;
    content: "";
    background: #666;
    color: #666;
    font-size: 17px
}

.faq__content-widgets .accordion-button:not(.collapsed)::after {
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: #666;
    background-color: #666
}

.faq__content-widgets .accordion-button:not(.collapsed) {
    background: #f5f7f9;
    border-radius: 5px 5px 0px 0px
}

.faq__content-widgets .accordion-button {
    background: #f5f7f9;
    border: none;
    font-size: 18px;
    font-weight: 500;
    color: var(--clr-common-heading);
    border-radius: 5px;
    height: 55px;
    padding: 0px 30px
}

@media(max-width: 450px) {
    .faq__content-widgets .accordion-button {
        font-size: 16px;
        text-align: left;
        padding: 0px 15px
    }
}

.faq__content-widgets .accordion-item {
    margin-bottom: 10px
}

.faq__content-widgets .accordion-button:focus {
    z-index: 3;
    border-color: none;
    outline: 0;
    box-shadow: none
}

.faq__content-widgets .accordion-collapse {
    border: none
}

.faq__content-widgets .accordion-body {
    background: var(--clr-common-white);
    padding: 30px 30px 28px 30px;
    font-weight: 400;
    font-size: 16px;
    border-radius: 0px 0px 5px 5px;
    border: 1px solid #f1f1f1
}

.faq__content-widgets2 .accordion-button:not(.collapsed)::after {
    content: "";
    font-family: "Font Awesome 5 Pro";
    color: var(--clr-common-heading);
    background-color: var(--clr-common-heading);
    font-size: 15px
}

.faq__content-widgets2 .accordion-button::after {
    font-family: "Font Awesome 5 pro";
    width: auto;
    height: auto;
    margin-left: auto;
    content: "";
    background: var(--clr-common-heading);
    color: var(--clr-common-heading);
    font-size: 15px
}

.quotation_style-one-title {
    font-size: 20px;
    font-weight: 500
}

.quotation_style-one blockquote p {
    font-size: 28px;
    font-style: italic;
    font-weight: 300;
    line-height: 38px;
    color: var(--clr-common-heading)
}

@media(max-width: 575px) {
    .quotation_style-one blockquote p {
        font-size: 20px
    }
}

.quotation_style-one blockquote i {
    font-size: 30px;
    color: #e8e8e8;
    margin-bottom: 25px
}

.quotation_style-one blockquote h4 {
    font-size: 18px;
    line-height: 38px;
    font-weight: 500
}

.quotation_style-two-items {
    background: #f3f8ff;
    padding: 38px 40px 20px 40px;
    border-left: 5px solid var(--clr-theme-1);
    position: relative;
    z-index: 1
}

.quotation_style-two-items blockquote p {
    font-size: 22px;
    font-style: italic;
    line-height: 32px;
    color: var(--clr-common-heading)
}

@media(max-width: 575px) {
    .quotation_style-two-items blockquote p {
        font-size: 20px
    }
}

.quotation_style-two-items blockquote p cite {
    font-size: 18px;
    display: block;
    color: var(--clr-common-heading);
    font-weight: 500;
    font-style: normal
}

.quotation_style-two-items blockquote p cite::before {
    content: "";
    display: inline-block;
    background: var(--clr-theme-1);
    height: 2px;
    width: 63px;
    top: -4px;
    margin-right: 10px;
    position: relative
}

.quotation_style-two-items-icon {
    z-index: -1;
    position: absolute;
    left: 30px;
    top: 30px
}

.quotation_style-two-items-icon i {
    font-size: 82px;
    color: #e5eafb
}

.quotation_style-three-items {
    padding: 93px 70px 70px 40px;
    background: #ffd500;
    width: 418px;
    margin: 0 auto;
    z-index: 1
}

@media(max-width: 575px) {
    .quotation_style-three-items {
        padding: 30px 30px 30px 9px;
        width: 250px
    }
}

.quotation_style-three-items p {
    font-size: 32px;
    color: var(--clr-common-heading);
    line-height: 38px;
    font-weight: 700;
    margin-bottom: 40px
}

@media(max-width: 575px) {
    .quotation_style-three-items p {
        font-size: 20px;
        line-height: 30px
    }
}

.quotation_style-three-items p cite {
    font-size: 18px;
    display: block;
    color: var(--clr-common-heading);
    font-weight: 500;
    font-style: normal;
    text-align: right
}

@media(max-width: 575px) {
    .quotation_style-three-items p cite {
        font-size: 16px
    }
}

.quotation_style-three-items p cite::before {
    content: "";
    display: inline-block;
    background: var(--clr-common-heading);
    height: 3px;
    width: 22px;
    top: -4px;
    margin-right: 10px;
    position: relative
}

.quotation_style-three-items-border {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0);
    border: 5px solid var(--clr-common-heading);
    position: absolute;
    top: -30px;
    left: -30px;
    z-index: -1
}

@media(max-width: 575px) {
    .quotation_style-three-items-border {
        top: -25px;
        left: -15px
    }
}

.quotation_style-three-items-border::after {
    content: "";
    position: absolute;
    font-family: "Font Awesome 5 Pro";
    font-size: 50px;
    color: var(--clr-common-heading);
    left: 33px;
    background: var(--clr-common-white);
    top: -26px;
    padding: 0px 11px;
    font-weight: 900
}

.quotation_style-three-items-border::before {
    content: "";
    position: absolute;
    font-family: "Font Awesome 5 Pro";
    font-size: 50px;
    right: 35px;
    background: #ffd500;
    bottom: -20px;
    padding: 0px 11px;
    color: var(--clr-common-heading);
    font-weight: 900
}

.tooltip__content p a {
    position: relative
}

.tooltip__content p a:before {
    position: absolute;
    content: "";
    width: 100%;
    height: 4px;
    background-color: #9494f7;
    bottom: 2px;
    z-index: -1
}

.direction_steps {
    display: inline-flex;
    align-items: center;
    text-align: center
}

.direction_steps .direction_step {
    margin-right: 23px;
    font-weight: 500
}

.direction_steps .direction_step:last-child {
    margin-right: 0px
}

@media(max-width: 575px) {
    .direction_steps {
        display: block
    }
}

.direction_step+.direction_step {
    position: relative
}

.direction_step+.direction_step:before {
    content: "";
    font-family: "Font Awesome 5 Pro";
    position: absolute;
    left: -18px;
    font-weight: 400;
    font-size: 13px;
    top: 1px
}

@media(max-width: 575px) {
    .direction_step+.direction_step:before {
        top: -3px
    }
}

.direction_steps-bg {
    border-radius: 3px;
    background: #9494f7;
    padding: 0px 9px;
    color: var(--clr-common-white)
}

.direction_steps-button .direction_step {
    height: 22px;
    border-radius: 3px;
    background: #9494f7;
    line-height: 22px;
    padding: 0px 9px;
    color: var(--clr-common-white)
}

.direction_steps-button .direction_step:before {
    color: var(--clr-common-body)
}

.documentation__table {
    overflow-x: auto
}

.documentation__table .table-control th {
    padding: 9px 20px 9px 30px;
    font-size: 18px;
    font-weight: 500;
    color: var(--clr-common-heading)
}

.documentation__table .table-control th:first-child {
    width: 6%;
    text-align: center;
    padding-left: 21px
}

.documentation__table .table-control td {
    padding: 9px 20px 9px 30px;
    font-size: 16px;
    color: var(--clr-common-body)
}

.documentation__table .table-control td:first-child {
    text-align: center;
    padding-left: 21px
}

.documentation__table .table-control th:nth-child(2) {
    padding: 9px 20px 9px 30px;
    font-size: 18px;
    font-weight: 500;
    color: var(--clr-common-heading);
    width: 34%;
    min-width: 100px;
    width: 33%
}

.documentation__table .table-control th:nth-child(3) {
    width: 22%;
    min-width: 100px
}

.documentation__table .table-control th:nth-child(4) {
    width: 20%;
    min-width: 100px
}

.documentation__table .table-control th:nth-child(5) {
    width: 22%;
    min-width: 100px
}

.documentation__table-bg .table>:not(caption)>*>* {
    background-color: var(--bs-table-bg);
    background-image: linear-gradient(var(--bs-table-accent-bg), var(--bs-table-accent-bg));
    border-bottom-width: 0px
}

.documentation__table-bg .table-striped>tbody>tr:nth-child(1) {
    background: var(--clr-common-body)
}

.documentation__table-bg .table-striped>tbody>tr:nth-child(1) th {
    color: var(--clr-common-white)
}

.documentation__table-bg .table-control th:nth-child(2) {
    color: var(--clr-common-white)
}

.documentation__table-modern {
    overflow-x: auto
}

.documentation__table-modern .table-control th {
    line-height: 53px;
    background-color: var(--clr-common-tb-color);
    color: var(--clr-common-white);
    font-size: 18px;
    font-weight: 500
}

.documentation__table-modern .table-control th:nth-child(1) {
    min-width: 100px;
    width: 33%;
    padding-left: 30px
}

.documentation__table-modern .table-control th:nth-child(2) {
    min-width: 100px;
    width: 25%;
    padding-left: 80px
}

.documentation__table-modern .table-control th:nth-child(3) {
    min-width: 100px;
    width: 17%
}

.documentation__table-modern .table-control th:nth-child(4) {
    min-width: 100px
}

.documentation__table-modern .table-control td {
    height: 55px;
    line-height: 55px;
    color: var(--clr-common-body)
}

.documentation__table-modern .table-control td:nth-child(1) {
    width: 33%;
    height: 55px;
    line-height: 55px;
    background-color: var(--clr-common-td-color);
    color: var(--clr-common-white);
    padding-left: 30px
}

.documentation__table-modern .table-control td:nth-child(2) {
    min-width: 100px;
    width: 34%;
    padding-left: 80px
}

.documentation__table-modern .table-control td:nth-child(3) {
    min-width: 100px;
    width: 17%
}

.documentation__table-modern .table>:not(caption)>*>* {
    background-image: linear-gradient(var(--bs-table-accent-bg), var(--bs-table-accent-bg));
    border-bottom-width: 0px
}

.default-table-bg {
    overflow-x: auto
}

.default-table-bg .table.table-bordered {
    border: 1px solid #272727 !important
}

.default-table-bg .table-control th {
    color: var(--clr-common-white) !important
}

.default-table-bg .table>:not(caption)>*>* {
    color: var(--clr-common-table-default);
    background-color: #000
}

.default-table-bg>.table>.table-bordered {
    border: 1px solid #272727
}

.default-table-striped .table-striped>tbody>tr:nth-of-type(2n+1) {
    --bs-table-accent-bg: var(--clr-common-table-black)
}

.default-table-striped .table>:not(caption)>*>* {
    border-bottom-width: 0px !important
}

.mordern-dark-style {
    overflow-x: auto
}

.mordern-dark-style .table-control {
    background: var(--clr-common-table-black)
}

.mordern-dark-style .table-control td {
    color: var(--clr-common-white)
}

.du-contact-form-field input,
.du-contact-form-field textarea {
    color: var(--clr-common-body);
    font-size: 16px;
    display: block;
    width: 100%;
    height: 55px;
    background: var(--clr-common-white);
    font-weight: 400;
    outline: none;
    padding: 0px 20px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid var(--clr-common-fcopy-border)
}

.du-contact-form-field textarea {
    height: 180px;
    padding: 20px;
    resize: none
}

.du-contact-form-field input::-moz-placeholder,
.du-contact-form-field input::placeholder,
.du-contact-form-field select::placeholder,
.du-contact-form-field textarea::-moz-placeholder,
.du-contact-form-field textarea::placeholder {
    color: var(--clr-common-body);
    font-weight: 400;
    font-size: 16px;
    opacity: 1;
    color: var(--clr-common-body)
}

.du-contact-form-field-bg input,
.du-contact-form-field-bg textarea {
    background-color: var(--clr-bg-grey2-bg);
    border: 1px solid var(--clr-bg-grey2-bg);
    resize: none
}

.form-border-heading-field input:focus {
    border: 1px solid var(--clr-theme-1)
}

.form-border-heading-field textarea:focus {
    border: 1px solid var(--clr-theme-1)
}

.form__label {
    position: absolute;
    left: 14px;
    top: 14px;
    cursor: text;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    padding: 0px 5px
}

.form-border-heading-field input:focus~.form__label {
    top: -11px;
    background-color: var(--clr-common-white);
    padding: 0px 5px
}

.form-border-heading-field textarea:focus~.form__label {
    top: -11px;
    background-color: var(--clr-common-white);
    padding: 0px 5px
}

.full_width_audio {
    z-index: 10;
    border: 1px solid #e8effc;
    color: inherit;
    min-height: 120px;
    max-height: inherit;
    display: flex;
    gap: 25px;
    border-radius: 25px;
    flex-direction: row;
    padding: 22px 25px 24px 25px
}

@media(max-width: 450px) {
    .full_width_audio {
        height: auto;
        width: auto;
        padding: 17px 20px 19px 20px;
        flex-direction: column
    }
}

.full_width_audio_img {
    justify-content: center
}

.full_width_audio .player-content {
    flex-grow: 1;
    display: flex;
    flex-direction: column
}

.full_width_audio .player-info {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 20px
}

.full_width_audio .player-info h4 {
    font-size: 18px;
    margin-bottom: 0px
}

.full_width_audio .player-info a {
    color: var(--clr-theme-1);
    font-size: 15px
}

.full_width_audio audio {
    flex-grow: 1;
    height: 40px
}

@media(max-width: 575px) {
    .full_width_audio audio {
        width: 100%
    }
}

.full_width_audio audio::-webkit-media-controls-play-button {
    background-color: #b1d4e0;
    border-radius: 50%
}

.full_width_audio audio::-webkit-media-controls-play-button:hover {
    background-color: rgba(177, 212, 224, .7)
}

.full_width_audio audio::-webkit-media-controls-panel {
    background: #e9e8f2
}

.song-name {
    font-size: 18px;
    font-weight: 600
}

.audio_player {
    display: flex
}

.box__audio-player {
    width: 330px;
    display: inherit;
    min-height: inherit;
    max-height: inherit;
    max-width: 330px;
    background-color: #f8f9fe;
    padding: 30px 30px 30px
}

@media(max-width: 450px) {
    .box__audio-player {
        width: 100%;
        padding: 20px 20px 20px
    }
}

.box__audio-player_img {
    margin-right: 0px !important
}

@media(max-width: 575px) {
    .box__audio-player_img img {
        width: 100%
    }
}

.full_width_audio audio {
    flex-grow: 1;
    height: 40px;
    width: 100%;
    border-radius: 5px
}

.progress-basic .progress-bar {
    background-color: var(--clr-theme-1);
    transition: width .6s ease;
    height: 5px
}

.progress-basic-1 {
    width: 40%
}

.progress-basic-2 {
    width: 50%
}

.progress-basic-3 {
    width: 63%
}

.progress-basic-4 {
    width: 76%
}

.progress-basic-5 {
    width: 88%
}

.progress-basic .progress {
    background-color: #eeedf3;
    border-radius: 0px;
    height: 5px
}

.progress-labels .progress {
    background-color: #eeedf3;
    border-radius: 0px;
    height: 25px
}

.progress-labels .progress-bar {
    background-color: var(--clr-theme-1);
    transition: width .6s ease;
    height: 25px;
    font-size: 15px
}

.skill-warp__single-skill {
    margin-right: 28px;
    display: inline-block;
    margin-bottom: 10px
}

.skill-warp__single-skill .skill-box {
    text-align: center;
    position: relative
}

.skill-warp__single-skill .skill-box h2 {
    position: absolute;
    top: 50px;
    right: 40px;
    color: var(--clr-common-heading);
    font-size: 24px;
    display: inline-block;
    font-weight: 500
}

.skill-warp__single-skill .skill-box h2 span {
    font-size: 24px;
    margin-left: -5px
}

.vimeo__video iframe {
    width: 100%;
    height: 456px
}

@media only screen and (min-width: 1200px)and (max-width: 1399px) {
    .vimeo__video iframe {
        height: 430px
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .vimeo__video iframe {
        height: 345px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .vimeo__video iframe {
        height: 273px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px) {
    .vimeo__video iframe {
        height: 296px
    }
}

@media(max-width: 575px) {
    .vimeo__video iframe {
        height: 173px
    }
}

.youtube__video iframe {
    width: 100%;
    height: 456px
}

@media only screen and (min-width: 1200px)and (max-width: 1399px) {
    .youtube__video iframe {
        height: 430px
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .youtube__video iframe {
        height: 345px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .youtube__video iframe {
        height: 250px
    }
}

@media(max-width: 450px) {
    .youtube__video iframe {
        height: 180px
    }
}

.list__widgets-subtile .bg-border {
    color: var(--clr-common-code-block);
    background-color: var(--clr-common-fcopy-border);
    padding: 5px 8px;
    border-radius: 2px
}

.list__widgets-subtile span {
    color: var(--clr-common-code-block)
}

.block-common {
    padding: 15px 50px 0px 50px;
    border: 1px solid var(--clr-common-fcopy-border);
    background-color: #fbfbfb
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .block-common {
        padding: 15px 30px 0px 30px
    }
}

@media(max-width: 450px) {
    .block-common {
        padding: 15px 20px 0px 20px
    }
}

.block-common pre code {
    font-size: 15px;
    color: var(--clr-common-heading)
}

.layout__structure-img img {
    width: 100%
}

.layout__structure-responsive {
    text-align: center
}

.layout__structure-responsive img {
    width: inherit
}

@media(max-width: 575px) {
    .layout__structure-responsive {
        text-align: left
    }
}

.layout__structure-featurs ul li {
    list-style: disc;
    font-size: 16px;
    margin-bottom: 6px;
    margin-left: 13px
}

.layout__structure-featurs ul li span:nth-child(1) {
    font-weight: 500
}

.dashboard__info-img img {
    width: 100%
}

.dashboard__info-img-csscode img {
    width: inherit
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .dashboard__info-img-csscode img {
        width: 100%
    }
}

.dashboard__info ul li {
    position: relative;
    padding-left: 36px;
    color: var(--clr-common-body);
    counter-increment: li;
    font-size: 16px;
    margin-left: 0px;
    margin-bottom: 13px
}

.dashboard__info ul li:last-child {
    margin-bottom: 0
}

.dashboard__info ul li:before {
    content: counter(li);
    width: 26px;
    height: 26px;
    background: var(--clr-common-du-color);
    color: var(--clr-common-white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 100%;
    font-size: 14px;
    position: absolute;
    left: 0px;
    top: 0px
}

.normal-card-single {
    padding: 15px 20px;
    border: 1px solid var(--clr-common-fcopy-border);
    border-radius: 5px
}

.normal-card-single ul li span {
    font-weight: 700;
    font-size: 18px;
    color: var(--clr-common-heading);
    position: relative;
    top: 2px;
    margin-left: 10px
}

.cardwith__text-single {
    padding: 40px 30px 35px 30px;
    border-radius: 5px;
    background: var(--clr-common-white);
    box-shadow: 0px 20px 60px rgba(6, 21, 59, .08)
}

.cardwith__text-single-title h2 {
    font-size: 20px;
    font-weight: 700;
    color: var(--clr-common-heading)
}

.cardwith__text-single-subtitle p {
    font-size: 15px
}

.cardwith__text-single-btn a {
    font-size: 15px;
    color: var(--clr-theme-1);
    font-weight: 500
}

.cardwith__text-single-btn a:hover {
    color: var(--clr-common-hover)
}

.cardwith__text-single-btn a i {
    margin-left: 7px;
    vertical-align: middle
}

.heading__item .heading__item-single {
    padding: 70px 70px 45px 70px;
    border-radius: 10px;
    border: 1px solid #e9e9e9
}

.heading__item .heading__item-single h4 {
    font-size: 30px;
    font-weight: 500
}

@media(max-width: 450px) {
    .heading__item .heading__item-single {
        padding: 50px 30px 40px 30px
    }
}

.heading__item .heading__item-single span {
    font-size: 30px;
    color: var(--clr-common-heading);
    font-weight: 500;
    margin-bottom: 10px;
    display: inline-block
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .heading__item .heading__item-single span {
        font-size: 24px
    }
}

@media(max-width: 450px) {
    .heading__item .heading__item-single span {
        font-size: 20px
    }
}

.heading__item .heading__item-single h2 {
    font-size: 60px;
    color: var(--clr-common-heading);
    font-weight: 700;
    color: var(--clr-theme-1)
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .heading__item .heading__item-single h2 {
        font-size: 40px
    }
}

@media(max-width: 450px) {
    .heading__item .heading__item-single h2 {
        font-size: 30px
    }
}

.heading__item .heading__item-single h2 span {
    font-size: 60px;
    color: var(--clr-common-heading);
    font-weight: 700;
    color: var(--clr-theme-1)
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .heading__item .heading__item-single h2 span {
        font-size: 40px
    }
}

.heading__item .typed-color h2 {
    color: var(--clr-common-typed-text);
    margin-bottom: 0px
}

.heading__item .typed-color h2 span {
    font-size: 60px;
    color: var(--clr-common-typed-text);
    font-weight: 700
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .heading__item .typed-color h2 span {
        font-size: 40px;
        line-height: 52px
    }
}

@media(max-width: 450px) {
    .heading__item .typed-color h2 span {
        font-size: 30px;
        line-height: 42px
    }
}

.heading__item .shrik-color h2 {
    color: var(--clr-common-shrik-text)
}

.heading__item .shrik-color h2 span {
    color: var(--clr-common-shrik-text)
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .heading__item .shrik-color h2 span {
        font-size: 40px
    }
}

@media(max-width: 450px) {
    .heading__item .shrik-color h2 span {
        font-size: 30px
    }
}

@keyframes jello {
    11.1% {
        transform: none
    }

    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }

    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg)
    }

    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }

    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }

    66.6% {
        transform: skewX(-0.78125deg) skewY(-0.78125deg)
    }

    77.7% {
        transform: skewX(0.390625deg) skewY(0.390625deg)
    }

    88.8% {
        transform: skewX(-0.1953125deg) skewY(-0.1953125deg)
    }

    100% {
        transform: none
    }
}

.jello {
    animation: jello 2s infinite;
    transform-origin: center
}

.heading__item-single-slide {
    padding: 70px 70px 55px 70px;
    border-radius: 10px;
    border: 1px solid #e9e9e9
}

@media(max-width: 450px) {
    .heading__item-single-slide {
        padding: 50px 30px 40px 30px
    }
}

.heading__item-single-slide p {
    font-size: 30px;
    color: var(--clr-common-heading);
    font-weight: 500;
    margin-bottom: 10px
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .heading__item-single-slide p {
        font-size: 24px
    }
}

@media(max-width: 450px) {
    .heading__item-single-slide p {
        font-size: 20px
    }
}

.message {
    font-size: 60px;
    --height: 70px;
    min-height: var(--height);
    line-height: var(--height);
    color: var(--clr-common-slide-text)
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .message {
        font-size: 40px;
        --height: 60px
    }
}

@media(max-width: 450px) {
    .message {
        font-size: 30px;
        --height: 40px
    }
}

.slides {
    display: inline-flex;
    height: var(--height);
    overflow: hidden;
    padding: 0 5px;
    margin: 0 -5px
}

.slide1 {
    display: flex;
    flex-flow: column nowrap;
    transform: translateY(100%);
    animation: slide-up 9s ease infinite
}

@keyframes slide-up {

    10%,
    33% {
        transform: translateY(0%)
    }

    43%,
    66% {
        transform: translateY(-100%)
    }

    76%,
    100% {
        transform: translateY(-200%)
    }
}

.newsletter-area {
    max-width: 530px;
    padding: 80px 75px 80px 75px;
    background-color: var(--clr-common-newsletter-form)
}

@media(max-width: 575px) {
    .newsletter-area {
        padding: 30px 20px 30px 20px
    }
}

.newsletter__item {
    padding: 45px 35px 40px 35px;
    box-shadow: 0px 20px 50px rgba(7, 16, 61, .08)
}

@media(max-width: 575px) {
    .newsletter__item {
        padding: 30px 15px 25px 15px
    }
}

.newsletter__item-content h2 {
    font-weight: 700;
    font-size: 28px;
    line-height: 38px;
    text-transform: uppercase;
    margin-bottom: 10px
}

.newsletter__item-content p {
    margin-bottom: 20px
}

.newsletter__item-form-field input {
    color: var(--clr-common-body);
    font-size: 16px;
    display: block;
    width: 100%;
    height: 55px;
    background: var(--clr-common-newsletter-input);
    font-weight: 400;
    outline: none;
    padding: 0px 20px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid var(--clr-common-fcopy-border)
}

.newsletter__item-form-field button {
    width: 100%;
    height: 55px;
    border-radius: 5px;
    background: var(--clr-common-newsletter-btn);
    display: inline-block;
    font-family: Roboto;
    font-weight: 500;
    font-size: 14px;
    line-height: 38px;
    color: var(--clr-common-white);
    text-transform: uppercase;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s;
    border: 1px solid rgba(0, 0, 0, 0)
}

.newsletter__item-form-field button:hover {
    background-color: rgba(0, 0, 0, 0);
    border: 1px solid var(--clr-theme-1);
    color: var(--clr-theme-1)
}

.newsletter__item-form-field button i {
    margin-left: 5px;
    vertical-align: middle;
    font-size: 17px
}

.newsletter__item-offer ul li {
    display: inline-block;
    margin-right: 30px;
    font-size: 14px;
    font-size: 14px
}

@media(max-width: 575px) {
    .newsletter__item-offer ul li {
        display: block;
        margin-right: 0px
    }
}

.newsletter__item-offer ul li:last-child {
    margin-right: 0px
}

.newsletter__item-offer ul li i {
    margin-right: 10px
}

.newsletter__item-offer ul li i:last-child {
    margin-right: 0px
}

.newsletter-area-2 {
    background-color: var(--clr-common-newsletter-form);
    padding: 30px
}

@media(max-width: 575px) {
    .newsletter-area-2 {
        padding: 20px
    }
}

.newsletter__example2 {
    display: flex;
    align-items: center;
    background-color: var(--clr-common-white);
    padding: 55px 50px 40px 45px
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .newsletter__example2 {
        padding: 40px 30px 25px 25px
    }
}

@media(max-width: 575px) {
    .newsletter__example2 {
        padding: 40px 30px 25px 25px;
        text-align: center
    }
}

@media(max-width: 575px) {
    .newsletter__example2 {
        display: inherit
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .newsletter__example2-left {
        margin-right: 40px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .newsletter__example2-left {
        margin-right: 30px
    }
}

@media(max-width: 575px) {
    .newsletter__example2-left {
        margin-right: 0px;
        margin-bottom: 30px
    }
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .newsletter__example2-left img {
        width: 180px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .newsletter__example2-left img {
        width: 100px
    }
}

.newsletter__item2 {
    box-shadow: none;
    padding: 0px
}

.newsletter__item2 button {
    background-color: var(--clr-theme-1);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .graph-area img {
        width: 100%
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .pie-area img {
        width: 100%
    }
}

@media(max-width: 575px) {
    .pie-area img {
        width: 100%
    }
}

.default-countdown-items {
    display: flex
}

.default-countdown {
    margin-right: 80px;
    text-align: center;
    position: relative
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .default-countdown {
        margin-right: 70px
    }
}

@media(max-width: 575px) {
    .default-countdown {
        margin-right: 30px
    }
}

.default-countdown h2 {
    font-size: 60px;
    font-weight: 700;
    color: var(--clr-common-heading);
    margin-bottom: 5px;
    line-height: 70px
}

@media(max-width: 575px) {
    .default-countdown h2 {
        font-size: 40px;
        line-height: 50px
    }
}

.default-countdown span {
    display: block;
    font-size: 18px
}

.default-countdown:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 62px;
    background-color: #e9e9e9;
    left: 110px;
    top: 20px
}

@media(max-width: 575px) {
    .default-countdown:before {
        left: 60px;
        top: 10px
    }
}

.default-countdown:last-child:before {
    display: none
}

.border-countdown {
    overflow: hidden;
    margin-right: 40px;
    text-align: center;
    padding: 25px 40px 22px 40px;
    border-radius: 15px;
    border: 2px solid var(--clr-theme-1)
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .border-countdown {
        margin-right: 20px;
        padding: 25px 25px 22px 25px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px) {
    .border-countdown {
        margin-right: 20px;
        padding: 25px 30px 22px 30px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px) {
    .border-countdown {
        margin-right: 20px;
        padding: 25px 25px 22px 25px
    }
}

@media(max-width: 575px) {
    .border-countdown {
        margin-right: 5px;
        padding: 20px 15px 18px 15px
    }
}

.border-countdown h2 {
    font-size: 60px;
    font-weight: 700;
    color: var(--clr-common-heading);
    margin-bottom: 5px;
    line-height: 70px
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .border-countdown h2 {
        font-size: 40px;
        line-height: 50px
    }
}

@media(max-width: 575px) {
    .border-countdown h2 {
        font-size: 24px;
        line-height: 34px
    }
}

.border-countdown span {
    display: block;
    font-size: 18px
}

@media(max-width: 575px) {
    .border-countdown span {
        font-size: 16px
    }
}

.multicolor-countdown {
    margin-right: 40px;
    text-align: center;
    width: 150px;
    height: 150px;
    padding-top: 20px;
    border-radius: 50%
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .multicolor-countdown {
        margin-right: 20px;
        width: 130px;
        height: 130px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .multicolor-countdown {
        margin-right: 20px;
        width: 100px;
        height: 100px
    }
}

@media(max-width: 575px) {
    .multicolor-countdown {
        margin-right: 5px;
        width: 70px;
        height: 70px;
        padding-top: 10px
    }
}

.multicolor-countdown h2 {
    font-size: 60px;
    font-weight: 700;
    color: var(--clr-common-white);
    margin-bottom: 5px;
    line-height: 70px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .multicolor-countdown h2 {
        font-size: 40px;
        line-height: 50px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .multicolor-countdown h2 {
        font-size: 30px;
        line-height: 40px
    }
}

@media(max-width: 575px) {
    .multicolor-countdown h2 {
        font-size: 20px;
        line-height: 30px;
        margin-bottom: 0px
    }
}

.multicolor-countdown span {
    display: block;
    font-size: 18px;
    color: var(--clr-common-white)
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .multicolor-countdown span {
        font-size: 16px
    }
}

@media(max-width: 575px) {
    .multicolor-countdown span {
        font-size: 14px
    }
}

.multicolor-countdown:nth-child(1) {
    background-color: #ee7f35
}

.multicolor-countdown:nth-child(2) {
    background-color: #4dc873
}

.multicolor-countdown:nth-child(3) {
    background-color: #4e92ff
}

.multicolor-countdown:nth-child(4) {
    background-color: #d851ab
}

.keyboard__table {
    overflow-x: auto
}

.keyboard__table .table-control th {
    padding: 15px 30px 15px 30px;
    font-size: 18px;
    font-weight: 500
}

.keyboard__table .table-control th:last-child {
    padding-right: 60px
}

@media(max-width: 575px) {
    .keyboard__table .table-control th:last-child {
        padding-right: 0px
    }
}

@media(max-width: 450px) {
    .keyboard__table .table-control th {
        padding: 10px 15px 10px 15px;
        font-size: 16px
    }
}

.keyboard__table .table-control td {
    padding: 17px 30px 17px 30px;
    font-size: 16px;
    color: var(--clr-common-body)
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .keyboard__table .table-control td {
        white-space: nowrap
    }
}

@media(max-width: 450px) {
    .keyboard__table .table-control td {
        padding: 10px 15px 10px 15px
    }
}

.keyboard__table .table-control td:last-child {
    padding-right: 60px
}

@media(max-width: 575px) {
    .keyboard__table .table-control td:last-child {
        padding-right: 10px
    }
}

.keyboard__table .table-control td:nth-child(2) {
    padding-left: 50px
}

@media(max-width: 575px) {
    .keyboard__table .table-control td:nth-child(2) {
        padding-left: 0px
    }
}

.keyboard__table .table-control th:nth-child(1) {
    font-size: 18px;
    font-weight: 500;
    color: var(--clr-common-heading);
    width: 38%;
    min-width: 100px
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .keyboard__table .table-control th:nth-child(1) {
        width: 38%
    }
}

.keyboard__table .table-control th:nth-child(2) {
    font-size: 18px;
    font-weight: 500;
    color: var(--clr-common-heading);
    width: 36%;
    min-width: 100px;
    padding-left: 50px
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px) {
    .keyboard__table .table-control th:nth-child(2) {
        width: 25%
    }
}

@media(max-width: 575px) {
    .keyboard__table .table-control th:nth-child(2) {
        width: 25%;
        padding-left: 0px
    }
}

.keyboard__table .table-control th:nth-child(3) {
    width: 30%;
    min-width: 100px
}

@media only screen and (min-width: 992px)and (max-width: 1199px),
only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .keyboard__table .table-control th:nth-child(3) {
        width: 37%
    }
}

.keyboard__table .table>:not(caption)>*>* {
    background-color: var(--bs-table-bg);
    background-image: linear-gradient(var(--bs-table-accent-bg), var(--bs-table-accent-bg));
    border: none
}

.keyboard__table .table-striped>tbody>tr:nth-child(1) {
    background: var(--clr-theme-1)
}

.keyboard__table .table-striped>tbody>tr:nth-child(1) th {
    color: var(--clr-common-white)
}

.web-browser .table-striped>tbody>tr:nth-child(1) {
    background: #e7e9eb
}

.web-browser .table-striped>tbody>tr:nth-child(1) th {
    color: var(--clr-common-heading)
}

.web-browser .table-striped>tbody>tr:nth-child(1) td {
    background: #e7e9eb
}

.web-browser {
    overflow-x: auto
}

.web-browser .table-striped>tbody>tr:nth-of-type(2n + 1) {
    background: #e7e9eb !important
}

.web-browser .table.table-striped {
    border-bottom: 1px solid #e3e5e6
}

.du_changelog_info .version_info {
    position: relative;
    height: 100%;
    left: -20px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .du_changelog_info .version_info {
        left: -7px
    }
}

.du_changelog_info .line {
    height: 100%;
    width: 1px;
    background: #e2e5ee;
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    z-index: 1
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .du_changelog_info .line {
        display: none
    }
}

.du_changelog_info .du_changelog_date {
    display: flex;
    text-align: right;
    padding-top: 53px;
    justify-content: end
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .du_changelog_info .du_changelog_date {
        justify-content: start;
        text-align: left;
        padding-top: 0px
    }
}

.du_changelog_date-3 {
    margin-top: 20px
}

.du_changelog_date-4 {
    padding-top: 30px !important
}

.c_version-4 {
    position: absolute;
    top: 41%
}

.c_version {
    position: absolute;
    width: 26px;
    height: 26px;
    background-color: var(--clr-common-white);
    z-index: 2;
    border-radius: 50%;
    left: 6px;
    top: 27%;
    border: 1px solid #e9e9e9;
    text-align: center;
    line-height: 22px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .c_version {
        left: -2px
    }
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .c_version {
        display: none
    }
}

.c_version span {
    width: 8px;
    height: 8px;
    background-color: var(--clr-common-heading);
    z-index: 3;
    display: inline-block;
    border-radius: 50%;
    text-align: center
}

.c_date h6 {
    margin-bottom: 15px;
    font-size: 20px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .c_date h6 {
        font-size: 16px
    }
}

.c_date span {
    height: 30px;
    line-height: 30px;
    display: inline-block;
    padding: 0px 20px;
    background: var(--clr-common-heading);
    color: var(--clr-common-white);
    border-radius: 3px
}

.du_changelog_info .c_version {
    margin: 0 auto
}

.du_changelog_content {
    margin-left: -15px
}

@media only screen and (min-width: 768px)and (max-width: 991px),
only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .du_changelog_content {
        margin-left: 0px
    }
}

.du_changelog_content p {
    display: flex;
    margin-bottom: 10px;
    font-size: 16px
}

.du_changelog_content span {
    font-weight: 400;
    font-size: 12px;
    color: var(--clr-common-white);
    padding: 0 10px;
    text-transform: uppercase;
    min-width: 90px;
    display: inline-block;
    text-align: center;
    line-height: 26px;
    border-radius: 3px;
    margin-right: 20px;
    height: 25px;
    flex: 0;
    letter-spacing: .8px
}

.du_changelog_content span.added {
    background: var(--clr-common-green4)
}

.du_changelog_content span.fixed,
.deleted {
    background-color: var(--clr-common-red3)
}

.du_changelog_content span.updated {
    background-color: var(--clr-common-blue2)
}

.contact-title h2 {
    font-size: 30px
}

@media(max-width: 575px) {
    .contact-title h2 {
        font-size: 24px
    }
}

.contact-from-input input {
    color: var(--clr-common-body);
    font-size: 16px;
    display: block;
    width: 100%;
    height: 55px;
    background: var(--clr-common-white);
    font-weight: 400;
    outline: none;
    padding: 0px 20px;
    width: 100%;
    border-radius: 5px;
    border: 1px solid var(--clr-common-fcopy-border)
}

.contact-from-input textarea {
    height: 170px;
    width: 100%;
    background: var(--clr-common-white);
    border: none;
    padding: 15px 20px;
    border-radius: 5px;
    resize: none;
    outline: 0;
    border: 1px solid var(--clr-common-fcopy-border)
}

.support-icon {
    min-width: 40px
}

.support-icon i {
    font-size: 20px;
    color: var(--clr-theme-1);
    vertical-align: middle
}

.support-item {
    display: flex;
    align-items: start;
    margin-bottom: 30px
}

.support-item:last-child {
    margin-bottom: 0
}

.support-contact {
    padding: 40px 30px 25px 30px;
    background: #f8f8f9;
    border-radius: 5px;
    border: 1px solid #f8f8f9
}

@media(max-width: 575px) {
    .support-contact {
        padding: 25px 20px 25px 20px
    }
}

.support-tittle h4 {
    margin-bottom: 30px
}

.support-info-phone span {
    font-size: 18px;
    font-weight: 500;
    color: var(--clr-common-heading);
    margin-bottom: 10px;
    display: block
}

.support-info-phone p {
    margin-bottom: 3px
}

.support-info-phone p a {
    color: var(--clr-common-heading);
    font-weight: 500;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.support-info-phone p a:hover {
    color: var(--clr-theme-1)
}

.support-info-email span {
    font-size: 18px;
    font-weight: 500;
    color: var(--clr-common-heading);
    margin-bottom: 10px;
    display: block
}

.support-info-email a {
    margin-bottom: 2px;
    display: block;
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.support-info-email a:hover {
    color: var(--clr-theme-1)
}

.support-info-location span {
    font-size: 18px;
    font-weight: 700;
    color: var(--clr-common-heading);
    margin-bottom: 10px;
    display: block
}

.contact-select .nice-select {
    height: 55px;
    width: 100%;
    background: #f8f8f9;
    border: none;
    padding: 15px 20px;
    line-height: 27px;
    background: var(--clr-common-white);
    border: 1px solid var(--clr-common-fcopy-border)
}

.contact-select .nice-select span {
    font-size: 16px;
    color: var(--clr-common-)
}

.contact-select .nice-select:after {
    width: 7px;
    height: 7px;
    right: 20px
}

.contact-select .nice-select .list {
    width: 100%;
    background-color: #f8f8f9
}

.contact-map iframe {
    height: 380px;
    width: 100%;
    border-radius: 4px
}

.footer-shape1 {
    position: absolute;
    right: 0px;
    bottom: 0px;
    z-index: -1
}

@media(max-width: 575px) {
    .footer-shape1 {
        display: none
    }
}

.footer__widget-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--clr-common-heading)
}

.footer__widget p {
    font-size: 16px;
    margin-bottom: 30px
}

.footer__widget-social li {
    margin-right: 8px;
    display: inline-block
}

.footer__widget-social li a {
    color: var(--clr-common-f-social);
    font-size: 15px;
    height: 40px;
    width: 40px;
    text-align: center;
    line-height: 40px;
    display: inline-block;
    border-radius: 100%;
    border: 1px solid var(--clr-common-f-border);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.footer__widget-social li a:hover {
    background-color: var(--clr-common-blue);
    color: var(--clr-common-white);
    border: 1px solid var(--clr-common-blue)
}

.footer__widget-links li {
    margin-bottom: 7px
}

.footer__widget-links li:last-child {
    margin-bottom: 0
}

.footer__widget-links li a {
    font-size: 15px;
    color: var(--clr-common-text);
    -webkit-transition: all .3s ease-out 0s;
    -moz-transition: all .3s ease-out 0s;
    -ms-transition: all .3s ease-out 0s;
    -o-transition: all .3s ease-out 0s;
    transition: all .3s ease-out 0s
}

.footer__widget-links li a:hover {
    color: var(--clr-theme-1)
}

.footer__widget-subscribe .field:after {
    position: absolute;
    content: "";
    top: 16px;
    right: 25px;
    font-size: 15px;
    color: var(--clr-common-blue);
    font-family: "Font Awesome 5 Pro";
    cursor: pointer
}

.footer__widget-subscribe .field input {
    height: 60px;
    width: 100%;
    border: 1px solid rgba(0, 0, 0, 0);
    font-size: 14px;
    font-weight: normal;
    border-radius: 5px;
    color: var(--clr-common-body);
    display: block;
    padding: 0px 50px 0px 20px;
    outline: none;
    background: #f6f8f9;
    margin-bottom: 30px;
    transition: all .3s ease-out 0s
}

.free__trial {
    line-height: 1
}

.free__trial-text {
    font-size: 14px;
    color: var(--clr-common-heading);
    position: relative
}

.free__trial img {
    position: absolute;
    top: -16px;
    right: -63px
}

@media only screen and (min-width: 992px)and (max-width: 1199px) {
    .footer-2 {
        margin-left: 78px
    }
}

@media only screen and (min-width: 576px)and (max-width: 767px),
(max-width: 575px) {
    .footer-2 {
        margin-left: 0px
    }
}

.footer__widget-subscribe .field2 input {
    background-color: var(--clr-common-white)
}

.footer-copyright {
    border-top: 1px solid var(--clr-common-fcopy-border)
}

.footer-copyright p {
    color: var(--clr-common-text);
    font-size: 16px;
    margin-bottom: 0px
}

img {
    display: inline-block !important
}

.fivetab ul,
.fivetab li {
    margin: 0;
    padding: 0;
    list-style: none
}

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

.fivetab-tit {
    font-size: 16px
}

.fivetab-tit .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    text-align: center;
    border: solid 2px #fff;
    box-sizing: border-box;
    background: #eee
}

.fivetab-tit .swiper-slide.active-nav {
    color: #fff;
    background: red
}

.fivetab-box {
    padding-bottom: 5px;
    font-size: 16px
}

.fivetab-box .banner-bar {
    text-align: center
}

.fivetab-box .banner-bar img {
    width: 100%;
    height: auto
}

.fivetab .down-bar {
    line-height: 1.75;
    margin: 0 auto;
    padding: 0px 0 0;
    box-sizing: border-box
}

.fivetab .down-bar-boxt {
    display: flex;
    align-items: center;
    margin-bottom: 5px
}

.fivetab .down-bar-boxt-1 {
    width: 48%;
    min-width: 130px;
    text-align: center
}

.fivetab .down-bar-boxt-1 img {
    width: 100px;
    height: auto;
    border-radius: 18px;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .1)
}

.fivetab .down-bar-boxt-2 {
    width: 70%;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap
}

.fivetab .down-bar-boxt-2l {
    width: 50%
}

.fivetab .down-bar-boxt-2r {
    width: 50%
}

@media screen and (max-width: 500px) {
    .fivetab .down-bar-boxt-2r li {
        font-size: 11px
    }
}

.fivetab .down-bar-boxt-2r img {
    width: 22px;
    display: inline-block
}

.fivetab .down-bar-rz {
    display: flex;
    align-items: center;
    margin-top: 0px;
    color: #15bc83
}

.fivetab .down-bar-rz img {
    width: auto;
    height: 24px;
    margin-right: 3px
}

.fivetab .down-bar-boxf {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 0 5px;
    text-align: center;
    color: #fff;
    justify-content: space-around
}

.fivetab .down-bar-boxf div {
    display: flex;
    justify-content: center;
    width: 33.33%
}

.fivetab .down-bar-boxf a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    line-height: 40px;
    width: 80%;
    color: #fff;
    border-radius: 5px;
    transition: all .2s
}

.fivetab .down-bar-boxf a img {
    width: 24px;
    margin-right: 3px
}

.fivetab .down-bar-boxf a:hover {
    margin-top: -5px
}

.fivetab .down-bar-boxf-1 a {
    background: #c34dff
}

.fivetab .down-bar-boxf-2 a {
    background: #ff5b5b
}

.fivetab .down-bar-boxf-3 a {
    background: #3ebc40
}

@media screen and (max-width: 500px) {
    .fivetab-tit {
        font-size: 13px
    }

    .fivetab-tit .swiper-slide {
        height: 30px
    }

    .fivetab-box {
        padding-bottom: 3px;
        font-size: 13px
    }

    .fivetab .down-bar {
        padding: 0px 0 5px;
        font-size: 11px
    }

    .fivetab .down-bar-boxt-1 {
        width: 20%;
        min-width: 100px;
        text-align: center
    }

    .fivetab .down-bar-boxt-1 img {
        width: 70px;
        border-radius: 12px;
        box-shadow: 0 3px 5px rgba(0, 0, 0, .1)
    }

    .fivetab .down-bar-boxt-2r img {
        width: 16px
    }

    .fivetab .down-bar-rz img {
        height: 20px;
        margin-right: 3px
    }

    .fivetab .down-bar-boxf a {
        height: 34px;
        line-height: 34px;
        width: 90%;
        border-radius: 5px
    }

    .fivetab .down-bar-boxf a img {
        width: 24px;
        margin-right: 3px
    }

    .fivetab .down-bar-boxf a:hover {
        margin-top: 0
    }

    .fivetab .down-bar-boxf a img {
        width: 20px
    }
}

.mb23-tbl {
    width: 100%;
    border-collapse: separate;
    --tw-border-spacing-x: 0px;
    --tw-border-spacing-y: 0px;
    border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y);
    text-align: center;
    --tw-text-opacity: 1;
    color: #e52305;
    word-break: break-word
}

.mb23-tbl td:first-child {
    --tw-bg-opacity: 1;
    background-color: #c7fe5d;
    font-size: 10px;
    --tw-text-opacity: 1;
    color: #000
}

.mb23-tbl td {
    padding: .375rem .25rem;
    line-height: 22px;
    border-right: solid 1px #cece71;
    border-bottom: solid 1px #cece71
}

.mb23-tbl td:first-child {
    width: 65px;
    text-align: center
}

@media(min-width: 375px) {
    .mb23-tbl td:first-child {
        width: 82px
    }
}

@media(min-width: 425px) {
    .mb23-tbl td:first-child {
        width: 90px
    }
}

.mb23-tbl td:first-child {
    border-left: solid 1px #cece71
}

.mb23-tbl td:last-child,
.mb23-tbl td:first-child {
    --tw-bg-opacity: 1;
    background-color: #c7fe5d;
    font-size: 10px;
    --tw-text-opacity: 1;
    color: #000
}

.mb23-tbl td:nth-child(2) {
    --tw-bg-opacity: 1;
    background-color: #fff690;
    font-size: .75rem;
    line-height: 1rem;
    font-weight: 500
}

.mb23-tbl td:nth-child(2) {
    font-size: 1rem;
    line-height: 1.5rem
}

.mb23-tbl td:nth-child(2) {
    word-spacing: 4px
}

.mb23-tbl td:last-child {
    width: 55px;
    text-align: center
}

@media(min-width: 425px) {
    .mb23-tbl td:last-child {
        width: 80px
    }
}

.mb23-tbl td:last-child {
    font-weight: 500
}

@media(min-width: 375px) {
    .mb23-tbl td:last-child {
        font-size: .75rem;
        line-height: 1rem
    }
}

.rounded-t-xl {
    border-top-left-radius: .75rem;
    border-top-right-radius: .75rem
}

.ant-input-affix-wrapper {
    position: relative;
    width: 100%;
    min-width: 0;
    padding: 4px 11px;
    color: rgba(0, 0, 0, .8509803922);
    font-size: 14px;
    line-height: 1.5715;
    background-color: #fff;
    background-image: none;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
    transition: all .3s;
    display: inline-flex
}

.ant-input {
    box-sizing: border-box;
    margin: 0;
    font-variant: tabular-nums;
    list-style: none;
    font-feature-settings: "tnum";
    position: relative;
    display: inline-block;
    width: 100%;
    min-width: 0;
    padding: 4px 11px;
    color: rgba(0, 0, 0, .8509803922);
    font-size: 14px;
    line-height: 1.5715;
    background-color: #fff;
    background-image: none;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
    transition: all .3s
}

.ant-input-affix-wrapper.input-field {
    display: flex;
    height: 3.5rem;
    width: 100%;
    align-items: center;
    border-radius: 9999px;
    border-width: 1px;
    border-style: solid;
    border-color: var(--primary);
    --tw-bg-opacity: 1;
    background-color: #e6eaf2
}

.ant-input-affix-wrapper.input-login {
    display: flex;
    height: 2.5rem;
    width: auto;
    align-items: center;
    border-radius: 9999px;
    border-width: 1px;
    border-style: solid;
    border-color: var(--primary);
    --tw-bg-opacity: 1;
    background-color: #e6eaf2
}

.ant-input-affix-wrapper.input-login input {
    background-color: #e6eaf2
}

.ant-input-affix-wrapper>input.ant-input {
    padding: 0;
    border: none;
    outline: none
}

.ant-input-affix-wrapper.input-field .ant-input {
    --tw-bg-opacity: 1;
    background-color: #e6eaf2
}

.ant-btn[disabled],
.ant-btn[disabled]:hover,
.ant-btn[disabled]:focus,
.ant-btn[disabled]:active {
    color: rgba(0, 0, 0, .2509803922);
    border-color: #d9d9d9;
    background: #f5f5f5;
    text-shadow: none;
    box-shadow: none
}

.ant-btn-primary[disabled],
.ant-btn-primary[disabled]:hover,
.ant-btn-primary[disabled]:focus,
.ant-btn-primary[disabled]:active {
    color: rgba(0, 0, 0, .2509803922);
    border-color: #d9d9d9;
    background: #f5f5f5;
    text-shadow: none;
    box-shadow: none
}

.btn-submit-login {
    background: var(--bgTheme) !important;
    border-color: var(--bgTheme) !important;
    color: var(--color7) !important
}

.control .ant-btn {
    height: 3.5rem;
    border-radius: 9999px
}

.btn-submit-register:disabled {
    background: #e6eaf2
}

.vue-tel-input {
    display: flex;
    height: 3.5rem;
    width: 100%;
    align-items: center;
    border-radius: 9999px;
    border-width: 1px;
    border-style: solid;
    border-color: var(--primary);
    --tw-bg-opacity: 1;
    background-color: #e6eaf2
}

.vue-tel-input .vti__selection .vti__country-code {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    --tw-bg-opacity: 1;
    background-color: #d6d8df;
    padding: .5rem;
    font-size: .75rem;
    line-height: 1rem;
    color: var(--secondary)
}

.vue-tel-input .vti__dropdown .vti__selection {
    margin-left: .5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .25rem;
    background-color: rgba(0, 0, 0, 0);
    padding: 0
}

.vue-tel-input .vti__input {
    margin-right: .5rem;
    height: 100%;
    max-height: 2rem;
    width: 100%;
    border-radius: 9999px;
    --tw-bg-opacity: 1;
    background-color: #e6eaf2
}

.btn-submit-register {
    background: var(--bgTheme) !important;
    border-color: var(--bgTheme) !important;
    color: var(--color7) !important
}

.recommend-information-panel .active {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    --tw-bg-opacity: 1;
    background: linear-gradient(to top, #ffffff 70%, var(--secondary) 150%, var(--bgTheme) 50%) !important
}

.recommend-information-panel .active:before {
    position: absolute;
    left: 50%;
    bottom: .5rem;
    z-index: 10;
    display: block;
    height: 3px;
    width: 80%;
    --tw-translate-x: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    background-color: var(--primary);
    content: " "
}

.text-xs {
    font-size: .75rem;
    line-height: 1rem
}

@media(min-width: 375px) {
    .mobile\:text-base {
        font-size: 1rem;
        line-height: 1.5rem
    }
}

.recommend-information-panel .active .content {
    position: relative;
    font-weight: 600;
    color: var(--primary)
}

.recommend-information-panel .text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity))
}

.download-bar {
    left: 0px;
    position: fixed;
    width: 100%;
    height: 31px;
    bottom: 50px;
    background-color: rgba(0, 0, 0, .8);
    z-index: 10
}

.download-bar p {
    margin: auto 0px;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    line-height: 34px;
    text-indent: 3px;
    white-space: nowrap
}

.download-bar .btn {
    height: 25px;
    line-height: 25px;
    width: 70px;
    text-align: left;
    background-color: #ec0909;
    bottom: 0;
    top: 0;
    margin: auto 10px auto 10px;
    font-size: 14px;
    border: none;
    border-radius: 5px;
    padding: 0;
    color: #fff;
    display: inline-block;
    cursor: pointer
}

.download-bar span {
    display: inline-block;
    width: 57px;
    height: 23px;
    vertical-align: middle;
    background-size: 100% 100%
}

.download-bar .up-toggle {
    text-align: center;
    line-height: 31px;
    width: 80px;
    right: 0;
    position: absolute;
    top: 0px;
    background: red;
    color: #fff
}

#AdvList p {
    margin-bottom: 3px;
    border-bottom: 1px #d2d2d2 dotted;
    padding-bottom: 3px
}

.progress-wrap {
    box-shadow: none;
    visibility: visible;
    opacity: inherit
}

.platform-list li .item-body {
    background: #fff;
    text-align: center;
    position: relative;
    overflow: visible;
    border-radius: 8px;
    padding: 6px 0;
    margin-right: 2px;
    color: #666
}

.platform-list li .item-body.act {
    background: var(--bgTheme);
    color: #fff;
    position: relative
}

.platform-list li .item-body .title {
    font-size: 16px
}

.platform-list li .act:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    bottom: -4px;
    width: 0;
    height: 0;
    border-left: 7.5px solid rgba(0, 0, 0, 0);
    border-right: 7.5px solid rgba(0, 0, 0, 0);
    border-top: 7.5px solid var(--bgTheme)
}

.zhulitxt {
    font-size: 14px;
    width: calc(100% - 70px);
    text-align: center;
    line-height: 36px;
    height: 36px;
    color: #fff;
    overflow: hidden;
    background: #a777e3;
    border-radius: 18px;
    align-items: center;
    display: flex;
    justify-content: center;
    margin-bottom: 10px
}

.zhuli {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    text-align: center;
    background: #fff
}

.zhuli p {
    display: inline-block;
    width: 100%
}

.zhuli p a {
    display: inline-block;
    width: calc(20% - 10px);
    white-space: nowrap;
    overflow: hidden;
    padding: 3px;
    background: #5f9ea0;
    color: #fff;
    line-height: 26px;
    font-size: 14px;
    text-align: center;
    background: linear-gradient(to right, #ef96fc, #a777e3);
    border-radius: 4px;
    text-shadow: 1px 1px 0px #000
}

.zhulitxt #shuliang {
    color: aqua !important;
    font-size: 18px
}

.zhulitxt .colgreen {
    color: #7fff00;
    font-size: 16px
}

#kefus .u-kefus-tit {
    width: 100%;
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: #5151e5;
    font-size: 14pt;
    animation: moveUpDown 1s infinite
}

@keyframes moveUpDown {
    0% {
        transform: translateY(0)
    }

    50% {
        transform: translateY(-2px)
    }

    100% {
        transform: translateY(0)
    }
}

#kefus a {
    font-size: 14px;
    line-height: 48px;
    margin: 2px;
    text-align: center;
    color: #fff;
    border-radius: 3px;
    background: linear-gradient(45deg, #72EDF2, #5151E5);
    display: inline-block;
    transition: box-shadow .5s ease, transform .2s ease;
    will-change: transform;
    box-shadow: 0 5px 15px rgba(0, 0, 0, .3);
    height: 48px
}

body {
    max-width: var(--max-width);
    width: 100%;
    margin: 0 auto !important
}

.ant-tabs-top,
.ant-tabs-bottom {
    flex-direction: column
}

.ant-tabs {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    color: rgba(0, 0, 0, .8509803922);
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    font-feature-settings: "tnum";
    display: flex;
    overflow: hidden
}

.gallery-tab .ant-tabs-tab {
    z-index: 10;
    font-size: .875rem;
    line-height: 1.25rem
}

@media(min-width: 375px) {
    .gallery-tab .ant-tabs-tab-btn {
        font-size: 1.125rem;
        line-height: 1.75rem
    }
}

.ant-tabs-tab-btn {
    color: #000;
    font-weight: 700
}

.gallery-tab .ant-tabs-tab-active {
    font-weight: 500
}

.gallery-tab .ant-tabs-tab-active .ant-tabs-tab-btn {
    color: var(--bgTheme);
    border-bottom: 3px solid
}

.bg-\[var\(--color3\)\] {
    background-color: var(--color3)
}

.hide-scroll {
    scrollbar-width: none;
    scrollbar-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
    -ms-overflow-style: none
}

.right-0 {
    right: 0
}

.search {
    background-color: #e4e6ed
}

.pr-10 {
    padding-right: 2.5rem
}

.pl-3 {
    padding-left: .75rem
}

.w-5 {
    width: 1.25rem
}

.w-6 {
    width: 1.5rem
}

.w-9 {
    width: 2.25rem
}

.w-10 {
    width: 2.5rem
}

.h-6 {
    height: 1.5rem
}

.h-10 {
    height: 2.5rem
}

.p-2 {
    padding: .5rem
}

.text-\[var\(--primary\)\] {
    color: var(--primary)
}

.mr-3 {
    margin-right: .75rem
}

.rounded-xl {
    border-radius: .75rem
}

.bg-\[\#e4e6ed\] {
    --tw-bg-opacity: 1;
    background-color: rgb(228 230 237/var(--tw-bg-opacity))
}

.gallery-alphabet {
    position: sticky;
    top: 0;
    z-index: 40;
    margin-bottom: 0;
    margin-top: -1px;
    display: flex;
    height: 2.5rem;
    min-height: 2.5rem;
    width: 100%;
    align-items: center;
    overflow: hidden;
    overflow-x: auto;
    background-color: var(--color3);
    padding: .5rem .75rem
}

.text-\[\#8d919d\] {
    --tw-text-opacity: 1;
    color: rgb(141 145 157/var(--tw-text-opacity))
}

.rounded-full {
    border-radius: 9999px
}

.text-xs .gallery-alphabet {
    --tw-bg-opacity: 1;
    background-color: rgb(228 230 237/var(--tw-bg-opacity))
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .5rem
}

.items-stretch {
    align-items: stretch
}

.gallery-thumb {
    margin-top: .25rem;
    margin-bottom: .25rem;
    aspect-ratio: 1/1;
    width: 20%;
    background-position: center
}

.gallery-info {
    margin-left: .5rem;
    display: flex;
    width: 60%;
    flex-direction: column;
    justify-content: space-between
}

.gallery-title {
    margin-bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: .875rem;
    line-height: 1.25rem;
    color: rgba(0, 0, 0, .8509803922)
}

.text-\[10px\] {
    font-size: 10px
}

.text-\[\#a5a7af\] {
    --tw-text-opacity: 1;
    color: rgb(165 167 175/var(--tw-text-opacity))
}

.py-3 {
    padding-top: .75rem;
    padding-bottom: .75rem
}

.grid {
    display: grid
}

.grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.gap-2 {
    gap: .5rem
}

.six_column h3 {
    font-size: 14px
}

.rounded-md {
    border-radius: .375rem
}

.rounded-2xl {
    border-radius: 1rem
}

.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none
}

.gap-2 {
    gap: .5rem
}

.text-\[\#fff\] {
    --tw-text-opacity: 1;
    color: rgb(255 255 255/var(--tw-text-opacity))
}

.bg-\[var\(--primary\)\] {
    background-color: var(--primary)
}

.p-1\.5 {
    padding: .375rem
}

.flex-1 {
    flex: 1 1 0%
}

.left-0 {
    left: 0
}

.left-0\.5 {
    left: .125rem
}

.left-1 {
    left: .25rem
}

.left-1\.5 {
    left: .375rem
}

.left-1\/2 {
    left: 50%
}

.left-2 {
    left: .5rem
}

.left-2\.5 {
    left: .625rem
}

.left-2\/4 {
    left: 50%
}

.left-3 {
    left: .75rem
}

.left-4 {
    left: 1rem
}

.left-\[-6px\] {
    left: -6px
}

.left-\[100\%\] {
    left: 100%
}

.left-\[11px\] {
    left: 11px
}

.left-\[15\%\] {
    left: 15%
}

.left-\[2\.5\%\] {
    left: 2.5%
}

.left-\[50\%\] {
    left: 50%
}

.left-\[5px\] {
    left: 5px
}

.left-\[6px\] {
    left: 6px
}

.left-\[83\%\] {
    left: 83%
}

.left-\[calc\(50\%_-_12px\)\] {
    left: calc(50% - 12px)
}

.left-\[calc\(50\%_-_5rem\)\] {
    left: calc(50% - 5rem)
}

.left-auto {
    left: auto
}

.right-0 {
    right: 0
}

.right-1 {
    right: .25rem
}

.right-1\.5 {
    right: .375rem
}

.right-10 {
    right: 2.5rem
}

.right-2 {
    right: .5rem
}

.right-3 {
    right: .75rem
}

.right-3\.5 {
    right: .875rem
}

.right-4 {
    right: 1rem
}

.right-6 {
    right: 1.5rem
}

.right-\[-3px\] {
    right: -3px
}

.right-\[10px\] {
    right: 10px
}

.right-\[18px\] {
    right: 18px
}

.right-\[20px\] {
    right: 20px
}

.right-\[25\%\] {
    right: 25%
}

.right-\[68px\] {
    right: 68px
}

.right-\[6px\] {
    right: 6px
}

.top-0 {
    top: 0
}

.top-1 {
    top: .25rem
}

.top-1\.5 {
    top: .375rem
}

.top-1\/2 {
    top: 50%
}

.top-10 {
    top: 2.5rem
}

.top-2 {
    top: .5rem
}

.top-2\/4 {
    top: 50%
}

.top-3 {
    top: .75rem
}

.top-4 {
    top: 1rem
}

.top-5 {
    top: 1.25rem
}

.top-6 {
    top: 1.5rem
}

.top-\[10px\] {
    top: 10px
}

.top-\[11px\] {
    top: 11px
}

.top-\[130\%\] {
    top: 130%
}

.top-\[134px\] {
    top: 134px
}

.top-\[144px\] {
    top: 144px
}

.top-\[15\%\] {
    top: 15%
}

.top-\[38px\] {
    top: 38px
}

.top-\[3px\] {
    top: 3px
}

.top-\[40px\] {
    top: 40px
}

.top-\[44px\] {
    top: 44px
}

.top-\[48px\] {
    top: 48px
}

.top-\[49px\] {
    top: 49px
}

.top-\[50\%\] {
    top: 50%
}

.top-\[53px\] {
    top: 53px
}

.top-\[56px\] {
    top: 56px
}

.top-\[60px\] {
    top: 60px
}

.top-\[6px\] {
    top: 6px
}

.top-\[8px\] {
    top: 8px
}

.z-0 {
    z-index: 0
}

.z-10 {
    z-index: 10
}

.z-20 {
    z-index: 20
}

.z-30 {
    z-index: 30
}

.z-40 {
    z-index: 40
}

.z-50 {
    z-index: 50
}

.z-\[1001\] {
    z-index: 1001
}

.z-\[100\] {
    z-index: 100
}

.z-\[10\] {
    z-index: 10
}

.z-\[11\] {
    z-index: 11
}

.z-\[1\] {
    z-index: 1
}

.z-\[2\] {
    z-index: 2
}

.z-\[52\] {
    z-index: 52
}

.z-\[5\] {
    z-index: 5
}

.z-\[99999\] {
    z-index: 99999
}

.z-\[9999\] {
    z-index: 9999
}

.z-\[9\] {
    z-index: 9
}

.col-span-1 {
    grid-column: span 1/span 1
}

.col-span-11 {
    grid-column: span 11/span 11
}

.col-span-2 {
    grid-column: span 2/span 2
}

.col-span-3 {
    grid-column: span 3/span 3
}

.col-span-5 {
    grid-column: span 5/span 5
}

.col-span-6 {
    grid-column: span 6/span 6
}

.col-span-7 {
    grid-column: span 7/span 7
}

.col-span-9 {
    grid-column: span 9/span 9
}

.row-span-2 {
    grid-row: span 2/span 2
}

.m-0 {
    margin: 0
}

.m-1 {
    margin: .25rem
}

.m-16 {
    margin: 4rem
}

.m-6 {
    margin: 1.5rem
}

.m-auto {
    margin: auto
}

.-mx-\[5px\] {
    margin-left: -5px;
    margin-right: -5px
}

.-my-3 {
    margin-top: -0.75rem;
    margin-bottom: -0.75rem
}

.mx-0 {
    margin-left: 0;
    margin-right: 0
}

.mx-0\.5 {
    margin-left: .125rem;
    margin-right: .125rem
}

.mx-1 {
    margin-left: .25rem;
    margin-right: .25rem
}

.mx-2 {
    margin-left: .5rem;
    margin-right: .5rem
}

.mx-2\.5 {
    margin-left: .625rem;
    margin-right: .625rem
}

.mx-3 {
    margin-left: .75rem;
    margin-right: .75rem
}

.mx-4 {
    margin-left: 1rem;
    margin-right: 1rem
}

.mx-5 {
    margin-left: 1.25rem;
    margin-right: 1.25rem
}

.mx-\[10px\] {
    margin-left: 10px;
    margin-right: 10px
}

.mx-\[2px\] {
    margin-left: 2px;
    margin-right: 2px
}

.mx-auto {
    margin-left: auto;
    margin-right: auto
}

.my-0 {
    margin-top: 0;
    margin-bottom: 0
}

.my-1 {
    margin-top: .25rem;
    margin-bottom: .25rem
}

.my-1\.5 {
    margin-top: .375rem;
    margin-bottom: .375rem
}

.my-2 {
    margin-top: .5rem;
    margin-bottom: .5rem
}

.my-2\.5 {
    margin-top: .625rem;
    margin-bottom: .625rem
}

.my-3 {
    margin-top: .75rem;
    margin-bottom: .75rem
}

.my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem
}

.my-5 {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem
}

.my-6 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem
}

.\!mb-3 {
    margin-bottom: .75rem !important
}

.\!mb-5 {
    margin-bottom: 1.25rem !important
}

.\!mt-0 {
    margin-top: 0 !important
}

.-mb-0 {
    margin-bottom: 0px
}

.-mb-0\.5 {
    margin-bottom: -0.125rem
}

.-mb-1 {
    margin-bottom: -0.25rem
}

.-mb-1\.5 {
    margin-bottom: -0.375rem
}

.-mb-4 {
    margin-bottom: -1rem
}

.-mb-5 {
    margin-bottom: -1.25rem
}

.-ml-1 {
    margin-left: -0.25rem
}

.-ml-2 {
    margin-left: -0.5rem
}

.-ml-3 {
    margin-left: -0.75rem
}

.-ml-4 {
    margin-left: -1rem
}

.-ml-\[10\%\] {
    margin-left: -10%
}

.-mr-1 {
    margin-right: -0.25rem
}

.-mr-2 {
    margin-right: -0.5rem
}

.-mr-2\.5 {
    margin-right: -0.625rem
}

.-mr-3 {
    margin-right: -0.75rem
}

.-mr-4 {
    margin-right: -1rem
}

.-mr-\[0\.15rem\] {
    margin-right: -0.15rem
}

.-mt-0 {
    margin-top: 0px
}

.-mt-0\.5 {
    margin-top: -0.125rem
}

.-mt-1 {
    margin-top: -0.25rem
}

.-mt-1\.5 {
    margin-top: -0.375rem
}

.-mt-2 {
    margin-top: -0.5rem
}

.-mt-3 {
    margin-top: -0.75rem
}

.-mt-4 {
    margin-top: 0rem
}

.-mt-7 {
    margin-top: -1.75rem
}

.-mt-8 {
    margin-top: -2rem
}

.-mt-px {
    margin-top: -1px
}

.mb-0 {
    margin-bottom: 0
}

.mb-0\.5 {
    margin-bottom: .125rem
}

.mb-1 {
    margin-bottom: .25rem
}

.mb-1\.5 {
    margin-bottom: .375rem
}

.mb-10 {
    margin-bottom: 2.5rem
}

.mb-12 {
    margin-bottom: 3rem
}

.mb-2 {
    margin-bottom: .5rem
}

.mb-2\.5 {
    margin-bottom: .625rem
}

.mb-3 {
    margin-bottom: .75rem
}

.mb-3\.5 {
    margin-bottom: .875rem
}

.mb-4 {
    margin-bottom: 1rem
}

.mb-5 {
    margin-bottom: 1.25rem
}

.mb-6 {
    margin-bottom: 1.5rem
}

.mb-7 {
    margin-bottom: 1.75rem
}

.mb-8 {
    margin-bottom: 2rem
}

.mb-9 {
    margin-bottom: 2.25rem
}

.mb-\[10px\] {
    margin-bottom: 10px
}

.mb-\[1px\] {
    margin-bottom: 1px
}

.mb-\[2px\] {
    margin-bottom: 2px
}

.mb-\[8px\] {
    margin-bottom: 8px
}

.ml-0 {
    margin-left: 0
}

.ml-0\.5 {
    margin-left: .125rem
}

.ml-1 {
    margin-left: .25rem
}

.ml-1\.5 {
    margin-left: .375rem
}

.ml-2 {
    margin-left: .5rem
}

.ml-2\.5 {
    margin-left: .625rem
}

.ml-3 {
    margin-left: .75rem
}

.ml-3\.5 {
    margin-left: .875rem
}

.ml-4 {
    margin-left: 1rem
}

.ml-5 {
    margin-left: 1.25rem
}

.ml-6 {
    margin-left: 1.5rem
}

.ml-7 {
    margin-left: 1.75rem
}

.ml-9 {
    margin-left: 2.25rem
}

.ml-\[10\%\] {
    margin-left: 10%
}

.ml-\[15px\] {
    margin-left: 15px
}

.ml-auto {
    margin-left: auto
}

.ml-px {
    margin-left: 1px
}

.mr-0 {
    margin-right: 0
}

.mr-0\.5 {
    margin-right: .125rem
}

.mr-1 {
    margin-right: .25rem
}

.mr-1\.5 {
    margin-right: .375rem
}

.mr-10 {
    margin-right: 2.5rem
}

.mr-2 {
    margin-right: .5rem
}

.mr-20 {
    margin-right: 5rem
}

.mr-3 {
    margin-right: .75rem
}

.mr-3\.5 {
    margin-right: .875rem
}

.mr-4 {
    margin-right: 1rem
}

.mr-5 {
    margin-right: 1.25rem
}

.mr-6 {
    margin-right: 1.5rem
}

.mr-\[10px\] {
    margin-right: 10px
}

.mr-\[2px\] {
    margin-right: 2px
}

.mr-\[3px\] {
    margin-right: 3px
}

.mr-\[7px\] {
    margin-right: 7px
}

.mr-auto {
    margin-right: auto
}

.mr-px {
    margin-right: 1px
}

.mt-0 {
    margin-top: 0
}

.mt-0\.5 {
    margin-top: .125rem
}

.mt-1 {
    margin-top: .25rem
}

.mt-1\.5 {
    margin-top: .375rem
}

.mt-10 {
    margin-top: 2.5rem
}

.mt-11 {
    margin-top: 2.75rem
}

.mt-14 {
    margin-top: 3.5rem
}

.mt-2 {
    margin-top: .5rem
}

.mt-2\.5 {
    margin-top: .625rem
}

.mt-3 {
    margin-top: .75rem
}

.mt-3\.5 {
    margin-top: .875rem
}

.mt-4 {
    margin-top: 1rem
}

.mt-5 {
    margin-top: 1.25rem
}

.mt-6 {
    margin-top: 1.5rem
}

.mt-7 {
    margin-top: 1.75rem
}

.mt-\[-1px\] {
    margin-top: -1px
}

.mt-\[15px\] {
    margin-top: 15px
}

.mt-\[1px\] {
    margin-top: 1px
}

.mt-\[22px\] {
    margin-top: 22px
}

.mt-\[42px\] {
    margin-top: 42px
}

.mt-\[7px\] {
    margin-top: 7px
}

.mt-auto {
    margin-top: auto
}

.mt-px {
    margin-top: 1px
}

.block {
    display: block
}

.inline-block {
    display: inline-block
}

.inline {
    display: inline
}

.\!flex {
    display: flex !important
}

.flex {
    display: flex
}

.inline-flex {
    display: inline-flex
}

.table {
    display: table
}

.grid {
    display: grid
}

.contents {
    display: contents
}

.hidden {
    display: none
}

.aspect-square {
    aspect-ratio: 1/1
}

.\!h-14 {
    height: 3.5rem !important
}

.\!h-4 {
    height: 1rem !important
}

.\!h-9 {
    height: 2.25rem !important
}

.\!h-\[40px\] {
    height: 40px !important
}

.\!h-auto {
    height: auto !important
}

.\!h-full {
    height: 100% !important
}

.h-0 {
    height: 0px
}

.h-0\.5 {
    height: .125rem
}

.h-1 {
    height: .25rem
}

.h-1\.5 {
    height: .375rem
}

.h-1\/2 {
    height: 50%
}

.h-1\/4 {
    height: 25%
}

.h-10 {
    height: 2.5rem
}

.h-11 {
    height: 2.75rem
}

.h-12 {
    height: 3rem
}

.h-14 {
    height: 3.5rem
}

.h-16 {
    height: 4rem
}

.h-2 {
    height: .5rem
}

.h-2\.5 {
    height: .625rem
}

.h-20 {
    height: 5rem
}

.h-3 {
    height: .75rem
}

.h-3\.5 {
    height: .875rem
}

.h-4 {
    height: 1rem
}

.h-48 {
    height: 12rem
}

.h-5 {
    height: 1.25rem
}

.h-6 {
    height: 1.5rem
}

.h-7 {
    height: 1.75rem
}

.h-8 {
    height: 2rem
}

.h-9 {
    height: 2.25rem
}

.h-\[1\.55rem\] {
    height: 1.55rem
}

.h-\[1\.5px\] {
    height: 1.5px
}

.h-\[1\.875rem\] {
    height: 1.875rem
}

.h-\[100\] {
    height: 100
}

.h-\[100vh\] {
    height: 100vh
}

.h-\[10px\] {
    height: 10px
}

.h-\[120\%\] {
    height: 120%
}

.h-\[129px\] {
    height: 129px
}

.h-\[12px\] {
    height: 12px
}

.h-\[130\%\] {
    height: 130%
}

.h-\[134px\] {
    height: 134px
}

.h-\[13px\] {
    height: 13px
}

.h-\[140px\] {
    height: 140px
}

.h-\[14px\] {
    height: 14px
}

.h-\[150px\] {
    height: 150px
}

.h-\[15px\] {
    height: 15px
}

.h-\[16px\] {
    height: 16px
}

.h-\[17px\] {
    height: 17px
}

.h-\[180px\] {
    height: 180px
}

.h-\[18px\] {
    height: 18px
}

.h-\[200px\] {
    height: 200px
}

.h-\[20px\] {
    height: 20px
}

.h-\[212px\] {
    height: 212px
}

.h-\[216px\] {
    height: 216px
}

.h-\[220px\] {
    height: 220px
}

.h-\[22px\] {
    height: 22px
}

.h-\[24px\] {
    height: 24px
}

.h-\[25px\] {
    height: 25px
}

.h-\[26px\] {
    height: 26px
}

.h-\[28px\] {
    height: 28px
}

.h-\[30px\] {
    height: 30px
}

.h-\[34px\] {
    height: 34px
}

.h-\[38px\] {
    height: 38px
}

.h-\[3px\] {
    height: 3px
}

.h-\[40px\] {
    height: 40px
}

.h-\[42px\] {
    height: 42px
}

.h-\[44px\] {
    height: 44px
}

.h-\[45px\] {
    height: 45px
}

.h-\[48px\] {
    height: 48px
}

.h-\[4px\] {
    height: 4px
}

.h-\[52\] {
    height: 52
}

.h-\[52px\] {
    height: 52px
}

.h-\[60px\] {
    height: 60px
}

.h-\[64px\] {
    height: 64px
}

.h-\[67px\] {
    height: 67px
}

.h-\[6px\] {
    height: 6px
}

.h-\[70px\] {
    height: 70px
}

.h-\[74px\] {
    height: 74px
}

.h-\[75px\] {
    height: 75px
}

.h-\[80px\] {
    height: 80px
}

.h-\[90\%\] {
    height: 90%
}

.h-\[92px\] {
    height: 92px
}

.h-\[calc\(100\%_-_101px\)\] {
    height: calc(100% - 101px)
}

.h-\[calc\(100\%_-_134px\)\] {
    height: calc(100% - 134px)
}

.h-\[calc\(100\%_-_141px\)\] {
    height: calc(100% - 141px)
}

.h-\[calc\(100\%_-_144px\)\] {
    height: calc(100% - 144px)
}

.h-\[calc\(100\%_-_150px\)\] {
    height: calc(100% - 150px)
}

.h-\[calc\(100\%_-_152px\)\] {
    height: calc(100% - 152px)
}

.h-\[calc\(100\%_-_254px\)\] {
    height: calc(100% - 254px)
}

.h-\[calc\(100\%_-_273px\)\] {
    height: calc(100% - 273px)
}

.h-\[calc\(100\%_-_276px\)\] {
    height: calc(100% - 276px)
}

.h-\[calc\(100\%_-_278px\)\] {
    height: calc(100% - 278px)
}

.h-\[calc\(100\%_-_300px\)\] {
    height: calc(100% - 300px)
}

.h-\[calc\(100\%_-_38px\)\] {
    height: calc(100% - 38px)
}

.h-\[calc\(100\%_-_40px\)\] {
    height: calc(100% - 40px)
}

.h-\[calc\(100\%_-_44px\)\] {
    height: calc(100% - 44px)
}

.h-\[calc\(100\%_-_48px\)\] {
    height: calc(100% - 48px)
}

.h-\[calc\(100\%_-_53px\)\] {
    height: calc(100% - 53px)
}

.h-\[calc\(100\%_-_56px\)\] {
    height: calc(100% - 56px)
}

.h-\[calc\(100\%_-_60px\)\] {
    height: calc(100% - 60px)
}

.h-\[calc\(100\%_-_70px\)\] {
    height: calc(100% - 70px)
}

.h-\[calc\(100\%_-_82px\)\] {
    height: calc(100% - 82px)
}

.h-\[calc\(100vh_-_192px\)\] {
    height: calc(100vh - 192px)
}

.h-\[calc\(100vh_-_230px\)\] {
    height: calc(100vh - 230px)
}

.h-\[calc\(100vh_-_330px\)\] {
    height: calc(100vh - 330px)
}

.h-\[calc\(100vh_-_365px\)\] {
    height: calc(100vh - 365px)
}

.h-auto {
    height: auto
}

.h-fit {
    height: -moz-fit-content;
    height: fit-content
}

.h-full {
    height: 100%
}

.h-px {
    height: 1px
}

.h-screen {
    height: 100vh
}

.max-h-12 {
    max-height: 3rem
}

.max-h-16 {
    max-height: 4rem
}

.max-h-5 {
    max-height: 1.25rem
}

.max-h-6 {
    max-height: 1.5rem
}

.max-h-8 {
    max-height: 2rem
}

.max-h-\[300px\] {
    max-height: 300px
}

.max-h-\[38px\] {
    max-height: 38px
}

.max-h-\[50\%\] {
    max-height: 50%
}

.max-h-\[62px\] {
    max-height: 62px
}

.max-h-\[70px\] {
    max-height: 70px
}

.max-h-\[calc\(100vh_-_21\.75rem\)\] {
    max-height: calc(100vh - 21.75rem)
}

.max-h-full {
    max-height: 100%
}

.max-h-screen {
    max-height: 100vh
}

.min-h-\[123px\] {
    min-height: 123px
}

.min-h-\[186px\] {
    min-height: 186px
}

.min-h-\[2\.5rem\] {
    min-height: 2.5rem
}

.min-h-\[2\.75rem\] {
    min-height: 2.75rem
}

.min-h-\[212px\] {
    min-height: 212px
}

.min-h-\[28px\] {
    min-height: 28px
}

.min-h-\[30px\] {
    min-height: 30px
}

.min-h-\[364px\] {
    min-height: 364px
}

.min-h-\[400px\] {
    min-height: 400px
}

.min-h-\[40px\] {
    min-height: 40px
}

.min-h-\[42px\] {
    min-height: 42px
}

.min-h-\[44px\] {
    min-height: 44px
}

.min-h-\[48px\] {
    min-height: 48px
}

.min-h-\[49px\] {
    min-height: 49px
}

.min-h-\[54px\] {
    min-height: 54px
}

.min-h-\[57px\] {
    min-height: 57px
}

.min-h-\[60px\] {
    min-height: 60px
}

.min-h-\[64px\] {
    min-height: 64px
}

.min-h-\[70px\] {
    min-height: 70px
}

.min-h-\[74px\] {
    min-height: 74px
}

.min-h-fit {
    min-height: -moz-fit-content;
    min-height: fit-content
}

.min-h-full {
    min-height: 100%
}

.\!w-32 {
    width: 8rem !important
}

.\!w-9 {
    width: 2.25rem !important
}

.\!w-\[100\%\] {
    width: 100% !important
}

.\!w-\[40px\] {
    width: 40px !important
}

.\!w-auto {
    width: auto !important
}

.w-0 {
    width: 0px
}

.w-1 {
    width: .25rem
}

.w-1\.5 {
    width: .375rem
}

.w-1\/2 {
    width: 50%
}

.w-1\/3 {
    width: 33.333333%
}

.w-1\/4 {
    width: 25%
}

.w-1\/5 {
    width: 20%
}

.w-10 {
    width: 2.5rem
}

.w-10\/12 {
    width: 83.333333%
}

.w-11 {
    width: 2.75rem
}

.w-12 {
    width: 3rem
}

.w-14 {
    width: 3.5rem
}

.w-16 {
    width: 4rem
}

.w-2 {
    width: .5rem
}

.w-2\.5 {
    width: .625rem
}

.w-2\/3 {
    width: 66.666667%
}

.w-2\/5 {
    width: 40%
}

.w-2\/6 {
    width: 33.333333%
}

.w-20 {
    width: 5rem
}

.w-24 {
    width: 6rem
}

.w-28 {
    width: 7rem
}

.w-3 {
    width: .75rem
}

.w-3\.5 {
    width: .875rem
}

.w-3\/5 {
    width: 60%
}

.w-32 {
    width: 8rem
}

.w-4 {
    width: 1rem
}

.w-48 {
    width: 12rem
}

.w-5 {
    width: 1.25rem
}

.w-5\/6 {
    width: 83.333333%
}

.w-6 {
    width: 1.5rem
}

.w-60 {
    width: 15rem
}

.w-7 {
    width: 1.75rem
}

.w-8 {
    width: 2rem
}

.w-9 {
    width: 2.25rem
}

.w-9\/12 {
    width: 75%
}

.w-\[0\.5px\] {
    width: .5px
}

.w-\[100vw\] {
    width: 100vw
}

.w-\[101\%\] {
    width: 101%
}

.w-\[10px\] {
    width: 10px
}

.w-\[11px\] {
    width: 11px
}

.w-\[120\%\] {
    width: 120%
}

.w-\[120px\] {
    width: 120px
}

.w-\[12px\] {
    width: 12px
}

.w-\[130px\] {
    width: 130px
}

.w-\[13px\] {
    width: 13px
}

.w-\[14\%\] {
    width: 14%
}

.w-\[14px\] {
    width: 14px
}

.w-\[15px\] {
    width: 15px
}

.w-\[170px\] {
    width: 170px
}

.w-\[17px\] {
    width: 17px
}

.w-\[18px\] {
    width: 18px
}

.w-\[1px\] {
    width: 1px
}

.w-\[2\/5\] {
    width: 2/5
}

.w-\[200px\] {
    width: 200px
}

.w-\[20px\] {
    width: 20px
}

.w-\[22px\] {
    width: 22px
}

.w-\[24px\] {
    width: 24px
}

.w-\[250px\] {
    width: 250px
}

.w-\[253px\] {
    width: 253px
}

.w-\[25px\] {
    width: 25px
}

.w-\[26px\] {
    width: 26px
}

.w-\[280px\] {
    width: 280px
}

.w-\[300px\] {
    width: 300px
}

.w-\[30px\] {
    width: 30px
}

.w-\[32\.5\%\] {
    width: 32.5%
}

.w-\[34px\] {
    width: 34px
}

.w-\[4\.375rem\] {
    width: 4.375rem
}

.w-\[40px\] {
    width: 40px
}

.w-\[45\%\] {
    width: 45%
}

.w-\[45px\] {
    width: 45px
}

.w-\[46\%\] {
    width: 46%
}

.w-\[50px\] {
    width: 50px
}

.w-\[52\.5px\] {
    width: 52.5px
}

.w-\[52px\] {
    width: 52px
}

.w-\[55\%\] {
    width: 55%
}

.w-\[55px\] {
    width: 55px
}

.w-\[60\%\] {
    width: 60%
}

.w-\[60px\] {
    width: 60px
}

.w-\[65\%\] {
    width: 65%
}

.w-\[65px\] {
    width: 65px
}

.w-\[66px\] {
    width: 66px
}

.w-\[67\.5\%\] {
    width: 67.5%
}

.w-\[6px\] {
    width: 6px
}

.w-\[70\%\] {
    width: 70%
}

.w-\[70px\] {
    width: 70px
}

.w-\[72\%\] {
    width: 72%
}

.w-\[75px\] {
    width: 75px
}

.w-\[80\%\] {
    width: 80%
}

.w-\[80px\] {
    width: 80px
}

.w-\[85\%\] {
    width: 85%
}

.w-\[90px\] {
    width: 90px
}

.w-\[92px\] {
    width: 92px
}

.w-\[95\%\] {
    width: 95%
}

.w-\[calc\(100\%_-_110px\)\] {
    width: calc(100% - 110px)
}

.w-\[calc\(100\%_-_32px\)\] {
    width: calc(100% - 32px)
}

.w-\[calc\(100\%_-_45px\)\] {
    width: calc(100% - 45px)
}

.w-\[calc\(100\%_-_55px\)\] {
    width: calc(100% - 55px)
}

.w-\[calc\(100vw_-_4rem\)\] {
    width: calc(100vw - 4rem)
}

.w-\[calc\(95vw_-_2rem\)\] {
    width: calc(95vw - 2rem)
}

.w-auto {
    width: auto
}

.w-fit {
    width: -moz-fit-content;
    width: fit-content
}

.w-full {
    width: 100%
}

.w-max {
    width: -moz-max-content;
    width: max-content
}

.w-screen {
    width: 100vw
}

.min-w-\[120px\] {
    min-width: 120px
}

.min-w-\[137px\] {
    min-width: 137px
}

.min-w-\[16\%\] {
    min-width: 16%
}

.min-w-\[24\%\] {
    min-width: 24%
}

.min-w-\[25\%\] {
    min-width: 25%
}

.min-w-\[38px\] {
    min-width: 38px
}

.min-w-\[40px\] {
    min-width: 40px
}

.min-w-\[44px\] {
    min-width: 44px
}

.min-w-\[50px\] {
    min-width: 50px
}

.min-w-\[52px\] {
    min-width: 52px
}

.min-w-\[60px\] {
    min-width: 60px
}

.min-w-\[70px\] {
    min-width: 70px
}

.min-w-\[75px\] {
    min-width: 75px
}

.min-w-max {
    min-width: -moz-max-content;
    min-width: max-content
}

.max-w-3xl {
    max-width: 48rem
}

.max-w-\[10\.75rem\] {
    max-width: 10.75rem
}

.max-w-\[14rem\] {
    max-width: 14rem
}

.max-w-\[155px\] {
    max-width: 155px
}

.max-w-\[160px\] {
    max-width: 160px
}

.max-w-\[165px\] {
    max-width: 165px
}

.max-w-\[2\.75rem\] {
    max-width: 2.75rem
}

.max-w-\[220px\] {
    max-width: 220px
}

.max-w-\[225px\] {
    max-width: 225px
}

.max-w-\[260px\] {
    max-width: 260px
}

.max-w-\[280px\] {
    max-width: 280px
}

.max-w-\[300px\] {
    max-width: 300px
}

.max-w-\[310px\] {
    max-width: 310px
}

.max-w-\[40\%\] {
    max-width: 40%
}

.max-w-\[520px\] {
    max-width: 520px
}

.max-w-\[56px\] {
    max-width: 56px
}

.max-w-\[70px\] {
    max-width: 70px
}

.max-w-\[83\%\] {
    max-width: 83%
}

.max-w-\[85\%\] {
    max-width: 85%
}

.max-w-\[92\%\] {
    max-width: 92%
}

.max-w-\[calc\(100\%_-_56px\)\] {
    max-width: calc(100% - 56px)
}

.max-w-\[calc\(100\%_-_76px\)\] {
    max-width: calc(100% - 76px)
}

.max-w-full {
    max-width: 100%
}

.flex-1 {
    flex: 1 1 0%
}

.flex-auto {
    flex: 1 1 auto
}

.flex-shrink-0,
.shrink-0 {
    flex-shrink: 0
}

.flex-grow {
    flex-grow: 1
}

.flex-grow-0 {
    flex-grow: 0
}

.grow {
    flex-grow: 1
}

.basis-1\/12 {
    flex-basis: 8.333333%
}

.basis-11\/12 {
    flex-basis: 91.666667%
}

.border-collapse {
    border-collapse: collapse
}

.border-separate {
    border-collapse: separate
}

.border-spacing-0 {
    --tw-border-spacing-x: 0px;
    --tw-border-spacing-y: 0px;
    border-spacing: var(--tw-border-spacing-x) var(--tw-border-spacing-y)
}

.-translate-x-1\/2,
.-translate-x-2\/4 {
    --tw-translate-x: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-1\/2 {
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-2 {
    --tw-translate-y: -.5rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-2\/4 {
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.-translate-y-\[3px\] {
    --tw-translate-y: -3px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-x-2 {
    --tw-translate-x: .5rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-x-\[-50\%\] {
    --tw-translate-x: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-x-\[16px\] {
    --tw-translate-x: 16px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-x-\[20px\] {
    --tw-translate-x: 20px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-0 {
    --tw-translate-y: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.translate-y-\[-50\%\] {
    --tw-translate-y: -50%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-0 {
    --tw-rotate: 0deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-180 {
    --tw-rotate: 180deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.rotate-\[320deg\] {
    --tw-rotate: 320deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

.transform {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}

@keyframes bounce {

    0%,
    to {
        transform: translateY(-25%);
        animation-timing-function: cubic-bezier(0.8, 0, 1, 1)
    }

    50% {
        transform: none;
        animation-timing-function: cubic-bezier(0, 0, 0.2, 1)
    }
}

.animate-bounce {
    animation: bounce 1s infinite
}

@keyframes spin {
    to {
        transform: rotate(360deg)
    }
}

.animate-spin {
    animation: spin 1s linear infinite
}

.cursor-move {
    cursor: move
}

.cursor-pointer {
    cursor: pointer
}

.touch-none {
    touch-action: none
}

.touch-pan-x {
    --tw-pan-x: pan-x;
    touch-action: var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom)
}

.select-none {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none
}

.resize {
    resize: both
}

.snap-y {
    scroll-snap-type: y var(--tw-scroll-snap-strictness)
}

.scroll-m-0 {
    scroll-margin: 0px
}

.scroll-p-0 {
    scroll-padding: 0px
}

.list-none {
    list-style-type: none
}

.grid-cols-10 {
    grid-template-columns: repeat(10, minmax(0, 1fr))
}

.grid-cols-11 {
    grid-template-columns: repeat(11, minmax(0, 1fr))
}

.grid-cols-12 {
    grid-template-columns: repeat(12, minmax(0, 1fr))
}

.grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr))
}

.grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.grid-cols-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr))
}

.grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr))
}

.grid-cols-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr))
}

.grid-cols-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr))
}

.grid-cols-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr))
}

.grid-cols-\[1fr_10px\] {
    grid-template-columns: 1fr 10px
}

.grid-cols-\[1fr_70px\] {
    grid-template-columns: 1fr 70px
}

.grid-rows-1 {
    grid-template-rows: repeat(1, minmax(0, 1fr))
}

.grid-rows-2 {
    grid-template-rows: repeat(2, minmax(0, 1fr))
}

.flex-row {
    flex-direction: row
}

.flex-row-reverse {
    flex-direction: row-reverse
}

.flex-col {
    flex-direction: column
}

.flex-col-reverse {
    flex-direction: column-reverse
}

.flex-wrap {
    flex-wrap: wrap
}

.flex-nowrap {
    flex-wrap: nowrap
}

.content-start {
    align-content: flex-start
}

.items-start {
    align-items: flex-start
}

.items-end {
    align-items: flex-end
}

.items-center {
    align-items: center
}

.items-baseline {
    align-items: baseline
}

.items-stretch {
    align-items: stretch
}

.justify-start {
    justify-content: flex-start
}

.justify-end {
    justify-content: flex-end
}

.justify-center {
    justify-content: center
}

.justify-between {
    justify-content: space-between
}

.justify-around {
    justify-content: space-around
}

.justify-evenly {
    justify-content: space-evenly
}

.justify-items-center {
    justify-items: center
}

.justify-items-stretch {
    justify-items: stretch
}

.gap-0 {
    gap: 0px
}

.gap-0\.5 {
    gap: .125rem
}

.gap-1 {
    gap: .25rem
}

.gap-1\.5 {
    gap: .375rem
}

.gap-2 {
    gap: .5rem
}

.gap-2\.5 {
    gap: .625rem
}

.gap-3 {
    gap: .75rem
}

.gap-4 {
    gap: 1rem
}

.gap-5 {
    gap: 1.25rem
}

.gap-6 {
    gap: 1.5rem
}

.gap-8 {
    gap: 2rem
}

.gap-\[1px\] {
    gap: 1px
}

.gap-\[3px\] {
    gap: 3px
}

.gap-\[7px\] {
    gap: 7px
}

.gap-x-1 {
    -moz-column-gap: .25rem;
    column-gap: .25rem
}

.gap-x-2 {
    -moz-column-gap: .5rem;
    column-gap: .5rem
}

.gap-x-2\.5 {
    -moz-column-gap: .625rem;
    column-gap: .625rem
}

.gap-x-3 {
    -moz-column-gap: .75rem;
    column-gap: .75rem
}

.gap-x-5 {
    -moz-column-gap: 1.25rem;
    column-gap: 1.25rem
}

.gap-x-7 {
    -moz-column-gap: 1.75rem;
    column-gap: 1.75rem
}

.gap-y-2 {
    row-gap: .5rem
}

.gap-y-3 {
    row-gap: .75rem
}

.space-x-2>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(.5rem*var(--tw-space-x-reverse));
    margin-left: calc(.5rem*(1 - var(--tw-space-x-reverse)))
}

.space-x-3>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(.75rem*var(--tw-space-x-reverse));
    margin-left: calc(.75rem*(1 - var(--tw-space-x-reverse)))
}

.space-x-4>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(1rem*var(--tw-space-x-reverse));
    margin-left: calc(1rem*(1 - var(--tw-space-x-reverse)))
}

.space-x-5>:not([hidden])~:not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(1.25rem*var(--tw-space-x-reverse));
    margin-left: calc(1.25rem*(1 - var(--tw-space-x-reverse)))
}

.space-y-1>:not([hidden])~:not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(.25rem*(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(.25rem*var(--tw-space-y-reverse))
}

.self-start {
    align-self: flex-start
}

.self-center {
    align-self: center
}

.justify-self-center {
    justify-self: center
}

.overflow-auto {
    overflow: auto
}

.overflow-hidden {
    overflow: hidden
}

.overflow-visible {
    overflow: visible
}

.overflow-x-auto {
    overflow-x: auto
}

.overflow-y-auto {
    overflow-y: auto
}

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

.\!overflow-y-hidden {
    overflow-y: hidden !important
}

.overflow-y-hidden {
    overflow-y: hidden
}

.overflow-y-scroll {
    overflow-y: scroll !important
}

.overscroll-contain {
    overscroll-behavior: contain
}

.overscroll-none {
    overscroll-behavior: none
}

.overscroll-y-auto {
    overscroll-behavior-y: auto
}

.overscroll-y-contain {
    overscroll-behavior-y: contain
}

.scroll-smooth {
    scroll-behavior: smooth
}

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.text-ellipsis {
    text-overflow: ellipsis
}

.whitespace-nowrap {
    white-space: nowrap
}

.whitespace-pre-line {
    white-space: pre-line
}

.whitespace-pre-wrap {
    white-space: pre-wrap
}

.break-words {
    overflow-wrap: break-word
}

.break-all {
    word-break: break-all
}

.break-keep {
    word-break: keep-all
}

.\!rounded {
    border-radius: .25rem !important
}

.\!rounded-lg {
    border-radius: .5rem !important
}

.rounded {
    border-radius: .25rem
}

.rounded-2xl {
    border-radius: 1rem
}

.rounded-3xl {
    border-radius: 1.5rem
}

.rounded-\[12px\] {
    border-radius: 12px
}

.rounded-\[18px\] {
    border-radius: 18px
}

.rounded-\[30px\] {
    border-radius: 30px
}

.rounded-\[3px\] {
    border-radius: 3px
}

.rounded-\[4px\] {
    border-radius: 4px
}

.rounded-\[50\%\] {
    border-radius: 50%
}

.rounded-full {
    border-radius: 9999px
}

.rounded-lg {
    border-radius: .5rem
}

.rounded-md {
    border-radius: .375rem
}

.rounded-none {
    border-radius: 0
}

.rounded-sm {
    border-radius: .125rem
}

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

.rounded-b-2xl {
    border-bottom-right-radius: 1rem;
    border-bottom-left-radius: 1rem
}

.rounded-b-lg {
    border-bottom-right-radius: .5rem;
    border-bottom-left-radius: .5rem
}

.rounded-b-xl {
    border-bottom-right-radius: .75rem;
    border-bottom-left-radius: .75rem
}

.rounded-l-lg {
    border-top-left-radius: .5rem;
    border-bottom-left-radius: .5rem
}

.rounded-l-sm {
    border-top-left-radius: .125rem;
    border-bottom-left-radius: .125rem
}

.rounded-l-xl {
    border-top-left-radius: .75rem;
    border-bottom-left-radius: .75rem
}

.rounded-r-lg {
    border-top-right-radius: .5rem;
    border-bottom-right-radius: .5rem
}

.rounded-r-sm {
    border-top-right-radius: .125rem;
    border-bottom-right-radius: .125rem
}

.rounded-r-xl {
    border-top-right-radius: .75rem;
    border-bottom-right-radius: .75rem
}

.rounded-t-2xl {
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem
}

.rounded-t-\[11px\] {
    border-top-left-radius: 11px;
    border-top-right-radius: 11px
}

.rounded-t-\[8px\] {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px
}

.rounded-t-lg {
    border-top-left-radius: .5rem;
    border-top-right-radius: .5rem
}

.rounded-t-xl {
    border-top-left-radius: .2rem;
    border-top-right-radius: .2rem
}

.rounded-bl-2xl {
    border-bottom-left-radius: 1rem
}

.rounded-bl-\[10px\] {
    border-bottom-left-radius: 10px
}

.rounded-bl-\[4px\] {
    border-bottom-left-radius: 4px
}

.rounded-bl-lg {
    border-bottom-left-radius: .5rem
}

.rounded-bl-none {
    border-bottom-left-radius: 0
}

.rounded-bl-xl {
    border-bottom-left-radius: .75rem
}

.rounded-br-2xl {
    border-bottom-right-radius: 1rem
}

.rounded-br-\[10px\] {
    border-bottom-right-radius: 10px
}

.rounded-br-\[4px\] {
    border-bottom-right-radius: 4px
}

.rounded-br-lg {
    border-bottom-right-radius: .5rem
}

.rounded-br-xl {
    border-bottom-right-radius: .75rem
}

.rounded-tl-\[4px\] {
    border-top-left-radius: 4px
}

.rounded-tl-lg {
    border-top-left-radius: .5rem
}

.rounded-tl-xl {
    border-top-left-radius: .75rem
}

.rounded-tr-\[4px\] {
    border-top-right-radius: 4px
}

.rounded-tr-lg {
    border-top-right-radius: .5rem
}

.rounded-tr-xl {
    border-top-right-radius: .75rem
}

.\!border-0 {
    border-width: 0px !important
}

.border {
    border-width: 1px
}

.border-0 {
    border-width: 0px
}

.border-2 {
    border-width: 2px
}

.border-4 {
    border-width: 4px
}

.border-\[0\.5px\] {
    border-width: .5px
}

.border-\[1\.5px\] {
    border-width: 1.5px
}

.border-\[1px\] {
    border-width: 1px
}

.border-\[2px\] {
    border-width: 2px
}

.border-x {
    border-left-width: 1px;
    border-right-width: 1px
}

.border-y-\[0\.5px\] {
    border-top-width: .5px;
    border-bottom-width: .5px
}

.border-b {
    border-bottom-width: 1px
}

.border-b-0 {
    border-bottom-width: 0px
}

.border-b-2 {
    border-bottom-width: 2px
}

.border-b-8 {
    border-bottom-width: 8px
}

.border-b-\[0\.5px\] {
    border-bottom-width: .5px
}

.border-b-\[1\.5px\] {
    border-bottom-width: 1.5px
}

.border-b-\[1px\] {
    border-bottom-width: 1px
}

.border-b-\[4px\] {
    border-bottom-width: 4px
}

.border-l {
    border-left-width: 1px
}

.border-l-8 {
    border-left-width: 8px
}

.border-r {
    border-right-width: 1px
}

.border-r-0 {
    border-right-width: 0px
}

.border-r-8 {
    border-right-width: 8px
}

.border-r-\[0\.5px\] {
    border-right-width: .5px
}

.border-r-\[10px\] {
    border-right-width: 10px
}

.border-t {
    border-top-width: 1px
}

.border-t-0 {
    border-top-width: 0px
}

.border-t-8 {
    border-top-width: 8px
}

.border-t-\[0\.5px\] {
    border-top-width: .5px
}

.border-solid {
    border-style: solid
}

.border-dashed {
    border-style: dashed
}

.border-dotted {
    border-style: dotted
}

.border-none {
    border-style: none
}

.border-\[\#00007a\] {
    --tw-border-opacity: 1;
    border-color: rgb(0 0 122/var(--tw-border-opacity))
}

.border-\[\#1d315e\] {
    --tw-border-opacity: 1;
    border-color: rgb(29 49 94/var(--tw-border-opacity))
}

.border-\[\#1db423\] {
    --tw-border-opacity: 1;
    border-color: rgb(29 180 35/var(--tw-border-opacity))
}

.border-\[\#1f488c\] {
    --tw-border-opacity: 1;
    border-color: rgb(31 72 140/var(--tw-border-opacity))
}

.border-\[\#20448d\] {
    --tw-border-opacity: 1;
    border-color: rgb(32 68 141/var(--tw-border-opacity))
}

.border-\[\#234076\] {
    --tw-border-opacity: 1;
    border-color: rgb(35 64 118/var(--tw-border-opacity))
}

.border-\[\#2856b4\] {
    --tw-border-opacity: 1;
    border-color: rgb(40 86 180/var(--tw-border-opacity))
}

.border-\[\#2a57b5\] {
    --tw-border-opacity: 1;
    border-color: rgb(42 87 181/var(--tw-border-opacity))
}

.border-\[\#2c58b3\] {
    --tw-border-opacity: 1;
    border-color: rgb(44 88 179/var(--tw-border-opacity))
}

.border-\[\#2c81fe\] {
    --tw-border-opacity: 1;
    border-color: rgb(44 129 254/var(--tw-border-opacity))
}

.border-\[\#2d499c\] {
    --tw-border-opacity: 1;
    border-color: rgb(45 73 156/var(--tw-border-opacity))
}

.border-\[\#2e4e92\] {
    --tw-border-opacity: 1;
    border-color: rgb(46 78 146/var(--tw-border-opacity))
}

.border-\[\#4a72c5\] {
    --tw-border-opacity: 1;
    border-color: rgb(74 114 197/var(--tw-border-opacity))
}

.border-\[\#4c5675\] {
    --tw-border-opacity: 1;
    border-color: rgb(76 86 117/var(--tw-border-opacity))
}

.border-\[\#654d28\] {
    --tw-border-opacity: 1;
    border-color: rgb(101 77 40/var(--tw-border-opacity))
}

.border-\[\#656565\] {
    --tw-border-opacity: 1;
    border-color: rgb(101 101 101/var(--tw-border-opacity))
}

.border-\[\#a47d36\] {
    --tw-border-opacity: 1;
    border-color: rgb(164 125 54/var(--tw-border-opacity))
}

.border-\[\#aab1bf\] {
    --tw-border-opacity: 1;
    border-color: rgb(170 177 191/var(--tw-border-opacity))
}

.border-\[\#c2c6d0\] {
    --tw-border-opacity: 1;
    border-color: rgb(194 198 208/var(--tw-border-opacity))
}

.border-\[\#c4c4c4\] {
    --tw-border-opacity: 1;
    border-color: rgb(196 196 196/var(--tw-border-opacity))
}

.border-\[\#c5c5c5\] {
    --tw-border-opacity: 1;
    border-color: rgb(197 197 197/var(--tw-border-opacity))
}

.border-\[\#cbcbcb\] {
    --tw-border-opacity: 1;
    border-color: rgb(203 203 203/var(--tw-border-opacity))
}

.border-\[\#cdd1d7\] {
    --tw-border-opacity: 1;
    border-color: rgb(205 209 215/var(--tw-border-opacity))
}

.border-\[\#ced2db\] {
    --tw-border-opacity: 1;
    border-color: rgb(206 210 219/var(--tw-border-opacity))
}

.border-\[\#d2cc86\] {
    --tw-border-opacity: 1;
    border-color: rgb(210 204 134/var(--tw-border-opacity))
}

.border-\[\#d7d9e1\] {
    --tw-border-opacity: 1;
    border-color: rgb(215 217 225/var(--tw-border-opacity))
}

.border-\[\#d9d9d9\] {
    --tw-border-opacity: 1;
    border-color: rgb(217 217 217/var(--tw-border-opacity))
}

.border-\[\#dbdad9\] {
    --tw-border-opacity: 1;
    border-color: rgb(219 218 217/var(--tw-border-opacity))
}

.border-\[\#dbdbdb\] {
    --tw-border-opacity: 1;
    border-color: rgb(219 219 219/var(--tw-border-opacity))
}

.border-\[\#dc2528\] {
    --tw-border-opacity: 1;
    border-color: rgb(220 37 40/var(--tw-border-opacity))
}

.border-\[\#dfe1e5\] {
    --tw-border-opacity: 1;
    border-color: rgb(223 225 229/var(--tw-border-opacity))
}

.border-\[\#e2e2e2\] {
    --tw-border-opacity: 1;
    border-color: rgb(226 226 226/var(--tw-border-opacity))
}

.border-\[\#e4e6ea\] {
    --tw-border-opacity: 1;
    border-color: rgb(228 230 234/var(--tw-border-opacity))
}

.border-\[\#e4e6eb\] {
    --tw-border-opacity: 1;
    border-color: rgb(228 230 235/var(--tw-border-opacity))
}

.border-\[\#e6eaf2\] {
    --tw-border-opacity: 1;
    border-color: rgb(230 234 242/var(--tw-border-opacity))
}

.border-\[\#eac87a4d\] {
    border-color: rgba(234, 200, 122, .3019607843)
}

.border-\[\#eaeaea\] {
    --tw-border-opacity: 1;
    border-color: rgb(234 234 234/var(--tw-border-opacity))
}

.border-\[\#eaeaed\] {
    --tw-border-opacity: 1;
    border-color: rgb(234 234 237/var(--tw-border-opacity))
}

.border-\[\#ebedf3\] {
    --tw-border-opacity: 1;
    border-color: rgb(235 237 243/var(--tw-border-opacity))
}

.border-\[\#ededed\] {
    --tw-border-opacity: 1;
    border-color: rgb(237 237 237/var(--tw-border-opacity))
}

.border-\[\#efeff3\] {
    --tw-border-opacity: 1;
    border-color: rgb(239 239 243/var(--tw-border-opacity))
}

.border-\[\#eff0f0\] {
    --tw-border-opacity: 1;
    border-color: rgb(239 240 240/var(--tw-border-opacity))
}

.border-\[\#f1333a\] {
    --tw-border-opacity: 1;
    border-color: rgb(241 51 58/var(--tw-border-opacity))
}

.border-\[\#f16d00\] {
    --tw-border-opacity: 1;
    border-color: rgb(241 109 0/var(--tw-border-opacity))
}

.border-\[\#f1ece9\] {
    --tw-border-opacity: 1;
    border-color: rgb(241 236 233/var(--tw-border-opacity))
}

.border-\[\#f1f1f1\] {
    --tw-border-opacity: 1;
    border-color: rgb(241 241 241/var(--tw-border-opacity))
}

.border-\[\#f6f6f6\] {
    --tw-border-opacity: 1;
    border-color: rgb(246 246 246/var(--tw-border-opacity))
}

.border-\[\#f6f6f8\] {
    --tw-border-opacity: 1;
    border-color: rgb(246 246 248/var(--tw-border-opacity))
}

.border-\[\#f6f7fa\] {
    --tw-border-opacity: 1;
    border-color: rgb(246 247 250/var(--tw-border-opacity))
}

.border-\[\#f7f7f7\] {
    --tw-border-opacity: 1;
    border-color: rgb(247 247 247/var(--tw-border-opacity))
}

.border-\[\#f8f8f9\] {
    --tw-border-opacity: 1;
    border-color: rgb(248 248 249/var(--tw-border-opacity))
}

.border-\[\#ff0000\] {
    --tw-border-opacity: 1;
    border-color: rgb(255 0 0/var(--tw-border-opacity))
}

.border-\[\#fffc00\] {
    --tw-border-opacity: 1;
    border-color: rgb(255 252 0/var(--tw-border-opacity))
}

.border-\[34ef7c\] {
    border-color: 34ef7c
}

.border-\[blue\] {
    --tw-border-opacity: 1;
    border-color: rgb(0 0 255/var(--tw-border-opacity))
}

.border-\[transparent\] {
    border-color: rgba(0, 0, 0, 0)
}

.border-\[var\(--color1\)\] {
    border-color: var(--color1)
}

.border-\[var\(--color4\)\] {
    border-color: var(--color4)
}

.border-\[var\(--mb26-borderColor\)\] {
    border-color: var(--mb26-borderColor)
}

.border-\[var\(--mb39-borderColor\)\] {
    border-color: var(--mb39-borderColor)
}

.border-\[var\(--primary\)\] {
    border-color: var(--primary)
}

.border-\[var\(--template-custom-borderColor\)\] {
    border-color: var(--template-custom-borderColor)
}

.border-black {
    --tw-border-opacity: 1;
    border-color: rgb(0 0 0/var(--tw-border-opacity))
}

.border-gray-200 {
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235/var(--tw-border-opacity))
}

.border-gray-300 {
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219/var(--tw-border-opacity))
}

.border-gray-300\/40 {
    border-color: rgba(209, 213, 219, .4)
}

.border-red-500 {
    --tw-border-opacity: 1;
    border-color: rgb(239 68 68/var(--tw-border-opacity))
}

.border-transparent {
    border-color: rgba(0, 0, 0, 0)
}

.border-white {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255/var(--tw-border-opacity))
}

.border-x-\[\#cad0da\] {
    --tw-border-opacity: 1;
    border-left-color: rgb(202 208 218/var(--tw-border-opacity));
    border-right-color: rgb(202 208 218/var(--tw-border-opacity))
}

.border-b-\[\#\#cfd4df\] {
    border-bottom-color: #cfd4df
}

.border-b-\[\#c4c4c4\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(196 196 196/var(--tw-border-opacity))
}

.border-b-\[\#cad0da\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(202 208 218/var(--tw-border-opacity))
}

.border-b-\[\#cfd4df\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(207 212 223/var(--tw-border-opacity))
}

.border-b-\[\#d1063f\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(209 6 63/var(--tw-border-opacity))
}

.border-b-\[\#d3d3d3\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(211 211 211/var(--tw-border-opacity))
}

.border-b-\[\#dadce4\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(218 220 228/var(--tw-border-opacity))
}

.border-b-\[\#dadee5\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(218 222 229/var(--tw-border-opacity))
}

.border-b-\[\#dce1ec\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(220 225 236/var(--tw-border-opacity))
}

.border-b-\[\#dddfe6\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(221 223 230/var(--tw-border-opacity))
}

.border-b-\[\#e4e8f1\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(228 232 241/var(--tw-border-opacity))
}

.border-b-\[\#e6eaf3\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(230 234 243/var(--tw-border-opacity))
}

.border-b-\[\#fff\] {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(255 255 255/var(--tw-border-opacity))
}

.border-b-\[var\(--color4\)\] {
    border-bottom-color: var(--color4)
}

.border-b-black {
    --tw-border-opacity: 1;
    border-bottom-color: rgb(0 0 0/var(--tw-border-opacity))
}

.border-l-\[transparent\] {
    border-left-color: rgba(0, 0, 0, 0)
}

.border-r-\[\#dadada\] {
    --tw-border-opacity: 1;
    border-right-color: rgb(218 218 218/var(--tw-border-opacity))
}

.border-r-\[\#e9e9e9\] {
    --tw-border-opacity: 1;
    border-right-color: rgb(233 233 233/var(--tw-border-opacity))
}

.border-r-\[\#efeff3\] {
    --tw-border-opacity: 1;
    border-right-color: rgb(239 239 243/var(--tw-border-opacity))
}

.border-r-\[transparent\] {
    border-right-color: rgba(0, 0, 0, 0)
}

.border-r-\[var\(--color6\)\] {
    border-right-color: var(--color6)
}

.border-r-transparent {
    border-right-color: rgba(0, 0, 0, 0)
}

.border-t-\[\#0000000f\] {
    border-top-color: rgba(0, 0, 0, .0588235294)
}

.border-t-\[\#cad0da\] {
    --tw-border-opacity: 1;
    border-top-color: rgb(202 208 218/var(--tw-border-opacity))
}

.border-t-\[\#cad0db\] {
    --tw-border-opacity: 1;
    border-top-color: rgb(202 208 219/var(--tw-border-opacity))
}

.border-t-\[\#d7dcec\] {
    --tw-border-opacity: 1;
    border-top-color: rgb(215 220 236/var(--tw-border-opacity))
}

.border-t-\[\#dadada\] {
    --tw-border-opacity: 1;
    border-top-color: rgb(218 218 218/var(--tw-border-opacity))
}

.border-t-\[\#e41800\] {
    --tw-border-opacity: 1;
    border-top-color: rgb(228 24 0/var(--tw-border-opacity))
}

.border-t-\[\#e9e9e9\] {
    --tw-border-opacity: 1;
    border-top-color: rgb(233 233 233/var(--tw-border-opacity))
}

.\!bg-\[\#20448d\] {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(32 68 141/var(--tw-bg-opacity)) !important
}

.\!bg-\[\#b84d57\] {
    --tw-bg-opacity: 1 !important;
    background-color: rgb(184 77 87/var(--tw-bg-opacity)) !important
}

.\!bg-\[var\(--color5\)\] {
    background-color: var(--color5) !important
}

.\!bg-\[var\(--primary\)\] {
    background-color: var(--primary) !important
}

.bg-\[\#00000073\] {
    background-color: rgba(0, 0, 0, .4509803922)
}

.bg-\[\#0000007a\] {
    background-color: rgba(0, 0, 0, .4784313725)
}

.bg-\[\#000c\] {
    background-color: rgba(0, 0, 0, .8)
}

.bg-\[\#00193C\] {
    --tw-bg-opacity: 1;
    background-color: rgb(0 25 60/var(--tw-bg-opacity))
}

.bg-\[\#04BE00\] {
    --tw-bg-opacity: 1;
    background-color: rgb(4 190 0/var(--tw-bg-opacity))
}

.bg-\[\#0d2e5f\] {
    --tw-bg-opacity: 1;
    background-color: rgb(13 46 95/var(--tw-bg-opacity))
}

.bg-\[\#0e0e0e\] {
    --tw-bg-opacity: 1;
    background-color: rgb(14 14 14/var(--tw-bg-opacity))
}

.bg-\[\#119919\] {
    --tw-bg-opacity: 1;
    background-color: rgb(17 153 25/var(--tw-bg-opacity))
}

.bg-\[\#13438b\] {
    --tw-bg-opacity: 1;
    background-color: rgb(19 67 139/var(--tw-bg-opacity))
}

.bg-\[\#1561e9\] {
    --tw-bg-opacity: 1;
    background-color: rgb(21 97 233/var(--tw-bg-opacity))
}

.bg-\[\#172D5E\] {
    --tw-bg-opacity: 1;
    background-color: rgb(23 45 94/var(--tw-bg-opacity))
}

.bg-\[\#18ae19\] {
    --tw-bg-opacity: 1;
    background-color: rgb(24 174 25/var(--tw-bg-opacity))
}

.bg-\[\#18b252\] {
    --tw-bg-opacity: 1;
    background-color: rgb(24 178 82/var(--tw-bg-opacity))
}

.bg-\[\#1b346d\] {
    --tw-bg-opacity: 1;
    background-color: rgb(27 52 109/var(--tw-bg-opacity))
}

.bg-\[\#1b8d6a\] {
    --tw-bg-opacity: 1;
    background-color: rgb(27 141 106/var(--tw-bg-opacity))
}

.bg-\[\#1ba27a\] {
    --tw-bg-opacity: 1;
    background-color: rgb(27 162 122/var(--tw-bg-opacity))
}

.bg-\[\#1f2022\] {
    --tw-bg-opacity: 1;
    background-color: rgb(31 32 34/var(--tw-bg-opacity))
}

.bg-\[\#204184\] {
    --tw-bg-opacity: 1;
    background-color: rgb(32 65 132/var(--tw-bg-opacity))
}

.bg-\[\#20448d\] {
    --tw-bg-opacity: 1;
    background-color: rgb(32 68 141/var(--tw-bg-opacity))
}

.bg-\[\#234076\] {
    --tw-bg-opacity: 1;
    background-color: rgb(35 64 118/var(--tw-bg-opacity))
}

.bg-\[\#235ced\] {
    --tw-bg-opacity: 1;
    background-color: rgb(35 92 237/var(--tw-bg-opacity))
}

.bg-\[\#237cff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(35 124 255/var(--tw-bg-opacity))
}

.bg-\[\#2442a1\] {
    --tw-bg-opacity: 1;
    background-color: rgb(36 66 161/var(--tw-bg-opacity))
}

.bg-\[\#260806\] {
    --tw-bg-opacity: 1;
    background-color: rgb(38 8 6/var(--tw-bg-opacity))
}

.bg-\[\#282828bf\] {
    background-color: rgba(40, 40, 40, .7490196078)
}

.bg-\[\#2a57b5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(42 87 181/var(--tw-bg-opacity))
}

.bg-\[\#2f60ff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(47 96 255/var(--tw-bg-opacity))
}

.bg-\[\#304fa5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(48 79 165/var(--tw-bg-opacity))
}

.bg-\[\#31bc2a\] {
    --tw-bg-opacity: 1;
    background-color: rgb(49 188 42/var(--tw-bg-opacity))
}

.bg-\[\#3474cc\] {
    --tw-bg-opacity: 1;
    background-color: rgb(52 116 204/var(--tw-bg-opacity))
}

.bg-\[\#347bff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(52 123 255/var(--tw-bg-opacity))
}

.bg-\[\#35538d\] {
    --tw-bg-opacity: 1;
    background-color: rgb(53 83 141/var(--tw-bg-opacity))
}

.bg-\[\#365183\] {
    --tw-bg-opacity: 1;
    background-color: rgb(54 81 131/var(--tw-bg-opacity))
}

.bg-\[\#3e5ea1\] {
    --tw-bg-opacity: 1;
    background-color: rgb(62 94 161/var(--tw-bg-opacity))
}

.bg-\[\#3f5887\] {
    --tw-bg-opacity: 1;
    background-color: rgb(63 88 135/var(--tw-bg-opacity))
}

.bg-\[\#4063e5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(64 99 229/var(--tw-bg-opacity))
}

.bg-\[\#46bbe7\] {
    --tw-bg-opacity: 1;
    background-color: rgb(70 187 231/var(--tw-bg-opacity))
}

.bg-\[\#5ab44e\] {
    --tw-bg-opacity: 1;
    background-color: rgb(90 180 78/var(--tw-bg-opacity))
}

.bg-\[\#5d2700\] {
    --tw-bg-opacity: 1;
    background-color: rgb(93 39 0/var(--tw-bg-opacity))
}

.bg-\[\#60ad48\] {
    --tw-bg-opacity: 1;
    background-color: rgb(96 173 72/var(--tw-bg-opacity))
}

.bg-\[\#646fc8\] {
    --tw-bg-opacity: 1;
    background-color: rgb(100 111 200/var(--tw-bg-opacity))
}

.bg-\[\#74a8f6\] {
    --tw-bg-opacity: 1;
    background-color: rgb(116 168 246/var(--tw-bg-opacity))
}

.bg-\[\#7B92B5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(123 146 181/var(--tw-bg-opacity))
}

.bg-\[\#808080ee\] {
    background-color: rgba(128, 128, 128, .9333333333)
}

.bg-\[\#818CF8\] {
    --tw-bg-opacity: 1;
    background-color: rgb(129 140 248/var(--tw-bg-opacity))
}

.bg-\[\#8400e0\] {
    --tw-bg-opacity: 1;
    background-color: rgb(132 0 224/var(--tw-bg-opacity))
}

.bg-\[\#905d06\] {
    --tw-bg-opacity: 1;
    background-color: rgb(144 93 6/var(--tw-bg-opacity))
}

.bg-\[\#90b2f7\] {
    --tw-bg-opacity: 1;
    background-color: rgb(144 178 247/var(--tw-bg-opacity))
}

.bg-\[\#919fbd\] {
    --tw-bg-opacity: 1;
    background-color: rgb(145 159 189/var(--tw-bg-opacity))
}

.bg-\[\#A5A5A5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(165 165 165/var(--tw-bg-opacity))
}

.bg-\[\#C51A2A\] {
    --tw-bg-opacity: 1;
    background-color: rgb(197 26 42/var(--tw-bg-opacity))
}

.bg-\[\#FFF\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

.bg-\[\#b12e75\] {
    --tw-bg-opacity: 1;
    background-color: rgb(177 46 117/var(--tw-bg-opacity))
}

.bg-\[\#b78c61\] {
    --tw-bg-opacity: 1;
    background-color: rgb(183 140 97/var(--tw-bg-opacity))
}

.bg-\[\#b79c61\] {
    --tw-bg-opacity: 1;
    background-color: rgb(183 156 97/var(--tw-bg-opacity))
}

.bg-\[\#b9123f\] {
    --tw-bg-opacity: 1;
    background-color: rgb(185 18 63/var(--tw-bg-opacity))
}

.bg-\[\#b9b8bb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(185 184 187/var(--tw-bg-opacity))
}

.bg-\[\#bac0e2\] {
    --tw-bg-opacity: 1;
    background-color: rgb(186 192 226/var(--tw-bg-opacity))
}

.bg-\[\#bdbdbd\] {
    --tw-bg-opacity: 1;
    background-color: rgb(189 189 189/var(--tw-bg-opacity))
}

.bg-\[\#c044e8\] {
    --tw-bg-opacity: 1;
    background-color: rgb(192 68 232/var(--tw-bg-opacity))
}

.bg-\[\#c3ccdd\] {
    --tw-bg-opacity: 1;
    background-color: rgb(195 204 221/var(--tw-bg-opacity))
}

.bg-\[\#c41929\] {
    --tw-bg-opacity: 1;
    background-color: rgb(196 25 41/var(--tw-bg-opacity))
}

.bg-\[\#c719ff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(199 25 255/var(--tw-bg-opacity))
}

.bg-\[\#c7fe5d\] {
    --tw-bg-opacity: 1;
    background-color: rgb(199 254 93/var(--tw-bg-opacity))
}

.bg-\[\#cadeff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(202 222 255/var(--tw-bg-opacity))
}

.bg-\[\#cbd8ef\] {
    --tw-bg-opacity: 1;
    background-color: rgb(203 216 239/var(--tw-bg-opacity))
}

.bg-\[\#ccd8eb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(204 216 235/var(--tw-bg-opacity))
}

.bg-\[\#cd6252\] {
    --tw-bg-opacity: 1;
    background-color: rgb(205 98 82/var(--tw-bg-opacity))
}

.bg-\[\#d0f3e8\] {
    --tw-bg-opacity: 1;
    background-color: rgb(208 243 232/var(--tw-bg-opacity))
}

.bg-\[\#d12a29\] {
    --tw-bg-opacity: 1;
    background-color: rgb(209 42 41/var(--tw-bg-opacity))
}

.bg-\[\#d6d8df\] {
    --tw-bg-opacity: 1;
    background-color: rgb(214 216 223/var(--tw-bg-opacity))
}

.bg-\[\#d9d9d9\] {
    --tw-bg-opacity: 1;
    background-color: rgb(217 217 217/var(--tw-bg-opacity))
}

.bg-\[\#dddfe8\] {
    --tw-bg-opacity: 1;
    background-color: rgb(221 223 232/var(--tw-bg-opacity))
}

.bg-\[\#dee5fa\] {
    --tw-bg-opacity: 1;
    background-color: rgb(222 229 250/var(--tw-bg-opacity))
}

.bg-\[\#dfe0e4\] {
    --tw-bg-opacity: 1;
    background-color: rgb(223 224 228/var(--tw-bg-opacity))
}

.bg-\[\#dfe1ea\] {
    --tw-bg-opacity: 1;
    background-color: rgb(223 225 234/var(--tw-bg-opacity))
}

.bg-\[\#dfe5f0\] {
    --tw-bg-opacity: 1;
    background-color: rgb(223 229 240/var(--tw-bg-opacity))
}

.bg-\[\#e0e6f9\] {
    --tw-bg-opacity: 1;
    background-color: rgb(224 230 249/var(--tw-bg-opacity))
}

.bg-\[\#e17a4a\] {
    --tw-bg-opacity: 1;
    background-color: rgb(225 122 74/var(--tw-bg-opacity))
}

.bg-\[\#e1e6f2\] {
    --tw-bg-opacity: 1;
    background-color: rgb(225 230 242/var(--tw-bg-opacity))
}

.bg-\[\#e1faf2\] {
    --tw-bg-opacity: 1;
    background-color: rgb(225 250 242/var(--tw-bg-opacity))
}

.bg-\[\#e2e4eb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(226 228 235/var(--tw-bg-opacity))
}

.bg-\[\#e33956\] {
    --tw-bg-opacity: 1;
    background-color: rgb(227 57 86/var(--tw-bg-opacity))
}

.bg-\[\#e3e8f3\] {
    --tw-bg-opacity: 1;
    background-color: rgb(227 232 243/var(--tw-bg-opacity))
}

.bg-\[\#e3f2d8\] {
    --tw-bg-opacity: 1;
    background-color: rgb(227 242 216/var(--tw-bg-opacity))
}

.bg-\[\#e4e6ed\] {
    --tw-bg-opacity: 1;
    background-color: rgb(228 230 237/var(--tw-bg-opacity))
}

.bg-\[\#e51917\] {
    --tw-bg-opacity: 1;
    background-color: rgb(229 25 23/var(--tw-bg-opacity))
}

.bg-\[\#e5ffdf\] {
    --tw-bg-opacity: 1;
    background-color: rgb(229 255 223/var(--tw-bg-opacity))
}

.bg-\[\#e6e9f1\] {
    --tw-bg-opacity: 1;
    background-color: rgb(230 233 241/var(--tw-bg-opacity))
}

.bg-\[\#e6eaf2\] {
    --tw-bg-opacity: 1;
    background-color: rgb(230 234 242/var(--tw-bg-opacity))
}

.bg-\[\#e6effe\] {
    --tw-bg-opacity: 1;
    background-color: rgb(230 239 254/var(--tw-bg-opacity))
}

.bg-\[\#e84573\] {
    --tw-bg-opacity: 1;
    background-color: rgb(232 69 115/var(--tw-bg-opacity))
}

.bg-\[\#e89645\] {
    --tw-bg-opacity: 1;
    background-color: rgb(232 150 69/var(--tw-bg-opacity))
}

.bg-\[\#e8eefe\] {
    --tw-bg-opacity: 1;
    background-color: rgb(232 238 254/var(--tw-bg-opacity))
}

.bg-\[\#e8f1ff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(232 241 255/var(--tw-bg-opacity))
}

.bg-\[\#e8f6f9\] {
    --tw-bg-opacity: 1;
    background-color: rgb(232 246 249/var(--tw-bg-opacity))
}

.bg-\[\#e9dab9\] {
    --tw-bg-opacity: 1;
    background-color: rgb(233 218 185/var(--tw-bg-opacity))
}

.bg-\[\#e9e9f0\] {
    --tw-bg-opacity: 1;
    background-color: rgb(233 233 240/var(--tw-bg-opacity))
}

.bg-\[\#ebeff3\] {
    --tw-bg-opacity: 1;
    background-color: rgb(235 239 243/var(--tw-bg-opacity))
}

.bg-\[\#ebeffb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(235 239 251/var(--tw-bg-opacity))
}

.bg-\[\#ec133a\] {
    --tw-bg-opacity: 1;
    background-color: rgb(236 19 58/var(--tw-bg-opacity))
}

.bg-\[\#ececeb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(236 236 235/var(--tw-bg-opacity))
}

.bg-\[\#eceef5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(236 238 245/var(--tw-bg-opacity))
}

.bg-\[\#ededed\] {
    --tw-bg-opacity: 1;
    background-color: rgb(237 237 237/var(--tw-bg-opacity))
}

.bg-\[\#edf1ff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(237 241 255/var(--tw-bg-opacity))
}

.bg-\[\#eed4d7\] {
    --tw-bg-opacity: 1;
    background-color: rgb(238 212 215/var(--tw-bg-opacity))
}

.bg-\[\#ef4a00\] {
    --tw-bg-opacity: 1;
    background-color: rgb(239 74 0/var(--tw-bg-opacity))
}

.bg-\[\#eff1f5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(239 241 245/var(--tw-bg-opacity))
}

.bg-\[\#eff4ff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(239 244 255/var(--tw-bg-opacity))
}

.bg-\[\#f0f0f0\] {
    --tw-bg-opacity: 1;
    background-color: rgb(240 240 240/var(--tw-bg-opacity))
}

.bg-\[\#f0f1f2\] {
    --tw-bg-opacity: 1;
    background-color: rgb(240 241 242/var(--tw-bg-opacity))
}

.bg-\[\#f1f1f1\] {
    --tw-bg-opacity: 1;
    background-color: rgb(241 241 241/var(--tw-bg-opacity))
}

.bg-\[\#f1f2f5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(241 242 245/var(--tw-bg-opacity))
}

.bg-\[\#f1f3f5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(241 243 245/var(--tw-bg-opacity))
}

.bg-\[\#f1f5ff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(241 245 255/var(--tw-bg-opacity))
}

.bg-\[\#f2084a\] {
    --tw-bg-opacity: 1;
    background-color: rgb(242 8 74/var(--tw-bg-opacity))
}

.bg-\[\#f28900\] {
    --tw-bg-opacity: 1;
    background-color: rgb(242 137 0/var(--tw-bg-opacity))
}

.bg-\[\#f2f2f5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(242 242 245/var(--tw-bg-opacity))
}

.bg-\[\#f2f3f6\] {
    --tw-bg-opacity: 1;
    background-color: rgb(242 243 246/var(--tw-bg-opacity))
}

.bg-\[\#f2f4fa\] {
    --tw-bg-opacity: 1;
    background-color: rgb(242 244 250/var(--tw-bg-opacity))
}

.bg-\[\#f2f6ff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(242 246 255/var(--tw-bg-opacity))
}

.bg-\[\#f3f3f5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(243 243 245/var(--tw-bg-opacity))
}

.bg-\[\#f3f4f7\] {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 247/var(--tw-bg-opacity))
}

.bg-\[\#f4000e\] {
    --tw-bg-opacity: 1;
    background-color: rgb(244 0 14/var(--tw-bg-opacity))
}

.bg-\[\#f4b702\] {
    --tw-bg-opacity: 1;
    background-color: rgb(244 183 2/var(--tw-bg-opacity))
}

.bg-\[\#f4f4f5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(244 244 245/var(--tw-bg-opacity))
}

.bg-\[\#f4f4f6\] {
    --tw-bg-opacity: 1;
    background-color: rgb(244 244 246/var(--tw-bg-opacity))
}

.bg-\[\#f5a629\] {
    --tw-bg-opacity: 1;
    background-color: rgb(245 166 41/var(--tw-bg-opacity))
}

.bg-\[\#f5faff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(245 250 255/var(--tw-bg-opacity))
}

.bg-\[\#f6f6f5\] {
    --tw-bg-opacity: 1;
    background-color: rgb(246 246 245/var(--tw-bg-opacity))
}

.bg-\[\#f6f6f6\] {
    --tw-bg-opacity: 1;
    background-color: rgb(246 246 246/var(--tw-bg-opacity))
}

.bg-\[\#f6f7f9\] {
    --tw-bg-opacity: 1;
    background-color: rgb(246 247 249/var(--tw-bg-opacity))
}

.bg-\[\#f7ede4\] {
    --tw-bg-opacity: 1;
    background-color: rgb(247 237 228/var(--tw-bg-opacity))
}

.bg-\[\#f7f7f7\] {
    --tw-bg-opacity: 1;
    background-color: rgb(247 247 247/var(--tw-bg-opacity))
}

.bg-\[\#f7fbff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(247 251 255/var(--tw-bg-opacity))
}

.bg-\[\#f8f8f8\] {
    --tw-bg-opacity: 1;
    background-color: rgb(248 248 248/var(--tw-bg-opacity))
}

.bg-\[\#f9f9f9\] {
    --tw-bg-opacity: 1;
    background-color: rgb(249 249 249/var(--tw-bg-opacity))
}

.bg-\[\#f9f9fb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(249 249 251/var(--tw-bg-opacity))
}

.bg-\[\#fbf2e6\] {
    --tw-bg-opacity: 1;
    background-color: rgb(251 242 230/var(--tw-bg-opacity))
}

.bg-\[\#fbfafb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(251 250 251/var(--tw-bg-opacity))
}

.bg-\[\#fbfbfb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(251 251 251/var(--tw-bg-opacity))
}

.bg-\[\#fdf6f0\] {
    --tw-bg-opacity: 1;
    background-color: rgb(253 246 240/var(--tw-bg-opacity))
}

.bg-\[\#fdfdfe\] {
    --tw-bg-opacity: 1;
    background-color: rgb(253 253 254/var(--tw-bg-opacity))
}

.bg-\[\#fdfefd\] {
    --tw-bg-opacity: 1;
    background-color: rgb(253 254 253/var(--tw-bg-opacity))
}

.bg-\[\#fee1eb\] {
    --tw-bg-opacity: 1;
    background-color: rgb(254 225 235/var(--tw-bg-opacity))
}

.bg-\[\#fefefe\] {
    --tw-bg-opacity: 1;
    background-color: rgb(254 254 254/var(--tw-bg-opacity))
}

.bg-\[\#feffe0\] {
    --tw-bg-opacity: 1;
    background-color: rgb(254 255 224/var(--tw-bg-opacity))
}

.bg-\[\#ff0000\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 0 0/var(--tw-bg-opacity))
}

.bg-\[\#ff002a\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 0 42/var(--tw-bg-opacity))
}

.bg-\[\#ff1a5b\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 26 91/var(--tw-bg-opacity))
}

.bg-\[\#ff7e54\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 126 84/var(--tw-bg-opacity))
}

.bg-\[\#ff9601\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 150 1/var(--tw-bg-opacity))
}

.bg-\[\#ffe0ea\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 224 234/var(--tw-bg-opacity))
}

.bg-\[\#ffe3ea\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 227 234/var(--tw-bg-opacity))
}

.bg-\[\#ffebee\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 235 238/var(--tw-bg-opacity))
}

.bg-\[\#ffebf1\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 235 241/var(--tw-bg-opacity))
}

.bg-\[\#ffece9\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 236 233/var(--tw-bg-opacity))
}

.bg-\[\#ffecef\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 236 239/var(--tw-bg-opacity))
}

.bg-\[\#ffeeb7\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 238 183/var(--tw-bg-opacity))
}

.bg-\[\#fff0f8\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 240 248/var(--tw-bg-opacity))
}

.bg-\[\#fff3e3\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 243 227/var(--tw-bg-opacity))
}

.bg-\[\#fff690\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 246 144/var(--tw-bg-opacity))
}

.bg-\[\#fff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

.bg-\[\#fffaef\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 250 239/var(--tw-bg-opacity))
}

.bg-\[\#fffffe\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 254/var(--tw-bg-opacity))
}

.bg-\[\#ffffff33\] {
    background-color: rgba(255, 255, 255, .2)
}

.bg-\[\#ffffff\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

.bg-\[crimson\] {
    --tw-bg-opacity: 1;
    background-color: rgb(220 20 60/var(--tw-bg-opacity))
}

.bg-\[floralwhite\] {
    --tw-bg-opacity: 1;
    background-color: rgb(255 250 240/var(--tw-bg-opacity))
}

.bg-\[var\(--color1\)\] {
    background-color: var(--color1)
}

.bg-\[var\(--color11\)\] {
    background-color: var(--color11)
}

.bg-\[var\(--color12\)\] {
    background-color: var(--color12)
}

.bg-\[var\(--color3\)\] {
    background-color: var(--color3)
}

.bg-\[var\(--color5\)\] {
    background-color: var(--color5)
}

.bg-\[var\(--color6\)\] {
    background-color: var(--color6)
}

.bg-\[var\(--mb42-color1\)\] {
    background-color: var(--mb42-color1)
}

.bg-\[var\(--metaHeader\)\] {
    background-color: var(--metaHeader)
}

.bg-\[var\(--primary\)\] {
    background-color: var(--primary)
}

.bg-\[var\(--secondary\)\] {
    background-color: var(--secondary)
}

.bg-\[var\(--bgTheme\)\] {
    background-color: var(--bgTheme)
}

.text-\[var\(--textTheme\)\] {
    color: var(--textTheme)
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0/var(--tw-bg-opacity))
}

.bg-gray-200 {
    --tw-bg-opacity: 1;
    background-color: rgb(229 231 235/var(--tw-bg-opacity))
}

.bg-red-300 {
    --tw-bg-opacity: 1;
    background-color: rgb(252 165 165/var(--tw-bg-opacity))
}

.bg-red-600 {
    --tw-bg-opacity: 1;
    background-color: rgb(220 38 38/var(--tw-bg-opacity))
}

.bg-transparent {
    background-color: rgba(0, 0, 0, 0)
}

.bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255/var(--tw-bg-opacity))
}

.bg-opacity-50 {
    --tw-bg-opacity: .5
}

.bg-opacity-60 {
    --tw-bg-opacity: .6
}

.bg-ball-blue {
    background-image: url(/img/ball-blue.png)
}

.bg-ball-green {
    background-image: url(/img/ball-green.png)
}

.bg-ball-red {
    background-image: url(/img/ball-red.png)
}



.bg-gradient-to-b {
    background-image: linear-gradient(to bottom, var(--tw-gradient-stops))
}

.bg-gradient-to-bl {
    background-image: linear-gradient(to bottom left, var(--tw-gradient-stops))
}

.bg-gradient-to-br {
    background-image: linear-gradient(to bottom right, var(--tw-gradient-stops))
}

.bg-gradient-to-r {
    background-image: linear-gradient(to right, var(--tw-gradient-stops))
}

.bg-gradient-to-t {
    background-image: linear-gradient(to top, var(--tw-gradient-stops))
}

.bg-gradient-to-tl {
    background-image: linear-gradient(to top left, var(--tw-gradient-stops))
}

.bg-gradient-to-tr {
    background-image: linear-gradient(to top right, var(--tw-gradient-stops))
}


.from-\[\#000\] {
    --tw-gradient-from: #000 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#00d955\] {
    --tw-gradient-from: #00d955 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(0 217 85 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#203d78\] {
    --tw-gradient-from: #203d78 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(32 61 120 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#31e5b4\] {
    --tw-gradient-from: #31e5b4 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(49 229 180 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#44a5ff\] {
    --tw-gradient-from: #44a5ff var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(68 165 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#4f82ee\] {
    --tw-gradient-from: #4f82ee var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(79 130 238 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#cadeff\] {
    --tw-gradient-from: #cadeff var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(202 222 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#d9dde9\] {
    --tw-gradient-from: #d9dde9 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(217 221 233 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#df45ff\] {
    --tw-gradient-from: #df45ff var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(223 69 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#e3d900\] {
    --tw-gradient-from: #e3d900 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(227 217 0 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#f8f9ff\] {
    --tw-gradient-from: #f8f9ff var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(248 249 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#fba64d\] {
    --tw-gradient-from: #fba64d var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(251 166 77 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#fcfd03\] {
    --tw-gradient-from: #fcfd03 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(252 253 3 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#fe7e45\] {
    --tw-gradient-from: #fe7e45 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(254 126 69 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#ff44cb\] {
    --tw-gradient-from: #ff44cb var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 68 203 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#ff4550\] {
    --tw-gradient-from: #ff4550 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 69 80 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#ffed23\] {
    --tw-gradient-from: #ffed23 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 237 35 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#fff1e2\] {
    --tw-gradient-from: #fff1e2 var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 241 226 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[\#fff\] {
    --tw-gradient-from: #fff var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[var\(--color3\)\] {
    --tw-gradient-from: var(--color3) var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-\[var\(--primary\)\] {
    --tw-gradient-from: var(--primary) var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)
}

.from-50\% {
    --tw-gradient-from-position: 50%
}

.via-\[transparent\] {
    --tw-gradient-to: rgb(0 0 0 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), transparent var(--tw-gradient-via-position), var(--tw-gradient-to)
}

.via-\[var\(--primary\)\] {
    --tw-gradient-to: rgb(255 255 255 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--primary) var(--tw-gradient-via-position), var(--tw-gradient-to)
}

.via-30\% {
    --tw-gradient-via-position: 30%
}

.to-\[\#01a289\] {
    --tw-gradient-to: #01a289 var(--tw-gradient-to-position)
}

.to-\[\#01a702\] {
    --tw-gradient-to: #01a702 var(--tw-gradient-to-position)
}

.to-\[\#11020A\] {
    --tw-gradient-to: #11020A var(--tw-gradient-to-position)
}

.to-\[\#198cff\] {
    --tw-gradient-to: #198cff var(--tw-gradient-to-position)
}

.to-\[\#4468b3\] {
    --tw-gradient-to: #4468b3 var(--tw-gradient-to-position)
}

.to-\[\#4a1ad2\] {
    --tw-gradient-to: #4a1ad2 var(--tw-gradient-to-position)
}

.to-\[\#8a02fd\] {
    --tw-gradient-to: #8a02fd var(--tw-gradient-to-position)
}

.to-\[\#8b7204\] {
    --tw-gradient-to: #8b7204 var(--tw-gradient-to-position)
}

.to-\[\#a4c2fe\] {
    --tw-gradient-to: #a4c2fe var(--tw-gradient-to-position)
}

.to-\[\#a55f00\] {
    --tw-gradient-to: #a55f00 var(--tw-gradient-to-position)
}

.to-\[\#ebecf0\] {
    --tw-gradient-to: #ebecf0 var(--tw-gradient-to-position)
}

.to-\[\#f0f4fc\] {
    --tw-gradient-to: #f0f4fc var(--tw-gradient-to-position)
}

.to-\[\#f4f0ed\] {
    --tw-gradient-to: #f4f0ed var(--tw-gradient-to-position)
}

.to-\[\#f7f9ff\] {
    --tw-gradient-to: #f7f9ff var(--tw-gradient-to-position)
}

.to-\[\#fcc602\] {
    --tw-gradient-to: #fcc602 var(--tw-gradient-to-position)
}

.to-\[\#fe1b25\] {
    --tw-gradient-to: #fe1b25 var(--tw-gradient-to-position)
}

.to-\[\#ff1bbb\] {
    --tw-gradient-to: #ff1bbb var(--tw-gradient-to-position)
}

.to-\[\#ff671b\] {
    --tw-gradient-to: #ff671b var(--tw-gradient-to-position)
}

.to-\[\#ffdaa8\] {
    --tw-gradient-to: #ffdaa8 var(--tw-gradient-to-position)
}

.to-\[\#fff045\] {
    --tw-gradient-to: #fff045 var(--tw-gradient-to-position)
}

.to-\[var\(--secondary\)\] {
    --tw-gradient-to: var(--secondary) var(--tw-gradient-to-position)
}

.to-white {
    --tw-gradient-to: #fff var(--tw-gradient-to-position)
}

.to-20\% {
    --tw-gradient-to-position: 20%
}

.bg-100 {
    background-size: 100%
}

.bg-100h {
    background-size: 100% 100%
}

.bg-\[length\:100\%_98\%\] {
    background-size: 100% 98%
}

.bg-contain {
    background-size: contain
}

.bg-cover {
    background-size: cover
}

.bg-center {
    background-position: center
}

.bg-left-top {
    background-position: left top
}

.bg-no-repeat {
    background-repeat: no-repeat
}

.fill-\[url\(\#linear-gradient-home\)\] {
    fill: url(#linear-gradient-home)
}

.fill-black {
    fill: #000
}

.fill-white {
    fill: #fff
}

.object-fill {
    -o-object-fit: fill;
    object-fit: fill
}

.\!p-0 {
    padding: 0 !important
}

.\!p-2 {
    padding: .5rem !important
}

.p-0 {
    padding: 0
}

.p-0\.5 {
    padding: .125rem
}

.p-1 {
    padding: .25rem
}

.p-1\.5 {
    padding: .375rem
}

.p-2 {
    padding: .5rem
}

.p-2\.5 {
    padding: .625rem
}

.p-3 {
    padding: .75rem
}

.p-4 {
    padding: 1rem
}

.p-5 {
    padding: 1.25rem
}

.p-6 {
    padding: 1.5rem
}

.p-\[1\.5px\] {
    padding: 1.5px
}

.\!px-4 {
    padding-left: 1rem !important;
    padding-right: 1rem !important
}

.\!px-\[5\%\] {
    padding-left: 5% !important;
    padding-right: 5% !important
}

.\!py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
}

.\!py-2 {
    padding-top: .5rem !important;
    padding-bottom: .5rem !important
}

.\!py-3 {
    padding-top: .75rem !important;
    padding-bottom: .75rem !important
}

.px-0 {
    padding-left: 0;
    padding-right: 0
}

.px-0\.5 {
    padding-left: .125rem;
    padding-right: .125rem
}

.px-1 {
    padding-left: .25rem;
    padding-right: .25rem
}

.px-1\.5 {
    padding-left: .375rem;
    padding-right: .375rem
}

.px-10 {
    padding-left: 2.5rem;
    padding-right: 2.5rem
}

.px-16 {
    padding-left: 4rem;
    padding-right: 4rem
}

.px-2 {
    padding-left: .5rem;
    padding-right: .5rem
}

.px-2\.5 {
    padding-left: .625rem;
    padding-right: .625rem
}

.px-3 {
    padding-left: .75rem;
    padding-right: .75rem
}

.px-3\.5 {
    padding-left: .875rem;
    padding-right: .875rem
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1rem
}

.px-5 {
    padding-left: 1.25rem;
    padding-right: 1.25rem
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem
}

.px-7 {
    padding-left: 1.75rem;
    padding-right: 1.75rem
}

.px-8 {
    padding-left: 2rem;
    padding-right: 2rem
}

.px-\[3px\] {
    padding-left: 3px;
    padding-right: 3px
}

.px-\[42px\] {
    padding-left: 42px;
    padding-right: 42px
}

.px-\[5px\] {
    padding-left: 5px;
    padding-right: 5px
}

.px-\[7px\] {
    padding-left: 7px;
    padding-right: 7px
}

.py-0 {
    padding-top: 0;
    padding-bottom: 0
}

.py-0\.5 {
    padding-top: .125rem;
    padding-bottom: .125rem
}

.py-1 {
    padding-top: .25rem;
    padding-bottom: .25rem
}

.py-1\.5 {
    padding-top: .375rem;
    padding-bottom: .375rem
}

.py-2 {
    padding-top: .5rem;
    padding-bottom: .5rem
}

.py-2\.5 {
    padding-top: .625rem;
    padding-bottom: .625rem
}

.py-20 {
    padding-top: 5rem;
    padding-bottom: 5rem
}

.py-3 {
    padding-top: .75rem;
    padding-bottom: .75rem
}

.py-3\.5 {
    padding-top: .875rem;
    padding-bottom: .875rem
}

.py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem
}

.py-5 {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem
}

.py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem
}

.py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem
}

.py-\[10px\] {
    padding-top: 10px;
    padding-bottom: 10px
}

.py-\[1px\] {
    padding-top: 1px;
    padding-bottom: 1px
}

.py-\[2\.5px\] {
    padding-top: 2.5px;
    padding-bottom: 2.5px
}

.py-\[20px\] {
    padding-top: 20px;
    padding-bottom: 20px
}

.py-\[2px\] {
    padding-top: 2px;
    padding-bottom: 2px
}

.py-\[3px\] {
    padding-top: 3px;
    padding-bottom: 3px
}

.py-\[5px\] {
    padding-top: 5px;
    padding-bottom: 5px
}

.py-\[6px\] {
    padding-top: 6px;
    padding-bottom: 6px
}

.py-\[8px\] {
    padding-top: 8px;
    padding-bottom: 8px
}

.\!pr-0 {
    padding-right: 0 !important
}

.\!pt-0 {
    padding-top: 0 !important
}

.\!pt-4 {
    padding-top: 1rem !important
}

.pb-0 {
    padding-bottom: 0
}

.pb-0\.5 {
    padding-bottom: .125rem
}

.pb-1 {
    padding-bottom: .25rem
}

.pb-1\.5 {
    padding-bottom: .375rem
}

.pb-10 {
    padding-bottom: 2.5rem
}

.pb-12 {
    padding-bottom: 3rem
}

.pb-16 {
    padding-bottom: 4rem
}

.pb-2 {
    padding-bottom: .5rem
}

.pb-2\.5 {
    padding-bottom: .625rem
}

.pb-20 {
    padding-bottom: 5rem
}

.pb-24 {
    padding-bottom: 6rem
}

.pb-3 {
    padding-bottom: .75rem
}

.pb-4 {
    padding-bottom: 1rem
}

.pb-5 {
    padding-bottom: 1.25rem
}

.pb-6 {
    padding-bottom: 0.1rem
}

.pb-7 {
    padding-bottom: 1.75rem
}

.pb-8 {
    padding-bottom: 2rem
}

.pb-\[12px\] {
    padding-bottom: 12px
}

.pb-\[2px\] {
    padding-bottom: 2px
}

.pb-\[9px\] {
    padding-bottom: 9px
}

.pl-0 {
    padding-left: 0
}

.pl-0\.5 {
    padding-left: .125rem
}

.pl-1 {
    padding-left: .25rem
}

.pl-1\.5 {
    padding-left: .375rem
}

.pl-2 {
    padding-left: .5rem
}

.pl-2\.5 {
    padding-left: .625rem
}

.pl-3 {
    padding-left: .75rem
}

.pl-4 {
    padding-left: 1rem
}

.pl-5 {
    padding-left: 1.25rem
}

.pl-\[10\.5px\] {
    padding-left: 10.5px
}

.pl-\[22\%\] {
    padding-left: 22%
}

.pl-\[28\%\] {
    padding-left: 28%
}

.pl-\[4\%\] {
    padding-left: 4%
}

.pl-\[47px\] {
    padding-left: 47px
}

.pl-\[55px\] {
    padding-left: 55px
}

.pr-0 {
    padding-right: 0
}

.pr-0\.5 {
    padding-right: .125rem
}

.pr-1 {
    padding-right: .25rem
}

.pr-10 {
    padding-right: 2.5rem
}

.pr-2 {
    padding-right: .5rem
}

.pr-3 {
    padding-right: .75rem
}

.pr-4 {
    padding-right: 1rem
}

.pr-5 {
    padding-right: 1.25rem
}

.pr-6 {
    padding-right: 1.5rem
}

.pr-8 {
    padding-right: 2rem
}

.pr-9 {
    padding-right: 2.25rem
}

.pr-\[4px\] {
    padding-right: 4px
}

.pt-0 {
    padding-top: 0
}

.pt-0\.5 {
    padding-top: .125rem
}

.pt-1 {
    padding-top: .25rem
}

.pt-10 {
    padding-top: 2.5rem
}

.pt-12 {
    padding-top: 3rem
}

.pt-16 {
    padding-top: 4rem
}

.pt-2 {
    padding-top: .5rem
}

.pt-2\.5 {
    padding-top: .625rem
}

.pt-3 {
    padding-top: .75rem
}

.pt-3\.5 {
    padding-top: .875rem
}

.pt-32 {
    padding-top: 8rem
}

.pt-4 {
    padding-top: 1rem
}

.pt-5 {
    padding-top: 1.25rem
}

.pt-6 {
    padding-top: 1.5rem
}

.pt-7 {
    padding-top: 1.75rem
}

.pt-9 {
    padding-top: 2.25rem
}

.pt-\[12px\] {
    padding-top: 12px
}

.pt-\[5px\] {
    padding-top: 5px
}

.pt-\[8\%\] {
    padding-top: 8%
}

.pt-\[92px\] {
    padding-top: 92px
}

.pt-\[82px\] {
    padding-top: 82px
}

.pt-px {
    padding-top: 1px
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.gallery-detail__body {
    z-index: 10;
    height: 100%;
    width: 100%;
    background-color: var(--color3)
}

.gallery-detail__txtTitle {
    margin-bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 600;
    line-height: 1
}

.ant-btn.btn-back {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 50;
    margin: 0;
    display: flex;
    height: 100%;
    width: 2.25rem;
    align-items: center;
    justify-content: center;
    border-width: 0px;
    background-color: rgba(0, 0, 0, 0);
    padding: 0;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-shadow)
}

.ant-btn.btn-dropdown-turns {
    margin: 0;
    display: flex;
    height: 100%;
    width: 1.25rem;
    align-items: center;
    justify-content: center;
    border-width: 0px;
    background-color: rgba(0, 0, 0, 0);
    padding: 0;
    padding-left: .125rem;
    padding-right: .125rem;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-shadow)
}

@media(min-width: 375px) {
    .ant-btn.btn-dropdown-turns {
        width: 1.5rem
    }
}

.carousel-controller {
    margin-top: .5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: .75rem;
    padding-right: .75rem;
    --tw-text-opacity: 1;
    color: rgb(87 92 111/var(--tw-text-opacity))
}

.ant-btn.carousel-controller__button {
    height: 100%;
    width: 40%;
    border-radius: .5rem;
    border-style: none;
    --tw-bg-opacity: 1;
    background-color: rgb(228 230 237/var(--tw-bg-opacity));
    padding: .45rem
}

.ant-btn.carousel-controller__button {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.ant-btn.carousel-controller__button span {
    margin: 0;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    justify-self: center;
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight: 500;
    --tw-text-opacity: 1;
    color: rgb(121 123 136/var(--tw-text-opacity))
}

.ant-drawer-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    background-color: rgba(0, 0, 0, .4509803922);
    opacity: 0;
    transition: opacity .3s linear, height 0s ease .3s;
    pointer-events: none
}

.ant-drawer.ant-drawer-open .ant-drawer-mask {
    height: 100%;
    opacity: 1;
    transition: none;
    animation: antdDrawerFadeIn .3s cubic-bezier(0.23, 1, 0.32, 1);
    pointer-events: auto
}

.ant-drawer-content {
    position: relative;
    z-index: 1;
    overflow: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 0
}

.ant-drawer-top {
    top: 0
}

.ant-drawer {
    position: fixed;
    z-index: 1000;
    width: 0%;
    height: 100%;
    transition: width 0s ease .3s, height 0s ease .3s
}

.ant-drawer-top,
.ant-drawer-bottom {
    left: 0;
    width: 100%;
    height: 0%
}

.ant-drawer-top.ant-drawer-open,
.ant-drawer-bottom.ant-drawer-open {
    height: 100%;
    transition: transform .3s cubic-bezier(0.23, 1, 0.32, 1)
}

.z-20 {
    z-index: 20
}

.z-30 {
    z-index: 30
}

.sticky {
    position: sticky
}

.ant-image {
    position: relative;
    display: inline-block
}

.ant-image-img {
    width: 100%;
    height: auto;
    vertical-align: middle
}

.ant-btn-icon-only {
    width: 32px;
    height: 32px;
    padding: 2.4px 0;
    font-size: 16px;
    border-radius: 2px;
    vertical-align: -3px
}

#lottery-container-page .ant-btn.btn-back {
    position: relative;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-width: 0px;
    background-color: rgba(0, 0, 0, 0);
    padding: 0;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-shadow)
}

#lottery-container-page .ant-btn.btn-share {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    border-width: 0px;
    background-color: rgba(0, 0, 0, 0);
    padding: 0;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--tw-shadow)
}

#lottery-container-page .ant-btn.btn-share span {
    margin: 0;
    margin-left: .5rem;
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 400;
    --tw-text-opacity: 1;
    color: rgb(0 0 0/var(--tw-text-opacity))
}

.btn-share svg g {
    fill: var(--textTheme) !important
}

.btn-share svg path {
    color: var(--textTheme) !important;
    stroke: var(--textTheme) !important
}

.btn-share svg circle {
    color: var(--textTheme) !important;
    stroke: var(--textTheme) !important
}

.btn-share span {
    color: var(--textTheme) !important
}

.range-wrapper .range-item {
    width: 50%;
    height: 60px;
    background-size: contain;
    background-repeat: no-repeat;
    max-width: 190px
}


.range-wrapper .range-item p {
    line-height: 10px
}

.text-\[\#e51917\] {
    --tw-text-opacity: 1;
    color: rgb(229 25 23/var(--tw-text-opacity))
}

.leading-none {
    line-height: 1
}

img {
    vertical-align: middle;
    border-style: none
}

@media(min-width: 375px) {
    #page-wrap {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        height: 100%;
        max-height: 100vh;
        min-height: 100%;
        width: 100vw;
        overflow: hidden;
        overscroll-behavior: none;
        -ms-touch-action: none;
        -webkit-overflow-scrolling: touch
    }
}

#LotTabs {
    max-width: var(--max-width)
}

#LotTabs[data-fixed=fixed] {
    position: fixed;
    background: #fff;
    top: 60px;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 100;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .1)
}

#LotTabs .platform-list {
    display: flex;
    align-items: center;
    justify-content: space-around;
    border-radius: 6px;
    padding: 8px 0;
    font-size: 16px;
    text-align: center;
    background: #fff
}

#LotTabs .platform-list .item-body {
    display: flex;
    margin-right: 0;
    justify-content: center;
    align-items: center;
    padding: 6px 8px
}

#LotTabs .platform-list .item-body.Macao {
    color: var(--bgTheme)
}

#LotTabs .platform-list .item-body.Macao .lot-ico {
    background-image: url(/img/xam2.png)
}

#LotTabs .platform-list .item-body.Macao.act {
    color: #fff
}

#LotTabs .platform-list .item-body.Macao.act .lot-ico {
    background-image: url("/img/xam1.png")
}

#LotTabs .platform-list .item-body.Happy8 {
    color: #e60013
}

#LotTabs .platform-list .item-body.Happy8 .lot-ico {
    background-image: url(/img/kl2.png)
}

#LotTabs .platform-list .item-body.Happy8.act {
    color: #fff
}

#LotTabs .platform-list .item-body.Happy8.act .lot-ico {
    background-image: url(/img/kl1.png)
}

#LotTabs .platform-list .item-body.HongKong {
    color: #c10707
}

#LotTabs .platform-list .item-body.HongKong .lot-ico {
    background-image: url(/img/xg2.png)
}

#LotTabs .platform-list .item-body.HongKong.act {
    color: #fff
}

#LotTabs .platform-list .item-body.HongKong.act .lot-ico {
    background-image: url(/img/xg1.png)
}


#LotTabs .platform-list .lot-ico {
    display: inline-block;
    overflow: hidden;
    position: relative;
    width: 22px;
    height: 22px;
    margin-right: 2px;
    background-size: 100% 100%
}

#LotTabs .platform-list span {
    font-size: 13px
}

#LotTabs2 {
    max-width: var(--max-width);
    background: #f5f5f9
}

#LotTabs2[data-fixed=fixed] {
    position: fixed;
    top: 47px;
    left: 0;
    right: 0;
    margin: auto;
    z-index: 100;
    box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
    background: #efefef
}

#LotTabs2 .platform-list {
    display: flex;
    align-items: center;
    justify-content: space-around;
    border-top-left-radius: 6px;
    border-top-left-radius: 6px;
    padding: 1px 0 0;
    margin: 0 3px;
    font-size: 16px;
    text-align: center;
    border-bottom: 1px solid var(--bgTheme);
}

#LotTabs2 .platform-list li {
    flex: 1;
    margin-right: 2px
}

#LotTabs2 .platform-list .item-body {
    display: flex;
    margin-right: 0;
    justify-content: center;
    align-items: center;
    border-radius: 10px 10px 0 0;
    border: 1px solid var(--bgTheme);
    border-bottom: none
}

#LotTabs2 .platform-list .item-body.Macao .lot-ico {
    background-image: url(/img/xam2.png)
}

#LotTabs2 .platform-list .item-body.Macao.act {
    color: #fff
}

#LotTabs2 .platform-list .item-body.Macao.act .lot-ico {
    background-image: url(/img/xam1.png)
}

#LotTabs2 .platform-list .item-body.Happy8 .lot-ico {
    background-image: url(/img/lam2.png)
}

#LotTabs2 .platform-list .item-body.Happy8.act {
    color: #fff
}

#LotTabs2 .platform-list .item-body.Happy8.act .lot-ico {
    background-image: url(/img/lam1.png)
}

#LotTabs2 .platform-list .item-body.HongKong .lot-ico {
    background-image: url(/img/xg2.png)
}

#LotTabs2 .platform-list .item-body.HongKong.act {
    color: #fff
}

#LotTabs2 .platform-list .item-body.HongKong.act .lot-ico {
    background-image: url(/img/xg1.png)
}

#LotTabs2 .platform-list .item-body.HongKong1 .lot-ico {
    background-image: url(/img/tw2.png)
}

#LotTabs2 .platform-list .item-body.HongKong1.act {
    color: #fff
}

#LotTabs2 .platform-list .item-body.HongKong1.act .lot-ico {
    background-image: url(/img/tw1.png)
}



#LotTabs2 .platform-list li .act:after {
    content: none !important
}

#LotTabs2 .platform-list .lot-ico {
    display: inline-block;
    overflow: hidden;
    position: relative;
    width: 22px;
    height: 22px;
    margin-right: 2px;
    background-size: 100% 100%
}

#LotTabs2 .platform-list span {
    font-size: 13px
}



.top-gap {
    height: 50px
}

.top-gap-s {
    height: 50px
}

.slick-slider {
    position: relative;
    display: block;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}

.slick-list {
    position: relative;
    display: block;
    overflow: hidden;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: 0
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.slick-slider .slick-list,
.slick-slider .slick-track {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block
}

.slick-track:after,
.slick-track:before {
    display: table;
    content: ""
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    display: none;
    float: left;
    height: 100%;
    min-height: 1px
}

[dir=rtl] .slick-slide {
    float: right
}

.slick-slide img {
    display: block
}

.slick-slide.slick-loading img {
    display: none
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid rgba(0, 0, 0, 0)
}

.slick-arrow.slick-hidden {
    display: none
}

.slick-disabled {
    color: #ccc
}

.images-con {
    background: #000
}

.alllist .listbox .listone {
    padding: 5px 0;
    cursor: pointer;
    border-top: solid 1px #ddd;
    font-size: 14px;
    text-align: center;
    color: #777;
    background: #eee
}

.alllist .downlistbox .listone,
.alllist .downlistbox .listone a {
    color: #fff
}

.alllist .listbox .listone.act button {
    background: var(--bgTheme);
    color: #fff
}

.listdetail img {
    width: 100%;
    margin: 20px auto;
    min-height: 460px;
    color: #fff
}



.pic-wrap {
    position: relative
}

.pic-wrap .btn-collect {
    right: .75rem;
    top: .75rem;
    width: 30px;
    height: 30px
}

.pic-wrap .btn-collect img {
    width: 100%;
    height: 100%;
    min-height: auto !important;
    margin: 0
}

.ant-drawer-content-wrapper {
    overflow-y: auto
}

.bbs-info-list .bbs-info-item {
    border-left-width: 0;
    border-right-width: 0;
    border-top-width: 0
}

.bbs-info-list .title {
    font-size: 15px;
    line-height: 22px
}

.bbs-info-list .bottom {
    color: #999;
    font-size: 12px;
    align-items: center
}

.bbs-info-list .bottom .flag {
    border: 1px solid var(--primary);
    padding: 0 5px;
    border-radius: 2px;
    height: 20px;
    line-height: 20px
}


main {
    max-width: var(--max-width);
    width: 100%;
    margin: 0 auto;
    font-size: 15px;
    overflow-x: hidden
}

.home-main {
    margin: 0 auto
}

.bbs-header {
    padding: 10px
}

.bbs-header .avatar img {
    width: 40px;
    height: 40px;
    border-radius: 5px
}

.bbs-header .name {
    padding: 2Px 0 3Px 0;
    font-weight: 700;
    font-size: 14px;
    color: #999
}

.bbs-header .time {
    font-size: 12Px;
    color: #999;
    line-height: 1
}

.bbs-header .type {
    background-color: #f5f5f5;
    border-radius: 3px;
    padding: 3px 5px
}

.bbs-header .type .type-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-right: 3px
}

.bbs-header .his-pl {
    margin-top: 10px;
    width: 70px;
    text-align: center;
    height: 36px;
    line-height: 36px;
    background-color: var(--bgTheme);
    border-radius: 40px;
    color: #fff;
    font-size: 13px
}

.bbs-footer {
    padding: 10px;
    border-top: 1px solid #eee
}

.bbs-footer .type {
    border-radius: 3px;
    padding: 3px 5px
}

.bbs-footer .type .type-icon {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    margin-right: 3px
}

.bg-gray-bar {
    height: 10px;
    background: #f5f5f5
}

.bbs-d {
    background: #fff
}

.bbs-d .cell-bottom {
    padding: 0 20px
}

.bbs-d .cell-bottom>div {
    flex: 0 0 25%
}

.bbs-d .cell-bottom>div p {
    margin-top: 5px;
    font-size: 14px;
    line-height: 1.2;
    color: #333
}

.bbs-d .cell-bottom>div .cell-bottom-text {
    font-size: 13px;
    margin-top: 5px;
    color: #999;
    margin-bottom: 20px
}

.bbs-d .content {
    padding: 10px;
    line-height: 25px
}

.bbs-d .content .infos {
    padding: 10px;
    border-bottom: 1px solid #eee;
    margin-bottom: 15px
}

.bbs-d .content-title {
    font-size: 18px;
    font-weight: 700
}

.bbs-con-wrap .title {
    color: #444;
    font-weight: bold
}

.bbs-images-box .img-item {
    height: 90px;
    margin-bottom: 10px
}

.bbs-images-box .img-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 8px
}

.pswp__button--close {
    background: gray !important
}

#bigimg {
    width: 100%;
    height: 100%;
    position: fixed;
    background: rgba(0, 0, 0, .8);
    top: 0;
    display: none;
    align-items: center;
    z-index: 1000
}

#bigimg img {
    width: 100%;
    margin: auto;
    cursor: pointer
}

#icn-close {
    display: none;
    position: fixed;
    right: 10px;
    top: 10px;
    width: 22px;
    z-index: 1001
}

.cates {
    margin: 10px 0;
    border: 1px solid var(--bgTheme);
    border-radius: 5px;
    overflow: hidden
}

.cates .cate-item {
    text-align: center;
    border-right: 1px solid var(--bgTheme);
    background-color: #fff
}

.cates .cate-item.active {
    color: #fff;
    background-color: var(--bgTheme)
}

.cates .cate-item:last-child {
    border: none
}

.picture_lts {
    display: flex;
    position: fixed;
    bottom: 80px;
    right: 10px;
    z-index: 101
}

.u-icon {
    display: inline-block;
    width: 20px;
    height: 20px;
    background-size: contain !important;
    margin-right: 4px
}



.comment {
    background: #fff
}

.comment-form {
    padding: 10px
}

.comment-form .input-wrap {
    border: 1px solid var(--bgTheme);
    border-radius: 8px;
    margin-top: -4px;
    padding: 10px;
    position: relative;
    background: #fff
}

.comment-form .my-avatar {
    position: absolute;
    top: -38px;
    left: 15px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid #07c160;
    z-index: 10
}

.comment-form .textarea {
    height: 50px
}

.comment-form .comment-btns {
    margin-top: 5px
}



.comment-form .comment-btns .send {
    background: #009e4c;
    color: #fff;
    border-radius: 5px !important;
    padding: 0 20px;
    transition: all .25s ease;
    cursor: pointer;
    line-height: 30px
}

.comment-tab {
    padding: 0px
}

.comment-tab .comment-tab-item {
    display: flex;
    align-items: center;
    margin-right: 10px;
    color: #666
}

.comment-tab .comment-tab-item.active {
    color: #f13131
}

.comment-tab .comment-num {
    color: #666;
    margin-left: auto
}

.details-title {
    padding: 5px 10px
}

.title-bk {
    border-bottom: 1px solid #e8e8e8;
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 10px
}

.details-title .u-tit {
    font-size: 16px;
    position: relative
}

.comment-list .comment-list-item {
    padding: 10px;
    border-bottom: 1px solid #eee;
    font-size: 14px
}

.comment-list .comment-list-item:last-child {
    border-bottom: none
}

.comment-list .comment-list-item .avatar {
    width: 35px;
    height: 35px;
    border-radius: 5px
}

.comment-list .comment-list-item .nickname {
    color: #f13131
}

.comment-list .comment-list-item .time {
    color: #999;
    font-size: 12px
}

.comment-list .comment-list-item .floor {
    color: #999;
    white-space: nowrap
}

.comment-list .comment-list-item-span {
    margin-top: 10px
}

.comment-list .comment-list-item-content {
    margin-left: 10px
}



.comment-list .comment-list-item-content .to-user {
    margin-right: auto
}

.comment-list .comment-list-item-content .comment-list-item-span {
    margin-top: 3px
}

.comment-list .operate {
    color: #999;
    font-size: 12px
}

.comment-list .operate .m-nus {
    display: flex;
    align-items: center
}

.comment-list .operate .minus {
    width: 30px;
    height: 1px;
    background: #8c8c8c;
    display: inline-block
}

.comment-list .comment-list-item.sub {
    background-color: #f5f5f5
}

.comment-list .comment-list-item.sub .avatar {
    width: 25px;
    height: 25px
}

.dialog-need-input .layui-m-layercont {
    padding: 0 !important
}

.m-login {
    padding: 60px 1.75rem 20px
}

.m-login .login-tabs .tab {
    font-size: 16px;
    line-height: 20px;
    color: var(--bgTheme)
}

.m-login .u-zc {
    position: absolute;
    right: 28px;
    top: 15px;
    color: var(--bgTheme)
}

.m-login .u-login-close {
    top: 50px
}

.m-login .u-login-close span {
    border-radius: 50%;
    background: #999;
    color: #484848;
    width: 22px;
    display: inline-block;
    height: 22px;
    line-height: 22px
}

.m-login .u-site-logo {
    width: 86px;
    position: relative;
    top: -30px
}

#formReply {
    height: 100%;
    padding: 10px 20px
}

#formReply .textarea {
    width: 100%;
    height: 100px;
    padding: 10px;
    border: 1px solid #eee;
    border-radius: 5px;
    box-sizing: border-box
}

.layui-m-layerbtn span[yes] {
    background-color: var(--bgTheme) !important
}

.dialog-video {
    width: 100% !important;
    background: #fff
}

.dialog-video .icon-video-close {
    background: #555;
    border-radius: 50%;
    box-sizing: border-box;
    display: block;
    height: 25px;
    line-height: 24px;
    position: absolute;
    right: 10px;
    text-align: center;
    top: 10px;
    width: 24px;
    z-index: 99
}

.dialog-video .layui-m-layercont {
    padding: 0 !important;
    min-height: 230px
}

.dialog-video .layui-m-layercont video {
    width: 100%;
    min-height: 230px
}

.bbs-ft .cates {
    border: 1px solid var(--bgTheme);
    border-radius: 5px;
    overflow: hidden;
    margin-top: 10px
}

.bbs-ft .cates .cate-item {
    padding: 5px 10px;
    border-right: 1px solid var(--bgTheme);
    background-color: #fff
}

.bbs-ft .cates .cate-item.active {
    color: #fff;
    background-color: var(--bgTheme)
}

.bbs-ft .cates .cate-item:last-child {
    border: none
}

.bbs-ft .section {
    padding: 10px;
    background-color: #fff
}

.bbs-ft .input-form {
    border: 1px solid #eee;
    padding: 10px;
    border-radius: 5px;
    font-size: 14px
}

.bbs-ft .image {
    position: relative;
    width: 100px;
    height: 100px;
    border-radius: 5px;
    border: 1px solid #f5f5f5;
    margin-right: 13px;
    margin-bottom: 13px
}

.bbs-ft .image .img {
    width: 100%;
    height: 100%;
    border-radius: 5px
}

.bbs-ft .image .del {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: red;
    color: #fff
}

.bbs-ft .add {
    background-color: #f5f5f5
}

.bbs-ft .btn {
    background-color: var(--bgTheme);
    color: #fff;
    width: 90%;
    height: 45px;
    margin-top: 15px;
    font-size: 18px;
    border-radius: 50px;
    font-weight: bold
}

.upload-piclist {
    box-sizing: border-box;
    display: grid;
    justify-content: space-between;
    grid-gap: 14px
}


.upload-piclist .upload-file #file {
    width: 100%;
    height: 100%;
    opacity: 0
}

.upload-piclist .upload-Picitem {
    display: flex;
    justify-content: center;
    align-items: center
}

.upload-piclist .upload-Picitem img {
    margin: 0 auto
}

.ql-editor {
    min-height: 150px !important
}

.redClass {
    background: red;
    color: #fff
}

.blueClass {
    background: blue;
    color: #fff
}

.greenClass {
    background: #090;
    color: #fff
}

.bd {
    font-size: 14px
}

.fn-hr45 {
    height: 45px;
    display: block
}

.fn-hr50 {
    height: 50px;
    display: block
}

.fn-hr55 {
    height: 55px;
    display: block
}

.fn-hr60 {
    height: 60px;
    display: block
}

.cgi-zs .hd {
    height: 35px;
    line-height: 35px;
    font-size: 16px;
    overflow: hidden;
    background: #fff;
    margin-bottom: 5px
}

.cgi-zs .hd ul li {
    float: left;
    width: 16.66%;
    text-align: center;
    vertical-align: top
}

.cgi-zs .hd ul li.on a {
    color: red;
    display: block;
    height: 33px;
    line-height: 33px;
    border-bottom: 2px solid red
}

.cgi-zs .bd td {
    text-align: center;
    padding: 2px 0;
    border: 1px solid #ddd
}

.tableti td {
    background: #f8f8f8;
    border-bottom: 2px solid #666
}

.cgi-zs .bd td font {
    display: block
}

.cgi-zs .bd td i {
    color: #999;
    font-size: 10px
}

.cgi-zl .hd {
    height: 77px;
    padding-top: 10px;
    border-bottom: 1px solid #ddd;
    overflow: hidden
}

.cgi-zl .hd ul li {
    float: left;
    width: 20%;
    text-align: center
}

.cgi-zl .hd ul li span {
    display: block;
    width: 50%;
    height: 40px;
    margin: 0 auto 10px auto
}

.cgi-zl .hd ul li span img {
    height: 100%;
    width: auto
}

.cgi-zl .hd ul li.on a {
    display: block;
    padding-bottom: 5px;
    border-bottom: 3px solid red
}

.sxsuxing1 td {
    border-bottom: 1px solid #ddd;
    padding: 10px 0
}

.hongbospan span {
    margin: 3px 5px;
    float: left;
    width: 20px;
    height: 20px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: red
}

.lanbospan span {
    margin: 3px 5px;
    float: left;
    width: 20px;
    height: 20px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: #36f
}

.lvbospan span {
    margin: 3px 5px;
    float: left;
    width: 20px;
    height: 20px;
    color: #fff;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background: #093
}

.sxsuxing2 td {
    border-bottom: 1px solid #ddd;
    padding: 5px 0;
    overflow: hidden
}

.sxsuxing1 span,
.sxsuxing2 span {
    float: left;
    height: 20px;
    line-height: 20px;
    width: 20px;
    text-align: center;
    margin: 0 3px;
    color: #fff;
    font-size: 12px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%
}

.sxsuxing2 i {
    float: left;
    width: 50px;
    text-align: center;
    height: 20px;
    line-height: 20px
}

.sxsuxing3 td {
    border-bottom: 1px solid #ddd;
    padding: 5px 10px;
    overflow: hidden
}

.sxsuxing3 i {
    color: red
}

.bg_red {
    background: red
}

.bg_blue {
    background: #36f
}

.bg_green {
    background: #093
}

@media screen and (max-width: 320px) {

    .sxsuxing1 span,
    .sxsuxing2 span {
        margin: 0 2px
    }

    .sxsuxing2 i {
        width: 45px
    }
}

.kj-item {
    background: #ddd;
    padding-bottom: 8px
}

.kj-tit {
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    color: #777;
    font-size: 14px;
    background: #fff
}

.kj-box {
    padding-top: 8px;
    text-align: center;
    font: 14px/1.8 Tahoma
}

.kj-box .item-row {
    background: #fff;
    overflow: hidden;
    padding-bottom: 2px
}

.kj-box ul li {
    float: left;
    width: 13%
}

.kj-box ul li.kj-jia {
    width: 7%
}

.kj-box ul li dl dt {
    font-size: 18px;
    color: #333;
    font-weight: 700;
    text-align: center
}

.kj-box ul li dl dt .num {
    display: inline-block;
    color: #fff;
    font: 21px/32px Tahoma;
    width: 32px;
    text-align: center;
    font-weight: 700
}

.kj-box ul li dl dt.ball-red .num {
    background: #ec0909;
    border-radius: 50%
}

.kj-box ul li dl dt.ball-blue .num {
    background: #0060ff;
    border-radius: 50%
}

.kj-box ul li dl dt.ball-green .num {
    background: #3da224;
    border-radius: 50%
}

.kj-box ul li.kj-jia dl dt {
    font-size: 20px;
    height: 36px;
    box-sizing: border-box;
    padding-top: 2px
}

.kj-box ul li.kj-jia dl dd {
    font-size: 20px;
    height: 36px
}

.kj-box ul li dl dd {
    height: 30px;
    line-height: 30px
}

.kj-list .kj-box {
    padding-top: 0;
    background: #fff
}

ul.option-show {
    display: block;
    height: 30px;
    width: 100%;
    max-width: 800px;
    margin: 0;
    padding: 0
}

ul.option-show li {
    float: left;
    height: 26px;
    width: 25%;
    padding: 4px;
    box-sizing: border-box;
    list-style: none
}

ul.option-show li a {
    font-size: 15px;
    display: block;
    height: 26px;
    width: 100%;
    line-height: 26px;
    color: #000;
    background-color: #eee;
    text-align: center;
    border-radius: 4px;
    text-decoration: none
}

ul.option-show li.active a {
    color: #fff !important;
    background-color: #1fb61d
}

.panel {
    padding: 5px
}

.panel-header {
    display: flex;
    width: 100%
}

.panel-header>div {
    font-size: 13px;
    font-family: Arial, Helvetica, sans-serif
}

.panel-header .visit-show {
    flex: 1;
    text-align: center;
    padding: 3px 0
}

.wx-jin {
    color: #fc0
}

.wx-mu {
    color: #3c3
}

.wx-shui {
    color: #39f
}

.wx-huo {
    color: red
}

.wx-tu {
    color: #c90
}

.panel-header .end-show {
    flex: 1;
    line-height: 2em;
    text-align: right
}

.panel-body {
    display: block;
    width: 100%;
    min-height: 80px
}

.panel-body .item-row {
    display: block
}

.panel-body .item-box {
    float: left;
    width: 13.4%;
    margin: 5px .2%;
    text-align: center;
    background-color: #333;
    border-radius: 5px;
    min-height: 82px
}

.panel-body .plus {
    position: relative;
    float: left;
    width: 3.5%;
    min-height: 70px;
    margin: 5px 0
}

.panel-body .plus::after {
    content: "+";
    font-size: 2em;
    font-weight: bold;
    text-shadow: 1px 1px #000;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%)
}

.panel-body .item-box {
    position: relative
}

.panel-body .item-box.green {
    background-color: #1fb61d
}

.panel-body .item-box.blue {
    background-color: #2389e9
}

.panel-body .item-box.red {
    background-color: #e92323
}

.panel-body .item-box h2 {
    font-size: 22px;
    font-weight: 900;
    font-family: Tahoma, Geneva, sans-serif;
    line-height: 30px;
    margin: 5px 0;
    color: #fff;
    display: block
}

.panel-body .item-box .whsx {
    display: inline-block;
    height: 18px;
    width: auto;
    line-height: 18px;
    margin-top: 6px;
    padding: 2px 3px 1.22rem;
    min-width: 32px;
    border-radius: 2px;
    color: #333;
    font-size: 14px;
    font-weight: bold;
    background: #fff;
    margin-bottom: 5px;
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap
}

.panel-footer {
    font-size: 13px;
    padding: 5px 0;
    position: relative
}

.panel-footer p {
    margin: 0
}

.panel-footer a.refresh {
    right: 0;
    bottom: 0;
    font-size: .7em;
    color: #fff;
    background-color: #f90;
    padding: 2px;
    border-radius: 4px;
    margin-left: 4px;
    position: relative;
    bottom: 2px
}

#ball7 {
    margin: 5px 0
}

.panel-body {
    min-height: 64px
}

.panel-body .item-box {
    min-height: 60px;
    width: 13.3%
}

ul.option-show li {
    float: left;
    height: 26px;
    width: 25%;
    padding: 1px;
    box-sizing: border-box;
    list-style: none;
    font-weight: bold;
    font-size: 1.2em
}

ul.option-show {
    height: 24px
}

.panel-header {
    font-weight: bold
}

.panel-body .item-box {
    margin: 3px .2%
}

.panel-body .item-box h2 {
    margin: 0
}

.panel-footer {
    margin: 0;
    font-weight: bold
}

.panel-footer p {
    margin: 0;
    position: relative;
    top: -1px
}

.panel-body .plus {
    min-height: 55px
}

#ball7 {
    margin: 3px 0;
    margin-left: .8%
}

.panel-body .plus::after {
    font-size: 2.2em
}

#xctxt:hover {
    background-color: #eee
}

@media only screen and (max-width: 366px) {
    .panel-body .item-box .whsx {
        padding: 1px 2px;
        margin-top: 3px
    }

    .panel-body .item-box {
        min-height: 56px
    }

    .panel-body .item-box h2 {
        font-size: 20px
    }
}

.costumed-gallery-carouse .items-center .ant-image {
    width: 100%
}

.header-title {
    align-items: center;
    display: flex;
    justify-content: space-between;
    line-height: 40px;
    margin: 10px auto;
    padding: 0 10px
}

.header-title span {
    color: var(--bgTheme)
}

.header-title strong+a {
    color: #023b95
}

@media only screen and (max-width: 500px) {
    .header-title {
        margin: 0
    }
}

.item-video {
    margin-bottom: 0
}




.item-video .title {
    background: var(--bgTheme);
    box-sizing: border-box;
    color: #fff;
    display: inline-block;
    font-size: 18px;
    opacity: .9;
    text-align: center;
    text-indent: 4px;
    width: 100%
}

@media only screen and (max-width: 500px) {
    .item-video .title {
        font-size: 14px
    }
}

.live .row {
    box-sizing: border-box;
    display: block;
    margin: 0 -2px;
    padding: 0;
    position: relative;
    width: calc(100% + 4px)
}

.live .row:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden
}

.live .row .col-12 {
    box-sizing: border-box;
    float: left;
    padding: 0 2px;
    width: 50%
}

.live .review-video {
    padding-top: 10px
}

.live .review-video .title-video {
    font-size: 14px
}

.live .review-video .more-video {
    font-size: 20px !important;
    padding-right: 6px;
    text-align: right
}

.live .dialog {
    background: #fff;
    box-sizing: border-box;
    display: block;
    font-size: 16px;
    height: calc(100vh - 210px);
    left: 50%;
    letter-spacing: 2px;
    max-width: 375rpx;
    padding: 5px;
    position: fixed;
    top: 105px;
    transform: translate(-50%);
    width: 100vw;
    z-index: 9999
}

.live .dialog video {
    max-width: 375px;
    width: 100%
}

.live .dialog a.close {
    background: #555;
    border-radius: 50%;
    box-sizing: border-box;
    color: #023b95;
    display: block;
    height: 25px;
    line-height: 24px;
    position: absolute;
    right: 10px;
    text-align: center;
    top: 10px;
    width: 24px;
    z-index: 99
}

.live .dialog a.close img {
    position: relative;
    width: 100%
}

.live .layper-close {
    background-color: #000;
    display: block;
    height: 100vh;
    left: 0;
    opacity: .5;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 999
}

.live-video {
    padding: 20px
}

@media only screen and (max-width: 500px) {
    .live-video {
        padding: 0 10px
    }
}

.live-video .row .col-12 {
    padding: 10px 20px
}

@media only screen and (max-width: 500px) {
    .live-video .row .col-12 {
        padding: 5px
    }
}

.pickcode-result {
    padding: 6px 15px 15px;
    background: #fff;
    position: fixed;
    width: 100%;
    max-width: 480px;
    top: 44px;
    z-index: 9
}

.pickcode-result span {
    display: inline-block;
    height: 24px;
    width: 24px;
    line-height: 26px;
    text-indent: 4px;
    font-size: 12px;
    margin-right: 3px;
    color: #333;
    margin-bottom: 6px
}



.pickcode-result .result-content {
    border: 1px solid #c2c2c2;
    padding: 9px 7px;
    box-sizing: border-box;
    min-height: 140px;
    max-width: 480px
}

.pickcode-result .result-shama {
    border-width: .02rem;
    border-style: solid;
    border-color: #07c160 #c2c2c2 #c2c2c2;
    border-image: initial;
    padding: .18rem .14rem;
    box-sizing: border-box;
    min-height: .8rem
}

.pickcode-result .result-shama .font-s {
    font-size: .32rem;
    font-weight: 700;
    margin-bottom: .2rem
}

.pickcode-result .result-btn-box {
    display: flex;
    justify-content: space-between;
    margin-top: 13px
}

.pickcode-result .result-btn-box div {
    width: 75px;
    height: 32px;
    text-align: center;
    line-height: 32px;
    border: 1px solid var(--bgTheme);
    font-size: 14px;
    color: var(--bgTheme)
}

.pickcode-result .result-btn-box a {
    width: 75px;
    height: 32px;
    text-align: center;
    line-height: 32px;
    border: 1px solid var(--bgTheme);
    font-size: 14px;
    color: var(--bgTheme);
    display: block;
    text-decoration: none
}

.tmzs-wrap {
    margin: 5px 0;
    -moz-border-radius: 4px;
    border-radius: 4px
}

.tmzs-wrap div.tmzs {
    padding: 6px
}

.tmzs-wrap div.tmzs div.anBtn {
    background: #fffef9
}

.tmzs-wrap div.tmzs div.anBtn div.tmzsResult {
    height: 163px;
    border: 1px solid #c9c9c9;
    border-radius: 5px;
    padding: 3px
}

.tmzs-wrap div.tmzs div.anBtn div.tmzsResult .ball_box {
    display: inline-block;
    width: 10%;
    text-align: center;
    float: left;
    padding: 2px
}

.tmzs-wrap div.tmzs div.tmzsTable table {
    border-collapse: collapse;
    text-align: center;
    width: 100%;
    margin: 10px 0 2px 0;
    border: 1px solid #c9c9c9
}

.tmzs-wrap div.tmzs div.tmzsTable table tr.borTop {
    border-top: 1px solid #c9c9c9
}

.tmzs-wrap div.tmzs div.tmzsTable table tr.borBtm {
    border-bottom: 1px solid #c9c9c9
}

.tmzs-wrap div.tmzs div.tmzsTable table tr td {
    text-align: center;
    padding: 0 5px
}

.tmzs-wrap div.tmzs div.tmzsTable table tr.borBtm td>div {
    margin-bottom: 8px
}

.tmzs-wrap div.tmzs div.tmzsTable table tr td h3 {
    font-size: 16px;
    color: red
}

.tmzs-wrap div.tmzs div.tmzsTable table tr td span {
    display: inline-block;
    border: 1px solid #ccc;
    height: 27px;
    line-height: 27px;
    width: 100%;
    border-radius: 4px;
    font-size: 13px;
    color: #fff;
    margin: 8px 0;
    background: #79c4be
}

.tmzs-wrap div.tmzs div.tmzsTable table tr td div {
    border: 1px solid #ccc;
    height: 27px;
    line-height: 27px;
    width: 100%;
    border-radius: 4px;
    font-size: 13px;
    margin-top: 8px;
    background: #f6f6f6
}

.tmzs-wrap div.tmzs div.tmzsTable table tr td.borRgt {
    border-right: 1px solid #c9c9c9
}

.tmzs-wrap div.tmzs div.tmzsTable table tr td.borRgt div {
    margin-top: 6px;
    margin-bottom: 6px
}

.tmzs-wrap div.tmzs div.tmzsTable table tr td .hover {
    border: 1px solid #e57149;
    color: #fff;
    background-color: #e57149
}

.blueBall,
.greenBall,
.redBall {
    display: inline-block;
    width: 27px;
    height: 27px;
    background: url(/img/balls.png) no-repeat 0 0;
    background-size: 55px 55px;
    line-height: 23px;
    font-size: 14px;
    color: #303030;
    font-weight: 700;
    text-align: center
}

.greenBall {
    background-position: -28px 0
}

.redBall {
    background-position: 0 -28px
}

.scroll-web-txt {
    background: #fff
}

.scroll-web-txt ul li {
    float: left;
    width: 33.33%;
    list-style: none
}

.scroll-web-txt ul li img {
    width: 16px;
    height: 16px;
    margin-right: 5px
}

.scroll-web-txt ul li a {
    color: #333;
    font-weight: normal;
    height: 35px;
    line-height: 35px;
    margin: 0;
    text-align: center;
    text-decoration: none;
    border: solid 1px #ddd;
    border-radius: 5px;
    background: #eee;
    background-image: linear-gradient(to top, #eee, #fff);
    box-shadow: 0 2px 5px rgba(0, 0, 0, .1);
    display: block
}

@media screen and (max-width: 800px) {
    .scroll-web-txt ul li {
        width: 50%
    }
}

.footer-download {
    text-align: center;
    line-height: 32px;
    width: 100%;
    left: 0;
    right: 0;
    position: fixed;
    background: red;
    color: #fff;
    bottom: 0;
    z-index: 1000;
    max-width: var(--max-width);
    margin: 0 auto
}

.footer-download .u-download {
    background-color: #000
}

.footer-download .u-download .btn {
    height: 25px;
    line-height: 25px;
    width: 70px;
    text-align: left;
    background-color: #ec0909;
    bottom: 0;
    top: 0;
    margin: auto 10px auto 10px;
    font-size: 14px;
    border: none;
    border-radius: 5px;
    padding: 0;
    color: #fff;
    display: inline-block;
    cursor: pointer
}

.footer-download .u-download span {
    display: inline-block;
    width: 57px;
    height: 23px;
    vertical-align: middle;
    background-size: 100% 100%
}

.footer-download .u-download p {
    margin: auto 0;
    padding-left: 10px;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    line-height: 34px;
    text-indent: 3px;
    white-space: nowrap;
    text-align: left
}

.footer-download .btn-close {
    position: absolute;
    width: 60px;
    right: 3px;
    bottom: 3px;
    height: 18px;
    line-height: 18px;
    color: #fff;
    background: red;
    opacity: 1
}

.grok-snap {
    z-index: 999999999;
    display: none;
    justify-content: center;
    align-items: center;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    line-height: 1.4
}

.grok-snap2 {
    z-index: 999999998;
    display: none;
    justify-content: center;
    align-items: center;
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, .7)
}

.grok-snap a {
    text-decoration: none;
    color: inherit
}

.grok-snap a:hover {
    text-decoration: none
}

.grok-snap .grok-snap-close {
    display: inline-block;
    height: 36px;
    line-height: 36px;
    padding: 0 15px;
    color: #fff;
    position: absolute;
    top: 0;
    right: 0
}

.grok-snap .grok-snap-tit span {
    display: inline-block;
    padding: 0 10px;
    position: absolute;
    top: 0;
    right: 0
}

.grok-snap .grok-snap-con3 {
    padding: 10px
}

.grok-snap .grok-snap-con3 table {
    font-weight: bold;
    border-collapse: collapse
}

.grok-snap .grok-snap-con4 {
    text-align: center
}

.grok-snap .grok-snap-tzg7 {
    color: #fff;
    position: absolute;
    top: -14px;
    left: 26%;
    width: 150px;
    height: 33px;
    background-color: red;
    border-radius: 70px 70px 0 0;
    background-size: 150px 33px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-family: Microsoft Yahei, PingFangTC-Regular, sans-serif;
    font-weight: 500;
    font-size: 20px
}

.grok-snap .grok-snap-bd {
    width: 320px;
    padding: 0 5px;
    box-sizing: border-box;
    border-radius: 15px;
    font-size: 14px;
    color: #333;
    font-family: "微软雅黑";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.grok-snap .grok-snap-con {
    padding: 10px 0;
    border-radius: 15px;
    background: #fff
}

.grok-snap .grok-snap-con1 {
    text-align: center;
    margin-top: 10px
}

.grok-snap .grok-snap-con2-tit {
    display: flex;
    justify-content: center;
    padding-bottom: 5px
}

.grok-snap .grok-snap-con2-tit span {
    display: inline-block;
    width: 26px;
    line-height: 26px;
    margin-left: -3px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    border-radius: 50%;
    background: #0e66ec
}

.grok-snap .grok-snap-con2-logo {
    display: flex;
    justify-content: center;
    height: 60px
}

.grok-snap .grok-snap-con2-logol {
    color: #0e66ec;
    font-size: 70px;
    line-height: 60px;
    font-weight: bold;
    font-family: impact
}

.grok-snap .grok-snap-con2-logor {
    width: 60px;
    position: relative
}

.grok-snap .grok-snap-con2-logor-txt1 span {
    display: inline-block;
    width: 50px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    color: #fff;
    border-radius: 5px;
    background: #0e66ec;
    position: absolute;
    left: 20px;
    top: 2px
}

.grok-snap .grok-snap-con2-logor-txt2 {
    line-height: 38px;
    color: #0e66ec;
    font-size: 40px;
    position: absolute;
    top: 24px;
    left: 0;
    font-family: impact
}

.grok-snap .grok-snap-con3 th {
    text-align: center;
    color: #fff;
    border: solid 1px #999;
    background: #0e66ec;
    padding: 3px 10px
}

.grok-snap .grok-snap-con3 td {
    text-align: center;
    border: solid 1px #999;
    font-size: 16px;
    height: 30px
}

.grok-snap .grok-snap-con4 span {
    display: inline-block;
    width: 200px;
    height: 40px;
    line-height: 40px;
    font-size: 20px;
    font-weight: bold;
    color: #ff0;
    border-radius: 10px;
    background: #0e66ec
}

.grok-snap .grok-snap-con4 span>span {
    font-size: 20pt;
    animation: effectScale .3s infinite
}

@keyframes effectScale {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(0.9)
    }
}

.g-profile-top .ant-image-img {
    border-radius: 50%
}

.pagination {
    padding: 3px 0;
    display: flex;
    margin: 0 auto 10px;
    font-size: 12px;
    border-top: solid 1px #dedede;
    border-bottom: solid 1px #dedede;
    justify-content: center
}

.pagination>p {
    font-size: 14px
}

.pagination li {
    display: inline-block;
    float: left
}

.pagination a,
.pagination span {
    border: 1px solid #dadada;
    color: #777;
    padding: 5px 8px;
    text-decoration: none;
    text-shadow: 0 1px 0 #fff
}

.pl-thread-page span,
.pl-thread-page a {
    text-decoration: none;
    height: 18px;
    line-height: 18px;
    margin-left: 6px;
    padding: 0 5px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    display: inline-block
}

.pl-thread-page a {
    color: #d32;
    background: #f8f8f8
}

.pl-thread-page .active a {
    border: solid 1px var(--bgTheme);
    color: #777
}

.m-set {
    height: 100vh;
    background: #f5f5f5
}

.m-set .set-list {
    padding-bottom: 10px
}

.m-changenickname {
    height: 100vh;
    background: #fff
}

.g-input {
    background: #f5f5f5;
    border-radius: 4px;
    padding: 10px 16px
}

.g-input .label {
    display: inline-block;
    width: 50px;
    margin-right: 12px
}

.g-input input {
    background: #f5f5f5
}

.g-input input:focus {
    outline: none
}

.m-changenickname .g-input .label {
    width: 60px
}

.appbar .btn-back {
    position: relative !important
}

.appbar .btn-back svg path {
    stroke: var(--textTheme) !important
}

.appbar label {
    color: var(--textTheme) !important
}

.appbar-fixed {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    max-width: 768px;
    margin: 0 auto;
    right: 0
}

.u-cell {
    position: relative;
    color: #000
}

.u-cell:after {
    position: absolute;
    box-sizing: border-box;
    content: " ";
    pointer-events: none;
    right: 12px;
    bottom: 0;
    left: 12px;
    border-bottom: 1px solid #ececec;
    transform: scaleY(0.5)
}

.u-cell .u-cell-value {
    position: relative;
    overflow: hidden;
    text-align: right;
    vertical-align: middle;
    word-wrap: break-word
}

.u-cell i {
    display: inline-block;
    width: 18px;
    background: url("/img/arrow-right.png") no-repeat;
    background-size: cover
}

#ArticleList a:link {
    color: #666
}



.news-box {
    font-weight: bold;
    background: var(--bgTheme);
    color: #fff;
    text-align: center;
    border-radius: 5px
}

.box-shad-wrap {
    background: #eee;
    padding: 5px
}

.box-shad-wrap .box-shad {
    padding: 10px;
    border-radius: 10px;
    background-color: #fff
}

.box-shad-wrap .box-shad>div span {
    display: inline-block;
    margin-top: 5px
}

.float-btn-l {
    position: fixed;
    left: 15px;
    z-index: 101;
    bottom: 217px;
    width: 62px;
    height: 62px;
    z-index: 1001
}

@media only screen and (max-width: 500px) {
    .float-btn-l {
        right: 10px;
        bottom: 170px;
        width: 60px;
        height: 60px
    }
}



.float-btn-l .icon-btn-l.oft0 {
    transform: rotate(180deg)
}

.float-btn-l .icon-tool-btn-l {
    position: absolute;
    top: 0;
    left: -170px;
    text-align: center;
    transition: all .4s;
    font-size: 18px
}

.float-btn-l .icon-tool-btn-l>span,
.float-btn-l .icon-tool-btn-l>a {
    width: 70px;
    height: 70px;
    display: inline-block;
    text-align: center;
    line-height: 40px;
    border-radius: 50%;
    font-size: 18px
}

@media only screen and (max-width: 500px) {

    .float-btn-l .icon-tool-btn-l>span,
    .float-btn-l .icon-tool-btn-l>a {
        width: 54px;
        height: 54px;
        line-height: 40px
    }
}

.float-btn-l .icon-tool-btn-l span img {
    width: 100%;
    height: 100%;
    margin-top: 6.4px
}

.float-btn-l .icon-tool-btn-l label {
    position: absolute;
    color: #fff;
    padding: 3.84px;
    white-space: nowrap;
    left: 76.8px;
    top: 5px !important;
    line-height: 28px
}

@media only screen and (max-width: 500px) {
    .float-btn-l .icon-tool-btn-l label {
        left: 53px;
        top: 17px;
        font-size: 15px;
        padding: 0;
        top: 5px !important
    }
}

.float-btn-l.float6 .icon-tool-btn-l label {
    position: absolute;
    color: #fff;
    padding-right: 5px;
    white-space: nowrap;
    right: 44px;
    top: 10px;
    line-height: 28px;
    font-size: 16px
}

@media only screen and (max-width: 500px) {
    .float-btn-l.float6 .icon-tool-btn-l label {
        right: 44px;
        top: 10px;
        font-size: 12px;
        padding: 0;
        top: 5px !important
    }
}

.float-btn-l.float6 .icon-tool-btn-l.oft1.show {
    left: -4px;
    top: -80px
}

.float-btn-l.float6 .icon-tool-btn-l.oft2.show {
    left: 54px;
    top: -37px
}

.float-btn-l.float6 .icon-tool-btn-l.oft3.show {
    left: 92px;
    top: 16px
}

.float-btn-l.float6 .icon-tool-btn-l.oft4.show {
    left: 90px;
    top: 81px
}

.float-btn-l.float6 .icon-tool-btn-l.oft5.show {
    left: 58px;
    top: 138px
}

.float-btn-l.float6 .icon-tool-btn-l.oft6.show {
    left: 0px;
    top: 186px
}

@media only screen and (max-width: 500px) {
    .float-btn-l.float6 .icon-tool-btn-l.oft1.show {
        left: -5px;
        top: -60px
    }

    .float-btn-l.float6 .icon-tool-btn-l.oft2.show {
        left: 49px;
        top: -23px
    }

    .float-btn-l.float6 .icon-tool-btn-l.oft3.show {
        left: 80px;
        top: 20px
    }

    .float-btn-l.float6 .icon-tool-btn-l.oft4.show {
        left: 81px;
        top: 70px
    }

    .float-btn-l.float6 .icon-tool-btn-l.oft5.show {
        left: 46px;
        top: 108px
    }

    .float-btn-l.float6 .icon-tool-btn-l.oft6.show {
        left: 1px;
        top: 144px
    }
}

.float-btn-l.float5 .icon-tool-btn-l label {
    position: absolute;
    color: #fff;
    padding-left: 5px;
    white-space: nowrap;
    left: 44px;
    top: 10px;
    line-height: 28px;
    font-size: 16px
}

@media only screen and (max-width: 500px) {
    .float-btn-l.float5 .icon-tool-btn-l label {
        left: 44px;
        top: 10px;
        font-size: 13px;
        padding: 0
    }
}

.float-btn-l.float5 .icon-tool-btn-l.oft1.show {
    left: 13px;
    top: -42px
}

.float-btn-l.float5 .icon-tool-btn-l.oft2.show {
    left: 57px;
    top: -7px
}

.float-btn-l.float5 .icon-tool-btn-l.oft3.show {
    left: 91px;
    top: 43px
}

.float-btn-l.float5 .icon-tool-btn-l.oft4.show {
    left: 66px;
    top: 97px
}

.float-btn-l.float5 .icon-tool-btn-l.oft5.show {
    left: 15px;
    top: 132px
}

.float-btn-l.float5 .icon-tool-btn-l>span,
.float-btn-l.float5 .icon-tool-btn-l>a {
    width: 45px;
    height: 45px
}

@media only screen and (max-width: 500px) {
    .float-btn-l.float5 .icon-tool-btn-l.oft1.show {
        left: 13px;
        top: -42px
    }

    .float-btn-l.float5 .icon-tool-btn-l.oft2.show {
        left: 57px;
        top: -7px
    }

    .float-btn-l.float5 .icon-tool-btn-l.oft3.show {
        left: 80px;
        top: 32px
    }

    .float-btn-l.float5 .icon-tool-btn-l.oft4.show {
        left: 58px;
        top: 76px
    }

    .float-btn-l.float5 .icon-tool-btn-l.oft5.show {
        left: 15px;
        top: 112px
    }
}

.float-btn-l.float4 .icon-tool-btn-l label {
    position: absolute;
    color: #fff;
    padding-right: 5px;
    white-space: nowrap;
    left: 48px;
    top: 10px;
    line-height: 28px;
    font-size: 16px
}

@media only screen and (max-width: 500px) {
    .float-btn-l.float4 .icon-tool-btn-l label {
        left: 48px;
        top: 10px;
        font-size: 13px;
        padding: 0
    }
}

.float-btn-l.float4 .icon-tool-btn-l.oft1.show {
    left: 20px;
    top: -40px
}

.float-btn-l.float4 .icon-tool-btn-l.oft2.show {
    left: 82px;
    top: 6px
}

.float-btn-l.float4 .icon-tool-btn-l.oft3.show {
    left: 86px;
    top: 70px
}

.float-btn-l.float4 .icon-tool-btn-l.oft4.show {
    left: 18px;
    top: 120px
}

.float-btn-l.float4 .icon-tool-btn-l>span,
.float-btn-l.float4 .icon-tool-btn-l>a {
    width: 48px;
    height: 48px
}

@media only screen and (max-width: 500px) {
    .float-btn-l.float4 .icon-tool-btn-l.oft1.show {
        left: 13px;
        top: -42px
    }

    .float-btn-l.float4 .icon-tool-btn-l.oft2.show {
        left: 66px;
        top: 0px
    }

    .float-btn-l.float4 .icon-tool-btn-l.oft3.show {
        left: 68px;
        top: 59px
    }

    .float-btn-l.float4 .icon-tool-btn-l.oft4.show {
        left: 15px;
        top: 103px
    }
}

.van-overlay {
    background: rgba(0, 0, 0, .7019607843);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
    display: none
}

.van-overlay.show {
    display: block
}

.btn-back-l {
    position: absolute;
    left: 0;
    top: 23px;
    z-index: 10;
    display: none;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    background: linear-gradient(rgb(107, 148, 255), #3863ff);
    width: 100%;
    height: 100%
}

.btn-back-l>span {
    color: #fff;
    font-size: 15px
}

.float-btn-r {
    position: fixed;
    right: 15px;
    z-index: 101;
    bottom: 217px;
    width: 102px;
    height: 102px;
    z-index: 1001
}

@media only screen and (max-width: 500px) {
    .float-btn-r {
        right: 10px;
        bottom: 170px;
        width: 80px;
        height: 80px
    }
}

.float-btn-r .icon-btn-r {
    display: inline-block;
    background-image: url(/img/jia.png);
    background-size: 100% 100%;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: -38px;
    z-index: 10;
    transition: all .4s
}

.float-btn-r .icon-btn-r {
    top: 10px
}

.float-btn-r .icon-btn-r.oft0 {
    transform: rotate(180deg);
    background-image: url(/img/jian.png)
}

.float-btn-r .icon-tool-btn {
    position: absolute;
    top: 0;
    right: -100px;
    text-align: center;
    transition: all .4s;
    font-size: 18px;
    opacity: 0
}

.float-btn-r .icon-tool-btn>span,
.float-btn-r .icon-tool-btn>a {
    width: 50px;
    height: 50px;
    display: inline-block;
    text-align: center;
    line-height: 40px;
    border-radius: 50%;
    font-size: 18px
}

@media only screen and (max-width: 500px) {

    .float-btn-r .icon-tool-btn>span,
    .float-btn-r .icon-tool-btn>a {
        width: 40px;
        height: 40px;
        line-height: 40px
    }
}

.float-btn-r .icon-tool-btn span img {
    width: 100%;
    height: 100%;
    margin-top: 6.4px
}

.float-btn-r .icon-tool-btn.show {
    opacity: 1
}

.float-btn-r.float6 .icon-tool-btn label {
    position: absolute;
    color: #fff;
    padding-right: 5px;
    white-space: nowrap;
    right: 44px;
    top: 10px;
    line-height: 28px;
    font-size: 16px
}

@media only screen and (max-width: 500px) {
    .float-btn-r.float6 .icon-tool-btn label {
        right: 44px;
        top: 10px;
        font-size: 12px;
        padding: 0
    }
}

.float-btn-r.float6 .icon-tool-btn.oft1.show {
    right: 13px;
    top: -58px
}

.float-btn-r.float6 .icon-tool-btn.oft2.show {
    right: 57px;
    top: -23px
}

.float-btn-r.float6 .icon-tool-btn.oft3.show {
    right: 90px;
    top: 21px
}

.float-btn-r.float6 .icon-tool-btn.oft4.show {
    right: 90px;
    top: 71px
}

.float-btn-r.float6 .icon-tool-btn.oft5.show {
    right: 53px;
    top: 115px
}

.float-btn-r.float6 .icon-tool-btn.oft6.show {
    right: 7px;
    top: 140px
}

@media only screen and (max-width: 500px) {
    .float-btn-r.float6 .icon-tool-btn.oft1.show {
        right: 13px;
        top: -58px
    }

    .float-btn-r.float6 .icon-tool-btn.oft2.show {
        right: 57px;
        top: -23px
    }

    .float-btn-r.float6 .icon-tool-btn.oft3.show {
        right: 80px;
        top: 19px
    }

    .float-btn-r.float6 .icon-tool-btn.oft4.show {
        right: 80px;
        top: 64px
    }

    .float-btn-r.float6 .icon-tool-btn.oft5.show {
        right: 51px;
        top: 97px
    }

    .float-btn-r.float6 .icon-tool-btn.oft6.show {
        right: 10px;
        top: 130px
    }
}

.float-btn-r.float5 .icon-tool-btn label {
    position: absolute;
    color: #fff;
    padding-right: 5px;
    white-space: nowrap;
    right: 44px;
    top: 10px;
    line-height: 28px;
    font-size: 16px
}

@media only screen and (max-width: 500px) {
    .float-btn-r.float5 .icon-tool-btn label {
        right: 44px;
        top: 10px;
        font-size: 13px;
        padding: 0
    }
}

.float-btn-r.float5 .icon-tool-btn.oft1.show {
    right: 13px;
    top: -42px
}

.float-btn-r.float5 .icon-tool-btn.oft2.show {
    right: 57px;
    top: -7px
}

.float-btn-r.float5 .icon-tool-btn.oft3.show {
    right: 91px;
    top: 43px
}

.float-btn-r.float5 .icon-tool-btn.oft4.show {
    right: 66px;
    top: 97px
}

.float-btn-r.float5 .icon-tool-btn.oft5.show {
    right: 15px;
    top: 132px
}

.float-btn-r.float5 .icon-tool-btn>span,
.float-btn-r.float5 .icon-tool-btn>a {
    width: 45px;
    height: 45px
}

@media only screen and (max-width: 500px) {
    .float-btn-r.float5 .icon-tool-btn.oft1.show {
        right: 13px;
        top: -42px
    }

    .float-btn-r.float5 .icon-tool-btn.oft2.show {
        right: 57px;
        top: -7px
    }

    .float-btn-r.float5 .icon-tool-btn.oft3.show {
        right: 80px;
        top: 32px
    }

    .float-btn-r.float5 .icon-tool-btn.oft4.show {
        right: 58px;
        top: 76px
    }

    .float-btn-r.float5 .icon-tool-btn.oft5.show {
        right: 15px;
        top: 103px
    }
}

.float-btn-r.float4 .icon-tool-btn label {
    position: absolute;
    color: #fff;
    padding-right: 5px;
    white-space: nowrap;
    right: 44px;
    top: 10px;
    line-height: 28px;
    font-size: 16px
}

@media only screen and (max-width: 500px) {
    .float-btn-r.float4 .icon-tool-btn label {
        right: 48px;
        top: 10px;
        font-size: 13px;
        padding: 0
    }
}

.float-btn-r.float4 .icon-tool-btn.oft1.show {
    right: 20px;
    top: -40px
}

.float-btn-r.float4 .icon-tool-btn.oft2.show {
    right: 82px;
    top: 6px
}

.float-btn-r.float4 .icon-tool-btn.oft3.show {
    right: 86px;
    top: 70px
}

.float-btn-r.float4 .icon-tool-btn.oft4.show {
    right: 18px;
    top: 120px
}

.float-btn-r.float4 .icon-tool-btn>span,
.float-btn-r.float4 .icon-tool-btn>a {
    width: 48px;
    height: 48px
}

@media only screen and (max-width: 500px) {
    .float-btn-r.float4 .icon-tool-btn.oft1.show {
        right: 13px;
        top: -42px
    }

    .float-btn-r.float4 .icon-tool-btn.oft2.show {
        right: 66px;
        top: 0px
    }

    .float-btn-r.float4 .icon-tool-btn.oft3.show {
        right: 68px;
        top: 59px
    }

    .float-btn-r.float4 .icon-tool-btn.oft4.show {
        right: 15px;
        top: 103px
    }
}

.fubiaoo {
    z-index: 900
}

/*# sourceMappingURL=style.css.map */