@media(max-width:900px){

    body{
        overflow-x:hidden;
    }

   .sidebar{
    position:fixed;
    top:0;
    left:0;

    width:260px;
    height:100vh;
    padding:20px;

    background:#071b3a;
    min-height:100vh;

    z-index:9999;

    transform:translateX(-100%);
    transition:transform .3s ease;

    overflow-y:auto;
    overflow-x:hidden;

    padding-bottom:180px;
    box-sizing:border-box;
}

.sidebar::-webkit-scrollbar{
    display:none;              /* Chrome/Edge */
}
    .sidebar.active{
        transform:translateX(0);
    }

    .main{
        margin-left:0 !important;
        width:100%;
        padding:15px;
    }

    .grid{
        grid-template-columns:1fr;
    }

    .toggle-sidebar{
        display:block;
    }
}

.materiales-box{
    margin-bottom:10px;
}