First, we're going to fix a bug using the z-index property. When you hover over the MOVIES navigation item, a dropdown appears. You will notice a couple of things:
First, one of the nav items in the dropdown items gets highlighted—when it really shouldn't. Second, the nav is actually animating on top of the MOVIES navigation item.
We can slow down the animation speed to 2.5s to get an easier look at this issue:
.has-submenu:hover ul { display: block; -webkit-animation: slideDown 2.5s ease; animation: slideDown 2.5s ease; }
This can make it easier to see that the dropdown menu is dropping down on top of the MOVIES ...
