#menu {
    background-color: var(--secondary);
    padding: 2vh 2vw;
    width: 100%;
    font-size: 2vh;
    font-weight: 500;
    position: fixed;
    top: 0;
    z-index: 10;
}

#menu a {
    margin: 0px 15px;
    padding: 15px;
    width: auto;
    border-bottom: 0.3vh solid var(--primary);
    text-align: center;
}

#menu a:hover {
    color: var(--accent);
    border-bottom: 0.5vh solid var(--accent);
}

#menu #logo {
    float: left;
}

#menu #links {
    float: right;
}

#menu #mobilemenubutton {
    float: right;
}

#mobilemenu {
    padding-top: 7vh;
    width: 100%;
}

#mobilemenu ul {
    text-align: center;
    font-size: 3vh;
    font-weight: 500;
}

#mobilemenu li {
    width: 100%;
    color: var(--primary);
    background-color: var(--secondary);
    border-bottom: 0.3vh solid var(--primary);
}
#mobilemenu li:hover {
    color: var(--accent);
    border-bottom: 0.3vh solid var(--accent);
}

#mobilemenu li a {
    display: block;
    padding: 2vh;
    width: 100%;
}

.menuicon {
    background-color: var(--secondary);
    width: 35px;
    height: 5px;
}