img {
    width: 100%;
    height: 100%;


}

#email{

    display: flex;
    position: absolute;
    top: 220px;  
    width: 300px;
    left: 25px;
    height:40px;
    border-radius: 10px;

}


#senha{

    display: flex;
    position: absolute;
    top: 310px;  
    width: 300px;
    left: 25px;
    height: 40px;
    border-radius: 10px;
    
    
   

}


button {
  
    position: absolute;
    top: 420px;
    left: 28px;
    width: 305px;
    height: 46px;
    border-radius: 20px;
    color: white;
    background-color: rgb(56, 56, 172);
    border: none;
    
    
    
    


}



@media screen and (min-width: 320px) {
    .cpf{
        display: flex;
        position: absolute;
        top: 180px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 260px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 345px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
}



@media screen and (min-width: 360px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 190px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 270px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 385px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}


@media screen and (min-width: 375px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 190px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 280px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 385px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}


@media screen and (min-width: 384px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 200px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 290px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 405px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    




@media screen and (min-width: 390px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 200px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 290px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 405px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    

@media screen and (min-width: 393px){

    .cpf{
        display: flex;
        position: absolute;
        top: 200px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 290px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 405px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    




@media screen and (min-width: 412px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 230px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 330px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 465px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    



@media screen and (min-width: 414px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 225px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 320px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 445px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    
    


@media screen and (min-width: 428px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 220px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 320px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 445px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    


@media screen and (min-width: 430px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 215px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 310px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 435px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    

@media screen and (min-width: 440px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 225px;
        left: 28px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 329px;
        left: 28px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 459px;
        width: 160px;
        height: 20px;
        align-items: center;
        left: 35px;
        text-indent: 60px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    



@media screen and (min-width: 768px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 398px;
        left: 54px;
        width: 260px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 580px;
        left: 54px;
        width: 260px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 835px;
        width: 230px;
        height: 35px;
        align-items: center;
        left: 80px;
        text-indent: 90px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    


@media screen and (min-width: 800px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 415px;
        left: 54px;
        width: 260px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 610px;
        left: 54px;
        width: 260px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 835px;
        width: 230px;
        height: 35px;
        align-items: center;
        left: 80px;
        text-indent: 90px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    

@media screen and (min-width: 820px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 425px;
        left: 54px;
        width: 260px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 620px;
        left: 54px;
        width: 260px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 875px;
        width: 230px;
        height: 35px;
        align-items: center;
        left: 80px;
        text-indent: 90px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    


@media screen and (min-width: 834px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 435px;
        left: 54px;
        width: 260px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 630px;
        left: 54px;
        width: 260px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 875px;
        width: 230px;
        height: 35px;
        align-items: center;
        left: 80px;
        text-indent: 90px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}
    


@media screen and (min-width: 884px) {


    .cpf{
        display: flex;
        position: absolute;
        top: 445px;
        left: 54px;
        width: 260px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 659px;
        left: 54px;
        width: 260px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 990px;
        width: 240px;
        height: 35px;
        align-items: center;
        left: 80px;
        text-indent: 90px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}


@media screen and (min-width: 1114px) {


    .cpf{
        display: flex;
        position: absolute;
        top: 590px;
        left: 71px;
        width: 300px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 840px;
        left: 71px;
        width: 300px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 990px;
        width: 290px;
        height: 35px;
        align-items: center;
        left: 80px;
        text-indent: 120px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}

@media screen and (min-width: 1280px) {

    .cpf{
        display: flex;
        position: absolute;
        top: 650px;
        left: 82px;
        width: 330px;
        
        

    }

    .senha{
        display: flex;
        position: absolute;
        top: 960px;
        left: 82px;
        width: 330px;
       
    }
    

    .button{
        display: flex;
        position: absolute;
        top: 1400px;
        width: 290px;
        height: 35px;
        align-items: center;
        left: 100px;
        text-indent: 120px;
        font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        background-color:  #006887;
        
    }
        
    
    
}