.gallery, .gallery-item{
 border: solid 0px red;
}

.gallery {
    display: flex;
    flex-wrap: wrap;
}

.heading-container{
    background-color: #333;
    padding:1px 10px 3px 20px;
    border-radius: 3px;
    margin:2px 5px;
  }
.heading-container h1{
    font-size:20px;
    font-weight: normal;
    margin:0px;
    padding:0px;
  }


.gallery-item {
    width:14vw;
    padding: 5px;
    margin:5px;
    background-color: #171717;
}

.image-container{
    width: 100%;  /*200px; /* Set the desired width */
    height: 110px; /* Set the desired height */
    border: 1px solid #ccc;
    overflow: hidden; /* Ensure content does not overflow */
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 3px;
    /* margin:0px auto; */
}


.image-container img {
    position:relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.file-info-title{
    font-size: 15px;
    text-decoration: none;
    color:beige;
}

.file-info-title:hover{
    opacity: 0.8;
}

.view-screens{
    color:#0AAD9E;
    text-decoration: none;
}

.view-screens:hover{
    opacity: 0.8;
}


.next-page-btns-container{
    display:flex;
    justify-content: center;
    align-items: center;
    gap:15px;
    margin:15px auto;
}
.npage{
    text-decoration: none;
    color:white;
    border:none;
    border-radius: 4px;
    padding:5px 10px;
    margin:10px;
}
.npage:hover{
    opacity: 0.7;
}
.next-page{
    background-color: #5DA93C;
}
.pre-page{
    background-color: grey;
}







/* ........................................ for Mobile ................................. */




@media only screen and (max-width: 700px){
.heading-container{
    background-color: #333;
    padding:1px 10px 3px 20px;
    border-radius: 3px;
    margin:10px 5px;
}

.gallery{
    display: flex;
    justify-content: center;
    align-items: flex-start;

    width:100%;
    overflow-x:hidden;
    padding:3px 0px;
    gap:1px;
}

.gallery-item {
    width:42vw;
    padding: 5px;
    margin:2px;
    background-color: #171717;
}

.image-container{
    border: 1px solid #ccc;
    overflow: hidden; /* Ensure content does not overflow */
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 3px;
    width: 100%;  /*200px; /* Set the desired width */
    height: 110px; /
}
    

}