/*
  Nombre Tema: Escuela de graduados UC
  Versión: 1
  Autor: Serendipitysoft
  Autor URL: https://serendipitysoft.com/
*/

@font-face {
  font-family: Avenir;
  src: url(../font/Avenir-Heavy.ttf);
  font-weight: 900;
}

@font-face {
  font-family: Futura-bold;
  src: url(../font/Futura-Bold.otf);
  font-weight: bold;
}

@font-face {
  font-family: Futura-mb;
  src: url(../font/FUTURAMB.TTF);
}

@font-face {
  font-family: Gotham;
  src: url(../font/GothamMedium.ttf);
  font-weight: 500;
}

@font-face {
  font-family: Monserrat-black;
  src: url(../font/Montserrat-Black.ttf);
  font-weight: 900;
}

@font-face {
  font-family: Monserrat-bold;
  src: url(../font/Montserrat-Bold.ttf);
  font-weight: bold;
}

@font-face {
  font-family: Monserrat-medium;
  src: url(../font/Montserrat-Medium.ttf);
  font-weight: 500;
}

@font-face {
  font-family: MyriadVariable;
  src: url(../font/MyriadVariableConcept-Roman.otf);
  font-weight: 400;
}

:root {

  --amarillo: #ff6300;
  ---verde: green;
  ---buno: #B1C4C3;
  --eaea: #EAEAEA;
  --e8: #E82E23;
  --cuatro3: #006BDC;
  --uno8: #181F2C;
  --unoa: #1A2E35;
  --dtres: #D3D3D3;
  --f2: #F2F2F2;


  --font12: 12px;
  --font13: 13px;
  --font14: 14px;
  --font16: 16px;
  --font19: 19px;
  --font20: 20px;
  --font21: 21px;
  --font22: 22px;
  --font23: 23px;
  --font27: 27px;
  --font30: 30px;
  --font31: 31px;
  --font35: 35px;
  --font36: 36px;
  --font37: 37px;
  --font47: 47px;
  --font60: 60px;
  --font120: 120px;

}

.avenir {
  font-family: Avenir;
}

.futura-bold {
  font-family: Futura-bold;
}

.futura-mb {
  font-family: Futura-mb;
}

.gotham {
  font-family: Gotham;
}

.monserrat-black {
  font-family: Monserrat-black;
}

.monserrat-bold {
  font-family: Monserrat-bold;
}

.monserrat-medium {
  font-family: Monserrat-medium;
}

.myriad {
  font-family: MyriadVariable;
}

.fs-12 {
  font-size: var(--font12) !important;
}

.fs-19 {
  font-size: var(--font19) !important;
}

.fs-21 {
  font-size: var(--font21) !important;
}

.fs-22 {
  font-size: var(--font22) !important;
}

.fs-20 {
  font-size: var(--font20) !important;
}

.fs-120 {
  font-size: var(--font120) !important;
}

.fs-23 {
  font-size: var(--font23) !important;
}

.fs-27 {
  font-size: var(--font27) !important;
}

.fs-31 {
  font-size: var(--font31) !important;
}

.fs-35 {
  font-size: var(--font35) !important;
}

.fs-36 {
  font-size: var(--font36) !important;
}

.fs-47 {
  font-size: var(--font47) !important;
}

.bg-1a {
  background-color: var(--unoa) !important;
}

.bg-f2 {
  background-color: var(--f2) !important;
}

.input-group-text {
  background-color: var(--dtres) !important;
  border-end-start-radius: 20px;
  border-start-start-radius: 20px;
}

.gradiant-progress-bar {
  background-image: -o-linear-gradient(left, #fbd62f, #fdb91c, #fc9c16, #f87e1b, #f05e25);
  background-image: -webkit-gradient(linear, left top, right top, from(#fbd62f), color-stop(#fdb91c), color-stop(#fc9c16), color-stop(#f87e1b), to(#f05e25));
  background-image: linear-gradient(to right, #fbd62f, #fdb91c, #fc9c16, #f87e1b, #f05e25);
}

.input-group {
  box-shadow: 7px 6px 0px 0px rgba(147, 147, 147, 0.75);
  -webkit-box-shadow: 7px 6px 0px 0px rgba(147, 147, 147, 0.75);
  -moz-box-shadow: 7px 6px 0px 0px rgba(147, 147, 147, 0.75);
}

.form-control {
  border-end-end-radius: 20px;
  border-start-end-radius: 20px;
}

.l-s-10 {
  letter-spacing: 10px;
}

.modal-content {
  border-radius: 20px !important;
  border: unset !important;
}


.logo_1 {
  width: 189px;
  height: 112px;
}

.logo_2 {
  width: 188px;
  height: 86px;
}

.logo_3 {
  width: 102px;
  height: 84px;
}

.form-control::-webkit-input-placeholder {
  font-size: var(--font19);
  line-height: 26px;
  color: var(--dtres) !important;
  opacity: 1 !important;
  font-family: myriad;
}

.form-control::-moz-placeholder {
  font-size: var(--font19);
  line-height: 26px;
  color: var(--dtres) !important;
  opacity: 1 !important;
}

.form-control:-ms-input-placeholder {
  font-size: var(--font19);
  line-height: 26px;
  color: var(--dtres) !important;
  opacity: 1 !important;
}

.form-control::-ms-input-placeholder {
  font-size: var(--font19);
  line-height: 26px;
  color: var(--dtres) !important;
  opacity: 1 !important;
}

.form-control::placeholder {
  font-size: var(--font19);
  line-height: 26px;
  color: var(--dtres) !important;
  opacity: 1 !important;
}

.cuatro3 {
  color: #2cd5bd !important;
}

.bg-cuatro3 {
  background-color: #2cd5bd !important;
}

.bg-amarillo {
  background-color: #ff6300 !important;
}

.bg-uno8 {
  background-color: var(--uno8) !important;
}

.h-3 {
  height: 5px;
}

.verde {
  color: var(---verde) !important;
}

.bg-b1 {
  background-color: var(---buno) !important;
}

.bg-ea {
  background-color: var(--eaea) !important;
}

.bg-rojo {
  background-color: var(--e8) !important;
}

.rojo {
  color: var(--e8) !important;
}

.text-justify {
  text-align: justify !important;
}

.text-align-start-movil {
  text-align: start;
}

.text-align-end-movil {
  text-align: end;
}

.btn-header {
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: auto 0 0 auto;
}

.progress {
  height: 30px;
  border-end-start-radius: 0px;
  border-start-start-radius: 0px;
  border-start-end-radius: 20px !important;
  border-end-end-radius: 20px !important;
}

.progress-bar {
  -webkit-box-orient: horizontal !important;
  -webkit-box-direction: normal !important;
  -ms-flex-direction: row !important;
  flex-direction: row !important;
  -webkit-box-pack: end !important;
  -ms-flex-pack: end !important;
  justify-content: end !important;
  line-height: 27px;
  padding-right: 15px;
  font-size: var(--font14);
  border-end-end-radius: 20px;
  border-start-end-radius: 20px;
}

.l-h-22 {
  line-height: 22px;
}

.l-h-26 {
  line-height: 26px;
}

.l-h-14 {
  line-height: 14px;
}

.l-h-23 {
  line-height: 23px;
}

.l-h-44 {
  line-height: 44px;
}

.l-h-45 {
  line-height: 45px;
}

.l-h-37 {
  line-height: 37px;
}

.l-h-57 {
  line-height: 57px;
}

.l-h-27 {
  line-height: 27px;
}

.f-w-900 {
  font-weight: 900 !important;
}

.f-w-600 {
  font-weight: 600 !important;
}


.w-350 {
  max-width: 350px;
  height: auto;
}

.text-center-movil {}

.br-20 {
  border-radius: 20px;
}

.video {
  width: 100%;
  height: 624px;
}

.mtop-5 {}

.cursor-pointer {
  cursor: pointer !important;
}

@media (max-width: 1199px) {

  .btn-header {
    margin: 0 auto !important;
  }

  .bg-white.p-3 {
    height: 250px;
  }

  .col-12.text-center.position-absolute.bottom-0 {
    position: unset !important;
  }

  .fs-36 {
    font-size: var(--font30) !important;
  }

  /* .video {
    width: 500px !important;
  } */

  .mtop-5 {
    margin-top: 3rem !important;
  }

  /* .video {
    position: unset !important;
    top: unset !important;
    left: unset !important;
    -webkit-transform: unset !important;
    -ms-transform: unset !important;
    transform: unset !important;
  } */
}

@media (max-width: 1000px) {

  .col-12.text-center.position-absolute.bottom-0 {
    position: absolute !important;
  }

  .w-350 {
    max-width: 100% !important;
  }

  .concursante {
    font-size: var(--font30) !important;
  }

  .vota {
    font-size: var(--font37) !important;
    line-height: unset !important;
  }

}

@media (max-width: 992px) {

  .logo_1,
  .logo_2{
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
  }

  .btn-header {
    font-size: var(--font13) !important;
  }

  .bg-white.p-3 {
    height: auto !important;
  }
}

@media (max-width: 767px) {


  .video {
    height: 500px;
  }

  .col-12.text-center.position-absolute.bottom-0 {
    position: unset !important;
  }

  .col-xxl-4.col-xl-4.col-lg-5.col-md-6.col-sm-6.col-12.fs-31.f-w-600.l-h-37 {
    font-size: var(--font21) !important;
  }

  .w-350 {
    max-width: 100% !important;
  }

  .btn-header {
    margin: 0 auto !important;
  }

  .text-align-start-movil {
    text-align: center;
  }

  .text-align-end-movil {
    text-align: center;
  }
}


@media (max-width: 576px) {

  .logo_1,
  .logo_2 {
    width: 130px !important;
    height: auto !important;
  }

  .logo_3 {
    width: 70px !important;
    height: auto !important;
  }

  .video {
    height: auto;
  }

  .fs-120 {
    font-size: var(--font60) !important;
  }

  .btn-header {
    font-size: var(--font16) !important;
  }

  .text-center-movil {
    text-align: center !important;
  }

  /* .video {
    width: 100% !important;
    height: 250px !important;
  } */

}


@media (max-width: 400px) {

  .concursante {
    letter-spacing: unset !important;
    font-size: 100% !important;
  }

  .vota {
    font-size: 100% !important;
  }
}


@media (max-width: 300px) {

  .logo_1,
  .logo_2 {
    width: 100% !important;
    height: auto !important;
  }

  .logo_3 {
    max-width: 100% !important;
    height: auto !important;
  }
}