.banner {
    background-color: #1c6835;
    background-image: url(/wp-content/themes/wp-bootstrap-starter-eri/inc/assets/images/banner-background.svg);
    background-position-x: center;
    background-position-y: bottom;
    background-size: cover;
    text-align: left;
}
    .banner.blue {
        background-image: url(/wp-content/themes/wp-bootstrap-starter-eri/inc/assets/images/banner-background-blue.svg);
    }

    .banner.blue-gradient {
        background: linear-gradient(283deg, #005A9E 0%, #155036 100%);
    }

    .banner.green-gradient {
        background: linear-gradient(179deg, #FFF 4.26%, #C2CFC7 136.59%);
        font-style: normal;
        font-family: Inter, sans-serif;
    }
        .banner.green-gradient h1, .banner.green-gradient h2 {
            font-weight: 700;
            padding: 0px;
            margin: 0px;
        }

        .banner.green-gradient h1 {
            color: #212121;
            font-size: 52px;
            line-height: 68px;
            letter-spacing: -1px;
            text-shadow: none;
        }

        .banner.green-gradient h2 {
            color: #155036;
            font-size: 32px;
            line-height: 40px;
        }

        .banner.green-gradient .page_subtitle {
            color: #424242;
            font-size: 20px;
            font-weight: 400;
            line-height: 32px;
        }

    .banner.green-triangles {
        background-image: url(/wp-content/themes/wp-bootstrap-starter-eri/inc/assets/images/banner-background-green-triangle.svg);
    }

    .banner h1, .banner h3, .banner .page_title {
        font-family: 'Roboto';
        font-weight: bold;
        color: #FFFFFF;
    }

    .banner h1, .banner .page_title {
        font-size: 55px;
        line-height: 70px;
        text-shadow: 0px 0px 8px #1C1C1C84;
        padding: 0px 0px 16px 0px;
        margin: 0px;
    }

    .banner .page_subtitle {
        color: #FFFFFF;
        font-size: 20px;
        line-height: 28px;
        margin-top: 0px;
    }
        .banner .page_subtitle a {
            color: #FFFFFF;
            text-decoration: underline;
            padding: 0px;
        }

@media (max-width: 576px) {
    .banner h1, .banner .page_title {
        font-size: 40px;
        line-height: 47px;
        text-shadow: 0px 0px 8px #1C1C1C84;
        padding: 0px 0px 8px 0px;
    }
    .banner.blue h1 {
        font-size: 32px;
        line-height: 40px;
        text-shadow: 0px 0px 8px #1C1C1C84;
        text-transform: uppercase;
    }
        .banner.blue .page_subtitle {
            font-size: 16px;
            line-height: 22px;
        }
}