body {
  background: rgb(2,84,94);
  background: linear-gradient(90deg, rgba(2,84,94,1) 7%, rgba(11,143,153,1) 100%);
  font-family: 'Open Sans', sans-serif !important;
}

.login-title{
  font-size: 1.8em;
  color:#fff;
  font-weight: 300;
}

.login-body{
  background-color: #fff;
  padding: 3%;
  border-radius: 5px;
}

.login-subtitle{
  font-size: 1.3em;
  color:#fff;
  font-weight: 400;
  padding: 1%;

}

.login-text{
  font-size: 0.8em;
  color:#fff;
  font-weight: 300;
  padding-bottom:2%;

}

.login-row-link{
  padding-top:3%;
}


.login-link {
  font-size: 0.7em;
  color:#fff;
  font-weight: 300;
  width:100%;
  display:block;
  text-decoration: none;
}

a:hover.login-link{
  color:#ccc;
}

.footer a:visited {
  color: #ffffff;
}

.footer a {
  color: #ffffff;
}

.logout-body{
  background-color: #fff;
  padding: 3%;
  border-radius: 5px;
}

/* Usada por js/logout.js de SimpleSAMLphp (Bootstrap 5 no la define). */
.hidden {
  display: none !important;
}

/* Botón de registro de la página de login (antes era un estilo inline). */
.btn-register {
  background-color: #00884b;
  border: none;
}

.btn-register:hover {
  background-color: #006e3c;
}

/*
 * Estado de cada aplicación en el logout por iframes. js/logout.js de SimpleSAMLphp usa clases de
 * Font Awesome (fa-spin, fa-check-circle, fa-exclamation-circle), que acá se dibujan sin la fuente.
 * Una aplicación que no responde se muestra igual que una cerrada.
 */
.logout-icon {
  display: inline-block;
  flex: none;
  width: 1.1rem;
  height: 1.1rem;
  border: 2px solid #ced4da;
  border-radius: 50%;
}

.logout-icon.fa-spin {
  border-color: rgba(11, 143, 153, 0.25);
  border-top-color: rgb(11, 143, 153);
  animation: logout-spin 0.8s linear infinite;
}

.logout-icon.fa-check-circle,
.logout-icon.fa-exclamation-circle {
  position: relative;
  border-color: #198754;
  background-color: #198754;
  animation: none;
}

.logout-icon.fa-check-circle::after,
.logout-icon.fa-exclamation-circle::after {
  content: "";
  position: absolute;
  left: 0.3rem;
  top: 0.12rem;
  width: 0.3rem;
  height: 0.55rem;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}

@keyframes logout-spin {
  to {
    transform: rotate(360deg);
  }
}


/* Página intermedia de envío a la aplicación (post.twig). */
.post-body {
  margin-top: 10vh;
}

.post-spinner {
  width: 3rem;
  height: 3rem;
  color: rgb(11, 143, 153);
}