.indices-box {
    background-color: #060606;
    border-radius: 10px 10px 15px 15px;
    margin-bottom: 10px;
    height: calc(100% - 10px);
}

    .indices-box .pd-combine-widget-title {
        width: 100%;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

    .indices-box .widget-pd-box {
        padding-bottom: 15px;
        height: calc(100% - 27px);
    }

    .indices-box .btn-warning {
        background: transparent !important;
        background-blend-mode: normal;
        border-radius: 20px;
        font-size: 13px;
        font-weight: 500;
        color: #009490 !important;
        padding: 2px 13px;
        font-family: var(--font-Poppins);
        border: 1px solid #003D3D !important;
        box-shadow: none;
    }
       .indices-box .btn-warning:hover{
           color: #009490 !important;
           border-color: #009490 !important;
       }

.widget-pd-box .btn-warning {
    background: transparent !important;
    background-blend-mode: normal;
    font-size: 13px;
    font-weight: 400;
    color: #fff !important;
    border: 0;
    padding: 4px 22px;
    margin-top: -50px;
    font-family: var(--font-Poppins);
    border: 1px solid #fff !important;
    border-radius: 30px;
    box-shadow: none !important;
    opacity: 60%;
}
.widget-pd-box .btn-warning:hover{
    border-color: #fff !important;
    background-color: transparent;
    color: #fff !important;
    opacity: 80%;
}

header.header-mobile #mainmenu > li > span.user_initial {
    width: 40px;
    height: 40px;
    background: #0ABDB1;
    border-radius: 50%;
    line-height: 42px;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    float: left;
    position: relative;
    text-align: center;
    margin: 10px 20px;
    text-transform: uppercase;
}

header.header-mobile #mainmenu > li .username {
    font-size: 18px;
    color: #0ABDB1;
    font-weight: 700;
}

header.header-mobile #mainmenu > li .user-info-mob {
    padding: 7px 0 0;
    float: left;
    width: 70%;
    margin: 0 0 8px;
}

.goc-id {
    display: block;
    color: #fff;
    font-size: 14px;
    margin: -7px 0 0 0;
}

header nav {
    top: 65px;
}

.gocGenie-power-box.clock-box span.text-bear {
    padding: 0;
}

.clock-box .fa {
    font-size: 17px;
}
/*.popup-genie-popup {
    z-index: 2222
}*/
.popup-genie-popup .modal-dialog {
    max-width: 1000px;
}

.popup-genie-popup .modal-content {
    background: url(../images/bg-popup-demo.jpg) no-repeat;
    background-size: cover;
    background-position: center right;
    border-radius: 30px
}

.popup-genie-popup h1,
.popup-genie-popup h3 {
    font-size: 28px;
    color: #fff;
    text-align: center;
    font-weight: 700;
    line-height: 34px
}

.popup-info h4,
.popup-genie-popup h3 {
    font-size: 20px;
    font-weight: 500;
    margin: 10px 0;
    color: #fff;
    line-height: 26px
}

    .popup-genie-popup h1 span, .popup-genie-popup h3 b,
    .font-22-demo b,
    .popup-genie-popup li b {
        color: #FFD400
    }

.popup-info {
    width: 410px;
    margin: 0 auto;
}

    .popup-info ul {
        list-style: none;
        margin: 0 0 20px;
        padding: 0
    }

        .popup-info ul li {
            font-size: 16px;
            font-weight: 500;
            color: #fff;
        }

    .popup-info h4 {
        font-weight: 700;
        padding: 0;
        margin: 0;
    }

.popup-genie-popup h1 .font-40 {
    font-size: 32px;
    text-transform: uppercase;
}

.option-demo-box-ttl {
    width: 100%;
    margin: -5px 0 15px;
    position: relative;
    display: flex
}

.ttl-text-or {
    background: #17C1CA;
    font-size: 18px;
    font-weight: bold;
    color: #000000;
    border-radius: 20px;
    padding: 2px 15px;
    margin: 0 auto;
    position: relative;
    z-index: 5;
    text-transform: uppercase
}

.line-blue {
    border-bottom: 2px solid #17C1CA;
    width: 100%;
    margin: 0px 0 0;
    position: absolute;
    display: block;
}

.font-22-demo {
    font-size: 18px;
    font-weight: 500;
    color: #fff;
    text-align: center;
    margin: 0 0 10px;
    border-radius: 15px
}

.date-pick-demo {
    max-width: 220px;
    margin: 0 auto 15px
}

    .date-pick-demo.form-control:disabled, .date-pick-demo.form-control[readonly],
    .date-pick-demo.form-control:focus {
        background: #fff !important
    }

.close-demo-popup {
    position: absolute;
    top: -16px;
    right: -16px;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 0;
}

    .close-demo-popup span {
        margin: -3px 0 0;
        display: block;
        text-align: center;
    }

    .close-demo-popup img {
        width: 15px;
    }

.rounded-btn.golden-btn {
    border: 0
}

.img-box-popup img {
    max-width: 100%
}

/*GOC Landing Page */
.main-landing-goc {
    background: #0f0f0f;
}

.bnr-landing {
    display: flex
}

.banner-left,
.banner-right {
    width: 25%;
}

    .banner-left img,
    .banner-right img {
        width: 100%;
        max-width: 100%
    }

.banner-center-text {
    width: 50%;
    text-align: center
}

    .banner-center-text h1 {
        font-size: 64px;
        line-height: 70px;
        font-weight: 600;
        font-family: "Poppins", sans-serif;
        text-align: center;
        -webkit-text-fill-color: transparent;
        background-color: #7DF4FE;
        background-image: linear-gradient(79deg, #0DCFFC, #7DF4FE 63%, #1B8C9C);
        -webkit-background-clip: text;
        background-clip: text;
    }

        .banner-center-text h1 span {
            color: #fff;
            font-size: 72px;
            font-weight: 700;
            display: block;
            margin: 30px 0;
            background-color: #fff;
            background-image: linear-gradient(#fff, #fff);
            /* -webkit-background-clip: text;
                background-clip: text;*/
        }

    .banner-center-text h4 {
        font-size: 22px;
        color: #fff;
        line-height: 32px;
        font-weight: bold;
        text-align: center;
        margin: 20px 0 0
    }

.btn-blue-landing,
.btn-blue-landing-book {
    color: #000000 !important;
    background: linear-gradient(to right, #1B8C9C, #0DCFFC, #006464 );
    font-size: 16px;
    font-weight: bold;
    border-radius: 30px;
    padding: 10px 25px;
    margin: 30px 0
}

.btn-blue-landing-book {
    font-size: 24px;
    padding: 15px 65px;
}

.youtube-video-landing {
    justify-content: center;
    display: flex;
    padding: 0px 0 100px;
    position: relative;
}

.video-outer {
    border-radius: 40px;
    box-shadow: 15px 15px 35px rgba(69,69,69,0.5);
    width: 1000px;
    margin: -120px auto 0;
}

.video-container {
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    border-radius: 40px;
}

    .video-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        aspect-ratio: 16 / 9;
    }

.content-section-landing {
    display: flex;
    align-items: center;
    padding: 80px 0
}

    .content-section-landing .container {
        max-width: 1340px;
    }

.text-section-landing {
    width: 90%
}

    .text-section-landing h2 {
        font-size: 48px;
        line-height: 50px;
        color: #fff;
        font-family: "Poppins", sans-serif;
        margin: 0 0 15px;
        padding: 0
    }

        .text-section-landing h2 span {
            font-family: "Poppins", sans-serif;
            font-weight: 500;
            color: #808080;
            font-size: 18px;
            display: block;
            line-height: 20px;
            margin: 0 0 5px;
        }

.para-text {
    font-size: 20px;
    color: #fff;
    line-height: 32px;
    font-weight: 500;
    color: #E0E0E0;
    margin: 20px 10% 30px 0;
}

    .para-text b, .para-text strong,
    .feature-list-landing li b, .feature-list-landing li strong {
        font-weight: 700;
        color: #fff;
    }

.testimonial-box-landing {
    border: 1px solid #272727;
    box-shadow: 15px 15px 30px rgba(69,69,69,0.5);
    font-size: 18px;
    color: #fff;
    padding: 20px;
    border-radius: 20px;
    margin: 0 15% 0 0;
}

.user-dtl-landing {
    display: flex
}

    .user-dtl-landing img {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        margin: 0 15px 0 0;
    }

    .user-dtl-landing span {
        font-size: 16px;
        color: #fff;
        padding: 5px 0 0
    }

.img-box-landing {
    border: 1px solid #272727;
    box-shadow: 15px 15px 30px rgba(69,69,69,0.5);
    width: 90%;
    padding: 10px 40px;
    position: relative;
    border-radius: 20px;
    margin: 0 auto;
    text-align: center;
}


.img-box-landing-sec2,
.img-box-landing-sec3 {
    padding: 40px 10px;
}

.img-box-landing .img-section {
    border-radius: 14px;
    max-width: 100%
}

.icn-section-1,
.icn-section-2,
.icn-section-3,
.icn-section-4, .icn-section-5 {
    position: absolute;
    transition: all 0.8s ease-in
}


.icn-section-1 {
    bottom: 130px;
    right: -110px;
    opacity: 0;
}

.icn-section-2 {
    top: -100px;
    right: 500px;
    opacity: 0
}

.icn-section-3 {
    top: 100px;
    right: -200px;
    opacity: 0
}

.icn-section-4 {
    bottom: -20px;
    left: 100%;
    opacity: 0
}

.icn-section-5 {
    bottom: -100px;
    left: 400px;
    opacity: 0
}

.animated.icn-section-1 {
    bottom: -30px;
    right: -110px;
    opacity: 1
}

.animated.icn-section-2 {
    top: -100px;
    right: -20px;
    opacity: 1
}

.animated.icn-section-3 {
    top: -100px;
    right: 50px;
    opacity: 1
}

.animated.icn-section-4 {
    bottom: -20px;
    left: 40%;
    opacity: 1
}

.animated.icn-section-5 {
    bottom: -100px;
    left: -100px;
    opacity: 1
}

.feature-list-landing {
    padding: 0;
    margin: 20px 0 25px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
}

    .feature-list-landing li {
        display: flex;
        list-style: none;
        font-size: 22px;
        color: #E0E0E0;
        margin: 8px 0;
    }

    .feature-list-landing.fl-left {
        margin: 0px 0 5px;
    }

        .feature-list-landing.fl-left li {
            float: left;
            width: auto;
            margin: 0px 15px 5px 0;
        }

    .feature-list-landing li p {
        margin: 0;
        padding: 5px 0 0;
        display: inline-block
    }

    .feature-list-landing li span {
        z-index: 1;
        background-color: #141414;
        border: 1px solid #4B4B4B;
        border-radius: 100%;
        flex: none;
        justify-content: center;
        align-items: center;
        width: 40px;
        height: 40px;
        margin-right: 15px;
        display: flex;
        position: relative;
    }

/*---------------Timer -------------------*/
.timer-count-outer, .live-session-outer {
    background: url(../images/bg-goc-ad-banner-timer.png) no-repeat;
    width: 100%;
    background-size: cover;
    background-position: center center;
    display: flex;
    align-items: center;
    font-family: "Poppins", sans-serif;
    margin: 15px 0; height:120px;
}

.live-session-outer {
    background: url(../images/bg-live-session.jpg) no-repeat;
}

.logo-goc-timer {
    width: 100px;
    float: left;
    padding: 0 20px;
}

    .logo-goc-timer img {
        width: 100%
    }

.timer-box-outer {
    padding: 8px 0;
    height: 100%;
    position: relative;
    display: flex
}
/* .timer-box-outer:before {
        content: "";
        background: rgba(0,0,0,.5);
        height: 100%;
        clip-path: polygon(8% 0%, 100% 0%, 92% 100%, 0% 100%);
        width: 100%;
        position: absolute;
        
        left: 0;
        top: 0
    }*/


.new-price-timer {
    margin-top: 25px;
    width: 420px;
}

.timer-text-red {
    font-size: 20px;
    line-height: 24px;
    font-weight: bold;
    display: block;
    text-align: center;
    color: #fff;
    width: 100%;
    z-index: 2;
    position: relative;
    background: #E52D39;
    border-radius: 0 16px 0 16px;
    padding: 15px;
    text-align: center;
}

    .timer-text-red b {
        font-weight: bold;
        color: #FFD95A
    }

.timer-box {
    text-align: center;
    margin: 0px auto 0;
    padding: 0px 0 5px;
    z-index: 2;
    position: relative;
}

.timer-cnt {
    margin: 15px 10px 0;
    display: flex;
    justify-content: center;
    clear: both
}

.time-couter {
    font-size: 12px;
    color: #F2B801;
    display: block;
    text-align: center;
    width: 50px;
    margin: 0 5px;
    float: left;
    line-height: 12px;
}

    .time-couter span {
        width: 50px;
        background: #F2B801;
        width: 50px;
        height: 30px;
        font-size: 18px;
        color: #0A1B35;
        border-radius: 10px;
        display: block;
        margin: 0 0 5px;
        text-align: center;
        line-height: 30px;
        font-weight: bold;
    }

.icn-timer {
    width: 45px;
}


.right-icn {
    float: right
}

.btn-box-rigth {
    width: 150px;
    float: left;
    text-align: center;
}

.gradient-btn {
    background: transparent linear-gradient(90deg, #057895 0%, #0ab0b0 100%) 0% 0%;
    margin: 0 20px;
    white-space: nowrap;
    transition: 0.4s ease-in-out all;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    padding: 6px 15px;
    border: 2px solid #fff;
    color: #fff !important;
    border-radius: 20px;
    text-transform: uppercase;
}
.live-session-box-outer,
.live-session-outer {
    display: flex; align-items:center
}
.live-session-box-outer .img-box{float:left; margin:0 7px;}


.d-desktop {
    display: block;
}

.d-mobile {
    display: none
}

/* -----------------------------GOC Tutorials-------------*/
.btn-watchnow {
    border: 2px solid #1CC6C6;
    border-radius: 10px;
    padding: 8px 7px;
    color: #1CC6C6 !important;
    font-size: 14px;
    font-weight: 600;
}

.font-gold {
    color: #E3AD22;
    font-weight: bold;
}

#tutorial h1 {
    color: #000;
    font-size: 36px;
    text-align: center;
    display: block;
    font-weight: bold;
}

#tutorial.dark-theme h1 {
    color: #fff;
    font-size: 36px;
    text-align: center;
    display: block;
    font-weight: bold;
}

.tutorial-outer {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 20px 0 0
}


.tutorial-box {
    background: #4D4D4D;
    padding: 12px;
    box-shadow: 0 0 15px #494949;
    width: 48%;
    border-radius: 15px;
    margin: 0 1% 30px;
    position: relative;
}

    .tutorial-box h4 {
        color: #fff;
        font-size: 16px;
        font-weight: bold;
        margin-bottom: 6px;
        margin-top: 0;
    }

.tutorial-video {
    float: none;
    clear: both;
    width: 100%;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 25px;
    height: 0;
    overflow: hidden;
}

    .tutorial-video img {
        width: 100%;
    }

    .tutorial-video iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 8px;
    }

.overlay-tutorial-box {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgba(10, 10, 10, 0.5);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(8px);
}

    .overlay-tutorial-box p {
        margin: 0;
        color: #ffffff;
        font-size: 18px;
        font-weight: 700;
    }


    /*---------------------CSS for Plan Upgrade */
.plan-upgrade-ttl {
    font-family: "Poppins", sans-serif;
     
}
.ttl-box-update {
    padding: 40px 0 30px
}
    .ttl-box-update .video-container {
        border: 5px solid #1CC6C6;
        box-shadow: 0 0 15px #677378;
    }
.login-detail-plan, .validity-price-box {
    background: #161616;
    border-radius: 20px;
    margin: 0 0 30px;
    padding: 20px;
    box-shadow: 0 0 10px #101010;
}
.validity-price-box h3{color:#fff; font-size:24px;}
.login-detail-plan .user-name-plan {
    font-size: 20px;
    color: #fff;
}
        .login-detail-plan .custom-label b {
            color: #1CC6C6
        }
.brdr-btm {
    border-bottom: 1px solid #323232; margin:0 0 15px;
}
.icn-user-plan,
.icn-current-plan {
    width: 40px;
    height: 40px;
    border: 1px solid #979797;
    border-radius: 50%;
    float: left;
    margin: 0 15px 0 0;
    text-align: center;
    line-height: 36px;
}
    .icn-current-plan{width:50px; height:50px; line-height:46px;}
    .lbl-plan {
        font-size: 16px;
        color: #909090;
        font-weight: normal;
        line-height: 22px;
        margin: -3px 0 0 0;
       word-break: break-word;
    }
.plan-validity-box .lbl-plan { line-height:26px;
}
.lbl-plan b {
    font-size: 20px;
    font-weight: bold;
    color: #fff;
    display: block;
}
.lbl-plan b.email-text {
            color: #1CC6C6;
            text-decoration: underline;
        }
.help-text-plan{font-size:16px; color:#fff; display:block; margin:15px 0 0;}
    .help-text-plan b, .help-text-plan b a {
        color: #00BD47;
        text-decoration: underline;
    }
    .help-text-plan b, .help-text-plan b a:hover{
        color: #04ec5d;
    }
.plan-validity-box,
.plan-validity-reminder {
    border: 2px solid #FFB800;
    border-radius: 20px;
    background: transparent linear-gradient(90deg, #0E0700 0%, #291E03 100%) 0% 0%;
    position: relative;
    margin: 45px 0 30px;
    padding: 0 20px 20px;
    box-shadow: 0 0 10px #101010;
}

.plan-validity-reminder {
    border: 2px solid #0BB2B1;
    margin: 0 0 30px 0;
    background: transparent linear-gradient(90deg, #000 0%, #032928 100%) 0% 0%;
    font-size: 18px;
    color: #0BB2B1;
    text-align: center;
    padding: 20px 20px 0;
}

.plan-validity-reminder b {
    color: #fff
}


    .ttl-current-plan {
        background: #FFB800;
        border-radius: 10px;
        font-size: 16px;
        font-weight: bold;
        color: #000;
        text-align: center;
        padding: 5px 15px;
        margin: 0px 0 0 0px;
        text-transform: uppercase;
        box-shadow: 0 0 10px #101010;
        position: relative;
        top: -15px;
    }
.expire-text {
    color: #FFB800; font-size:18px; font-weight:normal;
}
.price-plan .renew-planFeature,.event-points { list-style:none; max-width:280px; margin:5px 0 0; padding-left:0
}
    .price-plan .renew-planFeature li, .event-points  li{
        line-height: 20px;
        width: 100%;
        float: left;
    }
        .price-plan .renew-planFeature li:before,
        .event-points li:before {
            content: "";
            width: 14px;
            height: 14px;
            background: url(../images/icn-tick.svg) no-repeat;
            background-size: 13px 13px;
            float: left;
            margin: 3px 7px 4px 0;
        }
    .price-plan .renew-planFeature li::marker{font-size:0}

.new-price-lbl {
    color: #FFB800;
    font-size: 16px;
    font-weight: 600;
    display: block;
    margin: 10px 0 0;
}
        .new-price-lbl span{font-size:18px; font-weight:700}

.validity-price-box .price-year-plan-box .final-price {
    text-align: right;
    margin:0 0 0 auto;
}
.validity-price-box .renew-plan-col-wrapper .price-year-plan-box .price-offer {
    border: 2px solid #0BB2B1; padding:4px 10px; width:130px; margin-bottom:5px;
    color: #0BB2B1;
}
.validity-price-box .price-year-plan-box .final-price,
.price-year-plan-box .final-price {
    font-family: "Poppins", sans-serif;
    font-size: 30px;
}

.validity-price-box .price-year-plan-box .renew-plan-col-wrapper {float:left;
}

.offer-box-plan {
    width: 150px;
    margin: 0 auto;
    font-family: "Poppins", sans-serif;
}
.best-price-value {
    background: transparent;
    margin: 0 auto;
    font-size: 16px;
    text-align: center;
    border-radius: 50px;
    margin-top: 0.5rem;
    color: #0EB2B1;
    font-weight: bold;
    max-width: 130px;
    position: relative;
    z-index: 5;
    border: 2px solid #0EB2B1; padding:4px 10px;
}
.price-year-plan-box {
    position: relative;
    padding: 15px 1rem 30px;
}
/*.active-plan {
    padding: 1rem 1rem 35px;
}*/
.active-plan.current-plan { display:block;
}
.current-plan {
    display:none;
    background: #0BB2B1;
    border-radius: 0 20px 0 20px;
    position: absolute;
    left: -1px;
    bottom: -1px;
    padding: 2px 20px 2px 15px;
    color: #000;
    font-size: 14px; font-weight:bold;
}
.current-plan img{float:left; margin:0 5px 0 0}

/* ---------Mega Event CSS Start */
.bg-mega-event {
    background: url("../images/bg-mega-event.svg") no-repeat;
    text-align: center;
    background-size: 100% auto !important;
    font-family: "Poppins", sans-serif;
    padding: 40px 0 0
}
    .bg-mega-event h1 {
        font-size: 44px;
        line-height: 60px;
        font-weight: 500;
        text-align: center;
        font-family: "Poppins", sans-serif;
    }
.goc-genie-event-box {
    width: 480px;
    height: 480px;
    border: 2px solid #0BB2B1;
    background: rgb(0,30,29);
    background: radial-gradient(circle, rgba(0,30,29,1) 0%, rgba(4,47,46,1) 100%);
    border-radius: 50%;
    text-align: center;
    position: relative;
    padding: 80px 20px 20px;
    margin: 150px 0 50px;
    float: right;
}

.img-genie-event {
    position: absolute;
    top: -57%;
    transform: translate(90%, 50%);
}

.event-ttl-genie {
    font-size: 72px;
    font-weight: 700;
    color: #1CC6C6; line-height:74px; margin: 0 0 20px; text-transform:uppercase;
}
    .event-ttl-genie span {
        font-size: 36px;
        color: #fff;
        display: block;
        margin: 10px 0 20px;
        line-height: 40px;
        font-weight: 500; text-transform:none
    }
.mega-event-date {
    border: 1px solid #FFB800;
    width: 60%;
    margin: 0 auto;
    display: block;
    text-align: center;
    font-size: 36px;
    line-height: 44px;
    font-weight: 800;
    color: #FFB800; padding:10px 20px;
}

.host-box{width:365px;}
.img-girish-box{width:100%; position:relative;}
    .img-girish-box img{width:100%}
.ttl-event-host {
    position: absolute;
    bottom: -10px;
    left: 45px;
    background: #FFB800;
    color: #000;
    font-size: 20px;
    border-radius: 40px;
    width: 270px;
    height: 60px;
    padding: 10px 30px 10px 50px;
    text-align: left;
    font-weight: 600;
}
    .ttl-event-host span{font-size:16px; font-weight:400; display:block; line-height:16px;}
.event-dtl-box h3 {
    font-size: 36px;
    color: #fff;
    font-weight: 600;
    margin: 0 0 20px;
    text-align: left;
    font-family: "Poppins", sans-serif;
}
.event-points{width:100%; max-width:100%; padding:0}
    .event-points li {
        color: #fff;
        font-size: 16px;
        text-align: left;
        margin: 8px 0;
    }
    .event-points li:before {
        width: 16px;
        height: 16px;
        background-size: 100% 100%;
        margin: 1px 10px 8px 0
    }
.btn-box-fixed-btm {
    background: rgba(0,0,0,.95);width:100%; position:fixed; left:0; bottom:0; 
}
.event-btn-box {
    padding: 20px 0 40px;
    width: 100%;
    font-size: 24px;
    color: #fff;
}
.btn-event-in {
    font-size: 30px;
    font-weight: 900;
    text-transform: uppercase;
    padding: 15px 30px;
    border: 0;
    border-radius: 40px;
    box-shadow: 0 0 15px rgba(11,196,200,0.9)
}
.you-tube-box {
    box-shadow: 0 0 10px #0bb2b1;
    border: 5px solid #0bb2b1;
}

.font-theme {
    color: #1CC6C6 !important
}
/* Upgrade Plan start */
#billingHistory_Model .modal-dialog {
    max-width:1280px;
}
#billingHistory_Model .modal-content {
    background: #313131; box-shadow:0 0 10px 10px rgba(0,0,0,.4); border-radius:10px;
}
    #billingHistory_Model .modal-content .modal-title {
        color:#fff;font-size:18px; font-weight:bold;
    }
.table-dark-goc{color:#fff;}
.table-dark-goc thead th {
    border-bottom: 2px solid #000;
    background: #131313;
    color: #fff;
    border-top: 0
}
.table-dark-goc.table-striped tbody tr:nth-of-type(odd) {
    background: #1F1F1F;
}
    .table-dark-goc.table-striped tbody tr:nth-of-type(even) {
        background: #272727;
    }

.table-dark-goc td {
    border-color: #000;
    background-color: transparent;
    color: #fff;

}

    .update-plan-ttl {
        font-size: 36px;
        font-weight: bold;
        text-align: center;
        margin: 20px 0 40px;
        line-height: 39px;
    }
.goc-plan-tab-outer{border-radius:0 0 20px 20px}
.main-tab-plan {
    background: #333333; border-radius:20px 20px 0 0; padding:0; justify-content:center; display:flex
}
    .main-tab-plan .tab-item:first-child {
        border-radius: 20px 0 0 00px;
    }
    .main-tab-plan .tab-item:last-child {
        border-radius: 0px 20px 00px 0px;
    }
.tab-item {
    background: #575757;
    font-size: 22px;
    font-weight: bold;
    padding: 24px 25px;
    color: #fff;
    position: relative;
    cursor: pointer;
    opacity: 0.2; width:50%; text-align:center;
}
.blue-tab {
background: linear-gradient(to right, #644bfa, #037dc9);
}
.gold-tab {
    background: linear-gradient(to right, #CF9500, #986D00);
}
.tab-item.active {
    opacity:1
}
    .tab-item.active:before {
        width: 0px;
        height: 0px;
        border-style: solid;
        border-width: 0 8px 10px 8px;
        border-color: transparent transparent #333333 transparent;
        position: absolute;
        bottom: 0px;
        transform: rotate(0deg);
    }


        .tab-content-box {
            background: #333333;
            border: 1px solid #484848;
            border-radius: 10px;
            padding: 20px 15px;
            box-shadow: 0 0 5px rgba(0,0,0,.5)
        }
.goc-plan-tab-outer .tabs {
    display: flex;
    cursor: pointer;
    padding: 0 0 0 30px;
    margin: 0 0 -1px;
    position: relative;
    /*z-index: 2*/
}

    .goc-plan-tab-outer .tabs div {
        padding: 12px 25px;
        border-bottom: none;
        margin-right: 10px;
        background: #3F3F3F;
        border-radius: 20px 20px 0 0;
        color: #818181;
        font-size: 18px;
        box-shadow: inset 0px -6px 10px 0px rgba(0,0,0,.35);
        border: 1px solid #484848;
        font-weight: bold;
    }

    .goc-plan-tab-outer .tabs .active {
        color: #00E5E4;
        background: #333;
        border: 1px solid #333;
        box-shadow: none;
        box-shadow: -3px -10px 10px rgba(0,0,0,.5);
    }
.plan-offer {
    position: relative;
    display: flex;
    justify-content: left;
    color: #212121;
    font-size: 16px;
    font-weight: bold;
    background: linear-gradient(to bottom, #FFC632, #B2840B);
    border-radius: 10px;
    padding: 10px 20px 15px;
    margin: 20px 0 0;
    text-align: left;
    line-height: 24px;
    align-items: center;
}
.font-24{font-size:24px}
.plan-offer .best-price-value {
    white-space: nowrap;
    padding: 6px 10px;
    color: #fff !important;
}
.plan-offer p{margin-bottom:0}
.img-offer-top {
    margin: -21px 20px 0 0;
}
.z-2 {
    z-index: 2;
}
.z-3 {
    z-index: 3;
    
}
.active .z-3,
.active .z-2 {
    position: relative
}

.goc-plan-tab-outer .tab-content {
    display: none;
    position: relative;
    z-index: 1
}

    .goc-plan-tab-outer .tab-content.active {
        display: flex;
        justify-content: center;
        justify-content: center;
        align-items: center;
    }
.price-special-plan {
    background: linear-gradient(to right, rgba(0, 0, 0, 0.6), rgba(255, 195, 0, 0.25));
    border-color: #FFB800;
    box-shadow: 0 0 10px 10px rgba(0,0,0,.3);
    flex-wrap: wrap;
}
.flex-100{width:100%; display:flex}

.plan-announcement {
    position: relative;
    display: flex;
    justify-content: center;
    color: #212121;
    font-size: 16px;
    font-weight: bold;
    background: linear-gradient(to bottom, #FFC632, #B2840B);
    border-radius: 20px;
    padding: 15px 20px 20px 70px;
    margin: 20px 0 0;
    text-align: center; line-height:24px;
}
    .plan-announcement p{margin:0}
    .plan-announcement b {
        font-size: 22px;
        color: #000
    }
.img-ancment {
    position: absolute;
    left: 10px;
    bottom: -20px;
}


/*  Card Flip CSS start */
.scene {
    display: inline-block;
    width:100%;
}

.card-item {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transform-origin: center right;
    transition: transform 1s; min-height:1100px
}

    .card-item.is-flipped {
        transform: translateX(-100%) rotateY(-180deg);
        min-height: 1500px;
    }

.card__face {
    position: absolute;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
}

.card__face--front {
    
}

.card__face--back {
    
    transform: rotateY(180deg);
}
.btn-plan-upgrade-price,
.de_light .btn-plan-upgrade-price {
    padding: 6px 15px;
    font-size: 14px;
    background: #0eb2b1;
    color: #ffffff;
    border-radius: 8px; font-weight:500;
    margin: 8px 0 -10px; display:inline-block
}
    .btn-plan-upgrade-price:hover,
    .de_light .btn-plan-upgrade-price:hover {
        color: #fff;
        background: #0ac6c4
    }
    .btn-plan-upgrade-price .fa {
        margin-right: 5px;
    }
    .btn-plan-upgrade-price img {
        filter: invert(100%) sepia(0%) saturate(2476%) hue-rotate(86deg) brightness(118%) contrast(119%);
    }
    .plan-notification {
        /*border: 1px solid #FFB800;*/
        padding: 5px 10px;
        color: #ffb800;
        margin: 10px 0 -10px;
        border-radius: 10px;
        background: #1b1300;
    }
.disable-cursor{cursor:not-allowed; opacity:0.4}
.price-year-plan-box{flex-wrap:wrap}

/* Notification GOC Meter Start*/

.ntfctn-goc-meter {
    max-width: 700px;
    width: 100%;
    border: 1px solid #FFB800;
    border-radius: 15px;
    margin: 10px auto;
    padding: 20px;
    box-shadow: 0 0 10px #ccc;
    color: #D69A00;
    font-weight: bold;
    font-size: 16px;
    text-align: left;
}
.icn-text-oops {
    color: #D69A00;
    font-size: 24px;
    display: block;
    margin: 0 0 15px;
}
    .icn-text-oops img{float:left; margin:0 15px 0 0;}
.btn-blue {
    background: linear-gradient(to right, #057995, #0AAEAF);
    border-radius: 30px;
    color: #fff !important;
    font-weight: bold; padding:6px 15px;
}
.fill-survey {
    color: #57DEFF
}

.dark-theme .ntfctn-goc-meter {
    border: 1px solid #FFB800;
    box-shadow: 0 0 15px #6C5600;
    color: #ffb800;
}

.dark-theme .icn-text-oops {
    color: #FFB800;
}

.old-price-inline-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
    border-radius: 20px;
    margin-bottom: 1rem;
    border: 2px solid #ffb800;
    background: linear-gradient(to right, rgba(0, 0, 0, 0.6), rgba(255, 195, 0, 0.25));
}
    .old-price-inline-flex p {
        margin-bottom: 0;
        font-size: 17px;
        flex: 1;
        color: #ffffff;
        font-weight: 600;
        line-height: 26px;
    }

/*GOC Survey increase limit*/
.goc-survey-outer .field-set {
    border: 1px solid #F1F1F1; padding:10px 15px; border-radius:10px; box-shadow:0 0 10px rgba(221,221,221,0.4); margin:10px 0;
}
.goc-survey-outer .custom-label {font-weight:bold; font-size:18px; color:#000; line-height: 26px;
}
.goc-survey-outer .radio-group {  margin:0 40px 0 0; font-weight:500; 
}
.checkbox-row{display:flex; margin:0; padding:0px;}
    .checkbox-row li{list-style:none; margin:0 40px 0 0; line-height: 24px;}
        .checkbox-row li label input[type='checkbox'] { margin:0 5px 0 0;
        }
.brdr-top-sep{border-top:1px solid #eee; padding-top:10px;}
.brdr-left-sep {
    border-left: 1px solid #eee;
}
/*Plan Expire popup Start */
.goc-launched-modal .center-goc-body p.plan-text-expire {
    font-size: 24px;
    color: #FFB800; font-weight:bold;
}
.plan-text-renewal {
    font-weight: bold;
    font-size: 16px;
    line-height:24px;
    padding: 20px 0;
    border-bottom: 1px solid #3F3F3F
}
.text-yellow {
    color: #FFB800;
}
.expire-plan-box {
    width: 100%;
    justify-content: space-between;
    flex-wrap: nowrap;
    align-items: center;
    padding: 15px 1rem 20px
}
    .expire-plan-box p {
        font-size: 16px;
        color: #fff;
        line-height: 24px;
        text-align: left;
        margin-bottom: 0;
        padding: 3px 20px 3px 0;
        font-weight: bold;
    }
    .expire-plan-box p span {
        color: #0BB2B1; font-size:24px; }
    .plan-text-list {
        font-size: 18px;
        font-weight: bold;
        margin: 20px 0;
    }
.modal-confirm .btn-plan-proceed {
    background: linear-gradient(90deg, #0bb2b1 0%, #25b2b5 54%, #159394 76%, #037170 100%) 0% 0% no-repeat;
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    padding: 8px 25px;
    border-radius: 30px;
    min-width: 120px;
    text-align: center;
}
.box-recommended { position:relative;
    background: transparent linear-gradient(90deg, #000000 0%, #032928 100%) 0% 0% no-repeat padding-box;
    box-shadow: 0px 0px 10px #0bb2b1;
    border: 2px solid #0bb2b1;
}
    .box-recommended:before {
        content: "Recommended";
        background: #0BB2B1;
        padding: 1px 15px 2px;
        font-size: 14px;
        color: #000;
        position: absolute;
        top: 0;
        font-weight: bold;
        border-radius: 0 0 10px 10px;
        line-height: 16px;
    }



.tab_outer .btn_tab svg{width:26px}
.tab_outer .btn_tab svg {
    margin: 0 0px 0 -5px;
}


/* Beast Mode CSS for framing */
.beastmode-section {
     
    margin: 0 15px;
    margin-bottom: 1rem;
}
.beast-left-top,
.beast-right-top,
.beast-left-btm,
.beast-right-btm {
    width: 50%;
    height: 50%;
    position: absolute;
     background-size:cover;
      background-repeat:no-repeat; 
}
.beast-ttl {
    text-transform: uppercase; 
    font-weight:600; 
    text-align: center;
    color: #fff;
    font-size: 24px;
    line-height: 28px;
    font-family: var(--font-Poppins);
    margin-bottom: 10px;
    position: absolute;
    left: 0;
      top: 36px;
    right: 0;
    margin: 0 auto;
}

.beast-left-top {
    left: 0;
    top: 0;
    background-position: top left;
}
.beast-right-top {
    right: 0;
    top: 0;
    background-position: top right;
}

.beast-left-btm {
    left:0; bottom:0;
    background-position: bottom left;
}

.beast-right-btm {
    right:0; bottom:0;
    background-position: bottom right;
}


.beastmode-grey,
.beastmode-green, .beastmode-red {
    position: relative;
    height: 100%;
    width: 100%;
    padding: 50px 30px
}

    .beastmode-grey .beast-left-top {
        background-image: url(../images/beast-gray-left-top.jpg);
        background-size: cover;

    }
    .beastmode-grey .beast-right-top {
        background-image: url(../images/beast-gray-right-top.jpg);
        background-size: cover;
    }
    .beastmode-grey .beast-left-btm {
        background-image: url(../images/beast-gray-left-btm.jpg);
        background-size: cover;
    }
    .beastmode-grey .beast-right-btm {
        background-image: url(../images/beast-gray-right-btm.jpg);
        background-size: cover;
    }
    
    .beastmode-green .beast-left-top {
        background-image: url(../images/beast-green-left-top.jpg)
    }

    .beastmode-green .beast-right-top {
        background-image: url(../images/beast-green-right-top.jpg)
    }

    .beastmode-green .beast-left-btm {
        background-image: url(../images/beast-green-left-btm.jpg)
    }

    .beastmode-green .beast-right-btm {
        background-image: url(../images/beast-green-right-btm.jpg)
    }
    .beastmode-green .beast-ttl {
        color: #69E64C;
    }



    .beastmode-red .beast-left-top {
        background-image: url(../images/beast-red-left-top.jpg)
    }

    .beastmode-red .beast-right-top {
        background-image: url(../images/beast-red-right-top.jpg)
    }

    .beastmode-red .beast-left-btm {
        background-image: url(../images/beast-red-left-btm.jpg)
    }

    .beastmode-red .beast-right-btm {
        background-image: url(../images/beast-red-right-btm.jpg)
    }
    .beastmode-red .beast-ttl {
        color: #FF2927;
    }

/*#lauch_beastmode{display:block; z-index:99999 !important; background:#000; opacity:1}*/

    #lauch_beastmode .modal-dialog {
       margin: 0 auto; height:100%; transform:none
    }
    #lauch_beastmode .modal-content{height:100%}

    .beast-text-popup {
        display: flex;
        position: absolute;
        justify-content: center;
        align-items: center;
        height: 100vh;
        width: 100%;
        left: 0;
        top: 0;
        background: rgba(0,0,0,0.8);
        font-size: 34px;
        color: #6BED4B;
    }
#lauch_beastmode .modal-body video{height:100%; width:100%;}
.bull-mode {
    color: #6BED4B;
}
    .bull-mode .bull-mode-img,
    .bear-mode .bear-mode-img,
    .normal-mode .genie-mode-img,
    .normal-mode .normal-mode-img {
        display: block;
        margin: 0 auto 20px
    }

    .bull-mode .bear-mode-img,
    .bull-mode .normal-mode-img,
    .bear-mode .bull-mode-img,
    .bear-mode .normal-mode-img,
    .normal-mode .bear-mode-img,
    .normal-mode .bull-mode-img {
        display: none;
    }

.bear-mode {
    color: #FF0200;
}

.normal-mode {
    color: #fff;
}


/* Light Effect */

.beastmode-grey .light-container,
.beastmode-grey .light-container-right,
.beastmode-grey .light-container-btm,
.beastmode-grey .light-container-right-btm { display:none
}

.light-container,
.light-container-right {
    position: absolute;
    left: 100px;
    top: 25px;
    display: flex;
    gap: 20px;
}

.light-container-right {
    left:auto;
    right: 100px;
    flex-direction:row-reverse;
}

.light-container-btm,
.light-container-right-btm {
    position: absolute;
    left: 100px;
    bottom: 14px;
    display: flex;
    gap: 20px;
}
.light-container-right-btm {
    right: 100px;
    left: auto;
    flex-direction: row-reverse;
}
.blink-light {
    width: 24px;
    height: 26px;
    transform: skew(-43deg);
    background: #64F341;
    
}
.light-container-right-btm .blink-light,
.light-container-btm .blink-light {
    width: 24px;
    height: 16px;
    transform: skew(-43deg);
     
}
.light-container-right-btm .blink-light,
.light-container-right .blink-light {
    transform: skew(43deg);
}

.mob-r-b, .mob-r-b1 { display:none;}



.beastmode-green .blink-light {
    background: #70EA53;
    animation: blink-green 3s infinite;
}

.beastmode-red .blink-light {
    background: #F26362;
    animation: blink-red 3s infinite;
}


.blink-light-long {
    width: 95px !important
}
    .blink-light:nth-child(1) {
        animation-delay: 0s;
    }
    .blink-light:nth-child(2) {
        animation-delay: 0.2s;
    }
    .blink-light:nth-child(3) {
        animation-delay: 0.4s;
    }
    .blink-light:nth-child(4) {
        animation-delay: 0.6s;
    }

@keyframes blink-green {
    0%,25%,45%,55%, 75%, 100% {
        background-color: #20A400;
        box-shadow: 0px 0px 0px #39FF14, 0px 0px 0px #39FF14, 0px 0px 0px #39FF14;
    }

    50% {
        background: #8bff6f;
        box-shadow: 0px 0px 10px #39FF14, 0px 0px 10px #39FF14, 0px 0px 10px #39FF14;
    }
    
}

@keyframes blink-red {
    0%,25%,45%,55%, 75%, 100% {
        background-color: #FF0200;
        box-shadow: 0px 0px 0px #ff6767, 0px 0px 0px #ff6767, 0px 0px 0px #ff6767;
    }

    50% {
        background: #fa9f9e;
        box-shadow: 0px 0px 10px #ff6767, 0px 0px 10px #ff6767, 0px 0px 10px #ff6767;
    }
    }



/*Side Border Animation */
.holder {
    /*approx center*/
    position: absolute;
    top: 0%;
    left: 0%;
    width:100%; height:100%; 
}

.beastmode-green .bar {
    background: #d0f0dd;
    box-shadow: 0px 0px 0 #40ff22, 0px 0px 4px #30ff1f, 0px 0px 8px #20ff1b, 0px 0px 16px #10ff18;
    border-radius: 4px;
    position: absolute;
}
.beastmode-red .bar {
    background: #ffb6b6;
    box-shadow: 0px 0px 0 #ff2222, 0px 0px 4px #ff1f1f, 0px 0px 8px #ff1b1b, 0px 0px 16px #ff1010;
    border-radius: 4px;
    position: absolute;
}


.holder .left {
    width: 4px;
    -webkit-animation: left 8s linear infinite;
}

@-webkit-keyframes left {
    0% {
        height: 0;
        top: 100%;
        left: 0;
    }

    20% {
        height: 100%;
        top: 0;
        left: 0;
    }

    40% {
        height: 0;
        top: 0;
        left: 0;
    }
}

.holder .top {
    height: 4px;
    -webkit-animation: top 8s linear infinite;
}

@-webkit-keyframes top {
    0% {
        width: 0;
        top: 0;
        left: 0;
    }

    20% {
        width: 0;
        top: 0;
        left: 0;
    }

    40% {
        width: 100%;
        top: 0;
        left: 0;
    }

    60% {
        width: 0;
        top: 0;
        left: 100%;
    }
}

.holder .right {
    width: 4px;
    -webkit-animation: right 8s linear infinite;
}

@-webkit-keyframes right {
    0% {
        height: 0;
        top: 0;
        left: 100%;
    }

    40% {
        height: 0;
        top: 0;
        left: 100%;
    }

    60% {
        height: 100%;
        top: 0;
        left: 100%;
    }

    80% {
        height: 0;
        top: 100%;
        left: 100%;
    }
}

.holder .bottom {
    height: 4px;
    -webkit-animation: bottom 8s linear infinite;
}

@-webkit-keyframes bottom {
    0% {
        width: 0;
        top: 100%;
        left: 96%;
    }

    60% {
        width: 0;
        top: 100%;
        left: 100%;
    }

    80% {
        width: 100%;
        top: 100%;
        left: 0px;
    }

    100% {
        width: 0px;
        top: 100%;
        left: 0px;
    }
}

.chart-data-gpt-wrapper,
.widget-title-bar, .live-beast-widget {
    position: relative;
    z-index: 5
}


.beast-live-widget-height {
    position: relative; height:100%; width:100%; 
}
.patter-border-wrapper{position:relative; z-index:5}

.live-beast-widget-shadow {
    position: relative;
    display: grid;
    margin: 0 0 10px; 
}
.beastmode-green .live-beast-widget-shadow::before,
.beastmode-green .live-beast-widget-shadow::after {
    border-radius: 3px;
    content: '';
    position: absolute;
    top: -3px;
    left: -3px;
    background: linear-gradient(45deg,#20A400,#64F341,#2F6A20,#B0FF9D,#2F6A20,#074509,#B0FF9D);
    background-size: 200%;
    width: calc(100% + 6px);
    height: calc(100% + 6px);
    z-index: 0;
    animation: animate 15s linear infinite;
}
.beastmode-red .live-beast-widget-shadow::before,
.beastmode-red .live-beast-widget-shadow::after {
    border-radius: 3px;
    content: '';
    position: absolute;
    top: -3px;
    left: -3px;
    background: linear-gradient(45deg,#be9292,#e23333,#f1c2c2,#ffcaca,#e23333,#f1c2c2,#d51716);
    background-size: 200%;
    width: calc(100% + 6px);
    height: calc(100% + 6px);
    z-index: 0;
    animation: animate 15s linear infinite;
}
    
.beastmode-green .live-beast-widget-shadow::after,
.beastmode-red .live-beast-widget-shadow::after {
        filter: blur(5px);
    }

@keyframes animate {
    0% {
        background-position: 0 0;
    }

    50% {
        background-position: 200% 0;
    }

    100% {
        background-position: 0 0;
    }
}

.live-beast-widget:last-child {
    margin-top: 0px;
}
.mtop-10 {
    margin-top: 12px;
}
/*Plan Upgrade*/
.desktop-buynow{display:flex; justify-content:center; width:100%; margin-top:10px;  }
.btn-buynow {
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    padding: 5px 20px;
    background: linear-gradient(to right, #057995, #0AAEAF );
    color: #fff !important;
    border-radius: 8px;
}
    .btn-buynow:hover {
        background: linear-gradient(to left, #057995, #0AAEAF );
    }
    .img-genie-popup{display:block; text-align:center;}
.ttl-cause {
    color: #FFB800;
    font-size: 32px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    margin: 30px 0
}

    .ttl-cause img{margin:10px 0; max-width:132px; }
#isGivenDemoModel .modal-content {
    background:#000
}
#isGivenDemoModel .modal-footer {
    border: none;
    justify-content:center; padding-bottom:20px;
}
#isGivenDemoModel .modal-dialog {
    max-width: 1000px;
}
.beast-mode-video-modal .modal-body p.popup-text {
    font-size: 22px;
    color: #fff; max-width:700px; margin:0 auto;
}
    .popup-text span {
        color: #1CC6C6
    }
.step-green-stripe {
    background: #000;
    border:0;
    border-bottom: 2px solid #004949;
    border-radius: 0;
}
.yellow-gradient-btn,
.payment_box .btn.btn-custom.color-2,
.exp-box-cont .radius-btn, .buynow-zoom {
    animation: zoom-in-zoom-out 1s ease infinite;
}

@keyframes zoom-in-zoom-out {
    0% {
        scale: 100%;
    }

    50% {
        scale: 110%;
    }

    100% {
        scale: 100%;
    }
}
.experiance-box {
    background: linear-gradient(-45deg, #0A1B35,#2C63B7,#0A1B35);
    background-size: 300% 300%;
    animation: gradiant-flow 10s ease infinite;
    border-radius: 15px;
    padding: 10px;
    width: 100%;
    height: 120px;
    display: flex;
}
@keyframes gradiant-flow {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
    }
.exp-box-cont {
    display: flex;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
    width: 100%
}
.center-content-exp{width:calc(100% - 400px)}
.img-genie-exp img {
    max-width: 55px;
}
.exp-box-cont h2{font-size:24px; color:#fff; margin:10px 0 0; font-weight:bold;  }
    .exp-box-cont h2 span {
        font-size: 28px;
        color: #09ACAE
    }
.exp-box-cont p {
    font-size: 16px;
    color: #FFFFFF;
}
.radius-btn{font-weight:bold;}
/* --------------------Desktop End------------------*/
@media (min-width: 768px) {
    .desktop-icon .menu-icon-bar-web img {
            width: 26px;
            margin: -2px 0 0;
        }

            .desktop-icon .menu-icon-bar-web img.home-icon {
                width: 18px;
            }
    }


    @media only screen and (max-width: 1280px) {

        .content-section-landing .container {
            max-width: inherit
        }

        .banner-center-text h1 {
            font-size: 44px;
            line-height: 50px
        }

            .banner-center-text h1 span {
                margin: 20px 0;
                font-size: 70px;
            }

        .banner-center-text h4 {
            font-size: 20px;
            line-height: 30px;
        }

        .video-outer {
            margin: -60px auto 0;
            width: 90%;
        }

        .btn-blue-landing-book {
            font-size: 22px;
            padding: 10px 55px;
        }

        .text-section-landing h2 {
            font-size: 40px;
            line-height: 46px;
        }

        .para-text {
            font-size: 18px;
            line-height: 28px;
        }

        .feature-list-landing li {
            font-size: 18px;
            margin: 6px 0;
        }

        .text-section-landing {
            width: 95%
        }

        .icn-section {
            width: 100px
        }

        .icn-section-4 {
            width: 70px
        }

        .icn-section-5 {
            width: 150px
        }

        .icn-section-1 {
            bottom: 50px;
        }

        .icn-section-2 {
            top: 50px;
        }

        .icn-section-3 {
            top: -70px;
            right: 100px;
        }


        .icn-section-5 {
            bottom: -20px;
            left: 100px;
        }

        .animated.icn-section-1 {
            bottom: -30px;
            right: 50px;
        }

        .animated.icn-section-2 {
            top: -40px;
            right: 20px;
        }

        .animated.icn-section-3 {
            top: -70px;
            right: 10px;
        }

        .animated.icn-section-4 {
        }

        .animated.icn-section-5 {
            bottom: -20px;
            left: -40px;
        }

            .animated.icn-section-1 img, .animated.icn-section-2 img, .animated.icn-section-3 img, .animated.icn-section-4 img, .animated.icn-section-5 img {
                width: 100%
            }

        .plan-offer {
            flex-direction: column;
            padding: 10px 15px 15px;
            text-align: center;
        }

        .img-offer-top {
            margin: -11px 0px 20px 0
        }

        .goc-plan-tab-outer .tabs .active {
            box-shadow: -3px -5px 8px rgba(0,0,0,.5)
        }

        .chartbox-trend .widget-tab_outer .btn_tab {
            padding: 3px 10px 3px 8px;
            font-size: 13px;
        }
        .card-item.is-flipped {
            min-height: 2500px;
        }
    }


    @media only screen and (max-width: 992px) {


        .popup-genie-popup h1 {
            font-size: 22px;
            line-height: 28px;
        }


            .popup-genie-popup h1 .font-40 {
                font-size: 26px;
            }

        .popup-genie-popup h3 {
            font-size: 18px;
            line-height: 24px;
        }

        .banner-left, .banner-right {
            display: none
        }

        .banner-center-text {
            width: 100%;
            padding: 0 25px
        }

            .banner-center-text h1 span {
                font-size: 48px
            }


        .youtube-video-landing {
            padding: 0px 0 40px
        }

        .content-section-landing {
            padding: 60px 0
        }

        .img-box-landing {
            width: 100%;
            padding: 10px 30px
        }

        .icn-section {
            display: none
        }


        .rev-tablet {
            flex-direction: column-reverse
        }

        .img-box-landing {
            margin: 40px 0
        }

        .testimonial-box-landing {
            margin: 0
        }

        .feature-list-landing.fl-left li {
            width: calc(50% - 20px);
            margin: 0px 15px 10px 0
        }

        .text-section-landing h2 {
            font-size: 36px;
        }


        .popup-genie-popup {
            z-index: 9994;
        }


        .popup-info h4 {
            font-size: 16px;
        }

        .popup-info ul {
            margin: 0 0 10px
        }

        .banner-center-text h4 br,
        .banner-center-text h1 br {
            display: none;
        }

        .testimonial-box-landing,
        .img-box-landing,
        .video-outer {
            box-shadow: 10px 10px 20px rgba(69,69,69,0.5)
        }

        .popup-info {
            width: 100%
        }


        .mobile-spacer {
            width: 100%;
            height: 70px;
            clear: both
        }


        .font-22-demo {
            line-height: 22px
        }

        .plan-upgrade-ttl {
            font-size: 32px;
            line-height: 40px;
            margin: 20px 20px 40px;
            text-align: center;
        }

        .live-session-box-outer {
            flex-wrap: wrap;
            height: 120px;
            justify-content: space-around;
        }

            .live-session-box-outer .timer-cnt {
                margin: 5px 10px 0
            }

            .live-session-box-outer .timer-box {
                margin: 0 5px 0 0
            }

            .live-session-box-outer .time-couter span {
                width: 100%;
            }

            .live-session-box-outer .time-couter {
                width: 45;
                margin: 0 3px;
                font-size: 9px;
            }

            .live-session-box-outer .btn-box-rigth {
                width: auto;
            }

            .live-session-box-outer .gradient-btn {
                padding: 5px 8px;
                margin: 0
            }

        .d-desktop,
        .icn-timer {
            display: none;
        }

        .d-mobile {
            display: block
        }

        .gradient-btn {
            font-size: 11px;
            font-weight: 500;
            text-align: center;
            padding: 0px 15px;
            border: 1px solid #fff;
        }



        /* Mega Event */

        .goc-genie-event-box {
            float: none;
            margin: 150px auto 50px
        }

        .host-box {
            margin: 0 auto 40px;
        }

        .you-tube-box {
            margin: 40px 0 0;
        }

        .btn-event-in {
            font-size: 30px;
            font-weight: 900;
            text-transform: uppercase;
            padding: 15px 30px;
            border: 0;
            border-radius: 40px;
        }

        .event-btn-box {
            padding: 20px 0 90px
        }

   

        .center-content-exp {
            width: calc(100% - 250px);
        }
        .exp-box-cont h2{font-size:20px;}
            .exp-box-cont p{line-height:20px; margin-top:5px;}
            .img-genie-exp {
                display: none
            }
    }
.price-select-inline {
    display: flex;
    align-items: center;
}
.price-select-border {
    padding: 10px;
    border-radius: 20px;
    margin-bottom: 1rem;
    border: 2px solid #404040;
}
    .price-select-border span {
        color: #ffffff;
        display: inline-block;
        width: 100%;
        text-align: center;
        color: #a5a5a5 !important;
    }
    .price-select-border small {
        line-height: 15px;
        color: #a5a5a5 !important;
    }
.price-select-inline.price-year-box-active {
    border: 2px solid #0bb2b1;
}
    .price-select-inline .icon {
        display: flex;
        gap: 15px;
        flex: 1;
        align-items: center;
      
    }
    .price-select-inline .price-plan span {
        font-size: 13px;
        color: #ffffff;
        font-weight: 600;
    }
    .price-select-inline .price-plan p {
        margin: 0;
        font-weight: 600;
        line-height: 22px;
    }
    .price-select-inline .icon i {
        font-size: 24px;
    }
    .price-select-inline .final-price {
        font-size: 28px;
        color: #ffffff;
        font-weight: 800;
    }
    .price-select-inline.price-year-box-active .icon i {
        font-size: 24px;
        color: #aaaaaa;
    }
.combo-with-bundle {
    gap: 5rem;
    align-items: center;
}
    .combo-with-bundle .plan-service-list {
        margin-right: 0;
    }
.price-select-inline-combo {
    gap: 15px;
}
    .price-select-inline-combo .icon {
        flex: inherit;
    }
    .price-select-inline-combo .final-price-combo p {
        color: #22B1AF;
        font-size: 20px;
        font-weight: 600;
        margin: 0;
    }
    .price-select-inline-combo .final-price-combo h4 {
        font-size: 30px;
        color: #ffffff;
        font-weight: 800;
        margin: 0;
        line-height: normal;
    }
    .price-select-inline-combo .final-price-combo small {
        color: #C5C5C5;
    }
    .price-select-inline-combo .final-price-combo small span {
        color: #ffffff;
    }
.price-select-inline-combo {
    align-items: flex-start;
    padding: 10px;
    border-radius: 20px;
    margin-bottom: 1rem;
    border: 2px solid #404040;
}
    .price-select-inline-combo.price-year-box-active .icon i {
        color: #ffffff;
    }
.price-select-border.price-year-box-active {
    border: 2px solid #0bb2b1;
}
    .price-select-border.price-year-box-active .icon i {
        color: #ffffff;
    }
    /* --------------------Mobile------------------*/

@media (max-width: 1199px) {
    .price-select-inline {
        align-items: center;
        flex-direction: column;
        gap: 10px;
    }

        .price-select-inline .final-price {
            font-size: 24px;
        }

        .price-select-inline .price-plan p {
            font-size: 16px;
        }
    .price-select-inline-combo {
        flex-direction: row;
    }
}
    @media (max-width: 991px) {
        .price-select-inline-combo .final-price-combo h4 {
            font-size: 24px;
        }
        .price-select-inline-combo .final-price-combo p {
            font-size: 16px;
        }
        .combo-with-bundle {
            gap: 2rem;
            align-items: center;
            flex-direction: column;
            display:flex !important;
        }
    }
    @media (max-width: 767px) {

            .clock-box .fa {
                margin: 2px 2px 0 3px
            }

        .popup-genie-popup .modal-content {
            background: url(../images/bg-popup-demo-mob.jpg) no-repeat;
        }

        .img-box-popup img {
            max-width: 70px;
            margin: 0 0 15px 0;
        }

        .popup-info h4 {
            font-size: 16px;
        }

        .popup-info ul {
            margin: 0 0 10px
        }

        .banner-center-text h4 br,
        .banner-center-text h1 br {
            display: none;
        }

        .testimonial-box-landing,
        .img-box-landing,
        .video-outer {
            box-shadow: 10px 10px 20px rgba(69,69,69,0.5)
        }
        /*--------------Timer countdown--------*/
        .timer-count-outer {
            max-height: 120px;
            display: block;
            background: url(../images/bg-goc-ad-banner-timer-mobile.png) no-repeat;
            float: left;
        }

        .logo-goc-timer {
            width: 82px;
            padding: 10px 5px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .timer-box-outer {
            display: block;
            float: left;
            width: calc(100% - 82px);
            padding: 0 20px;
            background: transparent;
        }

        .btn-box-rigth {
            padding: 0 0 5px 0px;
            width: calc(100% - 82px);
        }

        .logo-goc-timer img {
            max-width: 48px;
        }

        .new-price-timer {
            width: 100%;
        }

        .timer-text-red {
            font-size: 12px;
            font-weight: 500;
            line-height: 14px;
            padding: 2px 10px
        }

        .time-couter span {
            font-size: 12px;
            font-weight: 700;
            width: 40px;
            height: 18px;
            line-height: 18px;
            margin: 0 auto 2px
        }

        .new-price-timer {
            margin-top: 0
        }

        .time-couter {
            font-size: 10px;
            font-weight: 400;
            width: 40px;
        }

        .timer-cnt {
            margin: 0px 0 0
        }

        .icn-timer {
            display: none
        }

        .timer-box {
            padding: 5px 0
        }

        .gradient-btn {
            font-size: 11px;
            font-weight: 500;
            text-align: center;
            padding: 0px 15px;
            border: 1px solid #fff;
        }



        .tutorial-box {
            background: #4D4D4D;
            padding: 10px;
            box-shadow: 0 0 15px #494949;
            width: 100%;
            border-radius: 15px;
            margin: 0 0% 20px;
            text-align: center;
        }

        .lbl-plan {
            margin: -3px 0 20px 0
        }

        .help-text-plan {
            margin: 0px 0 0
        }

        .validity-price-box .price-plan,
        .validity-price-box .price-plan .renew-planFeature {
            width: calc(100% - 30px);
            float: left;
            max-width: inherit;
            margin-bottom: 5px;
        }

            .validity-price-box .price-plan .renew-planFeature {
                width: 100%
            }


        .validity-price-box .offer-box-plan {
            margin: 0
        }

        .validity-price-box .price-year-plan-box .icon,
        .price-special-plan .icon {
            width: 30px;
            float: left;
            margin: 0 0 10px;
            font-size: 26px;
        }

        .validity-price-box .price-year-plan-box {
            width: 100%;
            float: left;
            display: block;
            margin: 10px 0;
            padding: 15px 1rem 30px;
        }

            .validity-price-box .price-year-plan-box .final-price,
            .price-special-plan .final-price {
                width: 100%;
                margin: 10px 0 10px;
                display: flex;
                justify-content: space-between;
                text-align: revert;
                flex-direction: inherit;
                flex-flow: row wrap;
                float: left;
            }

        .price-special-plan .final-price {
            margin-top: 0
        }

        .price-special-plan .price-offer {
            line-height: 31px;
        }

        .final-price span:first-child {
            padding: 10px 0 5px
        }

        .plan-notification {
            margin: 10px 0 10px
        }

        .desktop-buynow {
            margin: 10px 0 0;
        }

        .btn-buynow {
            width: 100%;
            font-size: 16px;
        }

        .btn-plan-upgrade-price, .de_light .btn-plan-upgrade-price {
            margin: 10px 0 0px;
            height: 38px;
        }
        /* .validity-price-box .price-year-plan-box .final-price *{
            flex-shrink: 0;
        }*/
        .new-price-lbl {
            order: 2;
            margin: 5px 0
        }

        .btn-plan-upgrade-price {
            order: 1
        }

        .validity-price-box .offer-box-plan {
            display: flex;
            width: 100%;
            padding-left: 30px;
            float: none;
        }


        .validity-price-box .price-year-plan-box .price-plan p,
        .price-year-plan-box .price-plan p {
            font-size: 16px;
        }

        .validity-price-box .renew-plan-col-wrapper .price-year-plan-box .price-offer {
            top: 0;
            left: 0;
            margin: 0px 0 0;
            display: flex;
            width: auto;
            padding: 5px 10px;
            float: left;
        }

        .live-session-box-outer {
            flex-wrap: wrap;
            height: 120px
        }

            .live-session-box-outer .timer-box {
                margin: 0 5px 0 0
            }

            .live-session-box-outer .time-couter span {
                width: 100%;
            }

            .live-session-box-outer .time-couter {
                width: 35px;
                margin: 0 3px;
                font-size: 9px;
            }

            .live-session-box-outer .btn-box-rigth {
                width: auto;
            }

            .live-session-box-outer .gradient-btn {
                padding: 5px 8px;
                margin: 0
            }
        /*  Mega Event */
        .bg-mega-event h1 {
            font-size: 32px;
            line-height: 40px;
        }

        .bg-mega-event {
            padding: 10px 0 110px;
        }

        .img-genie-event img {
            width: 110px;
        }

        .img-genie-event {
            top: -47%;
            transform: translate(110%, 50%);
        }

        .event-ttl-genie {
            font-size: 52px;
            line-height: 54px;
        }

        .goc-genie-event-box {
            width: 400px;
            height: 400px;
            margin: 120px auto 20px;
        }

        .event-ttl-genie span {
            font-size: 30px;
        }

        .mega-event-date {
            font-size: 28px;
            line-height: 34px;
        }

        .host-box {
            width: 220px;
        }

        .ttl-event-host {
            width: 180px;
            height: 40px;
            font-size: 16px;
            line-height: 18px;
            padding: 4px 20px 0 20px;
            left: 20px;
        }

            .ttl-event-host span {
                font-size: 14px;
                line-height: 16px;
            }

        .event-dtl-box h3 {
            font-size: 24px;
        }

        .btn-event-in {
            font-size: 30px;
            font-weight: 900;
            text-transform: uppercase;
            padding: 15px 30px;
            border: 0;
            border-radius: 40px;
        }

        .event-btn-box {
            padding: 20px 0 90px
        }

        .validity-price-box {
            padding: 10px 0;
        }

            .validity-price-box h3 {
                font-size: 20px;
                padding: 0 15px;
            }

        .goc-plan-tab-outer .tabs {
            padding: 0 0 0 20px
        }

            .goc-plan-tab-outer .tabs div {
                padding: 12px 15px;
                font-size: 16px;
                line-height: 16px;
                border-radius: 10px 10px 0 0
            }

        .tab-item {
            padding: 12px 15px;
            font-size: 18px;
            line-height: 24px;
            text-align: center;
        }

        .flex-100 {
            display: block;
        }

        .offer-box-plan {
            width: 100%;
            float: left;
        }


        .price-special-plan .offer-box-plan {
            display: flex;
            justify-content: space-between;
            margin: 10px 0;
        }

        .best-price-value {
            float: right;
            padding: 5px 15px;
            margin: 0 0 0 auto;
            display: block;
        }

        .plan-announcement {
            float: left;
            padding: 25px 20px 20px 20px;
            margin: 50px 0 0;
            
        }

        .img-ancment {
            bottom: auto;
            top: -50px;
            left: -10px;
        }

        .card-item {
            min-height: 2050px;
        }

        .checkbox-row,
        .goc-survey-outer .d-flex {
            flex-wrap: wrap;
        }

        .center-box.center-box-profile {
            width: 90% !important
        }

        .ntfctn-goc-meter {
            margin: 10px 15px;
            width: calc(100% - 30px);
        }

        .modal {
            z-index: 9999 !important;
        }

        /*Beast Mode CSS */

        .beastmode-section {
            margin: 0 15px;
            margin-bottom: 0px;
            margin-bottom: 1rem;
        }

        .beast-right-top,
        .beast-right-btm {
            display: none
        }


        .beast-left-top,
        .beast-left-btm {
            width: 100%;
            height: 50%;
            position: absolute;
            background-size: 100% 100%;
            background-repeat: no-repeat;
        }

        .beast-ttl {
            top: 5px;
            font-size: 20px;
            text-align: center;
        }

        .beast-left-top {
            left: 0;
            top: 0;
            background-position: top left;
        }

        .beast-left-btm {
            left: 0;
            bottom: 0;
            background-position: bottom left;
        }



        .beastmode-grey,
        .beastmode-green, .beastmode-red {
            position: relative;
            height: 100%;
            width: 100%;
            padding: 50px 10px 15px;
        }

        .beastmode-grey .beast-left-top {
            background-image: url(../images/beast-gray-top-mobile.jpg)
        }

        .beastmode-grey .beast-left-btm {
            background-image: url(../images/beast-gray-btm-mobile.jpg)
        }


        .beastmode-green .beast-left-top {
            background-image: url(../images/beast-green-top-mobile.jpg)
        }


        .beastmode-green .beast-left-btm {
            background-image: url(../images/beast-green-btm-mobile.jpg)
        }





        .beastmode-red .beast-left-top {
            background-image: url(../images/beast-red-top-mobile.jpg)
        }


        .beastmode-red .beast-left-btm {
            background-image: url(../images/beast-red-btm-mobile.jpg)
        }


        .beast-text-popup {
            font-size: 22px;
        }

        #lauch_beastmode .modal-body video {
            height: 100%;
            width: auto
        }

        .live-beast-widget .widget-title-bar h4 {
            margin-bottom: 5px;
        }


        /*Light Effect */
        .light-container,
        .light-container-btm {
            gap: 6px;
            left: 15%;
            top: 20px;
            width: 70%;
        }

        .light-container-btm {
            bottom: 19px;
            top: auto;
        }

            .light-container-btm .blink-light-long {
                display: none
            }

            .light-container-right-btm .blink-light, .light-container-btm .blink-light,
            .blink-light {
                width: 10px;
                height: 10px;
            }

        .mob-r {
            position: absolute;
            right: 0;
            transform: skew(43deg);
        }

        .mob-r1 {
            position: absolute;
            right: 16px;
            transform: skew(43deg);
        }

        .mob-r-b, .mob-r-b1 {
            display: block;
        }

        .light-container-btm .mob-l-b {
            position: absolute;
            left: 50px;
        }

        .light-container-btm .mob-r-b1 {
            position: absolute;
            left: 30px;
        }

        .light-container-btm .mob-l-b1 {
            position: absolute;
            right: 40px;
            transform: skew(43deg);
        }

        .light-container-btm .mob-r-b {
            position: absolute;
            right: 60px;
            transform: skew(43deg);
        }

        .holder .left,
        .holder .right {
            width: 2px;
        }

        .holder .top,
        .holder .bottom {
            height: 2px;
        }


        .experiance-box {
            padding: 0 10px;
        }

        .center-content-exp {
            width: 100%;
            text-align: center;
        }

        .exp-box-cont {
            flex-direction: column;
            text-align: center
        }

            .exp-box-cont h2 {
                font-size: 16px;
                margin: 5px 0 0
            }

                .exp-box-cont h2 span {
                    font-size: 18px;
                }

            .exp-box-cont p {
                font-size: 14px;
                margin: 0;
                line-height: 16px;
            }

            .exp-box-cont .radius-btn {
                padding: 5px 20px
            }

        .card-item.is-flipped {
            min-height: 3000px;
        }

        .old-price-inline-flex {
            flex-direction: column;
            gap: 15px;
        }

            .old-price-inline-flex p {
                font-size: 16px;
                line-height: 25px;
                text-align: center;
            }
            header nav {
            top: 57px;
            }
    }



    @media (max-width: 420px) {
        .ttl-text-or, .popup-genie-popup h1 {
            font-size: 16px;
        }

            .popup-genie-popup h1 .font-40 {
                font-size: 22px;
            }

        .popup-genie-popup h3 {
            font-size: 14px;
            line-height: 18px;
        }

        .popup-info ul li {
            font-size: 14px;
            line-height: 18px
        }

        .rounded-btn.golden-btn {
            font-size: 18px;
            padding: 6px 22px;
            margin: 0 0 5px 0;
        }

        .btn-blue-landing-book {
            font-size: 20px;
            padding: 10px 35px;
        }

        .timer-box-outer {
            padding: 0px 0 0
        }

        .btn-box-rigth {
            margin: 0px 0 0
        }

        .goc-genie-event-box {
            width: 350px;
            height: 350px;
            margin: 100px auto 20px;
            padding: 60px 20px 20px;
        }

        .img-genie-event {
            top: -44%;
            transform: translate(120%, 50%);
        }

            .img-genie-event img {
                width: 90px;
            }

        .event-ttl-genie {
            font-size: 48px;
            line-height: 44px;
        }

            .event-ttl-genie span {
                font-size: 26px;
                margin: 8px 0 10px;
            }

        .mega-event-date {
            font-size: 24px;
            line-height: 30px;
        }

        .event-btn-box {
            font-size: 20px;
        }

        .btn-event-in {
            font-size: 22px;
        }

        .live-session-box-outer {
            margin: 5px 5px 0
        }

        .validity-price-box .renew-plan-col-wrapper .price-year-plan-box .price-offer {
            margin: 0px 0;
            padding: 5px 15px;
            width: auto;
            line-height: 18px;
        }

        .checkbox-row li,
        .goc-survey-outer .radio-group {
            width: 50%;
            margin: 0
        }

        .expire-plan-box {
            flex-wrap: wrap;
        }
    }


    @media (max-width: 360px) {

        .live-session-box-outer .img-box {
            margin: 0 2px;
        }

        .live-session-box-outer .time-couter {
            width: 32px;
        }

        .width-xs {
            width: 50px;
        }

        .width-xs-date {
            width: 60px;
        }

        .width-xs-86 {
            width: 86px;
        }

        .live-session-box-outer {
            margin: 5px 0px 0;
        }

            .live-session-box-outer .timer-cnt {
                margin: 5px 5px 0;
            }

            .live-session-box-outer .gradient-btn {
                padding: 2px 4px;
                margin: 0;
                font-size: 10px;
                border-radius: 10px;
            }

        .goc-genie-event-box {
            width: 300px;
            height: 300px;
            padding: 40px 20px 20px;
            margin: 80px auto 20px
        }

        .img-genie-event img {
            width: 70px;
        }

        .img-genie-event {
            top: -41%;
            transform: translate(130%, 50%);
        }

        .mega-event-date {
            font-size: 20px;
            line-height: 24px;
        }

        .event-ttl-genie {
            font-size: 40px;
            line-height: 40px;
        }
    }

    @media (max-width: 767px) {
        .card-item {
            min-height: 2500px;
        }

        .beast-mode-video-modal .modal-body p.popup-text {
            font-size: 18px;
        }

        .youtube-free-modal .close {
            top: -1px;
            right: 0px;
        }

            .youtube-free-modal .close span img {
                width: 11px;
            }

        .video-container {
            border-radius: 10px;
        }

        .buynow-zoom {
            font-size: 12px;
            padding: 0.1rem 1.2rem;
        }

        .youtube-free-modal .modal-content {
            padding: 8px;
        }
    }



    @media only screen and (min-width: 768px) and (max-width: 1200px) {
        .validity-price-box .price-year-plan-box .final-price {
            width: 100%;
            display: flex;
            margin: 15px 0 10px;
            flex-wrap: wrap;
            justify-content: space-between;
        }

        .new-price-lbl {
            order: 2
        }

        .btn-plan-upgrade-price, .de_light .btn-plan-upgrade-price {
            order: 1;
            margin-top: 0
        }
    }


/*NEW HOME PAGE STYLE START HERE */

/*Hero section*/
/*.hero-gradient-text-wrapper {
    text-align: center;
    position: relative;
    padding: 0;
}
.hero-gradient-text-wrapper h1 {
    font-family: "Poppins", serif;
    font-size: 80px;
    font-weight: 800;
    line-height: 105px;
    letter-spacing: -1.6px;
    z-index: 2;
    position: relative;
}
    .hero-gradient-text-wrapper p {
        font-family: "Poppins", serif;
        color: #FFF;
        text-align: center;
        font-size: 20px;
        font-style: normal;
        font-weight: 300;
        line-height: normal;
        width: 80%;
        margin: 0 auto 1.5rem;
    }
    .hero-gradient-text-wrapper h1 span {
        background: linear-gradient(101deg, #0AB0B0 5.28%, #00FF7F 123.41%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        display: block;
        text-transform: uppercase;
        background-size: auto auto;
        background-clip: border-box;
        background-size: 200% auto;
        color: #fff;
        background-clip: text;
        text-fill-color: transparent;
        -webkit-background-clip: text;*/
/*        animation: textclip 3s linear infinite;*/
        /*display: inline-block;
        animation: wave 2s ease-in-out infinite;
    }
    .hero-gradient-text-wrapper span:nth-child(1) {
        animation-delay: 0s;
    }

    .hero-gradient-text-wrapper span:nth-child(2) {
        animation-delay: 0.5s;
    }

    .hero-gradient-text-wrapper span:nth-child(3) {
        animation-delay: 0.9s;
    }
@keyframes wave {
    to {
        background-position: -200% center;
    }

    0%, 100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-10px);
    }
}*/
.genie-gradient-slide-text h1 {
    border-radius: 57.803px;
    background: linear-gradient(88deg, rgba(131, 255, 158, 0.20) 0%, rgba(59, 55, 255, 0.20) 100%);
    padding: 6px 28px;
    color: #FFF;
    font-family: Poppins;
    font-size: 45px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 1.41px;
    text-transform: uppercase;
    display: inline-block;
}
.genie-gradient-slide-text h2 {
    background: linear-gradient(101deg, #0AB0B0 5.28%, #00FF7F 123.41%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: Poppins;
    font-size: 128px;
    background-size: 200% 100% !important;
    font-style: normal;
    font-weight: 800;
    line-height: 100px;
    letter-spacing: -1.6px;
    text-transform: uppercase;
    margin-bottom: 0px;
    margin-top: 1.5rem;
    animation: moveGradient 2s ease-in-out infinite;
}
.genie-gradient-slide-text h3 {
    color: #FFF;
    font-family: Poppins;
    font-size: 55px;
    font-style: normal;
    font-weight: 700;
    line-height: 65px;
    letter-spacing: -2px;
    margin-bottom: 25px;
}
.genie-gradient-slide-text h3 .animate-text span {
    background: linear-gradient(101deg, #0AB0B0 5.28%, #00FF7F 123.41%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 5px;
}
.genie-gradient-slide-text h3 .animate-text {
    display: inline-block !important;
    position: relative;
    top: 18px;
    left: 10px;
}
    .genie-gradient-slide-text h3 .animate-text .animated-line {
        width: 110px;
        position: absolute;
        bottom: 0;
        margin-bottom: 0;
        height: 6px;
    }
.genie-gradient-slide-text p {
    color: #FFF;
    font-family: Poppins;
    font-size: 19px;
    font-style: normal;
    font-weight: 200;
    line-height: normal;
    margin-bottom: 2rem;
}
.hero-gradient-effect-area {
    position: relative;
    padding: 300px 0 100px;
    overflow: hidden;
}
.hero-big-genie-vector img {
    width: 90%;
    display: block;
    margin-left: auto;
    margin-top: -3rem;
    animation: upDown 3s ease-in-out infinite;
}
@keyframes upDown {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }
    /* Moves up */
    100% {
        transform: translateY(0);
    }
    /* Back to the original position */
}
.line-pattern-shape {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    opacity: 0.5;
    height: 350px;
    object-fit: cover;
}
.hero-gradient-effect-area:before {
    content: '';
    position: absolute;
    left: -8rem;
    border-radius: 948px;
    opacity: 0.3;
    background: conic-gradient(from 180deg at 50% 50%, #0AB0B0 0deg, #00FF7F 93.59999656677246deg, #E1167E 216.00000858306885deg, #007FFF 288.0000042915344deg);
    filter: blur(130px);
    width: 900px;
    height: 90%;
    top: -20px;
}
.hero-gradient-effect-area:after {
    content: '';
    position: absolute;
    right: -10rem;
    border-radius: 930px;
    opacity: 0.3;
    background: conic-gradient(from 180deg at 50% 50%, #86F0D0 0deg, #0EF 93.59999656677246deg, #E1167E 216.00000858306885deg, #007FFF 288.0000042915344deg);
    filter: blur(130px);
    width: 900px;
    height: 90%;
    top: -44px;
}
.animated-button-round {
    position: relative;
    display: inline-block;
    padding: 12px 20px;
    text-align: center;
    font-size: 16px;
    font-weight: 700;
    color: #000000 !important;
    overflow: hidden;
    transition: all 0.6scubic-bezier(0.23, 1, 0.320, 1);
    z-index: 10;
    width: auto;
    border: none;
    cursor: pointer;
    border-radius: 68px;
    box-shadow: 0 0 0 5px #2f84c860;
    background: linear-gradient(98deg, #00EAEA 12.05%, #00FF7F 200.56%);
    min-width: 175px;
}
.animated-button-round span:first-child {
    position: relative;
    z-index: 1;
}
.animated-button-round span:last-child {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 20px;
    height: 20px;
    background: linear-gradient(84deg, #41bfcf 20.58%, #00ff30 100%);
    border-radius: 50%;
    opacity: 0;
    transition: all 0.8s cubic-bezier(0.23, 1, 0.320, 1);
}
.animated-button-round:hover span:last-child {
    width: 260px;
    height: 150px;
    opacity: 1;
}
.animated-button-round:focus{
    outline:none;
}
.home-chart-banner-col {
    margin-top: 8rem;
}
.home-chart-banner-col {
    z-index: 9;
}
/*Features section*/
.gradient-text-style {
    text-align: center;
}
.gradient-text-style h3 {
    color: #FFF;
    text-align: center;
    font-size: 56px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    letter-spacing: -1.6px;
    font-family: "Poppins", serif;
}
.gradient-text-style h3 span {
    background: linear-gradient(101deg, #0AB0B0 5.28%, #00FF7F 123.41%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: block;
    background-clip: text;
    background-size: 200% auto;
    animation: textanimate-reverse 5s ease-in-out infinite reverse;
}



.gradient-text-style p {
    color: rgba(255, 255, 255, 0.80);
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    font-family: "Poppins", serif;
    width: 52%;
    margin: 1rem auto 2rem;
}
.stock-meter-section {
    position: relative;
}
.stock-meter-section:before {
    content: '';
    position: absolute;
    left: -3rem;
    width: 900px;
    height: 700px;
    top: 0;
    border-radius: 720px;
    opacity: 0.3;
    background: conic-gradient(from 180deg at 50% 50%, #86B00A 0deg, #4A9EE7 93.59999656677246deg, #51D195 216.00000858306885deg, #0059FF 288.0000042915344deg);
    filter: blur(130px);
}
.feature-row-gradient {
    padding: 4rem 0rem;
}
.feature-gradient-text h4 {
    font-family: "Poppins", serif;
    font-size: 40px;
    font-style: normal;
    font-weight: 800;
    line-height: 50px;
    background: linear-gradient(90deg, #0AB0B0 0.35%, #00FF7F 140.46%, #007FFF 144.75%);
    background-size: 200% 100% !important;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: moveGradient 2s ease-in-out infinite;
}
.feature-gradient-text p {
    color: rgba(255, 255, 255, 0.60);
    font-family: "Poppins", serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px; /* 19.6px */
}
.feature-gradient-text ul {
    list-style-type: none;
    padding-left: 0;
    margin-left: -10px;
}
.feature-gradient-text ul li {
    color: #FFF;
    font-family: "Poppins", serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 20px;
    position: relative;
}
.animated-button-round span img {
    filter: invert(1);
    width: 24px;
    position: relative;
    top: -1px;
}
.feature-gradient-text ul li img {
    height: 55px;
}
.autoplay-video-gradient video {
    width: 100%;
    height: 450px;
    object-fit: cover;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: #001313;
}
.autoplay-video-gradient {
    padding-right: 1.5rem;
}
.animated-line {
    width: 240px;
    height: 5px;
    border-radius: 16px;
    background: linear-gradient(90deg, #0AB0B0 0.35%, #00FF7F 78.92%, #007FFF 101.48%);
    margin-bottom: 1rem;
    background-size: 200% 100% !important;
    animation: moveGradient 2s ease-in-out infinite;
}
@keyframes moveGradient {
    100% {
        background-position: -200% center;
    }
}
.feature-gradient-text ul li p {
    padding-left: 3.5rem;
    font-weight: 300;
    margin-bottom: 0;
    opacity: 0;
    transition: 0.5s ease-in-out all;
    position: absolute;
    font-size: 13px;
    line-height: 15px;
    top: 38px;
}
.feature-row-gradient:hover .feature-gradient-text ul li p {
    opacity: 1;
   
}
.cash-scanner-section{
    position:relative;
}
.cash-scanner-section:after {
    content: '';
    position: absolute;
    right: -3rem;
    width: 900px;
    height: 700px;
    top: 0;
    border-radius: 720px;
    opacity: 0.3;
    background: conic-gradient(from -64deg at 50% 50%, #6B0AB0 0deg, #E4ADFA 93.59999656677246deg, #51D195 216.00000858306885deg, #007FFF 288.0000042915344deg);
    filter: blur(130px);
}
/*Pricing section*/
.gradient-price-section {
    background-image: url(../images/home/pricing-bg-new.png);
    width: 100%;
   
}
.price-title-gradient {
    text-align: center;
}
.price-title-gradient h3 {
    border-radius: 40px;
    background: linear-gradient(88deg, rgba(131, 255, 158, 0.20) 0%, rgba(59, 55, 255, 0.20) 100%);
    color: #FFF;
    font-family: "Poppins", serif;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: 28px;
    text-transform: uppercase;
    display: inline-block;
    padding: 0.5rem 1.5rem;
    margin-bottom: 0;
}
.price-title-gradient h4 {
    color: #FFF;
    text-align: center;
    font-family: "Poppins", serif;
    font-size: 50px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    letter-spacing: -1.6px;
    margin-bottom: 2rem;
    margin-top: 10px;
}
.pricing-card-gradient {
    border-radius: 24px;
    background: linear-gradient(94deg, rgba(10, 176, 176, 0.22) -4.54%, rgba(0, 127, 255, 0.22) 48.96%, rgba(139, 0, 255, 0.22) 97.64%), rgba(255, 255, 255, 0.00);
    backdrop-filter: blur(14px);
    padding: 40px;
    width: 455px;
    margin: 0 auto;
}
.year-text-gradient {
    border-radius: 56px;
    background: linear-gradient(94deg, #0AB0B0 -4.54%, #007FFF 48.96%, #8B00FF 97.64%), #FFF;
    padding: 4px 16px;
    text-align: center;
    color: #FFF;
    font-family: "Poppins", serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px;
    text-transform: uppercase;
    margin-bottom: 24px;
    display: inline-block;
}
.price-title-text h4 {
    color: #FFF;
    font-family: "Poppins", serif;
    font-size: 32px;
    font-style: normal;
    font-weight: 800;
    line-height: normal;
    text-transform: uppercase;
    margin: 0;
}
.price-title-text p {
    color: #FFF;
    font-family: "Poppins", serif;
    font-size: 13px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}
.price-amount-wrapper {
    padding: 48px 0;
    color: #FFF;
    font-family: "Poppins", serif;
    font-size: 56px;
    font-style: normal;
    font-weight: 800;
    line-height: 36px;
}
.price-feature-points ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 40px;
}
.price-feature-points ul li {
    font-size: 18px;
    font-style: normal;
    font-weight: 200;
    line-height: 37px;
    padding-left: 35px;
    position: relative;
    color: #FFF;
    font-family: Poppins;
}
.price-feature-points ul li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background-image: url(/images/home/check-white.png);
    background-size: contain;
    background-repeat: no-repeat;
}
.buy-gradient-btn .animated-button-round {
    box-shadow: none;
    background: linear-gradient(101deg, #0AB0B0 5.28%, #00FF7F 123.41%), linear-gradient(94deg, #0AB0B0 -4.54%, #007FFF 48.96%, #8B00FF 97.64%);
    min-width: 100%;
    font-size: 18px;
   font-family: "Poppins", sans-serif;
    text-transform: uppercase;
    background-size: 200% 100% !important;
    animation: moveGradient 2s ease-in-out infinite;
}
.buy-gradient-btn .animated-button-round:hover span:last-child {
    width: 100%;
}
.buy-gradient-btn p {
    color: #0AB0B0;
    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-align: center;
    margin-bottom: 0;
    margin-top: 1rem;
}
.productivity-section .gradient-text-style h3 span {
    font-size: 40px;
    background: linear-gradient(101deg, #0AB0B0 5.28%, #00FF7F 123.41%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.productivity-section .gradient-text-style p {
    width: 60%;
}
.genie-chart-gradient {
    padding: 100px 0;
    position:relative;
}
    .genie-chart-gradient:before {
        content: '';
        position: absolute;
        left: -3rem;
        width: 900px;
        height: 710px;
        top: 22rem;
        border-radius: 585px;
        opacity: 0.45;
        background: conic-gradient(from -40deg at 50% 50%, #ABFFC8 0deg, #D066DE 93.59999656677246deg, #E1167E 216.00000858306885deg, #007FFF 288.0000042915344deg);
        filter: blur(130px);
    }
    .genie-chart-gradient:after {
        content: '';
        position: absolute;
        right: -3rem;
        width: 900px;
        height: 700px;
        top: 24rem;
        border-radius: 406px;
        opacity: 0.3;
        background: conic-gradient(from 180deg at 50% 50%, #6B0AB0 0deg, #E4ADFA 93.59999656677246deg, #51D195 216.00000858306885deg, #007FFF 288.0000042915344deg);
        filter: blur(130px);
    }
.vision-gradient-section {
    padding-top: 100px;
    position: relative;
}
    .vision-gradient-section:before {
        content: '';
        position: absolute;
        left: -5rem;
        width: 900px;
        height: 710px;
        top: 16rem;
        border-radius: 627.483px;
        opacity: 0.25;
        background: conic-gradient(from 180deg at 50% 50%, #6B0AB0 0deg, #B700FF 93.59999656677246deg, #E1167E 216.00000858306885deg, #007FFF 288.0000042915344deg);
        filter: blur(130px);
    }
    .vision-gradient-section:after {
        content: '';
        position: absolute;
        right: 97px;
        width: 900px;
        height: 710px;
        top: 10rem;
        border-radius: 730px;
        opacity: 0.30;
        background: conic-gradient(from -40deg at 50% 50%, #FFABF7 0deg, #D066DE 93.59999656677246deg, #E1167E 216.00000858306885deg, #007FFF 288.0000042915344deg);
        filter: blur(130px);
    }
.section-title-wrapper h2,
.section-title-wrapper h2 span {
    font-size: 50px;
    font-family: Poppins;
}
.creator-col-photo img {
    z-index: 99;
}
.vision-gradient-section .section-title-wrapper h2 span {
    background: linear-gradient(101deg, #0AB0B0 5.28%, #00FF7F 123.41%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: Poppins;
}
.team-support-gradient {
    padding-top: 80px;
    position: relative;
    padding-bottom: 50px;
}
.team-support-gradient .support-border-box:after{
        background: transparent;
}
.team-support-gradient .support-border-box {
    background: transparent;
    box-shadow: none;
}
    .team-support-gradient::before {
        content: '';
        position: absolute;
        left: -5rem;
        width: 900px;
        height: 710px;
        top: -11rem;
        border-radius: 520px;
        opacity: 0.21;
        background: #0AB047;
        filter: blur(130px);
    }
    .team-support-gradient::after {
        content: '';
        position: absolute;
        right: 0;
        width: 900px;
        height: 710px;
        top: 4rem;
        border-radius: 520px;
        opacity: 0.25;
        background: #0AB0B0;
        filter: blur(130px);
        left: inherit;
    }
.founder-gradient-row .new-meet-text h2 {
    color: #FFF;
    font-family: Poppins;
    font-size: 48px;
    font-style: normal;
    font-weight: 600;
    line-height: 54px;
    text-transform: capitalize;
    margin: 0;
}
.founder-gradient-row .new-creator-text p {
    color: rgba(255, 255, 255, 0.70);
    font-family: Poppins !important;
    font-size: 17px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    text-transform: uppercase;
}
.founder-gradient-row .new-creator-text p:nth-child(3) {
    text-transform: lowercase;
     font-size: 16px;
     margin-top: 0rem;
     color: #ffffff;
}
.founder-gradient-row {
    padding-left: 2rem;
}
.new-creator-text h3 {
    font-family: Poppins;
    font-weight: 600;
}
.sebi-regiter-box h5 {
    font-size: 17px;
    font-family: Poppins;
}
.founder-gradient-row .new-creator-text p:last-child {
    font-size: 22px;
   font-family: "Poppins", sans-serif;
    text-transform: capitalize;
    color: #ffffff;
}
.new-creator-text p span {
    font-size: 18px;
}
.creator-col-photo img {
    top: -2rem;
    right: -10.1rem;
    margin-bottom: -2rem;
    border-radius: 0 0 30px 0;
}
.support-border-box h2 {
    font-family: Poppins;
}
.support-border-box p {
    font-family: Poppins;
    font-weight: 400;
    width: 75%;
    font-size: 16px;
    margin: 1.5rem auto 3rem;
}
.whatsapp-gradient-btn {
    background: #29A71A;
    box-shadow: 0px 4px 24.3px 29px rgba(0, 0, 0, 0.03);
    color: #ffffff !important;
    border-radius: 68px;
}
.support-border-box .whatsapp-gradient-btn span img {
    filter: hue-rotate(45deg);
}
.right-video-gradient {
    z-index: 99;
}
.custom-w-para .gradient-btn-small {
    padding: 2px 15px;
    border-radius: 15px; font-size:14px
}
.respo-frame-row{
    position:relative;
    z-index:99;
}
.report-table-scrollable {
    overflow: auto;
    white-space: nowrap;
    height: calc(100vh - 200px);
}
.report-table-scrollable tr th, .report-table-scrollable tr td {
    padding: 8px 10px;
    border-bottom: none;
   
}
.report-table-scrollable thead {
    position: sticky;
    top: 1px;
    background: #ffffff;
    outline: 1px solid #dee2e6;
}
.stock-perform-report {
    height: calc(100vh - 198px);
    background: #333333;
    border-radius: 10px;
    padding: 10px 10px 15px;
}
.stock-modal-light .gpt-candle-chart-container .highcharts-background{
    fill:#ffffff;
}

/*.gpt-candle-chart-container,
.highcharts-container,
.highcharts-background {
    height: 500px !important;
}*/

/*GOC Mobile box style*/
.full-page-goc-wrapper {
    height: calc(100vh - 60px);
    overflow: auto;
}
.full-page-goc-stack-component {
    height: 100vh;
    overflow-y: auto;
}
.goc-widget-mobile-box {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}
.border-box-gradient {
    background: linear-gradient(90.39deg, #0AB0B0 -0.34%, #00FF7F 66.98%, #007FFF 128.24%);
    padding: 1.5px;
    border-radius: 16px;
    display: inline-block;
    text-align: center;
    cursor: pointer;
}

/*Community page style*/
.commnuity-section {
    min-height: calc(100vh - 56px);
    /*max-height: calc(100vh - 56px);*/
    overflow: auto;
}
.commnuity-section .container {
    max-width: 700px;
}
.border-tab-bar {
    border-bottom: 1px solid rgba(19, 191, 180, 1);
    display: flex;
    /* justify-content: space-between; */
    align-items: center;
}
.border-tab-bar .nav-item{
    width: 33.33%;

}
.border-tab-bar a {
    color: #ffffff;
    font-size: 17px;
    font-weight: 600;
    letter-spacing: -0.32px;
    transition: 0.4s ease-in-out all;
    padding: 2px 20px 6px 15px;
    border-bottom: 5px solid transparent;
}
.border-tab-bar a.active {
    border-color: rgba(1, 240, 185, 1);
    color: rgba(1, 240, 185, 1) !important;
    background: transparent !important;
    border-radius: 0 !important;
}
.border-tab-bar a svg {
    margin-right: 8px;
}
.border-tab-bar a:hover {
    color: #03deac !important;
}
.community-post-box {
    display: flex;
    align-items: center;
    background: rgba(29, 42, 42, 1);
    border-radius: 16px;
    padding: 20px 16px;
    column-gap: 8px;
    margin: 1.2rem 0;
}
.black-post-box {
    width: 100%;
}
.black-post-box input {
    border-radius: 16px;
    background: rgba(24, 27, 27, 1);
    padding: 5px 15px;
    font-family: Poppins;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    letter-spacing: 0px;
    width: 100%;
    border: none;
    color:#ffffff;

}
.community-post-inline {
    background: rgba(42, 53, 54, 1);
    border-radius: 16px 16px 0 0;
    box-shadow: 0 0 5px 5px rgba(10, 10, 10, 1);
    padding: 16px;
    display: flex;
    align-items: center;
    font-size: 16px;
    font-weight: 500;
    color: #ffffff;
    justify-content: space-between;
}
.pending-post-inline {
    box-shadow: 0px 3px 7px 1px rgba(10, 10, 10, 0.5);
    margin: -10px -9px 10px;
    border-radius: 0;
}
.community-post-inline svg {
    margin-right: 5px;
}
.user-feed-box {
    background: rgba(42, 53, 54, 1);
    border-radius: 16px;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 1);
    padding: 10px;
    margin-bottom: 1rem;
}
.user-feed-box:first-child {
    border-radius: 0 0 16px 16px;
}
.user-header-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid rgba(61, 102, 105, 1);
    margin-bottom: 12px;
    margin-left: -9px;
    margin-right: -10px;
    padding: 0px 10px 12px;
}
.user-logo-name {
    display: flex;
    align-items: center;
    column-gap: 15px;
}
.user-logo-name p {
    margin: 0;
    color: #ffffff;
    font-family: 'Poppins';
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0px;
}
.user-time-ago p {
    font-family: Poppins;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: 0px;
    text-align: right;
    color: rgba(194, 194, 194, 1);
    margin: 0;
}
.user-body-area p {
    font-family: Poppins;
    font-weight: 300;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: -0.32px;
    vertical-align: middle;
    color: #ffffff;
    margin-bottom: 10px;
}
.grid-post-view {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap:16px;
}
.grid-post-view img {
    width: 100%;
}
.user-footer-area {
    display: flex;
    align-items: center;
    column-gap: 3rem;
    margin: 1.2rem 0;
}
.like-count-text {
    font-family: Poppins;
    font-weight: 600;
    font-size: 15.6px;
    line-height: 24px;
    letter-spacing: -0.32px;
    color: rgba(2, 235, 198, 1);
    vertical-align: initial;
    display: flex;
    align-items: center;
    column-gap: 16px;
}
.like-count-box {
    border: 2px solid #01f0b9;
    border-radius: 20px;
    padding: 2px 18px;
    display: flex;
    align-items: center;
    column-gap: 10px;
    color: rgba(2, 235, 198, 1);
    font-family: Poppins;
    font-weight: 600;
    font-size: 16px;
    letter-spacing: -0.32px;
    vertical-align: middle;
    transition: 0.3s;
    cursor: pointer;
}
.like-count-box:hover {
    background: #01f0b9;
    color: #2d2d2d;
    border-color: #01f0b9;
}
.community-post-inline div {
    cursor: pointer;
}
.community-post-inline .active {
    color: #01f0b9;
}
.reject-reason-post {
    background: rgba(24, 27, 27, 1);
    margin-top: -12px;
    margin-left: -10px;
    margin-right: -10px;
    padding: 14px;
}
.reject-reason-post h5 {
    font-family: Poppins;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: -0.32px;
    vertical-align: middle;
    color: rgba(1, 240, 185, 1);
}
.reject-reason-post p {
    font-family: Poppins;
    font-weight: 300;
    font-size: 15px;
    line-height: 24px;
    letter-spacing: -0.32px;
    vertical-align: middle;
    color: #ffffff;
    margin-bottom: 0;
}
.create-post-wrapper {
    background: rgba(42, 53, 54, 1);
    border-radius: 16px;
    box-shadow: 0 0 3px 2px rgba(0, 0, 0, 1);
    padding: 10px;
    margin-bottom: 1rem;
}
.create-post-header {
    border-bottom: 1px solid rgba(61, 102, 105, 1);
    margin-bottom: 12px;
    margin-left: -9px;
    margin-right: -10px;
    padding: 0px 10px 12px;
}
.create-post-header p {
    font-family: 'Poppins';
    font-weight: 500;
    font-size: 24px;
    line-height: 44px;
    letter-spacing: 0px;
    vertical-align: middle;
    background: -webkit-linear-gradient(rgba(10, 176, 176, 1), rgba(0, 255, 127, 1));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.form-container {
    background-color: rgba(9, 18, 18, 1);
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.25);
    margin-top: 1.5rem;
    margin-bottom: 4rem;
}
    .file-input-wrapper {
      position: relative;
      margin-bottom: 20px;
    }

    .file-input-wrapper input[type="file"] {
      opacity: 0;
      position: absolute;
      left: 0;
      top: 0;
      height: 100%;
      width: 100%;
      cursor: pointer;
    }

/*    textarea {
      width: 100%;
      background-color: #1e1e1e;
      color: #ccc;
      border: 2px solid #2a2a2a;
      border-radius: 15px;
      padding: 15px;
      resize: none;
      margin-bottom: 20px;
    }*/

    .form-row {
      display: flex;
      gap: 15px;
    }

    .form-group {
      flex: 1;
    }

.post-button {
    background: linear-gradient(to right, #00f0c8, #00c3f0);
    color: #000;
    font-weight: bold;
    padding: 8px 28px;
    border: none;
    border-radius: 30px;
    cursor: pointer;
    font-size: 16px;
    transition: background 0.3s;
}

    .post-button:hover {
      background: linear-gradient(to right, #00c3f0, #00f0c8);
    }
    .post-button:focus {
        outline: none;
    }
.create-post-body {
    padding: 10px;
}
.create-post-body .form-row label {
    display: block;
}
    .create-post-body .form-row select {
        width: 100%;
        background: rgba(29, 42, 42, 1);
        border: 1px solid rgba(62, 79, 81, 1);
        padding: 10px;
        border-radius: 10px;
        color: #ffffff;
        font-weight: 500;
        font-size: 16px;
    }
.user-logo-name .fa-chevron-left {
    color: #ffffff;
    font-size: 18px;
    cursor: pointer;
}
.form-container textarea {
    background: rgba(29, 42, 42, 1);
    font-weight: 600;
    border: 1px solid rgba(62, 79, 81, 1);
    color: #ffffff;
    width: 100%;
    border-radius: 15px;
    padding: 15px;
    resize: none;
    margin-bottom: 20px;
}
.form-container textarea:focus {
    outline: none;
}
.form-row .form-group label {
    color: #ffffff;
    font-weight: 500;
    font-size: 16px;
}
.right-justy-btn {
    text-align: right;
}
.noData-community {
    text-align: center;
    color: #ffffff;
    background: #212929;
    padding: 2rem;
    border-radius: 0 0 16px 16px;
}
.noData-community p {
    margin-bottom: 0;
    font-size: 16px;
    text-transform: capitalize;
}
.file-input-wrapper .dropzone {
    background: rgba(21, 33, 54, 1);
    border-color: rgba(2, 225, 224, 1);
    border-radius: 20px;
    padding: 10px;
    min-height: 120px;
}
.file-input-wrapper .dropzone .dz-message .dz-button {
    color: rgba(2, 235, 198, 1);
    font-size: 16px;
    font-weight: 600;
}
    .file-input-wrapper .dropzone .dz-preview.dz-image-preview {
        background: #000000;
        margin: 0;
        margin: 5px;
        border-radius: 0;
        border: 1px solid #888888;
    }
.file-input-wrapper .dropzone .dz-preview .dz-image{
    border-radius: 0;
}
.file-input-wrapper .dropzone .dz-image img{
    border-radius: 0;
}
.file-input-wrapper .dz-default.dz-message:before {
    content: url(../images/file-upload-icon.png);
    vertical-align: middle;
    display: inline-block;
    height: 22px;
    margin-right: 10px;
}
.user-logo-name .user_initial {
    width: 40px;
    height: 40px;
    background: #0abdb1;
    border-radius: 50%;
    line-height: 42px;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    float: left;
    position: relative;
    text-align: center;
    text-transform: uppercase;
}
.file-input-wrapper .edit-btn {
    position: absolute;
    top: 4px;
    left: 3px;
    background: #0e0e0e;
    z-index: 100;
    cursor: pointer !important;
    font-weight: 600;
    color: #ffffff;
    width: 22px;
    height: 22px;
    border-radius: 0px;
    border: 1px solid #979696;
    box-shadow: 0 0px 2px 2px rgba(0, 0, 0, 0.5);
}
.file-input-wrapper .edit-btn svg {
    width: 16px;
    height: 16px;
    position: relative;
    top: -6px;
    left: -4px;
    cursor: pointer;
}
.file-input-wrapper .dz-remove svg {
    width: 16px;
    height: 16px;
    position: relative;
    top: -4px;
    left: 0px;
    cursor: pointer;
}
.file-input-wrapper .dz-remove {
    right: 3px !important;
    position: absolute;
    z-index: 100;
    top: 4px !important;
    left: inherit !important;
    background: #0e0e0e !important;
    cursor: pointer !important;
    font-weight: 600 !important;
    color: #ffffff !important;
    width: 22px;
    height: 22px;
    border-radius: 0px !important;
    border: 1px solid #979696 !important;
    box-shadow: 0 0px 2px 2px rgba(0, 0, 0, 0.5);
}
.file-input-wrapper .dropzone .dz-details,
.file-input-wrapper .dropzone .dz-preview .dz-progress {
    display: none !important;
}
.crop-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
}
.crop-modal .modal-content {
    background: #313131;
    padding: 5px;
    border-radius: 0px;
    max-width: 600px;
    width: 100%;
    text-align: center;
}
.crop-modal .modal-content button {
    background: transparent;
    border: none;
    margin: 10px 2px 0;
    padding: 0px 3px;
}
.crop-modal .modal-content img {
    max-width: 100%;
    max-height: 400px;
}
.crop-modal .modal-content button img {
    width: 35px;
}
.crop-modal .modal-content button:focus {
    outline: none;
}
.masonry-gallery {
    column-count: 2;
    column-gap: 7px;
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
}


    .masonry-gallery a {
        break-inside: avoid;
        display: inline-block;
        margin-bottom: 7px;
        width: 100%;
    }

.gallery-img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

    .gallery-img:hover {
        transform: scale(1.02);
    }
.thankYou-modal-body .form-group .text-black,
.thankYou-modal-body .form-group {
    margin-bottom: 0;
}
.thankYou-modal-body {
    padding: 1.5rem;
}

.border-box-gradient .content{
    border-radius: 14px;
    padding: 21px 15px;
    background: #1c1c1c;
    min-height: 140px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.border-box-gradient p{
    font-size: 16px;
    font-weight: 400;
    color: #ffffff;
    margin-bottom: 0;
    margin-top: 16px;
    line-height: 20px;
    font-family: Poppins;
}
.full-page-goc-wrapper {
    height: calc(100vh - 60px);
    overflow: auto;
}
.btn-bestmode {
    padding: 3px 12px;
    border: 1px solid #1cc6c6;
    border-radius: 8px;
    color: #1cc6c6 !important;
    margin-bottom: 1rem;
    display: inline-block;
    transition: 0.3s;
}
.btn-bestmode:hover {
    background: #099595;
    color: #ffffff !important;
}
.indices-box .widget-pd-box .btn-warning{
    margin-top: 1px;
}


/*Responsive css*/
@media (max-width: 1499px) {
    .hero-gradient-effect-area {
        padding: 220px 0 50px;
    }
    .genie-gradient-slide-text h2 {
        font-size: 95px;
        margin-top: 1rem;
    }
    .genie-gradient-slide-text h1 {
        font-size: 40px;
    }
    .genie-gradient-slide-text h3 {
        font-size: 50px;
    }
    .genie-gradient-slide-text p{
        font-size:17px;
    }
    .hero-big-genie-vector img {
        width: 78%;
        margin-top: -2rem;
    }
    .gradient-text-style h3 {
        font-size: 45px;
    }
    .feature-gradient-text h4 {
        font-size: 36px;
    }
    .animated-line {
        width: 200px;
    }
    .animated-button-round {
        padding: 10px 18px;
    }
    .animated-button-round span img {
      width: 22px;
      top: -2px;
    }
    .video-understand-section {
        padding-top: 0 !important;
    }
    .section-title-wrapper h2,
    .section-title-wrapper h2 span {
        font-size: 50px;
    }
    .gradient-price-section {
        padding: 50px 0;
    }
    .price-title-gradient h4 {
        font-size: 45px;
        margin-bottom: 1rem;
    }
    .pricing-card-gradient {
        padding: 25px;
        width: 440px;
    }
    .price-amount-wrapper {
        padding: 25px 0;
        font-size: 45px;
    }
    .price-feature-points ul li {
        font-size: 16px;
        line-height: 32px;
       
    }
}
@media (max-width: 1299px) {
    .genie-chart-gradient {
        padding-top: 50px;
    }
}
@media (max-width: 1199px) {
    .genie-gradient-slide-text h1 {
        font-size: 35px;
    }
    .genie-gradient-slide-text h2 {
        font-size: 85px;
        margin-top: 0;
    }
    .genie-gradient-slide-text h3 {
        line-height: 40px;
        font-size: 45px;
    }
    .genie-gradient-slide-text h3 .animate-text {
      top: 6px;
   }
    .genie-gradient-slide-text p {
        font-size: 16px;
    }
    .feature-gradient-text ul li p {
        font-size: 12px;
        line-height: 14px;
    }
    .animated-button-round {
        font-size: 15px;
        box-shadow: 0 0 0 2px #2f84c860;
    }
    .feature-row-gradient {
        padding: 3rem 0rem;
    }
    .section-title-wrapper h2, .section-title-wrapper h2 span {
        font-size: 45px;
        margin-bottom: 10px;
    }
    .founder-gradient-row .new-meet-text h2 {
        font-size: 40px;
    }
    .creator-col-photo img {
        top: 0;
    }
}
@media (max-width: 991px) {
    .hero-gradient-effect-area {
        padding: 120px 0 50px;
    }
    .genie-gradient-slide-text h1 {
        font-size: 30px;
    }
    .genie-gradient-slide-text h2 {
        font-size: 70px;
    }
    .genie-gradient-slide-text h3 {
        line-height: 35px;
        font-size: 40px;
    }
     .genie-gradient-slide-text h3 .animate-text {
        top: 16px;
    }
    .genie-gradient-slide-text h3 .animate-text span{
         margin-bottom: 15px
    }
    .hero-big-genie-vector img {
        width: 380px;
        margin-top: 3rem;
        margin-left: inherit;
    }
    .gradient-text-style h3 {
        font-size: 35px;
    }
    .gradient-text-style p {
        width: 100%;
        margin: 1rem auto 1rem;
    }
    .feature-gradient-text h4 {
        font-size: 30px;
        margin-bottom: 0;
    }
    .animated-line {
        width: 150px;
    }
    .feature-gradient-text ul li {
        font-size: 15px;
        font-weight: 400;
    }
    .feature-row-gradient {
        padding: 1rem 0rem;
    }
    .right-video-gradient {
        padding-top: 2rem;
    }
    .section-title-wrapper h2, .section-title-wrapper h2 span {
        font-size: 36px;
    }
    .price-title-gradient h4 {
        font-size: 35px;
        margin-bottom: 1rem;
    }
    .price-title-gradient h3 {
        font-size: 20px;
    }
    .price-amount-wrapper {
        padding: 18px 0;
        font-size: 40px;
    }
    .founder-gradient-row .new-meet-text h2 {
        font-size: 30px;
    }
    .founder-gradient-row .new-creator-text p {
        display: inline-block;
    }
    .genie-gradient-slide-text {
        z-index: 99;
    }
    .creator-col-photo img {
        z-index: 0;
        border-radius: 0 0 0 0;
        left: auto;
        right: 0;
        margin: 0 -15px -30px 0;
        float: right;
    }
    .border-tab-bar a svg {
        margin-right: 5px;
        width: 18px;
    }
    .border-tab-bar a {
        font-size: 15px;
        padding: 2px 10px 6px 10px;
        border-bottom: 3px solid transparent;
  }

    .goc-widget-mobile-box {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
    }
    .border-box-gradient .content {
        padding: 10px;
        min-height: 132px;
    }
}
@media (max-width: 767px) {
    .hero-gradient-effect-area {
        padding: 90px 0 0px;
    }
    .genie-gradient-slide-text h1 {
        font-size: 28px;
        padding: 2px 28px;
        line-height: normal;
    }
    .genie-gradient-slide-text h2 {
        font-size: 60px;
        line-height: 70px;
    }
    .genie-gradient-slide-text h3 {
        line-height: 30px;
        font-size: 35px;
    }
    .hero-big-genie-vector img {
        width: 340px;
        margin-top: 3rem;
        margin-left: inherit;
    }
    .gradient-text-style h3 {
        font-size: 30px;
        margin-bottom: 0;
    }
    .hero-gradient-effect-area:before,
    .hero-gradient-effect-area:after {
        opacity: 0.2;
    }
    .productivity-section .gradient-text-style p {
        width: 100%;
    }
    .productivity-section .gradient-text-style h3 span {
        font-size: 30px;
    }
    .genie-chart-gradient:before {
        opacity: 0.15
    }
    .genie-chart-gradient:after {
        opacity: 0;
    }
    .team-support-gradient .support-border-box {
        border: none;
        padding: 0;
    }
    .team-support-gradient .support-border-box p{
        width: 100%;
    }
    .animated-button-round {
        font-size: 14px;
        box-shadow: 0 0 0 2px #2f84c860;
        min-width: 155px;
        padding: 6px 14px;
    }
    .right-video-gradient {
        padding-top: 0rem;
    }
    .video-understand-section {
        padding-top: 30px !important;
    }
    .animated-button-round span img {
        width: 20px;
        top: -1px;
    }
    .community-post-box {
        padding: 14px 12px;
        margin: 1rem 0;
    }
    .community-post-box img {
       width: 32px;
    }
    .black-post-box input {
        line-height: 25px;
    }
    .community-post-inline svg {
        width: 20px;
    }
    .community-post-inline span {
        font-size: 14px;
    }
    .user-logo-name {
        column-gap: 10px;
    }
    .user-logo-name img {
        width: 32px;
    }
    .user-logo-name p{
       font-size: 14px;
    }
    .user-header-area {
        padding: 0px 10px 8px;
    }
    .user-time-ago p{
        font-size:13px;
    }
    .community-post-inline {
        padding: 10px 14px;
    }
    .user-body-area p {
        font-size: 14px;
    }
    .grid-post-view {
        gap: 10px;
    }
    .user-footer-area {
        column-gap: 2rem;
        margin: 0.5rem 0;
    }
    .like-count-text {
        font-size: 14px;
        line-height: 20px;
        column-gap: 8px;
    }
    .like-count-text svg {
       width: 18px;
    }
    .like-count-box {
        padding: 1px 12px;
        border: 1px solid #01f0b9;
        column-gap: 10px;
        font-size: 14px;
    }
    .create-post-header {
        padding: 0px 10px 5px;
        margin-bottom: 5px;
    }
    .user-logo-name .fa-chevron-left {
        font-size: 16px;
    }
    .form-container {
        padding: 15px;
        margin-top: 1rem;
        margin-bottom: 2rem;
    }
    .custom-file-button {
        padding: 6px 20px;
        font-size: 15px;
    }
    .create-post-header p {
        font-size: 18px;
    }
    .form-row {
        margin: 0;
        gap: 10px;
    }
   .form-row .form-group label {
      font-size: 15px;
      margin-bottom: 5px;
     }
    .create-post-body .form-row select {
        font-size: 15px;
    }
    .file-input-wrapper .dropzone {
        min-height: auto;
        height: auto;
    }
    .file-input-wrapper .dropzone .dz-message {
      text-align: center;
      margin: 1em 0;
   }
        .file-input-wrapper .dropzone .dz-preview {
            margin: 6px;
        }
        .productivity-section .gradient-text-style p {
    margin-bottom: 3rem;
}
}
@media (max-width: 575px) {
    .genie-gradient-slide-text h2 {
        font-size: 55px;
        line-height: 50px;
        margin-top: 15px;
    }
    .hero-big-genie-vector img {
        width: 285px;
        margin-top: 2rem;
    }
    .autoplay-video-gradient {
        padding-right: 0;
    }
    .feature-gradient-text h4 {
        font-size: 22px;
        margin-bottom: 0;
        line-height: 30px;
    }
    .feature-gradient-text p {
        font-weight: 300;
    }
    .feature-gradient-text ul li {
        font-size: 14px;
        display: flex;
        align-items: center;
        line-height: 15px;
    }
    .gradient-text-style h3 {
        font-size: 25px;
        margin-bottom: 0;
    }
    .feature-gradient-text ul li p {
        top: 39px;
    }
    .autoplay-video-gradient video {
        height: 300px;
        object-fit: contain;
    }
    .section-title-wrapper h2, .section-title-wrapper h2 span {
        font-size: 25px;
        line-height: 32px;
    }
    .price-title-gradient h4 {
        font-size: 30px;
        margin-bottom: 1rem;
        letter-spacing: 0;
        line-height: 32px;
    }
    .pricing-card-gradient {
        padding: 15px;
        width: 100%;
    }
    .year-text-gradient {
        padding: 2px 13px;
        font-size: 13px;
        margin-bottom: 10px;
    }
    .price-title-text h4 {
        font-size: 25px;
    }
    .price-amount-wrapper {
        padding: 10px 0;
        font-size: 35px;
    }
    .price-title-text p{
        margin-bottom:10px;
    }
    .buy-gradient-btn .animated-button-round {
        font-size: 16px;
    }
    .buy-gradient-btn p {
        margin-top: 0;
    }
    .genie-chart-gradient {
        padding-top: 0;
    }
    .productivity-section .gradient-text-style h3 span {
        font-size: 25px;
    }
    .creator-box-row .frame-box {
        display: none;
    }
    .founder-gradient-row .new-meet-text h2 {
        font-size: 25px;
    }
    .founder-gradient-row .new-creator-text p {
        font-size: 15px;
    }
    .new-creator-text h3 {
        color: #ffffff;
        font-size: 18px;
        font-weight: 600;
        margin-top: 10px;
    }
    .founder-gradient-row .new-creator-text p:last-child {
        font-size: 16px;
    }
    .new-creator-text p img {
        width: 30px;
        padding-right: 5px;
    }
    .genie-chart-gradient {
        padding-bottom: 50px;
    }
    .team-support-gradient {
        padding-top: 50px;
    }
    .support-border-box h2 {
        font-size: 25px;
        line-height: 32px;
    }
    .founder-gradient-row {
        padding-left: 0;
    }
    .border-tab-bar {
        flex-wrap: nowrap;
        white-space: nowrap;
        overflow-x: auto;
    }
    .community-post-box {
        padding: 10px;
        margin: 0.6rem 0;
    }
    .community-post-inline {
        padding: 10px;
        overflow-x: auto;
    }
    .community-post-inline div {
      white-space: nowrap;
      padding-right: 12px;
  }
    .user-feed-box {
        margin-bottom: 0.6rem;
        padding: 8px 10px;
    }
    .user-header-area {
        margin-bottom: 6px;
    }
    .user-body-area p {
        line-height: 18px;
    }
    .like-count-text svg {
        width: 16px;
    }
    .user-footer-area {
        column-gap: 1rem;
        margin: 0.4rem 0;
    }
    .like-count-box {
        padding: 0px 12px;
        font-size: 13px;
        column-gap: 6px;
    }
    .like-count-box svg {
       width: 16px;
   }
    .grid-post-view {
        grid-template-columns: repeat(1, 1fr);
    }
    .reject-reason-post h5 {
        font-size: 14px;
    }
    .form-row {
        flex-direction: column;
        gap: 0;
    }
    .form-container textarea {
        margin-bottom: 5px;
        border-radius: 5px;
    }
    .form-container {
        margin-bottom: 0.5rem;
        margin-top: 0.5rem;
        padding: 5px;
    }
    .noData-community {
        padding: 1rem;
       
    }
    .noData-community p {
       font-size: 15px;
  
  }
    .file-input-wrapper .dropzone {
        padding: 4px;
        border-radius: 5px;
        border-width: 1px;
    }
  .file-input-wrapper .dropzone .dz-message .dz-button {
    font-weight: 600;
    font-size: 15px;
   }
    .user-logo-name .user_initial {
        width: 28px;
        height: 28px;
        line-height: 28px;
        font-size: 13px;
    }

/*    .border-box-gradient .content {
        padding: 21px 5px;
    }*/
     .border-box-gradient .content img {
            width: 30px;
     }
    .goc-widget-mobile-box {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .border-box-gradient p {
        font-size: 15px;
        margin-top: 12px;
        line-height: 18px;
    }
    .border-box-gradient .content {
        min-height: 110px;
    }
    .create-post-body {
        padding: 5px;
    }
    .file-input-wrapper .dropzone .dz-preview.dz-image-preview {
        margin: 2px;
        width: 85px;
        height: 90px;
        min-height: 90px;
    }
    .file-input-wrapper .dropzone .dz-preview .dz-image {
        width: 82px;
        height: 86px;
    }
    .file-input-wrapper .edit-btn {
        width: 20px;
        height: 20px;
        top: 4px;
        left: 3px;
    }
    .file-input-wrapper .edit-btn svg {
        width: 14px;
        height: 14px;
        top: -7px;
        left: -4px;
   }
    .crop-modal .modal-content button {
        margin: 4px 2px -8px;
        padding: 0px;
    }
        .crop-modal .modal-content button svg {
            width: 25px;
            height: 25px;
        }
    .crop-modal .modal-content button#crop-done svg,
    .crop-modal .modal-content button#crop-cancel svg{
        height: 22px;
    }
        .crop-modal .modal-content button#crop-done svg {
            position: relative;
            top: -2px;
        }
    .commnuity-section {
        padding-top: 4rem;
        padding-bottom: 1rem;
    }
    .create-post-wrapper {
        padding: 6px 4px;
    }
    .create-post-header {
        margin-left: -5px;
        margin-right: -5px;
    }
    .user-logo-name {
        column-gap: 7px;
    }
    .create-post-header p {
        line-height: 30px;
    }
    .file-input-wrapper {
        margin-bottom: 15px;
    }
        .file-input-wrapper .dz-remove {
            width: 20px;
            height: 20px;
        }
            .file-input-wrapper .dz-remove svg {
                width: 15px;
                height: 15px;
                top: -5px;
            }
    .post-button {
        padding: 4px 28px;
        font-size: 15px;
    }
}
/*goc-plan-card*/
.goc-plan-card {
    background: transparent linear-gradient(90deg, #0E0700 0%, #033838 100%) 0% 0%;
    border: 2px solid #FFB800;
    box-shadow: 0 0 10px 10px rgba(0, 0, 0, .3);
    padding: 20px 20px;
    border-radius: 20px;
    margin-bottom: 30px;
    flex-wrap: nowrap;
    position: relative;
}
.heading-operator{
    background-color: #0bb2b1;
    border-radius: 10px;
    font-size: 16px;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
    padding: 5px 15px;
    margin: 0px 0 0 0px;
    text-transform: uppercase;
    box-shadow: 0 0 10px #101010;
    position: relative;
    top: -35px;
    left: 14px;
    display: none;
}
.goc-plan-card-body {
    display: flex;
}
.goc-plan-left {
    display: flex;
    margin-right: 8px;
    width: 100%;
    align-items: flex-start;
}
.goc-plan-img {
    border: 1px solid #979797;
    border-radius: 6px;
    margin-right: 15px;
    padding: 2px;
    text-align: center;
    background-color: #0bb2b1;
}
    .goc-plan-img img {
        width: 100%;
        width: 59px;
        height: 103px;
    }
    .goc-plan-text{
        width: 100%;
    }
.goc-plan-text h3 {
    font-size: 26px;
    line-height: 29px;
    font-weight: bold;
    color: #fff;
    margin-bottom: 13px;
    text-align: center;
}
.goc-plan-text h3 i{
    color: #0bb2b1;
        margin-right: 4px;
        font-size: 16px;
}
.goc-plan-text p {
    font-size: 16px;
    line-height: 20px;
    color: #d9d9d9;
    font-weight: 500;
    margin-bottom: 6px;
}
.goc-plan-text p b{
    color: #0bb2b1;
}
.goc-plan-right .explore-btn {
    display: inline-block;
    text-align: center;
    font-size: 16px;
    background-color: #0eb2b1;
    color: #ffffff;
    padding: 6px 17px;
    font-weight: 700;
    border-color: #0eb2b1;
    text-decoration:none;
    border-radius: 30px;
    white-space: nowrap;
    margin-top: 15px;
}
    .goc-plan-right .explore-btn:hover {
        background-color: #0ac6c4;
        border-color: #0ac6c4;
        color: #ffffff;
    }
    .pricing-text{
        font-family: "Poppins", sans-serif;
        font-size: 30px;
        line-height: 25px;
        font-weight: 700;
        color: #fff;
        display: block;
        margin: 0px 0px 6px;
        white-space: nowrap;
    }

    .year-plans{
        font-size: 22px;
        line-height: 26px;
        font-weight: 600;
        color: #fff;
        margin-bottom: 10px;
        display: block;
    }
    .year-list{
        margin: 0px;
        padding: 0px;
        list-style: none;
        
    }
   
    .year-list i{
        color: #0bb2b1;
        margin-right: 4px;
        font-size: 16px;
    }
    /* .goc-plan2-card */

    @media (max-width: 575px) {
        .goc-plan-card{
            padding: 15px 15px;
        }
        .goc-plan-card-body{
            flex-direction: column;
        }
        .goc-plan-left{
            margin-bottom: 15px;
        }
        .goc-plan-right .explore-btn{
            font-size: 14px;
            line-height: 16px;
            padding: 10px 17px;
        }
        .goc-plan-text h3{
            font-size: 18px;
            line-height: 22px;
            text-align: left;
        }
        .goc-plan-text p{
            font-size: 14px;
            line-height: 20px;
        }
        .goc-plan-img img{
            width: 54px;
    height: 90px;
        }
        .goc-plan-right{
            text-align: center;
        }
        .pricing-text{
            padding-left: 75px;
            text-align: left;
        }
    }

    .goc-tv-modal p{
    font-size: 22px;
    font-weight: 400;
    margin: 10px 0;
    color: #fff;
    line-height: 28px;
        font-family: "Quicksand";
        text-align: center;
    }
      .goc-tv-modal p span{
         color: #FFD400;
         display: inline-block;
         font-weight: 500;
      }
    .goc-tv-modal h3{
    color: #FFD400;
    margin-bottom: 23px;
    }
     .goc-tv-modal .modal-content{
            overflow: hidden;
     }
    .goc-tv-modal .modal-dialog {
    max-width: 850px;
    }
    .btn-modal{
            background: transparent linear-gradient(90deg, #af7d1b 0%, #f6dc51 100%) 0% 0% no-repeat padding-box !important;
    box-shadow: 0px 0px 10px #000000e3;
    border-radius: 30px;
    color: #000000;
    text-shadow: 1px 1px 0px #ffd47e;
    text-transform: uppercase;
    font-size: 19px;
    padding: 8px 22px;
    font-weight: 700;
    display: inline-block;
    box-shadow: none !important;
    }
    .tv-header__icon{
   position: absolute;
    top: -58px;
    left: -55px;
    background: transparent linear-gradient(90deg, #af7d1b 0%, #f6dc51 100%) 0% 0% no-repeat padding-box !important;
    min-width: 182px;
    border-radius: 3px;
    transform: rotate(-34deg);
    padding: 24px 18px 10px;
    }
    .tv-header__icon path{
        fill: #fff;
    }
    .tv-header__icon circle{
        fill: #fff;
    }
@media only screen and (max-width: 767px){
    .update-plan-ttl{
        font-size: 28px;
        margin: 10px 0 30px;
    }
    .lbl-plan b{
        font-size: 18px;
    }
    .ttl-current-plan{
        font-size: 14px;
    }
    .icn-current-plan{
        margin-bottom: 6px;
    }
    .validity-price-box .price-year-plan-box .final-price, .price-year-plan-box .final-price{
            font-size: 26px;
    }
    .tab_outer .btn_tab svg {
    width: 24px;
}
    }


    /*NEW HOME PAGE STYLE END HERE */