:root {
  /*General*/
  --general-bg1-color: #fff;
  --general-bg2-color: #ededdd;
  --color-principal: #178700;
  --color-secundario: #7a995c;

  /*Textos*/
  --color-texto1: #fff;
  --color-texto2: #000000;
  --color-extra: #3E561F;
  --ver-mas: #00a6aa;
  --menu-footer: "Arial Black", sans-serif;
  --titulos: "Impact", sans-serif;
  --texto: "Arial", sans-serif;
}

/*Contenido*/
body {
  background-color: var(--general-bg1-color);
  margin: 0;
  padding: 0;
}

.body-main {
  background-color: var(--general-bg2-color);
  margin: 0 40px;
  top: 0;
}

.top-content {
  display: flex;
  flex-direction: row;
  height: 700px;
}

/*esquina en angulo aside-links*/
.triangulo {
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0px 61px 58px 0;
  border-color: transparent var(--color-principal) transparent transparent;
  transform: rotate(90deg);
  background: var(--general-bg2-color);
  background: linear-gradient(127deg,
      var(--color-principal) 6%,
      var(--color-principal) 7%);
  position: absolute;
  z-index: 1;
  right: -4px;
  margin-top: 2px;
}

.triangulo2 {
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0px 61px 58px 0;
  border-color: transparent var(--general-bg2-color) transparent transparent;
  transform: rotate(90deg);
  background: linear-gradient(127deg,
      var(--general-bg2-color) 6%,
      var(--general-bg2-color) 7%);
  position: absolute;
  z-index: 2;
  right: -6px;
  top: 5px;
}

/* esquina en angulo flag links*/
.triangulo3 {
  position: absolute;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 80px 100px 0px 0;
  border-color: transparent var(--general-bg2-color) transparent transparent;
  transform: rotate(90deg);
  left: -20px;
}

.titulo1 {
  font-family: var(--titulos);
  font-size: calc(1vh + 1vw);
  font-weight: 400;
  text-align: end;
  /* margin-left: 5px; */
  text-transform: uppercase;
}

.titulo2 {
  font-family: var(--texto);
  font-size: calc(1.8vh + 1.8vw);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: -3px;
  padding-right: calc(20px + 3px);
}

.esquina-externa {
  position: absolute;
  z-index: 2;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 30px 15px 0 0px;
  border-color: var(--color-secundario) transparent transparent transparent;
  transform: rotate(0deg);
  right: 0;
  bottom: -27px;
}

/*esquina triangular flag destacados*/
.triangulo4 {
  position: absolute;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0px 15px 33px 0;
  border-color: transparent var(--color-principal) transparent transparent;
  transform: rotate(0deg);
  z-index: 2;
  top: 50px;
  left: -14px;
}

/*borde flag noticias*/
.triangulo5 {
  position: absolute;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 23px 17px 0px;
  border-color: transparent transparent var(--color-principal) transparent;
  transform: rotate(270deg);
  z-index: 2;
  top: -18px;
  left: -3px;
}


/*Scrolls bars*/
*::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}
*::-webkit-scrollbar-track {
  border-radius: 5px;
  background-color: var(--color-secundario);
}

*::-webkit-scrollbar-track:hover {
  background-color: var(--color-secundario);
}

*::-webkit-scrollbar-track:active {
  background-color: var(--color-secundario);
}

*::-webkit-scrollbar-thumb {
  border-radius: 5px;
  background-color: var(--color-principal);
}

*::-webkit-scrollbar-thumb:hover {
  background-color: var(--general-bg1-color);
}

*::-webkit-scrollbar-thumb:active {
  background-color: var(--general-bg1-color);
}