/* ============================================================
   SIGN-IN
   ============================================================ */


#sign-in-row
{
    min-height: 100vh;
}

/* accesso come pagina del sito: header e footer intorno, il footer resta in fondo anche sugli schermi alti */
.sign-in-page
{
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.sign-in-page #sign-in-main
{
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 72px 0 56px; /* in alto c'è anche l'onda dell'header */
}

.sign-in-page #sign-in-main > .container
{
    width: 100%; /* dentro il flex il margine automatico lo stringerebbe sul contenuto */
}

.sign-in-page #sign-in-row
{
    min-height: 0;
}

.sign-in-page #sign-in-card h2
{
    font-size: 1.75rem;
}

#sign-in-logo-wrap
{
    margin: -24px auto 24px auto;
    text-align: center;
}

#sign-in-logo
{
    width: 110px;
    height: auto;
    margin: auto
}

#sign-in-card
{
    border-radius: 4px;
}

/* Badge "Registrazione gratuita" (sign-up BellMaker) */
#info-gratis-wrap
{
    display: flex;
    justify-content: flex-end;
}

#sign-in-card #info-gratis-reg
{
    background-color: var(--color-accent-dark);
    color: var(--color-white);
    padding: 4px 16px;
    border-radius: 100px;
    font-size: 0.85rem;
}
@media (min-width: 768px)
{
    #sign-in-logo
    {
        width: 120px;
    }
}
@media (min-width: 1024px)
{
    #sign-in-logo
    {
        width: 125px;
    }
    #sign-in-card {
  max-width: 460px;
}
}
@media (min-width: 1420px)
{
    #sign-in-logo
    {
        width: 130px;
    }
}
@media (min-width: 1720px)
{
    #sign-in-logo-wrap
{
    margin: -32px auto 32px auto;
}
    #sign-in-logo
    {
        width: 135px;
    }
}