img {	border:0px;}
*{		margin:0px;	padding:0px;

}
html, body {
	color:#000000;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}
html{
	background-repeat: repeat-y;
	background-image: url(../img/background-links.jpg);
	background-position: center;
	background-color:#FFFFFF;
}
body{
	background-image: url(../img/background.jpg);
	background-repeat: repeat-x;
	background-position: top;
}
/*
 * Layout
 */
#container {	width:900px;margin:auto;}
#header {		height:150px;}
#main {			clear:both;}
#side{			float:left; width:200px; padding:10px; color:#787771; line-height:17px; padding-top:35px;}
#content{ 		float:left; padding:25px 0px 25px 25px; width:650px; overflow:hidden;}	
#footer{ 		clear:both; 
				padding-top:30px;
				margin-bottom:40px; 
				color:#787771; 
				font-size:9px; 
				text-transform:uppercase;
				text-align:right;
				}

/*
 * Links
 */
a:link, a:visited{ color:#2B67E3;}
a:hover{color:#99CC00;}
/* ------------- Menu ----------- */
#menu{ height:40px;}
ul#menu li{ list-style-type:none; float:left; margin-right:16px;}
#menu a{ height:40px; display:block; }
ul#menu li.last{margin:0px;}
ul#menu li.menuspacer{
	margin-right:25px;
	width:220px; height:40px; 
	display:block; 
	background-image:url('../img/background-menu.jpg');
}

/*
 * Buttons
 */
#bHome, #bWebsites, #bWebapplicaties, #bWebhosting, #bOverOns, #bBlog, #bContact{
	background-image:url(../img/menu.jpg);
	background-position:0px 0px;
	height:44px;
	display:block;
	float:left;
	overflow:hidden;
	line-height:250px;
}
/* Normaal */
#bHome{				width:59px;}
#bWebsites{			width:76px;  background-position:-59px 0px;}
#bWebapplicaties{	width:115px; background-position:-135px 0px;}
#bWebhosting{ 		width:96px;  background-position:-250px 0px;}
#bOverOns{			width:76px;  background-position:-346px 0px;}
#bBlog{				width:55px;  background-position:-422px 0px;}
#bContact{			width:74px;  background-position:-477px 0px;}

/* Hover */
#bHome:hover, #bHome.actief{						background-position:0px 40px;}
#bWebsites:hover, #bWebsites.actief{				background-position:-59px 40px;}
#bWebapplicaties:hover, #bWebapplicaties.actief{	background-position:-135px 40px;}
#bWebhosting:hover, #bWebhosting.actief{			background-position:-250px 40px;}
#bOverOns:hover, #bOverOns.actief{					background-position:-346px 40px;}
#bBlog:hover, #bBlog.actief{						background-position:-422px 40px;}
#bContact:hover, #bContact.actief{					background-position:-477px 40px;}

/* ------------- Submenu ----------- */
.submenu{ margin-top:42px;}
#submenu{margin-bottom:30px;}
#submenu li{ 
	list-style-type:none;	
	font-size:14px; 
	font-weight:bold; 
	font-family:"Corbel", Arial, Helvetica, sans-serif;
}
#submenu a:link, #submenu a:visited{ 
	text-decoration:none; 
	margin-top:2px;	
	padding-bottom:5px;
	display:block; 
	padding:5px 0px 5px 8px;
	color:#666;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
#submenu a:hover{ text-decoration:underline;}
#submenu a.actief:link, #submenu a.actief:visited{ color:#fff; 	background-color:#224BA3;}
.raquo{ font-size:16px;}
/* ------------- headers ----------- */
h1,h2,h3{ 	font-family: Georgia, "Times New Roman", Times, serif; margin-bottom:15px;}

h1 {
	font-size:21px;
	color:#2B67E3;
	border-bottom:#D9D9D9 1px solid;
	padding-bottom:7px;
	font-weight:normal;
}
h2 {
	font-weight:normal;	
	font-size:18px;
	padding-top:10px;
	margin-bottom:6px;
	color:#2B67E3;
}
#side h2{ 
	font-size:15px; 
	padding-top:20px; 
	padding-bottom:5px; 
	font-weight:bold; 
	border-bottom:#D8D8D8 1px solid;
	color:#706C63;
}
.colomSmall h2{ 
	color:#000; 
	font-family:Arial, Helvetica, sans-serif; 
	font-weight:bold;
	border-bottom:1px solid #CCCCCC;
	padding-bottom:4px;
	margin-left:10px;
}
#content .colomSmall ul{
	margin-bottom:0px;
}
h3{
	border-bottom:1px solid #D8D8D8;
	color:#706C63;
	font-size:15px;
	padding-bottom:5px;
}
h4{ font-size:12px; line-height:14px;}
h1.logo, h2.slogan{ border:0px; margin:0px;padding:0px;}
/* ------------- Stijl ----------- */
.google-apps-badge{text-align:center; padding-bottom:15px;}
.ie6{ width:620px; float:right;}
.intro{ margin-bottom:20px;}
.logo a{	
	width:220px;
	height:150px;
	display:block;
	line-height:2000px;
	overflow:hidden;
	float:left;
	background-image:url(../img/logo-presis.jpg);
}
.slogan{
	float:left;
	width:580px;
	height:150px;
	overflow:hidden;
	line-height:2000px;
	background-image:url(../img/slogan.jpg);
}
.clearfix:after, .container:after {content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;}
.clearfix, .container {display:block;}
a.aanvraagButton{ 
	display:block; width:149px; height:30px; 
	background-image:url(../img/button-pakket-aanvragen.jpg);
	overflow:hidden;
	line-height:100px;
	margin:15px 0px;
}

.org{font-weight:bold;}
/* ---------------- Splash ---------------- */
.splashBox{
	border-right:#D9D9D9 solid 1px;
	float:left;
	margin-right:15px;
	width:205px;
	text-align:center;
}
.splashBox a{ margin:auto;}
div.last, li.last, ul.portfolio li.last{
	margin:0px;
	border:0px;
}
/* ---------------- Blog ----------------- */
.blogTitle{color:#2B67E3;}
.blogDateSide{ margin-left:23px; margin-top:3px; margin-bottom:5px; font-size:10px; line-height:10px; color:#999;}
.blogDate{ font-size:10px; margin-bottom:15px; line-height:10px; color:#999;}
.blogEntry{ margin-bottom:30px; border-bottom:1px solid #ccc;}
.blogEntry p{ margin-bottom:15px;}
.blogIntro{ font-size:12px; margin-left:0px; margin-bottom:5px;}
.blogImage{ width:150px; margin-right:15px; float:left; padding-top:70px;}
.blogDetails{ font-size:11px; color:#666;}
.blogContent{ width:480px; float:left; margin-bottom:40px;}
.blogReacties{ margin-top:20px; text-align:right;}
.blogArchiveLink{margin-left:25px; font-size:11px; display:block; padding-bottom:20px; padding-top:5px;}
a.blogLink:link, a.blogLink:visited{ margin-left:0px; font-weight:bold; color:#666; padding-bottom:20px; display:block;}
a.blogLink:hover{color:#99CC00;}
.blogShare{margin-top:20px; border:1px solid #ccc; padding:5px 0; border-left:0; border-right:0;}

.addthisButton{float:left; margin-top:2px;}
.facebookLike{border:none; overflow:hidden; width:250px; height:20px; float:left; margin-left:10px;}

/* ---------------- Reageer ----------------- */
.reacties, .reageer{padding-left:165px;}
.reacties{border-bottom:1px solid #CCCCCC; margin-bottom:30px; padding-bottom:30px;}
.reactie{ margin-bottom:15px;}
.reactie_name{ margin-bottom:10px;}
.reactie_body{ font-size:11px; line-height:19px; margin-left:15px;}

/* --------------- Buttons --------------- */
a.buttonMeerinformatie:link, a.buttonMeerinformatie:visited{ 
	width:139px; 
	display:block; 
	height:30px; 
	background-image:url('../img/button-meerinformatie.jpg');
	overflow:hidden;
	line-height:500px;
}
a.buttonMeerinformatie:hover{
	background-position:0px 30px;
}
/* --------------- Content --------------- */
#content ul{ margin-left:30px; margin-bottom:20px; line-height:22px;}
p{	margin-bottom:18px; line-height:22px;}
div.hr {  	height:1px; clear:both;}
div.hr hr{	display: none; border:0px; clear:both;}
/* ------------- Aanbieding ------------- */
.colomMedium{ float:left; margin-right:15px; width:450px;}
.colomSmall {
	background-color:#F1F1F1;
	border:1px solid #DFDFDF;
	float:right;
	padding:5px;
	width:150px;
}
.colomSmall ul{ margin:0px;}
.colomSmall li{ line-height:17px;}
.colomSmall em{color:#666;display:block;font-size:11px;margin-left:10px;margin-top:10px; line-height:14px;}

.employee_function{ color:#666; margin-bottom:10px; font-size:11px; font-style:italic;}

/* 
 * Table
 */
table.webhosting{ width:100%; border-collapse:collapse; margin-bottom:20px;}
.webhosting th[scope=row]{ 
	text-align:left; 
	padding:4px; 
	padding:4px;
	width:142px;
}
.webhosting th[scope=col]{ 
	background-color:#9AB7F1; 
	color:#fff; 
	font-size:13px; 
	padding:4px 0;
	width:100px;
}
.webhosting td, .webhosting th{ 
	border-right:5px solid #FFF; 	
	background-color:#F0F4FD; 
}
.webhosting td{ 
	text-align:center; 	
	padding:4px; 
}
.webhosting .alt td, .alt th{ background-color:#dce6fa;}

/* ------------- Pagination ------------- */
ul#pagination{ margin:0px; padding:0px; font-size:11px;}
ul#pagination li{ float:left; list-style-type:none; margin-right:3px;}
#pagination .desctiption{ color:#666; padding:0px 6px 0 0;}
#pagination li{ padding:0px 6px; border:#fff 0px solid; display:block; font-weight:bold;}
#pagination .item{ border:#ccc 1px solid; display:block; padding:0px 8px; font-weight:normal;}

/* ------------- Employees ------------- */
.employee{ margin-bottom:20px;}
.employee_image{float:right; width:120px; margin-bottom:1em; text-align:right; margin-left:30px;}
.employee_body{float:left; width:600px;}
.employee_linkedin{margin-right:5px;}

/* ------------- Partners ------------- */
.partner{ margin-bottom:20px;}
.partner_image{float:right; width:190px; margin-bottom:1em; text-align:right; margin-left:10px;}
.partner_description{float:left; width:450px;}
/* ------------- Google Apps ------------- */
#googleAppsRecommandations .prevContainer, #googleAppsRecommandations .nextContainer{
	float:left; width:35px; display:block;
}
#googleAppsRecommandations{margin:20px 0;}
#googleAppsRecommandations .slide{padding:0 15px;}
#googleAppsRecommandations #slideshow{float:left; width:538px; display:block; margin:0 15px; border:1px solid #ccc; border-bottom:0; border-top:0px; }
#googleAppsRecommandations #next{margin:80px 0 0 0; outline: none; height:35px; width:35px; overflow:hidden; display:block; background:url('../img/button_next.jpg') 0 0; line-height:200;}
#googleAppsRecommandations #next:hover{background-position:0 35px;}
#googleAppsRecommandations #prev{margin:80px 0 0 0; outline: none; height:35px; width:35px; overflow:hidden; display:block; background:url('../img/button_prev.jpg') 0 0; line-height:200;}
#googleAppsRecommandations #prev:hover{background-position:0 35px;}
/* ------------- Form ------------- */
.form.simple input.text{width:300px;}
.form.simple textarea.text{height:75px;}
.form.simple p{line-height:18px;}
/* ------------- Twitter ------------- */
#twitter_update_list{margin-bottom:15px;}
#twitter_update_list li{list-style-type:none; margin-bottom:10px; padding-bottom:10px; border-bottom:1px dotted #ccc;}
.tweet_list{ list-style-type:none; font-size:11px}
.tweet_list li{ display:block; clear:both; }
.tweet_avatar{float:left; margin-right:5px; margin-top:4px;}
.tweet_text{float:left; display:inline-block; width:185px; margin-bottom:10px; line-height:16px;}
.tweet_list a{color:#666;}
/* ------------- Portfolio Slider ------------- */
/*#slider ul, #slider li{
	margin:0;
	padding:0;
	list-style:none;
}
#slider, #slider li{ 
	width:650px;
	height:290px;
	overflow:hidden; 
}
span#prevBtn{ float:left; width:315px; margin-left:10px; height:30px; font-weight:bold; font-size:14px;}
span#nextBtn{ float:right; width:315px; margin-right:10px; height:30px; font-weight:bold; font-size:14px; text-align:right;}*/	
#content ul.portfolio{margin:0px;}
.portfolio li{ display:block; margin-bottom:25px; list-style-type:none;}
.portfolio_name{color:#666; font-size:11px; line-height:15px; margin-top:0px;}
.portfolio_img img{ border:1px solid #CDCDCD;}
.portfolio a:link, .portfolio a:visited{color:#666; text-decoration:underline;}
.portfolio a:hover{color:#2B67E3;}
.portfolio_img{ float:left; margin-right:20px;}
.portfolio_description{ float:left; width:420px; }
.portfolio_description a:link, .portfolio_description a:visited{ color:#224BA3; text-decoration:none; border-bottom:1px solid #BDCEF2; margin:0px; padding:0px; }
.portfolio_description a:hover{ color:#224BA3;  border-bottom:1px solid #224BA3;}
.portfolio_description p{margin:0px;}
/* ------------- Gallery ------------- */
#gallery ul, #gallery li{
	margin:0;
	padding:0;
	list-style:none;
}
#gallery li{
	float:left;
	margin:0px 15px 15px 0px;
}
.gallery_img img{ border:1px solid #aaa;}
/*
    ColorBox Core Style
    The following rules are the styles that are consistant between all ColorBox themes
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:visible;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
	ColorBox example user style
	These rules are ordered and tabbed in a way that represents the order/nesting of the generated HTML, 
	in hope that this will make the relationship easier to understand. Thanks, jack@colorpowered.com
*/
#cboxOverlay{background:#000;}

#colorbox{}
	#cboxContent{margin-top:32px; background:#fff;}
		#cboxLoadedContent{background:#fff; padding:10px;}
                #cboxLoadingGraphic{background:url(../img/loading.gif) center center no-repeat;}
                #cboxLoadingOverlay{background:#fff;}
                #cboxTitle{position:absolute; top:-22px; left:0; color:#ccc; font-size:14px; font-weight:bold;}
                #cboxCurrent{position:absolute; top:-22px; right:75px; color:#ccc; text-align:right;}
                
                #cboxSlideshow, #cboxPrevious, #cboxNext, #cboxClose{text-indent:-9999px; width:20px; height:20px; position:absolute; top:-20px; background:url(../img/controls.png) 0 0 no-repeat;}

                #cboxPrevious{background-position:0px 0px; right:44px;}
                #cboxPrevious.hover{background-position:0px -25px;}
                #cboxNext{background-position:-25px 0px; right:22px;}
                #cboxNext.hover{background-position:-25px -25px;}
		#cboxClose{background-position:-50px 0px; right:0;}
		#cboxClose.hover{background-position:-50px -25px;}

                .cboxSlideshow_on #cboxPrevious, .cboxSlideshow_off #cboxPrevious{right:66px;}

                .cboxSlideshow_on #cboxSlideshow{background-position:-75px -25px; right:44px;}
                .cboxSlideshow_on #cboxSlideshow.hover{background-position:-100px -25px;}
                .cboxSlideshow_off #cboxSlideshow{background-position:-100px 0px; right:44px;}
                .cboxSlideshow_off #cboxSlideshow.hover{background-position:-75px -25px;}

/* -------------------------------------------------------------- 
   
   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms
   
   Usage:
   * For text fields, use class .title or .text
   
-------------------------------------------------------------- */

label       { font-weight: bold; }
fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
legend      { font-weight: bold; font-size:1.2em; }
form		{ margin-bottom:20px;}	
/* Contact 
-------------------------------------------------------------- */
.form p{
	margin:0px;
}
/* Form fields
-------------------------------------------------------------- */

input[type=text],
input.text, input.title, 
textarea, select { 
  background-color:#fff; 
  border:1px solid #bbb; 
}
input[type=text]:focus, 
input.text:focus, input.title:focus, 
textarea:focus, select:focus { 
  border-color:#666; 
  background-color:#FFFFCC;
}

input[type=text], 
input.text, input.title,
textarea, select {
  margin:0.5em 0;
}

input.text, 
input.title   { width: 390px; padding:5px; }
input.title   { font-size:1.5em; }
textarea      { width: 390px; height: 150px; padding:5px; }
select.select{ width:402px; padding:3px;}

input[type=checkbox], input[type=radio], 
input.checkbox, input.radio { 
  position:relative; top:.25em; 
}

form.inline { line-height:3; }
form.inline p { margin-bottom:0; }

.form .label{ width:120px; display:inline-block; float: left; clear: left; padding-top:12px;}
#form .indent{ margin-left:120px;}
.form .button{ cursor:pointer; padding:2px 14px;}
.form .required_star{ color:#CC0000; font-weight:bold; font-size:16px;}
.form .description{ color:#666; font-size:11px;}
.form optgroup option { margin-left:10px;}

#formReactie .error{margin-left:0px;}
#formReactie .button{ margin-top:10px;}

.nieuwsbriefForm p{margin:0px;}
.nieuwsbriefForm label{ width:45px; display:inline-block;}
.nieuwsbriefForm .indent{ margin-left:45px;}
.nieuwsbriefForm .button{cursor:pointer; padding:2px 10px; margin-top:10px;}

/* Success, notice and error boxes
-------------------------------------------------------------- */
label.error{
	clear:both;
	display:block;
	margin-left:120px;
	font-size:11px;
	color:#FF0000;
}
.errorText,
.noticeText, 
.successText    { padding: .8em; margin-bottom: 1em; border: 2px solid #ddd; }

.errorText      { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.noticeText     { background: #FFF6BF; color: #514721; border-color: #FFD324; }
.successText    { background: #E6EFC2; color: #264409; border-color: #C6D880; }
.errorText a    { color: #8a1f11; }
.noticeText a   { color: #514721; }
.successText a  { color: #264409; }
