/* General: estilos generales para la página */
section {
  padding: 1%;
  background: white;
}

@font-face {
  font-family: "NotoSans-Light";
  src: url("ttf/NotoSans-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: "NotoSans-Medium";
  src: url("ttf/NotoSans-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: "NotoSans-Thin";
  src: url("ttf/NotoSans-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: "NotoSans-ThinItalic";
  src: url("ttf/NotoSans-ThinItalic.ttf") format("truetype");
  font-weight: 100;
  font-style: italic;
}

body {
  font-family: "NotoSans-Light", "NotoSans-Medium", "NotoSans-Thin", "NotoSans-ThinItalic";
  background-color: #f4f4f9;
  margin: 0;
  padding: 0;
}

header form label {
  font-size: clamp(12px, 1.5vw, 18px);
}

#loginDropdown,
#logoHeader {
  font-family: "NotoSans-Medium" !important;
  font-size: clamp(17px, 2vw, 23px);
}

a.red {
  color: #9b2247 !important;
  font-size: clamp(12px, 1.5vw, 18px);
}

.bgcolor-btn {
  background-color: #9b2247;
  color: #fff;
  font-size: clamp(12px, 1.5vw, 18px);
}

.bgcolor-btn:hover {
  background-color: #9b2247;
  color: #fff;
  opacity: 0.7;
}

.footer-red {
  background-color: #611232;
  height: clamp(30px, 3vw, 200px);
}

.header-red {
  background-color: #611232;
  height: clamp(30px, 7vw, 700px);
  color: #fff;
}

.bg-header-verde {
  background-color: #002f2a;
  height: clamp(10px, 5vw, 70px);
}

.section-line {
  border: 0;
  height: clamp(3px, 0.7vw, 7px);
  background-color: #410d1d;
  opacity: 1;
  /* Asegura que el color sea sólido */
}

#content{
  background-color: #fff;
}