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

    * {
        margin: 0;
        padding: 0;
        font-family: "Montserrat", sans-serif;
        font-optical-sizing: auto;
        font-style: normal;
        box-sizing: border-box;
    }

    html{
        scroll-behavior: smooth;
    }

    body {
        margin: 0;
        padding: 0;
    }

    .navbar {
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: transparent;
    }

    .brand-logo>img {
        width: 25%;
        margin: .5rem 0 0 2rem;
    }

    .navbar-links ul {
        margin: 0;
        padding: 0;
        display: flex;
    }

    .navbar-links li {
        list-style: none;
    }

    .navbar-links li a {
        text-decoration: none;
        font-weight: 450;
        padding: 1rem;
        display: block;
        color: #0d0d0d;
    }

    .navbar-links a:hover {
        color: #212121;
    }

    .toggle-button {
        position: absolute;
        top: 1.5rem;
        right: 1rem;
        display: none;
        flex-direction: column;
        justify-content: space-between;
        width: 31px;
        height: 21px;
        align-items: center;
    }

    .toggle-button .bar {
        height: 3px;
        width: 100%;
        background-color: #0d0d0d;
        border-radius: 10px;
    }

    #background-image {
        background-image: url("../images/escola_bg.png");
        height: 100vh;
        background-attachment: fixed;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        background-color: #0d0d0d;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .information {
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: row;
        margin: auto;
        padding: 2rem;
    }

    .about {
        display: flex;
        flex-direction: column;
        padding: 2rem;
    }

    .about p {
        padding: 1rem 0;
    }

    .more-info-button {
        margin-top: 10px;
        text-align: center;
        border: #c3b11e 1.75px solid;
        /*color: #0d0d0d;*/
        padding: 10px;
        font-weight: 450;
        text-decoration: none;
        background-color: #c3b11e;
        color: #f8f8f8;

    }

    .more-info-button:hover {
        background-color: #c3b11e;
        color: #f8f8f8;
        transition: .3s;
    }

    .info-cards {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 2rem;
        padding: 4rem;
    }

    .card {
        background-color: #f8f8f8;
        border-radius: 5px;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.1);
        overflow: hidden;
        transition: transform .3s ease, box-shadow .3s ease;
        max-width: 20vw;
        text-align: center;
    }

    .card>img {
        width: 100%;
    }

    .card>h1 {
        font-weight: 600;
        padding: .25rem;
        font-size: 1.5rem;
    }

    .card>hr {
        max-width: 50%;
        margin: .2rem auto;
    }

    .card>p {
        padding: 0.5rem 2rem 1.25rem;
        text-align: left;
    }

    .cta-contact {
        background-image: url("../images/fundo-cta-contato.png");
        width: 100%;
        height: 45vh;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        background-color: transparent;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .cta-link {
        background-color: #338045;
        border-radius: 10px;
        padding: 1rem;
        font-size: 1.2rem;
        color: #f8f8f8;
        font-weight: 400;
        text-decoration: none;
    }

    .cta-link i {
        color: #55bb6c;
        font-weight: bold;
    }

    .news {
        display: flex;
        flex-direction: column;
        padding: 2rem;
    }

    .news-posts {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
    }

    .news .bigger {
        padding: 1rem;
        width: 50%;
    }

    .news .smaller-posts {
        display: flex;
        flex-direction: column;
        width: 25%;
        padding: 1rem;
        gap: 20px;
    }

    footer{
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #212121;
    }

    footer img{
        width: 10%;
        padding: 1rem;
    }

    .footer-info{
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .footer-info a{
        text-decoration: none;
        font-size: 1.75rem;
        color: #f8f8f8;
        padding: .5rem;
    }

    .footer-links{
        padding-right: 2rem;
    }

    .footer-location{
        color: #f8f8f8;
        padding: .7rem;
        display: flex;
        align-items: center;
    }

    .footer-location i{
        font-size: 1.25rem;
        padding: 0 .75rem 0 0;
    }


    @media only screen and (max-width: 600px) {

        .toggle-button {
            display: flex;
        }

        .navbar-links {
            display: none;
            width: 100%;
        }

        .navbar {
            flex-direction: column;
            align-items: flex-start;
        }

        .brand-logo img {
            width: 15%;
        }

        .navbar-links ul {
            flex-direction: column;
            width: 100%;
        }

        .navbar-links li {
            text-align: center;
        }

        .navbar-links li a {
            padding: .5rem 1rem;
        }

        .navbar-links.active {
            display: flex;
            transition: 1s;
        }

        .information {
            flex-direction: column;
        }

        .about {
            width: 100vw;
            padding: 1.25rem;
        }

        .card {
            width: 85vw;
            max-width: 85vw;
        }

        .info-cards {
            flex-direction: column;
            padding: 2rem;
        }

        .news {
            flex-direction: column;
            align-items: center;
            padding: 2rem;
            width: 100%;
        }

        .news h1 {
            text-align: center;
            margin-bottom: 1rem;
        }

        .news-posts {
            flex-direction: column;
            align-items: center;
            margin: auto;
        }

        .news .bigger {
            width: 100%;
        }

        .news .smaller-posts {
            width: 80%;
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 10px;
        }

        .news .smaller-posts img {
            width: 100%;
            padding: 0;
        }

        footer{
            flex-direction: column;
        }

        footer img{
            width: 50%;
        }

        .footer-links{
            text-align: center;
        }

        .footer-location{
            text-align: center;
            gap: .5rem;
        }

        .footer-location i{
            display: none;
        }
    }