Hestia Theme und Logo Anpasseung

Hallo,

ich habe einem bekannten gesagt ich schaue mal über sein Design weil sein Logo bei kleinerer Auflösung nicht verkleinert wird.

Er hat damit das ganze auf dem Desktop gut aussieht in der CSS eingetragen

.navbar .navbar-header img {
    width: auto;
    min-height: 130px;
   min-width: 500px;
}

Damit das ganze auch auf dem Smartphone gut aussieht hat er angegeben

@media (max-width: 991px) {
  .navbar-header .navbar-brand img {
    width: auto;
    max-height: 50px;
    max-width: 50px;
}
}


@media (min-width: 769px) {
  .navbar-header .navbar-brand img {
    width: auto;
    max-height: 50px;
    max-width: 50px;
  }
}


@media (max-width: 480px) {
  .navbar-header .navbar-brand img {
   width: auto;
    max-height: 50px;
    max-width: 50px;
}

Leider funktioniert das nicht. Es handelt sich dabei um das Hestia Theme und diese Seite https://www.genuss-festival-dormagen.de/

Könnt Ihr mir dabei helfen?

Ich habe es jetzt auf min-width geändert. Nun wird es in der Desktop Version falsch angezeigt