::-webkit-scrollbar {
    background-color: gray;
    border-radius: 2.5px;
    width: 3px;
}

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

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

h1,
h2,
h3,
h4,
h5,
h6,
p {
    color: #fff;
}

/* 
@font-face {
    font-family: "NotoSansRegular";
    src: url(../fonts/nato-sans/NotoSans-Regular.ttf);
}

@font-face {
    font-family: "NotoSansBold";
    src: url(../fonts/nato-sans/NotoSans-Bold.ttf);
} */

@font-face {
    font-family: "NotoSans";
    src: url(../fonts/nato-sans/NotoSans-Regular.ttf);
    font-weight: 400;
}


@font-face {
    font-family: "NotoSans";
    src: url(../fonts/nato-sans/NotoSans-Bold.ttf);
    font-weight: 500;
}

body {
    background: #0f0617 !important;
    font-family: "NotoSans";
}

header {
    position: sticky;
    top: 0;
    z-index: 100;
}

.main-header {
    margin-top: 8px;
    padding: 0 25px;
    background: #0f0617;
}

nav {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.left-items {
    display: flex;
}

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


.icon-r-bx,
.flip-container {
    perspective: 200px;
    margin-left: 3px;
}

/*speed of transition*/
.icon-r-ani,
.flipper {
    transform-style: preserve-3d;
    position: relative;
    animation: anim 8s infinite;
    transform-origin: center;
}

.icon-r-bx,
.icon-r-ani,
.icon-r-ani .icons-f,
.icon-r-ani .icons-b {
    width: 33px;
    height: 33px;
    margin-bottom: 8px;
}

.icon-r-ani .icons-f,
.icon-r-ani .icons-b,
.front,
.back {
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
}

.icon-r-ani .icons-f {
    background-image: url(../img/pro.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    z-index: 2;
}

.icon-r-ani .icons-b {
    background-image: url(../img/pro.svg);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    transform: rotateY(180deg);
}


@keyframes anim {

    0%,
    5% {
        transform: rotatey(0deg);
    }

    45%,
    50% {
        transform: rotatey(180deg);
    }

    100% {
        transform: rotatey(360deg);
    }

}


.logo img {
    width: 100px;
}

.nav-items-show {
    display: none;
}

.nav-menu-items ul {
    white-space: nowrap;
    overflow-y: hidden;
    overflow-x: auto;
    display: flex;
    margin-bottom: 0 !important;
}

.nav-menu-items ul li {
    display: inline;
    margin: 16px 0;
    padding: 9px 16px;
}

.nav-menu-items ul li a {
    font-family: "NotoSans";
    font-weight: 400;
    font-size: 15px;
    color: #ffffffd9;
    text-decoration: none;
    text-align: center;
    padding: 10px 0;
    transition: all .5s;
    position: relative;
}

.nav-menu-items ul li a:hover {
    color: #fff;
    text-align: center;
}

/*
.nav-menu-items ul li a.active {

    color: #fff;
    text-decoration: underline;
} */

.nav-menu-items ul li:hover>a::after {
    opacity: 1;
    transition: width .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93);
    width: 100%;
}

.nav-menu-items ul li a::after {
    background: #fff;
    bottom: 0;
    content: "";
    height: 2px;
    left: 0;
    margin: auto;
    opacity: 0;
    position: absolute;
    right: 0;
    transition: width .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93), opacity .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93);
    width: 0;
}

.nav-menu-items ul li a.active::after {
    bottom: 0;
    opacity: 1;
    width: 100%;
}

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

.right-items div {
    margin: 0 0 0 23px;
}


.right-items .search-bx {
    border: 1px solid hsla(0, 0%, 51%, .6);
    border-radius: 6px;
    height: 35px;
    margin: 1px 16px 1px 0px;
    padding: 0 0 0 18px;
    align-items: center;
    display: flex;
    width: 335px;
}

.search-bx input {
    letter-spacing: .0100rem;
    margin: 0 0 0 14px;
    background: transparent;
    border: 0;
    color: #fff;
    font-family: "NotoSans";
    font-size: 12px;
    font-weight: 400;
    height: 20px;
    line-height: 1.4285714286em;
    outline: 0;
    padding: 0;
    width: 100%;
    display: inline;
}


.search-bx img {
    width: 18px;
    display: inline;
    /* position: absolute;
    top: 6px;
    left: 10px; */
}

.login {
    margin-bottom: 5px;
}

.login a {
    background: rgba(0, 0, 0, .4);
    text-transform: uppercase;
    font-size: 12px;
    font-family: "NotoSans";
    text-decoration: none;
    color: white;
    padding: 9px 12px;
    border: 1px solid #fff;
    border-radius: 5px;
    font-weight: 500;
    transition: background-color .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93), color .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93);
}

.login a i {
    transition: background-color .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93), color .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93);
}

.login a:hover {
    background-color: #fff;
    color: #000;
}

.login a:hover i {
    background-color: #fff;
    color: #000;
}

.account img {
    width: 20px;
}

.cmn-btn {
    margin-bottom: 5px;
}

.cmn-btn a {
    background: rgba(0, 0, 0, .4);
    text-transform: uppercase;
    font-size: 12px;
    font-family: "NotoSans";
    text-decoration: none;
    color: white;
    padding: 9px 12px;
    border: 1px solid #fff;
    border-radius: 8px;
    font-weight: 500;
    transition: background-color .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93), color .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93);
}

.cmn-btn a i {
    transition: background-color .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93), color .25s ease-in, bottom .25s cubic-bezier(.33, .04, .63, .93);
}

.cmn-btn a:hover {
    background-color: #fff;
    color: #000;
}

.cmn-btn a:hover i {
    background-color: #fff;
    color: #000;
}

.subp {
    margin-bottom: 5px;
}



.subp img {
    display: inline-block !important;
    margin-right: 7px;
    width: 16px !important;
    padding-bottom: 5px;
}

.subp a {
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 9px 12px;
    font-family: "NotoSans";
    font-weight: 700;
    font-size: 11px;
    text-decoration: none;
    color: #fff;
    background-color: #8230c6;
    border-radius: 5px;
    transition: all .2s;
}

.subp a:hover {
    background-color: #5c1695;
    color: #fff;
}

.more img {
    width: 22px;
}

/*------------ sidemenu ----------- */

/* .resposive-menu-bx {
    background-color: white;
    height: 100%;
    width: 300px;
    position: fixed;
    right: -400px;
    top: 0;
    z-index: 1025;
    -webkit-box-shadow: 0px 0px 20px rgb(95 107 125 / 15%);
    box-shadow: 0px 0px 20px rgb(95 107 125 / 15%);
    overflow: hidden;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    display: none;
}

.resposive-menu-bx.active {
    right: 0;
} */



/* -----close -----*/



.bt {
    border-top: 2px solid hsla(0, 0%, 100%, .1) !important;
}


.side-prof,
.logo-res {
    display: none;
}



.accordion .accordion-button span.down-icon {
    border-style: solid;
    border-color: currentColor;
    -o-border-image: initial;
    border-image: initial;
    border-width: 0px 2px 2px 0px;
    display: inline-block;
    padding: 3px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg);
    position: absolute;
    right: 23px;
    top: 25px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.accordion .accordion-button.collapsed span.down-icon {
    top: 20px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


.pos-ab {
    position: absolute;
    bottom: 10px;
    left: 10px;
}

.pos-rel {
    position: relative;
}

.div-txt {
    width: 50%;
    font-size: 14px;
    color: red;
}

.hms-tp-txt {
    position: absolute;
    top: 40px;
    left: 35px;
    z-index: 2;
}

.hms-btm-txt {
    position: absolute;
    bottom: 50px;
    left: 35px;
    z-index: 2;
}

#homeslider .owl-stage-outer {
    max-height: 500px;
}

#homeslider .owl-stage-outer .owl-item img {
    opacity: .5;
}

#homeslider .owl-stage-outer .owl-item.center img {
    opacity: 1;
}

.homesection picture::before {
    background: radial-gradient(152% 152% at 15.54% 96.84%, #0e0616 20%, rgba(14, 6, 22, 0) 60%);
    top: 35%;
    position: absolute;
    background: radial-gradient(152% 152% at 15.54% 96.84%, #0e0616 0, rgba(14, 6, 22, 0) 60.94%);
    opacity: .8;
    bottom: 0;
    content: "";
    left: 0;
    margin: auto;
    opacity: .9;
    position: absolute;
    right: 0;
    top: 64%;
    z-index: 1;
}

.hms-tp-txt img {
    width: 100%;
    border-radius: 50%;

}

.hms-btm-txt::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    /* background: linear-gradient(0deg, black, rgba(0, 0, 0, 0.76), transparent); */
    box-shadow: rgba(0, 0, 0, 0.242) 0px -50px 36px -28px inset;
        /* z-index: -1; */
}

.hms-btm-txt p.mv-title {
    font-size: 1.8rem;
    line-height: 2.6rem;
    max-height: 54px;
    padding-bottom: 4px;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: #fff;
    display: -webkit-box;
    font-family: NotoSansBold, sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.4285714286em;
    /* max-height: 50px; */
    overflow: hidden;
    /* text-shadow: 0 1px 2px rgb(0 0 0 / 70%); */
    text-shadow: .1em .1em 0 hsl(200 50% 30%);
    ;
}

.mv-plan {
    display: flex;
}

.mv-plan a i {
    margin-right: 7px;
}

.bg img {
    border-radius: 5px;
}

/* Owl buttons CSS */
.owl-prev,
.owl-next {
    width: 60px !important;
    height: 60px !important;
    background-color: rgb(255, 255, 255) !important;
    border-radius: 50% !important;
    font-size: 28px !important;
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
    -webkit-box-align: center !important;
    -ms-flex-align: center !important;
    align-items: center !important;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    color: #000 !important;
    opacity: 0.7;
    -webkit-box-shadow: 0 0 50px rgb(0 0 0 / 20%);
    box-shadow: 0 0 50px rgb(0 0 0 / 20%);
    background: linear-gradient(90deg, transparent 0, rgba(0, 0, 0, .5)) !important;
}

.owl-nav {
    margin: 0 !important;
}

.owl-nav .owl-prev {
    background: transparent !important;
    position: absolute;
    left: 6%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.owl-nav .owl-next {
    position: absolute;
    right: 6%;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.owl-next svg {
    width: 35px;
    height: 35px;
    position: relative;
    right: -1px;
}

.owl-prev svg {
    width: 35px;
    height: 35px;
    position: relative;
    left: -1px;
}

.owl-prev,
.owl-next {
    background-color: transparent !important;
    color: white !important;
    opacity: 1;
}

.owl-dots {
    position: absolute;
    bottom: -25px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    /* background-color: white; */
    border-radius: 50px;
    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;
    /* padding: 4px; */
}

.owl-dots .owl-dot span {
    width: 6px !important;
    height: 6px !important;
    margin: 1px 2px !important;
    background-color: #8a8a8a !important;
}

.owl-dots .owl-dot.active span {
    background: #da76ff !important;
}


.homesection:hover .owl-nav {
    opacity: 1;
    visibility: visible;
}

.homesection .owl-nav {
    transition: all .2s;
    opacity: 0;
    visibility: hidden;
}

.ed-nav .owl-dots {
    display: none;
}

.ed-nav .owl-prev {
    left: -5px;
}

.ed-nav .owl-next {
    right: -5px;
}

.ed-nav:hover .owl-nav {
    opacity: 1;
    visibility: visible;
}

.ed-nav .owl-nav {
    transition: all .2s;
    opacity: 0;
    visibility: hidden;
}

/*--------   sec-2 started--------- */
.movie-img img {
    /* width: auto !important; */
    border-radius: 5px;
}

.common-heading {
    display: inline-block;
    margin: 20px;
}

.common-heading h2 {
    display: inline-block;
    font-size: 20px;
    text-transform: capitalize;
    font-family: "NotoSans";
    font-weight: 400;
}

.more {
    display: flex;
    margin: 20px;
    align-items: center;
}

.more a {
    white-space: nowrap;
    font-weight: 400;
    margin-right: 10px;
    text-decoration: none;
    color: #a785ff;
    font-size: 14px;
}

.more a:hover {
    color: #a785ff;
}

.more i {
    margin-left: 5px;
    vertical-align: middle;
    color: #a785ff;
}

.jb {
    display: flex;
    justify-content: space-between;
    align-items: center;
}


/* -------------footer css------------- */

.footer-ul-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
    padding: 0;
    margin: 0;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    text-align: center;
}

.footer-ul-link li a {
    text-decoration: none;
    position: relative;
    border-right: 1px solid rgb(71, 71, 71);
    color: #525252;
    font-size: 16px;
    font-weight: 600;
    margin-right: 0;
    margin: 10px 0;
    display: block;
    padding: 0px 15px;
    opacity: 1;
    -webkit-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.footer-ul-link li:last-child a {
    border: none;
}

.footer-ul-link li a.active,
.footer-ul-link li a:hover {
    color: #a785ff;
}

.footer-ul-link li a .bx {
    position: relative;
    top: 3px;
    margin-right: 5px;
    font-size: 18px;
}

.footer-ul-link i {
    color: rgb(71, 71, 71);
}

.footer-bottom {
    margin-top: 25px;
}

.copyright {
    color: rgb(71, 71, 71);
    font-size: 13px;
    margin: 0;
    margin-bottom: 10px;
}

.mede-with {
    color: rgb(71, 71, 71);
    font-size: 13px;
    margin: 0;
    margin-bottom: 10px;
}

.mede-with a {
    text-decoration: none;
    color: rgb(71, 71, 71);
}

.mede-with a:hover {
    color: #a785ff;
}

.icons-box-made {
    /* border: 1px solid red; */
    width: 12px;
    height: 12px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    top: 2px;
}

.icons-box-made .fa-heart,
.icons-box-made .fa-heart-o {
    position: absolute;
}

.mede-with .fa-heart-o {
    color: #999;
    font-size: 12px;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    opacity: 1;
}

.mede-with .fa-heart {
    color: #999;
    font-size: 12px;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    opacity: 0;
    -webkit-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
}

.mede-with:hover .fa-heart-o {
    opacity: 0;
}

.mede-with:hover .fa-heart {
    opacity: 1;
    color: #dd1627;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}

.social-links {
    text-align: center;
}

.social-links a {
    text-decoration: none;
    color: #777777;
    height: 35px;
    margin: 0px 2px;
    width: 35px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    border-radius: 50%;
}

.social-links a:hover {
    background-color: white;
    -webkit-box-shadow: 0px 0px 10px #0000000d;
    box-shadow: 0px 0px 10px #0000000d;
}

.social-links a .fa {
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.social-links a:hover .fa-facebook {
    color: #3b5998;
}

.social-links a:hover .fa-twitter {
    color: #00aced;
}

.social-links a:hover .fa-instagram {
    color: #8a3ab9;
}

.social-links a:hover .fa-linkedin {
    color: #0077b5;
}

.social-links a:hover .fa-youtube-play {
    color: red;
}

.bdt {
    border-top: 1px solid rgba(71, 71, 71, 0.379);
}

.footer-social-link i {
    color: rgb(71, 71, 71);
}




/*----------------- detail page css ----------------------- */

.offer {
    background: #401a4c;
}


.offer-banner {
    border-radius: 8px;
    font-weight: 500;
    align-items: center;
    padding: 10px 20px;
    justify-content: space-between;
    display: flex;
}

.offer-banner-txt h3 {
    font-size: 16px;
    padding: 0 10px;
}

.pffer-banner-btn {
    font-size: 14px !important;
}

.movie-details {
    margin: 20px 0;
}

.movie-details .movie-heading {
    margin-top: 10px;
}

.movie-details .movie-heading h2 {
    font-family: "NotoSans";
    font-weight: 500;
}

.movie-details .movie-years {
    margin: 30px 0;
}

.movie-details .movie-years a {
    font-weight: 500;
}

.cmn-a {
    margin-right: 10px;
    font-family: "NotoSans";
    font-weight: 400;
    color: #a785ff !important;
}

.movie-details .mv-details a {
    font-size: 20px;
    font-weight: 400;
}

.movie-details .dot {
    margin-right: 20px;
    position: relative;
    padding: 0px 10px 0 0;
}

.movie-details .dot::after {
    background-color: #fff;
    border-radius: 50%;
    content: "";
    display: block;
    height: 8px;
    right: -10px;
    opacity: .2;
    position: absolute;
    top: 13px;
    width: 8px;
}

.movie-details .mv-details {
    margin-bottom: 30px;
}

.movie-details .mv-details span {
    font-weight: 500;
    color: hsla(0, 0%, 100%, .5);
    font-size: 20px;
}

.movie-details .more-btn {
    margin-bottom: 30px;
    display: flex;
}

.movie-details .more-btn .more-btn-shwh {
    display: flex;
    align-items: center;
    background: hsla(0, 0%, 100%, .04);
    ;
}

.movie-details .more-btn .more-btn-share,
.more-btn-wish {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 16px 32px 21.5px;
}


.movie-details .more-btn img {
    width: 30px;
}


.movie-details .more-btn a {
    margin-top: 20px;
    color: hsla(0, 0%, 100%, .5);
    display: block;
    font-size: 15px;
    font-weight: 400;
    letter-spacing: -.5px;
    line-height: .86;
    line-height: .8571428571em;
}


.movie-details .more-btn .watchbtn {
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 16px 50px 21.5px;
    background: hsla(0, 0%, 100%, .08);
    ;
}

.movie-details .langs {
    margin-bottom: 30px;
}

.movie-details .langs p {
    display: inline;
    margin-right: 10px;
}

.movie-details .sub-titles {
    margin-bottom: 30px;
}

.movie-details .sub-titles p {
    display: inline;
    margin-right: 10px;
}

.movie-details span {
    color: hsla(0, 0%, 100%, .5);
}

.movie-details .movie-more-details p.dts {
    font-size: 18px;
    line-height: 1.7rem;

}

.movie-details .movie-more-details .accordion-button:not(.collapsed) {
    border-bottom: none !important;
}

.movie-details .movie-more-details .brgr-menu-items {
    padding: 0 20px 0 0 !important;
}

.movie-details .movie-more-details .cast .cast-actors p {
    font-size: 16px;
    font-weight: 500;
}

.movie-details .movie-more-details .cast .cast-actors a {
    font-size: 16px;
    font-weight: 500;
}

.movie-details .movie-more-details .cast .cast-actors {
    display: inline-block;
    margin: 0 32px 24px 0;
}

.accordion .accordion-button.collapsed span.down-icon-thala {
    top: 20px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


.accordion .accordion-button span.down-icon-thala {
    border-style: solid;
    border-color: currentColor;
    -o-border-image: initial;
    border-image: initial;
    border-width: 0px 2px 2px 0px;
    display: inline-block;
    padding: 3px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg);
    position: absolute;
    right: 23px;
    top: 25px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.movie-more-details .cast {
    margin-top: 20px;
}

.ovr {
    overflow: hidden;
    overflow-y: auto;
    height: 100vh;
    position: sticky;
    top: 10px;
}

.rg-items .common-heading {
    margin: 10px 0;
}

.rg-items .common-heading h2 {
    font-weight: 500;
    font-size: 18px;
}

.rg-items .trending-slides,
.rg-items .movie-img {
    display: inline-block !important;
}

.rg-items .trending-slides {
    margin: 10px 0 !important;
}

.rg-items .rowa {
    display: flex;
    flex-wrap: wrap;
}

.rg-items .trending-slides .movie-img img {
    padding: 0 4px 0;
    width: 100%;
}

/*----------------- login page css ----------------------- */

.cont-login {
    width: 394px;
    margin: 40px auto;
    background: #fcfcfc;
    border-radius: 16px;
    text-align: center;
}

.main-login {
    text-align: center;
    padding: 32px 0;
}

.main-login h2 {
    color: #333;
    margin: auto;
    text-align: center;
    font-size: 1.790rem;
    font-weight: 500;
}

.main-login h3 {
    color: #4f4f4f;
    margin: 20px auto;
    padding: 0 20px;
    text-align: center;
    font-size: 1.090rem;
    font-weight: 400;
    line-height: 1.375em;
    ;
}

.social-icon-login,
.labledesign {
    display: flex;
    align-items: center;
    margin: 0 20px 34px;
    justify-content: center;
}

.social-icon-login .googlelogin-icon img {
    -moz-box-shadow: 0px 6px 5px #ccc;
    -webkit-box-shadow: 0px 6px 5px #ccc;
    box-shadow: 0px 6px 5px #ccc;
    border-radius: 50%;
}

.main-login .social-icon-login div {
    cursor: pointer;
    display: inline-block;
    margin: 0 12px;
}

.main-login .social-icon-login div:first-child {
    margin-left: 0;
}

.main-login .social-icon-login div:last-child {
    margin-right: 0
}

.main-login .social-icon-login img {
    width: 48px;
}



.main-login .labledesign .oricon-main {
    border-radius: 19px;
    height: 36px;
    width: 36px;
    background-color: #f9f9f9;
    border: 1px solid #cdcdcd;
    margin: 0 auto;
    position: relative;
}

.main-login .labledesign .oricon-main::before {
    background: #cdcdcd;
    border: none;
    content: "";
    display: block;
    height: 0.1em;
    left: 60px;
    position: absolute;
    top: 50%;
    width: 120px;
}

.main-login .labledesign .oricon-main::after {
    background: #cdcdcd;
    border: none;
    content: "";
    display: block;
    height: 0.1em;
    position: absolute;
    right: 60px;
    top: 50%;
    width: 120px;
}


.main-login .labledesign .oricon-main .oricon {
    margin-top: 5px;
}

.main-login .labledesign .oricon-main .oricon span {
    color: #000;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1em;
    text-transform: lowercase;
}

.logintextfield .forminput {

    font-weight: 400;
    border: 1px solid #bdbdbd;
    border-radius: 6px;
    box-sizing: border-box;
    color: #333;
    font-weight: 400;
    height: 50px;
    line-height: 1.1428571429em;
    padding: 10px 0 10px 20px;
    background-color: transparent;
    box-shadow: none;
    filter: none;
    font-weight: 400;
    line-height: 1em;
    text-decoration: none;
    width: 100%;
}

.logintextfield .forminput:focus {
    border-color: #8230c6;
    border-bottom: 1px solid #a785ff;
    outline: 0;
}

.main-login .logintextfield {
    margin: 0 33px;
    position: relative;
}

.buttongradient {
    background: #8230c6;
    border: none;
    border-radius: 6px;
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: NotoSansMedium, sans-serif;
    font-size: 1rem;
    font-weight: 500;
    height: 48px;
    line-height: .7142857143em;
    padding: 20px;
    text-align: center;
    width: 100%;
}

.buttongradient.logininBtn {
    font-family: NotoSansBold, sans-serif;
    font-weight: 700;
    height: 48px;
    line-height: 1.375em;
    margin-top: 24px;
    padding: 12px 24px;
}

.main-login .login-bottom {
    margin: 12px 33px 0;
}

.login-bottom .registering {
    margin-top: 20px;
}

.login-bottom .registering span {
    font-weight: 400;
    color: #333;
    font-size: 16px;
}

.login-bottom .registering span a {
    color: #8a3ab9;
    font-size: 16px;
    font-weight: 400;
}


/* ------------- about page --------------- */

.about-main h2 {
    text-align: center;
    margin-bottom: 20px;
    font-weight: 500;
    /* font-size: 18px;  */
}

.about-main p {
    font-weight: 400;
    line-height: 1.8rem;
    margin: 0 0 24px;
}

.about-main a {
    color: #a785ff;
}



/* ------------- Privacy Policy page --------------- */

.privacy .privacy-main u {
    color: #d8d8d8;
}

.privacy .privacy-main h2,
.privacy .privacy-main h2 a {
    font-size: 1.8rem;
    line-height: 2.6rem;
    margin: 18px 0 14px 0;
    text-align: center;
}

.privacy .privacy-main h4 {
    font-weight: 400;
    font-size: 17px;
    color: #d8d8d8;
    margin: 0;
}

.privacy-main p {
    color: #d8d8d8;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8rem;
    margin: 0 0 24px;
}

.privacy .privacy-main h3 {
    color: #d8d8d8;
    margin: 12px 0;
    font-size: 1.2rem;
    font-weight: 500;
    line-height: 2.4rem;
}

.privacy-main a {
    color: #a785ff;
}

/* ----------------terms & Condition page --------------- */

.tnc-main a {
    color: #a785ff;
}

.tnc-main p {
    color: #d8d8d8;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.8rem;
    margin: 0 0 24px;
}

.tnc .tnc-main h2 {
    color: #d8d8d8;
    font-size: 1.8rem;
    line-height: 2.6rem;
    margin: 18px 0 14px 0;
    text-align: center;
}


/* buy plan page  */



/* .buyplan{
    position: relative;
} */
.buyplan {
    background: linear-gradient(rgba(12, 17, 27, 0)10%, #0e0418 50%), url(../img/imgpsh_fullsize_anim.png);
    background-repeat: no-repeat;
    background-size: contain;
    /* background-attachment: fixed;
    min-height: 100px;
    background-position: 50% 25%; */
}

.buyplan-wrapper {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 4rem;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    min-height: calc(100vh - 90px);
}


.buyplan-wrapper h2 {
    font-weight: 400;
    font-size: 27px;
}

.buyplan-wrapper .prem-table-wrappers {
    background: #0d0517;
    margin-top: 11px;
    /* align-items: center; */
    /* background: linear-gradient(to bottom, #192133, #111826); */
    width: 100%;
    max-width: 880px;
    padding: 0 50px 20px;
    border-radius: 8px;
}

.prem-table-wrapper {
    justify-content: space-between;
    display: flex;
}

.prem-table-wrapper .containet-bx {
    margin-top: 70px;
    padding-right: 40px;
    width: 100%;
}

.prem-table-wrapper .containet-bx .contents {
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid rgba(128, 128, 128, 0.16);
}

.prem-table-wrapper .containet-bx .contents p {
    display: block;
    margin-bottom: 5px;
    font-size: 15px;
    color: #d8d8d8;
}

.prem-table-wrapper .containet-bx .contents span {
    color: #a785ff;
    font-size: 13px;
    margin-bottom: 10px;
    display: block;
}

.prem-table-wrapper .plan-bx .active {
    border-radius: 10PX 10px 0 0;
    background: #9842da30;
}


.prem-table-wrapper .plan-bx {
    white-space: nowrap;
    text-align: center;
    margin: 25px 50px 0 0;
    display: flex;
}

.prem-table-wrapper .plan-bx .superplan-bx,
.prem-table-wrapper .plan-bx .premplan-bx {
    opacity: 0.8;
    width: 100%;
    padding: 10px;
}

.prem-table-wrapper .plan-bx .superplan-bx .main-plans,
.prem-table-wrapper .plan-bx .premplan-bx .main-plans {
    color: #fff;
    margin-bottom: 20px;
    display: block;
}

.prem-table-wrapper .plan-bx .plans {
    margin-bottom: 20px;
    padding: 5px 0 0px 0;
    text-align: center;
}

.plan-bx .plans:first-child {
    margin-top: 30px;
}

.plan-bx .plans img {
    width: 24px;
}

.plan-bx .plans span {
    color: #fff;
    display: block;
    font-size: 15px;
}

.prem-table-wrappers .prem-table-price {
    display: flex;
}

.prem-table-price .active {
    background: #9842da30;
    border: 1px solid #9842da !important;
}

.prem-table-wrappers .prem-table-price .price {
    margin: 19px 6px 0 0;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-pack: end;
    -webkit-justify-content: end;
    -ms-flex-pack: end;
    justify-content: end;
    border: 1px solid #d8d8d8ab;
    border-radius: 5px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    position: relative;
    cursor: pointer;
    padding: 12px 0 2px 12px;
    min-width: 22.7%;
}

.chk-img {
    position: absolute;
    top: -8PX;
    right: -4PX;
}

.chk-img img {
    width: 20px;
}

.conti-btn {
    margin: 10px 0 30px;
}

.conti-btn button {
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    background: #702ba4;
    padding: 10px 0;
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
}

.conti-btn i {
    margin-left: 10px;
    font-size: 15px;
}

.price span {
    color: #fff;
}

.price span.active {
    color: gold;
    border: none !important;
    background: none;
}





/*------------- account css ----------- */

.dash-bx {
    display: flex;
}

.acc-item {
    position: relative;
    padding: 0 15px;
    border-top: 1px solid rgb(240, 240, 240);
}

.acc-item .acc-heding {
    color: var(--color-1);
    padding: 10px 0px;
    background: transparent;
    font-weight: 500;
    text-transform: capitalize;
    font-size: 14px;
    margin: 0px;
    position: relative;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    padding-right: 20px;
}

.acc-item .acc-heding.collapsed:hover {
    color: var(--color-3);
}

.acc-item .acc-heding.collapsed {
    color: var(--color-5);
}

.acc-item .acc-heding span.down-icon {
    border-style: solid;
    border-color: currentColor;
    -o-border-image: initial;
    border-image: initial;
    border-width: 0px 2px 2px 0px;
    display: inline-block;
    padding: 3px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    right: 0px;
    top: 15px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.acc-item .acc-heding.collapsed span.down-icon {
    top: 20px;
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg);
}

.acc-item .acc-detail {
    position: relative;
}


.psb-left {
    position: relative;
}

.psb-right .psbl-heading,
.psb-left .psbl-heading {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 600;
    color: var(--color-3);

}

.psb-left .psbl-percentage {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--color-3);

    position: absolute;
    right: 0;
    top: 3px;
}

.psb-left .psbl-per-bar {
    width: 100%;
    height: 10px;
    background-color: #e7e7e7;
    border-radius: 50px;
    margin: 10px 0;
    position: relative;
    overflow: hidden;
}

.psb-left .psbl-per-bar .psblpb-inner {
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50px;
    background: linear-gradient(90deg, var(--color-2) 0%, var(--color-1) 100%);
    transition: all 0.3s linear;
}

.psb-left .psbl-desc {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 400;
    color: var(--color-4);
}

.psb-right .psbl-account-progress {
    display: block;
    border: 1px solid #dedede;
    padding: 12px 10px;
    border-radius: 5px;
    margin-top: 10px;
    color: var(--color-3);
    transition: all 0.3s ease-in-out;
}

.psb-right .psbl-account-progress div {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;

}

.psb-right .psbl-account-progress div img {
    width: 30px;
    margin-right: 5px;
}

.psb-right .psbl-account-progress:hover {
    color: #295ea2;
    border-color: #295ea2;
    background-color: #295da212;
    box-shadow: 0 0 5px 0 #00000014;
}

/* ---
Breadcrumb-bx css
----*/
.breadcrumb-upper {
    background-color: white;
}

.breadcrumb-bx {
    /* background-color: #e9ecef; */
    padding: 10px 0px;
    max-width: 1460px;
    width: 100%;
    margin: auto;

}

.breadcrumb-bx a {
    font-size: 14px;
    font-weight: 400;
    color: gray;
    letter-spacing: 0.5px;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.breadcrumb-bx a .fa {
    margin-left: 5px;
    color: var(--color-1);
}

.breadcrumb-bx a:hover {
    color: var(--color-1);
}

.breadcrumb-bx a.active:hover,
.breadcrumb-bx a.active {
    color: gray;
    text-decoration: none;
}

.breadcrumb-bx.breadcrumb-white {
    padding: 10px 15px;
}

.breadcrumb-bx.breadcrumb-white a {
    color: rgb(238, 242, 248);
    font-weight: 300;
    opacity: 0.8;
}

.breadcrumb-bx.breadcrumb-white a:hover {
    color: white;
    opacity: 1;
}

.breadcrumb-bx.breadcrumb-white a .fa {
    color: white;
}

.breadcrumb-bx.breadcrumb-white a.active,
.breadcrumb-bx.breadcrumb-white a.active:hover {
    color: rgb(238, 242, 248);
    opacity: 0.5;
}


/* ---
Trainner Dashboard Css
--- */
.dash-bx {
    display: flex;
}

/* ... Trainner Dashboard (dash-left) Css ... */
.dash-bx .dash-left {
    background-color: #1b1223;
    width: 280px;
    flex: 0 0 280px;
    position: sticky;
    top: 90px;
    height: calc(100vh - 90px);
    box-shadow: 0px -10px 10px 0px #0d0517;
}

.dash-left .trainer-pic-bx {
    display: flex;
    align-items: center;
    padding: 30px 10px 10px;
    flex-direction: column;
}

.dash-left .trainer-pic-bx .trainer-pic-img {
    width: 80px;
    flex: 0 0 80px;
    height: 80px;
    margin-bottom: 10px;
    border-radius: 50%;
    object-fit: cover;
    object-position: center;
    cursor: pointer;
    box-shadow: 0px 0px 0 3px var(--white), 0px 0px 0 5px var(--color-1);
}

.dash-left .trainer-pic-bx .trainer-pic-name {
    font-size: 16px;
    line-height: 1.7;
    font-weight: 500;
    color: var(--color-3);
    position: relative;
    top: 1.5px;
}

.dash-left .profile-menu {
    padding: 10px;
    height: 100%;
    overflow: hidden;
    overflow-y: auto;
}

.profile-menu .profile-link {
    display: block;
    padding: 6px 10px 6px 20px;
    font-size: 16px;
    margin-bottom: 5px;
    position: relative;
    font-weight: 400;
    color: #777777;
    text-transform: capitalize;
    letter-spacing: 0.5px;
    cursor: pointer;
    transition: all 0.3s linear;

}

.profile-menu .profile-link:hover {
    color: #fff;
    background: linear-gradient(45deg, #0000000a, transparent);
}

.profile-menu .profile-link.active {
    color: #fff;
    background: linear-gradient(45deg, #295ea20a, transparent);
}

.profile-menu .profile-link::after {
    content: "";
    width: 3px;
    height: 100%;
    background-color: transparent;
    position: absolute;
    top: 0;
    left: 0;
    transition: all 0.3s linear;
}

.profile-menu .profile-link:hover::after {
    background-color: #fff;
}

.profile-menu .profile-link.active::after {
    background-color: #fff;
}

/* ... Profile Forms (dash-right) Css ... */
.profile-group {
    position: relative;
    margin: 10px 0;
}

.profile-group textarea,
.profile-group select,
.profile-group input {
    display: block;
    color: #fff;
    border: 0;
    font-size: 16px;
    background-color: transparent;
    border: 1.5px solid rgb(197, 197, 197);
    width: 100%;
    outline: none;
    padding: 6px 10px 6px 10px;
    border-radius: 5px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.profile-group span.down-icon {
    border-style: solid;
    border-color: #1c2b3380;
    -o-border-image: initial;
    border-image: initial;
    border-width: 0px 2px 2px 0px;
    display: inline-block;
    padding: 4px;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    right: 15px;
    top: 13px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.profile-group input[type="password"] {
    padding: 6px 40px 6px 10px;
}

.profile-group select {
    padding: 7px 10px 7px 10px;
    cursor: pointer;
}

.profile-group textarea {
    resize: none;
    overflow: hidden;
    min-height: 70px;
}

.profile-group .group__label {
    position: absolute;
    left: 6px;
    top: 0px;
    z-index: 1;
    font-size: 16px;
    color: #ffffff80;
    font-weight: 600;
    margin: 0;
    padding: 0 8px;
    -webkit-transform: scale(1) translateY(7px);
    -ms-transform: scale(1) translateY(7px);
    transform: scale(1) translateY(7px);
    -webkit-transform-origin: left;
    -ms-transform-origin: left;
    transform-origin: left;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    font-family: var(--font-2);
    cursor: pointer;
}

.profile-group textarea:hover,
.profile-group select:hover,
.profile-group input:hover {
    background-color: transparent;
}

.profile-group select:hover~span.down-icon {
    border-color: #124ca0;
}

.profile-group textarea:focus,
.profile-group textarea:not(:placeholder-shown),
.profile-group select:focus,
.profile-group select:not(:placeholder-shown),
.profile-group input:focus,
.profile-group input:not(:placeholder-shown) {
    border-color: #fcfcfc;
    /* background-color: rgb(255, 255, 255); */
}

.profile-group textarea:not(:placeholder-shown)~.group__label,
.profile-group textarea:focus~.group__label,
.profile-group select:not(:placeholder-shown)~.group__label,
.profile-group select:focus~.group__label,
.profile-group input:not(:placeholder-shown)~.group__label,
.profile-group input:focus~.group__label {
    -webkit-transform: scale(.7) translateY(-18px);
    -ms-transform: scale(.7) translateY(-18px);
    transform: scale(.7) translateY(-18px);
    color: hsla(0, 0%, 100%, .5);
    background-color: #0f0617;
}

.profile-group input[disabled] {
    background-color: rgb(251 251 251);
    cursor: not-allowed;
}

/* ---
View Password Css
--- */
.profile-group .view-pass {
    position: absolute;
    top: 0px;
    right: 0px;
    color: #ffffff80;
    font-size: 20px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    width: 40px;
    height: 100%;
    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;
}

.profile-group .view-pass:hover {
    color: #124ca0;
}



/* ... Trainner Dashboard (dash-right) Css ... */
.dash-bx .dash-right {
    width: auto;
    flex: auto;
    padding: 0 20px;
}

.dash-right .profile-tab {
    display: none;
    padding: 10px 0px;
}

.dash-right .profile-tab.active {
    display: block;
}

.profile-tab .profile-inner-tab {
    position: relative;
    max-width: 100%;
    width: 100%;
    margin: 0px auto 20px;
    border-radius: 5px;
    box-shadow: 0 0px 0px 1px rgb(0 0 0 / 6%);
}

.profile-inner-tab .profile-tab-heading {
    font-size: 16px;
    line-height: 1.6;
    font-weight: 500;
    color: #87838b;
    padding: 8px 15px 7px;
    border-bottom: 1.5px solid #dedede;
}

.profile-group-lable {
    font-size: 16px;
    line-height: 1.6;
    font-weight: 700;
    color: #333333;

    margin-top: 15px;
}

.profile-save-bx {
    padding: 0px 15px 30px;
}

.profile-save-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 5px 10px;
    border-radius: 5px;
    width: 100%;
    font-weight: 400;
    letter-spacing: .5px;
    color: #fff;
    background-color: #8230c6;
    font-size: 14px;
    margin: 0px auto;
    position: relative;
    border: none;
    outline: none;
    cursor: pointer;
    width: auto;
    margin-right: inherit;
}

.tasp-btns {
    position: absolute;
    right: 10px;
    top: 7px;
}

.profile-view-btn,
.profile-delet-btn,
.profile-edit-btn {
    border: 1px solid rgb(0 0 0 / 6%);
    background: #f7f7f7;
    display: inline-block;
    font-size: 14px;
    font-weight: 400;
    width: fit-content;
    text-transform: lowercase;
    padding: 0px 10px 0px 10px;
    border-radius: 50px;
    color: #777777;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

.profile-view-btn:hover {
    color: #2bc48a;
    border-color: #2bc48a;
    background-color: #2bc48a12;
}

.profile-edit-btn:hover {
    color: #00559e;
    border-color: #00559e;
    background-color: #00559e12;
}

.profile-delet-btn:hover {
    color: #ff0000;
    border-color: #ff0000;
    background-color: #ff000012;
}

.profile-view-btn img,
.profile-delet-btn img,
.profile-edit-btn img {
    width: 13px;
    height: 13px;
    filter: grayscale(1);
    margin-right: 4px;
    transition: all 0.3s ease-in-out;
}

.profile-view-btn:hover img,
.profile-delet-btn:hover img,
.profile-edit-btn:hover img {
    filter: grayscale(0);
}



.language-select-bx {
    margin: 10px 0;
    background-color: rgb(251 251 251);
    border: 1.5px solid rgb(197, 197, 197);
    border-radius: 5px;
    padding: 5px 10px;
    position: relative;
    transition: all 0.3s linear;
}

.language-select-bx:hover {
    border-color: #124ca0;
    background-color: white;
}

.language-select-bx .bootstrap-tagsinput .tag.label.label-info {
    background-color: #00559e12;
    padding: 5px 30px 5px 15px;
    border-radius: 20px;
    color: #1c2b33;
    font-weight: 500;
    font-size: 14px;
    color: #00559e;
    margin: 4px 2px 4px 0;
    display: inline-block;
    position: relative;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
}

.language-select-bx .bootstrap-tagsinput .tag.label.label-info::after {
    content: "";
    width: 15px;
    height: 1px;
    display: block;
    border-radius: 10px;
    background-color: currentColor;
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%) rotate(45deg);
}

.language-select-bx .bootstrap-tagsinput .tag.label.label-info::before {
    content: "";
    width: 15px;
    height: 1px;
    display: block;
    border-radius: 10px;
    background-color: currentColor;
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%) rotate(-45deg);
}

.language-select-bx .bootstrap-tagsinput .tag.label.label-info:hover {
    color: red;
    background-color: #ff00001f;
}

.language-select-bx .bootstrap-tagsinput .tag.label.label-info span {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: auto;
    cursor: pointer;
    border-radius: 20px;
}

.language-select-bx .bootstrap-tagsinput input {
    border: none;
    outline: none;
    background-color: transparent;
    margin: 4px 2px 4px 0;
    padding: 0;
    width: auto;
    display: inline-block;
}


.language-suggestions {
    position: absolute;
    left: 0;
    width: 100%;
    top: 102%;
    background: white;
    border-radius: 0 0 5px 5px;
    -webkit-box-shadow: 0 1px 0 1px #e9e9e9;
    box-shadow: 0 1px 0 1px #e9e9e9;
    max-height: 160px;
    overflow: hidden;
    overflow-y: auto;
    padding: 5px;
    z-index: 2;
    display: none;

}

.language-suggestions .language-item {
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: var(--color-6);
    padding: 7px 14px;
    border-radius: 3px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.language-suggestions .language-item:hover {
    background: #295ea212;
    color: var(--color-1);
    border-color: var(--color-1);
}

.add-profile-box {
    border: 1px solid lightgray;
    height: 150px;
    width: 100%;
    border: 2px dashed rgb(197, 197, 197);
    border-radius: 5px;
    margin: 10px 0 10px;
    background: #fbfbfb;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.add-profile-box img {
    width: 50px;
    filter: grayscale(1);
    transition: all 0.3s ease-in-out;
}

.add-profile-box .add-profile-lable {
    font-size: 14px;
    line-height: 1.6;
    font-weight: 500;
    color: #777;
    padding: 10px 0 0;

}

.add-profile-box:hover img {
    filter: grayscale(0);
    /* transform: scale(1.2); */
}

.add-profile-box:hover {
    border-color: #295ea2;
    background-color: white;
    color: #295ea2;
}

.add-profile-small {
    height: auto;
    flex-direction: row;
    padding: 15px 10px;
}

.add-profile-small img {
    width: 35px;
    margin-right: 10px;
}

.add-profile-small .add-profile-lable {
    padding: 0;
}

/* ... Training Areas Popup (dash-right) Css ... */
.training-areas-popup {
    padding: 30px 15px;
}

.training-areas-popup .trarpo-heading {
    font-size: 16px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--color-3);
    margin: 0;
    margin-bottom: -5px;
    text-align: center;
}

.training-areas-popup .trarpo-divider {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

.training-areas-popup .trarpo-divider::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    display: block;
    width: 100%;
    height: 0px;
    border-top: 2px dashed rgb(235 235 235);
}

.training-areas-popup .trarpo-divider span {
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    text-align: center;
    background-color: white;
    position: relative;
    display: inline-block;
    z-index: 1;
    padding: 0px 10px;
    color: var(--color-5);
}

.trarpo-category {
    height: 360px;
    border-radius: 5px;
    box-shadow: 0 0 0 1px #e9e9e9;
    transition: all 0.3s ease-in-out;
    overflow: hidden;
    overflow-y: auto;
    margin-top: 20px;
}

.trarpo-category:hover {
    box-shadow: 0 0 0 1px #295ea2;
}

.trarpo-category-heading {
    padding: 10px 10px;
    font-size: 16px;
    font-weight: 500;
    color: var(--color-3);
    border-bottom: 1.5px solid #e9e9e9;
    position: sticky;
    top: 0px;
    background: white;
    z-index: 1;
}

.trarpo-sub-list,
.trarpo-category-list {
    list-style: none;
    margin: 0;
}

.trarpo-sub-list li,
.trarpo-category-list li {
    padding: 10px 25px 10px 40px;
    font-size: 14px;
    font-weight: 400;
    color: var(--color-3);
    border-top: 1.5px solid #e9e9e9;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
}

.trarpo-sub-list li {
    padding: 10px 25px 10px 10px;
}

.trarpo-sub-list li:hover,
.trarpo-category-list li:hover {
    background-color: #f9f9f9;
}

.trarpo-sub-list li.selected,
.trarpo-category-list li.focus {
    background: #295ea203;
    color: #295ea2;
}

.trarpo-category-list li img {
    width: 15px;
    height: 15px;
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
}

.trarpo-sub-list li img {
    width: 11px;
    height: 11px;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    transition: all 0.3s cubic-bezier(0.895, 0.03, 0.685, 0.22);
    filter: grayscale(1);
}

.trarpo-sub-list li img.added-img {
    opacity: 0;
    visibility: hidden;
    filter: grayscale(0);
}

.trarpo-sub-list li.selected img.add-img,
.trarpo-sub-list li img.added-img {
    opacity: 0;
    visibility: hidden;
}

.trarpo-sub-list li.selected img.added-img {
    opacity: 1;
    visibility: visible;
}

.trarpo-category-list li .fa {
    width: 15px;
    height: 15px;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
}



.skills-finel-list-bx {
    margin-top: 20px;
}

.display-skills-ul,
.skills-list-ul {
    list-style: none;
    margin: 0;
    margin-top: 10px;
}

.display-skills-ul {
    margin-top: 0px;
    margin-bottom: 5px;
}

.display-skills-ul li,
.skills-list-ul li {
    padding: 5px 30px 5px 10px;
    font-size: 14px;
    font-weight: 400;
    color: var(--color-3);
    border: 1.5px solid #e9e9e9;
    position: relative;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    display: inline-block;
    border-radius: 50px;
    margin: 5px 5px 0 0;
    transition: all 0.3s ease-in-out;
}

.display-skills-ul li {
    padding: 3px 10px;
    font-weight: 500;
    font-size: 13px;
    background: #fbfbfb;
}


.skills-list-ul li:hover {
    color: red;
    background-color: #ff00001f;
    border-color: red;
}

.skills-list-ul li img {
    width: 13px;
    height: 13px;
    position: absolute;
    right: 10px;
    top: 50%;
    filter: grayscale(1);
    transform: translateY(-50%) rotate(45deg);
    transition: all 0.3s cubic-bezier(0.895, 0.03, 0.685, 0.22);
}

.skills-list-ul li:hover img {
    filter: grayscale(0);
}


/* ... Training Content Popup (dash-right) Css ... */
.training-content-popup {
    padding: 30px 15px;
}

.certificate-heading,
.training-content-popup .trcopo-heading {
    font-size: 18px;
    line-height: 1.7;
    font-weight: 500;
    color: var(--color-3);
    margin: 0;
    margin-bottom: -8px;
}



/* ---
file upload css
--- */

.file-upload {
    font-size: 16px;
    max-width: 768px;
    width: 100%;
    margin: auto;
    display: block;
    margin: 15px 0 10px;
}

.file-upload .file-select {
    display: block;
    color: #525252;
    cursor: pointer;
    height: 40px;
    line-height: 40px;
    text-align: left;
    background: #FFFFFF;
    overflow: hidden;
    position: relative;
    border-radius: 5px;
}

.file-upload .file-select .file-select-button {
    background: #295ea2;
    color: white;
    padding: 0 10px;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    text-align: center;
    font-weight: 400;
}

.file-upload .file-select .file-select-name {
    line-height: 40px;
    display: block;
    height: 40px;
    padding: 0 10px;
    width: 100%;
    border: 1.5px solid rgb(197, 197, 197);
    border-radius: 5px;
}

.file-upload .file-select:hover .file-select-name {
    border-color: #41c6f7;
    transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
}

.file-upload .file-select:hover .file-select-button {
    background: #41c6f7;
    color: #FFFFFF;
    transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
}

.file-upload.active .file-select .file-select-name {
    border-color: #3fa46a;
    transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
}

/* .file-upload.active .file-select .file-select-button {
    background: #3fa46a;
    color: #FFFFFF;
    transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
} */

.file-upload .file-select input[type=file] {
    z-index: 100;
    cursor: pointer;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    filter: alpha(opacity=0);
}

.file-upload .file-select.file-select-disabled {
    opacity: 0.65;
}

.file-upload .file-select.file-select-disabled:hover {
    cursor: default;
    display: block;
    border: 2px solid #dce4ec;
    color: #34495e;
    cursor: pointer;
    height: 40px;
    line-height: 40px;
    margin-top: 5px;
    text-align: left;
    background: #FFFFFF;
    overflow: hidden;
    position: relative;
}

.file-upload .file-select.file-select-disabled:hover .file-select-button {
    background: #dce4ec;
    color: #666666;
    padding: 0 10px;
    display: inline-block;
    height: 40px;
    line-height: 40px;
}

.file-upload .file-select.file-select-disabled:hover .file-select-name {
    line-height: 40px;
    display: inline-block;
    padding: 0 10px;
}

/* trainner-content-item */

.tci-main-bx {
    margin-bottom: 20px;
}

.tci-main-bx:first-child {
    margin-top: 10px;
}

.tci-main-bx:last-of-type {
    margin-bottom: 0px;
}

.tci-main-bx .trainner-content-item {
    border: 1.5px solid #dedede;
    padding: 15px;
    border-radius: 10px;
    background-color: #fcfcfc;
}

.tci-main-bx .trainner-content-item .tci-heading {
    font-size: 16px;
    line-height: 1.4;
    font-weight: 600;
    color: var(--color-3);
    margin: 0;
    margin-bottom: 0px;
    position: relative;
    padding: 0px 0 5px;
}

.tci-main-bx .trainner-content-item .tci-description {
    width: 100%;
    position: relative;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 400;
    margin-top: 5px;
    margin-bottom: 5px;
    color: var(--color-4);

}

.tci-popup-bx .tci-row>div,
.tci-main-bx .tci-row>div {
    margin-top: 10px;
    padding: 0 15px;
}

.tci-popup-bx .tci-doqument-item,
.tci-main-bx .tci-doqument-item {
    position: relative;
    box-shadow: 0 0 0 1px #dedede;
    padding: 7px;
    border-radius: 5px;
    display: flex;
    transition: all 0.3s linear;
    background: #ffffff;
    padding-bottom: 45px;
    cursor: pointer;
}

.tci-popup-bx .tci-doqument-btns,
.tci-main-bx .tci-doqument-btns {
    position: absolute;
    right: 10px;
    bottom: 10px;
}

.tci-popup-bx .tci-doqument-item:hover,
.tci-main-bx .tci-doqument-item:hover {
    box-shadow: 0 0 0px 1px var(--color-1);
    /* background-color: var(--background-color-3); */
}

.tci-popup-bx .tci-doqument-item>img,
.tci-main-bx .tci-doqument-item>img {
    width: 65px;
    height: 65px;
    border-radius: 5px;
    margin-right: 10px;
}

.tci-popup-bx .tci-doqument-item .tci-doqument-text,
.tci-main-bx .tci-doqument-item .tci-doqument-text {
    flex-grow: 1;
}

.tci-popup-bx .tci-doqument-item .tci-doqument-text h6,
.tci-main-bx .tci-doqument-item .tci-doqument-text h6 {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    margin-bottom: 3px;
    color: var(--color-3);
    transition: all 0.3s linear;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.tci-popup-bx .tci-doqument-item:hover .tci-doqument-text h6,
.tci-main-bx .tci-doqument-item:hover .tci-doqument-text h6 {
    color: var(--color-1);
}

.tci-popup-bx .tci-doqument-item .tci-doqument-text .tci-doqument-price,
.tci-main-bx .tci-doqument-item .tci-doqument-text .tci-doqument-price {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    margin-bottom: 3px;
    color: var(--color-3);
    transition: all 0.3s linear;
}

/* ... Certificate Popup (dash-right) Css ... */
.certificate-popup {
    padding: 30px 15px;
}

.certificate-popup .certificate-popup-heading {
    font-size: 20px;
    line-height: 24px;
    font-weight: 700;
    color: var(--color-3);

    margin: 0;
    margin-bottom: 0px;
}

.certi-item {
    position: relative;
    padding: 10px;
    padding-bottom: 35px;
    margin: 10px 0px;
    border-radius: 5px;
    background: #fbfbfb;
    transition: all 0.3s linear;
    box-shadow: 0 0 0 1px #dedede;
}

.certi-item .certi-name {
    margin: 0;
    margin-bottom: 0px;
    position: relative;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.6;
    padding: 0px 0 5px;
    color: var(--color-4);

}

.certi-item .certi-desc {
    width: 100%;
    position: relative;
    font-size: 14px;
    line-height: 1.4;
    font-weight: 400;
    padding: 0px 0 5px;
    color: var(--color-3);

}

.certi-item .certi-date {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6;
    color: var(--color-4);

}

.certi-item .certi-btns {
    position: absolute;
    bottom: 10px;
    right: 10px;
}



/*  */

.about-trust-verifi .atv-heading {
    font-size: 20px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--color-3);
}

.about-trust-verifi .atv-desc {
    width: 100%;
    position: relative;
    font-size: 14px;
    line-height: 1.5;
    font-weight: 400;
    margin-top: 5px;
    margin-bottom: 5px;
    color: var(--color-4);
}

.trust-verifi-item {
    position: relative;
    margin: 10px 0px;
    border-radius: 5px;
    background: #ffffff;
    transition: all 0.3s linear;
    box-shadow: 0 0 0 1px #dedede;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 15px;
}

.trust-verifi-item .trust-verifi-heading {
    font-size: 16px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--color-4);
}

.trust-verifi-item .trust-verifi-btn .tvb-add-span {
    display: block;
    cursor: pointer;
    color: var(--color-4);
    font-size: 14px;
    padding: 5px 20px;
    font-weight: 400;
    border-radius: 5px;
    background: #eeeeee;
    border: 1px solid rgb(0 0 0 / 6%);
    transition: all 0.3s ease-in-out;

}

.trust-verifi-item .trust-verifi-btn .tvb-add-span:hover {
    color: white;
    background: #295ea2;
    border-color: #295ea2;
}

.trust-verifi-item .trust-verifi-btn .tvb-verified-span {
    display: block;
    cursor: pointer;
    color: white;
    font-size: 14px;
    padding: 5px 20px 4px;
    font-weight: 500;
    border-radius: 5px;
    background: #28a745;
    border: 1px solid #28a745;
    transition: all 0.3s ease-in-out;

}

.profile-status-bx {
    max-width: 100%;
    width: 100%;
    margin: 10px auto 10px;
    background: white;
    border-radius: 5px;
    box-shadow: 0 0px 0px 1px rgb(0 0 0 / 6%);
}

.psb-left {
    position: relative;
}

.psb-right .psbl-heading,
.psb-left .psbl-heading {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 600;
    color: var(--color-3);

}

.psb-left .psbl-percentage {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--color-3);

    position: absolute;
    right: 0;
    top: 3px;
}

.psb-left .psbl-per-bar {
    width: 100%;
    height: 10px;
    background-color: #e7e7e7;
    border-radius: 50px;
    margin: 10px 0;
    position: relative;
    overflow: hidden;
}

.psb-left .psbl-per-bar .psblpb-inner {
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 50px;
    background: linear-gradient(90deg, var(--color-2) 0%, var(--color-1) 100%);
    transition: all 0.3s linear;
}

.psb-left .psbl-desc {
    font-size: 14px;
    line-height: 1.4;
    font-weight: 400;
    color: var(--color-4);
}

.psb-right .psbl-account-progress {
    display: block;
    border: 1px solid #dedede;
    padding: 12px 10px;
    border-radius: 5px;
    margin-top: 10px;
    color: var(--color-3);
    transition: all 0.3s ease-in-out;
}

.psb-right .psbl-account-progress div {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;

}

.psb-right .psbl-account-progress div img {
    width: 30px;
    margin-right: 5px;
}

.psb-right .psbl-account-progress:hover {
    color: #295ea2;
    border-color: #295ea2;
    background-color: #295da212;
    box-shadow: 0 0 5px 0 #00000014;
}

/* ---
verify-popup css
--- */
.verify-popup {
    background: linear-gradient(45deg, #f0f6fe, #faf1fa);
    background-repeat: no-repeat;
    width: 100%;
    -webkit-box-shadow: 0 0 20px #0000002e;
    box-shadow: 0 0 20px #0000002e;
    border-radius: 5px;
    position: relative;
    padding: 25px 20px 20px;
    margin: auto;
}

.verify-popup .verify-heading {
    color: #1c2b33;
    font-weight: 700;
    font-size: 20px;
    margin: 0;
    margin-bottom: 5px;
    font-family: var(--font-2);
}

.verify-popup .verify-peragraf {
    color: #1c2b33;
    font-weight: 500;
    font-size: 16px;
    margin: 0;
    margin-bottom: 10px;
    font-family: var(--font-2);
}

.send-otp-btn {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    padding: 3px 8px;
    font-size: 14px;
    font-weight: 700;
    border-radius: 5px;
    outline: none;
    color: var(--color-1);
    letter-spacing: 0.5px;
    background: #f5f5f5;
    border: 1px solid #e2e2e2;
    transition: all 0.3s ease-in-out;
    font-family: var(--font-2);
}

.send-otp-btn:hover {
    color: var(--white);
    background-color: var(--color-1);
    border-color: var(--color-1);
}

.signinup-group.verify-group {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0;
}

.signinup-group.verify-group input {
    width: 50px;
    height: 50px;
    padding: 0 !important;
    text-align: center;
    font-size: 24px;
    margin: 0 5px;
}


.certi-outter>.certi-item {
    padding: 10px;
    cursor: pointer;
}

.certi-outter .certi-item .certi-name {
    font-weight: 500;
}

.certi-outter .certi-item:hover {
    -webkit-box-shadow: 0px 0px 0px 1px var(--color-1);
    box-shadow: 0px 0px 0px 1px var(--color-1);
    background-color: #295ea208;
}


.review-popup {
    background: linear-gradient(45deg, #f0f6fe, #faf1fa);
    background-repeat: no-repeat;
    width: 100%;
    -webkit-box-shadow: 0 0 20px #0000002e;
    box-shadow: 0 0 20px #0000002e;
    border-radius: 5px;
    position: relative;
    padding: 25px 20px 20px;
    margin: auto;
}

.review-popup .review-heading {
    color: #1c2b33;
    font-weight: 700;
    font-size: 20px;
    margin: 0;
    margin-bottom: 5px;
    font-family: var(--font-2);
}

.review-popup .review-peragraf {
    color: #1c2b33;
    font-weight: 500;
    font-size: 16px;
    margin: 0;
    margin-bottom: 10px;
    font-family: var(--font-2);
}

.rating-group-name {
    margin: 0;
    margin-bottom: 5px;
    font-size: 12px;
    font-weight: 500;
    color: #212121;
}

.add-reviews-btn {
    position: absolute;
    right: 35px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    padding: 3px 8px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 5px;
    outline: none;
    color: var(--color-4);
    letter-spacing: 0.5px;
    background: #f5f5f5;
    border: 1px solid #e2e2e2;
    transition: all 0.3s ease-in-out;
    font-family: var(--font-2);
    cursor: pointer;
}

.add-reviews-btn:hover {
    color: var(--white);
    background-color: var(--color-1);
    border-color: var(--color-1);
}

/* ----------------------------
    Start Rating css
---------------------------- */
.rating-group-name {
    margin: 0;
    margin-bottom: 5px;
    font-size: 12px;
    font-weight: 500;
    color: #212121;
}

.rating-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin: 0 0 0px 0;
}

.rating__icon {
    pointer-events: none;
}

.rating__input {
    position: absolute !important;
    left: -9999px !important;
}

.rating__input--none {
    display: none;
}

.rating__label {
    cursor: pointer;
    padding: 0 0.1em;
    margin: 0;
    font-size: 18px;
}

.rating__icon--star {
    color: orange;
}

.rating__input:checked~.rating__label .rating__icon--star {
    color: #cacaca;
}

.rating-group:hover .rating__label .rating__icon--star {
    color: orange;
}

.rating__input:hover~.rating__label .rating__icon--star {
    color: #cacaca;
}

/* ---
User Dash Media css
--- */
@media screen and (max-width:420px) {
    .courses-item-outter {
        max-width: 100%;
        flex: 0 0 100%;
    }
}

@media screen and (max-width:420px) {
    .signinup-group.verify-group input {
        width: 40px;
        height: 40px;
        font-size: 18px;
    }

    .profile-menu .profile-link {
        padding: 15px 10px;
    }

    .search-icon-bx {
        display: none !important;
    }
}

@media screen and (max-width:992px) {
    .dash-bx {
        flex-direction: column;
    }

    .dash-bx .dash-left {
        width: 100%;
        height: auto;
        flex: none;
        box-shadow: 0 0px 0px 2px rgb(0 0 0 / 6%);
        z-index: 2;
    }

    .dash-left .trainer-pic-bx {
        display: none;
    }

    .dash-left .profile-menu {
        padding: 0;
        white-space: nowrap;
        overflow-x: overlay;
        display: flex;
    }

    .dash-left .profile-menu::-webkit-scrollbar {
        display: none;
    }

    .profile-menu .profile-link {
        display: inline-block;
        margin-bottom: 0;
        padding: 15px 15px;
        letter-spacing: 0;
    }

    .profile-menu .profile-link::after {
        width: 100%;
        height: 3px;
        top: inherit;
        bottom: 0px;
    }

    .profile-menu .profile-link.active {
        background: linear-gradient(0deg, #295ea20a, transparent);
    }

    .add-reviews-btn {
        right: 10px;
    }

}

.selector {
    display: flex;
    height: 36px;
    width: 360px;
    align-items: center;
    justify-content: center;
}

.selector .selection {
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    height: 100%;
    width: 100%;
    margin-left: -1px;
    background-clip: border-box;
    transform: scale3d(1, 1, 1);
    background: rgba(32, 45, 59, 0.2);
    border: 1px solid #485769;
    color: #ced7e2;
    transition: 0.15s ease-in-out background-color;
}

.selector .selection.selected {
    background: #9842da30 !important;
    border-color: #9842da;
    color: #ffffff !important;
    z-index: 2;
    cursor: text;
}

.selector .selection:hover {
    color: #af7ad7;
    background: rgba(91, 150, 213, 0.05);
}

.selector .selection:first-child {
    margin-left: 0;
    border-radius: 3px 0 0 3px;
}

.selector .selection:last-child {
    border-radius: 0 3px 3px 0;
}

.form-group label {
    color: #ffffff80;
    margin: 10px 0;
}


.profile-inner-tab img {
    width: 20%;
}

.member-item {
    box-shadow: 0 0 5px #afa8bb0d inset;
    border: 1px solid #ebebeb3b;
    border-radius: 15px;
    min-height: 150px;
    margin: 10px 0;
    padding: 10px;
    /* background: #fcfcfc; */
}

.member-hed-img {
    display: flex;
    align-self: center;
}


.member-hed-img div {
    font-size: 20px;
    color: #e0e0e0;
    font-weight: 700;
    font-family: 'Nunito', sans-serif !important;
}

.member-hed-img div span {
    font-weight: 500;
    font-size: 14px;
    color: #e0eee0;
    margin: 0px;
    display: block;
    margin-top: -5px;
    font-family: 'Nunito', sans-serif !important;
}


.member-dacs-item {
    margin-top: 5px;
}

.member-dacs-item .mdacs-head {
    font-weight: 600;
    font-size: 14px;
    color: #e0e0e0;
    padding: 5px 0 0px;
    position: relative;
    font-family: 'Nunito', sans-serif !important;
}

.member-dacs-item .mdacs-htext {
    font-weight: 600;
    font-size: 14px;
    color: #c6c6c6;
    padding: 0px 0 0px;
    position: relative;
    font-family: 'Nunito', sans-serif !important;
}


.membar-vd-btn {
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    color: white;
    border: 1px solid var(--color-1);
    padding: 5px 10px;
    border-radius: 5px;
    cursor: pointer;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    font-family: 'Nunito', sans-serif !important;
    text-align: center;
    margin-top: 10px;
    margin: 15px auto 5px;
    display: block;
    width: fit-content;
    background-color: #8230c6;
}

.empty-div-bx span {
    font-size: 20px;
    color: #fff;
    opacity: .5;
}

.empty-div-bx a {
    margin-top: 20px;
    color: #fff;
    padding: 10px 10px;
    background-color: #8230c6;
    border-radius: 5px;
}

.empty-div-bx h6 {
    margin-bottom: 20px;
}

.plans-dialog {
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
    height: 100%;
    padding: 5px;
    align-items: inherit;
}

.plans-dialog .modal-content {
    background-color: rebeccapurple;
    margin-top: 50px;
}

.plans-popup-bx {
    /* background-color: white; */
    border-radius: 10px;
    /* position: relative; */
    padding: 15px;
}

.popup-heading {
    font-size: 24px;
    font-weight: 700;
    color: #fff;
    margin: 0;
    font-family: 'Nunito', sans-serif !important;
    text-align: center;
    text-transform: capitalize;
}

.plans-content {
    border: 1px solid #295ea2;
    border-radius: 10px;
    padding: 10px;
    /* min-height: 100px; */
    display: none;
}

.plans-details {
    border: 1px solid #ebebeb3b;
    box-shadow: 0 0 5px #afa8bb0d inset;
    margin-top: 20px;
}

.prcss {
    position: relative;
}

.dzfbgn {
    position: absolute;
    left: 10px;
    top: -13px;
    font-size: 16px;
    color: #fff;
    font-weight: 700;
    font-family: 'Nunito', sans-serif !important;
    padding: 0 9px;
    background-color: rebeccapurple;
}

.member-dacs-item {
    margin-top: 5px;
}

.plan-inc-box .plan-inc-item {
    flex: 0 0 100%;
    width: 100%;
    padding: 10px 0px 10px 25px;
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    position: relative;
    border-bottom: 1px dashed #ebebeb3b;
}

.plan-inc-item.plan-main-heading {
    padding: 10px;
}

.plan-inc-box .plan-inc-item:last-child {
    border-bottom: none;
}

.plan-inc-box .plan-inc-item img {
    width: 14px;
    height: 14px;
    position: absolute;
    left: 5px;
    top: 15px;
}

.plan-main-heading>img {
    display: none;
}

.plan-sub-text {
    font-size: 12px;
    margin: 0;
    margin-top: 5px;
    color: white;
    opacity: .9;
    font-weight: 400;
}

.not-inc-item>* {
    opacity: 0.7;
}

.not-inc-item {
    color: #b3b3b3 !important;
}

.plans-popup-bx .commun-close-icon {
    color: #fff;
}