/* De kleuren zijn:
tekst zwart: 333333
tekst groen: 66b103
links oranje: f77f00
border thumb specs: adadad */

#content	{/* font-size: 1.1em; */ padding-left: 61px; line-height: 1.2em} /* centreren */

#dierstrip	{/* background-image: url(../../img/adoptie/fotostrip_bg.gif);  */
	width: 857px; height: 93px; background-color: #f77f00; overflow: hidden;}
#dierstrip li:first-child {margin-left: 12px;}
#dierstrip li {/* background: url(../../img/adoptie/thumb_fotostrip_bg.png) no-repeat; */
	width: 74px; height: 74px; position: relative; display: block; float: left; margin: 10px 5px;}
#dierstrip li a img	{width: 66px; height: 66px; position: absolute; top: 3px; left: 3px;}

#dierstrip li .indic	{background: url(../../img/adoptie/fotostrip_pointer.png) no-repeat; 
	width: 21px; height: 10px; display: block; border: 1px solid blue;
	position: absolute; top: 83px; left: 25px; z-index: 100;}

#kiesdier	{background-image: url(../../img/adoptie/kieseendier.png); z-index: 100;
	position: absolute; top: 76px; right: 50px; width: 151px; height: 40px;}

#intro	{/* background-image: url(../../img/adoptie/adoptie_start_bgfoto.jpg); */
	/* deze staat dynamisch in dsp_home.cfm */ 
	width: 797px; height: 385px; padding: 10px 30px 0 30px; color: white;
	position: relative; /* afkomstig uit versie met kerstversiering e.d. */}

#intro #bevat	{background-image: url(../../img/adoptie/adoptiepakket_bg.png); 
	width: 622px; height: 144px; padding: 5px 10px; color: black; position: relative;}			
#intro #bevat h2	{margin: 5px 0 10px 0; padding: 0;}
#intro .pakketlink	{border: 1px solid blue; width: 622px; height: 144px; display: block;
	position: absolute; top: 0; left: 0;
	/* ivm aanklikbaarheid IE, varitem=13369: */ 
	background: white; opacity: 0; filter: alpha(opacity = 0);}
	
#intro h1	{margin-top: 10px; color: white;}

ul#pakket 		{overflow: hidden;}
ul#pakket li	{display: block; float: left; padding: 0 10px 0 0; margin-right: 5px; width: 185px;
	background: url(../../img/adoptie/plus_icon.png) right 40px no-repeat;}
ul#pakket li span	{float: left; width: 80px;}
ul#pakket li:last-child	{background: none;}
ul#pakket li.lastitem	{background: none;}/* moet apart, anders negeert IE het statement. WTF!  */
ul#pakket li img	{border: none !important; padding: 0 !important}

ul#pakket.smal li	{width: 155px;}
ul#pakket.smal li span	{width: 60px;}

#quotes		{background-color: #eeede1; overflow: hidden;
	/* background-image: url(../../img/adoptie/quotes_bg.png);  */
	width: 857px; height: 138px; margin-top: 0px}
#quotes	li	{float: left; display: block; width: 420px; height: 130px;}	

#quotes	li .img	{/* background: url(../../img/adoptie/thumb_quote_bg.png) no-repeat; */
	width: 75px; height: 87px; position: relative; float: left; margin-left: 10px;}
#quotes	li .img img	{width: 65px; height: 77px; position: absolute; top: 5px; left: 5px;}

#quotes	li div	{float: left; margin: 10px; width: 310px;}
#quotes li:first-child div	{background: url(../../img/adoptie/thumb_quote_divider.png) no-repeat top right}

#quotes	li blockquote	{position: relative; font-size: 100%; font-weight: normal; 
	margin: 0 10px 0 0; padding: 0 20px; font-style: italic;
	/* background: url(../../img/adoptie/quote_icon.png) no-repeat; */}
#quotes	li span	{font-weight: bold;}

blockquote:before, blockquote:after 
	{display: block; /* width: 12px; height: 11px; */}
blockquote:before {/* content: open-quote;  */
	position: absolute; top: 0; left: 0;
	content: url(../../img/adoptie/quote_icon.png);}
blockquote:after {/* content: close-quote;  */
	position: absolute; bottom: 0; right: 0;
	content: url(../../img/adoptie/quote_icon2.png);}
	
#dierfoto	{width: 857px; min-height: 500px; /* mag niet langer zijn! */ color: white;
	background-repeat: no-repeat; /* backgr zelf staat dynamisch in inc_head.cfm */}
#pakketshim	{width: 857px; background: url(../../img/adoptie/bgfoto_forms_shim.png) repeat; position: relative;} /* moet eigenlijk over de foto heenvallen.. misschien volgorde divs toch omdraaien? */
#pakketcanvas	{background: url(../../img/adoptie/bgfoto_forms_overlay.png) no-repeat; min-height: 500px;}
#pakketcanvasfoot	{width: 857px; height: 11px;
	background-color: #333333
	/* background: url(../../img/adoptie/bgfoto_forms_foot.png) no-repeat; */}

#adresblok	{position: absolute; right: 35px; bottom: 0; 
	width: 220px; margin: 0; padding: 0; color: white;}
#adresblok h3	{color: white}
#adresblok p	{margin-bottom: 0}
	
#waarom, #formintro, #form, div#uitverkocht	{margin-left: 10px; width: 520px; padding: 20px;}

#waarom	{background-color: #2e2e2e; color: white;}
#waarom a	{color: #f77f00; text-decoration: none}
#waarom a:hover	{text-decoration: underline}
#waarom li	{list-style-image: url(../../img/adoptie/icon_checked.png)}
#waarom h1, #waarom h3	{color: white;}
#waarom h1 {margin-top: 0}
		
#formintro	{background-color: #eeede1; color: black; padding-bottom: 22px;}
#formintro img	{float: left; margin-right: 10px; border: 1px solid silver;}
#formintro dl 	{overflow: auto}
#formintro dl dt {float:left; clear:both; width:100px; font-weight: bold;}
#formintro dl dd {float:left; width:100px; margin:0 0 0.5em 0.25em;}

#form, div#uitverkocht	{background-color: white; color: black; overflow: auto; clear: both}

#formvulling {min-height: 150px;}

#formfoot	{background: url(../../img/adoptie/form_bg_foot.png) no-repeat; 
	width: 560px; height: 10px; margin-left: 10px;}
	
#form label	{color: #66b103; font-weight: bold;}
	
.wijzig	{background: url(../../img/adoptie/btn_wijzig.gif); width: 50px; height: 15px; display: block;}

	/* varitem=20999 */
	#adoptiestap	{background: url(../../img/adoptie/stappen_bg.gif) no-repeat;
		width: 857px; height: 12px;} /* height: 93px; */
	#adoptiestap ul	{display: none} /* float: right; margin: 25px 20px; 
	#adoptiestap li	{width: 89px; height: 38px; margin-left: 10px; 
		display: block; float: left; background-repeat: no-repeat}
	#adoptiestap li span	{display: none;}
	*//* tussen de li's staat een pijltje. 
	plaatje moet dan aan a denk ik. *//*
	#adoptiestap li.stap1	{background: url(../../img/adoptie/stap1.gif)}
	#adoptiestap li.stap2	{background: url(../../img/adoptie/stap2.gif)}
	#adoptiestap li.stap3	{background: url(../../img/adoptie/stap3.gif)}
	#adoptiestap li.stap4	{background: url(../../img/adoptie/stap4.gif)}
	#adoptiestap li.stap5	{background: url(../../img/adoptie/stap5.gif)}
	
	#adoptiestap li.stap1#curr	{background: url(../../img/adoptie/stap1_act.gif)}
	#adoptiestap li.stap2#curr	{background: url(../../img/adoptie/stap2_act.gif)}
	#adoptiestap li.stap3#curr	{background: url(../../img/adoptie/stap3_act.gif)}
	#adoptiestap li.stap4#curr	{background: url(../../img/adoptie/stap4_act.gif)}
	#adoptiestap li.stap5#curr	{background: url(../../img/adoptie/stap5_act.gif)}*/
	
ul#watnu	{margin: 0; padding: 0; min-height: 320px;}
ul#watnu li	{background: url(../../img/adoptie/hr_dots.png) top left no-repeat; 
	clear: both; padding: 10px 0; overflow: auto}
ul#watnu li	img	{float: left; width: 80px; margin-right: 30px;}
ul#watnu li	div	{float: left; width: 390px;}
ul#watnu li a	{color: #f77f00; text-decoration: none}

fieldset	{background: url(../../img/adoptie/hr_dots_select.png) top left no-repeat; border:none;}

#privacytekst	{color: silver; font-size: 0.9em; clear: both; padding-top: 15px;}

#aForm div.idealcheck label {color: black !important; font-weight: normal;}

/* Aanvullingen voor versie met (kerst-)versiering, teller en socialmedia-bar: +-+-+-+-+-+-+-+-+-+- */

/* div#intro {position: relative; height: 385px;} verplaatst naar boven */

div#bevat {position: absolute;}

/* teller --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */

div#teller {background-color: white; color: black;
	width: 220px; margin: 25px auto; padding-bottom: 40px;}
div#teller p {margin: 10px 0; padding: 0px; line-height: 1.2em; text-align: center; 
	text-transform: uppercase; font-weight: bold; font-size: 20px;} 
	/* font-size 20px is t.o.v. tellertje, 21px is t.o.v. breedte sidebar.. */
div#teller div#aantal {width: 100px; margin: 0 auto;} 
div#teller div.cijfer {float: left; width: 22px; height:51px; margin-right: 3px;}

/* Uitzondering dsp_home */
div#intro #teller {
	background: url(../../img/adoptie/bgteller.png) no-repeat; 
	margin: 0; height: 100px; width: 120px; padding: 5px 10px;
	position: absolute; left: 685px; bottom: 27px;}
div#intro #teller p {font-size: 96%;}
div#intro #teller a {text-decoration: none;}

/* nw sidebar --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */
#telleronly	{position: absolute; right: 35px; bottom: 180px; 
	width: 220px; margin: 0; padding-bottom: 10px; 
	background-color: white; border: 1px solid black; 
	-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;} 
	
#socialside	{background-color: white; color: black;
	position: absolute; right: 15px; top: 0px; height: 100%;
	width: 237px; margin: 0; padding: 0 10px;}
		
#sidebarfooter	{width: 257px; height: 10px;
	position: absolute; bottom: 0; left: 0px;
	background: url(../../img/adoptie/sidebar_bg_foot.gif) no-repeat top left;}

/* social */
div#share {clear: both; border-top: 1px solid silver; padding: 36px 20px; height: 70px}
	div.st_twitter_vcount, div.st_facebook_vcount {float: left; margin: 0 16px;}
div#fbfaces {clear: both;}
	
/* dsp_dier.cfm --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- ---

#diernaastintro	{width: 236px; height: 329px;
	position: absolute; left: 10px; top: 0;
	background-repeat:no-repeat; background-position: top left;}	

#waarominner	{width: 304px; height: 309px; padding: 10px;
	overflow: hidden;
	position: absolute; left: 246px; top: 0;}

#adoptiestap {display: none;} */ /* varitem=20999 */
	
/* dsp_bedankt.cfm --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- --- */

#form	{position: relative;}
#adoptformintro	{height: 180px;} /* margin-left: 180px */

#diernaastbedankt	{width: 163px; height: 180px;
	position: absolute; left: 0; top: 0;
	background-repeat:no-repeat; background-position: top left;}