/* ################################################## */
/*  Made by: www.DIRECT BASING.com                    */
/*  Semantisch correcte xHTML Basing                  */
/* ################################################## */

/* ### GENERAL ### */
* { margin: 0px; padding: 0px; }
html, body { height: 100%; font-family: Verdana; font-size: 12px; color: #5c5c5c; }
input, select, textarea { font-family: Verdana; font-size: 12px; color: #5c5c5c; }
body { background: #fff url('../images/body-bg.gif') top left repeat-x; }
img { border: 0px; }

/* ### GLOBAL CLASSES ### */
.clear { clear: both; }

/* ### WRAPPER ### */
#wrapper { position: relative; display: block; width: 100%; min-height: 100%; }

/* ### MAIN CONTAINER ### */
#mainCntr { padding-bottom: 409px; margin: 0 auto; width: 1003px; }

	/* ### HEADER CONTAINER ### */
	#headerCntr { position: relative; width: 1003px; height: 202px; overflow: hidden; background: url('../images/header-bg.jpg') top right no-repeat; }
	#headerCntr h1 { padding-top: 8px; float: left; }
	#headerCntr h1 a { position: absolute; display: block; width: 315px; height: 149px; text-indent: -9999px; background: url('../images/logo.png') no-repeat; }
	#headerCntr a.sticker { margin-right: 0px; margin-top: 3px; display: block; float: right; text-indent: -10000px; height: 135px; width: 138px; background: url('../images/vanaf.png') top left no-repeat; }
	
		/* ### MENU CONTAINER ### */
		#menuCntr { padding-top: 11px; width: 620px; float: right; overflow: hidden; font-weight:bold; }
		#menuCntr ul { overflow: hidden; list-style: none; }
		#menuCntr li { padding-left: 10px; float: left; display: inline; color: #636569; font-size: 13px; }
		#menuCntr li a { padding-top: 18px; display: block; text-decoration: none; color: #636569; }
		#menuCntr li a:hover { color: #2d9cc7; background: url('../images/links-arrow.png') top center no-repeat; }
		#menuCntr li a.active { color: #2d9cc7; background: url('../images/links-arrow.png') top center no-repeat; float: left; }
	
	/* ### CONTENT CONTAINER ### */
	#contentCntr { overflow: hidden; width: 950px; }
			#contentCntr h2 { padding-bottom: 15px; font-size: 16px; color:#636569; }
			#contentCntr p { padding-top: 20px; color: #636569; }
	
		/* ### LEFT CONTAINER ### */
		#leftCntr { float: left; width: 495px; background: url('../images/seperator.gif') top right repeat-y; }
		
			/* ### TEXT BOX ### */
			.textBox { padding-right: 5px; padding-bottom: 0px; }
					
		/* ### RIGHT CONTAINER ### */
		#rightCntr { float: right; width: 350px; }
		
			/* ### RECENT BOX ### */
			.recentBox { width: 350px; }
			#rightCntr .recentBox h2 { padding-bottom: 35px; font-size: 16px; color:#636569; }
	
	/* ### FOOTER CONTAINER ### */
	#footerCntr { padding-top: 25px; position: absolute; bottom: 0px; left: 0px; width: 100%; overflow: hidden; height: 359px; background: #000 url('../images/footer-bg.gif') bottom left repeat; }
		
		#footerCntr a:hover {text-decoration:underline; }
	
		/* ### CENTER ### */
		#center { margin-top: 40px; margin: auto; overflow: hidden; width: 1003px; height: 359px; background: url('../images/footer-img.gif') bottom left no-repeat; }
			
			/* ### BEDRIJFS BOX ### */
			.bedrijfsBox { overflow: hidden; }
			.bedrijfsBox h2 { padding-bottom: 18px; font-size: 16px; color: #fff; }
			.bedrijfsBox address { padding-bottom: 20px; color:#fff; font-style: normal; }
			.bedrijfsBox address a { color:#fff; font-style: normal; text-decoration:none; }
			.bedrijfsBox address a:hover { color:#fff; font-style: normal; text-decoration:underline; }
			
			/* ### MENU BOX ### */
			.menuBox { color: #dddddd; }
			.menuBox ul { padding-top: 45px; list-style: none; }
			.menuBox li { padding: 0px 3px 0px 0px; float: left; color: #dddddd; font-size: 10px; }
			.menuBox li a { padding-left: 5px; color: #dddddd; text-decoration: none; background: url('../images/footer-seperator.gif') left 2px  no-repeat; }
			.menuBox span { color: #ddd; font-size: 10px; display: block; }
			
			/* ### MAIL BOX ### */
			.mailBox { padding-right: 65px; width: 331px; float: right; }
			.mailBox h2 { padding-bottom: 18px; font-size: 16px; color: #fff; }
			.mailBox p { padding-bottom: 11px; color: #fff; }
			.mailBox form { display: block; }
			.mailBox fieldset { border: none; overflow: hidden; }
			.mailBox input.textfield { padding: 2px; margin-bottom: 10px; font-size: 10px; color: #dddddd; font-style: italic; float: left; margin-right: 12px; width: 124px; border: 1px solid #dddddd;  background: none; }
			.mailBox textarea { padding: 2px; margin-bottom: 10px; font-style: italic; width: 265px; height: 58px; border: 1px solid #dddddd; color: #ddd; font-size: 10px; background: none; }
			.mailBox fieldset p { padding: 4px; width: 265px; font-size: 10px; color: #ddd; font-style: italic; border: 1px solid #ddd; display: block; }
			.mailBox input.checkbox { float: left; }
			.mailBox input.verzend-button { padding: 2px; margin-top: 10px; font-size: 10px; color: #dddddd; font-style: italic; text-align: left; margin-right: 12px; width: 124px; border: 1px solid #dddddd;  background: none; }
			
	.portfolio_cntr { float:left; }
	
		a.portfolio_link img { display:block; }
		
		a.portfolio_link  { color:#3ba3cb; text-decoration:none; display:block; float:left; margin-bottom: 20px; opacity:1,0; overflow:visible; width:250px; }
		a.portfolio_link:hover { color:#3ba3cb; }
	
/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 350px;
    height: 350px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}

.hightlight { padding: 2px; margin-bottom: 10px; font-size: 10px; color: #dddddd; font-style: italic; float: left; margin-right: 12px; width: 124px; border: 1px solid #F00; background: none; }

.highlighttext { padding: 2px; margin-bottom: 10px; font-style: italic; width: 265px; height: 58px; border: 1px solid #F00; color: #ddd; font-size: 10px; background: none; }

.loading { background: url(../images/loading2.gif) no-repeat; }

.formCntr { position: relative; }

.form { position: absolute; top:0px; }

.done { position: absolute; top:0px;}


#mycarousel canvas { margin-top: 2px; }

.portfolio_cntr a {
}