body { font-family: sans-serif; }

#hero-image{
    filter: brightness(0.8) saturate(0.8);
}

#hero-text{
    text-shadow: 0 10px 20px rgb(0, 0, 0);
}




@media (max-width: 1016px) {
  #hero-image {
    aspect-ratio: 16/9;
  }
  #hero-text{
    width:600px
  }
}

@media (max-width: 870px) {
  #hero-image {
    aspect-ratio: 4/3;
  }
}

@media (max-width: 580px) {
  #hero-image {
    aspect-ratio: 3/4;
  }

  #hero-text{
    width:300px
  }
}

@media (max-width: 450px) {
  #hero-image {
    aspect-ratio: 9/16;
  }
}