html {
    overscroll-behavior-y: contain;
  }
  
  
  .divbody {
      background: linear-gradient(-45deg, #383836, #c5f8d2, #0c95e4, #083ef1);
      background-size: 400% 400%;
      animation: gradient 10s ease infinite;
  }
  
  @keyframes gradient {
      0% {
          background-position: 0% 50%;
      }
      50% {
          background-position: 100% 50%;
      }
      100% {
          background-position: 0% 50%;
      }
  }
  
  .card-1 {
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
  }
  
  .card-1:hover {
    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
  }
  
  /* Loading Page Wave */
  
  .loading-page-container,
  .loading-page-container > * {
    box-sizing: border-box;
  }
  
  .loading-page-container {
    opacity: .95;
    position: absolute;
    top: 35%;
    left: 50%;
    margin-left: -100px;
    margin-top: -100px;
  }
  
  .loading-page-container .progress {
    position: relative;
    border-radius: 50%;
    width: 200px;
    height: 200px;
    border: 6px solid #182D4D;
    box-shadow: 0 0 20px #1E384C;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
  }
  
  .loading-page-container .progress .inner {
    position: absolute;
    overflow: hidden;
    z-index: 2;
    border-radius: 50%;
    margin-left: -4px;
    margin-top: -1px;
    width: 196.5px;
    height: 196.5px;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
  }
  
  .loading-page-container .progress .inner .water {
    opacity: .55;
    position: absolute;
    z-index: 1;
    width: 200%;
    height: 200%;
    left: -50%;
    border-radius: 40%;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-name: spin;
    animation-name: spin;
    top: 55%;
    background: #32BAFA;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
    -webkit-animation-duration: 10s;
    animation-duration: 10s;
    box-shadow: 0 0 20px #152A4A;
  }
  .welcometext{
      position: fixed;
      top: 50%;
      text-align: center;
      left: 0%;
      width: 100%;
  }
  
  @-webkit-keyframes spin {
    from {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  
  @keyframes spin {
    from {
      -webkit-transform: rotate(0deg);
      transform: rotate(0deg);
    }
    to {
      -webkit-transform: rotate(360deg);
      transform: rotate(360deg);
    }
  }
  .parent {
    width: 100%; /* I took the width from your post and placed it in css */
    height: 20%;
  }
  
  /* This will style any <img> element in .parent div */
  .parent img {
    width: 24%;
    max-height:24%;
    object-fit: contain
  }
  
  