body{
    margin: 0;
    padding: 0;
   
}
.index{
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
background-image: url("../images/Scan QR code.png");
background-color: #dbebfa;
background-repeat: no-repeat;
background-size: 26%;
background-position: center;
}
.logo-1{
    position: absolute;
    top: 4%;
    left: 38%;
}
.logo-2{
    position: absolute;
    top: 4%;
    right: 38%;
}
.logo-3{
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 1%;
}
.astra,.scan{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 110px;
}

.logo-1 img{
    width: 5rem;
}
.logo-2 img{
    width: 4.5rem;
}
.logo-3 img{
    width: 20rem;
}
.astra img{
    width: 18rem;
}
.scan img{
    width: 15rem;
}
.scan .logo{
    width: 1.8rem;
    margin-left: -40px;
    margin-right: 30px;
}
@media screen and (max-width: 576px){
    .index{
        background-image: url("../images/Scan QR code.png");
        background-size: 100%;
    }
    .logo-1{
        left: 10px;
    }
    .logo-2{
        right: 10px;
    }
    .logo-3{
        position: absolute;
        bottom: 0;
        right: -1px;
    }
    .logo-1 img{
        width: 6rem;
    }
    .logo-2 img{
        width: 5.5rem
    }
    .logo-3 img{
        width: 25rem;
    }
  .astra{
    margin-top: 10px;
  }
  .astra img{
    width: 19rem
  }
  .scan{
    margin-bottom: 200px;
    margin-top: -20px;
  }
  .scan img{
    width: 16.5rem;
  }
  .scan .logo{
    width: 2.3rem;
    margin-left: -50px;
    margin-right: 40px;
  }
  
    }