/* --------- Pfannkuchen-Button -------------*/ 
.pancake { position:absolute; top:4%; right:3%; cursor:pointer; z-index:3001; width:50px; height:50px; }
.pancake .line-top { position:absolute; width:50px; height:6px; top:5px; left:0px; background:#fff; }
.pancake .line-middle { position:absolute; width:50px; height:6px; top:22px; left:0px; background:#fff; }
.pancake .line-bottom { position:absolute; width:50px; height:6px; bottom:5px; left:0px; background:#fff; }
.pancake:hover {  }
.pancake:hover .line-top { position:absolute; width:50px; height:6px; top:0px; left:0px; background:#fff; }
.pancake:hover .line-middle { position:absolute; width:50px; height:6px; top:22px; left:0px; background:#fff; }
.pancake:hover .line-bottom { position:absolute; width:50px; height:6px; bottom:0px; left:0px; background:#fff; }

.pancake.active .line-top { transform:rotate(-45deg); top:22px; }
.pancake.active .line-middle { display:none; }
.pancake.active .line-bottom { transform:rotate(45deg); bottom:22px; }


.mainnav .logo_small { display:block; width:200px; height:auto; margin-bottom:10%; }

/* --------- Hauptnavigation -------------*/ 
.mainnav { overflow: scroll; z-index:399; display: none; box-sizing: border-box; position:fixed; top:0; left:0; width:100%; height:100%; 
  background: rgba(46,81,158,1);/* Old Browsers */
  background: -moz-linear-gradient(left, rgba(46,81,158,1) 0%, rgba(24,150,95,1) 100%); /* FF3.6+ */
  background: -webkit-gradient(left top, right top, color-stop(0%, rgba(46,81,158,1)), color-stop(100%, rgba(24,150,95,1)));/* Chrome, Safari4+ */
  background: -webkit-linear-gradient(left, rgba(46,81,158,1) 0%, rgba(24,150,95,1) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left, rgba(46,81,158,1) 0%, rgba(24,150,95,1) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left, rgba(46,81,158,1) 0%, rgba(24,150,95,1) 100%); /* IE 10+ */
  background: linear-gradient(to right, rgba(46,81,158,1) 0%, rgba(24,150,95,1) 100%);/* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2e519e', endColorstr='#18965f', GradientType=1 );/* IE6-9 */
}
.mainnav ul { margin:0; padding:0; list-style:none; }
.mainnav li { position:relative; }
.mainnav li a { display:block; text-decoration:none;
  -moz-transition:0.5s;
  -o-transition:0.5s;
  -webkit-transition:0.5s;
  transition:0.5s;
}

/*------ 1. Ebene ----------------*/
.mainnav ul.list1 { position:relative; }
.mainnav li.level_1 { box-sizing:border-box; display:block; padding-top:1%; width: 100%;
  transition: all 0.4s ease-in 0s; /* explorer 10 */
  -webkit-transition: all 0.4s ease-in 0s; /* chrome & safari */
  -moz-transition: all 0.4s ease-in 0s; /* firefox */
  -o-transition: all 0.4s ease-in 0s; /* opera */
}
.mainnav li.level_1 > a { text-transform: uppercase; position:relative; font-weight:700; box-sizing:border-box; width:100%; line-height:100%; padding:10px 0; color:#fff; display:block; text-decoration:none; font-size:2em; }
.mainnav li.level_1:hover > a { color:#e31f1e; }
.mainnav li.level_1.active > a { color:#e31f1e; }


/* Kann maximal 880px darstellen. */
@media only screen and (max-width : 880px) {

  .mainnav li.level_1 > a { font-size:1.8em; }

}

/* Kann maximal 630px darstellen. */
@media only screen and (max-width : 630px) {

  .mainnav .logo_small { width:150px; }

  .mainnav li.level_1 > a { font-size:1.6em; }

}