.container {
    max-width: 90%;
    padding:0px;
    border-radius: 12px;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.459);
  
}

h2 {
    color: #333;
    font-weight: 600;
    margin-bottom: 30px;
}

.carousel-wrapper {
    overflow: hidden;
    width: 100%;
    position: relative;
}

.carousel-track {
    display: flex;
    gap: 20px;
    animation: scroll 7s linear infinite;
    animation-play-state: running; /* default running */
}

/* pause scrolling when hovered */
.carousel-wrapper:hover .carousel-track {
    animation-play-state: paused;
}

.image-item {
    flex: 0 0 25%; /* Adjust percentage as needed for items to show */
    display: flex;
    justify-content: center;
    align-items: center;
}

.gallery-image {
    height: 80px;
    object-fit: contain;
    border-radius: 8px;
    border: 1px solid #ddd;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    cursor: pointer;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

    .gallery-image:hover {
        transform: scale(1.05);
        box-shadow: 0 6px 14px rgba(0, 0, 0, 0.212);
    }

    .profile-card {
     
      height: 27rem;
    }
    .profile-img-container img {
      width: 130px;
      height: 130px;
      object-fit: cover;
      border: 3px solid gray;
      box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    }
    .profile-link {
      display: block;
      margin-top: 8px;
      color: #0d6efd;
      text-decoration: none;
    }
    .profile-link:hover {
      text-decoration: underline;
    }
    .socialmedia {
      border-radius: 50%;
    }

.carousel-wrapper {
    padding-top: 1.5rem !important; /* pt-4 */
    padding-bottom: 3rem !important; /* pb-5 */

    padding-left: 1.5rem !important; /* ps-4 */
    padding-right: 1.5rem !important; /* pe-4 */

    margin-left: 3rem !important; /* ms-5 */
    margin-right: 3rem !important;
    /
} 
.footerContainer {
    padding-left: 4rem !important;
    padding-right: 4rem !important;
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
}
    /* continuous scroll keyframes */
    @keyframes scroll {
        0% {
            transform: translateX(0);
        }

        100% {
            transform: translateX(-50%);
        }
    }
    /*
@media (max-width: 768px) {
    .gallery-image {
        height: 60px;
    }
}*/
    @media (max-width: 768px) {
        .gallery-image {
            height: 25px;
        }

        .carousel-track {
            display: flex;
            /* Use CSS custom property to calculate the width */
            width: calc(10% + (var(--items-to-show) * 30px));
            /* 200% for 2 sets, and account for gap */
            gap: 2px;
            animation: scroll 2s linear infinite;
            /* Increased duration for smoother scroll */
            animation-play-state: running;
        }

        .container {
            max-width: 100%;
            padding: 10px;
            border-radius: 12px;
            box-shadow: 0 8px 16px rgba(0, 0, 0, 0.459);
            text-align: left;
        }

        .footerContainer {
            padding: 0px !important;
            margin: 0px !important;
        }
        .image-item {
            flex: 0 0 25% !important; /* Adjust percentage as needed for items to show */
            display: flex !important;
            justify-content: center !important;
            align-items: center !important;
        }
        .carousel-wrapper{
            padding : 0px !important;
        }

        .carousel-track {
            display: flex;
            gap: 20px;
            animation: scroll 7s linear infinite;
            animation-play-state: running; /* default running */
        }
    }