Ok, now I see that we are looking at two different items – I was referring to the register menu item in the secondary menu, not the main menu. If you look at my image you can see that it was 114. It’s ok though because the client wanted the burger and the register button on the same band so instead of using a text menu I removed the logo and replaced it with an svg that says ‘register now’. Thanks for your help :)

Yes, very odd!

Not sure why the link didn’t work – here you go –

http://dev.universityheights.ca/img/register.jpg

Thanks, Victoria – the menu text is now showing up but I have set one menu item to be ‘colored’ and it’s not seeing that. I’ve tried a bunch of things but I’m not quite getting it right – here’s what I have tried (the register button is item 114) – please let me know how to target item 114 properly. Thanks again! :)

/* register button */
li#menu-item-114 > a > .avia-menu-text {
    color: orange!important;
    background-color: red!important;
    border: 1px solid #ff3300 !important;
}

/* register button */
li#menu-item-114 .av-menu-button-colored > a .avia-menu-text {
	border: 2px solid #ff0000 !important;
}

/* register button */
#top .avia-slideshow-button.avia-color-light {
	font-size: 22px;
	line-height: 22px;
	border-radius: 0px;
	border: 2px solid #c8bea0 !important;
	padding: 12px 18px;
	background-color: rgba(0,0,0,0.6);
}

Most definitely! On a phone it would be a big long nothing ;)

Yes, sorry I should have done that in the first post. Please see the private area :)

My pleasure! We are all part of an amazing global community :)

Ok, so now I have a clone in a dev sub domain. You will see that I’ve targeted just the menu item that is for the building page, and moved it over to the left and you’ll see a lock icon over an image of a gold arrow. I’d like to have just the gold arrow but when I remove the ‘content’ lines there is nothing to size the arrow. thanks again and please advise :)

/* building page */
#menu-item-312 > a::before {
/* when I comment out the content icon the background image also disappears*/
	content:'\E824';
	font-family: 'entypo-fontello';
	font-size: 20px;
	position: absolute;
	left: -50px;
	opacity: #fff;
    background-image: url(/images/arrowRightGold.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50% 50%; 		
}

Ok, thank you, Ismael! I appreciate your help :)

I’ve just changed the link in private so that Google doesn’t find it – please see below :)

Thank you, Ismael, but I’m trying not to have to use any custom js so I have reverted back to having the circle and background at the same opacity.
I also don’t want to keep bothering you with this tiny matter.

With that said, when I link to the page –

The magnifying glass is not anything like the code you sent that makes it show up instead. So where did you get –

content: ‘\E803’;

from please, when the site says it’s

🔍
U+1F50D
🔍

thanks again! :)

Yes, but I want the black image overlay to remain as 0.4 and have the inner circle be opacity 1. they are obviously linked with that css but can I isolate just the circle to be 100%?

I see the screenshot, thanks – odd, it’s not showing up after repeated refreshing…

Hello, Rikard

Yes, by all means! I have sent the information in the private area :)

That sort of worked – I tried to reduce the image size and it started to get cut off, plus this also centered the menu text below, so I’m assuming this is applying to all in the open state since it’s using the ul css. Could you please provide an option to center the image above the open hamburger X ?

Sorry, I forgot to include the links in the private area.