
/* ### GENERAL ### */
* { padding: 0px; margin: 0px; }
html, body { font-family: "Times New Roman", Times, serif; font-size: 12px; color: #333333; }
input, select, textarea { font-family: 'Times New Roman', Arial; font-size: 12px; color: #333333; }
body { background: #fff; }
img { border: 0px; }
#popupCntr { z-index:999; }

.msg { font-weight:bold; }
.msg.error { color: #FF0000; }
.checkfield { text-indent:-999px; padding:0px 0px 0px 17px !important; margin-left:5px  !important; height:27px !important; background:none no-repeat left center; width:0px; overflow:hidden; float:right; display:block;  }
.checkfield.error { background-image: url('../images/cfCross.png'); }
.checkfield.valide { background-image: url('../images/cfCheck.png'); }

#bestelform input, #bestelform select { float:left; }
#bestelform p {clear:both; }

/* ### GLOBAL CLASSES ### */
.clear { clear: both; }
.home { background: url('../images/bg.gif') repeat; }
.pink-bg { background: url('../images/pink-bg.gif') repeat; }
.pink-bg1 { background: url('../images/pink-bg1.gif') repeat; }
.blue-bg { background: url('../images/blue-bg.gif') repeat; }
.mud-bg { background: url('../images/mud-bg.gif') repeat; }
.megenta-bg { background: url('../images/megenta-bg.gif') repeat; }
.sky-bg { background: url('../images/sky-bg.gif') repeat; }
.white-bg { background: url('../images/white-bg.gif') repeat; }
.green-bg { background: url('../images/green-bg.gif') repeat; }
.yellow-bg { background: url('../images/yellow-bg.gif') repeat; }

/* ### WRAPPER ### */
#wrapper { padding: 50px 0; position: relative; display: block; width: 100%; min-height: 100%; }
div.overlay { position: absolute; top: 0px; left: 0px; z-index: 10; width: 100%; height: 100%; background: url('../images/overlay.png'); }

/* ### MAIN CONTAINER ### */
#mainCntr { margin: 0 auto; width: 976px; }
#mainCntr #top { padding-top: 31px; width: 976px; }
#mainCntr #bottom { padding-bottom: 30px; width: 976px; }
#mainCntr #mid { padding: 10px 32px; width: 912px; }
#mainCntr .green-top { background: url('../images/content-top1.png') top left no-repeat; }
#mainCntr .green-bottom { background: url('../images/content-bottom1.png') bottom left no-repeat; }
#mainCntr .green-mid { background: url('../images/content-mid1.png') repeat-y; }
#mainCntr .pink-top { background: url('../images/pinkbg-top.png') top left no-repeat; }
#mainCntr .pink-bottom { background: url('../images/pinkbg-bottom.png') bottom left no-repeat; }
#mainCntr .pink-mid { background: url('../images/pinkbg-mid.png') repeat-y; }
#mainCntr .blue-top { background: url('../images/bluebg-top.png') top left no-repeat; }
#mainCntr .blue-bottom { background: url('../images/bluebg-bottom.png') bottom left no-repeat; }
#mainCntr .blue-mid { background: url('../images/bluebg-mid.png') repeat-y; }
#mainCntr .mud-top { background: url('../images/mudbg-top.png') top left no-repeat; }
#mainCntr .mud-bottom { background: url('../images/mudbg-bottom.png') bottom left no-repeat; }
#mainCntr .mud-mid { background: url('../images/mudbg-mid.png') repeat-y; }
#mainCntr .yellow-top { background: url('../images/yellowbg-top.png') top left no-repeat; }
#mainCntr .yellow-bottom { background: url('../images/yellowbg-bottom.png') bottom left no-repeat; }
#mainCntr .yellow-mid { background: url('../images/yellowbg-mid.png') repeat-y; }

	/* ### HEADER CONTAINER ### */
	#headerCntr { padding-bottom: 10px; position: relative; width: 912px; }
	#headerCntr h1 { position: absolute; top: -56px; left: 370px; }
	#headerCntr h1 a { display: block; width: 177px; height: 85px; text-indent: -9999px; background: url('../images/logo-green.png') no-repeat; }
	#headerCntr h1 a.pink { background: url('../images/logo-pink.png') no-repeat; }
	#headerCntr h1 a.orange { background: url('../images/logo-orange.png') no-repeat; }
	#headerCntr h1 a.blue { background: url('../images/logo-blue.png') no-repeat; }
	#headerCntr h1 a.skyblue { background: url('../images/logo-skyblue.png') no-repeat; }
	#headerCntr h1 a.mud { background: url('../images/logo-mud.png') no-repeat; }
	
		/* ### MENU CONTAINER ### */
		#menuCntr { width: 912px; height: 35px; }
		#menuCntr ul { padding-left: 12px; list-style: none; overflow: hidden; }
		#menuCntr li { margin: 0px 19px 0px 0px; font-size: 16px; font-style: italic; float: left; }
		#menuCntr li a { padding-bottom: 5px; display: block; color: #333333; text-decoration: none; }
		#menuCntr li:hover { background: url('../images/green-menu.gif') bottom center no-repeat; }
		#menuCntr li.active { background: url('../images/green-menu.gif') bottom center no-repeat; }
		#menuCntr li.last { margin-right: 0px; }
		#menuCntr ul.pink li a { color: #666; }
		#menuCntr ul.pink li:hover { background: url('../images/pink-menu.gif') bottom center no-repeat; }
		#menuCntr ul.pink li.active { background: url('../images/pink-menu.gif') bottom center no-repeat; }
		#menuCntr ul.orange li:hover { background: url('../images/orange-menu.gif') bottom center no-repeat; }
		#menuCntr ul.orange li.active { background: url('../images/orange-menu.gif') bottom center no-repeat; }
		#menuCntr ul.mud li:hover { background: url('../images/mud-menu.gif') bottom center no-repeat; }
		#menuCntr ul.mud li.active { background: url('../images/mud-menu.gif') bottom center no-repeat; }
		#menuCntr ul.megenta li:hover { background: url('../images/megenta-menu.gif') bottom center no-repeat; }
		#menuCntr ul.megenta li.active { background: url('../images/megenta-menu.gif') bottom center no-repeat; }
		#menuCntr ul.blue li:hover { background: url('../images/blue-menu.gif') bottom center no-repeat; }
		#menuCntr ul.blue li.active { background: url('../images/blue-menu.gif') bottom center no-repeat; }
		#menuCntr ul.sky li:hover { background: url('../images/sky-menu.gif') bottom center no-repeat; }
		#menuCntr ul.sky li.active { background: url('../images/sky-menu.gif') bottom center no-repeat; }
		#menuCntr li.blank { width: 173px; }
		
		/* ### MENU BOX ### */
		.menuBox { width: 912px; height: 24px; }
		.menuBox ul { list-style: none; overflow: hidden; }
		.menuBox li { padding: 0 7px; text-transform: uppercase; font-size: 11px; float: left; }
		.menuBox li a { color: #666666; text-decoration: none; }
		.menuBox li a:hover { color: #9b2d4f; }
		.menuBox li a.active { color: #9b2d4f; }

#popupCntr { position:absolute; }
#lightBox { width:472px; height:465px; background:url(../images/popupCntr.jpg) no-repeat #FFFFFF; padding:23px; margin: 0px 218px; z-index:11;}
#lightBox .footerBox { height:13px; margin-top:33px; }
#lightBox .footerBox a, #lightBox .footerBox a:hover { color:#5f6670; font-family:"Times New Roman",Times,serif; font-size:12px; text-transform:uppercase; text-decoration:none }
#lightBox .footerBox a.close { display:block; float:left; width:20px; height:18px; background:url(../images/popupClose.jpg) no-repeat right; margin-right:11px;  }
#lightBox .footerBox a.voor { display:block; float:left; width:215px; height:18px; text-align:right; margin-right:11px; }
#lightBox .footerBox a.binnen { display:block; float:left; height:18px; }
	
	/* ### CONTENT CONTAINER ### */
	#contentCntr { overflow: hidden; width: 912px; }
	#contentCntr #familycards { position: relative; margin-left: 15px; z-index:200; }
	
		/* ### LEFT CONTAINER ### */
		#leftCntr { padding: 40px 0 20px 15px; float: left; width: 540px; }
		
			/* ### TEXT BOX ### */
			.textBox { width: 510px; }
			.textBox h2 { padding-bottom: 20px; color: #b04323; font-size: 20px; text-transform: uppercase; font-weight: normal; letter-spacing: 3px; }
			.textBox h4 { padding: 10px 0 4px 0; font-size: 13px; text-transform: uppercase; color: #b04323; letter-spacing: 2px; }
			.textBox p { padding-bottom: 25px; line-height: 19px; color: #666666; font-size: 14px; letter-spacing: 1px; }
			
		/* ### CENTER CONTAINER ### */
		#centerCntr { float: left; width: 912px; overflow: hidden; }
		#centerCntr #left { padding: 20px 0px 0px 15px; width: 510px; float: left; }
		#centerCntr #right { padding-top: 20px; width: 387px; float: right; }
		#centerCntr p.center { padding-top: 10px; font-size: 14px; line-height: 19px; font-style: italic; letter-spacing: 1px; text-align: center; }
			
			#centerCntr #proefkaartje { position: absolute; margin-left: 735px; z-index:200; }
			
				
			
			/* ### ANIMATIE BOX ### */
			.animatieBox { padding: 8px; margin: 55px auto 60px auto; width: 680px; overflow: hidden; border: #d1e1bf solid 1px; }
			.animatieBox img { float: left; }
			.animatieBox img.right { float: right; }
			
			/* ### ENVELOPE BOX ### */
			.envelopeBox { padding: 10px 15px 50px 20px; text-align: center; width: 877px; overflow: hidden; }
			.envelopeBox ul { list-style: none; overflow: hidden; width: 877px; }
			.envelopeBox li { padding-right: 47px; text-transform: uppercase; float: left; width:261px;  height:314px; }
			.envelopeBox li img { padding: 5px 4px; margin-bottom: 5px; border: #fcebec solid 1px; }
			.envelopeBox li.last { padding: 0px; }
			.envelopeBox li.second { padding-top: 10px; height:326px; }
			.envelopeBox li.second img { padding: 0px; border: 0px; }
			.envelopeBox li a { padding: 0px; color: #333333; text-decoration: none; }
			.envelopeBox li a:hover { text-decoration: underline; }
			.envelopeBox span { padding-top: 30px; display: block; font-size: 16px; font-weight: bold; text-transform: uppercase; }
			.envelopeBox p { padding-top: 10px; font-size: 14px; line-height: 19px; font-style: italic; letter-spacing: 1px; }
			.envelopeBox a { padding: 0 8px; color: #333333; text-decoration: none; letter-spacing: 1px; }
			
			/* ### COLLECTIE BOX ### */
			.collectieBox { padding: 0px 50px 0px 20px; overflow: hidden; }
			.collectieBox h2 { padding-top: 35px; font-size: 20px; text-transform: uppercase; color: #9c2d4f; font-weight: normal; letter-spacing: 3px; }
			.collectieBox p { padding-top: 15px; font-size: 14px; color: #666666; line-height: 19px; letter-spacing: 1px; }
			.collectieBox img { float: right; margin-left: 55px; }
			
			/* ### GALLERY BOX ### */
			.galleryBox { padding-bottom: 10px; width: 912px; }
			.galleryBox ul { list-style: none; overflow: hidden; }
			.galleryBox li { padding: 0 16px 20px 16px; float: left; width:150px; height:155px; text-align:center; }
			.galleryBox li.last { padding-right: 0px; }
			
			/* ### ENVELOPPEN BOX ### */
			.enveloppenBox { padding: 0px 0px 35px 20px; width: 892px; overflow: hidden; }
			.enveloppenBox h2 { padding-top: 35px; font-size: 20px; text-transform: uppercase; color: #9c2d4f; font-weight: normal; letter-spacing: 3px; }
			.enveloppenBox p { padding-top: 15px; font-size: 14px; color: #666666; text-align: justify; line-height: 19px; letter-spacing: 1px; }
			.enveloppenBox img.envelop { float: right; margin: 0 110px 0 70px; }
			.enveloppenBox ul { list-style: none; overflow: hidden; }
			.enveloppenBox li { padding-right: 20px; float: left; } 
			.enveloppenBox li.last { padding: 0px; }
			
			/* ### UITNOD BOX ### */
			.uitnodBox { padding: 0px 0px 35px 20px; width: 892px; overflow: hidden; }
			.uitnodBox h2 { padding-top: 35px; font-size: 20px; text-transform: uppercase; color: #9c2d4f; font-weight: normal; letter-spacing: 3px; }
			.uitnodBox p { padding: 15px 0 80px 0; font-size: 14px; width: 425px; color: #666666; text-align: justify; line-height: 19px; letter-spacing: 1px; }
			.uitnodBox img { float: left; margin-right: 20px; }
			
			/* ### KAARTJE BOX ### */
			.kaartjeBox { padding: 0px 0px 40px 20px; width: 892px; overflow: hidden; }
			.kaartjeBox h2 { padding-top: 30px; font-size: 20px; text-transform: uppercase; color: #00476b; font-weight: normal; letter-spacing: 3px; }
			.kaartjeBox p { padding-top: 15px; font-size: 14px; width: 480px; color: #666666; line-height: 19px; letter-spacing: 1px; }
						
			/* ### INVITE BOX ### */
			.inviteBox { padding: 20px 15px 10px 15px; width: 882px; overflow: hidden; }
			.inviteBox .left { width: 245px; float: left; }
			.inviteBox .center { padding: 0 70px; width: 262px; float: left; }
			.inviteBox .right { width: 235px; float: right; }
						
			/* ### KWALITEIT BOX ### */
			.kwaliteitBox { padding: 30px 14px; width: 884px; overflow: hidden; }
			.kwaliteitBox h2 { color: #9c2d50; font-size: 20px; text-transform: uppercase; font-weight: normal; letter-spacing: 3px; }
			.kwaliteitBox p { padding-top: 18px; line-height: 19px; font-size: 14px; color: #666666; letter-spacing: 1px; }
			.kwaliteitBox img { padding: 5px; margin-left: 40px; float: right; border: #c8e7ed solid 1px; }
			
			/* ### PROCES BOX ### */
			.procesBox { padding: 30px 14px; width: 884px; overflow: hidden; }
			.procesBox h2 { color: #bfb584; font-size: 20px; text-transform: uppercase; font-weight: normal; letter-spacing: 3px; }
			.procesBox p { padding-top: 18px; line-height: 19px; font-size: 14px; color: #666666; letter-spacing: 1px; }
			.procesBox img { padding: 5px; margin-left: 40px; float: right; border: #fbe1e3 solid 1px; }
			
			/* ### VASTE BOX ### */
			.vasteBox { width: 410px; overflow: hidden; }
			.vasteBox h2 { padding-bottom: 10px; color: #00476b; font-size: 20px; font-weight: normal; text-transform: uppercase; letter-spacing: 3px; }
			.vasteBox ul { padding: 8px 0 10px 0; list-style: none; }
			.vasteBox li { overflow: hidden; color: #666; font-size: 14px; line-height: 19px; letter-spacing: 1px; }
			.vasteBox li span { display: block; float: right; letter-spacing: 1px; }
			.vasteBox p { padding: 8px 20px 8px 0; color: #666; font-size: 14px; line-height: 19px; letter-spacing: 1px; }
			.vasteBox p span { font-size: 12px; }
			.vasteBox a { color: #9c2d50; font-weight: bold; text-decoration: none; }
			.vasteBox a:hover { text-decoration: underline; }
			
			/* ### CUSTOM BOX ### */
			.customBox { padding-bottom: 20px; width: 380px; overflow: hidden; }
			.customBox h2 { padding-bottom: 10px; color: #00476b; font-size: 20px; font-weight: normal; text-transform: uppercase; letter-spacing: 3px; }
			.customBox ul { padding: 10px 0; list-style: none; }
			.customBox li { overflow: hidden; color: #666; font-size: 14px; line-height: 19px; letter-spacing: 1px; } 
			.customBox li span { display: block; float: left; width: 72px; }
			.customBox li span.type { width: 105px; }
			.customBox li span.hoek { width: 76px; }
			.customBox li.heading { color: #00476b; font-size: 12px; text-transform: uppercase; font-weight: bold; }
			.customBox li span.text { width: 255px; }
			.customBox p { color: #666; font-size: 14px; line-height: 19px; letter-spacing: 1px; }
			
			/* ### OUTLETS BOX ### */
			.outletsBox { padding: 30px 0 30px 15px; width: 897px; overflow: hidden; }
			.outletsBox img { float: right; margin-left: 30px; }
			.outletsBox h2 { padding-bottom: 10px; color: #77c8d6; font-size: 20px; font-weight: normal; text-transform: uppercase; letter-spacing: 3px; } 
			.outletsBox p { padding: 10px 0; color: #666; font-size: 14px; line-height: 19px; letter-spacing: 1px; } 
			.outletsBox h3 { padding: 10px 0; color: #77c8d6; font-size: 14px; font-weight: normal; text-transform: uppercase; letter-spacing: 2px; }
			.outletsBox h4 { padding: 8px 0 4px 0; font-size: 14px; color: #666666; letter-spacing: 1px; }
			.outletsBox h4 a { color: #e2007a; text-decoration: none; }
			.outletsBox h4 a:hover { text-decoration: underline; }
			.outletsBox ul { padding-bottom: 12px; list-style: none; }
			.outletsBox li { overflow: hidden; line-height: 19px; color: #666; font-size: 14px; letter-spacing: 1px; }
			.outletsBox li span { display: block; float: left; width: 165px; }
			.outletsBox li span.name { width: 270px; }
			.outletsBox li span.number { width: 130px; }
			.outletsBox li a { color: #666; text-decoration: none; }
			.outletsBox li a:hover { text-decoration: underline; }
			
			/* ### OVERONS BOX ### */
			.overonsBox { padding: 30px 14px; width: 884px; overflow: hidden; }
			.overonsBox h2 { color: #6c8d49; font-size: 20px; text-transform: uppercase; font-weight: normal; letter-spacing: 3px; }
			.overonsBox p, .overonsBox span { padding-top: 18px; line-height: 19px; font-size: 14px; color: #666666; letter-spacing: 1px; }
			.overonsBox span { padding-top:0px; }
			.overonsBox img { padding: 5px; margin-left: 40px; float: right; border: #d1e1bf solid 1px; }
			.overonsBox a { color: #666; text-decoration: none; }
			.overonsBox a:hover { text-decoration: underline; }
			
			.overonsBox label { font-size:13px; font-weight:bold; letter-spacing:2px; text-transform:uppercase; }
			.overonsBox input { width: 470px; border: 1px solid #666666; height:25px; }
			.overonsBox input.small1 { width: 116px; }
			.overonsBox input.small2 { width: 326px; margin-left:3px; }
			.overonsBox textarea { width: 470px; height:165px; border: 1px solid #666666;  }
			.overonsBox button { float:right; }
			.overonsBox div.floater { float:left; }
			.overonsBox #thumbnail { border:none; margin-left: 63px; float:left; }
			
			/* ### CONTACT BOX ### */
			.contactBox { padding: 30px 15px; width: 882px; overflow: hidden; }
			.contactBox .left { width: 540px; float: left; }
			.contactBox .right { padding-top: 10px; width: 342px; float: right; }
			.contactBox img.contact { padding: 5px; border: #f5e8a9 solid 1px; }
			.contactBox h2 { padding-bottom: 20px; color: #9b2d4f; font-size: 20px; text-transform: uppercase; font-weight: normal; letter-spacing: 3px; }
			.contactBox address { padding-bottom: 15px; color: #666666; font-size: 14px; line-height: 19px; font-style: normal; letter-spacing: 1px; }
			.contactBox address a { color: #9c2d50; font-weight: bold; text-decoration: none; }
			.contactBox address a:hover { text-decoration: underline; }
			.contactBox img { display: block; }
			
		/* ### RIGHT CONTAINER ### */
		#rightCntr { padding: 40px 15px 20px 0px; float: right; width: 340px; }
			
			/* ### FOTO BOX ### */
			.fotoBox { } /* width: 340px; overflow: hidden; */
			.fotoBox { overflow: hidden; display: block; border: #c8e7ed solid 1px; padding-bottom: 10px;} /* width: 340px; overflow: hidden; */
			.fotoBox img {   } /* padding: 5px; margin-bottom: 4px; border: #c8e7ed solid 1px; */
			.fotoBox ul {} /* list-style: none; text-align: center; */
			.fotoBox li {  } /*padding: 0 4px; font-weight: bold; font-size: 16px; display: inline;*/
			.fotoBox li a { }/*color: #666666; text-decoration: none; */
			.fotoBox li a:hover {  }/*color: #b14423;*/
			.fotoBox li a.active {}/* color: #b14423; */
			
	/* ### FOOTER CONTAINER ### */
	#footerCntr { overflow: hidden; margin: 0 auto; width: 976px; font-family: Times; }
	#footerCntr ul { list-style: none; text-align: center; }
	#footerCntr li { padding: 0 12px; letter-spacing: 2px; color: #333333; display: inline; font-size: 10px; text-transform: uppercase; }
	#footerCntr li a { color: #333333; text-decoration: none; }
	#footerCntr ul.megenta li { padding: 0 10px; color: #fff; display: inline; font-weight: bold; font-size: 10px; text-transform: uppercase; }
	#footerCntr ul.megenta a { color: #fff; text-decoration: none; }
	#footerCntr li a:hover { text-decoration: underline; }

	
	/*preload classes*/
.svw {width: 340px; height: 340px; text-align: center; }
.svw ul {position: relative; left: -999em;}

/*core classes*/
.stripViewer { 
width: 340px;
position: relative;
overflow: hidden; 
border: 0;  
margin: 0;
margin-bottom: 4px; 
border: white solid 5px;
}
.stripViewer ul { /* this is your UL of images */
margin: 0;
padding: 0;
position: relative;
left: 0;
top: 0;
width: 1%;
list-style-type: none;
}
.stripViewer ul li { 
float:left;
}
.stripTransmitter {
overflow: auto;
width: 1%;
}
.stripTransmitter ul {
list-style: none; text-align: center;
}
.stripTransmitter ul li{
padding: 0 4px; font-weight: bold; font-size: 16px; display: inline;
}
.stripTransmitter a{
color: #666666; text-decoration: none; 
}
.stripTransmitter a:hover, a.current{
color: #b14423;
}

/*tooltips formatting*/
.tooltip
{
padding: 0.5em;
background: #fff;
color: #000;
border: 5px solid #dedede;
}


