html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, strong, sub, sup, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, input, table, caption, tbody, tfoot, thead, tr, th, td { background: transparent; border: 0; font-family: inherit; font-style: inherit; font-style: normal; font-weight: inherit; line-height: 1; margin: 0; outline: 0; padding: 0; text-align: left; vertical-align: baseline; word-wrap: normal;}
html { overflow-y: scroll;}
body { background: #fff; text-rendering: optimizeLegibility; -ms-text-size-adjust: none; -webkit-text-size-adjust: none; word-wrap: break-word;}
body, button, datalist, input, select, textarea { -webkit-font-smoothing: antialiased;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block;}
table { border-collapse: separate; border-spacing: 0; table-layout: fixed; width: 100%;}
caption, th, td { font-weight: normal; text-align: left;}
blockquote:before, blockquote:after, q:before, q:after { content: "";}
blockquote, q { quotes: "" "";}
em, i { font-style: italic;}
img, video, object { max-width: 100%;}
img, video { height: auto;}
img { -ms-interpolation-mode: bicubic;} /* IE6-7 */
ol, ul { list-style-position: outside; list-style-type: decimal; padding-left: 2em;}
ul { list-style-type: disc;}
ol li, ul li { margin-left: 0; padding-left: 0;}
legend { white-space: normal;} /* IE6-7 */
textarea { margin: 0; overflow: auto; -moz-resize: vertical; resize: vertical;}
button, datalist, input, select, textarea { background: transparent; border: none; font-size: 1em; padding: 0;}
button, input[type=submit], input[type=checkbox], input[type=radio], label, a { cursor: pointer;}
:focus { outline: 0;}
.accessibility { left: -9999em !important; position: absolute; top: -9999em !important;}
strong { font-weight: bold;}
html { height: 100%; overflow-y: scroll; }
.list { list-style:disc; padding-left: 0; margin:20px 0;}
.list li { margin:0 0 10px 30px; line-height: 20px; font-size:1.2em;}
.group:after { clear: both; content: " "; display: block; font-size: 0; height: 0; visibility: hidden;}
.ie7 .group { overflow: hidden; width: 100%;}


@font-face {
    font-family: 'MyriadProRegular';
    src: url('fonts/myriadpro-regular.eot');
    src: url('fonts/myriadpro-regular.eot') format('embedded-opentype'),
         url('fonts/myriadpro-regular.woff') format('woff'),
         url('fonts/myriadpro-regular.ttf') format('truetype'),
         url('fonts/myriadpro-regular.svg#MyriadProRegular') format('svg');
}



/****

	PAGE STYLING
	
*************/
body { font-family:Arial; font-size:62.5%; font-weight:400; font-style:normal; min-width: 1024px;}	
		
		
		
.browser { padding:20px; background:#004b80; display: none;}	
html.lt-ie8 .browser { display: block;}	
.browser p { color:#FFF; text-align: center; font-size:13px;}
.browser p a { color:#FFF;}
		
		
#wrapper { border-top:2px solid;}
#container { width:1024px; margin:0 auto;}
#header { position: relative; z-index:10; padding:30px 32px 0; background:url('/cst/images/keurmerken.jpg') no-repeat 772px 45px;}
#header.content_header { margin:0 0 50px;}
#header .logo img { margin:0 0 34px;}
#nav { background:#FFF; overflow: hidden; margin:0 0 5px;}
#nav > ul { display: block; list-style: none; padding:0;}
#nav > ul > li { border-right:1px solid; display: block; float: left;}
#nav > ul > li > a { font-family: "adelle-sans",sans-serif; letter-spacing: 0.2px; display: block; padding:22px 20px 17px; font-size:16px; text-decoration: none;}
#nav > ul > li:last-child, #nav > ul > li.last { border:0;}
#nav > ul > li > ul { display: none;}
#nav > ul > li:hover > ul { position: absolute; display: block; list-style: none; padding:10px 0 20px; width:200px; z-index:500;}
#nav > ul > li > ul > li { position: relative; display: block; padding:0 20px;}
#nav > ul > li > ul > li > a { padding:10px 0; font-size:12px; border-bottom:1px solid; display: block; font-family: Verdana; text-decoration: none;}
#nav > ul > li > ul > li:last-child a, #nav > ul > li > ul > li.last a { padding-bottom:0; border:0;}
#nav > ul > li.first > a { background:url('/cst/images/home.png') no-repeat 0 0; width: 78px; height: 55px; text-indent:-99999px; display: block; -moz-transition:ease-in-out 0.3s all; -webkit-transition:ease-in-out 0.3s all; transition:ease-in-out 0.3s all; padding:0;}
#nav > ul > li.first > a:hover {background:url('/cst/images/home.png') no-repeat 0 -55px;}
body.home #nav > ul > li.first > a { background-color:#F9F9F9;}



body.over #nav > ul > li.over_btn > a { background:#005ea2; color:#FFF;}
.box { box-shadow: 0 0 10px #444; -moz-box-shadow:0 0 10px #444; -webkit-box-shadow:0 0 10px #444;}
#subnav { overflow: hidden;}
#subnav > ul { display: block; list-style: none; padding:10px 20px 9px; float: left;}
#subnav > ul > li { font-size:13px; display: block; float: left; border-right:1px solid; margin:0 12px 0 0; padding:0 12px 0 0;}
#subnav > ul > li > a { font-size:12px; font-family: Verdana; text-decoration: none;}
#subnav > ul > li:last-child, #subnav > ul > li.last { padding:0; margin:0; border:0;}
#subnav > a { float: right; text-indent:-99999px; height:33px; display: block; width:56px; background:url('/cst/images/arrows.png') no-repeat;}
.advertise { margin:-66px 0 75px; height: 433px; position: relative; background-repeat: no-repeat; background-position: top left;}
.advertise article { position: absolute; bottom:20px; background:url('/cst/images/bg-advertise.png') repeat-y left; width:490px; padding:20px 78px 10px 52px; overflow: hidden;}
.advertise article h1 { font-size:40px; color:#FFF; line-height: 48px;}
.advertise article p { font-size:17px; line-height: 28px; color:#FFF; margin:0 0 20px;}
.advertise article p a { padding:6px 45px 7px 12px; border-left:1px solid; font-size:14px; color:#FFF; text-decoration: none; position: relative;}
.advertise article p a:after { z-index:10; content:'>'; width: 32px; height: 23px; position: absolute; top:0; right:0; color:#FFF; text-align: center; padding-top:9px; padding-left:2px; display: block;}
.bx-wrapper { margin:-66px 0 50px; height: 433px; position: relative; z-index:0;}
.slide { width: 1024px; height: 433px; position: absolute; display: none;}
.slide img { display: block; max-width: 100%; height: auto; width: auto; box-shadow: #000 0em 0em 0em;}
#visual { width: 1024px; height: 433px; overflow: hidden; position: relative; margin:-113px 0 75px;}
#visual .slide { display: block;}
.slide article { position: absolute; bottom:20px; background:url('/cst/images/bg-advertise.png') repeat-y left; width:490px; padding:20px 78px 10px 52px; overflow: hidden;}
.slide article > a { text-decoration: none;}
.slide article > a:hover h1 { color:#FFD707;}
.slide article h1 { font-size:40px; color:#FFF; line-height: 48px; -moz-transition:ease-in-out 0.3s all; -webkit-transition:ease-in-out 0.3s all; transition:ease-in-out 0.3s all;}
.slide article p { font-size:17px; line-height: 28px; color:#FFF; margin:0 0 20px; text-shadow: 0 0 4px #000;}
.slide article p a { padding:6px 45px 7px 12px; border-left:1px solid; font-size:14px; color:#FFF; text-decoration: none; position: relative;}
.slide article p a:after { z-index:10; content:'>'; width: 32px; height: 23px; position: absolute; top:0; right:0; color:#FFF; text-align: center; padding-top:9px; padding-left:2px; display: block;}
.bx-controls-direction { display: none;}
#slider { height: 433px; overflow: hidden; position: relative;}
.bx-wrapper { position: relative;}
body.home .bx-wrapper { margin-bottom:75px;}
.bx-controls { margin:0;}
.bx-pager { position: absolute; z-index:60; right:24px; bottom:13px;}
.bx-pager-item { display: block; float: left; margin:0;}
.bx-pager-item a { cursor: pointer; width:37px; height: 37px; background:url('/cst/images/bullets.png') no-repeat top; display: block; text-indent:-9999px;}
.bx-pager-item a:hover, .bx-pager-item a.active { background-position: bottom;}
.bx-controls-direction { position: absolute; top:0; left:0; right:0;}

.content-holder { overflow: hidden; padding:0 32px; margin:0 0 84px; width:960px;}
.content {}
.content.home-content { float: left; width: 430px; padding:0 40px 0 0;}



h1, h2, h3, h4, h5, h6  { font-family:"MyriadProRegular", sans-serif;}




.content h1 { font-size:30px; line-height: 37px; margin:0 0 5px;}
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 { color:#0068B4; font-size:20px; line-height: 27px; margin:0 0 5px;}
.content p { font-size:14px; line-height: 28px; margin:0 0 20px;}
.content p img {}
.content table {}
.content table tr th {}
.content table tr td {}
.content table a {}
.content table a:hover {}
.content ul, .content ol { margin:0 0 20px;}
.content ul li, .content ol li { color:#2f332d; line-height: 28px; font-size:15px;}
.content ul li a, .content ol li a, .content dl a { color:#2f332d; text-decoration: underline;}
.content ul li a:hover, .content ol li a:hover, .content dl a:hover { color:#005EA2;}
.content dl {}
.content dl dd {}
.content dl dt {}
.content > *:last-child { margin:0;}
.home-content.content p a { text-decoration: none; font-weight: bold;}
.home-content.content p a:hover { text-decoration: underline;}

.success { background:#daffd0; border:1px solid #00bf11; margin:0 0 50px; padding:20px;}
.success p { font-size:14px;}

.bullets { width:470px; float: right;}
.bullet-item { float: left; width:225px; position: relative; margin:0; height: 270px; overflow: hidden;}
.bullet-item.last { margin:0; float: right;}
.bullet-item h3 { position: absolute; bottom:0; font-size:19px; line-height: 23px; background:url('/cst/images/bg-advertise.png') repeat-y left; padding:20px 25px;}
.bullet-item h3 strong { font-weight: normal;}
.bullet-item div { width:420px;}

#footer { background:url('/cst/images/bg-footer-top.png') repeat-x top;}
.footer-content.gray { margin:0 0 35px; padding:66px 0;}
.clear { clear: both;}
.footer-content div { width:960px; margin:0 auto; position: relative; }
.footer-content div h3 { position: absolute;  font-size:30px; line-height: normal; padding:18px 20px 10px; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; top:-105px; left:-20px;}
#footer dl { float: left; width:225px; margin:0 20px 0 0; font-family: "myriad-pro",sans-serif; }
#footer dl.last, #footer dl:last-child { margin:0;}
#footer dl dt { font-size:16px; padding:0 30px 8px 0; line-height: 22px; font-weight: bold; letter-spacing: 0.2px;}
#footer dl dd { font-size:13px; padding:0 0 8px; color:#4a4a4a; line-height: 24px; font-family: Arial;}
#footer dl a { text-decoration: none; font-weight: bold;}
#footer dl a:hover { text-decoration: underline;}
.footer-content-small { width:960px; margin:0 auto;  font-family: "myriad-pro",sans-serif; text-transform: lowercase; padding:0 0 35px; overflow: hidden;}
#footer ul { float: left; display: block; list-style: none; padding:0;}
#footer ul li { display: block; float: left; margin:0 25px 0 0; font-size:12px; text-transform: none; font-family: Arial;}
#footer ul li a { text-decoration: none;}
#footer ul li a:hover { text-decoration: underline;}
#footer p { float: right; margin:0; line-height: normal; font-size:12px;}
#footer p a { text-decoration: none;}
#footer p a:hover { text-decoration: underline;}

.split_content { float: right; width: 715px; padding:15px 0 0;}
.contact_content { width: 470px; float: left;}

#sidebar { float: left; width: 200px; padding:9px 0 0;}
#sidebar > ul { display: block; list-style: none; padding:0; border-top:1px solid #DDD;}
#sidebar > ul > li { display: block; border-bottom:1px solid #DDD; font-family: Arial;}
#sidebar > ul > li > a { display: block; padding:15px; font-size:15px; text-decoration: none; color:#333; line-height: 20px;}
#sidebar > ul > li > a:hover, body.diensten.b_buitenschilderwerk #sidebar .buitenschilderwerk_btn a, body.diensten.b_binnenschilderwerk #sidebar .binnenschilderwerk_btn a, body.diensten.b_houtrotreparaties #sidebar .houtrotreparaties_btn a,
body.diensten.b_wandvloerafwerking #sidebar .wandvloerafwerking_btn a { background:#F9F9F9;}
body.diensten.b_buitenschilderwerk #sidebar .buitenschilderwerk_btn a, body.diensten.b_binnenschilderwerk #sidebar .binnenschilderwerk_btn a, body.diensten.b_houtrotreparaties #sidebar .houtrotreparaties_btn a,
body.diensten.b_wandvloerafwerking #sidebar .wandvloerafwerking_btn a { font-weight: bold;}

p { font-family: Arial;}
p a { color:#0068B4; text-decoration: none; text-decoration: underline;}



form { width: 470px; float: right;}
form fieldset { padding:30px; background:#F9F9F9;}
form h2 { font-size:20px; line-height: 27px; margin:0 0 15px; padding:0 0 5px; border-bottom:1px solid #DDD;}
form p { margin:0 0 8px;}
form label { font-size:13px; display: none; margin:0 0 8px;}
html.ie9 form label, html.lt-ie9 form label { display: block;}
form input[type="text"],
form textarea { padding:15px; border:1px solid #E9E9E9; background:#FFF; width: 378px; font-size:13px; font-family: Arial; -moz-transition:ease-in-out 0.3s all; -webkit-transition:ease-in-out 0.3s all; transition:ease-in-out 0.3s all;}
form textarea { height: 125px;}
form input[type="text"]:focus,
form textarea:focus { box-shadow: 0 0 2px #CCC; -webkit-box-shadow: 0 0 2px #CCC; -moz-box-shadow:0 0 2px #CCC;}
form input[type="submit"] { padding:10px 15px; font-size:15px; font-weight: bold; background:#AAA; color:#FFF; -moz-transition:ease-in-out 0.3s all; -webkit-transition:ease-in-out 0.3s all; transition:ease-in-out 0.3s all;}
form input[type="submit"]:hover { background:#0068B4;}
form p strong { font-weight: normal; font-style: italic; font-size:11px; color:#999; padding:0 0 0 15px; }
form .error { color:red !important;}
label.error { display: none !important;}

/****

	BACKGROUND-COLORS ETC.
	
*************/
body { color:#000;}
#wrapper { border-color:#0068b4;}
#nav > ul > li { border-color:#d6d6d6;}
#nav > ul > li > a { color:#555;}
#nav > ul > li > a:hover, #nav > ul > li:hover > a { background:#005ea2; color:#FFF;}

body.over #nav > ul > li.over_btn > a,
body.diensten #nav > ul > li.diensten_btn > a,
body.referenties #nav > ul > li.referentie_btn > a,
body.opdrachtgevers #nav > ul > li.opdrachtgevers_btn > a,
body.contact #nav > ul > li.contact_btn > a { background:#005ea2; color:#FFF;}

#nav > ul > li.first > a:hover { background-color:transparent;}
#nav > ul > li:hover > ul { background:#005ea2;}
#nav > ul > li > ul > li > a { color:#FEFEFE;}
#nav > ul > li > ul > li > a { border-color:#005491;}
#nav > ul > li > ul > li > a:hover { color:#7bccff;}
#subnav { background:#0068b4;}
#subnav > ul > li { border-color:#005491;}
#subnav > ul > li, #subnav > ul > li > a { color:#FFF;}
#subnav > a { background-color:#005ea2;}
#subnav > a:hover { background-color:#005999;}
.advertise article p a, .slide article p a { background-color:#0068b4; border-color:#005ea2;}
.advertise article p a:hover, .slide p a:hover { background-color:#005999;}
.advertise article p a:after, .slide article p a:after { background:#005999;}
.advertise article p a:hover:after, .slide article p a:hover:after { background-color:#0068b4;}
.bullet-item h3 { color:#FFF;}
.content h1, .content h2, .content h3, .content h4, .content h5, .content p { color:#2f332d;}
.content h1 { color:#0068B4;}
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 { color:#005089;}
.footer-content.gray { background:#ebebeb;}
.footer-content div h3 { color:#b2b2b2; background:#FFF;}
#subnav > ul > li > a:hover, .bullet-item h3 strong { color:#ffd707;}
#footer dl dt, #footer dl a { color:#0068b4;}
#footer dl dt strong { color:#0079b5;}
#footer ul li a,
#footer p,
#footer p a { color:#4a4a4a;}
.home-content.content p { font-size:16px;}
.home-content.content p a { color:#0068B4;}




#pull { display: none;}

html.lt-ie9 .footer-content div {
	
	width: 980px;
	padding-left:20px;
	
	
}

html.lt-ie9 div h3 {
	
	left:0px;
	
}

html.lt-ie8 .slide { 
	
	width:433px;
	
}

@media screen and (max-width:800px) {
	
	body { min-width: 320px;}
	#container { width: inherit;}
	#header { padding:20px 20px 0; background:none;}
	#header .logo img { display: block; margin:0 auto 34px; width: 100%; max-width: 283px;}
	#pull { display: block; font-family: "adelle-sans",sans-serif; font-size: 16px; letter-spacing: 0.2px; padding: 20px 20px 19px 40px; color:#555; font-weight: 700; text-decoration: none; border-bottom:1px solid #D6D6D6; position: relative; background:#F9F9F9;}
	#pull:before { content:'+'; font-weight: 700; font-size:23px; position: absolute; left:20px; top:16px;}
	#pull.active:before { content:'-';}
	#pull.active { background-color:#F1F1F1;}
	#nav {}
	#nav > ul { display: none;}
	#nav > ul > li { display: block; float: none; border-right:0; border-bottom:1px solid #D6D6D6;}
	#nav > ul > li.first > a { width: inherit; height: inherit; text-indent:0; background-image:none; padding:20px 20px 19px; -moz-transition:none; transition:none; -webkit-transition:none;}
	#nav > ul > li > ul, #nav > ul > li:hover > ul { background:none; display: block; position: relative; width: inherit; padding:0 0 28px 20px;}
	#nav > ul > li > ul > li { border:0;}
	#nav > ul > li > ul > li > a { font-size:14px; color:#555; border:0;}
	#nav > ul > li > ul > li > a:hover { color:#555; text-decoration: underline;}
	body.over #nav > ul > li.over_btn > a,
	body.diensten #nav > ul > li.diensten_btn > a,
	body.referenties #nav > ul > li.referentie_btn > a,
	body.opdrachtgevers #nav > ul > li.opdrachtgevers_btn > a,
	body.contact #nav > ul > li.contact_btn > a,
	#nav > ul > li.first > a:hover, 
	#nav > ul > li > a:hover,
	body.home #nav > ul > li.first > a,
	#nav > ul > li:hover > a { background:#FFF; color:#005ea2;}
	body.over #nav > ul > li.over_btn > a,
	body.diensten #nav > ul > li.diensten_btn > a,
	body.referenties #nav > ul > li.referentie_btn > a,
	body.opdrachtgevers #nav > ul > li.opdrachtgevers_btn > a,
	body.contact #nav > ul > li.contact_btn > a,
	body.home #nav > ul > li.first > a { font-weight: 500;}
	#subnav { display: none;}
	.bx-wrapper { margin-top:-32px;}
	.slide article h1, .slide article p { text-align: center;}
	.slide article h1 { font-size:30px; margin:0 0 5px;}
	.slide article p { font-size:13px; line-height: 20px;}
	.bx-controls { width: 100%;}
	.bx-pager { width: 100%; right:0; display: inline-block; text-align: center; bottom:-18px;}
	.bx-pager-item { margin:0; float: none; display: inline-block;}
	.bx-wrapper, #slider, .slide { text-align: center; height:260px;}
	.slide img { min-width: 1024px; min-height: 433px;}
	.slide article { width: auto; padding:20px 35px; bottom:0;}	
	.content-holder { width: inherit; padding:0 20px; margin:0 0 60px;}
	.content.home-content { width: inherit; float: none; padding:0; margin:0 0 30px;}
	.content h1 { font-size:22px; line-height: 27px;}
	.content p, .home-content.content p { font-size:14px; line-height: 22px;}
	.bullets { float: none; width: inherit; border-top:1px solid #DDD;}
	.bullet-item, .bullet-item.last { float: none; width: auto; height: auto; border-bottom:1px solid #DDD;}
	.bullet-item div { width: inherit; overflow: hidden;}
	.bullet-item a { text-decoration: none;}
	.bullet-item div img { display: none;}
	.bullet-item div h3 { background:none; color:#555; position: relative; padding:20px 0; font-size:17px;}
	.bullet-item div h3 strong { color:#555; font-weight: 700;}
	#footer { width: inherit; padding:20px; background:#F9F9F9;}
	.footer-content div, .footer-content-small { width: inherit;}
	#footer dl { width: inherit; margin:0 0 20px; float: none;}
	#footer dl dt { font-size:20px;}
	.footer-content-small { display: none;}
	.footer-content.gray { padding:0; margin:0;}
	.footer-content div h3 { position: relative; top:0; left:0; background:none; padding:0 0 10px; margin:0 0 20px; border-bottom:1px solid #CCC; color:#CCC; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0;}
	#footer dl:last-child { margin:0;}
	.footer-content.gray { background:none;}

	.split_content { width: inherit; float: none; padding:0 0 30px;}
	#sidebar { width: inherit; float:none; padding:0;}
	.contact_content { float: none; width: inherit;}
	#contactform  { display: none;}
}


@media screen and (max-width:400px) {
	
	.bx-wrapper, #slider, .slide { text-align: center; height:400px;}
	.slide article { width: auto; padding:20px 35px; bottom:0;}	
	
}