header image scrolling and scaling

Hello,

How can I stop the header image from scrolling in this theme?
Also I do like to give the image a max height, but it does has to scale width+height for mobile users.

The code is now:

#main-header {
  background-position: 0 0;
  background-size: 100% !important;
  min-height: 315px;
  text-align: center;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.75);
}

With this code it doesn’t scroll, but now when scaling to mobile size, the background image is shown 3 times. Adding the no-repeat code doesn’t work either, because then instead of 3 images I see 1 image and the background color for that height.
Without the min-height code, the image doesn’t show at all.

So I’m lost..
Hope you can help me with the css code!

Angela