* {
  box-sizing: border-box;
}

body {
  margin: 0;
}

.site-nav {
  width: 100%;
  background: url(../images/KlaudiaHauer_HG-Navi.png) repeat-y;
}

.menu,
.menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

/* Hauptmenüpunkte */
.menu > li > a {
  display: block;
  padding: 9px 12px;
  color: #3a2c23;
  border-top: 1px solid #3a2c23;
  font-family: "Square 721 W01 Extended", Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  text-decoration: none;
  text-transform: uppercase;
}

/* Untermenüpunkte */
.menu ul a {
  display: block;
  padding: 9px 12px;
  color: #3a2c23;
  /* border-bottom: 1px solid var(--menu-border); */
  font-family: "Square 721 W01 Roman", Arial, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  text-decoration: none;
}

.menu a:hover,
.menu a:focus-visible {
  color: #fff;
  background-image: URL("../images/KlaudiaHauer_HG-Menu-Hover.jpg") ;
  background-repeat:repeat;
  background-position:left top ;
}

/* Untermenüs bleiben immer sichtbar. */
.menu ul {
  display: block;
  padding-left: 14px;
}

/* Kennzeichnung für Hauptpunkte mit Untermenü */
.menu > li.has-submenu > a::before {
  content: "";
}

@media (max-width: 600px) {
  .menu a {
    overflow-wrap: anywhere;
  }
}