Custom mobile menu CSS

/*TOGGLE*/

#toggle{
    cursor: pointer;
    position: relative;

}

#toggle::before{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    background: white;
    height: 2px;
    transform: translateY(-5px);

}


#toggle::after{
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    background: white;
    height: 2px;
    transform: translateY(5px);

}

#toggle::before,
#toggle::after{
    transition: transform 0.2s;
}


#toggle.active::before{
    transform: translateY(0) rotate(45deg);

}
#toggle.active::after{
    transform: translateY(0) rotate(-45deg);

}


/*MENU WRAPPER*/

#mobile_menu_wrapper.active{
    height: 420px;
    box-shadow:
  0px 5.6px 1.6px rgba(0, 0, 0, 0.026),
  0px 12.8px 3.6px rgba(0, 0, 0, 0.038),
  0px 22.3px 6.3px rgba(0, 0, 0, 0.047),
  0px 35.4px 10px rgba(0, 0, 0, 0.055),
  0px 54.7px 15.5px rgba(0, 0, 0, 0.063),
  0px 85.3px 24.1px rgba(0, 0, 0, 0.072),
  0px 141.6px 40px rgba(0, 0, 0, 0.084),
  0px 283px 80px rgba(0, 0, 0, 0.11)
;

}


@media (min-width:600px){

    #mobile_menu_wrapper .oxy-nav-menu-list{
    flex-direction: row;
    justify-content: center;
}

#mobile_menu_wrapper.active{
    height:80px
}


}