﻿/* Sparen - Opbrengst overzicht (pensioensparen,...)
-----------------------------------------------------------------------------*/

#sparenresultaat{clear:both;padding-top:12px;}

#sparenresultaatgrafiek{padding:30px 0 45px 0;}

#sparenresultaatgrafiekyas{float:left;text-align:right;margin-right:6px;}
#sparenresultaatgrafiekcontent{float:left;width:412px;background:url(../Images/Sparen/SparenGrafiekBG.gif) no-repeat left bottom;padding-left:5px;padding-bottom:25px;}
#sparenresultaatgrafiekxas{clear:both;}

#sparenresultaatgrafiekyaswaarde1{margin-top:42px;}
#sparenresultaatgrafiekyaswaarde2{margin-top:32px;}

#sparenresultaatgrafiekcontent1{}
#sparenresultaatgrafiekcontent1a{float:left;height:26px;line-height:26px;margin-top:10px;background:#8b8178;}
#sparenresultaatgrafiekcontent1b{float:left;height:26px;line-height:26px;margin-top:10px;background:#009b3a;color:#fff;font-weight:bold;text-align:center;font-size:15px;}
#sparenresultaatgrafiekcontent1c{float:left;height:26px;line-height:26px;margin-top:10px;font-weight:bold;color:#8b8178;padding-left:9px;font-size:20px;}
#sparenresultaatgrafiekcontent2{clear:left;}
#sparenresultaatgrafiekcontent2a{float:left;height:26px;line-height:26px;margin-top:22px;background:#8b8178;}
#sparenresultaatgrafiekcontent2b{float:left;height:26px;line-height:26px;margin-top:22px;font-weight:bold;color:#8b8178;padding-left:9px;font-size:20px;}


#sparenresultaatgrafiekyaslabel{height:26px;line-height:26px;margin-left:9px;}
#sparenresultaatgrafiekxaslabel{float:left;padding-left:470px;}

#sparenresultaatbedrag{float:right;font-size:18px;color:#333333;line-height:1.1;padding:60px 10px 0 0;text-align:center;font-weight:bold;}
#sparenresultaatbedrag div.bedrag{color:#009b3a;font-size:40px;}


/* Sparen huis - Opbrengst 
-----------------------------------------------------------------------------*/

/* 1 jaar */

#sparenhuisresultaat1jaar{clear:both;}

#sparenhuisresultaat1jaargrafiek{padding:0;}

#sparenhuisresultaat1jaargrafiekyas{float:left;text-align:right;margin-right:6px;}
#sparenhuisresultaat1jaargrafiekcontent{float:left;width:402px;background:url(../Images/Sparen/SparenGrafiekBG3.gif) no-repeat left bottom;padding-left:5px;padding-bottom:15px;}
#sparenhuisresultaat1jaargrafiekxas{clear:both;}

#sparenhuisresultaat1jaargrafiekyaswaarde1{margin-top:40px;}
#sparenhuisresultaat1jaargrafiekyaswaarde2{margin-top:12px;}
#sparenhuisresultaat1jaargrafiekyaswaarde3{margin-top:12px;}

#sparenhuisresultaat1jaargrafiekcontent1{}
#sparenhuisresultaat1jaargrafiekcontent1a{float:left;height:26px;line-height:26px;margin-top:10px;background:#009b3a;}
#sparenhuisresultaat1jaargrafiekcontent1b{float:left;height:26px;line-height:26px;margin-top:10px;font-weight:bold;color:#8b8178;padding-left:9px;font-size:20px;}
#sparenhuisresultaat1jaargrafiekcontent2{clear:left;}
#sparenhuisresultaat1jaargrafiekcontent2a{float:left;height:26px;line-height:26px;margin-top:1px;background:#8b8178;}
#sparenhuisresultaat1jaargrafiekcontent2b{float:left;height:26px;line-height:26px;margin-top:1px;background:#fff;}
#sparenhuisresultaat1jaargrafiekcontent2c{float:left;height:26px;line-height:26px;margin-top:1px;font-weight:bold;color:#8b8178;padding-left:9px;font-size:20px;}
#sparenhuisresultaat1jaargrafiekcontent3{clear:left;}
#sparenhuisresultaat1jaargrafiekcontent3a{float:left;height:26px;line-height:26px;margin-top:1px;background:#8b8178;}
#sparenhuisresultaat1jaargrafiekcontent3b{float:left;height:26px;line-height:26px;margin-top:1px;background:#99ccff;color:#fff;font-weight:bold;text-align:center;font-size:15px;}
#sparenhuisresultaat1jaargrafiekcontent3c{float:left;height:26px;line-height:26px;margin-top:1px;font-weight:bold;color:#8b8178;padding-left:9px;font-size:20px;}


#sparenhuisresultaat1jaargrafiekyaslabel{height:26px;line-height:26px;margin-left:9px;}
#sparenhuisresultaat1jaargrafiekxaslabel{float:left;padding-left:470px;}

#sparenhuisresultaat1jaarbedrag{float:right;font-size:18px;color:#333333;line-height:1.1;padding:30px 20px 0 0;text-align:right;font-weight:bold;}
#sparenhuisresultaat1jaarbedrag div.bedrag{color:#009b3a;font-size:40px;}


/* 2 jaar */

#sparenhuisresultaat2jaar{clear:both;}

#sparenhuisresultaat2jaargrafiek{padding:0;}

#sparenhuisresultaat2jaargrafiekyas{float:left;text-align:right;margin-right:6px;}
#sparenhuisresultaat2jaargrafiekcontent{float:left;width:402px;background:url(../Images/Sparen/SparenGrafiekBG3.gif) no-repeat left bottom;padding-left:5px;padding-bottom:15px;}
#sparenhuisresultaat2jaargrafiekxas{clear:both;}

#sparenhuisresultaat2jaargrafiekyaswaarde1{margin-top:40px;}
#sparenhuisresultaat2jaargrafiekyaswaarde2{margin-top:12px;}
#sparenhuisresultaat2jaargrafiekyaswaarde3{margin-top:12px;}

#sparenhuisresultaat2jaargrafiekcontent1{}
#sparenhuisresultaat2jaargrafiekcontent1a{float:left;height:26px;line-height:26px;margin-top:10px;background:#009b3a;}
#sparenhuisresultaat2jaargrafiekcontent1b{float:left;height:26px;line-height:26px;margin-top:10px;font-weight:bold;color:#8b8178;padding-left:9px;font-size:20px;}
#sparenhuisresultaat2jaargrafiekcontent2{clear:left;}
#sparenhuisresultaat2jaargrafiekcontent2a{float:left;height:26px;line-height:26px;margin-top:1px;background:#8b8178;}
#sparenhuisresultaat2jaargrafiekcontent2b{float:left;height:26px;line-height:26px;margin-top:1px;background:#fff;}
#sparenhuisresultaat2jaargrafiekcontent2c{float:left;height:26px;line-height:26px;margin-top:1px;font-weight:bold;color:#8b8178;padding-left:9px;font-size:20px;}
#sparenhuisresultaat2jaargrafiekcontent3{clear:left;}
#sparenhuisresultaat2jaargrafiekcontent3a{float:left;height:26px;line-height:26px;margin-top:1px;background:#8b8178;}
#sparenhuisresultaat2jaargrafiekcontent3b{float:left;height:26px;line-height:26px;margin-top:1px;background:#99ccff;color:#fff;font-weight:bold;text-align:center;font-size:15px;}
#sparenhuisresultaat2jaargrafiekcontent3c{float:left;height:26px;line-height:26px;margin-top:1px;font-weight:bold;color:#8b8178;padding-left:9px;font-size:20px;}


#sparenhuisresultaat2jaargrafiekyaslabel{height:26px;line-height:26px;margin-left:9px;}
#sparenhuisresultaat2jaargrafiekxaslabel{float:left;padding-left:470px;}

#sparenhuisresultaat2jaarbedrag{float:right;font-size:18px;color:#333333;line-height:1.1;padding:30px 20px 0 0;text-align:right;font-weight:bold;}
#sparenhuisresultaat2jaarbedrag div.bedrag{color:#009b3a;font-size:40px;}


/* Sparen - Opbrengst detail (pensioensparen,...)
-----------------------------------------------------------------------------*/

#sparendetail{}

#sparendetail table{
    width: 100%;
    border-collapse: collapse;
    border:none;
	margin-top:18px;
	margin-bottom:0;
}   

#sparendetail table th{
    background:#8b8178;
    color:#fff;
	padding:9px;
	vertical-align:top;
	font-weight:normal;
}

#sparendetail table th.col1{border-right:solid 1px #fff;border-left:solid 1px #8b8178;padding-right:50px;}
#sparendetail table th.col2{border-right:solid 1px #fff;}
#sparendetail table th.col3{border-right:solid 1px #8b8178;}

#sparendetail table td.empty{
	background:#fff;
	border:none;
	padding:0;margin:0;
} 

#sparendetail table td{
    border:solid 1px #8b8178;
    padding:4px 30px 4px 15px;
}   

#sparendetail table td.highlight{background:#e4e2de;}  
#sparendetail table td.bold{font-weight:bold;}  
#sparendetail table td.right{text-align:right;}  
#sparendetail table td.icons{padding:4px;border-bottom:none;border-top:none;}
#sparendetail table td.bordertop{border-top:solid 1px #8b8178;}
#sparendetail table td.borderbottom{border-bottom:solid 1px #8b8178;}

a.go1:link,a.go1:visited,a.go1:active,a.go1:hover{
	display:block;
	float:left;
	background: url(../Images/Buttons/BtnNext.jpg) no-repeat;
	width:19px;
	height:19px;
	text-decoration:none;
}

a.pographshow:link,a.pographshow:visited,a.pographshow:active,a.pographshow:hover{
	display:block;
	float:left;
	background: url(../Images/Buttons/BtnGraph.jpg) no-repeat;
	width:19px;
	height:19px;
	text-decoration:none;	
	margin-right:3px;
}

#pograph{
	display: none;
	width: 460px;
	border:none;
	padding:0;
	margin:0;
	 background:transparant;
	/*-moz-border-radius: 10px;*/
	z-index: 1000;
	position:relative;

	top:-540px;
	left:150px;
} 

#closewindow{
	position:absolute;
	left:424px;
	top:-16px;
	cursor:pointer;
	background:url(../Images/Buttons/ButtonClosePupUp.gif) no-repeat left top;
	width:36px;
	height:36px;
}
#pographcontent{
	border:solid 1px #333333;
	width:442px;
	background:#fff;
}

#pographheader{padding:20px;background:#f5f1f0;font-size:18px;text-align:center;line-height:1.3;}

#pograph table{
	width:auto;
	border-collapse: collapse;
    border:none;
    margin-left:60px;
	margin-top:36px;
	margin-bottom:30px;
}

#pograph table td{border:none;vertical-align:bottom;text-align:center;font-size:14px;width:160px;margin:0;padding:0;}

#pograph table td.bottom{vertical-align:bottom;}
#pograph table td.top{vertical-align:top;}

#pograph table td.borderleft{border-left:solid 2px #333333;}
#pograph table td.borderbottom{border-bottom:solid 2px #333333;}

#graphblok1{background:#009b3a;width:60px;height:155px;display:inline-block;}
#graphblok2{background:red;width:60px;height:85px;display:inline-block;}

#graphvalue2{padding:12px 0 6px 0;font-weight:bold;font-size:18px;color:#009b3a;}
#graphvalue3{padding:12px 0 6px 0;font-weight:bold;font-size:14px;color:red;}


/* sparen - popup detail 
-----------------------------------------------------------------------------*/


#podetailsparen{
	display: none;
	width: 550px;
	border:none;
	padding:0;
	margin:0;
	 background:transparant;
	/*-moz-border-radius: 10px;*/
	z-index: 1000;
	
	/*position:absolute;*/
	position:relative;
	top:-450px;
	left:150px;
} 

#podetailsparenclosewindow{
	position:absolute;
	left:514px;
	top:-16px;
	cursor:pointer;
	background:url(../Images/Buttons/ButtonClosePupUp.gif) no-repeat left top;
	width:36px;
	height:36px;
}

#podetailsparencontent{
	border:solid 1px #333333;
	width:532px;
	background:#fff;
}

#tabelpodetailsparentablecontainer{width:100%;border-collapse:collapse;border:none;}
#tabelpodetailsparentablecontainer td{padding:3px 12px;}
#tabelpodetailsparentablecontainer td.col1{width:45%;background:#009b3a;color:#fff;font-weight:bold;}
#tabelpodetailsparentablecontainer td.col2{width:55%;}

#tabelpodetailsparentablecontainer table.innertable{width:auto;}
#tabelpodetailsparentablecontainer table.innertable td{padding:0;margin:0;}

