/* Desktop version */
@media (min-width: 1024px) {
    .site-logo a img {
        max-width: 500px; /* For larger screens */
    }
}

/* Tablet version */
@media (min-width: 768px) and (max-width: 1023px) {
    .site-logo a img {
        max-width: 400px; /* Slightly smaller logo for tablets */
    }
}

/* Mobile version */
@media (max-width: 767px) {
    .site-logo a img {
        max-width: 250px; /* Optimal size for most mobile devices */
    }
}

.single-banner {
    background-size: cover; /* Makes the image cover the container */
    background-position: center;
    background-repeat: no-repeat;
    width: calc(100% - 80px); /* Subtracts margin from the total width */
    height: 70vh; /* Adjusts to fill the viewport height */
    margin: 0 auto; /* Centers the slider horizontally */
    margin-left: 40px; /* Left margin */
    margin-right: 40px; /* Right margin */
    border-radius: 10px; /* Optional: Adds rounded corners for better appearance */
}

/* Media Queries for Smaller Screens */
@media (max-width: 1200px) {
    .single-banner {
        height: 70vh;
        margin-left: 15px;
        margin-right: 15px;
    }
}

@media (max-width: 768px) {
    .single-banner {
        height: 60vh;
        margin-left: 10px;
        margin-right: 10px;
    }
}

@media (max-width: 576px) {
    .single-banner {
        height: 50vh;
        margin-left: 5px;
        margin-right: 5px;
    }
}