/*  body and font definitions */
html { 
  padding:0px;
  margin:0px;
}
 
body {
  background-color: #e5e5e5;
  font-size: 12px;
  font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
  color:#564b47;  
  padding:0px;
  margin:0px;
}

form.inline {
	display: inline;
	padding-left: 20px;
}

h1 {
	font-size: 24px;
	text-align: left;
	color: white;
	padding: 10px 0px 10px 30px;
	margin:0px;

}

h2 {
	color: black;
	border-bottom: 0px;
	font-size: 14px;
	height: 17px;
	margin-bottom: 5px;
	padding-top: 10px;
}

h3.green {
  color: #217A00;
  margin-bottom: 10px;
}

td.metric_one {
  color: #0077CC;  /* blue */
}

td.metric_two {
  color: #50B432; /* green */
}

h2.inline {
	display: inline;
	margin-top: 20px;
}

p {
	margin: 5px; 
}

th {
	text-align: left;
	text-transform: uppercase;
	padding: 10px 2px 10px 2px;
}

td {
	padding: 2px;
}

.big {
	font-size: 16px;
}

th.center, td.center {
	text-align: center;
}
th.right, td.right {
	text-align: right;
}

table {
	width: 100%;
}

table.table_halfsize {
	width: 50%;
}

table.table_small {
	width: 200px;
}
table.edit_table th {
	text-align: right;
	text-transform: none;
	font-weight: normal;
	padding: 10px 0px;
}

table.edit_table th.section {
	text-align: left;
	text-transform: none;
	font-weight: bold;
	padding: 10px 0px 0px 0px;
	color: #6C0606;
}

table.bordered {
	border-width: 2px;
	border-spacing: 0;
	border-style: solid;
	border-collapse: collapse;
	margin-top: 10px;
	margin-bottom: 20px;
}

table.bordered th {
  background-color: #ccc;
}

table.calendar {
	border-width: 2px;
	border-spacing: 0;
	border-style: solid;
	border-collapse: collapse;
	margin-top: 10px;
	margin-bottom: 20px;
}

table.calendar th {
  background-color: #ccc;
  border-width: 1px;
	border-style: solid;
	text-align: center;
	width: 100px;
}

table.calendar td {
  border-width: 1px;
	border-style: solid;
  vertical-align:text-top;
	width: 100px;
}

table.calendar tr.shaded {
background: #ddd;
}

table.calendar td.today, table.calendar th.today  {
background: #b1d0ef;
}

.calendar_machine {
  font-size: 8px;
}


a, a:link, a:visited { 
	color: #03C;
	font-size: 11px;
	background-color:transparent;
	text-decoration: underline; 
}

a:hover { 
	color: white;
	background-color: #03C;
	text-decoration: none; 
}

a.red, a:link.red, a:visited.red { 
	color: red;
	font-size: 11px;
	background-color:transparent;
	text-decoration: underline; 
}

a:hover.red { 
	color: white;
	background-color: red;
	text-decoration: none; 
}
a.yellow, a:link.yellow, a:visited.yellow { 
	color: #ffc;
	font-size: 11px;
	background-color:transparent;
	text-decoration: underline; 
}

a:hover.yellow { 
	color: white;
	background-color: #ffc;
	text-decoration: none; 
}

a.hireperiod_AM, a:link.hireperiod_AM, a:visited.hireperiod_AM { 
	color: #E14A00;
	font-size: 11px;
	background-color:transparent;
	text-decoration: none; 
}

a:hover.hireperiod_AM {
	color: white; 
	background-color: #E14A00;
	text-decoration: none; 
}

a.hireperiod_PM, a:link.hireperiod_PM, a:visited.hireperiod_PM { 
	color: #085FD7;
	font-size: 11px;
	background-color:transparent;
	text-decoration: none; 
}

a:hover.hireperiod_PM { 
	color: white;
	background-color: #085FD7;
	text-decoration: none; 
}

a.hireperiod_AD, a:link.hireperiod_AD, a:visited.hireperiod_AD { 
	color: #3AB404;
	font-size: 11px;
	background-color:transparent;
	text-decoration: none; 
}

a:hover.hireperiod_AD { 
	color: white;
	background-color: #3AB404;
	text-decoration: none; 
}

a.calendar_suburb, a:link.calendar_suburb, a:visited.calendar_suburb { 
	color:black;
	font-size: 11px;
	background-color:transparent;
	text-decoration: none; 

}

a:hover.calendar_suburb { 
	color: white;
	background-color: #564B47;
	text-decoration: none; 
}

a.calendar_legend, a:link.calendar_legend, a:visited.calendar_legend { 
	font-size: 11px;
	background-color:transparent;
	text-decoration: none; 

}

a:hover.calendar_legend { 
	color: white;
	background-color: #03C;
	text-decoration: none; 
}

a.calendar_legend_red, a:link.calendar_legend_red, a:visited.calendar_legend_red { 
	color: red;
	font-size: 11px;
	background-color:transparent;
	text-decoration: none; 
}

a:hover.calendar_legend_red { 
	color: white;
	background-color: red;
	text-decoration: none; 
}

a.boldit, a:link.boldit, a:visited.boldit { 
	font-weight: bold;
}

.align_right {
	margin-top: 0; 
	text-align: right;
	font-size: 10px;
}

.border_above {
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: lightgrey;
	padding-top: 5px;
}


.add_margins {
	margin:05px 24px 5px 24px;
}

 
strong { 
font-size: 13px;
}
 
/*  positioning-layers static and absolute */
#banner {
	background-color: white; 
	text-align: center;
	padding: 0px;
	margin: 0px;
	color:white;
}

#banner img {
	padding:5px 10px;
	border: 0px;
} 

#icons {
	background-color: #eee; 
	text-align: left;
	padding: 0px;
	margin: 0px;
	color:black;
	border: 1px solid #ddd;
}

#icons img {
	padding:3px 10px;
} 

#icons a:hover { 
	background-color: transparent;
}

#tabs {
	display: block;
	height: 25px;
	margin: 0px 25px 0px 0px;
	padding: 0;
}

#tabs li {
	float: left;
	display: inline;
	list-style-type: none;
	font-size: 12px;
	background-color: transparent;
	color: #D1EEFF; /* #D1EEFF */
	margin: 5px 0px 0px 0px;
	padding: 0px 2px 0px 2px;
}

#tabs a, #tabs a:link, #tabs a:visited { 
	color: #D1EEFF;
	font-size: 11px;
	background-color:#455A75; /* #217A00*/
	text-decoration: none; 
	margin: 10px 0px 0px 0px;
	padding: 7px;
}

#tabs a:hover { 
	color: white;
	background-color: #243243; /* #054700 */
	text-decoration: none; 
}

#tabs a.current, #tabs a:link.current, #tabs a:visited.current, #tabs li.current{
	background-color: #e5e5e5;
	color: black;
}

#centered-fixed {
  margin: 0 auto;
	width: 600px;
}

#devise-content {
  width: 360px;
	position: static;
	margin: 20px;
	border-bottom: 1px solid #BBB;
	border-right: 1px solid #BBB;
	padding-left: 0px;
	background-color: white;    
}

#content {
	position: float;
	margin: 10px 25px 0px 25px;
	border-bottom: 1px solid #BBB;
	border-right: 1px solid #BBB;
	padding-left: 0px;
	background-color: white;    
}
 
#content .div_header, #devise-content .div_header {
	background: #EDF3FE;
	margin: 0px 0px 5px;
	padding: 13px 30px 13px 24px;
}

#content h1, #devise-content h1 {
	color: black;
	border-bottom: 0px;
	font-size: 20px;
	height: 25px;
	margin: 0px;
	padding: 0px;
}

#right {
	position: absolute;
	right: 0px;        
	width: 300px;
	color: #564b47;
	margin: 0px; 
	padding: 0px;
}

#right .div_header {
	background: #EDF3FE;
	margin: 0px 0px 5px;
	padding: 6px 8px 6px 8px;
}

#right h1 {
	color: #333;
	border-bottom: 0px;
	font-size: 13px;
	height: 16px;
	margin: 0px;
	padding: 0px;
}

#block_area {
	background: #f0f0f0;
	color: #333;
	font-size: 11px;
	padding: 5px;
	margin: 5px 0px 5px 0px;
	display: block;
}

#block_area table {
  width: 100%;
}

#block_area table.table_small {
  width: 25%;
}

.text_hint {
	background-color: #ffc;
	color:black;
	margin:5px;
	padding: 10px;
	font-size: 11px;
}

.text_search {
	background-color: #f0f0f0;
	color:black;
	margin:5px;
	padding: 10px;
	font-size: 11px;
}

.text_error {
	background-color:  #FFBABA;
	color:black;
	margin:5px;
	padding: 10px;
	font-size: 11px;
}

.text_warning {
	background-color:  #FEEFB3;
	color:black;
	margin:5px;
	padding: 10px;
	font-size: 11px;
}

.one_metric {
	background-color: #0077CC;
}

.text_hint h3, .text_warning h3, .text_error h3{
	margin-top: 0;
	margin-bottom: 5px;
}

.text_hint ul, .text_warning ul, .text_error ul{
	margin-top: 0px;
	margin-bottom: 10px;
}

.masterdata li {
	padding: 3px;
}


#imported_data {
	background-color: #ffc;
	color:black;
	margin:5px;
	padding: 10px;
	font-size: 6px;
	border: 2px;
	border-style: solid;
	border-color: black;
}

#account_logoff {
	color: #D1EEFF;
	font-size: 11px;
	padding: 7px 20px;
	position: absolute;
	right: 0px;
	top: 0px;
	text-align: right;
}

#account_logoff a, #account_logoff a:link, #account_logoff a:visited { 
	color: #D1EEFF;
	font-size: 11px;
	background-color:transparent;
	text-decoration: underline; 
	padding: 7px 3px 7px 3px;
}

#account_logoff a:hover { 
	color: white;
	background-color: #243243;
	text-decoration: none; 
	padding: 5px 3px 5px 3px;
}

#account_logoff a.trial, #account_logoff a.trial:link, #account_logoff a.trial:visited { 
	color: red;
	font-size: 11px;
	background-color:transparent;
	text-decoration: underline; 
	padding: 7px 3px 7px 3px;
}

#account_logoff a.trial:hover { 
	color: white;
	/*background-color: red;*/
	text-decoration: none; 
	padding: 7px 3px 7px 3px;
}

table.widget {
  width: 100%;
  padding: 0;
  margin-top: 10px;
  font-family: Helvetica, Verdana, Arial, SunSans-Regular, Sans-Serif;
}

table.widget th {
  text-transform: uppercase;
  font-size: 12px;
  padding: 0;
  padding-bottom: 5px;
  margin: 0;
  border-bottom: 1px solid;
  text-align: center;
}

table.widget td {
  text-align: center;
  font-weight: bold;
}

table.widget td.sep {
  border-left: 1px solid;
}

table.widget td.biggest {
  font-size: 36px;
  color: black;
}

table.widget td.big {
  font-size: 36px;
  color: grey;
}

table.widget td.red {
  color: red;
}

table.widget td.green {
  color: green;
}

#footer {
	font-size: 9px;
	margin: 3px 0px 20px 35px;
	color: #999;
	padding-bottom: 15px;
	text-align: left;    
}

a.tooltip img {
  border: 0;
  
}
a.tooltip:hover {
  background: transparent; /*BG color is a must for IE6*/
  text-decoration:none;
} 

a.tooltip span {
  display:none;
  padding:2px 3px;
  margin-left:8px;
  width:310px;
}
a.tooltip:hover span {
  display:inline;
  position:absolute;
  background:#ffffff;
  border:1px solid #cccccc;
  color:#6c6c6c;
}

#signup {
  text-align: center;
  width: 100%;
  margin-top: 25px;
  margin-bottom: 25px;
}

#signup table {
  margin: 0 auto;
  width: 750px;
}
#signup table td {
  text-align: center;
  padding: 5px;
  background: #DAEEFB;
  border-left: 1px solid white;
  vertical-align:middle
}

#signup table th {
  text-align: center;
  padding: 0px;
  margin: 0px;
  border-left: 1px solid white;
}

#signup table th.basic {
 background-image: url("http://www.qualityindicatorspro.com.au/wp-content/uploads/2010/07/signup_basic_sml.png");
 width: 158px;
 height: 168px;
}

#signup table th.plus {
 background-image: url("http://www.qualityindicatorspro.com.au/wp-content/uploads/2010/07/signup_plus_sml.png");
 width: 158px;
 height: 168px;
}

#signup table th.deluxe {
 background-image: url("http://www.qualityindicatorspro.com.au/wp-content/uploads/2010/09/signup_deluxe_sml.png");
 width: 158px;
 height: 168px;
}

#signup table th.unlimited {
 background-image: url("http://www.qualityindicatorspro.com.au/wp-content/uploads/2010/09/signup_unlimited_sml.png");
 width: 158px;
 height: 168px;
}


#signup table td.odd {
  background: #E6E6E6;
}

#signup table td.even {
  background: white;
}

#signup table td.del_unl {
  background: #D8EBD3;
}

#signup table td.basic {
  background: #B5DDF7;
}

#signup table td.plus {
  background: #A9CDD9;
}

#signup table td.deluxe {
  background: #B1D7A7;
}

#signup table td.unlimited {
  background: #CBE1AB;
}


#signup table img {
  border: none;
  background: transparent;
}


/*  
    awesome buttons are based on a blog post by ZERB
    Read there blog post for more information:
    "Super awesome Buttons with CSS3 and RGBA":http://www.zurb.com/article/266/super-awesome-buttons-with-css3-and-rgba 
    
    this buttons are even more awesome, as the need only one color for all three states,
    and have an super awesome onclick state
*/

/* set an awesome color for the buttons */
button.awesome, 
input.awesome, 
a.button.awesome {
  background-color: #111;
}

button.awesome.green, 
input.awesome.green, 
a.button.awesome.green {
	background-color: #217A00;
}

button.awesome.red, 
input.awesome.red, 
a.button.awesome.red {
	background-color: red;
}

button.awesome.gray, 
input.awesome.gray, 
a.button.awesome.gray {
	background-color: gray;
}

/* Touch the rest at your onw risk. */
button.awesome,
input.awesome,
a.button.awesome { 

  font: inherit;
  background-repeat: repeat-x; 
  color: #fff;
  text-decoration: none; 
  position: relative; 
  cursor: pointer; 
  border: 0; 
  font-style: normal; 
  font-weight: bold; 
  line-height: 1; 
  
  padding: 5px 10px 6px;
  font-size: 13px;
  
  /* IE only stuff */
  border-bottom: 1px solid transparent\9;
  
  
  /* not all browser support these, but who cares? */
  text-shadow: 0 -1px 1px rgba(0,0,0,0.25), -2px 0 1px rgba(0,0,0,0.25); 
  border-radius: 5px; 
  -moz-border-radius: 5px; 
  -webkit-border-radius: 5px; 
  -moz-box-shadow: 0 1px 2px rgba(0,0,0,0.5); 
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.5);
  
  /* one image for all states 
     see http://www.alistapart.com/articles/sprites */
  background-image: url("images/awesome-overlay-sprite.png");
  background-position: 0 0;
  
  /* cross browser inline block hack 
     see http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/ */
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: middle;
  *display: inline !important;
  position: relative;
  
  /* help IE to calm down a bit */
  zoom: 1;
  
  /*disable text selection (Firefox only)*/
  -moz-user-select: none;
}
/* hide selection background color */
.awesome::selection {
	background: transparent;
}

button.awesome:hover,
input.awesome:hover,
a.button.awesome:hover {
  background-position: 0 -50px; 
  color: #fff;
}
button.awesome:active,
input.awesome:active,
a.button.awesome:active	{ 
  background-position: 0 100%; 
  -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.7); 
  /* unfortunately, Safari seems not to support inset yet */
  -webkit-box-shadow: none;
  
  /* IE only stuff */
  border-bottom: 0\9;
  border-top: 1px solid #666\9;
}

button.awesome.small,         input.awesome.small,          a.button.awesome.small 	        { padding: 4px 7px 5px; font-size: 10px; }
button.awesome.small:active,  input.awesome.small:active,   a.button.awesome.small:active	  { padding: 5px 7px 4px; }
button.awesome.medium,        input.awesome.medium,         a.button.awesome.medium         { /* default */ }
button.awesome.medium:active, input.awesome.medium:active,  a.button.awesome.medium:active	{ padding: 6px 10px 5px; }
button.awesome.large,         input.awesome.large,          a.button.awesome.large 	        { padding: 8px 14px 9px; font-size: 14px; }
button.awesome.large:active,  input.awesome.large:active,   a.button.awesome.large:active	  { padding: 9px 14px 8px; }


.info, .success, .warning, .error, .validation, .notice, .alert {
    border: 1px solid;
    margin: 10px 0px;
    padding:15px 10px 15px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
}
.info {
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url('../images/info.png');
}
.success, .notice {
    color: #4F8A10;
    background-color: #DFF2BF;
    background-image:url('../images/success.png');
}
.warning, .alert {
    color: #9F6000;
    background-color: #FEEFB3;
    background-image: url('../images/warning.png');
}
.error {
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('../images/error.png');
}

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

It's *strongly* suggested that you don't modify this file.  Instead, load a new stylesheet after
this one in your layouts (eg formtastic_changes.css) and override the styles to suit your needs.
This will allow you to update formtastic.css with new releases without clobbering your own changes.

This stylesheet forms part of the Formtastic Rails Plugin
(c) 2008 Justin French

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


/* NORMALIZE AND RESET - obviously inspired by Yahoo's reset.css, but scoped to just form.formtastic
--------------------------------------------------------------------------------------------------*/
form.formtastic, form.formtastic ul, form.formtastic ol, form.formtastic li, form.formtastic fieldset, form.formtastic legend, form.formtastic input, form.formtastic textarea, form.formtastic select, form.formtastic p { margin:0; padding:0; }
form.formtastic fieldset { border:0; }
form.formtastic em, form.formtastic strong { font-style:normal; font-weight:normal; }
form.formtastic ol, form.formtastic ul { list-style:none; }
form.formtastic abbr, form.formtastic acronym { border:0; font-variant:normal; }
form.formtastic input, form.formtastic textarea, form.formtastic select { font-family:inherit; font-size:inherit; font-weight:inherit; }
form.formtastic input, form.formtastic textarea, form.formtastic select { font-size:100%; }
form.formtastic legend { color:#000; }


/* FIELDSETS & LISTS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset { }
form.formtastic fieldset.inputs { }
form.formtastic fieldset.buttons { padding-left:25%; }
form.formtastic fieldset ol { }
form.formtastic fieldset.buttons li { float:left; padding-right:0.5em; }

/* clearfixing the fieldsets */
form.formtastic fieldset { display: inline-block; }
form.formtastic fieldset:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
html[xmlns] form.formtastic fieldset { display: block; }
* html form.formtastic fieldset { height: 1%; }


/* INPUT LIs
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li { margin-bottom:1.5em; }

/* clearfixing the li's */
form.formtastic fieldset ol li { display: inline-block; }
form.formtastic fieldset ol li:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
html[xmlns] form.formtastic fieldset ol li { display: block; }
* html form.formtastic fieldset ol li { height: 1%; }

form.formtastic fieldset ol li.required { }
form.formtastic fieldset ol li.optional { }
form.formtastic fieldset ol li.error { }
  

/* LABELS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li label { display:block; width:25%; float:left; padding-top:.2em; }
form.formtastic fieldset ol li li label { line-height:100%; padding-top:0; }
form.formtastic fieldset ol li li label input { line-height:100%; vertical-align:middle; margin-top:-0.1em;}


/* NESTED FIELDSETS AND LEGENDS (radio, check boxes and date/time inputs use nested fieldsets)
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li fieldset { position:relative; }
form.formtastic fieldset ol li fieldset legend { position:absolute; width:25%; padding-top:0.1em; }
form.formtastic fieldset ol li fieldset legend span { position:absolute; }
form.formtastic fieldset ol li fieldset ol { float:left; width:74%; margin:0; padding:0 0 0 25%; }
form.formtastic fieldset ol li fieldset ol li { padding:0; border:0; }


/* INLINE HINTS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li p.inline-hints { color:#666; margin:0.5em 0 0 25%; }


/* INLINE ERRORS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li p.inline-errors { color:#cc0000; margin:0.5em 0 0 25%; }
form.formtastic fieldset ol li ul.errors { color:#cc0000; margin:0.5em 0 0 25%; list-style:square; }
form.formtastic fieldset ol li ul.errors li { padding:0; border:none; display:list-item; }


/* STRING & NUMERIC OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.string input { width:74%; }
form.formtastic fieldset ol li.password input { width:74%; }
form.formtastic fieldset ol li.numeric input { width:74%; }


/* TEXTAREA OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.text textarea { width:74%; }


/* HIDDEN OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.hidden { display:none; }


/* BOOLEAN OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.boolean label { padding-left:25%; width:auto; }
form.formtastic fieldset ol li.boolean label input { margin:0 0.5em 0 0.2em; }


/* RADIO OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.radio { }
form.formtastic fieldset ol li.radio fieldset ol { margin-bottom:-0.6em; }
form.formtastic fieldset ol li.radio fieldset ol li { margin:0.1em 0 0.5em 0; }
form.formtastic fieldset ol li.radio fieldset ol li label { float:none; width:100%; }
form.formtastic fieldset ol li.radio fieldset ol li label input { margin-right:0.2em; }


/* CHECK BOXES (COLLECTION) OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.check_boxes { }
form.formtastic fieldset ol li.check_boxes fieldset ol { margin-bottom:-0.6em; }
form.formtastic fieldset ol li.check_boxes fieldset ol li { margin:0.1em 0 0.5em 0; }
form.formtastic fieldset ol li.check_boxes fieldset ol li label { float:none; width:100%; }
form.formtastic fieldset ol li.check_boxes fieldset ol li label input { margin-right:0.2em; }



/* DATE & TIME OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.date fieldset ol li,
form.formtastic fieldset ol li.time fieldset ol li,
form.formtastic fieldset ol li.datetime fieldset ol li { float:left; width:auto; margin:0 .3em 0 0; }

form.formtastic fieldset ol li.date fieldset ol li label,
form.formtastic fieldset ol li.time fieldset ol li label,
form.formtastic fieldset ol li.datetime fieldset ol li label { display:none; }

form.formtastic fieldset ol li.date fieldset ol li label input, 
form.formtastic fieldset ol li.time fieldset ol li label input, 
form.formtastic fieldset ol li.datetime fieldset ol li label input { display:inline; margin:0; padding:0;  }


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

Load this stylesheet after formtastic.css in your layouts to override the CSS to suit your needs.
This will allow you to update formtastic.css with new releases without clobbering your own changes.

For example, to make the inline hint paragraphs a little darker in color than the standard #666:

form.formtastic fieldset ol li p.inline-hints { color:#333; }

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