
/*VERTICAL MENU*/
nav.vertical{
  position:relative;

  width:180px;

	left: 0px; /*Abstand links*/
	z-index: 5; /*Höhe auf der Z-Ebene (in den Vordergrund)*/

}

/* ALL UL */
nav.vertical ul{
    list-style:none; /* kein Listen-stil, keine "Bullets"*/
    margin:0; /*kein Rand aussen*/
    padding:0; /* kein Rand innen */

}
/* ALL LI */
nav.vertical li{
  position:relative;
}
/* ALL A */
nav.vertical a{
  display:block;
  color:#eee;
  text-decoration:none;

  padding:10px 15px;

  background:#444;
  transition:0.5s;
}
/* ALL A HOVER */
nav.vertical li:hover > a{
  background:#666;
}

/* INNER UL HIDE */
nav.vertical ul ul{
  position:absolute;

  left:0%;
  top:0;

  width:100%;
  visibility:hidden;
  opacity:0;
  transition: transform 0.2s;
/*
  transform: translateX(50px);
*/
}
/* INNER UL SHOW */
nav.vertical li:hover > ul{
  left:100%;
  visibility:visible;
  opacity:1;
/*
  transform: translateX(0px);
*/
}


/* ================================================= */

.hackbox{
 display: none;
}

.dropdown-menu{
  display: none;
}

label {
  display: block;
  width: 180px;
  height: 2.5em;
  line-height: 2.5em;
  text-indent: 16px;

  color: #dddddd;
  background-Color: #333333;
  cursor: pointer;
  border-bottom: 1px solid #444;
}

label:hover {
  color: #ffffff;
  background-Color: #666666;
  transition:0.5s;
}


.dropdown div a{
  text-decoration: none;
  width: 180px;
  height: 2.5em;
  line-height: 2.5em;
  color: #dddddd;
  background-Color: #333333;
  display: block;
  text-indent: 40px;
  border-bottom: 1px solid #444;
}

div.menuEntryActive a{
  text-decoration: none;
  width: 180px;
  height: 2.5em;
  line-height: 2.5em;
  color: #ffffff;
  background-Color: #3273be;
  display: block;
  text-indent: 40px;
  border-bottom: 1px solid #3273ff;
}

div.menuEntryActive  a:hover {
  color: #ffffff;
  background-Color: #3273be;
  transition:0.5s;
}

/*
.dropdown div a:hover {
  color: #ffffff;
  background-Color: #666666;
}
*/


.dropdown_submenuentry div a{
  text-decoration: none;
  width: 180px;
  height: 2.5em;
  line-height: 2.5em;
  color: #dddddd;
  background-Color: #333333;
  display: block;
  text-indent: 40px;

}

.dropdown_submenuentry  a:hover {
  color: #ffffff;
  background-Color: #666666;
  transition:0.5s;
}


.dropdown_single div a{
  text-decoration: none;
  width: 180px;
  height: 2.5em;
  line-height: 2.5em;
  color: #dddddd;
  background-Color: #333333;
  display: block;
  text-indent: 16px;
  border-bottom: 1px solid #444;

}

.dropdown_single_active div a{
  text-decoration: none;
  width: 180px;
  height: 2.5em;
  line-height: 2.5em;
  color: #ffffff;
  background-Color: #3273be;
  display: block;
  text-indent: 16px;
  border-bottom: 1px solid #3273ff;

}



.dropdown_single div a:hover {
  color: #ffffff;
  background-Color: #666666;
  transition:0.5s;
}




input[type="checkbox"]:checked ~ .dropdown-menu {
  display: block;
}


/* TRIANGLES
------------------------------*/
/*Span-Elemente*/
.dropdown span {
     border-color: transparent #bbb transparent transparent; /*Dreieckfarbe */
     border-style:solid; /*Randstyle*/
     border-width: 0.5em; /*Dreiecksgrösse*/
     margin-top: 1.0em;
     margin-right:1em; /* Rand rechts */
     width:0; /*Breite (muss 0 sein)*/
     height:0; /* Höhe (muss 0 sein*/
     display:inline-block; /* Anzeigeart */
     float:right; /* rechtsbündig */
     position:relative; /* Positionierung */
     transform:rotate(270deg); /* Rotation 270° */
}

