header .content-container {
    max-width: 1280px;
    margin: auto;
    width: 100%;
    height: 100%;
    padding: 20px;
    display: grid;
    gap: 2em;
}

header #logo-container {
    display: grid;
    gap: 2em;
    place-content: center;
    place-items: center;
}

header #logo-container a {
    display: block;
    height: 100%;
    width: fit-content;
    margin: auto;
}

header .bg-image {
    min-height: 470px;
}

header .bg-image.header-small {
    min-height: 195px;
    place-content: center;
}

header ul {
    display: flex;
    flex-flow: row;
    justify-content: center;
    align-items: center;
    gap: 96px;
}

header a {
    font-family: "Lato", sans-serif;
}

header ul li a {
    text-transform: uppercase;
    font-size: 13px;
    text-decoration: none;
    padding: 5px 10px;
    border-radius: 3em;
    width: 178px !important;
    color: var(--white);
    border: solid 1px var(--white);
    font-weight: 400;
}

header ul li.current-menu-item a {
    background-color: var(--white);
    color: var(--black);
    font-weight: 900;
}

header .header-content a:not(a:has(>img)) {
    display: block;
    font-family: "Lato", sans-serif;
    font-size: 21px;
    font-weight: 700;
    color: var(--black);
    text-transform: uppercase;
    background-color: var(--yellow);
    text-decoration: none;
    width: fit-content;
    padding: 5px 70px;
    border-radius: 3em;
    margin: auto;
}

header .header-content.text-center {
    display: grid;
    gap: 25px;
}

header .header-content h2 {
    font-size: 35px;
    font-weight: 900;
    margin: 0;
    color: var(--white);
}

header .header-content .content {
    line-height: 1;
}

header .header-content .content p {
    color: var(--white);
    font-size: 28.5px;
    line-height: 1;
    margin: 0;
}

header .header-content a:has(>img) {
    display: flex;
    justify-content: center;
    align-items: center;
}

header .header-content img {
    display: block;
    margin: auto;
}

div.hr {
    height: 10px;
    width: 100%;
    background-color: var(--yellow);
    max-width: 324px;
    margin: auto;
}


@media(max-width: 890px) {
    #menu-main_menu {
        display: none;
    }

    #menu-toggle {
        display: flex;
        flex-flow: column;
        gap: 4px;
        position: absolute;
        right: 2em;
        top: 2em;
        z-index: 99999;
    }

    .menu-bar {
        width: 30px;
        height: 3px;
        background: var(--white);
        transition: transform 0.3s ease, opacity 0.3s ease;
    }

    body.open #menu-toggle .menu-bar:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }

    body.open #menu-toggle .menu-bar:nth-child(2) {
        opacity: 0;
    }

    body.open #menu-toggle .menu-bar:nth-child(3) {
        transform: translateY(-6px) rotate(-45deg);
    }

    body.open {
        position: fixed;
    }

    body.open header .main_menu-container .menu-main_menu-container {
        background-color: rgba(72, 72, 72 , 0.95);
        height: 100vh;
        width: 100%;
        z-index: 2;
        position: absolute;
        top: 0;
        left: 0;
        display: grid;
        place-content: center;
        place-items: start center;
        padding-top: 0em;
    }

    body.open #menu-main_menu {
        display: flex;
        position: absolute;
        flex-flow: column;
        padding-top: 8em;
        gap: 2em;
    }
    
    body.open header #logo-container a {
        position: relative;
        z-index: 9999;
    }

    body.open #menu-main_menu li {
        position: relative;
        z-index: 9999;
    }
}

@media(max-width: 580px) {

    header .header-content .content {
        text-wrap: balance;
    }

}