@media (min-width:320px) and (max-width:740px){
    *{
        margin: 0px;
        padding: 0px;
        box-sizing: border-box;
    }

    body{
  width: 100vw;
  height: 100vh;

  background: linear-gradient(135deg, #0000 18.75%, #650304 0 31.25%, #0000 0),
    repeating-linear-gradient(45deg, #650304 -6.25% 6.25%, #d71515 0 18.75%);
  background-size: 64px 64px;
  display: flex;
  justify-content: center;
  align-items: center;
}



    .loading{
        width: 250px;
        height: 250px;
        /* border: 2px solid royalblue; */
        display: flex;
        justify-content: flex-start;
        align-items: center;
        flex-direction: column;
    }


    .lg{
        width: 200px;
        height: 200px;
        /* background-color: rebeccapurple; */
        background-image: url(../image/1acb7cbb655c71fc28a959b9a8b22936.png);
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
        
    }

    /* From Uiverse.io by gagan-gv */ 
.loader {
  width: 12em;
  height: 1em;
  border-radius: 8px;
  background-color: #ffffff44;
}

.loader div {
  height: 100%;
  width: 100%;
  border-radius: 8px;
  background-color: #ffffff;
  animation: width7435 5s linear infinite;
  transition: all;
}

@keyframes width7435 {
  from {
    /*width: 0;*/
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}
}