.offcanvas-header {
    display: none;
}

@media (max-width: 992px) {
    .offcanvas-header {
        display: block;
    }

    .navbar-collapse {
        position: fixed;
        top:0;
        bottom: 0;
        left: 100%;
        width: 100%;
        padding-right: 1rem;
        padding-left: 1rem;
        overflow-y: auto;
        visibility: hidden;
        background-color: black;
        opacity: 0.9;
        transition: visibility .2s ease-in-out, -webkit-transform .2s ease-in-out;
    }

    .navbar-collapse.show {
        visibility: visible;
        transform: translateX(-100%);
    }
}