.ti1{
  font-size: 55px;
}
.ti2{
font-size: 30px;
}

.ti3{
font-size: 30px;
}

.side1{
  position: relative;
  
}
.inside2{
  position: absolute;
  top: 10%;
  left: 30%;
  width: 300px;
  height: 300px;
  border: 3px solid #0745E5;
  border-radius: 6px;
  object-fit: cover;
}
.inside{
width: 300px;
height: 300px;
background: #0745E5;
border-radius: 6px;
}

@media only screen and (max-width: 600px) {
    .inside{
      width: 200px;
      height: 200px;
    }
  .inside2{
      position: absolute;
      top: 10%;
      left: 30%;
      width: 200px;
      height: 200px;
  }
  .ti1{
    font-size: 30px;
    
  }
  .ti2{
    font-size: 30px;
    
  }
  .ti3{
    font-size: 30px;
    
  }
  #message{
    width: 300px;
  }
  }

    #loader {
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #ffffff;
    z-index: 9999;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  /* Spinner Styles */
  .spinner {
    border: 6px solid #f3f3f3; /* Light grey */
    border-top: 6px solid #3498db; /* Blue */
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
  }

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

  /* Hide content until the page is loaded */
  body.loading {
    overflow: hidden;
  }
  body.loaded #loader {
    display: none;
  }