Header image not mobile responsive

Hi

I´m pretty new to WordPress and really in no way a technical expoert.
I just created a new site and checked the header item on my mobile.
The image is cropped on the sites so that you can not read the text.

I´ve tried some CSS inputs I´ve found online such as:

@media (max-width: 576px) {
.header {
padding-top: 100px;
}
}
@media (max-width: 768px) {
.header {
padding-top: 200px;
}
}

or

@media (max-width: 480px){
.logo img {
width: 100%;
height: 100%;
}
}

but they didn´t change anything.

My theme is clubfashion.

I´m also wondering if there is a way that I can ovelay the writing in the header itme in wordpress itself? I´ve done it now in a photo programm in imported the foto already with the writing.. but since wordpress crops the image differently it´s not on the perfect place most of the time?

And, sorry for so many topics; I would like to hide the author,date and the comment count on a post, or at least place them differently. They now placed right in the middle of the header image when I open a post, that doesn´t look good 🙁
However, I again tried to google fix it with:

” .entry-author-link, .entry-date { display: none; }”.

but this didn´t change anything again 🙁

Since I really don´t even understand what I´m copying into the Css, sorry if that´s absolut nonsense. Is it important how many spaces in such an function?

Thanks in advance for any help

Michelel

The page I need help with: [log in to see the link]