

/* Base Page */
html{
	background:#00397c url('/img/page_bg.jpg') no-repeat center top;
}

body,
body a{
	color:#fff;
	font-family:"Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
}

/* Headings */
h1{
	font-size:187%;
}

h1 a,
h3.outgoing
{
   background: url(/img/sprites/general-assets.png) no-repeat top left;
}

h1 a{
	display:block;
	text-indent:-999px;
	background-position: 0 -67px;
	height:32px;
	width:168px;
	margin-bottom:5px;
}

#doc-head h3{
	color:#043D80;
	font-weight:bold;
	border-bottom:1px solid #f1f1f1;
	padding-bottom:10px;
	margin-bottom:10px;
}

/* Document */
#bd{
	color:#000;
	background:#fff;
}

#bd a{
	color:#195e95;
}

#hd{
	position:relative;
}

#loading-progress{
	position:absolute;
	top:25px;
	right:20px;
	padding:3px 0;
	padding-left:30px;
	color:#fff;
	font-size:82%;
	vertical-align:middle;
	background: url('/img/progress.gif') no-repeat;
}

#hide-button,
#salary-input button,
#banner,
#banner.hidden #hide-button,
#salary-frequency li.selected,
#salary-frequency li:hover
{
	background:url('/img/sprites/banner-assets.png') no-repeat;
}

/* Banner input box */
#banner{
	background-color:#94c42e;
	background-position: 0 0; 
	background-repeat:repeat-x;
	color:#fff;
}

	#banner h3{
		color:#fff;
		font-size:131%;
	}

	#banner h3 a{
		color:#fff;
	}
	
	#salary-amount{
		border:2px solid #648901;
		color:#104067;
		font-size:189%;
		text-align:right;
	}
	
	#salary-input button{
		border:none;
		background-position: 0 -571px;
		color:#fff;
		font-weight:bold;
		font-size:108%;
		height:37px;
		width:112px;
	}
	
	#banner #salary-advanced h3{
		font-size:120%;
	}

/* Actions in the banner region */

#report-actions li{
	display:block;
	width:100%;
	font-size:90%;
	padding-left:25px;
	padding-bottom:3px;
	margin-bottom:3px;
}

	#report-actions li a{
		color:#fff;
		text-decoration:none;
	}

		#report-actions li a:hover{
			text-decoration:underline;
		}

#save-button{
	display:block;
	background:url('/img/save_button.png') no-repeat;
	padding-top:10px;
	height:27px;
	width:127px;
	font-size:93%;
	text-align:center;
}
	button#save-button{
		margin:0;
		border:none;
		height:37px;
		padding-top:0;
	}
	
	button#save-button,
	a#save-button{
		color:#fff;
		text-decoration:none;
	}
		
#hide-button{
	display:block;
	background-color:#649300;
	background-position: 0 -264px;
	bottom:0;
	padding:6px 0 7px 30px;
	width:96px;
	font-size:85%;
	position:absolute;
}

	a#hide-button{
		color:#fff;
		text-decoration:none;
	}	

/* Side Col */
#sidecol{
	color:#515151;
}

#sidecol .mod-group{
	background:#f9fbfc;
}

#sidecol h3{
	border-bottom:1px solid #cfcfcf;
	font-weight:bold;
	margin-bottom:15px;
	padding:10px 0;
}

/* Main Column */
.messages li{
	border:1px solid #FFFF00;
	background:#FFFFCC;
	text-align:center;
	padding:5px;
	font-size:80%;
	font-weight:bold;
	margin-bottom:5px;
}

/* Advanced Banner Area */
#salary-advanced input{
	border:2px solid #648901;
	padding:2px;
	color:#104067;
	/*font-size:98%;*/
}


/* Report settings area */

.js #report-options,
.js #password-set,
.js #report-send
{
	display:none;	
}

.advanced .mod{
	background:#e9f1f8;
}

	.advanced .mod .hd{
		background:#d5e4f2;
		border-bottom:1px solid #bdccdc;
		padding:15px;
	}

	.advanced .mod h3{
		font-weight:bold;
		color:#383a3b;
	}

	.advanced .mod .bd{
		padding:15px;	
	}

	.advanced .mod .ft{
		border-bottom:4px solid #c9d0d5;
	}

	.advanced .mod form p{
		color:#383a3b;
		padding:5px 0;
	}

	.advanced .mod form input{
		color:#383a3b;
	}

	.advanced .mod label{
		float:left;
		width:180px;
		font-size:92%;
	}
	
	
.credit-up,
.credit-up td
{
	color:#3A932E;
}

.credit-down,
.credit-down td
{
	color:#E46062;
}

/* Form Buttons */
.action-remove,
.action-reset-form,
.action-add-preset,
.action-edit,
.action-delicious,
#report-actions li#edit-settings,
#report-actions li#secure-sign-in,
#report-actions li#secure-sign-out
{
   background: url(/img/sprites/action-icons.png) no-repeat top left;
}

.action-remove{
	background-position: 0 -264px;
	text-indent:-9999px;
	border:none;
	margin:0;
	padding:0;
	height:16px;
	width:16px;
	float:left;
	cursor:pointer;
}
.action-reset-form{
	background-position: 0 -66px;
	border:none;
	margin:0;
	padding:0;
	padding-left:20px;
	height:16px;
	cursor:pointer;
	color:#195E95;
	text-decoration:underline;
}
.action-delicious{
	background-position: 0 -326px;
	text-indent:-9999px;
	border:none;
	margin:0;
	padding:0;
	padding-left:20px;
	height:16px;
}
.action-add-preset{
	background-position: 0 0;
	text-indent:-9999px;
	border:none;
	margin:0;
	padding:0;
	height:16px;
	width:16px;
	float:left;
	cursor:pointer;
}
.action-edit{
	background-position: 0 -132px;
	text-indent:-9999px;
	border:none;
	margin:0;
	padding:0;
	height:16px;
	width:16px;
	float:left;
	cursor:pointer;
}

#report-actions li#edit-settings{
	background-position: 0 -198px;
}

#report-actions li#secure-sign-in{
	background-position: 0 -456px;
}
	
#report-actions li#secure-sign-out{
	background-position: 0 -390px;
}

#banner{
	padding:15px 0 5px 0;
	border-radius:5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	-webkit-border-top-left-radius:5px;
	-webkit-border-top-right-radius:5px;
	min-height:90px;
	border-bottom:2px solid #649300;
	position:relative;
}

#salary-frequency{
	position:absolute;
	left:195px;
	top:15px;
	font-size:85%;
}
	#salary-frequency li{
		float:left;
		clear:none;
		min-width:55px;
		min-height:18px;
		padding:5px;
		margin-right:2px;
		text-align:center;
	}
		.js #salary-frequency li,
		.js #salary-frequency li label
		{
			cursor:pointer;
		}
	
		#salary-frequency li:hover{
			background-position: 0 -337px;
			padding-bottom:10px;
		}
	
		#salary-frequency li input{
			margin-right:4px;
			vertical-align:middle;
		}
	
		.js #salary-frequency li input{
			display:none;
			margin-right:0;
		}

		#salary-frequency li.selected{
			font-weight:bold;
			background-position: 0 -489px;
			padding-bottom:10px;
		}

#bd{
	border-radius:5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding:0;
	padding-bottom:20px;
}

#canvas{
	margin-top:15px;
}

/* Headings */

h1{
	margin-top:50px;
	margin-bottom:-5px;
}

h2{
	margin-bottom:50px;
	margin-left:50px;
}

h3.outgoing,
#sidecol h3.outgoing,
h3.incoming,
#sidecol h3.incoming
{
	padding-left:20px;
}

h3.outgoing{
	background-position: 0 -140px;
}
h3.incoming{
	background-position: 0 0;
}

/* Banner */

#banner h3{
	margin-bottom:20px;
}

#banner #salary-input{
	padding:0 30px;
}

	#banner ul ul li{
		float:left;
		clear:left;
		margin-right:5px;
	}
	
	#banner ul ul li *{
		vertical-align:middle;
	}

#salary-amount{
	background:#fff url('/img/pound_bg.gif') no-repeat 9px 6px;
	width:421px;
	padding:2px;
	padding-right:9px;
	vertical-align:top;
}
	#salary-amount.currency_dollar{
		background-image:url('/img/dollar_bg.gif');
	}
	
	#salary-amount.currency_yen{
		background-image:url('/img/yen_bg.gif');
	}
	
	#salary-amount.currency_euro{
		background-image:url('/img/euro_bg.gif');
	}

	#banner .col1,
	#banner .col2
	{
		float:left;
		clear:none;
	}

	#banner .col1{
		padding-top:0;
		width:150px;
	}
	#banner .col2{
		padding-left:10px;
	}
	
		#banner.hidden{
			min-height:0px;
			height:13px;
			overflow:hidden;
		}
		#banner.hidden .yui-u
		{
			margin-top:-200px;
		}
		
		#banner.hidden #hide-button{
			background-color:#649300;
			background-position: 0 -191px;
		}
		
		#banner.hidden #salary-input{
			display:none;
		}

#doc-head .hd{
	position:relative;
}

/* Earninator!!! */
#earninator{
	color:#888;
	font-size:82%;
	position:absolute;
	right:0;
	top:1px;
}
#earninator strong{
	font-weight:bold;
}

/* Module Groups*/

.mod-group{
	padding-left:15px;
}

#sidecol .mod-group{
	border-radius:5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-right:15px;
	margin-left:2px;
	padding:0;
}

	#sidecol .mod-group .hd.corners{
		height:8px;
		font-size:0;
		line-height:0;
	}

	#sidecol .mod-group .ft.corners{
		height:15px;
		font-size:0;
		line-height:0;
	}

	#sidecol .mod-group .bd.modules{
		padding:0 15px;
	}
	
/* Autocomplete */

#deduction-name-container{
	padding-left:90px;
	padding-right:10px;
	width:130px;
}
#deduction-name-container ul{
	border:1px solid #ccc;
	background:#fff;
}
#deduction-name-container li{
	padding:3px 5px;
}
#deduction-name-container .yui-ac-highlight{
	color:#fff;
	background:#426FD9;
	font-weight:bold;
}
#deduction-name-container .yui-ac-prehighlight{
	color:#fff;
	background:#B3D4FF;
}

/* Banner Area */

#report-title{
	margin-bottom:20px;
}


/* Footer */
#ft{
	clear:both;
	padding:1em;
	height:3em;
}

	#ft #about,
	#ft #save
	{
		float:left;
		margin-right:10px;
	}

	#ft #contact{
		float:right;
		clear:none;
	}

	#ft ul ul li{
		float:left;
		margin-right:15px;
	}

.js #report-options,
.js #report-send
{
	display:none;	
}

.advanced .mod{
	background:#e9f1f8;
}

.advanced .mod .hd{
	background:#d5e4f2;
	border-bottom:1px solid #bdccdc;
	padding:15px;
}

.advanced .mod h3{
	font-weight:bold;
	color:#383a3b;
}

.advanced .mod .bd{
	padding:15px;	
}

.advanced .mod .ft{
	border-bottom:4px solid #c9d0d5;
}

.advanced .mod form p{
	color:#383a3b;
	padding:5px 0;
}

.advanced .mod form input{
	color:#383a3b;
}

.advanced .mod label{
	float:left;
	width:180px;
	font-size:92%;
}

table {
	width:100%;
	border-top:1px solid #e5eff8;
	border-right:1px solid #e5eff8;
	margin:1em auto;
	border-collapse:collapse;
}
caption {
	color: #9ba9b4;
	font-size:.94em;
	letter-spacing:.1em;
	margin:1em 0 0 0;
	padding:0;
	caption-side:top;
	text-align:center;
}	
tr.odd td	{
	background:#f7fbff
}
tr.odd .column1	{
	background:#f4f9fe;
}	
.column1	{
	background:#f9fcfe;
}
td {
	color:#678197;
	border-bottom:1px solid #e5eff8;
	border-left:1px solid #e5eff8;
	padding:.3em 1em;
	text-align:center;
}			
td.selected{
	color:#66A3D3;
}	
th {
	font-weight:normal;
	color: #678197;
	text-align:left;
	border-bottom: 1px solid #e5eff8;
	border-left:1px solid #e5eff8;
	padding:.3em 1em;
}							
thead th {
	background:#f4f9fe;
	text-align:center;
	font-weight:bold;
	color:#66a3d3
}
tbody th {
	font-weight:bold;
}
tfoot{
	border-top:3px solid  #E5EFF8;
	font-weight:bold;
}
tfoot th,
tbody #gross th
{
	text-align:left;
	background:#f4f9fe;
}	
tfoot th strong {
	font-weight:bold;
	margin:.5em .5em .5em 0;
	color:#66a3d3;
	}

td form{
	display:inline;
}

.detail-io{
	border:1px solid #e9f1f8;
	margin-bottom:5px;
	border-radius:5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

	.js .detail-io.edit{
		display:none;
	}

.detail-io .hd,
.mini-io .hd
{
	background:#E9F1F8;
/*	background:#e9f1f8 url('/img/io-header-bg-top.gif') no-repeat top;*/
}

	.detail-io .hd h4,
	.mini-io .hd h4
	{
		font-weight:bold;
/*		background:url('/img/io-header-bg-bottom.gif') no-repeat bottom;*/
		padding:6px;
		padding-left:8px;
	}
	
.detail-io .bd{
	
	border-top:none;
	border-bottom:none;
	padding:5px;
}

.detail-io .ft{
	height:5px;
	font-size:0;
	line-height:0;
/*	background:url('/img/io-detail-bg-bottom.gif') no-repeat bottom;*/
}

.detail-io .row{
	margin:10px 0;
}

.detail-io .row.double{
	padding-left:90px;
}

.detail-io .bd label{
	float:left;
	width:80px;
	text-align:right;
	padding-right:10px;
}

.detail-io .bd input{
	width:130px;
	padding:1px;
}

.detail-io .bd button{
	border:1px solid #648C10;
	background:#648C10 url('/img/add-button-bg.gif') repeat-x;
	color:#fff;
	font-weight:bold;
	font-size:85%;
	padding:3px 8px;
	width:110px;
}

/* Mini version */

.mini-io{
	position:relative;
	margin-bottom:5px;
}

.mini-io .hd{
	border-radius:5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.mini-io .bd
{
	position:absolute;
	top:5px;
	right:8px;
}

.mini-io .bd li{
	display:inline;
}

/* Adverts */
#google-ads{
	margin-top:10px;
}