@charset "UTF-8";
/* CSS Document */

/*maincontent*/
#mainContent br {	font: 1.2em/1.7em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;	margin-bottom: 17px;}
#mainContent p {	font: 1.2em/1.7em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;}
#mainContent a:link, #mainContent a:visited {	color: #000;	text-decoration: none;	border-bottom: 1px dotted #000;}
#mainContent a:hover, #mainContent a:active {	color: #0073C3;	text-decoration: none;	border-bottom: 1px dotted #0073C3;}
#mainContent h1 {	font:  bold 2.4em/1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;	text-transform: uppercase;	letter-spacing: 0.05em;	margin-bottom: 12px;}
#mainContent h2 {	font:  bold 1.5em/1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;	color: #0073C3;	margin-bottom: 6px;	margin-top: 8px;}
#mainContent h3 {	font:  bold 1.2em/1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;	text-transform: uppercase;	letter-spacing: 0.05em;	margin-top: 12px; margin-bottom: 6px;}
#mainContent ul {padding-left: 1.2em;}
#mainContent li {font: 12px/17px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; list-style: disc outside;}
#mainContent {	background: url(none);	border-style: none;}
#mainContent h4, #mainContent h5, #mainContent h6  {font: bold 1.2em/1.7em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;}


/*kosten _ 4 koloms met bovenkop*/
.wat #geza  {display: none;}
.wat #sideR {display: none;}
.wat #k1 {	height: 240px;width: 960px;}
.wat  #wrapcontent {width: 960px; border: 1px solid #818181; margin-top: 20px; height: auto;}
.wat #k2, .wat #k3, .wat #k4 {	width: 270px;	padding: 10px 15px;	margin-bottom: 20px;}
.wat #k2 {	float: left;	margin-right: 28px;	margin-left: 10px;}
.wat #k3 {	float: left;}
.wat #k4 {	float: right;}
.wat #k5 {	clear: both;}
.wat #wrapcontent h1 a {	text-decoration: none;	border-style: none;}
.wat #k3 h2, .wat #k4 h2 {margin-bottom: 33px;}

.wat #k2 #w_kosten, .wat #k3 #w_bereikbaar, .wat #k4 #w_gemak {
	margin: 10px 10px 0px 0px;	height: 50px; width: 50px; text-decoration: none;	border-style: none; display: block;	}
.wat #k2 #w_kosten {	background: url(../i/icons_geza.jpg) 0px 0px}
.wat #k3 #w_bereikbaar {	background: url(../i/icons_geza.jpg) -50px 0px}
.wat #k4 #w_gemak {	background: url(../i/icons_geza.jpg) -100px 0px}

.wat #k2 #w_kosten:hover {background: url(../i/icons_geza.jpg) 0px -50px}
.wat #k3 #w_bereikbaar:hover {background: url(../i/icons_geza.jpg) -50px -50px}
.wat #k4 #w_gemak:hover {background: url(../i/icons_geza.jpg) -100px -50px}

.wat #k2 #w_kosten span {display: none}
.wat #k3 #w_bereikbaar span {display: none}
.wat #k4 #w_gemak span {display: none}
/*.wat #k7 {display: none;}
*/.wat  #k7 { background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;	width: 920px; border: 1px solid #818181; margin-top: 40px; height: auto; padding: 10px 20px; text-align: center;}
.wat  #k7 h2 a:link, .wat  #k7 h2 a:visited {font:  bold 1.0em/1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; color: #424242; letter-spacing: 0.05em; margin-bottom: 6px;}
.wat  #k7 h2 a:hover, .wat  #k7 h2 a:active {color: #000000}
.wat  #k7 h2 {font: 1.2em/1.7em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; }


/*kosten _ 4 koloms met bovenkop*/

.kosten #sideR {display: none;}
.kosten  #wrapcontent {float: left; width: 960px; border: 1px solid #818181; margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.kosten #k2 {height: 200px; width: 100%; margin: 15px 0 5px; background: url(../i/icoon_kosten.jpg) no-repeat 100px 0px;}
.kosten #container #mainContent #k2 h1{	padding-top: 120px; padding-left: 320px;}
.kosten #k3, .kosten #k4, .kosten #k5, .kosten #k6 {width: 218px; float: left; margin: 10px 0px 20px 20px;}


/*bereik _ 2 koloms met bovenkop*/

.bereik #sideR {display: none;}
.bereik  #wrapcontent {float: left; width: 960px; border: 1px solid #818181; margin-bottom: 15px; 	background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.bereik #k2 {height: 200px; width: 100%; margin: 15px 0 5px; 	background: url(../i/icoon_bereikbaar.jpg) no-repeat 100px 0px;}
.bereik #container #mainContent #k2 h1{	padding-top: 120px; padding-left: 320px;}
.bereik #k3, .bereik #k4 {width: 450px; float: left; margin: 10px 0px 20px 20px;}


/*kosten _ 2 koloms met bovenkop*/

.gemak #sideR {display: none;}
.gemak  #wrapcontent {float: left; width: 960px; border: 1px solid #818181; margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.gemak #k2 {height: 200px; width: 100%; margin: 15px 0 5px; background: url(../i/icoon_gemak.jpg) no-repeat 100px 0px;}
.gemak #container #mainContent #k2 h1{	padding-top: 120px; padding-left: 320px;}
.gemak #k3, .gemak #k4 {width: 450px; float: left; margin: 10px 0px 20px 20px;}


/*pagina's producten*/
.product #sideR  {display: none;}
.product #k2, .product #k3,  .product #k4 {width: 304px; min-height: 550px; border: 1px solid #818181; float: left; padding: 0;}
.product #k2 {margin-right: 21px; float: left;}  
.product #k3 {float: left;}  
.product #k4 {float: right;}  
.product #wrapcontent h2 {
	margin-right: 15px;
	margin-left: 15px;
}
.product #wrapcontent h2 a:link, .product #wrapcontent h2 a:visited {color: #0073C3;}
.product #wrapcontent h2 a:hover, .product #wrapcontent h2 a:active {color: #000;}
.product ul{padding-top: 8px; margin-right: 15px; margin-left: 15px;}
.product li {padding-bottom: 0px;}
.product #container #mainContent #wrapcontent #k2 {padding: 0;}
.product img {	margin: 0;	border-style: none;}
.product #k2 p a, .product #k3 p a, .product #k4 p a {	text-decoration: none;	border-style: none;}


.ond #geza  {display: none;}
.ond #wrapcontent {float: left; width: 790px; border: 1px solid #818181; margin-bottom: 15px;	background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
/*tekst*/ .ond #k2 { float: right; margin: 22px 20px 95px 0; width: 295px;}
/*foto*/ .ond #k3 { background: url(../i/ondernemer.jpg) no-repeat; height: 80px; width: 430px; margin: 20px 0 20px 20px; padding-top: 220px; padding-left: 250px}
/*lijst*/ .ond #k4 { width: 395px; margin: 0 0 20px 20px; background: #0073C3; padding: 20px 15px 15px 20px;}
.ond #k3 p { margin: 0; background: #222; width: 150px; text-align: center; color: #FFF; padding: 5px 5px 8px;
	font: bold 1.3em/1.3em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	/*transparantie*/ /* for IE */  filter:alpha(opacity=80);  /* CSS3 standard */	opacity:0.8;}
.ond #k4 li {color: #FFFFFF; padding-bottom: 8px;}
.ond #k5 {	clear: both;}

.zak #geza  {display: none;}
.zak #wrapcontent {float: left; width: 790px; border: 1px solid #818181; margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
/*tekst*/ .zak #k2 { float: right; margin: 22px 20px 20px 0; width: 295px;}
/*foto*/ .zak #k3 { background: url(../i/zakelijk.jpg) no-repeat; height: 80px; width: 430px; margin: 20px 0 20px 20px; padding-top: 220px; padding-left: 250px}
/*lijst*/ .zak #k4 { width: 395px; margin: 0 0 20px 20px; background: #0073C3; padding: 20px 15px 15px 20px;}
.zak #k3 p { margin: 0; background: #FFFFFF; width: 150px; text-align: center; color: #000; padding: 5px 5px 8px; 
font: bold 1.3em/1.3em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; 
/*transparantie*/ /* for IE */  filter:alpha(opacity=80);  /* CSS3 standard */  opacity:0.8;}
.zak #k4 li {color: #FFFFFF; padding-bottom: 8px;}
.zak #k5 {	clear: both;}

.cor #geza  {display: none;}
.cor #wrapcontent {float: left; width: 790px; border: 1px solid #818181; margin-bottom: 15px;	background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.cor #k2 {	float: right;	width: 295px;	margin-top: 22px;	margin-right: 25px;	margin-bottom: 30px;}
.cor #k3 {	background: url(../i/corp.jpg) no-repeat; float: left; height: 300px; width: 430px; margin: 25px 0 20px 20px;}
.cor #k4 {	clear: both;}


/*hoewerkvastmobiel _ 2 koloms met 2 afb en sidebar */
.hoe #geza  {display: none;}
.hoe  #wrapcontent { float: left; width: 790px;	border: 1px solid #818181;	margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom; position: relative;}
.hoe #k2, .hoe #k3, .hoe #k4, .hoe #k5,.hoe #k6 {width: 360px;}
/*plaatje*/ .hoe #k2, .hoe #k4 { height: 120px; position: absolute; top: 20px; border: 1px solid #818181;}
/*plaatje*/ .hoe #k2 {left: 20px; background: url(../i/binnen.jpg) no-repeat;}
/*plaatje*/ .hoe #k4 {right: 20px; background: url(../i/buiten.jpg) no-repeat;}
/*tekst*/.hoe #k3, .hoe #k5 {margin-top: 150px;}
.hoe #k3 {	float: left;	margin-left: 20px;}
.hoe #k5 {	float: right;	margin-right: 20px;}
.hoe #k6 {margin: 30px 20px 20px 0; float: right}

/*waaromvooru _ 2 koloms met 1 afb en sidebar */
.waarom #geza  {display: none;}
.waarom  #wrapcontent { width: 790px;	border: 1px solid #818181;	margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.waarom #k2, .waarom #k3, .waarom #k4 {width: 360px; margin: 20px 0px 20px 20px;}
.waarom #k2 { float: right; margin-right: 20px}
.waarom #k3 {	background: url(../i/waaromvooru.jpg) no-repeat; height: 240px; width: 360px;}
.waarom #k4 {	width: 320px;	margin: 20px 0px 20px 20px;	background: #0073C3;	padding: 10px 15px 15px 25px;}
.waarom #k5 {clear: both}
.waarom #k2 h2 {font:  bold 1.4em/1.3em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;	margin-top: 10px; margin-bottom: 2px;}
.waarom #k4 h3 {font:  bold 1.6em/1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;	color: #FFFFFF;	padding-bottom: 8px;}
.waarom #k4 li {color: #FFFFFF;	padding-bottom: 8px;}

/*overstap _ 4 koloms met bovenkop*/

.overstap #sideR {display: none;}
.overstap  #wrapcontent {float: left; width: 960px; border: 1px solid #818181; margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.overstap #k2 {height: 200px; width: 100%; margin: 15px 0 5px; background: url(../i/stoel.jpg) no-repeat 320px 0px;}
.overstap #container #mainContent #k2 h1{	padding-top: 100px; padding-left: 20px;}
.overstap #container #mainContent #k2 h2{	padding-top: 0px; padding-left: 20px;}
.overstap #k3, .overstap #k4, .overstap #k5, .overstap #k6 {width: 218px; float: left; margin: 10px 0px 20px 20px;}

/*service _ 4 koloms bovenaan met iframe onder*/
.service #sideR {display: none;}
.service #k1, .service #k4, .service #k2, .service #k5  {width: 960px; background: #EAEAEA; border-left: 1px solid #0073C3; border-right: 1px solid #0073C3;}
.service #k1, .service #k4 {border-top: 1px solid #0073C3; }
.service #k2, .service #k5 {border-bottom: 1px solid #0073C3; }
.service #k1 p, .service #k4 p {padding: 15px;}
.service #k2 .button, .service #k5 .button {margin-left: 15px; margin-bottom: 15px;}
.service #k3  {	width: 960px; height: 20px;	clear: both;}
.service #container #mainContent #k6 iframe {width: 960px; height: 500px; border: 1px solid #818181; margin-top: 15px;}

/*faq _ komt van deze site: http://www.sitemasters.be/scripts/2/40/1099/JS/Uitklapbare_F.A.Q. */
.faq #geza  {display: none;}
.waarom  #wrapcontent { width: 790px;	border: 1px solid #818181;	margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.faq #k1 {width: 760px; margin-bottom: 10px; border: 1px solid #818181; margin-bottom: 30px; padding: 15px 15px 0px;}
.faq #k7 li {margin-bottom: 10px; list-style-image: url(../i/faq.png); margin-left: 8px; }
.faq #k7 li a {font: bold 12px/17px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; color: #0073C3;	text-decoration: none; border-bottom: 1px dotted #0073C3;}
.faq #k7 li div, .faq #k7 li div p {font: 12px/17px "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; margin-top: 4px;}

/*ons _ 1 koloms in wrapcontent*/
.ons  #wrapcontent {float: left; width: 795px; border: 1px solid #818181; margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.ons #k3 {margin: 20px 20px 20px 20px;}
.ons #header #geza {display: none;}
.ons #k3 img {float: left; margin-right: 15px; border: 1px solid #818181; }

/*contact _ 2 koloms in wrapcontent*/
.contact #header #geza {display: none;}
.contact  #wrapcontent {float: left; width: 795px; border: 1px solid #818181; margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom;}
.contact #k2 {	background: url(../i/contact.jpg) no-repeat; float: left; height: 300px; width: 430px; margin: 25px 20px 20px;}
.contact #k3, .contact #k4 {float: left; width: 300px; margin-right: 20px; margin-top: 25px;}
.contact #k5 {	clear: both;}

/*google _ 1kolom boven - 2 koloms in wrapcontent*/
.google #header #geza {display: none;}
.google #wrapcontent {float: left; width: 615px}
.google #wrapper2 {float: left; width: 615px; border: 1px solid #818181; margin-bottom: 15px; background: #FAFAFA url(../i/back_content.jpg) repeat-x bottom; padding: 25px 20px 15px}
.google #sideR {display: none;}
.google #k3 {margin-bottom: 20px}
.google #k4 {float: left; width: 45%}
.google #k4 li {margin-bottom: 5px}
.google #k5 {float: right; width: 40%}
.google #k5 p {font: 1.2em/2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;}

.google #k6 {
	padding-left: 80px;
} 
#k6 #goo_kosten,
#k6 #goo_bereikbaar,
#k6 #goo_gemak {
	margin: 0;
	height: 68px;
	width: 150px;
	text-decoration: none;
	border-style: none;
	float: left;
	display: block;
	text-align: center;
}
#k6 #goo_kosten {background: url(../i/icon_kosten_goo.jpg) no-repeat 0px 18px}
#k6 #goo_bereikbaar {background: url(../i/icon_bereik_goo.jpg) no-repeat 0px 18px}
#k6 #goo_gemak {background: url(../i/icon_kosten_goo.jpg) no-repeat 0px 18px}

#k6 #goo_kosten:hover {background: url(../i/icon_kosten_goo.jpg) no-repeat -150px 18px}
#k6 #goo_bereikbaar:hover {background: url(../i/icon_bereik_goo.jpg) no-repeat -150px 18px}
#k6 #goo_gemak:hover {background: url(../i/icon_kosten_goo.jpg) no-repeat -150px 18px}

#k6 #goo_kosten span, #k6 #goo_bereikbaar span, #k6 #goo_gemak span {
	font: bold 1.2em/1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif;
	vertical-align: onder;
}


.google #k7 {padding: 5px 15px; margin-bottom: 30px; float: right; width: 250px; background: #0073C3;}
.google #k7 p {font-weight: bold; color: #0073C3; display: block; background: #FFFFFF; padding: 3px 6px; margin-top: 6px; margin-bottom: 12px; }
.google #k7 #frm h2 {color: #FFFFFF;	margin-bottom: 10px}
.google #k7 #frm #naam, .google #k7 #frm #tel {margin-bottom: 10px; width: 240px; height: 15px;}
.google #k7 #frm #sub {margin-bottom: 10px; 	width: 60px;}
.google #k7 input.placeholder {color: #555;}

.google #k8 {float: right; width: 280px; background: url(../i/quote_open.png) no-repeat left top;}
.google #k8 p {	font: bold 1.3em/1.6em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; color: #0073C3; text-indent: 30px; padding-top: 8px; background: url(../i/quote_close.png) no-repeat right bottom; padding-right: 20px;}
.google #k8 h3 a:link, .google1 #k8 h3 a:visited {	color: #000; text-decoration: none;	border-bottom: 1px dotted #000;	text-transform: capitalize;}
.google #k8 h3 a:hover, .google1 #k8 h3 a:active {color: #999; text-decoration: none; border-bottom: 1px dotted #999;}
.google #k8 img {float: right; height: 66px; width: 66px; margin-left: 12px;}






/*sidebar rechts*/
#sideR {width: 150px; float: right;}
#mail {width: 100%; border: 1px solid #818181; margin-bottom: 10px; padding-top: 10px; padding-bottom: 10px; text-align: center; }
#mail #kosten, #mail #bereikbaar, #mail #gemak {
	height: 70px;
	width: 70px;
	display: inline-block;
	margin-right: auto;
	margin-left: auto;
}
#mail #kosten {	background: url(../i/icons_sidebar.jpg) 0px 0px}
#mail #bereikbaar {	background: url(../i/icons_sidebar.jpg) -70px 0px}
#mail #gemak {	background: url(../i/icons_sidebar.jpg) -140px 0px}

#mail #kosten:hover {background: url(../i/icons_sidebar.jpg) 0px -70px}
#mail #bereikbaar:hover {background: url(../i/icons_sidebar.jpg) -70px -70px}
#mail #gemak:hover {background: url(../i/icons_sidebar.jpg) -140px -70px}

#mail #kosten span {display: none}
#mail #bereikbaar span {display: none}
#mail #gemak span {display: none}

#mainContent #sideR #mail a:link, 
#mainContent #sideR #mail a:visited  {font: bold 1.3em/1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; text-transform: none; margin: 5px 0px 5px; padding: 0px;letter-spacing: 0em; color: #000000; text-decoration: none; border-style: none;}
#mainContent #sideR #mail a:hover,
#mainContent #sideR #mail a:active  {font: bold 1.3em/1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; text-transform: none; margin: 5px 0px 5px; padding: 0px; letter-spacing: 0em; color: #000000; text-decoration: none; border-style: none;}
#mail a.button {background: url(../i/button.jpg) 0px 0px; height: 80px; width: 128px; margin-left: 12px; margin-top: 5px; 	display: inline-block; }
#mail a.button span { display: none;}
#mail a.button:link, #mail a.button:visited  {background: url(../i/button.jpg) 0px 0px;}
#mail a.button:hover  {background: url(../i/button.jpg) -128px 0px;}
#mail a.button:active  {background: url(../i/button.jpg) -256px 0px;}


/*__________________Quote_________________*/

/*vm_quote met foto - page class toevoegen*/
.bereik #footer #vm_quote #vm_quote_2, 
.gemak #footer #vm_quote #vm_quote_2,
.overstap #footer #vm_quote #vm_quote_2 {background: url(../i/quote_sluit.png) no-repeat 850px 40px}


/*vm_quote zonder foto - page class toevoegen*/
.xx #footer #vm_quote #vm_quote_2 {background: url(../i/quote_sluit.png) no-repeat 924px 40px}
.xx #footer #vm_quote #vm_quote_2 img {display: none}

/*pagina zonder vm_quote - page class toevoegen*/
.wat #footer #vm_quote, 
.kosten #footer #vm_quote, 
.product #footer #vm_quote, 
.ond #footer #vm_quote, 
.zak #footer #vm_quote, 
.cor #footer #vm_quote, 
.hoe #footer #vm_quote, 
.waarom #footer #vm_quote, 
.service #footer #vm_quote, 
.faq #footer #vm_quote, 
.ons #footer #vm_quote, 
.contact #footer #vm_quote,
.google #footer #vm_quote {display: none}

.wat #footer #webdesign, 
.kosten #footer #webdesign,
.product #footer #webdesign,
.ond #footer #webdesign,
.zak #footer #webdesign,
.cor #footer #webdesign,
.hoe #footer #webdesign,
.waarom #footer #webdesign,
.service #footer #webdesign, 
.faq #footer #webdesign,
.ons #footer #webdesign, 
.contact #footer #webdesign,
.google #footer #webdesign {height: 112px}

.wat #footer #webdesign p, 
.kosten #footer #webdesign p, 
.product #footer #webdesign p, 
.ond #footer #webdesign p, 
.zak #footer #webdesign p, 
.cor #footer #webdesign p, 
.hoe #footer #webdesign p, 
.waarom #footer #webdesign p, 
.service #footer #webdesign p, 
.faq #footer #webdesign p, 
.ons #footer #webdesign p, 
.contact #footer #webdesign p,
.google #footer #webdesign p {padding-top: 92px}
