/* reset */
html{color:#333;background:#FFF;}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}
/* fonts */
body{font:13px/1.231 arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}select,input,button,textarea{font:99% arial,helvetica,clean,sans-serif;}table{font-size:inherit;font:100%;}pre,code,kbd,samp,tt{font-family:monospace;*font-size:108%;line-height:100%;}

/* **************** TEMPLATE ***************** */
/* ====== Page Head, Body, and Foot ====== */
body{_text-align:center;}/* IE5.5 */
.body{overflow:hidden; _overflow:visible; _zoom:1;}
.page{margin: 0 auto; width: 950px;_text-align:left;} /* wraps other template elems to set width */ /* text-align IE5.5 */
/* "old school" and "liquid" extend page to allow for different page widths */
.oldSchool{width:765px;}
.gs960{width:960px;}
.liquid{extends:.page; width: auto;margin:0;}
/* ====== Columns ====== */
.main{overflow: hidden;_overflow:visible;_zoom:1;}
.leftCol{float:left; width:250px;_margin-right:-3px;}
.rightCol{float:right; width: 300px;_margin-left:-3px;}
/* extend columns to allow for common column widths */
.gMail{width:160px;}
.gCal{width:180px;}
.yahoo{width:240px;}
.myYahoo{width:300px;}

/* **************** GRIDS ***************** */
.line, .lastUnit {overflow: hidden;_overflow:visible;_zoom:1; }
.unit{float:left;_zoom:1;}
.unitExt{float:right;}
.size1of1{float:none;}
.size1of2{width:50%;}
.size1of3{width:33.33333%;}
.size2of3{width:66.66666%;}
.size1of4{width:25%;}
.size3of4{width:75%;}
.size1of5{width:20%;}
.size2of5{width:40%;}
.size3of5{width:60%;}
.size4of5{width:80%;}
.lastUnit {float:none;_position:relative; _left:-3px; _margin-right: -3px;width:auto;}
/* extending grids to allow a unit that takes the width of its content */
.media{width:auto;}

body{font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;}
/* **************** CONTENT OBJECTS ***************** */
/* ====== Default spacing ====== */
h1, h2, h3, h4, h5, h6, ul, ol,dl, p,blockquote {padding:10px 15px;}
h1, h2, h3, h4, h5, h6,img{padding-bottom:0px;}
pre{margin: 10px;}
table h1,table h2,table h3, table h4, table h5, table h6, table p, table ul, table ol, table dl,
ul h1,ul h2,ul h3, ul h4, ul h5, ul h6, ul p, ul ul, ul ol, ul dl,
ol h1,ol h2,ol h3, ol h4, ol h5, ol h6, ol p, ol ul, ol ol, ol dl {padding:0;}
/* ====== Elements ====== */
img{display:block;}
em{font-style: italic;}
strong{font-weight:bold;}
hr{height:1px; border:0px; background:#ccc; color:#ccc; margin: 20px}
code{color:#0B8C8F;}
/* ====== Headings ====== */

/* .h1-.h6 classes should be used to maintain the semantically appropriate heading levels - NOT for use on non-headings */
h1, .h1{font-size:200%;  font-weight:normal; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-style: normal; color:#666;}
h2, .h2{font-size:150%; font-weight:normal; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-style: normal; color:#666;}
h3, .h3{font-size:130%; font-weight:normal; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-style: normal; color:#666;}
h4, .h4{font-size:120%; font-weight:normal;  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-style: normal; color: #666;}
h5, .h5{font-size:108%; font-weight:bold;  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-style: normal; color:#666;}
h6, .h6{font-size:108%; font-weight:normal;   font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-style: italic; color:#333;}
/* if additional headings are needed they should be created via additional classes, never via location dependant styling */
.category{font-size:108%; font-weight:normal; font-style: normal; text-transform:uppercase; color: #333;}
.category a{color: #333;}
.important a{font-weight:bold;}
/* links */
a { color: #005a9c; font-weight:bold;text-decoration: none }
a:focus, a:hover { text-decoration: underline }
a:visited { color:#005a9c; }
/* ====== Lists ======*/
/* numbered list */
ol.simpleList li{list-style-type: decimal; margin-left:40px;}
/* standard list */
ul.simpleList li{list-style-type:disc; margin-left:40px;}
/* ====== Tables ====== */
.data{padding: 20px; position:relative; zoom:1;vertical-align: top;border-right:solid 1px transparent;/* border fixes a FF2 bug which causes the data table to overlay its borders*/}
.data table {width:100%;border:1px solid #ccc;}
th, td{vertical-align:top;border:1px solid #ccc;}
.txtC, .data .txtC td, .data .txtC th{text-align:center;}
.txtL, .data .txtL td, .data .txtL th{text-align:left;}
.txtR, .data .txtR td, .data .txtR th{text-align:right;}
.txtT, .data .txtT td, .data .txtT th{vertical-align:top;}
.txtB, .data .txtB td, .data .txtB th{vertical-align:bottom;}
.txtM, .data .txtM td, .data .txtM th{vertical-align:middle;}
.data th,.data td{padding:3px 10px}
.data thead tr{background-color: #fff0f8;}
.data th{color: #000; font-weight:bold}
/* specification table - extends data table */
.spec{padding:10px;}
.spec table{border-top: 1px solid #e2e2e2; border-bottom-color:#fff; border-left:none; border-right:none;}
.spec th, .spec td{border:1px solid #e2e2e2; border-width: 1px 0; padding-left:0;}
.spec .odd, .spec .even{background-color: #fff;}
/* ====== blockquote ====== */
cite{display:block; text-align:right; padding-top: 10px;}
/* ====== callout ====== */
.callout{font-size:189%;color:#999999; font-style:italic;}
.callout cite{display:block; text-align:right;padding-top: 30px; font-size:69.25%;}
.callout span.quot{font-size: 500%; vertical-align: sub; color:#e2e2e2; line-height:25px; font-weight:bold;}
.callout span.quotLast{vertical-align:middle;}
/* ====== image treatments (get more from jason santa maria) ====== */
.caption{font-size:13px; color:#666666; font-style:italic;padding-top:0;}
/* will need to either
1. find a way to capture the width of the caption in the width of the image or flash
2. Set some default widths, mby use flickr widths?
*/

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

   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms

   Usage:
   * For text fields, use class .title or .text

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

label       { font-weight: bold; }
fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
legend      { font-weight: bold; font-size:1.2em; }


/* Form fields
-------------------------------------------------------------- */

input.text, input.title, textarea, select {
	margin:0.5em 0;
	border:1px solid #bbb;
	font-size:14px;
	padding:3px;
}

input.text:focus, input.title:focus,
textarea:focus, select:focus {
  border:1px solid #666;
}


input.title   { width: 300px; padding:5px; }
input.title   { font-size:1.5em; }
textarea      { width: 390px; height: 250px; padding:5px; }

label {vertical-align:middle}
input.text, select {vertical-align:middle}


/* Success, notice and error boxes
-------------------------------------------------------------- */

.error,
.notice,
.success    { margin: 10px 15px; border: 2px solid #ddd; }

.error      { background: #FBE3E4; color: #8a1f11; border-color: #FBC2C4; }
.notice     { background: #FFF6BF; color: #514721; border-color: #FFD324; }
.success    { background: #E6EFC2; color: #264409; border-color: #C6D880; }
.error a    { color: #8a1f11; text-decoration:underline;}
.notice a   { color: #514721; text-decoration:underline;}
.success a  { color: #264409; text-decoration:underline;}


/**
 * Date Picker
 **/
a.dp-choose-date {
	width: 16px;
	height: 16px;
	padding: 0;
	margin: 0.5em 5px;
	vertical-align:middle;
	display: inline;
	text-indent: -2000px;
	overflow: hidden;
	background: url(../../images/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
 */
form .row input.dp-applied {
	width: 170px;
	float: left;
}
form .certificationBlock input.dp-applied {
	width: 100px;
	float: left;
}
.hiddenLicense{
	display:none;
}



table.jCalendar {
	border: 1px solid #000;
	background: #aaa;
    border-collapse: separate;
    border-spacing: 2px;
}
table.jCalendar th {
	background: #333;
	color: #fff;
	font-weight: bold;
	padding: 3px 5px;
}
table.jCalendar td {
	background: #ccc;
	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: #f66;
	color: #fff;
}
table.jCalendar td.selected:hover {
	background: #f33;
	color: #fff;
}
table.jCalendar td:hover, table.jCalendar td.dp-hover {
	background: #fff;
	color: #000;
}
table.jCalendar td.disabled, table.jCalendar td.disabled: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 {
	position: relative;
	background: #ccc;
	font-size: 10px;
	font-family: arial, sans-serif;
	padding: 2px;
	width: 184px;
	line-height: 1.2em;
}
div#dp-popup {
	position: absolute;
	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;
}


/* CUSTOM */


/* Structure */


body{
	background-image: url('../../images/header.jpg');
	background-repeat: repeat-x;
}
#header{
	height:114px;
	clear:both;
	margin-bottom:20px;
}

#menu{
	float:right;
	margin-top:33px;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#menu li{
	display:inline;
	border-right:1px solid white;
	padding-right:5px;
	margin-right:5px;
	font-size:16px;
}

#menu .last{
	border-right:0px;
}

#menu a{
	color:white;
	font-weight:normal;
}

#footer{
	margin-top:50px;
	height:250px;
	border-top:1px solid #ccc;
	background-image: url('../../images/gradient.jpg');
	background-repeat: repeat-x;
}

/* General Classes */

.left{
	float:left;
}
.right{
	float:right;
}

.marginRight{
	margin-right:10px;
}

.marginLeft{
	margin-left:10px;
}

.borderRight{
	border-right:1px solid #ccc;
}
.borderLeft{
	border-left:1px solid #ccc;
}

.imgInset{
	padding: 10px;
}

.clear{
	clear:both;
}

.justify{
	text-align:justify;
}

.center{
	text-align:center;
}

.right{
	text-align:right;
}
.left{
	text-align:left;
}

.bigTxt{
	font-size:120%;
}
.smallTxt{
	font-size:80%;
}

.specialTxt{
	font-family: "Warnock Pro", "Goudy Old Style","Palatino","Book Antiqua", Georgia, serif;
	font-style: italic;
	font-weight: normal;
	color:#558F3A;
}


.inline{
	display:inline;
}

.box{
	padding:10px 15px;
}

.formSubmit{
	padding:4px 10px;
	margin:0.5em auto;
	font-size:150%;
	font-weight:bold;
}

.bulletList li{
	margin:0px 15px 0px 30px;
	list-style-position:outside;
	list-style-type:disc;
}

.menuList li{
	margin:0px 15px;
	padding:5px;
	font-size:120%;
	border-bottom:1px solid #ccc;
}

.menuList ul li{
	font-size:84%;
	margin:5px 0px;
	border:0px;
	padding:0px;
	list-style-position:inside;
	list-style-type:disc;
}

.layoutTable td{
	border:0px;

}

.bold{
	font-weight:bold;
}

.errorColor{
	color:red;
}
.noticeColor{
	color:orange;
}

.successColor{
	color:green;
}

.row{
clear:both;
}

.tabstrip{
    display:block;
    border-bottom:1px solid #CCC;
    height:17px;
}
.tabstrip li{
    border:1px solid #CCC;
    float:left;
    height:26px;
    line-height:26px;
    padding:0 2em;
    margin:0 .5em;
    font-weight:bold;

}
.tabstrip li.selected{
    border-bottom:1px solid #fff;
}
