Hi there,
1. The menu bar is obviously white. When you hover over ‘contact me’, you can see that Collaborations is in the drop down, but you can’t select it. Can’t figure out why.
Some of the CSS you added has resulted in a gap between the menu bar and the sub-menu. Meaning if you move your mouse from the main menu to the sub-menu items, the cursor passes over that gap and the menu loses focus. I can get to the sub-menu by moving my mouse very fast.
The CSS that appears to be causing the problem is:
.main-navigation ul li a {
font-size: 14px;
}
Add the following right underneath that code:
.main-navigation ul ul {
top: initial;
}
That should cause the sub-menu to overlap the main menu slightly, preventing this from happening. It had this overlap before the font-change.
2. Is there a way to get all the three ‘front page featured’ items smaller?
it works for those featured images, but it also changes the site logo.
It looks like you’ve figured this out, including the .featured-page class to make your selector more specific.
3. On the mobile responsive menus, the menu background is teal. How can I change that to the same color scheme as the desktop version,(background white, text black) including the hover color (or more accurately, the color it is when you keep your thumb pressed on it).
It looks like you’ve already figured this out as well, but let me know if there’s still something that doesn’t look the way you want it to.
========
Unrelated to your questions, but I see you also have this code added:
.site-title {
position: absolute;
left: -9999px;
top: -999px;
}
It’s not necessary to use CSS to hide your site title like that. If you go to the Site Identity section of the Customizer, there’s a box you can uncheck if you don’t want the title to be visible on the page.