I changed the second one from #bbbbbb to #fa0000 and there is no change on the drop-down menus on hover.

Is there some conflicting quick CSS?

Perhaps this? This was to fix when I am hovering on non-transparent headers.

.header_color .main_menu ul:first-child > li a:hover, #top #wrap_all .av-main-nav ul > li:hover > a .avia-menu-text{
  color: #D3D3D3!important;
} /* fix menu hover color on non-transparent headers*/

Thank you,

Jas

That’s nice, looks great. Thank you! I tweaked it a little.

But for some reason, I have two of those here? I can’t remember why I put them here.

Does the top entry override and the bottom one become redundant?

Or are they combining effects and can I just combine them into one entry?

https://www.dropbox.com/s/lnhusywcts5khqk/Screen%20Shot%202018-06-27%20at%204.17.21%20PM.png?dl=0

• This reply was modified 6 years, 4 months ago by Jasmer. Reason: update

Thanks Jordan,

It looked terrible. Abort Mission. Thanks for the help!

Thank you,

Jas

THANK YOU YIGIT! Solved. Close Topic..

Jas

Sure can you post the CSS? Then I’ll try it. That is what I am asking for.

Thanks,

Jas

Please look at the fully annotated screenshot in my previous message. Or just look at the site.

The space is uneven.

The space between the 1st and 2nd icon is larger than the space between the 2nd and 3rd icon.

As stated, I want to fix that problem.

1. Regarding SHS (see below). I deleted this CSS and it caused odd problems. I’ll list them below.

#advanced_menu_toggle, #advanced_menu_hide {
color: #666666!important;
}

@media only screen and (max-width: 767px) {
#photo-center .av-parallax.avia-full-stretch.active-parallax {
background-position: 35%!important;
}}

@media only screen and (max-width: 767px) {
.responsive .main_menu .avia-menu, .responsive #header_main .social_bookmarks, .responsive #header_main_alternate {
    display: block !important;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 380px) {
#top #wrap_all .social_bookmarks, #top #wrap_all .social_bookmarks a, #top #wrap_all .social_bookmarks li {
    margin-left: -7px;
} /*icons closer*/
}

@media only screen and (max-width: 768px) {
#top .av_header_transparency .phone-info, #top .av_header_transparency .phone-info span {
    color: #555555 !important;
}} /*for appointment call info*/

@media only screen and (max-width: 480px) {
.phone-info a {
    color: #555555 !important;
}} /*phone number info darken phone*/

2. These are the odd problems

a) The menu items on the desktop disappeared. Gone. Weird which seems to be tied to this specific CSS below. When I delete that the menu items on the desktop site disappear.

@media only screen and (max-width: 767px) {
.responsive .main_menu .avia-menu, .responsive #header_main .social_bookmarks, .responsive #header_main_alternate {
    display: block !important;
}

b) Additionally, the hamburger menu does not appear on the mobile site, whether the CSS above is in place or not.

3. Also the desktop menu links are a strange color/layer effect and are difficult to see, they were not this color when you guys helped me with the original CSS. So whatever is happening is affecting both the desktop site and the mobile site.

This is a confusing issue. Feel free to look around…

Thank you,

Jas

Hi,

Why would PAGE links show up in this element instead of BLOG POSTS?

Whenntjere are no blog posts in this element, then Main Menu items appear in the Masonry element.

I can’t imagine why anyone would ever want page links to appear in Blog post elements such as the Masonry element. Very odd. This is expected behavior?

If so, why was this behavior changed from its original design?

Thank you,

Jas

Thanks! Close topic.

Hi Victoria,

Thanks. It’s close. It works in portrait, but when I position the iPhone in landscape it is still 2 rows.

We need to adjust I’m assuming. Is there a Nowrap type CSS I can add?

Thank you,

Jasmer

Victoria,

I need to center the images at the very least. But here is the deal, I have done this before on a couple of posts. I just can’t seem to get this one. There is a way to do it. Would you draw Kriesi, Yigit, Ismael or Josue’s attention to see if they might have some ideas please? I would REALLY appreciate it.

I have got to get this site up asap. I would appreciate if you could consult with your colleagues on this. Thank you.

https://kriesi.at/support/topic/center-slider-image-on-mobile-site/

Ismael! Good to see you back!

That was the issue? The www? OMG. 5 days later you solved the mystery. It is very confusing when the link goes to the correct position, but with a reload instead of a scroll to anchor. That tripped me up.

Thanks for coming by. You can close the topic

Jas

Guenni007,

I sent you an email. Check your junk mail if you don’t see it.

Thanks,

Jas

Victoria,

I just added the CSS back so you can see. I commented it out because it didn’t work. The large white space is on the home page now just below the top image.

@media only screen and (max-width: 767px) {
#home-slider-image .av-parallax-inner.main_color.avia-full-stretch {
    position: relative;
    top: -200px;
    background-size: contain !important;
}} /*home slider image + uncrop width*/

@media only screen and (max-width: 480px) {
#home-slider-image {
    background-position: 50% 0%!important;
    background-attachment: scroll!important;
}}

The other images I need CSS to apply to are below.

Thanks,

Jas

goldengate415 It is published. Thanks though!