Image dissapears when the window is smaller (and on mobile)

I am making a website and have a image as part for the landing header. My image in my header is there at the start but then, disappears when the browser window gets smaller. Once you resize the window, the image gets smaller and smaller towards the middle and then, disappears. What am I doing wrong? Below is code and images:

HTML:

    <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <meta name="theme-color" content="#046CE9">
  <title>Allura Imports Inc.</title>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.6.2/css/bulma.css" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
  <link rel="stylesheet" type="text/css" href="css/beta.css">
  <link href="https://fonts.googleapis.com/css?family=Work+Sans:600" rel="stylesheet">
</head>
<body class="has-navbar-fixed-top">

  <nav class="navbar is-fixed-top is-transparent">
    <div class="navbar-brand">
      <a class="navbar-item" href="http://allura.surge.sh">
        <img src="assets/allura.png" alt="Allura Imports Inc." width="112" height="28">
      </a>
      <div class="navbar-burger burger" data-target="navbarExampleTransparentExample">
        <span></span>
        <span></span>
        <span></span>
      </div>
    </div>

    <div id="navbarExampleTransparentExample" class="navbar-menu">
      <div class="navbar-start">
        <a class="navbar-item" href="#">
          Home
        </a>
        <a class="navbar-item" href="brands.html">
          Brands
        </a>
        <a class="navbar-item" href="contact.html">
          Contact
        </a>
        </div>
      </div>

      <div class="navbar-end">
      </div>
  </nav>

  <div class="land">
    <img src="assets/allura-white.png" alt="Allura">
    <h2>Since 1959</h2>
  </div>

  <div class="quote">
      <p>
        Suddenly she came upon a little three-legged table, 
        all made of solid glass; there was nothing on it except 
        a tiny golden key, and Alice's first thought was that it 
        might belong to one of the doors of the hall; but, alas! 
        either the locks were too large, or the key was too small,
        but at any rate it would not open any of them. 
        However, on the second time round, she came upon a low 
        curtain she had not noticed before, and behind it was a little 
        door about fifteen inches high: she tried the little golden key 
        in the lock, and to her great delight it fitted! 
      </p>
  </div>

  <div class="home-images">
    <div class="columns">
      <div class="column">
          <img class="image" src="assets/home/enyce.jpg" alt="Kids wear ENYCE" height="360px" width="640px">
      </div>
      <div class="column">
          <img class="image" src="assets/home/baby.jpg" alt="Baby wears Duck Duck Goose" height="360px" width="640px">
      </div>
    </div>
  </div>

  <div class="brands">
    <h2 id="brands">
      Brands
    </h2>

    <hr class="horizontal-line">

    <div class="columns">
      <div class="column">
          <img src="assets/brands/enyce.png" alt="ENYCE" height="360px" width="640px">
      </div>
      <div class="column">
          <img src="assets/brands/duck.png" alt="Duck Duck Goose" height="360px" width="640px">
      </div>
      <div class="column">
          <img src="assets/brands/delias.png" alt="Delia's" height="360px" width="640px">
      </div>
    </div>
    <div class="columns">
      <div class="column">
          <img src="assets/brands/bhpc.png" alt="Beverley Hills Polo Club" height="360px" width="640px">
      </div>
      <div class="column">
          <img src="assets/brands/delias-girl.png" alt="Delia's Girl" height="360px" width="640px">
      </div>
      <div class="column">
          <img src="assets/brands/dollhouse.png" alt="Dollhouse" height="360px" width="640px">
      </div>
    </div>
  </div>

  <script>
    document.addEventListener('DOMContentLoaded', function () {

    // Get all "navbar-burger" elements
    var $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);

    // Check if there are any navbar burgers
    if ($navbarBurgers.length > 0) {

      // Add a click event on each of them
      $navbarBurgers.forEach(function ($el) {
        $el.addEventListener('click', function () {

          // Get the target from the "data-target" attribute
          var target = $el.dataset.target;
          var $target = document.getElementById(target);

          // Toggle the class on both the "navbar-burger" and the "navbar-menu"
          $el.classList.toggle('is-active');
          $target.classList.toggle('is-active');

        });
      });
    }

    });
  </script>
</body>
</html>

CSS:

    body {
  font-family: 'Work Sans', sans-serif;
}

.land {
  background: #0a2463; 
  background: -webkit-linear-gradient(top right,#0a2463,#046CE9);
  background: -o-linear-gradient(top right,#0a2463,#046CE9); 
  background: -moz-linear-gradient(top right,#0a2463,#046CE9); 
  background: linear-gradient(top right, #0a2463, #046CE9);
  padding-left: 200px;
  padding-right: 200px;
  padding-top: 200px;
  padding-bottom: 200px;
  min-width: 100%;
  min-height: 300px;
  text-align: center;
  color: white;
}

.quote {
  padding-left: 50px;
  padding-right: 50px;
  padding-top: 50px;
  padding-bottom: 50px;
  background-color: #01baef;
  font-family: 'Work Sans', sans-serif;
  font-size: 24px;
  color: white;
  min-width: 100%;
}

.home-images {
  padding-left: 50px;
  padding-right: 50px;
  padding-top: 50px;
  padding-bottom: 50px;
}

.brands {
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
}

#brands {
  text-align: left;
  font-size: 42px;
}

.horizontal-line {
  height: 20px;
  width: 200px;
  background: #0a2463; /* Old Browsers */
  background: -webkit-linear-gradient(top right,#0a2463,#046CE9); /*Safari 5.1-6*/
  background: -o-linear-gradient(top right,#0a2463,#046CE9); /*Opera 11.1-12*/
  background: -moz-linear-gradient(top right,#0a2463,#046CE9); /*Fx 3.6-15*/
  background: linear-gradient(top right, #0a2463, #046CE9); /*Standard*/
}

What happens with the image:

See GIF

Thank you