在响应宽度中拉伸或放大背景照片;如何解决这个问题

Question

我创建了一个自适应网站。http://www.kupa-flyfishing.com/ 在移动设备上，背景照片被放大/拉伸。

在标题部分，我有CSS设置视口和背景图像：

CSS：

header {
    background-attachment: fixed;
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url(img/hero.jpg);
    height: 100vh;
    background-size: cover;
    background-position: center;
}

我需要做些什么来解决这个问题？

GRZ， 利诺