@font-face { font-family: 'Roboto'; src: url('../fonts/Roboto-Regular.ttf') format('truetype') }
body, input, select { font-family: 'Roboto' !important; color: #333; }
body { height: 100vh; }

.container { justify-items: center; }
.logo { height: 120px; }
.fondo-animado { background: linear-gradient(45deg, #97ca3d, #01abb8, #af1fc5, #fdb71a); background-size: 500% 500%; animation: cambiarFondo 15s ease-in-out infinite; z-index: -1; }

@keyframes cambiarFondo {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* pie de página */
.piePagina { position: fixed; color: white; width: 100%; bottom: 0; text-align: center; font-size: 11.7px; padding-top: 0px; background:; z-index: 500; right: 0; box-sizing: initial; }
.piePagina { -webkit-transition: height 500ms; -moz-transition: height 500ms; -o-transition: height 500ms; -ms-transition: height 500ms; transition: height 500ms; -webkit-transition-delay: 1s; -moz-transition-delay: 1s; -o-transition-delay: 1s; -ms-transition-delay: 1s; transition-delay: 1s; }
    .piePagina a { color: #cbcbcb; }

.text-danger { color: #fbb7be !important; margin-top: 1.5rem; }