﻿*    Titulo: Error.css
*    Desripcion: Estilos para la pagina Error
******************************************************************************/
/*======================*/

/* Estilo general de body y html */
html, body {
    height: 100%;
    overflow-x: hidden;
}

h1 {
    font-family: Lato;
    font-weight: 500;
    font-style: Medium;
    font-size: 24px;
    leading-trim: NONE;
    line-height: 24px;
    letter-spacing: 0%;
    text-align: center;
}

h2{
    font-family: Lato;
    font-weight: 700;
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 1em;
    text-align: center;
    text-decoration: underline;
    text-decoration-style: solid;
    text-decoration-thickness: 0%;
    text-decoration-skip-ink: auto;
}

p{
    font-family: Lato;
    font-weight: 500;
    font-style: Medium;
    font-size: 16px;
    leading-trim: NONE;
    line-height: 24px;
    letter-spacing: 0%;
    text-align: center;

}

a{
  text-decoration: underline;
  color:#006150;
}

/* Contenedor que usa Flexbox para distribuir el contenido verticalmente */
.wrapper {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Main centrado */
.main {
    flex: 1; /* Ocupa todo el espacio disponible entre header y footer */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    gap: 3em;
      
}

/* Div con fondo centrado */
.backgroundDiv{
    width:65.563em;
    height:35.375;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    gap: 3em;
    background-color:#FFFFFF;
      
}

/* Footer siempre al final */
.footer {
    background-color: #00A76A !important;
    color: #fff;
    text-align: center;
    padding: 1rem;
}

/* Display flex con contenido centrado */
.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Display flex con contenido en columna */
.flex-column{
    display: flex;
    flex-direction: column;
}

/* Borde negro con tamaño máximo limitado en ancho */
.frame{
    max-width: 560px;
    opacity: 1;
    gap: 24px;
    border-width: 1px;
    padding: 24px;
    border: 1px solid #000000;
}

/* Logo de Avant Money by bankinter */
.logo{
    width: 100px;
    height: 50px;
}

/* gap de 1.5em*/
.g1-5 {
    gap: 1.5em;
}

/* Aplica margin bottom 1em*/
.mb-1{
    margin-bottom: 1em; 
}

/* Aplica margin bottom 2em*/
.mb-2{
    margin-bottom: 2em; 
}

/* Estilo para el texto de nota de pie */
.footnote{
    font-family: Lato;
    font-weight: 500;
    font-style: Medium;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: 0%;
    text-align: center;

}

.footerError{
    color:#FFFFFF !important;
    text-decoration:none !important;

}
.secondPartFooter{
    top: 1.1em;
    border-left: 1px solid white;
    padding-left: 2em;

}

