/*=====================================================================
* Filename: main.css
* Template: oogle
* Author: Jarel Remick - http://www.jremick.com
* Date Created: 12/04/2008
* Media: Screen
*
* Description
* -----------
* This style sheet is used for the single (right aligned) column, main (left aligned) column.
* CSS Reset using "reset.css" from 960 framework package, derived from Eric Meyers.
* Uses blueprint CSS as base starting point: http://www.blueprintcss.org/
=====================================================================*/

@import "reset.css";

body { background: #fff; }

/* ===== GLOBAL ===== */
.center { margin: 0 auto; }
.tcenter { text-align: center; }

.clear {
	clear: both;
	line-height: 10pc;
}

.fl { float: left; }
img.fl { float: left; margin: 8px 8px 8px 0; }
.fr { float: right; }
img.fr { float: right; margin: 8px 0 8px 8px; }

.ltc, .rtc, .lbc, .rbc { position: absolute; width: 4px; height: 4px; }
.ltc { top: -1px; left: -1px; background: url(../images/layout/left-corner-top.gif) no-repeat; }
.rtc { top: -1px; right: -1px; background: url(../images/layout/right-corner-top.gif) no-repeat; }
.lbc {
	bottom: 2px;
	left: 105px;
	background: url(../images/layout/left-corner-btm.gif) no-repeat;
}
.rbc { bottom: -1px; right: -1px; background: url(../images/layout/right-corner-btm.gif) no-repeat; }

/* Top Link (at footer) */
a.top { position: absolute; top: -13px; left: 0; }
a.top { width: 28px; height: 28px; background: url(../images/layout/top-icon.gif) no-repeat 0 -28px; }
a.top:hover { background-position: 0 0; }

/* Use this instead of html hr tag */
div.hr { width: 100%; height: 1px; background: #d5d5d5; }

/* ===== LAYOUT ===== */
#wrapper { width: 900px; margin: 0 auto; background: url(../images/layout/bg.jpg) no-repeat center 0; }

/* HEADER */
#header { width: inherit; height: 138px; position: relative; margin-bottom: 20px; }
#header .advert {
	position: absolute;
	top: 20px;
	right: 10px;
}
#header .logo {
	position: absolute;
	top: 11px;
	left: 10px;
}

/* NAVIGATION */
#nav { width: 900px; height: 38px; position: absolute; top: 100px; background: url(../images/layout/nav-bg-repeat.gif) repeat-x; }
#nav .left { width: 5px; height: inherit; position: absolute; left: 0; background: url(../images/layout/nav-left.gif) no-repeat; }
#nav .right { width: 5px; height: inherit; position: absolute; right: 0; background: url(../images/layout/nav-right.gif) no-repeat; }
#nav ul { height: inherit; list-style: none; }
#nav ul li { width: 117px; height: 36px; float: left; }
#nav ul li a { width: inherit; height: inherit; display: block; background: url(../images/layout/nav-bg.gif) no-repeat -352px 0; }
#nav ul li a:hover { background-position: -234px 0; }
#nav ul li a:active { background-position: -117px 0; }
#nav ul li a.active { background-position: 0 0; }

/* MAIN CONTENT */
#mainContent { width: 600px; float: left; }
#mainContent2 {
	width: 290px;
	float: none;
	background: url(../images/layout/blue-gradient-large.jpg) repeat-x;
}
#mainContent ul { list-style-position: inside; }
#mainContent .container { position: relative; margin-bottom: 10px; border: solid 1px #d5d5d5; background: #fff; }
#mainContent .container2 {
	position: relative;
	margin-bottom: 10px;
}
#mainContent .padContainer { padding: 10px; padding-bottom: 6px; }
#mainContent .padContainer2 { padding: 10px; padding-bottom: 6px; }
#mainContent .gradient { background: url(../images/layout/blue-gradient-large.jpg) repeat-x; }
#mainContent .story { padding: 20px; padding-bottom: 0; }
#mainContent .base,
#mainContent .breadCrumbs { background: url(../images/layout/base-gradient.gif) repeat-x; height: 20px; padding: 0 20px; }
#mainContent .base { border-top: solid 1px #d5d5d5; }
#mainContent .breadCrumbs { border-bottom: solid 1px #d5d5d5; }
#mainContent .category { 
	height: 31px;
	position: relative;
	margin-bottom: 5px;
	padding: 0 20px;
	border: solid 1px #d5d5d5;
	background: url(../images/layout/category-gradient.gif) repeat-x;
}

ul.showcase { list-style: none; margin: 0; }
ul.showcase li { width: 133px; float: left; }
ul.showcase li img { margin-bottom: 5px; }
ul.showcase span { display: block; }

#mainContent .gridContainer { width: 532px; margin: 0 auto; }
#mainContent .gridContainer ul { margin-top: 8px; }
#mainContent .gridContainer ul li { margin-bottom: 15px; }

/* MAIN CONTENT TABS */
#mainTabs .tabContent { width: 598px; height: 184px; }
#mainTabs .ui-tabs-hide { display: none; }
#mainTabs .info {
	position: absolute;
	top: 35px;
	left: 20px;
	height: 167px;
}
#mainTabs .info ul { margin-left: 30px; }

#mainTabs ul.nav { margin: 0; height: 16px; list-style: none; background: url(../images/layout/tab-bg-repeat.gif) repeat-x; }
#mainTabs ul.nav li { height: inherit; width: 49px; float: left; }
#mainTabs ul.nav li a { height: inherit; width: 49px; display: block; background: url(../images/layout/tab-bg.gif) no-repeat -148px 0; }
#mainTabs ul.nav li a:hover { background-position: -98px 0; }
#mainTabs ul.nav li a:active { background-position: -49px 0; }
#mainTabs ul.nav .ui-tabs-selected a { background-position: 0 0; }

#productTabs .ui-tabs-hide-p { display: none; }
#productTabs .linksList { width: 158px; border: solid 1px #d5d5d5; position: relative; float: left; margin-bottom: 5px; }
#productTabs .linksList { background: url(../images/layout/grey-gradient-med.gif) repeat-x; }
#productTabs .linksList ul { list-style: none; margin: 7px 0; }
#productTabs .linksList li a { display: block; padding: 0 10px; }
#productTabs .linksList li a:hover,
#productTabs .linksList .ui-tabs-selected-p a { background: #e7f0f8; }

/* FOOTER */
#footer { width: inherit; position: relative; margin-top: 20px; padding-bottom: 15px; }
#footer .nav { margin-left: 28px; }
#footer ul { list-style: none; margin: 0; }
#footer ul li { float: left; padding: 2px 7px; border-right: solid 1px #666; }
#footer ul li.last { border: none; }
#footer ul li.last2 { border: none; }


/* ===== FONTS =====  Default font settings. The font-size percentage is of 16px. (0.75 * 16px = 12px) */
/* Global */
body { font-size: 75%; color: #222; background: #fff; font-family: "Myriad Pro", "Helvetica Neue", Arial, Helvetica, sans-serif; }

.readmore { font-style: italic; padding-left: 8px; }

/* NAVIGATION */
#nav ul { font-size: 1.2em; line-height: 38px; text-align: center; }
#nav ul li a { color: #383838; text-decoration: none; }
#nav ul li a:hover,
#nav ul li a:active,
#nav ul li a.active { color: #fff; }

/* MAIN CONTENT */
#mainContent .story p { font-size: 1.15em; line-height: 1.3em; color: #666; }
#mainContent .base,
#mainContent .breadCrumbs { font-size: .85em; line-height: 23px; letter-spacing: .05em; color: #999; }
#mainContent .breadCrumbs a { padding: 0 3px; }
#mainContent .base .author { color: #666; }
#mainContent .category h4 { font-size: 1.3em; line-height: 35px; color: #333;}
#mainContent ul { font-size: 1.05em; line-height: 1.3em; }


ul.showcase { color: #666; line-height: 1.3em; }
ul.showcase span { font-weight: bold; color: #000; }

/* MAIN CONTENT TABS */
#mainTabs { text-align: center; }
#mainTabs noscript { font-size: 1em; line-height: 2em; color: red; }
#mainTabs ul.nav a { text-align: center; font-size: .8em; line-height: 1.45em; color: #666; text-decoration: none; }
#mainTabs ul.nav a:hover,
#mainTabs ul.nav .ui-tabs-selected a { color: #fff; }
#mainTabs .info { text-align: left; }
#mainTabs .info ul { font-size: 1.1em; line-height: 1.5em; }

#productTabs .linksList ul { line-height: 1.8em; font-size: 1.05em; }
#productTabs .linksList ul a { color: #333; }
#productTabs .linksList ul a:hover { color: #4185d2; text-decoration: none; }

/* FOOTER */
#footer {
	color: #999;
	text-align: right;
	line-height: 1.2em;
	font-size: 0.9em;
}

/* Headings */
h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #111; }

h1 {
	font-size: 1.3em;
	line-height: 35px;
	margin-bottom: 1.25em;
}
h2 { font-size: 2em; margin-bottom: 0.5em; }
h3 { font-size: 1.7em; line-height: 1; margin-bottom: .75em; }
h4 { font-size: 1.3em; line-height: 1.25; margin-bottom: 1.25em; }
h5 { font-size: 1em; font-weight: bold; margin-bottom: 1.5em; }
h6 { font-size: 1em; font-weight: bold; }

h1 img, h2 img, h3 img, 
h4 img, h5 img, h6 img { margin: 0; }


/* Text elements */
p           { margin: 0 0 1.5em; }
p img.left  { float: left; margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p img.right { float: right; margin: 1.5em 0 1.5em 1.5em; }

a           {
	color: #222;
	text-decoration: none;
	cursor: pointer;
} 
a:hover     { text-decoration: underline; }

blockquote  { margin: 1.5em; color: #666; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

abbr, 
acronym     { border-bottom: 1px dotted #666; }
address     { margin: 0 0 1.5em; font-style: italic; }
del         { color:#666; }

pre 		{ margin: 1.5em 0; white-space: pre; }
pre,code,tt { font: 1em 'andale mono', 'lucida console', monospace; line-height: 1.5; }


/* Lists */
li ul, 
li ol       { margin:0 1.5em; }
ul, ol      { margin: 0 1.5em 1.5em 1.5em; }

ul          { list-style-type: disc; }
ol          { list-style-type: decimal; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}


/* Misc classes */
.small      { font-size: 1em; line-height: 1.3em; }
.medium		{ font-size: 1.2em; line-height: 1.6em; }
.large      { font-size: 1.45em; line-height: 2em; }
.hide       { display: none; }

.white		{ color: #fff; }
.bright		{ color: #f4f4f4; }
.quiet      { color: #666; }
.black       { color: #000; }
.highlight  { background:#ff0; }
.added      { background:#060; color: #fff; }
.removed    { background:#900; color: #fff; }

.first      { margin-left:0; padding-left:0; }
.last       { margin-right:0; padding-right:0; }
.top        { margin-top:0; padding-top:0; }
.bottom     { margin-bottom:0; padding-bottom:0; }

#mainContent2 ul {
	font-size: 1.05em;
	line-height: 1.3em;
}
.wufoo{
	font-family:"Lucida Grande", Tahoma, Arial, sans-serif;
}
.wufoo li{
	width:62%;
}
form ul{
	margin:0;
	padding:0;
	list-style-type:none;
	width:100%;
}
form li{
	display: block;
	margin:0;
	padding:4px 5px 2px 9px;
	clear:both;
}
form li:after{
	content:"."; 
	display:block;
	height:0; 
	clear:both; 
	visibility:hidden;
}
* html form li{height: 1%;}
* html form li div{display:inline-block;}
*+html form li div{display:inline-block;}

form li div, form li span{
	margin:0 4px 0 0;
	padding:0 0 8px 0;
	color:#444;
}
form li span{
	float:left;
}

form li div.column{
	padding-bottom:0;
}
form li div span.left, form li div span.right{
	width:47% !important;
	margin:0;
}
form li div span.full input, 
form li div span.full select, 
form li div span.left input, 
form li div span.right input,
form li div span.left select,
form li div span.right select{
	width:100%;
}

.left{
	float:left;
}
.right{
	float:right;
}
.clear{
	clear:both !important;
}

/* ----- INFO ----- */

.info{
	display:inline-block; 
	clear:both;
	border-bottom:1px dotted #ccc;
	margin:0 0 1em 0;
}
.info[class]{
	display:block;
}
.info h2{
	font-weight:normal;
	font-size:160%;
	margin:0 0 .2em 0;
	clear:left;
}
.info div{
	font-size:95%;
	line-height:135%;
	margin:0 0 1em 0;
	color:#555;
}

/* ----- SECTIONS ----- */

form hr{
	display:none;
}
form li.section{
	border-top:1px dotted #ccc;
	padding-top:.9em;
	padding-bottom:0px;
	padding-left:9px;
	width:97% !important;
	position:static;
}
form ul li.first{
	border-top:none !important;
	margin-top:0px !important;
	padding-top:0px !important;
}
form .section h3{
	font-weight:normal;
	font-size:110%;
	line-height:135%;
	margin:0 0 .2em 0;
}
form .section div{
	display:block;
	font-size:85%;
	margin:0 0 1.2em 0;
	padding:0;
}

/* ----- LIKERT SCALE ----- */

form li.likert{
	width:97% !important;
}
.likert table{
	margin:0 0 1.5em 0;
	background:#fff;
	width:100%;
	border:1px solid #dedede;
	border-bottom:none;
}
.likert caption{
	text-align:left;
	color:#222;
	font-size:95%;
	line-height:135%;
	padding:5px 0 .4em 0;
}
.likert input{
	padding:0;
	margin:2px 0;
}
.likert label{
	font-size:10px;
	display:block;
	color:#565656;
}

/* ----- Top Row ----- */

.likert thead td, .likert thead th{
	background-color:#e6e6e6;
}

/* ----- Right Side ----- */

.likert td{
	border-left:1px solid #ccc;
	text-align:center;
	padding:4px 6px;
}
.likert thead td{
	font-size:85%;
	padding:10px 6px;
}

/* ----- Body ----- */

.likert th, .likert td{
	border-bottom:1px solid #dedede;
}
.likert tbody th{
	color:#222;
	font-size:95%;
	font-weight:bold;
	padding:8px 8px;
}

.likert tbody tr.alt td, .likert tbody tr.alt th{
	background-color:#f5f5f5;
}
.likert tbody tr:hover td, .likert tbody tr:hover th{
	background-color:#FFFFCF;
}

/* ----- Likert Classes ----- */

.col1 td{width:30%;} 
.col2 td{width:25%;}
.col3 td{width:18%;}
.col4 td{width:14.5%;}
.col5 td{width:12%;}
.col6 td, .col7 td{width:10%;}
.col8 td, .col9 td, .col10 td{width:6.5%;}
.col11{width:6%;}

.hideNumbers tbody label{
	display:none;
}

/* ----- LABELS ----- */

label.desc{
	line-height:150%;
	padding:0 0 1px 0;
	border:none;
	color:#222;
	display:block;
	font-size:95%;
	font-weight:bold;
}
form li div label, form li span label{
	margin:0;
	padding-top:6px;
	clear:both;
	font-size:9px;
	line-height:9px;
	color:#444;
	display:block;
}
label.choice{
	font-size:100%;
	display:block;
	line-height:1.5em;
	margin:-1.65em 0 0 25px;
	padding:.44em 0 .5em 0;
	color:#222;
	width:88%; 
	display:block;
}

span.symbol{
	font-size:115%;
	line-height:130%;
}
form li .datepicker{
	float:left;
	margin:.1em 5px 0 0;
	padding:0;
	width: 16px;
	height: 16px;
	cursor:pointer !important;
}

/* ----- MIN/MAX COUNT ----- */

form li div label var{
	font-weight:bold;
	font-style:normal;
}
form li div label .currently{
	display:none;
}

/* ----- FIELDS ----- */

input.text, input.file, textarea.textarea, select.select{
	margin:0;
	font-size:100%;
	color:#333;
}
input.text, textarea.textarea, .firefox select.select{
	border-top:1px solid #7c7c7c;
	border-left:1px solid #c3c3c3;
	border-right:1px solid #c3c3c3;
	border-bottom:1px solid #ddd;
	background:#fff url(/images/fieldbg.gif) repeat-x top;
}
input.text, input.file{
	padding:2px 0 2px 0;
}
input.checkbox, input.radio{
	display:block;
	line-height:1.5em;
	margin:.6em 0 0 3px;
	width:13px;
	height:13px;
}
input.other{
	margin:0 0 0 25px;
}

textarea.textarea{
	font-family:"Lucida Grande", Tahoma, Arial, sans-serif;
}

select.select{
	font-family:"Lucida Grande", Tahoma, Arial, sans-serif;
	margin:1px 0;
	padding:1px 0 0 0;
}
select.select[class]{
	margin:0;
	padding:1px 0 1px 0;
}
*:first-child+html select.select[class]{
	margin:1px 0;
}
.safari select.select{
	margin-bottom:1px;
	font-size:120% !important;
}

/* ----- BUTTONS ----- */

input.btTxt{
	padding:0 7px;
	width:auto;
	overflow:visible;
}
.buttons{
	clear:both;
	margin-top:10px;
}
.buttons input{
	font-size:120%;
	margin-right: 5px;
}

/* ----- TEXT DIRECTION ----- */

.rtl .info h2, .rtl .info div, .rtl label.desc, .rtl label.choice, 
.rtl div label, .rtl span label, .rtl input.text, 
.rtl textarea.textarea, .rtl select.select, .rtl p.instruct, 
.rtl .section h3, .rtl .section div, .rtl input.btTxt{
	direction:rtl;
}

/* ----- SIZES ----- */

.third{
	width:32% !important;
}
.half{
	width:48% !important;
}
.full{
	width:100% !important;
}

input.small, select.small{
	width:25%;
}
input.medium, select.medium{
	width:50%;
}
input.large, select.large, textarea.textarea{
	width:100%;
}

textarea.small{
	height:5.5em;
}
textarea.medium{
	height:10em;
}
textarea.large{
	height:20em;
}

/* ----- ERRORS ----- */

#errorLi{
	width:99%;
	margin:0 auto;
	background:#fff;
	border:1px dotted red;
	margin-bottom:1em;
	text-align:center;
	padding-top:4px;
	padding-left:0px;
	padding-right:0px;
}
#errorMsgLbl{
	margin:7px 0 5px 0;
	padding:0;
	font-size:125%;
	color:#DF0000;
}
#errorMsg{
	margin:0 0 .8em 0;
	color:#000;
	font-size:100%;
}
#errorMsg strong{
	background-color: #FFDFDF;
	padding:2px 3px;
	color:red;
}
form li.error{
	display:block !important;
	border-bottom:1px solid #F9B9B2;
	border-right:1px solid #F9B9B2;
	background-color: #FFDFDF !important;
}
form li.error label{
	color:#DF0000 !important;
}
form p.error{
	display:none;
	color:red;
	font-weight:bold;
	font-size:10px;
	margin:-2px 0 5px 0;
	clear:both;
}
form li.error p.error{
	display:block;
}
.leftLabel p.error, .rightLabel p.error{
	margin-left:30%;
	padding-left:15px;
}
.noI .leftLabel p.error, .noI .rightLabel p.error{
	margin-left:35%;
	padding-left:15px;
}

/* ----- REQUIRED ----- */

form .req{
	float:none;
	color:red !important;
	font-weight:bold;
	margin:0;
}

/* ----- INSTRUCTIONS ----- */

form li.focused{
	background-color:#ebffc0;
}
form li.focused, form li:hover{
	position:relative; /* Makes Instructs z-index stay on top in IE. */
}
form .instruct{
	position:absolute;
	top:0;
	left:0;
	z-index:1000;
	width:42%;
	margin:0 0 0 8px;
	padding:8px 10px 9px 10px;
	border:1px solid #e6e6e6;
	background:#f5f5f5;
	line-height:130%;
	font-size:80%;
	color:#444;
	visibility:hidden;
}
form .instruct small{
	font-size:105%;
}
form li.focused .instruct, form li:hover .instruct{
	left:100%; /* Prevent scrollbars for IE Instruct fix */
	visibility:visible;
}

/* ----- ALT INSTRUCTIONS ----- */

.altInstruct .instruct, li.leftHalf .instruct, li.rightHalf .instruct{
	visibility:visible;
	position:static;
	margin:-2px 0 0 0;
	padding:0 0 7px 0;
	width:100%;
	clear:left;
	background:none;
	border:none;
	font-size:9px;
}

/* ----- LABEL LAYOUT ----- */

.leftLabel li, .rightLabel li{
	width:74% !important;
	padding-top:9px;
}


.leftLabel label.desc, .rightLabel label.desc{
	float:left;
	width:29%;
	margin:2px 15px 0 0;
}
.rightLabel label.desc{
	text-align:right;
}
.leftLabel .column, .rightLabel .column{
	float:left;
}


.leftLabel .small, .rightLabel .small{
	width:17%;
}
.leftLabel .medium, .rightLabel .medium{
	width:35%;
}
.leftLabel .large, .leftLabel textarea.textarea,
.rightLabel .large, .rightLabel textarea.textarea,
.leftLabel .column, .rightLabel .column{
	width:64%;
}


* html .leftLabel .small, * html .rightLabel .small{
	width:23%;
}
* html .leftLabel .medium, * html .rightLabel .medium{
	width:55%;
}
* html .leftLabel .large, * html .leftLabel textarea.textarea,
* html .rightLabel .large, * html .rightLabel textarea.textarea{
	width:97%;
}


.leftLabel p.instruct, .rightLabel p.instruct{
	width:27%;
	margin-left:5px;
}
.leftLabel .altInstruct .instruct, .rightLabel .altInstruct .instruct{
	margin-left:29% !important;
	padding-left:15px;
	width:65%;
}


.leftLabel .buttons, .rightLabel .buttons{
	margin-left:15px;
}
.leftLabel .buttons input, .rightLabel .buttons input{
	margin-left:29%;
}
* html .leftLabel .buttons input, * html .rightLabel .buttons input{
	margin-left:22%;
}
* html .leftLabel .buttons, * html .rightLabel .buttons{
	margin-left:4px;
}
*+html .leftLabel .buttons, *+html .rightLabel .buttons{
	margin-left:7px;
}

/* ----- NO INSTRUCTIONS ----- */

.noI .instruct{
	display:none !important;
}
.noI form li, .noI form li.buttons, .altInstruct form li, .altInstruct form li.buttons{
	width:97% !important;
}
.noI form li.section, .altInstruct form li.section{
	padding-left:9px !important;
}

/* ----- NO INSTRUCTIONS LABEL LAYOUT ----- */

.noI .leftLabel label.desc, .noI .rightLabel label.desc{
	width:34%;
}
.noI .leftLabel .large, .noI .leftLabel textarea.textarea,
.noI .rightLabel .large, .noI .rightLabel textarea.textarea,
.noI .leftLabel .column, .noI .rightLabel .column{
	width:60%;
}

.noI .leftLabel .buttons input, .noI .rightLabel .buttons input{
	margin-left:34%;
}

/* ----- FIELD FLOATING ----- */

form li.leftHalf, form li.rightHalf{
	width:46% !important;
}
li.leftHalf{
	clear:left;
	float:left;
}
li.rightHalf{
	clear:none;
	float:right;
}
li.leftHalf .medium, li.rightHalf .medium,
li.leftHalf .small, li.rightHalf .small{
	width:100%;
}
.subH3 {
	font-size: 0.85em;
	line-height: 1em;
	color: #586514;
	font-style: italic;
}