/* Paleta de colores */
:root {
    --color-primario: #ffffff;
    --color-secundario: #e20613;
    --color-terciario: #550404;
    --color-texto-general: #F2F2F2;
  }
  
  body {
    background-color: var(--color-primario);
    color: var(--color-texto-general);
    margin: 0;
    padding: 0;
    font-family: sans-serif;
  }
  
  .navbar {
    background-color: var(--color-secundario);
  }
  
  .navbar-brand,
  .nav-link {
    color: var(--color-texto-general) !important;
  }
  
  .jumbotron {
    background-color: var(--color-terciario);
    padding: 2rem 1rem;
    border-radius: 0.5rem;
  }
  
  .jumbotron h1 {
    color: var(--color-texto-general);
  }
  
  /* Footer General */
  footer {
    background-color: var(--color-secundario);
    color: #F2F2F2;
    padding: 20px 0;
    text-align: center;
  }
  
  /* Estilos para columnas del footer */
  .footer-column h5 {
    color: var(--color-texto-general);
    margin-bottom: 10px;
  }
  
  .footer-column a {
    color: var(--color-texto-general);
    text-decoration: none;
  }
  
  .footer-column a:hover {
    color: #D9756C;
  }
  
  .footer-social-vertical li {
    margin-bottom: 10px;
  }
  
  /* Separador y margen para la declaración de derechos */
  .footer-bottom {
    margin-top: 20px;
    border-top: 1px solid #ccc;
    padding-top: 10px;
  }
  
  /* Otros estilos */
  .card {
    background-color: var(--color-terciario);
    border: none;
    border-radius: 0.5rem;
  }
  
  .card-title,
  .card-text {
    color: var(--color-texto-general);
  }
  
  .btn-primary {
    background-color: var(--color-secundario);
    border-color: var(--color-secundario);
  }
  
  .list-group-item {
    background-color: var(--color-terciario);
    border: none;
    color: var(--color-texto-general);
  }
  
  .list-group-item-action:hover {
    background-color: var(--color-secundario);
    color: var(--color-texto-general);
  }
  
  /* Estilo para el logo en la navbar */
  .logo-img {
    height: 40px;
    margin-right: 10px;
    vertical-align: middle;
  }
  
  /* HTML, body y #wrap para sticky footer */
  html,
  body {
    height: 100%;
    margin: 0;
  }
  
  #wrap {
    min-height: 100%;
    display: flex;
    flex-direction: column;
  }
  
  /* Área principal de contenido */
  #main {
    flex: 1;
    width: 100%;
  }
  
  .main-image {
    position: relative;
    height: 100%;
    width: 100%;
    overflow: hidden;
  }
  
  .main-image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
  }
  
  /* Formulario de Suscripción */
  .subscription-form {
    max-width: 600px;
    margin: 20px auto;
    text-align: center;
  }
  
  #mail {
    color: white;
    font-family: 'League Gothic', sans-serif;
    font-size: 1.2rem;
  }
  
  #portada {
    width: 100%;
  }
  
  /* Otros estilos opcionales */
  .row-content {
    display: flex;
    flex-grow: 1;
  }
  
  .block {
    flex-basis: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  

  .block-2 {
    display: flex;
    align-content: center;
  }
  
  .block-full-width {
    background-color: #343a40;
    color: white;
    width: 100%;
    padding: 40px 0;
    text-align: center;
  }
  
  h2,
  p {
    margin: 0;
  }

  
  #footerresourses {
font-size: small;
text-decoration: underline;


  }
  
.list-unstyled{ 

    font-size: small;

  }