/* ===============================
   TABLETS (1024px and below)
================================ */

@media screen and (max-width:1024px){

    .movies-menu-div{
        display:grid;
        grid-template-columns:repeat(2,1fr);
        gap:25px;
        justify-items:center;
        padding:20px;
    }

    .movies-menu-picture{
        width:220px;
        height:320px;
    }

    .grid-items{
        width:100%;
        max-width:250px;
        text-align:center;
    }

    .buy-tickets-btn{
        width:100%;
    }

}


/* ===============================
   MOBILE PHONES (768px and below)
================================ */

@media screen and (max-width:768px){

    .movies-menu-div{
        grid-template-columns: 1fr;
        justify-items: center;
        padding: 20px;
    }

    .grid-items{
        width: 100%;
        max-width: 300px;
        margin: 15px auto;
    }

    .movies-menu-picture{
        width: 90%;
        height: auto;
        margin: 15px auto;
        display: block;
    }

    .buy-tickets-btn{
        width: 90%;
        margin: 15px auto;
        display: block;
    }

    .movie-text{
        text-align: center;
    }
}


/* ===============================
   SMALL PHONES (480px and below)
================================ */

@media screen and (max-width:480px){

    .movies-menu-div{
        padding:15px;
        gap:15px;
    }

    .grid-items{
        max-width:260px;
    }

    .movie-text h1{
        font-size:26px;
    }

    .movie-text-color{
        font-size:18px;
    }

    .price-tag{
        font-size:16px;
    }

    .buy-tickets-btn{
        font-size:15px;
    }

}