/* Styles für Baummenu (Listenelemente) */

/* allgemeine Positionierung und Definitionen */
.TreeMenu {
  padding: 10px 18px;
  margin: 0;
}

.TreeMenu ul, .TreeMenu li {
  padding: 0px;
  margin: 0px;
  list-style-type: none;
  clear: both;
}

/* Stildefinition für 1. Ebene */

.TreeMenu ul li a {
  padding: 5px 0 5px 10px;
  margin: 0;
  display: block; /* damit gesamte Zeile als Link aktiv wird */
  color: #1F1F2C;
  font-weight: normal;
  text-decoration: none;
  border-bottom: 2px dotted #771156;
}
#Content.jugend .TreeMenu ul li a {
  border-bottom: 2px dotted #339900;
}

/* Stildefinition für 2. Ebene */

.TreeMenu ul ul li a {
  padding: 5px 0 5px 20px;
  margin: 0;
  display: block; /* damit gesamte Zeile als Link aktiv wird */
  color: #1F1F2C;
  font-size: 90%;
  font-weight: normal;
  background-image: url(../images/menuitem.gif);
  background-repeat: no-repeat;
  background-position: 20px 0px;
}

/* Stildefinition für 3. Ebene */

.TreeMenu ul ul ul li a {
  padding: 3px 0 3px 30px;
  margin: 0;
  display: block; /* damit gesamte Zeile als Link aktiv wird */
  color: #1F1F2C;
  font-size: 80%;
  font-weight: normal;
  background-image: url(../images/menuitem.gif);
  background-repeat: no-repeat;
  background-position: 35px 0px;
}

/* Stildefinition für 4. Ebene */

.TreeMenu ul ul ul ul li a {
  padding: 3px 0 3px 40px;
  margin: 0;
  /*height: 1.375em;*/
  display: block; /* damit gesamte Zeile als Link aktiv wird */
  color: #1F1F2C;
  font-weight: normal;
}

/* für Mozilla/Firefox */
.TreeMenu ul > li { display: list-item; }
.TreeMenu li > a { width: auto; height: auto; }

/* Style MouseOver */
.TreeMenu li a:hover {
  background-color: #771156;
  color: #fff;
  cursor: pointer;
}
#Content.jugend .TreeMenu li a:hover {
  background-color: #339900;
}

/* Style aktiver Menupunkt */
.TreeMenu li a.activePage {
  background-color: #771156;
  color: #fff;
}
#Content.jugend .TreeMenu li a.activePage {
  background-color: #339900;
}