Mobile Header

I use Centered Title Overlay.
Is it poosible, to have the title at the bottom?
I customize the title and the space from the top.

At the mobile view, the title is to big.
I try this at css override, but there is no function:

@media (max-width: 680px) {
.gk-nsp-header,
.gk-nsp-link-header {
font-size: 12px;
}
}

What can I do?
My site is http://www.lauenburger-online-zeitung.de/

Hi

Try add this code to override.css, remember that override nedds to be enabled in template setting.

Code: Select all

.gkNspPM-CenteredTitleOverlay.active > figcaption > div > div > *:first-child {
    bottom: 20px;
    margin-top: 0;
    position: absolute;
    width: 100%;
}


for font size on mobile try add this:

Code: Select all

@media only screen and (max-width:580px) {
.gkNspPM-CenteredTitleOverlay h3 {
    font-size: 13px;
}
}


Thanks for your answer.
The mobile code works

With the first code, I have a problem. The images are in the grid at the bottom partially isolated. So the header is below the visible image. I try it with automatic thumbnails, but it's doesn't works. Any idea? Thanks!

Hi

Please use the code I gave You, but play with the value of a bottom attribute. I Said to use 20px, but maybe in Your case a values like 30px or close to that will work better.