header{
  width: 100%;
}

#calmecac:hover{
  opacity: 0.5;
}

img{
  width: 100%;
}

a{
  padding: 10px;
  color: black;
  text-decoration: none;
}

a:hover{
  color: #f000ff;
  background-color: black;
  border-radius: 5px;
}

/*header*/
header > img{
  height: 100px;
}

/*Estilos del carrusel*/
.carrusel{
  width: 95%;
  margin: auto;
  overflow: hidden;/*Oculta los elementos que se salen del carusel*/
  border: 3px solid #01579B;
  border-radius: 3%;
  /*cursor: pointer;*/
}
.carrusel ul{
  display: flex;
  padding: 0;
  width: 500%;
  animation: cambio 25s infinite;
  /*animation-direction: reverse;*/
  animation-timing-function: linear;
}

.carrusel li{
  width: 100%;
  list-style: none;
}

.carrusel img{
  width: 100%;
  height: 500px;
  cursor: pointer;
}

@keyframes cambio {
  0% { margin-left: 0;}
  10% { margin-left: 0;} /*Durante x seg se ve la 1ra img*/
  /*El cambio de 1 img a otra dura 1seg*/
  13% {margin-left: -100%;} /*Empieza la 2da img */
  33% {margin-left: -100%;}

  36% {margin-left: -200%;} /*Empieza la 3ra img */
  56% {margin-left: -200%;}

  59% {margin-left: -300%;} /*Empieza la 4ta img */
  79% {margin-left: -300%;}

  81% {margin-left: -400%;} /*Empieza la 5ta img */
  100% {margin-left: -400%;}

}

#circ1{
  animation: movimiento1 25s infinite;
}

#circ2{
  animation: movimiento2 25s infinite;
}

#circ3{
  animation: movimiento3 25s infinite;
}

#circ4{
  animation: movimiento4 25s infinite;
}

#circ5{
  animation: movimiento5 25s infinite;
}

@keyframes movimiento1 {
  0% {background-color: blue;}
  10% {background-color: blue;}

  13% {background-color: transparent;} /*Empieza la 2da img */
  100% {background-color: transparent;}
}

@keyframes movimiento2 {
  0% {background-color: transparent;}
  10% {background-color: transparent;}

  13% {background-color: blue;}
  33% {background-color: blue;}

  36% {background-color: transparent;}
  100% {background-color: transparent;}
}

@keyframes movimiento3 {
  0% {background-color: transparent;}
  33% {background-color: transparent;}

  36% {background-color: blue;}
  56% {background-color: blue;}

  59% {background-color: transparent;}
  100% {background-color: transparent;}
}

@keyframes movimiento4 {
  0% {background-color: transparent;}
  56% {background-color: transparent;}

  59% {background-color: blue;}
  79% {background-color: blue;}

  81% {background-color: transparent;}
  100% {background-color: transparent;}
}

@keyframes movimiento5 {
  0% {background-color: transparent;}
  79% {background-color: transparent;}

  81% {background-color: blue;}
  100% {background-color: blue;}
}

.circulo{
  display: inline-block;
  width: 13px;
  height: 13px;
  padding: 0;
  border-radius: 50%;
}

.circBorde{
  border: 1px solid white !important;
}

.transparente{
  background-color: transparent;
}

.relleno:hover{
  color: #000;
  background-color: blue !important;
}
/* Otros */

.hgh{
  height: 100px;
}
.col-1medio{
  width: 12.498%;
}

.col-20{
  width: 20%;
}

.mB-2{
  margin-bottom: 2%;
}

.mt10{
  margin-top: -10%;
}

.mt2{
  margin-top: -2%;
  /*margin-bottom: 0px;*/
}

.mtDos{
  margin-top: -1.8%;
}

.mtUno{
  margin-top: -1%;
}

.mL-2{
  margin-left: 7%;
}

/*Estilos tarjetas*/
.tarjetas{
  margin: 2%;
  color: white;
}

.datos{
  display: none;
}

.fondoPurp{
  background-color: rgba(74,20,140,0.8);
}

.fondoBlk{
  background-color: black;
}
/*Enlaces páginas*/
.paginas{
  text-align: left;
}

.enlacesPag{
  color: white;
  text-decoration: underline;
}
