body {
    background-color: #F8F9FD;
    display: flex;
    flex-direction: column;
    height: 100vh;
    font-family: 'Roboto', sans-serif;
}

header,
.btn {
    background-color: var(--color-principal);
    color: white !important
}

.logo {
    max-width: 30rem;
    max-height: 30rem;
}

.btn:hover {
    color: white;
    background-image: linear-gradient(rgba(0, 0, 0, 0.1) 0 0)
}

.btn.default {
    color: #666 !important
}

.btn-outline,
.btn-secondary {
    border: 1px solid var(--color-principal);
    background: white;
    color: var(--color-principal) !important
}

.btn-outline:hover,
.btn-secondary:hover {
    background: var(--color-principal) !important;
    color: white !important
}

label.error {
    display: inline;
    color: #EF6F93;
    margin-top: 2px
}

.container {
    padding: 50px;
}

.botonera {
    display: flex;
    flex-direction: column;
    gap: 22px;
}

textarea {
    resize: vertical;
}

.descripcion {
    margin-top: 0;
}

.modal-body {
    padding: 22px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.modal-body .form-group {
    margin-bottom: 22px
}

.caja {
    padding: 20px;
    margin: 10px 0;
    background-color: white;
}

.texto-politica {
    max-height: calc(100vh - 212px);
    overflow-y: auto;
}

.page-footer {
    display: flex;
    align-items: end;
    height: 100vh;
    color: white
}

.page-footer .container {
    width: 100%;
    padding: 10px 0 10px 20px;
    background: #4b4b4b
}