html { color:#000; }
body,div,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,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; }
caption,th { text-align:left; }
h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; font-variant:normal; }
sup { vertical-align:text-top; }
sub { vertical-align:text-bottom; }
input,textarea,select { font-family:inherit; font-size:inherit; font-weight:inherit; }
input,textarea,select { font-size:100%; }
legend { color:#000; }
:focus { outline: none; }
td { vertical-align: top; }
b, strong { font-weight: bold; }
i, italic { font-style: italic; }
textarea { resize: none; }
/* end reset */

/* algemeen */
body { font-family:"Trebuchet MS"; font-size: 13px; color: #666666; -webkit-text-size-adjust: 100%;}
h1,h2,h3,h4, .h1, .h2, .h3, .h4 { font-family:Helvetica; display: block; }
a  { color: #0089FA; }
a:hover  { text-decoration: none; }
p  { margin-bottom: 10px; line-height: 16px; }
h1, .h1 { font-size: 33px; color: #39B14A; }
h2, .h2 { font-size: 16px; color: #4D4D4D; font-weight: bold; margin-bottom: 15px; }
h3, .h3 { font-size: 12px; color: #4D4D4D; font-weight: bold; margin-bottom: 10px; }
h4, .h4 { font-size: 12px; color: #999999; }
hr { background: url(../_images/hr.png); color: none; height: 1px; border: medium none; width: 464px; margin: 40px auto; }
span.green { color:#39B14A; }
.clear { clear: both; }

/* buttons */

.button { background: url(/_images/img-buttons.png) no-repeat -420px -30px; display: inline-block; height: 40px; text-align: center; color: white; line-height: 38px; text-decoration: none; width: 220px;}
.button:hover { background-position: -420px -75px; display:}

.button.groot { background: url(/_images/img-buttons.png) no-repeat -30px -29px; width: 335px;}
.button.groot:hover { background-position: -30px -74px; display:}

.button.klein { background: url(/_images/img-buttons.png) no-repeat -693px -30px; width: 122px;}
.button.klein:hover { background-position: -693px -75px; display:}

.actiebutton { background: url(/_images/img-actiebutton.png) no-repeat -29px -30px; display: inline-block; height: 45px; text-align: center; color: white; font-size: 14px; line-height: 19px; text-decoration: none; width: 117px; padding: 15px; margin: 15px;}
.actiebutton:hover { background-position: -194px -30px; }
.actiebutton:active { background-position: -360px -30px; }

.vink { background:url("/_images/img-vink.png"); display: inline-block; height: 18px; width: 18px; }

/* opmaak */
#headerContainer { width: 970px; margin: 0 auto; }
#header { position: absolute; top: 0; width:970px; margin:0 auto; background:url(../_images/bg_header.png) no-repeat; border-bottom:1px solid #B5B5B5; height:25px; padding-top: 9px; overflow: hidden; -webkit-box-shadow:0 0 10px #616161; -moz-box-shadow:0 0 10px #616161; box-shadow:0 0 10px #616161; }
#container { width:968px; margin:33px auto 0; background:url(../_images/bg.png) repeat-x #fafafa;; padding:0 0px 20px; -webkit-box-shadow:0 0 10px #616161; -moz-box-shadow:0 0 10px #616161; box-shadow:0 0 10px #616161; border-top:1px solid black; border-bottom:1px solid black; }
#container { border-left: 1px solid #CCCCCC; border-right: 1px solid #CCCCCC; }
#top { height:150px; padding: 0 85px; }
a#logo { margin-top:30px; margin-right:30px; float:left; }
#quote { background:url(../_images/icon.png) no-repeat right; float:right; width:440px; margin-top:30px; font-size:18px; padding:32px 50px 25px 0; }
#quote .h1 { font-size:19px; line-height:27px; color:#666666; }
#quote a { font-size: 12px; }

/* productLine */
#borderTop { width: 968px; height: 15px; background: url(../_images/border.png) no-repeat; }
#breedBandContent { background: white; padding-bottom: 15px; }
#borderBottom { width: 968px; height: 15px; background: url(../_images/border.png) 0 -15px no-repeat; margin-bottom: 30px;}
#breedBandContent #productContainer { width: 800px; margin: 0 auto; padding-top: 15px; }
#breedBandContent .product { cursor: pointer; }
#breedBandContent .product img { opacity:0.9; }
#breedBandContent .product:hover img { opacity:1; }
#breedBandContent .product1 { float: left; }
#breedBandContent .product2 { display: block; margin: 0 auto; width: 175px; padding-left: 5px; }
#breedBandContent .product3 { float: right;  }

.product h2, .product .h1 { font-weight: bold; font-size: 19px; color: black; }
.product ul { color: #666666; padding-left: 2px; margin: 0px; }
.product li { list-style: none inside; font-size: 12px; display: block; height: 20px;}
.product li .icon { display: block; float: left; width: 15px; height: 16px; margin-right: 10px; }
.product li .icon.vormgeving { background: url(../_images/icons.png) no-repeat;}
.product li .icon.cms { background: url(../_images/icons.png) no-repeat -1px -22px ;}
.product li .icon.persoonlijk { background: url(../_images/icons.png) no-repeat -1px -40px ;}
.product li .icon.seo { background: url(../_images/icons.png) no-repeat -26px 0px ;}
.product li .icon.analytics { background: url(../_images/icons.png) no-repeat -26px -22px ;}
.product li .icon.tips { background: url(../_images/icons.png) no-repeat -26px -41px ;}


/* pointer */
#pointerContainer { width: 970px; height: 0; margin: 0 auto; }
#pointer1 { position: absolute; top: 0; margin-top: -280px; margin-left: 100px; }
#pointer2 { position: absolute; top: 0; margin-top: -280px; margin-left: 410px; }
#pointer3 { position: absolute; top: 0; margin-top: -280px; margin-left: 730px; }

/* popup */
.popup { display: none; position: absolute; width: 200px; height: 160px; background: url("/_images/bg_popup.png") no-repeat; padding: 40px; z-index: 10; opacity:0; filter: alpha(opacity=0); }
.popup img { width: 60px; float: left; margin: 0 5px 0px 0; }
.popup.popupProduct2 { margin-left: 260px; margin-top: -340px; z-index: 12; }
.popup.popupProduct3 { background: url("/_images/bg_popup2.png") no-repeat; margin-left: 583px; margin-top: -340px; }


#mainContent { padding: 0 85px; }
#content { width:465px; min-height:300px; margin-right:67px; float:left; }
#kolom { width:266px; min-height:300px; float:left; }
#twitter { background: url(../_images/twitter-balloon.png) no-repeat; height: 200px; width: 300px; margin-bottom: 40px; }
#twitter #tweet { padding: 18px 25px 3px; padding-bottom: 12px; height: 56px; }
#twitter #date { margin-left: 20px; color: #999999; font-size: 11px; }
#twitter #date a { color: #999999; text-decoration: none; }
#twitter #date a:hover { text-decoration: underline; }
#twitter #icon { text-align: right; }
#footer { color: white; font-size: 11px; min-height: 100px; max-height: 523px; width:970px; margin:0 auto; background:url(../_images/bg_footer.jpg) no-repeat; border-top:1px solid #B5B5B5; height:34px; -webkit-box-shadow:0 0 10px #616161; -moz-box-shadow:0 0 10px #616161; box-shadow:0 0 10px #616161; }
#footer a { color: white; text-decoration: none; }
#footer #links, #footer #rechts { padding: 10px;}
#footer #links { float: left;}
#footer #rechts { float: right;}

/* formulier */
label { display: block;}
input[type="text"] { background:url(../_images/input-text.png) no-repeat; height: 25px; width: 261px; margin-bottom: 10px; margin-top: 3px; border: none; padding-left: 10px; padding-top: 5px; font-size: 14px; }
input[type="text"]:focus { background-position: 0 -30px; }
input[type="submit"] { background:url(../_images/input-submit.png); height: 55px; width: 250px; margin-bottom: 10px; border: none; font-size: 14px; color: white; margin-top: 20px; cursor: pointer; }

/* checkbox */
.jquery-checkbox img { vertical-align:middle; width:23px; height:24px; padding-right:150px; margin-right:-150px; background:url(../_images/chk_off.png) no-repeat 3px 3px; }
.jquery-checkbox-checked img { background:url(../_images/chk_on.png) no-repeat 3px 3px; }
.jquery-checkbox img:hover { background:url(../_images/chk_off.png) no-repeat 3px 3px; }
.jquery-checkbox-checked img:hover { background:url(../_images/chk_on.png) no-repeat 3px 3px; }
form.formulier label { cursor: pointer; }

/* Algemeen */
.of { margin: 0 40px; }

/* Kruimelpad */
#kruimelpad { color: #999999; position: absolute; top: 156px; margin-left: 258px; }
#kruimelpad a { color: #808080; text-decoration: none; margin: 10px; }
#kruimelpad a:hover { text-decoration: underline; }
#kruimelpad a.active { color: #39B14A; text-decoration: underline; cursor: default; }

/* Samenvatting */
#samenvatting { background: url(/_images/bg_kader.png) no-repeat; width: 434px; height: 97px; float: right; margin-right: 65px; padding: 50px; }
#samenvatting.links { float: none; }
#samenvatting ul { padding-left: 20px; line-height: 20px; }

/* Website met CMS */
#header ul.inlineMenu { margin: 0; list-style: none; padding-left: 40px;}
#header ul.inlineMenu a { color: white; text-decoration: none; }
#header ul.inlineMenu a.active { font-weight: bold;}
#header ul.inlineMenu li { float: left; margin-right: 20px; }
#header img.logo { float: right; margin-top: -25px; }
h1.headline { text-align: center; margin: 25px auto; }
img.links { float: left; }
img.rechts { float: right; }

#submenu { font-family: "Helvetica"; font-weight: bold; font-size: 14px; height: 53px; margin: 0 auto 50px; width: 813px; text-shadow: 0px 1px 0px #aaaaaa; filter: dropshadow(color=#aaaaaa, offx=0, offy=1); }
#submenu a { color: black; display: block; float: left; line-height: 53px; width: 33%; text-align: center; text-decoration: none;  }
#submenu a.twee { border-left: 1px solid #cccccc; border-right: 1px solid #cccccc;  }

#submenu a.een { background: url(/_images/bg_submenu.png) 0 -161px; }
#submenu a.twee { background: url(/_images/bg_submenu.png) -100px -161px;  }
#submenu a.drie { background: url(/_images/bg_submenu.png) -545px -161px; }

#submenu a.een.active { background-position: 0 0; }
#submenu a.twee.active { background-position: -100px 0; }
#submenu a.drie.active { background-position: -545px 0; }

#submenu a.een:hover { background-position: 0 -54px; }
#submenu a.twee:hover { background-position: -100px -54px; }
#submenu a.drie:hover { background-position: -545px -54px; }

#submenu a.een:active { background-position: 0 -107px; }
#submenu a.twee:active { background-position: -100px -107px; }
#submenu a.drie:active { background-position: -545px -107px; }


#vormgevingOpMaat { width: 895px; margin-bottom: 50px; }
#vormgevingOpMaat #afgerondWerk { background: url(/_images/img-afgerond-werk.png) no-repeat; width: 300px; height: 105px; padding: 20px 30px 35px 20px; float: right; margin-left: 20px; }
#vormgevingOpMaat #afgerondWerk .h1 { color: black; font-size: 18px; font-weight: bold; }
#vormgevingOpMaat #afgerondWerk .h2 { font-size: 14px; font-weight: normal; }

#krachtigZosoCms { width: 895px; margin-left: 75px; }
#krachtigZosoCms2 { width: 895px; margin-bottom: 150px; }

#adviesEnBegeleiding { width: 895px; margin-bottom: 150px; margin-left: 75px; }

#doelenStellen { width: 895px; margin-bottom: 50px; }
#seoConversie { width: 895px; margin-bottom: 50px; margin-left: 75px; }

/* Formulier */
a.submitForm { background: url(/_images/input-submit.png) no-repeat -30px -32px; color: white; display: block; font-size: 14px; text-align: center; width: 320px; height: 53px; line-height: 53px; text-decoration: none; }
a.submitForm img { vertical-align: text-top; }
a.submitForm:hover { background-position: -30px -87px; }
a.submitForm:active { background-position: -30px -142px; }
form#informatieAanvraag { display: block; padding: 25px; }
form#informatieAanvraag h1 { font-family: Helvetica; font-weight: normal; font-size: 25px; }
form#informatieAanvraag table { width: 98%; }
form#informatieAanvraag table td { padding-left: 10px; }
form#informatieAanvraag table th { color: #999999; font-family: Arial; font-size: 14px; line-height: 45px; padding-left: 10px; }
form#informatieAanvraag table textarea { background: url(../_images/img-post-it.png) -30px -23px; border: none; color: #A07C4F; width: 279px; height: 161px; padding: 10px 25px 20px; }
.icon.enveloppe { background: url(/_images/icon-enveloppe.png) no-repeat; display: block; float: left; width: 25px; height: 15px; }

form label.error { color: red; font-size: 10px; margin-top: -56px; position: absolute; text-align: right; width: 270px; }


@import "/_css/jquery-ui-1.8.custom.css";