Here is a screen shot of what I am talking about on the desktop

http://imgur.com/bncreQt,5X2yn2M#0

I am using the icons in a mega menu and plan on adding the categories under each of the icons.

Here is a screenshot of what it looks like on mobile as well.

http://imgur.com/bncreQt,5X2yn2M#1

Thanks for the quick reply.

`I messed up on the nav background – I included a DOT before the # sign.

What would that right side link font color be for CSS changes?

Hmmm

this is what I put in for a quick view on changes – but the top nav background did not change:

-#header_meta { background-color: red; }

-.header_color .sub_menu>ul>li>a { color: black; }

.phone-info span { color: black; }

.avia-slideshow { width: 101%; }

See at ng-sandbox.com/keystone

What did I do wrong?
ALSO _ the font color for the top nav link – what would the CSS be for that?

Thanks as always Yigit!

• This reply was modified 12 years ago by noble51. Reason: I messed up on the background of the top nav - I had a DOT before the #

Hmmm, this seems to work but could I be missing anything?

#top input[type=”text”]:focus,
#top input[type=”email”]:focus,
#top input[type=”tel”]:focus,
#top input[type=”number”]:focus,
#top textarea:focus,
#top select:focus {
background-color: #FFFA99 !important;
}

Hey!

thank you Josue, but but it is not great.
On mobile and ipad the comment form is too small. And on my pc the text box is not centered and too broad.

http://nsa33.casimages.com/img/2014/04/22/140422100627103289.jpg

Code:

/* With Template Blog posts */
#top .fullsize .template-blog .post .entry-content-wrapper > * {
max-width: 770px;
margin-left: auto;
margin-right: auto;
text-align: center;
}
#top .fullsize .template-blog .post .entry-content-wrapper {
max-width: 770px;
}
#top .fullsize .template-blog .post-title {
max-width: 100%;
}
div.comment-entry.post-entry {
    width: 72%;
    margin: 0 auto;
}

Thanks Yigit,

It worked well on desktops but not on mobile devices. Menu overlaps on tablets and phones because logo doesn’t resize.
http://exhicor.lafabricadigital.com.mx/exhibidores-de-alambre/
Thank you very much for your help.

Cheers!

Removing the #top did the trick.

Thanks again!
Brian

Perfect! And if I just want to do this on the homepage, do I add “.home” to the beginning of the CSS code?

.home #top .av_header_transparency #header_main {
display: none;
}