@charset "utf-8";

/* Global Styles */
a:hover {
  color: rgba(255, 255, 255, 1.00);
}

/*header*/
header {
  font-family: "Poppins Bold";
  font-size: 16px;
  font-style: normal;
  padding-top: 0px;
}

/* Logo placeholder*/
#logo {
  float: left;
  width: 20%;
  text-align: center;

}

/* div for Links in header */
#headerLinks {
  float: left;
  width: 55%;
  padding-top: 30px;
  padding-bottom: 30px;
  background-color: rgba(255, 255, 255, 1.00);
  font-family: 'Poppins Medium';
  text-align: center;
  align-content: center;
}

/* Links in header */
#headerLinks a {
  text-decoration: none;
  color: #000000;
  padding-left: 5%;
  font-size: 20px;
  align-content: center;
  text-align: center;
}

#redes {
  float: left;
  width: 20%;
  align-content: center;
  padding-bottom: 20px;
  padding-top: 20px;
  padding-left: 2%;
}

/* Offer text banner*/
#offer {
  margin-top: 110px;
  padding-top: 50px;
  font-family: 'Poppins ExtraBold';
  color: #228E85;
  font-size: 100px;
  text-align: center;
  line-height: 2PX;
}


#mainWrapper {
  width: 80%;
  padding-left: 10%;
  padding-right: 10%;
}

footer {
  width: 100%;
  clear: both;
  overflow: auto;
  align-content: center;
  line-height: 1.8;
  padding-top: 22px;
  padding-left: 2%;
  padding-bottom: 22px;
}

/* Links in footer */
footer div a {
  color: rgba(146, 146, 146, 1.00);
}

footer img {
  width: 32.8%;
  padding-left: 0.25%;
}


@media (max-width: 800px) {

  /* Header: logo, links y redes en columna */
  #logo,
  #headerLinks,
  #redes {
    float: none;
    width: 100%;
    text-align: center;
    padding: 10px 0;
  }

  /* Links del header en bloque */
  #headerLinks a {
    display: block;
    font-size: 26px;
    padding: 8px 0;
  }

  /* Oferta más compacta */
  #offer {
    margin-top: 10px;
    padding-top: 10px;
    font-size: 66px;
    line-height: 1.2;
  }

  /* Ajustar ancho del contenedor principal */
  #mainWrapper {
    width: 100%;
    padding: 0 10px;
  }

  /* Footer en columnas verticales */
  #footer div {
    float: none;
    width: 100%;
    text-align: center;
    padding: 10px 0;
  }

  footer div a {
    display: block;
    font-size: 24px;
    padding: 5px 0;
  }

  footer img {
    width: 600px;
  }

}

/* Adaptación responsive para pantallas <= 480px */
@media (max-width: 600px) {

  /* Header: logo, links y redes en columna */
  #logo,
  #headerLinks,
  #redes {
    float: none;
    width: 100%;
    text-align: center;
    padding: 10px 0;
  }

  /* Links del header en bloque */
  #headerLinks a {
    display: block;
    font-size: 16px;
    padding: 8px 0;
  }

  /* Oferta más compacta */
  #offer {
    margin-top: 40px;
    padding-top: 20px;
    font-size: 36px;
    line-height: 1.2;
  }

  /* Ajustar ancho del contenedor principal */
  #mainWrapper {
    width: 100%;
    padding: 0 10px;
  }

  /* Footer en columnas verticales */
  #footer div {
    float: none;
    width: 100%;
    text-align: center;
    padding: 10px 0;
  }

  footer div a {
    display: block;
    font-size: 14px;
    padding: 5px 0;
  }

  footer img {
    width: 250px;
  }
}