:root {
  --blanco1: #fff;
  --blanco2: #f2f2f2;
  --negro1: #000;
  --negro2: #202122;
  --negro3: #393a3b;
  --gris1: #484d4f;
  --gris2: #7b7b7b;
  --celeste1: #61a5d8;
  --celeste2: #73c4ea;
  --celeste3: #54719b;
  --celeste4: #2a4470;
  --rojo1: #ca262c;
  --anchoDesktop: 1280px;
  --ingElectronica: #ca262c;
  --ingElectronica2: rgba(202,38,44,0.333);
  --ingQuimica: #5a7992;
  --ingQuimica2: rgba(90,121,146,0.333);
  --ingSistemas: #d0b130;
  --ingSistemas2: rgba(208,177,48,0.333);
  --ingIndustrial: #11336f;
  --ingIndustrial2: rgba(17,51,111,0.333);
  --tecUniProgramacion: #961b57;
  --tecUniProgramacion2: rgba(150,27,87,0.333);
  --espIngAmb: #bcc936;
  --espIngAmb2: rgba(188,201,54,0.333);
  --maestriaAdminNeg: #e3af6a;
  --maestriaAdminNeg2: rgba(227,175,106,0.333);
  --ingElectromecanica: #744c71;
  --ingElectromecanica2: rgba(116,76,113,0.333);
  --licAdminRural: #3e865a;
  --licAdminRural2: rgba(62,134,90,0.333);
  --espDocUni: #121919;
  --espDocUni2: rgba(18,25,25,0.333);
  --espEneEle: #87a7c8;
  --espEneEle2: rgba(135,167,200,0.333);
  --espSegHig: #a2a19c;
  --espSegHig2: rgba(162,161,156,0.333);
  --espIngGer: #ca851e;
  --espIngGer2: rgba(202,133,30,0.333);
}
.c1 {
  color: var(--blanco2) !important;
}
body.ingElectronica .shape-1 {
  filter: hue-rotate(140deg) blur(2px);
}
body.ingElectronica .shape-2 {
  filter: hue-rotate(140deg) blur(4px);
}
body.ingElectronica section.main-careers {
  background-color: var(--ingElectronica) !important;
}
body.ingElectronica section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.ingElectronica section .btn1 {
  color: var(--ingElectronica) !important;
}
body.ingElectronica section .arrow-down {
  filter: saturate(0);
}
body.ingElectronica section .pin-degree .indicator {
  background-color: var(--ingElectronica) !important;
}
body.ingElectronica section .pin-degree:hover a {
  background-color: var(--ingElectronica) !important;
}
body.ingElectronica section:not(:first-of-type) h1 {
  color: var(--gris1) !important;
}
body.ingElectronica section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--ingElectronica);
}
body.ingElectronica .pin-grupo-investigacion .image:before {
  background-image: url("/assets/images/carreras/electromecanica.jpg");
}
body.ingIndustrial section.main-careers {
  background-color: var(--ingIndustrial) !important;
}
body.ingIndustrial section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.ingIndustrial section .btn1 {
  color: var(--ingIndustrial) !important;
}
body.ingIndustrial section .arrow-down {
  filter: saturate(0);
}
body.ingIndustrial section .pin-degree .indicator {
  background-color: var(--ingIndustrial) !important;
}
body.ingIndustrial section .pin-degree:hover a {
  background-color: var(--ingIndustrial) !important;
}
body.ingIndustrial section:not(:first-of-type) h1 {
  color: var(--gris1) !important;
}
body.ingIndustrial section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--ingIndustrial);
}
body.ingIndustrial .pin-grupo-investigacion .image:before {
  background-image: url("/assets/images/carreras/industrial.jpg");
}
body.ingSistemas .shape-1 {
  filter: hue-rotate(200deg) blur(2px);
}
body.ingSistemas .shape-2 {
  filter: hue-rotate(200deg) blur(4px);
}
body.ingSistemas section.main-careers {
  background-color: var(--ingSistemas) !important;
}
body.ingSistemas section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.ingSistemas section .btn1 {
  color: var(--ingSistemas) !important;
}
body.ingSistemas section .arrow-down {
  filter: saturate(0);
}
body.ingSistemas section .pin-degree .indicator {
  background-color: var(--ingSistemas) !important;
}
body.ingSistemas section .pin-degree:hover a {
  background-color: var(--ingSistemas) !important;
}
body.ingSistemas section:not(:first-of-type) h1 {
  color: var(--gris1) !important;
}
body.ingSistemas section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--ingSistemas);
}
body.ingSistemas .pin-grupo-investigacion .image:before {
  background-image: url("/assets/images/carreras/sistemas.jpg");
}
body.ingQuimica .shape-1 {
  filter: hue-rotate(328deg) blur(2px);
}
body.ingQuimica .shape-2 {
  filter: hue-rotate(328deg) blur(4px);
}
body.ingQuimica section.main-careers {
  background-color: var(--ingQuimica) !important;
}
body.ingQuimica section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.ingQuimica section .btn1 {
  color: var(--ingQuimica) !important;
}
body.ingQuimica section .arrow-down {
  filter: saturate(0);
}
body.ingQuimica section .pin-degree .indicator {
  background-color: var(--ingQuimica) !important;
}
body.ingQuimica section .pin-degree:hover a {
  background-color: var(--ingQuimica) !important;
}
body.ingQuimica section:not(:first-of-type) h1 {
  color: var(--gris1) !important;
}
body.ingQuimica section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--ingQuimica);
}
body.ingQuimica .pin-grupo-investigacion .image:before {
  background-image: url("/assets/images/carreras/quimica.jpg");
}
body.ingElectromecanica .shape-1 {
  filter: hue-rotate(115deg) blur(2px);
}
body.ingElectromecanica .shape-2 {
  filter: hue-rotate(115deg) blur(4px);
}
body.ingElectromecanica section.main-careers {
  background-color: var(--ingElectromecanica) !important;
}
body.ingElectromecanica section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.ingElectromecanica section .btn1 {
  color: var(--ingElectromecanica) !important;
}
body.ingElectromecanica section .arrow-down {
  filter: saturate(0);
}
body.ingElectromecanica section .pin-degree .indicator {
  background-color: var(--ingElectromecanica) !important;
}
body.ingElectromecanica section .pin-degree:hover a {
  background-color: var(--ingElectromecanica) !important;
}
body.ingElectromecanica section:not(:first-of-type) h1 {
  color: var(--gris1) !important;
}
body.ingElectromecanica section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--ingElectromecanica);
}
body.ingElectromecanica .pin-grupo-investigacion .image:before {
  background-image: url("/assets/images/carreras/electronica.jpg");
}
body.licAdminRural .shape-1 {
  filter: hue-rotate(269deg) blur(2px);
}
body.licAdminRural .shape-2 {
  filter: hue-rotate(269deg) blur(4px);
}
body.licAdminRural section.main-careers {
  background-color: var(--licAdminRural) !important;
}
body.licAdminRural section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.licAdminRural section .btn1 {
  color: var(--licAdminRural) !important;
}
body.licAdminRural section .arrow-down {
  filter: saturate(0);
}
body.licAdminRural section .pin-degree .indicator {
  background-color: var(--licAdminRural) !important;
}
body.licAdminRural section .pin-degree:hover a {
  background-color: var(--licAdminRural) !important;
}
body.licAdminRural section:not(:first-of-type) h1 {
  color: var(--gris1) !important;
}
body.licAdminRural section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--licAdminRural);
}
body.licAdminRural .pin-grupo-investigacion .image:before {
  background-image: url("/assets/images/carreras/lar.jpg");
}
body.tecUniProg .shape-1 {
  filter: hue-rotate(200deg) blur(2px);
}
body.tecUniProg .shape-2 {
  filter: hue-rotate(200deg) blur(4px);
}
body.tecUniProg section.main-careers {
  background-color: var(--tecUniProgramacion) !important;
}
body.tecUniProg section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.tecUniProg section .btn1 {
  color: var(--tecUniProgramacion) !important;
}
body.tecUniProg section .arrow-down {
  filter: saturate(0);
}
body.tecUniProg section .pin-degree .indicator {
  background-color: var(--tecUniProgramacion) !important;
}
body.tecUniProg section .pin-degree:hover a {
  background-color: var(--tecUniProgramacion) !important;
}
body.tecUniProg section:not(:first-of-type) h1 {
  color: var(--gris1) !important;
}
body.tecUniProg section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--tecUniProgramacion);
}
body.espSegHig .shape-1 {
  filter: hue-rotate(200deg) blur(2px);
}
body.espSegHig .shape-2 {
  filter: hue-rotate(200deg) blur(4px);
}
body.espSegHig section.main-careers {
  background-color: var(--espSegHig) !important;
}
body.espSegHig section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.espSegHig section .btn1 {
  color: var(--espSegHig) !important;
}
body.espSegHig section .arrow-down {
  filter: saturate(0);
}
body.espSegHig section .pin-degree .indicator {
  background-color: var(--espSegHig) !important;
}
body.espSegHig section .pin-degree:hover a {
  background-color: var(--espSegHig) !important;
}
body.espSegHig section:not(:first-of-type) h1 {
  color: var(--gris1) !important;
}
body.espSegHig section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--espSegHig);
}
body.espIngGer .shape-1 {
  filter: hue-rotate(200deg) blur(2px);
}
body.espIngGer .shape-2 {
  filter: hue-rotate(200deg) blur(4px);
}
body.espIngGer section.main-careers {
  background-color: var(--espIngGer) !important;
}
body.espIngGer section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.espIngGer section .btn1 {
  color: var(--espIngGer) !important;
}
body.espIngGer section .arrow-down {
  filter: saturate(0);
}
body.espIngGer section .pin-degree .indicator {
  background-color: var(--espIngGer) !important;
}
body.espIngGer section .pin-degree:hover a {
  background-color: var(--espIngGer) !important;
}
body.espIngGer section:not(:first-of-type) h1 {
  color: var(--espIngGer) !important;
}
body.espIngGer section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--espIngGer) !important;
}
body.espDocUni .shape-1 {
  filter: hue-rotate(200deg) blur(2px);
}
body.espDocUni .shape-2 {
  filter: hue-rotate(200deg) blur(4px);
}
body.espDocUni section.main-careers {
  background-color: var(--espDocUni) !important;
}
body.espDocUni section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.espDocUni section .btn1 {
  color: var(--espDocUni) !important;
}
body.espDocUni section .arrow-down {
  filter: saturate(0);
}
body.espDocUni section .pin-degree .indicator {
  background-color: var(--espDocUni) !important;
}
body.espDocUni section .pin-degree:hover a {
  background-color: var(--espDocUni) !important;
}
body.espDocUni section:not(:first-of-type) h1 {
  color: var(--espDocUni) !important;
}
body.espDocUni section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--espDocUni) !important;
}
body.espEneEle .shape-1 {
  filter: hue-rotate(200deg) blur(2px);
}
body.espEneEle .shape-2 {
  filter: hue-rotate(200deg) blur(4px);
}
body.espEneEle section.main-careers {
  background-color: var(--espEneEle) !important;
}
body.espEneEle section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.espEneEle section .btn1 {
  color: var(--espEneEle) !important;
}
body.espEneEle section .arrow-down {
  filter: saturate(0);
}
body.espEneEle section .pin-degree .indicator {
  background-color: var(--espEneEle) !important;
}
body.espEneEle section .pin-degree:hover a {
  background-color: var(--espEneEle) !important;
}
body.espEneEle section:not(:first-of-type) h1 {
  color: var(--espEneEle) !important;
}
body.espEneEle section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--espEneEle) !important;
}
body.espIngAmb .shape-1 {
  filter: hue-rotate(200deg) blur(2px);
}
body.espIngAmb .shape-2 {
  filter: hue-rotate(200deg) blur(4px);
}
body.espIngAmb section.main-careers {
  background-color: var(--espIngAmb) !important;
}
body.espIngAmb section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.espIngAmb section .btn1 {
  color: var(--espIngAmb) !important;
}
body.espIngAmb section .arrow-down {
  filter: saturate(0);
}
body.espIngAmb section .pin-degree .indicator {
  background-color: var(--espIngAmb) !important;
}
body.espIngAmb section .pin-degree:hover a {
  background-color: var(--espIngAmb) !important;
}
body.espIngAmb section:not(:first-of-type) h1 {
  color: var(--espIngAmb) !important;
}
body.espIngAmb section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--espIngAmb) !important;
}
body.maestriaAdminNeg .shape-1 {
  filter: hue-rotate(200deg) blur(2px);
}
body.maestriaAdminNeg .shape-2 {
  filter: hue-rotate(200deg) blur(4px);
}
body.maestriaAdminNeg section.main-careers {
  background-color: var(--maestriaAdminNeg) !important;
}
body.maestriaAdminNeg section.main-careers #title:after {
  border-bottom: 2px solid #fff;
}
body.maestriaAdminNeg section .btn1 {
  color: var(--maestriaAdminNeg) !important;
}
body.maestriaAdminNeg section .arrow-down {
  filter: saturate(0);
}
body.maestriaAdminNeg section .pin-degree .indicator {
  background-color: var(--maestriaAdminNeg) !important;
}
body.maestriaAdminNeg section .pin-degree:hover a {
  background-color: var(--maestriaAdminNeg) !important;
}
body.maestriaAdminNeg section:not(:first-of-type) h1 {
  color: var(--maestriaAdminNeg) !important;
}
body.maestriaAdminNeg section:not(:first-of-type) h1:after {
  border-bottom: 2px solid var(--maestriaAdminNeg) !important;
}
.bgcIngElectronica {
  background-color: var(--ingElectronica) !important;
}
.bgcIngQuimica {
  background-color: var(--ingQuimica) !important;
}
.bgcIngSistemas {
  background-color: var(--ingSistemas) !important;
}
.bgcIngIndustrial {
  background-color: var(--ingIndustrial) !important;
}
.bgcTecUniProgramacion {
  background-color: var(--tecUniProgramacion) !important;
}
.bgcEspIngAmbiental {
  background-color: var(--espIngAmb) !important;
}
.bgcMaestriaAdminNeg {
  background-color: var(--maestriaAdminNeg) !important;
}
.bgcIngElectromecanica {
  background-color: var(--ingElectromecanica) !important;
}
.bgcLicAdminRural {
  background-color: var(--licAdminRural) !important;
}
.bgcEspDocUni {
  background-color: var(--espDocUni) !important;
}
.bgcEspEneEle {
  background-color: var(--espEneEle) !important;
}
.bgcEspSegHig {
  background-color: var(--espSegHig) !important;
}
.bgcIngGer {
  background-color: var(--espIngGer) !important;
}
@font-face {
  font-family: "f1";
  src: url("../fonts/HelveticaNeue.ttf");
}
@font-face {
  font-family: "f2";
  src: url("../fonts/AgenorNeue-Regular.otf");
}
i {
  background-repeat: no-repeat;
  margin-right: 10px;
  width: 20px;
  height: 20px;
  background-size: contain;
  display: inline-block;
  top: 5px;
  position: relative;
}
i.user {
  background-image: url("../images/icons/user.svg");
}
body {
  margin: 0px;
  background-color: var(--blanco2);
  font-family: "Arial";
  font-size: 18px;
  color: var(--gris1);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
.desktop {
  display: inherit;
}
.mobile {
  display: none;
}
.ac {
  text-align: center;
}
.fr {
  float: right;
}
.cp {
  cursor: pointer;
}
.mt10 {
  margin-top: 10px;
}
.mt20 {
  margin-top: 20px;
}
.mt30 {
  margin-top: 30px;
}
.mt40 {
  margin-top: 40px;
}
.mt50 {
  margin-top: 50px;
}
.mt60 {
  margin-top: 60px;
}
.btn,
.btn1,
.btn2,
.btn3,
.dropdownContainer {
  cursor: pointer;
  display: inline-block;
}
.btn1 {
  background-color: var(--blanco2);
  border-radius: 100px;
  color: var(--celeste3);
  font-family: 'f2';
  font-size: 24px;
  line-height: 24px;
  padding: 24px 30px;
  text-decoration: none;
  margin: 0px 40px;
  transition: all 0.25s;
  position: relative;
  transform: scale(1);
}
.btn1:hover {
  transform: scale(1.05);
  color: var(--celeste1);
  background-color: var(--blanco1);
}
.btn2 {
  width: 90px;
  height: 40px;
  background-color: var(--gris1);
  font-family: 'f2';
  border-radius: 100px;
  display: flex;
  text-align: center;
  color: var(--blanco1);
  text-decoration: none;
  align-items: center;
  justify-content: center;
  position: absolute;
  right: 20px;
  bottom: 190px;
}
.btn3 {
  width: 165px;
  height: 40px;
  font-size: 16px;
  background-color: var(--celeste4);
  font-family: 'f2';
  border-radius: 4px;
  display: flex;
  text-align: center;
  color: var(--blanco1);
  text-decoration: none;
  align-items: center;
  justify-content: center;
}
.btn3:hover {
  background-color: var(--celeste3);
}
@media screen and (max-width: 1100px) {
  .desktop {
    display: none;
  }
  .mobile {
    display: inherit;
  }
}
.container,
header .main,
header .top nav,
section {
  max-width: var(--anchoDesktop);
  position: relative;
  margin: 0 auto;
}
header {
  position: absolute;
  top: 0px;
  width: 100vw;
  z-index: 3;
  margin: 0px;
  transition: all 0.1s;
}
header .top {
  background-color: var(--negro2);
  height: 36px;
  transition: opacity 0.2s;
  opacity: 1;
  position: absolute;
  top: 0px;
  width: 100%;
}
header .top .btn {
  color: var(--celeste1);
  font-family: "f1";
  font-size: 14px;
  font-weight: 100;
  padding: 0px;
  margin-left: 30px;
  line-height: 36px;
}
header .top .btn:hover {
  color: var(--celeste2);
}
header .top .btn i {
  filter: brightness(10);
}
header .main {
  transition: all 0.3s;
  top: 120px;
}
header .main .logo {
  cursor: pointer;
  float: left;
}
header .main .logo img {
  height: 80px;
  width: 470px;
  filter: brightness(0) invert(1);
}
header .main .btn {
  color: var(--blanco2);
  font-family: "f2";
  font-size: 20px;
  font-weight: 100;
  padding: 0px;
  margin-top: 10px;
  margin-left: 45px;
  line-height: 36px;
  transition: border 0.15s;
  border-bottom: 3px solid transparent;
  z-index: 0;
}
header .main .btn:hover,
header .main .btn.dd {
  color: var(--celeste2);
  border-bottom: 4px solid var(--celeste2);
}
header .main .btn:hover i,
header .main .btn.dd i {
  filter: brightness(2.8) saturate(10);
}
header .main .btn.active {
  color: var(--celeste1);
  border-bottom: 8px solid var(--celeste1);
}
header .main .btn.active .arrowDown:after {
  border: solid var(--celeste2);
  padding: 0;
  border-width: 0 4px 4px 0;
}
header .main .btn:first-child {
  margin-left: 0px;
}
header .main .desktop {
  position: relative;
}
header .main .desktop .btn:last-child {
  display: none;
}
.dropdownContainer {
  position: relative;
  display: inline-block;
  top: 100%;
  z-index: 1;
}
.dropdownContainer:hover {
  border: none !important;
}
.dropdownContainer .dropdownMenu {
  padding: 4px;
  background-color: var(--blanco1);
  max-width: 250px;
  width: 250px;
  position: absolute;
  transition: all 0.25s;
  right: 0px;
  border-radius: 4px 0px 4px 4px;
  opacity: 1;
  top: 120%;
  box-shadow: 0px 19px 24px rgba(0,0,0,0.1);
}
.dropdownContainer .dropdownMenu a {
  font-size: 16px;
  padding: 15px 12px;
  color: var(--gris1);
  background-color: transparent;
  display: block;
  border-radius: 4px;
  transition: all 0.25s;
  line-height: 20px;
}
.dropdownContainer .dropdownMenu a:hover,
.dropdownContainer .dropdownMenu a.active {
  color: var(--blanco1);
  background-color: var(--celeste1);
}
.dropdownContainer .close {
  opacity: 0;
  pointer-events: none;
  top: 90%;
}
header .main,
header .top nav {
  text-align: right;
}
header .main a,
header .top nav a {
  text-decoration: none;
}
.fixed {
  position: fixed;
  background-color: var(--blanco1);
  box-shadow: 0px 0px 30px rgba(0,0,0,0.3);
  height: 70px;
}
.fixed .dropdownMenu {
  top: 100% !important;
  border-radius: 0px 0px 4px 4px !important;
}
.fixed .top {
  opacity: 0;
  pointer-events: none;
}
.fixed .main {
  animation: headerIn 0.5s ease-in;
  top: 0px;
}
.fixed .main img {
  filter: none !important;
  height: 45px !important;
  width: 245px !important;
  position: relative;
  top: 12px;
}
.fixed .main .btn {
  color: var(--gris1);
  margin-top: 13px;
  padding-bottom: 0px;
  font-size: 18px;
}
.fixed .main .desktop .btn:last-child {
  display: inline-block;
}
.fixed .main .desktop .btn:last-child i {
  top: 1px;
}
.fixed .main .desktop .btn:last-child:hover i,
.fixed .main .desktop .btn:last-child.dd i,
.fixed .main .desktop .btn:last-child.active i {
  filter: brightness(2.8) saturate(10);
}
.fixed .arrowDown:after {
  border: solid var(--gris1);
  padding: 0;
  border-width: 0 4px 4px 0;
}
section {
  margin-bottom: 150px;
}
.shadow1,
iframe {
  box-shadow: 0px 3px 3px rgba(0,0,0,0.3);
}
footer,
.full {
  width: 100vw;
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100vw;
}
footer {
  padding-top: 40px;
  padding-bottom: 50px;
}
footer .container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  align-items: flex-start;
}
footer .container .col {
  display: grid;
  padding: 20px;
}
footer .container .col a {
  color: var(--gris2);
  text-decoration: none;
  margin-bottom: 15px;
}
footer .container .col a:hover {
  color: var(--celeste1);
}
footer .container:nth-child(1) {
  padding: 0;
}
footer h1 {
  color: var(--blanco1);
  margin: 0px;
  margin-bottom: 10px;
  font-size: 20px;
}
footer h1:after {
  opacity: 0;
}
footer form {
  display: grid;
}
footer form input,
footer form select,
footer form textarea {
  font-family: 'Arial';
  font-size: 16px;
  background-color: var(--negro3);
  color: var(--blanco2) !important;
}
footer form input:focus,
footer form select:focus,
footer form textarea:focus {
  background-color: var(--negro2);
  color: var(--celeste2) !important;
  box-shadow: 0px 0px 50px rgba(155,155,155,0.5);
  border: transparent !important;
}
.footer1 {
  background-color: var(--negro2);
}
.footer1 a.active {
  color: var(--celeste1) !important;
}
.footer2 {
  background-color: #12161d;
}
.footer2 .container {
  padding: 40px 20px;
  color: var(--blanco1);
  grid-template-columns: repeat(1, 2fr 1fr);
}
.footer2 .container .col:nth-child(2) {
  padding-left: 25px;
}
.footer2 .container iframe {
  width: 100% !important;
  border-radius: 7px;
  background-color: var(--gris1);
  background-image: url("../images/footer-map.jpg");
  background-size: cover;
}
.footer2 .container img {
  height: 90px;
  width: 350px;
  filter: brightness(0) invert(1);
}
.footer2 .container a {
  color: var(--blanco1) !important;
}
.suscribe-button {
  position: fixed;
  bottom: 32px;
  left: 18px;
  z-index: 2;
  width: 100px;
  height: 36px;
  cursor: pointer;
  color: #fff;
  background-color: #2b4571;
  font-size: 15px;
  line-height: 18px;
  text-align: left;
  padding: 8px 10px;
  border-radius: 10px;
  font-weight: 600;
  font-family: 'f2';
  box-shadow: 0px 4px 5px 0px rgba(0,0,0,0.5);
  animation: suscribebuttonanim 2s infinite ease;
}
.suscribe-button:hover,
.suscribe-button.active {
  filter: brightness(1.2);
}
.suscribe-button.active {
  background-color: #fff;
  color: #2b4571;
}
.suscribe-button .bubble {
  position: absolute;
  border-radius: 100px;
  background-color: #f00;
  color: #fff;
  text-align: center;
  font-family: 'f2';
  font-size: 12px;
  line-height: 20px;
  width: 20px;
  height: 20px;
  left: 108px;
  top: -8px;
}
.suscribe-modal {
  background-color: #fff;
  border-radius: 7px;
  box-shadow: 0px 3px 20px 20px rgba(0,0,0,0.5);
  height: 80vh;
  margin: 0;
  opacity: 0;
  overflow-y: scroll;
  padding: 0px 20px;
  pointer-events: none;
  position: fixed;
  text-align: center;
  bottom: 0px;
  transition: all 0.5s;
  width: 80vw;
  left: 20px;
  z-index: 10;
}
.suscribe-modal .pin-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: stretch;
  gap: 20px;
}
.suscribe-modal.active {
  bottom: 100px;
  opacity: 1;
  pointer-events: all;
}
.suscribe-modal h1 {
  font-size: 24px;
}
.suscribe-modal h1:after {
  display: none;
}
.whatsapp-button {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 2;
  background-image: url("../images/whatsapp-logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  width: 70px;
  height: 70px;
  cursor: pointer;
}
.whatsapp-button:hover,
.whatsapp-button.active {
  filter: brightness(1.2);
}
.whatsapp-chat {
  background-color: var(--blanco1);
  background-image: url("../images/whatsapp-background.webp");
  background-size: cover;
  border-radius: 20px 20px 0px 30px;
  box-shadow: 0px 3px 10px rgba(0,0,0,0.3);
  height: 60vh;
  opacity: 0;
  overflow: hidden;
  pointer-events: none;
  transition: all 0.3s;
  width: 300px;
  z-index: 1;
  position: fixed;
  right: 40px;
  bottom: 100px;
}
.whatsapp-chat.active {
  opacity: 1;
  pointer-events: all;
}
.whatsapp-chat .title {
  background-image: linear-gradient(#36954f, #346f4c);
  box-shadow: 0px 2px 3px rgba(0,0,0,0.3);
  color: #fff;
  font-family: 'f1';
  font-size: 18px;
  padding: 10px 20px;
  text-align: center;
}
.whatsapp-chat .body {
  padding: 20px;
  position: relative;
  overflow-y: scroll;
  height: 300px;
}
.whatsapp-chat .body h2 {
  font-family: 'f1';
  font-size: 18px;
  text-align: right;
}
.whatsapp-chat .body h2:first-child {
  margin-top: 10px;
}
.whatsapp-chat .body .ask {
  background-color: #b5d963;
  padding: 10px;
  border-radius: 4px;
  float: right;
  color: #34704c;
  box-shadow: 0px 2px 3px rgba(0,0,0,0.3);
  cursor: pointer;
  display: block;
  clear: right;
  margin: 5px 0px;
  position: relative;
  left: 0px;
  transition: left 0.3s;
}
.whatsapp-chat .body .ask:hover {
  filter: brightness(1.2);
}
.whatsapp-chat .body.next .ask {
  left: -600px;
}
.whatsapp-chat .body.in .ask {
  opacity: 0;
  left: 300px;
}
.whatsapp-chat .send {
  background-color: var(--blanco2);
  background-image: url("../images/send-icon.webp");
  background-position: 95% center;
  background-repeat: no-repeat;
  background-size: 20px;
  border: none;
  border-radius: 0px;
  bottom: 0px;
  box-shadow: 0px 2px 3px rgba(0,0,0,0.3);
  font-size: 16px;
  margin-bottom: 0px;
  padding: 10px 40px 10px 30px;
  position: absolute;
  width: calc(100% - 70px);
}
.whatsapp-chat .send:focus {
  outline: none;
}
input,
select,
textarea {
  background-color: var(--blanco2);
  color: var(--negro2);
  margin-bottom: 10px;
  margin-top: 5px;
  padding: 7px 10px;
  border-radius: 4px;
  border: none;
  box-shadow: 0px 1px 2px rgba(0,0,0,0.3);
  max-width: 100%;
  width: 100%;
}
input:focus,
select:focus,
textarea:focus {
  background-color: var(--blanco2);
  color: var(--negro1);
}
h1 {
  font-family: 'f2';
  font-size: 26px;
  color: var(--celeste4);
  text-transform: uppercase;
  margin-bottom: 30px;
  position: relative;
}
h1:after {
  content: '.';
  border-bottom: 2px solid var(--celeste1);
  width: 80px;
  height: 2px;
  position: absolute;
  bottom: -15px;
  left: 0px;
  color: transparent;
}
h3 {
  margin-bottom: 7px;
}
ul {
  margin: 0px;
}
.arrowDown {
  padding-right: 10px !important;
}
.arrowDown:after {
  border: solid var(--blanco1);
  border-width: 0 4px 4px 0;
  color: transparent;
  content: '.';
  display: inline-block;
  height: 4px;
  left: 10px;
  position: relative;
  top: 13px;
  transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  padding: 0;
}
.arrowDown:hover:after,
.arrowDown.dd:after,
.arrowDown.active:after {
  border: solid var(--celeste2);
  padding: 0;
  border-width: 0 4px 4px 0;
}
.background-image-opacity:after {
  content: ' ';
  color: transparent !important;
  background: linear-gradient(180deg, rgba(0,0,0,0.8) 20%, rgba(0,0,0,0.459) 60%, #f2f2f2 100%);
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  z-index: 0;
}
.hide {
  opacity: 0 !important;
}
#main {
  background-color: #959698;
  min-height: 100vh;
  overflow: hidden;
}
#main.bgIngElectronica {
  background-image: url("../images/carreras/electronica.jpg");
}
#main .container {
  top: 300px;
  z-index: 1;
}
#main .btn1 {
  box-shadow: 0px 3px 16px rgba(0,0,0,0.3);
}
#main h1,
#main p {
  font-size: 20px;
  font-family: 'f2';
  color: var(--blanco2);
  text-align: center;
  margin-bottom: 60px;
  text-shadow: 0px 3px 6px rgba(0,0,0,0.5);
}
#main h1 {
  font-size: 48px;
  margin: 0px;
  line-height: 72px;
}
#main h1:after {
  content: '' !important;
  border: none;
}
#our-numbers {
  background-color: var(--blanco1);
}
#our-numbers h1:after {
  opacity: 0;
}
#our-numbers .container {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0px;
}
#our-numbers .container div {
  padding: 40px;
  text-align: center;
}
#our-numbers .container .numbers {
  font-family: 'f2';
  font-size: 30px;
  display: inline-block;
  width: 160px;
  padding: 0px 0px 0px 70px;
  text-align: left;
  position: relative;
  margin: 20px;
}
#our-numbers .container .numbers span {
  position: relative;
  top: -15px;
  font-size: 24px;
}
#our-numbers .container .numbers .ico {
  background-size: 130px;
  padding: 0px;
  width: 60px;
  height: 60px;
  background-image: url("../images/home/our-numbers-icons.jpg");
  display: inline-block;
  position: absolute;
  left: 0px;
}
#our-numbers .container .numbers .ico1 {
  background-position: 0px 0px;
}
#our-numbers .container .numbers .ico2 {
  background-position: 60px 0px;
}
#our-numbers .container .numbers .ico3 {
  background-position: 0px 60px;
}
#our-numbers .container .numbers .ico4 {
  background-position: 60px 60px;
}
iframe {
  border-radius: 10px;
  border: none;
  overflow: hidden;
  min-height: 300px;
  background-color: #222;
}
.arrow-down {
  background-image: url("../images/arrow.png");
  background-size: contain;
  background-repeat: no-repeat;
  width: 60px;
  height: 80px;
  margin: auto;
  animation: arrow 2s infinite ease-in-out;
  transition: opacity 0.5s;
  cursor: pointer;
  position: absolute;
  margin-top: calc(100vh - 130px);
  left: calc(50vw - 30px);
}
.shape-1,
.shape-2 {
  background-image: url("/assets/images/shape-1.svg");
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  position: absolute;
  display: inline;
  z-index: -1;
  transition: opacity 1s;
  filter: blur(2px);
}
.shape-1 {
  width: 700px;
  height: 700px;
  animation: figura 60s infinite;
  top: 110vh;
  left: -300px;
}
.shape-2 {
  top: 210vh;
  right: -1000px;
  width: 1500px;
  height: 1500px;
  filter: blur(4px);
  animation: figura 80s infinite;
}
.main-news {
  margin-top: 80px;
  min-height: 120px !important;
  margin: 71px 0px 20px 0px;
  padding: 30px 0px;
  width: 100vw;
  left: 0px;
  position: relative;
  max-width: 100vw !important;
}
.main-news h1 {
  font-size: 30px;
}
.main-news .date {
  font-style: italic;
}
.main-news p {
  text-align: justify;
}
.main-news .box {
  border-radius: 4px;
  box-shadow: 0px 2px 3px rgba(0,0,0,0.3);
  padding: 20px;
  background-color: #fff;
  margin-bottom: 20px;
  text-align: center;
}
.main-news .box input {
  width: calc(90% - 20px);
  font-size: 14px;
}
.main-news .box .btn3 {
  margin: auto;
}
.main-news .box h3 {
  font-family: 'f2';
}
.main-news .box h3:first-child {
  margin-top: 0px;
}
.main-news img {
  width: 100%;
  aspect-ratio: 4/2.5;
  object-fit: cover;
  object-position: bottom;
  margin: 20px 0px;
  border-radius: 4px;
  border: 1px solid #aaa;
}
.sticky {
  position: sticky;
  top: 100px;
}
.main-careers {
  margin-top: 80px;
  min-height: 120px !important;
  margin: 71px 0px 100px 0px;
  padding: 30px 0px;
  color: #fff;
  width: 100vw;
  left: 0px;
  position: relative;
  max-width: 100vw !important;
  overflow: hidden;
}
.main-careers h1 {
  color: #fff;
  font-size: 32px;
  text-shadow: 0px 3px 5px rgba(0,0,0,0.5);
}
.main-careers #title,
.main-careers #description,
.main-careers #suscribe,
.main-careers .skip {
  transition: all 1s;
}
.main-careers #suscribe {
  opacity: 0.5;
}
.main-careers #suscribe:hover {
  opacity: 1;
}
.main-careers .skip {
  color: #fff;
  text-shadow: 0px 3px 5px rgba(0,0,0,0.5);
  position: absolute;
  bottom: 40px;
  font-size: 20px;
  z-index: 2;
  font-style: italic;
  left: calc(50vw - 100px);
  opacity: 0;
  cursor: pointer;
}
.main-careers .skip:hover {
  opacity: 1;
}
.main-careers a {
  float: right;
  margin-right: 20px;
}
.main-careers .cols-2-2_1 {
  align-items: center;
}
.main-careers video {
  position: absolute;
  top: 0;
  left: 0;
  transition: all 0.25s;
  z-index: 0;
  height: 80vh;
  width: 40vw;
  object-fit: cover;
  object-position: center;
  height: 101% !important;
  right: 0px;
  left: auto;
  -webkit-mask-image: linear-gradient(270deg, #000, transparent 100%);
}
.main-careers .container {
  transition: all 2s;
  z-index: 1;
}
.main-careers .btn1 {
  animation: inout 5s infinite cubic-bezier(0.68, -0.55, 0.27, 1.55);
}
.shown {
  opacity: 1 !important;
  top: 0px;
}
a[href^='mailto'] {
  text-decoration: none;
  color: #555 !important;
}
a[href^='mailto']:hover {
  background-color: var(--celeste1);
  color: #fff !important;
  padding: 5px 10px;
  border-radius: 10px;
  margin-left: -10px;
}
.table-careers {
  border-collapse: collapse;
  min-width: 60%;
}
.table-careers td {
  padding: 10px;
  border: 1px solid #959494;
  text-align: center;
}
.table-careers td p {
  margin: 0px;
}
.table-careers td br {
  display: none;
}
.table-careers tr:first-child td:first-child {
  font-weight: bolder;
}
.table-careers td:only-child {
  text-align: left;
}
.table-careers tr:first-child,
.table-careers tr:last-child {
  background-color: #959494;
  color: #fff;
  text-transform: uppercase;
}
.table-ene-ele-1 td {
  text-align: center !important;
  border: 1px solid #fff !important;
  padding: 20px;
}
.table-ene-ele-1 td br {
  display: inherit !important;
}
.pinGeneric,
.pin-career,
.pin-event,
.pin-newness,
.pin-newness-lateral,
.pin-grupo-investigacion,
.pin-graduate {
  box-shadow: 0px 3px 3px rgba(0,0,0,0.3);
  border-radius: 7px;
  overflow: hidden;
  position: relative;
  background-color: var(--blanco1);
  z-index: 0;
  text-decoration: none;
  color: inherit;
  transition: opacity 2s;
}
.pin-career-container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.pin-career {
  height: 80px;
  font-family: 'f2';
  font-size: 22px;
  padding-left: 30px;
  display: flex;
  align-items: center;
  transition: all 0.25s;
  cursor: pointer;
  margin: 10px;
  text-decoration: none;
  color: var(--gris1);
}
.pin-career:after {
  content: '.';
  color: transparent;
  width: 20px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 7px 0px 0px 7px;
  transition: width 0.25s;
}
.pin-career:hover {
  font-size: 24px !important;
  color: var(--blanco1);
  background-color: transparent;
  text-align: center;
  padding: 0px 15px;
  justify-content: center;
}
.pin-career:hover:after {
  z-index: -1;
  width: 100%;
  border-radius: 7px;
}
.pin-career:nth-child(1),
.pin-career:nth-child(4),
.pin-career:nth-child(7),
.pin-career:nth-child(10),
.pin-career:nth-child(13) {
  margin-left: 0px;
}
.pin-career:nth-child(3),
.pin-career:nth-child(6),
.pin-career:nth-child(9),
.pin-career:nth-child(12),
.pin-career:nth-child(15) {
  margin-right: 0px;
}
.pin-career.electromecanica:after {
  background-color: var(--ingElectromecanica);
}
.pin-career.electronica:after {
  background-color: var(--ingElectronica);
}
.pin-career.quimica:after {
  background-color: var(--ingQuimica);
}
.pin-career.rural:after {
  background-color: var(--licAdminRural);
}
.pin-career.sistemas:after {
  background-color: var(--ingSistemas);
}
.pin-career.tup:after {
  background-color: var(--tecUniProgramacion);
}
.pin-career.espIngAmb:after {
  background-color: var(--espIngAmb);
}
.pin-career.espIngGer:after {
  background-color: var(--espIngGer);
}
.pin-career.espDocUni:after {
  background-color: var(--espDocUni);
}
.pin-career.espSegHig:after {
  background-color: var(--espSegHig);
}
.pin-career.espEneEle:after {
  background-color: var(--espEneEle);
}
.pin-career.maestriaAdminNeg:after {
  background-color: var(--maestriaAdminNeg);
}
.pin-career.industrial:after {
  background-color: var(--ingIndustrial);
}
.pin-career.electronica:hover {
  box-shadow: 0px 0px 220px 10px --var(ingElectronica2);
}
.pin-career.electromecanica:hover {
  box-shadow: 0px 0px 220px 10px --var(ingElectromecanica2);
}
.pin-career.quimica:hover {
  box-shadow: 0px 0px 220px 10px --var(ingQuimica2);
}
.pin-career.rural:hover {
  box-shadow: 0px 0px 220px 10px --var(licAdminRural2);
}
.pin-career.sistemas:hover {
  box-shadow: 0px 0px 220px 10px --var(ingSistemas2);
}
.pin-career.industrial:hover {
  box-shadow: 0px 0px 220px 10px --var(ingInsdustrial2);
}
.pin-career.tup:hover {
  box-shadow: 0px 0px 220px 10px --var(tecUniProgramacion2);
}
.pin-career.espEneEle:hover {
  box-shadow: 0px 0px 220px 10px --var(espEneEle2);
}
.pin-career.espIngAmb:hover {
  box-shadow: 0px 0px 220px 10px --var(espIngAmb2);
}
.pin-career.espIngGer:hover {
  box-shadow: 0px 0px 220px 10px --var(espIngGer2);
}
.pin-career.espDocUni:hover {
  box-shadow: 0px 0px 220px 10px --var(espDocUni2);
}
.pin-career.espSegHig:hover {
  box-shadow: 0px 0px 220px 10px --var(espSegHig2);
}
.pin-career.maestriaAdminNeg:hover {
  box-shadow: 0px 0px 220px 10px --var(maestriaAdminNeg2);
}
.pin-event {
  background-color: transparent !important;
  width: 600px;
  height: 550px;
  overflow: hidden;
  transition: all 0.25s;
  cursor: pointer;
  display: inline-block;
}
.pin-event:nth-child(even) {
  margin-left: 74px;
}
.pin-event p,
.pin-event .paragraph-container {
  background-color: var(--blanco1);
  display: inline-block;
  position: absolute;
  bottom: 0;
  right: 0;
  width: 390px;
  height: 132px;
  padding: 20px;
  margin: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.pin-event .paragraph {
  display: block;
  display: -webkit-box;
  height: 112px;
  font-size: 20px;
  line-height: 1.4;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.pin-event img {
  position: absolute;
  top: 0;
  left: 0;
  width: 600px;
  height: 460px;
  border: none;
  z-index: -1;
  transition: all 0.25s;
  filter: brightness(0.4);
}
.pin-event h1 {
  border: none;
  color: var(--blanco2);
  padding: 30px;
  font-size: 30px !important;
  margin: 0px;
  height: 300px !important;
  -webkit-line-clamp: 6 !important;
  line-height: 60px;
  text-transform: initial !important;
}
.pin-event h1:after {
  border-bottom: none;
}
.pin-event .date {
  width: 172px;
  height: 172px;
  display: inline-block;
  background-color: var(--gris1);
  color: var(--blanco2);
  text-align: center;
  font-family: 'f2';
  position: absolute;
  bottom: 0;
  transition: all 0.25s;
}
.pin-event .date .texto1 {
  font-size: 78px;
  line-height: 78px;
  margin-top: 20px;
  transition: all 0.25s;
}
.pin-event .date .texto2 {
  font-size: 23px;
}
.pin-event:hover {
  box-shadow: 0px 0px 30px 0px rgba(84,113,155,0.2);
}
.pin-event:hover h1 {
  text-shadow: 0px 0px 15px 10px #222;
}
.pin-event:hover h1,
.pin-event:hover .date {
  color: var(--blanco1);
}
.pin-event:hover .date {
  background-color: var(--celeste3);
}
.pin-event:hover img {
  filter: brightness(0.7);
  transform: scale(1.1);
}
.pin-event:hover .paragraphContainer .paragraph {
  color: var(--celeste3) !important;
}
.pin-event:hover .btn2 {
  background-color: var(--blanco1);
  color: var(--celeste3);
}
.pin-newness {
  height: 560px;
  overflow: hidden;
  transition: all 0.25s;
  cursor: pointer;
  display: inline-block;
  margin-bottom: 20px;
}
.pin-newness:nth-child(3) {
  margin-right: 0px;
}
.pin-newness p,
.pin-newness .paragraph-container {
  background-color: var(--blanco1);
  display: inline-block;
  width: 328px;
  height: 132px;
  padding: 10px 20px;
  margin: 0;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.pin-newness .paragraph {
  display: block;
  display: -webkit-box;
  height: 112px;
  font-size: 20px;
  line-height: 1.4;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: normal;
}
.pin-newness img {
  width: 100%;
  height: 270px;
  border: none;
  transition: all 0.25s;
  transform: scale(1);
  object-fit: cover;
  position: relative;
}
.pin-newness h1 {
  border: none;
  color: var(--gris1);
  padding: 0px 20px;
  font-size: 24px !important;
  height: 100px !important;
  margin: 0px;
  -webkit-line-clamp: 3 !important;
  line-height: 60px;
  text-transform: initial !important;
}
.pin-newness h1:after {
  border-bottom: none;
}
.pin-newness h1.paragraph {
  height: initial !important;
}
.pin-newness .date {
  display: block;
  color: var(--gris1);
  font-family: 'Arial';
  background-color: var(--blanco1);
  z-index: 1;
  font-size: 14px;
  text-decoration: italic;
  padding: 10px 20px;
  position: relative;
  top: -5px;
}
.pin-newness .btn2 {
  bottom: 305px;
}
.pin-newness:hover {
  box-shadow: 0px 0px 30px 0px rgba(84,113,155,0.2);
}
.pin-newness:hover h1 {
  text-shadow: 0px 0px 15px 10px #222;
}
.pin-newness:hover h1,
.pin-newness:hover .date {
  color: var(--celeste3);
}
.pin-newness:hover img {
  transform: scale(1.1);
}
.pin-newness:hover .paragraphContainer .paragraph {
  color: var(--celeste3) !important;
}
.pin-newness:hover .btn2 {
  background-color: var(--blanco1);
  color: var(--celeste3);
}
.pin-newness-lateral {
  text-align: left !important;
  width: 100%;
  transition: all 0.25s;
  cursor: pointer;
  margin-bottom: 20px;
  height: auto !important;
  padding: 0 0 10px 0;
  background-color: #fff;
  box-shadow: 0px 2px 3px rgba(0,0,0,0.3);
}
.pin-newness-lateral img {
  width: 100%;
  height: 200px;
  border: none;
  transition: all 0.25s;
  object-fit: cover;
  position: relative;
  margin: 0 0 10px 0 !important;
  top: 0;
}
.pin-newness-lateral h1 {
  border: none;
  color: var(--gris1);
  padding: 0px 20px;
  font-size: 16px !important;
  margin: 0px;
  line-height: 20px;
  text-transform: initial !important;
}
.pin-newness-lateral h1:after {
  border-bottom: none;
}
.pin-newness-lateral .date {
  display: block;
  color: var(--gris1);
  font-family: 'Arial';
  z-index: 1;
  font-size: 14px;
  font-style: italic;
  padding: 0px 20px;
  position: relative;
  top: -5px;
}
.pin-newness-lateral .btn2 {
  bottom: 305px;
}
.pin-newness-lateral:hover {
  box-shadow: 0px 0px 30px 0px rgba(84,113,155,0.2);
}
.pin-newness-lateral:hover h1 {
  text-shadow: 0px 0px 15px 10px #222;
}
.pin-newness-lateral:hover h1,
.pin-newness-lateral:hover .date {
  color: var(--celeste3);
}
.pin-newness-lateral:hover img {
  transform: scale(1.1);
  top: -10px;
}
.pin-grupo-investigacion {
  padding: 20px;
  transition: all 0.3s;
  cursor: pointer;
}
.pin-grupo-investigacion .image {
  margin: -20px;
  margin-bottom: 20px;
  width: calc(100% + 40px);
  height: 166px;
  border-bottom: 1px solid #f0f0f0;
  transition: all 0.3s;
  text-align: center;
  overflow: hidden;
}
.pin-grupo-investigacion .image:before {
  content: '';
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 166px;
  background-repeat: no-repeat;
  background-size: 110%;
  background-position: center;
  transition: all 0.3s;
  filter: blur(3px);
}
.pin-grupo-investigacion .image:after {
  content: '';
  background-color: rgba(0,0,0,0.5);
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 166px;
  transition: all 1s;
  z-index: 0;
}
.pin-grupo-investigacion .image span {
  color: #fff;
  line-height: 166px;
  font-size: 50px;
  font-family: 'f2';
  text-shadow: 0px 0px 150px #000, 0px 0px 50px #000, 0px 0px 50px #000, 0px 0px 10px #000;
  z-index: 1;
  opacity: 0.75;
  transition: opacity 0.5;
  position: relative;
}
.pin-grupo-investigacion .title {
  font-family: 'f2';
  font-size: 24px;
  margin-bottom: 10px;
}
.pin-grupo-investigacion .info {
  font-family: 'Arial';
  font-size: 18px;
  text-transform: initial;
  line-height: 20px;
  text-align: justify;
}
.pin-grupo-investigacion:hover {
  box-shadow: 0px 0px 30px 0px rgba(84,113,155,0.2);
}
.pin-grupo-investigacion:hover .image:before {
  filter: blur(0px);
  background-size: 120%;
  background-position: center -20px;
}
.pin-grupo-investigacion:hover .image:after {
  opacity: 0.25;
}
.pin-grupo-investigacion:hover .image span {
  opacity: 1;
}
.pin-graduate {
  padding: 20px;
  transition: all 0.3s;
}
.pin-graduate .cols-2-1_2 {
  align-items: center;
  gap: 0px !important;
}
.pin-graduate img {
  width: 100px;
  height: 100px;
  border-radius: 100px;
  object-fit: cover;
  border-bottom: 1px solid #f0f0f0;
  transition: all 0.3s;
  display: inline-block;
  border: 1px solid #f0f0f0;
  box-shadow: 0px 2px 2px 3px rgba(0,0,0,0.3);
  object-fit: fill;
  object-position: 0px 10px;
}
.pin-graduate h1 {
  font-family: 'f2';
  font-size: 20px;
  text-transform: initial;
  line-height: 24px;
  border: none;
  margin: 0px;
  margin-bottom: 10px;
}
.pin-graduate h1:after {
  border: none !important;
}
.pin-graduate span {
  font-size: 16px;
  color: #333;
}
.pin-graduate p {
  font-family: 'Arial';
  font-size: 18px;
  text-transform: initial;
  line-height: 20px;
}
.pin-graduate:hover {
  box-shadow: 0px 0px 30px 0px rgba(84,113,155,0.2);
}
.pin-graduate:hover img {
  filter: brightness(1.2);
}
.pin-degree,
.pin-plan {
  background-color: #fff;
  border-radius: 7px;
  box-shadow: 0px 3px 3px rgba(0,0,0,0.3);
  height: auto;
  margin-bottom: 30px;
  overflow: hidden;
  padding: 20px;
  padding-left: 35px;
  position: relative;
  transition: all 0.3s;
}
.pin-degree span,
.pin-plan span,
.pin-degree a,
.pin-plan a,
.pin-degree .indicator,
.pin-plan .indicator {
  transition: all 0.3s;
}
.pin-degree span,
.pin-plan span {
  font-family: 'Arial';
  font-size: 20px;
  color: var(--gris2);
}
.pin-degree h1,
.pin-plan h1 {
  font-family: 'f2';
  font-size: 28px !important;
  color: var(--gris1);
  text-transform: capitalize;
  margin: 0px !important;
  font-weight: 100;
}
.pin-degree h1:after,
.pin-plan h1:after {
  opacity: 0;
}
.pin-degree a,
.pin-plan a {
  color: var(--gris1);
  right: 20px;
  text-decoration: none;
  padding: 5px 10px 5px 30px;
  font-family: 'f2';
  line-height: 19px;
  margin: 10px 0px;
  display: block;
  background-image: url("/assets/images/icons/pdf.webp");
  background-repeat: no-repeat;
  background-position: left top;
  background-size: 22px;
}
.pin-degree a:hover,
.pin-plan a:hover {
  filter: brightness(1.2);
}
.pin-degree .link,
.pin-plan .link {
  background-image: url("/assets/images/icons/link.webp") !important;
}
.pin-degree .indicator,
.pin-plan .indicator {
  background-color: #808080;
  position: absolute;
  width: 20px;
  height: 100%;
  left: 0px;
  top: 0px;
}
.pin-degree:hover {
  box-shadow: 0px 0px 30px 0px rgba(84,113,155,0.2);
}
.pin-degree:hover .indicator {
  filter: brightness(1.2);
}
.pin-suscribe {
  background-color: #fff;
  border-radius: 7px;
  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
  height: auto;
  margin-bottom: 30px;
  overflow: hidden;
  padding: 20px;
  padding-left: 35px;
  position: relative;
  transition: all 0.3s;
  cursor: pointer;
}
.pin-suscribe:hover {
  color: #fff;
  background-color: var(--gris1);
}
.pin-suscribe:hover .title,
.pin-suscribe:hover .date {
  color: #fff;
}
.pin-suscribe .title {
  font-family: 'f1';
  font-size: 20px;
  color: var(--gris1);
}
.pin-suscribe .date {
  font-size: 14px;
  color: var(--gris2);
}
.pin-suscribe .open {
  color: #05b405;
}
.pin-suscribe .close {
  color: #f00;
}
.pin-suscribe .open,
.pin-suscribe .close {
  font-size: 14px;
  text-transform: uppercase;
  text-align: center;
  font-weight: bolder;
  font-family: 'f2';
}
.pin-suscribe .indicator {
  background-color: var(--gris1);
  position: absolute;
  width: 20px;
  height: 100%;
  left: 0px;
  top: 0px;
}
.slider {
  opacity: 1;
  transition: opacity 1s ease;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-color: #000 !important;
  height: 100%;
}
.slider.bg1 {
  animation: ZoomIn 12s ease 1;
  background: url("../images/slider/utn-san-francisco-frente.webp");
}
.slider.bg2 {
  animation: ZoomOut 12s ease 1;
  background: url("../images/slider/alumnos-pasillos-utn-san-francisco.webp");
}
.slider.bg3 {
  animation: ZoomIn 12s ease 1;
  background: url("../images/slider/laboratorio-quimica-utn-san-francisco.webp");
}
.slider.bg4 {
  animation: ZoomOut 12s ease 1;
  background: url("../images/slider/laboratorio-electronica-utn-san-francisco.webp");
}
.overlay {
  background: linear-gradient(180deg, rgba(0,0,0,0.8) 20%, rgba(0,0,0,0.459) 60%, #f2f2f2 100%);
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.background-image,
.sliderFullSection {
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-color: #000 !important;
  transition: opacity 1s ease;
}
.sliderFullSection {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.sliderFullSection video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.sliderContainer {
  padding: 0px !important;
  height: 100%;
  overflow: hidden;
}
@-moz-keyframes ZoomIn {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}
@-webkit-keyframes ZoomIn {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}
@-o-keyframes ZoomIn {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}
@keyframes ZoomIn {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}
@-moz-keyframes ZoomOut {
  0% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
@-webkit-keyframes ZoomOut {
  0% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
@-o-keyframes ZoomOut {
  0% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes ZoomOut {
  0% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}
.cols-2 {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}
.cols-2-1_2 {
  display: grid;
  grid-template-columns: repeat(1, 1fr 2fr);
  gap: 40px;
}
.cols-2-2_1 {
  display: grid;
  grid-template-columns: repeat(1, 2fr 1fr);
  gap: 40px;
}
.cols-2-3_1 {
  display: grid;
  grid-template-columns: repeat(1, 3fr 1fr);
  gap: 40px;
}
.cols-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}
.container-shapes {
  max-width: 100vw;
  position: absolute;
  margin: 0 auto;
  top: 0;
  left: 0;
  width: 100vw;
  height: auto;
  overflow-x: hidden;
  z-index: -1;
  pointer-events: none;
}
#news .container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 40px;
}
body.scrollLocked {
  overflow: hidden;
}
@media screen and (max-width: 1280px) {
  :root {
    --anchoDesktop: 1100px;
  }
  .main .logo img {
    width: 240px !important;
  }
}
@media screen and (max-width: 1100px) {
  #main {
    padding: 0px;
  }
  #main a {
    margin: 20px 100px !important;
  }
  #main p {
    padding: 0px 20px;
  }
  #main .container {
    top: 0px !important;
    padding-top: 100px;
  }
  #main .container h1 {
    padding: 0px 20px;
  }
  .container-shapes {
    display: none;
  }
  .cols-2-3_1 {
    padding: 0px 40px;
  }
  section {
    padding: 30px;
  }
  section h1 {
    font-size: 24px !important;
  }
  header {
    position: fixed !important;
    background-color: var(--blanco1) !important;
    box-shadow: 0px 0px 30px rgba(0,0,0,0.3) !important;
    height: 70px !important;
  }
  header.static .main,
  header.fixed .main {
    top: 0px !important;
    background-color: #fff;
    height: 70px;
    box-shadow: 0px 0px 3px 3px rgba(0,0,0,0.4);
  }
  header.static .top,
  header.fixed .top {
    display: none;
  }
  header.static .logo img,
  header.fixed .logo img {
    height: 50px !important;
    filter: none !important;
    width: 260px !important;
    position: relative;
    top: 11px;
    left: 20px;
  }
  header .hamb {
    display: inline-block;
    width: 32px;
    height: 40px;
    top: 10px;
    right: 20px;
    position: relative;
    display: inline-grid;
    align-content: center;
    gap: 8px;
    cursor: pointer;
  }
  header .hamb:hover .line {
    opacity: 1;
  }
  header .hamb.active .line {
    opacity: 1;
    background-color: var(--rojo1);
  }
  header .hamb.active .line:nth-child(1) {
    transform: rotate(45deg);
    top: 12px;
  }
  header .hamb.active .line:nth-child(2) {
    opacity: 0;
  }
  header .hamb.active .line:nth-child(3) {
    transform: rotate(-45deg);
    top: -12px;
  }
  header .hamb .line {
    height: 4px;
    border-radius: 4px;
    background-color: var(--gris1);
    transition: all 0.25s;
    position: relative;
    opacity: 0.7;
    top: 0px;
  }
  header .menuMobile {
    opacity: 0;
    pointer-events: none;
    background-color: #fff;
    height: 100vh;
    color: #000;
    display: inline-block;
    left: 0px;
    position: absolute;
    right: 0px;
    z-index: -1;
    padding: 20px;
    text-align: center;
    font-family: 'f1';
    padding: 80px 10px 120px 10px;
    top: 0px;
    scroll-behavior: smooth;
  }
  header .menuMobile i {
    top: 1px;
  }
  header .menuMobile b {
    font-weight: bolder;
  }
  header .menuMobile.active {
    opacity: 1;
    overflow-y: scroll;
    height: calc(100vh - 200px);
    pointer-events: all;
  }
  header .menuMobile hr {
    border: none;
    border-bottom: 1px solid #d3d3d3;
    margin: 20px 0px;
  }
  header .menuMobile .btn {
    font-size: 24px;
    font-family: 'f2';
    text-align: center;
    text-decoration: none;
    color: var(--gris1);
    height: 40px;
    display: inline-block;
    width: 90%;
    margin: 20px auto;
    line-height: 40px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
  }
  header .menuMobile .btn.active {
    color: var(--celeste1);
    border-left: 8px solid var(--celeste1);
    border-right: 8px solid var(--celeste1);
  }
  header .menuMobile .btn2 {
    font-size: 20px;
    font-weight: 100;
    text-align: center;
    text-decoration: none;
    color: var(--celeste3);
    display: inline-block;
    width: 90%;
    margin: 10px auto;
    line-height: 40px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: relative;
    right: 0px;
    height: initial;
    background-color: transparent;
    top: 0px;
  }
  header .menuMobile .btn2.active {
    color: var(--celeste1);
    border-left: 8px solid var(--celeste1);
    border-right: 8px solid var(--celeste1);
  }
  header .menuMobile .dropdownMenu {
    padding-bottom: 40px;
    background-color: #e5e5e5;
    border-radius: 0 0 20px 20px;
  }
  header .menuMobile .dropdownMenu.close {
    height: 0px;
    overflow: hidden;
    padding: 0px;
  }
  header .menuMobile .dropdownMenu a {
    font-size: 24px;
    font-family: 'f2';
    text-align: center;
    text-decoration: none;
    color: var(--gris1);
    height: 40px;
    display: inline-block;
    width: 90%;
    margin: 20px auto;
    line-height: 40px;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
  }
  header .menuMobile .dropdownMenu a.active {
    color: var(--celeste1);
    border-left: 8px solid var(--celeste1);
    border-right: 8px solid var(--celeste1);
  }
  .pin-career-container {
    grid-template-columns: repeat(1, 1fr);
  }
  .pin-career {
    margin: 20px 0px !important;
    height: 90px;
  }
  .pin-career:hover {
    line-height: 26px;
  }
  .pin-newness {
    margin: 5vw 0px !important;
    height: auto;
  }
  .pin-newness h1.paragraph {
    padding: 10px 20px;
    padding-top: 0px;
    margin: 0px !important;
    display: inline-block;
    overflow: initial;
  }
  .pin-newness .btn2 {
    display: none;
  }
  .pin-newness .paragraph {
    padding: 0px;
    margin: 20px 0px !important;
    height: auto !important;
    margin-bottom: 10px !important;
  }
  .pin-newness img {
    width: 100%;
  }
  .pin-newness .paragraph-container {
    padding: 0px 20px !important;
    width: auto;
  }
  .pin-newness .paragraph-container .paragraph {
    margin: 0px !important;
  }
  .pin-event {
    margin: 5vw 0px !important;
    max-width: 85vw;
    height: auto;
  }
  .pin-event h1.paragraph {
    font-size: 24px !important;
    height: auto !important;
    overflow: initial;
    text-overflow: initial;
    display: block;
  }
  .pin-event .btn2 {
    position: relative;
    top: -20px;
    bottom: inherit;
    float: right;
  }
  .pin-event .paragraph-container,
  .pin-event .date {
    width: 100%;
    height: 70px;
    overflow: hidden;
    position: static;
    display: block;
  }
  .pin-event .paragraph-container .texto1,
  .pin-event .date .texto1 {
    float: left;
    font-size: 62px;
    padding-left: 65px;
    margin: 0px;
    min-width: 82px;
    text-align: right;
  }
  .pin-event .paragraph-container .texto2,
  .pin-event .date .texto2 {
    font-size: 24px;
    width: 50%;
    float: left;
    line-height: 28px;
    position: relative;
    top: 10px;
    text-align: left;
    left: 10px;
  }
  .pin-event .paragraph {
    padding: 20px;
    margin: 0px !important;
    height: 280px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
  }
  .pin-event .paragraph-container {
    padding: 0px;
  }
  .pin-event .paragraph-container,
  .pin-event .paragraph {
    height: auto !important;
    font-size: 16px;
    overflow: initial;
    text-overflow: initial;
    display: block;
  }
  #our-numbers {
    background-color: transparent !important;
  }
  #our-numbers .container {
    width: 85vw;
    background-color: var(--blanco1);
    overflow: hidden;
    display: inline-block;
  }
  #our-numbers .container .slider {
    height: 300px;
  }
  footer {
    padding: 20px 0px;
  }
  footer .container {
    grid-template-columns: repeat(1, 1fr) !important;
  }
  .whatsapp-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
  }
  .whatsapp-chat {
    left: auto;
    margin: 0 auto;
    position: fixed;
    top: auto;
    bottom: 100px;
    width: calc(100vw - 60px);
    max-width: 400px;
    right: 30px;
  }
  .whatsapp-chat .body {
    height: calc(60vh - 120px);
  }
  .whatsapp-chat .send {
    width: calc(100% - 70px);
  }
}
@media screen and (max-width: 900px) {
  .pin-degree,
  .pin-plan {
    width: auto;
  }
  .cols-2,
  .cols-3,
  .cols-2-3_1 {
    grid-template-columns: repeat(1, 1fr);
  }
  .arrow-down {
    display: none;
  }
  input,
  textarea {
    width: calc(100% - 20px);
  }
  .cols-2-2_1 {
    padding: 0px 30px;
    grid-template-columns: repeat(1, 1fr);
    text-align: center;
  }
  .cols-2-2_1 #suscribe {
    float: inherit;
    margin: auto !important;
  }
  .cols-2-2_1 h1 {
    font-size: 30px !important;
  }
  .cols-2-2_1 a {
    text-align: center;
  }
  .main-careers h1:after {
    display: none;
  }
  .main-careers #title,
  .main-careers #description {
    text-shadow: 0px 4px 5px rgba(0,0,0,0.4) !important;
  }
  .main-careers video {
    width: auto !important;
    height: 101% !important;
    opacity: 0.4;
  }
  .suscribe-modal .pin-container {
    grid-template-columns: repeat(1, 1fr);
    gap: 20px;
  }
  #news .container {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (max-width: 500px) {
  header.static .logo img,
  header.fixed .logo img {
    width: 210px !important;
  }
  section h1:after {
    display: none;
  }
  #main a {
    display: block;
    margin: 20px 20% !important;
  }
  .arrow-down {
    display: none;
  }
  #news .container {
    grid-template-columns: repeat(1, 1fr);
  }
}
@-moz-keyframes headerIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes headerIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-o-keyframes headerIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes headerIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-moz-keyframes suscribebuttonanim {
  0%, 100% {
    letter-spacing: 1px;
  }
  50% {
    letter-spacing: 1.4px;
  }
}
@-webkit-keyframes suscribebuttonanim {
  0%, 100% {
    letter-spacing: 1px;
  }
  50% {
    letter-spacing: 1.4px;
  }
}
@-o-keyframes suscribebuttonanim {
  0%, 100% {
    letter-spacing: 1px;
  }
  50% {
    letter-spacing: 1.4px;
  }
}
@keyframes suscribebuttonanim {
  0%, 100% {
    letter-spacing: 1px;
  }
  50% {
    letter-spacing: 1.4px;
  }
}
@-moz-keyframes arrow {
  0%, 100% {
    top: 20px;
  }
  50% {
    top: 30px;
  }
}
@-webkit-keyframes arrow {
  0%, 100% {
    top: 20px;
  }
  50% {
    top: 30px;
  }
}
@-o-keyframes arrow {
  0%, 100% {
    top: 20px;
  }
  50% {
    top: 30px;
  }
}
@keyframes arrow {
  0%, 100% {
    top: 20px;
  }
  50% {
    top: 30px;
  }
}
@-moz-keyframes figura {
  0% {
    transform: rotate(0deg);
    opacity: 0;
  }
  10%, 90% {
    opacity: 0.1;
  }
  50% {
    opacity: 0.1;
    transform: rotate(90deg);
  }
  100% {
    opacity: 0;
    transform: rotate(180deg);
  }
}
@-webkit-keyframes figura {
  0% {
    transform: rotate(0deg);
    opacity: 0;
  }
  10%, 90% {
    opacity: 0.1;
  }
  50% {
    opacity: 0.1;
    transform: rotate(90deg);
  }
  100% {
    opacity: 0;
    transform: rotate(180deg);
  }
}
@-o-keyframes figura {
  0% {
    transform: rotate(0deg);
    opacity: 0;
  }
  10%, 90% {
    opacity: 0.1;
  }
  50% {
    opacity: 0.1;
    transform: rotate(90deg);
  }
  100% {
    opacity: 0;
    transform: rotate(180deg);
  }
}
@keyframes figura {
  0% {
    transform: rotate(0deg);
    opacity: 0;
  }
  10%, 90% {
    opacity: 0.1;
  }
  50% {
    opacity: 0.1;
    transform: rotate(90deg);
  }
  100% {
    opacity: 0;
    transform: rotate(180deg);
  }
}
@-moz-keyframes inout {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.9);
  }
}
@-webkit-keyframes inout {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.9);
  }
}
@-o-keyframes inout {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.9);
  }
}
@keyframes inout {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.9);
  }
}