/*
    Colour Scheme
*/
    .white{background: #FFFFFF; color: #555555;}
    
    .lightgrey{background: #c6c8ca; color: #666666;}
    .grey{background: #a6a8aa; color: #ffffff;;}
    .darkgrey{background: #939598; color: #EEEEEE;;}
    
    .darkblue{background: #00519e; color: #666666;;}
    .blue{background: #0098d6; color: #ffffff;;}
    .lightblue{background: #80c1eb; color: #ffffff;;}
    
    .darkgreen{background: #839400; color: #ffffff;;}
    .green{background: #bac912; color: #666666;;}
    .lightgreen{background: #dde488; color: #222222;}  
    .faintgreen{background: #eef1c4; color: #444444;}  
    .barelygreen{background: #f8fae7; color: #86A666;}  
    
    
    .lightyellow{background: #ffff99; }  
    .yellow{background: #bbbb66; }  


/*
    HTML Overrides
*/



body, html 
{
    width: 100%;
    height: 100%;
    background: #FFFFFF;
    color: #555555;    
    padding: 0px;
    margin: 0px;
    font-family:"Trebuchet MS",Sans-Serif;
}

body.fpage, html.fpage{
    background: #E7E7E7;
}

body{
    overflow: -moz-scrollbars-vertical;
}

a:active, a:focus {
    outline: 0;
}


input[type=text], input[type=password], select, textarea
{
    padding: 2px;
    margin: 0px;
    font-family: Verdana;
    font-size: 1em;
    border: 2px solid #ccc;
}
input, textarea
{
    font-size: 0.8em;
}

a:link, a:active, a:visited{
    color: #0098d6;        
    text-decoration: none;
}
#header a:link,#header a:visited{  
    color: #555555;  
    text-decoration: underline;
}
a:hover, #header a:hover{
    color: #bac912;        
}
a.inactive, #header a.inactive{
    outline: none;
    text-decoration: none;
    font-weight: bold;
    color: #555555;
    cursor: pointer;
}

h1,h2,h3,h4,h5,.h1,.h2,.h3,.h4,.h5
{
    font-family:"Trebuchet MS",Sans-Serif;
    font-weight: bold; 
    margin: 0px; 
}
h1
{
    font-size: 2.0em;
    font-weight:normal;
}
h2
{
    color: #939598;
    font-size:1.3em;
    line-height:1.7em;
    margin:0px;
    padding:0px;    
}
h2#pagetitle{
    margin-bottom: 10px;
}
h3,.h3
{
    font-weight:bold;
    font-size:1.2em;
}
h4,.h4
{
    color: #939598;
    font-weight:bold;
    font-size:1.2em;
    line-height:1.8em;
}
h5
{
    color:#a6a8aa;
    font-size:0.9em;
    font-weight:normal;
    line-height:1.5em;
}

ul
{
    list-style: none;
    padding:0px;
    margin:0px;
}

li
{    padding:0px;
    margin:0px;

}


img
{
    border: none;
}

.hr{
    margin: 10px 0 20px 0;
    border-bottom: 1px solid #c6c8ca;
}

.hr2{
    margin: 5px 0 5px 0;
    padding: 0;
    border-bottom: 1px solid #c6c8ca;
}

.emptygrid_blue{
    margin-top: 10px;
    font-size: 1.5em;
    padding: 20px;
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center;
    background:  #e5f3fb;   
    color: #a6a8aa;    
}

.logo{
    font-family: Lucida Sans;
    text-transform: uppercase;
}

.bluetext{
    color: #0098d6;    
}

.greyed
{
    color: #a6a8aa;    
}

.textright{
    text-align: right;
}

h5.help{
    background: #ffffff;  
    font-size: 1.0em;    
}

h2.greyed
{    
    font-size: 1.3em;
    line-height: 1.8em;
    color: #c6c8ca;    
}

.bigtext{
    font-size: 1.3em;
    line-height: 1.8em;
}

a.bluelink, a.bluelink:active, a.bluelink:visited{
    color: #0098d6;        
    text-decoration: none;
}

a.bluelink:hover{
    color: #bac912;        
}

select{
    font-family: "Verdana";
    font-size: 0.7em;
}

.results_table{
    font-family: "Verdana";
    color: #666;
    font-size: 1.2em;
}

.help_window_trigger, .help_window_trigger_ext{
    font-family: "Verdana"; 
    font-size: 0.8em;    
    font-weight: bold;
}
/*
.gridlist .help_window_trigger, .gridlist .help_window_trigger_ext{
    font-family: "Verdana";
    font-size: 8em;    
}

.bigtext .help_window_trigger, .bigtext .help_window_trigger_ext{
    font-family: "Verdana";
    font-size: 4em;    
}*/

.welcome p{
    font-size: 1.2em;color:#666; 
    margin: 10px;
    padding: 5px;
}

.notification{
    width: 98%;
    margin: 5px;
    border:2px solid #bbbb66;
    background: #ffff99;
}
.notification h1{
    margin: 10px;
}
.notification .xclose{
    float:right;
    font-family: "Verdana";
    font-weight: bold;
    font-size: 1.6em;
    padding: 0px 5px 5px 7px;
}
.notification .message
{
    padding:7px;
}

a.button{
    /*display:block;*/
    margin:0 7px 0 7px;
    background-color:#eee;
    border:1px solid #dedede;
    border-top:1px solid #eee;
    border-left:1px solid #eee;
    font-family:"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
    font-size:100%;
    line-height:130%;
    text-decoration:none;
    font-weight:bold;
    cursor:pointer;
    padding:5px 10px 6px 7px; /* Links */

}
a:hover.button{
    background-color:#f5f5f5;
    margin:0 6px 0 6px;
    border:2px solid #dedede;
}

.button span{
    background-repeat: no-repeat;
    background-position: 2px;
    padding-left: 25px;
}

.savebutton{
    background: url('../images/icons/disk.png');
}
.appcancelbutton{
    background: url('../images/icons/application_cancel.png');
}
.appcontinuebutton{
    background: url('../images/icons/application_go.png');
}
.addbutton{
    background: url('../images/icons/add.png');
}

.error{
    color: red;
}

.warning{
    font-size: 1em;
    line-height: normal;
}
.bigtext .warning{
    font-size: 0.8em;
}

.tweet .text{
    font-size: 0.7em;
}
.tweet .date{
    margin-left: 5px;
    font-size: 0.6em;
    font-style: italic;
    color: #aaa;
}

.comparedeletecontrols{
    margin-top: 10px;
    background: #f1f1f1;
    border : 1px solid #c6c8ca;
    padding: 3px 8px 3px 8px;
}
.comparedeletecontrols a{
    color: #0098d6;        
    text-decoration: none;
}


table.gridlist
{
    width: 100%;
}

.gridlist
{
    margin-top: 5px;
    font-family: "Verdana";
    font-size: 0.9em;
}

.gridlist li, .gridlistrow, .gridlist tr
{
    background: #e7e7e7;
    padding: 3px 8px 3px 8px;
}

.gridlist td.alt, .gridlist tr.alt, .gridlistrowalt
{
    padding: 3px 8px 3px 8px;
    background: #f1f1f1;
}

.gridlist .head, .gridlistheader
{
    font-family: Trebuchet MS;
    font-size: 1.1em;
    background: #FFFFFF;
}

.gridlist .head.bigtext{
    font-size: 1.3em;
}

.gridlist a{
    color: #0098d6;
    text-decoration: none;
}



.gridlist_silver{ 
    font-family: "Verdana";   
    border: 1px solid #c6c8ca;
    font-size: 0.8em;
}

.gridlist_silver li, .gridlist_silver tr
{
    background: #FFFFFF;
    padding: 3px 8px 3px 8px;
}

.gridlist_silver td, .gridlist_silver th{
    padding: 5px;
    border-right: 1px solid #c6c8ca;
}
.gridlist_silver.novertlines td, .gridlist_silver.novertlines th{
    border-right: none;
}

.gridlist_silver .gridlistrowalt, .gridlist_silver .alt
{    
    background: #f1f1f1;
}

.gridlist_silver .gridlistrow{
}

.gridlist_silver .shaded
{
    background: #f1f1f1;
}

.gridlist_silver .gridlistrowalt .shaded, .gridlist_silver .alt .shaded
{
    background: #e7e7e7;
}

.gridlist_silver .gridlistheader, .gridlist_silver .header{
    background: #e7e7e7;
    border-bottom: 1px solid #c6c8ca;
}

.header td a{ 
    margin:0px; padding: 0px;
    background: #c6c8ca;
}

.gridlist_silver .gridlistheader .shaded, .gridlist_silver .header .shaded, .gridlist_silver th .shaded{
    background: #c6c8ca;
}

.gridlist_silvercontrols{
    width:100%;
    border-top: none;
    background: #e7e7e7;
    border: 1px solid #c6c8ca;
    border-top: none;
}

.gridlist_silvercontrols td{    
    font-size: 0.8em;
}

.gridlist_silvercontrols select, .gridlist_silvercontrols input{
    font-size: 0.9em;
}

.gridlist_silver a,{
    text-decoration: none;
}

.gridlist_silver.bottomline{
    border-bottom: 1px solid #c6c8ca;
}


.my_clip_button {  width:100px; text-align:center; margin:0px; padding: 5px; cursor: default; font-size:0.9em; color:#0098d6; }
.my_clip_button.hover { background-color:#eee; border: 1px solid #aaa; cursor: pointer; }
.my_clip_button.active { background-color:#aaa; }

.my_clip_button_2 {  width:160px; text-align:right; margin:0px; cursor: default; color:#0098d6; }
.my_clip_button_2.hover { cursor: pointer; }
.my_clip_button_2.active { cursor: pointer; }



.loader, .loader_bkg{
    position:absolute; 
    width:100%;
    height:100%;
}
.loader_bkg{
    text-align:center;
    background:#fff;
    opacity:0.4;filter:alpha(opacity=40)
}
.loader_text{
    position:absolute; 
    top:50%; left: 40%; 
    height:100%;
    font-size: 2em;
}


/*  Modal Stuff */


/* jqModal base Styling courtesy of;
	Brice Burgess <bhb@iceburg.net> */

/* The Window's CSS z-index value is respected (takes priority). If none is supplied,
	the Window's z-index value will be set to 3000 by default (in jqModal.js). You
	can change this value by either;
	  a) supplying one via CSS
	  b) passing the "zIndex" parameter. E.g.  (window).jqm({zIndex: 500}); */
	
.modal {
    display: none;
    
    position: fixed;
    top: 17%;
    left: 50%;
    
    margin-left: -300px;
    width: 600px;
    
    background-color: #FFF;
    color: #333;
    border: 3px solid #c6c8ca;
    z-index: 3000;
}

.jqmOverlay { background-color: #FFF;}

/* Background iframe styling for IE6. Prevents ActiveX bleed-through (<select> form elements, etc.) */
* iframe.jqm {position:absolute;top:0;left:0;z-index:-1;
	width: expression(this.parentNode.offsetWidth+'px');
	height: expression(this.parentNode.offsetHeight+'px');
}

/* Fixed posistioning emulation for IE6
     Star selector used to hide definition from browsers other than IE6
     For valid CSS, use a conditional include instead */
* html .modal {
     position: absolute;
     top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}

.modal.alert
{
    display: none;
    
    position: fixed;
    top: 10%;
    left: 50%;
    
    margin-left: -200px;
    width: 400px;
    
    background-color: #FFF;
    color: #333;
    border: 1px solid black;
    z-index: 1000;
}

.modal.confirm
{
    display: none;
    
    position: fixed;
    top: 10%;
    left: 50%;
    
    margin-left: -200px;
    width: 400px;
    
    background-color: #FFF;
    color: #333;
    border: 1px solid black;
    z-index: 1000;
}

.modal div div{padding:0px; }
.modal .header {height:30px; width:100%; background: #0098d6;repeat-x; color:#fff; font-size:1.1em; font-weight:bold; line-height:30px;}
.modal .header span {padding-left:10px;}
.modal .message {padding:5px 15px 5px 15px;}
.modal .xclose { font-family: Lucida Sans; text-decoration:none; font-weight:bold; font-size:1.3em; position:absolute; top:2px; right:10px; color:#ddd; }
.modal .buttons { padding: 10px; text-align: right; }
.confirm .no, .confirm .yes { padding: 5px; font-weight: bold; }




/* located in demo.css and creates a little calendar icon
 * instead of a text link for "Choose date"
 */
a.dp-choose-date {
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 0;
    display: block;
    text-indent: -2000px;
    overflow: hidden;
    background: url('../images/icons/calendar.png') no-repeat; 
}
a.dp-choose-date.dp-disabled {
    background-position: 0 -20px;
    cursor: default;
}
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon
 */
input.dp-applied {
    width: 140px;
    float: left;
}

table.jCalendar {
	background: #FFF;
    border-collapse: separate;
    border-spacing: 2px;
}
table.jCalendar th {
	background: #BBB;
	color: #fff;
	font-weight: bold;
	padding: 3px 5px;
}

table.jCalendar td {
	background: #EEE;
	color: #000;
	padding: 3px 5px;
	text-align: center;
}
table.jCalendar td.other-month {
	background: #DDD;
	color: #aaa;
}
table.jCalendar td.today {
	background: #666;
	color: #fff;
}
table.jCalendar td.selected {
	background: #0098d6;
	color: #fff;
}
table.jCalendar td.selected.dp-hover {
	background: #f33;
	color: #fff;
}
table.jCalendar td.dp-hover,
table.jCalendar tr.activeWeekHover td {
	background: #fff;
	color: #000;
}
table.jCalendar tr.selectedWeek td {
	background: #f66;
	color: #fff;
}
table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {
	background: #BBB;
	color: #888;
}
table.jCalendar td.unselectable,
table.jCalendar td.unselectable:hover,
table.jCalendar td.unselectable.dp-hover {
	background: #bbb;
	color: #888;
}



/* For the popup */

/* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */

div.dp-popup {
	border: 3px solid #CCC;
	position: relative;
	background: #FFF;
	font-size: 10px;
	font-family: arial, sans-serif;
	padding: 2px;
	width: 171px;
	line-height: 1.2em;
}
div#dp-popup {
	position: fixed;
	z-index: 199;
}
div.dp-popup h2 {
	font-size: 12px;
	text-align: center;
	margin: 2px 0;
	padding: 0;
}
a#dp-close {
	font-size: 11px;
	padding: 4px 0;
	text-align: center;
	display: block;
}
a#dp-close:hover {
	text-decoration: underline;
}
div.dp-popup a {
	color: #000;
	text-decoration: none;
	padding: 3px 2px 0;
}
div.dp-popup div.dp-nav-prev {
	position: absolute;
	top: 2px;
	left: 4px;
	width: 100px;
}
div.dp-popup div.dp-nav-prev a {
	float: left;
}
/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {
	cursor: pointer;
}
div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {
	cursor: default;
}
div.dp-popup div.dp-nav-next {
	position: absolute;
	top: 2px;
	right: 4px;
	width: 100px;
}
div.dp-popup div.dp-nav-next a {
	float: right;
}
div.dp-popup a.disabled {
	cursor: default;
	color: #aaa;
}
div.dp-popup td {
	cursor: pointer;
}
div.dp-popup td.disabled {
	cursor: default;
}