/*header seta e tirar o ret preto*/
.info ::before {
  display: none;
}

.info img {
  position: absolute;
  top: 360%;
  transform: translate3d(3.5%, 0px, 0px);
  transition: transform 1s ease-out;
}

.info img:hover {
  transform: translate3d(2%, 0px, 0px);
}

/*adaptações da grid */
[class*='col-'] {
  margin-top: 100px;
}

.col-main-content {
  position: relative;
  width: 80%;
  height: 72.63922518159806vh;
}

/*navbar da pagina dos contos quando se abre a página*/
.navbar {
  animation: one-time-animation 1s forwards 1;
  animation-name: navparacima;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

@keyframes navparacima {
  from {
    margin-bottom: 40vh;
    width: 70%;
  }

  to {
    margin-bottom: 93vh;
    width: 70%;
  }
}

/*videos*/
.retanguloconto {
  /* proporção do video = 23:12, logo 12/23 = 0,5217391304 * 100% = 52.17391304%*/
  padding-top: 52.17391304%;
  position: absolute;
  width: 100%;
  background-color: red;
  z-index: 1;
  left: 0px;
  top: 0px;
}

.video-overlay {
  position: absolute;
  width: 100%;
  height: auto;
  pointer-events: none;
  z-index: 2;
}

.video-overlay__video {
  width: 100%;
}

#player {
  position: absolute;
}

.video-vermelho {
  position: absolute;
  width: 100%;
  height: auto;
  top: 0;
  left: 0;
}

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

.container-arraste {
  position: absolute;
  width: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  bottom: 2%;
  left: 0;
}

@keyframes arrastaanim2 {
  0% {
    color: white;
  }

  50% {
    color: black;
  }

  100% {
    color: white;
  }
}

#arraste2 {
  color: white;
  text-align: center;
  vertical-align: middle;
  animation: arrastaanim2 1.3s ease-in infinite;
}