/* -------------------------------------------------------------------

	Boondoggle - An Vanderlinden
	Finotheker
	
	1. Structure
	2. Header (with Navigation)
	3. Breadcrumb
	4. colLeft
	5. content
	6. Questions
	7. Footer
	8. Miscellaneous
	9. Simulations
	10. Consultation types
	11. appointment
	12. Home
	
	always include reset.css, it will reset your style
	for all browers, it includes the clearfix
	
	typography specs must be specified in typography.css
	form specs must be specified in forms.css
	
	ID en class naming => use capitals for seperation: navHome

------------------------------------------------------------------- */
@import url(forms.css);


/* ----- 0. Default settings - fonts and colors --------------------------------- */
body { font: normal 0.75em Helvetica, Geneva, Arial, sans-serif; color:#747678; }

a, a:link { color:#e98300; }
a:visited { color:#e98300; }
a:hover { color:#747678; }
a:active { color:#e98300; }

h1, h2 { font-weight: normal; }
h1 { font-size: 2.34em; margin-bottom: 0.5em; color:#e98300; }
h2 { font-size: 1.67em; line-height: 1; margin-bottom: 0.58em; color:#e98300; }
h3 { font-size: 1.34em; font-weight: bold; margin-bottom: 1.25em; color:#e98300; }
h4 { font-size: 1.17em; font-weight:bold; }

p				{ line-height:1.5em; margin: 0 0 2.5em 0; }
p.last			{ margin-bottom: 0; }

ul, ol			{ margin:0 1.5em 1.5em 1.5em; }
ul				{ list-style: disc; }
ol				{ list-style-type: decimal; }

/*other font used in: */
h1, h2, 
#navMain, #breadcrumb li:first-child, 
#questions label,
#navFooter li,
.profitAmount,
#introLine { font-family: "Fedra Serif A Book 3-disabled", Georgia, "lucida bright", "Times New Roman", Times, serif; font-style:normal; font-weight: normal; font-stretch: normal; }



/* back normal in: */
#navFooter li ul li { font-family: Helvetica, Geneva, Arial, sans-serif; }

/*Tel Bart Plessers ivm lettertype - font-sizes staan nu voor Georgia ingesteld, als Fedra -> aanpassen */
/*Fedra rendert niet mooi - voorlopig Georgia*/
/*zie ook regel 110 voor main nav en regel 209 voor footer*/

/* ------------------------------------------------------------------------------------- 1. Structure -------------------------------------------- */

body		{ background: #fff; }
#container	{ padding: 0; }

/* fixed header afgezet op 20121114 -> headerWrapper (position:fixed) en mainWrapper (margin-top:110px) */

#headerWrapper { /*position:fixed; top:0;z-index:10; */ height: 110px; width:100%; background: #FFF; border-top: 5px solid #e98300; }
#header	{ height: 110px; position: relative; background: url(../img/css-backgrounds/hr-thick.gif) repeat-x left bottom;  }
	  
#mainWrapper { background: #FFF; /*margin-top:110px;*/ }
#main	{ }
	#breadcrumb	{ margin: 14px 10px 0 10px; width:920px; }
	#colLeft	{ margin-top: 40px; padding-top: 5px; }
	#content	{ margin-top: 40px; padding-bottom: 30px; position: relative; }
		#colCenter	{ }
		#colRight	{ margin-right: 0px; }
		
#questionsWrapper	{ background: #747678; clear: both; color:#FFF; padding: 30px; }
#questions	{  padding-left:10px; padding-right:10px; }

#footer	{ clear: both; padding: 30px; background:#e98300; }


/* ------------------------------------------------------------------------------------- 2. Header ----------------------------------------------- */

/* logo */
#logo { float: left; border: none; text-decoration:none; margin: 38px 0 0 0px; width:169px; height:54px; }
#logo img {}
.nl #baseline { height:20px; background: url(../img/css-backgrounds/nl/logo-baseline.gif) no-repeat 0px 0px;}
.fr #baseline { height:20px; background: url(../img/css-backgrounds/fr/logo-baseline.gif) no-repeat 0px 0px;}

/* lists in header*/
#header ul { list-style-type:none; }

/* functional navigation */
#navFunctional { float: right; margin: 0;  }
#navFunctional li { display: block; float: left; font-size: 12px; line-height: 1; padding: 5px 8px; background-color: #eff0ef; margin-left:10px; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; }
#navFunctional li.login { background-color: #747678; }
#navFunctional li.language { background-color: #fff; }
#navFunctional li.contact { background-color: #e98300; }
#navFunctional li.kantoren { background-color: #e98300; }
#navFunctional li.afspraak { background-color: #99ccff; }
#navFunctional a { color:#fff; text-decoration: none; }
#navFunctional a:hover { text-decoration: underline; }
#navFunctional li.language a,
#navFunctional li.videos a { color:#747678; }
#navFunctional li.wordfinotheker a { color:#747678; }
#navFunctional li.blog a { color:#747678; }
#navFunctional li.afspraak a { color:#fff; }
#navFunctional li.language a.active { color:#e98300; }

/* main navigation */
#navMain { position:absolute; left:240px; top: 74px; margin:0;}
#navMain li { float: left; font-size:20px; padding-left:20px;
 /* voor Fedra Serif A : font-size:18px; padding-left:16px; - indien toch Georgia: font-size:20px; padding-left:20px; */ }
#navMain li:first-child { padding-left:0;}
#navMain a { color:#747678; text-decoration:none; }
#navMain li.active { }
#navMain li.active a { color:#e98300; }
#navMain a:hover { color:#e98300; }

#btnAppointment { position:absolute; top: 70px; right:0px; 
background-color:#99ccff; color: #FFF; font-weight:bold; text-decoration:none; text-align:center; padding:6px 15px 6px 15px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; }
a#btnAppointment:hover { background-color:#e98300; }
a#btnAppointment.active { background-color:#e98300; }
/* ------------------------------------------------------------------------------------- 3. Breadcrumb ------------------------------------------- */

/* ul id breadcrumb */
#breadcrumb { list-style-type:none; background: #eff0ef; padding: 8px 10px 8px 10px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; }
#breadcrumb li { float: left; padding: 0.16em 0.75em 0 0.75em ; }
#breadcrumb li a { color:#747678; text-decoration:none; }
#breadcrumb li a:hover { color:#e98300; }
#breadcrumb li:first-child { background: url(../img/css-backgrounds/crumbtrail-arrow.gif) no-repeat right top; padding: 0 1.75em 0 0; }
#breadcrumb li:first-child a { color:#e98300; font-size: 1.17em; }

/* no breadcrumb on make an appointment page*/
body#makeAppointment #breadcrumb { background: #fff; height:17px; }
body#makeAppointment #breadcrumb li { display:none; }

/* ------------------------------------------------------------------------------------- 4. colLeft ----------------------------------------------- */
#colLeft #navSubTitle { font-size:1.17em; font-weight:bold; color:#e98300; padding-left:10px; }
#navSub { list-style-type:none; margin: 6px 0 0 0;}
#navSub li { display:block; padding: 10px;
	background: url(../img/css-backgrounds/hr-thin.gif) repeat-x top;
}
#navSub a { padding-left:25px; display:block;
	background: url(../img/css-backgrounds/bg-arrow-subnav.gif) no-repeat 0px 0px;
	font-style: italic; color:#747678; text-decoration:none;
}
#navSub li.active a, #navSub li a:hover  {
	background-position:  -274px 0px; color:#e98300; font-weight:bold;
}

/* ------------------------------------------------------------------------------------- 5. Content --------------------------------------------- */
#content { background-color:#FFF; }
#content a, #content a:link, #content a:active { font-weight:bold; }

#content ul, #content ol { margin-bottom: 2.5em; }
#content ul li, #content ol	li { margin-bottom: 1em; line-height:1.5em; }
#content ul h3, #content ol	h3 { font-size:1.33em; font-weight:bold; color:#747678; margin-bottom:0.15em ; }
#content ul.withTitles { list-style-type:none; }

#content p img.left { margin: 2px 10px 10px 0; }
#content p img.right { margin: 2px 0 10px 15px; }

.contentColWrapper { margin-bottom: 2.5em; display:block; }
#content .contentColWrapper { display:block; clear:both; }

.contentColWrapper .boxType01, .contentColWrapper .boxType02 { padding: 25px; margin-bottom:10px; }
.contentColWrapper .boxType01 p, .contentColWrapper .boxType02 p { margin: 0 0 1em 10px; }

#intro { width: 540px;  display: block; }

/* ------------------------------------------------------------------------------------- 6. Questions --------------------------------------------- */

#questions label { font-size: 1.67em; display: inline; margin-right: 20px; text-align:right; }
#questions textarea, #questions input { font-size: 1em; background: #ffffff; border-color:#ffffff; color:#747678; padding:1px 10px; border-bottom-width:0px; }
#questions textarea { width:436px; padding-top:10px; margin-bottom:10px;  }
#questions input[type="text"] { height: 18px; }
#questions input { width:347px; margin-right:10px; float:left; }

#questions .btnSubmit, #questions button.btnSubmit {
	background: #e98300 url(../img/css-backgrounds/bg-btn-submitQ.gif) no-repeat scroll 0px 0px;
	width: 79px; height: 23px;
	font-size:12px; font-weight: bold; color: #FFFFFF;
	border: none; cursor: pointer; 
	text-align:center; padding:0;
	}
#questions a.btnSubmit:hover, #questions button.btnSubmit:hover {
	background-position: 0px -26px;
	color:#747678; background-color:#d7d8d6;
	}

/* ------------------------------------------------------------------------------------- 7. Footer ----------------------------------------------- */
#footer {}
#footer ul { list-style-type:none; margin:0; }

#credentials { color:#fff; font-size:0.9em; width: 220px; float: left; position: relative; margin-left: 10px; margin-right: 20px; }
#credentials img { display:block; margin-bottom:7px; }
#credentials a { color:#fff; text-decoration:underline; font-size:0.9em; border:none; }

#navFooter	{ float: left; position:relative; }
#navFooter li { font-size: 20px; width: 220px; }
#navFooter li ul { margin:0 0 16px 0; }
#navFooter li ul li { font-size: 14px; }
#navFooter li a { color:#fff; text-decoration:none; border-bottom: 2px solid #a96000; display:block;   padding: 0.25em 0; }
#navFooter li a:hover { background-color: #a96000; }

#navFooter li.item1 {  }
#navFooter li.item2 {  }
#navFooter li.item3 { float: left; position: absolute; top:0; left:240px; }
#navFooter li.item4 { float: left; position: absolute; top:0; left:480px; }
#navFooter li.item5 { position: relative; left:480px;  top: -3.1em; /*-3.1em bij georgia -3.3em bij Fedra Serif A*/ }

/* ------------------------------------------------------------------------------------- 8. Miscellaneous ---------------------------------------- */

.imgReplaced { background-repeat: no-repeat; display: block; outline: none; text-indent: -9999px; }

.left	{ float: left; }
.right	{ float: right; }
.clear	{ clear: both; }
.hide	{ display: none; }
.first	{ margin-top: 0; padding-top: 0; }
.last	{ margin-bottom: 0; padding-bottom: 0; }
.block  { display: block; }

hr { display: none; }

/* clearfix */
.clearfix:after {
	clear: both;
	content: ".";
	display: block;
	height: 0;
	visibility: hidden;
}

/* colors */
.orange { color:#e98300; }
.grey { color:#747678; }
.blue { color:#99ccff; }

/*rounded corners */
.roundedC {
    -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
}
/* blokken met gekleurde achtergrond*/
.boxType01, .boxType02, .boxType03 { padding: 10px; position:relative; }
.boxType01 { background-color: #eff0ef; /*bg grey*/ }
.boxType02 { background-color: #99ccff;  color:#333;  /*bg blue*/ }
.boxType03 { background-color: #fff; }
.boxType02 h2, .boxType03 h3 { color:#333; }

.boxType01:after, .boxType02:after, .boxType03:after {
	clear: both; content: "."; display: block; height: 0; visibility: hidden;
}

/* list type 01 */
ul.listType01 { font-weight: bold; list-style-type:none; margin:0; }
.listType01 li { background: transparent url(../img/css-backgrounds/arrow-ul-type-01.png) no-repeat scroll left 3px; padding-left: 13px; margin-bottom: 0.75em; }
.listType01 a { color:#e98300; }
.listType01 a:hover { color:#747678; }
/* list type 02 */
ul.listType02 { list-style-type:none; margin:0; }
.listType02 li { background: transparent url(../img/css-backgrounds/arrow-ul-news.png) no-repeat scroll left top; padding-left: 15px; margin-bottom: 0.75em; }
.listType02 a { color:#747678; text-decoration:none; }
.listType02 a:hover { color:#e98300; }


/* ---------button types--------------------------------------------- */
/* submit */
.btnSubmit, button.btnSubmit {
	background: #e98300 url(../img/css-backgrounds/bg-btn-submit.gif) no-repeat scroll 0px 0px; 
	width: 130px; height: 32px; position:relative; 
	color: #FFFFFF; font-size: 14px; font-weight: bold;
	border: none; cursor: pointer; text-align:left; padding: 0 0 0 20px; }
a.btnSubmit:hover, button.btnSubmit:hover {
	background-position: 0px -35px; background-color:#747678; }
/* submit, longer */
#simulation .btnSubmit, #simulation button.btnSubmit {
	background: #e98300 url(../img/css-backgrounds/bg-btn-submit-180.gif) no-repeat scroll 0px 0px; width: 180px; }
#simulation a.btnSubmit:hover, #simulation button.btnSubmit:hover {
	background-position: 0px -35px; background-color:#747678; }

/* ------ */
.btnType01, .btnType01A, .btnType01Ad, .btnType01Au, .btnType02, .btnType02Small {
	text-decoration:none; display:block; float:right;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
}
/*Type 01:  for more info etc.
small buttons / bg orange > bg grey on hover */ 
.btnType01, a.btnType01, .btnType01A, a.btnType01A, .btnType01Ad, a.btnType01Ad, .btnType01Au, a.btnType01Au { line-height:1em; padding: 5px 12px; background-color: #e98300; color:#fff; }
a.btnType01:link, a.btnType01:visited, a.btnType01A:link, a.btnType01A:visited, a.btnType01Ad:link, a.btnType01Ad:visited, a.btnType01Au:link, a.btnType01Au:visited  { color:#FFF; }
a.btnType01:hover, a.btnType01A:hover, a.btnType01Ad:hover, a.btnType01Au:hover { background-color: #747678; }
/*Type 01A = + Arrow right / 01Ad = + Arrow down / 01Au = + Arrow up */
.btnType01A, a.btnType01A, .btnType01Ad, a.btnType01Ad, .btnType01Au, a.btnType01Au { 
font-size:12px; line-height:12px; padding-right: 25px; }
a.btnType01A:hover, a.btnType01Ad:hover, a.btnType01Au:hover { background-position: right bottom; }
.btnType01A, a.btnType01A { background: #e98300 url(../img/css-backgrounds/sprite-arrow-right.png) no-repeat right top; }
.btnType01Ad, a.btnType01Ad { background: #e98300 url(../img/css-backgrounds/sprite-arrow-down.png) no-repeat right top; }
.btnType01Au, a.btnType01Au { background: #e98300 url(../img/css-backgrounds/sprite-arrow-up.png) no-repeat right top; }

.boxType02 a.btnType01, .boxType02 a.btnType01:link, .boxType02 a.btnType01:visited { background-color: #fff; color:#747678;}
.boxType02 a.btnType01:hover { background-color: #747678; color:#fff; }


/*Type 02: grey btns, big */
.btnType02, .btnType02Small {
	text-decoration:none; display:block; float:left;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
}
.btnType02, a.btnType02 { 
color:#FFF; font-size:1.167em; line-height:1.167em; padding: 0.8em 1.17em;
background-color: #747678;  min-width:130px; margin-right:10px; text-align:center; }
a.btnType02:link, a.btnType02:visited { color:#FFF; }
a.btnType02:hover { background-color: #e98300; color:#fff; }
/*Type 02Small: */
.btnType02Small, a.btnType02Small { 
color:#FFF; line-height:1em; padding: 5px 12px; background-color: #747678; }
a.btnType02Small:link, a.btnType02Small:visited { color:#FFF; }
a.btnType02Small:hover { background-color: #e98300; color:#fff; }

/* Button type 03: light grey, small */
.btnType03 {
	text-decoration:none; display:block; float:left;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;
}
.btnType03, a.btnType03 { 
color:#FFF; font-size:12px; font-weight: bold; line-height:1em; padding: 5px 8px;
background-color: #b1b3b3; min-width:130px; margin-right:10px; text-align:center; }
a.btnType03:link, a.btnType03:visited { color:#FFF; }
a.btnType03:hover { background-color: #e98300; color:#fff; }


/*---------- tooltip ------------------------------------------------------*/
a.tt { position:relative; z-index:24; color:#747678; text-decoration:none; border-bottom: 1px dotted #747678; }
a.tt span { display: none; }
a.tt:hover { z-index:25; color:#e98300; }
a.tt:hover span.tooltip {
	display: block; position: absolute; bottom: 1.17em; left: 0px; width: 300px; 
	color: #fff; font-weight:normal; 
	background: url(../img/css-backgrounds/bg-tooltip-bttm.png) no-repeat left bottom; 			-moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; }
a.tt:hover span.ttContent {
	background-color: #e98300;
	display: block; padding: 15px 15px 25px 15px; margin-bottom:10px; }

h4 a.tt { color:#e98300; border-bottom: 1px dotted #e98300; }
h4 a.tt:hover span.tooltip { font-size:12px; position: absolute; bottom: 18px; }

/*---------- pannels  --------------------------------------------------*/
.pannels {  }


/* ------------------------------------------------------------------------------------- 9. simulaties ----------------------------------------------- */
#simulation { background: #eff0ef url(../img/css-backgrounds/bg-simulatie-top.gif) no-repeat top; padding:10px 0 0 0; margin-bottom:10px;
}
#simulation .step, #simulation .stepLast { padding:10px 5px; margin-left: 10px; margin-right: 10px; }
#simulation .step { border-bottom: 2px solid #FFF; }
#simulation .stepLast { border-bottom: none; }

#simulation p { margin-bottom:1em; }
#simulation ul { margin-bottom:1em; }
#simulation ul li { margin-bottom:0; }
#simulation h2 { margin-bottom:0; }
#simulation h3 { font-size:1.17em; margin-bottom:0.75em; }
#simulation h4 { font-size:1em; margin-bottom:1em; }

.step .boxType02, .step .boxType03 { -moz-border-radius: 3px; -webkit-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;  }
#simulation .boxType02 h3 { color:#333;}

/* extra blok info onder simulatie blok------------------------*/
#extraInfo { background: #EFF0EF;  margin-bottom: 20px; padding: 15px; }
#extraInfo ul { margin-bottom: 0.25em; }
#extraInfo ul li { margin-bottom: 0; }
#extraInfo h3 { font-size: 1.17em; margin-bottom: 0.75em; }

/* simulation stepYou ----------------------------------------*/
#simulation #stepYou {  padding:10px 5px; margin-left: 10px; margin-right: 10px; border-bottom: none; }
#stepYou h3 {  }
#stepYou div { margin-top:0.75em; }
#stepYou div.first { margin-top:2.0em; }
#stepYou label { font: normal 1.17em Helvetica, Geneva, Arial, sans-serif; padding-top: 5px; width: 240px; }
#stepYou input[type="text"] {
	background: #fff; color:#747678;
	font: normal 1.17em Helvetica, Geneva, Arial, sans-serif;
	padding: 3px 10px 0 3px;
	text-align:right; width:150px;
}
#stepYou .formError { font-size: 1em;  margin-left: 10px; margin-top: 20px; }
#simulation button.btnSubmit { margin-left:40px;  }
#stepYou .result { font: normal 1.17em Helvetica, Geneva, Arial, sans-serif; }

/* simulation stepProfit ----------------------------------------*/
#simulation #stepProfit { }
#stepProfit h3 { border-top: 2px solid #FFFFFF; padding:10px 5px 0 5px; margin:0 10px 0 10px; }
#stepProfit .stepBttm { border-bottom: 2px solid #FFFFFF; margin-left: 10px; margin-right: 10px; }

#profit { background: url(../img/css-backgrounds/bg-simu-profit-top.png) no-repeat left top; padding:0; }
#profitBttm { background: url(../img/css-backgrounds/bg-simu-profit-bttm.png) no-repeat left top; height:27px; }

#profitContent { padding: 20px 0 0 35px; }
#profitContent .box01, #profitContent .box02, #profitContent .box03 { width:175px; float:left; font-size:12px; }
#profitContent .box01 { }
#profitContent .box02 { margin-left:57px; }
#profitContent .box03 { margin-left:46px;  }

#profitContent h4 { font-size:12px; color:#333; text-align:center; height:30px; }
#profitContent strong { }
#profitContent .box02 strong, #profitContent .box03 strong { color:#e98300; }
#profitContent span { width:70px; display:inline-block; }
#profitContent p { margin-bottom: 5px; }
#profitContent p.profitAmount {
	background: url(../img/css-backgrounds/hr-profitAmount.gif) no-repeat left top;
	padding-top: 5px; text-align:center; 
}
#profitContent .profitAmount { color:#e98300; font-size:24px; }
#profitContent .box01 .profitAmount { color:#747678; }

span.risq00, span.risqLow01, span.risqLow02, span.risqLow03, span.risqLow04, span.risqLow05,
.risqMid01, span.risqMid02, span.risqMid03, span.risqMid04, span.risqMid05,
span.risqHigh01, span.risqHigh02, span.risqHigh03, span.risqHigh04, span.risqHigh05 { width:46px; height:15px; background:url(../img/css-backgrounds/sprite-risq-scale.png) no-repeat; }
#profitContent span.risq00 { background-position: 0px 0px ; }
#profitContent span.risqLow01 { background-position: 0px -100px; }
#profitContent span.risqLow02 { background-position: 0px -115px; }
#profitContent span.risqLow03 { background-position: 0px -130px; }
#profitContent span.risqLow04 { background-position: 0px -145px; }
#profitContent span.risqLow05 { background-position: 0px -160px; }
#profitContent span.risqMid01 { background-position: 0px -200px; }
#profitContent span.risqMid02 { background-position: 0px -215px; }
#profitContent span.risqMid03 { background-position: 0px -230px; }
#profitContent span.risqMid04 { background-position: 0px -245px; }
#profitContent span.risqMid05 { background-position: 0px -260px; }
#profitContent span.risqHigh01 { background-position: 0px -300px; }
#profitContent span.risqHigh02 { background-position: 0px -315px; }
#profitContent span.risqHigh03 { background-position: 0px -330px; }
#profitContent span.risqHigh04 { background-position: 0px -345px; }
#profitContent span.risqHigh05 { background-position: 0px -360px; }

/* simulation stepOptions -----------------------------------------*/
#simulation #stepOptions {}
#stepOptions h3 { border-top: 2px solid #FFFFFF; padding:10px 5px 0 5px; margin:0 10px 0 10px; }
#stepOptions .stepBttm { }

#options {
	background: url(../img/css-backgrounds/bg-simulatie-3boxes-top.png) no-repeat left top; padding:0; min-height:180px; }
#optionsBttm {
	background: url(../img/css-backgrounds/bg-simulatie-3boxes-active0.png) no-repeat 0px 0px;
	height:176px; clear:both;
}
#optionsBttm.active0 { background: url(../img/css-backgrounds/bg-simulatie-3boxes-active0.png) no-repeat left top; }
#optionsBttm.active1 { background: url(../img/css-backgrounds/bg-simulatie-3boxes-active1.png) no-repeat left top; }
#optionsBttm.active2 { background: url(../img/css-backgrounds/bg-simulatie-3boxes-active2.png) no-repeat left top; }
#optionsBttm.active3 { background: url(../img/css-backgrounds/bg-simulatie-3boxes-active3.png) no-repeat left top; }

#optionsContent { padding: 17px 0 0 25px; }
#optionsContent .box01, #optionsContent .box02, #optionsContent .box03 { width:190px; float:left; font-size:12px; }
#optionsContent .box01 a, #optionsContent .box02 a, #optionsContent .box03 a { float:none; }
#optionsContent .box01 { }
#optionsContent .box02 { margin-left:40px; }
#optionsContent .box03 { margin-left:38px;  }

#optionsContent h4 { font-size:16px; line-height:18px; color:#e98300; text-align:center; height:35px; vertical-align:middle; margin-bottom:20px; }
#optionsContent h4 span { vertical-align:middle; }
#optionsContent .boxType01 { margin-bottom:15px; height:65px; overflow:visible; }
#optionsContent p { margin-bottom: 5px; }
#optionsContent a.btnType01Ad  { margin-left:25px; width:100px; background-color: #747678; }
#optionsContent a.btnType01Ad:hover { background-color:#e98300; }
#optionsContent p.active a.btnType01Ad { background-color:#e98300; }

/*-------------share-----------------------------------------------*/
#share { background-color: #eff0ef; margin-left: auto; margin-right: auto; width: 360px; margin-bottom:10px; vertical-align:middle; padding:5px 6px 10px 10px; height: 16px; }
#share h3 { float:left; font-size:1em; }
#share span { float:right; }

/* ------------------------------------------------------------------------------------- 10. Consultation types ---------------------------------------- */

#pageConsultationType {}
#pageConsultationType h1 { margin-bottom: 20px;}
.consultationType { background: #f7f7f7; border-top: 1px solid #d7d8d6; min-height: 260px; position: relative;}
#pageConsultationType .consultationType { padding: 20px 20px 50px; width: 260px;} /* hoogte aangepast door marcel */
.consultationType h2 { border-top: 3px solid #e7e7e6; margin: -20px -20px 20px; padding: 15px 20px 0; font-size: 1.8em} /* font-size added by Marcel (All Directions) 2011/11/03 */
.tags { background: #fff; border: 1px solid #d7d8d6; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; display: inline-block; margin-bottom: 15px;}
.tags div { display: inline-block; padding: 3px 10px;}
.tags div.price { border-right: 1px solid #d7d8d6; color: #E98300; font-weight: bold; text-align: center; text-transform: uppercase; min-width: 40px;}
.tags span { color: #E98300; font-weight: bold;}
.consultationType h3 { margin-bottom: 5px;}
.consultationType a.btnType01A { bottom: 20px; position: absolute; right: 20px;}


/* ------------------------------------------------------------------------------------- 11. appointment ----------------------------------------------- */
#appointment { }
#appointment .step, #appointment #stepWho, #appointment #stepWhen { display:block; padding: 20px 0px; background: url(../img/css-backgrounds/hr-thin.gif) repeat-x bottom; }
#appointment #colCenter { background: url(../img/css-backgrounds/hr-thin.gif) repeat-x top; }
#appointment .selectedOffice { background: #f7f7f7 url(../img/css-backgrounds/hr-thin.gif) repeat-x top;
 padding:20px; }

#appointment .selectedOffice img.medewerkerfoto{display:block;width:70px;margin-bottom:6px;} /* added by All Directions*/
#appointment .selectedOffice span.medewerkernaam{display:block;font-weight:bold;} /* added by All Directions*/
#appointment .selectedOffice a.medewerkermail{font-weight:normal;} /* added by All Directions*/


#appointment #intro { margin-bottom:20px; }

#appointment #stepWho label, #stepWho .fakeLabel { font-size:14px; }
#stepWho div { margin-bottom:8px; }

#stepWhen { font-size:1.167em; }
#appointment .formInfo { width:320px; float:left; }
#appointment .formError { width:320px; color:#e98300; display:inline-block; }
#appointment .formError p { margin-bottom:0.2em; }

/* select hours */
#selectHours {
	height: 40px; width: 460px; padding: 3px 0 0 3px; margin:10px 0;
	background: url(../img/css-backgrounds/bg-select-hours.png) no-repeat left top;
}
#selectHours span { display:inline-block; width: 16px; padding:0;
	background: url(../img/css-backgrounds/sprite-select-hours.png) no-repeat 0px 0px;
	padding: 38px 0 0 0; font-size:10px; text-align:center;
}
#selectHours span.av0 { background-position:0px 0px; }
#selectHours span.av1 { background-position: -19px 0px; }
#selectHours span.av2 { background-position: -38px 0px; }


/* ------------------------------------------------------------------------------------- 12. Home ----------------------------------------------- */

/* 
    financialPlan werd uit general.css gehaald -> foute opmaak -> zie AD.css
    introLine -> font-size van 28 naar 30
    plancalculator -> margin-left:30px;
    planCalculator label -> width van 470 naar 440
*/

#home {}
#home #main { padding-top: 40px;}
/* row 1 */
#row1 { margin-bottom: 15px;}
/* titles */
#retirementPlan h1{ background: url(../img/css-backgrounds/sprite.png) no-repeat right 0; color: #fff; display: inline-block; font-size: 18px; height: 50px; padding: 0 120px 0 0;}
#retirementPlan h1 span{ background: url(../img/css-backgrounds/sprite.png) no-repeat left 0; display: inline-block; height: 41px; padding: 9px 0 0 13px;}
#retirementPlan ul.listType01{margin-left:30px;}
#introLine { color: #e98300; font-size: 30px; margin: 40px 0 20px 50px;} 
/* form plan calculator */
form#planCalculator { background: #eff0ef url(../img/css-backgrounds/bg-form-planCalculator.gif) no-repeat left bottom; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; margin-bottom: 40px; padding: 0 10px 15px;margin-left:30px;}
form#planCalculator div { border-bottom: 1px solid #fff; padding: 10px 0 10px 10px;}
form#planCalculator label { font-size: 12px; width: 440px;}
form#planCalculator input[type="text"] { background: #fff; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; font-size: 14px; padding: 0 0 0 3px; width: 107px;}
form#planCalculator span { font-size: 14px;}
form#planCalculator #fieldAge span { margin-left: -32px;}
form#planCalculator #fieldIncome input { margin-left: -15px; padding-left: 20px; width: 87px;}
form#planCalculator #fieldIncome span { margin-left: 8px; position: relative;}
form#planCalculator #btnSubmit { background: #eff0ef; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; float: right; margin-right: -10px; padding: 10px;}
form#planCalculator #btnSubmit input { background: url(../img/css-backgrounds/sprite-arrow-right.png) no-repeat 108px 4px #E98300; border: none; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; color: #fff; cursor: pointer; font-size: 15px; font-weight: bold; height: 30px; width: 130px;}
form#planCalculator #btnSubmit input:hover { background-color: #747678;}

/* row 2 */
#row2 { background: url(../img/css-backgrounds/bg-home-row2.jpg) no-repeat 10px top; height: 150px; margin-bottom: 30px; padding-top: 20px; }
/*#row2 #social { margin: 40px 0 0; }*/
#row2 #aboutFinotheker { position: relative;}
#row2 #aboutFinotheker div { margin: 25px 0 0 170px; width: 400px;}
#row2 #aboutFinotheker p { margin-right: 60px;}
#row2 #aboutFinotheker a.btnType03 { bottom: 30px; margin: 0; position: absolute; right: 10px;}
