body { -webkit-animation: bugfix infinite 1s; }
@-webkit-keyframes bugfix { from { padding: 0; } to { padding: 0; } }


.wrapper_nav { position: absolute; width: 96%; margin-left: 4%; transition-duration: 1.5s; }


/* Klasse für JS-Zuordnung der Reiterfarbe bei Roll-Over innerhalb Unternavigation   ======================= */
.hover { background-color: #382d29; }

/* Button   ======================= */
.btn { position: absolute; z-index: 100; left: 0; top: 40px; color: #ad6a4a; opacity: 1; }
.btn:hover { color: #ad6a4a; opacity: 0.6; cursor: pointer; }


/* Hauptnavigation   ======================= */
nav ul { list-style: none; margin: 0; padding: 0; }
#nav { position: absolute; top: 0; padding-top: 80px; left: 0; z-index: 10; width: 82%; max-width: 260px; text-align: left; }
#nav a { font-size: 1.125em; height: 0; line-height: 0; display: block; border-bottom-width: 0; padding: 0 0 0 2%; overflow: hidden; color: #000; text-decoration: none; }
#nav > li { position: relative; }

#toggle { position: absolute; top: -9999px; left: -9999px; }
#toggle:checked ~ #nav { left: -5em; padding-left: 5em; z-index: 99; background: url(../img/bg_navi_open.png); background-repeat: repeat-x; 
	-webkit-box-shadow: 5px 13px 15px -3px rgba(102,51,0,0.7);
	-moz-box-shadow: 5px 13px 15px -3px rgba(102,51,0,0.7);
	-ms-box-shadow: 5px 13px 15px -3px rgba(102,51,0,0.7);
	-o-box-shadow: 5px 13px 15px -3px rgba(102,51,0,0.7);
	box-shadow: 5px 13px 15px -3px rgba(102,51,0,0.7); }
#toggle:checked ~ #nav a { position: relative; z-index: 1; left: -5em; padding: 10px 0 10px 5em; width: 100%; height: auto; line-height: 20px; border-bottom: 1px solid #d7d4c4; }
#toggle:checked ~ #nav a:hover { color: #ad6a4a; background-color: #FFF; }
#toggle:checked ~ #nav #close { position: relative; z-index: 0; }
#toggle:checked ~ #nav #close label { background: transparent; border-bottom: 0; position: absolute; left: -5em; right: -5em; top: -100em; bottom: -100em; z-index: 0; }
#toggle:checked ~ nav #nav li.current a { color: #ad6a4a; }
#nav li.current a { color: #ad6a4a; }


/* =======================================
	Responsive
======================================= */
@media screen and (min-width: 769px) {
.wrapper_nav { width: 98%; margin-left: 2%; }
.btn { top: 55px; }

/* Hauptnavigation   ======================= */
#nav { padding-top: 120px; max-width: 300px; }
#toggle:checked ~ #nav #close label { right: -20em; bottom: -10em; }
}

@media screen and (min-width: 1400px) {
.wrapper_nav { width: 97%; margin-left: 3%; }
/* Hauptnavigation   ======================= */
#toggle:checked ~ #nav #close label { right: -45em; bottom: -15em; }
}

@media screen and (min-width: 2000px) {
/* Hauptnavigation   ======================= */
#toggle:checked ~ #nav #close label { bottom: -35em; }
}