overlapping image – display tablet

Dear support team
Now I have two more problems:

1. For the Contact page https://meine-achtständigkeit.de/kontakt/ I use 2 columns (3/5 and 2/5) at the top. In the 2/5 column there are 2 images that are displayed overlapping.
It works wonderfully on the desktop.
It is only displayed very questionably on the tablet portrait format: https://meine-achtständigkeit.de/support/tablet-quer-1.png

Since I don’t want the image to be displayed in its entire height on the tablet portrait format, I tried to shorten the height of the image using the following CSS script:

@media only screen and (max-width: 989px) {
.flex_column.av_two_fifth.cell1 {
min height: 20vh;
max-height: 300px !important;
}
}

I already had the problem with the GridRows with these picture elements. There I was able to solve it by inserting the following CSS script:

@media only screen and (max-width: 989px) {
.flex_cell.av_one_third.cell1 {
min height: 50vh;
max-height: 300px !important;
}
.flex_cell.av_one_third.cell2 {
min height: 50vh;
max-height: 300px !important;
}
}

It will then be displayed correctly on the tablet: https://meine-achtständigkeit.de/support/tablet-quer-2.png (The associated link to this section is: https://meine-acht confidence.de/course-mindfulness -hamburg/#mindfulness-stress)

Except this was a gridrow and not a column layout like on the contact page. https://meine-achtlichkeit.de/kontakt/
How can / must I change the CSS script so that the flower image in the background is minimized from the height on the tablet portrait format.
—-

2. I also have the problem on the contact page in the section with the registration form that I have specified in the column with the butterfly picture (to the right of the contact form) under “Mobile display” that it should be hidden on mobile devices. But it still appears on my tablet portrait mode ??? What can I do here?

Best regards Diana