.contain{
   
    /* Hidden by default */
    display: none;
    position: fixed;
    /* Stay in place */
    z-index: 30;
    /* Sit on top */
  
    left: 0;
    top: 0;
    width: 100%;
    /* Full width */
    height: 100%;
    /* Full height */
    overflow: auto;
    /* Enable scroll if needed */

    /* Fallback color */
    background-color: rgba(4, 15, 19, 0.4);
}

.loader {
    position: absolute;
  left: 50%;
  top: 40%;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid blue;
  border-bottom: 16px solid blue;
  width: 100px;
  height: 100px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
  }
  @media only screen and (max-width: 800px) {
 
    .loader {
      position: absolute;
    left:35%;
    top: 50%;
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid blue;
    border-bottom: 16px solid blue;
    width: 90px;
    height: 90px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    }
      }

      
  
  @keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
  }