@media (max-width: 900px) {

    nav ul li {

        display: block;

        margin: 10px 0;

        text-align: center;

    }



    .features {

        flex-direction: column;

    }



    .feature {

        width: 100%;

        margin-bottom: 30px;

    }

}



@media (max-width: 600px) {

    .hero-text h2 {

        font-size: 32px;

    }



    .hero-text p {

        font-size: 16px;

    }



    .hero {

        height: 400px;

    }

}





@media (max-width: 900px) {

    .attraction {

        width: 100%;

    }

}



@media (max-width: 900px) {

    .culture-item,
    .cuisine-item {

        width: 100%;

    }

}





@media (max-width: 900px) {

    .accommodation-item {

        width: 100%;

    }

}



@media (max-width: 600px) {

    .contact {

        padding: 20px;

    }



    .btn-submit {

        width: 100%;

    }

}