/*
Theme Name: Visaland
Author: Skylark
Author URI: https://themeforest.net/user/Skylark/
Description: Immigration & Visa Consulting HTML Template
Version: 1.0.0
*/

/*
=================================
|***    Table of contents:   ***|
=================================

1. General styles
2. Typography
3. Helpers
4. Preloader
5. Go up button
6. Header and navigation
7. Hero Section
8. About us
9. Services
10. Fun facts
11. Projects
12. Pricing
13. Testimonial
14. CTA
15. Team
16. Video Banner
17. Shop
18. Marquee
19. Blog
20. Footer

Main Style file-> assets/css/main.css 
*/


table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
}

th,
td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: center;
}

th {
    background-color: var(--bg4);
    color: var(--body);
}

@media (max-width: 600px) {

    table,
    thead,
    tbody,
    th,
    td,
    tr {
        display: block;
    }

    th,
    td {
        box-sizing: border-box;
        width: 100%;
        text-align: left;
    }

    tr {
        margin-bottom: 15px;
    }
}



/*-- Portfolio Item --*/
.filter_menu {
    position: relative;
    display: flex;
    margin: 61px 0 50px;
    padding: 0;
}

.filter_menu.text-right {
    justify-content: flex-end;
}

.filter_menu.text-center {
    justify-content: center;
}

.filter_menu li {
    list-style: none;
    display: inline-block;
    font-size: 16px;
    font-weight: 700;
    line-height: 50px;
    text-align: center;
    height: 50px;
    color: var(--black);
    position: relative;
    z-index: 2;
    cursor: pointer;
    padding: 0 30px;
    border-radius: 50px;
    margin-left: 0;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.filter_menu li:after {
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    width: 80%;
    height: 80%;
    content: '';
    border-radius: 50px;
    opacity: 0;
    visibility: hidden;
    background: var(--theme);
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.filter_menu li:hover:after,
.filter_menu li.active:after {
    visibility: visible;
    opacity: 1;
    width: 100%;
    height: 100%;
}

.filter_menu li:hover,
.filter_menu li.active {
    color: #fff;
}

.folioItem02 {
    position: relative;
    overflow: hidden;
    margin: 0 0 30px;
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.folioItem02 img {
    width: 100%;
    height: auto;
}

.folioItem02:before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    opacity: 0;
    visibility: hidden;
    background: var(--theme);
    -webkit-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.folioItem02:hover:before {
    visibility: visible;
    opacity: .8;
}

.folioItem02 .folioContent {
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    bottom: auto;
    padding: 0 20px;
    transform: translateY(-50%);
    z-index: 3;
}

.folioItem02 .folioContent .cat {
    font-size: 14px;
    letter-spacing: 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: transform 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 300ms, visibility ease 300ms, background ease 300ms, color ease 300ms;
    -moz-transition: transform 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 300ms, visibility ease 300ms, background ease 300ms, color ease 300ms;
    transition: transform 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 300ms, visibility ease 300ms, background ease 300ms, color ease 300ms;
    transform: translate3d(0, 90px, 0);
    -moz-transform: translate3d(0, 90px, 0);
    -webkit-transform: translate3d(0, 90px, 0);
}

.folioItem02 .folioContent .cat:before {
    display: none;
}

.folioItem02 .folioContent h3 {
    visibility: hidden;
    opacity: 0;
    font-size: 24px;
    line-height: 28px;
    font-weight: 600;
    margin: 0;
    -webkit-transition: transform 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 400ms, visibility ease 300ms, background ease 300ms, color ease 300ms;
    -moz-transition: transform 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 400ms, visibility ease 300ms, background ease 300ms, color ease 300ms;
    transition: transform 500ms cubic-bezier(0.445, 0.05, 0.55, 0.95), opacity ease 400ms, visibility ease 300ms, background ease 300ms, color ease 300ms;
    transform: translate3d(0, 90px, 0);
    -moz-transform: translate3d(0, 90px, 0);
    -webkit-transform: translate3d(0, 90px, 0);
}

.folioItem02 .folioContent h3 a:hover,
.folioItem02 .folioContent .cat:hover {
    color: #1a1a1a;
}

.folioItem02:hover .folioContent h3,
.folioItem02:hover .folioContent .cat {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
}

.shaff_size {
    z-index: -1;
}





.portfolioSection02 .secTitle {
    font-size: 36px;
    line-height: 48px;
}


.portfolioSection02 {
    position: relative;
    padding: 60px 0 90px;
    background: #fcfcfc;
}

.portfolioSection02 .secTitle {
    font-size: 55px;
}


.qu_btn {
    position: relative;
    z-index: 2;
    overflow: hidden;
    height: 60px;
    border: none;
    background: var(--btn_color);
    border-radius: 50px;
    padding: 0 36px;
    text-align: center;
    display: inline-block;
    font-size: 16px;
    text-transform: capitalize;
    color: #fff;
    font-weight: 700;
    line-height: 60px;
    transition-delay: 0s, 0s;
    transition-duration: 0.4s, 0.4s;
    transition-property: border-color, color;
    transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
    vertical-align: middle;
}


.serviceSection03 .btMr {
    top: auto;
    bottom: 45px;
}


/*-- Marquee --*/
.marqueeText {
    position: absolute;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
    /* top: 61px; */
    width: 100%;
    overflow: hidden;
}

.marqueeText h2 {
    font-size: 60px;
    line-height: 120px;
    text-transform: capitalize;
    color: rgba(237, 27, 36, .08);
}

.stokeText h2 {
    color: var(--header);
    /* -webkit-text-stroke: 2px rgba(237, 27, 36, .09); */
    /* -webkit-text-stroke: 2px var(--theme); */
}

.runRight h2 {
    -moz-animation: example1 15s linear infinite;
    -webkit-animation: example1 15s linear infinite;
    animation: example1 15s linear infinite;
}

.runLeft h2 {
    -moz-animation: example2 15s linear infinite;
    -webkit-animation: example2 15s linear infinite;
    animation: example2 15s linear infinite;
}

@-moz-keyframes example1 {
    0% {
        -moz-transform: translateX(100%);
    }

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

@-webkit-keyframes example1 {
    0% {
        -webkit-transform: translateX(100%);
    }

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

@keyframes example1 {
    0% {
        -moz-transform: translateX(100%);
        -webkit-transform: translateX(100%);
        transform: translateX(100%);
    }

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

@-moz-keyframes example2 {
    0% {
        -moz-transform: translateX(-100%);
    }

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

@-webkit-keyframes example2 {
    0% {
        -webkit-transform: translateX(-100%);
    }

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

@keyframes example2 {
    0% {
        -moz-transform: translateX(-100%);
        -webkit-transform: translateX(-100%);
        transform: translateX(-100%);
    }

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




/* countdown */
.countdown-container {
    background-color: var(--btn_color);
    color: white;
    padding: 20px;
    border-radius: 12px;
    text-align: center;
    margin-bottom: 30px;
}

.countdown-number {
    font-size: 2.5rem;
    font-weight: bold;
}

/* popup */
.summer-popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease-in-out;
}

.summer-popup-overlay.show {
    opacity: 1;
    visibility: visible;
}

.summer-popup {
    background: white;
    width: 90%;
    max-width: 500px;
    border-radius: 20px;
    position: relative;
    overflow: hidden;
    transform: scale(0.8);
    transition: transform 0.3s ease-in-out;
}

.summer-popup-overlay.show .summer-popup {
    transform: scale(1);
}

.summer-popup-close {
    position: absolute;
    top: 15px;
    right: 15px;
    background: white;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 10;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.summer-popup-header {
    background: linear-gradient(135deg, var(--theme), var(--btn_color));
    padding: 20px;
    color: white;
    text-align: center;
}

.summer-popup-body {
    padding: 30px;
    text-align: center;
}

.summer-icon {
    display: inline-block;
    margin-bottom: 15px;
}

.summer-popup-footer {
    padding: 0 30px 30px;
    text-align: center;
}

.offer-code {
    background: #f1f5f9;
    padding: 12px;
    border-radius: 6px;
    font-size: 18px;
    font-weight: bold;
    letter-spacing: 2px;
    display: inline-block;
    margin: 15px 0;
}

.popup-sun {
    position: absolute;
    top: -30px;
    right: -30px;
    width: 80px;
    height: 80px;
    /* background-color: #FFF176; */
    background: var(--header);
    border-radius: 50%;
    z-index: 1;
}

.popup-wave {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 15px;
    background: var(--header);
    opacity: 0.3;
}

/* Popup Countdown Styles */
.popup-countdown {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin: 15px 0;
}

.popup-countdown-item {
    background-color: rgba(255, 150, 66, 0.1);
    border-radius: 8px;
    padding: 10px 5px;
    min-width: 60px;
    text-align: center;
}

.popup-countdown-number {
    font-size: 1.5rem;
    font-weight: bold;
    color: var(--primary);
    display: block;
}

.popup-countdown-label {
    font-size: 0.8rem;
    color: #666;
    text-transform: uppercase;
}








.course-card {
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
    margin-bottom: 20px;
}

.course-card:hover {
    transform: translateY(-5px);
}

.card-header {
    background: var(--btn_color);
    color: white;
    font-weight: bold;
    text-align: center;
    padding: 15px;
}



.highlight {
    background-color: rgba(232, 62, 140, 0.1);
    border-left: 4px solid var(--btn_color);
    padding: 15px;
    margin-bottom: 15px;
}


.bundle-ribbon {
    background: var(--header);
    color: white;
    transform: rotate(-45deg);
    padding: 5px 40px;
    position: absolute;
    top: 25px;
    left: -40px;
    font-weight: bold;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.2);
}












/* result card slide  */
.carousel-container {
    max-width: 1000px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    background-color: white;
}

.carousel-item {
    height: 500px;
}

.image-container {
    height: 100%;
    padding: 10px;
}

.result-image {
    height: 100%;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
}

.result-image img {
    object-fit: cover;
    height: 100%;
    width: 100%;
    border: 10px groove var(--btn_color);

}

.carousel-item .row {
    height: 100%;
    margin: 0;
}

.carousel-control-prev,
.carousel-control-next {
    width: 5%;

}

.carousel-indicators {
    margin-bottom: 0;
    position: relative;
    margin-top: 10px;
}





















.gallery-item {
    margin-bottom: 30px;
    transition: transform 0.3s ease;
    overflow: hidden;
    border-radius: 8px;
    /* box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); */
}

.gallery-item:hover {
    transform: translateY(-5px);
}

.gallery-item img {
    /* width: 100%; */
    height: 400px;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.gallery-item:hover img {
    transform: scale(1.05);
}

.gallery-content {
    padding: 15px;
    background-color: white;
}

.gallery-content h4 {
    margin-top: 0;
    font-size: 18px;
    color: #333;
}

.gallery-content p {
    color: #666;
    font-size: 14px;
    margin-bottom: 0;
}

@media (max-width: 768px) {
    .title-anim {
        font-size: 28px;
    }

    .filter-menu {
        justify-content: center;
    }
}







/* Fixed position at bottom right */
.cta-button-container {
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 1000;
}

.glow-button {
    padding: 15px 28px;
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    border: none;
    border-radius: 50px;
    background: linear-gradient(135deg, #ff416c, #ff4b2b);
    color: white;
    box-shadow: 0 10px 20px rgba(255, 75, 43, 0.4);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

/* Pulsating glow effect */
@keyframes pulse-glow {
    0% {
        box-shadow: 0 10px 20px rgba(255, 75, 43, 0.4);
    }

    50% {
        box-shadow: 0 15px 30px rgba(255, 75, 43, 0.7), 0 0 20px rgba(255, 65, 108, 0.5);
    }

    100% {
        box-shadow: 0 10px 20px rgba(255, 75, 43, 0.4);
    }
}

/* Shake animation */
@keyframes shake-animation {

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

    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translateX(-4px);
    }

    20%,
    40%,
    60%,
    80% {
        transform: translateX(4px);
    }
}

/* Rising animation */
@keyframes float-animation {

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

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

/* Ripple effect */
@keyframes ripple {
    0% {
        transform: scale(0);
        opacity: 1;
    }

    100% {
        transform: scale(4);
        opacity: 0;
    }
}

.glow-button::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50px;
    transform: scale(0);
    animation: ripple 3s infinite;
}

.glow-button::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50px;
    transform: scale(0);
    animation: ripple 3s infinite 1.5s;
}

/* Apply animations */
.animate-button {
    animation: pulse-glow 2s infinite, shake-animation 5s infinite 2s, float-animation 4s ease-in-out infinite;
}

.glow-button:hover {
    animation-play-state: paused;
    transform: scale(1.1);
    background: linear-gradient(135deg, var(--btn_color), #ff2b63);
    box-shadow: 0 15px 30px rgba(255, 75, 43, 0.7);
}

.glow-button i {
    margin-right: 8px;
}

/* Limited time badge */
.time-badge {
    position: absolute;
    top: -15px;
    right: -15px;
    background: #ffcc00;
    color: #333;
    font-size: 0.7rem;
    font-weight: bold;
    padding: 5px 10px;
    border-radius: 20px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
    animation: pulse-animation 1.5s infinite;
}

@keyframes pulse-animation {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}








.summer-offer-btn {
    position: fixed;
    right: -100px;
    top: 50%;
    transform: translateY(-50%) rotate(-90deg);
    z-index: 1050;
    transition: right 0.3s ease;
}



.summer-offer-btn .btn {
    border-radius: 0 0 10px 10px;
    background-color: var(--btn_color);
    color: var(--white);
}

@media (max-width: 768px) {
    .summer-offer-btn {
        display: none;
    }
}