@import url('reset.css');
@import url('jquery.css');

/* -------------------------------------------------------------- 

   print.css
   
   #header, #footer, #navigation { display:none; }
   
-------------------------------------------------------------- */

html		{ height:100% }
body		{ font-size: .75em; font-family: Verdana, Helvetica, Sans-Serif; background:#f3f3f3 url(../images/bg_body.gif) 0px bottom repeat-x fixed; }
#wrapper	{ width:959px; margin:0 auto; position:relative; padding-bottom:20px}
h2			{ font-size: 1.5em;	font-weight:bold; padding:8px 0 12px 0;}
h3			{ font-size: 1.2em;	font-weight:bold; padding:8px 0 12px 0;}


/* Layout
-------------------------------------------------------------- */

#branding { display: none;	}

#siteNav { display: none; }

#btnTop { display: none; }

#extraInfo { display: none;}

#rightContent .linkHolder { display:none; }

a.back { display:none; }

#leftContent .buttonHolder { display:none; }

table.grid td.t3 .bttn.change { display:none; }

.xtrapaddingLeft { display:none; }

/*  ################################################################################################################
                                            MAINCONTENT 
    ################################################################################################################ */

#contentHolder								{ min-height:615px; border: none; background:#fff; position:relative; padding:14px 14px 10px 14px;float:left; width:929px;}		
#contentHolder .bottom						{ background:url(../images/bg_mainBottom.png) 0 0 no-repeat; width:959px; height:32px; display:block; position:absolute; bottom:-20px;left:-1px; }	
#contentHolder .top							{ background:url(../images/bg_mainTop.png) 0 0 no-repeat; width:959px; height:17px; display:block; position:absolute; top:-1px;left:-1px; }
#mainContent								{ min-height:100px; float:left; width:100%; margin:10px 0 10px 0;}

.balansHolder span.ammount					{ position:absolute;left:0; text-align:center; padding:5px 0 0 1px; color:#000;z-index:0; font-weight:bold; font-size:0.9em; white-space:nowrap;}
#doelbedragHolder p                         { clear:both;}

/* LEFTCONTENT*/
#leftContent								{ width:460px; float:left; }
#leftContent p								{ min-height:110px; padding-bottom:10px;}
#leftContent a.bttn							{ margin-right:10px;}

/* RIGHTCONTENT*/
#rightContent								{ min-height:100px; width:344px; float:right; }
#rightContent .linkHolder					{ margin:40px 0 16px 0;}	
#rightContent .linkHolder a					{ margin-right:10px;}	




/*  ################################################################################################################
                                            balansHolder
    ################################################################################################################ */
.balansHolder								{ width: 244px; height:23px; border: 1px solid #ccc;  background:none; position:relative;margin-bottom:10px;float:left;}
.balansHolder.big							{ height:23px; background:none;}
.balansHolder.big.orange					{ background-position:0 -66px }
td.active .balansHolder						{ background-position:0 0 }

.balansHolder div.toPay						{ width:50%; border-right: 1px solid #E3E3E3; height:23px;padding:0;margin:0px;float:left;position:relative;}
.balansHolder.big div.toPay					{ width:100px;background:none; height:21px;padding:0;margin:2px; float:left;position:relative;}

.balansHolder div.toPay span.background		{ display:inline-block; width:60px; background:#4693be; border-top: 21px solid #4693BE; height:0px; line-height: 0; font-size: 0; margin:1px;}	
*:first-child+html div.toPay span.background { margin: 2px 0 0 2px } /*IE7*/
.balansHolder span.ammount					{ position:absolute;margin-right:8px;padding-top:3px;color:black; font-weight:bold; font-size:0.9em}
.balansHolder span.ammount					{ text-align:center; }
.balansHolder span.toPay					{ position:absolute; bottom:-16px;right:-33px; width:70px; text-align:center;font-size:0.85em; color:#222; }

.balansHolder .credit						{ width:50%; background:none; height:21px;padding:0;margin:1px 0 0 0;float:left;position:relative}
.balansHolder .credit span					{ padding-top:2px;}
.balansHolder .payed span					{ display:inline-block; width:60px; background:#ff6600; height:21px;margin:1px;}	

.balansHolder .zero, 
.balansHolder .fullAmmount					{ position:absolute; bottom:-18px; left:0px; font-size:0.85em; color:#222;}
.balansHolder .fullAmmount					{ right:-25px; left:auto;}	
.jQueryTextShadow                           { display: none !important; visibility: hidden }

/*.balansHolder span						{ display:inline-block; position:absolute; top:0px; bottom:auto; padding-top:25px; font-size:0.9em; vertical-align:bottom; text-align:bottom;}*/
.balansHolder span.ammountToPay				{ left:75px;  background:url(../images/slider_spit.gif) 8px 0px no-repeat;}
.balansHolder span.fullAmmount				{ right:0px;}



/*  ################################################################################################################
                                            DOELBEDRAGHOLDER
    ################################################################################################################ */

#doelbedragHolder							{ width:314px; height:117px; background:url(../images/bg_doelbedragHolder.png) 0 0 no-repeat; padding:10px 14px 14px 14px}
#doelbedragHolder h2						{ font-size:1.2em; font-weight:bold; padding:0 0 8px 0; }
#doelbedragHolder p							{ font-size:0.95em;vertical-align:top; display:block;padding-bottom:2px;}
#doelbedragHolder p	span					{ vertical-align:top;}


/*  ################################################################################################################
                                            GRID TABLE 
    ################################################################################################################ */

table.grid, table.grid th, table.grid td	{ border:1px solid #ccc; border-collapse:collapse }
table.grid th								{ background:url(../images/bg_th.gif) 0 0 repeat-x; height:28px; color:#fff; font-weight:bold; padding-left:5px;}
table.grid td								{ padding: 7px 5px 10px 5px; vertical-align:top;}
table.grid .t1								{ width:230px;}
table.grid .t2								{ width:356px;}
table.grid td.t2							{ padding-left:35px; }
table.grid .t3								{ width:80px; text-align:right; padding-right:8px;}
table.grid .t4								{ width:108px;}
table.grid .t5								{ width:101px;}
table.grid tr.done .t2						{ background:url(../images/vink_blauw.png) 10px 50% no-repeat;}
table.grid tr td.t2	a.bttn.change			{ float:right; margin:5px 2px 0 0;}	
*:first-child+html table.grid  td.t6        { padding-bottom: 20px; } /*IE7*/
table.grid tr.highlite						{ background:#eaeaea url(../images/bg_gridRow.gif) 0 bottom repeat-x;}
table.grid td.t1 label						{ position:relative; display:inline-block; padding-left: 24px; font-weight:bold}
table.grid td.t1 label input				{ position:absolute; left:0px; top:0px }

/* optionsHolder*/
div.optionsHolder							{ width:109px; height:92px;  position:absolute; margin:5px 0 0 -20px;}
div.optionsHolder span						{ width:109px; height:28px;  display:block; cursor:pointer;margin-bottom:-2px;}
div.optionsHolder ul						{ list-style-type:none; background:url(../images/bg_ul_opties-button.png) 0 0px repeat-x; width:109px;height:66px; display:none;}
div.optionsHolder span,				
div.optionsHolder.ulIn span					{ background:url(../images/bg_opties-button_in.png) 0 0 repeat-x;}
div.optionsHolder.ulOut span				{ background:url(../images/bg_opties-button_out.png) 0 0 repeat-x;}
div.ulIn									{ z-index:0;}
div.ulOut									{ z-index:2;}

div.optionsHolder ul li span,
div.optionsHolder ul li a					{ display:block; background:url(../images/iconSprite.gif) 0 5px no-repeat; padding:1px 0 0 15px; font-size:0.9em;margin:0px 0 0 7px;}		
div.optionsHolder ul li a:hover				{ text-decoration:none;}	
div.optionsHolder ul li span				{ background:none!important; color:#8f8f8f; height:auto!important;margin-bottom:auto!important;width:auto!important; cursor:default;}	
div.optionsHolder ul li.change				{ padding-top:5px; }	
div.optionsHolder ul li.delete a			{ background-position:0 -14px;}	
div.optionsHolder ul li.history	a			{ background-position:0 -32px;}	

/*  ################################################################################################################
                                            FOOTER
    ################################################################################################################ */

#footer	{display:none;}

/* If you're having trouble printing relative links, uncomment and customize this:
   (note: This is valid CSS3, but it still won't go through the W3C CSS Validator) */

/* a[href^="/"]:after {
  content: " (http://www.yourdomain.com" attr(href) ") ";
} */