animazione css che parte alla fine del video

[neo1976]

Non conosco l'evento qui c'è un esempio con l'evento in linea. fedeIn è una funzione va con le parentesi tonde fadeIn()

l'evento che dovrei far partire alla fine del video e non ci riesco è questa animazione css
(praticamente dei box che si spostano da sinistra verso destra in 18 secondi entrando quindi nella pagina, invece di farli entrare dopo 18 secondi vorrei farli entrare alla fine del video):

.card {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
      -ms-flex: 1;
          flex: 1;
      position: relative;
  left: -1500px;
  -webkit-animation: 1.5s cubic-bezier(0.53, 0.2, 0.54, 1.33) 18s 1 slidein;
          animation: 1.5s cubic-bezier(0.53, 0.2, 0.54, 1.33) 18s 1 slidein;
  -webkit-animation-fill-mode: forwards;
          animation-fill-mode: forwards;
}
.card:last-of-type {
  margin-right: 0;
}


.card:nth-of-type(2) {
  -webkit-animation-delay: 18s;
          animation-delay: 18s;
  -webkit-animation-duration: 1.75s;
          animation-duration: 1.75s;
}


.card:nth-of-type(3) {
  -webkit-animation-delay: 18s;
          animation-delay: 18s;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
}


@-webkit-keyframes slidein {
  from {
    left: -1500px;
  }
  to {
    left: 0;
  }
}


@keyframes slidein {
  from {
    left: -1500px;
  }
  to {
    left: 0;
  }
}




}