.smartpass-container {
    max-width: 100%;
    background-color: #E1E1E1;
    -webkit-box-shadow: 0px 8px 20px 0px rgb(0 0 0 / 15%);
    -moz-box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.15);
    box-shadow: 0px 8px 20px 0px rgb(0 0 0 / 15%);
    width: 100%;
    display: table;
}
.card-pf {
    box-shadow: none;
    border: none;
    display: table-cell;
    background: #F4F4F4;
    background-image: url('../home-grafismos-esquerda.svg'), url('../home-grafismos-direita.svg');
    background-repeat: no-repeat, no-repeat;
    background-position: left bottom, right bottom;
    height: calc(100vh - 1.25rem);
    padding-top: 3%;
}
.login-pf-header {
    border-radius: 0.875rem 0.875rem 0px 0px !important;
    align-items: center;
    padding: 2.25rem;
    min-width: 20rem;
    max-width: 26rem;
    /* height: 250px; */
    margin: 0 auto;
    background-color: #ffffff;
    margin-bottom: -9px !important;
}
#kc-content {
    border-radius: 0.875rem !important;
    padding: 1.25rem;
    min-width: 20rem;
    max-width: 56rem;
    margin: 0 auto;
    background-color: #ffffff;
}
.img-fluid {
    max-width: 80%;
    height: auto;
}
.rodape {
    text-align: center;
    min-width: 20rem;
    max-width: 26rem;
    margin: 0 auto;
}

@media (max-width: 575px) {
    .card-pf{
        padding-top: 47%!important;
        padding-bottom: 47%!important;
        background-image: url('../grafismo-mobile-top.svg'), url('../grafismo-mobile-bottom.svg');
        background-repeat: no-repeat, no-repeat;
        background-position: left top, right bottom;
    }
}
@media (max-width: 375px) {
    .card-pf{
        padding-top: 25%!important;
        padding-bottom: 25%!important;
        background-image: url('../grafismo-mobile-top.svg'), url('../grafismo-mobile-bottom.svg');
        background-repeat: no-repeat, no-repeat;
        background-position: left top, right bottom;
    }
}