.Menu {
    background: white;
    border-radius: 6px;
    display: none;
    min-width: 140px;
    position: absolute;
    top: $unit * 5; // This shouldn't be hardcoded. How to calculate it?
    z-index: 1;
}

.MenuItem {
    color: $grey-10;
    font-weight: $medium;
    padding: 10px;

    &:hover {
        background: $grey-90;
        color: $grey-00;
        cursor: pointer;
    }

    a {
        color: $grey-10;

        &:hover {
            color: $grey-00;
        }
    }
}

.MenuGroup {
    border-bottom: 1px solid #f5f5f5;

    &:first-child .MenuItem:first-child:hover {
        border-top-left-radius: 6px;
        border-top-right-radius: 6px;
    }

    &:last-child .MenuItem:last-child:hover {
        border-bottom-left-radius: 6px;
        border-bottom-right-radius: 6px;
    }

    &:last-child {
        border-bottom: none;
    }
}