我在移动设备上的菜单不适用于野生动物园

Question

我正在为客户的网站工作，但是菜单的响应性有问题。当您使用Safari打开网站并使用移动设备宽度时，单击右上角的汉堡包后将无法访问菜单。

这是html：

<input type="checkbox" id="nav" class="hidden"> <label for="nav"  class="link burger"><i></i><i></i><i></i></label>
<div  class="menu">
  <ul class="menu_ul">
   <li><a class="link fir" id="act">o nás</a></li>
   <li><a class="link sec">rezervace a ceník</a></li>
   <li><a class="link thr">dárkový poukaz</a></li>
   <li><a class="link fou">časté dotazy</a></li>
   <li><a class="link fiv">kontakt</a></li>
 </ul>
</div>

这里是CSS：

#nav:checked ~ .menu {

  z-index: 9990;
  opacity: 1;
  display: block;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";

}

#nav:checked ~ .menu ul li a {

  opacity: 1;
  z-index: 9999;

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -webkit-transform: translateX(0);
          transform: translateX(0);

}

在这里您可以找到网站http://stinohra.com