body{
    font-family: Arial, Helvetica, sans-serif;
    margin:0px;
    padding:0px;
}
.card{
    width:800px;
    height:500px;
    top:50%;
    left:50%;
    background:white;
    border-radius:10px;
    text-align:center;
    position:absolute;
    z-index:2;
    transform: translate(-50% , -50%);
}
p{
    color:#666;
}
#continue{
    padding: 20px 100px;
    border: none;
    font-size: 35px;
    color: #fff;
    font-weight: bold;
    background: #43ba19;
    border-radius: 10px;
    text-decoration: none;
}
#continue:hover{
    padding:25px 130px;
}

.blackout{
    display:none;
    position:absolute;
    width:100%;
    height:100%;
    background: black;
    opacity:.6;
    z-index: 9;
    top:0px;
}
.loading{
    position:absolute;
    display:none;
    z-index:10;
    background:white;
    width:580px;
    border-radius:10px;
    padding:50px 0px;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    text-align: center;

}
#myProgress{
    border-radius:10px;
    width:350px;
    background:lightgrey;
    margin:25px 0px;
    display:inline-block;
}
#myBar{
    width:0px;
    border-radius: 10px;
    height:10px;
    background:#666;
}
#cnfrm{
    display: none;
    width:350px;
    height:135px;
    position:absolute;
    left:50%;
    top:50%;
    transform: translate(-50%, -50%);
    border-radius:5px;
    z-index: 11;
    background:white;
    box-shadow: 0px 0px 5px;
    text-align:center   ;
}
.btn{
    padding:7px 30px;
    color:white;
    background-color:rgb(8, 136, 187);
    border-radius: 5px;
    font-size: 20px;
    font-weight: bold;
    margin: 30px;

}
.arrow1{
    display: none;
}
.arrow{
    display: inline-block;
    position: absolute;
    z-index: 13;
    left:1374px;
    top: 200px;
}
.a-content{
    background: white;
    position:relative;
    margin-top:10px;
    border-radius: 10px;
    padding:40px  20px;
    text-align: center;
    box-shadow: 0px 0px 5px ;
}



@keyframes mymove{
    0%{ left: 60 ; }
    50%{ left: 0 ; }
    100%{ left: 60 ; }
}