/*
| -------------------------------------------------------------------
| FILENAME:			nx.navigation.css
| DESCRIPTION:		Default Style Sheet
| CREATED:			05/02/2008
| INITIAL AUTHOR:	Elma Smit
| UPDATED BY:		Elma Smit, 05/02/2008
| 
| Copyright (c) 2008 KeyAgency
| http://www.nexpri.nl/
| -------------------------------------------------------------------
| De basis kleuren die in de site gebruikt worden:
|
| grijs: #415968
| rood: #bc221a 
| groen: #56a928 
| blauw: #007bc0 
| oranje: #f15600
| -------------------------------------------------------------------
*/

#navigation ul
{
	margin: 0;
}

#navigation ul li
{
	display: inline;
	_display: block;
	_height: 20px;
	_margin: 0 0 10px 0;
	background-color: transparent;
	list-style-type: none;
}

/* 	
	Niveau 1 normal, als er geen kleur is gedefineerd.
*/

#navigation ul li a
{
	font-size: 100%;
	display: block;
	padding: 10px;
	margin: 0 0 10px 0;
	_margin: 0;
	font-weight: bold;
	text-decoration: none;
	border: 1px solid #d2d7db;
	color: #415968;
}

#navigation ul li a.in-path strong
{
	font-weight: bold;
}

/* 	
	Niveau 1 op kleurbasis.
*/

#navigation ul li a.red
{
	color: #bc221a;
}

#navigation ul li a.green
{
	color: #56a928;
}

#navigation ul li a.blue
{
	color: #0079c1;
}

#navigation ul li a.orange
{
	color: #f15600;
}

/* 	hover states  */
#navigation ul li a.red:hover
{
	border: 1px solid #bc221a;
}

#navigation ul li a.green:hover
{
	border: 1px solid #56a928;
}

#navigation ul li a.blue:hover
{
	border: 1px solid #0079c1;
}

#navigation ul li a.orange:hover
{
	border: 1px solid #f15600;
}

/* 	active states */
#navigation ul li.in-path a.red
{
	background-color: #bc221a;
	color: #fff;
	border: 1px solid #bc221a;
}

#navigation ul li.in-path a.green
{
	background-color: #56a928;
	color: #fff;
	border: 1px solid #56a928;
}

#navigation ul li.in-path a.blue
{
	background-color: #0079c1;
	color: #fff;
	border: 1px solid #0079c1;
}

#navigation ul li.in-path a.orange
{
	background-color: #f15600;
	color: #fff;
	border: 1px solid #f15600;
}

/* 	
	De gedefineerde keywords, vervangen door plaatjes. 
	De normal styles, zijn hieronder over-ruled.
*/

#navigation ul li a.kwc-diensten,
#navigation ul li a.kwc-over-nexpri, 
#navigation ul li a.kwc-projecten,
#navigation ul li a.kwc-producten,
#navigation ul li a.kwc-nexpri-referenties
{
	height: 20px;
	border: none;
	background-color: #fff;
}

#navigation ul li a.kwc-diensten:hover,
#navigation ul li a.kwc-over-nexpri:hover, 
#navigation ul li a.kwc-projecten:hover,
#navigation ul li a.kwc-producten:hover,
#navigation ul li a.kwc-nexpri-referenties:hover,
#navigation ul li.in-path a.kwc-diensten,
#navigation ul li.in-path a.kwc-over-nexpri, 
#navigation ul li.in-path a.kwc-projecten,
#navigation ul li.in-path a.kwc-producten,
#navigation ul li.in-path a.kwc-nexpri-referenties
{
	border: none;
	background-color: #fff;
}

/* 	normal state */
#navigation ul li a.kwc-diensten
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -200px top;
}

#navigation ul li a.kwc-over-nexpri
{
	background-image: url('../gui/menu/menu-sprite.gif');
}

#navigation ul li a.kwc-projecten
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -400px top;
}

#navigation ul li a.kwc-producten
{
	text-indent: -2000px;
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -800px top;
}

#navigation ul li a.kwc-nexpri-referenties
{
	text-indent: -2000px;
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -600px top;
}

/* 	hover state */
#navigation ul li a.kwc-diensten:hover
{
	background-position: -200px -40px;
}

#navigation ul li a.kwc-over-nexpri:hover
{
	background-position: left -40px;
}

#navigation ul li a.kwc-projecten:hover
{
	background-position: -400px -40px;
}

#navigation ul li a.kwc-producten:hover
{
	background-position: -800px -40px;
}


#navigation ul li a.kwc-nexpri-referenties:hover
{
	background-position: -600px -40px;
}

/* 	active state */
#navigation ul li.in-path a.kwc-diensten
{
	background-position: -200px -80px;
}

#navigation ul li.in-path a.kwc-over-nexpri
{
	background-position: left -80px;
}

#navigation ul li.in-path a.kwc-projecten
{
	background-position: -400px -80px;
}

#navigation ul li.in-path a.kwc-producten
{
	background-position: -800px -80px;
}

#navigation ul li.in-path a.kwc-nexpri-referenties
{
	background-position: -600px -80px;
}




/* 	homepage (active states) */
#navigation ul.homepage-menu li a.kwc-diensten
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -200px -80px;
}

#navigation ul.homepage-menu li a.kwc-over-nexpri
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: left -80px;
}

#navigation ul.homepage-menu li a.kwc-projecten
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -400px -80px;
}

#navigation ul.homepage-menu li a.kwc-producten
{
	background-position: -800px -80px;
}

#navigation ul.homepage-menu li a.kwc-nexpri-referenties
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -600px -80px;
}

/* 	homepage (hover states) */
#navigation ul.homepage-menu li a.kwc-diensten:hover
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -200px -40px;
}

#navigation ul.homepage-menu li a.kwc-over-nexpri:hover
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: left -40px;
}

#navigation ul.homepage-menu li a.kwc-projecten:hover
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -400px -40px;
}

#navigation ul.homepage-menu li a.kwc-producten:hover
{
	background-position: -800px -40px;
}


#navigation ul.homepage-menu li a.kwc-nexpri-referenties:hover
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -600px -40px;
}

/* 	active state contact */
#navigation .site-kw-contact ul li a.kwc-diensten
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -200px -80px;
}

#navigation .site-kw-contact ul li a.kwc-over-nexpri
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: left -80px;
}

#navigation .site-kw-contact ul li a.kwc-projecten
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -400px -80px;
}


#navigation .site-kw-contact ul li a.kwc-nexpri-referenties
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -600px -80px;
}

/* 	active state routebeschrijving */
#navigation .site-kw-routebeschrijving ul li a.kwc-diensten
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -200px -80px;
}

#navigation .site-kw-routebeschrijving ul li a.kwc-over-nexpri
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: left -80px;
}

#navigation .site-kw-routebeschrijving ul li a.kwc-projecten
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -400px -80px;
}

#navigation .site-kw-routebeschrijving ul li a.kwc-nexpri-referenties
{
	background-image: url('../gui/menu/menu-sprite.gif');
	background-position: -600px -80px;
}

/* 
	niv 2
*/

/* op kleurbasis */
#navigation ul li.red ul
{
	background-color: #bc221a;
}

#navigation ul li.green ul
{
	background-color: #56a928;
}

#navigation ul li.blue ul
{
	background-color: #0079c1;
}

#navigation ul li.orange ul
{
	background-color: #f15600;
}

#navigation ul ul
{
	padding: 5px 0px;
	margin: 0 0 10px 0;
}

#navigation li.not-selected ul
{
	display: none;
}

#navigation ul ul li a
{
	font-size: 92%;
	font-weight: normal;
	color: #fff;
	border: none;
	margin: 0px;
	padding: 7px 10px;
}

#navigation ul li ul li a.selected
{
	font-weight: bold;
	font-size: 100%;
}

#navigation ul li.red ul li a:hover
{
	background-color: #9d150f;
}

#navigation ul li.green ul li a:hover
{
	background-color: #4c9623;
}

#navigation ul li.orange ul li a:hover
{
	background-color: #d54d00;
}

#navigation ul li.blue ul li a:hover
{
	background-color: #0069a8;
}

#navigation ul li.red ul li a.selected:hover
{
	background-color: #bc221a;
}

#navigation ul li.green ul li a.selected:hover
{
	background-color: #56a928;
}

#navigation ul li.orange ul li a.selected:hover
{
	background-color: #007bc0;
}

#navigation ul li.blue ul li a.selected:hover
{
	background-color: #f15600;
}

/*
| -------------------------------------------------------------------
| Special menu
| -------------------------------------------------------------------
*/

.special_menu
{
	margin: 5px 0 0 0;
	height: 20px;
}

.special_menu li
{
	display: inline;
	float: left;
}

.special_menu li a
{
	font-size: 77%;
	padding: 0px 5px 0px 5px;
	border-right: 1px solid #415968;
	text-decoration: none;
	color: #415968;
}

.special_menu li a.kwc-disclaimer
{
	border-right: none;
	padding-right: 0px;
}