我正在尝试使.panda_section_wrapper的background-image具有响应性。虽然它最终在较小的设备上看起来不错，但在较大的设备上是错误的。它被拉伸是可以的，但我希望它在这种情况下也能拉伸高度，因此Image在小屏幕和大屏幕上看起来都很好。我如何才能做到这一点？
我的网站：https://wandawix.github.io/online-zoo/index.html
我的代码：https://github.com/WandaWix/online-zoo

<main class="main">
        <!-- Panda section ---------------------------------------------------------- -->
        
        <div class="panda_section_wrapper">
            
               <!-- <div class="panda_circle">
               </div>
               <div class="writting">Watch<br>your<br><span style="color: #FFEE2E">favorite</span><br>animal<br>online</div>
               
            </div>
            <div class="btn btn_watch">
                <button class="btn">Watch online</button>-->
               
        </div>

.panda_section_wrapper {
    /* max-width: 1600px;
    background-color: pink;
    background-image: url(img/GiantPanda.png);
    height: 69vh;
    background-size: 93vw; */

    max-width: 1600px;
    background-color: pink;
    background-image: url(img/GiantPanda.png);
    height: 25vh; /*min(max(16px, 80vw), 60vh);*/
    background-size: 93vw;
    max-width: 1600px;
    background-color: pink;
    background-image: url(img/GiantPanda.png);
    background-size: 93vw;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    background-size: 100%;
    background-size: 100% 100%;
    
  }

  .panda_section_container {
    max-width: 1160px; 
    height: 100%;
    margin: 0 auto;
   
  }
  .panda_circle {
    position: relative;
    width: 40vw;
height: 50vh;
    left: 33%;
    top: 0%;
    background: linear-gradient(113.96deg, #F9804B 1.49%, #FE9013 101.44%);
    border-radius: 50%;
  }