header{
    user-select: none;
    margin-bottom: 15px;
}

/*upper header containing logo and info*/

.header-upper{
    width: 100%;
    line-height: 5em;
    height: 80px;
    background-color: var(--surface-1);
    color: var(--alternative-text);
    text-align: center;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
}

/*container for items*/

.header-upper ul{
    display: flex;
}

/*items in the upper header*/

.header-upper li{
    display: flex;
    line-height: normal;
    margin-right: 15px;
    align-items: center;
}
/*logo image*/

.logo-container img{
    width: 80px;
    height: 80px;
    display: flex;
}

.header-icon svg {
    padding: 8px;
    color: var(--alternative-text);
    border-radius: 10px;
    vertical-align: middle;
    background-color: var(--surface-0);
    cursor: pointer;
}

@media screen and (max-width: 400px){
    #student-name {
        display: none;
    }
}