Good day. Help, please, advice. I need the standard menu to disappear on small screens and smartphones, and a mobile version will appear. I did everything right, and when resizing the browser window, this is what happens, but in chrome in test mode and on a mobile phone, it does not want to work.
@media screen and (min-width: 993px) and (max-width: 1200px) { nav.desktop-nav ul.first-level > li a { font-size: 25px; } } @media screen and (min-width: 768px) and (max-width : 992px) { body .wrap .top_menu { width: 100%; } nav.desktop-nav ul.first-level > li a { font-size: 18px; } } @media screen and (min-width: 320px) and (max-width : 767px) { .top_menu nav.desktop-nav{display: none;} .top_menu .menu-icon{display: block;} body .wrap .top_menu { background: rgba(0, 0, 0, 0) repeat-x scroll 0 0; margin-top:0; } body .wrap .logo { padding: 0; } } 