.wrap {
	width:100%;
	margin:0px auto;
    font-family: Verdana;
}

/*----- Toggle Button -----*/
.toggle-nav {
	display:none;
}

.menu ul {
	display:inline-block;
}

.menu li {
	margin:0px 30px 0px 0px;
	float:left;
	list-style:none;
}

/*	Der Wert 50px zentriert das Menü besser in die Mitte */
.menu li:last-child {
	margin-right:50px;
}

/*	Farbe der Menütexte */
.menu a {
	color: #494949;
	transition:color linear 0.15s;
    text-decoration:none;
}

/*	Grüne Farbe wenn man mit der Maus drüber fährt */
.menu a:hover, .menu .current-item a {
	text-decoration:none;
	color:#66a992;
}


/*-----------------------------------------------------*/
/*----- ANFANG Bereich Responsive MEDIA Steuerung -----*/
/*-----------------------------------------------------*/

@media screen and (max-width: 840px) {
	.menu {
		position:relative;
		display:inline-block;
}

	.menu ul.active {
		display:none;
}
    
/* Box, die aufgeht, wenn der Screen zu klein ist */
	.menu ul {
		width:260%;
		position:absolute;
		top:120%;
		left:0px;
		padding:10px 12px;
        box-shadow:0px 1px 1px rgba(0,0,0,0.15);
		border-radius:3px;
        background:#f8f8ff;
        text-align:left;
}    

	.menu ul:after {
		width:0px;
		height:0px;
		position:absolute;
		top:0%;
		left:22px;
		content:'';
		transform:translate(0%, -100%);
		border-left:7px solid transparent;
		border-right:7px solid transparent;
		border-bottom:7px solid #303030;
}

	.menu li {
		margin:5px 0px 5px 0px;
		float:none;
		display:block;
}

	.menu a {
		display:block;
}

	.toggle-nav {
		padding:16px;
		float:left;
		display:inline-block;
		box-shadow:0px 1px 1px rgba(0,0,0,0.15);
		border-radius:3px;
		background:#ffffff;
		text-shadow:0px 1px 0px rgba(0,0,0,0.5);
		color:#ffffff;
		font-size:15px;
		transition:color linear 0.15s;
}

	.toggle-nav:hover, .toggle-nav.active {
		text-decoration:none;
		color:#66a992;
}
}

/*---------------------------------------------------*/
/*----- ENDE Bereich Responsive MEDIA Steuerung -----*/
/*---------------------------------------------------*/




/*------------------------------------------------------------------------------------------------------------*/
/*----- Nachfolgend wird die Menüschriftgröße eingestellt, damit sie auch auf Handys im Querformat passt -----*/
/*------------------------------------------------------------------------------------------------------------*/
@media (max-width:840px) {
.menu li { font-size:18px; }
}

@media (min-width:1000px) {
.menu li { font-size:14px; }
}

@media (min-width:1411px) {
.menu li { font-size:18px; }
}
