.container{
      height:220px;
      background-color:#ffffff;
      width:100%;
      display: flex;
      justify-content: space-evenly;
}
.contain1{
    background-color: #ffffff;
    width: 30%;
    height: 70px;
    display: flex;
    margin-top:110px;
    justify-content: center;
}

.paymentlogo{
      width: 17%;
      height: 100%;
      background-color: #ffffff;
}
.googlepay{
        width:100%;
        height:70px;
        border-radius: 20px;
        box-shadow: 2px 2px 2px 0px #000;
        cursor: pointer;
    
}

.googlepay:hover{
    scale: 1.07;
}

.payment{
    width:100%;
    height: 80%;
    background-color: #ffffff;
   margin-top: 7px;
   margin-left: 10px;
   font-family: "Noto Sans";
   font-size: 30px;
   font-weight: 700;
   border-radius: 20px;
   border: none;
   box-shadow: 2px 1px 5px 0px #000000;
   cursor: pointer;
}

.payment:hover{
    background-color: #a7a7a7;
    color: #ffffff;
    scale: 1.07;
    margin-left: 20px;
}

.payment:active{
    background-color: #4b4b4b;
    color: #ffffff;
}

.qrcontainer{
        background-color:#ffffff;
        width: 100%;
        height: 500px;
        display: flex;
        justify-content: center;
        
}

.qr{
    width: 400px;
    height: 400px;;
    background-color: #ffffff;
    display: flex;
    position:absolute;
}
.google-qr{
    width:400px;
    height:450px;
    border-radius: 20px;
    box-shadow: 2px 1px 5px 0px #000000;
}

@media screen and (max-width:700px) 
{
    .container{
        margin-top: 90px;
        height: 250px;
        flex-direction: column;
        margin-bottom: 40px;
    }

    .contain1{
        width: 90%;
        margin-top:10px;
        margin-left: 20px;
    }

    .paymentlogo{
        width:23%;
    }

}