.gallery-wrap {
    display: block;
    width: 100%;
}

.item {
    width: 100%;
    height: 40vh;
    background-position: center;
    background-size: cover;
    background-repeat: none;
    transition: flex 0.8s ease;
}

@media (min-width: 768px) {
    .gallery-wrap {
        display: flex;
        flex-direction: row;
        height: calc(80vh + 40px);
    }
    .item {
        flex: 1;
        height: 100%;
    }
}

.item:hover {
    flex: 7;
}