/* CSSRESET */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,
blockquote,th,td {margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
abbr,acronym { border:0; }
html {font-size: 62.5%;}

/* ICT Zeelandia Stylesheet */
body {
	background: #FFF url(../images/bg_header.jpg) repeat-x;
	font:normal 1.2em/1.6em Verdana, Arial, sans-serif;
}

h1 { font-size: 1.8em;color:#003;margin-bottom: 10px; }
h2 { font-size: 1.4em;font-style: italic;color:#003; }
h3 { font-size: 1.3em;color:#369; }

a { text-decoration: none;font-weight: bold;color:#369; }
a:hover { border-bottom:1px solid #369; }

a.meer {
	display: block;
	background: url(../images/btn_meer.png) no-repeat;
	height:26px;width:26px;
	font-size:1px;text-indent: -999%;
}
a.meer:hover { border:none; }

.strong,
strong { font-weight: bold; }
li em { font-style: italic;color:#333; }

#container { margin:0 auto;position: relative;width:960px; }
#content p { margin:0.6em 0 1.2em 0; }
#content p em { font-style: italic;letter-spacing: 0.05em; }
#content p strong { font-weight: bold; }

#content ul { list-style: disc;margin-left: 30px; }

input.idle { color:#777;font-style: italic; }

.clear { clear:both; }

/* HEADER */
#intranet_login {
	width:100%;height:28px;
	background: #369 url(../images/bg_loginbar.png);
	line-height: 28px;
	text-align: right;	
	color:#FFF;
	display: none;
	font-weight: bold;
	position: absolute;
	top:0;left:0;
	z-index: 500;
}

#intranet_login label { margin-left: 10px; }

#logo {
	display:block;
	height:100px;
	margin-left:-41px;
	background: url(../images/logo.jpg) no-repeat 0 0;
}
#logo a { 
	height:100%;
	display: block;
	font-size: 1px;text-indent: -999%; 
}

/* MID */
#content {
	position: relative;
	width:644px;min-height:504px;
	left:-15px;top:30px;
	margin-top: 20px;
	background: transparent url(../images/bg_content.png) no-repeat 0 0;
}
#content #inner { width:550px;padding:40px 0 0 40px; }

#sidebar { position: absolute;left:641px;top:300px;width:250px; }
#sidebar h2 {
	background-repeat: no-repeat;
	height:30px;width:300px;
	text-indent:-999%;font-size: 1px;
}
#sidebar h2.showcase { background-image: url(../images/head_showcase.jpg); }
#sidebar h2.contact { margin-top:20px;background-image: url(../images/head_contact.jpg); }
#sidebar p { margin:10px 0 10px 20px;position: relative; }

p#showcase_item {
	margin: 0 0 10px 0;
	background-color: #EEE;
	width:300px;height:175px;
	background-position: top left;
	background-repeat: no-repeat;
}
#showcase_item em {
	position: absolute;
	top:110px;
	display: block;
	height:40px;width:280px;
	line-height: 20px;
	background-image: url(../images/bg_trans.png);
	padding:5px 0 5px 20px;
}
#showcase_item strong {
	color:#003;
	font-weight: bold;
	font-size:1.3em;
	display: block;
}
#showcase_item a.meer {
	position: absolute;
	top:122px;left:270px;
	outline: none;
}

#contact_box a.meer {
	position: absolute;
	top:70px;left:250px;
	outline: none;
}

/* Showcase */
#showcase {
	width:585px;
	height:305px;
	overflow: hidden;
	line-height: 1.4em;
	margin-bottom: 20px;
}

.wrappert {
	float:left;
	display: block;
	width:585px;
	overflow: hidden;
}
.wrappert .imagebox { float:left;width:330px;background-position: top center;background-repeat: no-repeat; }
.wrappert .info { float:right;width:210px;padding-right: 30px; }
.wrappert .info h3 { font-size:1.55em; }
.wrappert .info h3 em { font-size:0.7em;display: block;margin-top:7px; }
.wrappert .info p { padding-top:5px;line-height: 1.3em; }

#showcase div { height:300px; }

#klanten { clear:both;position: relative;margin-top:10px; }
/*#scroller { height:150px;width:540px;margin-left:20px;overflow: hidden;position: relative; }*/
#klanten ul { margin: 0;list-style-type: none; }
#klanten ul li {
	float:left;position: relative;
	width:180px;height:150px;
	cursor: pointer;
	background:top left no-repeat;
	margin: 0 1px 1px 0;
	border: 1px solid #EEE;
}

#klanten ul li a {
	position: absolute;
	top:100px;
	display: block;
	height:40px;width:180px;
	line-height: 40px;
	text-align: center;
	color:#003;
	font-size:1.2em;
	background-image: url(../images/bg_trans.png);
	border: none;
}

#slide_left,
#slide_right {
	position: absolute;
	width:20px;height:150px;
	text-indent: -999%;
	font-size: 1px;
	z-index: 500;
}

#slide_right { top:0;left:560px;cursor:e-resize;background-image: url(../images/slide_right.png); }
#slide_left { top:0;left:0;cursor:w-resize;background-image: url(../images/slide_left.png); }

/* CONTACT */
p.info {
	float:left;
	display: block;
	width:200px;
}
p.left { width:295px; }

#content .contact em {
	color:#666;
	font-style: normal;
}

.contact label {
	display: block;float:left;
	padding-right:10px;
}
.contactform p { clear:both; }
.contactform legend { font-size: 1.3em;color:#369; }
.contactform textarea { width:300px;height:100px; }
.contactform .wide input { width:300px; }

/* MENU */
#menu ul { position: absolute;left:-1px;margin-top:9px;z-index:500; }
#menu ul li {
	height:40px;width:140px;
	float:left;
	margin:10px 20px 0 0;
	outline: none;
}
#menu ul li a {
	display: block;
	height:40px;width:140px;
	text-indent:-999%;font-size: 1px;
	outline: none;border:none;
	background-position: center center;
	background-repeat: no-repeat;
}

#menu li.service a { background-image: url(../images/btn_service.png); }
#menu li.service a.active,
#menu li.service a:hover { background-image: url(../images/btn_service_hover.png); }
#menu li.ontwikkeling a { background-image: url(../images/btn_ontwikkeling.png); }
#menu li.ontwikkeling a.active,
#menu li.ontwikkeling a:hover { background-image: url(../images/btn_ontwikkeling_hover.png); }
#menu li.overons a { background-image: url(../images/btn_overons.png); }
#menu li.overons a.active,
#menu li.overons a:hover { background-image: url(../images/btn_overons_hover.png); }
#menu li.contact a { background-image: url(../images/btn_contact.png); }
#menu li.contact a.active,
#menu li.contact a:hover { background-image: url(../images/btn_contact_hover.png); }
#menu li.intranet a { background-image: url(../images/btn_intranet.png); }
#menu li.intranet a:hover { background-image: url(../images/btn_intranet_hover.png); }
#menu li.intranet { position: absolute;left:800px; }

#footer {
	clear: both;
	margin:0 auto;
	padding:50px 0 0 0;
	text-align: center;
	font-size:0.8em;
	color:#369;
	letter-spacing: 2px;
	z-index: 500;
}

/* ELEMENTS */
.right { float:right; }
.important { color:red; }
.important strong { text-transform: capitalize;color:red; }
