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

Global Style Sheet for CU Budget Calculator

Updated: 09/12/09

Main Colours: 
Dark CU Green: #006685
Light Green: #9F9C25

TOC:

01. Style Reset
02. Default Text
03. Button Styles
04. Image and Icon Styles
05. Wrappers
06. Header
07. Main Content
08. Footer
09. Horizontal Nav
10. Form Nav
11.Forms
12. Tables
13. Messages
14. Border Edges


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


body 
{
	font: 75%/1.6 Calibri, 'Helvetica Neue', Arial, Helvetica, Geneva, sans-serif;
	color: #006685;
}

html>body /* For everything except IE6 */

{
	font-size: 12px;
}




/* =Style Reset
-------------------------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td 
{
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: normal;
  vertical-align: baseline;
}

/* Tables still need 'cellspacing="0"' in the markup. */
table 
{
	border-collapse: separate;
	border-spacing: 0;
}		

caption, th, td 
{
	text-align: left;
	font-weight: normal;
}

table, td, th 
{
	vertical-align: middle;
}

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before,
blockquote:after,
q:before,
q:after 
{
	content: "";
}

blockquote,
q 
{
	quotes: "" "";
}

/* Remove annoying border on linked images. */
a img 
{
border: none;
}




/* =Default Text
-------------------------------------------------------------------------------- */

h2,h3,h4,h5,h6 
{ 
  clear: both; 
}

h1  { 	
	position: absolute; /* Shove the h1 right off viewport */
	right: 4000px;
}

h2 {
	font-size:2.8em;
	line-height: 1em;
	margin-bottom: .85em;
}

h3 {
	font-size:1.8em;
	line-height: .75em;
	margin-bottom: .15em;
}

p           
{ 
	font-size: 1.2em;
	margin: 1.5em 0; 
}	

a:link,
a:visited 
{ 
	color: #9F9C25;
	font-weight: bold;
	text-decoration: none; 
	border-bottom: 1px dotted #ccc;
	padding-bottom: 1px;
}

a:hover,
a:active       
{ 
	color: #006685;
	text-decoration: none; 
	border-bottom: 1px solid #666;
	padding-bottom: 1px;
}


strong      
{ 
	font-weight: bold; 
}

em         
{ 
	font-style: italic; 
}

blockquote 
{
background:transparent url(../images/bq.png) no-repeat 0%;
color:#555555;
margin:1em 0pt;
padding-left:30px;
}

/* Horizontal Rule */

hr {
  background: #222; 
  color: #222;
  clear: both; 
  float: none; 
  width: 100%; 
  height: 1px;
  margin: 2.4em 0 2em 0;
  border: none; 
}

* html hr  /* IE6 fix */
{ 
  margin: 2em 0 1.6em 0;
}

.right {
	float: right;
}


/* =Button Styles
-------------------------------------------------------------------------------- */

a.start-but {
    position: absolute;
    right: 20px;top: 250px;
    width: 315px;    
    height: 90px;
    border: 0;
    outline: none;
    text-decoration: none;
    background: url(../images/button_start.png) no-repeat;
}

a:hover.start-but {
    background: url(../images/button_start.png) no-repeat 0 -101px;
}

a.start-but span {
	position: absolute;
    left: -10000px;
}

a.start-but, 
a:visited.start-but {
	border:0;
}


a.save-but {
	float: right;
    width: 200px;    
    height: 65px;
    margin-top: 20px;
    border: 0;
    outline: none;
    text-decoration: none;
    background: url(../images/button_save.png) no-repeat;
}

a:hover.save-but {
    background: url(../images/button_save.png) no-repeat 0 -72px;
}

a.save-but span {
	position: absolute;
    left: -10000px;
}

a.save-but, 
a:visited.save-but {
	border:0;
}

.larger
{ 
	font-size: 140%;
	font-weight: bolder;
}


/* =Image and Icon Styles
-------------------------------------------------------------------------------- */



.pic
{
	width: 100%;
	border: #ccc 2px solid;
	padding-bottom: 10px;
	margin: 0 0 1.6em 0;
}

.picSm
{
	float: left;
	width: 80px;
	margin-right: 15px;
	padding: 5px;
	border: 1px dotted #999;
	padding-bottom: 10px;
}

a.video-icon
{
	padding: 10px 40px 5px 0;
	margin-bottom: 20px;
	border: 0;
	background: url(../images/icon_video.png) no-repeat 100% 20%;
}

/* =Wrappers and Gutters
-------------------------------------------------------------------------------- */

.global-wrapper /* To push footer to bottom */
 {
 	min-height: 80%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -4em;
 }   
 
.wrapper 
{
	width: 940px;
    margin: 0 auto;
}




/* =Header and Search Banner
-------------------------------------------------------------------------------- */

#header
{
	float: left;
   	width: 100%; 
}




/* =Main Content Layout
-------------------------------------------------------------------------------- */

#main-content
{
	float: left;
	margin: 70px 0;
	width: 100%;
}

.branding
{
	position: relative;
	width:200px;
	height: 100px;
	background: red;
}

.logo
{
	position:absolute;
}

.logo a:link,
.logo a:visited {
	border: 0;
}




/* =Main Content Layout
-------------------------------------------------------------------------------- */


.intro-box {
	width: 940px;
	position: relative;
	background:  #016380 url(../images/intro_box_top.jpg) no-repeat top;
}

.intro-box h2 {
	color: #fff;
	font-size: 4.8em;	
	line-height: 1.1;
	text-transform: uppercase;
	padding: 40px 360px 0 30px;
	margin-bottom: .3em;
}

.intro-box p {
	color: #fff;
	font-size: 1.4em;	
	padding: 0 380px 0 30px;
}

.intro-box-bot {
	height: 50px;
	background:url(../images/intro_box_bot.jpg) no-repeat bottom;

}

.intro-image {
	position: absolute;
	right: -30px; top: -50px;
}





/* =Footer
-------------------------------------------------------------------------------- */
#footer
{
	clear: both;
	width: 100%;
	border-top: 1px #cfe4ea solid;
	padding: 20px 0 90px 0;
}

ul.footerNav 
{
    float: right;
    list-style: none;
    display: inline;
    margin-bottom: 20px;
}

.footerNav li 
{
	display: inline;
    margin-right:0px;
}

ul.footerDetails 
{
    list-style: none;
}

ul.footerDetails li 
{
    display: inline;
}




/* =Horizontal Navigation
-------------------------------------------------------------------------------- */

ul#nav 
{ /* all lists */
	float: right;
	text-align: right;
	margin-top: 75px;
	padding: 0;
	list-style: none;
	font-weight: bold;
	width: 640px;
}

ul#nav li
{
	font-size: 1.2em;
	display: inline;
	width: 100px;
	line-height: 1.4;
	text-align: center;
	text-decoration: none;
	margin-left: 20px;
}

ul#nav li a:link,
ul#nav li a:visited {
	color: #006685;
	text-decoration: none;
	border: none;
}

ul#nav li a:hover {
	color: #0F9BC8;
}

ul#nav li.current a {
	color: #9F9C25;
}





/* =Form Navigation
-------------------------------------------------------------------------------- */
ul#form-nav
{
	float: left;
	width: 100%;
	margin: 0 0 -1px 0;
}	

ul#form-nav li 
{ /*float the main list items*/
	margin: 0 5px 0 0;
	padding: 0;	
	float: left;
	display: block;
}

ul#form-nav li a 
{
	text-decoration: none;
	border: none;
	font-weight: bold;
	display: block;
	text-align: center;
	padding: 12px 15px 15px;
	border-bottom: 0;
}



	

/* =Seen Skip Nav
-------------------------------------------------------------------------------- */


ul#skip 
{
	left: -5000px;
	position: absolute;
	width: 25%;
	top: 10px; right: 0;
	padding: 4px 0 4px 0;
	list-style-type: none;
}




/* =Forms
-------------------------------------------------------------------------------- */
	
fieldset
{  
	float: left;
	margin-bottom: 20px;
}

legend
{  

}

label
{  
	font-weight: bold; 
}


input {
	padding: 4px;
	border-right: #c1c1c1 solid 1px;	
	border-bottom: #c1c1c1 solid 1px;	
	border-left: #919191 solid 1px;	
	border-top: #919191 solid 1px;	
}

input:focus
{
	background:#FEFCDD url(../images/form_arrow_on.png) no-repeat 0 50%;
}


/* =Table Styling
----------------------------------------------------------------  */

table {
	width: 100%;
	border-collapse:separate;
	border-spacing:1px;
	font-weight:bold;
}

caption {
	display: hidden:
}


td, th {
	padding: 10px 20px; 
}

tbody th
{
	color: #fff;
	font-size: 1.4em;
	font-weight:bold;
	background:#9F9C25;
}

tbody td
{
	font-size: 1.2em;
	font-weight:normal;
	background:#f1f7f9;
}

.name {
	font-size: 1.8em;
	width: 400px;
}

.total td {
	font-size: 1.6em;
	padding-left: 25px;
	background: none;
}


tbody.review tr td {
	width: 130px;
}

.total-review td {
	font-size: 1.6em;
	line-height: 1.25;
	padding-top: 20px;
	padding-bottom: 30px;
	background: none;
}

.review-text {
	padding-left: 0;
}

.warn td{
	color: #dc4b00;

}

.amber td{
	color: #e3ce00;

}

.go th {
	color: #9F9C25;
}

/* =Messages
-------------------------------------------------------------------------------- */
.message {
	color: #00718f;
	margin-bottom: 1.5em;
	border: 1px dotted #cfe4ea;
	background: #ecf4f6;

}

.message ol {
	padding: 15px 25px 10px;
	margin-left: 25px;
}

.message li {
	font-size: 1.4em;
	margin-bottom: .75em;
}



/* =Border Edges
-------------------------------------------------------------------------------- */
input, .message, ul#form-nav li a {
	border-radius: 5px;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;	
}

/* *************************************************
**************************************************
************************************************

			GOOD NIGHT AND GOODLUCK!
			
************************************************
************************************************
********************************************* */

