/* TABLETS MAX */
@media (width <= 992px){

}

/* TABLES */
@media (width <= 768px){

}

/* SMARTPHONE */
@media (width <= 576px) {

    .content {
        width: calc(100% - 2rem);
    }

    section {

        &#home {
            & .content {
                flex-direction: column;
            }

            & .col-6,
            & .col-10 {
                width: 100%;
            }

            & .home-img {
                & picture {
                    width: 100%;
                }
            }
        }

        &#carrusel {
            & .grid {
                &.grid-column-4 {
                    grid-template-columns: repeat(2, 1fr);
                }
            }
        }

        &#services {
            & .grid {
                &.grid-column-3 {
                    grid-template-columns: repeat(1, 1fr);
                }
            }
        }
    }

    footer {
        & .footer-bottom {
            flex-direction: column;
        }
    }
}