@import 'https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&family=Roboto:wght@100;300;400;500;700;900&display=swap';
    @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
    @import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&display=swap');

    :root {
        /* --body-font: "Archivo", sans-serif; */
        /* --body-font: "Montserrat", sans-serif; */
        --body-font: 'Roboto', sans-serif;
        --heading-font: "Poppins", sans-serif;
        /* --heading-font: "Montserrat", sans-serif;; */
        --theme-color:#8bc34a;
        --theme-color2: #ebeaec;
        --theme-: #F8F9FE;
        --color-dark: #01054C;
        --color-gray: #F6F6F6;
        --body-text-color: #000;
        --color-white: #ffffff;
        --hero-overlay: rgb(101, 96, 128);
        --slider-arrow-bg: rgba(140, 82, 255, .2);
        --box-shadow: 0 0 40px 5px rgb(0 0 0 / 5%);
        --box-shadow2: 0 0 15px rgba(0, 0, 0, 0.17);
        --transition: all .5s ease-in-out;
        --transition2: all .3s ease-in-out;
        --border-info-color: rgba(0, 0, 0, 0.08);
        --border-info-color2: rgba(0, 0, 0, 0.05);
        --border-white-color: rgba(255, 255, 255, 0.08);
        --border-white-color2: rgba(255, 255, 255, 0.452);
        --footer-bg: #5e667a;
        --footer-bg2: #475fa8;
        --footer-text-color: #F5FAFF;
      
    }    

    *,
    *:before,
    *:after {
        box-sizing: inherit
    }

    * {
        scroll-behavior: inherit !important
    }

    html,
    body {
        height: auto;
        width: 100%;
        margin: 0;
        padding: 0;
        overflow-x: hidden;
        box-sizing: border-box
    }

    body {
        font-family: var(--body-font);
        font-style: normal;
        font-size: 16px;
        font-weight: 400;
        color: var(--body-text-color);
        line-height: 1.8
    }

    a {
        color: var(--color-dark);
        display: inline-block
    }

    a,
    a:active,
    a:focus,
    a:hover {
        outline: none;
        -webkit-transition: all .3s ease-out 0s;
        -moz-transition: all .3s ease-out 0s;
        -o-transition: all .3s ease-out 0s;
        -ms-transition: all .3s ease-out 0s;
        transition: all .3s ease-out 0s;
        text-decoration: none
    }

    a:hover {
        color: var(--color-blue)
    }

    ul {
        margin: 0;
        padding: 0
    }

    li {
        list-style: none
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: var(--color-dark);
        margin: 0;
        font-weight: 600;
        font-family: var(--heading-font);
        line-height: 1.2
    }

    h1 {
        font-size: 40px
    }

    h2 {
        font-size: 35px
    }

    h3 {
        font-size: 28px
    }

    h4 {
        font-size: 22px
    }

    h5 {
        font-size: 18px
    }

    h6 {
        font-size: 16px
    }

    p {
        margin: 0
    }

    .img,
    img {
        max-width: 100%;
        -webkit-transition: all .3s ease-out 0s;
        -moz-transition: all .3s ease-out 0s;
        -ms-transition: all .3s ease-out 0s;
        -o-transition: all .3s ease-out 0s;
        transition: all .3s ease-out 0s;
        height: auto
    }

    label {
        color: #999;
        cursor: pointer;
        font-weight: 400
    }

    *::-moz-selection {
        background: #d6b161;
        color: var(--color-white);
        text-shadow: none
    }

    ::-moz-selection {
        background: #555;
        color: var(--color-white);
        text-shadow: none
    }

    ::selection {
        background: #555;
        color: var(--color-white);
        text-shadow: none
    }

    *::-moz-placeholder {
        color: #999;
        font-size: 16px;
        opacity: 1
    }

    *::placeholder {
        color: #999;
        font-size: 16px;
        opacity: 1
    }

    .preloader {
        position: fixed;
        width: 100%;
        height: 100%;
        background: var(--color-white);
        top: 0;
        left: 0;
        z-index: 9999;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .loader-ripple {
        display: inline-block;
        position: relative;
        width: 80px;
        height: 80px
    }

    .loader-ripple div {
        position: absolute;
        border: 4px solid var(--theme-color);
        opacity: 1;
        border-radius: 50%;
        animation: loader-ripple 1s cubic-bezier(0, .2, .8, 1) infinite
    }

    .loader-ripple div:nth-child(2) {
        animation-delay: -.5s
    }

    @keyframes loader-ripple {
        0% {
            top: 36px;
            left: 36px;
            width: 0;
            height: 0;
            opacity: 1
        }

        100% {
            top: 0;
            left: 0;
            width: 72px;
            height: 72px;
            opacity: 0
        }
    }

    .ovrflow-hidden {
        overflow: hidden
    }

    .position-relative {
        position: relative;
        z-index: 1
    }

    .text-right {
        text-align: right
    }

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

    .c-pd {
        padding: 0 7rem
    }

    .s-pd {
        padding: 0 12rem
    }

    .h-100 {
        height: 100%
    }

    .h-100vh {
        height: 100vh
    }

    .bg {
        background: var(--theme-bg-light)
    }

    .pt-0 {
        padding-top: 0
    }

    .pt-10 {
        padding-top: 10px
    }

    .pt-20 {
        padding-top: 20px
    }

    .pt-30 {
        padding-top: 30px
    }

    .pt-40 {
        padding-top: 40px
    }

    .pt-50 {
        padding-top: 50px
    }

    .pt-60 {
        padding-top: 60px
    }

    .pt-70 {
        padding-top: 70px
    }

    .pt-80 {
        padding-top: 80px
    }

    .pt-90 {
        padding-top: 90px
    }

    .pt-100 {
        padding-top: 100px
    }

    .pt-110 {
        padding-top: 110px
    }

    .pt-120 {
        padding-top: 120px
    }

    .pb-0 {
        padding-bottom: 0
    }

    .pb-10 {
        padding-bottom: 10px
    }

    .pb-20 {
        padding-bottom: 20px
    }

    .pb-30 {
        padding-bottom: 30px
    }

    .pb-40 {
        padding-bottom: 40px
    }

    .pb-50 {
        padding-bottom: 50px
    }

    .pb-60 {
        padding-bottom: 60px
    }

    .pb-70 {
        padding-bottom: 70px
    }

    .pb-80 {
        padding-bottom: 80px
    }

    .pb-90 {
        padding-bottom: 90px
    }

    .pb-100 {
        padding-bottom: 100px
    }

    .pb-110 {
        padding-bottom: 110px
    }

    .pb-120 {
        padding-bottom: 120px
    }

    .py-80 {
        /* padding: calc(30px + 4vw) 0; */
        padding: clamp(20px, calc(20px + 4vw), 63px) 0;
    }

    .py-90 {
        padding: 90px 0
    }

    .py-100 {
        padding: 100px 0
    }

    .py-110 {
        padding: 110px 0
    }

    .py-120 {
        padding: 120px 0
    }

    .mt-0 {
        margin-top: 0
    }

    .mt-10 {
        margin-top: 10px
    }

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

    .mt-30 {
        margin-top: 30px
    }

    .mt-40 {
        margin-top: 40px
    }

    .mt-50 {
        margin-top: 50px
    }

    .mt-60 {
        margin-top: 60px
    }

    .mt-70 {
        margin-top: 70px
    }

    .mt-80 {
        margin-top: 80px
    }

    .mt-90 {
        margin-top: 90px
    }

    .mt-100 {
        margin-top: 100px
    }

    .mt-110 {
        margin-top: 110px
    }

    .mt-120 {
        margin-top: 120px
    }

    .mb-0 {
        margin-bottom: 0
    }

    .mb-10 {
        margin-bottom: 10px
    }

    .mb-20 {
        margin-bottom: 20px
    }

    .mb-30 {
        margin-bottom: 30px
    }

    .mb-40 {
        margin-bottom: 40px
    }

    .mb-50 {
        margin-bottom: 50px
    }

    .mb-60 {
        margin-bottom: 60px
    }

    .mb-70 {
        margin-bottom: 70px
    }

    .mb-80 {
        margin-bottom: 80px
    }

    .mb-90 {
        margin-bottom: 90px
    }

    .mb-100 {
        margin-bottom: 100px
    }

    .mb-110 {
        margin-bottom: 110px
    }

    .mb-120 {
        margin-bottom: 120px
    }

    .my-80 {
        margin: 80px 0
    }

    .my-90 {
        margin: 90px 0
    }

    .my-100 {
        margin: 100px 0
    }

    .my-110 {
        margin: 110px 0
    }

    .my-120 {
        margin: 120px 0
    }


    /*====================================================Bootstrap==================================*/

    .site-heading {
        margin-bottom: 50px;
        position: relative;
        z-index: 1
    }

    .site-title-tagline {
        display: block;
        font-family: var(--heading-font2);
        /* text-transform: uppercase; */
        /* letter-spacing: 4px; */
        letter-spacing: 1px;
        /* font-size: 38px; */
        font-size: calc(18px + 1.5vw);
        font-weight: 700;
        color: var(--theme-color);
        margin-bottom: 8px;
        position: relative;
        line-height: calc(18px + 1.5vw);
    }

    /* @media(max-width:500px) {
        .site-title-tagline {
            font-size: medium;
        }
    } */

    .site-title-tagline i {
        line-height: 0;
        font-size: 21px
    }

    .site-title {
        font-weight: 700;
        text-transform: capitalize;
        font-size: 20px;
        color: var(--color-dark);
        margin-bottom: 0
    }

    @media(max-width:500px) {
        .site-title {
            font-size: medium;
        }
    }

    .site-title span {
        color: var(--theme-color);
        font-weight: 500
    }

    .site-heading p {
        margin-top: 15px
    }


    /*
.site-shadow-text {
    position: absolute;
    left: 0;
    top: 0;
    line-height: 0;
    font-size: 100px;
    font-family: var(--heading-font2);
    font-weight: 700;
    color: var(--color-gray);
    text-transform: uppercase;
    z-index: -1;

}
@media(max-width:800px){
    .site-shadow-text {
        display: none;
    
    }
}*/

    .heading-divider:after {
        content: '';
        position: absolute;
        left: 0;
        top: -1px;
        height: 6px;
        width: 15px;
        border-radius: 0;
        background-color: var(--color-white);
        -webkit-animation: heading-move 5s infinite linear;
        animation: heading-move 5s infinite linear
    }

    @-webkit-keyframes heading-move {
        0% {
            transform: translateX(-1px)
        }

        50% {
            transform: translateX(75px)
        }

        100% {
            transform: translateX(-1px)
        }
    }

    @keyframes heading-move {
        0% {
            transform: translateX(-1px)
        }

        50% {
            transform: translateX(75px)
        }

        100% {
            transform: translateX(-1px)
        }
    }

    @media all and (max-width:991px) {
        .site-shadow-text {
            line-height: 1;
            top: -70px !important
        }
    }

    @media all and (max-width:767px) {
        .site-shadow-text {
            font-size: 65px !important;
            top: -40px !important
        }
    }

    .theme-btn {
        font-size: 20px;
        color: var(--color-white);
        padding: 10px 24px;
        transition: all .5s;
        text-transform: capitalize;
        position: relative;
        border-radius: 50px;
        font-weight: 500;
        cursor: pointer;
        text-align: center;
        vertical-align: middle;
        overflow: hidden;
        border: none;
        /* background: linear-gradient(to right, rgb(182, 244, 146), rgb(51, 139, 147)); */
        background: #8bc34a;
        box-shadow: var(--box-shadow);
        z-index: 1
    }

    @media(max-width:500px) {
        .theme-btn {
            font-size: 14px;
        }
    }

    .theme-btn::before {
        content: "";
        height: 300px;
        width: 100%;
        background-color: rgba(208, 255, 0, 0.473);
        border-radius: 50%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%) scale(0);
        transition: .5s cubic-bezier(.25, .46, .45, .94);
        z-index: -1
    }

    .theme-btn:hover {
        color: var(--color-white)
    }

    .theme-btn:hover::before {
        transform: translateY(-50%) translateX(-50%) scale(1)
    }

    .theme-btn i {
        margin-left: 10px;
        transform: rotate(-35deg);
        transition: var(--transition2)
    }

    .theme-btn:hover i {
        transform: rotate(0)
    }

    .theme-btn span {
        margin-right: 5px
    }

    .theme-btn2 {
        background: var(--color-white);
        color: var(--theme-color)
    }

    .theme-btn2::before {
        background: var(--theme-color)
    }

    .theme-btn2:hover {
        color: var(--color-white)
    }

    @media(min-width:1200px) {

        .container,
        .container-sm,
        .container-md,
        .container-lg,
        .container-xl {
            max-width: 1200px
        }
    }

    #scroll-top {
        position: fixed;
        bottom: -20px;
        right: 30px;
        z-index: 99;
        font-size: 20px;
        border: none;
        outline: none;
        border-radius: 50px;
        color: var(--color-white);
        background-color: var(--theme-color);
        cursor: pointer;
        width: 50px;
        height: 50px;
        line-height: 50px;
        text-align: center;
        box-shadow: var(--box-shadow2);
        transition: var(--transition);
        opacity: 0;
        visibility: hidden;
        z-index: 1
    }

    #scroll-top i {
        transform: rotate(-35deg);
        transition: var(--transition2)
    }

    #scroll-top:hover i {
        transform: rotate(0)
    }

    #scroll-top.active {
        opacity: 1;
        visibility: visible;
        bottom: 77px;
        /* bottom: 20px; */
    }

    @media all and (min-width:768px) and (max-width:1199px) {
        #scroll-top.active {
            bottom: 84px
        }
    }


    /*=======================================theam=================================*/

    .header {
        background-color: var(--green-color);
    }

    .header-top {
        position: relative;
        padding: 14px 0;
        z-index: 5;
        background-color: var(--theme-color);
    }

    .header-top-contact ul {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        gap: 15px
    }

    .header-top-contact a {
        color: #fff;
        font-weight: 500;
    }

    .header-top-contact a i {
        /* color: rgb(95, 179, 99); */
        color: #fff;
    }

    .header-top-middle {
        text-align: center
    }

    .header-top-right {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 15px
    }

    .header-top-link a {
        color: var(--color-white);
        margin-right: 12px
    }

    .header-top-link a:hover {
        color: var(--theme-color)
    }

    .header-top-social span {
        color: #fff;
    }

    .header-top-social a {
        color: #fff;
        font-size: 16px;
        text-align: center;
        margin-left: 14px;
        transition: var(--transition)
    }

    .header-top-social a:hover {
        color: #000;
        transform: scale(1.4);
    }

    .header-top-lang .top-lang {
        color: rgb(95, 179, 99);
    }

    .header-top-lang .dropdown-menu {
        min-width: 60px;
        border-radius: 15px;
        padding: 10px;
        border: none;
        box-shadow: var(--box-shadow)
    }

    .header-top-lang .dropdown-item {
        color: var(--color-dark);
        border-radius: 10px
    }

    .header-top-lang .dropdown-item:hover {
        background: var(--theme-color);
        color: var(--color-white)
    }

    /* @media all and (max-width:1199px) {
    .header-top-contact li:first-child {
        display: none
    }
} */

    @media all and (max-width:991px) {
        .header-top {
            padding-top: 12px
        }

        .header-top-contact ul,
        .header-top-right {
            justify-content: center
        }
    }


    /*======================================one header=======================================*/

    .navbar {
        background: 0 0;
        padding-top: 0;
        padding-bottom: 0;
        z-index: 999;
        position: relative;
        background-color: var(--green-color);
        /* border-top: 1px solid black; */
    }

    /* .navbar::before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: calc(100% - 200px);
        height: 100%;
    } */

    .navbar.fixed-top {
        position: fixed;
        background: var(--color-white);
        box-shadow: var(--box-shadow2);
        animation: slide-down .7s
    }

    @keyframes slide-down {
        0% {
            transform: translateY(-100%)
        }

        100% {
            transform: translateY(0)
        }
    }

    .navbar .navbar-brand .logo-display {
        display: block
    }

    .navbar .navbar-brand .logo-scrolled {
        display: none
    }

    .navbar.fixed-top .navbar-brand .logo-display {
        display: none
    }

    .navbar.fixed-top .navbar-brand .logo-scrolled {
        display: block
    }

    .navbar .navbar-toggler:focus {
        outline: none;
        box-shadow: none
    }

    .navbar-toggler-mobile-icon {
        display: inline-block;
        width: inherit;
        height: inherit
    }

    .navbar-brand {
        margin-right: 0
    }

    .navbar-brand img {
        /* width: 222px; */
        max-height: 80px;
    }

    .navbar .dropdown-toggle::after {
        display: inline-block;
        margin-left: 5px;
        vertical-align: baseline;
        font-family: 'font awesome 6 pro';
        content: "\f107";
        font-weight: 600;
        border: none;
        font-size: 14px
    }

    @media all and (max-width:1199px) {
        /* .navbar::before {
            width: 93%
        } */

        .nav-right {
            margin-left: 25px !important
        }

        .navbar .nav-item .nav-link {
            margin-right: 15px;
        }

        .navbar .nav-right-btn {
            display: none
        }
    }

    @media all and (min-width:992px) {
        .navbar .nav-item .nav-link, .mobile-nav .nav-item .nav-link {
            margin-right: 25px;
            padding: 25px 0;
            font-size: 17px;
            font-weight: 500;
            color: var(--color-dark);
            text-transform: capitalize;
        }

        .navbar .nav-item:last-child .nav-link, .mobile-nav .nav-item:last-child .nav-link {
            margin-right: 0
        }

        .navbar .nav-item .dropdown-menu, .mobile-nav .nav-item .dropdown-menu {
            display: block;
            padding: 10px;
            margin-top: 0;
            left: -15px;
            border-radius: 15px;
            border: none;
            background: var(--color-white);
            width: 220px;
            box-shadow: var(--box-shadow);
            opacity: 0;
            visibility: hidden;
            transition: var(--transition2)
        }

        .navbar .nav-item .dropdown-menu .dropdown-item, .mobile-nav .nav-item .dropdown-menu .dropdown-item {
            font-size: 16px;
            padding: 6px 15px;
            font-weight: 500;
            color: var(--color-dark);
            position: relative;
            overflow: hidden;
            border-radius: 10px;
            text-transform: capitalize;
            transition: var(--transition2);
            z-index: 1
        }

        .navbar .nav-item .dropdown-menu .dropdown-item:hover, .mobile-nav .nav-item .dropdown-menu .dropdown-item:hover {
            background: var(--theme-color);
            color: var(--color-white);
            padding-left: 32px
        }

        .navbar .nav-item .dropdown-menu .dropdown-item::before, .mobile-nav .nav-item .dropdown-menu .dropdown-item::before {
            content: "//";
            position: absolute;
            left: 15px;
            top: 6px;
            color: var(--color-white);
            opacity: 0;
            visibility: hidden;
            transition: var(--transition);
            z-index: -1
        }

        .navbar .nav-item .dropdown-menu .dropdown-item:hover::before, .mobile-nav .nav-item .dropdown-menu .dropdown-item:hover::before {
            opacity: 1;
            visibility: visible
        }

        .navbar .nav-item .nav-link, .mobile-nav .nav-item .nav-link {
            position: relative
        }

        .navbar .nav-item .nav-link::before, .mobile-nav .nav-item .nav-link::before {
            content: "";
            position: absolute;
            left: 0;
            bottom: 20px;
            width: 0;
            height: 2px;
            border-radius: 50px;
            transition: var(--transition2)
        }

        .navbar .nav-item .nav-link.active::before,
        .navbar .nav-item:hover .nav-link::before, .mobile-nav .nav-item .nav-link.active::before, .mobile-nav .nav-item:hover .nav-link::before {
            background: var(--theme-gradient);
            width: 40%
        }

        .navbar.fixed-top .nav-item .nav-link.active::before,
        .navbar.fixed-top .nav-item:hover .nav-link::before  {
            background: var(--color-white)
        }

        .navbar .nav-item .nav-link.active,
        .navbar .nav-item:hover .nav-link, .mobile-nav .nav-item .nav-link.active, .mobile-nav .nav-item:hover .nav-link {
            color: var(--theme-color)
        }

        .navbar .nav-item:hover .dropdown-menu, .mobile-nav .nav-item:hover .dropdown-menu {
            transition: .3s;
            opacity: 1;
            visibility: visible;
            top: 100%;
            transform: rotateX(0deg);
        }

        .navbar .dropdown-menu-end, .mobile-nav .dropdown-menu-end {
            right: 0;
            left: auto
        }

        .navbar .dropdown-menu.fade-down, .mobile-nav .dropdown-menu.fade-down {
            top: 80%;
            transform: rotateX(-75deg);
            transform-origin: 0% 0%
        }

        .navbar .dropdown-menu.fade-up, .mobile-nav .dropdown-menu.fade-up {
            top: 140%
        }

        .navbar #main_nav, .mobile-nav  #main_nav {
            justify-content: end
        }

        .nav-right {
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 28px;
            margin-left: 45px
        }

        .nav-right-link {
            position: relative;
            font-size: 20px;
            color: var(--color-dark);
            transition: var(--transition)
        }

        .nav-right-link:hover {
            color: var(--theme-color) !important
        }

        .nav-right .search-btn .nav-right-link {
            border: none;
            background: 0 0;
            color: var(--color-dark);
            font-size: 28px;
            padding-right: 0
        }

        .nav-right .sidebar-btn .nav-right-link {
            background: var(--theme-color);
            width: 65px;
            height: 61px;
            color: var(--color-white) !important;
            font-size: 25px;
            border: none
        }

        .nav-right .sidebar-btn .nav-right-link:hover {
            background: var(--theme-color2)
        }

        .nav-right .search-btn .nav-right-link {
            font-size: 20px;
            padding: 0
        }
    }

    .mobile-menu-right {
        display: none
    }

    @media all and (max-width:991px) {
        .navbar {
            position: absolute;
            width: 100%;
            height: auto;
            background: var(--color-white)
        }

        .navbar::before {
            display: none
        }

        .navbar-brand img {
            /* width: 130px */
            max-height:67px;
        }

        .navbar-collapse {
            max-height: 220px;
            overflow: hidden;
            overflow-y: auto;
            padding: 0 20px;
            margin-bottom: 10px;
            background-color: var(--theme-bg-light);
            border-radius: 15px
        }

        .navbar-toggler {
            padding: 0;
            border: none
        }

        .navbar .dropdown-toggle::after, .mobile-nav .dropdown-toggle::after {
            float: right;
            margin-top: 2.5px
        }

        .navbar .nav-item .nav-link , .mobile-nav .nav-item .nav-link {
            color: var(--color-dark);
            font-weight: 700;
            margin-right: 0;
            transition: var(--transition)
        }

        .navbar .nav-item .nav-link:hover, .mobile-nav .nav-item .nav-link:hover {
            color: var(--theme-color) !important
        }

        .mobile-menu-right {
            margin: 0 12px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 20px
        }

        .mobile-menu-right .nav-right-link {
            background: 0 0;
            border: none;
            font-size: 20px;
            color: var(--color-dark)
        }

        .mobile-menu-right .nav-right-link:hover {
            color: var(--theme-color)
        }

        .navbar-toggler-mobile-icon,  .mobile-nav .navbar-toggler-mobile-icon {
            font-size: 25px;
            color: var(--color-dark);
            font-weight: 500
        }

        .navbar .dropdown-menu, .mobile-nav .dropdown-menu {
            border-radius: 15px;
            border: none;
            padding-top: 0;
        }

        .nav-right {
            display: none
        }
    }
    @media(max-width:420px){
        .navbar-brand img {
            /* width: 130px */
            max-height:58px;
        }
    }

    .navbar .nav-item .dropdown-submenu, .mobile-nav .nav-item .dropdown-submenu {
        position: relative
    }

    .navbar .nav-item .dropdown-submenu .dropdown-menu::before, .mobile-nav .nav-item .dropdown-submenu .dropdown-menu::before {
        display: none
    }

    .navbar .nav-item .dropdown-submenu a::after, .mobile-nav .nav-item .dropdown-submenu a::after {
        transform: rotate(-90deg);
        position: absolute;
        right: 15px;
        top: 8px;
        font-weight: 600
    }

    .navbar .nav-item .dropdown-submenu a:hover, .mobile-nav .nav-item .dropdown-submenu a:hover {
        background: 0 0;
        color: var(--color-white)
    }

    .navbar .nav-item .dropdown-submenu .dropdown-menu, .mobile-nav .nav-item .dropdown-submenu .dropdown-menu {
        top: 120%;
        left: 100%;
        opacity: 0;
        visibility: hidden
    }

    .navbar .nav-item .dropdown-submenu:hover .dropdown-menu,  .mobile-nav .nav-item .dropdown-submenu:hover .dropdown-menu {
        top: 0;
        opacity: 1;
        visibility: visible
    }

    @media all and (max-width:991px) {
        .navbar .nav-item .dropdown-menu .dropdown-item, .mobile-nav .nav-item .dropdown-menu .dropdown-item {
            color: var(--color-dark)
        }

        .navbar .nav-item .dropdown-submenu .dropdown-menu, .mobile-nav .nav-item .dropdown-submenu .dropdown-menu {
            margin: 0 17px
        }

        .navbar .nav-item .dropdown-submenu .dropdown-menu, .mobile-nav .nav-item .dropdown-submenu .dropdown-menu {
            opacity: unset;
            visibility: unset
        }

        .navbar .nav-item .dropdown-submenu a::after, .mobile-nav .nav-item .dropdown-submenu a::after {
            top: 3px
        }

        .navbar .nav-item .dropdown-submenu a:hover,.mobile-nav  .nav-item .dropdown-submenu a:hover {
            color: var(--theme-color)
        }
    }


    /*===========================================navbar===========================*/

    .search-popup {
        position: fixed;
        left: 0;
        top: 0;
        height: 100vh;
        width: 100%;
        z-index: 99999;
        margin-top: -540px;
        transform: translateY(-100%);
        background-color: rgba(0, 0, 0, .8);
        transition: all 1500ms cubic-bezier(.86, 0, .07, 1);
        transition-timing-function: cubic-bezier(.86, 0, .07, 1)
    }

    .sidenav-bar-visible .search-popup {
        width: 80%
    }

    .search-active .search-popup {
        transform: translateY(0%);
        margin-top: 0
    }

    .search-popup .close-search {
        position: absolute;
        left: 0;
        right: 0;
        top: 75%;
        border: none;
        margin: 0 auto;
        margin-top: -200px;
        border-radius: 50px;
        text-align: center;
        background: var(--theme-color);
        text-align: center;
        width: 50px;
        height: 50px;
        color: var(--color-white);
        font-size: 20px;
        cursor: pointer;
        box-shadow: var(--box-shadow);
        transition: all 500ms ease;
        opacity: 0;
        visibility: hidden
    }

    .search-active .search-popup .close-search {
        visibility: visible;
        opacity: 1;
        top: 50%;
        transition-delay: 1500ms
    }

    .search-popup form {
        position: absolute;
        max-width: 700px;
        top: 50%;
        left: 15px;
        right: 15px;
        margin: -35px auto 0;
        transform: scaleX(0);
        transform-origin: center;
        transition: all 300ms ease
    }

    .search-active .search-popup form {
        transform: scaleX(1);
        transition-delay: 1200ms
    }

    .search-popup .form-group {
        position: relative;
        margin: 0;
        overflow: hidden
    }

    .search-popup .form-group input[type=text],
    .search-popup .form-group input[type=search] {
        position: relative;
        width: 100%;
        height: 60px;
        outline: none;
        border-radius: 50px;
        border: none;
        padding: 0 70px 0 35px;
        transition: all 500ms ease;
        text-transform: capitalize
    }

    .search-popup .form-group input[type=submit],
    .search-popup .form-group button {
        position: absolute;
        right: 5px;
        top: 5px;
        border-radius: 50px;
        background: var(--theme-color);
        text-align: center;
        font-size: 20px;
        color: var(--color-white) !important;
        height: 50px;
        width: 50px;
        border: none;
        cursor: pointer;
        transition: all 500ms ease
    }

    .search-popup .form-group input[type=submit]:hover,
    .search-popup .form-group button:hover {
        background: var(--theme-color)
    }

    .search-popup input::placeholder,
    .search-popup textarea::placeholder {
        color: var(--color-dark)
    }


    /*===========================================search=====================================*/


    /*
.sidebar-popup {
    position: fixed;
    top: 0;
    left: 0;
    content: "";
    background-color: rgba(0, 0, 0, .8);
    width: 100%;
    height: 100%;
    z-index: 999;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: var(--transition);
    transition: var(--transition)
}

.sidebar-popup.open {
    visibility: visible;
    opacity: 1
}

.sidebar-wrapper {
    position: fixed;
    top: 0;
    right: -100%;
    width: 400px;
    background: var(--color-white);
    visibility: hidden;
    opacity: 0;
    padding: 40px;
    -webkit-transition: var(--transition);
    transition: var(--transition);
    z-index: 9999
}

.sidebar-wrapper.open {
    right: 0;
    visibility: visible;
    opacity: 1
}

.sidebar-content {
    position: relative;
    overflow-y: auto;
    height: calc(100vh - 75px)
}

.close-sidebar-popup {
    position: absolute;
    top: 1px;
    right: 1px;
    width: 38px;
    height: 38px;
    line-height: 36px;
    border-radius: 50px;
    text-align: center;
    border: none;
    font-size: 20px;
    background: var(--theme-color);
    color: var(--color-white);
    box-shadow: var(--box-shadow);
    transition: var(--transition)
}

.close-sidebar-popup:hover {
    background: var(--theme-color2)
}

.close-sidebar-popup i {
    transition: var(--transition2)
}

.close-sidebar-popup:hover i {
    transform: rotate(180deg)
}

.sidebar-logo img {
    width: 150px
}

.sidebar-about {
    margin-top: 40px
}

.sidebar-about h4 {
    margin-bottom: 10px
}

.sidebar-contact {
    margin-top: 20px
}

.sidebar-contact h4 {
    margin-bottom: 15px
}

.sidebar-contact li {
    margin: 10px 0
}

.sidebar-contact li i {
    margin-right: 5px;
    color: var(--theme-color)
}

.sidebar-contact li a:hover {
    color: var(--theme-color)
}

.sidebar-social {
    margin-top: 25px
}*/


    /*===========================================sidebar=====================================*/

    .hero-section {
        position: relative
    }

    .hero-scroll-box {
        position: absolute;
        left: 55px;
        bottom: 50px;
        z-index: 2
    }

    .hero-scroll {
        width: 30px;
        height: 60px;
        border: 3px solid var(--color-white);
        border-radius: 15px;
        position: relative
    }

    .hero-scroll .scroller {
        width: 16px;
        border-radius: 8px;
        background-color: var(--color-white);
        position: absolute;
        top: 4px;
        left: 4px;
        bottom: 34px;
        animation: scroller 1500ms ease-out infinite
    }

    @keyframes scroller {
        0% {
            bottom: 34px
        }

        5% {
            top: 4px
        }

        32% {
            bottom: 4px
        }

        66% {
            top: 34px;
            bottom: 4px
        }

        100% {
            top: 4px;
            bottom: 34px
        }
    }

    /* .hero-single {
        padding-top: 150px;
        padding-bottom: 160px;
        background-position: center !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        z-index: 1
    } */
    .hero-single {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        z-index: 1
    }

    .hero-single::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        left: -.5px;
        top: 0;
        background: var(--hero-overlay);
        opacity: .7;
        z-index: -1
    }

    .hero-single .hero-content {
        height: 100%
    }

    .hero-date {
        display: flex;
        align-items: center;
        gap: 15px
    }

    .hero-date h1 {
        color: var(--theme-color);
        font-size: calc(32px + 1.8vw);
        font-weight: 700
    }

    @media(max-width:500px) {
        .hero-date h1 {
            color: var(--theme-color);
            font-size: calc(20px 1.5vw);
            font-weight: 700
        }
    }

    .hero-date .date-content span {
        color: var(--color-white);
        text-transform: uppercase;
        font-size: 20px;
        font-weight: 500;
        letter-spacing: 1px
    }

    @media(max-width:500px) {
        .hero-date .date-content span {
            color: var(--color-white);
            text-transform: uppercase;
            font-size: 10px;
            font-weight: 500;
            letter-spacing: 1px
        }
    }

    .hero-date .date-content p {
        color: var(--color-white);
        text-transform: uppercase;
        letter-spacing: 1px
    }

    @media(max-width:500px) {
        .hero-date .date-content p {
            color: var(--color-white);
            text-transform: uppercase;
            letter-spacing: 1px;
            font-size: 10px;
        }
    }

    .hero-single .hero-content .hero-title {
        color: var(--color-white);
        font-size: 60px;
        font-weight: 700;
        margin: 20px 0;
        text-transform: uppercase
    }

    .hero-single .hero-content .hero-title span {
        color: var(--theme-color);
        font-weight: 500
    }

    .hero-single .hero-content .hero-sub-title {
        display: inline-block;
        color: var(--theme-color);
        font-size: 25px;
        letter-spacing: 6px;
        font-weight: 600;
        position: relative;
        text-transform: uppercase
    }

    .hero-single .hero-content p {
        color: var(--color-white);
        font-size: 20px;
        line-height: 30px;
        font-weight: 400;
        margin-bottom: 20px
    }

    .hero-single .hero-content .hero-btn {
        gap: 1rem;
        display: flex;
        margin-top: 35px;
        justify-content: start
    }

    .hero-slider.owl-theme .owl-nav {
        margin-top: 0
    }

    .hero-slider.owl-theme .owl-nav [class*=owl-] {
        color: var(--color-white);
        font-size: 25px;
        margin: 0;
        padding: 0;
        background: var(--slider-arrow-bg);
        display: inline-block;
        cursor: pointer;
        height: 55px;
        width: 55px;
        line-height: 55px;
        border-radius: 50px;
        text-align: center;
        transition: var(--transition)
    }

    .hero-slider.owl-theme .owl-nav [class*=owl-]:hover {
        background: var(--color-white);
        color: var(--theme-color)
    }

    .hero-slider.owl-theme .owl-nav .owl-prev {
        left: 40px
    }

    .hero-slider.owl-theme .owl-nav .owl-next {
        right: 40px
    }

    .hero-slider.owl-theme .owl-nav .owl-prev,
    .hero-slider.owl-theme .owl-nav .owl-next {
        position: absolute;
        top: 50%;
        transform: translate(0, -50%)
    }

    .hero-slider.owl-theme .owl-dots {
        position: absolute;
        text-align: center;
        bottom: 40px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center
    }

    .hero-slider.owl-theme .owl-dots .owl-dot span {
        background: var(--color-white);
        margin: 5px;
        border-radius: 10px;
        width: 15px;
        height: 15px;
        display: inline-block;
        transition: var(--transition)
    }

    .hero-slider.owl-theme .owl-dots .owl-dot.active span {
        background-color: var(--theme-color)
    }

    @media all and (max-width:1199px) {
        .hero-single .hero-content .hero-title {
            font-size: 20px
        }

        .hero-slider.owl-theme .owl-nav .owl-prev,
        .hero-slider.owl-theme .owl-nav .owl-next {
            top: unset;
            bottom: 70px !important
        }

        .hero-slider.owl-theme .owl-nav .owl-prev {
            left: unset;
            right: 120px
        }

        .hero-slider.owl-theme .owl-nav .owl-next {
            right: 40px
        }
    }

    @media all and (max-width:991px) {
        .hero-single .hero-content .hero-title {
            font-size: 15px
        }

        .hero-scroll-box {
            left: 20px;
            bottom: 80px
        }
    }

    @media all and (max-width:767px) {
        .hero-single .hero-content .hero-sub-title {
            font-size: 18px
        }

        .hero-single .hero-content .hero-btn {
            gap: 1rem
        }
    }

    

    .play-btn {
        display: inline-block;
        padding: 0;
        height: 75px;
        width: 75px;
        line-height: 75px;
        font-size: 20px;
        text-align: center;
        background: var(--theme-color);
        color: var(--color-white) !important;
        position: absolute;
        border-radius: 50%;
        z-index: 1
    }

    .play-btn i::after {
        content: "";
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        z-index: -1;
        background-color: var(--theme-color);
        border-radius: 50px;
        animation: ripple-wave 1s linear infinite;
        -webkit-transform: scale(1);
        transform: scale(1);
        transition: all .5s ease-in-out
    }

    @keyframes ripple-wave {
        0% {
            opacity: .8;
            -webkit-transform: scale(.9);
            transform: scale(.9)
        }

        100% {
            opacity: 0;
            -webkit-transform: scale(2);
            transform: scale(2)
        }
    }

    .sidebar-social h4 {
        margin-bottom: 20px
    }

    .sidebar-social a {
        width: 40px;
        height: 40px;
        line-height: 40px;
        text-align: center;
        border-radius: 50px;
        margin-right: 8px;
        background: var(--theme-color);
        color: var(--color-white);
        box-shadow: var(--box-shadow)
    }

    .sidebar-social a:hover {
        background: var(--theme-color2)
    }


    /*==================================slider===========================*/

    .event-countdown {
        position: relative
    }

    .event-countdown .time-wrap {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
        gap: 18px
    }

    .event-countdown .time {
        border-radius: 15px;
        padding: 14px 10px;
        text-align: center
    }

    .event-countdown .time span {
        display: block
    }

    .event-countdown .time span:first-child {
        color: var(--color-white);
        font-weight: 700;
        font-size: 38px;
        line-height: 1
    }

    .event-countdown .time .unit {
        color: var(--color-white);
        font-weight: 500
    }

    .event-countdown .divider {
        display: none
    }

    .event-countdown.ec-1 {
        background: linear-gradient(to right, rgb(182, 244, 146), rgb(51, 139, 147));
        width: fit-content;
        margin-left: auto;
        margin-top: -135px;
        position: relative;
        padding: 20px 70px 20px 20px;
        z-index: 1
    }

    @media all and (max-width:991px) {
        .event-countdown.ec-1 {
            background: linear-gradient(to right, rgb(182, 244, 146), rgb(51, 139, 147));
            width: 100%;
            margin-left: auto;
            margin-top: -135px;
            position: relative;
            padding: 20px 70px 20px 20px;
            z-index: 1
        }
    }

    .event-countdown.ec-1 .event-countdown-text {
        position: absolute;
        right: 0;
        top: 0;
        background: var(--color-white);
        width: 50px;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .event-countdown.ec-1 .event-countdown-text span {
        writing-mode: vertical-lr;
        color: var(--theme-color2);
        text-transform: uppercase;
        font-weight: 700;
        letter-spacing: 1px
    }

    .event-countdown.ec-2 {
        background: var(--theme-bg-light)
    }

    .event-countdown.ec-2 .time-wrap .time span:first-child {
        font-size: 75px;
        color: var(--theme-color2)
    }

    .event-countdown.ec-2 .time-wrap .time .unit {
        color: var(--theme-color);
        font-size: 25px
    }

    .event-countdown.ec-2 .time-wrap .divider {
        display: block;
        color: var(--color-dark);
        font-size: 70px
    }

    @media all and (max-width:991px) {
        .event-countdown.ec-1 {
            margin-top: 0
        }
    }

    @media all and (max-width:767px) {
        .event-countdown .time span:first-child {
            font-size: 22px
        }

        .event-countdown.ec-1 {
            padding-top: 30px;
            padding-bottom: 30px
        }

        .event-countdown .time-wrap {
            gap: 10px
        }
    }


    /*===============================================event count slider======================================*/

    .about-area {
        position: relative;
        display: block
    }

    .about-left {
        position: relative;
        display: block;
        margin-right: 50px
    }

    .about-img {
        position: relative
    }

    .about-img img {
        border-radius: 50%;
        border: 10px solid var(--color-white);
        box-shadow: var(--box-shadow)
    }

    .about-img .img-2 {
        position: absolute;
        right: -50px;
        bottom: -50px;
        width: 280px;
        box-shadow: none
    }

    .about-img .img-3 {
        position: absolute;
        right: -30px;
        top: -30px;
        width: 200px;
        box-shadow: none
    }

    .about-right {
        position: relative;
        display: block;
        padding-left: 30px
    }

    .about-experience {
        background: #7dc58c;
        box-shadow: var(--box-shadow);
        position: absolute;
        left: -30px;
        bottom: 80px;
        padding: 40px 20px;
        border-radius: 10px;
        text-align: center
    }

    .about-experience h5 {
        color: var(--color-white);
        font-size: 20px
    }

    .about-experience span {
        color: var(--color-white);
        font-size: 70px;
        font-weight: 900;
        line-height: 1;
        margin-bottom: 10px;
        display: inline-block
    }

    .about-list-wrap {
        position: relative;
        display: block;
        margin-top: 25px;
        margin-bottom: 35px
    }

    .about-list {
        position: relative;
        display: block
    }

    .about-list li {
        position: relative;
        display: flex;
        align-items: center;
        border-bottom: 1px solid var(--border-info-color);
        padding-bottom: 20px;
        margin-bottom: 20px
    }

    .about-list li:last-child {
        border-bottom: none
    }

    .about-list li .icon {
        position: relative;
        display: flex;
        align-items: center
    }

    .about-list li .icon i {
        font-size: 50px;
        color: var(--theme-color)
    }

    .about-list li .icon img {
        width: 50px
    }

    .about-list li .about-item h4 span {
        color: var(--theme-color);
        margin-right: 10px
    }

    .about-list li .about-item p {
        margin-top: 5px
    }

    @media(max-width:500px) {
        .about-item-res {
            font-size: 15px;
        }
    }

    @media all and (max-width:991px) {
        .about-right {
            margin-top: 90px
        }
    }

    @media all and (max-width:767px) {
        .about-right {
            padding-left: 0
        }

        .about-title {
            font-size: 30px
        }

        .about-left {
            margin-right: 0
        }

        .about-left-content {
            bottom: -70px
        }

        .about-img {
            width: 90%
        }

        .about-experience {
            left: -7px;
            padding: 20px 10px
        }

        .about-img .img-3 {
            width: 140px
        }

        .about-img .img-2 {
            width: 150px;
            right: -10px
        }
    }


    /*========================================about===================================*/

    .feature-area {
        position: relative
    }

    .feature-area.fa-negative {
        margin-top: -120px;
    }

    .feature-item {
        padding: 25px;
        text-align: center;
        position: relative;
        background: var(--color-white);
        border-radius: 15px;
        overflow: hidden;
        box-shadow: var(--box-shadow);
        transition: var(--transition);
        z-index: 1
    }

    /* .feature-item:hover {
        transform: translateY(-10px)
    } */

    .feature-item .count {
        font-size: 120px;
        font-weight: 800;
        -webkit-text-stroke: 2px var(--theme-color);
        -webkit-text-fill-color: transparent;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        opacity: .15;
        z-index: -1
    }

    .feature-icon {
        margin-bottom: 20px;
        transition: var(--transition);
        height:100px;
    }

    .feature-icon img {
        width: 80px
    }

    .feature-item:hover .feature-icon {
        transform: rotateY(360deg)
    }

    .feature-item h4 {
        font-size: 22px;
        font-weight: 600;
        margin-bottom: 8px
    }

    .schedule-area {
        position: relative
    }

    .schedule-nav {
        border-bottom: 1px solid var(--border-info-color);
        padding-bottom: 35px;
        margin-bottom: 35px
    }

    .schedule-nav .nav {
        background: var(--color-white);
        border-radius: 15px;
        width: fit-content;
        box-shadow: var(--box-shadow);
        margin: 0 auto;
        padding: 10px;
        gap: 10px
    }

    .schedule-nav .nav-link {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 5px 15px;
        color: var(--color-dark);
        border-radius: 10px
    }

    .schedule-nav .nav-link .icon {
        font-size: 30px;
        color: var(--theme-color)
    }

    .schedule-nav .nav-link .content span {
        display: block;
        text-align: left;
        line-height: 1
    }

    .schedule-nav .nav-link .content .day {
        font-size: 20px;
        font-weight: 700;
        margin-bottom: 5px
    }

    .schedule-nav .nav-link .content .date {
        font-weight: 500
    }

    .schedule-item {
        display: flex;
        align-items: center;
        gap: 20px;
        position: relative
    }

    .schedule-item::before {
        content: "";
        position: absolute;
        border-left: 3px dashed var(--theme-color2);
        left: 35px;
        top: 50%;
        height: 100%;
        z-index: -1
    }

    .schedule-item.last::before {
        display: none
    }

    .schedule-count {
        width: 70px;
        height: 70px;
        line-height: 68px;
        background: var(--theme-gradient);
        border-radius: 50%;
        text-align: center;
        font-size: 38px;
        font-weight: 700;
        color: #121212;
        box-shadow: var(--box-shadow)
    }

    .schedule-content-wrap {
        display: flex;
        align-items: center;
        gap: 20px;
        flex: 1;
        background: var(--color-white);
        padding: 15px;
        border-radius: 15px;
        box-shadow: var(--box-shadow)
    }

    .schedule-img {
        overflow: hidden;
        border-radius: 15px
    }

    .schedule-img img {
        width: 280px;
        border-radius: 15px
    }

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

    .schedule-content {
        flex: 1
    }

    .schedule-meta {
        margin-bottom: 15px
    }

    .schedule-meta ul {
        display: flex;
        gap: 20px
    }

    .schedule-meta ul li {
        color: var(--theme-color);
        font-weight: bold;
        font-size: 22px;
    }

    .schedule-meta ul li i {
        color: var(--theme-color)
    }

    .schedule-info h4 {
        margin-bottom: 10px
    }

    .schedule-info h4 a {
        color: var(--color-dark)
    }

    .schedule-info h4 a:hover {
        color: var(--theme-color)
    }

    .schedule-bottom {
        display: flex;
        justify-content: space-between;
        margin-top: 18px;
        padding-top: 18px;
        border-top: 1px solid var(--border-info-color)
    }

    .schedule-speaker {
        display: flex;
        gap: 20px
    }

    .schedule-speaker .speaker-item {
        display: flex;
        align-items: center;
        gap: 10px
    }

    .schedule-speaker .speaker-img {
        position: relative
    }

    .schedule-speaker .speaker-img img {
        width: 50px;
        border-radius: 50px
    }

    .schedule-speaker .speaker-img-icon {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 22px;
        height: 22px;
        line-height: 20px;
        font-size: 14px;
        color: var(--color-white);
        background: var(--theme-color);
        border: 2px solid var(--color-white);
        border-radius: 50px;
        text-align: center
    }

    .schedule-area2 .schedule-nav .nav {
        border-radius: 50px
    }

    .schedule-area2 .schedule-nav .nav-pills .nav-link {
        padding: 8px 30px
    }

    .schedule-area2 .schedule-nav .nav-pills .nav-link.active {
        border-radius: 50px
    }

    .schedule-area2 .schedule-item::before {
        display: none
    }

    .schedule-area2 .schedule-count {
        color: var(--color-dark);
        background: 0 0;
        width: unset;
        height: unset;
        line-height: unset;
        box-shadow: none;
        line-height: 1;
        font-weight: 800;
        color: var(--theme-color)
    }

    .schedule-area2 .schedule-count span {
        display: block;
        line-height: 1;
        font-weight: 500;
        font-size: 20px;
        text-transform: uppercase;
        margin-top: 5px;
        color: var(--color-dark)
    }

    .schedule-area2 .schedule-bottom {
        border-top: none;
        margin: 0;
        padding: 0
    }

    .schedule-area2 .schedule-img img {
        width: 180px
    }

    .schedule-area2 .schedule-content {
        border-right: 1px solid var(--border-info-color);
        padding-right: 20px
    }

    .schedule-area3 .schedule-nav .nav {
        background: 0 0;
        box-shadow: none;
        padding: 0;
        gap: 20px
    }

    .schedule-area3 .schedule-nav .nav-pills .nav-link {
        box-shadow: var(--box-shadow)
    }

    .schedule-area3 .schedule-nav .nav-pills .nav-link.active {
        background: var(--theme-gradient)
    }

    .schedule-area3 .schedule-item::before {
        display: none
    }

    .schedule-area3 .schedule-content-wrap {
        flex-direction: column;
        gap: 15px
    }

    .schedule-area3 .schedule-img img {
        width: 100%
    }

    .schedule-area3 .schedule-bottom {
        width: 100%;
        margin-top: 0
    }

    .schedule-item .time {
        color: var(--theme-color2);
        font-weight: 500
    }

    .schedule-area3 .schedule-info .location {
        color: var(--theme-color);
        font-weight: 500
    }

    .schedule-area3 .schedule-info h4 {
        margin-top: 10px
    }

    @media all and (max-width:991px) {
        .schedule-item::before {
            display: none
        }

        .schedule-count {
            display: none
        }

        .schedule-content-wrap {
            flex-direction: column;
            align-items: unset
        }

        .schedule-img img {
            width: 100%
        }

        .schedule-meta ul {
            flex-direction: column;
            gap: 10px
        }

        .schedule-speaker,
        .schedule-bottom {
            flex-direction: column
        }

        .schedule-bottom .theme-btn {
            margin-top: 20px
        }

        .schedule-area2 .schedule-img img {
            width: 100%
        }

        .schedule-area2 .schedule-content {
            border-right: none;
            padding-right: 0
        }
    }

    .schedule-single {
        position: relative
    }

    .schedule-detail-img img {
        border-radius: 15px
    }

    .schedule-sidebar .event-countdown {
        background: var(--theme-gradient);
        border-radius: 15px
    }

    .schedule-sidebar .event-countdown .time-wrap {
        gap: 0
    }

    .schedule-sidebar .schedule-list li {
        color: var(--color-dark);
        font-weight: 500;
        margin: 5px 0
    }

    .schedule-sidebar .schedule-list li i {
        color: var(--theme-color);
        width: 25px
    }

    .schedule-sidebar .social {
        margin-top: 30px
    }

    .schedule-sidebar .social a {
        width: 35px;
        height: 35px;
        line-height: 32px;
        border: 2px solid var(--theme-color2);
        color: var(--theme-color2);
        text-align: center;
        border-radius: 50px;
        margin-right: 5px
    }

    .schedule-sidebar .social a:hover {
        background: var(--theme-color2);
        color: var(--color-white)
    }

    .schedule-info-list li {
        display: flex;
        align-items: center;
        gap: 12px;
        margin: 10px 0
    }

    .schedule-info-list .icon {
        width: 35px;
        height: 35px;
        line-height: 35px;
        background: var(--theme-color);
        color: var(--color-white);
        text-align: center;
        border-radius: 50px;
        margin-right: 5px
    }

    .schedule-info-list .theme-btn {
        margin-top: 20px
    }

    .schedule-info-list .content span {
        color: var(--theme-color);
        font-weight: 500
    }

    .schedule-detail-info .video-content,
    .schedule-detail-info .video-content::before {
        border-radius: 15px
    }

    .schedule-detail-info .location-map iframe {
        border-radius: 15px;
        width: 100%;
        height: 250px
    }


    /*===================================Schedule===================================*/

    .pricing-item {
        position: relative;
        background: var(--color-white);
        padding: 10px 10px 30px;
        border-radius: 20px;
        overflow: hidden;
        transition: var(--transition);
        z-index: 1
    }

    .pricing-shape img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        z-index: -1
    }

    .pricing-item:hover {
        transform: translateY(-10px)
    }

    .pricing-header-wrap {
        margin-bottom: 30px
    }

    .pricing-header {
        text-align: center;
        margin-top: 15px
    }

    .pricing-header h5 {
        font-size: 25px;
        font-weight: 600;
        display: inline-block;
        color: var(--color-white);
        margin-bottom: 10px
    }

    .pricing-amount {
        text-align: center;
        margin-top: 105px;
        margin-bottom: 25px
    }

    .pricing-amount strong {
        font-size: 37px;
        font-weight: 900;
        color: var(--color-dark);
        line-height: 1
    }

    @media(max-width:750px) {
        .pricing-amount {
            text-align: center;
            margin-top: 30%;
            margin-bottom: 25px
        }
    }

    .pricing-feature {
        position: relative;
        padding: 35px 20px 30px;
        border-top: 2px dashed var(--theme-color)
    }

    .pricing-feature::before {
        content: "";
        position: absolute;
        left: -20px;
        top: -14px;
        width: 25px;
        height: 25px;
        border-radius: 50px;
        background: var(--theme-bg-light)
    }

    .pricing-feature::after {
        content: "";
        position: absolute;
        right: -20px;
        top: -14px;
        width: 25px;
        height: 25px;
        border-radius: 50px;
        background: var(--theme-bg-light)
    }

    .pricing-feature li {
        margin-bottom: 15px
    }

    .pricing-feature li:last-child {
        margin-bottom: 0
    }

    .pricing-feature li i {
        color: var(--theme-color);
        margin-right: 10px
    }

    .pricing-btn-wrap {
        text-align: center
    }

    .pricing-area2 .pricing-item {
        background: var(--color-white);
        box-shadow: var(--box-shadow)
    }

    .pricing-area2 .pricing-item::before {
        content: "";
        position: absolute;
        left: 0;
        top: -80px;
        width: 100%;
        height: 170px;
        background: var(--theme-gradient);
        border-radius: 20px 20px 20px 80px;
        transform: rotate(-20deg);
        z-index: -1
    }

    .pricing-area2 .pricing-item::after {
        content: "";
        position: absolute;
        right: -30px;
        top: 70px;
        width: 140px;
        height: 20px;
        background: var(--theme-gradient);
        border-radius: 20px;
        transform: rotate(-20deg)
    }

    @media all and (max-width:991px) {
        .pricing-amount strong {
            font-size: 50px
        }
    }


    /*==========================================================price=======================================*/

    .video-content {
        position: relative;
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover
    }
    
    .video-content::before {
        content: "";
        position: absolute;
        background: rgba(11, 9, 23, .61);
        width: 100%;
        height: 100%;
        left: 0;
        top: 0
    }
    
    .video-wrapper {
        position: relative;
        display: flex;
        justify-content: center;
        border-radius: 5px;
        height: 500px;
        z-index: 1
    }
    
    .video-wrapper img {
        border-radius: 12px
    }
    
    .video-area .play-btn {
        display: inline-block;
        padding: 0;
        height: 75px;
        width: 75px;
        text-align: center;
        position: absolute;
        border-radius: 50%;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }
    
    @media all and (max-width:991px) {
        .video-content {
            padding-top: 80px
        }
    
        .video-wrapper {
            height: 250px
        }
    }

    .counter-area {
        position: relative;
        /* background-image: url(../img/shape/green1.png); */
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
    }

    .counter-area::before {
        content: "";
        position: absolute;
        /* background: linear-gradient(315deg, transparent, #e6eddee8); */
        background:#f3f7eee8;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        z-index:-1;
    }

    .counter-info {
        padding-right: 20px
    }

    .counter-box {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 20px;
        position: relative;
        background: var(--color-white);
        padding: 30px 25px;
        border-radius: 15px;
        box-shadow: 0 0 40px 5px rgb(0 0 0/5%);
        z-index: 1
    }

    .counter-box .icon {
        width: 70px;
        height: 70px;
        aspect-ratio: 1;
        line-height: 60px;
        font-size: 35px;
        border-radius: 50px;
        text-align: center;
        color: var(--color-white);
        background: var(--theme-gradient);
        position: relative
    }

    .counter-box .icon::before {
        content: "";
        position: absolute;
        left: -7px;
        top: -7px;
        bottom: -7px;
        right: -7px;
        border: 2px dashed var(--theme-color);
        border-radius: 50%;
        transition: all .5s ease-in-out;
        z-index: -1
    }

    .counter-box .icon img {
        width: 48px;
        margin-top: 10%;
    }

    .counter-box .counter-info {
        display: flex;
        align-items: center;
        gap: 2px
    }

    .counter-box .counter-unit {
        color: var(--color-dark);
        font-weight: 600;
        font-size: 25px
    }

    .counter-box .counter {
        display: block;
        line-height: 1;
        color: var(--color-dark);
        font-size: 50px;
        font-weight: 900
    }

    .counter-box .title {
        color: var(--color-dark);
        margin-top: 5px;
        font-size: 18px;
        font-weight: 600;
        text-transform: capitalize
    }


    /*===========================================counter===================*/

    .team-area {
        position: relative;
        overflow: hidden
    }

    .team-item {
        position: relative;
        text-align: center;
        transition: var(--transition)
    }

    .team-item:hover {
        transform: translateY(-8px)
    }

    .team-img {
        padding: 6px;
        /* border: 3px solid var(--theme-color); */
        border-radius: 50%;
        max-width: 290px;
    margin-inline: auto;
    }
    .highlighted .team-img {
        border: 3px solid var(--theme-color);
    }

    .team-img img {
        border-radius: 50%;
        width: 100%
    }

    .team-content .social {
        position: relative;
        background: var(--theme-color);
        width: fit-content;
        padding: 0 8px;
        margin: -20px auto 0;
        border-radius: 50px;
        z-index: 1
    }

    .team-content .social a {
        width: 25px;
        color: var(--color-white)
    }

    .team-content .social a:hover {
        color: var(--color-dark)
    }

    .team-content .info {
        margin-top: 15px
    }

    .team-content .info h4 {
        font-size: 20px;
        color: var(--color-dark)
    }

    .team-content .info span {
        color: var(--theme-color);
        font-weight: 500
    }

    .team-area2 .team-item {
        border-radius: 15px;
        box-shadow: var(--box-shadow);
        padding-bottom: 12px
    }

    .team-area2 .team-img {
        border: none
    }

    .team-area2 .team-img img {
        border-radius: 15px
    }

    .team-area2 .team-content .social {
        background: var(--color-white)
    }

    .team-area2 .team-content .social a {
        color: var(--theme-color)
    }

    .team-area2 .team-content .social a:hover {
        color: var(--theme-color2)
    }

    .team-single {
        position: relative
    }

    .team-single-content {
        background: var(--color-white);
        box-shadow: var(--box-shadow);
        border-radius: 15px;
        padding: 20px
    }

    .team-single-img img {
        border-radius: 15px
    }

    .team-details .name {
        color: var(--color-dark);
        margin-bottom: 5px
    }

    .team-details .designation {
        color: var(--theme-color);
        text-transform: uppercase;
        font-weight: 500;
        letter-spacing: 3px
    }

    .team-details-info {
        margin-top: 10px;
        margin-bottom: 20px
    }

    .team-details-info ul {
        margin-top: 15px
    }

    .team-details-info ul li {
        margin: 10px 0;
        color: var(--color-dark)
    }

    .team-details-info ul li a span {
        width: 110px;
        display: inline-block;
        font-weight: 500;
        color: var(--color-dark)
    }

    .team-details-info ul li i {
        color: var(--theme-color);
        width: 25px
    }

    .team-details-social a {
        width: 30px;
        color: var(--theme-color2)
    }

    .team-details-social a:hover {
        color: var(--theme-color)
    }

    .team-session .session-item {
        background: var(--color-white);
        border-radius: 15px;
        padding: 20px;
        box-shadow: var(--box-shadow)
    }

    .team-session .session-item .day {
        color: var(--theme-color2);
        text-transform: uppercase;
        letter-spacing: 3px
    }

    .team-session .session-meta {
        display: flex;
        gap: 15px;
        margin-top: 15px;
        margin-bottom: 15px
    }

    .team-session .session-meta li {
        color: var(--body-text-color)
    }

    .team-session .session-meta li i {
        color: var(--theme-color);
        margin-right: 5px
    }

    .team-session .session-content p {
        margin-top: 15px;
        color: var(--body-text-color)
    }

    .team-session .session-content p span {
        color: var(--color-dark);
        font-weight: 500
    }

    .team-session .session-content p i {
        color: var(--theme-color);
        margin-right: 5px
    }

    .team-session .session-content .theme-btn {
        margin-top: 20px
    }


    /*--------------------------------------------team------------------------------*/

    .cta-area {
        position: relative;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        z-index: 1
    }
    
    .cta-area::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        background: #8bc34a;
        opacity: .5;
        z-index: -1
    }
    
    .cta-content {
        text-align: center
    }
    
    .cta-content h6 {
        font-size: 25px;
        color: var(--theme-color2);
        text-transform: uppercase;
        font-family: var(--heading-font2);
        letter-spacing: 3px
    }
    
    .cta-content h1 {
        font-family: var(--heading-font2);
        color: #2d305e;
        font-size: 50px;
        text-transform: capitalize;
        margin-bottom: 20px
    }
    
    @media(max-width:500px) {
        .cta-content h1 {
            font-size: medium;
        }
    }
    
    .cta-content p {
        color: var(--color-white);
        font-size: 18px;
        margin-bottom: 30px
    }
    
    @media(max-width:500px) {
        .cta-content p {
            font-size: 13px;
        }
    }


    /*--------------------------------------------cta------------------------------*/

    .choose-area {
        position: relative
    }

    .choose-content-wrap {
        margin-top: 30px
    }

    .choose-item {
        display: flex;
        gap: 15px;
        margin-top: 20px
    }

    .choose-item-icon {
        width: 45px;
        height: 45px;
        line-height: 41px;
        border-radius: 50px;
        text-align: center;
        box-shadow: var(--box-shadow);
        border:2px solid rgb(231,219,219);
    }

    .choose-item-icon img {
        width: 25px;
        /* filter: brightness(0) invert(1);
        margin-top: 15%; */
    }

    .choose-item-info h4 {
        margin-bottom: 5px
    }

    .choose-item-info {
        border-bottom: 1px solid var(--border-info-color);
        padding-bottom: 20px;
        flex: 1
    }

    .choose-item:last-child .choose-item-info {
        border-bottom: none
    }

    .choose-img {
        position: relative;
        text-align: end;
        margin-right: 30px
    }

    .choose-img img {
        border-radius: 20px
    }

    .choose-img::before {
        content: "";
        position: absolute;
        left: 15px;
        top: 40px;
        background: var(--theme-color);
        border-radius: 20px;
        width: 70%;
        height: 88%;
        transform: rotate(-8deg);
        z-index: -1
    }

    .choose-img .theme-btn {
        position: absolute;
        left: 0;
        bottom: 80px
    }

    @media all and (max-width:991px) {
        .choose-content {
            margin-top: 50px
        }

        .choose-img {
            text-align: left;
            padding-left: 40px
        }
    }


    /*--------------------------------------------chooses------------------------------*/

    .venue-area {
        position: relative
    }

    .venue-item {
        position: relative
    }

    .venue-img {
        width: 85%
    }

    .venue-img img {
        border-radius: 15px
    }

    .venue-content {
        position: absolute;
        right: 0;
        bottom: 30px;
        width: 230px;
        background: var(--color-white);
        border-radius: 15px;
        padding: 20px;
        box-shadow: var(--box-shadow);
        z-index: 1
    }

    .venue-content span {
        color: var(--theme-color);
        text-transform: uppercase;
        letter-spacing: 3px;
        font-weight: 500;
        font-size: 14px
    }

    .venue-content h6 {
        margin-top: 10px;
        margin-bottom: 5px
    }

    .venue-content p {
        color: var(--body-text-color)
    }

    .venue-play {
        margin-top: 15px
    }

    .venue-play .popup-youtube {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 15px
    }

    .venue-play .popup-youtube i {
        width: 35px;
        height: 35px;
        line-height: 35px;
        background: var(--theme-gradient);
        border-radius: 50px;
        color: var(--color-white);
        text-align: center
    }

    .venue-single {
        position: relative
    }

    .venue-list li {
        margin: 8px 0;
        display: flex;
        align-items: center
    }

    .venue-list li span {
        font-weight: 500;
        color: var(--color-dark)
    }

    .venue-list li span:first-child {
        width: 140px;
        display: inline-block
    }

    .venue-list li span:first-child span {
        font-weight: 400
    }

    .venue-capacity .venue-list li span:nth-child(2) {
        width: 50px
    }

    .venue-info .venue-list li span:first-child {
        width: 80px
    }

    .venue-info .venue-list li span:nth-child(2) {
        width: 20px
    }

    .venue-info .venue-list li span:last-child {
        flex: 1
    }

    .venue-detail-img img {
        border-radius: 15px
    }

    .venue-detail-info .video-content,
    .venue-detail-info .video-content::before {
        border-radius: 20px
    }

    .venue-single-list li {
        margin: 8px 0
    }

    .venue-single-list li i {
        color: var(--theme-color);
        margin-right: 10px
    }


    /*------------------------------------VENUE-------------------------------*/

    .testimonial-area {
        position: relative;
        overflow: hidden
    }
    
    .testimonial-area .site-shadow-text {
        color: var(--color-dark);
        font-size: 180px;
        right: unset;
        left: 50%;
        transform: translateX(-50%);
        opacity: .05;
    }
    
    .testimonial-single {
        margin-bottom: 20px;
    }
    
    .testimonial-quote {
        background:var(--color-white);
        padding: 30px 30px 40px;
        position: relative;
        border-radius: 10px;
    }
    
    
    
    .testimonial-quote p {
        color: black;
        font-size: 16px;
        font-style: italic;
        font-weight: 500;
    
    }
    
    .testimonial-content {
        display: flex;
        justify-content: start;
        align-items: center;
        margin-top: 30px;
        margin-left: 20px;
    }
    
    .testimonial-author-img {
        margin-right: 20px;
        width: 80px;
        padding: 5px;
        border-radius: 50px;
        border: 2px dashed var(--theme-color)
    }
    
    .testimonial-author-img img {
        border-radius: 50%
    }
    
    .testimonial-author-info h4 {
        font-size: 20px;
        color: var(--color-dark)
    }
    
    .testimonial-author-info p {
        color: var(--color-dark)
    }
    
    .testimonial-quote-icon {
        position: absolute;
        right: 20px;
        top: 0;
        opacity: .08
    }
    
    .testimonial-quote-icon i {
        font-size: 30px;
        color: var(--theme-color)
    }
    
    .testimonial-quote-icon img {
        width: 100px !important
    }
    
    .testimonial-rate {
        color:#ffc107;
        width: fit-content;
        margin-bottom: 10px;
        background: var(--color-white);
        padding: 0 10px;
        border-radius: 50px
    }
    
    .testimonial-area .owl-dots {
        text-align: center;
        margin-top: 30px
    }
    
    .testimonial-area .owl-dots .owl-dot span {
        background: var(--theme-color);
        margin: 5px;
        border-radius: 10px;
        width: 15px;
        height: 7px;
        display: inline-block;
        transition: var(--transition)
    }
    
    .testimonial-area .owl-dots .owl-dot.active span {
        background-color: var(--theme-color);
        width: 8px;
        height: 8px
    }
    .testimonial-navigation {
        position: absolute;
        top: 50%;
        width: 100%;
        display: flex;
        justify-content: space-between;
        z-index: 1000;
        transform: translateY(-50%);
    }
    
    .next-arrow {
        left:85% ;
        position: absolute;
        right: 10px; /* Adjust distance from the right */
    }
    
    
    .prev-arrow i, .next-arrow i {
         font-weight: 700; font-size: 25px; color: var(--theme-color);
    }/*----css---*/
    


    /*-------------------------------------testimonial-area------------------------------*/

    .quote-area {
        position: relative;
        background-image: url(../img/quote/registration.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center
    }

    .quote-content {
        background: var(--color-white);
        padding: 35px;
        border-radius: 20px;
        margin-top: -100px;
        box-shadow: var(--box-shadow)
    }

    .quote-img img {
        border-radius: 15px
    }

    .quote-head {
        margin-bottom: 20px
    }

    .quote-head h3 {
        margin-bottom: 8px
    }

    .quote-form .input-group {
        margin-bottom: 22px
    }

    .quote-form .input-group:focus-within {
        outline: 2px solid var(--theme-color);
        border-radius: 50px
    }

    /* select:focus-within {
        outline: 2px solid var(--theme-color);
        border-radius: 0px
    } */

    .quote-form .input-group .form-control {
        padding: 15px 25px 15px 0;
        border-radius: 50px;
        border: none;
        box-shadow: none;
        background-color: var(--theme-bg-light)
    }

    .quote-form .input-group .form-control,
    .quote-form .input-group .form-select,
    .quote-form .input-group .form-control::placeholder {
        color: var(--color-dark)
    }

    .quote-form .input-group .input-group-text {
        background: var(--theme-bg-light);
        color: var(--theme-color);
        border-radius: 50px;
        padding-left: 20px;
        border: none
    }

    .quote-form .input-group.textarea .input-group-text,
    .quote-form .input-group.textarea .form-control {
        border-radius: 30px
    }

    .quote-form .input-group.textarea .input-group-text {
        align-items: flex-start;
        padding-top: 20px
    }

    .quote-area2 {
        position: relative
    }

    .quote-area2 .quote-form {
        background: var(--color-white);
        padding: 30px;
        border-radius: 0 15px 15px 0;
        box-shadow: var(--box-shadow);
        margin-top: -50px;
        position: relative;
        z-index: 1
    }

    .quote-area2 .quote-form .input-group {
        margin-bottom: 0
    }


    /*---------------------------quote-area-------------------------------*/

    .instagram-area {
        position: relative
    }

    .instagram-img {
        overflow: hidden;
        border-radius: 15px
    }

    .instagram-img img {
        border-radius: 15px
    }

    .instagram-img:hover img {
        transform: scale(1.1) rotate(2deg)
    }

    .instagram-area .theme-btn {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%)
    }


    /*--------------------------------instagram-area -------------------------*/

    .blog-area {
        position: relative
    }

    .blog-item {
        padding: 20px;
        border: 2px solid rgba(140, 82, 255, .2);
        border-radius: 15px;
        transition: var(--transition);
        position: relative
    }

    .blog-item:hover {
        border-color: #8c52ff
    }

    .blog-date {
        display: block;
        position: absolute;
        right: 12px;
        top: 12px;
        color: var(--color-white);
        padding: 0 10px;
        box-shadow: var(--box-shadow);
        z-index: 1
    }

    .blog-date::before {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: var(--theme-color);
        border-radius: 8px;
        transform: skewX(-10deg);
        z-index: -1
    }

    .blog-item-img {
        border-radius: 15px;
        overflow: hidden
    }

    .blog-item-img img {
        border-radius: 12px
    }

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

    .blog-item-info {
        padding: 15px 0 0
    }

    .blog-item-meta ul {
        margin: 0;
        margin-bottom: 14px;
        padding: 0;
        padding-bottom: 14px;
        border-bottom: 1px solid var(--border-info-color)
    }

    .blog-item-meta ul li {
        display: inline-block;
        margin-right: 15px;
        font-weight: 500;
        position: relative;
        color: var(--color-dark)
    }

    .blog-item-meta ul li i {
        margin-right: 5px;
        color: var(--theme-color)
    }

    .blog-item-meta a {
        color: var(--color-dark)
    }

    .blog-item-meta a:hover {
        color: var(--theme-color)
    }

    .blog-title {
        font-size: 22px;
        margin-bottom: 15px;
        text-transform: capitalize
    }

    .blog-item-info h4 a {
        color: var(--color-dark)
    }

    .blog-item-info h4 a:hover {
        color: var(--theme-color)
    }

    .blog-item-info p {
        margin-bottom: 16px
    }

    .blog-item-info .theme-btn {
        margin-top: 10px
    }

    .blog-single {
        position: relative
    }

    .blog-single .blog-thumb-img {
        margin-bottom: 20px
    }

    .blog-single .blog-single-content img {
        border-radius: 15px
    }

    .blog-single .blog-meta {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 20px
    }

    .blog-single .blog-meta-left ul {
        display: flex;
        align-items: center;
        gap: 20px
    }

    .blog-single .blog-meta-left ul li {
        color: var(--color-dark);
        font-weight: 500
    }

    .blog-single .blog-meta i {
        margin-right: 5px;
        color: var(--theme-color)
    }

    .blog-single .blog-meta a {
        color: var(--color-dark);
        font-weight: 500
    }

    .blog-single .blog-meta a:hover {
        color: var(--theme-color)
    }

    .blog-single .blog-details-title {
        font-size: 34px;
        color: var(--color-dark)
    }

    .blog-single .blockqoute {
        background: var(--theme-bg-light);
        border-left: 5px solid var(--theme-color);
        padding: 30px;
        font-size: 17px;
        font-style: italic;
        margin: 20px 0;
        border-radius: 0;
        position: relative
    }

    .blog-single .blockqoute .blockqoute-icon {
        position: absolute;
        right: 20px;
        bottom: 5px;
        color: var(--theme-color);
        font-size: 70px
    }

    .blog-single .blockqoute-author {
        margin-top: 20px;
        padding-left: 60px;
        position: relative;
        color: var(--color-dark)
    }

    .blog-single .blockqoute-author::before {
        content: "";
        position: absolute;
        height: 2px;
        width: 40px;
        background: var(--theme-color);
        left: 0;
        top: 10px
    }

    .blog-single .blog-details-tags {
        display: flex;
        align-items: center;
        gap: 20px
    }

    .blog-single .blog-details-tags h5 {
        color: var(--color-dark)
    }

    .blog-single .blog-details-tags ul {
        display: flex;
        align-items: center;
        gap: 15px
    }

    .blog-single .blog-details-tags ul a {
        background: var(--theme-bg-light);
        color: var(--color-dark);
        padding: 5px 18px;
        border-radius: 50px;
        transition: var(--transition)
    }

    .blog-single .blog-details-tags ul a:hover {
        background: var(--theme-color);
        color: var(--color-white)
    }

    .blog-single .blog-author {
        display: flex;
        justify-content: start;
        align-items: center;
        background: var(--theme-bg-light);
        margin: 50px 0;
        padding: 20px;
        border-radius: 15px
    }

    .blog-single .blog-author-img {
        width: 320px
    }

    .blog-single .blog-author-img img {
        border-radius: 15px
    }

    .blog-single .author-name {
        font-size: 22px;
        color: var(--theme-color);
        margin: 8px 0
    }

    .blog-single .author-info {
        padding: 0 20px
    }

    .blog-single .author-social {
        margin-top: 10px
    }

    .blog-single .author-social a {
        width: 35px;
        height: 35px;
        line-height: 32px;
        text-align: center;
        border: 2px solid var(--theme-color);
        border-radius: 50px;
        margin-right: 5px;
        color: var(--theme-color);
        transition: var(--transition)
    }

    .blog-single .author-social a:hover {
        color: var(--color-white);
        background: var(--theme-color)
    }

    .blog-single .blog-comments h3 {
        color: var(--color-dark)
    }

    .blog-single .blog-comments-wrapper {
        margin: 30px 0
    }

    .blog-single .blog-comments-single {
        display: flex;
        justify-content: start;
        align-items: flex-start;
        margin-top: 50px
    }

    .blog-single .blog-comments-single img {
        border-radius: 50%
    }

    .blog-single .blog-comments-content {
        padding: 0 0 0 20px
    }

    .blog-single .blog-comments-content span {
        font-size: 14px;
        color: var(--theme-color);
        font-weight: 500
    }

    .blog-single .blog-comments-content a {
        font-weight: 500;
        margin-top: 5px;
        color: var(--theme-color)
    }

    .blog-single .blog-comments-content a:hover {
        color: var(--theme-color2)
    }

    .blog-single .blog-comments-content h5 {
        color: var(--color-dark)
    }

    .blog-single .blog-comments-reply {
        margin-left: 50px
    }

    .blog-single .blog-comments-form {
        padding: 30px;
        margin-top: 50px;
        border-radius: 15px;
        background: var(--theme-bg-light)
    }

    .blog-single .blog-comments-form h3 {
        margin-bottom: 20px
    }

    .blog-single .blog-comments-form .input-group {
        margin-bottom: 22px
    }

    .blog-single .blog-comments-form .input-group:focus-within {
        outline: 2px solid var(--theme-color);
        border-radius: 50px
    }

    .blog-single .blog-comments-form .input-group.textarea:focus-within {
        border-radius: 30px
    }

    .blog-single .blog-comments-form .input-group .form-control {
        padding: 15px 25px 15px 0;
        border-radius: 50px;
        border: none;
        box-shadow: none;
        background: var(--color-white)
    }

    .blog-single .blog-comments-form .input-group .nice-select {
        line-height: 25px
    }

    .blog-single .blog-comments-form .input-group .form-control,
    .blog-single .blog-comments-form .input-group .form-select,
    .blog-single .blog-comments-form .input-group .form-control::placeholder {
        color: var(--color-dark)
    }

    .blog-single .blog-comments-form .input-group .input-group-text {
        background: var(--color-white);
        color: var(--theme-color);
        border-radius: 50px;
        padding-left: 20px;
        border: none
    }

    .blog-single .blog-comments-form .input-group.textarea .input-group-text,
    .blog-single .blog-comments-form .input-group.textarea .form-control {
        border-radius: 30px
    }

    .blog-single .blog-comments-form .input-group.textarea .input-group-text {
        align-items: flex-start;
        padding-top: 20px
    }

    @media all and (max-width:767px) {
        .blog-single .blog-meta {
            flex-direction: column;
            font-size: 15px
        }

        .blog-single .blog-meta-left ul {
            gap: 10px
        }

        .blog-single .blog-details-tags {
            flex-direction: column;
            align-items: flex-start
        }

        .blog-single .blog-author {
            flex-direction: column;
            text-align: center;
            padding: 25px
        }

        .blog-single .author-info {
            margin-top: 25px
        }

        .blog-single .blog-comments-single {
            flex-direction: column;
            text-align: center;
            padding: 30px 0;
            background: var(--color-white);
            box-shadow: var(--box-shadow);
            margin-bottom: 30px;
            border-radius: 15px
        }

        .blog-single .blog-comments-single img {
            margin: 0 auto 20px
        }

        .blog-single .blog-comments-reply {
            margin-left: 0
        }
    }


    /*-----------------------------------BLOG--------------------------*/

    .widget {
        background: var(--theme-bg-light);
        padding: 30px;
        margin-bottom: 30px;
        border-radius: 15px
    }

    .widget .widget-title {
        padding-bottom: 10px;
        margin-bottom: 30px;
        position: relative;
        font-size: 25px;
        color: var(--color-dark)
    }

    .widget .widget-title::before {
        position: absolute;
        content: '';
        width: 15px;
        border-bottom: 3px solid var(--theme-color);
        bottom: 0;
        left: 0
    }

    .widget .widget-title::after {
        position: absolute;
        content: '';
        width: 30px;
        border-bottom: 3px solid var(--theme-color);
        bottom: 0;
        left: 22px
    }

    .widget .search-form .form-control {
        padding: 12px 15px 12px 20px;
        border-radius: 50px;
        box-shadow: none;
        color: var(--color-dark)
    }

    .widget .search-form .form-control::placeholder {
        color: var(--color-dark)
    }

    .widget .search-form {
        position: relative
    }

    .widget .search-form .form-control:focus {
        border-color: var(--theme-color)
    }

    .widget .search-form button {
        position: absolute;
        right: 0;
        top: 0;
        font-size: 18px;
        padding: 8px 18px 6px;
        background: 0 0;
        border: none;
        color: var(--theme-color)
    }

    .widget .category-list a {
        display: block;
        padding: 10px 0;
        font-weight: 500;
        color: var(--color-dark);
        border-bottom: 1px solid var(--border-info-color);
        transition: var(--transition)
    }

    .widget .category-list a:last-child {
        margin-bottom: 0;
        border-bottom: none
    }

    .widget .category-list a:hover {
        padding-left: 10px;
        color: var(--theme-color)
    }

    .widget .category-list a i {
        margin-right: 5px;
        color: var(--theme-color)
    }

    .widget .category-list a span {
        float: right
    }

    .widget .recent-post-single {
        display: flex;
        justify-content: start;
        align-items: center;
        gap: 15px;
        margin-bottom: 20px
    }

    .widget .recent-post-img img {
        width: 75px;
        border-radius: 15px
    }

    .widget .recent-post-bio {
        flex: 1
    }

    .widget .recent-post-bio h6 {
        font-size: 18px
    }

    .widget .recent-post-bio span {
        font-size: 14px;
        color: var(--theme-color);
        font-weight: 500
    }

    .widget .recent-post-bio span i {
        margin-right: 5px
    }

    .widget .recent-post-bio h6 a:hover {
        color: var(--theme-color)
    }

    .widget .social-share-link a {
        width: 35px;
        height: 35px;
        line-height: 32px;
        border: 2px solid var(--theme-color);
        color: var(--theme-color);
        text-align: center;
        margin-right: 5px;
        border-radius: 50px;
        transition: var(--transition)
    }

    .widget .social-share-link a:hover {
        background: var(--theme-color);
        color: var(--color-white)
    }

    .widget .tag-list a {
        background: var(--color-white);
        color: var(--color-dark);
        padding: 5px 18px;
        margin-bottom: 10px;
        margin-right: 10px;
        border-radius: 50px;
        display: inline-block;
        transition: var(--transition)
    }

    .widget .tag-list a:hover {
        background-color: var(--theme-color);
        color: var(--color-white)
    }


    /*---------------------------------------widget---------------------*/

    .contact-map {

        margin-bottom: -11px;
    }
    .contact-map iframe {
        width: 100%;
    }
    
    
    .contact-info li {
        position: relative;
        display: flex;
        justify-content: start;
        align-items: center;
        color: var(--footer-text-color);
        font-size: 16px;
        margin-bottom: 12px
    }
    
    
    .contact-info  li i {
    
        height: 32px;
        line-height: 32px;
        font-size: 16px;
        margin-left: 10px;
        border-radius: 50px;
        /*background: var(--theme-color);*/
        text-align: center;
        transition: var(--transition);
        color: var(--theme-color)
    }

    /*----------------------------------contact----------------------------*/


    .gallery__body {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
        gap: 10px;
        grid-auto-flow: dense;
        /* Allows items to fill gaps vertically */
    }

    .gallery__body-layer {
        position: relative;
        display: block;
        overflow: hidden;
        height: 250px;
        /* Set a fixed height for uniformity */
    }

    .gallery-btn {
        color: #242627;
        background: transparent;
        border-radius: 12px;
        padding: 12px 30px;
        font-size: 20px;
        margin: 48px 0 0 0;
        border: 1px solid rgba(51, 255, 0, 0.473);
        ;
    }






    .gallery-item {
        position: relative;
        width: 100%;
        text-align: center
    }

    .gallery-img {
        position: relative;
        height: 100%;
        border-radius: 15px;
        overflow: hidden
    }

    .gallery-img::before {
        content: "";
        position: absolute;
        inset: 0;
        background: var(--theme-color);
        transition: all .7s ease-in-out;
        transform: translateY(-110%)
    }

    .gallery-img:hover::before {
        transform: translateY(110%)
    }

    .gallery-img::after {
        content: "";
        position: absolute;
        inset: 0;
        background: var(--theme-color);
        opacity: .8;
        transition: all .7s ease-in-out;
        transform: translateY(-110%)
    }

    .gallery-img:hover::after {
        transform: none
    }

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

    .gallery-link {
        position: absolute;
        top: 50%;
        left: 50%;
        border-radius: 50%;
        font-size: 34px;
        color: var(--theme-color);
        width: 60px;
        height: 60px;
        line-height: 60px;
        background: var(--color-white);
        transition: all 200ms 0ms cubic-bezier(.6, -.28, .735, .045);
        transform: translate(-50%, -50%) scale(0);
        z-index: 1
    }

    .gallery-item:hover .gallery-link {
        transform: translate(-50%, -50%) scale(1);
        transition: all 300ms 100ms cubic-bezier(.175, .885, .32, 1.275);
        transition-delay: .7s
    }


    /*---------------------------------GALLERY------------------*/

    .faq-area .accordion-item {
        border: none;
        margin-bottom: 30px;
        background: var(--color-white);
        border-radius: 12px !important;
        box-shadow: var(--box-shadow)
    }

    .faq-area .accordion-item span {
        width: 45px;
        height: 45px;
        margin-right: 15px
    }

    .faq-area .accordion-item i {
        width: 45px;
        height: 45px;
        line-height: 45px;
        border-radius: 50px;
        background: var(--theme-color);
        text-align: center;
        color: var(--color-white)
    }

    .faq-area .accordion-button:not(.collapsed) {
        color: var(--theme-color);
        background: 0 0;
        box-shadow: inset 0 -1px 0 rgb(0 0 0/13%)
    }

    .faq-area .accordion-button {
        border-radius: 0 !important;
        background: 0 0;
        font-weight: 700;
        font-size: 20px;
        color: var(--color-dark);
        box-shadow: none !important
    }

    .faq-area .accordion-button:not(.collapsed) {
        border-bottom: 1px solid var(--theme-color)
    }

    .faq-area .accordion-button:not(.collapsed)::after {
        background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCAxNiAxNicgZmlsbD0nIzIxMjUyOSc+PHBhdGggZmlsbC1ydWxlPSdldmVub2RkJyBkPSdNMS42NDYgNC42NDZhLjUuNSAwIDAgMSAuNzA4IDBMOCAxMC4yOTNsNS42NDYtNS42NDdhLjUuNSAwIDAgMSAuNzA4LjcwOGwtNiA2YS41LjUgMCAwIDEtLjcwOCAwbC02LTZhLjUuNSAwIDAgMSAwLS43MDh6Jy8+PC9zdmc+)
    }

    .faq-area .accordion-body {
        color: var(--color-dark);
        font-weight: 500
    }

    @media all and (max-width:991px) {
        .faq-area .faq-right {
            margin-bottom: 50px
        }

        .faq-area .accordion-button {
            font-size: 16px
        }
    }


    /*---------------------------------faq-------------------*/

    .site-breadcrumb {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        text-align: center;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: cover !important;
        position: relative;
        /* padding-top: 150px;
        padding-bottom: 100px; */
        z-index: 1;
    }

    .site-breadcrumb::before {
        content: "";
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        background: linear-gradient(315deg, #221f1fe8 100%, transparent 50%);
        opacity: 0.6;
        z-index: -1;
    }

    .site-breadcrumb .breadcrumb-title {
        font-size: 40px;
        color: #7dc58c;
        color: var(--theme-color);
        font-weight: 700;
        margin-bottom: 10px;
        text-transform: capitalize;
        font-family: var(--heading-font2)
    }

    .site-breadcrumb .breadcrumb-menu {
        position: relative;
        z-index: 1
    }

    .site-breadcrumb .breadcrumb-menu li {
        position: relative;
        display: inline-block;
        margin-left: 25px;
        color: var(--color-white);
        font-weight: 500;
        text-transform: capitalize
    }

    .site-breadcrumb .breadcrumb-menu li a {
        color: var(--color-white);
        transition: all .5s ease-in-out
    }

    .site-breadcrumb .breadcrumb-menu li::before {
        position: absolute;
        content: '\f101';
        font-family: 'font awesome 6 pro';
        right: -21px;
        top: 1px;
        text-align: center;
        font-size: 16px;
        color: var(--color-white)
    }

    .site-breadcrumb .breadcrumb-menu li:first-child {
        margin-left: 0
    }

    .site-breadcrumb .breadcrumb-menu li:last-child:before {
        display: none
    }

    .site-breadcrumb .breadcrumb-menu li a:hover {
        color: var(--theme-color)
    }

    .site-breadcrumb .breadcrumb-menu li.active {
        color: var(--theme-color)
    }
    @media(max-width:991px){
        .site-breadcrumb {
            margin-top:73px;
        }
    }


    /*-------------------SITE-----------------------*/

    .pagination {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-top: 50px
    }

    .pagination .page-link {
        border: none;
        background: var(--theme-bg-light);
        color: var(--color-dark);
        font-weight: 500;
        margin: 0 7px;
        border-radius: 9px !important;
        width: 33px;
        height: 33px;
        line-height: 25px;
        text-align: center;
        transition: var(--transition);
        z-index: 1
    }

    .pagination .page-link:hover,
    .pagination .page-item.active .page-link {
        background: var(--theme-color);
        color: var(--color-white)
    }


    /*------------------------------pagination--------------*/

    .login-form {
        padding: 40px;
        padding-top:110px;
        background-color: #5c6c66;
        border-radius: 15px
    }

    .login-form .login-header {
        text-align: center;
        margin-bottom: 30px
    }

    .login-form .login-header img {
        width: 200px;
        margin-bottom: 10px
    }

    .login-form .login-header h3 {
        color: var(--theme-color);
        margin-bottom: 5px;
        font-weight: 800
    }

    .login-form .login-header p {
        color: var(--color-dark);
        font-size: 20px
    }

    .login-form .login-footer {
        margin-top: 25px
    }

    .login-form .login-footer p {
        color: var(--color-dark);
        text-align: center
    }

    .login-form .login-footer a {
        color: var(--theme-color);
        transition: .5s
    }

    .login-form .login-footer a:hover {
        color: var(--theme-color2)
    }

    .login-form .input-group {
        margin-bottom: 22px
    }

    .login-form label {
        color: var(--color-dark);
        margin-bottom: 5px
    }

    .login-form .input-group:focus-within {
        outline: 2px solid var(--theme-color);
        border-radius: 50px
    }

    .login-form .input-group .form-control {
        padding: 15px 25px 15px 0;
        border-radius: 50px;
        /* border: none; */
        box-shadow: none;
        /* background: var(--color-white) */
    }

    .login-form .input-group .nice-select {
        line-height: 25px
    }

    .login-form .input-group .form-control,
    .login-form .input-group .form-select,
    .login-form .input-group .form-control::placeholder {
        color: var(--color-dark)
    }

    .login-form .input-group .input-group-text {
        background: var(--color-white);
        color: var(--theme-color);
        border-radius: 50px;
        padding-left: 20px;
        border: none
    }

    .login-form .form-check {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 0;
        margin: 0
    }

    .login-form .form-check-input {
        margin: 0;
        box-shadow: none;
        border-radius: 50px;
        border: none;
        width: 20px;
        height: 20px;
        background-color: var(--color-white)
    }

    .login-form .form-check-input:checked {
        background-color: var(--theme-color);
        border-color: var(--theme-color)
    }

    .login-form .form-check-label {
        margin-bottom: 0
    }

    .login-form .form-check-label a {
        color: var(--theme-color);
        transition: var(--transition)
    }

    .login-form .form-check-label a:hover {
        color: var(--theme-color)
    }

    .login-form .forgot-password {
        color: var(--theme-color);
        transition: var(--transition)
    }

    .login-form .forgot-password:hover {
        color: var(--theme-color2)
    }

    .login-form .theme-btn {
        width: 100%
    }

    .login-form .theme-btn::before {
        width: 420px;
        height: 420px;
        transition: var(--transition2)
    }

    .login-form .social-login {
        border-top: 1px solid var(--border-info-color);
        margin-top: 15px
    }

    .login-form .social-login p {
        color: var(--color-dark);
        margin: 10px 0
    }

    .login-form .social-login-list {
        text-align: center
    }

    .login-form .social-login-list a {
        width: 40px;
        height: 40px;
        line-height: 40px;
        background: var(--theme-color);
        border-radius: 50px;
        margin: 5px
    }

    .login-form .social-login-list a i {
        color: var(--color-white)
    }

    .login-form .social-login-list a:hover {
        background: var(--theme-color2)
    }

    @media only screen and (max-width:991px) {
        .login-form {
            padding: 40px 20px;
            padding-top:80px;
        }
    }


    /*---------------------------LOGIN---------------------*/

    .partner-area {
        position: relative
    }

    .partner-bg {
        position: relative;
        background: rgba(252, 34, 106, .03);
    }
    
    .partner-bg::before {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        background-image: url(assets/img/shape/foot.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        opacity: .2;
    }


    /*-------------------------------PARTNER--------------------*/

    .book-store-image {
        width: 100%;
        height: 100%;
        /* background-image: url(../img/shape/book1.png); */
        /* background-image: url(../img/shape/footer-style-1.png); */
        background-image: url(../img/shape/shape-bg-ras.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: cover;
        padding:5rem 0;
        background-attachment: fixed;
    }


    /*------------------book-store-image---------------*/

    .error-wrapper {
        text-align: center
    }

    .error-wrapper h1 {
        font-size: 250px;
        letter-spacing: 5px;
        font-weight: 700;
        color: var(--theme-color)
    }

    .error-wrapper h1 span {
        color: var(--color-dark)
    }

    .error-wrapper h2 {
        margin-top: 30px;
        margin-bottom: 10px
    }

    .error-wrapper img {
        width: 100%
    }

    .error-wrapper .theme-btn {
        margin-top: 30px
    }


    /*-------------------------ERROR------------------*/

    .terms-content:not(:last-child) {
        margin-bottom: 54px
    }

    .terms-content:first-child {
        margin-top: -3px
    }

    .terms-content .terms-list {
        margin-top: 37px
    }

    .terms-content h3 {
        margin-bottom: 23px;
        position: relative
    }

    .terms-content p:not(:last-child) {
        margin-bottom: 26px
    }

    .terms-list li:not(:last-child) {
        margin-bottom: 16px
    }


    /*_-------------------------------TERM---------------------*/


    /* EXHIBITOR PROFILE PAGE */

    section.exhibiter_profile ul li img {
        margin-bottom: 12px;
        width: 110px;
        background: #f0f0f0;
        padding: 23px;
        border-radius: 50%;
    }

    section.exhibiter_profile ul li:hover {
        transform: translateY(-10px);
    }

    section.exhibiter_profile ul li {
        text-align: center;
        transition: 0.7s ease;
    }


    /*--------------------------Exhibitor------------------------------------*/

    .exhibitor-area {
        position: relative;
        background-color: #4a5255;
        padding: 5%;
    }


    /*--------------------------Exhibitor------------------------------------*/

    .bp:hover {
        animation: bp 2s;
        color: rgb(248, 242, 242) !important;
        background: linear-gradient(to right, lightgray, rgb(51, 139, 147));
    }


    /*--------------------------cardhover-----------------------*/

    .otp-form {
        background-color: #ffffff;
        border-radius: 8px;
        padding: 40px;
        box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.555);
        text-align: center;
        max-width: 50%;
        width: 100%;
        margin: auto;
        display: none;
    }


    /* OTP input styles */

    .otp-container {
        display: flex;
        justify-content: center;
        margin-top: 20px;
    }

    .otp-input {
        width: 50px;
        height: 40px;
        text-align: center;
        font-size: 18px;
        margin: 0 5px;
        border: 3px solid #ccc;
        border-radius: 4px;
        outline: none;
        transition: border-color 0.3s;
    }

    .otp-input:focus {
        border-color: #00ff37;
    }


    /*----------------------otp------------------*/

    .footer-area {
        /* background: #6b799c; */
        background: #ffffff;
        position: relative;
        z-index: 1;

    }

    .footer-shape img {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        opacity: .3;
        z-index: -1
    }

    .footer-widget-box {
        margin-bottom: 20px
    }

    /* .footer-widget-box.about-us {
        padding-right: 50px
    } */

    .footer-widget {
        position: relative;
        z-index: 1
    }

    .footer-logo img {
        width: 220px;
        margin-bottom: 18px
    }

    .footer-widget-title {
        /* color: var(--color-white); */
        position: relative;
        padding-bottom: 20px;
        margin-bottom: 30px;
        font-size: 20px;
        z-index: 1
    }

    .footer-widget-title::before {
        position: absolute;
        content: '';
        z-index: -1;
        width: 90px;
        height: 2px;
        background: rgba(255, 255, 255, .2);
        bottom: 0;
        left: 0
    }

    .footer-widget-title::after {
        position: absolute;
        content: '';
        z-index: -1;
        width: 30px;
        height: 2px;
        background-color: var(--theme-color);
        bottom: 0;
        left: 18px
    }

    .footer-list {
        display: flex;
        flex-direction: column;
        gap: .65rem
    }

    .footer-list li a {
        /* color: var(--color-white); */
        transition: var(--transition)
    }

    .footer-list li a i {
        margin-right: 5px;
        /* color: var(--theme-color) */
    }

    .footer-list li a:hover {
        padding-left: 10px;
        /* color: var(--theme-color); */
    }

    .footer-widget-box p {
        color: var(--color-white);
        padding-right: 18px;
        margin-bottom: 20px
    }

    .footer-widget-box .social i {
        width: 20px
    }

    .footer-social {
        display: flex;
        gap: 15px;
        justify-content: end
    }

    .footer-social li a i {
        height: 38px;
        width: 38px;
        line-height: 38px;
        text-align: center;
        border-radius: 50px;
        background: var(--color-white);
        color: var(--theme-color);
        transition: var(--transition)
    }

    .footer-social li a i:hover {
        background: var(--color-dark);
        color: var(--color-white)
    }

    .footer-contact li {
        position: relative;
        display: flex;
        justify-content: start;
        /* align-items: center; */
        /* color: var(--footer-text-color); */
        color: var(--color-dark);
        font-size: 16px;
        margin-bottom: 12px
    }

    .footer-contact li a {
        color: var(--footer-text-color);
        transition: var(--transition)
    }

    .footer-contact li a:hover {
        padding-left: 10px;
        color: var(--theme-color);
    }

    .footer-contact li i {
        height: 32px;
        line-height: 32px;
        font-size: 16px;
        margin-left: 10px;
        border-radius: 50px;
        /*background: var(--theme-color);*/
        text-align: center;
        transition: var(--transition);
        /* color: var(--theme-color) */
    }

    .footer-request {
        margin-top: 20px
    }

    .footer-request p {
        font-weight: 500;
        margin-bottom: 12px;
        letter-spacing: 4px
    }

    .footer-request .theme-btn i {
        margin-left: 12px
    }

    .subscribe-form .form-group {
        position: relative
    }

    .subscribe-form .form-control {
        padding: 16px 140px 16px 25px;
        border-radius: 50px;
        color: var(--color-dark);
        box-shadow: none;
        border: none
    }

    .subscribe-form .form-control:focus {
        outline: 2px solid var(--theme-color)
    }

    .subscribe-form .form-control::placeholder {
        color: var(--color-dark)
    }

    .subscribe-form .theme-btn {
        position: absolute;
        padding: 10px 18px;
        right: 4px;
        top: 3px
    }

    .subscribe-form .theme-btn:hover {
        color: var(--color-white)
    }

    .subscribe-form .theme-btn::before {
        background: var(--theme-color2)
    }

    .footer-widget-box.about-us .footer-newsletter p {
        font-size: 18px;
        font-weight: 500
    }

    .footer-menu {
        margin: 0;
        padding: 0;
        text-align: right
    }

    .footer-menu li {
        position: relative;
        display: inline-block;
        margin-left: 25px;
        font-size: 14px
    }

    .footer-menu li::after {
        content: "";
        position: absolute;
        width: 5px;
        height: 5px;
        background: var(--theme-color);
        right: -18px;
        top: 13px;
        border-radius: 50px
    }

    .footer-menu li:last-child::after {
        display: none
    }

    .footer-menu li a {
        /* color: var(--footer-text-color); */
        transition: var(--transition)
    }

    /* .footer-menu li a:hover {
        color: var(--theme-color)
    } */

    .copyright {
        padding: 14px 0;
        border-top: 1px solid var(--border-white-color)
    }

    .copyright .copyright-text {
        /* color: var(--footer-text-color); */
        color: var(--color-dark);
        margin-bottom: 0;
        font-size: 14px
    }

    .copyright .copyright-text a {
        /* color: var(--theme-color); */
        font-weight: 500
    }

    /* @media all and (max-width:1199px) {
        .footer-widget-box {
            margin-bottom: 50px
        }
    } */

    @media all and (max-width:991px) {
        .footer-widget-wrapper {
            padding-bottom: 0
        }

        /* .footer-menu {
            float: left;
            margin-top: 20px;
            text-align: left
        } */

        .footer-menu li {
            margin-left: 0;
            margin-right: 15px
        }

        .footer-menu li::after {
            right: -12px
        }
    }

    @media all and (max-width:767px) {
        .footer-widget-wrapper {
            padding-bottom: 0
        }

        .footer-social {
            justify-content: flex-start;
            margin-top: 20px
        }

        .footer-menu {
            text-align: center
        }
    }

    @media (min-width:375px) AND (max-width:576px) {
        .col-440 {
            flex: 0 0 auto;
            width: 50%;
        }
    }


    /* --------------------------------- Custom Css -------------------------------- */

    .form-group {
        position: relative;
        margin-bottom: 20px;
    }

    .form-group input {
        width: 100%;
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 4px;
        font-size: 16px;
        transition: border-color 0.3s ease;
    }

    .form-group select {
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 16px;
    }

    .form-group label {
        position: absolute;
        left: 12px;
        top: 12px;
        font-size: 14px;
        color: #777;
        transition: top 0.3s ease, font-size 0.3s ease, color 0.3s ease;
    }

    .form-group input:focus+label,
    .form-group input:not(:placeholder-shown)+label,
    .form-group textarea:focus+label,
    .form-group textarea:not(:placeholder-shown)+label,
    .form-group.phone-input label {
        top: -21px;
        font-size: 12px;
        color: #fff;
        /* color: #007bff; */
        /* background-color: #ffffff; */
        padding: 0 4px;
        border-radius: 4px;
        left: 4px;
        z-index: 99;
    }

    .iti.iti--allow-dropdown {
        width: 100%;
    }


    /* Hide the spinner arrows in Chrome, Safari, and Edge */
    input[type="number"]::-webkit-inner-spin-button,
    input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    /* Hide the spinner arrows in Firefox */
    input[type="number"] {
        -moz-appearance: textfield;
    }


    #membershipCont {
        padding: 5.1rem 0;
    }

    footer {
        margin-top: 0 !important;
    }

    @media(max-width:991px) {
        #membershipCont {
            padding: 8.5rem 0 6rem;
        }
    }

    .iti.iti--allow-dropdown {
        width: 100%;
    }

    .otp-inputs {
        display: flex;
        gap: 10px;
        justify-content: center;
    }

    .otp-input {
        width: 50px;
        height: 50px;
        font-size: 24px;
        text-align: center;
        border: 2px solid #ccc;
        border-radius: 5px;
    }

    @media (max-width: 576px) {
        .otp-input {
            width: 35px;
            height: 40px;
            font-size: 18px;
            padding-inline: 3px;
        }
    }


    .modalbox.success {

        transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
        -webkit-border-radius: 25px;
        -moz-border-radius: 25px;
        border-radius: 25px;
        background: #fff;
        padding: 25px;
        text-align: center;
    }

    .modalbox.success.animate .icon {
        -webkit-animation: fall-in 0.75s;
        -moz-animation: fall-in 0.75s;
        -o-animation: fall-in 0.75s;
        animation: fall-in 0.75s;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    }

    .modalbox.success h1 {
        font-family: 'Montserrat', sans-serif;
    }

    .modalbox.success p {
        font-family: 'Open Sans', sans-serif;
    }

    .modalbox.success .icon {
        position: relative;
        margin: 0 auto;
        margin-top: -75px;
        height: 100px;
        width: 100px;
        border-radius: 50%;
    }
    .modalbox.warning .icon {
        background: #fff;
        box-shadow:none;
    }

    .modal#statusSuccessModal .modal-content {
        border-radius: 50px;
    }

    .modal#statusSuccessModal .modal-content svg {
        width: 68px;
        display: block;
        margin: 0 auto;
    }

    .modal#statusSuccessModal .modal-content .path {
        stroke-dasharray: 1000;
        stroke-dashoffset: 0;
    }

    .modal#statusSuccessModal .modal-content .path.circle {
        -webkit-animation: dash 0.9s ease-in-out;
        animation: dash 0.9s ease-in-out;
    }

    .modal#statusSuccessModal .modal-content .path.line {
        stroke-dashoffset: 1000;
        -webkit-animation: dash 0.95s 0.35s ease-in-out forwards;
        animation: dash 0.95s 0.35s ease-in-out forwards;
    }

    .modal#statusSuccessModal .modal-content .path.check {
        stroke-dashoffset: -100;
        -webkit-animation: dash-check 0.95s 0.35s ease-in-out forwards;
        animation: dash-check 0.95s 0.35s ease-in-out forwards;
    }

    @-webkit-keyframes dash {
        0% {
            stroke-dashoffset: 1000;
        }

        100% {
            stroke-dashoffset: 0;
        }
    }

    @keyframes dash {
        0% {
            stroke-dashoffset: 1000;
        }

        100% {
            stroke-dashoffset: 0;
        }
    }

    @-webkit-keyframes dash {
        0% {
            stroke-dashoffset: 1000;
        }

        100% {
            stroke-dashoffset: 0;
        }
    }

    @keyframes dash {
        0% {
            stroke-dashoffset: 1000;
        }

        100% {
            stroke-dashoffset: 0;
        }
    }

    @-webkit-keyframes dash-check {
        0% {
            stroke-dashoffset: -100;
        }

        100% {
            stroke-dashoffset: 900;
        }
    }

    @keyframes dash-check {
        0% {
            stroke-dashoffset: -100;
        }

        100% {
            stroke-dashoffset: 900;
        }
    }

    .box00 {
        width: 100px;
        height: 100px;
        border-radius: 50%;
    }

    .thank-content {
        font-size: 2em;
        letter-spacing: 3px;
        margin: 0;
    }

    .component {
        /* width: 320px; */
        background-color: #fff;
        border-radius: 20px;
        box-shadow:
            0.6px 5.3px 6.6px rgba(0, 0, 0, 0.025),
            5px 42px 53px rgba(0, 0, 0, 0.05);
    }

    .component-info {
        width: 80%;
        margin: 30px auto;
    }

    .order-summary h2 {
        text-align: center;
        font-size: 24px;
        font-weight: 900;
        color: var(--dark-blue);
    }

    .order-summary p {
        font-size: 13px;
        font-weight: 500;
        color: var(--desaturated-blue);
        text-align: center;
        line-height: 18px;
        margin-top: 14px;
    }

    .annual-plan {
        width: 100%;
        background-color: var(--very-pale-blue);
        padding: 18px 15px;
        border-radius: 10px;
        margin: 16px 0 20px;
        /* display: grid;
        grid-template-columns: repeat(4, 1fr); */
        align-items: center;
    }

    .plan-price {
        grid-area: 1 / 2 / 2 / 3;
    }

    .plan-price h4 {
        font-size: 14px;
        font-weight: 700;
        color: var(--dark-blue);
    }

    .plan-price p {
        font-size: 14px;
        color: var(--desaturated-blue);
    }














    .about-area {
        position: relative;
        display: block
    }

    .about-left {
        position: relative;
        display: block;
        margin-right: 50px
    }

    .about-img {
        position: relative
    }

    .about-img img {
        border-radius: 50%;
        border: 10px solid var(--color-white);
        box-shadow: var(--box-shadow)
    }

    .about-img .img-2 {
        position: absolute;
        right: -29px;
        bottom: -15px;
        width: 200px;

        box-shadow: none
    }

    .about-img .img-3 {
        position: absolute;
        right: -30px;
        top: -30px;
        width: 200px;
        box-shadow: none
    }

    .about-img .img-4 {
        position: absolute;
        left: -45px;
        bottom: 127px;
        width: 200px;
        box-shadow: none;

    }

    @media(max-width:600px) {
        .about-img .img-4 {
            position: absolute;
            left: -15px;
            bottom: 100px;
            width: 150px;
            box-shadow: none;

        }
    }

    .about-right {
        position: relative;
        display: block;
        padding-left: 30px
    }


    .about-experience h5 {
        color: var(--color-white);
        font-size: 20px
    }

    .about-experience span {
        color: var(--color-white);
        font-size: 70px;
        font-weight: 900;
        line-height: 1;
        margin-bottom: 10px;
        display: inline-block
    }

    .about-list-wrap {
        position: relative;
        display: block;
        margin-top: 25px;
        margin-bottom: 35px
    }

    .about-list {
        position: relative;
        display: block
    }

    .about-list li {
        position: relative;
        display: flex;
        align-items: center;
        border-bottom: 1px solid var(--border-info-color);
        padding-bottom: 20px;
        margin-bottom: 20px
    }

    .about-list li:last-child {
        border-bottom: none
    }

    .about-list li .icon {
        position: relative;
        display: flex;
        align-items: center
    }

    .about-list li .icon i {
        font-size: 50px;
        color: var(--theme-color)
    }

    .about-list li .icon img {
        width: 50px
    }

    .about-list li .about-item h4 span {
        color: var(--theme-color);
        margin-right: 10px
    }

    .about-list li .about-item p {
        margin-top: 5px
    }

    @media(max-width:500px) {
        .about-item-res {
            font-size: 15px;
        }
    }

    @media all and (max-width:991px) {
        .about-right {
            margin-top: 90px
        }
    }

    @media all and (max-width:767px) {
        .about-right {
            padding-left: 0
        }

        .about-title {
            font-size: 30px
        }

        .about-left {
            margin-right: 0
        }

        .about-left-content {
            bottom: -70px
        }

        .about-img {
            width: 90%
        }

        .about-experience {
            left: -7px;
            padding: 20px 10px
        }

        .about-img .img-3 {
            width: 140px
        }

        .about-img .img-2 {
            width: 150px;
            right: -10px
        }
    }

    .slick-slide {
        margin: 0px 20px;
    }

    .slick-slide img {
        width: 100%;
    }

    .slick-slider {
        position: relative;
        display: block;
        box-sizing: border-box;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-touch-callout: none;
        -khtml-user-select: none;
        -ms-touch-action: pan-y;
        touch-action: pan-y;
        -webkit-tap-highlight-color: transparent;
    }

    .slick-list {
        position: relative;
        display: block;
        overflow: hidden;
        margin: 0;
        padding: 0;
    }

    .slick-list:focus {
        outline: none;
    }

    .slick-list.dragging {
        cursor: pointer;
        cursor: hand;
    }

    .slick-slider .slick-track,
    .slick-slider .slick-list {
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    .slick-track {
        position: relative;
        top: 0;
        left: 0;
        display: block;
    }

    .slick-track:before,
    .slick-track:after {
        display: table;
        content: '';
    }

    .slick-track:after {
        clear: both;
    }

    .slick-loading .slick-track {
        visibility: hidden;
    }

    .slick-slide {
        display: none;
        float: left;
        height: 100%;
        min-height: 1px;
    }

    [dir='rtl'] .slick-slide {
        float: right;
    }

    .slick-slide img {
        display: block;
    }

    .slick-slide.slick-loading img {
        display: none;
    }

    .slick-slide.dragging img {
        pointer-events: none;
    }

    .slick-initialized .slick-slide {
        display: block;
    }

    .slick-loading .slick-slide {
        visibility: hidden;
    }

    .slick-vertical .slick-slide {
        display: block;
        height: auto;
        border: 1px solid transparent;
    }

    .slick-arrow.slick-hidden {
        display: none;
    }

    .schedule-area {
        position: relative
    }
    
    .schedule-nav {
        border-bottom: 1px solid var(--border-info-color);
        padding-bottom: 35px;
        margin-bottom: 35px
    }
    
    .schedule-nav .nav {
        background: var(--color-white);
        border-radius: 15px;
        width: fit-content;
        box-shadow: var(--box-shadow);
        margin: 0 auto;
        padding: 10px;
        gap: 10px
    }
    
    .schedule-nav .nav-link {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 5px 15px;
        color: var(--color-dark);
        border-radius: 10px
    }
    
    
    
    .schedule-nav .nav-link .icon {
        font-size: 30px;
        color: var(--theme-color)
    }
    
    
    
    .schedule-nav .nav-link .content span {
        display: block;
        text-align: left;
        line-height: 1
    }
    
    .schedule-nav .nav-link .content .day {
        font-size: 20px;
        font-weight: 700;
        margin-bottom: 5px
    }
    
    .schedule-nav .nav-link .content .date {
        font-weight: 500
    }
    
    .schedule-item {
        display: flex;
        align-items: center;
        gap: 20px;
        position: relative
    }
    
    .schedule-item::before {
        content: "";
        position: absolute;
        border-left: 3px dashed var(--theme-color2);
        left: 35px;
        top: 50%;
        height: 100%;
        z-index: -1
    }
    
    .schedule-item.last::before {
        display: none
    }
    
    .schedule-count {
        width: 70px;
        height: 70px;
        line-height: 68px;
        background: var(--theme-gradient);
        border-radius: 50%;
        text-align: center;
        font-size: 38px;
        font-weight: 700;
        color: #121212;
        box-shadow: var(--box-shadow)
    }
    
    .schedule-content-wrap {
        display: flex;
        align-items: center;
        gap: 20px;
        flex: 1;
        background: var(--color-white);
        padding: 15px;
        border-radius: 15px;
        box-shadow: var(--box-shadow)
    }
    
    .schedule-img {
        overflow: hidden;
        border-radius: 15px
    }
    
    .schedule-img img {
        width: 280px;
        border-radius: 15px
    }
    
    .schedule-item:hover .schedule-img img {
        transform: scale(1.1)
    }
    
    .schedule-content {
        flex: 1
    }
    
    .schedule-meta {
        margin-bottom: 15px
    }
    
    .schedule-meta ul {
        display: flex;
        gap: 20px
    }
    
    .schedule-meta ul li {
        color: var(--theme-color);
        font-weight:bold;   
        font-size: 22px;
    
    }
    
    .schedule-meta ul li i {
        color: var(--theme-color)
    }
    
    .schedule-info h4 {
        margin-bottom: 10px
    }
    
    .schedule-info h4 a {
        color: var(--color-dark)
    }
    
    .schedule-info h4 a:hover {
        color: var(--theme-color)
    }
    
    .schedule-bottom {
        display: flex;
        justify-content: space-between;
        margin-top: 18px;
        padding-top: 18px;
        border-top: 1px solid var(--border-info-color)
    }
    
    .schedule-speaker {
        display: flex;
        gap: 20px
    }
    
    .schedule-speaker .speaker-item {
        display: flex;
        align-items: center;
        gap: 10px
    }
    
    .schedule-speaker .speaker-img {
        position: relative
    }
    
    .schedule-speaker .speaker-img img {
        width: 50px;
        border-radius: 50px
    }
    
    .schedule-speaker .speaker-img-icon {
        position: absolute;
        right: 0;
        bottom: 0;
        width: 22px;
        height: 22px;
        line-height: 20px;
        font-size: 14px;
        color: var(--color-white);
        background: var(--theme-color);
        border: 2px solid var(--color-white);
        border-radius: 50px;
        text-align: center
    }
    
    .schedule-area2 .schedule-nav .nav {
        border-radius: 50px
    }
    
    .schedule-area2 .schedule-nav .nav-pills .nav-link {
        padding: 8px 30px
    }
    
    .schedule-area2 .schedule-nav .nav-pills .nav-link.active {
        border-radius: 50px
    }
    
    .schedule-area2 .schedule-item::before {
        display: none
    }
    
    .schedule-area2 .schedule-count {
        color: var(--color-dark);
        background: 0 0;
        width: unset;
        height: unset;
        line-height: unset;
        box-shadow: none;
        line-height: 1;
        font-weight: 800;
        color: var(--theme-color)
    }
    
    .schedule-area2 .schedule-count span {
        display: block;
        line-height: 1;
        font-weight: 500;
        font-size: 20px;
        text-transform: uppercase;
        margin-top: 5px;
        color: var(--color-dark)
    }
    
    .schedule-area2 .schedule-bottom {
        border-top: none;
        margin: 0;
        padding: 0
    }
    
    .schedule-area2 .schedule-img img {
        width: 180px
    }
    
    .schedule-area2 .schedule-content {
        border-right: 1px solid var(--border-info-color);
        padding-right: 20px
    }
    
    .schedule-area3 .schedule-nav .nav {
        background: 0 0;
        box-shadow: none;
        padding: 0;
        gap: 20px
    }
    
    .schedule-area3 .schedule-nav .nav-pills .nav-link {
    
        box-shadow: var(--box-shadow)
    }
    
    .schedule-area3 .schedule-nav .nav-pills .nav-link.active {
        background: var(--theme-gradient)
    }
    
    .schedule-area3 .schedule-item::before {
        display: none
    }
    
    .schedule-area3 .schedule-content-wrap {
        flex-direction: column;
        gap: 15px
    }
    
    .schedule-area3 .schedule-img img {
        width: 100%
    }
    
    .schedule-area3 .schedule-bottom {
        width: 100%;
        margin-top: 0
    }
    
    .schedule-item .time {
        color: var(--theme-color2);
        font-weight: 500
    }
    
    .schedule-area3 .schedule-info .location {
        color: var(--theme-color);
        font-weight: 500
    }
    
    .schedule-area3 .schedule-info h4 {
        margin-top: 10px
    }
    
    @media all and (max-width:991px) {
        .schedule-item::before {
            display: none
        }
    
        .schedule-count {
            display: none
        }
    
        .schedule-content-wrap {
            flex-direction: column;
            align-items: unset
        }
    
        .schedule-img img {
            width: 100%
        }
    
        .schedule-meta ul {
            flex-direction: column;
            gap: 10px
        }
    
        .schedule-speaker,
        .schedule-bottom {
            flex-direction: column
        }
    
        .schedule-bottom .theme-btn {
            margin-top: 20px
        }
    
        .schedule-area2 .schedule-img img {
            width: 100%
        }
    
        .schedule-area2 .schedule-content {
            border-right: none;
            padding-right: 0
        }
    }
    
    .schedule-single {
        position: relative
    }
    
    .schedule-detail-img img {
        border-radius: 15px
    }
    
    .schedule-sidebar .event-countdown {
        background: var(--theme-gradient);
        border-radius: 15px
    }
    
    .schedule-sidebar .event-countdown .time-wrap {
        gap: 0
    }
    
    .schedule-sidebar .schedule-list li {
        color: var(--color-dark);
        font-weight: 500;
        margin: 5px 0
    }
    
    .schedule-sidebar .schedule-list li i {
        color: var(--theme-color);
        width: 25px
    }
    
    .schedule-sidebar .social {
        margin-top: 30px
    }
    
    .schedule-sidebar .social a {
        width: 35px;
        height: 35px;
        line-height: 32px;
        border: 2px solid var(--theme-color2);
        color: var(--theme-color2);
        text-align: center;
        border-radius: 50px;
        margin-right: 5px
    }
    
    .schedule-sidebar .social a:hover {
        background: var(--theme-color2);
        color: var(--color-white)
    }
    
    .schedule-info-list li {
        display: flex;
        align-items: center;
        gap: 12px;
        margin: 10px 0
    }
    
    .schedule-info-list .icon {
        width: 35px;
        height: 35px;
        line-height: 35px;
        background: var(--theme-color);
        color: var(--color-white);
        text-align: center;
        border-radius: 50px;
        margin-right: 5px
    }
    
    .schedule-info-list .theme-btn {
        margin-top: 20px
    }
    
    .schedule-info-list .content span {
        color: var(--theme-color);
        font-weight: 500
    }
    
    .schedule-detail-info .video-content,
    .schedule-detail-info .video-content::before {
        border-radius: 15px
    }
    
    .schedule-detail-info .location-map iframe {
        border-radius: 15px;
        width: 100%;
        height: 350px
    }







    .hero-section {
        position: relative
    }
    
    .hero-single::before {
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        left: -.5px;
        top: 0;
        background: var(--hero-overlay);
        opacity: .7;
        z-index: -1
    }
    
    .hero-date h1 {
        color: var(--theme-color);
        font-size: 60px;
        font-weight: 700
    }
    
    .hero-single .hero-content p {
        color: var(--color-white);
        font-size: 20px;
        line-height: 30px;
        font-weight: 400;
        margin-bottom: 20px
    }
    
    .hero-single .hero-content .hero-btn {
        gap: 1rem;
        display: flex;
        margin-top: 35px;
        justify-content: start
    }
    
    .hero-slider.owl-theme .owl-nav {
        margin-top: 0
    }
    
    .hero-slider.owl-theme .owl-nav [class*=owl-] {
        color: var(--color-white);
        font-size: 25px;
        margin: 0;
        padding: 0;
        background: var(--slider-arrow-bg);
        display: inline-block;
        cursor: pointer;
        height: 55px;
        width: 55px;
        line-height: 55px;
        border-radius: 50px;
        text-align: center;
        transition: var(--transition)
    }
    
    .hero-slider.owl-theme .owl-nav [class*=owl-]:hover {
        background: var(--color-white);
        color: var(--theme-color)
    }
    
    .hero-slider.owl-theme .owl-nav .owl-prev {
        left: 40px
    }
    
    .hero-slider.owl-theme .owl-nav .owl-next {
        right: 40px
    }
    
    .hero-slider.owl-theme .owl-nav .owl-prev,
    .hero-slider.owl-theme .owl-nav .owl-next {
        position: absolute;
        top: 50%;
        transform: translate(0, -50%)
    }
    
    .hero-slider.owl-theme .owl-dots {
        position: absolute;
        text-align: center;
        bottom: 100px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center
    }
    @media(max-width:500px){
        
    .hero-slider.owl-theme .owl-dots {
        position: absolute;
        text-align: center;
        bottom: 65px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        align-items: center
    }
    }
    .hero-slider.owl-theme .owl-dots .owl-dot span {
        background: var(--color-white);
        margin: 5px;
        border-radius: 10px;
        width: 15px;
        height: 15px;
        display: inline-block;
        transition: var(--transition)
    }
    
    .hero-slider.owl-theme .owl-dots .owl-dot.active span {
        background-color: var(--theme-color)
    }
    
    @media all and (max-width:1199px) {
        .hero-single .hero-content .hero-title {
            font-size: 37px
        }
    
        .hero-slider.owl-theme .owl-nav .owl-prev,
        .hero-slider.owl-theme .owl-nav .owl-next {
            top: unset;
            bottom: 70px !important
        }
    
        .hero-slider.owl-theme .owl-nav .owl-prev {
            left: unset;
            right: 120px
        }
    
        .hero-slider.owl-theme .owl-nav .owl-next {
            right: 40px
        }
    }
    
    @media all and (max-width:991px) {
        .hero-single .hero-content .hero-title {
            font-size: 45px
        }
    
        .hero-scroll-box {
            left: 20px;
            bottom: 80px
        }
    }
    
    @media all and (max-width:767px) {
        .hero-single .hero-content .hero-sub-title {
            font-size: 18px
        }
    
        .hero-single .hero-content .hero-btn {
            gap: 1rem
        }
    }





    .choose-area {
        position: relative
    }
    
    .choose-content-wrap {
        margin-top: 30px
    }
    
    .choose-item {
        display: flex;
        gap: 15px;
        margin-top: 20px
    }
    
    .choose-item-icon {
        width: 60px;
        height: 60px;
        line-height: 55px;
        border-radius: 50px;
        text-align: center;
        border: 2px solid rgb(231, 219, 219);
    }
    
    .choose-item-icon img {
        width: 37px;
    }
    
    .choose-item-info h4 {
        margin-bottom: 5px
    }
    
    .choose-item-info {
        border-bottom: 1px solid var(--border-info-color);
        padding-bottom: 20px;
        flex: 1
    }
    
    .choose-item:last-child .choose-item-info {
        border-bottom: none
    }
    
    .choose-img {
        position: relative;
        text-align: end;
        margin-right: 30px
    }
    
    .choose-img img {
        border-radius: 50px
    }
    
    .choose-img::before {
        content: "";
        position: absolute;
        left: 15px;
        top: 40px;
        background: var(--theme-color);
        border-radius: 20px;
        width: 70%;
        height: 88%;
        transform: rotate(-8deg);
        z-index: -1
    }
    
    .choose-img .theme-btn {
        position: absolute;
        left: -20px;
        bottom: 172px;
    }
    
    @media all and (max-width:991px) {
        .choose-content {
            margin-top: 50px
        }
    
        .choose-img {
            text-align: left;
            padding-left: 40px
        }
    }
    





    

.newsletter{
    position: relative;
}
.newsletter:after {
    position: absolute;
    content: '';
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #8bc34a;

    opacity: .5;
    z-index: -1;
}

.newsletter .section-title {
    margin-bottom: 20px;
}

.newsletter .section-title p {
    color: #fff;
    font-family: 'Merriweather', serif;
    font-size: large !important;
}

.newsletter .newsletter-form {
    position: relative;
    height: 60px;
    z-index: 2;
}


.newsletter .newsletter-form input {
    width: 100%;
    height: 100%;
    border: none;
    padding: 21.5px;
    outline: 0;
    padding-right: 200px;
    border-radius: 50px;
}

.newsletter .newsletter-form button {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: -0.5px;
    /* height: 100%; */
    width: 170px;
    background: #8bc34a;
    outline: none;
    border: none;
    color: #fff;
    font-weight: 500;
    cursor: pointer;
    border-radius: 0 50px 50px 0;
}
@media(max-width:500px){
    .newsletter .newsletter-form button {
        width: 90px;
    }
    .newsletter .newsletter-form {
        height: 48px;
    }
    .newsletter .newsletter-form input {
        height: 100%;
        border: none;
        padding: 15.5px;
    }
}

.feature-area-bg {
    background-color: rgb(249, 249, 249);

}

.feature-area {
    position: relative;

}

.feature-area.fa-negative {
    margin-top: -120px;
    background-color: #f9f9f9;

}

.feature-item {
    padding: 25px;
    text-align: center;
    position: relative;
    background: var(--color-white);
    border-radius: 15px;
    overflow: hidden;
    box-shadow: var(--box-shadow);
    transition: var(--transition);
    z-index: 1
}

/* .feature-item:hover {
    transform: translateY(-10px)
} */

.feature-item .count {
    font-size: 120px;
    font-weight: 800;
    -webkit-text-stroke: 2px var(--theme-color);
    -webkit-text-fill-color: transparent;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: .15;
    z-index: -1
}

.feature-icon img {
    width: 80px
}

.feature-item:hover .feature-icon {
    transform: rotateY(360deg)
}

.feature-item h4 {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 8px
}




.sponsorship-bg {
    position: relative;
    background: rgba(252, 34, 106, .03);
}

.sponsorship-bg::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-image: url(assets/img/shape/green.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    opacity: .2
}

.sponsorship-card {
    background-color: #f8f9fa;
    border-radius: 10px;
    padding: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s, box-shadow 0.3s;
}

.sponsorship-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}

.sponsorship-card img {
    max-width: 100%;
    margin-bottom: 15px;
}

.sponsorship-card p {
    font-size: 1rem;
    color: #333;
    font-weight: 600;
    margin-top: 10px;
}

.skiptranslate{
    display:none !important;
}
body{
    top:0 !important;
}

#customDropdown.dropdown {
    position: relative;
    display: inline-block;
    cursor: pointer;
}
#customDropdown.dropdown .dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    min-width: 130px;
    border-radius: 5px;
}
#customDropdown.dropdown .dropdown-content div {
    padding: 10px;
    cursor: pointer;
    display: flex;
    align-items: center;
}
#customDropdown.dropdown .dropdown-content div:hover {
    background-color: #f1f1f1;
}
#customDropdown.dropdown .dropdown-content img {
    margin-right: 8px;
}
@media(min-width:992px){
    .border-only{
        position:relative;
    }
    .border-only::after{
        content:"";
        position:absolute;
        background-color: #dedede;
        width:1px;
        inset:20% auto 20% 0;
    }
}







.progress-bar-container {
    display: flex;
    justify-content: space-between;
    position: relative;
    margin-bottom: 30px;
    flex-wrap: wrap;
}

.progress-bar-container .progress-bar {
    position: absolute;
    top: 20%;
    left: 4%;
    right: 4%;
    height: 4px;
    background: #e0e0e0;
    transform: translateY(-50%);
    z-index: 1;
}

.progress-bar-container .progress-bar-fill {
    height: 100%;
    background:var(--theme-color);
    width: 0%;
    transition: width 0.3s ease;
}

.progress-bar-container .step-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 2;
}

.progress-bar-container .step {
    background: #e0e0e0;
    border-radius: 50%;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    color: #666;
    margin-bottom: 5px;
}

.progress-bar-container .step.active {
    background: #4caf50;
    color: #fff;
}

.progress-bar-container .step-label {
    font-size: 12px;
    text-align: center;
    max-width: 80px;
    font-weight:500;
}

@media (min-width:577px){
    .progress-bar-container .step-container {
        width: 85px;
    }
}
@media(max-width:991px){
    #heroSection{
        margin-top:59px
    }
}
@media(max-width:576px) {
    .progress-bar-container .step-label {
        display: none;
    }

    .progress-bar-container .progress-bar {
        top: 43%;
    }
}


/* margin - 10px css class */
@media(min-width:992px){
    .m-n1{
        margin:-10px !important;
    }
}



.sticky-button {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    font-size: 18px;
    border: none;
    cursor: pointer;
    box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    transition: transform 0.5s ease, box-shadow 0.5s ease;
    transform: translateY(100%);
    border-radius: 0;
    
}

.sticky-button.visible {
    transform: translateY(0);
    box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.3);
    animation-name: customPulse; /* Use the custom animation */
        animation-duration: 1.8s; /* Set the animation duration */
        animation-timing-function: ease-in-out; /* Smooth transition */
        animation-delay: 1s; /* Delay before animation starts */
        animation-iteration-count: infinite; /* Repeat the animation infinitely */
}


.click-emoji {
    position: relative;
}

.click-emoji::after {
    content: "";
    position:absolute;
    inset:0 0 0 auto;
    background: url(../../hand-finger-clipart-sm.png);
    background-size:contain;
    width:30px;
    background-repeat: no-repeat;
    background-position: center;
    animation: frontend 1s infinite ease-in-out;
}
@keyframes frontend {
    0% {
    transform: translateX(0);
}
50% {
    transform: translateX(-18px);
}
100% {
    transform: translateX(0);
}
}



@media(max-width:991px){
    .offcanvas-body{
        display:flex;
        flex-direction:column;
    }
    .usermlg{
        flex-grow:1;
        height:100%;
        align-content: end !important;
    }
    .usermlg a{
        aspect-ratio:auto !important;
        width:100%;
        border-radius:4px !important;
    }
    .mobile-nav .dropdown-menu{
        position: static !important;
        transform: translate(0px) !important;
    }
}



@keyframes fadeZoomIn {
    0% {
        opacity: 0;
        transform: scale(0);
    }

    50% {
        opacity:1;
        transform: scale(1);
    }

    100% {
        opacity: 0.5;
        transform: scale(2);
    }
}
@keyframes customPulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.08); /* Scale up */
    }
    100% {
        transform: scale(1); /* Scale back to normal */
    }
}

.loader-ras {
    animation: fadeZoomIn 6s infinite;
    display: inline-block;
    width: 100px;
    height: auto;
}

.gst-inc{
    font-size:0.7rem;
    margin-left:0.1rem;
}

.brochure-btn{
    background-color: #ff2116;
    color:#fff;
    padding: 0.28rem 0.8rem;
    border-radius: 0.4rem;
}
.brochure-btn:hover{
    color:#fff;
}


section.sldr {
    display: grid;
    place-items: center;
}

section.sldr .slider {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 97%;
    overflow: hidden;
    /* background: rgb(255, 255, 255);
                        border-radius: 16px;
                        box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
                        backdrop-filter: blur(7.4px);
                        -webkit-backdrop-filter: blur(7.4px);
                        border: 1px solid rgba(255, 255, 255, 0.4); */
}

section.sldr .slider-items {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 20px;
    animation: scrolling 48s linear infinite;

}

@keyframes scrolling {

    0% {
        transform: translateX(80%);
    }

    100% {
        transform: translateX(-20%);
    }
}

section.sldr .slider-items img {
    width: 12%;
    margin: 20px 30px;
    max-height: 60px;
}
@media(max-width:576px){
    section.sldr .slider-items img {
        margin: 12px 15px;
        max-height: 30px;
    }
}


#wheelDiv {
    width: 100%;
    aspect-ratio: 1;
}

.content-tab {
    display: none;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
    transition: transform 0.3s ease, opacity 0.3s ease;
}

.content-tab.active {
    display: block;
    transform: scale(1.05);
    opacity: 1;
}

.content-tab p {
    text-align: justify;
}

#wheelnav-wheelDiv-slice-0 {
    fill: url(#pattern-0);
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-1 {
    fill: url(#pattern-1);
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-2 {
    fill: url(#pattern-2);
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-3 {
    fill: url(#pattern-3);
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-4 {
    fill: url(#pattern-4);
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-5 {
    fill: url(#pattern-5);
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-0:hover {
    fill: url(#pattern-0) !important;
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-1:hover {
    fill: url(#pattern-1) !important;
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-2:hover {
    fill: url(#pattern-2) !important;
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-3:hover {
    fill: url(#pattern-3) !important;
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-4:hover {
    fill: url(#pattern-4) !important;
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-slice-5:hover {
    fill: url(#pattern-5) !important;
    fill-opacity: 1 !important;
}

#wheelnav-wheelDiv-title-0,
#wheelnav-wheelDiv-title-1,
#wheelnav-wheelDiv-title-2,
#wheelnav-wheelDiv-title-3,
#wheelnav-wheelDiv-title-4,
#wheelnav-wheelDiv-title-5 {
    font: 600 13px Arial !important;
    fill: #ffffff !important;
    /* fill:#bee795 !important; */
}

#wheelnav-wheelDiv-title-0:hover,
#wheelnav-wheelDiv-title-1:hover,
#wheelnav-wheelDiv-title-2:hover,
#wheelnav-wheelDiv-title-3:hover,
#wheelnav-wheelDiv-title-4:hover,
#wheelnav-wheelDiv-title-5:hover {
    font: 600 13px Arial !important;
    color: #ffffff !important;
    fill: #ffffff !important;
    /* fill:#bee795 !important; */
}

#heroSection .owl-nav {
    display: none;
}

#heroSection .owl-dots {
    display: none;
}

.mission-vision-section {
    padding: 50px 0;
    background: #fdf3e0;
}

#aboutSection .container {
    max-width: 1200px;
    margin: 0 auto;
}

#aboutSection .row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
}