@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

/* style.css import app.css
and block.css and style
switcher plugin*/
@import url(style.css);
@import url(estilos.css);
@import url(social-media.css);

/* import navbar styles */
@import url(headers/header-styles-1.css);

/* import footer styles */
@import url(footers/footer-styles.css);

/* whatsapp icon */
@import url(whats-icon.css);

/* GENERAL STYLES */

* {
  font-family: 'Open Sans', sans-serif;
  /* overflow: hidden; */
}

.title-section {
  text-align: center;
  margin-bottom: 16px;
}

.title-section h2 {
  font-size: 28px;
  font-weight: 600;
  color: black;
}






/* index.html */

/* banner with video classes */

.header-area {
  top: 0;
  left: 0;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  position: relative;
}

.header-video {
  position: absolute;
  width: 100%;
}

.header-video video {
  width: 100%;
  height: 90vh;
  min-height: 100vh;
  background-size: cover;
  object-fit: cover;
}

.banner-header-content {
  position: absolute;
  background-color: rgba(6, 25, 81, 0.6);
  color: #fff;
  margin: auto;
  justify-content: center;
  align-items: center;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 100vh;
  text-align: center;
}

.banner-header-content img {
  width: 20rem;
}

.banner-header-content h1 {
  width: 15rem;
  color: #fff;
  width: 50%;
}

.banner-header-content h1 span {
  font-weight: 600;
}


/* terminales-portatiles-de-lectura.html */
.hytPlayerWrap {
  position: relative;
}

.hytPlayerWrap.ended::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  cursor: pointer;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 60% 100%;
  background-image: url("img/fondo.jpeg");
}

.hytPlayerWrap.paused::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: calc(100%);
  cursor: pointer;
  background-color: black;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 800px 100%;
  background-image: url("https://i.ya-webdesign.com/images/play-button-png-16.png");
}

.yt-video {
  width: 100%;
  aspect-ratio: 16/9;
  /* box-shadow: rgba(0, 0, 0, 0.19) 0px 10px 20px, rgba(0, 0, 0, 0.23) 0px 6px 6px; */
  /* box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px; */
  box-shadow: rgba(0, 0, 0, 0.25) 0px 25px 50px -12px;
  border-radius: 20px;
}

@media (max-width: 768px) {
  .yt-video {

  }
}

#mensaje_status {
  margin-top: 16px;
}