/* navigation.css */
/* [C02] Skip navigation */
@media screen {

#skip {
	position:absolute;
	left:14px;
	top:7px;
	margin:0;
	list-style:none;
	z-index:100;
}
	#skip li {
		position:absolute;
		top:0;
		left:0;
		z-index:100;
	}
		#skip a {
			display:block;
			background:#fff;
			text-indent:-9000px;
			white-space:nowrap;
		}
		#skip a:hover, 
		#skip a:focus, 
		#skip a:active {
			top:0;
			left:0;
			text-indent:0;
		}

/* navigation container */
#navigation h1,
#navigation h2,
#navigation h4,
#pagenavigation h4,
#contentnavigation h4{
	position:absolute;
	left:0;
	top:-500px;
	width:1px;
	height:1px;
	overflow:hidden;
}

/* [C04] Main navigation */	
#navigation #mainnavigation {
	position:absolute;
	top:55px;
	left:0;
	height:40px;
	padding-left:14px;
	width:755px;
}
	body.page-1024 #navigation #mainnavigation {
		width:962px;
	}	
	#mainnavigation ol, 
	#mainnavigation li {
		display:block;
		list-style:none;
		padding:0;
		margin:0;
	}
	#mainnavigation ol {
		height:31px;
		background:#F5F5F5 url("../images/navigation/gradient.gif") 0 0 repeat-x;
		padding-top:9px;
		padding-left:22px;
	}
		#mainnavigation li {
			float:left;
			height:31px;
		}
		#mainnavigation li.open {
			background:#fff no-repeat bottom right;
		}
			#mainnavigation li a {
				overflow:hidden;
				display:block;
				margin: 0 1px;
				width:100px;
				height:31px;
				background-color:transparent;
				background-repeat:no-repeat;
				background-position: 0 0;
				background-image: none !important;
				color: #997EAC;
				font-family: 'FagoWeb','Trebuchet MS',verdana,arial,sans-serif;
				font-size: 13px;
				text-align: center;
				padding-top: 7px;
				font-weight:bold;
				text-decoration:none;
				white-space:nowrap;
			}
			#mainnavigation li a:hover {
				background-image: url("../images/icons/arrow-toggle.gif") !important;
				background-position: 5px 14px;
				background-repeat:no-repeat;
				color: #552878;
				text-decoration: underline;
			}		
				#mainnavigation li.open a {
					background-image: url("../images/icons/arrow-toggle.gif") !important;
					background-position: 5px -10px;
					color: #552878;
					margin: 0;
					height:23px;
					border: 1px solid #E0E0E0;
					border-width: 1px 1px 0 1px;
					text-decoration: underline;
				}
		#mainnavigation li#nav-home a { 
			width:97px; 
			background-image:url("../images/navigation/mainnavigation/thuis.gif");
		}
		#mainnavigation li#nav-business a { 
			width:81px; 
			background-image:url("../images/navigation/mainnavigation/zakelijk.gif");
		}
		#mainnavigation li#nav-about a { 
			width:95px; 
			background-image:url("../images/navigation/mainnavigation/overnuon.gif");
		}
		#mainnavigation li#nav-jobs a { 
			width:135px; 
			background-image:url("../images/navigation/mainnavigation/werkenbijnuon.gif");
		}

		#mainnavigation.en li#nav-about a { 
			width:105px; 
			background-image:url("../images/navigation/mainnavigation/aboutnuon.gif");
		}
		#mainnavigation.en li#nav-jobs a { 
			width:72px; 
			background-image:url("../images/navigation/mainnavigation/careers.gif");
		}

/* [C05] Sub navigation */	
#navigation #subnavigation {
	position:absolute;
	top:95px;
	left:0;
	margin-left:14px;
	padding-top:2px;
	height:31px;
	width:755px;
	background:#FFF url("../images/navigation/subnavigation/gradient.gif") 0 28px repeat-x;
	z-index:101;
}
	body.page-1024 #navigation #subnavigation {
		width:962px;
	}
	#subnavigation ul, 
	#subnavigation ol,
	#subnavigation li {
		display:block;
		list-style:none;
		padding:0;
		margin:0;
	}
	#subnavigation ol {
		position:relative;
		z-index:100;
		width:100%;
		height:28px;
		list-style:none;
		padding-left:22px;
	}
		#subnavigation li {
			float:left;
			border:1px solid #FFF;
			border-bottom:0;
		}
		#subnavigation li.open {
			border-color:#E0E0E0;
		}
			#subnavigation li a {
				overflow:hidden;
				display:block;
				padding-top: 4px;
				height:21px;
				background-color:transparent;
				background-repeat:no-repeat;
				background-position:0 -2px;
				background-image: none !important;
				color: #997EAC;
				font-family: 'FagoWeb','Trebuchet MS',verdana,arial,sans-serif;
				font-size: 13px;
				text-decoration:none;
				white-space:nowrap;
				font-weight: bold;
				padding-left: 15px;
				padding-right: 37px;
			}
			#subnavigation li.open a {
				padding-top: 4px;			
				height:23px;
				margin-bottom:-1px;
				border-color:#FFF;
				background-color:#FAFAFA;
				background-image: url("../images/icons/arrow-toggle.gif") !important;
				background-position: 5px -14px;
				color: #552878;
			}
	#subnavigation li ul {
		overflow:hidden;
		position:absolute;
		padding:0.5em 0 0;
		height:0;
		top:33px;
		background:transparent;
	}
		#subnavigation li ul li {
			float:none;
			margin:0;
			padding:.2em 0 .6em;
			background-color:transparent;
			border:0;
		}
			#subnavigation li.open ul li a,
			#subnavigation li ul li a {
				overflow:visible;
				float:none;
				display:block;
				width:auto !important;
				height:auto;
				margin:0;
				padding:0 16px;
				background-color:transparent;
				background-image:none !important;
				color:#552878;
				text-indent:0;
				white-space:nowrap;
				font-weight: normal;
				font-family: Verdana,Arial,sans-serif;
				font-size: 11px;
			}
			#subnavigation li ul li a:hover {
				background: url("../images/icons/arrow-toggle.gif") 6px 0.45em no-repeat !important;
				font-weight: bold;
			}
												
	#subnavigation .backdrop {
		position:absolute;
		display:none;
		left:0;
		top:29px;
		z-index:99;
		width:753px;
		padding-bottom:1em;
		background:#fff url("../images/navigation/subnavigation/background.gif") 0 -40px repeat-x;
		border:solid #E0E0E0;
		border-width:0 1px 1px 1px;
	}
	
	body.page-1024 #subnavigation .backdrop {
		width: 960px;
	}
		#subnavigation .backdrop div {
			position:absolute;
			height:5px;
			width:100%;
			left:0;
			bottom:-6px;
			background:url("../images/navigation/subnavigation/shadow.png") 0 100% repeat-x;
		}
		
#subnavigation ol li ul {
	background:#fff url("../images/navigation/subnavigation/background.gif") 0 -40px repeat-x;
	height:auto;
	display:none;
	top:25px;
	border:solid #E0E0E0 1px;
	position:absolute;
	margin-left:-23px;
	padding:5px 5px 5px 23px;
	border-bottom:solid lightgrey 2px;
};

#subnavigation ol li.open a.empty, #subnavigation ol>li.open>a:hover {
	background-position: 0 -33px;
}

#subnavigation li a:hover {
	background: #FAFAFA url("../images/icons/arrow-toggle.gif") 6px 8px no-repeat !important;
	color:#552878;
}

#subnavigation li a.empty:hover {
	background:white  url("../images/icons/arrow-toggle.gif") 6px 8px no-repeat !important; 
}

#navigation li a {
	position: relative;
	z-index:104;
}
		

/* [C06a] Meta navigation Top */
#metanavigation {
	position:absolute;
	top:4px;
	left:0;
	width:100%;
	z-index:300;
}
	#metanavigation ul {
		float:right;
		margin:0;
		list-style:none;
	}
		#metanavigation li {
			float:left;
			background:url("/static/images/backgrounds/line-metanavigation.gif") no-repeat 100% 45%;
			margin:0 10px 0 0;
			padding:3px 10px 0 0;
			height:2em;
		}
		#metanavigation li.no-bg a {
			background:none;
			padding:0;
		}

			#metanavigation li a {
				position:relative;
				background:url("../images/icons/arrow.gif") no-repeat 4px 35%;
				color:#805E9A;
				padding:2px 11px 0.82em 15px;
				border:1px solid #fff;
				border-width:0 1px;
			}

	#metanavigation li.no-sep {
		background-image:none;
	}

	
	
/* [C06b] Meta navigation2 */
#metanavigation2 {
	position:absolute;
	top:0;
	left:0;
	width:100%;
}
	#metanavigation2 #login {
		position: absolute;
		top:65px;
		right:245px;
	}
		#metanavigation2 #login a,
		#metanavigation2 #login a:visited {
			background:url("../images/icons/arrow-small.gif") no-repeat 1px 70%;
			color:#552878;
			padding:0 0 0 10px;
			font-size:91.5%;
		}



	#metanavigation2 #form-search {
		position: absolute;
		top:68px;
		right: 10px;
		z-index: 300;
		width: 400px;
	}
		#metanavigation2 #form-search fieldset {
			float: right;
			border:none;
		}
			#metanavigation2 #form-search legend {
				display:none;
			}
			
			#metanavigation2 #form-search label {
				position:absolute;
				left:0;
				top:-500px;
				width:1px;
				height:1px;
				overflow:hidden;
			}
			
			#metanavigation2 #form-search input {
					float:left; 
					color: #999;
					border-right-width:0;
					width: 300px;
					height:14px;
					margin-top: -1px;
			}

			 #metanavigation2 #form-search input#searchbutton  {
				background:url("../images/icons/search.gif") scroll 0 0;
				color: #FFFFFF;
				font-weight: bold;
				padding: 1px 2px 4px 4px;
				height: 20px;
				width:60px;
				border: 0;
				margin-top: -1px;
			}
			 #metanavigation2 #form-search input:hover#searchbutton  {
				cursor:pointer;
				text-decoration:underline;
			}
	
	#metanavigation2 #form-search input.focus { color:#000; }
			
	

/* c17_sidenav, c26_tabs */	
#contextual #contentnavigation {
	min-height:150px;
}
.application #contextual #contentnavigation {
	min-height:264px;
}
	#contextual #contentnavigation ul {
		list-style:none;
		margin:16px 0 0 0;
		padding:0;
	}
		#contextual h2,
		#contextual #contentnavigation h2 {
			display:none;
		}
		#contextual #contentnavigation ul li {
			margin:0 0 1em 10px;
			zoom:1;
		}
			#contextual #contentnavigation ul li a {
				color:#552878;
				padding:0 0 0 10px;
				display:block;
			}
			#contextual #contentnavigation ul li.current {
				background:url("../images/icons/arrow.gif") left 4px no-repeat;
			}
			#contextual #contentnavigation ul li.current a {
				font-weight:bold;
				text-decoration:underline;
			}
			#contextual #contentnavigation ul li.group {
				font-size: 115%;
				margin-left: 20px;
			}
		.application #contextual #contentnavigation ul {
			margin:0;
			padding:0;
		}
		.application #contextual #contentnavigation ul {
			margin:0;
			padding:0;
		}
		.application #contextual #contentnavigation ul li {
			display:block;
			border:1px solid #d4d4d4;
			border-right:none;
			padding:4px 0 4px 4px;
			margin:0 0 6px 0;
			background:url("../images/backgrounds/contentnavigation-shade.png") top right repeat-y;
			zoom:1;
			position:relative;
		}
			.application #contextual #contentnavigation ul li a,
			.application #contextual #contentnavigation ul li div {
				background:#00aeef url("../images/backgrounds/contentnavigation-shade.png") top right repeat-y;
				text-align:right;
				text-decoration:none;
				font-weight:bold;
				color:#fff;
				padding:16px 20px 0 17px;
				width:189px;
				min-height:34px;
				zoom:1;
				position:relative;
				font-size:105%;
			}
				.application #contextual #contentnavigation ul li.complete a,
				.application #contextual #contentnavigation ul li.complete div {
					background-color:#a9a9a9;
				}
				.application #contextual #contentnavigation ul li.current {
					background:none;
				}
				.application #contextual #contentnavigation ul li.current a {
					background:#007EC6;
				}
					.application #contextual #contentnavigation ul li.current div {
						background:url("../images/navigation/contentnavigation/contentnavigation-current.gif") center right repeat-y;
						filter:none;
						position:absolute;
						top:4px;
						margin-right:-24px;
						height:34px;
						width:189px;
						padding:16px 44px 0 17px;
						z-index: 200;
					}
				.application #contextual #contentnavigation ul li a span,
				.application #contextual #contentnavigation ul li div span {
					display:block;
					position:relative;
					border:1px solid #fff;
					float:left;
					padding:0 4px;
					z-index:1;
				}
	#pagenavigation .back {
		background:url("../images/icons/arrow-back.gif") 0 center no-repeat;
		padding:0 0 0 10px;
		color:#552878;
	}
	
	/* Client group navigation */
	
	#nav-clientgroup {
		margin: 0 0 1em 0;
		list-style: none;
	}
		#nav-clientgroup ul {
			background: #fff;
			margin: 0;
			padding: 10px 0 4px 11px;
			list-style: none;
		}
			#nav-clientgroup li {
				background: #F3F3F3 url("../images/headers/item-gradient.gif") repeat-x top left;
			}
				#nav-clientgroup li a {
					display: block;
					background: url(../images/icons/arrow-invoices.gif) no-repeat 98% 4px;
					color:#552878;
					padding:4px 24px 4px 10px;
					border: 1px solid #d4d4d4;
					font-size:109.5%;
					font-weight: bold;
				}
				#nav-clientgroup li.selected a {
					background-position: 98% -226px;
				}
					#nav-clientgroup li a:hover {
						background-position: 98% -111px;
					}
					#nav-clientgroup li.selected a:hover {
						background-position: 98% -341px
					}
				#nav-clientgroup li li {
					background:url("../images/icons/arrow.gif") no-repeat 0 4px;
					margin:0 0 0.5em 0;
					padding:0 0 0 10px;
				}
					#nav-clientgroup li li a {
						display: inline;
						background: none;
						color: #007ec6;
						padding: 0;
						border: none;
						font-size: 100%;
					}
				.DOMEnabled #nav-clientgroup li ul {
					display: none;
				}
				.DOMEnabled #nav-clientgroup li.selected ul {
					display: block;
				}	
		
	/* [C03] Breadcrumb */
	#breadcrumb {
		position:absolute;
		top:126px;
		left: 3px;
		xbackground:url("../images/backgrounds/shadow-breadcrumb.gif") 0 bottom no-repeat;
		height:29px;
		width:100%;
		font-size: 91.5%;
	}
		#breadcrumb p {
			position:absolute;
			left:0;
			top:-500px;
			width:1px;
			height:1px;
			overflow:hidden;
		}
		#breadcrumb ul {
			margin:5px 0 0 14px;
			padding:0 0 0 22px;
			list-style:none;
		}
			#breadcrumb li {
				float:left;
				color:#007EC6;
				margin:0 8px 0 0;
			}
				#breadcrumb li a {
					background:url("../images/icons/arrow.gif") no-repeat 100% 55%;
					color:#997EAE;
					padding:0 14px 0 0;
				}
				#breadcrumb strong {
					font-weight:normal;
				}	
				
				
	/* tabnavigation */				
	.tabnavigation {
		list-style: none;
		position: relative;
		margin: 0;
		padding-left: 10px;
		overflow: hidden;
		z-index: 100;
	}
	
		.tabnavigation li {
			float: left;
			margin: 0 6px 0 0;
			padding-bottom: 5px;
		}
		
		.tabnavigation li a,
		.tabnavigation li a:visited {
			float: left;
			display: block;
			color: #808080;
			padding: 5px 10px 5px 10px;
			font-weight: bold;
			min-height: 17px;
			border: 1px solid #D5D5D5;
		}
		
		.tabnavigation li.active {
			background: #F4F4F4 url("../images/backgrounds/tabnavigation-active.gif") bottom center no-repeat;
			color: #A3228E;
			padding-bottom: 6px;
		}
		
			.tabnavigation li.active a,
			.tabnavigation li.active a:visited {
				color: #A3228E;
				border-bottom-width: 0;
				text-decoration: none;
			}
		#contextual .tabnavigation {
			margin-bottom:-6px;
			padding-top:5px;
		}

/* Footer */
#footer {
	clear:both;
	height:35px;
	width:761px;
	position:relative;
	left:11px;
	background:url("../images/backgrounds/footer-800.gif") 0 0 no-repeat;
	height:35px;
	z-index: 1;
}
	body.page-1024 #footer {
		background:url("../images/backgrounds/footer-1024.gif") 0 0 no-repeat;
		left:11px;
		width:auto;
	}
	
	body.no-right-column #footer {
		background:url("/static/images/backgrounds/footer-1024-full-width.gif") 0 0 no-repeat;
		left:12px;
		width:auto;
	}	
	
		#footer ul {
			margin:0;
			padding:11px 0 0 20px;
			list-style:none;
		}
			#footer li {
				float:left;
				color:#007EC6;
				margin:0 10px 0 0;
			}
				#footer li a {
					border-right:1px solid #C6BFDC;
					color:#997EAE;
					padding:0 10px 0 0;
				}
				#footer li.textsize a {
					background:url("../images/backgrounds/textsize.gif") no-repeat top right;
					padding:0 38px 0 0;
					border:0;
				}
				#footer strong {
					font-weight:normal;
				}
		
#personalisation,
#languageselector {
	position:absolute;
	top:0;
	right:0;
}
	#personalisation ul,
	#languageselector ul {
		list-style:none;
	}
	#personalisation ul li,
	#languageselector ul li {
		float:left;
		font-size:91.5%;
		margin:0 7px 0 0;
		line-height:1em;
	}
	#personalisation ul li a,
	#languageselector ul li a {
		display:block;
		border-left:1px solid #552878;
		padding:0 0 0 16px;
		line-height:1em;
		color:#552878;
		background:url(../images/icons/arrow.gif) no-repeat scroll 7px 2px;
	}
	#languageselector ul li a {
		padding:0 0 0 6px;
		background:none;
	}
	#languageselector ul li.selected a {
		font-weight:bold;
	}
	#languageselector ul li.first a {
		border:none;
	}
	

div.tabheader {
	position:absolute;
	top:0;
	width:942px;
}

div.tabblock .tabnavigation, div.tabheader .tabnavigation {
	background:url('../images/backgrounds/tabnavigation-bg.gif') repeat-x 0 100%;
	padding-bottom:5px;
}

.tabcontent {
	padding:12px 0 0 0;
	border-width:0;
}

.tabcontent .contentblock {
	margin:0 10px 10px 10px;
}

.tabcontent .contentblock h3 {
	margin-top:0;
}

#maincontent #content .tabcontent .box-content h2 {
	left:auto;
	position:static;
	width:auto;
	margin:.6em 0;
}

.tabcontent img.float-right,
.tabcontent img.float-left {
	padding-top:0;
}

.tabcontent div.row {
	margin-bottom:0;
}	

.tabcontent div.row .column.medium {
	width:339px;
	padding-bottom:0;
}
/* For now only used in retail */
#contextual #contentnavigationenota {
	margin-top:5px;
	min-height:150px;
	padding-bottom:14px;
	padding-top:10px;
}
	#contextual #contentnavigationenota ul {
		list-style:none;
		margin:0;
		padding:0;
	}
		#contextual h2,
		#contextual #contentnavigationenota h2 {
			display:none;
		}
		#contextual #contentnavigationenota ul li {
			margin:8px 0 0  10px;
			zoom:1;
		}
			#contextual #contentnavigationenota ul li a {
				color:#552878;
				padding:0 0 0 10px;
				display:block;
			}
			#contextual #contentnavigationenota ul li.current {
				background:url(/static/images/icons/arrow.gif) left 4px no-repeat;
			}
			#contextual #contentnavigationenota ul li.current a {
				font-weight:bold;
				text-decoration:underline;
			}
			#contextual #contentnavigationenota ul li.current ul li a{
				font-weight:normal;
				text-decoration:none;
			}	
			
	div.metanavigationcorporate {
		top:4px!important;
		left:-120px!important;
	}			

	li.metanavigationcorporate {
		background:url("../images/backgrounds/line-metanavigation.gif") no-repeat 100% 45%!important;
		padding:4px 10px 0 0!important;
	}			
	
			
}
