
/*project logo for porject pages*/
/* Container for the logo */
.project-logo-container {
    display: flex;
    justify-content: center; /* Horizontally center the logo */
    align-items: center; /* Vertically center the logo (optional) */
    width: 100%;
    padding: 0; /* Remove any padding */
    margin: 0 auto; /* Ensure the container itself is centered */
}

/* Logo styling */
.project-logo {
    max-width: 100%; /* Ensure the logo scales correctly */
    height: auto; /* Maintain the logo's aspect ratio */
    display: block; /* Ensure the logo is treated as a block element to avoid whitespace issues */
}

/* Mobile-specific styling */
@media only screen and (max-width: 768px) {
    .project-logo-container {
        width: 100%; /* Full width on mobile devices */
        padding: 0; /* No padding to avoid shifting */
        margin: 0 auto; /* Center the container itself */
    }

    .project-logo {
        max-width: 100%; /* Full responsive width for the logo */
        height: auto; /* Maintain aspect ratio */
        margin-left:0px;
    }
}



/*mobile view galary*/
  
    /* Default styles for desktop and tablet */
.gallery-images {
    display: flex;
    flex-wrap: wrap;
    gap: 10px; /* Space between images */
    justify-content: center; /* Center the images horizontally */
    
}

.gallery-images img {
    width: 200px;
    height: 180px;
    object-fit: cover; /* Ensure the image covers its container without distortion */
    cursor: pointer;
}

/* Mobile-specific styles */
@media only screen and (max-width: 768px) {
    .gallery-images {
        display: flex;
        flex-wrap: wrap;
        gap: 10px; /* Keep space between images */
        justify-content: center; /* Center the images */
        width:161%;
    }

    .gallery-images img {
        width: calc(50% - 10px); /* Two images per row with some space in between */
        height: auto; /* Maintain aspect ratio */
        margin-bottom: 10px; /* Space between rows */
        object-fit: cover; /* Ensure the image fills its container without distortion */
    }
}



















