@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        /* Banner */
        .main-banner img {
            width: 100%;
            height: auto;
        }

        /* Section spacing */
        .margin-section {
            margin: 56px 0;
        }

        /* Typography */
        .meet-olia {
            font-family: "Montserrat", sans-serif;
            width: 100%;
            padding: 0 16px;
        }

        .meet-olia h4 {
            font-size: 1.25rem;
            /* 20px */
            font-weight: 600;
            color: #640202;
            margin-bottom: 30px;
            text-align: left;
            max-width: 600px;
        }

        .meet-olia p {
            max-width: 600px;
            color: #432525;
            font-weight: 300;
            font-size: 1.5rem;
            /* 24px */
        }

        /* Containers */
        .main-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
            padding: 0 16px;
        }

        .olia-img-container {
            width: 100%;
            text-align: center;
        }

        .olia-img-container img {
            max-width: 100%;
            height: auto;
        }

        /* Images */
        .natural-radiance img {
            width: 100%;
            height: auto;
            text-align: center;
        }

        .olia-hand {
            display: flex;
            flex-wrap: wrap;
            /* allow wrapping on small screens */
            width: 100%;
            margin-top: -4px;
            justify-content: center;
        }

        .olia-hand img {
            width: 50%;
            max-width: 100%;
            height: auto;
        }

        .billboard-guav {
            width: 100%;
        }

        .billboard-guav img {
            width: 100%;
            height: auto;
        }

        /* Image containers */
        .main-image-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            width: 100%;
            padding: 0 16px;
        }

        .image-container-one,
        .image-container-two {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: center;
            width: 100%;
        }

        .image-container-one img,
        .image-container-two img {
            max-width: 100%;
            height: auto;
            margin: 12px;
        }

        /* Envelope */
        .olia-envelope {
            width: 100%;
            display: flex;
            flex-wrap: wrap;
        }

        .olia-envelope img {
            width: 100%;
            height: auto;
        }

        /* ------------------
   RESPONSIVE BREAKPOINTS
------------------ */

        /* Tablets */
        @media (max-width: 992px) {

            .meet-olia h4,
            .meet-olia p {
                width: 100%;
                text-align: center;
            }

            .olia-hand img {
                width: 100%;
            }

            .image-container-one,
            .image-container-two {
                flex-direction: column;
            }

            .image-container-one img,
            .image-container-two img {
                margin: 12px 0;
            }
        }

        /* Mobile */
        @media (max-width: 576px) {
            .meet-olia h4 {
                font-size: 1.125rem;
                /* ~18px */
            }

            .meet-olia p {
                font-size: 1rem;
                /* ~16px */
            }

            .olia-hand {
                flex-direction: column;
            }

            .olia-hand img {
                width: 100%;
            }
        }