@charset "UTF-8";
/* CSS Document */
a{ cursor: pointer;}
section {
  padding: 40px 0 20px 0;
  scroll-margin-top: 80px;
}
.arts {
  background-color: #a582ba85;
}
.social {
  background-color: #00a7da5c;
}
.natural {
  background-color: #52ae3257;
}
.oup-blue {
  background-color: #011E41;
}
.demos {
  padding: 30px;
  margin-bottom: 20px;
}
.logo-WC {
  width: 200PX;
  margin: 10px 0 0 0;
}
.logo-asignatura {
  width: 150px;
  margin: 12px 0 30px 0;
}
.nav-link {
  color: #ffffff;
}
.nav-link:hover {
  color: #e01b85;
}
.sombra {
  text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5);
}
/*video*/
#inicio {
  padding-top: 20px;
}
.capa-video {
    background-color: #a9639fb0;
    background-image: url(img/textura2.png);
    background-size: cover;
    /* border-bottom: 10px solid; */
    /* border-image: linear-gradient(to right, #df1b85, #7963a9) 1; */
}
#galeria {
  background-image: url(img/textura2.png);
  background-size: contain;
}
.cubierta {
  cursor: pointer;
}
.cubierta:hover {
  box-shadow: -1px 4px 10px #333;
  transition: box-shadow 0.5s;
}
.carousel-control-next-icon, .carousel-control-prev-icon {
  width: 5rem;
  height: 5rem;
}
/* footer */
footer {
  background: #111;
  color: #fff;
  padding: 20px 0;
  font-size: 10px;
}
footer a {
  color: #bbb;
  text-decoration: none;
}
footer img {
  height: 30px;
  margin-right: 15px;
}
/*carrusel*/
#multiCarousel img {
  transition: transform .3s ease;
}
#multiCarousel img:hover {
  transform: scale(1.05);
}
.fila {
  margin: 0 auto;
  /* width: 1000px; */
}
/* parallax */
.parallax {
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 120px 0;
}
.demos {
  padding: 30px;
  margin-bottom: 20px;
  border-radius: 30px;
}
/*Fuentes*/
h1, h2, h3, .nav-link {
  font-family: "marvin", sans-serif;
  font-weight: 400;
  font-style: normal;
}
body, p {
  font-family: muli, sans-serif;
  font-weight: 400;
  font-style: normal;
}
/*escala de grises flips no disponibles*/
.gs {
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
  opacity: 0.9;
  filter: alpha(opacity=90);
}
.posicionamiento{
	text-align: center;
	padding-top: 145px;
	font-size: 27px;
	padding-bottom: 13px;
	color: #011e41;
	font-family: "marvin", sans-serif;
	font-weight: 400;
	font-style: normal;
	border-bottom: 2px solid !important;
	}
/*audio*/
.audio-card {
      background: #011E41;
      border-radius: 1.25rem;
      padding: 1.75rem;
      color: #f9fafb;
      box-shadow: 0 18px 45px rgba(0,0,0,0.5);
    }
    .audio-cover {
      width: 70px;
      height: 70px;
      border-radius: 1rem;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.6rem;
      font-weight: bold;
      color: #111;
      background-image: url(img/audio.png);
      background-size: cover;
    }
.audio-cover-talking{
	width: 70px;
      height: 70px;
      border-radius: 1rem;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.6rem;
      font-weight: bold;
      color: #111;
      background-image: url(img/talkingbook.png);
      background-size: cover;
}
    .audio-controls button {
      width: 48px;
      height: 48px;
      border-radius: 50%;
      border: none;
      background: linear-gradient(135deg, #e01b85, #7a63a9);
      color: #fff;
      transition: .2s;
    }
    .audio-controls button:hover {
      background: #374151;
    }
#next, #prev, #next2, #prev2 {display: none;}
    .btn-main {
      width: 60px !important;
      height: 60px !important;
      background: linear-gradient(135deg, #f97316, #ec4899);
      color: #111 !important;
      font-size: 1.4rem;
    }
    .progress {
      height: 6px;
      border-radius: 10px;
      background: #273547;
    }
    .progress-bar {
		background: linear-gradient(90deg, #cf288c, #9451a0);
		}

.modal-header{  font-family: "marvin", sans-serif;
  font-weight: 400;
  font-style: normal;}
.fondo-modal {
    background-color: #ffd2f9;
    background-image: url(img/textura2.png);
    background-size: cover;
    border-bottom: 10px solid;
    border-image: linear-gradient(to right, #df1b85, #7963a9) 1;
}
.posicionamiento-video {
    text-align: center;
    font-size: 27px;
    padding: 13px;
    color: #ffffff;
    font-family: "marvin", sans-serif;
    font-weight: 400;
    font-style: normal;
    z-index: 10;
    width: 100%;
    border: none;
    background: #D62B89;
    background: linear-gradient(326deg, #d62b89 0%, #7a63a9 100%);
}