body {
    background: linear-gradient(to right, #87ee33, #f2ac55);
}
body {
   
}



/* .my-divider{
    height: 3px;
    background:linear-gradient(to right, #01fb5cfd, #f97501) !important;
} */
.content {
    padding-top: 80px;
    /* Adjust this value as needed to match your header's height */
}

.top-nav {
    background: linear-gradient(to right, #03cb0a, #f67c30);
    height: 35px;
}

.bottom-nav {
    background: linear-gradient(to right, #04fd10, #f98d34);
}

.fixed-top {
    position: fixed !important;
    top: 0 !important;
}

.top-nav a img.icon {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}


.navbar-brand {
    width: 70px;
    height: 70px;
    top: 4px;
    left: 7px;
    background-color: #f8e6cf;
    border-radius: 50% !important;
}

.navbar-brand img {
    width: 70px;
}

.navbar-nav .nav-item .nav-link {
    font-weight: bolder !important;
}

/* .dropdown-submenu {
    position: relative;
}

.dropdown-submenu .dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    display: none;
}

.dropdown-submenu:hover .dropdown-menu {
    display: block;
} */

#myslider .carousel-item img {
    max-height: 82.5vh !important;
}

.text-justify {
    text-align: justify;
}

#testimonial-carousel .user-image img {
    width: 200px;
    height: 200px;

    border-radius: 3%;
    /* mix-blend-mode: color-burn; */
}

#teampic .card img {
    transition: 0.5s all ease;
}

#teampic .card img:hover {
    transform: scale(1.04);
}

#training .card {
    transition: 0.5s all ease;
}

#training .card:hover {
    transform: scale(1.04);
}

#videos img {

    transition: 0.5s all ease;
}

#videos img:hover {
    transform: scale(1.04);
    filter: none;
}

#about .icon {
    width: 30px;
    height: 30px;
    /* background: white; */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;

}

#about .icon img {
    width: 25px;
    height: 25px;
}

#contact-form .card {
    background: linear-gradient(to right, #36d26ffd, #ff9940);
}

.btn-gradient {
    background: linear-gradient(to right, #4bdd80, #f7933d) !important;
}

#contact-form .btn-send {
    background: linear-gradient(to right, #71ed4e, #f8a806) !important;
}

#footer-top {
    background: linear-gradient(to right, #39ff16fd, #fc9b2c);
}

#bottom-footer {
    background: linear-gradient(to right, #03cb0a, #ff6301);
}

#bottom-footer .navbar-brand {
    width: 70px;
    height: 70px;
    background-color: #f8e6cf;
    border-radius: 50% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden; /* Ensures image does not overflow */
    margin-right: 10px;
}

#bottom-footer .navbar-brand img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Ensures logo fits inside circle */
}


#bottom-footer .social a img.icon {
    width: 25px;
    height: 25px;
}

.mydropdown {
    background: linear-gradient(to right, #9df2b4d7, #e59d76);
}

.mydropdown-submenu {
    background: linear-gradient(to right, #bcf6ce, #fcd7aa);
}

.mydropdown .dropdown-item:hover {
    background: linear-gradient(to right, #72e69c, #eeb17b);
}

/* Women's Team dropdown menu */
.dropdown-submenu[data-target="women"] > .dropdown-menu {
    background: linear-gradient(to right, #65f48bd7, #f79b69); /* pink shade */
}

.dropdown-submenu[data-target="women"] .dropdown-item:hover {
    background: linear-gradient(to right, #77e895d7, #ee9a6c);
}

/* Men's Team dropdown menu */
.dropdown-submenu[data-target="men"] > .dropdown-menu {
    background: linear-gradient(to right, #65f48bd7, #f79b69); /* blue shade */
}

.dropdown-submenu[data-target="men"] .dropdown-item:hover {
    background: linear-gradient(to right, #65f48bd7, #f79b69);
}


#admin .card {
    background: linear-gradient(to right, #36d26ffd, #ff9940);
}


.custom-btn {
    background: linear-gradient(to right, #71ed4e, #f8a806) !important;
    color: rgb(11, 11, 11) !important;
    /* border: 2px solid black */
}

.custom-btn:hover {
    background-color: #da4109 !important;
    /* Hover effect */
}


#testimonial-carousel .testimonial-card {
    background: linear-gradient(to right, #56fa5bfd, #f7ac81);
    color: #fff;
    border: none;
}

#testimonial-carousel .testimonial-card .card-title {
    color: #080808;
    font-weight: bold;
}
/* By default hide arrows */
#testimonial-carousel .splide__arrow {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease;
}
/* On hover show arrows */
#testimonial-carousel:hover .splide__arrow {
    opacity: 1;
    visibility: visible;
}
#testimonial-carousel .testimonial-card .p {
    color: #050505;
}

#training .training-card {
    background: linear-gradient(to right, #8cfb90fd, #f9cb97);
    color: #090909;
}

#training .training-card .card-title {
    font-weight: bold;
}

#training .training-card .card-body {
    background: linear-gradient(to right, #8cfb90fd, #f9cb97);
    
}


.squad-active-line {
    position: relative;
    padding-bottom: 3px; /* Add some space between the text and the line */
}

.squad-active-line::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background-color: var(--bs-primary, #0d6efd); /* Uses Bootstrap's primary color variable */
}


 .card .card-body { /* Targeting the card-body directly inside any .card of players  */
        background: linear-gradient(to right, #8cfb90fd, #f9cb97);
        text-align: center; /* You can adjust this if you want left-aligned text */
        color: #333; /* Ensuring text color is visible on the gradient */
        /* border-radius: 10%; */
    }

    /* Hover effect for the image inside the card */
    .card img {
        transition: transform 0.3s ease-in-out;
    }

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

    /* To ensure image doesn't overflow during zoom */
    .card {
        overflow: hidden; /* Important for the image zoom effect to not break out of the card */
       /* Optional: Rounds the corners of the card */
    }


.form-control {
    background: linear-gradient(to right, #ddf6e3d7, #f9e9a3);
    transition: all 0.3s ease;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    border: none;
}




/* Gradient Text Class */
.gradient-text {
    background: linear-gradient(to right, rgb(0, 100, 0), rgb(179, 60, 0));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text; /* for Firefox */
    font-weight: bold;
}
.gradient-text {
    background:  linear-gradient(to right, #016d08, #a74000);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text; /* for Firefox */
    font-weight: bold;
}

.gradient-line {
    width: 150px;              /* line ki lambai */
    height: 4px;               /* line ki motai */
    margin: 10px auto;         /* center me lane ke liye */
    border-radius: 6px;        /* thoda rounded edges */
    background: linear-gradient(to right, green, rgb(255, 60, 0));
}