/* General gallery styling for various gallery types */
.gallery,
.gallery2,
.gallery3,
.gallery-programming,
.gallery-music {
    position: relative;
    z-index: 10;
    width: 100%;
    max-width: 1550px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding: 0;
    margin: 40px auto;
    user-select: none;
    transition: transform 0.5s ease;
    justify-content: center;
}

/* Anchor tag styling inside galleries */
.gallery a,
.gallery2 a,
.gallery3 a,
.gallery-programming a,
.gallery-music a {
    flex-shrink: 0;
    width: calc(33.33% - 60px);
    margin: 30px;
    margin-bottom: -30px;
    text-align: center;
    display: inline-block;
    position: relative;
}

/* Specific margin adjustment for gallery2 */
.gallery2 {
    margin-top: 0;
}

/* Image styling within galleries */
.gallery img,
.gallery2 img,
.gallery3 img,
.gallery-programming img,
.gallery-music img {
    width: 100%;
    border-radius: 8px;
    transition: transform 0.3s, box-shadow 0.3s, z-index 0.3s;
    object-fit: cover;
    z-index: 1;
}

/* Hover effect on gallery images */
.gallery img:hover,
.gallery2 img:hover,
.gallery3 img:hover,
.gallery-programming img:hover,
.gallery-music img:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    z-index: 1120;
}

/* Wrapper for galleries */
.gallery-wrapper {
    overflow: visible;
    position: relative;
    height: auto;
}

/* -----------------------------Responsive Design----------------------------- */

/* Responsive styling for mobile screens (max width: 768px) */
@media (max-width: 768px) {
    .gallery a,
    .gallery2 a,
    .gallery3 a,
    .gallery-programming a,
    .gallery-music a {
        width: calc(50% - 40px);
    }

    .gallery,
    .gallery-programming,
    .gallery-music {
        margin-top: 0;
    }
}

/* Responsive styling for extra small screens (max width: 480px) */
@media (max-width: 480px) {
    .gallery a,
    .gallery2 a,
    .gallery3 a,
    .gallery-programming a,
    .gallery-music a {
        width: calc(100% - 30px);
    }
}