Joomla Templates Club 406,261 posts

[surdo Friend surdoJoin date: March 2015Posts: 108Downloads:14Uploads:10 Thanks: 33]

#730860

Hello,

I’m using a Joomlart ACM on the home page of my site. It uses the graphic of a dog who’s ears are visible on large screens. See for example:

http://escuta.org

On small screens – a dark grey drop-down area appears at the top of the screen to accommodate the condensed site menu and this covers the top of the head of the dog. ie.

What I’d like to do is have this image spaced downwards by the same height at the dark grey drop down region.

What would be the best and simplest way to do this please?

Thanks for your help

[surdo Friend surdoJoin date: March 2015Posts: 108Downloads:14Uploads:10 Thanks: 33]

#749051

Solved it. Placed the following in custom.css setting the position of header transparency to “relative” on very small screens:

@media (max-width: 991px) {
.header-trans .t3-header-wrap {
position: relative;
top: 0;
width: 100%;
left: 0;
}
.header-trans .t3-header-wrap .t3-header {
background: rgba(0, 0, 0, 0.86) none repeat scroll 0 0;
}

[Author]

Posts