/*------------------------------------------------------------------------
Author: ooms' secrets
------------------------------------------------------------------------*/
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset, legend,input,textarea,p,blockquote,th,td {margin:0;padding:0;vertical-align: baseline}
html {height: 100%;overflow-y: scroll;}

fieldset, img { border: 0}
table {border-collapse: collapse;border-spacing: 0}
ol, ul {list-style: none}
html {background: #fff url(i/topboordzwart.jpg) repeat-x;}
body {min-height:101%;font: 12px/20px Arial,Verdana, Helvetica, sans-serif;line-height:150%;color:#333;margin:0 0 30px 0}
a {outline:none;color:#000}
a:visited {color: #000; outline: none}
a:hover, a:active {text-decoration: none;color: #0094E0}
:focus {outline: 0}
a img {border:none}

/* voor blankwin js script */
a.external{padding-right:12px;background:url(i/ico_external.gif) no-repeat 100% 50%}

/* http://bytesizecss.com/blog/post/the-clear-fix verander #header #navigation #footer naar de namen die u gebruikt */
.clear:after,
#header:after,
#content:after,
#footer:after,
 {
    content: ".";
    clear: both;
    display: block;
    height: 0;
    visibility: hidden;
    }
.clear{clear:both}
ul {list-style:none}
h1 {font-size:38px;margin:0 0 12px;padding:0 0 5px}
h2 {font-size:32px;margin:0 0 8px;padding:0;color: #c00;font-weight:700}
h3 {font-size:24px;margin:0 0 10px;padding:0;}
h4 {font-size:20px;margin:15px 0 5px;padding:0 0 5px}
h5 {font-size:18px;margin:0 0 10px;padding:0}
h6 {font-size:16px;margin:5px 0;padding:0 0 5px}
p {font-size:14px;margin:0 0 12px;line-height:20px}


.b,.bold {font-weight:bold}
.italic {font-style:italic}
.alignleft {float:left}
.alignright {float:right}
.red{color:#c00;font-weight:bold}

/* image met border */
.imgleft {float:left;margin:0 12px 12px 0;padding:3px;border:1px solid #ccc;background:#fff}
.imgright {float:right;margin:0 0 12px 12px;padding:3px;border:1px solid #ccc;background:#fff}
/* image zonder border */
.imgleft_nb {float:left;margin:0 12px 12px 0;padding:3px;background:#fff}
.imgright_nb {float:right;margin:0 0 12px 12px;padding:3px;background:#fff}
/* image zonder border */
.imgleft_nbg {float:left;margin:0 12px 12px 0;padding:3px;background:transparent}
.imgright_nbg {float:right;margin:0 0 12px 12px;padding:3px;background:transparent}
.imgcenter {margin:0 auto}
.line{background-color:#ddd;border-bottom:1px solid #fff;height:1px;margin:0px auto 15px;width:75%}
.tnleft{margin-right:1px;transition: transform 0.5s ease;transform: scale(0.8);-ms-transform: scale(0.8); /* IE 9 */ }
.tnleft:hover{transform: scale(1.0);-ms-transform: scale(1.0); /* IE 9 */ }
.small{font-size:20px;color:#000}
.trans{transition: transform 0.5s ease;transform: scale(0.9);-ms-transform: scale(0.9); /* IE 9 */ }
.trans:hover{transform: scale(1.0);-ms-transform: scale(1.0); /* IE 9 */ }
/* =======================================================================================================
								Layout
 =======================================================================================================*/
#container{margin-top:30px;position:relative}
.ctrand {background: url(i/grid.png) repeat;margin: -35px;padding: 35px}
#header{width:100%;background:transparent}

.logo {width:100%;float:left;height:80px}
.logo a {text-decoration:none;cursor:pointer}
.logo h1 {text-indent: -9999px;}
.lg1 {width:20%;height:75px;float:left}
.lg2{width:75%;margin: 5px;float:right;max-width:425px}

/* logos van leveranciers */
.logos,.logosn {width:240px; height:105px;padding:5px;float:left;margin:5px;text-align:center;border:1px solid #fff;transition: transform 0.5s ease;transform: scale(0.8);-ms-transform: scale(0.8); /* IE 9 */}
.logos:hover{transform: scale(1.0);-ms-transform: scale(1.0); /* IE 9 */ }

h1 {font-size:24px;font-weight:normal;color:#4f4f4f;margin-bottom:20px;line-height:36px}
.rounded{background: #f0f0f0;padding:5px 5px 10px 5px; -webkit-border-radius: 7px; -moz-border-radius: 7px; border: 1px solid #ccc;text-shadow: 0 1px 2px #1A1F13;color:#fff;}
.visit{color:#333;font-weight:bold;text-shadow: 0 1px 2px #1A1F13;}
.taal {height:15px;position:relative;right:1%;top:0}


#datetime{border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding:4px 0 4px 0;margin:10px 0 0 0;color:#898888}
#date{float:left}
#telefoon{text-transform:uppercase;float:right}
#welcome {margin:15px 0 0 0;border:1px solid #ddd/* bruin: #e1870f*/;-moz-box-shadow: 0 0 15px #888;-webkit-box-shadow: 0 0 15px #888;box-shadow: 0 0 15px #888}

/* =======================================================================================================
								HOME
 =======================================================================================================*/

.services {background: #f6f6f6;border:1px solid #E9E9E9;padding:10px}
.services-list {float:left}
.services-list h2 {color:#0F0F0F;font-weight:bold;margin:0 0 15px 0}
.services-list h2 img {margin:0 10px 0 0;vertical-align:middle}

.news_ct {margin:15px 0 0 0;border:1px solid #E9E9E9}
.news {border-right:1px solid #E9E9E9}
.news h2 {color:#0F0F0F;font-weight:bold;border-bottom:1px solid #E9E9E9;padding:5px}

.news-content {padding:20px 20px 20px 20px}
.news-content h3 {font-weight:bold}
/*.news-content a img:hover{cursor: url(i/zoom.png),pointer}
*/
.last{border-right:none;margin-right:0}

.aankondiging{width:99%;margin:0 auto;text-align:center;padding:10px 0 0 0;border:3px solid lime;background:#333}
.aankondiging h3{color:lime!important}
.aankondiging p{color:#fff}
.banner{max-width:1140px;margin:0 auto}
/* =======================================================================================================
								CONTENT  &  SIDEBAR
 =======================================================================================================*/

#content{border:1px solid #E9E9E9;padding:20px 0px 20px 10px;margin:20px 0 0 0}
#content h2 {color:#0F0F0F;font-weight:bold;border-bottom:1px solid #e9e9e9}
#content p {}

.ctleft{text-align: justify;padding: 0 15px 0 0;margin:0;border-right:1px solid #E9E9E9}

.sidebar{padding: 0 0 0 20px;margin:0}


/* =======================================================================================================
								DIVERS
 =======================================================================================================*/
.button {text-decoration: none;-moz-border-radius: 3px;-webkit-border-radius:3px;border-radius:3px;display: block;padding: 4px 6px;margin:0px 4px 4px 0px;font-variant: small-caps;background: #f6f6f6 url(i/highlight.png) repeat-x left top;border:1px solid #bbb;text-shadow: #fff 1px 1px;font-size:8pt;font-weight: bold;color:#000;float:right}
.addthis{width:100%;margin:0;padding:0}
.button-left {text-decoration: none;-moz-border-radius: 3px;-webkit-border-radius:3px;border-radius:3px;display: block;padding: 4px 6px;margin:0px 4px 4px 0px;font-variant: small-caps;background: #f6f6f6 url(i/highlight.png) repeat-x left top;border:1px solid #bbb;text-shadow: #fff 1px 1px;font-size:8pt;font-weight: bold;color:#000;float:left}
.button:hover,.button-left:hover, #top-link:hover{background: #eee url(i/highlight.png) repeat-x left top;border:1px solid #888;color:#666;cursor:pointer}
#top-link{display:none; position:fixed; right:5px; bottom:5px;text-decoration: none;-moz-border-radius: 3px;-webkit-border-radius:3px;border-radius:3px;display: block;float: left;padding: 4px 6px;margin:0px 4px 4px 0px;font-variant: small-caps;background: #f6f6f6 url(i/highlight.png) repeat-x left top;border:1px solid #bbb;text-shadow: #fff 1px 1px;font-size:8pt;font-weight: bold;color:#000;float:right}
.cufon {font-size:18px;margin:0;padding:0}

/* responsive img */
img {max-width: 100%}
figure {float: left;width:100%}
figcaption {padding: 0; border: 0;font-size: 7px;color:#0F67A1 }
/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 767px) {

	.ctleft, .sidebar {padding-bottom:20px;border:none}
	.logo{margin-bottom:20px}

}
/* =======================================================================================================
								FOOTER
/* =======================================================================================================*/
#footer {height:90px;margin:0 auto;padding:10px 0 10px 0;font-size:12px;color:#333;margin:14px 0 0 0;background: url(i/footer_shadow.jpg) bottom center no-repeat}
.copyright {float:right;text-align:right;font-size:12px}
.facebook{float:left}
.newsletter {float:left}
.newsletter input.txtnewsletter {background: #F6F6F6;border:1px solid #ddd;padding:3px;vertical-align:top;width:290px}
.copyright a:link, .copyright a:visited {text-decoration:none;color:#333}
.copyright a:hover{text-decoration:underline;color:#333}

/* =======================================================================================================
								SLIDER index
/* =======================================================================================================*/
.slider {margin-top:20px; }
/* ======================================================================================================= */


.hidden{display:none;}

.inline{padding:2px;border:2px solid #f2f2f2; -moz-border-radius: 2px; /* FF1+ */
  -webkit-border-radius: 2px; /* Saf3-4, iOS 1+, Android 1.5+ */
          border-radius: 2px; /* Opera 10.5, IE9, Saf5, Chrome */}	
a.inline{text-decoration:none}		  
/*=======================================================================================================================
											HORIZONTAL NAVMENU & responsive select menu
 ===================================================================================================================== */
/*** ESSENTIAL STYLES ***/
#menu{width:100%;position:relative;z-index:20;height:45px;background:#333;-moz-box-shadow: 0 0 5px #888;-webkit-box-shadow: 0 0 5px#888;box-shadow: 0 0 5px #888}
/* MENU */
#nav {width:1140px;margin:0 auto;padding: 0;font-size:14px;z-index:21;}
#nav li a, #nav li {float: left;font-family:arial;font-variant: small-caps;text-shadow: 2px 2px 2px #000}
#nav li {list-style: none;position: relative}
#nav li a {padding: 0.7em 1.2em;text-decoration: none;color: #eee;}
#nav li.first{border-left:1px solid #3c3c3c}
#nav li a:hover, #nav  li a.current  {background: #e1870f;color:#333;text-shadow: 2px 1px 1px #999}

/* Submenu */
#nav li ul {display: none;position: absolute;left: 0;top: 100%;padding: 0; margin: 0}
#nav li:hover > ul {display: block}
#nav li ul li, #nav li ul li a {float: none;text-align:left;background:#333;text-shadow: 2px 2px 2px #000}
#nav li ul li {_display: inline; /* for IE6 */}
#nav li ul li a {width: 150px;display: block}

.dwnarr:after{content: "\25BC";font-size:14px;position:absolute;right:3px;top:12px;color:#ccc}
.email:before{content: "\2709";font-size:24px;position:absolute;left:3px;top:10px;color:#ccc}

/*achtergrond voor de sticky navigatie */
.is-sticky{background: #333 url(i/logo42x42.png) no-repeat top right!important;z-index:999;height:39px;width:100%;left:0}	

/* =======================================================
      responsive select nav
========================================================= */
nav select {display: none}
nav select {background:#111; color:#f9f9f9;width: 305px;padding: 5px;font: 16px verdana;border: 1px solid #999;height: 30px;margin:5px 0 0 10px;cursor:pointer}
nav select optgroup,nav select option{border-bottom:1px dashed #333}
nav select optgroup option{border-bottom:none}

@media handheld, only screen and (max-width: 940px){nav ul{display: none}nav select { display: inline-block}}

/* =======================================================================================
								shadowbox
========================================================================================== */
/* http://shadowbox-js.com/index.html */
#sb-title-inner,#sb-info-inner,#sb-loading-inner,div.sb-message{font-family:verdana,Arial,sans-serif;font-weight:200;color:#fff}
#sb-container{position:fixed;margin:0;padding:0;top:0;left:0;z-index:99;text-align:left;visibility:hidden;display:none;}
#sb-overlay{position:relative;height:100%;width:100%}
#sb-wrapper{position:absolute;visibility:hidden;width:100px;}
#sb-wrapper-inner{position:relative;border:10px solid #fff;padding:1px;overflow:hidden;}
#sb-body{position:relative;height:100%;}
#sb-body-inner{position:absolute;height:100%;width:100%;}
#sb-player.html{height:80%;overflow:auto;}
#sb-body img{border:none}
#sb-loading{position:relative;height:100%;}
#sb-loading-inner{position:absolute;font-size:14px;line-height:25px;height:25px;top:50%;margin-top:-12px;width:100%;text-align:center;}
#sb-loading-inner span{background:url(i/loading2.gif) no-repeat;padding-left:0px;display:inline-block;}
#sb-body,#sb-loading{background-color:#fff;}
#sb-title,#sb-info{position:relative;margin:0;padding:0}
#sb-title,#sb-title-inner{height:29px;line-height:29px;}
#sb-title-inner{font-size:10px;}
#sb-info,#sb-info-inner{height:20px;line-height:20px;}
#sb-info-inner{font-size:11px;}
#sb-nav{float:right;height:29px;padding:2px 0;width:45%}
#sb-nav a{display:block;float:right;height:16px;width:16px;margin-left:3px;cursor:pointer;background-repeat:no-repeat;}
#sb-nav-close{background: url(i/close2.png) no-repeat;position: absolute; top: 20px; right: -15px; width:30px; height:30px;z-index:120;cursor:pointer}
#sb-nav-close:hover{background: url(i/close2.png)}
#sb-nav-next{background-image: url(i/nextx.png);}
#sb-nav-previous{background-image: url(i/previousx.png);}
#sb-nav-play{background-image: url(i/play.png);}
#sb-nav-pause{background-image: url(i/pause.png);}

#sb-nav-previousBox{position:absolute;height:100%;top:0; left:0;width:50%;background: none;display:block}
#sb-nav-previousBox:hover{background:url(i/left.png) no-repeat center left;  cursor:pointer}
#sb-nav-nextBox{position:absolute;height:100%;top:0;width:50%; left:50%; background:none;display:block}
#sb-nav-nextBox:hover{background:url(i/right.png) no-repeat center right; cursor:pointer} 
.sb-nav-ie{background: url(i/blank.gif) repeat scroll left top transparent;height: 100%;left: 0;margin: 0;position: absolute;top: 0;width: 100%;z-index: 5001}
 
#sb-counter{float:left;width:45%;}
#sb-counter a{padding:0 4px 0 0;text-decoration:none;cursor:pointer;color:#fff;}
#sb-counter a.sb-counter-current{text-decoration:underline;}
div.sb-message{font-size:12px;padding:10px;text-align:center;}
div.sb-message a:link,div.sb-message a:visited{color:#fff;text-decoration:underline;}									
 
/* =======================================================================================
								contactform
========================================================================================== */
#contact{width:90%}
#contact-area {width: 100%;font-family: Verdana; font-size: 12px; padding: 0; text-shadow: #999 1px 2px 3px}
.ctform {width:100%}
table.ctform, table.ctform tr, table.ctform td{border-color:#ccc;}
td,th{border:1px dotted #03476F;color:#363636;padding:.7em;vertical-align:top;text-align:left}
.ctform input{width:100%}
table.ctform input,table.ctform textarea {border:1px solid #ccc;width:100%;height:20px;width:100%}
table.ctform textarea {border:1px solid #ccc;width:100%;height:auto}
table.ctform input:hover,table.ctform input:focus,table.ctform textarea:hover,table.ctform textarea:focus {border:1px solid #363636}
.verplicht{margin:0 auto;width:80%;background:#ffca14 url(i/icon-dialog-error.png) no-repeat left center;color:#000;padding:5px;border:3px solid #c00;text-align:center}
.buttonCT,.buttonCT2{text-decoration: none;-moz-border-radius: 3px;-webkit-border-radius:3px;border-radius:3px;display: block;padding: 2px;margin:0px 4px 4px 0px;font-variant: small-caps;background: #f6f6f6; border:1px solid #bbb;text-shadow: #fff 1px 1px;font-size:8pt;font-weight: bold;color:#000;width:100px!important;float:left;}
.buttonCT2{float:right}
.buttonCT:hover,.buttonCT2:hover{background: #eee;border:1px solid #888 !important;color:#666;cursor:pointer;width:100px}
#verb {display: none;}