Ссылки на изображения в меню не работают на мобильном телефоне

Question

Я пытаюсь настроить изображения в списке в качестве навигационных ссылок в меню. Текущая настройка отлично работает на настольном компьютере и отлично работает на мобильном симуляторе, но когда я собираюсь использовать его на iPhone, кликабельна только ссылка «ИЗОБРАЖЕНИЯ», а все остальные ссылки не щелкаются.

Я не уверен, что может вызывать эту проблему только на мобильном телефоне. Я полагаю, что это может быть DIV, блокирующий его, но я не уверен, почему можно щелкнуть только одно изображение. Есть ли способ, которым я могу закодировать этот список так, чтобы все изображения были в передней части веб-сайта и могли быть нажаты на мобильном телефоне?

http://www.alexcurrie.pictures

Для справки, вот ссылка на полную таблицу стилей сайта: https://codeshare.io/2BBrWy

    <nav id="menu">
        <ul>
          <a href="http://www.alexcurrie.pictures/"><img src="http://www.alexcurriemedia.com/logo.jpg" width="200"><a/href>
          </ul>
                <ul>
<img src="http://www.alexcurriemedia.com/pictures.jpg" width="200">
              </ul>
        <ul>
<a href="http://www.alexcurrie.pictures/film"><img src="http://www.alexcurriemedia.com/film.jpg" width="200"></href>
              </ul>
                      <ul>
<a href="http://www.alexcurrie.pictures/bio"><img src="http://www.alexcurriemedia.com/bio.jpg" width="200"></href>
              </ul>
          </nav>