header {
    background-color: var(--color-secondary);
    padding: 20px;
    /* margin-bottom: 20px; */
}

.main-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;

}

.logo {
    display: flex;
    align-items: center;
}

.logo img {
    width: 100px;
}

.main-nav-links {
    display: none;
    position: absolute;
    top: calc(75.09px + 20px);
    width: 100%;
    left: 0;
    padding: var(--mb-std-pd);
    background-color: var(--color-white);
}

.page-nav-links {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
}

.page-nav-links a {
    font-weight: 600;
    letter-spacing: 1px;
    color: var(--color-secondary) !important;

}




.social-media-links {
    display: flex;
    flex-direction: row;
    width: 120px;
    justify-content: space-between;

}

.social-media-links img {
    height: 25px;
}


@media screen and (min-width:800px) {
    header nav {
        max-width: 1140px;
        margin: 0 auto;
    }

    .menu-bar {
        display: none;
    }

    .main-nav-links {
        position: static;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        background-color: transparent;

    }

    .page-nav-links {

        flex-direction: row;
        /* background-color: #fff; */
        width: 300px;
        justify-content: space-between;
        margin-bottom: 0;
    }

    .page-nav-links a {
     color: white !important;
    }

    .page-nav-links a:hover {
        color: var(--color-primary)
    }

    .social-media-links {

        margin-left: 50px;

    }

    .social-media-links a {
        display: flex;
        align-self: center;
    }
}