/* Default: desktop */
.desktop-nav {
    display: flex;
}

.mobile-nav {
    display: none;
}

/* Mobile */
@media (max-width: 768px) {
    .desktop-nav {
        display: none;
    }

    .mobile-nav {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
    }

    main {
        padding-bottom: 60px; /* prevent content being hidden */
    }
}