/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/upmenu.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
/* common styling */
#mainnavi {
	float: left;
	width: 845px;
}
* html #mainnavi {
	width:845px;
}


.menu {
	width:836px;
	position:relative;
	text-transform: uppercase;	
	margin:0 auto;
	background-image: url(../img/navi/back-navi.jpg);
	background-repeat: repeat-x;
	font-size:80%;
	_font-size:60%;
	font-weight:bold;
	padding-left:10px;
	_width:826px;
}
* html .menu { /* Hack IE 6 */
	width:835px;
}
*+html .menu { /* Hack IE 7 */
	background-image: url(http://www.flemming-sylt.de/img/navi/back-navi.jpg);
	background-repeat: repeat-x;
}

/* Die Links vom Menü... 
========================================================= */
.menu ul li a, .menu ul li a:visited {
	display:block; 
	text-decoration:none; 
	width:100px; 
	_width:101px; 
	height:51px; 
	text-align:center; 
	color:#778eb7; 
	padding:0 5px;
	_padding:0 2px;
	line-height:45px; 
	background-image: url(http://www.flemming-sylt.de/img/navi/back-navi.jpg);
	background-repeat: repeat-x;
}
	
*+html .menu ul li a, *+html .menu ul li a:visited {
	width:107px; 
	padding:0 2px;
}

.menu ul {padding:0; margin:0;list-style-type: none; }
.menu ul li {float:left; position:relative;}
.menu ul li ul {visibility:hidden; position:absolute;}

/* specific to non IE browsers */
.menu ul li:hover a {
color:#ffffff;
	background-image: url(http://www.flemming-sylt.de/img/navi/n-rot.gif);
	background-repeat: repeat-x;
	height: 51px;
}

/* ================================================================ 
	2. Menü-Styling +++++++++++++++
=================================================================== */
/* Abstand des Untermenüs vom Hauptmenü */
.menu ul li:hover ul {visibility:visible; top:51px; left:0;}

.menu ul li:hover ul li a.hide {
	background:#778eb7; 
	color:#fff;
	height:28px;
}

.menu ul li:hover ul li {
	display:block; 
	color:#fff;
	clear:both;
	border-bottom: 1px solid #16284e;	
}
.menu ul li:hover ul li:hover a.hide {
	background:#c9221a; 
	color:#fff;
}
.menu ul li:hover ul li ul {visibility:hidden; position:absolute;}

.menu ul li:hover ul li a {
	display:block; 
	background:#778eb7; 
	color:#fff; 
	width:100px; 
	padding-left:20px;
	line-height:25px;
	text-align:left; 
	text-transform:none;
	height:28px;
}
.menu ul li:hover ul li a:hover {background:#c9221a; color:#fff;}
/* ================================================================ 
	3. Menü-Styling +++++++++++++++
=================================================================== */
.menu ul li:hover ul li:hover ul {
	visibility:visible; 
	left:124px; 
	*left:122px; 
	_left:120px; 
	top:0;
}
.menu ul li:hover ul li:hover ul li a {
	background:#c9221a; 
	line-height:25px;
	color:#fff;
}
.menu ul li:hover ul li:hover ul li a:hover {background:#990000; color:#fff;}

.menu ul li:hover ul.left {left:-105px;}
.menu ul li:hover ul li:hover ul.left {left:-210px; width:209px;}

/* make navi current 
=================================================================== */
.menu .currentpage a, .menu ul li.currentpage a {
	color:#FFFFFF;
	background-image: url(http://www.flemming-sylt.de/img/navi/n-rot.gif);
	background-repeat: repeat-x;
	display:block;
}

.menu .hide2 a, .menu ul li.hide2 a {
	color:#FFFFFF;
}
.menu .currentpage ul a {
	background-color:#c9221a;
}
/* ================================================================ 
   =SUBNAVI 
=================================================================== */
#subnavi {
	width: 200px;
}
.sub {
	width:200px;
	font-size:75%;
	font-weight:bold;
}
/* remove all the bullets, borders and padding from the default list styling */
.sub ul {
	padding:0;
	margin: 0;
	list-style-type: none;
}
.sub li {
	border-bottom: 1px solid #FFFFFF;
}

/* style the links for the top level */
.sub a, .sub a:visited {
	background-color: #9c9c9c;
	color: #666666;
	display:block;
	height: 15px;
	_height: 10px;
	padding: 2px 0 8px 10px;
	_padding: 1px 0 1px 10px;
	text-decoration:none;
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow1.gif);
	background-position: 10px;
	background-repeat: no-repeat;
	text-indent: 15px;
}

.sub a:hover {
	color: #fff;
	background-color: #16284e;
	list-style-position: inside;
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow.gif);
	background-repeat: no-repeat;
	background-position: 10px;
	text-indent: 15px;
	_margin-left: -16px;
}
*+html .sub a:hover {
	margin-left:-16px;
}

/* make navi current */
.sub .currentpage a {
	background-color: #16284e;
	color: #fff;
	text-indent: 5px;
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow.gif);
	background-repeat: no-repeat;
	background-position: 10px;
	text-indent: 15px;
}

/* das ist für den IE 6! */
#subnavi .currentpage a {
	background-color: #16284e;
	color: #fff;
	text-indent: 5px;
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow.gif);
	background-repeat: no-repeat;
	background-position: 10px;
	text-indent: 15px;
}
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
	style the links for the second level 
+++++++++++++++++++++++++++++++++++++++++++++++++ */
.sub ul ul a, .sub ul ul a:visited {
	background-color: #CCCCCC;
	color: #666666;
	display:block;
	height: 15px;
	padding: 2px 0 8px 10px;
	_padding: 2px 0 2px 10px;
	text-decoration:none;
	text-indent: 28px;
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow1.gif);
	background-repeat: no-repeat;
	background-position: 23px;
}
.sub ul ul a:hover {
	color: #fff;
	background-color: #666666;
	text-indent: 28px;
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow.gif);
	background-repeat: no-repeat;
	background-position: 23px;
}
.sub ul ul .currentpage2 a {
	background-color: #666666;
	color: #fff;
	text-indent: 28px;
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow.gif);
	background-repeat: no-repeat;
	background-position: 23px;
}
/* style the links for the third level */
.sub ul ul ul a, .sub ul ul ul a:visited {
	background-color: #CCCCCC;
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow2.gif);
	background-repeat: no-repeat;
	background-position: 25px;
	color: #666666;
	display:block;
	font-weight:normal;
	font-size:0.9em;
	text-decoration:none;
	text-indent: 28px;
}
.sub ul ul ul a:hover {
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow3.gif);
	background-repeat: no-repeat;
	background-position: 25px;
	color: #ffffff;
	background-color:#999999;
	text-indent: 28px;
}
.sub ul ul ul .currentpage3 a {
	background-image: url(http://www.flemming-sylt.de/img/navi/arrow3.gif);
	background-repeat: no-repeat;
	background-position: 25px;
	background-color: #16284e;
	color: #fff;
	text-indent: 28px;
}