.popup-5-image-control {

    display: flex;
    flex-direction: column;
    width: 100%;

}

.popup-5-image-grid {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}

.popup-5-image-grid-1 {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 8px;
    margin-top: 8px;
    
}

.popup-5-image-start {
    width: 100%;
    height: auto;
    object-fit: contain;
}
.popup-5-image-start:hover{
    transform: none;
}
.popup-5-img-in-grid{
    width: 100%;
    height: 300px; /* maintain aspect ratio */
    object-fit: cover;
}
.popup-5-img-in-grid-70{
    width: 100%;
    height: 300px; /* maintain aspect ratio */
    object-fit: cover;
}

.popup-5-img-in-grid-70-border{
    width: 70%;
    height: 300px; /* maintain aspect ratio */
    overflow: hidden;
}


.popup-5-img-in-grid-30{
    width: 100%;
    height: 300px; /* maintain aspect ratio */
    object-fit: cover;
}
.popup-5-img-in-grid-30-border{
    width: 30%;
    height: 300px; /* maintain aspect ratio */
    overflow: hidden;
}



.popup-5-image-3 {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.popup-5-image-last-grid {
    display: flex;
    margin-top: 8px;
}

.popup-5-image-last-img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}


/* Extra large devices (large desktops, 1400px and up) */
@media (max-width: 1400px) {
    .main-control {}
}

/* Large devices (laptops/desktops, 1200px and up) */
@media (max-width: 1200px) {
    .main-control {}
}


/* Medium devices (small laptops, 992px and up) */
@media (max-width: 992px) {
    


}
@media (max-width: 768px) {

    .popup-5-img-in-grid-30-border {
        height: 200px;
        width: 30%;
    }
    .popup-5-img-in-grid-70-border {
        height: 200px;
        width: 70%;
    }

    .popup-5-img-in-grid{
        height: 200px;
    }
   
}