@media only screen and (min-width: 481px) and (max-width: 999px) {
    nav > .container > ul {
        display: none;
    }

    .hamburger-icon {
        display: block;
        cursor: pointer;
    }

    .hamburger-icon img {
        width: 30px;
        height: 30px;
    }
}

@media (max-width: 480px) {
    .side-menu {
        width: 375px;
        height: 100vh;
        padding: 1.5rem 1.25rem;
        transform: translateX(100%);
    }

    .side-menu.active {
        transform: translateX(0);
    }
}