.banner {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 80vh;
  background-repeat: no-repeat;
  background-position: center;
  color: var(--banner-text);
  font-weight: bold;
  background-image: url('../assets/images/obama_cuerpo.png');
}

@media screen and (width > 768px) {
  .banner {
    background-image: url('../assets/images/obama.png');
    /* Imagen para desktop */
  }
}