/* ==========================================================================
   GENERAL
   ========================================================================== */
::selection {background:#00A1AF;}
body, .cd-main-content {background-color:#f8f9fb;}
h3 {font-size:30px; font-weight:bold;}
a.novedad:hover {color:#00c975}
a.noicon:hover {color:#00e284}
.main-content {margin-top:0;}

section h3 {font-size:30px; padding:0; margin:0;}
section h4 {font-size:15px; font-weight:bold; padding:0; margin:0;}
section p {font-size: 16px;padding: 10px;}

/*
.bg-Calvo {
    background-color:#00A1AF !important;
    background-image:url('../Images/Calvo-conference/bk-Calvo-conference-v3.png');
    background-size:cover;
    background-position: 25% 75%;
}
*/

.bg-Calvo {
    background-color:#00A1AF !important;
    background-image:url('../Images/Calvo-conference/calvo_guillermo_v1.png');
    background-size:cover !important;
    background-position: 15% 30% !Important;
    /*background-position-x:50px !Important;*/
}

.button-blue {
    display:inline-block;
    padding:1em 2em;
    -webkit-box-shadow:inset 0 0 0 3px #7cb0d9;
    -moz-box-shadow:inset 0 0 0 3px #7cb0d9;
    box-shadow:inset 0 0 0 3px #7cb0d9;
    color:#7cb0d9!important;
    transition:all .6s;
    font-family:'Montserrat', sans-serif!important;
    font-weight:700;
    text-transform:uppercase;
}
.button-white {
    display: inline-block;
    padding: 1em 2em;
    -webkit-box-shadow: inset 0 0 0 3px #fff;
    -moz-box-shadow: inset 0 0 0 3px #fff;
    box-shadow: inset 0 0 0 3px #fff;
    color: #fff !important;
    transition: all .6s;
    font-family: montserrat, sans-serif !important;
    font-weight: 700;
    text-transform: uppercase;
}
.button-white:hover{background-color:#97c5e9}
.button-blue:hover{background-color:#f2f7fb}

/* ==========================================================================
   SLIDER HERO
   ========================================================================== */

.container-hero-slider, .container-graf {
  min-height:480px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.container-hero-slider > .row {
  height:100%;
  background-size:48%;
  background-repeat:no-repeat;
  background-position:97%;
}

.container-hero-slider h1, .container-hero-slider h2{
  text-align:initial;
  color: #fff;
  padding: 0;
  margin: 0;
}
.container-hero-slider h1{
  font-size: 50px;
  font-weight: bold;
}
.container-hero-slider h2{
  font-weight: 500;
}

/* ==========================================================================
   SECONDARY NAV
   ========================================================================== */

.top-ditella-escuela {
  height:40px;
  padding-top:4px;
  margin-bottom:0px!important;
  background: #f9f9f9;
}

nav > ul#menu > li > .btn-folleto {
  -webkit-box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,1);
  -moz-box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,1);
  box-shadow: inset 0px 0px 0px 1px rgba(255,255,255,1);
  border-radius:0px;
  color:#fff;
  padding:4px 15px;
  margin-left:7px;
}

nav > ul#menu > li > .btn-folleto:hover {
  background:#fff!important;
  color:#7cb0d9!important;
}

.top-ditella-escuela .nav li > a:hover {
  border-radius:0px;
}

.top-ditella-escuela h1 a{color: #fff!important;}

.top-ditella-escuela a {color: #fff!important;}

/* ==========================================================================
   THIRD NAV: CARDS
   ========================================================================== */

.container-third-nav {
  padding-bottom:20px;
 /* background: #838383;*/
  background: linear-gradient(2deg, rgb(230 231 233) 0%, rgb(230 231 233) 35%, rgb(127 127 127) 100%);
}
.container-third-nav .clickable-card {
  background-color:#fff;
  margin:0 10px;
  text-align:center;
  display:block;
  box-shadow:5px 5px 25px 0 rgba(46,61,73,.2);
  transition:0.2s ease-in-out;
  padding:25px;
  padding-top:32px;
  font-size:15px;
  font-weight:bold;
  color:#00A1AF;
}
.container-pub .clickable-card {
  background-color:#fff;
  margin:0 10px;
  text-align:left;
  display:block;
  box-shadow:2px 4px 8px 0 rgba(46,61,73,.2);
  transition:0.2s ease-in-out;
  padding:25px;
  padding-top:32px;
  font-size:15px;
  color:#00A1AF;
}
.container-third-nav .clickable-card:hover{
  box-shadow:2px 4px 8px 0 rgba(46,61,73,.2);
  color:#00A1AF;
}
.container-pub .clickable-card:hover {
  box-shadow:5px 5px 25px 0 rgba(46,61,73,.2);
  color:#00A1AF;
}

/* ==========================================================================
   1. GRAFICO
   ========================================================================== */

.container-graf {padding: 5px 0; margin-top:0;background-color: #81818126;}
/*.container-graf p {color:#fff;}*/
.container-graf img:first-child {max-width:1024px; margin-top:10px;}

/* ==========================================================================
   2. INTEGRANTES
   ========================================================================== */

.container-integrantes {padding:70px 0;}
.container-integrantes h3 {margin-bottom:1em;}
.container-integrantes .illus-perfil-graduado img {padding-right:20px;}
.container-integrantes hr {
    content:'';
    width:60px;
    margin: 0 auto;
    border-bottom:4px solid #2b2b2d;
}

/* ==========================================================================
   3. PROYECTOS
   ========================================================================== */
.tituloagenda{color: #00A1AF; height: 80px; padding: 19px 24px 0px 14px !important;}

.container-proyectos {background-color:#f1f1f1; padding:20px 0 0 0;}

/*.container-proyectos > div:nth-of-type(even) { background:#91af34!important;}*/
.container-proyectos > div:nth-of-type(even) { background:#f6f6f6!important;}
.container-proyectos > div, .container-proyectos > div:nth-of-type(even) {
    padding:0px 0;
}

.container-proyectos .portada-historia {margin-bottom:35px;}
.container-proyectos .portada-historia small {color:#ffffff; padding:0; margin:0;}
.container-proyectos h4, .container-proyectos p {color:#ffffff; margin-bottom:1em;}
.container-proyectos p {color:#2b2b2d!important;}
.container-proyectos h3 {margin-bottom:1em;color: #00A1AF;}

.container-proyectos hr {
    content:'';
    width:60px;
    margin:10px auto;
    border-bottom:4px solid #00A1AF;
}
.container-proyectos img {width:80%;}
/*.container-proyectos .whole {background:#00A1AF; padding:30px 0;}*/

/* ==========================================================================
   4. PUBLICACIONES
   ========================================================================== */

.container-publicaciones {padding:0px 0 0px 0;background-color: #fff;}
.container-publicaciones h3 {margin-bottom:1em;}
.container-publicaciones hr {
    content:'';
    width:60px;
    margin: 0 auto;
    border-bottom:4px solid #2b2b2d;
}
.container-publicaciones .patrocinadores img {
    width:40%;
}

/* ==========================================================================
   CONTACTO
   ========================================================================== */

.container-contacto {background-color: #0c5f67; padding:0; color: #ffffff;}
.container-contacto .row-cont {background-color:#00A1AF; padding: 3em; top: -60px; width:90%;}
.container-contacto h3 {color: #ffffff;}
.container-contacto .contacto h5 {color: #ffffff;}
.container-contacto .contacto .datos {color: #ffffff;}

.container-contacto button {color:#ffffff!important; border:3px solid white!important; background-color:initial!important;}
.container-contacto button:hover {background-color:#7cb0d9!important;}
.container-contacto .contacto {background:initial!important;}

button[type=submit], input[type=submit], input[type=button], input[type=reset] {
    opacity:1!important;
}

.form-contacto h2 {display: none;}
.form-contacto .legaltextinfo {display: none;}


/* ==========================================================================
   MEDIA QUERIES
   ========================================================================== */

@media only screen and (min-width: 768px){
  .clickable-card > .card::after {
      content:'';
      width:60px;
      height:4px;
      position:absolute;
      bottom:-15px;
      left:0px;
      background-color:#00A1AF;
  }
  .clickable-card:hover > .card::after {
      content:'';
      width:100%;
      height:4px;
      position:absolute;
      bottom:-15px;
      left:0px;
      background-color:#00A1AF;
      transition-duration:.3s;
  }

}
@media screen and (min-width: 480px) {
  .container-third-nav .clickable-card {text-align:left;}
  .container-proyectos h4::after {
      content:'';
      width:60px;
      border-bottom:2px solid #ffffff;
      position:absolute;
      left:0px;
      bottom:-12px;
      z-index:1;
  }
}
@media screen and (max-width: 1025px) {}
@media screen and (max-width: 900px) {
  .container-third-nav .clickable-card {height:90px;}
  section h4 {
      font-size: 16px;
      font-weight: bold;
      padding: 8px 00;
  }
  .container-proyectos .three {text-align: center!important;}
}
@media screen and (max-width: 480px) {
  .container-third-nav .clickable-card {padding:16px; height:60px;}
  .container-third-nav .clickable-card h5 {font-size:17px; margin:0;}
  .container-hero-slider, .container-graf {min-height:200px;}
  #contenido .row h3 {font-size:20px;}
}
@media screen and (max-width: 321px) {
  .container-third-nav .clickable-card {padding:12px; height:42px;}
  .container-third-nav .clickable-card h5 {font-size:14px;}
  .tabcss h4 {font-size:12px;}
}

/* ==========================================================================
   PURE CSS BACK TO TOP
   ========================================================================== */

.scrolltop-wrap {box-sizing: border-box; position: absolute; top: 12rem; right: 2rem; bottom: 0; pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1000000;}
.scrolltop-wrap #scrolltop-arrow {fill: white;}
.scrolltop-wrap a:hover #scrolltop-bg {fill: #00A1AF;}
.scrolltop-wrap a:hover #scrolltop-arrow {fill: white;}
@supports (-moz-appearance: meterbar) {
  .scrolltop-wrap {clip: rect(0, 3rem, auto, 0);}
}
.scrolltop-wrap a {
  position: fixed;
  position: -webkit-sticky;
  position: sticky;
  padding: 0!important;
  top: -5rem;
  width: 5rem;
  height: 5rem;
  margin-bottom: -5rem;
  -webkit-transform: translateY(100vh);
          transform: translateY(100vh);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  display: inline-block;
  text-decoration: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: all;
  outline: none;
  overflow: hidden;
}
.scrolltop-wrap a svg {display: block; width: 100%; height: 100%;}
.scrolltop-wrap a svg path {transition: all 0.1s;}
.scrolltop-wrap a #scrolltop-arrow {
  -webkit-transform: scale(0.66);
          transform: scale(0.66);
  -webkit-transform-origin: center;
          transform-origin: center;
}
[role~=button] { border-radius: 0px!important; }
@media print {
  .scrolltop-wrap { display: none !important; }
}


/* ==========================================================================
   CONTACTO
   ========================================================================== */
.contact-btn {background:rgba(0,0,0,0.2);}
a:hover.contact-btn {background-color:#7CAFD4;}

.contact-wrapper {display:flex; flex-direction:column; align-items:center; justify-content:center; align-items:center; padding:10px; border-radius:0px; position:fixed; top:80px; right:0px; z-index:10; color:white; transition:all 0.6s; top:311px;}
.contact-wrapper, .contact-btn {height:140px; width:110px; padding-top:25px; color:#fff!important;}
.contact-wrapper a:hover {color:#fff;}
.contact-wrapper p {font-size:14px; text-align:center; margin:0 10px;}
.contact-wrapper input {border-radius:15px; outline:none; display:flex;}
.contact-wrapper button {background:#25d366; border-radius:50%; border:0; padding:0; margin:0 5px;}
.contact-wrapper hr {border-top:1px solid white; width:70%;}

#contact-msng-icon {width:38px;}

@media only screen and (max-width: 767px) {
.contact-wrapper {top:initial; bottom:0px; left:20px; flex-direction:row; background-color:rgba(0, 0, 0, 1); height:70px; width:70px; padding-top:56px;}
.contact-wrapper input, .contact-wrapper button {display:none;}
.contact-wrapper, .contact-btn {width:64px!important;}
.contact-wrapper a, .contact-wrapper p {padding-top:23px;}
.contact-btn {margin:15px 10px 0px 10px; background:initial;}
#contact-msng-icon {width:26px;}
.container-hero-slider h1{width: 100%;color: #fff;font-size: 35px;top:0px !important;}
.bodycontent {width: 100% !important; max-width: 100% !important; display: none;padding-bottom:0px; }
.bodycontentrow{background:#efefef;margin:0px !important;}
.container-integrantes {padding: 10px 0;padding-bottom: 50px;}
.container-integrantes hr{top: -15px;}
.container-proyectos{padding:0px 0 0 0;}
.container-proyectos > div, .container-proyectos > div:nth-of-type(even) {padding:  0px 0; }
.utdt-component-3cols > div{padding: 5px !important;}
.utdt-component-3cols > div, em {background: #eee;  color: #000 !important; }
.bodytext {text-align: center !important; padding: 20px !important;}
.bodytext img{max-width:80px!important;}
.bodytext div {padding:0px 10px 0px;}
.sectionbloques h2 {
    color: #00a1af !important;
    padding-bottom: 0px !important;
    padding-top: 10px !important;
    font-size: 20px !important;
  }
  .sectionbloques p {
    color: #000;
    text-align: center !important;
    padding: 20px;
    margin-left: 0px !important;
    max-width: 100%;
  }
.btn {
    display: inline-block;
    padding: 20px 15px !important;
    color: #00A1AF !important;
    font-size: 15px !important;
    font-weight: 600;
    width: 100% !important;
    text-align: center;
    background: #fff;
  }
.btn em{
    color: #00A1AF !important;
    background: #fff;
    height:initial;
    padding: 0px !important;
  }
  .bodycontentrow h2 {margin-top:20px;}

  .bg-Calvo {
    background-position: 7% 90%;
  }

.bg-Calvo {
    background-position: 40% 60% !important;
    background-position-y:-60px !important;
}


  .ch-info{ position: absolute; width: 151px !important; height: 151px !important; border-radius: 50%; }
  .section h4 {font-size: 16px; font-weight: bold; padding: 8px 00; top: -50px; top: -50px;}
  .remodal img { height: auto; width:30% !important; background-repeat: no-repeat; background-position: 50%; 
  border-radius: 60%; background-size: 100% auto; }


.container-publicaciones .patrocinadores img {
    width:100%;
  }
  
}

.bodytext{ text-align: initial; }
.bodyimg{}
.avatar {
    height: auto;
    width:  80%;
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 60%;
    background-size: 100% auto;
}


.fadeInLeft{
  animation: fadeInLeft;
  animation-duration:2s;
}
.fadeInRight{
  animation: fadeInRight;
  animation-duration:2s;
}
.fadeInUpBig {
  animation: fadeInUpBig;
  animation-duration:2s;
}
.fadeInUp{
  animation: fadeInUp;
  animation-duration:2s;
}
.fadeInDownBig{
  animation: fadeInDownBig;
  animation-duration: 2s;
}
.bounceIn{
  animation: bounceIn;
  animation-duration: 2s;
}
.bounceInLeft{
  animation: bounceInLeft;
  animation-duration: 3s;
}
.bounceInRight{
  animation: bounceInRight;
  animation-duration: 3s;
}

.bodycontent{
  width:1350px; max-width:1350px;display: none;
}
.perfilescontent {/*display: none;*/ height:370px; max-height: 450px; cursor: pointer;}

/*.titAgenda{display: none;}*/
.imgtxt1{display: none;}
.txt2{display: none;}
.txt2 .btn_bio {}


.utdt-component-3cols div {font-size: 20px !important; color: #000 !important;}
.utdt-component-3cols > div, em {background:#eee;padding:15px; color:#000 !important;}
.utdt-component-3cols {min-height: 150px !important;}
/*.utdt-component-3cols h2, h3, h4, p, em, strong {color:#000;}*/
.utdt-component-3cols img {
    height: 150px;
    width: 150px;
    max-width:150px;
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 60%;
    background-size: 100% auto;
}
.container-proyectos h4, .container-proyectos p, em { color: #fff; margin-bottom: 1em; }
 /*.container-proyectos p {font-size: 20px !important;}*/
.utdt-component-2cols {display:none ;min-height:80px !important;justify-content: normal!important;border-top:1px solid #acacac;}
.utdt-component-2cols h2 {font-size: 2.00rem !important;}
.utdt-component-2cols div {font-size: 20px !important; color: #fff !important;}
.utdt-component-2cols > div {background: #fff0;padding: 15px;text-align: start;color: #000 !important;}
.utdt-component-2cols img {
    height: 80px;
    width: 80px;
    max-width:80px;
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 60%;
    background-size: 100% auto;
}
.bodycontentrow{background:#efefef;margin:55px;}
.sectionbloques p{ color:#000; text-align: initial; padding: 20px; margin-left: 100px;max-width: 900px;}
.sectionbloques h2{color: #00a1af !important;padding-bottom:15px;padding-top:15px;}

.btn{
    display: inline-block;
    padding: 20px 15px;
    color: #ffffff !important;
    font-size: 25px;
    font-weight: 600;
    width: 310px;
    text-align: center;
    background: #00A1AF;
    }
.btn em{
    color: #00A1AF !important;
    background: #fff;
    height:initial;
    padding: 0px !important;
}
.double-padded{padding: 50px;}

.btn_bio {background-color: #fff;margin: 0 10px;text-align: center;display: block;
  box-shadow: 5px 5px 25px 0 rgb(46 61 73 / 20%);transition: 0.2s ease-in-out;padding: 25px;
  padding-top: 20px;font-size: 15px;font-weight: bold;color: #00A1AF!important;height: 62px;}

.btn_bio:hover {
  box-shadow: 2px 4px 8px 0 rgb(46 61 73 / 20%);
    color: #00A1AF;
}
.linkbtn{
    position: absolute;
    top: 275px;
    width: -webkit-fill-available;
    height: 395px;
    }
.bodytext img{
    height: 80px;
    width: 80px;
    max-width: 80px;
    background-repeat: no-repeat;
    background-position: 50%;
    border-radius: 60%;
    background-size: 100% auto;
    max-width:80px!important;
  }

/*  EFECTOS  */

.ch-grid {
  margin: 20px 0 0 0;
  padding: 0;
  list-style: none;
  display: block;
  text-align: center;
  width: 100%;
  cursor: pointer;
}

.ch-grid:after,
.ch-item:before {
  content: '';
    display: table;
}

.ch-grid:after {
  clear: both;
}

.ch-grid li {
  width: 220px;
  height: 170px;
  display: inline-block;
  margin: 20px;
}

.ch-item {
  border-radius: 50%;
  position: relative;
  box-shadow: 0 1px 2px rgba(0,0,0,0.1);
  cursor: pointer;
}

.ch-info-wrap, 
.ch-info{
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 50%;
}

.ch-info-wrap {
  /*top: 20px;
  left: 20px;
  background: #f9f9f9 url(../images/bg.jpg);
  box-shadow: 
    0 0 0 20px rgba(255,255,255,0.2), 
    inset 0 0 3px rgba(115,114, 23, 0.8);
  */
}

.ch-info > div {
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-position: center center;
  
  -webkit-backface-visibility: hidden; /*Just for webkit to have a smooth font*/
}

.ch-info .ch-info-front {
  -webkit-transition: all 0.6s ease-in-out;
  -moz-transition: all 0.6s ease-in-out;
  -o-transition: all 0.6s ease-in-out;
  -ms-transition: all 0.6s ease-in-out;
  transition: all 0.6s ease-in-out;
}

.ch-info .ch-info-back {
  opacity: 0;

  background:#00A1AF;
  pointer-events: none;
  
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -o-transform: scale(1.5);
  -ms-transform: scale(1.5);
  transform: scale(1.5);
  
  -webkit-transition: all 0.4s ease-in-out 0.2s;
  -moz-transition: all 0.4s ease-in-out 0.2s;
  -o-transition: all 0.4s ease-in-out 0.2s;
  -ms-transition: all 0.4s ease-in-out 0.2s;
  transition: all 0.4s ease-in-out 0.2s;
}

.ch-img-1 {
  background-image: url(https://www.utdt.edu/Upload/_165901706559860400.png);
}

.ch-img-2 { 
  background-image: url(https://www.utdt.edu/Upload/_165928183984674400.jpg);
}

.ch-img-3 { 
  background-image: url(https://www.utdt.edu/Upload/_165928193676769000.jpg);
}

.ch-info h3 {
  color: #fff;
  letter-spacing: 2px;
  font-size: 17px;
  margin: 0 15px;
  padding: 40px 0 0 0;
  height: 100px;
  /*text-shadow: 0 0 1px #fff, 0 1px 2px rgba(0,0,0,0.3);*/
  font-weight: 100;
}

.ch-info p {
  color: #fff;
  padding: 10px 5px 0;
  font-style: italic;
  margin: 0 30px;
  font-size: 17px;
  border-top: 1px solid rgba(255,255,255,0.5);
}

.ch-info p a {
  display: block;
  color:  #ffffff;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 15px;
  letter-spacing: 1px;
  padding-top: 4px;
}

.ch-info p a:hover {
  color: #ffffff;
}

.ch-item:hover .ch-info-front {
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -o-transform: scale(0);
  -ms-transform: scale(0);
  transform: scale(0);
  
  opacity: 0;
} 

.ch-item:hover .ch-info-back {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -o-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  
  opacity: 1;
  pointer-events: auto;
}
.secondary em{ background:#eee0 !important;padding:0px!important;}

.remodal img {height: auto; width:  10%; background-repeat: no-repeat; background-position: 50%; 
border-radius: 60%; background-size: 100% auto;}
.remodal-close:after{color:#020202;}


.bg_cpoliticas .nav ul ul {
    background: #00A1AF !important;
    color:#fff !important;
    box-shadow: 2px 3px 7px 0px rgb(0 0 0 / 50%);
}
.bg_cpoliticas {
    transition: box-shadow 0.3s ease;
    box-shadow: 4px 3px 7px 0px rgb(0 0 0 / 11%);
    background: #fff !important;
}
/*.bg_cpoliticas:hover{ 
  box-shadow: 0px 4px 2px 1px rgb(0 161 175); 
}*/

.cuadros {
    height: 180px!important;
    display: flex;
    align-items: center;
    justify-content: center;
    top: -5px;
}