[Bug] error en imagen y video

tengo todo el codigo exactamente igual (creo) no se si alguien me pueda ayudar

@media screen and (min-width: 1024px) {
  .institucional__contenido {
    width: 100%;
    display: flex;
    justify-content: space-between;
    text-align: left;
  }

  .institucional__video {
    align-self: flex-end;
    width: 375px;
  }

  .institucional__contacto-email {
    display: block;
  }
}

<section class="institucional container">
      <h2 class="institucional__titulo">Institucional</h2>
      <div class="institucional__contenido">
        <div class="institucional__informaciones">
      <p class="institucional__descripcion">Un poco más sobre Apeperia</p>
      <address class="institucional__direccion">
        Calle Vergueiro, 3185</br>
        Villa Mariana, São Paulo
        <article class="institucional__contacto">
          <p>
            <a href="tel:+551155712751" class="institucional__contacto-telefono">+55 11 55712751</a> o
            <a href="mailto:contato@apeperia.com" class="institucional__contacto-email">contato@apeperia.com</a>
          </p>
        </article>
      </address>
        </div>
      <video src="img/formacion-java.mp4" class="institucional__video" controls></video>
      </div>
    </section>

<section class="sobre_nosotros container">
      <div class="sobre_nosotros__contenido">
        <h2 class="sobre_nosotros__titulo">Sobre nosotros</h2>
        <p class="sobre_nosotros__texto">
          ¡Creamos aplicaciones personalizados para todas las personas!
        </p>
        <p class="sobre_nosotros__texto">
          La manutención de una aplicación no puede ser un custo extra para el cliente.
          En Apeperia firmas nuestro servicio la manutención ya se incluye en el servicio.
          De esa manera no te preocupes con la actualización, es por cuenta de nosotros.
        </p>
        <p class="sobre_nosotros__texto sobre-nosotros__texto--destacado sobre-nosotros__texto--division">
          ¡Tenemos un equipo especializado y exclusivo para proyectos increíbles!
        </p>
        <ul class="sobre_nosotros__plataformas">
          <li><img src="img/android.png" alt="Ícono del Android"></li>
          <li><img src="img/blackberry.png" alt="Ícono del Blackberry"></li>
          <li><img src="img/apple.png" alt="Ícono de la Apple"></li>
          <li><img src="img/windowsphone.png" alt="Ícono del Windows"></li>
        </ul>
        <p class="sobre_nosotros__texto">Desarrollamos aplicaciones para todas plataformas</p>
      </div>
      <img src="img/sobre-apeperia.png" alt="Sobre Nosotros" class="sobre_nosotros__imagen">
    </section>

@media screen and (min-width: 1024px) {
  .sobre_nosotros {
    display: flex;
  }
  .sobre_nosotros__contenido {
    margin-right: 3rem;
  }
  .sobre_nosotros__titulo {
    text-align: left;
  }
  .sobre-nosotros__texto--division {
    border-bottom: 1px solid var(--cinza-medio);

    padding-bottom: 1.5rem;
  }
  .sobre_nosotros__imagen {
    display: block;
  }
}

no se me puedan ayudar gracias y que estén bien