.card-form{
    margin-top: 4rem;
    width: 40%;
}
.row{
    padding: 0;
    margin: 0;
}
.login-info{
    margin-top: 1.9rem;
}
.pad-form{
    padding: 2rem 4rem;
}
input::placeholder{
    font-size: 12px;
}
a:hover{
    text-decoration: underline;
}
.next:hover{
    background:#0e5035 !important ;
}
.confirm:hover{
    background:#0e5035 !important ;
}
.card-bottom{
    width: 28%;
}
@media screen and (max-width: 576px) {
   
    .login-info{
        text-align: center;
        margin-top: 0.1rem;
        padding: 0 2rem;
    }
    .pad-form{
        padding: .4rem;
    }
    .card-bottom{
        width: 90%;
    }
    .card-form{
        margin-top: 1rem;
        width: 100%;
    }
  }
  @media screen and (max-width: 576px ) {
    .card-form{
        width: 100%;
    }
    .clav{
        width: 50px; height: 50px; 
    }
    
  }
  @media screen and (min-width: 576px ) {
    .card-form{
        width: 100%;
    }
    .clav{
        width: 50px; height: 50px; 
    }
  }
  @media screen and (min-width: 768px ) {
    .card-form{ 
        width: 70%;
    }
    .clav{
        width: 50px; height: 50px; 
    }
  }
  @media screen and (min-width: 992px ) {
    .card-form{ 
        width: 60%;
    }
    .clav{
        width: 50px; height: 50px; 
    }
  }
  @media screen and (min-width: 1320px ) {
    .card-form{ 
        width: 41%;
    }
    .clav{
        width: 50px; height: 50px; 
    }
  }