@charset "utf-8";

/*====================================================
  WEBBUREAU QUITE EASY
  Date - 1 jan 2011
  Copyright - 
  Written for - www.website.nl
  Layout - Horizontal menu and 3 columns
  
  SWATCH COLORS
  ================
  Plaats hier de gebruikte kleuren in de website.
  
  ====================================================*/

/*********************************************************************
* RESET                                                              *
*********************************************************************/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, textarea, input, select {margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline;}
table {border-collapse: collapse; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}
table, td, th {vertical-align: middle;}
blockquote:before, blockquote:after, q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img {border: none;}
:focus {outline: 0; }


/*********************************************************************
* HTML ELEMENTS                                                      *
*********************************************************************/

*{margin:0;padding:0;}
html{height:100%;padding-bottom:1px; /* force scrollbars */}
body{height:100%; font-size:62.5%; font-family: Arial, Helvetica, sans-serif;color: #000; background:url(../images/bg.jpg) repeat-x top left; width:100%;}

/* headings
=========================*/
  h1, h2, h3, h4, h5, h6 {
    color: #e2007a;
	font-weight: normal;
	line-height: 1;
	margin-bottom: 0.5em;
    letter-spacing: -0.03em;
  }

  h1, h2, h4, h5, h6 { font-weight: bold; }
  
  h1 { font-size: 1.8em;
margin:0;
padding:0;
margin-bottom: 12px;
letter-spacing: 0.03em;
line-height: 32px;
font-weight:normal; }
  h2 { font-size: 1.4em;
margin:0;
padding:0;
margin-bottom: 12px;
letter-spacing: 0.03em;
line-height: 20px;
font-weight:normal; }
  h3 { font-size: 1.2em;   font-variant:small-caps; }
  h4 { font-size: 1.25em }
  h5 { font-size: 1.1em }
  h6 { font-size: 1em }

/* tekst elements
=========================*/
p {margin-bottom: 30px;}
a{color:#e2007a;text-decoration:underline;}
a:focus, a:hover{color:#000;}
abbr, acronym {border-bottom: 1px dotted #666;}
address {margin-bottom: 1.5em;}
blockquote {margin: 1.2em; line-height: 1.4em;}
blockquote span {font-size: 1.4em; color: #000;}
del {color:#666;}
em, dfn, blockquote, address {font-style: italic;}
strong, dfn {font-weight: bold;}
sup, sub {line-height: 0;}
cite {color: #666;}
pre {margin: 1.5em 0;white-space: pre;}
pre,code,tt {font: 1em monospace;line-height: 1.5;}

/* lists
=========================*/
li ul, li ol {margin-left: 1.5em;}
ul, ol {margin: 0 1.5em 1.5em 1.5em;}
ul {list-style-type: disc;}
ol {list-style-type: decimal;}
dl {margin: 0 0 1.5em 0;}
dl dt {font-weight: bold;}
dd {margin-left: 1.5em;}

/* tables                          
=========================*/
table {margin-bottom: 1.4em; width: 100%;}
th {font-weight: bold;}
thead th {background: #C3D9FF;}
th,td,caption {padding: 4px 10px 4px 5px;}
tr.even td {background: #F2F6FA;}
tfoot {font-style: italic;}
caption {background: #EEE;}

table.data-table {border: 1px solid #EEE;margin-bottom: 2em;width: 100%;}  
table.data-table th {background: #EEE;border: 1px solid #DDD;color: #555;text-align: left;}
table.data-table tr {border-bottom: 1px solid #EEE;}
table.data-table td, table th {padding: 8px 10px;}
table.data-table td {background: #F6F6F6;border: 1px solid #E6E6E6;}
table.data-table tr.even td {background: #FCFCFC;}

/* forms 
=========================*/
  label {position: absolute; width: 130px; }
  fieldset {padding: 1.4em; margin: 0 0 1.5em 0; border: 1px solid #DDD; background: #F6F6F6;}
  legend {font-weight: bold; font-size: 1.2em;}
  textarea {overflow: auto;}
  input, textarea, select {
    background: #FCFCFC;
    border: 1px solid #ccc;
    padding: 4px 5px;
	margin: 0 0 10px 140px;
	width: 300px;
  }
input.error, textarea.error{background: #FBE3E4; color: #8A1F11; border-color: #FBC2C4;     padding: 4px 5px;
}
input.radio{width:20px; margin-left:0px;}

  input.text:focus, textarea:focus, select:focus {background: #FFFFF5;}

  input.button {
    background: #DDD;
    border: 1px outset #AAA;
    padding: 4px 5px;
  }
  
  input.submit{width:99px; height:26px; background:url(../images/button-submit.gif); color:#fff; font-size:0.9em; padding-bottom:6px; padding-right:10px; margin-left:353px;}

  input.button:active {border-style: inset;}

  .form-error {border-color: #F00;}

/* images
=========================*/
a img{border:0;}
img.bordered,img.alignleft,img.alignright,img.aligncenter{background-color: #FFF;border: 1px solid #DDD;padding: 3px;}
img.alignleft, img.left {margin: 0 1.5em 1em 0;}
img.alignright, img.right {margin: 0 0 1em 1.5em;}


/*********************************************************************
* LAYOUT                                                             *
*********************************************************************/

/* page wrapper
=========================*/
#wrap{width: 100%; position: relative; min-height: 100%; height:auto !important; height:100%; }

#header{width:980px;height:130px;}


#logo {float:left; height:60px; width: 310px; margin:30px 0;}
#metainfo{float:right; padding: 40px 0 0 0; font-size:1.2em; width:250px; overflow:hidden;color:#666; text-align:right;}
#metainfo input{width:150px;margin:0; height:15px; font-style:italic;color:#666;}
#metainfo input.search-button{ width:18px; height:24px; border:0; padding:0;}

#metainfo a{color:#000; text-decoration:none;}
#metainfo a:hover{color:#d00000;}
#breadcrumb {font-size: 10px; color:#666; margin-bottom: 12px;}
#breadcrumb a{color:#666; text-decoration:none;}
#breadcrumb a:hover, #breadcrumb .selected{color:#e2007a;}
#websitetitle {}
#socialmedia {}
#search{width:200px; float:right; height:40px;}
#search input{margin:5px 5px 0 0; padding:0 5px; height:30px; width:150px; background:url(../images/search-field.png) no-repeat; border:0; font-size:12px;float:left;}
#search input.button{width:35px; margin:5px 0 0 0; padding:0; background:none;}
#search-input{}
#search-output{}

/* mainmenu [DROPWDOWN] 
=========================*/

#mainmenuwrap{width:100%; height:40px; background:url(../images/bg2.gif) repeat; margin-bottom:20px;}
#menucenter{width: 980px;height: 40px;margin: 0 auto;}
ul#mainmenu {
	width: 760px;
    height: 40px;
	list-style: none;
	font-size: 14px;
	float:left;
	padding:0;
	margin:0 20px 0 0;
}
ul#mainmenu li {
	float: left;
	padding: 0;
	position: relative;
	z-index: 1;
}

ul#mainmenu li a {
	line-height: 30px;
	display: block;
	float: left;
	color:#fff;
	padding:5px 19px 5px 0;
	overflow:hidden;
	text-decoration:none;
}

a .menu-left{width:6px; height:30px;display: block; float:left;}
a .menu-mid{display: block; float:left; padding:0 5px;}
a .menu-right{width:6px; height:30px;display: block; float:left;}

a:hover .menu-left, li.active .menu-left, li:hover a .menu-left{background:url(../images/menu-left.png); width:6px; height:30px;display: block; float:left;}
a:hover .menu-mid, li.active .menu-mid, li:hover a .menu-mid{background:url(../images/menu-middle.png) repeat-x; display: block; float:left; padding:0 5px;}
a:hover .menu-right, li.active .menu-right, li:hover a .menu-right{background:url(../images/menu-right.png); width:6px; height:30px;display: block; float:left;}


ul#mainmenu li.last {
	margin-right:0;
}
ul#mainmenu li:hover {
	z-index:2;
}
ul#mainmenu li:hover .sub, ul#mainmenu li.hover .sub {
	display:block;
}
ul#mainmenu li .sub {
	display: none;
	position: absolute;
	top: 30px;
	left: -10px;
	width: 218px;
	z-index:500;
	padding-top:10px;
}
ul#mainmenu .top-bg {
	background: url(../images/submenu-top.png) no-repeat;
	width: 218px;
	height: 17px;
	overflow: hidden;
	clear: both;
}
#mainmenu li ul {
	background: url(../images/submenu-middle.png) repeat-y;
	width: 198px;
	height: auto;
	margin: 0;
	padding: 0 10px;
	list-style: none;
	font-size: 14px;
}
ul#mainmenu li:hover li, ul#mainmenu li.active li {
	width: 200px;
	margin-left:0px;
	background: none !important;
}
ul#mainmenu li:hover li a, ul#mainmenu li.active li a {
	display:block;
	color: #fff;
	background: none !important;
	width:181px;
	padding:0 10px;
	text-decoration:none;
	z-index:10;
}
ul#mainmenu li:hover li a:hover, ul#mainmenu li.active li a:hover {
	color: #e2007a;
	background: none !important;
	text-decoration: none;
}
/*IE*/ul#mainmenu li li a:hover, ul#mainmenu li li a:hover {
	color: #fff;
	background: #0a4080 !important;
	text-decoration: none;
}/**/
ul#mainmenu .btm-bg {
	background: url(../images/submenu-bottom.png) no-repeat;
	width: 218px;
	height: 17px;
	overflow: hidden;
	clear: both;
}

/* body [CONTENT] 
=========================*/
#body {width:980px; font-size:1.3em; line-height:1.5; padding:1px 0 20px 0; height:auto; padding-bottom:250px;}

#page-A #contentwrap{float:left; width:760px;}
#page-B #contentwrap{float:left; width:980px;}

#page-A #content{float:right; width:490px; padding: 0 30px 0 20px;}
#page-B #content{float:right; width:710px; padding: 0 30px 0 20px;}

#content td{ vertical-align:top;}

#sidebarleft{float:left; width:220px; margin:34px 0 0 0;}

ul#submenu{width:200px; list-style:none; margin:0; padding:0; border-top: 1px dotted #ccc; }
ul#submenu li a{width:190px; height:20px; display:block; margin-bottom:1px; color:#999; text-decoration:none; font-size:13px; padding:5px 5px; border-bottom:1px dotted #ccc; }
ul#submenu li a:hover, ul#submenu li a.active{width:200px;background:url(../images/submenu-over.gif) repeat-x; border:1px solid #fff; color:#fff;padding:5px 10px;}


#page-A #sidebarright{float:right; width:200px; margin:0 0 0 0;}
#page-B #sidebarright{display:none;}
#contact{width:168px; height: 215px; background:url(../images/contact.jpg) no-repeat; color:#fff; padding:15px; line-height:16px;}
#contact h2{color:#fff;}
#contact img, #footer img{ vertical-align:middle; margin:2px 0;}
#contact a{color:#fff; text-decoration:none;}
#contact a:hover{text-decoration:underline;}

#extrainfo{width:198px; background:url(../images/bg-extrainfo.gif) no-repeat bottom left;padding: 20px 0 20px 0; margin-top: 10px;}
#extrainfo ul{ list-style-image:url(../images/list-style1.gif); margin: 0 0 0 35px;}
#extrainfo ul li{padding:10px 0;}
#extrainfo ul li a{ text-decoration:none; color:#000;}
#extrainfo ul li a:hover{ text-decoration:underline; color:#e2007a;}

.news{margin:10px 0; font-size:13px;}
.news strong{font-size:14px;}
.nieuws .nieuws-datum{font-size:10px; font-style:italic; width:220px; display:block; margin-top:5px; color:#666;}



/* footer
=========================*/
#footerwrap{position: absolute; bottom: 0;width:100%; 	height: 100px;
	background: #000;
	padding: 40px 0;
	border-top: 0px solid #e2007a;
}
#footer{width:980px; margin:0 auto; color:#fff;}
#footer a{color:#fff; text-decoration:none;}
#footer a:hover{ text-decoration:underline;}

#footer .title{font-size:14px;}
#footer .col{font-size:11px; line-height:17px; float:left; margin-right:40px;}

#background{
	background:#000 url(../images/content-bg.gif) no-repeat; width:506px; height:520px;position: absolute; bottom: 180px; z-index:-1;
}

.portfolio-item{float: left; margin: 20px 16px 0 0px; width: 220px;}
.portfolio-item a img{border: 2px solid #ccc;}
.portfolio-item a:hover img{border: 2px solid #e2007a;}

/* siteinfo
=========================*/
#siteinfo{}
#siteinfo-legal{}
#siteinfo-credits{}
#siteinfo a{}
#siteinfo a:hover{}

#map{width:490px; height:300px;}
/*********************************************************************
* MISC CLASSES                                                       *
*********************************************************************/


/* seperators 
=========================*/
.separatorHor{}
.separatorVer{}

/* classes
=========================*/
.small {font-size: 1em;}
.smaller {font-size: 0.8em;}
.smallest {font-size: 0.6em;}

.large {font-size: 1.4em;}
.larger {font-size: 1.6em;}
.largest {font-size: 1.8em;}

.hidden {display: none;}

.quiet {color: #666;}
.loud {color: #000;}
.highlight {background: #FF0;}

.text-left {text-align: left;}
.text-right {text-align: right;}
.text-center {text-align: center;}

.error, .notice, .success {border: 1px solid #DDD;margin-bottom: 1em;padding: 0.6em 0.8em;}

.error {background: #FBE3E4; color: #8A1F11; border-color: #FBC2C4;}
.error a {color: #8A1F11;}

.notice {background: #FFF6BF; color: #514721; border-color: #FFD324;}
.notice a {color: #514721;}

.success {background: #E6EFC2; color: #264409; border-color: #C6D880;}
.success a {color: #264409;}

.button{ }
.button a{ background: #e2007a; color: #fff; text-align:center; float:right; width:90px; font-size:0.9em; height:21px; padding-top:1px; cursor:pointer; margin-top: 10px; margin-left:10px; text-decoration:none;}
.button a:hover{background: #db3535;}

.column-50{float:left; width:230px; margin-right:30px;}

.column-33{}
.column-25{}

.nieuws h2{margin: 0 0 0.2em 0;}
.nieuws h2 a{color:#000; text-decoration:none;}
.nieuws h2 a:hover{color:#d00000; text-decoration:none;}
.nieuws-tekst{margin-bottom:0.5em;}
.nieuws-datum{float:left; margin-right:5px; height:50px; margin-top:-7px; font-size:0.8em; font-style:italic;}
.lees-meer{float:right; background:#d00000; padding:2px 13px;}
.lees-meer a{ color:#fff; text-decoration:none; font-size:0.9em;}
.lees-meer a:hover{text-decoration:underline;}
.nieuws hr{border:0; border-top: 1px dotted #ccc; margin:10px 0;}

  .colWrapper{float:left; width:700px;}
  .homecol1{width:940px; height:250px; margin-top:20px;}
  .homecol1left{width:195px; height: 215px; float: left; background:url(../images/bg-portfolio-webburea-lisse-quite-easy.jpg); padding: 35px 5px 0 30px;}
  .homecol2{margin: 30px 0 0 20px; width:235px; float:left;}
  .homecol3{margin: 40px 20px 0 20px; height: 225px; width: 440px; float:left;}

    div#rotator {
	position:relative;
	height:255px;
}
    div#rotator ul {
margin:0;}
/* rotator css */
	div#rotator ul li {
	float:left;
	position:absolute;
	list-style: none;
}
/* rotator image style */	
	div#rotator ul li img {
}
    div#rotator ul li.show {
}


  
/* floats
=========================*/
.left,.alignleft {float: left;}
.right,.alignright {float: right;}
.aligncenter{margin: 0 auto;}
.clear,.clearer {clear: both;}
.clearer {display: block;font-size: 0;line-height: 0;}

/* borders 
=========================*/
.noborder {border: 0;}
.notborder {border-top: 0;}
.norborder {border-right: 0;}
.nobborder {border-bottom: 0;}
.nolborder {border-left: 0;}

/* margins
=========================*/
.nomargin {margin: 0;}
.notmargin {margin-top: 0;}
.normargin {margin-right: 0;}
.nobmargin {margin-bottom: 0;}
.nolmargin {margin-left: 0;}

/* paddings 
=========================*/
.nopadding {padding: 0;}
.notpadding {padding-top: 0;}
.norpadding {padding-right: 0;}
.nobpadding {padding-bottom: 0;}
.nolpadding {padding-left: 0;}