/* External includes
/*----------------------------------------------------------------------------*/
@import url(content.css);


/* Page layout
/*----------------------------------------------------------------------------*/

html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,label {
	margin: 0;
	padding: 0;
}

html, body {
	height: 100%;
	font: normal normal 11px "Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
	color: #666;
	background-color: #fff;
}

body {
	text-align: left !important;
	text-align: center;
	background: url(../../img/bg/bg_header_swirl.jpg) 50% 36px no-repeat;
}

h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,th {
	font-size: 1em;
	font-weight: normal;
	font-style: normal;
}

ul,li,ol,dl {
	list-style-type: none;
}

fieldset {
	border: solid 0 transparent;
}

fieldset legend {
	display: none;
}



/* Page layout
/*----------------------------------------------------------------------------*/

#main-container {
	margin: 0 auto;
	width: 780px;
	position: relative;
}

.header {
	height: 157px;
	text-align: left;
}

.footer {
	margin: 0 auto;
	width: 780px;
	height: 265px;
	text-align: left;
	background: url(../../img/bg/bg_footer.gif) 0 0 no-repeat;
}

div.top {
	margin: 0 auto;
	width: 780px;
	height: 25px;
	background: transparent url(../../img/bg/bg_content_top.gif) 0 0 repeat-y;
	display: block;
}

.container {
	margin: 0 auto;
	padding: 20px 50px 20px 50px;
	width: 680px !important;
	width: 780px;
	min-height: 300px;
	height: auto !important;
	height: 400px;
	text-align: left;
	background: #fff url(../../img/bg/bg_content.gif) 0 0 repeat-y;
}



/* Header Logo
/*----------------------------------------------------------------------------*/

div.header h1 {
	padding: 15px 0 45px 0;
}

div.header h1 a {
	margin: 0 0 0 40px;
	width: 158px;
	height: 67px;
	text-indent: -9999px;
	display: block;
	overflow: hidden;
	background: url(../../img/img_logo.gif) 0 0 no-repeat;
}

div.header h1 a:hover {
	background: url(../../img/img_logo.gif) 0 -67px no-repeat;
}


/* Header Navigation
/*----------------------------------------------------------------------------*/

.main-navigation {
	position: absolute;
	top: 127px;
	left: 50px;
	z-index: 999999;
	
}



/* Breadcrumb & Secondary Navigation
/*----------------------------------------------------------------------------*/

div.breadcrumb-secondary {
	height: 36px;
	font-size: 9px;
	line-height: 37px;
	color: #888888;
	background: url(../../img/bg/bg_topbar.gif) 0 0 repeat-x; 
}

div.breadcrumb-secondary .box {
	padding: 0 50px;
	width: 680px !important;
	width: 780px;
}

div.breadcrumb-secondary .bc {
	width: 420px;
	float: left;
}

div.breadcrumb-secondary .secondary {
	width: 250px;
	float: right;
}


/* Breadcrumb
/*----------------------------------------------------------------------------*/

div.breadcrumb-secondary .bc a {
	color: #888;
	text-decoration: none;
}

div.breadcrumb-secondary .bc a:hover {
	color: #444;
	text-decoration: underline;
}


/* Secondary Navigation
/*----------------------------------------------------------------------------*/

div.breadcrumb-secondary .secondary ul {
	margin: 14px 0 0 0;
	float: right;
}

div.breadcrumb-secondary .secondary ul li,
div.breadcrumb-secondary .secondary ul li a {
	margin: 0 14px 0 0;
	height: 9px;
	float: left;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
}

div.breadcrumb-secondary .secondary ul li.home,
div.breadcrumb-secondary .secondary ul li.home a {
	width: 25px;
	background: url(../../img/nav/img_secondary.gif) 0 0 no-repeat;
}

div.breadcrumb-secondary .secondary ul li.contact,
div.breadcrumb-secondary .secondary ul li.contact a {
	width: 39px;
	background: url(../../img/nav/img_secondary.gif) -38px 0 no-repeat;
}

div.breadcrumb-secondary .secondary ul li.search,
div.breadcrumb-secondary .secondary ul li.search a {
	width: 33px;
	background: url(../../img/nav/img_secondary.gif) -90px 0 no-repeat;
}

div.breadcrumb-secondary .secondary ul li.sitemap,
div.breadcrumb-secondary .secondary ul li.sitemap a {
	width: 36px;
	background: url(../../img/nav/img_secondary.gif) -137px 0 no-repeat;
}

div.breadcrumb-secondary .secondary ul li.extranet,
div.breadcrumb-secondary .secondary ul li.extranet a {
	width: 43px;
	background: url(../../img/nav/img_secondary.gif) -187px 0 no-repeat;
}

	div.breadcrumb-secondary .secondary ul li.home a:hover {
		width: 25px;
		background: url(../../img/nav/img_secondary.gif) 0 -9px no-repeat;
	}
	
	div.breadcrumb-secondary .secondary ul li.contact a:hover {
		width: 39px;
		background: url(../../img/nav/img_secondary.gif) -38px -9px no-repeat;
	}
	
	div.breadcrumb-secondary .secondary ul li.search a:hover {
		width: 33px;
		background: url(../../img/nav/img_secondary.gif) -90px -9px no-repeat;
	}
	
	div.breadcrumb-secondary .secondary ul li.sitemap a:hover {
		width: 36px;
		background: url(../../img/nav/img_secondary.gif) -137px -9px no-repeat;
	}
	
	div.breadcrumb-secondary .secondary ul li.extranet a:hover {
		width: 43px;
		background: url(../../img/nav/img_secondary.gif) -187px -9px no-repeat;
	}
		

/* Footer
/*----------------------------------------------------------------------------*/

.footer {
	padding: 58px 0 0 0;
}

.footer div.content {
	padding: 0 40px 0 50px;
	position: relative;
}

.footer ul.products {
	position: absolute;
	left: 40px;
	top: 0;
}

.footer div.company {
	position: absolute;
	right: 40px;
}

.footer ul.extra {
	position: absolute;
	right: 40px;
	top: 90px;
} 

.footer ul.products {
	padding: 25px 0 0 0;
	width: 232px;
	line-height: 16px;
	background: url(../../img/img_footer_producten.gif) 0 0 no-repeat;
}

.footer ul.products li a {
	color: #fff;
	text-decoration: none;
}

.footer ul.products li a:hover,
.footer ul.extra a:hover {
	text-decoration: underline;
}		

.footer div.company {
	padding: 58px 0 0 5px;
	color: #fff;
	background: url(../../img/img_logo_footer.gif) 0 0 no-repeat;
}

.footer div.company td {
	font: normal normal 11px/16px "Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
	color: #fff;
}

.footer ul.extra {
	padding: 5px 0 0 0;
	text-align: right;
}

.footer ul.extra li {
	padding: 0 0 0 14px;
	float: left;
	display: inline;
}

.footer ul.extra a {
	color: #A8E5FF;
	text-decoration: none;
}



/* Main Content Area
/*----------------------------------------------------------------------------*/

.container .container-content,
.container .container-content td {
	font: normal normal 11px/18px "Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
	color: #666;
}

.container .container-content p {
	margin: 0 0 15px 0;
}

.column {
	float: left;
}

.column.last {
	float: right;
}


/* Recurrent classes
/*----------------------------------------------------------------------------*/

.clear {
	height: 0;
	line-height: 0;
	clear: both;
}

div.box {
	margin: 0 auto;
	width: 780px;
	text-align: left;
}


/* Home Payoff
/*----------------------------------------------------------------------------*/

.home-payoff {
	margin: 0 0 40px 0;
	height: 25px;
	background: url(../../img/img_h_payoff.gif) 0 0 no-repeat;
	border-bottom: 1px solid #D1D1D1;
}

.home-payoff span {
	display: block;
	text-indent: -9999px;
}


/* Home Intro
/*----------------------------------------------------------------------------*/

p.home-intro {
	font: normal 12px/18px "Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
	color: #666;
}

p.home-intro-highlight {
	font: bold 13px/18px "Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
	color: #0096D6;
}

.home .first {
	width: 320px !important;
}

.home .last {
	width: 300px !important;
}


/* Home Products
/*----------------------------------------------------------------------------*/

.box-products {
	margin: 32px 0;
	width: 283px;
	height: 214px;
	background: url(../../img/bg/bg_home_products.gif) 0 0 no-repeat;
}

.box-products h3 {
	margin: 0 0 0 26px;
	height: 55px;
	background: url(../../img/img_products_title.gif) 0 22px no-repeat;
}

.box-products h3 span {
	display: block;
	text-indent: -9999px;
}	

.box-products ul {
	padding: 0 0 0 26px;
}

.box-products ul li {
	padding: 0 0 0 15px;
	list-style-type: none;
	background: url(../../img/img_icon_listitem.gif) 0 50% no-repeat;
}

.box-products ul li a {
	color: #666;
	text-decoration: none;
}

.box-products ul li a:hover {
	color: #0096D6;
}


/* Home Cases
/*----------------------------------------------------------------------------*/

.box-cases {
	margin: 32px 0 0 0;
	position: relative;
	z-index: 0;
}

.box-cases .photo-overlay {
	width: 300px;
	height: 200px;
	position: absolute;
	background: url(../../img/bg/bg_cases_photo_overlay.png) 0 0 no-repeat;
	cursor: pointer;
}

.box-cases .case-navigation {
	position: absolute;
	left: 10px;
	top: -22px;
}

.box-cases .case-navigation ul li,
.box-cases .case-navigation ul li a {
	width: 28px;
	height: 22px;
	line-height: 27px;
	text-align: center;
	display: block;
	background: url(../../img/bg/bg_cases_navigation.gif) 0 0 no-repeat;
	float: left;
}

.box-cases .case-navigation ul li a {
	font-weight: bold;
	color: #a0a0a0;
	text-decoration: none;
}

.box-cases .case-navigation ul li a:hover {
	color: #666;
	background: url(../../img/bg/bg_cases_navigation.gif) 0 -56px no-repeat;
}

.box-cases .case-navigation ul li a.active {
	color: #666;
	background: url(../../img/bg/bg_cases_navigation.gif) 0 -28px no-repeat;
}

.box-cases .case-navigation ul li {
	margin: 0 0 10px 0;
}

.box-cases .case-item {
	background: url(../../img/bg/bg_home_cases.gif) 0 100% no-repeat;
}

.box-cases .case-item p {
	margin: 0 0 10px 0;
	width: 300px;
	height: 200px;
}

.box-cases .case-item div a.case-title {
	padding: 0 0 4px 0;
	font-size: 12px;
	font-weight: bold;
	color: #0096D7;
	display: block;
}

.box-cases .case-item div {
	padding: 15px;
	height: 50px !important;
	height: 80px;
	overflow: hidden;
}

.box-cases .case-item div div,
.box-cases .case-item div div div,
.box-cases .case-item div div div div 
{
	padding: 0 !important;
	height: auto !important;
	overflow: visible;
}

.box-cases .case-item a {
	text-decoration: none;
}

.box-cases .case-item a:hover {
	text-decoration: underline;
}

.box-cases a.fl {
	margin: 5px 0 0 0;
	color: #666;
	font-weight: bold;
	text-align: right;
	float: right;
	display: inline;
	text-decoration: none;
	border-bottom: 1px solid #B2DFF3;
}

.box-cases a.fl:hover {
	color: #333;
	border-bottom: 1px solid #0096D7;
}


/* Home Nieuws
/*----------------------------------------------------------------------------*/


.home-news div.news-item {
	padding: 0 0 0 15px;
	background: url(../../img/img_icon_listitem_blue.gif) no-repeat 0 7px;	
}

.home-news div.news-item p {
	margin: 0;
	padding: 0;
}

.home-news a,
.home-news div.news-item a,
.home-news div.news-item p a {
	text-decoration: none;
	display: inline;
}

.home-news a:hover,
.home-news div.news-item a:hover,
.home-news div.news-item p a:hover {
	text-decoration: underline;
}
	
.home-news .newsletter {
	margin: 0 0 0 15px;
	padding: 10px;
	background-color: #fffbec;
}

/* Submenu Extranet
/*----------------------------------------------------------------------------*/

.container-content .column.first {
	width: 140px;
}

.container-content .column.last {
	width: 500px;
}




/* SIFR
/*----------------------------------------------------------------------------*/

/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
	width: 85%;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
	visibility: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
	display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h2.sifr {
	visibility: hidden;
	letter-spacing: -6px;
	font-size: 20px;
}