/*
	Document: Javascript CSS
	Description:
		Dynamisch Javascript Menu
*/

/** Niveau 1 Items
------------------------------------------------------------------------------*/

#nav {
	padding-top: 30px;
	padding-left: 220px;
}

#nav, #nav ul{
	position:relative;
	line-height:1.5em;
}

#nav li {
	float:left;
	position:relative;
	padding-right: 25px;
}

#nav a {
	display:block;
	padding:0px 5px;
	text-decoration: none;
	font-weight: bold;
	color: #5B5B5B;
	font-size: 14px;
}

#nav a:hover{
	color: #F39600;
}


/** Niveau 2 Kop items
------------------------------------------------------------------------------*/

#nav .kop a {
	text-decoration: underline;
	padding-top: 5px;
	padding-bottom: 5px;
	color: #ccc;
}
#nav .kop a:hover {
	text-decoration: underline;
	background-color: #515151;
	color: #ccc;
}

/** Niveau 2 items
------------------------------------------------------------------------------*/

#nav ul {
	position:absolute;
	display:none;
	width: 200px;
	top:1.5em;
	left: 5px;
}
/** Niveau 2 Hyperlinks
------------------------------------------------------------------------------*/

#nav li ul a{
	width: 200px;
	height:auto;
	float:left;
	background-color: #515151;
	color: #fff;
	font-weight: normal;
	padding: 3px;
	padding-left: 8px;
	font-size: 12px;
}
#nav li ul a:hover{
	background-color: #666;
	color: #fff;
}

/**
 * Onderstaande code wordt niet gebruikt in het huidige programma, alleen nodig
 * als er meer dan 1 submenu gebruikt wordt
------------------------------------------------------------------------------*/


#nav ul ul{
	top:auto;
}

#nav li ul ul {
	left: 100px;
	margin:0px 0 0 10px;
}

#nav li:hover ul ul,
#nav li:hover ul ul ul,
#nav li:hover ul ul ul ul{
	display:none;
}
#nav li:hover ul,
#nav li li:hover ul,
#nav li li li:hover ul,
#nav li li li li:hover ul{
	display:block;
}