
body,html{
	font: 90%/1.5em Verdana, Tahoma, arial, sans-serif;
	margin:0px;
	
}


h1.logo{
	font-size:28px;
	font-weight:bold;
	padding:0px 0 0 20px;
	text-align:left;
	color:#4292D6;	
}
h1.logo a:hover{color:#2772B1;}

h1.logoSmall{
	font-size:18px;
	
	position:absolute;
	left:506px;
	top:31px;
	}


h1{
	font-size:20px;
	font-weight:bold;
	padding:10px 0 0 20px;
	text-align:left;
	color:#4292D6;	
}

h2{
	font-size:16px;
	font-weight:bold;
	padding:20px 0 0 20px;
	text-align:left;
	color:#4292D6;	
}
img{border:0px;}
p{padding:0px 0 0 20px; margin:0px;}
p.button{padding-left:80px;}
p.button a:hover{opacity:0.5;}

p.button a{font-size:20px; text-decoration:underline; font-weight:bold;}

p.small{font-size:85%; font-style:italic;}

.nopadding{padding:0px;}
h2.nopadding{padding:0px 0 0 20px;}
p.addDate{padding-left:244px;}
p.red{color:red;}
p.orange{color:orange;}
p.green{color:green;}
p.italic{font-style:italic;}
p.alignRight{text-align:right;}
p.big{text-align:center; font-size:110%; color:green;}
p.home{margin-top:10px;}
 p.feedback{padding:0px;}
 
p.testimonial {
	text-align: right;
	font-size: 0.85em;	
	line-height:1.4em;
}



a{text-decoration:none; color:#2772B1;}
a:hover{color:black;}
a.orange{color:orange;}
input{border:1px solid #CCCCCC;}

td{vertical-align:top;}
form{margin:0;}
a.submit{margin:0 10px 0 193px;}
input.uitnodigen{margin:10px 20px 30px 184px;}
input.right{margin-left:134px;}
input.error{border:1px solid red;}
input.opacity{opacity:0.5;}
input.rightOpacity{margin-left:134px;  opacity:0.5;}
hr{border-color:#3399CC;}


a.cta1 img:hover{opacity:0.6;}


table.item{margin:0 auto;}
table.overzicht{margin:20px; width:470px;}
table.warning{clear:both; float:right; text-align:center;}
table.beheer{width:468px;}

td.datum{background:#3399CC; color:white;}
td.naam{background:#E9F1F9;}
td.status{background:#EDF1F5;}
td.totaal{background:#E5E9ED;}
td.right{text-align:right;}

table.beheer td.header{background:#3399CC; color:white;}
table.beheer td.headerAction{ color:gray;}

table.note{width:300px; margin:20px 0 0 0px;}

input.datumSubmit{margin:0px 20px 20px 375px;}


#container{
	width:800px;
	margin:0px auto;
}
#containerLarge{
	width:977px;
	margin:0px auto;
}

#logo{
	clear:both;
	float:left;
	width:800px;
	height:50px;
}

#content{
	clear:both;
	float:left;
	width:800px;
	.padding-bottom:20px;
	border:1px solid #3399CC;
	background: url('../../lootjes-trekken-framework//images/content-bg.png') repeat-y;
	
}

#content table.feedbackSucces, #content table.feedbackFailure{
	-moz-border-radius-topleft:5px;
	-moz-border-radius-topright:5px;
	-moz-border-radius-bottomleft:5px;
	-moz-border-radius-bottomright:5px;
	padding:0 0 5px 10px;
	margin:20px;
	width:430px;
}
#content table.feedbackSucces{border: 1px solid #57A84B; background: #E6F3E2;}
#content table.feedbackFailure{border: 1px solid #FF4040; background: #F5ADAD;}

#content table p.feedbackSucces{color: #007916;}
#content table p.feedbackFailure{color: #402A2A;}


#webshops{
	clear:both;
	float:left;
}
	
#warning{
clear:both;
float:left;
width:500px;
margin:20px 0;
}

#step{
	clear:both;
	float:left;
	width:570px;
	margin-bottom:20px;
}
/*//////////////////////*/
/*						*/
/*						*/
/* De producthighlights	*/
/*	 op de homepage		*/
/*						*/
/*//////////////////////*/
#productsHighlight{clear:both; float:left; width:740px; margin:0 0 0 20px;}

#boxLarge{
	float:left;
	position:relative;
	margin:0px 0 20px 0;
	padding:20px 0 0 0;
	width:728px;
	border:1px solid #DFE6EC;
}

#boxtopLarge p.title{
	display:block;
	position:absolute;
	top:-10px;
	margin: 0 20px;
	padding:0px 5px;
	font-weight:bold;
}

#boxmiddleLarge1{
	clear:both;
	float:left;
	width:350px;
	margin:5px;
	
	
}

#boxmiddleLarge2{
	float:left;
	width:350px;
	margin:5px;
	
}

#boxmiddleLarge1 p, #boxmiddleLarge2 p{
	padding:0 0 0 6px;
}



/*//////////////////////*/
/*						*/
/*						*/
/*   Cadeaupagina	 	*/
/*						*/
/*						*/
/*//////////////////////*/
#contentLarge{
	clear:both;
	float:left;
	width:975px;
	.padding-bottom:20px;
	border:1px solid #3399CC;
	margin: 0 auto;
	
}


/*//////////////////////*/
/*						*/
/*						*/
/*   Groepsoverzicht 	*/
/*						*/
/*						*/
/*//////////////////////*/
#groep-datum, #groep-deelnemers{
	clear:both;
	float:left;
}

#groep-deelnemers #lootjePersoon.first, #groep-deelnemers #lootjeGetrokken.first{
clear:both;
}

#groep-deelnemers #lootjePersoonImage, #groep-deelnemers #lootjePersoonName{
	clear:both;
	float:left;
	text-align:center;
	width:122px;
}

#groep-deelnemers #lootjeGetrokken #lootjePersoonImage, #groep-deelnemers  #lootjeGetrokken #lootjePersoonName{
	clear:both;
	float:left;
	text-align:center;
	width:200px;
}

#groep-deelnemers #lootjesPersonen{
	clear:both;
	float:left;
	width:470px;
	
}


#groep-deelnemers #lootjePersoon{
	float:left;
	width:122px;
	height:100px;

}

#groep-deelnemers #lootjeGetrokken{
	float:left;
	width:200px;
	height:100px;
	text-align:center;
}

#groep-deelnemers #lootjeFooter{
	clear:both;
	float:left;
	margin-left:10px;
}

.berichtTitel{
	clear:both;
	float:left;
	width:470px;
	height:25px;
	
}

.bericht{
	float:left;
	clear:both;
	width:470px;
	margin:10px 0 10px 0;
	padding-left:20px;
	
	
}

.berichtDetail{
	clear:both;
	float:left;
	width:448px;
	padding:5px 10px 10px 10px;
	border:1px solid #D1DCEE;
	border-bottom:none;
	background:white;

}

.berichtDetail p{padding:0px;}

.berichtFooter{
	clear:both;
	float:left;
	width:470px;
	height:15px;
	background: url("../lootjes-trekken-framework/../images/kleur/blauw-footer.png");
}

td.groepsbericht p{ padding:0px;}
td.groepsbericht p a{ text-decoration:none; color:#2772B1;}

.berichtSchrijven{
	clear:both;
	float:left;
}

#addMessage{
	clear:both;
	float:left;
	width:300px;
	margin-top:20px;
}
/*//////////////////////*/
/*						*/
/*						*/
/*   Beheer         	*/
/*						*/
/*						*/
/*//////////////////////*/
#beheer{
	clear:both;
	float:left;
	padding-left:20px;
	width:470px;
}
#beheerTop{
	clear:both;
	float:left;
	height:25px;
	width:470px;
}
#beheerMiddle{
	clear:both;
	float:left;
	border:1px solid #D1DCEE;
	border-top:none;
	border-bottom:none;
	width:468px;
	
	padding:10px 0;
	background:white;
}

#beheerBottom{
	clear:both;
	float:left;
	background: url("../../lootjes-trekken-framework/images/kleur/blauw-footer.png");
	height:15px;
	width:470px;
	margin-bottom:20px;
}

.titelLeft{
	clear:both;
	float:left;
	width:15px;
	height:25px;
	background: url("../../lootjes-trekken-framework/images/kleur/blauw-randlinks.png");
}

.titelRight{
	float:left;
	width:15px;
	height:25px;
	background: url("../../lootjes-trekken-framework/images/kleur/blauw-randrechts.png");
}

.titelMiddle{
	float:left;
	width:440px;
	height:25px;
	background: url("../../lootjes-trekken-framework/images/kleur/blauw-navigatie.png");
}

.titelMiddle p{
	color:white;
	padding:5px 0 0 0;
	font-weight:bold;
	font-size:85%;
}

#beheerTop .titelMiddle p{
	color:white;
	padding:4px 0 0 0;
	font-weight:bold;
	font-size:100%;
}


/*//////////////////////*/
/*						*/
/*						*/
/*   Lootje			 	*/
/*						*/
/*						*/
/*//////////////////////*/

#lootjeLeft{
	clear:both;
	float:left;
	width:340px;
}

#lootjeBack{
	clear:both;
	float:left;
	width:340px;
	margin:10px 0 0 0;
}

#lootje{
	clear:both;
	float:left;
	width:300px;
	margin:20px;
	
}

#lootjeTop,#lootjeMiddle, #lootje .seperate, #lootje .seperateDark, #lootjeBottom{
	clear:both;
	float:left;
	width:300px;
}

#lootje #lootjeTop{
	background: url("../../lootjes-trekken-framework/images/lootje-top1.png");
	.height:53px;
	height:29px;
	margin:0px;
	text-align:center;
}
#lootje #lootjeTop p{
	.color:white;
	color:black;
}

#lootje #lootjeMiddle{
background: url("../../lootjes-trekken-framework/images/lootje-midden1.png");
}

#lootje .seperate{
height:3px;
background: url("../../lootjes-trekken-framework/images/lootje-midden-scheiding.png") no-repeat;
}

#lootje .seperateDark{
height:3px;
background: url("../../lootjes-trekken-framework/images/lootje-midden-scheiding-donker.png") no-repeat;
}

#lootje #lootjeMiddle .item{
	clear:both;
	float:left;
	min-height:22px;
	width:275px;
}

#lootje #lootjeMiddle .item p{
	padding:0 15px 0 19px;

	font-style:italic;
	
}

#lootje #lootjeMiddle .itemActions{
	float:left;
	margin:0.5px 0 0 0;
	height:22px;
	width:25px;
}

#lootje #lootjeMiddle .itemActions p{
	padding:0px;
	
}

#itemToevoegen{
	clear:both;
	float:left;
	width:300px;
	height:22px;
	background: url("../../lootjes-trekken-framework/images/lootje-midden-selected.png");
	
}
#itemToevoegen input{
	border:none;
	background:transparent;
}

#lastItem{
	clear:both;
	float:left;
	width:300px;
	height:22px;
	background: url("../../lootjes-trekken-framework/images/lootje-midden1.png") no-repeat;
	
}

#lootje #lootjeBottom{
	background: url("../../lootjes-trekken-framework/images/lootje-footer1.png");
	height:40px;
	margin:0px;
	text-align:right;
}
#lootje #lootjeBottom  input.lootjeInleveren{
	margin:8px 8px 0 0;
}

#navigation{
	clear:both;
	float:left;
	width:280px;
	padding-left:20px;
}



#contentLootjeBottom{
	clear:both;
	float:left;
	width:800px;
	padding:30px 0 20px 0;
}


/*//////////////////////*/
/*						*/
/*						*/
/*      Homepage 		*/
/*						*/
/*						*/
/*//////////////////////*/
#photoBackground{
	float:right;
	width:230px;
	margin-bottom:20px;
	padding-top:7px;
}
#overview{
	float:left;
	width:300px;
	margin-bottom:20px;
}
#overview p{padding-right:20px;}
#overview ul{list-style:none; padding-left:20px;}
#overview li a.selected{color:grey;}

#borderContent{
	clear:both;
	height:20px;
	background: #3399CC;
}

#photo{
	clear:both;
	float:left;
	width:250px;
	height:315px;
	padding:10px 0 0 20px;
}
#photo img, #photoBackground img{
	height:270px;
	padding:20px 0 0 0px;
}

#preface{
	
	float:left;
	width:330px;
	height:200px;
	
}
#testimonials{
	float:left;
	width:190px;
	height:200px;
	padding:25px 0px 0 0;
}

#cta{
	float:left;
	width:440px;
	height:60px;
	
}





#highlights{
	clear:both;
	float:left;
	width:800px;
	border:1px solid #3399CC;
}

#highlightsLarge{
	clear:both;
	float:left;
	width:975px;
	border:1px solid #3399CC;
}

#banner{
	clear:both;
	float:left;
	width:801px;
	height:27px;
	background: #3399CC;
}

#bannerLarge{
	clear:both;
	float:left;
	width:975px;
	height:27px;
	background: #3399CC;
}

#banner p, #bannerLarge p{color:white; text-align:center; font-weight:bold;}

#highlight1{clear:both; width:230px;}
#highlight1Large{clear:both; width:325px;}

#highlight1,#highlight2,#highlight3,#highlight1Large,#highlight2Large,#highlight3Large{	
	float:left;
	position:relative;
	height:200px;
}
#highlight1 h2,#highlight2 h2,#highlight3 h2,#highlight1Large h2,#highlight2Large h2,#highlight3Large h2{padding:5px 0 0 20px;}


#highlight2,#highlight3{width:279px;}
#highlight2Large,#highlight3Large{width:325px;}

#highlight3 a.cta1Link,#highlight3Large a.cta1Link{
	position:absolute;
	left:20px;
}

#highlight3 a.cta1Image,#highlight3 Largea.cta1Image{
	position:absolute;
	left:160px;
	top:95px;
}

#highlight3 a.cta3Image,#highlight3Large a.cta3Image{
	position:absolute;
	left:160px;
	top:95px;
}

#highlight3  img.cta3ImageWWF,#highlight3Large  img.cta3ImageWWF{
	position:absolute;
	left:10px;
	top:0px;
	width:105px;
}

#footer{
	clear:both;
	float:left;
	width:801px;
	margin-bottom:20px;
}

#footer p{text-align:center;}

#subpages{
clear:both;
float:left;
width:801px;
height:40px;
margin-bottom:10px;
}

#subpages p.big{font-size:20px; font-weight:bold; padding:0px; color:#8C8C8C; text-align:left;}
#subpages h2{float:left; font-size:12px; font-weight:normal; padding:0px; color:#8C8C8C;}
#subpages p.break{float:left;}

#subpages p{
padding:0px;
}
#subpages a{
color:#9B9C9B;
}













