.menu {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;

    font-size: var(--font-size-second);
    list-style: none;
}

/* MENU LAYOUT */

.desktop {
    flex-direction: row;
}

.mobile {
    flex-direction: column;
}

/* MENU ITEM */

.menu li {
    position: relative;
    border-top: var(--menu-mark-thickness) solid rgba(0, 0, 0, 0);
}

/* MENU ITEM MOBILE */

.mobile li {
    font-size: var(--font-size-default);

    padding: var(--size-xs) var(--size-s);
}

.mobile li.selected {
    background-color: var(--color-back-opposite);
    color: var(--color-text-opposite)
}

.mobile li.selected a {
     color: var(--color-text-opposite)
}
 
/* MENU ITEM DESKTOP */

.desktop li {
    padding: var(--size-xs) var(--size-s);
}

.desktop li.selected {
    border-top-color: var(--color-back-opposite);
}