.img {
    width: 300px;
    height: 400px;
    max-width: 300px;
    min-width: 150px;
    max-height: 400px;
    min-height: 200px;
    background-repeat: no-repeat;
    background-size: cover;
    display: inline-block;
}

.content {
    max-width: 90vw;
}

.latnivalok li a {
    font-size: 2em;
}

.img1 {
    background-image: url(/galeria/img/latnivalok/erdobenye.jpg);
}

.img2 {
    background-image: url(/galeria/img/latnivalok/zemplenkalandpark.jpg);
}

.img3 {
    background-image: url(/galeria/img/latnivalok/rakoczimuzeum.jpg);
}

.img4 {
    background-image: url(/galeria/img/latnivalok/megyerhegy.jpg);
}

.img5 {
    background-image: url(/galeria/img/latnivalok/tokaj.jpg);
}

.img6 {
    background-image: url(/galeria/img/latnivalok/nyelvmuzeum.jpg);
}

.img7 {
    background-image: url(/galeria/img/latnivalok/kisvasut.jpg);
}

.img8 {
    background-image: url(/galeria/img/latnivalok/boldogkovara.jpg);
}

.latnivalok {
    list-style: none;
}

.latnivalok li {
    position: relative;
    margin-bottom: 20px;
}

.latnivalok li a {
    position: absolute;
    margin-left: 10px;
}

@media only screen and (max-width: 959px) {
    .latnivalok li {
        /* height: 400px; */
        /* width: 300px; */
        width: 100%;
        height: 400px;
    }

    .latnivalok li a {
        left: -10px;
        bottom: 0;
        width: 100%;
        background-color: rgba(0, 0, 0, 0.6);
    }
}

@media only screen and (max-width: 370px) {
    .latnivalok li {
        height: 40vh;
        width: 30vw;
    }

    .latnivalok li .img {
        height: 80vh;
        width: 60vw;
    }
}