header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10vw;
    height: 7vw;
    z-index: 1;
    /* background-color: #3D3D3D; */
}
.nav-element {
    color: #3D3D3D;
    text-align: center;
    font-size: 1.7vw;
    font-weight: 300;
    text-decoration: none;
    transition: color 0.2s, letter-spacing 0.2s;
}

.nav-element.active { 
    font-weight: 500;
}

.nav-element:hover {
    letter-spacing: 0.03vw;
}


.header-logo img {
    width: 10vw;
    box-shadow: 3px 3px 4px 0px #2D2A28;
    /* box-shadow: 2px 2px 5px 0px #776F69; */
}

.nav {
    flex-grow: 1;
    margin-left: 50vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: auto;
}

@media (max-width: 740px) {
    header {
        height: 15vw;
        padding: 0 5vw;
    }
    .header-logo img {
        width: 20vw;
    }
    .nav {
        margin-left: 13vw;
    }
    .nav-element {
        color: #3D3D3D;
        text-align: center;
        font-size: 5vw;
        font-weight: 300;
    }

    .nav-element.active {
        font-weight: 500;
    }
    
}