/* <!-- Bootstrap CSS Start -->*/


@import url('https://fonts.googleapis.com/css2?family=Albert+Sans:ital,wght@0,100..900;1,100..900&display=swap');

/*    @import url('https://fonts.googleapis.com/css?family=Raleway');*/
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');

@import url('https://use.fontawesome.com/releases/v5.0.12/css/all.css');



/* <!-- Bootstrap CSS End-->*/
/* <!-- Scrollbar Custom CSS -->*/


@import url('https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css');
@import url('https://cdn.jsdelivr.net/npm/bootstrap-icons@1.3.0/font/bootstrap-icons.css');
@import url('https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js');
/*@import url('https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js');*/
@import url('https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js');
@import url('https://cdn.jsdelivr.net/npm/bootstrap@4.1.3/dist/js/bootstrap.min.js');
@import url('https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.5/jquery.mCustomScrollbar.min.css');
@import url('https://cdn.jsdelivr.net/npm/material-icons@1.13.12/iconfont/material-icons.min.css');


html,
body {
    height: 100%;
    /*
    font-family: "Albert Sans", sans-serif;
    !important;
    */
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
    font-size: 14px;
    font-weight: 100, 200, 300, 400, 500, 600, 700, 800, 900;
    color: #111;
    letter-spacing: 0.3px;
}

/*//CRF-2407-sankor-261013 Start*/
.field-validation-error {
    display: block;
    margin-top: 5px;
    color: #dc3545;
    font-size: 13px;
    line-height: 1.4;
}

.field-validation-invalid {
    border-color: #dc3545 !important;
}


    .field-validation-invalid:focus {
        border-color: #dc3545 !important;
        box-shadow: 0 0 0 0.15rem rgba(220, 53, 69, 0.15) !important;
    }

.iti {
    width: 100%;
}


    .iti input {
        width: 100%;
    }


    .iti + .field-validation-error {
        display: block;
        width: 100%;
        margin-top: 5px;
    }
/*//CRF-2407-sankor-261013 End*/

/*CRF-2575 aksnap-16-10-2026—Start*/
/*LOCATION SELECTOR*/
.location-selector {
    position: relative;
}

.location-selector-btn {
    height: 46px;
    min-width: 220px;
    display: flex;
    align-items: center;
    padding: 5px 12px;
    background: #fff;
    border: 2px solid #ff943a;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .location-selector-btn:hover {
        border-color: #0d6efd;
        background: #fafcff;
    }

    .location-selector-btn > i:first-child {
        font-size: 17px;
        margin-right: 9px;
    }

    .location-selector-btn > span {
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        line-height: 1.2;
    }

    .location-selector-btn small {
        font-size: 10px;
        color: #777;
        margin-bottom: 2px;
    }

    .location-selector-btn strong {
        font-size: 13px;
        font-weight: 500;
        color: #222;
    }

.location-arrow {
    font-size: 10px;
    color: #777;
    margin-left: 8px;
}


/* =========================================
LOCATION MODAL
========================================= */

.location-modal .modal-dialog {
    max-width: 500px;
}

.location-modal .modal-content {
    position: relative;
    border: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 15px 50px rgba(0, 0, 0, 0.18);
}


/* Close */

.location-close {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    background: #f5f6f8;
    color: #555;
    cursor: pointer;
    z-index: 5;
}

    .location-close:hover {
        background: #e9ecef;
    }


/* =========================================
MODAL HEADER
========================================= */

.location-modal-header {
    text-align: center;
    padding: 32px 40px 20px;
}

.location-message {
    margin-left: 31px;
}

.selected-location-label {
    margin-left: 31px;
}

.location-modal-icon {
    width: 48px;
    height: 48px;
    margin: 0 auto 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #eef6ff;
    color: #0d6efd;
    font-size: 20px;
}

.location-modal-header h4 {
    margin: 0;
    font-size: 21px;
    font-weight: 600;
    color: #222;
}

.location-modal-header p {
    margin: 8px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: #777;
}


/* =========================================
SEARCH
========================================= */

.location-modal-search {
    position: relative;
    margin: 0 30px 15px;
}

    .location-modal-search i {
        position: absolute;
        left: 15px;
        top: 13px;
        color: #999;
        font-size: 14px;
        z-index: 2;
    }

    .location-modal-search input {
        height: 44px;
        padding-left: 40px;
        border: 1px solid #dfe3e8;
        border-radius: 6px;
        font-size: 13px;
    }

        .location-modal-search input:focus {
            border-color: #0d6efd;
            box-shadow: 0 0 0 2px rgba(13, 110, 253, 0.08);
        }


/* =========================================
CURRENT LOCATION
========================================= */

.current-location-btn {
    width: calc(100% - 60px);
    margin: 0 30px;
    padding: 13px 0;
    display: flex;
    align-items: center;
    text-align: left;
    background: transparent;
    border: 0;
    border-bottom: 1px solid #eee;
    cursor: pointer;
}

.current-location-icon {
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    border-radius: 5px;
    background: #f0f7ff;
    color: #0d6efd;
}

.current-location-text {
    flex: 1;
    display: flex;
    flex-direction: column;
}

    .current-location-text strong {
        font-size: 13px;
        font-weight: 500;
        color: #222;
    }

    .current-location-text small {
        margin-top: 2px;
        font-size: 11px;
        color: #888;
    }

.current-location-btn > i {
    font-size: 11px;
    color: #aaa;
}


/* =========================================
POPULAR LOCATIONS
========================================= */

.popular-location-section {
    padding: 20px 30px 15px;
}

    .popular-location-section h6 {
        margin-bottom: 12px;
        font-size: 13px;
        font-weight: 600;
        color: #444;
    }

.location-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.city-option {
    display: flex;
    align-items: center;
    padding: 11px 12px;
    border: 1px solid #e8ebef;
    border-radius: 5px;
    background: #fff;
    text-align: left;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .city-option:hover {
        background: #f7faff;
        border-color: #0d6efd;
    }

    .city-option i {
        margin-right: 9px;
        color: #0d6efd;
        font-size: 13px;
    }

    .city-option span {
        font-size: 12px;
        color: #333;
    }


/* =========================================
FOOTER
========================================= */

.location-modal-footer {
    padding: 12px 30px;
    background: #f8f9fa;
    border-top: 1px solid #eee;
}

    .location-modal-footer span {
        font-size: 11px;
        color: #888;
    }

    .location-modal-footer i {
        margin-right: 4px;
    }


/* =========================================
MOBILE
========================================= */

@media (max-width: 575.98px) {

    .location-modal .modal-dialog {
        margin: 15px;
    }

    .location-modal-header {
        padding: 28px 25px 18px;
    }

        .location-modal-header h4 {
            font-size: 19px;
        }

    .location-modal-search {
        margin-left: 20px;
        margin-right: 20px;
    }

    .current-location-btn {
        width: calc(100% - 40px);
        margin-left: 20px;
        margin-right: 20px;
    }

    .popular-location-section {
        padding-left: 20px;
        padding-right: 20px;
    }

    .location-modal-footer {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.filter-chip.active {
    background: #f25c26;
    border-color: #f28c28;
    color: #fff;
}

.filter-chip:hover {
    border-color: #f28c28;
    background: #fffaf5;
    color: #e4770b;
}





/*CRF-XXXX aksnap-15-10-2026—Start*/
/* LOCATION SEARCH RESULTS */
#locationSearchResults {
    margin: 0 20px 12px;
}

#locationMessage {
    margin: 0 30px 8px;
    font-size: 13px;
    line-height: 1.5;
    color: #444;
}

.search-location-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

    .search-location-grid .location-result {
        width: 100%;
        min-width: 0;
        min-height: 48px;
        display: flex;
        align-items: center;
        gap: 9px;
        padding: 10px 12px;
        border: 1px solid #e8ebef;
        border-radius: 5px;
        background: #fff;
        color: #333;
        font-family: inherit;
        font-size: 12px;
        font-weight: 400;
        line-height: 1.5;
        text-align: left;
        cursor: pointer;
        transition: background-color 0.2s ease, border-color 0.2s ease;
    }

        .search-location-grid .location-result i {
            flex: 0 0 auto;
            margin: 0;
            color: #0d6efd;
            font-size: 13px;
        }

        .search-location-grid .location-result span {
            min-width: 0;
            overflow-wrap: anywhere;
        }

        .search-location-grid .location-result:hover {
            background: #f7faff;
            border-color: #0d6efd;
        }

        .search-location-grid .location-result:focus-visible {
            outline: 2px solid #0d6efd;
            outline-offset: 2px;
        }

@media (max-width: 575.98px) {
    #locationSearchResults {
        margin-left: 20px;
        margin-right: 20px;
    }

    #locationMessage {
        margin-left: 20px;
        margin-right: 20px;
    }

    .search-location-grid {
        grid-template-columns: 1fr;
    }
}

/*CRF-2575 aksnap-16-10-2026—End*/

.navbar-light .navbar-nav .nav-link {
    color: rgb(0, 0, 0);
}

.mirror {
    transform: scalex(-1);
}

buttton:focus {
    outline: none !important;
}

.faicons-position {
    rotate: 90deg;
}


.modal-content {
    border-radius: 15px;
    outline: 0;
}


/** BEGIN CSS NEEDED FOR SWITCH **/
.on-off-toggle {
    width: 53px;
    height: 24px;
    position: relative;
    display: inline-block;
}

.on-off-toggle__slider {
    width: 53px;
    height: 24px;
    display: block;
    border-radius: 34px;
    background-color: #d8d8d8;
    transition: background-color 0.4s;

    &:before {
        content: '';
        display: block;
        background-color: #fff;
        box-shadow: 0 0 0 1px #949494;
        bottom: 3px;
        height: 18px;
        left: 0px;
        position: absolute;
        transition: .4s;
        width: 18px;
        z-index: 5;
        border-radius: 100%;
    }

    &:after {
        display: block;
        line-height: 24px;
        text-transform: uppercase;
        font-size: 10px;
        font-weight: bold;
        content: 'NO';
        color: #484848;
        padding-left: 26px;
        transition: all 0.4s;
        left: 3px;
    }
}

.on-off-toggle__input {
    /*
    This way of hiding the default input is better 
    for accessibility than using display: none;
    */
    position: absolute;
    opacity: 0;
}

    .on-off-toggle__input:checked +
    .on-off-toggle__slider {
        background-color: #096ed5;

        &:before {
            transform: translateX(32px);
        }

        &:after {
            content: 'Yes';
            color: #FFFFFF;
            padding-left: 8px;
        }
    }

/*** END CSS NEEDED FOR SWITCH **/


.ticket-border {
    border: 2px solid #e0e0e0;
    border-style: dashed;
    "
}



.homepage-prompt-glow-shell {
    background: conic-gradient(from var(--homepage-prompt-glow-angle) at 50% 50%, #eaeaeb 0deg, #eaeaeb 69deg, #4285f4b3 115deg, #1aa64aa6 193deg, #eaeaeb 270deg, #fcbd00a6 291deg, #db372da6 322deg, #eaeaeb 1turn);
    animation: homepage-prompt-rotate-glow 4s linear infinite;
}



/*login css start*/

.carousel-indicators {
    bottom: 13px !important;
}

    .carousel-indicators li {
        width: 8px !important;
        height: 8px !important;
        border-radius: 50% !important;
        background: #d2d2d2 !important;
        opacity: 1 !important;
    }

    .carousel-indicators .active {
        width: 28px !important;
        border-radius: 10px !important;
        background: #3ba8ff !important;
    }


.log-bg {
    position: relative;
    overflow: hidden;
    z-index: 90;
    background-image: url('../images/publicwebsiteimages/log-bg.png');
    border-radius: 0px 0px 100px 100px;
    background-size: cover;
}

/*login css end*/


/*login css 2026 start*/
/* Full page wrapper */
.login-wrapper {
    min-height: 100vh;
    background: #f5f7fb;
}

.login-row {
    min-height: 100vh;
}

/* Left slider section */
.login-left {
    background: #F6ECFA;
    position: relative;
    overflow: hidden;
}

.login-left-content {
    padding: 50px 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.login-logo {
    width: 220px;
}

.login-slide-title {
    font-size: 30px;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 20px;
}

.carousel-indicators {
    bottom: -35px;
}

    .carousel-indicators li {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background: rgba(255,255,255,0.5);
    }

    .carousel-indicators .active {
        background: #ff8c00;
    }

.tile-corner-image {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 80px;
    opacity: 0.15;
}

/* Right login section */
.login-right {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 30px;
    background: #fff;
}

.login-card {
    width: 100%;
    max-width: 520px;
}

.login-form-wrapper {
    padding: 20px 0;
}

.label-text {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.login-input {
    height: 52px;
    border-radius: 10px;
    border: 1px solid #d9d9d9;
    padding: 12px 16px;
    font-size: 15px;
    transition: all 0.3s ease;
}

    .login-input:focus {
        border-color: #2b2d7c;
        box-shadow: 0 0 0 0.2rem rgba(43,45,124,0.15);
    }

.otp-input {
    letter-spacing: 3px;
    font-weight: 600;
}

.verification-info {
    font-size: 14px;
    color: #666;
}

.btn-login {
    height: 52px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    background: #2b2d7c;
    border: none;
}

    .btn-login:hover {
        background: #1f215f;
    }

/* Responsive */
@media (max-width: 991.98px) {
    .login-right {
        padding: 20px;
    }

    .login-card {
        max-width: 100%;
    }
}


/*login css 2026 end*/


/*price-page tab button start*/

.login-wrapper {
    display: flex;
    height: 100dvh;
    background: #fff;
}

/* Container */
.tab-wrapper {
    display: inline-flex;
    background: #fff;
    border: 1px solid #d9d9d9;
    border-radius: 50px;
    padding: 6px;
    gap: 6px;
}

/* Buttons */
.tab-btn {
    min-width: 125px;
    padding: 10px 20px;
    border: none;
    background: transparent;
    color: #111;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    border-radius: 50px;
    transition: all .3s ease;
}

    /* Active Tab */
    .tab-btn.active {
        background: #f25c26;
        color: #fff;
        border: 1px solid #f25c26 !important;
    }

    /* Hover */
    .tab-btn:hover:not(.active) {
        background: #f5f5f5;
    }

/* Responsive */
@media (max-width: 576px) {
    .tab-wrapper {
        width: 100%;
    }

    .tab-btn {
        flex: 1;
        min-width: auto;
        font-size: 16px;
        padding: 14px 10px;
    }
}


/*price-page tab button end*/

.org-image {
    width: 660px;
}


/*advertise popup css start*/

.s-dialog {
    position: absolute;
    top: auto;
    right: auto;
    left: 10px;
    bottom: 0;
    z-index: 1000;
}

.s-content {
    box-shadow: 0 5px 15px rgba(0,0,0,0);
    background-color: #096ed5;
    border: 1px solid #096ed5;
    text-align: center;
    color: #ffffff;
    border-radius: 20px;
}

.s-header, .s-body {
    border-bottom: 0 none;
}

.close-btn {
    color: #ffffff;
    opacity: 1;
    outline: #096ed5;
    font-weight: 200;
}

    .close-btn:hover {
        color: #ffffff !important;
        outline: #16aec3;
    }

.learn-link {
    display: inline-block;
    margin: 18px;
    background-color: #ffffff;
    color: #096ed5 !important;
    font-weight: 500;
    font-size: 16px;
    padding: 8px 20px;
    line-height: 20px;
    cursor: pointer;
    border-radius: 19px;
}

.modal.fade .s-dialog {
    transform: translate3d(0, 100vh, 0);
}

.modal.in .s-dialog {
    transform: translate3d(0, 0, 0);
}

.modal-backdrop.in {
    opacity: 0;
}

/*advertise popup css end*/

.tile-corner-image {
    position: absolute;
    right: 3px;
    top: 3px;
    rotate: -91deg;
    opacity: 50%;
}

/*subscribe now section*/
input[type="email"] {
    display: inline-block;
    width: 50%;
    padding: 18px 36px;
    margin: 8px 0;
    border: 1px solid #096ed5;
    box-sizing: border-box;
    height: 55px;
    margin-top: 18px;
    border-radius: 50px;
    border: none;
    box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.06);
}

input,
input::-webkit-input-placeholder {
    font-size: 16px;
    line-height: 3;
}

.bt {
    margin-left: -158px;
    font-size: 15px;
    display: inline-block;
    font-weight: 600;
    padding: 10px 41px;
    border-radius: 50px;
    /* Only necessary for .btn */
    border: none;
    cursor: pointer;
    background-color: #096ed5;
    color: #fff;
}


/* =====================================================
SUBSCRIBE INPUT + BUTTON RESPONSIVE
Existing HTML/classes unchanged
===================================================== */

/* Desktop */
@media (min-width: 1200px) {

    .event-solution-card form {
        position: relative;
        width: 100%;
        max-width: 650px;
        margin: 0 auto;
    }

        .event-solution-card form input[type="email"] {
            width: 100%;
            height: 55px;
            padding: 0 180px 0 36px;
            margin: 18px 0 0;
            box-sizing: border-box;
        }

        .event-solution-card form .bt {
            position: absolute;
            right: 5px;
            top: 22px;
            height: 47px;
            margin: 0;
            padding: 10px 35px;
            border-radius: 50px;
            white-space: nowrap;
        }
}


/* =====================================================
LAPTOP
992px - 1199px
===================================================== */

@media (min-width: 992px) and (max-width: 1199px) {

    .event-solution-card form {
        position: relative;
        width: 90%;
        max-width: 600px;
        margin: 0 auto;
    }

        .event-solution-card form input[type="email"] {
            width: 100%;
            height: 55px;
            padding: 0 165px 0 30px;
            margin: 18px 0 0;
            box-sizing: border-box;
        }

        .event-solution-card form .bt {
            position: absolute;
            right: 5px;
            top: 18px;
            height: 47px;
            margin: 0;
            padding: 10px 28px;
            white-space: nowrap;
        }
}


/* =====================================================
TABLET
768px - 991px
===================================================== */

@media (min-width: 768px) and (max-width: 991px) {

    .event-solution-card form {
        position: relative;
        width: 90%;
        max-width: 550px;
        margin: 0 auto;
    }

        .event-solution-card form input[type="email"] {
            width: 100%;
            height: 52px;
            padding: 0 150px 0 25px;
            margin: 18px 0 0;
            box-sizing: border-box;
        }

        .event-solution-card form .bt {
            position: absolute;
            right: 4px;
            top: 18px;
            height: 44px;
            margin: 0;
            padding: 8px 24px;
            font-size: 14px;
            white-space: nowrap;
        }
}


/* =====================================================
LARGE MOBILE
576px - 767px
===================================================== */

@media (min-width: 576px) and (max-width: 767px) {

    .event-solution-card form {
        width: 100%;
        max-width: 500px;
        margin: 0 auto;
    }

        .event-solution-card form input[type="email"] {
            width: 100%;
            height: 52px;
            padding: 0 20px;
            margin: 15px 0 10px;
            box-sizing: border-box;
        }

        .event-solution-card form .bt {
            position: static;
            display: block;
            width: 100%;
            height: 50px;
            margin: 0;
            padding: 10px 20px;
            font-size: 14px;
        }
}


/* =====================================================
MOBILE
375px - 575px
===================================================== */

@media (min-width: 375px) and (max-width: 575px) {

    .event-solution-card form {
        width: 100%;
        margin: 0 auto;
    }

        .event-solution-card form input[type="email"] {
            display: block;
            width: 100%;
            height: 50px;
            padding: 0 20px;
            margin: 15px 0 10px;
            box-sizing: border-box;
            font-size: 14px;
        }

        .event-solution-card form .bt {
            position: static;
            display: block;
            width: 100%;
            height: 50px;
            margin: 0;
            padding: 10px 20px;
            font-size: 14px;
            border-radius: 50px;
        }
}


/* =====================================================
SMALL MOBILE
320px - 374px
===================================================== */

@media (max-width: 374px) {

    .event-solution-card form {
        width: 100%;
        margin: 0 auto;
    }

        .event-solution-card form input[type="email"] {
            display: block;
            width: 100%;
            height: 48px;
            padding: 0 16px;
            margin: 12px 0 9px;
            box-sizing: border-box;
            font-size: 13px;
        }

        .event-solution-card form .bt {
            position: static;
            display: block;
            width: 100%;
            height: 48px;
            margin: 0;
            padding: 8px 15px;
            font-size: 13px;
        }
}


/*subscribe now section end*/


.image-icon-ft {
    height: 60px !important;
    vertical-align: text-top;
    margin-right: 5px;
    background-color: #fff;
    padding: 7px;
    border-radius: 50px;
}

.ic-shadow {
    box-shadow: 0 14px 35px 0 rgba(0, 0, 0, 0.1);
}

.icon-ani {
    animation: float 3s ease-in-out infinite;
}

.icon-ani1 {
    animation: float 4s infinite;
}

@keyframes float {
    0% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-20px);
    }

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


/*
position: absolute;
right: 714px;
*/


.icon-1-event {
    position: relative;
    bottom: 71px;
    left: 321px;
    animation-duration: 4.2s
}


.icon-2-event {
    position: relative;
    bottom: 130px;
    left: 321px;
}


.icon-3-event {
    position: relative;
    bottom: 169px;
    left: 335px;
}


.icon-4-event {
    position: relative;
    bottom: 169px;
    left: 353px;
}


.icon-5-event {
    position: relative;
    bottom: 130px;
    left: 365px;
}

.icon-6-event {
    position: relative;
    bottom: 74px;
    left: 362px;
}

.world-circle {
    bottom: 0px;
    right: 39%;
    background: url(../Images/PublicWebsiteImages/world.png) no-repeat bottom !important;
}

.world-circle1 {
    background: url(../Images/PublicWebsiteImages/world.png) no-repeat bottom !important;
}


/*App-sec-start*/
/* ============================================================
TESTS / EVENT APP SECTION
Bootstrap 4.3 compatible
Existing HTML/classes preserved
============================================================ */


/* ------------------------------------------------------------
BASE RESET
------------------------------------------------------------ */

.tests,
.tests * {
    box-sizing: border-box;
}

.tests {
    width: 100%;
    overflow: hidden;
    background: #EAF2FF;
}

    .tests .inner {
        width: 100%;
        max-width: 100%;
        height: 300px;
        display: flex;
        flex-direction: row;
        position: relative;
        margin: 0 auto;
    }

        .tests .inner .tests__section {
            position: relative;
            width: 50%;
            height: 300px;
            min-width: 0;
            padding-top: 0;
            padding-bottom: 20px;
        }


            /* ------------------------------------------------------------
LEFT SECTION - ORGANIZERS
------------------------------------------------------------ */

            .tests .inner .tests__section:first-child {
                width: 50%;
                padding-left: clamp(30px, 6.4vw, 98px);
                padding-right: 220px;
                position: relative;
                z-index: 2;
                background: #EAF2FF;
            }


            /* ------------------------------------------------------------
RIGHT SECTION - ATTENDEES
------------------------------------------------------------ */

            .tests .inner .tests__section:nth-child(2) {
                width: 50%;
                position: relative;
                right: auto;
                padding-left: clamp(40px, 8.5vw, 130px);
                padding-right: 220px;
                z-index: 2;
                background: linear-gradient( 293deg, #FCEEDA 86%, transparent 86% );
            }


            /* ------------------------------------------------------------
CONTENT
------------------------------------------------------------ */

            .tests .inner .tests__section h5,
            .tests .inner .tests__section h3,
            .tests .inner .tests__section p {
                position: relative;
                z-index: 5;
            }

            .tests .inner .tests__section h5 {
                margin-top: 8px;
            }

            .tests .inner .tests__section h3 {
                line-height: 1.2;
            }

            .tests .inner .tests__section p {
                line-height: 1.5;
            }


    /* ------------------------------------------------------------
IMAGE
------------------------------------------------------------ */

    .tests .tests__img {
        position: absolute;
        right: 0;
        bottom: 0;
        z-index: 3;
        width: auto;
        max-width: 42%;
    }

    .tests .inner .tests__section:nth-child(2) .tests__img {
        right: 10px;
    }

    .tests .tests__img img {
        display: block;
        position: relative;
        top: 5px;
        width: auto;
        max-width: 100%;
        height: auto;
    }


    /* ------------------------------------------------------------
APP STORE BUTTONS
------------------------------------------------------------ */

    .tests .app-icon {
        display: inline-block;
        width: auto;
        max-width: 145px;
        height: auto;
        vertical-align: middle;
    }

    .tests .inner .tests__section a {
        position: relative;
        z-index: 10;
    }

    .tests .inner .tests__section .text-justify {
        position: relative;
        z-index: 10;
    }


/* ============================================================
EXTRA LARGE DESKTOP
1600px+
============================================================ */

@media (min-width: 1600px) {

    .tests .inner {
        height: 300px;
    }

        .tests .inner .tests__section {
            height: 300px;
        }

            .tests .inner .tests__section:first-child {
                padding-left: 98px;
                padding-right: 250px;
            }

            .tests .inner .tests__section:nth-child(2) {
                padding-left: 130px;
                padding-right: 250px;
            }

    .tests .tests__img {
        max-width: 40%;
    }
}


/* ============================================================
DESKTOP
1200px - 1599px
============================================================ */

@media (min-width: 1200px) and (max-width: 1599px) {

    .tests .inner {
        height: 300px;
    }

        .tests .inner .tests__section {
            height: 300px;
        }

            .tests .inner .tests__section:first-child {
                padding-left: 6vw;
                padding-right: 190px;
            }

            .tests .inner .tests__section:nth-child(2) {
                padding-left: 8vw;
                padding-right: 190px;
            }

    .tests .tests__img {
        max-width: 35%;
    }
}


/* ============================================================
SMALL DESKTOP / LARGE TABLET
992px - 1199px
============================================================ */

@media (min-width: 992px) and (max-width: 1199px) {

    .tests .inner {
        height: 300px;
        display: flex;
        flex-direction: row;
    }

        .tests .inner .tests__section,
        .tests .inner .tests__section:first-child,
        .tests .inner .tests__section:nth-child(2) {
            width: 50%;
            height: 300px;
            float: none;
            position: relative;
            padding-top: 0;
            padding-bottom: 15px;
        }


            /* Left */
            .tests .inner .tests__section:first-child {
                padding-left: 40px;
                padding-right: 150px;
                background: #EAF2FF;
            }


            /* Right */
            .tests .inner .tests__section:nth-child(2) {
                padding-left: 55px;
                padding-right: 150px;
                right: auto;
                background: linear-gradient( 293deg, #FCEEDA 82%, transparent 82% );
            }


    /* Images */
    .tests .tests__img {
        max-width: 31%;
    }

    .tests .inner .tests__section:nth-child(2) .tests__img {
        right: 5px;
    }


    /* Text */
    .tests .inner .tests__section h3 {
        font-size: 25px;
    }

    .tests .inner .tests__section p {
        font-size: 14px;
    }

    .tests .app-icon {
        max-width: 125px;
    }
}


/* ============================================================
TABLET LANDSCAPE
768px - 991px
============================================================ */

@media (min-width: 768px) and (max-width: 991px) {

    .tests {
        overflow: hidden;
    }

        .tests .inner {
            height: 300px;
            display: flex;
            flex-direction: row;
        }


            .tests .inner .tests__section,
            .tests .inner .tests__section:first-child,
            .tests .inner .tests__section:nth-child(2) {
                width: 50%;
                height: 300px;
                float: none;
                position: relative;
                padding-top: 0;
                padding-bottom: 15px;
            }


                /* Left */
                .tests .inner .tests__section:first-child {
                    padding-left: 25px;
                    padding-right: 125px;
                    background: #EAF2FF;
                }


                /* Right */
                .tests .inner .tests__section:nth-child(2) {
                    padding-left: 35px;
                    padding-right: 125px;
                    right: auto;
                    background: #FCEEDA;
                }


        /* Images */
        .tests .tests__img {
            right: 0;
            bottom: 0;
            max-width: 27%;
        }

        .tests .inner .tests__section:nth-child(2) .tests__img {
            right: 0;
        }


        /* Text */
        .tests .inner .tests__section h5 {
            font-size: 15px;
        }

        .tests .inner .tests__section h3 {
            font-size: 21px;
            line-height: 1.2;
        }

        .tests .inner .tests__section p {
            font-size: 13px;
            line-height: 1.45;
        }


            /* Remove desktop forced line breaks visually */
            .tests .inner .tests__section p br {
                display: none;
            }


        /* App buttons */
        .tests .app-icon {
            max-width: 110px;
        }

        .tests .inner .tests__section a {
            margin-right: 5px !important;
        }
}


/* ============================================================
TABLET PORTRAIT / LARGE MOBILE
576px - 767px
============================================================ */

@media (min-width: 576px) and (max-width: 767px) {

    .tests {
        overflow: hidden;
    }

        .tests .inner {
            width: 100%;
            height: auto;
            display: flex;
            flex-direction: column;
        }


            /* BOTH SECTIONS */
            .tests .inner .tests__section,
            .tests .inner .tests__section:first-child,
            .tests .inner .tests__section:nth-child(2) {
                width: 100%;
                height: auto;
                min-height: 350px;
                float: none;
                position: relative;
                right: auto;
                padding-top: 30px;
                padding-bottom: 35px;
                padding-left: 35px;
                padding-right: 190px;
            }


                /* Organizer */
                .tests .inner .tests__section:first-child {
                    background: #EAF2FF;
                    order: 1;
                }


                /* Attendee */
                .tests .inner .tests__section:nth-child(2) {
                    background: #FCEEDA;
                    order: 2;
                }


        /* Images */
        .tests .tests__img {
            position: absolute;
            right: 15px;
            bottom: 0;
            max-width: 30%;
        }


        .tests .inner .tests__section:nth-child(2) .tests__img {
            right: 15px;
        }


        /* Headings */
        .tests .inner .tests__section h3 {
            font-size: 23px;
            line-height: 1.25;
            margin-bottom: 12px;
        }


        .tests .inner .tests__section h5 {
            font-size: 15px;
        }


        /* Paragraph */
        .tests .inner .tests__section p {
            font-size: 14px;
            line-height: 1.5;
        }


            .tests .inner .tests__section p br {
                display: none;
            }


        /* Buttons */
        .tests .app-icon {
            max-width: 125px;
        }
}


/* ============================================================
MOBILE
375px - 575px
============================================================ */

@media (min-width: 375px) and (max-width: 575px) {

    /*
    Important:
    mobile-hide is often a custom class that hides
    the complete section.
    */
    .tests.mobile-hide {
        display: block !important;
    }


    .tests {
        width: 100%;
        overflow: hidden;
    }


        .tests .inner {
            width: 100%;
            height: auto;
            display: flex;
            flex-direction: column;
        }


            /* BOTH SECTIONS */
            .tests .inner .tests__section,
            .tests .inner .tests__section:first-child,
            .tests .inner .tests__section:nth-child(2) {
                width: 100%;
                height: auto;
                min-height: 430px;
                float: none;
                position: relative;
                right: auto;
                padding-top: 25px;
                padding-bottom: 30px;
                padding-left: 25px;
                padding-right: 155px;
            }


                /* ORGANIZERS */
                .tests .inner .tests__section:first-child {
                    order: 1;
                    background: #EAF2FF;
                }


                /* ATTENDEES */
                .tests .inner .tests__section:nth-child(2) {
                    order: 2;
                    background: #FCEEDA;
                }


        /* Images */
        .tests .tests__img {
            position: absolute;
            right: 0;
            bottom: 0;
            width: auto;
            max-width: 34%;
            z-index: 3;
        }


        .tests .inner .tests__section:nth-child(2) .tests__img {
            right: 0;
        }


        .tests .tests__img img {
            display: block;
            width: 100%;
            max-width: 100%;
            height: auto;
        }


        /* Heading */
        .tests .inner .tests__section h3 {
            font-size: 21px;
            line-height: 1.25;
            margin-bottom: 12px;
        }


        /* Small title */
        .tests .inner .tests__section h5 {
            font-size: 14px;
            line-height: 1.3;
        }


        /* Paragraph */
        .tests .inner .tests__section p {
            font-size: 13px;
            line-height: 1.5;
            margin-bottom: 15px;
        }


            /* Remove desktop <br> */
            .tests .inner .tests__section p br {
                display: none;
            }


        /* App buttons */
        .tests .app-icon {
            max-width: 120px;
            width: auto;
            height: auto;
        }


        .tests .inner .tests__section a {
            margin-right: 5px !important;
        }
}


/* ============================================================
SMALL MOBILE
320px - 374px
============================================================ */

@media (max-width: 374px) {

    .tests.mobile-hide {
        display: block !important;
    }


    .tests {
        width: 100%;
        overflow: hidden;
    }


        .tests .inner {
            width: 100%;
            height: auto;
            display: flex;
            flex-direction: column;
        }


            /* BOTH SECTIONS */
            .tests .inner .tests__section,
            .tests .inner .tests__section:first-child,
            .tests .inner .tests__section:nth-child(2) {
                width: 100%;
                height: auto;
                min-height: 400px;
                float: none;
                position: relative;
                right: auto;
                padding-top: 22px;
                padding-bottom: 25px;
                padding-left: 20px;
                padding-right: 130px;
            }


                /* Organizer */
                .tests .inner .tests__section:first-child {
                    order: 1;
                    background: #EAF2FF;
                }


                /* Attendee */
                .tests .inner .tests__section:nth-child(2) {
                    order: 2;
                    background: #FCEEDA;
                }


        /* Images */
        .tests .tests__img {
            position: absolute;
            right: 0;
            bottom: 0;
            max-width: 32%;
        }


        .tests .inner .tests__section:nth-child(2) .tests__img {
            right: 0;
        }


        /* Small heading */
        .tests .inner .tests__section h5 {
            font-size: 13px;
            line-height: 1.3;
        }


        /* Main heading */
        .tests .inner .tests__section h3 {
            font-size: 19px;
            line-height: 1.25;
            margin-bottom: 10px;
        }


        /* Paragraph */
        .tests .inner .tests__section p {
            font-size: 12px;
            line-height: 1.5;
            margin-bottom: 12px;
        }


            .tests .inner .tests__section p br {
                display: none;
            }


        /* App buttons */
        .tests .app-icon {
            max-width: 105px;
        }

        .tests .inner .tests__section a {
            margin-right: 3px !important;
        }
}


/* ============================================================
VERY SMALL DEVICES
<= 319px
============================================================ */

@media (max-width: 319px) {

    .tests.mobile-hide {
        display: block !important;
    }


    .tests .inner .tests__section,
    .tests .inner .tests__section:first-child,
    .tests .inner .tests__section:nth-child(2) {
        padding-left: 15px;
        padding-right: 105px;
        min-height: 380px;
    }


        .tests .inner .tests__section h3 {
            font-size: 18px;
        }


        .tests .inner .tests__section h5 {
            font-size: 12px;
        }


        .tests .inner .tests__section p {
            font-size: 11px;
        }


    .tests .tests__img {
        max-width: 30%;
    }


    .tests .app-icon {
        max-width: 95px;
    }
}


/* ============================================================
MOBILE LANDSCAPE
============================================================ */

@media (max-width: 767px) and (orientation: landscape) {

    .tests .inner {
        display: flex;
        flex-direction: row;
        height: 300px;
    }


        .tests .inner .tests__section,
        .tests .inner .tests__section:first-child,
        .tests .inner .tests__section:nth-child(2) {
            width: 50%;
            height: 300px;
            min-height: 300px;
            padding-top: 15px;
            padding-bottom: 15px;
            padding-left: 20px;
            padding-right: 105px;
        }


    .tests .tests__img {
        max-width: 25%;
    }


    .tests .inner .tests__section h3 {
        font-size: 18px;
    }


    .tests .inner .tests__section h5 {
        font-size: 12px;
    }


    .tests .inner .tests__section p {
        font-size: 11px;
    }


    .tests .app-icon {
        max-width: 95px;
    }
}


/* ============================================================
PREVENT IMAGE OVERFLOW ON EVERY DEVICE
============================================================ */

.tests img {
    max-width: 100%;
}


/* ============================================================
REMOVE FLOAT SIDE EFFECTS
============================================================ */

.tests .inner .tests__section {
    float: none !important;
}


    /* ============================================================
IMPORTANT OVERRIDE:
SECOND COLUMN MUST NEVER BE ABSOLUTE
============================================================ */

    .tests .inner .tests__section:nth-child(2) {
        position: relative !important;
        right: auto !important;
    }


/* ============================================================
IMPORTANT:
DO NOT HIDE THE ILLUSTRATIONS AT 1178px
============================================================ */

@media (max-width: 1178px) {

    .tests .inner .tests__section img {
        display: block !important;
    }
}

/*Event Solution Section*/

.event-solution-card {
    border-radius: 10px;
    overflow: hidden;
    padding: 30px;
    width: 100%;
    height: 100%;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    flex-direction: column;
    display: flex;
    flex-wrap: wrap;
}


.org-join-card {
    border-radius: 20px;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
    flex-direction: column;
    display: flex;
    flex-wrap: wrap;
}


.step-img {
    width: auto;
    height: 147px;
}

.solution-card-blue {
    background: url(../img/Home/New/solution-card-blue.png);
}


.solution-card-orange {
    background: url(../img/Home/New/solution-card-orange.png);
}


.solution-image {
    border: 20px solid #fff;
    border-radius: 20px;
}


/*Event Solution Section end*/


/* Text Style start */
.typing-wrapper {
    -webkit-background-clip: text;
}

/* Cursor */
.cursor {
    display: inline-block;
    width: 3px;
    height: 50px;
    background: #38bdf8;
    margin-left: 6px;
    animation: blink 0.8s infinite;
    vertical-align: bottom;
}

@keyframes blink {
    0%, 100% {
        opacity: 1;
    }

    50% {
        opacity: 0;
    }
}

/* Text Style start end */


.add-sec {
    background: linear-gradient(90deg, #fcfcfc 0, #fef7d3 76%);
    border-radius: 10px;
    border: 2px solid #f25c26;
}

.tile-new-bg {
    background: url(//www.zohowebstatic.com/sites/zweb/images/dataprep/home/home-whats-new-bg.png) no-repeat -1px, linear-gradient(90deg, #b5e9ff 0, #fef7d3 100%);
    border-radius: 20px;
    /* border: 1px solid #555; */
}

/*shine effect start*/

.shimmer {
    color: grey;
    display: inline-block;
    mask: linear-gradient(-60deg, #000 30%, #0005, #000 70%) right/350% 100%;
    animation: shimmer 2.5s infinite;
    /*  font-size: 50px;*/
    /*    max-width: 200px;*/
}

@keyframes shimmer {
    100% {
        mask-position: left
    }
}

/*shine effect start*/

.bg-n-blue {
    background-color: #EAF2FF;
}

.app-img {
    width: 320px;
}

.bg-n-purple {
    background-color: #F6ECFA;
}

.bg-n-green {
    background-color: #EAF9F0;
}

.bg-n-pink {
    background-color: #fff5f4;
}

.bg-dorange {
    background-color: #f6c683;
}

.bg-offwhite {
    background-color: #f6f6f6;
}


.bg-offyellow {
    background-color: #fff7e8;
}


.bg-offblue {
    background-color: #d5eefd;
}


.mig-stage-num {
    border: 2px solid #000;
    border-radius: 5px;
    font-size: 14px;
    padding: 3px 15px;
    font-family: var(--zf-secondary-semibold);
    margin-bottom: 15px;
    display: inline-block;
}


.top-bg1 {
    position: relative;
    overflow: hidden;
    z-index: 90;
    background-image: url(../img/blue-abstract-gradient-wave-wallpaper.jpg);
    border-radius: 0px 0px 100px 100px;
    background-size: cover;
}

.join-bg {
    position: relative;
    overflow: hidden;
    z-index: 90;
    background-image: url(../img/Home/New/Join_now.png);
    border-radius: 0px 0px 100px 100px;
    background-size: cover;
}


.road-map {
    position: relative;
    overflow: hidden;
    z-index: 90;
    background-image: url(../Images/PublicWebsiteImages/road-map.svg);
    width: 100%;
    background-repeat: no-repeat;
}

.car {
    position: absolute;
    margin-right: 5px;
    top: -52px;
    left: 55px;
}


@keyframes moveFadeLoop {
    0% {
        transform: translateX(-50px);
        opacity: 0;
    }

    20% {
        opacity: 1;
    }

    80% {
        transform: translateX(500px);
        opacity: 1;
    }

    100% {
        transform: translateX(550px);
        opacity: 0;
    }
}

.moving-element {
    animation: moveFadeLoop 3s linear infinite;
}




.home-detail-bg {
    background: linear-gradient(180deg, #dcf7f9 0%, #fff 50%);
}

.home-detail-bg-down {
    background: linear-gradient(360deg, #dcf7f9 0%, #fff 50%);
}

.ft-animated {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    background: #ffffff;
    padding: 9px;
    border-radius: 10px;
    color: #444;
    font-size: 14px;
    font-weight: 500;
    border: 2px solid #eb3c00;
}


.engage-box {
    margin: 25px 5px;
    border-radius: 10px 10px 10px 10px;
    background-color: #fff !important;
    border: 1px solid #a9c7ff !important;
}

    .engage-box:hover {
        margin: 25px 5px;
        border-radius: 10px 10px 10px 10px;
        background-color: #f1f8fd;
        border: 1px solid #a9c7ff !important;
    }

/*button icon animation start*/
.icon {
    font-size: 16px;
    animation: bounce 1.2s infinite ease-in-out;
}

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

    50% {
        transform: translateY(-6px);
    }
}

/*button icon animation end*/

.tile-corner-image {
    position: absolute;
    right: 3px;
    top: 3px;
    rotate: -91deg;
    opacity: 50%;
}



.log-mobile-corner-image {
    position: absolute;
    right: 3px;
    top: 3px;
    rotate: -91deg;
    opacity: 50%;
}




.gradiant-bg-orange {
    background: linear-gradient(90deg, rgba(255, 255, 255, 1) 46%, rgb(255 242 234) 100%) !important;
}

.gradiant-bg-purple {
    background: linear-gradient( 90deg, rgba(255, 255, 255, 1) 46%, rgb(245, 235, 255) 100% ) !important;
}

.gradiant-bg-green {
    background: linear-gradient( 90deg, rgba(255, 255, 255, 1) 46%, rgb(235, 255, 242) 100% )
}

.gradiant-bg-blue {
    background: linear-gradient( 90deg, rgba(255, 255, 255, 1) 46%, rgb(225, 246, 255) 100% )
}


.bg-wave {
    background-image: url(../img/bg-orange-wave.png) !important;
}


.text-shadow {
    text-shadow: 0 1px 3px rgb(0 0 0 / 20%) !important;
}

.new-gred {
    background-image: linear-gradient(120deg, #a1c4fd 0%, #c2e9fb 100%);
}

.event-detail-bg {
    background: linear-gradient(180deg, #f9f4dc 0%, #fff 20%);
}

.org-detail-bg {
    background: linear-gradient(180deg, #cee3ff 0%, #fff 20%);
}

.event-detail-social {
    width: 30px;
}

.box-sticky {
    width: 29%;
    /*    max-width: 360px;*/
    position: sticky;
    margin-top: 0px;
    top: 96px;
    height: max-content;
    transition: top 0.5s;
}



.header-global-line {
    background-color: #f5faff;
    box-shadow: 0 1px 0 0 #f0f7ff;
    height: 24px;
    z-index: 1035;
    position: fixed;
}

/*cookie style start*/

.cookie-alert {
    position: fixed;
    bottom: 15px;
    left: 15px;
    width: 420px;
    margin: 0 !important;
    z-index: 1000;
}

/*cookie style end*/

/*Price plan new css for multiple service*/
/* =========================================
SERVICE SELECTOR
========================================= */
/* Pricing category sticky navigation */
.pricing-tabs-sticky {
    position: sticky;
    top: 82px; /* same height as your header */
    z-index: 1000;
    transition: all 0.3s ease;
}

    /* When sticky is active */
    .pricing-tabs-sticky.is-sticky {
        background: #fff;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
        border-radius: 0 0 12px 12px;
    }

/* Mobile */
@media (max-width: 767px) {
    .pricing-tabs-sticky {
        top: 70px;
    }
}


.pricing-service-selector {
    width: 100%;
    margin: 0px auto 30px;
}

.service-tabs {
    display: flex;
    justify-content: center;
    align-items: stretch;
    max-width: 1050px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #e2e2e2;
    border-radius: 12px;
    padding: 5px;
    box-shadow: 0 3px 12px rgba(0,0,0,.04);
}

.service-tab {
    flex: 1;
    border: 0;
    background: transparent;
    padding: 14px 12px;
    color: #333;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: all .2s ease;
}

    .service-tab:hover {
        background: #fff4ef;
        color: #f15a24;
    }

    .service-tab.active {
        background: #ffece6;
        color: #f25c26;
        /*    box-shadow: 0 3px 8px rgba(241,90,36,.25);*/
    }

.service-icon {
    display: block;
    margin-bottom: 5px;
    font-size: 16px;
}


/* =========================================
BILLING TOGGLE
========================================= */

.billing-toggle-wrap {
    text-align: center;
    margin-bottom: 35px;
}

.billing-toggle {
    display: inline-flex;
    border: 1px solid #ddd;
    border-radius: 40px;
    padding: 5px;
    background: #fff;
}

.billing-option {
    min-width: 145px;
    border: 0;
    background: transparent;
    padding: 12px 25px;
    border-radius: 30px;
    font-weight: 600;
    cursor: pointer;
}

    .billing-option.active {
        background: #f15a24;
        color: #fff;
    }


/* =========================================
PRICING CARD
========================================= */

.pricing-card {
    position: relative;
    height: 100%;
    background: #fff;
    border: 1px solid #e1e1e1;
    border-radius: 16px;
    overflow: hidden;
    transition: all .25s ease;
}

    .pricing-card:hover {
        transform: translateY(-4px);
        box-shadow: 0 12px 35px rgba(0,0,0,.10);
    }

.pricing-card-header {
    text-align: center;
    padding: 28px 20px 22px;
    background: #f7f8fa;
    border-bottom: 1px solid #e5e5e5;
}

    .pricing-card-header h4 {
        margin: 0 0 8px;
        font-size: 18px;
        font-weight: 700;
    }

.price-value {
    font-size: 28px;
    font-weight: 700;
    color: #111;
}

.price-period {
    font-size: 14px;
    color: #666;
}

.plan-type {
    margin-top: 5px;
    color: #f15a24;
    font-size: 14px;
    font-weight: 600;
}


/* =========================================
FEATURES
========================================= */

.pricing-card-body {
    padding: 25px 22px;
}

.pricing-features {
    list-style: none;
    padding: 0;
    margin: 0 0 25px;
}

    .pricing-features li {
        position: relative;
        padding-left: 25px;
        margin-bottom: 14px;
        font-size: 14px;
        line-height: 1.45;
        color: #333;
    }

        .pricing-features li i {
            position: absolute;
            left: 0;
            top: 3px;
            color: #21a957;
        }


/* =========================================
BADGE
========================================= */

.plan-badge {
    position: absolute;
    top: 15px;
    left: 15px;
    padding: 5px 10px;
    border-radius: 20px;
    background: #1683d8;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
}


/* =========================================
MOBILE
========================================= */

@media (max-width: 767px) {

    .service-tabs {
        overflow-x: auto;
        justify-content: flex-start;
        border-radius: 10px;
    }

    .service-tab {
        min-width: 125px;
        flex: 0 0 auto;
    }

    .service-icon {
        display: none;
    }

    .billing-option {
        min-width: 120px;
        padding: 10px 15px;
    }
}

/*Price layout-2 start*/

.pricing-five-column {
    display: flex;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px;
}

    .pricing-five-column .pricing-column {
        width: 20%;
        padding: 10px;
    }

@media (max-width: 1199px) {
    .pricing-five-column .pricing-column {
        width: 33.333%;
    }
}

@media (max-width: 767px) {
    .pricing-five-column .pricing-column {
        width: 100%;
    }
}

.pricing-card-free {
    border: 2px solid #6c63ff;
}

    .pricing-card-free .pricing-card-title {
        color: #6c63ff;
    }

    .pricing-card-free .pricing-btn {
        border-color: #6c63ff;
        color: #6c63ff;
    }

        .pricing-card-free .pricing-btn:hover {
            background: #6c63ff;
            color: #fff;
        }

.pricing-section {
    padding: 80px 0;
}

.section-title {
    text-align: center;
    margin-bottom: 50px;
}

    .section-title h2 {
        font-size: 42px;
        font-weight: 700;
        color: #111;
    }

    .section-title p {
        color: #666;
        font-size: 18px;
    }

.pricing-card {
    background: #fff;
    border-radius: 18px;
    padding: 40px 30px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transition: 0.3s;
    position: relative;
    height: 100%;
}

    .pricing-card:hover {
        transform: translateY(-8px);
    }

    .pricing-card.popular {
        border: 2px solid #6c63ff;
        transform: scale(1.04);
    }

.popular-badge {
    position: absolute;
    top: -15px;
    left: 50%;
    transform: translateX(-50%);
    background: #6c63ff;
    color: #fff;
    padding: 6px 18px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
}

.plan-name {
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 15px;
}

.price {
    font-size: 52px;
    font-weight: 700;
    color: #111;
}

    .price span {
        font-size: 18px;
        color: #666;
    }

.plan-desc {
    color: #777;
    margin: 20px 0;
    min-height: 60px;
}

.feature-list {
    list-style: none;
    padding: 0;
    margin: 30px 0;
}

    .feature-list li {
        padding: 10px 0;
        border-bottom: 1px solid #eee;
        color: #444;
    }

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

.btn-plan {
    width: 100%;
    padding: 14px;
    border-radius: 10px;
    font-weight: 600;
    font-size: 16px;
}

.btn-dark-custom {
    background: #111;
    color: #fff;
}

.btn-primary-custom {
    background: #6c63ff;
    color: #fff;
}

@media(max-width:991px) {

    .pricing-card {
        margin-bottom: 30px;
    }

        .pricing-card.popular {
            transform: none;
        }
}

/*Price plan layou2 end*/

.pricing-options_table tbody td:hover {
    background: #f8fbff;
}

.pricing-options_table::-webkit-scrollbar {
    display: none;
}

.pricing-options_table thead th {
    transition: box-shadow .3s;
}

.pricing-options_table.scrolled thead th {
    box-shadow: 0 4px 12px rgba(0,0,0,.12);
}

.pricing-options_table {
    max-height: 650px; /* Adjust as needed */
    overflow: auto;
    position: relative;
}

    .pricing-options_table table {
        border-collapse: separate;
        border-spacing: 0;
        width: 100%;
    }

    /* Sticky header */
    .pricing-options_table thead th {
        position: sticky;
        top: 0;
        /*    background: #fff;*/
        z-index: 20;
        box-shadow: 0 2px 5px rgba(0,0,0,.08);
    }

    /* Sticky first column */
    .pricing-options_table td:first-child,
    .pricing-options_table th:first-child {
        position: sticky;
        left: 0;
        /*    background: #fff;*/
        z-index: 15;
        font-weight: 600;
    }

    /* Top-left cell */
    .pricing-options_table thead th:first-child {
        z-index: 25;
    }

    /* Section rows */
    .pricing-options_table .bg-n-blue td {
        background: #eaf4ff;
        font-weight: 600;
    }

.pricing-option {
    margin-bottom: 20px;
    text-align: center;
}

.pricing-option__inner {
    background-color: white;
}

.pricing-option_popular {
    position: relative;
}

    .pricing-option_popular::before {
        content: "";
        position: absolute;
        top: -15px;
        left: -12px;
        height: 0;
        width: 0;
        border-left: 50px solid #F3610E;
        border-bottom: 50px solid transparent;
    }

    .pricing-option_popular::after {
        content: "\f0e7";
        font-family: "FontAwesome";
        font-size: 13px;
        position: absolute;
        display: block;
        top: -7px;
        left: -1px;
        color: white;
    }

.pricing-option__inner {
    border: 1px solid rgba(0, 0, 0, 0.1);
    -webkit-transition: all .1s;
    -o-transition: all .1s;
    transition: all .1s;
}

    .pricing-option__inner:hover {
        border-color: rgba(0, 0, 0, 0.14);
        -webkit-box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
        box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1);
    }

.pricing-option__header {
    padding: 15px 10px;
}

    .pricing-option__header h5,
    .pricing-option__header .h5 {
        font-weight: 600;
        font-size: 14px;
    }

.pricing-option__price {
    padding: 10px;
    background: rgba(0, 0, 0, 0.03);
    color: #000;
}

.pricing-option-price__currency {
    vertical-align: 90%;
}

.pricing-option-price__number {
    font-size: 36px;
    font-weight: 500;
}

.pricing-option__body {
    padding: 10px 0 15px;
}

    .pricing-option__body ul > li {
        padding: 10px 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
        text-transform: uppercase;
        font-size: 11px;
        font-weight: 600;
        color: #999;
    }

        .pricing-option__body ul > li:last-child {
            border-bottom: 0;
        }
/* Pricing Options - Joint */
.pricing-options_joint {
    padding: 10px;
    margin-bottom: 40px;
    background-color: rgba(0, 0, 0, 0.05);
}

    .pricing-options_joint .row {
        margin-left: 0;
        margin-right: 0;
    }

    .pricing-options_joint [class*="col-"] {
        padding-left: 0;
        padding-right: 0;
    }

    .pricing-options_joint .pricing-option {
        margin-bottom: 0;
        border: 5px solid transparent;
    }

    .pricing-options_joint .pricing-option_popular:before {
        top: 0;
        left: 0;
    }

    .pricing-options_joint .pricing-option_popular:after {
        top: 10px;
        left: 15px;
    }
/* Pricing Options - Table */

.pricing-options-table__table {
    margin-bottom: 0;
    text-align: center;
}

    .pricing-options-table__table > thead > tr > th {
        text-align: center;
        padding: 0;
    }

    .pricing-options-table__table .pricing-option__price {
        margin: -8px;
    }

    .pricing-options-table__table .pricing-option_popular:before {
        border-bottom-width: 40px;
        border-left-width: 40px;
        top: 0;
        left: 0;
    }

    .pricing-options-table__table .pricing-option_popular:after {
        font-size: 12px;
        top: 5px;
        left: 11px;
    }

    .pricing-options-table__table .fa-check {
        color: rgba(0, 0, 0, 0.4);
    }

    .pricing-options-table__table .fa-times {
        color: rgba(0, 0, 0, 0.2);
    }

.pricing-options-table__title {
    vertical-align: middle !important;
    padding-left: 20px !important;
    text-align: left;
}

/*price style end*/




.bgblue-light {
    background-color: #d8e6ef;
}

.bglavender-light {
    background-color: #d8e6ef;
}

.bggreen-light {
    background-color: #E2FEE6;
}

.bgpink-light {
    background-color: #FAE2FE;
}



.bgpink-cyan {
    background-color: #E2FEFC;
}



/*switch button css start*/
/* Basic Rules */
.toggleswitch input {
    display: none;
}

.toggleswitch {
    display: inline-block;
    width: 43px;
    transform: translateY(50%);
    position: relative;
}
/* Style Wired */
.switchslider {
    position: absolute !important;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 30px;
    box-shadow: 0 0 0 2px #aaa, 0 0 4px #aaa !important;
    cursor: pointer !important;
    border: 4px solid transparent !important;
    overflow: hidden !important;
    transition: .4s;
    height: 25px;
    width: 43px;
}

    .switchslider:before {
        position: absolute;
        content: "";
        width: 100%;
        height: 100%;
        background: #aaa;
        border-radius: 30px;
        transform: translateX(-26px);
        transition: .4s;
        width: 43px;
    }

input:checked + .switchslider:before {
    transform: translateX(18px);
    background: limeGreen;
}

input:checked + .switchslider {
    box-shadow: 0 0 0 2px limeGreen,0 0 2px limeGreen;
    width: 43px;
    box-shadow: 0 0 0 2px limeGreen, 0 0 4px limeGreen !important;
}

/* Style Flat */
.toggleswitch.flat .switchslider {
    box-shadow: none;
}

    .toggleswitch.flat .switchslider:before {
        background: #FFF;
    }

.toggleswitch.flat input:checked + .switchslider:before {
    background: white;
}

.toggleswitch.flat input:checked + .switchslider {
    background: limeGreen;
}


/*<switch*/
.checkbox.checbox-switch {
    padding-left: 0;
}

    .checkbox.checbox-switch label,
    .checkbox-inline.checbox-switch {
        display: inline-block;
        position: relative;
        padding-left: 0;
    }

        .checkbox.checbox-switch label input,
        .checkbox-inline.checbox-switch input {
            display: none;
        }

        .checkbox.checbox-switch label span,
        .checkbox-inline.checbox-switch span {
            width: 35px;
            border-radius: 20px;
            height: 18px;
            border: 1px solid #dbdbdb;
            background-color: #dbdbdb;
            border-color: #dbdbdb;
            box-shadow: rgb(223, 223, 223) 0px 0px 0px 0px inset;
            transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s;
            display: inline-block;
            vertical-align: middle;
            margin-right: 5px;
        }





            .checkbox.checbox-switch label span:before,
            .checkbox-inline.checbox-switch span:before {
                display: inline-block;
                width: 14px;
                height: 14px;
                border-radius: 50%;
                background: rgb(255,255,255);
                content: " ";
                /*    top: -2px;*/
                position: relative;
                left: -7px;
                transition: all 0.3s ease;
                box-shadow: 0 1px 4px rgba(0,0,0,0.4);
                vertical-align: super;
            }

        .checkbox.checbox-switch label > input:checked + span:before,
        .checkbox-inline.checbox-switch > input:checked + span:before {
            left: 7px;
        }

        /* Switch Primary */
        .checkbox.checbox-switch.switch-primary label > input:checked + span,
        .checkbox-inline.checbox-switch.switch-primary > input:checked + span {
            background-color: rgb(0, 105, 217);
            border-color: rgb(0, 105, 217);
            /*box-shadow: rgb(0, 105, 217) 0px 0px 0px 8px inset;*/
            transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
        }

        .checkbox.checbox-switch.switch-primary label > input:checked:disabled + span,
        .checkbox-inline.checbox-switch.switch-primary > input:checked:disabled + span {
            background-color: red;
            border-color: red;
            /* box-shadow: rgb(109, 163, 221) 0px 0px 0px 8px inset;*/
            transition: border 0.4s ease 0s, box-shadow 0.4s ease 0s, background-color 1.2s ease 0s;
        }

/*switch button css end*/




.aos-animate {
    max-width: 100% !important;
    overflow: hidden !important;
}

.pricing.featured .featured {
    float: left;
    transform: rotate(-45deg);
    left: -67px;
    top: 17px;
    position: relative;
    text-align: center;
    width: 195px;
    font-size: 11px;
    margin: 0;
    padding: 7px 10px;
    font-weight: 500;
    color: #fff;
}

.pricing.featured .featured {
    background: #096ed5;
}


.pricing.featured .listing-badges {
    position: absolute;
    top: 0;
    z-index: 999;
    right: 0;
    width: 100%;
    display: block;
    font-size: 15px;
    padding: 0;
    overflow: hidden;
    height: 100px;
}


/*nav tabs style start*/

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:focus-visible {
    border: 0 !important;
    outline: 0 !important;
}



.nav-tabs {
    /*	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);*/
    /*    border: 1px solid #e0e0e0;*/
    border-radius: 15px 15px 0px 0px;
}

    .nav-tabs .nav-link {
        /*    border: none;*/
        border-radius: 0;
        transition: color .2s ease-out;
        padding: 8px 20px 8px 20px;
        border-radius: 15px 15px 0px 0px;
        background-color: #fff0ea;
        cursor: pointer;
    }

.tabs-dark .nav-link {
    color: #000;
}

.tabs-light .nav-link {
    color: rgba(0,0,0,.5);
    border-radius: 15px 15px 0px 0px;
}

.nav-tabs .nav-link.active {
    color: #fff;
    background-color: #F25C26;
    border-color: #dee2e6 #dee2e6 #fff;
    border-radius: 15px 15px 0px 0px;
    border-bottom: 3px solid #F25C26 !important;
    box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
}

.nav-tabs .nav-link:focus {
    color: #fff !important;
    background-color: #F25C26 !important;
    border: 1px solid #F25C26 !important;
}

.nav-tabs .nav-link:first {
    color: #fff !important;
    background-color: #F25C26 !important;
    border: 1px solid #F25C26 !important;
}



.tabs-dark .nav-link:not(.active):hover {
    color: #aeb0b3;
    border-radius: 15px 15px 0px 0px;
}

.tabs-light .nav-link:not(.active):hover {
    color: #495057;
}

.nav-pills .nav-link {
    border-radius: 2px;
    color: #495057;
    transition: color .2s ease-out, box-shadow .2s;
}

    .nav-pills .nav-link:hover {
        box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
    }

.nav-pills .nav-item {
    margin: 0 5px;
}

.nav-pills.pills-dark .nav-link.active {
    background-color: #343a40 !important;
    box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
}

.nav-pills.pills-dark .nav-link:not(.active):hover {
    color: #1d1e22;
}

.tabs-marker .nav-link {
    position: relative;
}

    .tabs-marker .nav-link.active .marker {
        height: 30px;
        width: 30px;
        left: 50%;
        bottom: -30px;
        transform: translatex(-50%);
        position: absolute;
        overflow: hidden;
    }

        .tabs-marker .nav-link.active .marker:after {
            content: "";
            height: 15px;
            width: 15px;
            top: -8px;
            left: 50%;
            transform: rotate(45deg) translatex(-50%);
            transform-origin: left;
            background-color: #F25C26;
            /* 	box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);*/
            position: absolute;
        }

.tab-img {
    height: 250px;
}


/*nav tabs style end*/

.box-radius {
    border-radius: 6px;
}

.top-bg1 {
    position: relative;
    overflow: hidden;
    z-index: 90;
    background-image: url(../img/blue-abstract-gradient-wave-wallpaper.jpg);
    border-radius: 0px 0px 100px 100px;
    background-size: cover;
}


.top-bg {
    position: relative;
    overflow: hidden;
    z-index: 90;
    background-image: url(../img/sec-bg.png);
    background-size: cover;
}


.dash-box {
    margin: 5px 5px;
    border-radius: 10px 10px 10px 10px;
    background-color: #fff;
}

    .dash-box:hover {
        margin: 5px 5px;
        border-radius: 10px 10px 10px 10px;
        border-bottom: 4px solid #ff6731 !important;
        background-color: #ffffff;
        box-shadow: 29px 29px 59px 0px rgba(27.999999999999996, 137.00000000000003, 212, 0.1) !important;
        cursor: pointer;
    }


.subpage-border {
    border-bottom: 1px solid #e6e6e6 !important;
}

.box-bg-image {
    position: absolute;
    right: 20px;
    bottom: 25px;
    height: 47px;
}

.step-box {
    margin: 10px 5px;
    border-radius: 10px 20px 10px 20px;
    border: 1px solid #e6e6e6 !important;
    background-color: #fff;
    /*    box-shadow: 29px 29px 59px 0px rgba(27.999999999999996, 137.00000000000003, 212, 0.1)!important;*/
    position: relative;
    box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.06);
}



.future-box {
    margin: 10px 5px;
    border-radius: 10px 30px 10px 30px;
    border: 1px solid #e6e6e6 !important;
    background-color: #fff;
    box-shadow: 29px 29px 59px 0px rgba(27.999999999999996, 137.00000000000003, 212, 0.1) !important;
    position: relative;
}




.banner-box {
    margin: 25px 5px;
    border-radius: 15px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
    !important;
    /*    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;!important;*/
    background-color: #fff;
    /*    border: 1px solid #e0e0e0 !important;*/
}


    .banner-box:hover:before {
        height: 100%;
        top: 0;
        color: #fff;
    }

   

    .banner-box:hover {
        margin: 25px 5px;
    }

.product-box {
    margin: 25px 5px;
    border-radius: 10px 50px 10px 50px;
    background-color: #fff;
    border: 1px solid #e0e0e0 !important;
}

    .product-box:hover {
        border-radius: 50px 10px 50px 10px;
        transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
        box-shadow: 5px 5px 19px 0px rgba(27.999999999999996, 137.00000000000003, 212, 0.1) !important;
    }

/*share popup style start*/
.shareArticle {
    display: flex;
    flex-flow: column;
    align-items: center;
    width: 100%;
    padding: 15px;
}

.shareSocial {
    display: flex;
    flex-flow: row;
    align-items: center;
    margin-bottom: 30px;
    font-size: 23px;

    @media (max-width: 767px) {
        flex-flow: column;
    }

    .socialTitle {
        margin: 0 15px 0 0;
        font-size: 20px;

        @media (max-width: 767px) {
            margin-bottom: 15px;
            text-align: center;
        }
    }

    .socialList {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: flex-start;
        justify-content: center;
        flex-flow: row wrap;

        li {
            margin: 5px;

            &:first-child {
                padding-left: 0;
            }

            a {
                position: relative;
                display: flex;
                justify-content: center;
                align-items: center;
                width: 50px;
                height: 50px;
                border-radius: 100%;
                text-decoration: none;
                background-color: #999;
                color: #fff;
                transition: .35s;

                i {
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform-origin: top left;
                    transform: scale(1) translate(-50%, -50%);
                    transition: .35s;
                }

                &:hover {
                    i {
                        transform: scale(1.5) translate(-50%, -50%);
                    }
                }
            }

            &:nth-child(1) a {
                background-color: #135cb6;
            }

            &:nth-child(2) a {
                background-color: #00aced;
            }

            &:nth-child(3) a {
                background-color: #BD081C;
            }

            &:nth-child(4) a {
                background-color: #33a1ff;
            }

            &:nth-child(5) a {
                background: #f09433;
                background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
                background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
                background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%);
                filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f09433', endColorstr='#bc1888',GradientType=1 );
            }

            &:nth-child(6) a {
                background-color: #1FB381;
            }
        }
    }
}

.shareLink {
    .permalink {
        position: relative;
        border-radius: 30px;

        .textLink {
            text-align: center;
            padding: 12px 60px 12px 30px;
            height: 45px;
            width: 450px;
            font-size: 16px;
            letter-spacing: .3px;
            color: #494949;
            border-radius: 25px;
            border: 1px solid #f2f2f2;
            background-color: #f2f2f2;
            outline: 0;
            appearance: none;
            transition: all .3s ease;

            @media (max-width: 767px) {
                width: 100%;
            }

            &:focus {
                border-color: #d8d8d8;
            }

            &::selection {
                color: #fff;
                background-color: #ff0a4b;
            }
        }

        .copyLink {
            position: absolute;
            top: 50%;
            right: 25px;
            cursor: pointer;
            transform: translateY(-50%);

            &:hover {
                &:after {
                    opacity: 1;
                    transform: translateY(0) translateX(-50%);
                }
            }

            &:after {
                content: attr(tooltip);
                width: 140px;
                bottom: -40px;
                left: 50%;
                padding: 5px;
                border-radius: 4px;
                font-size: 0.8rem;
                opacity: 0;
                pointer-events: none;
                position: absolute;
                background-color: #000000;
                color: #ffffff;
                transform: translateY(-10px) translateX(-50%);
                transition: all 300ms ease;
                text-align: center;
            }

            i {
                font-size: 20px;
                color: #ff0a4b;
            }
        }
    }
}

.slider {
    overflow: hidden;
    width: 100%;
    background: rgb(255, 255, 255);
    border-radius: 16px;
}

.slider-items {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 20px;
    animation: scrolling 50s linear infinite;
    width: max-content;
}


@keyframes scrolling {

    0% {
        transform: translateX(25%);
    }

    100% {
        transform: translateX(-10%);
    }
}



/*Banner Image style end*/
.demo-bg {
    position: absolute !important;
    left: 0 !important;
    top: -19 !important;
    width: 100% !important;
    height: auto !important;
}

.blur-img {
    overflow: hidden !important;
}


.main-img img {
    position: relative !important;
    object-fit: cover !important;
    height: 300px !important;
}

img {
    vertical-align: middle !important;
    border-style: none !important;
}

.demo-wrap {
    position: relative !important;
}

.blur-img img {
    filter: blur(100px);
    object-fit: cover;
    height: 300px !important;
    width: 100%;
}

.event-image {
    overflow: hidden;
    z-index: 1029;
    object-fit: cover !important;
    background-size: cover;
    height: 300px !important;
}


/*loader style 1*/
.preloaderBg {
    position: fixed;
    z-index: 9999;
    top: 0;
    background: rgba(90, 90, 90, 0.69);
    width: 100%;
    height: 100%;
    text-align: center;
}

.preloader {
    margin: auto;
    background: url('../images/publicwebsiteimages/loader.png') no-repeat center;
    background-size: 90px;
    width: 300px;
    height: 300px;
    margin-top: 190px;
}


.preloader2 {
    border: 5px solid #f3f3f3;
    border-top: 5px solid #FF7426;
    border-bottom: 5px solid #096ED5;
    border-radius: 50%;
    width: 90px;
    height: 90px;
    animation: spin 1s ease-in-out infinite;
    position: relative;
    margin: auto;
    top: -195px;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

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

/*loader style 1*/

.loader {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background-image: url('../images/publicwebsiteimages/loader-logo.png');
    background-size: cover;
    /* border: 8px solid #f3f3f3; */
    /* border-top: 8px solid #048023; */
    border-radius: 50%;
    width: 80px;
    height: 80px;
    animation: spinloader 3s linear infinite;
}


.fund-icons {
    height: 80px;
    padding-bottom: 7px;
}

.section-img-height {
    height: 350px !important;
}


.reveal {
    position: relative;
    transform: translateY(150px);
    opacity: 0;
    transition: 1s all ease;
}

    .reveal.active {
        transform: translateY(0);
        opacity: 1;
    }


.home-grediant-bg {
    background-image: radial-gradient(circle at 19% 90%, rgba(190, 190, 190,0.04) 0%, rgba(190, 190, 190,0.04) 17%,transparent 17%, transparent 100%),radial-gradient(circle at 73% 2%, rgba(78, 78, 78,0.04) 0%, rgba(78, 78, 78,0.04) 94%,transparent 94%, transparent 100%),radial-gradient(circle at 45% 2%, rgba(18, 18, 18,0.04) 0%, rgba(18, 18, 18,0.04) 55%,transparent 55%, transparent 100%),radial-gradient(circle at 76% 60%, rgba(110, 110, 110,0.04) 0%, rgba(110, 110, 110,0.04) 34%,transparent 34%, transparent 100%),radial-gradient(circle at 68% 56%, rgba(246, 246, 246,0.04) 0%, rgba(246, 246, 246,0.04) 16%,transparent 16%, transparent 100%),radial-gradient(circle at 71% 42%, rgba(156, 156, 156,0.04) 0%, rgba(156, 156, 156,0.04) 47%,transparent 47%, transparent 100%),radial-gradient(circle at 46% 82%, rgba(247, 247, 247,0.04) 0%, rgba(247, 247, 247,0.04) 39%,transparent 39%, transparent 100%),radial-gradient(circle at 50% 47%, rgba(209, 209, 209,0.04) 0%, rgba(209, 209, 209,0.04) 45%,transparent 45%, transparent 100%),linear-gradient(90deg, rgb(84, 36, 210),rgb(44, 27, 154));
    -webkit-animation: gradient 30s ease infinite;
    animation: gradient 30s ease infinite;
}

.animate-charcter {
    background-image: linear-gradient( -225deg, #231557 0%, #44107a 29%, #ff1361 67%, #fff800 100% );
    background-size: auto auto;
    background-clip: border-box;
    background-size: 200% auto;
    color: #fff;
    background-clip: text;
    text-fill-color: transparent;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: textclip 2s linear infinite;
    display: inline-block;
}

@keyframes textclip {
    to {
        background-position: 200% center;
    }
}


/*<!--smartsearch style start-->*/
.searchBar {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
}

#searchQueryInput {
    width: 100%;
    height: 2.8rem;
    background: #f5f5f5;
    outline: none;
    border: none;
    border-radius: 1.625rem;
    padding: 0 3.5rem 0 1.5rem;
    font-size: 1rem;
}

#searchQuerySubmit {
    width: 3.5rem;
    height: 2.8rem;
    margin-left: -3.5rem;
    background: #F25C26;
    border: none;
    outline: none;
    border-radius: 50px;
}

    #searchQuerySubmit:hover {
        cursor: pointer;
    }

/*<!--smartsearch widget style end-->*/
/*feedback style start*/

#feedback {
    float: left;
    position: fixed;
    top: calc(30% - 50px);
    right: -25;
    margin-right: -27px;
    transform: rotate(270deg);
    z-index: 2147483647;
}

    #feedback a {
        background: #FF4500;
        border-radius: 15px 15px 0px 0px;
        box-shadow: 0 0 3px rgba(0, 0, 0, .3);
        border: 3px solid #fff;
        border-bottom: 0;
        display: block;
        transition: all .2s ease-in-out;
    }

        #feedback a:hover {
            padding-bottom: 20px;
        }


.heading {
    font-size: 18px;
}

.para {
    font-weight: 600;
}

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

.level {
    background: white;
    padding: 13px;
    border-radius: 7px;
    border: solid 0.5px #e0e9fe;
    cursor: pointer;
}

    .level:hover {
        box-shadow: #fe73a5 0 2px 5px;
    }

        .level:hover i {
            color: #fe73a5;
        }

    .level i {
        font-size: 40px;
    }

.feedback-msg textarea {
    margin-top: 5px;
    border: solid 2px #e0e9fe;
    padding: 13px;
    border-radius: 7px;
    outline: none;
    font-size: 14px;
    color: #4b537c;
    font-weight: 500;
    letter-spacing: 1px;
    width: 100%;
    height: 80px;
    resize: none;
}

.agreement .checkbox {
    display: flex;
    gap: 5px;
    align-items: center;
    margin-bottom: 5px;
}

.agreement input {
    accent-color: #ff71a4;
}

.agreement a {
    color: #ff71a4;
    font-size: 12px;
    font-weight: 600;
}

.agreement label {
    font-size: 12px;
    font-weight: 600;
}

.buttons {
    display: flex;
    gap: 10px;
    justify-content: end;
}

    .buttons a {
        background: white;
        color: #4b537c;
        width: 80px;
        padding: 10px;
        text-align: center;
        border-radius: 4px;
    }

        .buttons a:hover {
            opacity: 0.9;
        }

        .buttons a:nth-child(1) {
            background: #fe71a4;
            color: #f8faff;
        }

/*feedback style start*/




.inactive-box {
    filter: grayscale(100%);
    background-color: #dedede;
}


#btn-back-to-top {
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    display: none !important;
}


.img-zoom {
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;
}

    .img-zoom:hover {
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
    }

/*rotate css start*/
.feature-img:hover {
    transition: 20.70s;
    -webkit-transition: 20.70s;
    -moz-transition: 20.70s;
    -ms-transition: 20.70s;
    -o-transition: 20.70s;
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

.feature-img {
    transition: 20.70s;
    -webkit-transition: 20.70s;
    -moz-transition: 20.70s;
    -ms-transition: 20.70s;
    -o-transition: 20.70s;
    display: block;
    margin-right: auto;
    margin-left: auto;
}

.image {
    .transition-duration(1s);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;

    &:hover {
        .transform(360deg);
    }
}

/*rotate css end*/

.upper-searchbar {
    margin-top: -70px;
    position: relative;
    z-index: 1029;
    background-color: #fff;
    border-radius: 60px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08) !important;
    border: 1px solid #e6e6e6 !important;
}

.section-bg-blue {
    background-color: #E5F1F8;
}

.form i {
    margin-left: -30px;
    cursor: pointer;
}

.blue-graidient-bg {
    background: linear-gradient(336.38deg, #184EA2 -0.74%, #093780 120.42%) !important;
}

.btn-danger {
    border-radius: 50px !important;
    background: #d41457 !important;
    color: #fff !important;
}

.event-title-sticky {
    position: sticky;
    top: 83px;
    z-index: 1000;
    background-color: white;
    transition: ease-in-out 0.4s;
    margin-top: 78px;
}

    .event-title-sticky + .event-body {
        padding-top: 10px;
    }


#eventDesc {
    z-index: 1;
}

.feature-topimg {
    position: relative;
    overflow: hidden;
    z-index: 1029;
    background-image: url('../images/publicwebsiteimages/portal-back.svg');
    background-size: cover;
}

.home-banner {
    position: relative;
    overflow: hidden;
    z-index: 1029;
    background-image: url('../images/publicwebsiteimages/banner-bg.png');
    background-size: cover;
    height: 550px;
    vertical-align: middle;
}



.subscribe-bg-blue {
    position: relative;
    overflow: hidden;
    z-index: 999;
    background: transparent linear-gradient(80deg, #114c90 0%, #0d8adb 63%, #35c1f1 100%) 0% 0% no-repeat padding-box;
    background-size: cover;
    height: auto;
    border-radius: 0px 0px 0px 0px;
}




.subscribe-bg {
    position: relative;
    overflow: hidden;
    z-index: 999;
    background-image: url('../images/publicwebsiteimages/sub-bg.png');
    background-repeat: no-repeat;
    background-size: cover;
    height: 250px;
    background-color: #E5F1F8;
}

.about-bg {
    position: relative;
    overflow: hidden;
    z-index: 1029;
    background-image: url('../images/publicwebsiteimages/funding_sec_bg.png');
    background-size: cover;
}

.seationg-bg {
    position: relative;
    overflow: hidden;
    z-index: 1029;
    background-image: url(../img/Seats/seating-bg.png);
    background-size: auto;
}



.date-tag {
    position: absolute;
    top: 3px;
    left: 0px;
}

/*
.seat-tag{
position: absolute; 
top: 0px; 
right: -27px;
border-left: 2px solid #fff;
}

.seat-tag-size{
font-size: 14px !important;
}
*/


.seat-tag {
    position: absolute;
    top: -215px;
    left: 83px;
    border: 2px solid #fff;
}

.seat-tag-size {
    font-size: 11px !important;
    font-weight: 600;
}

.event-price {
    display: inline-block !important;
    padding: 0.25em 0.4em;
    font-size: 16px !important;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: 0.25rem;
}

.tag-border-paid {
    border-bottom: 5px solid #dc3545 !important;
}

.tag-border-rsvp {
    border-bottom: 5px solid #17a2b8 !important;
}


.tag-border-free {
    border-bottom: 5px solid #22a522 !important;
}

.event-tile-labels ul {
    list-style-type: none;
    padding-left: 0;
}

.location-border-right {
    border-right: 2px solid #096ed5 !important;
    padding: 0px 10px 0px 0px;
    margin-right: 10px;
}


.box-border-normal {
    border-left: 1px solid #d3d3d3 !important;
}

.box-border-left {
    border-left: 4px solid #096ed5 !important;
}

.box-border-yellow {
    border-left: 5px solid #FF9800 !important;
}

.box-border-blue {
    border-left: 5px solid #2e78fc !important;
}



.box-border-orange {
    border-left: 2px solid #ff6a00 !important;
}

.box-border-maganta {
    border-left: 5px solid #119edc !important;
}

.box-border-pink {
    border-left: 5px solid #eb0b87 !important;
}

.box-border-green {
    border-left: 5px solid #7cce05 !important;
}



.img-height {
    height: 350px !important;
}

.body {
    display: flex;
    flex-flow: column;
}

.navbar-brand img {
    width: 250px !important;
}

.navbar .navbar-collapse {
    text-align: center;
}





.navbar {
    line-height: 10px;
    /*    font-family: "Roboto", sans-serif;  !important;*/
    font-size: 14px;
    font-weight: 100, 200, 300, 400, 500, 600, 700, 800, 900;
}

.Heading {
    position: relative;
    /*background: #FF7544;*/
    border-top-left-radius: 15Px;
    border-top-right-radius: 15px;
}
/*.active-nav {
background: #f5f5f5 !important;
padding: 22px 15px !important;
border-top: 4px solid #F25C26;
border-bottom: 4px solid #F25C26;
}*/

/*  .active-nav a {
color: #FF0413 !important;
}*/

/*flex class start*/
.flex-container {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    text-align: left;
    justify-content: center;
    margin: 0px 8px;
    width: 100% !important;
}

.flex-item-left {
}

.flex-item-right {
}

.flex-col {
    width: 20% !important;
}

.flex-com {
    width: 25% !important;
}

/*flex class end*/




.event-section {
    max-width: 1040px;
}

.para-section {
    position: relative !important;
}

.event-detail-header {
    display: inline-block;
}

.bg-product-img {
    position: cover !important;
    background-image: url(product-bg.svg) !important;
    background-size: contain !important;
    background-repeat: repeat !important;
}

.bg-login-img {
    position: relative;
    overflow: hidden;
    z-index: 1029;
    background-image: url('../images/publicwebsiteimages/loginbg.svg');
    background-size: contain;
    background-color: #E5F1F8;
}

.bg-contact-img {
    position: relative;
    overflow: hidden;
    z-index: 1029;
    background-image: url('../images/publicwebsiteimages/contact-us.png');
    background-size: cover;
}

.bg-top-img {
    position: sticky !important;
    background-image: url(header-bg.svg) !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
}



.event-title {
    text-decoration: none !important;
    color: #555 !important;
}

.event_tile {
    position: relative !important;
}

.event_tag {
    position: absolute !important;
    top: 0px !important;
    left: 0px !important;
}

.event_tag1 {
    position: absolute !important;
    bottom: 0px !important;
    right: 0px !important;
    text-align: center !important;
}

.price_tag {
    position: absolute !important;
    bottom: 70px !important;
    right: 0px !important;
    border-radius: 5px !important;
    text-align: center !important;
}

.slid {
    height: 1000px;
    overflow: hidden;
    position: relative;
}

    .slid ul {
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
        position: absolute;
    }

        .slid ul li {
            width: 100%;
            height: 425px;
            font-size: 1.5em;
            color: #444;
            display: flex;
            align-items: center;
            justify-content: center;
        }



.event-details-sponsor img {
    width: 150px !important;
    height: 150px !important;
    background-color: #f8f8f8;
    object-fit: contain;
}

.popup-img {
    width: 370px !important;
    align-content: center !important;
}


.sticky + .event-body {
    padding-top: 90px;
}

.event-detail-share li {
    display: inline-block;
}

.event-detail-share li {
    display: inline-block;
    padding: 8px 10px;
}

    .event-detail-share li:hover {
        background-color: #f4f3f6;
        border-radius: 5px;
    }

    .event-detail-share li a {
        font-size: 12px;
        color: #444;
    }

.event-detail-share li {
    padding: 5px 10px;
}

.event-detail-share img {
    height: 30px;
}

.blur-img img {
    height: 300px !important;
}

.blur-img {
    overflow: hidden;
}

    .blur-img img {
        filter: blur(32px);
        object-fit: cover;
        height: 350px !important;
        width: 100%;
    }


.org-img img {
    height: 300px !important;
}

.org-img {
    overflow: hidden;
}

    .org-img img {
        object-fit: cover;
        height: 350px !important;
        width: 100%;
    }




.main-img {
    overflow: hidden;
}

    .main-img img {
        position: relative;
        object-fit: cover;
        height: 300px !important;
    }




.event-detail-img {
    position: absolute;
    top: 0;
    width: 100%;
}

    .event-detail-img img {
        height: 450px;
        width: 100%;
        object-fit: contain;
    }

.nav-text {
    font-size: 28px;
    font-weight: bold;
    color: #e9580e;
}

.navbar ul li {
    padding: 5px 10px !important;
    font-weight: 500;
}
    /*header*/
    .navbar ul li a {
        text-decoration: none;
        color: #444;
        font-weight: 500;
        position: relative;
        display: inline-block;
    }

        .navbar ul li a:hover {
            color: #f25c26 !important;
        }

        .navbar ul li a.active {
            color: #f25c26 !important;
        }

        .navbar ul li a:before {
            Position: absolute;
            width: 100%;
            content: "";
            height: 4px;
            border-radius: 50px;
            left: 0;
            bottom: -8px;
            background-color: #f25c26;
            visibility: hidden;
            -webkit-transform: scaleX(0);
            transform: scaleX(0);
            -webkit-transition: all 0.15s ease-in-out 0s;
            transition: all 0.15s ease-in-out 0s;
        }



        .navbar ul li a:hover:before, .navbar ul li a.active:before {
            visibility: visible;
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }






.section-padding {
    padding: 50px 0;
}

/*.custom-control-input
{
display :none;
opacity: 0;
height: 30px;
width: 30px;
cursor: pointer;
}*/


.mCustomScrollbar {
    -ms-touch-action: pinch-zoom;
    touch-action: pinch-zoom;
}


.search {
    border-radius: 50px !important;
    border: 2px solid #e6e6e6 !important;
    background: #FFF !important;
    height: 54px !important;
}

.fill-box {
    border-radius: 50px !important;
    border: 2px solid #e4e4e4 !important;
    background: #FFF !important;
    height: 50px !important;
}

.fill-box-readonly {
    border-radius: 50px !important;
    border: 2px solid #e4e4e4 !important;
    background: #eaeaea !important;
    height: 50px !important;
}

.fill-box-active {
    border-radius: 50px !important;
    border: 2px solid #FF7544 !important;
    background: #fff !important;
    height: 50px !important;
}



#sidebar {
    width: 250px;
    position: fixed;
    left: 0;
    height: 100vh;
    z-index: 999;
    transition: all 0.3s;
    overflow: visible;
    box-shadow: 0 1px 3px rgb(0 0 0 / 20%);
    background: #9B5FFF;
}

.tilemenu {
    font-family: 'Poppins';
    font-size: 12px;
    font-weight: 500;
    font-style: normal;
}

#sidebar .material-icons {
    vertical-align: middle;
    padding: 2px;
}


#sidebar ul li.active > a {
    /*
    color: #f25c26;
    background: #ffede6;
    border-left: 4px solid #f25c26;
    font-weight: 500;
    */
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    background: #fff;
    color: #9B5FFF;
    height: 50px;
}

#sidebar ul li a {
    padding: 10px 10px;
    font-size: 14px;
    display: block;
    color: #fff;
    font-weight: 500;
}

#sidebar ul li span {
    background: #fff;
    padding: 0 10px;
}

#content {
    width: calc(100% - 250px);
    padding: 5px;
    min-height: 100vh;
    transition: all 0.3s;
    position: absolute;
    right: 0;
}

.list-unstyled {
    padding-left: 0;
    list-style: none;
}

ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 40px;
}

.mCustomScrollBox {
    position: relative;
    overflow: hidden;
    height: 100%;
    max-width: 100%;
    outline: 0;
    direction: ltr;
}


.DahsboardMenu_active {
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    background: #fff;
    height: 45px;
}


#events-searchbox {
    height: 185px !important;
}

.text-height {
    line-height: 22px !important;
}

.wrapper {
    margin-top: 80px !important;
}

.text-orange {
    color: #FF7426;
}

.text-gray {
    color: rgba(0, 0, 0, 0.4);
}

.text-white {
    color: #fff;
}

.iconfirst {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
}

.iconsecond {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
}

.ann-green-text {
    color: #76AC42 !important;
    font-family: 'Poppins' !important;
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 16px !important;
}

.ann-black-text {
    color: black;
    font-family: 'Poppins' !important;
    font-style: normal !important;
    font-weight: 500 !important;
    font-size: 16px !important;
}


.CreateButtons {
    border-radius: 50px;
}




.text-green {
    color: #54b402;
}

.text-blue {
    color: #096ed5 !important;
}


.text-new {
    color: #FF7544;
}

.text-bold {
    color: #555 !important;
    font-weight: 600 !important;
}

sup {
    color: red !important;
}

.tile-icon i {
    font-size: 16px;
    vertical-align: sub;
    margin-right: 3px;
}

.btn {
}


.ticketprice {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    color: #CD3600;
}

.btn-detail {
    color: #fff;
    background-color: #096ed5 !important;
    border-radius: 50px !important;
}

.btn-white {
    color: #222242 !important;
    border: 1px solid #fff !important;
    background-color: #fff !important;
    cursor: pointer;
    font-weight: 600;
    border-radius: 50px;
}

.btn-white-outline {
    color: #fff !important;
    border: 2px solid #fff !important;
    border-radius: 50px;
    font-weight: 600;
    cursor: pointer;
}

    .btn-white-outline:hover {
        color: #222242 !important;
        border: 1px solid #fff !important;
        background-color: #fff !important;
        cursor: pointer;
        font-weight: 600;
        border-radius: 50px;
    }


.btn-white:hover {
    box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
}


.btn-business {
    color: #FFffff;
    background-color: #F25C26 !important;
    border-radius: 50px !important;
    border: 3px solid #F25C26;
    font-weight: 600;
}

    .btn-business:hover {
        background-color: #F25C26 !important;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
        color: #fff !important;
    }


.btn-whatsapp {
    color: #FFffff;
    background-color: #28a745 !important;
    border-radius: 50px !important;
    font-weight: 600;
}

    .btn-whatsapp:hover {
        background-color: #35b207 !important;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
    }



.btn-primary {
    color: #FFffff;
    background-color: #096ed5 !important;
    border-radius: 50px !important;
    border: 2px solid #096ed5;
    font-weight: 600;
    box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.06);
}

    .btn-primary:hover {
        background-color: #035eba !important;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
    }


.btn-org-primary {
    color: #FFffff;
    background-color: #F25C26 !important;
    border-radius: 50px !important;
    border: 2px solid #F25C26;
    font-weight: 600;
}

    .btn-org-primary:hover {
        background-color: #f54809 !important;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
        color: #FFffff;
    }


.btn-outline-primary {
    color: #096ed5 !important;
    border: 2px solid #096ed5 !important;
    border-radius: 50px;
    font-weight: 600;
    background-color: #fff;
    box-shadow: 0 20px 30px 0 rgba(0, 0, 0, 0.06);
}

    .btn-outline-primary:hover {
        color: #fff !important;
        background-color: #096ed5;
        border: 3px solid #096ed5 !important;
        border-radius: 50px;
        font-weight: 600;
    }

.btn-outline-org-primary {
    color: #F25C26 !important;
    border: 2px solid #F25C26 !important;
    border-radius: 50px;
    font-weight: 600;
    background-color: #fff;
}

    .btn-outline-org-primary:hover {
        color: #fff !important;
        background-color: #F25C26;
        border: 3px solid #F25C26 !important;
        border-radius: 50px;
        font-weight: 600;
    }



.btn-blue-light {
    color: #096ED5;
    background-color: #E5F1F8 !important;
    border-radius: 50px !important;
    border: none;
    font-weight: 600;
}

    .btn-blue-light:hover {
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
    }


.btn-purple {
    color: #fff;
    background-color: #4D2C5E !important;
    border-radius: 50px !important;
    border: none;
}

    .btn-purple:hover {
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
    }

.btn-Eventmenu {
    color: black;
    background-color: #fff !important;
    border-radius: 50px !important;
    border: none;
    height: 48px;
    width: 200px;
}

.organization-home-menu ul {
    list-style: none;
    padding-left: 0px;
    margin-bottom: 0;
    text-align: center;
}

ul {
    display: block;
    list-style-type: disc;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    padding-inline-start: 0px;
}

.organization-home-menu .active a {
    background-color: #F25C26;
    color: #fff;
    font-weight: 500;
    border-style: none !important;
}

.organization-home-menu li a {
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    border-style: none !important;
}


.announcementBox {
    border-top: 7px;
    border-top-style: solid;
    border-image-slice: 1;
    border-image-source: linear-gradient(90deg, #FB9E1B 0%, #9051FA 100%);
}

.agenda-background-color-div {
    background-color: #FF7544;
    color: #fff;
    font-size: medium;
    font-weight: bold;
    height: 100%;
    text-align: center;
}

}


.btn-vm:hover {
    background-color: #FF7544 !important;
    transition-timing-function: ease-in-out;
}

.back-box {
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.back-box-green {
    background-color: #76AC42;
    color: #fff !important;
}

.back-box-orange {
    background-color: #FF7544;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    color: #fff !important;
}

.back-box-yellow {
    background-color: yellowgreen;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    color: #fff !important;
}

.btn-secondary {
    background-color: #F5F5F5 !important;
    color: #FF7544 !important;
    border: 1px solid #dddddd !important;
    border-radius: 50px !important;
}

    .btn-secondary:hover {
        background-color: #cdd3d8 !important;
        transition-timing-function: ease-in-out;
    }

.desk-hide {
    display: none !important;
}

.mobile-hide {
    display: block;
}

.breadcrumb {
    padding: .75rem 0rem !important;
    background-color: transparent !important;
    border-radius: 0 !important;
}

.text-align {
    float: right;
}

.search-b {
    height: 49px !important;
    padding: 12px !important;
}


.header {
    box-shadow: 16px -10px 16px 2px rgb(0 0 0 / 30%);
}

.header-img {
    background-image: url(products.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    height: 300px;
}

.header-info h1 {
    text-align: center;
    color: #fff;
    vertical-align: middle;
    line-height: 8;
}

.display-4 {
    font-size: 45px !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 3px rgb(0 0 0 / 20%) !important;
}

.content-text {
    text-align: center;
}

.inner-data {
    padding: 10px 10px !important;
}

.layout-header {
    background: #FF7544;
    color: #fff;
}

.layout-box {
    width: 80%;
    margin: 110px auto;
    background-color: #fff;
    box-shadow: 29px 29px 59px 0px rgba(27.999999999999996, 137.00000000000003, 212, 0.1) !important;
    border-radius: 10px 10px 10px 10px;
}



.section {
    margin: 45px 0;
}

.section-padding {
    padding: 40px 0;
}

.video-text {
    min-height: 80px;
    max-height: 80px;
    padding: 15px;
    overflow: hidden;
}

.card {
    margin: 25px 5px;
    border-radius: 20px;
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.07) !important;
}

    .card:hover {
        margin: 25px 5px;
        border-radius: 20px;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
    }

.font-weight-bold {
    font-weight: bold;
    font-size: 33px;
}

.font-weight-Event_date {
    font-weight: bold;
    font-size: 10px;
}

.font-size_search {
    font-weight: 600;
    /*font-size: 20px;*/
}

.font-weight-Normal {
    font-size: 10px;
}

.carousel-text {
    font-family: 'Lobster Two', cursive;
}



.carousel-caption {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    /*    position: absolute!important;*/
    bottom: 10px !important;
    left: 5% !important;
    padding-top: 0px !important;
    padding-bottom: 100px !important;
}

.form-check {
    position: relative;
    display: block;
    padding-left: 0px !important;
}

.form-check-input {
    margin-left: 0px !important;
}

.form-check-label {
    margin-left: 20px !important;
}




#RadioMale {
    accent-color: #FF7544;
}

#RadioFemale {
    accent-color: #FF7544;
}

.card-img-top {
    border-radius: 15px;
    transition: 0.3s;
}


.event-detail-card-img-top {
    border-radius: 15px;
}

.backbox-image {
    overflow: hidden;
    border-radius: 15px;
}

.event-img-top:hover {
    border-radius: 15px;
    transform: scale(1.1);
}

.inner-img {
    transition: 0.3s;
}

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



.card-footer a {
    font-size: 14px;
}

.card-height {
    min-height: 250px;
    max-height: 500px;
}

.card-img-size {
}

.label-text {
    font-weight: 500;
}

.label-Services {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
}

.label-Services1 {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    font-size: 13px;
}



.labelAgenda {
    font-family: 'Poppins';
    font-size: 26px;
    font-style: normal;
    font-weight: 500;
}

.label-font {
    font-size: 18;
}

.event-services ul {
    list-style: none;
    padding-left: 0;
}

.box-style {
    border-left: 5px solid #FF7544;
    border-radius: 5px;
}

.ui-sortable-handle {
    -ms-touch-action: none;
    touch-action: none;
}

.cancelbutton {
    background: #fff !important;
    color: black;
}

.pin {
    margin: 3px;
}

.li-highlight {
    background: #76AC42 !important;
}
/*
.card-body-height{
min-height: 166px;
max-height: 209px;
}
*/
.card-body-height p {
    font-size: 13px;
}

.border-box {
    border: 1px solid #d8d8d8;
    border-radius: 5px;
}

.anchor-tag {
    color: #444;
    font-weight: 500;
    font-size: 16px;
    text-decoration: none !important;
    cursor: pointer;
    border-style: none;
    border-radius: 10px;
    text-decoration: none;
    height: 5vh;
}

.menu-line {
    width: 100%;
    text-align: left;
    border-bottom: 1px solid #fff;
    line-height: 0.1em;
    margin: 10px 0 20px;
}

    .menu-line small {
        background: #9B5FFF;
        padding: 0 10px;
        color: #fff;
        text-align: center;
    }

    .menu-line li {
        color: #fff;
        text-align: center;
    }

.labelPackage {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 500;
    /*font-size: 16px;*/
    line-height: 30px;
    color: #FF7544;
    text-align: center;
}



.dashboard_tiles_Menu {
    border-radius: 10px;
    background: linear-gradient(90deg, #FB9E1B 0%, #9051FA 100%);
    margin: 0 auto;
    display: fle;
}

.dashboard_tiles {
    border-radius: 15px;
    background: linear-gradient(90deg, #2D79E5 0%, #61B0F5 89.44%);
    color: #fff;
}

.icon-buttons {
    vertical-align: bottom;
}

.active {
    /*    color: #89c253 !important;*/
    font-weight: 600;
    border-style: none !important;
}

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

.btnmenu {
    transition: ease-out 0.3s;
    border-style: none !important;
}

    .btnmenu.active {
        background: #5C29DE !important;
        color: #fff !important;
        border-style: none !important;
    }

    .btnmenu:hover {
        background-color: #5C29DE;
        color: #fff !important;
        border-style: none !important;
    }

.btnmenuAgenda {
    transition: ease-out 0.3s;
    border-style: none !important;
}

    .btnmenuAgenda.active {
        background: #76AC42 !important;
        color: #fff !important;
        border-style: none !important;
    }

    .btnmenuAgenda:hover {
        background-color: #76AC42;
        color: #fff !important;
        border-style: none !important;
    }



.organization-home-menu .active {
    background-color: #5C29DE;
    color: #fff !important;
    font-weight: 500;
    border-style: none;
    border-style: none !important;
}

.flex-item {
    flex: 1;
    margin: 5px;
}

.center {
    margin: auto;
    width: 70%;
    padding: 10px;
}

.dropdown, .dropup {
    position: relative;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.15);
    border-radius: .25rem;
}

.dropdown-menu-side {
    right: 0;
    left: auto !important;
}

.sustainability {
}

.bg-gray {
    background-color: #efefef;
}

.event-detail-pink {
    background-color: #ffe2e2;
    border-radius: 15px;
}

.b-radious {
    border-radius: 15px !important;
}

.org-event-tab-box {
    border-left: 1px solid rgb(208, 213, 230);
    border-top: 1px solid rgb(208, 213, 230);
    border-right: 1px solid rgb(208, 213, 230);
    border-bottom: 1px solid rgb(208, 213, 230);
    border-radius: 0px 0px 16px 16px;
    position: relative;
    z-index: unset;
}



.event-info {
    padding: 15px 15px 4px;
    border-left: 1px solid rgb(208, 213, 230);
    border-top: 1px solid rgb(208, 213, 230);
    border-right: 1px solid rgb(208, 213, 230);
    border-bottom: 1px solid rgb(208, 213, 230);
    border-radius: 16px 16px 16px 16px;
    position: relative;
    z-index: unset;
}


.bg-green {
    background-color: #89c253;
    color: #fff !important;
}

.bg-light-blue {
    background-color: #DDF7FD;
    border-radius: 100px 100px 0px 0px;
}

.bg-light-pink {
    background-color: #ffe2e2;
}

.bg-light-green {
    background-color: #e2ffe3;
}


.bg-light-yellow {
    background-color: #fcf7dc;
}


.bg-blue {
    background-color: #184EA2;
    color: #fff !important;
}

.bg-lpink {
    background-color: #F5FDFF;
}

.bg-SocialBG {
    background-color: #FFFFFF;
}

.social-icons {
    width: 26px;
}

.rsvp-icons {
    width: 80px;
}

.home-services-icon {
    width: 70px;
    height: 70px;
    border: 2px solid #777;
    border-radius: 100px;
    background-color: #f6f9ff;
}

    .home-services-icon i {
        font-size: 27px;
        padding: 20px;
        color: #515666;
    }

.text-color {
    color: #111 !important;
}

.what-we-do {
    background-image: url(image-home.jpg);
}

.what-we-do-body {
    background-color: #354052;
    padding: 40px;
    width: 650px;
    color: #fff;
}

    .what-we-do-body h1 {
        text-transform: uppercase;
    }

.feasibility-study ul li {
    padding: 10px 0;
    list-style-type: none;
}

    .feasibility-study ul li i {
        padding-right: 10px;
        color: #89c253;
    }

.insole-img img {
    width: 250px;
    margin-bottom: 50px;
}

.home-our-project {
    background-color: #f8fff5;
}

.icon-size {
    font-size: 20px !important;
    vertical-align: text-top;
    margin-right: 5px;
    color: #444;
}

.image-icon-size {
    height: 50px !important;
    vertical-align: text-top;
    margin-right: 5px;
}

.title-underline {
    padding-bottom: 3px;
    border-bottom: 4px solid;
    border-image-slice: 1;
    border-image-source: linear-gradient(90deg, #FB9E1B 0%, #9051FA 100%);
    width: auto;
    float: left;
    clear: both;
}


.Table-underline {
    border-bottom: 4px solid;
    border-image-slice: 1;
    border-image-source: linear-gradient(90deg, #FB9E1B 0%, #9051FA 100%);
}

.event-details-features {
    text-align: center;
}

    .event-details-features i {
        font-size: 35px !important;
        color: #3a1a4e;
    }


.our-partner img {
    height: 100px;
    object-fit: contain;
}

.project-img img {
    height: 230px;
    object-fit: cover;
    width: 100%;
}

.our-region {
    background-color: rgba(242, 242, 242, 0.48);
}

    .our-region img {
        height: 500px;
        object-fit: contain;
        margin: 0 auto;
    }

.oem-logo img {
    height: 80px;
    object-fit: contain;
}

.event-section {
    position: relative;
    background-image: url(/img/background.svg);
    background-size: cover;
    background-repeat: no-repeat;
}

.subscribe h1 {
    color: #fff;
}

.career {
    background-color: #89c253;
}

    .career h1, .career p {
        color: #fff !important;
    }

.intro .fas {
    font-size: 30px;
    color: #F25C26;
    padding: 0px;
}

.learning a {
    color: #515666;
}

    .learning a:hover {
        color: #88c153;
        text-decoration: none;
        transition: ease-out 0.3s;
        background-color: #f3f4f5;
    }

/*Bhushan*/

.down-border {
    border-bottom: 1px solid #716f6f;
    width: 65px;
}

.oursuccess {
    background-color: #89c253;
    color: white;
    text-align: center;
}

.section-inner-space {
    padding: 20px 0;
}

.oursuccess-text {
    font-weight: bold;
    color: white !important;
}

.oursuccess-icon {
    font-size: 60px !important;
}

.whatpeoplesay {
    padding-left: 20px;
    text-align: justify;
}

.project-Button {
    background-color: #89c253;
    color: white;
}

.WhatWeDoBest-Padding {
    padding-left: 120px !important;
}

.whatwedo-section {
    padding: 15px 0;
}

.what-we-do-icon1 {
    font-size: 10px !important;
}

.what-we-do-icon2 {
    font-size: 15px !important;
}

.address-font {
    font-size: 14px;
}

.address-padding {
    padding: 40px;
}

.icon-bullets {
    vertical-align: middle;
    font-size: 15px !important;
}

.DashboardIcons {
    background: #fff;
    border-radius: 20px;
}


/*Aakash*/
/*tab-style-start*/

.tab {
    display: flex;
    flex-wrap: wrap;
    flex-wrap: wrap;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

.tab-section {
    display: none;
}

.d-block {
    display: block !important;
}

.status-purple {
    color: #fff;
    background-color: #9B5FFF;
}

.labelAddPackage {
    font-weight: 500;
    font-size: 24px;
    font-family: 'Poppins';
    font-style: normal;
}


.d-table {
    display: table !important;
}

.table-bordered {
    border: 1px solid #dee2e6;
}

.status-warning {
    color: #000000;
    ;
    background-color: #FFEBCF;
}

.status-success {
    color: #fff;
    background-color: #76AC42;
}

.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 1rem;
    background-color: transparent;
}

.table-bordered {
    border: 1px solid #dee2e6;
}

.organization-location {
    width: 320px !important;
}

.table-responsive {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
}

.table .thead-dark th {
    color: #fff;
    background-color: #FF7544;
}

.thead-dark {
    color: #fff;
    background-color: #FF7544;
}

.thead-light {
    color: #fff;
    background-color: #FF7544;
    border-color: #FF7544;
    border-style: none;
}


.active-box {
    box-shadow: none;
    /*    border: 2px solid #33b36b;*/
    color: #fff;
    border-radius: 20px;
    width: 140px;
    margin: 0 auto;
    background: #FF7544;
}

.Inactive-box {
    box-shadow: none;
    /*    border: 2px solid #b9b7b7;*/
    color: #636161;
    border-radius: 20px;
    width: 140px;
    background: lightgray;
}


.text-align {
    text-align: right;
}

.table-bordered thead th {
    border-bottom-width: 2px;
}

.table thead th {
    vertical-align: bottom;
    border-bottom: 2px solid #dee2e6;
}

.table-bordered td, .table-bordered th {
    border: 1px solid #dee2e6;
}

.bg-light {
    background-color: #f7f9fc !important;
}

.manage-tile {
    min-height: 300px;
    max-height: 300px;
}

.manage-tile-data {
    min-height: 160px;
    max-height: 160px;
    overflow-y: auto;
    overflow-x: auto;
}

.manage-tile-bottom {
    position: absolute;
    bottom: 10px;
    right: 0;
    width: 100%;
    display: inline-block;
}

.active-tab {
    background-color: #FF7544 !important;
    color: #ffffff !important;
}

    .active-tab a {
        background-color: #FF7544 !important;
        color: #ffffff !important;
    }

    .active-tab:hover a {
        background-color: #FF7544 !important;
        color: #ffffff !important;
    }

    .active-tab:hover {
        background-color: #FF7544 !important;
        color: #ffffff !important;
    }

    .active-tab:focus {
        background-color: #FF7544 !important;
        color: #ffffff !important;
    }
/*end*/
.subscribelable {
    position: relative;
}

.subscribeEmail {
    border: none;
    padding: 15px;
    width: 260px;
    height: 35px;
}

.subscibebutton {
    border: none;
    position: absolute;
    margin-top: 27px;
    height: 35px;
    cursor: pointer;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: #7EFF00;
    text-align: center;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
}

.e-toolbar .e-toolbar-items:not(.e-tbar-pos) .e-toolbar-item:first-child {
    margin-left: 12px;
}

.e-toolbar .e-toolbar-items .e-toolbar-item:not(.e-separator) {
    height: 100%;
    min-width: 30px;
    padding: 3px 4px;
}

.e-toolbar .e-toolbar-items .e-toolbar-item {
    -ms-flex-line-pack: center;
    align-content: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    display: -ms-inline-flexbox;
    display: inline-flex;
    min-height: 0;
    vertical-align: middle;
    width: auto;
}

.e-grid [class^='e-'] {
    box-sizing: border-box;
}

.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn {
    height: calc(100% - 10px);
    margin: 0;
    min-height: 32px;
    min-width: 32px;
    padding: 0 3px;
    line-height: 27px;
}

.e-toolbar .e-toolbar-items .e-toolbar-item > * {
    -ms-flex-item-align: center;
    -ms-grid-row-align: center;
    align-self: center;
    text-overflow: ellipsis;
}

.e-toolbar .e-tbar-btn {
    background: #f8f9fa;
    box-shadow: none;
    color: #495057;
}

.e-toolbar .e-tbar-btn {
    border: none;
    cursor: pointer;
    font-family: "Helvetica Neue", "Helvetica", "Arial", "sans-serif";
    font-size: 14px;
    font-weight: 400;
    overflow: hidden;
    padding: 0 3px;
    text-align: center;
    text-decoration: none;
    text-transform: none;
}

/*acc1*/
a:hover, a:focus {
    text-decoration: none;
    outline: none;
}

#accordion .panel {
    border: none;
    box-shadow: none;
    border-radius: 0;
}

#accordion .panel-heading {
    padding: 0;
    border-radius: 0;
    border: none;
}

#accordion .panel-title a {
    display: block;
    padding: 14px 30px 14px 70px;
    font-size: 16px;
    color: #fff;
    background: #FF7544;
    position: relative;
    overflow: hidden;
    transition: all 0.5s ease 0s;
}

    #accordion .panel-title a.collapsed {
        background: #f8f8f8;
        color: #444444;
    }

        #accordion .panel-title a.collapsed:hover {
            color: #F25C26;
        }

    #accordion .panel-title a:before {
        content: "";
        width: 55px;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.1);
        position: absolute;
        top: 0;
        left: -13px;
        transition: all 0.5s ease 0s;
    }

    #accordion .panel-title a.collapsed:hover:before {
        background: #F25C26;
    }

    #accordion .panel-title a:after {
        content: "\*";
        font-family: FontAwesome;
        font-size: 20px;
        position: absolute;
        left: 15px;
        top: 50%;
        color: #fff;
        transform: translateY(-50%);
    }

    #accordion .panel-title a.collapsed:after {
        color: #9f9f9f;
    }

    #accordion .panel-title a.collapsed:hover:after {
        color: #fff;
    }

#accordion .panel-body {
    font-size: 14px;
    color: #444444;
    line-height: 25px;
    padding: 15px 5px 20px 15px;
    position: relative;
    border: none;
    transition: all 0.5s ease 0s;
}

    #accordion .panel-body:before {
        content: "";
        width: 5px;
        height: 40px;
        background: #ef6145;
        position: absolute;
        top: 30px;
        left: 0;
    }

    #accordion .panel-body p {
        margin-bottom: 0;
    }

/*acc end*/

.btn-orange {
    font-weight: 400;
    color: #FF7544 !important;
    text-decoration: none;
}

    .btn-orange :hover {
        color: #FF7544;
        text-decoration: none;
    }

.btn-vm {
    background-color: #FF7544 !important;
    border: none !important;
}


.btn-cancel {
    background-color: #fff !important;
}

.green-back {
    background: #89c353;
    padding: 50px 0px;
    color: #fff;
}


.quote {
    font-size: 60px;
    font-family: arial,sans-serif;
}

.our-team {
    width: 90%;
}

.object-fit {
    object-fit: cover;
}

.footer-bottom {
    padding: 20px;
    background: #f3f3f3;
    position: relative;
    color: #fff;
    z-index: 999;
}





.new-header {
    color: #184EA2 !important;
}


.footer-body {
    padding-top: 50px;
    padding-bottom: 20px;
    color: #fff !important;
}

.footer-hr {
    border: 1;
    height: 0;
    border-color: gray !important;
}

.footer-font {
    font-size: 12px !important;
}

.footer-text {
    color: #fff;
}

    .footer-text a {
        color: #fff;
    }

.bottom-bg {
    color: #fff;
    background-color: #0c0f21;
}

.footer-bottom a:hover {
    color: #FF7544 !important;
    text-decoration: none !important;
}

.footer-body ul li a:hover {
    color: #FF7544;
    text-decoration: none;
}



.footer-bottom a {
    color: #000000;
    text-decoration: none;
    background-color: transparent;
    font-weight: 400;
}

.custom-control-label {
    margin-bottom: 0;
}

.info {
    font-size: 15px !important;
    margin-left: 5px;
}

.footer-bottom .fab {
    font-size: 22px !important;
}

.sub-bullet {
    font-size: 8px !important;
}

.footer-bottom ul li img {
    height: 25px;
}

.sub-bullet {
    font-size: 8px !important;
}

.footer-bottom ul li img {
    height: 25px;
}

.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 295px;
}


#searchbox {
    background-image: url("/img/home/header.jpg");
}

#events-searchbox {
    background-image: url("/img/home/header.jpg");
    position: relative;
}



.organization-searchbox {
    margin-top: -142px;
    z-index: 1020;
    position: relative;
}

#home-searchbox {
    background-image: url("../home/Img-2.png");
}

#home-left-events {
    background-image: url("/img/home/left.png");
}

#home-right-events {
    background-image: url("/img/home/right.png");
}

/*
.carousel-control-prev-icon {
background-image: url(/img/home/left-arrow.png) !important;
width: 50px !important;
height: 50px !important;
}
*/


/*

.carousel-control-next-icon {
background-image: url(/img/home/right-arrow.png)!important;
width: 50px !important;
height: 50px !important;
}
*/

.offer-box {
    background-color: #184EA2 !important;
    transition: 0.9s !important;
}

.free-offer {
    position: absolute;
    bottom: -14px;
    left: 14px;
}

.offer-image-left {
    position: absolute;
    left: 14px;
    top: -40px;
}

.offer-image-right {
    position: absolute;
    bottom: 0;
    right: 0;
}


/*Search box text*/
.has-search .form-control {
    padding-left: 2.375rem;
}

.has-search .form-control-feedback {
    position: absolute;
    z-index: 2;
    display: block;
    width: 2.375rem;
    height: 2.375rem;
    line-height: 2.375rem;
    text-align: center;
    pointer-events: none;
    color: #aaa;
}

.slider-text {
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 400;
    /*font-size:22px;*/
    line-height: 27px;
    text-align: center;
    vertical-align: middle;
    color: #FFFFFF;
}

/*--------------------Media Queries--------------------*/
/* Medium size displays */
@media only screen and (min-width: 1367px) and (max-width: 1600px) {
    .one-line-truncate {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 1;
        overflow: hidden;
    }

    .section-img-height {
        height: 400px !important;
    }

    .two-line-truncate {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden;
    }


    .three-line-truncate {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
    }

    .event-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 90px;
    }

    .org-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 26px;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 85%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }

    .seat-tag {
        position: absolute;
        top: -215px;
        left: 83px;
        border: 2px solid #fff;
    }
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 767px) and (max-width: 1152px) {
    body {
        font-size: 13px !important;
    }

    .flex-col {
        width: 30% !important;
    }

    .section-img-height {
        height: 400px !important;
    }

    .wrapper {
        margin-top: 61px !important;
    }

    .truncate {
        max-width: 254px !important;
        font-size: 16px !important;
    }

    .navbar-brand img {
        width: 150px !important;
    }

    .navbar ul li {
        padding: 8px 8px !important;
        font-weight: 500;
    }

    .nav-link {
        display: block;
        /*padding: 13px 0 0 0px !important;*/
    }

    .img-height {
        height: 150px !important;
        object-fit: cover;
    }



    .slider-search {
        max-width: 928px !important;
    }

        .slider-search input {
            height: calc(1.5em + 1rem + 2px) !important;
            font-size: 14px !important;
        }

    .search-b {
        height: auto !important;
        padding: 9px !important;
        font-size: 14px !important;
    }

        .search-b i {
            font-size: 20px !important;
        }

    .organization-home-menu li {
        display: inline-block;
        padding: 10px 15px !important;
    }

    h1 {
        font-size: 24px !important;
    }

    h2 {
        font-size: 22px !important;
    }

    h3 {
        font-size: 20px !important;
    }

    h4 {
        font-size: 18px !important;
    }

    h5 {
        font-size: 16px !important;
    }

    h6 {
        font-size: 14px !important;
    }

    .tile-icon i {
        font-size: 16px;
        vertical-align: middle !important;
        margin-right: 3px;
    }

    .ticketpricedetail {
        font-size: 14px;
        font-weight: 400;
        font-family: 'Poppins';
        font-style: normal;
    }

    .card-body {
        padding: 15px !important;
    }

    .form-control {
        height: calc(1.5em + 0.8rem + 10px) !important;
        font-size: 15px !important;
        color: aqua !important;
    }

    .btn {
        font-size: 13px !important;
    }

    .slid ul li {
        height: 340px !important;
    }

    #accordion .panel-title a {
        font-size: 13px !important;
    }

    #accordion .panel-body {
        font-size: 12px;
        line-height: 21px;
    }

    .offer-image-left {
        left: 9px;
        top: -33px;
        width: 150px;
    }

    .feture-box img {
        width: 50px !important;
    }

    .event-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 78px;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 85%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }

    .seat-tag {
        position: absolute;
        top: -242px;
        left: 83px;
        border: 2px solid #fff;
    }
}




@media only screen and (min-device-width: 360px) and (max-device-width: 740px) and (orientation: landscape) {

    h4 {
        font-size: 1rem !important;
    }

    .home-banner {
        position: relative;
        height: 500px;
    }

    .flex-com {
        width: 100% !important;
    }

    .event-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 78px;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 85%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }

    .seat-tag {
        position: absolute;
        top: -215px;
        left: 83px;
        border: 2px solid #fff;
    }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1300px) and (max-width: 1366px) {
    .navbar-brand img {
        max-width: 150px !important;
    }

    .section-img-height {
        height: 400px !important;
    }

    .wrapper {
        margin-top: 60px !important;
    }

    .navbar ul li {
        padding: 10px 15px !important;
        font-weight: 500;
    }

        .navbar ul li a {
            text-decoration: none;
            color: #444;
            font-weight: 500;
            font-size: 12px !important;
        }

    #organization-representative img {
        height: 280px !important;
    }

    #organization-organizer img {
        height: 370px !important;
    }

    .about-img {
        height: auto !important;
    }

    .btn {
        font-size: 12px !important;
    }

    .search-b {
        height: 35px !important;
        padding: 7px !important;
    }

    /*a i.material-icons, button i.material-icons {
    font-size: 20px !important;
}*/

    .img-height {
        height: 200px !important;
        object-fit: cover !important;
    }

    #attendees img {
        height: 280px !important;
    }



    #accordion .panel-body {
        font-size: 12px !important;
        color: #444444;
        line-height: 20px;
        padding: 15px 5px 20px 15px;
        position: relative;
        border: none;
        transition: all 0.5s ease 0s;
    }

    #accordion .panel-title a {
        display: block;
        padding: 8px 34px 2px 70px;
        font-size: 12px !important;
        color: #fff;
        background: #F25C26;
        position: relative;
        overflow: hidden;
        transition: all 0.5s ease 0s;
    }

    .portal-img {
        height: 400px !important;
    }

    h1 {
        font-size: 1.5rem !important;
    }

    h4 {
        font-size: 1rem !important;
    }

    h5 {
        font-size: 15px !important;
    }

    h3 {
        font-size: 1.75rem !important;
    }

    h2 {
        font-size: 1.5rem !important;
    }

    .form-control {
        font-size: 14px !important;
        height: 35px !important;
    }

    .feture-box {
        padding: 5px !important;
    }

    .committee-member {
        height: 159px !important;
    }

    .section-padding {
        padding: 5px 0;
    }

    .manage-event {
        height: 250px !important;
    }

    .app-icon {
        height: 140px;
        width: 120px;
    }

    .offer-img {
        max-width: 100%;
        height: 100% !important;
    }

    .multifunctional-portal {
        height: 65px !important;
    }

    .feature-img {
        height: 550px !important;
    }

    .feture-element {
        width: 90px !important;
    }

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

    body {
        font-size: 12px !important;
    }

    h4, h4 {
        font-size: 1.0rem !important;
    }

    .navbar {
        font-size: 12px;
        line-height: 13px;
        box-shadow: 16px -10px 16px 2px rgb(0 0 0 / 30%) !important;
    }


    .header-img {
        height: 200px;
    }

    .header-info h1 {
        line-height: 5;
    }

    div p {
        font-size: 12px !important;
    }

    .organization-home-menu li {
        line-height: 0.5 !important;
    }

    .event-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 78px;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 85%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }
}
/*End*/

/*iPad*/
@media only screen and (min-width: 768px) and (max-width: 988px) {

    #content {
        width: 100%;
    }


    #sidebar {
        margin-left: -250px;
        overflow-y: scroll;
        background: #9B5FFF;
    }

        #sidebar.active {
            margin-left: 0;
        }

    .flex-item {
        flex: 100%;
        margin: 5px;
        text-align: center;
    }

    .navbar-brand img {
        max-width: 202px !important;
    }

    .navbar ul li {
        padding: 5px 15px !important;
        font-weight: 500;
    }

    .navbar {
        padding: .5rem 1rem !important;
    }

    .wrapper {
        margin-top: 79px !important;
    }

    .desk-hide {
        display: block !important;
    }

    .mobile-hide {
        display: none !important;
    }

    .mobile-caption h1 {
        font-size: 40px !important;
        padding: 8px;
        text-align: center;
        font-family: 'Mistral';
    }

    .navbar ul li a {
        text-align: center;
    }

    p {
        font-size: 14px;
    }

    .home-services-icon {
        margin: 0 auto;
        margin-bottom: 10px;
        text-align: center;
    }

    .home-service-text {
        text-align: center;
        margin-bottom: 25px;
    }

    .our-partner img {
        height: 65px;
        margin-bottom: 0px;
    }

    .our-region img {
        height: 215px;
    }

    .oem-logo img {
        height: 60px;
    }

    .header-img {
        height: 100px;
    }

    .header-info h1 {
        line-height: 5;
        font-size: 20px;
    }

    .what-we-do-body {
        width: auto !important;
    }

    .text-align {
        float: left;
    }

    .organization-home-menu li {
        display: block !important;
        padding: 15px 15px;
    }

    .offer-image-left {
        position: absolute;
        left: 0px;
        top: 1px;
        width: 108px;
    }

    .layout-box {
        width: 100%;
    }

    .slider-text {
        font-size: 10px;
    }

    .event-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 78px;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 90%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }
}
/*End*/




@media (min-width: 376px) and (max-width: 414px) {

    #events-searchbox {
        height: 250px !important;
    }

    .flex-com {
        width: 100% !important;
    }

    .home-banner {
        position: relative !important;
        height: 540px !important;
    }

    .upper-searchbar {
        margin-top: -63px;
        position: relative;
        z-index: 1029;
        background-color: #E5F1F8;
        border-radius: 20px;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
        border: 1px solid #e6e6e6 !important;
    }

    #content {
        width: 100%;
    }

    .flex-col {
        width: 100% !important;
    }

    .container-fluid {
        width: 100%;
        padding-right: 15px;
        padding-left: 0px;
        margin-right: auto;
        margin-left: auto;
    }

    .layout-box {
        width: 100%;
    }

    #sidebar {
        margin-left: -250px;
        overflow-y: scroll;
    }

        #sidebar.active {
            margin-left: 0;
        }

    .layout-box {
        width: 100%;
    }





    .wrapper {
        width: 100%;
        /*    margin-top: 74px;*/
    }


    .flex-item {
        flex: 100%;
        margin: 5px;
        text-align: center;
    }

    .navbar {
        padding: .5rem 1rem !important;
    }

    .tab-width {
        width: 100% !important;
    }

    .navbar ul li {
        padding: 5px 15px !important;
        font-weight: 500;
    }

    .wrapper {
        margin-top: 50px !important;
    }

    .desk-hide {
        display: block !important;
    }

    .mobile-hide {
        display: none !important;
    }

    .mobile-caption h1 {
        font-size: 18px !important;
        padding: 8px;
        text-align: center;
        font-family: 'Mistral';
    }

    .intro .fas {
        font-size: 20px;
    }

    .insole-img img {
        width: 250px;
        margin-bottom: 25px;
    }

    .navbar {
        font-size: 11px;
    }

    .navbar-toggler {
        font-size: 15px !important;
    }

    .navbar ul li a {
        text-align: center;
    }

    .card-body-height {
        min-height: 146px;
    }

    .what-we-do-body {
        width: auto !important;
    }

    .navbar-brand img {
        max-width: 195px !important;
    }

    .nav-text {
        font-size: 22px;
    }


    .display-4 {
        font-size: 30px !important;
    }

    p {
        font-size: 14px;
    }

    .home-services-icon {
        margin: 0 auto;
        margin-bottom: 10px;
        text-align: center;
    }

    .home-service-text {
        text-align: center;
        margin-bottom: 25px;
    }

    .our-partner img {
        height: 65px;
        margin-bottom: 0px;
    }

    .our-region img {
        height: 215px;
    }

    .oem-logo img {
        height: 60px;
    }

    .header-img {
        height: 100px;
    }

    .header-info h1 {
        line-height: 5;
        font-size: 20px;
    }

    .text-align {
        float: left;
    }

    .organization-home-menu li {
        display: block !important;
        padding: 15px 15px;
    }

    .offer-box {
        background: linear-gradient(-173.07deg, #F25C26 19.13%, #F89829 83.04%);
        height: 270px;
        border-radius: 3px;
    }

    .free-offer {
        position: absolute;
        bottom: -14px;
        left: 14px;
    }

    .offer-box-content {
        background: linear-gradient(90deg, #FB9E1B 0%, #9051FA 100%);
        margin-top: 33px;
    }

    .offer-image-left {
        position: absolute;
        left: 82px;
        top: -80px;
    }

    .offer-image-right {
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .offer-box-button {
        margin-left: 119px;
        margin-top: -8px;
    }

    .layout-box {
        width: 100%;
    }

    h4 {
        font-size: 1rem !important;
    }


    .slider-text {
        font-size: 8px;
    }

    .event-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 78px;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 86%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0px;
    }
}
/*End*/

@media screen and (max-device-width: 640px) {
    .flex-col {
        width: 100% !important;
    }

    .seat-tag {
        position: absolute;
        top: -215px;
        left: 118px;
        border: 2px solid #fff;
    }

    .desk-hide {
        display: block !important;
    }

    .mobile-hide {
        display: none !important;
    }


    .upper-searchbar {
        margin-top: auto;
        position: relative;
        z-index: 1029;
        background-color: #E5F1F8;
        border-radius: 20px;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
        border: 1px solid #e6e6e6 !important;
    }

    .flex-com {
        width: 100% !important;
    }

    #events-searchbox {
        height: 445px !important;
    }

    .container-fluid {
        width: 100%;
        padding-right: 15px;
        padding-left: 0px;
        margin-right: auto;
        margin-left: auto;
    }

    .home-banner {
        position: relative;
        height: 522px;
    }

    .subscribe-bg {
        position: relative;
        height: 401px
    }

    .layout-box {
        width: 100%;
    }

    .event-title-sticky {
        position: sticky;
        top: 88px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 0px;
        bottom: 0;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 88%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0px;
    }

    #feedback {
        float: left;
        position: fixed;
        top: calc(30% - 50px);
        right: 0;
        margin-right: -50px;
        transform: rotate(270deg);
        z-index: 2147483647;
    }

    .aos-init {
        animation: none !important;
        opacity: 1 !important; /* Ensure elements are visible */
    }

    .animated {
        -o-transition-property: none !important;
        -moz-transition-property: none !important;
        -ms-transition-property: none !important;
        -webkit-transition-property: none !important;
        transition-property: none !important;
        -o-transform: none !important;
        -moz-transform: none !important;
        -ms-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
    }
}




@media screen and (min-width: 321px) and (max-width: 375px) {


    #content {
        width: 100%;
    }

    .upper-searchbar {
        margin-top: -63px;
        position: relative;
        z-index: 1029;
        background-color: #E5F1F8;
        border-radius: 20px;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
        border: 1px solid #e6e6e6 !important;
    }

    .flex-com {
        width: 100% !important;
    }

    .home-banner {
        position: relative;
        height: 571px;
    }

    #events-searchbox {
        height: 440px !important;
    }

    .flex-col {
        width: 100% !important;
    }

    .container-fluid {
        width: 100%;
        padding-right: 15px;
        padding-left: 0px;
        margin-right: auto;
        margin-left: auto;
    }

    .layout-box {
        width: 100%;
    }

    .wrapper {
        width: 100%;
        /*    margin-top: 74px;*/
    }

    #sidebar {
        margin-left: -250px;
        overflow-y: scroll;
    }

        #sidebar.active {
            margin-left: 0;
        }

    .flex-item {
        flex: 100%;
        margin: 5px;
        text-align: center;
    }

    .navbar {
        padding: .5rem 1rem !important;
    }

    .tab-width {
        width: 100% !important;
    }

    .navbar ul li {
        padding: 5px 15px !important;
        font-weight: 500;
    }

    .wrapper {
        margin-top: 44px !important;
    }

    .desk-hide {
        display: block !important;
    }

    .mobile-hide {
        display: none !important;
    }

    .mobile-caption h1 {
        font-size: 18px !important;
        padding: 8px;
        text-align: center;
        font-family: 'Mistral';
    }

    .intro .fas {
        font-size: 20px;
    }

    .insole-img img {
        width: 200px;
        margin-bottom: 25px;
    }

    .navbar {
        font-size: 11px;
    }

    .navbar-toggler {
        font-size: 15px !important;
    }

    .navbar ul li a {
        text-align: center;
    }

    .what-we-do-body {
        width: auto !important;
    }

    .navbar-brand img {
        max-width: 200px !important;
    }

    .nav-text {
        font-size: 20px;
    }


    .display-4 {
        font-size: 30px !important;
    }

    p {
        font-size: 14px;
    }

    .home-services-icon {
        margin: 0 auto;
        margin-bottom: 10px;
        text-align: center;
    }

    .home-service-text {
        text-align: center;
        margin-bottom: 25px;
    }

    .our-partner img {
        height: 65px;
        margin-bottom: 0px;
    }

    .our-region img {
        height: 215px;
    }

    .oem-logo img {
        height: 60px;
    }

    .header-img {
        height: 100px;
    }

    .header-info h1 {
        line-height: 5;
        font-size: 20px;
    }

    .text-align {
        float: left;
    }

    .organization-home-menu li {
        display: block !important;
        padding: 15px 15px;
    }

    .offer-box {
        background: linear-gradient(-173.07deg, #F25C26 19.13%, #F89829 83.04%);
        height: 200px;
        border-radius: 3px;
    }

    .free-offer {
        position: absolute;
        bottom: -14px;
        left: 14px;
    }

    .offer-box-content {
        margin-top: 33px;
    }

    .offer-image-left {
        position: absolute;
        left: 55px;
        top: -80px;
    }

    .offer-image-right {
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .offer-box-button {
        margin-left: 77px;
        margin-top: -17px;
    }

    .layout-box {
        width: 100%;
    }

    h4 {
        font-size: 1rem !important;
    }

    .slider-text {
        font-size: 8px;
    }

    .layout-box {
        width: 100%;
    }

    .event-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 78px;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 84%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }

    .aos-init {
        animation: none !important;
        opacity: 1 !important; /* Ensure elements are visible */
    }

    .animated {
        -o-transition-property: none !important;
        -moz-transition-property: none !important;
        -ms-transition-property: none !important;
        -webkit-transition-property: none !important;
        transition-property: none !important;
        -o-transform: none !important;
        -moz-transform: none !important;
        -ms-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
    }
}
/*End*/

/*Media query iPhone XR, SE, XS, XS Max start*/

@media only screen and (device-width : 414px) and (device-height : 896px) and (-webkit-device-pixel-ratio : 2) {

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 86%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }

    .seat-tag {
        position: absolute;
        top: -215px;
        left: 132px;
        border: 2px solid #fff;
    }
}


@media only screen and (device-width : 375px) and (device-height : 812px) and (-webkit-device-pixel-ratio : 3) {
    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 86%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }

    .seat-tag {
        position: absolute;
        top: -215px;
        left: 83px;
        border: 2px solid #fff;
    }
}

@media only screen and (device-width : 414px) and (device-height : 896px) and (-webkit-device-pixel-ratio : 3) {
    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 86%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }

    .seat-tag {
        position: absolute;
        top: -215px;
        left: 83px;
        border: 2px solid #fff;
    }
}


/*Media query iPhone XR, SE, XS, XS Max start*/


@media screen and (min-width: 0px) and (max-width: 320px) {

    #content {
        width: 100%;
    }

    .seat-tag {
        position: absolute;
        top: -215px;
        left: 83px;
        border: 2px solid #fff;
    }

    .upper-searchbar {
        margin-top: -63px;
        position: relative;
        z-index: 1029;
        background-color: #E5F1F8;
        border-radius: 20px;
        box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.17) !important;
        border: 1px solid #e6e6e6 !important;
    }

    .flex-com {
        width: 100% !important;
    }

    .home-banner {
        position: relative;
        height: 888px;
    }

    #events-searchbox {
        height: 466px !important;
    }

    #sidebar {
        margin-left: -250px;
        overflow-y: scroll;
    }



    .flex-item {
        flex: 100%;
        margin: 5px;
        text-align: center;
    }

    .flex-col {
        width: 100% !important;
    }

    .container-fluid {
        width: 100%;
        padding-right: 15px;
        padding-left: 0px;
        margin-right: auto;
        margin-left: auto;
    }

    .layout-box {
        width: 100%;
    }

    .container-fluid {
        width: 100%;
        padding-right: 15px;
        padding-left: 0px;
        margin-right: auto;
        margin-left: auto;
    }

    .layout-box {
        width: 100%;
    }

    .navbar {
        padding: .5rem 1rem !important;
    }

    .tab-width {
        width: 100% !important;
    }

    .navbar ul li {
        padding: 5px 15px !important;
        font-weight: 500;
    }

    .wrapper {
        margin-top: 66px !important;
    }

    .desk-hide {
        display: block !important;
    }

    .mobile-hide {
        display: none !important;
    }

    .mobile-caption h1 {
        font-size: 13px !important;
        padding: 8px;
        text-align: center;
        font-family: 'Mistral';
    }

    .navbar ul li a {
        text-align: center;
    }

    .what-we-do-body {
        width: auto !important;
    }

    .navbar-brand img {
        max-width: 168px !important;
    }

    .nav-text {
        font-size: 16px;
    }


    p {
        font-size: 14px;
    }

    .home-services-icon {
        margin: 0 auto;
        margin-bottom: 10px;
        text-align: center;
    }

    .home-service-text {
        text-align: center;
        margin-bottom: 25px;
    }

    .our-partner img {
        height: 65px;
        margin-bottom: 0px;
    }

    .our-region img {
        height: 215px;
    }

    .oem-logo img {
        height: 60px;
    }

    .header-img {
        height: 100px;
    }

    .header-info h1 {
        text-align: center;
        color: #fff;
        vertical-align: middle;
        line-height: 4;
        font-size: 20px;
    }

    .text-align {
        float: left;
    }

    .organization-home-menu li {
        display: block !important;
        padding: 15px 15px;
    }

    .offer-box {
        background: linear-gradient(-173.07deg, #F25C26 19.13%, #F89829 83.04%);
        height: 270px;
        border-radius: 3px;
    }

    .free-offer {
        position: absolute;
        bottom: -14px;
        left: 14px;
    }

    .offer-box-content {
        margin-top: 33px;
    }

    .offer-image-left {
        position: absolute;
        left: 38px;
        top: -80px;
    }

    .offer-image-right {
        position: absolute;
        bottom: 0;
        right: 0;
    }

    .offer-box-button {
        margin-left: 65px;
        margin-top: -34px;
    }

    .layout-box {
        width: 100%;
    }

    h4 {
        font-size: 1rem !important;
    }

    .slider-text {
        font-size: 8px;
    }

    .event-title-sticky {
        position: sticky;
        top: 83px;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        margin-top: 78px;
    }

    .event-register-button-sticky {
        position: fixed;
        left: 0;
        width: 100%;
        top: 86%;
        z-index: 1000;
        background-color: white;
        transition: ease-in-out 0.4s;
        bottom: 0;
    }

    .btn-blue {
        font-size: 10px !important;
    }

    .aos-init {
        animation: none !important;
        opacity: 1 !important; /* Ensure elements are visible */
    }

    .animated {
        -o-transition-property: none !important;
        -moz-transition-property: none !important;
        -ms-transition-property: none !important;
        -webkit-transition-property: none !important;
        transition-property: none !important;
        -o-transform: none !important;
        -moz-transform: none !important;
        -ms-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
    }
}
/*End*/
.page-link {
    border: 1px !important;
    color: #1a222d !important;
    padding: .5rem 1rem !important;
    background-color: #E5E5E5;
    font-weight: 500;
}

.page-item.active .page-link {
    background-color: #F25C26 !important;
    color: #fff !important;
    border-radius: 1px;
}

.search-box {
    background-color: #ffffff;
    box-shadow: 0px 0px 5px -13px rgba(100,102,110,0.73);
    border-radius: 5px;
    border-color: 444;
}

.status-orange {
    color: rgb(246, 103, 54);
    background-color: #ffebe5;
}

.slider-opacity {
    position: absolute;
    top: 210px;
    z-index: 1028;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 37.28%, #191818c7 78.23%);
}

.slider-search {
    /*position: absolute; */
    top: 250px;
    z-index: 1029;
    max-width: 1109px;
    margin-left: auto;
    left: 0;
    margin-right: auto;
    right: 0;
}

.event-detail-img {
    width: 100%;
}

.organization-active {
    background-color: #fff !important;
    padding: 17px 40px 8px 40px !important;
    margin-left: 6px !important;
    color: #F25C26;
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    border-top: 4px solid #F25C26;
}

.slider-search ul li, .event-search ul li {
    background: rgba(73, 77, 86, 0.69);
    color: #DDDDE4;
    padding: 17px 40px 8px 40px;
    margin-left: 2px;
    font-weight: 600;
    font-size: 20px;
    line-height: 30px;
    display: inline;
}


    .slider-search ul li img, .event-search ul li img {
        margin-right: 13px;
        height: 22px;
        vertical-align: baseline;
    }


.committee-member {
    background-image: url(../img/search-bg.svg);
    height: auto;
    /* Set a specific height */
    min-height: 100px;
    /* Create the parallax scrolling effect */

    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
}

.organization-home-menu li a {
    color: #fff;
    text-decoration: none;
    font-weight: 500;
}



.organization-home-menu li {
    display: inline-block;
    padding: 15px 15px;
}

    .organization-home-menu li:hover {
        /*        background-color: #26083c;*/
        transition: ease-in-out 0.5s;
    }

.organization-home-menu ul {
    list-style: none;
    padding-left: 0px;
    margin-bottom: 0;
    text-align: center;
}

.organization-home-menu .active, .organization-home-menu .active a {
    background-color: #F25C26;
    color: #fff;
    font-weight: 500;
}

    .organization-home-menu .active:hover {
        background-color: #F25C26;
        color: #fff;
    }

.change-language {
    position: fixed;
    bottom: 30px;
    right: 20px;
    z-index: 1029;
}

    .change-language select {
        border-radius: 25px;
        font-size: 14px;
        font-weight: 600;
        content: none;
        border: 1.3px solid #F25C26;
        color: #F25C26;
    }

.truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    height: 43px;
}

.block-ellipsis {
    display: block;
    display: -webkit-box;
    max-width: 100%;
    height: 48px;
    margin: 0 auto;
    line-height: 1.2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}




.slid {
    height: 1450px;
    overflow: hidden;
    position: relative;
}

    .slid ul {
        list-style: none;
        padding: 0;
        margin: 0;
        width: 100%;
        position: absolute;
    }

        .slid ul li {
            width: 100%;
            height: 425px;
            font-size: 1.5em;
            color: #444;
            display: flex;
            align-items: center;
            justify-content: center;
        }

.feature-img-membership {
    padding: 10px;
    border-radius: 15px;
    background: linear-gradient(204.4deg, #F57327 1.22%, #F25C26 66.94%);
}



.orange-gradient:hover {
    background: linear-gradient(204.4deg, #F57327 1.22%, #F25C26 66.94%);
}

    .orange-gradient:hover img {
        background: white;
    }

.feature-img-Event {
    padding: 10px;
    border-radius: 15px;
    background: linear-gradient(235.77deg, #2696C6 1.22%, #0E63A1 66.94%);
}

.blue-gradient:hover {
    background: linear-gradient(235.77deg, #2696C6 1.22%, #0E63A1 66.94%);
}

    .blue-gradient:hover img {
        background: white;
    }

.feature-img-Apps {
    padding: 10px;
    border-radius: 15px;
    background: linear-gradient(204.4deg, #44C4A1 1.22%, #189573 66.94%);
}

.green-gradient:hover {
    background: linear-gradient(204.4deg, #44C4A1 1.22%, #189573 66.94%);
}

    .green-gradient:hover img {
        background: white;
    }

.home-feature:hover {
    border-radius: 2px;
    transition: ease-out 0.4s;
}

.border-right {
    border-right: 1px solid #dee2e6 !important;
}

.home-feature:hover label {
    color: #fff !important;
}

.home-feature:hover .feature-img {
    background: #fff !important;
}



#divCompliSecured img {
    max-height: 35px;
}

#ui-id-1, #ui-id-2 {
    max-height: 200px;
    overflow-y: auto;
}

.one-line-truncate {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    overflow: hidden;
}



.two-line-truncate {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.btn-readmore {
    border-radius: 50px !important;
    border: 2px solid #dedede !important;
    background: #FFF !important;
    color: #222222 !important;
}

    .btn-readmore:hover {
        border-radius: 50px !important;
        border: 2px solid ##05285f !important;
        background: #E5F1F8 !important;
        color: #096ED5 !important;
    }

.btn-eventtag-inactive {
    border-radius: 50px !important;
    border: 2px solid #dedede !important;
    background: #f5f5f5 !important;
    color: #222222 !important;
    cursor: pointer !important;
}

.btn-eventtag-active {
    border-radius: 50px !important;
    border: 2px solid ##05285f !important;
    background: #184EA2 !important;
    color: #ffffff !important;
}



.btn-blue {
    border-radius: 50px !important;
    background: #096ed5 !important;
    color: #fff !important;
}

.three-line-truncate {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
}

.searchlbl {
    color: #ffffff;
    font-weight: 600;
    padding: 10px;
}

#btnSearchHome {
    border-radius: 50px;
}

#btnSearchEvent {
    border-radius: 50px;
    margin-top: 7px;
}

.title-bg {
    background-color: rgba(26, 26, 26, 0.55);
    border-radius: 10px;
}

.gradient-overlay:before {
    position: absolute !important;
    content: '';
    background-image: linear-gradient(138.84deg, #0a164a 37.86%, #D71563 102.63%) !important;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 80%;
}

.parallax {
    min-height: 50px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
}

.parallax-bg {
    background-image: url('../images/publicwebsiteimages/bg2.jpg');
    background-size: cover;
}

.parallax-background {
    background-image: url(/img/Home/suppoer-Faq-parchase-bg.jpg);
    background-size: cover;
}

.detail-text {
    bottom: 160px !important;
    position: absolute;
}

.detail-icon {
    font-size: 22px !important;
    vertical-align: top;
    margin-right: 5px;
    color: #ffa500;
}

.event-caption {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    position: absolute !important;
    bottom: 80px !important;
    left: 30% !important;
    padding-top: 150px !important;
    padding-bottom: 0px !important;
}

.event-detailbanner {
    background-image: url(/img/EventDetail/conference.jpg);
    background-size: cover;
    height: 100%;
}


.demo-wrap {
    position: relative;
}

.demo-bg {
    position: absolute;
    left: 0;
    top: -19px;
    width: 100%;
    height: auto;
}

.demo-content {
    position: relative;
}

.step-num {
    font-size: 30px !important;
    font-weight: bold !important;
    color: #FB8600 !important;
}



.feature-img {
    max-height: 550px !important;
}


.parallax {
    min-height: 100px;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.gradient-overlay {
    position: relative;
    width: 100%;
    display: block;
}

.search-bg {
    background-image: url(/img/Home/search.png);
    height: auto;
    position: relative;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0px;
}


.reveal {
    position: relative;
    transform: translateY(150px);
    opacity: 0;
    transition: 1s all ease;
}

    .reveal.active {
        transform: translateY(0);
        opacity: 1;
    }

.event-sticky {
    overflow: hidden;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-y: scroll;
    position: sticky;
    top: 74px;
    transition: all .3s ease-in;
}

/*<!-- bubbles (noscript) Start -->*/



/*<!-- bubbles (noscript) End -->*/


.event-detailbanner:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: 10.60;
    z-index: -1;
}


/* =========================================================
myIndiaGlobal Business Ecosystem
Bootstrap 4.3
========================================================= */

.mig-network-section {
    position: relative;
    overflow: hidden;
    padding: 50px 0 0;
    background: linear-gradient( to bottom, #fff1ed 0%, #fff1ed 62%, #ffffff 62%, #ffffff 100% );
}


/* ---------------------------------------------------------
Section Heading
--------------------------------------------------------- */

.mig-section-label {
    display: inline-block;
    margin-bottom: 18px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.8px;
    color: #e64545;
}

.mig-section-title {
    margin: 0;
    font-size: 46px;
    line-height: 1.08;
    font-weight: 800;
    letter-spacing: -1.5px;
    color: #111111;
}

.mig-section-description {
    max-width: 700px;
    margin: 20px auto 25px;
    font-size: 16px;
    line-height: 1.65;
    color: #444444;
}


/* ---------------------------------------------------------
CTA
--------------------------------------------------------- */

.mig-primary-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 22px;
    border-radius: 4px;
    background: #e92d2d;
    color: #ffffff !important;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none !important;
    transition: all 0.25s ease;
}

    .mig-primary-btn:hover {
        background: #c91f1f;
        transform: translateY(-2px);
        box-shadow: 0 8px 20px rgba(233, 45, 45, 0.22);
    }

.mig-btn-arrow {
    margin-left: 16px;
    font-size: 22px;
    line-height: 1;
}


/* ---------------------------------------------------------
Ecosystem Area
--------------------------------------------------------- */

.mig-ecosystem {
    position: relative;
    height: 330px;
    max-width: 1150px;
    margin: 25px auto 0;
}


/* ---------------------------------------------------------
Cards
--------------------------------------------------------- */

.mig-card {
    position: absolute;
    width: 108px;
    min-height: 108px;
    padding: 17px 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border-radius: 11px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .mig-card:hover {
        transform: translateY(-8px);
        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.13);
        z-index: 10;
    }


/* ---------------------------------------------------------
Icons
--------------------------------------------------------- */

.mig-icon {
    width: 42px;
    height: 42px;
    margin-bottom: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #f3f6ff;
    color: #3569df;
    font-size: 20px;
}

.mig-card-title {
    font-size: 12px;
    line-height: 1.25;
    font-weight: 600;
    color: #202020;
}


/* ---------------------------------------------------------
Card Positions
--------------------------------------------------------- */

/* Far Left */

.mig-card-1 {
    left: 0;
    top: 70px;
}

.mig-card-2 {
    left: 120px;
    top: 0;
}

.mig-card-3 {
    left: 120px;
    top: 127px;
}

.mig-card-4 {
    left: 0;
    top: 200px;
}


/* Center Left */

.mig-card-5 {
    left: 246px;
    top: 62px;
}

.mig-card-6 {
    left: 375px;
    top: 105px;
}


/* Center */

.mig-card-center-1 {
    left: 500px;
    top: 30px;
    width: 120px;
    min-height: 120px;
    border-radius: 14px;
}

.mig-card-center-2 {
    left: 500px;
    top: 170px;
    width: 120px;
    min-height: 120px;
    border-radius: 14px;
}


/* Center Right */

.mig-card-7 {
    right: 365px;
    top: 105px;
}

.mig-card-8 {
    right: 240px;
    top: 62px;
}


/* Far Right */

.mig-card-9 {
    right: 120px;
    top: 0;
}

.mig-card-10 {
    right: 120px;
    top: 120px;
}

.mig-card-11 {
    right: 0;
    top: 70px;
}

.mig-card-12 {
    right: 0;
    top: 200px;
}


/* ---------------------------------------------------------
Different Icon Colors
--------------------------------------------------------- */

.mig-card:nth-child(2) .mig-icon {
    color: #e84c4c;
    background: #fff0f0;
}

.mig-card:nth-child(3) .mig-icon {
    color: #f39a21;
    background: #fff6e8;
}

.mig-card:nth-child(4) .mig-icon {
    color: #16a46c;
    background: #eafaf3;
}

.mig-card:nth-child(5) .mig-icon {
    color: #8157d9;
    background: #f3efff;
}

.mig-card:nth-child(6) .mig-icon {
    color: #e45b35;
    background: #fff0eb;
}

.mig-card:nth-child(7) .mig-icon {
    color: #2878d7;
    background: #edf5ff;
}

.mig-card:nth-child(8) .mig-icon {
    color: #eb4e6b;
    background: #fff0f3;
}

.mig-card:nth-child(9) .mig-icon {
    color: #ef8b19;
    background: #fff5e8;
}

.mig-card:nth-child(10) .mig-icon {
    color: #18a47a;
    background: #eafaf4;
}

.mig-card:nth-child(11) .mig-icon {
    color: #6954d9;
    background: #f1efff;
}

.mig-card:nth-child(12) .mig-icon {
    color: #d94848;
    background: #fff0f0;
}


/* ---------------------------------------------------------
Responsive - Tablet
--------------------------------------------------------- */

@media (max-width: 991px) {

    .mig-section-title {
        font-size: 40px;
    }

    .mig-ecosystem {
        height: 450px;
        max-width: 700px;
    }

    .mig-card-1 {
        left: 20px;
        top: 100px;
    }

    .mig-card-2 {
        left: 120px;
        top: 20px;
    }

    .mig-card-3 {
        left: 120px;
        top: 140px;
    }

    .mig-card-4 {
        left: 20px;
        top: 260px;
    }

    .mig-card-5 {
        left: 235px;
        top: 100px;
    }

    .mig-card-6 {
        left: 330px;
        top: 220px;
    }

    .mig-card-center-1 {
        left: 290px;
        top: 20px;
    }

    .mig-card-center-2 {
        left: 290px;
        top: 280px;
    }

    .mig-card-7 {
        right: 235px;
        top: 100px;
    }

    .mig-card-8 {
        right: 120px;
        top: 140px;
    }

    .mig-card-9 {
        right: 120px;
        top: 20px;
    }

    .mig-card-10 {
        right: 120px;
        top: 260px;
    }

    .mig-card-11 {
        right: 20px;
        top: 100px;
    }

    .mig-card-12 {
        right: 20px;
        top: 280px;
    }
}


/* ---------------------------------------------------------
Responsive - Mobile
--------------------------------------------------------- */

@media (max-width: 767px) {

    .mig-network-section {
        padding-top: 60px;
        background: linear-gradient( to bottom, #fff1ed 0%, #fff1ed 45%, #ffffff 45%, #ffffff 100% );
    }

    .mig-section-title {
        font-size: 34px;
        letter-spacing: -0.8px;
    }

    .mig-section-description {
        padding: 0 15px;
        font-size: 15px;
    }

    .mig-ecosystem {
        height: auto;
        margin-top: 40px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
        padding: 0 15px 40px;
    }

    .mig-card,
    .mig-card-center-1,
    .mig-card-center-2 {
        position: relative;
        left: auto !important;
        right: auto !important;
        top: auto !important;
        width: 100%;
        min-height: 115px;
    }

    .mig-card-center-1,
    .mig-card-center-2 {
        border-radius: 11px;
    }
}


/* ---------------------------------------------------------
Small Mobile
--------------------------------------------------------- */

@media (max-width: 480px) {

    .mig-section-title {
        font-size: 30px;
    }

    .mig-primary-btn {
        width: 100%;
    }

    .mig-ecosystem {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .mig-card {
        min-height: 105px;
    }

    .mig-card-title {
        font-size: 11px;
    }
}



/* =========================================
BUSINESS GROWTH SECTION
Bootstrap 4.3 responsive layout
========================================= */

.business-growth-section {
    position: relative;
    width: 100%;
    height: auto;
    min-height: 600px;
    overflow: hidden;
    font-family: Arial, Helvetica, sans-serif;
    padding: 0 0 0;
    box-sizing: border-box;
}

    .business-growth-section *,
    .business-growth-section *::before,
    .business-growth-section *::after {
        box-sizing: border-box;
    }

    .business-growth-section .container {
        width: 100%;
        height: auto;
    }

    .business-growth-section .row {
        min-height: 600px;
        height: auto;
        align-items: stretch;
    }

    /* =========================================
INTRO CONTENT
========================================= */

    .business-growth-section .growth-intro {
        position: absolute;
        top: 0;
        left: 15px;
        height: auto;
        padding: 105px 0 0 10px;
        z-index: 4;
    }

.growth-intro h2 {
    margin: 0;
    color: #303030;
    font-size: clamp(36px, 3.3vw, 48px);
    line-height: 1.02;
    font-weight: 400;
    letter-spacing: -2px;
}

.growth-intro p {
    max-width: 230px;
    margin: 20px 0 0;
    color: #555;
    font-size: 14px;
    line-height: 1.6;
}

/* Curved arrow */

.growth-arrow {
    position: absolute;
    top: 175px;
    left: 195px;
    width: 100px;
    height: 90px;
    pointer-events: none;
}

    .growth-arrow svg {
        display: block;
        width: 100%;
        height: 100%;
    }

/* =========================================
METRIC CARDS
========================================= */

.business-growth-section .growth-metrics {
    position: relative;
    width: 100%;
    height: 600px;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 0;
    padding: 0;
}

.growth-card {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    max-width: 225px;
    overflow: hidden;
    border-radius: 115px 115px 0 0;
    text-align: center;
}

.growth-card-purple {
    height: 255px;
    background: #c4b5ff;
    z-index: 1;
}

.growth-card-blue {
    height: 347px;
    background: #a8e5f5;
    z-index: 2;
    margin-left: -1px;
}

.growth-card-orange {
    height: 501px;
    background: #ffd1a8;
    z-index: 3;
    margin-left: -1px;
}

.growth-card-content {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 61px 12px 0;
}

/* Numbers */

.growth-number {
    position: relative;
    z-index: 5;
    margin: 0;
    color: #050505;
    font-size: clamp(36px, 3.4vw, 50px);
    line-height: 1;
    font-weight: 700;
    letter-spacing: -2px;
}

/* Titles */

.growth-card h3 {
    position: relative;
    z-index: 5;
    margin: 7px 0 0;
    color: #111;
    font-size: clamp(16px, 1.4vw, 20px);
    line-height: 1.12;
    font-weight: 500;
}

/* Description */

.growth-card p {
    position: relative;
    z-index: 5;
    max-width: 190px;
    margin: 9px auto 0;
    color: #171717;
    font-size: 13px;
    line-height: 1.4;
}

/* Card icons */

.growth-icon {
    position: absolute;
    left: 50%;
    bottom: -5px;
    width: min(125px, 85%);
    height: 85px;
    transform: translateX(-50%);
    opacity: .75;
}

    .growth-icon i {
        max-width: 100%;
    }

    .growth-icon svg {
        display: block;
        width: 100%;
        height: 100%;
    }

.growth-card-orange .growth-card-content > div:last-child {
    margin-top: 56px !important;
}

.growth-card-orange img {
    display: block;
    width: 100%;
    max-width: 180px;
    height: auto;
    margin: 0 auto;
    object-fit: contain;
}

/* =========================================
LAPTOPS: 992px–1199px
========================================= */

@media (min-width: 992px) and (max-width: 1199px) {
    .business-growth-section .row {
        min-height: 550px;
    }

    .business-growth-section .growth-metrics {
        height: 550px;
    }

    .business-growth-section .growth-intro {
        padding-top: 95px;
    }

    .growth-card {
        max-width: 195px;
    }

    .growth-card-purple {
        height: 235px;
    }

    .growth-card-blue {
        height: 320px;
    }

    .growth-card-orange {
        height: 460px;
    }

    .growth-card-content {
        padding-left: 8px;
        padding-right: 8px;
    }

    .growth-card-orange .growth-card-content > div:last-child {
        margin-top: 22px !important;
    }
}

/* =========================================
TABLETS: 768px–991px
========================================= */

@media (min-width: 768px) and (max-width: 991px) {
    .business-growth-section {
        min-height: 0;
        padding: 50px 0 0;
    }

        .business-growth-section .row {
            min-height: 0;
        }

            .business-growth-section .row > .col-lg-2,
            .business-growth-section .row > .col-md-2 {
                display: none;
            }

            .business-growth-section .row > .col-lg-8,
            .business-growth-section .row > .col-md-8 {
                flex: 0 0 100%;
                max-width: 100%;
            }

        .business-growth-section .growth-intro {
            position: relative;
            top: auto;
            left: auto;
            width: 100%;
            padding: 0 0 35px;
            text-align: center;
        }

    .growth-intro h2 {
        font-size: 42px;
        letter-spacing: -1px;
    }

    .growth-intro p {
        max-width: 440px;
        margin: 15px auto 0;
    }

    .growth-arrow {
        display: none;
    }

    .business-growth-section .growth-metrics {
        height: 430px;
        justify-content: center;
    }

    .growth-card {
        flex: 0 1 31%;
        max-width: 220px;
        border-radius: 100px 100px 0 0;
    }

    .growth-card-purple {
        height: 230px;
    }

    .growth-card-blue {
        height: 310px;
    }

    .growth-card-orange {
        height: 400px;
    }

    .growth-card-content {
        padding: 45px 8px 0;
    }

    .growth-number {
        font-size: 42px;
    }

    .growth-card h3 {
        font-size: 17px;
    }

    .growth-card p {
        font-size: 12px;
    }

    .growth-card-orange .growth-card-content > div:last-child {
        margin-top: 20px !important;
    }
}

/* =========================================
MOBILE: UP TO 767px
========================================= */

@media (max-width: 767px) {
    .business-growth-section {
        min-height: 0;
        height: auto;
        padding: 45px 0 0;
        overflow: hidden;
    }

        .business-growth-section .container {
            height: auto;
            padding-left: 15px;
            padding-right: 15px;
        }

        .business-growth-section .row {
            height: auto;
            min-height: 0;
            margin-left: -15px;
            margin-right: -15px;
        }

            .business-growth-section .row > .col-lg-2,
            .business-growth-section .row > .col-md-2 {
                display: none;
            }

            .business-growth-section .row > .col-lg-8,
            .business-growth-section .row > .col-md-8 {
                flex: 0 0 100%;
                width: 100%;
                max-width: 100%;
            }

        /* Intro */

        .business-growth-section .growth-intro {
            position: relative;
            top: auto;
            left: auto;
            width: 100%;
            height: auto;
            padding: 0 15px 30px;
            text-align: center;
        }

    .growth-intro h2 {
        font-size: clamp(34px, 8vw, 42px);
        line-height: 1.05;
        letter-spacing: -1px;
    }

    .growth-intro p {
        max-width: 340px;
        margin: 14px auto 0;
        font-size: 14px;
        line-height: 1.6;
    }

    .growth-arrow {
        display: none;
    }

    /* Stack the cards */

    .business-growth-section .growth-metrics {
        width: 100%;
        height: auto;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 16px;
        padding: 0 10px;
    }

    .growth-card {
        flex: none;
        width: 100%;
        max-width: 360px;
        min-width: 0;
        margin: 0 !important;
        border-radius: 85px 85px 0 0;
    }

    .growth-card-purple {
        height: 265px;
        order: 1;
    }

    .growth-card-blue {
        height: 285px;
        order: 2;
    }

    .growth-card-orange {
        height: 340px;
        order: 3;
    }

    .growth-card-content {
        padding: 43px 18px 0;
    }

    .growth-number {
        font-size: 46px;
    }

    .growth-card h3 {
        font-size: 20px;
        line-height: 1.15;
    }

    .growth-card p {
        max-width: 260px;
        font-size: 13px;
        line-height: 1.4;
    }

    .growth-icon {
        width: 110px;
        height: 75px;
    }

        .growth-icon i {
            font-size: 64px !important;
        }

    .growth-card-orange .growth-card-content > div:last-child {
        margin-top: 20px !important;
    }

    .growth-card-orange img {
        max-width: 155px;
        max-height: 132px;
        object-fit: contain;
    }
}

/* =========================================
SMALL MOBILE: UP TO 420px
========================================= */

@media (max-width: 420px) {
    .business-growth-section {
        padding-top: 35px;
    }

        .business-growth-section .growth-intro {
            padding-bottom: 25px;
        }

    .growth-intro h2 {
        font-size: 35px;
    }

    .growth-intro p {
        font-size: 13px;
    }

    .business-growth-section .growth-metrics {
        padding: 0 5px;
        gap: 12px;
    }

    .growth-card {
        max-width: 100%;
        border-radius: 72px 72px 0 0;
    }

    .growth-card-purple {
        height: 250px;
    }

    .growth-card-blue {
        height: 270px;
    }

    .growth-card-orange {
        height: 320px;
    }

    .growth-card-content {
        padding: 40px 12px 0;
    }

    .growth-number {
        font-size: 42px;
    }

    .growth-card h3 {
        font-size: 18px;
    }

    .growth-card p {
        font-size: 12px;
    }
}

/* =========================================
VERY SMALL SCREENS
========================================= */

@media (max-width: 340px) {
    .growth-card {
        border-radius: 60px 60px 0 0;
    }

    .growth-card-content {
        padding-left: 8px;
        padding-right: 8px;
    }

    .growth-number {
        font-size: 38px;
    }

    .growth-card h3 {
        font-size: 17px;
    }
}



/* =========================================================
BUSINESS DISCOVERY SECTION
Bootstrap 4.3
========================================================= */

.business-discovery {
    width: 100%;
    background: #ffffff;
    padding: 20px 0 18px;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
}


/* =========================================================
HEADER
========================================================= */

.business-search-header {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 95px;
    padding: 0 0 18px;
}


/* Heading */

.business-heading {
    position: absolute;
    top: 0;
    left: 0;
}

    .business-heading h1 {
        margin: 0;
        color: #111111;
        font-size: 26px;
        line-height: 1.2;
        font-weight: 700;
    }

        .business-heading h1 span {
            color: #0877d1;
        }


/* =========================================================
SEARCH AREA
========================================================= */

.search-area {
    display: flex;
    align-items: center;
    margin-top: 48px;
    width: 755px;
}


/* Location */

.location-box {
    width: 247px;
    height: 51px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    background: #fff;
    border: 1px solid #555;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0,0,0,.12);
    color: #333;
    font-size: 15px;
}

.location-icon {
    margin-right: 10px;
    color: #f25c26;
    font-size: 18px;
}


/* Search */

.business-search-box {
    position: relative;
    display: flex;
    align-items: center;
    width: 493px;
    height: 51px;
    margin-left: 15px;
    border: 1px solid #555;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,.12);
    overflow: hidden;
}

    .business-search-box input {
        width: 100%;
        height: 100%;
        border: 0;
        outline: none;
        padding: 0 95px 0 16px;
        font-size: 14px;
        color: #333;
    }

        .business-search-box input::placeholder {
            color: #888;
        }


/* Microphone */

.voice-btn {
    position: absolute;
    right: 49px;
    top: 0;
    width: 45px;
    height: 49px;
    border: 0;
    background: transparent;
    color: #0096df;
    font-size: 18px;
    cursor: pointer;
}


/* Search button */

.search-btn {
    position: absolute;
    right: 5px;
    top: 5px;
    width: 39px;
    height: 39px;
    border: 0;
    border-radius: 5px;
    background: #ff4b19;
    color: #fff;
    font-size: 17px;
    cursor: pointer;
}

    .search-btn:hover {
        background: #e83d0c;
    }


/* =========================================================
HEADER ACTION
========================================================= */

.business-header-action {
    margin-left: auto;
    margin-top: 35px;
}

.download-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 140px;
    height: 40px;
    padding: 0 15px;
    border: 1px solid #555;
    border-radius: 5px;
    background: #fff;
    color: #222;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: .2s ease;
}

    .download-btn:hover {
        background: #f4f4f4;
        color: #111;
        text-decoration: none;
    }


/* =========================================================
PROMOTION AREA
========================================================= */

.business-promotions {
    display: flex;
    align-items: stretch;
    width: 100%;
    gap: 19px;
}


/* =========================================================
MAIN BANNER
========================================================= */

.business-main-banner {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
    height: 240px;
    border-radius: 12px;
    overflow: hidden;
    background: linear-gradient( 90deg, #dff2ff 0%, #bce5fa 45%, #9ed7f5 100% );
}


    /* Background graphic */

    .business-main-banner:before {
        content: "";
        position: absolute;
        right: -50px;
        bottom: -90px;
        width: 440px;
        height: 250px;
        background: radial-gradient( circle, rgba(255,255,255,.8) 0, rgba(255,255,255,0) 65% );
        border-radius: 50%;
    }


/* Overlay */

.banner-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient( 90deg, rgba(255,255,255,.25), transparent 65% );
}


/* Banner content */

.banner-content {
    position: relative;
    z-index: 5;
    padding: 38px 35px;
}

.banner-small-title {
    display: block;
    margin-bottom: 7px;
    color: #0875bd;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
}

.banner-content h2 {
    margin: 0;
    color: #111;
    font-size: 32px;
    line-height: 1.08;
    font-weight: 700;
}

.banner-content p {
    max-width: 400px;
    margin: 9px 0 17px;
    color: #333;
    font-size: 15px;
    line-height: 1.4;
}


/* Banner button */

.banner-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    padding: 0 18px;
    background: #f04444;
    border-radius: 5px;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 3px 5px rgba(0,0,0,.15);
    transition: .2s ease;
}

    .banner-btn:hover {
        background: #d93636;
        color: #fff;
        text-decoration: none;
    }


/* =========================================================
NETWORK GRAPHIC
========================================================= */

.network-graphic {
    position: absolute;
    right: 55px;
    top: 30px;
    width: 250px;
    height: 180px;
}

.network-node {
    position: absolute;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: rgba(255,255,255,.65);
    border: 5px solid rgba(0,119,190,.18);
}

.node-1 {
    left: 100px;
    top: 5px;
}

.node-2 {
    left: 15px;
    top: 70px;
}

.node-3 {
    right: 15px;
    top: 65px;
}

.node-4 {
    left: 75px;
    bottom: 5px;
}

.node-5 {
    right: 35px;
    bottom: 0;
}

.network-line {
    position: absolute;
    height: 3px;
    background: rgba(0,105,175,.2);
    transform-origin: left center;
}

.network-line-1 {
    width: 100px;
    left: 120px;
    top: 42px;
    transform: rotate(145deg);
}

.network-line-2 {
    width: 105px;
    left: 125px;
    top: 42px;
    transform: rotate(35deg);
}

.network-line-3 {
    width: 95px;
    left: 40px;
    top: 91px;
    transform: rotate(-30deg);
}

.network-line-4 {
    width: 95px;
    left: 95px;
    top: 145px;
    transform: rotate(-35deg);
}


/* =========================================================
JUSTDIAL STYLE BUSINESS HERO
BOOTSTRAP 4.3
========================================================= */

.jd-business-hero {
    width: 100%;
    padding: 20px 0 18px;
    background: #fff;
    font-family: Arial, Helvetica, sans-serif;
    overflow: hidden;
}


/* =========================================================
HEADER
========================================================= */

.jd-hero-header {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: 95px;
    padding-bottom: 18px;
}


/* TITLE */

.jd-heading {
    position: absolute;
    left: 0;
    top: 0;
}

    .jd-heading h1 {
        margin: 0;
        color: #111;
        font-size: 27px;
        line-height: 1.2;
        font-weight: 700;
    }

        .jd-heading h1 span {
            color: #0878d1;
        }


/* =========================================================
SEARCH
========================================================= */

.jd-search-wrapper {
    display: flex;
    width: 755px;
    margin-top: 47px;
}


/* LOCATION */

.jd-location {
    width: 247px;
    height: 51px;
    display: flex;
    align-items: center;
    padding: 0 12px;
    background: #fff;
    border: 1px solid #555;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0,0,0,.12);
    color: #333;
    font-size: 15px;
}

    .jd-location i {
        margin-right: 10px;
        color: #888;
        font-size: 18px;
    }


/* SEARCH INPUT */

.jd-search {
    position: relative;
    width: 493px;
    height: 51px;
    margin-left: 15px;
    border: 1px solid #555;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,.12);
    overflow: hidden;
}

    .jd-search input {
        width: 100%;
        height: 100%;
        padding: 0 95px 0 16px;
        border: 0;
        outline: 0;
        font-size: 14px;
        color: #333;
    }

        .jd-search input::placeholder {
            color: #888;
        }


/* MICROPHONE */

.jd-mic {
    position: absolute;
    right: 48px;
    top: 0;
    width: 43px;
    height: 49px;
    border: 0;
    background: transparent;
    color: #0098df;
    font-size: 18px;
    cursor: pointer;
}


/* SEARCH BUTTON */

.jd-search-button {
    position: absolute;
    right: 5px;
    top: 5px;
    width: 39px;
    height: 39px;
    border: 0;
    border-radius: 5px;
    background: #ff4b19;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
}


/* =========================================================
RIGHT ACTION
========================================================= */

.jd-action {
    margin-left: auto;
    margin-top: 30px;
}

    .jd-action a {
        display: flex;
        align-items: center;
        justify-content: center;
        min-width: 145px;
        height: 40px;
        padding: 0 15px;
        border: 1px solid #555;
        border-radius: 5px;
        background: #fff;
        color: #222;
        font-size: 13px;
        font-weight: 600;
        text-decoration: none;
    }

        .jd-action a:hover {
            color: #222;
            background: #f5f5f5;
            text-decoration: none;
        }


/* =========================================================
HERO CONTENT
========================================================= */

.jd-hero-content {
    display: flex;
    align-items: stretch;
    width: 100%;
    gap: 19px;
}


/* =========================================================
LEFT SLIDER
========================================================= */

.jd-banner-wrapper {
    flex: 1 1 auto;
    min-width: 0;
}

.jd-banner-slider {
    width: 100%;
}

    .jd-banner-slider .carousel-inner {
        width: 100%;
    }


/* =========================================================
BANNER
========================================================= */

.jd-banner {
    position: relative;
    width: 100%;
    height: 240px;
    overflow: hidden;
    border-radius: 12px;
}


/* Slide 1 */

.jd-banner-one {
    background: linear-gradient( 110deg, #dff3ff 0%, #b9e4fa 55%, #8bcff0 100% );
}


/* Slide 2 */

.jd-banner-two {
    background: linear-gradient( 110deg, #e9f8f4 0%, #b9e8dc 55%, #81cfc0 100% );
}


/* Slide 3 */

.jd-banner-three {
    background: linear-gradient( 110deg, #f5edff 0%, #d8c5f5 55%, #bda0e5 100% );
}


/* Decorative circle */

.jd-banner:after {
    content: "";
    position: absolute;
    right: -80px;
    bottom: -160px;
    width: 480px;
    height: 330px;
    border-radius: 50%;
    background: rgba(255,255,255,.25);
}


/* =========================================================
BANNER TEXT
========================================================= */

.jd-banner-text {
    position: relative;
    z-index: 10;
    padding: 22px;
}

    .jd-banner-text span {
        display: block;
        margin-bottom: 5px;
        color: #0878c9;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: 1px;
    }

    .jd-banner-text h2 {
        margin: 0;
        color: #111;
        font-size: 31px;
        line-height: 1.08;
        font-weight: 700;
    }

    .jd-banner-text p {
        max-width: 390px;
        margin: 10px 0 16px;
        color: #333;
        font-size: 14px;
        line-height: 1.4;
    }


    /* BUTTON */

    .jd-banner-text a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 38px;
        padding: 0 18px;
        border-radius: 5px;
        background: #f04444;
        color: #fff;
        font-size: 13px;
        font-weight: 700;
        text-decoration: none;
        box-shadow: 0 3px 6px rgba(0,0,0,.15);
    }

        .jd-banner-text a:hover {
            background: #d93636;
            color: #fff;
            text-decoration: none;
        }


/* =========================================================
NETWORK GRAPHIC
========================================================= */

.jd-banner-network {
    position: absolute;
    right: 40px;
    top: 30px;
    width: 260px;
    height: 180px;
    z-index: 3;
    opacity: .85;
}

.network-circle {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 55px;
    height: 55px;
    border-radius: 50%;
    background: rgba(255,255,255,.72);
    border: 4px solid rgba(0,100,180,.12);
    color: #0878c9;
    font-size: 21px;
}

.circle-1 {
    left: 100px;
    top: 0;
}

.circle-2 {
    left: 5px;
    top: 70px;
}

.circle-3 {
    right: 0;
    top: 65px;
}

.circle-4 {
    left: 100px;
    bottom: 0;
}


/* Connecting lines */

.network-connect {
    position: absolute;
    height: 3px;
    background: rgba(0,100,180,.17);
    transform-origin: left center;
}

.connect-1 {
    width: 110px;
    left: 127px;
    top: 44px;
    transform: rotate(143deg);
}

.connect-2 {
    width: 105px;
    left: 127px;
    top: 44px;
    transform: rotate(37deg);
}

.connect-3 {
    width: 105px;
    left: 45px;
    top: 94px;
    transform: rotate(30deg);
}


/* =========================================================
BANNER CONTROLS
========================================================= */

.jd-banner-prev,
.jd-banner-next {
    width: 38px;
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    transition: opacity .2s ease;
}

.jd-banner-slider:hover
.jd-banner-prev,
.jd-banner-slider:hover
.jd-banner-next {
    opacity: 1;
}

.jd-banner-prev {
    left: 5px;
}

.jd-banner-next {
    right: 5px;
}

    .jd-banner-prev span,
    .jd-banner-next span {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        border-radius: 50%;
        background: rgba(0,0,0,.5);
        color: #fff;
        font-size: 20px;
    }


/* =========================================================
BANNER DOTS
========================================================= */

.jd-banner-indicators {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 11px !importantpx;
    margin: 0;
    justify-content: center;
    z-index: 20;
}

    .jd-banner-indicators li {
        width: 7px;
        height: 7px;
        margin: 0 4px;
        border: 0;
        border-radius: 50%;
        background: #fff;
        opacity: .7;
    }

        .jd-banner-indicators li.active {
            opacity: 1;
            background: #fff;
            transform: scale(1.15);
        }


/* =========================================================
RIGHT BUSINESS CARDS
========================================================= */

.jd-business-cards {
    display: flex;
    gap: 19px;
    flex: 0 0 693px;
}


/* CARD */

.jd-business-card {
    position: relative;
    flex: 1;
    height: 240px;
    overflow: hidden;
    border-radius: 12px;
    color: #fff;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease;
}

    .jd-business-card:hover {
        color: #fff;
        text-decoration: none;
        transform: translateY(-3px);
        box-shadow: 0 8px 18px rgba(0,0,0,.15);
    }


/* COLORS */

.card-blue {
    background: #0879cb;
}

.card-dark-blue {
    background: #315da8;
}

.card-purple {
    background: #625fce;
}

.card-green {
    background: #008c70;
}


/* =========================================================
CARD CONTENT
========================================================= */

.jd-card-content {
    position: relative;
    z-index: 10;
    padding: 17px 13px;
}

    .jd-card-content h3 {
        margin: 0;
        color: #fff;
        font-size: 17px;
        line-height: 1.18;
        font-weight: 700;
    }

    .jd-card-content p {
        margin: 10px 0 0;
        color: #fff;
        font-size: 13px;
        line-height: 1.35;
    }


/* =========================================================
CARD ARROW
========================================================= */

.jd-card-arrow {
    position: absolute;
    left: 0;
    bottom: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 29px;
    height: 29px;
    background: rgb(255 255 255 / 56%);
    color: #f25c26;
    font-size: 21px;
    z-index: 20;
}



    .jd-card-arrow:hover {
        position: absolute;
        left: 0;
        bottom: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 29px;
        height: 29px;
        background: #f25c26;
        color: #fff;
        font-size: 21px;
        z-index: 20;
    }

/* =========================================================
CARD PERSON
========================================================= */

.jd-card-person {
    position: absolute;
    right: -5px;
    bottom: 0;
    width: 120px;
    height: 171px;
    z-index: 3;
    top: 151px;
}


/* Head */

.person-head {
    position: absolute;
    left: 28px;
    top: 0;
    width: 48px;
    height: 52px;
    background: #bd7958;
    border-radius: 50%;
}


    /* Hair */

    .person-head:before {
        content: "";
        position: absolute;
        left: -2px;
        top: -7px;
        width: 51px;
        height: 30px;
        background: #202020;
        border-radius: 50% 50% 30% 30%;
    }


/* Body */

.person-body {
    position: absolute;
    left: 5px;
    bottom: 0;
    width: 90px;
    height: 108px;
    background: #e1e1e1;
    border-radius: 40px 40px 0 0;
}


/* Dark person */

.person-dark .person-body {
    background: #1f3c62;
}


/* Green person */

.person-green .person-body {
    background: #fff;
}


/* =========================================================
BUILDING
========================================================= */

.jd-building {
    position: absolute;
    left: 15px;
    bottom: 0;
    width: 100px;
    height: 145px;
    background: linear-gradient( 135deg, #dce9ef, #55758c );
    transform: skewY(-5deg);
    border-radius: 3px 3px 0 0;
}

    .jd-building span {
        display: inline-block;
        width: 13px;
        height: 18px;
        margin: 10px 4px 0 7px;
        background: #fff;
        opacity: .75;
    }


/* =========================================================
TABLET
========================================================= */

@media (max-width: 1199px) {

    .jd-search-wrapper {
        width: 650px;
    }

    .jd-location {
        width: 210px;
    }

    .jd-search {
        width: 425px;
    }

    .jd-business-cards {
        flex-basis: 600px;
        gap: 10px;
    }

    .jd-banner-network {
        right: 0;
        opacity: .5;
    }
}


/* =========================================================
TABLET
========================================================= */

@media (max-width: 991px) {

    .jd-hero-header {
        display: block;
        min-height: auto;
    }

    .jd-heading {
        position: relative;
        margin-bottom: 15px;
    }

    .jd-search-wrapper {
        width: 100%;
        margin-top: 0;
    }

    .jd-action {
        position: absolute;
        right: 0;
        top: 0;
        margin: 0;
    }


    /* Main banner */

    .jd-hero-content {
        display: block;
    }

    .jd-banner {
        height: 270px;
    }


    /* Cards */

    .jd-business-cards {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        width: 100%;
        margin-top: 15px;
        gap: 10px;
    }

    .jd-business-card {
        width: 100%;
        height: 220px;
    }
}


/* =========================================================
MOBILE
========================================================= */

@media (max-width: 767px) {

    .jd-business-hero {
        padding-top: 15px;
    }


    /* Header */

    .jd-heading h1 {
        font-size: 22px;
    }

    .jd-action {
        position: relative;
        top: auto;
        right: auto;
        margin: 12px 0 15px;
    }

        .jd-action a {
            width: 100%;
        }


    /* Search */

    .jd-search-wrapper {
        display: block;
    }

    .jd-location {
        width: 100%;
        margin-bottom: 10px;
    }

    .jd-search {
        width: 100%;
        margin-left: 0;
    }


    /* Banner */

    .jd-banner {
        height: 310px;
        border-radius: 10px;
    }

    .jd-banner-text {
        padding: 30px 20px;
    }

        .jd-banner-text h2 {
            font-size: 27px;
        }

        .jd-banner-text p {
            max-width: 270px;
            font-size: 13px;
        }

    .jd-banner-network {
        right: -50px;
        bottom: -20px;
        top: auto;
        transform: scale(.65);
        opacity: .4;
    }


    /* Cards */

    .jd-business-cards {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
        margin-top: 10px;
    }

    .jd-business-card {
        height: 200px;
    }
}


/* =========================================================
SMALL MOBILE
========================================================= */

@media (max-width: 480px) {

    .jd-heading h1 {
        font-size: 20px;
    }

    .jd-banner {
        height: 300px;
    }

    .jd-banner-text h2 {
        font-size: 24px;
    }

    .jd-business-cards {
        grid-template-columns: 1fr 1fr;
    }

    .jd-business-card {
        height: 185px;
    }

    .jd-card-content h3 {
        font-size: 15px;
    }

    .jd-card-content p {
        font-size: 12px;
    }

    .jd-card-person {
        transform: scale(.8);
        transform-origin: bottom right;
    }
}

/* Sticky Buttons Container */
.sticky-buttons {
    position: fixed;
    right: 0;
    top: 30%;
    transform: translateY(-50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

/* Common Button Style */
.sticky-btn {
    width: 42px;
    height: 94px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff !important;
    text-decoration: none !important;
    font-size: 14px;
    font-weight: 600;
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    border-radius: 0px 10px 10px 0px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.20);
    transition: width 0.25s ease, box-shadow 0.25s ease;
}

/* Advertise */
.advertise-btn {
    background: #e8490b;
}

/* Free Listing */
.free-listing-btn {
    background: #087dcc;
}

/* Hover */
.sticky-btn:hover {
    width: 48px;
    color: #fff !important;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.30);
}

/* Remove margin from last button */
.sticky-btn:last-child {
    margin-bottom: 0;
}

/* Mobile */
@media (max-width: 767px) {
    .sticky-btn {
        width: 38px;
        height: 85px;
        font-size: 13px;
    }

        .sticky-btn:hover {
            width: 42px;
        }
}


/* =========================================
SECTION
========================================= */

.experience-section {
    padding: 60px 0 80px;
    overflow: hidden;
    background: #f8f1ec;
    color: #111;
}


.experience-title {
    text-align: center;
    font-size: 42px;
    line-height: 1.15;
    font-weight: 700;
    margin: 0 0 35px;
}


/* =========================================
TABS
========================================= */
.experience-tab-border {
    border: 2px solid #ffdcd0;
    border-radius: 56px;
    padding: 15;
    background: #fff;
}


.experience-tabs {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 46px;
    margin-bottom: 37px;
    flex-wrap: wrap;
}


.experience-tab {
    position: relative;
    padding: 10px;
    font-size: 14px;
    color: #222;
    cursor: pointer;
    white-space: nowrap;
    transition: 0.3s ease;
    background: #f2f2f2;
    border-radius: 50px;
}




    .experience-tab:hover {
        font-weight: 600;
    }


    .experience-tab.active {
        font-weight: 700;
        background: #f25c26;
        padding: 10px;
        border-radius: 50px;
        color: #fff;
    }


/* =========================================
CAROUSEL
========================================= */

.experience-carousel {
    position: relative;
    width: 100%;
    overflow: hidden;
}


.experience-track {
    display: flex;
    align-items: center;
    gap: 25px;
    min-height: 350px;
    transition: transform 0.7s cubic-bezier(.4, 0, .2, 1);
}


/* =========================================
CARD
========================================= */

.experience-card {
    flex: 0 0 360px;
    height: 300px;
    padding: 25px;
    border-radius: 22px;
    background: #fff;
    opacity: 0.72;
    transform: scale(0.88);
    transition: transform 0.6s ease, opacity 0.6s ease, background 0.6s ease;
    cursor: pointer;
    overflow: hidden;
}


    /* =========================================
ACTIVE CARD
========================================= */

    .experience-card.active {
        flex: 0 0 825px;
        height: 340px;
        opacity: 1;
        transform: scale(1);
        background: #fff4d3;
        cursor: default;
    }


/* =========================================
SIDE CARD
========================================= */

.experience-side-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}


.experience-side-title {
    font-size: 23px;
    line-height: 1.2;
    font-weight: 700;
    margin-bottom: 20px;
}


.experience-side-text {
    font-size: 16px;
    line-height: 1.5;
}


/* =========================================
ACTIVE CONTENT
========================================= */

.experience-active-content {
    display: none;
    height: 100%;
    align-items: center;
    justify-content: space-between;
}


.experience-card.active
.experience-active-content {
    display: flex;
}


.experience-card.active
.experience-side-content {
    display: none;
}


/* =========================================
ACTIVE TEXT
========================================= */

.experience-active-text {
    width: 57%;
    padding-right: 25px;
}


    .experience-active-text h3 {
        font-size: 28px;
        line-height: 1.18;
        font-weight: 700;
        margin: 0 0 24px;
    }


    .experience-active-text p {
        font-size: 17px;
        line-height: 1.5;
        margin: 0;
    }


/* =========================================
ACTIVE IMAGE
========================================= */

.experience-active-image {
    width: 39%;
    height: 270px;
    display: flex;
    align-items: center;
    justify-content: center;
}


    .experience-active-image img {
        width: 280px;
        height: 270px;
        object-fit: cover;
        border-radius: 10%;
    }


/* =========================================
ARROWS
========================================= */

.experience-arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 4px;
    background: #fff;
    color: #f25c26;
    font-size: 22px;
    z-index: 20;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}


    .experience-arrow:hover {
        background: #f7602a;
        color: #fff;
    }

    .experience-arrow:focus {
        outline: none;
        box-shadow: none;
    }

    .experience-arrow:focus-visible {
        outline: none;
    }


.experience-prev {
    left: 10%;
}


.experience-next {
    right: 10%;
}



/* =========================================
TABLET
========================================= */

@media (max-width: 991px) {

    .experience-title {
        font-size: 36px;
    }

    .experience-tabs {
        gap: 25px;
        padding: 0 20px;
    }

    .experience-card {
        flex-basis: 300px;
    }

        .experience-card.active {
            flex-basis: 650px;
        }
}


/* =========================================
MOBILE
========================================= */

@media (max-width: 767px) {

    .experience-section {
        padding: 45px 0 60px;
    }

    .experience-title {
        font-size: 30px;
        padding: 0 20px;
        margin-bottom: 25px;
    }

    .experience-tabs {
        justify-content: flex-start;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 28px;
        padding: 0 20px 12px;
    }

    .experience-tab {
        font-size: 14px;
    }

    .experience-card {
        flex-basis: 85vw;
        height: 280px;
    }

        .experience-card.active {
            flex-basis: 85vw;
            height: 430px;
        }

            .experience-card.active
            .experience-active-content {
                flex-direction: column;
                justify-content: center;
            }

    .experience-active-text {
        width: 100%;
        padding: 0;
    }

        .experience-active-text h3 {
            font-size: 23px;
            margin-bottom: 15px;
        }

        .experience-active-text p {
            font-size: 15px;
        }

    .experience-active-image {
        width: 100%;
        height: 150px;
        margin-top: 20px;
    }

        .experience-active-image img {
            width: 135px;
            height: 145px;
        }

    .experience-arrow {
        width: 40px;
        height: 40px;
        font-size: 20px;
    }
}

/* =====================================================
MAIN NAVBAR
===================================================== */

.header {
    width: 100%;
    min-height: 70px;
    padding: 0 30px !important;
    display: flex;
    align-items: center;
    background: #fff;
}


/* =====================================================
HEADER TOP
Logo + Location + Mobile Toggle
===================================================== */

.header-top {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}


/* =====================================================
LOGO
===================================================== */

.header .navbar-brand {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
}

    .header .navbar-brand img {
        display: block;
        width: auto;
        max-width: 175px;
        height: auto;
    }


/* =====================================================
LOCATION SELECTOR
===================================================== */

.location-selector {
    margin-left: 25px;
    position: relative;
}

.location-selector-btn {
    height: 44px;
    min-width: 155px;
    display: flex;
    align-items: center;
    padding: 5px 12px;
    background: #fff;
    border: 1px solid #096ed5;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .location-selector-btn:hover {
        border-color: #0d6efd;
        background: #fafcff;
    }

    .location-selector-btn:focus {
        outline: none;
        box-shadow: none;
    }


/* Location Icon */

.location-icon {
    flex-shrink: 0;
    font-size: 16px;
    margin-right: 8px;
}


/* Location Text */

.location-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.2;
}

    .location-content small {
        display: block;
        font-size: 9px;
        color: #777;
        margin-bottom: 2px;
    }

    .location-content strong {
        display: block;
        font-size: 13px;
        font-weight: 500;
        color: #222;
        white-space: nowrap;
    }


/* Arrow */

.location-arrow {
    flex-shrink: 0;
    font-size: 12px;
    color: #096ed5;
    margin-left: 7px;
}


/* =====================================================
NAVBAR COLLAPSE
===================================================== */

.header .navbar-collapse {
    display: flex;
    align-items: center;
}


/* =====================================================
NAVIGATION
===================================================== */

.header .navbar-nav {
    display: flex;
    align-items: center;
}

.header .nav-item {
    white-space: nowrap;
}

.header .nav-link {
    padding: 24px 12px !important;
    font-size: 14px;
}


/* =====================================================
HEADER ACTIONS
===================================================== */

.header-actions {
    display: flex;
    align-items: center;
    margin-left: 12px;
}

    .header-actions .btn {
        white-space: nowrap;
        margin-left: 2px;
        margin-top: 10px !important;
    }

.create-org-btn,
.login-btn {
    padding: 9px 18px !important;
}


/* =====================================================
MOBILE TOGGLE
===================================================== */

.header .navbar-toggler {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 7px 10px;
    background: #fff;
    margin-left: 12px;
}

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


/* =====================================================
LARGE DESKTOP
1200px+
===================================================== */

@media (min-width: 1200px) {

    .header {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

        .header .navbar-brand img {
            max-width: 230px;
        }

    .location-selector {
        margin-left: 30px;
    }

    .header .nav-link {
        padding-left: 13px !important;
        padding-right: 13px !important;
    }
}


/* =====================================================
LAPTOP
992px - 1199px
===================================================== */

@media (min-width: 992px) and (max-width: 1199.98px) {

    .header {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

        .header .navbar-brand img {
            max-width: 150px;
        }

    .location-selector {
        margin-left: 15px;
    }

    .location-selector-btn {
        min-width: 135px;
    }

    .header .nav-link {
        padding-left: 7px !important;
        padding-right: 7px !important;
        font-size: 13px;
        color: #000 !important;
    }

    .header-actions {
        margin-left: 5px;
    }

        .header-actions .btn {
            margin-left: 4px;
            padding-left: 10px !important;
            padding-right: 10px !important;
            font-size: 13px;
        }
}


/* =====================================================
TABLET + MOBILE
Below 992px
===================================================== */

@media (max-width: 991.98px) {

    .header {
        display: block;
        min-height: auto;
        padding: 8px 15px !important;
    }


    /* Header Top */

    .header-top {
        width: 100%;
        min-height: 46px;
        display: flex;
        align-items: center;
    }


    /* Logo */

    .header .navbar-brand img {
        max-width: 150px;
    }


    /* Location */

    .location-selector {
        margin-left: auto;
        margin-right: 10px;
    }

    .location-selector-btn {
        height: 42px;
        min-width: 145px;
    }


    /* Hamburger */

    .header .navbar-toggler {
        margin-left: 0;
    }


    /* Collapse */

    .header .navbar-collapse {
        display: none;
        width: 100%;
        padding-top: 10px;
        padding-bottom: 5px;
    }

        .header .navbar-collapse.show {
            display: block;
        }


    /* Navigation */

    .header .navbar-nav {
        width: 100%;
        display: block;
    }

    .header .nav-item {
        width: 100%;
    }

    .header .nav-link {
        display: block;
        padding: 11px 5px !important;
        border-bottom: 1px solid #f1f1f1;
    }


    /* Buttons */

    .header-actions {
        width: 100%;
        display: flex;
        margin: 12px 0 0;
    }

        .header-actions .btn {
            flex: 1;
            margin: 0 5px 0 0;
            text-align: center;
        }

            .header-actions .btn:last-child {
                margin-right: 0;
            }
}


/* =====================================================
MOBILE
Below 576px
===================================================== */

@media (max-width: 575.98px) {

    .header {
        padding: 8px 12px !important;
    }


    /* Top */

    .header-top {
        min-height: 44px;
    }


    /* Logo */

    .header .navbar-brand img {
        max-width: 125px;
    }


    /* Location */

    .location-selector {
        margin-left: auto;
        margin-right: 7px;
    }

    .location-selector-btn {
        width: 120px;
        min-width: 120px;
        height: 40px;
        padding: 4px 8px;
    }

    .location-icon {
        font-size: 14px;
        margin-right: 6px;
    }

    .location-content small {
        font-size: 8px;
    }

    .location-content strong {
        max-width: 72px;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 11px;
    }

    .location-arrow {
        font-size: 8px;
        margin-left: 3px;
    }


    /* Hamburger */

    .header .navbar-toggler {
        padding: 6px 8px;
    }


    /* Buttons */

    .header-actions {
        flex-direction: column;
    }

        .header-actions .btn {
            width: 100%;
            margin: 5px 0 0;
        }
}


/* =====================================================
SMALL MOBILE
Below 400px
===================================================== */

@media (max-width: 399.98px) {

    .header .navbar-brand img {
        max-width: 105px;
    }

    .location-selector-btn {
        width: 105px;
        min-width: 105px;
        padding-left: 6px;
        padding-right: 6px;
    }

    .location-content strong {
        max-width: 58px;
    }

    .header .navbar-toggler {
        padding: 5px 7px;
    }
}


/* ========================================
LOCATION MODAL - BOOTSTRAP 4.3
======================================== */

/* Change City Message */
.change-city-message {
    display: flex;
    align-items: flex-start;
    gap: 13px;
    padding: 16px;
    margin-bottom: 25px;
    background: #f5f8fd;
    border: 1px solid #e8edf5;
    border-radius: 12px;
}

.change-city-icon {
    width: 40px;
    height: 40px;
    min-width: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff0e5;
    color: #f58232;
    border-radius: 10px;
    font-size: 17px;
}

.change-city-message strong {
    display: block;
    font-size: 13px;
    color: #263750;
    margin-bottom: 5px;
}

.change-city-message p {
    font-size: 12px;
    line-height: 1.6;
    color: #778195;
    margin: 0;
}

/* Selected City */
.selected-city-card {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 18px;
    margin: 22px 0;
    background: linear-gradient(110deg, #f0f5ff, #fff7f0);
    border: 1px solid #dce6f5;
    border-radius: 12px;
}

.selected-city-badge {
    margin-left: auto;
    padding: 6px 12px;
    background: #e5f7ed;
    color: #219653;
    border-radius: 30px;
    font-size: 11px;
    font-weight: 600;
}

/* Active City */
.city-option.active {
    background: #fff5ec;
    border-color: #f58232;
    color: #f58232;
}

.city-option .city-check {
    margin-left: auto;
    color: #219653;
}

/* Mobile */
@media (max-width: 767px) {

    .selected-city-card {
        padding: 14px;
        gap: 10px;
    }

    .selected-city-info h3 {
        font-size: 19px;
    }

    .change-city-message {
        padding: 13px;
    }
}

.location-modal .location-dialog {
    max-width: 960px;
    width: calc(100% - 30px);
    margin: 1.75rem auto;
}

.location-modal .location-content {
    position: relative;
    overflow: hidden;
    border: 0;
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 20px 65px rgba(15, 40, 80, 0.20);
}

/* Close button */

.location-modal .location-close {
    position: absolute;
    z-index: 10;
    top: 16px;
    right: 18px;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #77849a;
    font-size: 20px;
    cursor: pointer;
}

    .location-modal .location-close:hover {
        color: #0874d1;
    }

/* LEFT PANEL */

.location-modal .location-left-panel {
    background: radial-gradient(circle, rgba(55, 130, 230, 0.10) 1px, transparent 1.5px) 0 0 / 9px 9px, linear-gradient(145deg, #e7f1ff 0%, #f1f5ff 60%, #f3eaff 100%);
}

.location-modal .location-left-inner {
    padding: 48px 28px 30px;
    min-height: 100%;
}

.location-modal .location-modal-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    margin-bottom: 24px;
    border-radius: 14px;
    background: #ffffff;
    color: #0874d1;
    box-shadow: 0 5px 20px rgba(30, 90, 160, 0.10);
    font-size: 22px;
}

.location-modal .location-eyebrow {
    display: block;
    margin-bottom: 12px;
    color: #0874d1;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.3px;
}

.location-modal .location-left-inner h3 {
    margin: 0 0 16px;
    color: #10346e;
    font-size: 29px;
    font-weight: 750;
    line-height: 1.15;
}

.location-modal .location-description {
    margin-bottom: 24px;
    color: #71819d;
    font-size: 14px;
    line-height: 1.8;
}

.location-modal .location-benefits {
    margin: 0 0 25px;
    padding: 0;
    list-style: none;
}

    .location-modal .location-benefits li {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 15px;
        color: #40577c;
        font-size: 13px;
        font-weight: 600;
    }

        .location-modal .location-benefits li i {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            flex: 0 0 24px;
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: #2e7cf6;
            color: #ffffff;
            font-size: 11px;
        }

/* LEFT PANEL - PRIVACY CARD */

.location-modal .location-trust-card {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 15px;
    border: 1px solid rgba(75, 125, 200, 0.12);
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.72);
}

    .location-modal .location-trust-card > i {
        padding-top: 2px;
        color: #2879ec;
        font-size: 20px;
    }

    .location-modal .location-trust-card strong {
        display: block;
        margin-bottom: 6px;
        color: #254777;
        font-size: 12px;
    }

    .location-modal .location-trust-card p {
        margin: 0;
        color: #72829b;
        font-size: 11px;
        line-height: 1.65;
    }

/* RIGHT PANEL */

.location-modal .location-right-panel {
    background: #ffffff;
}

.location-modal .location-right-inner {
    padding: 42px 30px 24px;
}

    .location-modal .location-right-inner h4 {
        margin: 0 35px 8px 0;
        color: #10346e;
        font-size: 23px;
        font-weight: 700;
    }

.location-modal .location-subtitle {
    margin-bottom: 22px;
    color: #8794aa;
    font-size: 12px;
    line-height: 1.6;
}

/* SEARCH FIELD */

.location-modal .location-modal-search {
    position: relative;
    margin-bottom: 15px;
}

    .location-modal .location-modal-search > i {
        position: absolute;
        z-index: 2;
        top: 50%;
        left: 15px;
        transform: translateY(-50%);
        color: #8293ad;
        font-size: 15px;
    }

    .location-modal .location-modal-search .form-control {
        height: 48px;
        padding: 10px 15px 10px 42px;
        border: 1px solid #dce5f0;
        border-radius: 9px;
        background: #ffffff;
        color: #203b62;
        font-size: 13px;
        box-shadow: none;
    }

        .location-modal .location-modal-search .form-control:focus {
            border-color: #438ff1;
            box-shadow: 0 0 0 3px rgba(45, 125, 235, 0.10);
        }

        .location-modal .location-modal-search .form-control::placeholder {
            color: #9ba9bd;
        }

/* CURRENT LOCATION BUTTON */

.location-modal .current-location-btn {
    display: flex;
    align-items: center;
   /* width: 100%;*/
    padding: 13px 14px;
    margin-bottom: 14px;
    border: 1px solid #cfe1ff;
    border-radius: 10px;
    background: #f4f8ff;
    text-align: left;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease;
}

    .location-modal .current-location-btn:hover {
        border-color: #77adfa;
        background: #eaf3ff;
    }

.location-modal .current-location-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    margin-right: 12px;
    border-radius: 10px;
    background: #2479e9;
    color: #ffffff;
    font-size: 17px;
}

.location-modal .current-location-text {
    flex: 1;
    min-width: 0;
}

    .location-modal .current-location-text strong {
        display: block;
        margin-bottom: 4px;
        color: #1d4c88;
        font-size: 13px;
    }

    .location-modal .current-location-text small {
        display: block;
        color: #8493aa;
        font-size: 11px;
    }

.location-modal .location-arrow {
    margin-left: 8px;
    color: #3c82df;
    font-size: 12px;
}

/* LOCATION ACCESS NOTE */

.location-modal .location-access-help {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 13px;
    margin-bottom: 22px;
    border: 1px solid #f4dfb5;
    border-radius: 9px;
    background: #fffaf0;
}

.location-modal .location-help-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #ffedc8;
    color: #a96b10;
    font-size: 13px;
}

.location-modal .location-access-help strong {
    display: block;
    margin-bottom: 5px;
    color: #76501b;
    font-size: 12px;
}

.location-modal .location-access-help p {
    margin: 0;
    color: #8c795b;
    font-size: 11px;
    line-height: 1.7;
}

/* POPULAR LOCATIONS */

.location-modal .popular-location-section h6 {
    margin-bottom: 13px;
    color: #243e64;
    font-size: 13px;
    font-weight: 700;
}

    .location-modal .popular-location-section h6 i {
        margin-right: 6px;
        color: #277ce8;
    }

.location-modal .location-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.location-modal .city-option {
    display: flex;
    align-items: center;
    min-width: 0;
    min-height: 43px;
    padding: 10px 12px;
    border: 1px solid #e0e8f2;
    border-radius: 8px;
    background: #ffffff;
    color: #425a7b;
    text-align: left;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .location-modal .city-option:hover,
    .location-modal .city-option.active {
        border-color: #2e80ed;
        background: #f1f7ff;
        color: #176bd0;
    }

    .location-modal .city-option i {
        flex: 0 0 17px;
        margin-right: 8px;
        color: #e67e22;
        font-size: 13px;
    }

    .location-modal .city-option span {
        overflow-wrap: anywhere;
    }

.location-modal .location-no-results {
    margin-top: 12px;
    color: #8290a4;
    font-size: 12px;
}

/* FOOTER */

.location-modal .location-modal-footer {
    padding-top: 18px;
    margin-top: 20px;
    border-top: 1px solid #edf1f6;
}

    .location-modal .location-modal-footer span {
        display: flex;
        align-items: center;
        gap: 8px;
        color: #788ba6;
        font-size: 11px;
    }

    .location-modal .location-modal-footer i {
        color: #2e80ed;
        font-size: 15px;
    }

/* TABLET */

@media (max-width: 767.98px) {
    .location-modal .location-dialog {
        max-width: 500px;
        margin: 15px auto;
    }

    .location-modal .location-left-inner {
        padding: 28px 24px 22px;
    }

    .location-modal .location-modal-icon {
        width: 40px;
        height: 40px;
        margin-bottom: 14px;
        font-size: 18px;
    }

    .location-modal .location-left-inner h3 {
        max-width: 360px;
        font-size: 24px;
    }

    .location-modal .location-description {
        margin-bottom: 15px;
    }

    .location-modal .location-benefits {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 15px;
        margin-bottom: 16px;
    }

        .location-modal .location-benefits li {
            margin-bottom: 0;
        }

    .location-modal .location-trust-card {
        padding: 11px;
    }

    .location-modal .location-right-inner {
        padding: 28px 24px 22px;
    }

        .location-modal .location-right-inner h4 {
            font-size: 21px;
        }

    .location-modal .location-close {
        top: 12px;
        right: 12px;
    }
}

/* SMALL MOBILE */

@media (max-width: 400px) {
    .location-modal .location-dialog {
        width: calc(100% - 20px);
        margin: 10px auto;
    }

    .location-modal .location-left-inner,
    .location-modal .location-right-inner {
        padding-right: 18px;
        padding-left: 18px;
    }

    .location-modal .location-grid {
        gap: 7px;
    }

    .location-modal .city-option {
        padding: 9px 7px;
        font-size: 11px;
    }
}




/* Animated border effect */


/* =========================================
COMPARISON SECTION
========================================= */

.platform-comparison-section {
    background: #f7f7f8;
    padding: 90px 0 100px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

.platform-comparison-wrapper {
    max-width: 1180px;
    margin: 0 auto;
    padding: 0 20px;
}


/* =========================================
HEADING
========================================= */

.platform-eyebrow {
    color: #1267f9;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    margin-bottom: 12px;
}

.platform-heading {
    color: #111318;
    font-size: 46px;
    line-height: 1.12;
    font-weight: 700;
    letter-spacing: -1.8px;
    text-align: center;
    margin: 0 auto 65px;
    max-width: 850px;
}


/* =========================================
COLUMN HEADER
========================================= */

.platform-column-header {
    height: 60px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 16px;
}

.platform-with {
    background: #096ed5;
    color: #ffffff;
}

.platform-without {
    background: #ddfcff;
    color: #1f7179;
    border: 2px dotted #052c30;
}


/* =========================================
COMPARISON ROW
========================================= */

.platform-comparison-row {
    display: flex;
    gap: 24px;
    margin-bottom: 16px;
}


/* =========================================
CARDS
========================================= */

.platform-benefit-card,
.platform-problem-card {
    min-height: 76px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    padding: 10px 14px;
    font-size: 16px;
    line-height: 1.4;
    color: #162b45;
    transition: all 0.25s ease;
}

.platform-benefit-card {
    width: 50%;
    background: #dceaff;
}

.platform-problem-card {
    width: 50%;
    background: #ffffff;
    border: 1px solid #dbdbdb;
}


/* =========================================
ICON
========================================= */

.platform-icon-box {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 14px;
    background: #ffffff;
}

    .platform-icon-box .material-icons {
        font-size: 22px;
    }

.platform-benefit-card .material-icons {
    color: #1673ff;
}

.platform-problem-card .platform-icon-box {
    background: #f5f5f5;
}

.platform-problem-card .material-icons {
    color: #ff3b3b;
}


/* =========================================
TEXT
========================================= */

.platform-card-text {
    flex: 1;
}


/* =========================================
HOVER
========================================= */

.platform-benefit-card:hover,
.platform-problem-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(20, 45, 80, 0.08);
}


/* =========================================
TABLET
========================================= */

@media (max-width: 991px) {

    .platform-heading {
        font-size: 40px;
    }

    .platform-comparison-row {
        gap: 16px;
    }

    .platform-benefit-card,
    .platform-problem-card {
        font-size: 15px;
    }
}


/* =========================================
MOBILE
========================================= */

@media (max-width: 767px) {

    .platform-comparison-section {
        padding: 60px 0 70px;
    }

    .platform-heading {
        font-size: 34px;
        letter-spacing: -1px;
        margin-bottom: 40px;
    }

    .platform-column-header {
        font-size: 17px;
        height: 54px;
    }

    .platform-comparison-row {
        display: block;
        margin-bottom: 12px;
    }

    .platform-benefit-card,
    .platform-problem-card {
        width: 100%;
        min-height: 70px;
        margin-bottom: 10px;
    }
}


/* =========================================
SMALL MOBILE
========================================= */

@media (max-width: 480px) {

    .platform-comparison-wrapper {
        padding: 0 14px;
    }

    .platform-heading {
        font-size: 30px;
    }

    .platform-benefit-card,
    .platform-problem-card {
        font-size: 14px;
        padding: 9px 11px;
    }

    .platform-icon-box {
        width: 38px;
        height: 38px;
        min-width: 38px;
        margin-right: 10px;
    }

        .platform-icon-box .material-icons {
            font-size: 20px;
        }
}


/* =========================================
FAQ SECTION
========================================= */

.platform-faq-section {
    background: #ffffff;
    padding: 70px 0 100px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
}

.platform-faq-wrapper {
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px;
}


/* =========================================
FAQ HEADING
========================================= */

.platform-faq-title {
    color: #111318;
    font-size: 52px;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -2px;
    text-align: center;
    margin: 0 0 55px;
}


/* =========================================
FAQ ITEM
========================================= */

.platform-faq-item {
    background: #f8f8f8;
    border-radius: 16px;
    margin-bottom: 9px;
    overflow: hidden;
    border: 0;
}


/* =========================================
QUESTION BUTTON
========================================= */

.platform-faq-question {
    width: 100%;
    border: 0;
    outline: none;
    background: transparent;
    padding: 25px 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    text-align: left;
    color: #172033;
    font-size: 20px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}

    .platform-faq-question:hover {
        background: #f4f4f4;
    }

    .platform-faq-question:focus {
        outline: none;
    }


/* =========================================
PLUS / MINUS
========================================= */

.platform-faq-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 20px;
    font-size: 25px;
    font-weight: 400;
    line-height: 1;
    color: #111318;
    transition: transform 0.25s ease;
}


/* =========================================
ANSWER
========================================= */

.platform-faq-answer {
    padding: 28px 38px 28px;
    color: #1c2129;
    font-size: 16px;
    line-height: 1.65;
    display: none;
    background-color: antiquewhite;
}

    .platform-faq-answer p {
        margin: 0;
        max-width: 850px;
    }


/* =========================================
ACTIVE FAQ
========================================= */

.platform-faq-item.active .platform-faq-answer {
    display: block;
}

.platform-faq-item.active .platform-faq-icon {
    transform: rotate(45deg);
}


/* =========================================
RESPONSIVE
========================================= */

@media (max-width: 991px) {

    .platform-faq-title {
        font-size: 44px;
    }

    .platform-faq-question {
        font-size: 18px;
        padding: 23px 30px;
    }

    .platform-faq-answer {
        padding: 25px 30px 25px;
    }
}


@media (max-width: 767px) {

    .platform-faq-section {
        padding: 55px 0 70px;
    }

    .platform-faq-title {
        font-size: 38px;
        letter-spacing: -1.2px;
        margin-bottom: 40px;
    }

    .platform-faq-wrapper {
        padding: 0 15px;
    }

    .platform-faq-question {
        font-size: 17px;
        line-height: 1.4;
        padding: 21px 22px;
    }

    .platform-faq-answer {
        font-size: 15px;
        padding: 24px 22px 24px;
    }

    .platform-faq-icon {
        font-size: 23px;
        margin-left: 15px;
    }
}


@media (max-width: 480px) {

    .platform-faq-title {
        font-size: 32px;
    }

    .platform-faq-question {
        font-size: 16px;
        padding: 19px 18px;
    }

    .platform-faq-answer {
        font-size: 14px;
        padding: 22px 18px 22px;
    }

    .platform-faq-icon {
        width: 24px;
        min-width: 24px;
        font-size: 22px;
    }
}

.business-icon {
    font-size: 26px;
}


.business-card {
    cursor: pointer;
}

    .business-card:hover {
        background-color: azure !important;
        outline: 2px solid #096ed5;
        color: #096ed5 !important;
        outline-offset: -2px;
    }

    .business-card:active {
        background-color: azure !important;
        outline: 2px solid #096ed5;
        color: #096ed5 !important;
        outline-offset: -2px;
    }

.mig-business-card {
    margin: 25px 5px;
    border-radius: 20px;
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.07) !important;
}


.business-filter-buttons {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.business-filter-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    padding: 0 12px;
    background: #fff;
    border: 1px solid #d9dee5;
    border-radius: 18px;
    color: #172033;
    font-size: 14px;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s ease;
}

    .business-filter-chip i {
        margin-left: 8px;
        font-size: 13px;
    }

    .business-filter-chip:hover {
        background: #f8f9fa;
        border-color: #b8c0ca;
    }

    .business-filter-chip:focus {
        outline: none;
        box-shadow: none;
    }

@media (max-width: 575.98px) {

    .business-filter-buttons {
        gap: 6px;
    }

    .business-filter-chip {
        height: 32px;
        padding: 0 10px;
        font-size: 13px;
    }

        .business-filter-chip i {
            margin-left: 6px;
        }
}

.business-filter-chip.active {
    background: #096ed5;
    color: #fff;
}

    .business-filter-chip.active:hover {
        background: #095ec9;
        border-color: #095ec9;
        color: #fff;
    }

    .business-filter-chip.active i {
        color: #fff;
    }

/* =========================================
Testimonial Section
Bootstrap 4.3 Compatible
========================================= */

.testimonial-section {
    position: relative;
    padding: 20px 0 0px;
    overflow: visible;
}

.testimonial-wrapper {
    position: relative;
    max-width: 1250px;
    margin: 0 auto;
}

/* Main Green Card */
.testimonial-content {
    position: relative;
    min-height: 315px;
    border-radius: 15px;
    padding: 30px 30px 30px 30px;
    overflow: visible;
}

.testimonial-bg {
    background: #d9f5e7;
}

/* Quote */
.testimonial-quote {
    max-width: 431px;
    color: #073f40;
    font-size: 20px;
    line-height: 1.45;
    font-weight: 600;
    margin-bottom: 28px;
}

/* Author */
.testimonial-author {
    color: #073f40;
    font-size: 17px;
    line-height: 1.5;
}

    .testimonial-author strong {
        display: block;
        font-weight: 700;
    }

    .testimonial-author span {
        display: block;
        font-weight: 400;
    }

/* Statistics */
.testimonial-stats {
    position: absolute;
    left: 520px;
    top: 38px;
    width: 190px;
}

.stat-item {
    display: flex;
    /*    align-items: center;*/
    margin-bottom: 27px;
}

.stat-icon {
    width: 28px;
    height: 28px;
    min-width: 28px;
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: bold;
}

.stat-icon-dark {
    background: #17494a;
    color: #ff997e;
}

.stat-icon-yellow {
    background: #ffc83d;
    color: #17494a;
}

.stat-icon-green {
    background: #00d875;
    color: #17494a;
    font-size: 22px;
}

.stat-text strong {
    display: block;
    color: #172b2d;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 700;
}

    .stat-text strong small {
        font-size: 13px;
        font-weight: 600;
    }

.stat-text span {
    display: block;
    color: #172b2d;
    font-size: 14px;
    line-height: 1.4;
    margin-top: 3px;
}

/* Person Image */
.testimonial-person {
    position: absolute;
    right: -36px;
    bottom: 0;
    width: 500px;
    height: 315px;
    border-radius: 20px;
    overflow: hidden;
}

    .testimonial-person img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center top;
        display: block;
    }


/* =========================================
Desktop Image Overlap
========================================= */

@media (min-width: 992px) {

    .testimonial-person {
        top: -124px;
        bottom: auto;
        height: 440px;
        overflow: visible;
    }

        .testimonial-person img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            object-position: center bottom;
        }
}


/* =========================================
Tablet
========================================= */

@media (max-width: 991px) {

    .testimonial-section {
        padding: 60px 15px 30px;
    }

    .testimonial-content {
        padding: 40px 40px 40px;
    }

    .testimonial-quote {
        max-width: 55%;
        font-size: 22px;
    }

    .testimonial-stats {
        left: 55%;
        top: 40px;
    }

    .testimonial-person {
        position: relative;
        width: 100%;
        height: 320px;
        margin-top: 20px;
        border-radius: 20px;
    }
}


/* =========================================
Mobile
========================================= */

@media (max-width: 767px) {

    .testimonial-section {
        padding: 40px 15px;
    }

    .testimonial-content {
        padding: 30px 25px;
        border-radius: 16px;
    }

    .testimonial-quote {
        max-width: 100%;
        font-size: 21px;
        line-height: 1.4;
        margin-bottom: 25px;
    }

    .testimonial-stats {
        position: relative;
        left: auto;
        top: auto;
        width: 100%;
        margin-top: 30px;
    }

    .stat-item {
        margin-bottom: 20px;
    }

    .testimonial-person {
        position: relative;
        width: 100%;
        height: 300px;
        margin-top: 25px;
        border-radius: 16px;
    }

        .testimonial-person img {
            object-fit: cover;
            object-position: center top;
        }
}


/* =========================================
Small Mobile
========================================= */

@media (max-width: 480px) {

    .testimonial-content {
        padding: 25px 20px;
    }

    .testimonial-quote {
        font-size: 19px;
    }

    .testimonial-person {
        height: 260px;
    }
}

/*master popup start*/
.request-modal {
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 30px);
    overflow: hidden;
}
/* Header */

.request-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 28px 32px 22px;
    background: #fff;
}

.request-eyebrow {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
    color: #6c63ff;
    margin-bottom: 7px;
}

.request-title {
    margin: 0;
    font-size: 25px;
    font-weight: 700;
    color: #202124;
}

.request-subtitle {
    margin: 6px 0 0;
    color: #777;
    font-size: 14px;
}

.request-close {
    border: 0;
    background: #f4f5f7;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    font-size: 25px;
    line-height: 35px;
    color: #555;
    cursor: pointer;
}

    .request-close:hover {
        background: #e9eaed;
    }


/* Tabs */

.request-tabs {
    display: flex;
    padding: 0 22px;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    background: #fafafa;
    /*    overflow-x: auto;*/
}

.request-tab {
    position: relative;
    flex: 1 0 auto;
    min-width: 125px;
    padding: 0px 10px 0px;
    border: 0;
    background: transparent;
    color: #666;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: all .25s ease;
}

    .request-tab:hover {
        color: #333;
        background: #f2f3f5;
    }

    .request-tab.active {
        color: #5b54e8;
        background: #f0f0ff;
        border-radius: 10px;
        height: 60px;
    }

        .request-tab.active:after {
            content: "";
            position: absolute;
            bottom: 0;
            left: 18%;
            right: 18%;
            height: 3px;
            border-radius: 3px 3px 0 0;
            background: #5b54e8;
        }

.request-icon {
    display: block;
    width: 32px;
    height: 32px;
    line-height: 32px;
    margin: 0 auto 6px;
    border-radius: 9px;
    background: #f0f0ff;
    color: #5b54e8;
    font-size: 17px;
}


/* Body */

.request-body {
    padding: 28px 32px 32px;
    max-height: 65vh;
    overflow-y: auto;
}

.request-form {
    display: none;
}

    .request-form.active-form {
        display: block;
        animation: requestFadeIn .25s ease;
    }

@keyframes requestFadeIn {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* Form Heading */

.form-section-heading {
    margin-bottom: 22px;
}

    .form-section-heading h5 {
        margin: 0 0 5px;
        font-size: 20px;
        font-weight: 700;
        color: #252525;
    }

    .form-section-heading p {
        margin: 0;
        color: #777;
        font-size: 13px;
    }


/* Form Fields */

.request-body .form-group {
    margin-bottom: 18px;
}

.request-body label {
    display: block;
    margin-bottom: 7px;
    color: #333;
    font-size: 13px;
    font-weight: 600;
}

    .request-body label span {
        color: #e74c3c;
    }

.request-body .form-control {
    height: 45px;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 9px 13px;
    font-size: 13px;
    color: #333;
    box-shadow: none;
    transition: all .2s ease;
}

.request-body textarea.form-control {
    height: auto;
    resize: vertical;
}

.request-body .form-control:focus {
    border-color: #6c63ff;
    box-shadow: 0 0 0 3px rgba(108,99,255,.10);
}


/* Checkboxes */

.request-checkboxes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.checkbox-item {
    display: inline-flex !important;
    align-items: center;
    padding: 9px 12px;
    margin: 0 !important;
    border: 1px solid #ddd;
    border-radius: 7px;
    background: #fff;
    cursor: pointer;
    font-weight: 500 !important;
}

    .checkbox-item input {
        margin-right: 7px;
    }


/* Submit */

.request-submit-row {
    position: sticky;
    bottom: 0;
    z-index: 50;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    min-height: 70px;
    padding: 12px 0;
    background: #fff;
    border-top: 1px solid #eee;
    box-shadow: 0 -8px 18px rgba(0, 0, 0, 0.04);
}


    /* Keep your existing Bootstrap button styling */
    .request-submit-row .btn {
        min-height: 44px;
        padding: 10px 20px;
        border-radius: 50px;
        margin: 0;
        white-space: nowrap;
    }


        /* Arrow */
        .request-submit-row .btn span {
            margin-left: 6px;
        }

/* Scrollbar */

.request-body::-webkit-scrollbar {
    width: 5px;
}

.request-body::-webkit-scrollbar-thumb {
    background: #d2d2d2;
    border-radius: 10px;
}


/* Mobile */

@media (max-width: 767px) {

    .request-modal {
        margin: 10px;
        border-radius: 14px;
    }

    .request-header {
        padding: 22px 20px 18px;
    }

    .request-title {
        font-size: 21px;
    }

    .request-subtitle {
        font-size: 12px;
    }

    .request-tabs {
        padding: 0 8px;
    }

    .request-tab {
        min-width: 105px;
        padding: 12px 7px;
        font-size: 10px;
    }

    .request-icon {
        width: 28px;
        height: 28px;
        line-height: 28px;
        font-size: 14px;
    }

    .request-body {
        padding: 22px 18px 25px;
        max-height: 65vh;
    }

    .request-submit-row {
        display: block;
    }

    .request-submit {
        width: 100%;
    }
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

/* ==========================================
SERVICE CARD
========================================== */

/*
.service-card {
padding: 20px 24px;
background: #fff;
border: 1px solid #e2e5e8;
border-radius: 8px;
overflow: hidden;
}
*/
.service-card {
    padding: 20px 24px;
    border-radius: 20px;
    box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.07) !important;
    overflow: hidden;
    border: 1px solid #e2e5e8;
}

/* ==========================================
IMAGE
========================================== */

.service-img {
    width: 160px;
    height: 160px;
    overflow: hidden;
    border-radius: 10px;
    background: #f5f5f5;
}

    .service-img img {
        width: 160px;
        height: 160px;
        object-fit: cover;
    }


/* ==========================================
PREMIUM
========================================== */

.premium-badge {
    position: absolute;
    top: 10px;
    left: 0;
    z-index: 2;
    padding: 4px 7px;
    color: #fff;
    background: #111;
    font-size: 11px;
    font-weight: 600;
    line-height: 1;
}


/* ==========================================
VERIFIED
========================================== */

.service-verified {
    color: #16854a;
    font-size: 14px;
    white-space: nowrap;
}

    .service-verified i {
        font-size: 14px;
    }


/* ==========================================
MIG SCORE
========================================== */

.service-score {
    color: #f47b20;
    font-size: 14px;
    white-space: nowrap;
}

    .service-score i {
        color: #ff7417;
        margin-right: 3px;
    }

    .service-score span {
        color: #68717a;
        font-weight: 400;
    }


/* ==========================================
TITLE
========================================== */

.service-title {
    color: #111827;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.25;
}


/* ==========================================
LOCATION
========================================== */

.service-location {
    color: #737b84;
    font-size: 14px;
}

    .service-location i {
        color: #a0a7af;
    }


/* ==========================================
RATING
========================================== */

.service-rating {
    color: #222;
    font-size: 14px;
}

.service-stars {
    color: #ff8a32;
    font-size: 15px;
    letter-spacing: -1px;
}

.service-reviews {
    color: #68717a;
    font-size: 13px;
}


/* ==========================================
WHATSAPP
========================================== */

.service-whatsapp {
    width: 40px;
    height: 40px;
    padding: 0;
    color: #159447;
    background: #fff;
    border: 2px solid #159447;
    border-radius: 60px;
    font-size: 24px;
}

    .service-whatsapp:hover {
        color: #fff;
        background: #159447;
    }


/* ==========================================
PHONE
========================================== */

.service-phone {
    height: 40px;
    padding: 0 14px;
    color: #374151;
    background: #fff;
    border: 2px solid #89929c;
    border-radius: 60px;
    font-size: 13px;
    white-space: nowrap;
}

    .service-phone i {
        color: #666;
        font-size: 12px;
        transform: scaleX(-1);
    }


/* ==========================================
ENQUIRE BUTTON
========================================== */

.service-enquire {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 142px;
    height: 40px;
    padding: 2px 12px;
    color: #fff;
    background: #f44348;
    border: 1px solid #f44348;
    border-radius: 60px;
    line-height: 1.1;
}

    .service-enquire strong {
        font-size: 14px;
    }

    .service-enquire small {
        margin-top: 2px;
        font-size: 11px;
    }

    .service-enquire:hover {
        color: #fff;
        background: #e83238;
        border-color: #e83238;
    }


/* ==========================================
TABLET
========================================== */

@media (max-width: 1199px) {

    .service-card {
        padding: 16px;
    }

    .service-img,
    .service-img img {
        width: 145px;
        height: 145px;
    }

    .service-title {
        font-size: 18px;
    }
}


/* ==========================================
MOBILE
========================================== */

@media (max-width: 575px) {

    .service-card {
        padding: 15px;
    }

    .service-img,
    .service-img img {
        width: 110px;
        height: 110px;
    }

    .service-title {
        font-size: 17px;
    }

    .service-score {
        margin-left: 10px !important;
    }

    .service-actions {
        flex-wrap: wrap;
    }

    .service-enquire {
        min-width: 120px;
    }
}


/* =========================================
DETAIL PROFILE
========================================= */

.detail-profile-card {
    border: 0;
    border-radius: 7px;
    box-shadow: 0 1px 5px rgba(0, 0, 0, .08);
}

    .detail-profile-card .card-body {
        padding: 18px 20px;
    }

.detail-logo {
    width: 150px;
    height: 150px;
    object-fit: cover;
    border-radius: 10%;
}

.detail-title {
    color: #172033;
    /*    font-size: 20px;*/
    font-weight: 700;
}

.detail-category,
.detail-location,
.detail-status {
    color: #68717a;
    /*    font-size: 12px;*/
}

.detail-stars {
    color: #ffc107;
    /*    font-size: 12px;*/
}

.detail-favourite {
    color: #ef6a72;
    font-size: 18px;
    padding: 0;
}


/* =========================================
SECTION TITLES
========================================= */

.detail-section-title {
    margin-bottom: 12px;
    color: #1d2735;
    /*    font-size: 15px;*/
    font-weight: 700;
}


/* =========================================
DESCRIPTION
========================================= */

.detail-description {
    color: #69727c;
    /*    font-size: 11px;*/
    line-height: 1.7;
    margin-bottom: 0;
}


/* =========================================
STATISTICS
========================================= */

.detail-stat-number {
    color: #2476d2;
    font-size: 24px;
    font-weight: 700;
}

    .detail-stat-number.detail-orange {
        color: #e87531;
    }


/* =========================================
GALLERY
========================================= */

.detail-gallery-img {
    width: 100%;
    height: 112px;
    object-fit: cover;
    border-radius: 5px;
}


/* =========================================
SERVICES
========================================= */

.detail-service-item {
    display: flex;
    align-items: flex-start;
    min-height: 64px;
    padding: 10px;
    border: 1px solid #e9ecef;
    border-radius: 4px;
}

.detail-service-icon {
    width: 25px;
    margin-right: 8px;
    /*    font-size: 13px;*/
    text-align: center;
}

.detail-service-item h6 {
    margin: 0 0 2px;
    color: #263342;
    /*    font-size: 11px;*/
    font-weight: 600;
}

.detail-service-item small {
    display: block;
    color: #7b838b;
    /*    font-size: 9px;*/
    line-height: 1.4;
}


/* =========================================
CONTACT
========================================= */

.detail-contact-item {
    display: flex;
    align-items: flex-start;
    margin-bottom: 12px;
}

    .detail-contact-item > i {
        width: 22px;
        margin-top: 5px;
        font-size: 16px;
    }

    .detail-contact-item strong,
    .detail-contact-item small {
        display: block;
    }

    .detail-contact-item strong {
        color: #303945;
        /*    font-size: 10px;*/
        font-weight: 600;
    }

    .detail-contact-item small {
        color: #7a838c;
        /*    font-size: 9px;*/
        margin-top: 2px;
    }

.text-purple {
    color: #7952b3 !important;
}


/* =========================================
REVIEW
========================================= */

.detail-review {
    padding: 10px;
    border: 1px solid #edf0f2;
    border-radius: 4px;
}

.detail-review-avatar {
    width: 32px;
    height: 32px;
    object-fit: cover;
    border-radius: 50%;
}

.detail-review strong {
    color: #333d48;
    /*    font-size: 10px;*/
}

.detail-review p {
    color: #69727c;
    /*    font-size: 10px;*/
    line-height: 1.5;
}

.detail-review small {
    /*    font-size: 9px;*/
}

.detail-all-reviews {
    color: #246fd1;
    /*    font-size: 10px;*/
    font-weight: 600;
}


/* =========================================
SIMILAR BUSINESSES
========================================= */

.detail-similar-item {
    display: flex;
    align-items: center;
    padding: 9px;
    margin-bottom: 8px;
    border: 1px solid #e9ecef;
    border-radius: 5px;
}

.detail-similar-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    margin-right: 8px;
    color: #555;
    background: #f5f6f7;
    border-radius: 50%;
    /*    font-size: 11px;*/
}

.detail-similar-item strong {
    color: #343b44;
    /*    font-size: 10px;*/
}

.detail-similar-item .detail-stars {
    /*    font-size: 9px;*/
}


/* =========================================
BUTTON SIZE
========================================= */

.detail-profile-card .btn {
    /*    font-size: 11px;*/
    border-radius: 4px;
}

.detail-profile-card .btn-sm {
    padding: 5px 12px;
}


/* =========================================
MOBILE
========================================= */

@media (max-width: 767px) {

    .detail-profile-card .card-body {
        padding: 15px;
    }

    .detail-gallery-img {
        height: 90px;
    }

    /*
    .detail-stat-number {
    font-size: 15px;
}
    */

    .detail-profile-card .btn {
        margin-bottom: 5px;
    }
}

/*Free business list css */

.free-business-card {
    background: #fff;
    border: 1px solid #e9edf2;
    border-radius: 10px;
    padding: 15px;
    transition: all 0.2s ease;
}

    .free-business-card:hover {
        border-color: #cfd6df;
        transform: translateY(-2px);
    }

.free-business-icon {
    width: 25px;
    height: 25px;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 10px;
    font-weight: 700;
    margin-bottom: 12px;
}

.free-business-title {
    line-height: 1.35;
    margin-bottom: 4px;
    font-weight: 600;
}

.business-tile-description {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    display: -webkit-box;
}

.free-business-category {
    display: block;
    color: #7a8491;
    font-size: 11px;
    line-height: 1.4;
    margin-bottom: 10px;
}

.free-business-location {
    color: #6b7280;
    font-size: 11px;
    margin-bottom: 12px;
}

.free-business-link {
    font-size: 11px;
    font-weight: 600;
    text-decoration: none;
}

/*Free business list css */



.business-truncate {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 295px;
}


.add-image {
    height: auto;
    width: -webkit-fill-available;
}


/*mobile app responsive css start*/
.business-filter-menu {
    display: none;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    width: 300px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.10);
    z-index: 999;
}

    .business-filter-menu.active {
        display: block;
    }

.business-filter-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid #eee;
    font-weight: 600;
}

.business-filter-close {
    border: 0;
    background: transparent;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.business-filter-content {
    padding: 16px;
}

.business-filter-label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
}

.business-filter-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-top: 1px solid #eee;
}

/*mobile app responsive css end*/

.all-in-one-sectimage1 {
    position: absolute;
    max-width: 80%;
    bottom: 0px;
}


.all-in-one-sectimage2 {
    position: absolute;
    max-width: 60%;
    bottom: 0px;
}

/* =========================================
Business + Organization Platform Section
========================================= */

.business-platform-section {
    position: relative;
    width: 100%;
    padding: 45px 0 0;
}


/* =========================================
Top Builder Cards
========================================= */

.business-platform-container {
    position: relative;
    z-index: 5;
}

.business-builder-row {
    background: #fff;
    padding: 6px;
    border-radius: 10px;
}

.business-builder-card {
    position: relative;
    min-height: 220px;
    padding: 16px 22px 22px;
    overflow: hidden;
}

.business-builder-blue {
    background: linear-gradient( 135deg, #eef6ff 0%, #e5f0ff 100% );
    border-radius: 6px 0 0 6px;
}

.business-builder-purple {
    background: linear-gradient( 135deg, #f7edff 0%, #f2e5fb 100% );
    border-radius: 0 6px 6px 0;
}


/* Small label */

.business-builder-label {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 0 0 5px 5px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    color: #315b99;
    background: #dcecff;
}

.business-builder-purple .business-builder-label {
    color: #7a3899;
    background: #eadcff;
}


/* Card content */

.business-builder-content {
    text-align: center;
    padding-top: 3px;
}

.business-builder-icon {
    width: 42px;
    height: 42px;
    margin: 0 auto 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    font-size: 28px;
    font-weight: 600;
    color: #2374d8;
}

.business-builder-purple .business-builder-icon {
    color: #9a3bc2;
}

.business-builder-card h3 {
    margin: 0 0 7px;
    font-size: 25px;
    line-height: 1.2;
    font-weight: 500;
    color: #111;
}

.business-builder-blue h3 span {
    color: #315da0;
}

.business-builder-purple h3 span {
    color: #9136ad;
}

.business-builder-card p {
    max-width: 430px;
    margin: 0 auto 14px;
    font-size: 14px;
    line-height: 1.45;
    color: #222;
}


/* Builder button */

.business-builder-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 175px;
    padding: 8px 18px;
    border: 1px solid #6aa7f5;
    border-radius: 25px;
    background: transparent;
    color: #3778c8 !important;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none !important;
    transition: all 0.25s ease;
}

.business-builder-purple .business-builder-btn {
    border-color: #c55be7;
    color: #9638ba !important;
}

.business-builder-btn span {
    margin-left: 7px;
    font-size: 18px;
    line-height: 10px;
}

.business-builder-btn:hover {
    background: #fff;
    transform: translateY(-2px);
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.08);
}


/* =========================================
Main Yellow Platform Section
========================================= */

.business-platform-main {
    padding: 78px 0 62px;
}

.business-platform-left {
    padding-right: 45px;
}


/* Platform heading */

.business-platform-heading {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.business-platform-mark {
    position: relative;
    width: 58px;
    height: 54px;
    margin-right: 14px;
}

    .business-platform-mark span {
        position: absolute;
        width: 22px;
        height: 22px;
        border: 2px solid #1685d4;
        transform: rotate(30deg);
    }

        .business-platform-mark span:nth-child(1) {
            top: 3px;
            left: 17px;
        }

        .business-platform-mark span:nth-child(2) {
            top: 16px;
            left: 4px;
            border-color: #ffb400;
        }

        .business-platform-mark span:nth-child(3) {
            top: 16px;
            left: 29px;
            border-color: #f36c21;
        }

        .business-platform-mark span:nth-child(4) {
            top: 29px;
            left: 17px;
            border-color: #1685d4;
        }


.business-platform-eyebrow {
    margin-bottom: 1px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.3px;
    color: #333;
}

.business-platform-heading h2 {
    margin: 0;
    font-size: 36px;
    line-height: 1;
    font-weight: 400;
    color: #111;
}


/* Main copy */

.business-platform-left h4 {
    margin: 0 0 3px;
    font-size: 18px;
    font-weight: 600;
    color: #111;
}

.business-platform-description {
    max-width: 600px;
    margin: 0 0 22px;
    font-size: 15px;
    line-height: 1.6;
    color: #222;
}


/* Main CTA */

.business-platform-btn {
    display: inline-flex;
    align-items: center;
    padding: 12px 22px;
    background: #f51c28;
    color: #fff !important;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none !important;
    transition: all 0.25s ease;
}

    .business-platform-btn span {
        margin-left: 10px;
        font-size: 19px;
        line-height: 10px;
    }

    .business-platform-btn:hover {
        background: #d9101b;
        transform: translateY(-2px);
    }


/* =========================================
Testimonial
========================================= */

.business-platform-testimonial {
    position: relative;
    padding: 5px 0 5px 55px;
    border-left: 1px dotted rgba(0, 0, 0, 0.25);
}

.business-quote {
    position: absolute;
    top: 0;
    left: 55px;
    width: 34px;
    height: 34px;
    margin-top: -4px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #000;
    color: #fff;
    font-size: 25px;
    font-weight: 700;
}

.business-platform-testimonial p {
    margin: 58px 0 25px;
    max-width: 390px;
    font-family: Georgia, serif;
    font-size: 20px;
    line-height: 1.45;
    color: #111;
}


/* Testimonial user */

.business-testimonial-user {
    display: flex;
    align-items: center;
}

.business-testimonial-avatar {
    width: 55px;
    height: 55px;
    margin-right: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #fff6ef;
    border: 3px solid rgba(255, 255, 255, 0.8);
    font-size: 15px;
    font-weight: 700;
    color: #f88f3e;
}

.business-testimonial-user strong {
    display: block;
    font-size: 14px;
    color: #111;
}

.business-testimonial-user small {
    display: block;
    margin-top: 2px;
    font-size: 11px;
    color: #333;
}


/* =========================================
Responsive
========================================= */

@media (max-width: 991px) {

    .business-platform-section {
        padding-top: 30px;
    }

    .business-builder-blue,
    .business-builder-purple {
        border-radius: 6px;
    }

    .business-builder-purple {
        margin-top: 6px;
    }

    .business-platform-main {
        padding: 55px 0;
    }

    .business-platform-left {
        padding-right: 0;
        margin-bottom: 45px;
    }

    .business-platform-testimonial {
        padding-left: 35px;
    }

    .business-quote {
        left: 35px;
    }
}


@media (max-width: 767px) {

    .business-platform-section {
        padding-top: 20px;
    }

    .business-builder-row {
        padding: 4px;
    }

    .business-builder-card {
        min-height: auto;
        padding: 14px 15px 20px;
    }

    .business-builder-blue,
    .business-builder-purple {
        border-radius: 5px;
    }

    .business-builder-card h3 {
        font-size: 22px;
    }

    .business-builder-card p {
        font-size: 13px;
    }

    .business-platform-main {
        padding: 45px 0;
    }

    .business-platform-heading {
        align-items: flex-start;
    }

    .business-platform-mark {
        flex: 0 0 45px;
        margin-right: 15px;
        transform: scale(0.85);
        transform-origin: left top;
    }

    .business-platform-heading h2 {
        font-size: 34px;
    }

    .business-platform-eyebrow {
        font-size: 10px;
    }

    .business-platform-left h4 {
        font-size: 16px;
    }

    .business-platform-description {
        font-size: 14px;
    }

    .business-platform-testimonial {
        padding: 25px 0 0;
        border-left: 0;
        border-top: 1px dotted rgba(0, 0, 0, 0.25);
    }

    .business-quote {
        position: relative;
        top: auto;
        left: auto;
        margin: -17px 0 15px;
    }

    .business-platform-testimonial p {
        margin: 0 0 22px;
        font-size: 18px;
    }
}


/* ============================================================
MYINDIAGLOBAL ORGANIZATION REQUEST
Unique classes
Bootstrap 4.3 compatible
============================================================ */


/* ------------------------------------------------------------
MODAL
------------------------------------------------------------ */

.mig-req-modal {
    padding-right: 0 !important;
}

    .mig-req-modal .modal-dialog {
        width: calc(100% - 30px);
        max-width: 960px;
        margin: 1.75rem auto;
    }

.mig-req-modal-content {
    position: relative;
    overflow: hidden;
    border: 0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 20px 70px rgba(22, 50, 95, 0.20);
}


/* ------------------------------------------------------------
LEFT PANEL
------------------------------------------------------------ */

.mig-req-left {
    position: relative;
    height: 100%;
    min-height: 570px;
    overflow: hidden;
    background: radial-gradient( circle at 100% 0%, rgba(48, 125, 255, 0.14), transparent 35% ), radial-gradient( circle at 100% 100%, rgba(171, 92, 255, 0.16), transparent 40% ), linear-gradient( 145deg, #f1f7ff 0%, #eef5ff 55%, #faf5ff 100% );
}


/* Decorative background */

.mig-req-map {
    position: absolute;
    top: 15px;
    left: 20px;
    right: 10px;
    height: 150px;
    opacity: .08;
    background-image: radial-gradient( circle, #2e73d9 1px, transparent 1.5px );
    background-size: 7px 7px;
    mask-image: linear-gradient( 135deg, transparent 0%, #000 30%, #000 70%, transparent 100% );
    -webkit-mask-image: linear-gradient( 135deg, transparent 0%, #000 30%, #000 70%, transparent 100% );
}


.mig-req-left-content {
    position: relative;
    z-index: 2;
    padding: 105px 32px 35px;
}


/* ------------------------------------------------------------
LEFT CONTENT
------------------------------------------------------------ */

.mig-req-label {
    margin-bottom: 10px;
    color: #1474df;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 600;
}


.mig-req-left h2 {
    margin: 0 0 18px;
    color: #082b67;
    font-size: 31px;
    line-height: 1.08;
    font-weight: 700;
    letter-spacing: -.5px;
}


.mig-req-left p {
    max-width: 285px;
    margin: 0 0 30px;
    color: #66768f;
    font-size: 14px;
    line-height: 1.65;
}


/* ------------------------------------------------------------
BENEFITS
------------------------------------------------------------ */

.mig-req-benefit {
    display: flex;
    align-items: center;
    margin-bottom: 19px;
    color: #253b60;
    font-size: 13px;
    font-weight: 500;
}


.mig-req-benefit-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 11px;
    border-radius: 50%;
    background: #2878ed;
    color: #fff;
    font-size: 12px;
    font-weight: 700;
}


    .mig-req-benefit-icon.mig-purple {
        background: #a45be8;
    }


    .mig-req-benefit-icon.mig-violet {
        background: #8756dc;
    }


/* ------------------------------------------------------------
RIGHT PANEL
------------------------------------------------------------ */

.mig-req-right {
    position: relative;
    min-height: 570px;
    padding: 27px 27px 24px;
    background: #fff;
}


.mig-req-close {
    position: absolute;
    top: 12px;
    right: 15px;
    width: 35px;
    height: 35px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #7b8798;
    font-size: 27px;
    line-height: 30px;
    cursor: pointer;
    z-index: 10;
}


    .mig-req-close:hover {
        background: #f3f6fa;
        color: #142c53;
    }


/* ------------------------------------------------------------
HEADER
------------------------------------------------------------ */

.mig-req-header {
    padding-right: 45px;
    margin-bottom: 18px;
}


    .mig-req-header h3 {
        margin: 0 0 5px;
        color: #082b67;
        font-size: 21px;
        line-height: 1.3;
        font-weight: 700;
    }


    .mig-req-header p {
        margin: 0;
        color: #7a8799;
        font-size: 12px;
        line-height: 1.5;
    }


/* ------------------------------------------------------------
FORM FIELDS
------------------------------------------------------------ */

.mig-req-field {
    margin-bottom: 11px;
}


    .mig-req-field label,
    .mig-req-otp-field label {
        display: block;
        margin-bottom: 5px;
        color: #1b2d4a;
        font-size: 12px;
        line-height: 1.4;
        font-weight: 600;
    }


        .mig-req-field label span,
        .mig-req-otp-field label span {
            color: #ef4444;
        }


.mig-req-input {
    width: 100%;
    height: 44px;
    padding: 7px 11px;
    border: 1px solid #dce3ec;
    border-radius: 8px;
    background: #fff;
    color: #263854;
    font-size: 12px;
    box-shadow: none;
    transition: border-color .2s ease, box-shadow .2s ease;
}


    .mig-req-input::placeholder {
        color: #a2adbb;
    }


    .mig-req-input:focus {
        border-color: #2878ed;
        box-shadow: 0 0 0 3px rgba(40, 120, 237, .08);
    }


textarea.mig-req-input {
    height: auto;
    min-height: 64px;
    resize: vertical;
}


/* ------------------------------------------------------------
MOBILE NUMBER
------------------------------------------------------------ */

.mig-req-mobile {
    display: flex;
    width: 100%;
}


.mig-req-country {
    height: 36px;
    min-width: 86px;
    display: flex;
    align-items: center;
    padding: 0 9px;
    border: 1px solid #dce3ec;
    border-right: 0;
    border-radius: 6px 0 0 6px;
    background: #fff;
    color: #53627a;
    font-size: 12px;
}


    .mig-req-country span {
        margin-right: 5px;
    }


    .mig-req-country .mig-req-arrow {
        margin-left: auto;
        margin-right: 0;
        color: #8793a4;
    }


.mig-req-mobile-input {
    border-radius: 0 6px 6px 0;
}


/* ------------------------------------------------------------
CHARACTER COUNT
------------------------------------------------------------ */

.mig-req-counter {
    margin-top: 2px;
    text-align: right;
    color: #8c97a7;
    font-size: 10px;
}


/* ------------------------------------------------------------
FOOTER
------------------------------------------------------------ */

.mig-req-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 6px;
}


.mig-req-security {
    display: flex;
    align-items: center;
    max-width: 300px;
    color: #66758b;
    font-size: 10px;
    line-height: 1.4;
}


.mig-req-security-icon {
    width: 21px;
    height: 21px;
    min-width: 21px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 7px;
    border-radius: 50%;
    background: #2878ed;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
}


.mig-req-actions {
    display: flex;
    align-items: center;
}


/* ------------------------------------------------------------
BUTTONS
------------------------------------------------------------ */

.mig-req-btn {
    height: 40px;
    padding: 0 17px;
    border-radius: 7px;
    font-size: 12px;
    font-weight: 600;
    line-height: 38px;
    cursor: pointer;
    transition: all .2s ease;
}


.mig-req-btn-secondary {
    margin-right: 8px;
    border: 1px solid #dce3ec;
    background: #fff;
    color: #53627a;
}


    .mig-req-btn-secondary:hover {
        background: #f7f9fc;
        border-color: #c8d1df;
    }


.mig-req-btn-primary {
    min-width: 142px;
    border: 1px solid #1769e8;
    background: #1769e8;
    color: #fff;
}


    .mig-req-btn-primary:hover {
        border-color: #0958cf;
        background: #0958cf;
        color: #fff;
        box-shadow: 0 6px 18px rgba(23, 105, 232, .20);
    }


/* ------------------------------------------------------------
STEP 2
------------------------------------------------------------ */

.mig-req-hidden {
    display: none !important;
}


.mig-req-verification {
    padding-top: 30px;
}


.mig-req-otp-field {
    margin-bottom: 23px;
}


    .mig-req-otp-field small {
        display: block;
        margin-top: 5px;
        color: #8995a7;
        font-size: 11px;
    }


.mig-req-verification-note {
    padding: 13px 15px;
    margin: 25px 0;
    border: 1px solid #e4eaf2;
    border-radius: 7px;
    background: #f8faff;
    color: #68778c;
    font-size: 12px;
    line-height: 1.5;
}


.mig-req-verification-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
}


/* ------------------------------------------------------------
STEP 3
------------------------------------------------------------ */

.mig-req-success {
    position: relative;
    min-height: 500px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 70px 35px;
    text-align: center;
    background: radial-gradient( circle at 50% 0%, rgba(40, 120, 237, .08), transparent 40% ), #fff;
}


.mig-req-success-icon {
    width: 76px;
    height: 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 20px;
    border-radius: 50%;
    background: #69bc08;
    color: #fff;
    font-size: 35px;
    font-weight: 600;
    /*
    box-shadow:
    0 10px 30px rgba(23, 105, 232, .22);
    */
}


.mig-req-success h3 {
    max-width: 580px;
    margin: 0 0 12px;
    color: #082b67;
    font-size: 23px;
    line-height: 1.35;
    font-weight: 700;
}


.mig-req-success p {
    max-width: 560px;
    margin: 0 0 25px;
    color: #6d7b91;
    font-size: 13px;
    line-height: 1.6;
}


/* ============================================================
TABLET
============================================================ */

@media (max-width: 991px) {

    .mig-req-modal .modal-dialog {
        max-width: 760px;
    }

    .mig-req-left-content {
        padding: 65px 22px 30px;
    }

    .mig-req-left h2 {
        font-size: 25px;
    }

    .mig-req-right {
        padding: 25px 20px;
    }

    .mig-req-footer {
        display: block;
    }

    .mig-req-security {
        max-width: 100%;
        margin-bottom: 14px;
    }

    .mig-req-actions {
        justify-content: flex-end;
    }
}


/* ============================================================
MOBILE
============================================================ */

@media (max-width: 767px) {

    .mig-req-modal .modal-dialog {
        width: calc(100% - 16px);
        margin: 8px auto;
    }

    .mig-req-left {
        min-height: auto;
    }

    .mig-req-left-content {
        padding: 27px 24px 22px;
    }

    .mig-req-left h2 {
        font-size: 26px;
        line-height: 1.1;
    }

    .mig-req-left p {
        margin-bottom: 20px;
    }

    .mig-req-benefit {
        margin-bottom: 9px;
    }

    .mig-req-right {
        min-height: auto;
        padding: 25px 18px 22px;
    }

    .mig-req-header {
        margin-bottom: 20px;
    }

        .mig-req-header h3 {
            font-size: 19px;
        }

    .mig-req-footer {
        display: block;
    }

    .mig-req-security {
        margin-bottom: 15px;
    }

    .mig-req-actions {
        display: flex;
        width: 100%;
    }

    .mig-req-btn {
        flex: 1;
    }

    .mig-req-success {
        min-height: 430px;
        padding: 60px 22px;
    }
}


/* ============================================================
SMALL MOBILE
============================================================ */

@media (max-width: 480px) {

    .mig-req-modal .modal-dialog {
        width: calc(100% - 10px);
    }

    .mig-req-left-content {
        padding: 25px 20px;
    }

    .mig-req-right {
        padding: 23px 15px 20px;
    }

    .mig-req-country {
        min-width: 78px;
    }

    .mig-req-actions {
        display: block;
    }

        .mig-req-actions .mig-req-btn {
            display: block;
            width: 100%;
            margin: 0 0 8px;
        }

    .mig-req-verification-actions {
        display: block;
    }

        .mig-req-verification-actions .mig-req-btn {
            width: 100%;
            margin: 0 0 10px;
        }

    .mig-req-success h3 {
        font-size: 20px;
    }

    .mig-req-success p {
        font-size: 12px;
    }
}


.container-border-width {
    margin: auto;
    border-left: 1px solid #393939;
    border-right: 1px solid #393939;
    padding: 80px 20px;
}



.anim-object {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    background: #fff;
    padding: 14px 25px 14px 52px;
    border-radius: 30px;
    font-size: 14px;
    -webkit-box-shadow: 0 15px 30px #00000015;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #000;
}

.space-object {
    color: #333;
    background: #fff;
    padding: 14px 25px 14px 52px;
    border-radius: 50px !important;
    font-weight: 600;
    box-shadow: 0 15px 30px #00000015;
    position: absolute;
}

.new_border {
    border: 2px solid #d6d6d6;
    border-radius: 15px;
    padding: 25px;
}


/*marqee section css start*/

/* Main section */
.mig-feature-marquee-section {
    width: 100%;
    overflow: hidden;
    background: #ffffff;
    font-family: Arial, Helvetica, sans-serif;
}

/* Dark rounded scrolling strip */
.mig-feature-marquee {
    width: 100%;
    height: 73px;
    display: flex;
    align-items: center;
    overflow: hidden;
    position: relative;
    /*    background: #fff7e8;*/
    border-radius: 15px;
}

/* Moving track */
.mig-feature-track {
    display: flex;
    align-items: center;
    width: max-content;
    flex-shrink: 0;
    animation: migFeatureScroll 32s linear infinite;
    will-change: transform;
}

/* Each repeated group */
.mig-feature-group {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    white-space: nowrap;
}

/* Feature text */
.mig-feature-item {
    display: inline-block;
    color: #310000;
    font-size: 21px;
    line-height: 1.3;
    font-weight: 700;
    padding: 0 24px;
}

/* Orange sparkle separator */
.mig-feature-star {
    display: inline-block;
    color: #e65a00;
    font-size: 29px;
    line-height: 1;
    font-weight: 400;
    padding: 0 1px;
}

/* Continuous right-to-left movement */
@keyframes migFeatureScroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-50%);
    }
}

/* Pause on hover */
.mig-feature-marquee:hover .mig-feature-track {
    animation-play-state: paused;
}

/* Pale background panel below the strip */
.mig-feature-lower-panel {
    width: 100%;
    height: 72px;
    margin-top: 2px;
    background: #fff1e9;
    border-radius: 25px 25px 0 0;
}

/* Tablet */
@media (max-width: 991px) {
    .mig-feature-marquee-section {
        padding: 0 20px;
    }

    .mig-feature-marquee {
        height: 65px;
        border-radius: 22px;
    }

    .mig-feature-item {
        font-size: 18px;
        padding: 0 18px;
    }

    .mig-feature-star {
        font-size: 25px;
    }
}

/* Mobile */
@media (max-width: 575px) {
    .mig-feature-marquee-section {
        padding: 0 12px;
    }

    .mig-feature-marquee {
        height: 58px;
        border-radius: 18px;
    }

    .mig-feature-item {
        font-size: 15px;
        padding: 0 13px;
    }

    .mig-feature-star {
        font-size: 21px;
    }

    .mig-feature-track {
        animation-duration: 25s;
    }

    .mig-feature-lower-panel {
        height: 55px;
        border-radius: 18px 18px 0 0;
    }
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
    .mig-feature-track {
        animation: none;
        transform: none;
    }

    .mig-feature-group[aria-hidden="true"] {
        display: none;
    }
}

/*marqee section css end*/



/* =========================================
MyIndiaGlobal Advertising Hero
Bootstrap 4.3
========================================= */

.mig-ad-hero {
    position: relative;
    background: #ddffe5;
    border-radius: 0 0 26px 26px;
    padding: 55px 0 120px;
    overflow: visible;
}

.mig-ad-hero-row {
    min-height: 370px;
}

.mig-ad-hero-content {
    position: relative;
    z-index: 2;
    padding: 10px 15px 25px 0;
}

.mig-ad-eyebrow {
    display: inline-block;
    margin-bottom: 15px;
    color: #ed7d20;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.4px;
}

.mig-ad-hero-content h1 {
    color: #171717;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.18;
    margin-bottom: 18px;
}

    .mig-ad-hero-content h1 span {
        display: block;
        color: #ed7d20;
    }

.mig-ad-description {
    max-width: 590px;
    color: #444;
    font-size: 15px;
    line-height: 1.75;
    margin-bottom: 24px;
}

/* Feature List */

.mig-ad-features {
    margin-top: 8px;
}

.mig-ad-feature {
    display: flex;
    align-items: flex-start;
    margin-bottom: 19px;
    padding-right: 12px;
}

.mig-ad-feature-icon {
    width: 36px;
    height: 36px;
    min-width: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 11px;
    background: #ed7d20;
    color: #fff;
    border-radius: 50%;
    font-size: 14px;
}

.mig-ad-feature h6 {
    color: #202020;
    line-height: 1.4;
    font-weight: 700;
    margin: 1px 0 4px;
}

.mig-ad-feature p {
    color: #555;
    line-height: 1.55;
    margin: 0;
}

/* Buttons */

.mig-ad-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 8px;
}

.mig-ad-primary-btn {
    background: #ed7d20;
    border: 1px solid #ed7d20;
    color: #fff;
    border-radius: 5px;
    padding: 13px 20px;
    font-size: 13px;
    font-weight: 700;
    transition: all .25s ease;
}

    .mig-ad-primary-btn:hover,
    .mig-ad-primary-btn:focus {
        background: #d96812;
        border-color: #d96812;
        color: #fff;
        text-decoration: none;
    }

.mig-ad-secondary-btn {
    display: inline-block;
    color: #252525;
    font-size: 13px;
    font-weight: 600;
    padding: 12px 5px;
    text-decoration: none;
}

    .mig-ad-secondary-btn:hover {
        color: #ed7d20;
        text-decoration: none;
    }

/* Hero Image */

.mig-ad-hero-visual {
    position: relative;
    min-height: 365px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.mig-ad-person-img {
    position: relative;
    z-index: 2;
    display: block;
    width: 100%;
    max-width: 440px;
    max-height: 518px;
    object-fit: contain;
    object-position: center bottom;
}

/* Decorative Circles */

.mig-ad-circle {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
}

.mig-ad-circle-one {
    width: 390px;
    height: 390px;
    right: 4%;
    top: -26px;
    background: #eaf2ff;
}

.mig-ad-circle-two {
    width: 90px;
    height: 90px;
    right: 0;
    top: 30px;
    background: rgba(255, 183, 115, .22);
}

/* Floating Cards */

.mig-ad-floating-card {
    position: absolute;
    z-index: 3;
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid rgba(237, 125, 32, .20);
    border-radius: 12px;
    padding: 12px 15px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, .08);
}

.mig-ad-floating-top {
    top: 150px;
    right: -127px;
}

.mig-ad-floating-bottom {
    bottom: 120px;
    left: 63px;
}

.mig-ad-floating-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    min-width: 36px;
    margin-right: 10px;
    background: #fff0df;
    color: #ed7d20;
    border-radius: 9px;
}

.mig-ad-floating-card strong {
    display: block;
    color: #222;
    font-size: 12px;
    line-height: 1.4;
}

.mig-ad-floating-card small {
    display: block;
    color: #666;
    font-size: 10px;
    margin-top: 3px;
}

/* Overlapping Bottom Panel */

.mig-ad-info-container {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -62px;
    z-index: 5;
}

.mig-ad-info-panel {
    background: #ffebc9;
    border-radius: 18px;
    padding: 25px 20px;
    box-shadow: 0 8px 28px rgba(80, 50, 10, .06);
}

.mig-ad-info-item {
    display: flex;
    align-items: center;
    min-height: 75px;
    padding: 5px 15px;
}

.mig-ad-info-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px;
    color: #fff;
    background: #ed7d20;
    border-radius: 50%;
    font-size: 16px;
}

.mig-ad-info-item h5 {
    color: #222;
    font-weight: 700;
    margin-bottom: 5px;
}

.mig-ad-info-item p {
    color: #555;
    line-height: 1.5;
    margin-bottom: 0;
}

/* Tablet */

@media (max-width: 991px) {
    .mig-ad-hero {
        padding-top: 45px;
        padding-bottom: 100px;
    }

    .mig-ad-hero-content h1 {
        font-size: 33px;
    }

    .mig-ad-hero-visual {
        min-height: 320px;
    }

    .mig-ad-person-img {
        max-height: 330px;
    }

    .mig-ad-floating-top {
        right: -5px;
    }

    .mig-ad-info-container {
        bottom: -90px;
    }

    .mig-ad-info-panel {
        padding: 15px 10px;
    }

    .mig-ad-info-item {
        padding: 8px;
    }
}

/* Mobile */

@media (max-width: 767px) {
    .mig-ad-hero {
        padding: 38px 0 0;
        border-radius: 0 0 20px 20px;
    }

    .mig-ad-hero-content {
        padding: 0 5px;
    }

        .mig-ad-hero-content h1 {
            font-size: 30px;
        }

    .mig-ad-description {
        font-size: 14px;
    }

    .mig-ad-feature {
        margin-bottom: 16px;
    }

    .mig-ad-hero-visual {
        min-height: 310px;
        margin-top: 10px;
    }

    .mig-ad-person-img {
        max-height: 310px;
        max-width: 350px;
    }

    .mig-ad-circle-one {
        width: 230px;
        height: 230px;
        right: 10%;
    }

    .mig-ad-floating-top {
        top: 10px;
        right: 0;
    }

    .mig-ad-floating-bottom {
        bottom: 10px;
        left: 0;
    }

    .mig-ad-info-container {
        position: relative;
        bottom: auto;
        margin-top: 0;
        padding-top: 20px;
        padding-bottom: 25px;
    }

    .mig-ad-info-panel {
        padding: 12px;
        border-radius: 14px;
    }

    .mig-ad-info-item {
        min-height: auto;
        padding: 12px 5px;
    }

        .mig-ad-info-item + .mig-ad-info-item {
            border-top: 1px solid rgba(120, 80, 20, .12);
        }

    .mig-ad-actions {
        gap: 8px;
    }

    .mig-ad-primary-btn {
        padding: 12px 14px;
    }
}

@media (max-width: 380px) {
    .mig-ad-hero-content h1 {
        font-size: 27px;
    }

    .mig-ad-floating-card {
        padding: 9px;
    }

        .mig-ad-floating-card strong {
            font-size: 10px;
        }

        .mig-ad-floating-card small {
            font-size: 9px;
        }
}



/* ==========================================
MyIndiaGlobal Ranking & Trust Section
Bootstrap 4.3
========================================== */

.mig-rank-section {
    padding: 24px 0 16px;
    background: #fff;
    overflow: hidden;
}

.mig-rank-top {
    margin-bottom: 24px;
}

    .mig-rank-top > [class*="col-"] {
        margin-bottom: 0;
    }

/* LEFT FEATURE CARD */

.mig-rank-feature {
    position: relative;
    display: flex;
    align-items: flex-end;
    height: 100%;
    min-height: 380px;
    overflow: hidden;
    border-radius: 16px;
    /* Replace with the appropriate existing website image */
    background-color: #c77b29;
    background-image: url('../images/publicwebsiteimages/laptop.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.mig-rank-feature-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(30, 30, 30, 0.04) 0%, rgba(36, 29, 24, 0.35) 20%, rgb(9 110 213) 100%);
    opacity: 133%;
}

.mig-rank-feature-content {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 30px 26px;
    color: #fff;
}

.mig-rank-tag {
    display: block;
    margin-bottom: 14px;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
}

.mig-rank-feature-content h3 {
    margin: 0 0 22px;
    color: #fff;
    font-size: 25px;
    font-weight: 700;
    line-height: 1.35;
}

.mig-rank-cta {
    display: inline-block;
    padding: 11px 16px;
    border-radius: 5px;
    background: #fff;
    color: #222 !important;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.25s ease;
}

    .mig-rank-cta i {
        margin-right: 5px;
    }

    .mig-rank-cta:hover {
        background: #f1f1f1;
        transform: translateY(-2px);
    }

/* RIGHT CAROUSEL */

.mig-rank-carousel {
    height: 100%;
    overflow: hidden;
    border-radius: 16px;
    background: #f8f3ef;
}

    .mig-rank-carousel .carousel-inner,
    .mig-rank-carousel .carousel-item {
        height: 100%;
    }

.mig-rank-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
    min-height: 380px;
    padding: 43px 42px 25px;
}

.mig-rank-brand {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
}

.mig-rank-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 39px;
    height: 39px;
    margin-right: 10px;
    border-radius: 9px 9px 9px 3px;
    background: #ef493d;
    color: #fff;
    font-size: 24px;
    font-weight: 800;
}

.mig-rank-brand-name {
    color: #202a35;
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.5px;
}

.mig-rank-copy {
    flex: 1;
}

    .mig-rank-copy p {
        max-width: 700px;
        margin: 0 0 26px;
        color: #171717;
        font-size: 17px;
        line-height: 1.9;
    }

.mig-rank-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding-top: 14px;
    border-top: 1px solid #e2ddd7;
}

.mig-rank-description h5 {
    margin: 0 0 4px;
    color: #171717;
    font-size: 16px;
    font-weight: 700;
}

.mig-rank-description span {
    display: block;
    color: #333;
    font-size: 13px;
    line-height: 1.5;
}

/* CAROUSEL INDICATORS */

.mig-rank-indicators {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    gap: 5px;
}

.mig-rank-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    border: 1px solid #555;
    border-radius: 50%;
    background: transparent;
}

    .mig-rank-dot.active {
        width: 19px;
        border-color: #ef493d;
        border-radius: 10px;
        background: #ef493d;
    }

.mig-rank-next {
    display: none;
    color: #ef493d !important;
    text-decoration: none;
}

/* BOTTOM PANELS */

.mig-rank-bottom {
    align-items: stretch;
}

    .mig-rank-bottom > [class*="col-"] {
        margin-bottom: 0;
    }

.mig-rank-panel {
    display: flex;
    align-items: stretch;
    justify-content: space-around;
    width: 100%;
    height: 100%;
    min-height: 138px;
    padding: 20px 8px;
    border: 1px solid #deded8;
    border-radius: 16px;
}

.mig-rank-panel-secondary {
    margin-left: 8px;
}

.mig-rank-item {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 0 10px;
    text-align: center;
    text-decoration: none !important;
}

    .mig-rank-item + .mig-rank-item {
        border-left: 1px solid #e1e1dc;
    }

    .mig-rank-item i {
        margin-bottom: 10px;
        color: #ef493d;
        font-size: 23px;
    }

    .mig-rank-item strong {
        margin-bottom: 5px;
        color: #17334a;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.4;
    }

    .mig-rank-item span {
        color: #626262;
        font-size: 11px;
        line-height: 1.5;
    }

    .mig-rank-item:hover strong {
        color: #ef493d;
    }

/* TABLET */

@media (max-width: 991.98px) {
    .mig-rank-feature,
    .mig-rank-card {
        min-height: 360px;
    }

    .mig-rank-card {
        padding: 32px 25px 23px;
    }

    .mig-rank-copy p {
        font-size: 15px;
        line-height: 1.8;
    }

    .mig-rank-bottom > [class*="col-"] {
        margin-bottom: 16px;
    }

    .mig-rank-panel-secondary {
        margin-left: 0;
    }
}

/* MOBILE */

@media (max-width: 767.98px) {
    .mig-rank-section {
        padding: 20px 0;
    }

    .mig-rank-top > [class*="col-"] {
        margin-bottom: 16px;
    }

    .mig-rank-feature {
        min-height: 320px;
    }

    .mig-rank-feature-content {
        padding: 24px 22px;
    }

        .mig-rank-feature-content h3 {
            font-size: 23px;
        }

    .mig-rank-card {
        min-height: 360px;
        padding: 28px 22px 22px;
    }

    .mig-rank-brand {
        margin-bottom: 18px;
    }

    .mig-rank-copy p {
        font-size: 15px;
        line-height: 1.75;
    }

    .mig-rank-footer {
        align-items: flex-start;
        flex-wrap: wrap;
    }

    .mig-rank-indicators {
        margin-top: 8px;
    }

    .mig-rank-panel {
        min-height: 125px;
        padding: 18px 4px;
    }

    .mig-rank-item {
        padding: 0 5px;
    }

        .mig-rank-item strong {
            font-size: 11px;
        }

        .mig-rank-item span {
            font-size: 10px;
        }

        .mig-rank-item i {
            font-size: 20px;
        }
}

/* SMALL MOBILE */

@media (max-width: 420px) {
    .mig-rank-panel {
        flex-wrap: wrap;
        row-gap: 20px;
    }

        .mig-rank-panel:not(.mig-rank-panel-secondary)
        .mig-rank-item {
            flex: 0 0 50%;
        }

            .mig-rank-panel:not(.mig-rank-panel-secondary)
            .mig-rank-item:nth-child(3) {
                border-left: 0;
            }

    .mig-rank-panel-secondary .mig-rank-item {
        flex: 0 0 50%;
    }

    .mig-rank-card {
        padding: 24px 17px 20px;
    }

    .mig-rank-description h5 {
        font-size: 14px;
    }
}



/* =========================================
MIG CHALLENGE SECTION
Bootstrap 4.3
========================================= */

.mig-challenge-section {
    position: relative;
    width: 100%;
    padding: 45px 0 45px;
    overflow: hidden;
    color: #303030;
}

    .mig-challenge-section .container {
        max-width: 1200px;
    }

/* Heading */

.mig-challenge-heading {
    max-width: 760px;
    margin: 0 auto 35px;
}

.mig-challenge-eyebrow {
    display: inline-block;
    margin-bottom: 12px;
    color: #0875d1;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.8px;
    text-transform: uppercase;
}

.mig-challenge-heading h2 {
    margin: 0 auto 14px;
    color: #303030;
    font-size: 36px;
    line-height: 1.2;
    font-weight: 700;
}

.mig-challenge-heading p {
    max-width: 650px;
    margin: 0 auto;
    color: #666;
    font-size: 16px;
    line-height: 1.7;
}

/* Diagram canvas */

.mig-challenge-diagram {
    position: relative;
    width: 100%;
    max-width: 1200px;
    height: 460px;
    margin: 0 auto;
}

/* Connecting lines */

.mig-challenge-connectors {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
    overflow: visible;
    pointer-events: none;
}

/* Central person illustration */

.mig-challenge-center {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 98px;
    height: 98px;
    transform: translate(-50%, -50%);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.08);
}

.mig-challenge-person {
    width: 76px;
    height: 76px;
}

    .mig-challenge-person svg {
        display: block;
        width: 100%;
        height: 100%;
    }

/* Challenge cards */

.mig-challenge-card {
    position: absolute;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 20px;
    width: 33%;
    min-height: 118px;
    padding: 14px;
    border: 1px solid #b9dcff;
    border-radius: 19px;
    background: #fff;
    box-shadow: none;
    transition: box-shadow .25s ease, border-color .25s ease;
}

    .mig-challenge-card:hover {
        border-color: #82bfff;
        box-shadow: 0 8px 24px rgba(15, 94, 160, .07);
    }

    .mig-challenge-card p {
        flex: 1;
        min-width: 0;
        margin: 0;
        color: #171717;
        font-size: 14px;
        line-height: 1.55;
        font-weight: 400;
    }

    .mig-challenge-card strong {
        color: #111;
        font-weight: 700;
    }

/* Icon tile */

.mig-challenge-icon {
    display: flex;
    flex: 0 0 72px;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 15px;
    color: #0875d1;
    background: linear-gradient(150deg, #e2f6ff 0%, #f0f4ff 65%, #f7edff 100%);
}

    .mig-challenge-icon svg {
        display: block;
        width: 46px;
        height: 46px;
    }

/* Card positions: desktop */

.mig-challenge-one {
    top: 0;
    left: 8%;
}

.mig-challenge-two {
    top: 50%;
    left: 0;
    transform: translateY(-50%);
}

.mig-challenge-three {
    bottom: 0;
    left: 8%;
}

.mig-challenge-four {
    top: 5px;
    right: 8%;
}

.mig-challenge-five {
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}

.mig-challenge-six {
    bottom: 5px;
    right: 8%;
}

/* =========================================
LAPTOPS
========================================= */

@media (min-width: 992px) and (max-width: 1199px) {
    .mig-challenge-section .container {
        max-width: 100%;
        padding-left: 30px;
        padding-right: 30px;
    }

    .mig-challenge-diagram {
        height: 430px;
    }

    .mig-challenge-card {
        width: 35%;
        gap: 14px;
        min-height: 110px;
        padding: 12px;
    }

    .mig-challenge-icon {
        flex-basis: 62px;
        width: 62px;
        height: 62px;
    }

        .mig-challenge-icon svg {
            width: 42px;
            height: 42px;
        }

    .mig-challenge-card p {
        font-size: 14px;
    }
}

/* =========================================
TABLETS
========================================= */

@media (min-width: 768px) and (max-width: 991px) {
    .mig-challenge-section {
        padding: 55px 0;
    }

    .mig-challenge-heading {
        padding: 0 15px;
    }

        .mig-challenge-heading h2 {
            font-size: 30px;
        }

    .mig-challenge-diagram {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 90px minmax(0, 1fr);
        grid-template-rows: repeat(3, minmax(125px, auto));
        align-items: center;
        gap: 18px 10px;
        height: auto;
    }

    .mig-challenge-connectors {
        display: none;
    }

    .mig-challenge-center {
        position: relative;
        top: auto;
        left: auto;
        grid-column: 2;
        grid-row: 2;
        width: 82px;
        height: 82px;
        transform: none;
        margin: auto;
    }

    .mig-challenge-person {
        width: 65px;
        height: 65px;
    }

    .mig-challenge-card {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: 100%;
        min-height: 125px;
        height: 100%;
        gap: 10px;
        padding: 12px;
        transform: none;
        border-radius: 15px;
    }

    .mig-challenge-one {
        grid-column: 1;
        grid-row: 1;
    }

    .mig-challenge-two {
        grid-column: 1;
        grid-row: 2;
    }

    .mig-challenge-three {
        grid-column: 1;
        grid-row: 3;
    }

    .mig-challenge-four {
        grid-column: 3;
        grid-row: 1;
    }

    .mig-challenge-five {
        grid-column: 3;
        grid-row: 2;
    }

    .mig-challenge-six {
        grid-column: 3;
        grid-row: 3;
    }

    .mig-challenge-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
        border-radius: 12px;
    }

        .mig-challenge-icon svg {
            width: 34px;
            height: 34px;
        }

    .mig-challenge-card p {
        font-size: 13px;
        line-height: 1.45;
    }
}

/* =========================================
MOBILE
========================================= */

@media (max-width: 767px) {
    .mig-challenge-section {
        padding: 45px 0 50px;
    }

        .mig-challenge-section .container {
            padding-left: 20px;
            padding-right: 20px;
        }

    .mig-challenge-heading {
        margin-bottom: 28px;
    }

        .mig-challenge-heading h2 {
            font-size: 27px;
            line-height: 1.25;
        }

        .mig-challenge-heading p {
            font-size: 14px;
            line-height: 1.6;
        }

    .mig-challenge-diagram {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        height: auto;
    }

    .mig-challenge-connectors {
        display: none;
    }

    .mig-challenge-center {
        position: relative;
        top: auto;
        left: auto;
        order: -1;
        width: 82px;
        height: 82px;
        margin: 0 auto 10px;
        transform: none;
    }

    .mig-challenge-person {
        width: 65px;
        height: 65px;
    }

    .mig-challenge-card {
        position: relative;
        top: auto;
        right: auto;
        bottom: auto;
        left: auto;
        width: 100%;
        min-height: 100px;
        height: auto;
        gap: 14px;
        padding: 14px;
        border-radius: 15px;
        transform: none;
    }

    .mig-challenge-icon {
        flex: 0 0 58px;
        width: 58px;
        height: 58px;
        border-radius: 13px;
    }

        .mig-challenge-icon svg {
            width: 38px;
            height: 38px;
        }

    .mig-challenge-card p {
        font-size: 14px;
        line-height: 1.5;
    }
}

/* =========================================
SMALL MOBILE
========================================= */

@media (max-width: 380px) {
    .mig-challenge-section .container {
        padding-left: 14px;
        padding-right: 14px;
    }

    .mig-challenge-heading h2 {
        font-size: 24px;
    }

    .mig-challenge-card {
        gap: 10px;
        padding: 11px;
    }

    .mig-challenge-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
    }

        .mig-challenge-icon svg {
            width: 32px;
            height: 32px;
        }

    .mig-challenge-card p {
        font-size: 13px;
    }
}

/* Respect reduced-motion preferences */

@media (prefers-reduced-motion: reduce) {
    .mig-challenge-card {
        transition: none;
    }
}



/* Font Awesome icons in the community diagram */

.mig-challenge-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 72px;
    width: 72px;
    height: 72px;
    border-radius: 15px;
    color: #0875d1;
    background: linear-gradient( 150deg, #e2f6ff 0%, #f0f4ff 65%, #f7edff 100% );
}

    .mig-challenge-icon i {
        font-size: 31px;
        line-height: 1;
    }

.mig-challenge-person {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    color: #0875d1;
}

    .mig-challenge-person i {
        font-size: 53px;
        line-height: 1;
    }

/* Tablet */
@media (min-width: 768px) and (max-width: 991px) {
    .mig-challenge-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
    }

        .mig-challenge-icon i {
            font-size: 23px;
        }

    .mig-challenge-person i {
        font-size: 44px;
    }
}

/* Mobile */
@media (max-width: 767px) {
    .mig-challenge-icon {
        flex: 0 0 58px;
        width: 58px;
        height: 58px;
    }

        .mig-challenge-icon i {
            font-size: 26px;
        }

    .mig-challenge-person i {
        font-size: 44px;
    }
}

@media (max-width: 380px) {
    .mig-challenge-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
    }

        .mig-challenge-icon i {
            font-size: 22px;
        }
}




/* =========================================
   MyIndiaGlobal Feature Showcase
   Bootstrap 4.3 compatible
========================================= */

.mig-feature-showcase {
    padding: 18px 16px;
    background: #edf2ff;
}

.mig-feature-row {
    margin-left: -8px;
    margin-right: -8px;
    align-items: stretch;
}

    .mig-feature-row > [class*="col-"] {
        padding-left: 8px;
        padding-right: 8px;
    }

/* Left navigation */

.mig-feature-nav {
    display: flex;
    flex-direction: column;
    height: 100%;
    gap: 30px;
}

.mig-feature-tab {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 80px;
    padding: 20px 18px;
    border: 1px solid #dfe7fb;
    border-radius: 7px;
    background: #ffffff;
    color: #182233;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.45;
    cursor: pointer;
    transition: background .25s ease, color .25s ease, box-shadow .25s ease, transform .25s ease;
}

    .mig-feature-tab i {
        flex: 0 0 22px;
        width: 22px;
        margin-right: 14px;
        font-size: 19px;
        text-align: center;
    }

    .mig-feature-tab span {
        display: block;
    }

    .mig-feature-tab:hover {
        border-color: #b6caff;
        color: #0757f9;
        transform: translateY(-1px);
    }

    .mig-feature-tab.active,
    .mig-feature-tab.active:hover {
        color: #ffffff;
        background: #096dd4;
        border-color: #096dd4;
        box-shadow: 0 10px 22px rgba(18, 88, 245, .16);
    }

    .mig-feature-tab:focus {
        outline: 2px solid #82a8ff;
        outline-offset: 2px;
    }

/* Main content panel */

.mig-feature-content {
    height: 100%;
    min-height: 520px;
    /*    padding: 38px 34px;*/
    /*    background: #ffffff;*/
    border: 1px solid #e4eafa;
    border-radius: 15px;
    box-shadow: 0 5px 24px rgba(33, 55, 100, .035);
}

    .mig-feature-content .tab-content,
    .mig-feature-content .tab-pane {
        height: 100%;
    }

    .mig-feature-content .row {
        min-height: 440px;
    }

.mig-feature-copy {
    padding: 12px 4px;
}

.mig-feature-label {
    display: inline-block;
    margin-bottom: 14px;
    color: #1258f5;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 1.5px;
}

.mig-feature-copy h2 {
    margin: 0 0 18px;
    color: #151e2d;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.22;
    letter-spacing: -.6px;
}

.mig-feature-description {
    margin-bottom: 24px;
    color: #475467;
    font-size: 16px;
    line-height: 1.65;
}

.mig-feature-list {
    margin: 0 0 28px;
    padding: 0;
    list-style: none;
}

    .mig-feature-list li {
        display: flex;
        align-items: flex-start;
        margin-bottom: 15px;
        color: #3e495b;
        font-size: 15px;
        line-height: 1.5;
    }

        .mig-feature-list li i {
            flex: 0 0 18px;
            margin: 4px 12px 0 0;
            color: #18a957;
            font-size: 17px;
        }

.mig-feature-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 10px 16px;
    border: 1px solid #1258f5;
    border-radius: 5px;
    color: #1258f5;
    background: #ffffff;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    transition: background .2s ease, color .2s ease;
}

    .mig-feature-button i {
        margin-left: 10px;
        transition: transform .2s ease;
    }

    .mig-feature-button:hover {
        color: #ffffff;
        background: #1258f5;
    }

        .mig-feature-button:hover i {
            transform: translateX(3px);
        }

/* Right-side CSS illustration */

.mig-feature-visual {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 400px;
    padding: 10px 0;
}

.mig-feature-art {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 360px;
    min-height: 390px;
}

.mig-art-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 275px;
    height: 275px;
    border-radius: 50%;
    background: #edf3ff;
    transform: translate(-50%, -50%);
}

.mig-art-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 280px;
    padding: 22px 20px;
    border: 1px solid #e7ebf2;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: 0 15px 40px rgba(24, 38, 65, .12);
}

.mig-art-brand {
    display: flex;
    align-items: center;
    margin-bottom: 26px;
}

    .mig-art-brand strong,
    .mig-art-profile strong {
        display: block;
        color: #192334;
        font-size: 13px;
        font-weight: 700;
        line-height: 1.4;
    }

    .mig-art-brand small,
    .mig-art-profile small {
        display: block;
        margin-top: 3px;
        color: #788396;
        font-size: 11px;
        line-height: 1.4;
    }

.mig-art-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    margin-right: 12px;
    border-radius: 10px;
    background: #edf3ff;
    color: #1258f5;
    font-size: 21px;
}

.mig-art-profile {
    display: flex;
    align-items: center;
    margin-bottom: 17px;
    padding: 12px 10px;
    border: 1px solid #edf0f5;
    border-radius: 7px;
    background: #ffffff;
}

.mig-art-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    margin-right: 10px;
    border-radius: 8px;
    background: #e9f8ef;
    color: #17a653;
    font-size: 17px;
}

    .mig-art-avatar.mig-avatar-orange {
        background: #fff1e6;
        color: #f28b35;
    }

.mig-art-status {
    padding-top: 14px;
    border-top: 1px solid #edf0f5;
    color: #4d596b;
    font-size: 11px;
    line-height: 1.5;
}

    .mig-art-status i {
        margin-right: 6px;
        color: #18a957;
        font-size: 14px;
    }

.mig-art-float {
    position: absolute;
    z-index: 2;
    display: flex;
    align-items: center;
    max-width: 210px;
    padding: 13px 15px;
    border: 1px solid #edf0f5;
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 9px 28px rgba(24, 38, 65, .10);
    color: #273346;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

    .mig-art-float i {
        margin-right: 9px;
        color: #1258f5;
        font-size: 16px;
    }

.mig-art-float-top {
    top: 16px;
    right: -3px;
}

.mig-art-float-bottom {
    bottom: 8px;
    left: -50px;
}

    .mig-art-float-bottom i {
        color: #18a957;
    }

/* Directory-specific elements */

.mig-art-search {
    display: flex;
    align-items: center;
    margin-bottom: 18px;
    padding: 12px;
    border: 1px solid #e6eaf1;
    border-radius: 6px;
    color: #929bad;
    font-size: 12px;
}

    .mig-art-search i {
        margin-right: 9px;
        color: #1258f5;
    }

.mig-art-referral {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    padding: 24px 0;
}

    .mig-art-referral > span {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 65px;
        height: 65px;
        border-radius: 50%;
        background: #eaf1ff;
        color: #1258f5;
        font-size: 25px;
    }

    .mig-art-referral > .mig-referral-orange {
        background: #fff1e6;
        color: #f28b35;
    }

.mig-referral-arrow {
    color: #18a957;
    font-size: 20px;
}

.mig-art-event {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
    padding: 12px;
    border: 1px solid #edf0f5;
    border-radius: 7px;
}

.mig-event-date {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    height: 52px;
    margin-right: 11px;
    border-radius: 6px;
    background: #edf3ff;
    color: #1258f5;
}

    .mig-event-date strong {
        font-size: 9px;
    }

    .mig-event-date i {
        margin-top: 4px;
        font-size: 17px;
    }

.mig-art-event > div:last-child strong {
    display: block;
    color: #192334;
    font-size: 12px;
    line-height: 1.5;
}

.mig-art-event > div:last-child small {
    display: block;
    margin-top: 3px;
    color: #788396;
    font-size: 10px;
}

/* Tablet and mobile */

@media (max-width: 1199.98px) {
    .mig-feature-content {
        padding: 30px 24px;
    }

    .mig-feature-copy h2 {
        font-size: 28px;
    }

    .mig-feature-visual {
        padding-left: 0;
    }

    .mig-art-float-top {
        right: 0;
    }

    .mig-art-float-bottom {
        left: 0;
    }
}

@media (max-width: 991.98px) {
    .mig-feature-showcase {
        padding: 20px 12px;
    }

    .mig-feature-nav {
        gap: 10px;
        margin-bottom: 16px;
    }

    .mig-feature-tab {
        min-height: 66px;
        padding: 15px 12px;
        font-size: 14px;
    }

        .mig-feature-tab i {
            margin-right: 9px;
            font-size: 16px;
        }

    .mig-feature-content {
        min-height: auto;
        padding: 26px 22px;
    }

        .mig-feature-content .row {
            min-height: auto;
        }

    .mig-feature-copy h2 {
        font-size: 27px;
    }

    .mig-feature-visual {
        min-height: 350px;
    }

    .mig-feature-art {
        min-height: 340px;
    }

    .mig-art-circle {
        width: 235px;
        height: 235px;
    }
}

@media (max-width: 767.98px) {
    .mig-feature-showcase {
        padding: 14px 10px;
    }

    .mig-feature-nav {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 8px;
        padding: 2px 2px 12px;
        overflow-x: auto;
    }

    .mig-feature-tab {
        flex: 0 0 175px;
        min-height: 65px;
        padding: 12px;
        font-size: 13px;
    }

        .mig-feature-tab i {
            flex-basis: 19px;
            width: 19px;
            font-size: 16px;
        }

    .mig-feature-content {
        padding: 25px 18px;
        border-radius: 8px;
    }

    .mig-feature-copy {
        padding: 0;
    }

        .mig-feature-copy h2 {
            font-size: 27px;
            line-height: 1.3;
        }

    .mig-feature-description {
        font-size: 15px;
    }

    .mig-feature-list li {
        font-size: 14px;
    }

    .mig-feature-visual {
        min-height: 350px;
        margin-top: 20px;
    }

    .mig-feature-art {
        max-width: 340px;
    }

    .mig-art-float-top {
        right: 0;
    }

    .mig-art-float-bottom {
        left: 0;
    }
}

@media (max-width: 420px) {
    .mig-feature-content {
        padding: 22px 14px;
    }

    .mig-feature-copy h2 {
        font-size: 24px;
    }

    .mig-feature-visual {
        min-height: 320px;
    }

    .mig-feature-art {
        min-height: 315px;
    }

    .mig-art-card {
        max-width: 255px;
        padding: 18px 14px;
    }

    .mig-art-circle {
        width: 220px;
        height: 220px;
    }

    .mig-art-float {
        max-width: 185px;
        padding: 10px 11px;
        font-size: 10px;
    }

    .mig-art-float-top {
        top: 9px;
    }

    .mig-art-float-bottom {
        bottom: 7px;
    }
}



/* ======================================
   EVENT LISTING SECTION
====================================== */

.events-listing-section {
    padding: 40px 0 60px;
    background: #ffffff;
}

.events-section-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    margin-bottom: 26px;
}

.events-eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    color: #e98232;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.4px;
}

.events-main-title {
    margin: 0 0 10px;
    color: #252b36;
    font-size: 32px;
    font-weight: 700;
    line-height: 1.25;
}

.events-section-description {
    max-width: 650px;
    margin: 0;
    color: #707784;
    font-size: 15px;
    line-height: 1.7;
}

.events-view-all {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex-shrink: 0;
    color: #2864a5;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
}

    .events-view-all:hover {
        color: #e98232;
    }

    .events-view-all .material-icons {
        font-size: 19px;
    }


/* ======================================
   EVENT CATEGORY FILTERS
====================================== */

.event-category-filters {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 32px;
    padding: 16px;
    background: #f8f9fb;
    border: 1px solid #edf0f4;
    border-radius: 12px;
}

.event-filter-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 40px;
    padding: 9px 15px;
    border: 1px solid #e4e8ee;
    border-radius: 7px;
    background: #ffffff;
    color: #525c6b;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

    .event-filter-btn .material-icons {
        font-size: 18px;
    }

    .event-filter-btn:hover {
        border-color: #e98232;
        color: #d76c1d;
    }

    .event-filter-btn.active {
        border-color: #e98232;
        background: #e98232;
        color: #ffffff;
    }

    .event-filter-btn:focus-visible,
    .event-save-btn:focus-visible {
        outline: 2px solid #2864a5;
        outline-offset: 3px;
    }


/* ======================================
   RESULTS HEADER
====================================== */

.events-results-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

    .events-results-header h3 {
        margin: 0 0 5px;
        color: #252b36;
        font-size: 21px;
        font-weight: 700;
    }

.events-results-count {
    color: #7b8491;
    font-size: 13px;
}

.events-sort {
    display: flex;
    align-items: center;
    gap: 10px;
}

    .events-sort label {
        margin: 0;
        color: #697281;
        font-size: 13px;
        white-space: nowrap;
    }

    .events-sort select {
        width: auto;
        min-width: 145px;
        height: 38px;
        border-color: #e2e6ed;
        border-radius: 7px;
        color: #414957;
        font-size: 13px;
        box-shadow: none;
    }


/* ======================================
   EVENT GRID
====================================== */

.event-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 24px;
    align-items: stretch;
}

.event-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #e9edf2;
    border-radius: 13px;
    box-shadow: 0 3px 14px rgba(31, 45, 61, 0.045);
    transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

    .event-card:hover {
        transform: translateY(-4px);
        border-color: #f0c9a8;
        box-shadow: 0 12px 28px rgba(31, 45, 61, 0.10);
    }

    .event-card[hidden] {
        display: none !important;
    }


/* ======================================
   EVENT IMAGE
====================================== */

.event-card-image-wrap {
    position: relative;
    height: 205px;
    overflow: hidden;
    background: #f0f2f5;
}

.event-image-link {
    display: block;
    width: 100%;
    height: 100%;
}

.event-card-image {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s ease;
}

.event-card:hover .event-card-image {
    transform: scale(1.045);
}


/* ======================================
   EVENT TYPE BADGES
====================================== */

.event-type-badge {
    position: absolute;
    top: 13px;
    left: 13px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: calc(100% - 70px);
    padding: 7px 10px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.3;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

    .event-type-badge .material-icons {
        font-size: 15px;
    }

.badge-fundraising {
    background: #fff0e3;
    color: #a94d08;
}

.badge-donation {
    background: #e8f6ed;
    color: #237644;
}

.badge-seating {
    background: #e8f0ff;
    color: #2859a3;
}

.badge-networking {
    background: #f0eaff;
    color: #6941a5;
}

.badge-online {
    background: #e3f5f9;
    color: #147487;
}

.badge-general {
    background: #fff4d9;
    color: #8c6500;
}


/* ======================================
   SAVE EVENT BUTTON
====================================== */

.event-save-btn {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.96);
    color: #505968;
    cursor: pointer;
    transition: color 0.2s ease, background 0.2s ease;
}

    .event-save-btn .material-icons {
        font-size: 20px;
    }

    .event-save-btn:hover,
    .event-save-btn.is-saved {
        background: #fff0e9;
        color: #e56e43;
    }


/* ======================================
   DATE BADGE
====================================== */

.event-date-badge {
    position: absolute;
    bottom: 12px;
    left: 13px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 54px;
    padding: 7px 9px;
    border-radius: 8px;
    background: #ffffff;
    color: #e98232;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.12);
}

    .event-date-badge span {
        font-size: 10px;
        font-weight: 700;
        letter-spacing: 1px;
    }

    .event-date-badge strong {
        font-size: 23px;
        line-height: 1.15;
    }


/* ======================================
   EVENT CONTENT
====================================== */

.event-card-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 18px;
}

.event-organizer {
    margin-bottom: 7px;
    overflow: hidden;
    color: #2864a5;
    font-size: 12px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.event-card-title {
    display: -webkit-box;
    min-height: 48px;
    margin: 0 0 8px;
    overflow: hidden;
    color: #252b36;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.4;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

    .event-card-title a {
        color: inherit;
        text-decoration: none;
    }

        .event-card-title a:hover {
            color: #e98232;
        }

.event-card-description {
    display: -webkit-box;
    min-height: 42px;
    margin: 0 0 15px;
    overflow: hidden;
    color: #737c89;
    font-size: 13px;
    line-height: 1.65;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}


/* ======================================
   EVENT DETAILS
====================================== */

.event-meta {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 16px;
}

    .event-meta > div {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        min-width: 0;
        color: #596372;
        font-size: 12px;
        line-height: 1.5;
    }

    .event-meta .material-icons {
        flex-shrink: 0;
        color: #e98232;
        font-size: 17px;
    }

    .event-meta span {
        min-width: 0;
        overflow-wrap: anywhere;
    }


/* ======================================
   FUNDRAISING PROGRESS
====================================== */

.event-progress {
    margin: 0 0 17px;
}

.event-progress-label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    color: #687281;
    font-size: 11px;
}

    .event-progress-label strong {
        color: #303947;
        font-size: 11px;
    }

.event-progress-track {
    width: 100%;
    height: 6px;
    overflow: hidden;
    border-radius: 10px;
    background: #edf0f4;
}

.event-progress-fill {
    height: 100%;
    border-radius: 10px;
    background: #e98232;
}


/* ======================================
   DONATION INFORMATION
====================================== */

.event-donation-info {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 17px;
    padding: 12px;
    border: 1px solid #e5f1e8;
    border-radius: 8px;
    background: #f5fbf6;
}

    .event-donation-info span {
        color: #6d7c70;
        font-size: 11px;
    }

    .event-donation-info strong {
        color: #287344;
        font-size: 14px;
    }


/* ======================================
   EVENT FEATURE NOTE
====================================== */

.event-feature-note {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0 0 17px;
    padding: 9px 10px;
    border-radius: 7px;
    background: #f5f7fa;
    color: #566170;
    font-size: 11px;
    line-height: 1.5;
}

    .event-feature-note .material-icons {
        flex-shrink: 0;
        color: #2864a5;
        font-size: 17px;
    }


/* ======================================
   EVENT FOOTER AND ACTIONS
====================================== */

.event-card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    margin-top: auto;
    padding-top: 14px;
    border-top: 1px solid #edf0f4;
}

.event-price-label {
    color: #303947;
    font-size: 13px;
    font-weight: 700;
}

.event-free-label {
    color: #25834d;
}

.event-card-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    padding: 9px 13px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
    white-space: nowrap;
    text-decoration: none;
}

    .event-card-action:hover {
        text-decoration: none;
    }


/* ======================================
   EMPTY STATE
====================================== */

.events-empty-state {
    padding: 45px 20px;
    text-align: center;
    border: 1px dashed #dce2ea;
    border-radius: 12px;
    background: #fafbfd;
}

    .events-empty-state > .material-icons {
        color: #9aa4b2;
        font-size: 42px;
    }

    .events-empty-state h4 {
        margin: 12px 0 8px;
        color: #303947;
        font-weight: 700;
    }

    .events-empty-state p {
        margin-bottom: 18px;
        color: #737c89;
        font-size: 14px;
    }


/* ======================================
   RESPONSIVE: TABLET
====================================== */

@media (max-width: 991.98px) {

    .event-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
    }

    .events-main-title {
        font-size: 28px;
    }

    .event-card-image-wrap {
        height: 195px;
    }

    .event-card-content {
        padding: 16px;
    }

    .event-category-filters {
        gap: 8px;
        padding: 12px;
    }

    .event-filter-btn {
        padding: 8px 11px;
    }
}


/* ======================================
   RESPONSIVE: MOBILE
====================================== */

@media (max-width: 575.98px) {

    .events-listing-section {
        padding: 28px 0 40px;
    }

    .events-section-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

    .events-main-title {
        font-size: 25px;
    }

    .events-section-description {
        font-size: 14px;
    }

    .events-view-all {
        font-size: 13px;
    }

    .event-category-filters {
        flex-wrap: nowrap;
        overflow-x: auto;
        margin-right: -15px;
        margin-left: -15px;
        padding: 10px 15px;
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        scrollbar-width: thin;
        -webkit-overflow-scrolling: touch;
    }

    .event-filter-btn {
        flex-shrink: 0;
    }

    .events-results-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 12px;
    }

        .events-results-header h3 {
            font-size: 19px;
        }

    .events-sort {
        width: 100%;
        justify-content: space-between;
    }

        .events-sort select {
            flex: 1;
            max-width: 210px;
        }

    .event-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 18px;
    }

    .event-card-image-wrap {
        height: 210px;
    }

    .event-card-content {
        padding: 17px;
    }

    .event-card-title {
        font-size: 18px;
    }

    .event-card-footer {
        gap: 8px;
    }

    .event-card-action {
        padding: 9px 12px;
    }
}


/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
    .event-card,
    .event-card-image,
    .event-filter-btn {
        transition: none;
    }
}




/* =========================================
   MIG Header - Smooth Scroll Transition
========================================= */

.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1050;
    background: rgba(255, 255, 255, 1);
    border-radius: 0;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
    transform: translate3d(0, 0, 0);
    transition: width 0.5s cubic-bezier(0.22, 1, 0.36, 1), max-width 0.5s cubic-bezier(0.22, 1, 0.36, 1), top 0.5s cubic-bezier(0.22, 1, 0.36, 1), left 0.5s cubic-bezier(0.22, 1, 0.36, 1), border-radius 0.45s ease, box-shadow 0.45s ease, background-color 0.4s ease;
    will-change: width, top, left, border-radius;
}

    /* Scrolled state */
    .header.header-scrolled {
        top: 12px;
        left: 50%;
        width: 94%;
        max-width: 1440px;
        border-radius: 22px;
        background: rgba(255, 255, 255, 0.96);
        box-shadow: 0 8px 30px rgba(31, 41, 55, 0.10);
        transform: translate3d(-50%, 0, 0);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
    }

    /* Smooth inner spacing */
    .header .container,
    .header .container-fluid {
        transition: padding 0.45s cubic-bezier(0.22, 1, 0.36, 1);
    }

    .header.header-scrolled .container,
    .header.header-scrolled .container-fluid {
        padding-top: 4px;
        padding-bottom: 4px;
    }

    /* Smooth logo resizing */
    .header img {
        transition: max-width 0.4s ease, max-height 0.4s ease, opacity 0.3s ease;
    }

    /* Smooth navigation and CTA changes */
    .header .nav-link,
    .header .btn {
        transition: padding 0.35s ease, color 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
    }

/* Tablet */
@media (min-width: 768px) and (max-width: 991.98px) {
    .header.header-scrolled {
        top: 8px;
        width: 96%;
        border-radius: 18px;
    }
}

/* Mobile: keep the header full-width */
@media (max-width: 767.98px) {
    .header,
    .header.header-scrolled {
        top: 0;
        left: 0;
        width: 100%;
        max-width: none;
        border-radius: 0;
        transform: none;
        background: #fff;
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }

        .header.header-scrolled {
            box-shadow: 0 4px 18px rgba(31, 41, 55, 0.10);
        }

            .header .container,
            .header .container-fluid,
            .header.header-scrolled .container,
            .header.header-scrolled .container-fluid {
                padding-top: 8px;
                padding-bottom: 8px;
            }

        .header img {
            max-width: 145px;
            max-height: 45px;
            height: auto;
        }

        .header.header-scrolled img {
            max-width: 130px;
            max-height: 40px;
        }
}

/* Small mobile */
@media (max-width: 479.98px) {
    .header .container,
    .header .container-fluid {
        padding-left: 12px;
        padding-right: 12px;
    }

    .header img {
        max-width: 125px;
    }
}




/* =========================================
   MIG - Animated Card Border
   Light Sweeping Effect
========================================= */

@property --mig-border-angle {
    syntax: "<angle>";
    inherits: false;
    initial-value: 0deg;
}

.mig-light-border {
    position: relative;
    isolation: isolate;
    border-radius: inherit;
    border: 1px solid #eeeeee;
    transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

    /* Animated light around the border */
    .mig-light-border::before {
        content: "";
        position: absolute;
        inset: -1px;
        padding: 1.5px;
        border-radius: inherit;
        pointer-events: none;
        z-index: 2;
        background: conic-gradient( from var(--mig-border-angle), transparent 0deg, transparent 285deg, #ff7a36 315deg, #ff7a36 330deg, #ff7a36 345deg, transparent 360deg );
        /* Show the gradient only along the border */
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: xor;
        mask-composite: exclude;
        animation: mig-border-sweep 3s linear infinite;
        animation-play-state: running;
    }

    /* Activate the animation on hover */
    .mig-light-border:hover::before {
        animation-play-state: running;
    }

    /* Smooth card interaction */
    .mig-light-border:hover {
        border-color: transparent;
        box-shadow: 0 10px 30px rgba(255, 122, 54, 0.12);
        transform: translateY(-4px);
    }

/* Border animation */
@keyframes mig-border-sweep {
    from {
        --mig-border-angle: 0deg;
    }

    to {
        --mig-border-angle: 360deg;
    }
}

/* Keyboard accessibility */
.mig-light-border:focus-within {
    outline: 2px solid rgba(255, 122, 54, 0.65);
    outline-offset: 3px;
}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {
    .mig-light-border,
    .mig-light-border::before {
        animation: none !important;
        transition: none !important;
    }

        .mig-light-border:hover {
            transform: none;
        }
}