﻿/* 4.01 Strict corrections */
* {	font-family: Arial, helvetica, clean, sans-serif;margin: 0px;padding: 0px;}
body 
{
	color:#505152;
	background-position: 50% top;
	background-image: url(/Images/Skin/BlueShapes.jpg);
	background-repeat: repeat-y;
	background-color: #070738;
	font-size:0.90em;
}
table {	border-collapse: collapse;table-layout:fixed;}
td, th {border-bottom: 0px;vertical-align:top;border-collapse: collapse;}
img {display:block;}
br {clear:both;}
fieldset {padding:1px;margin-right:10px;border-radius: 3pt;}
.footer {
	border-top: solid 1px #006B91;
	color:#F2F2F2;
	text-align:right;
	font-size: 10px;
	background-color:#0E456E;
	width:984px;
	padding: 4px 8px 8px 8px;
	margin: 0px auto 0px auto;
	box-shadow:	4px 4px 5px #0E5168;
}
.footer a {
	color: #fcfcfc;
}
/**********
 Structure
**********/
#customerLogo 
{
	background-image: url('/images/OfficeProLogo.png'); 
	width: 314px;
	height:59px;
	float:left;
}

.centerIt{margin-left:auto;margin-right:auto;}
.centerIt h2, .centerIt h1 {text-align:center;}
#topArea {border-bottom: solid 1px #006B91;	background-color: #ffffff;width:1000px;margin-top: 4px;overflow:auto;box-shadow:4px 4px 5px #444;}
div.ColumnA {width:700px;}
div.ColumnB {width:470px;}
div.ColumnC {width:310px;}
div.ColumnD {width:200px;}
.check label { padding: 0px 3px 0px 3px;}
/**********
 look 
 0px margin required on Hx to prevent the containing div from getting a margin in FF/WebKit. weird.
**********/
.mainContent {
	width: 984px;
	background-color: #FCFEFF;
	margin-left:auto;
	margin-right:auto;
	padding: 0px 8px 8px 8px;
	overflow:auto;
	box-shadow:	4px 4px 5px #444;
}
h1 {color: #1E4056;font-size:24px;margin-bottom:10px;}
h2 {color: #BF1717;font-size:20px;margin-bottom:10px;}
h3 {color: #1849BC;font-size:16px;}
h4 {color: #9BB7F7;font-size:14px;}
.fieldLabel {color:#1E4056;font-size:14px;font-weight:bold;}
.autoWide { width:198px;padding:4px;}
.fieldEntry { width: 151px;padding:4px;}
.fieldEntryWide { width: 225px;padding:4px;}
input[type="text"], input[type="email"] { padding:4px; }
input[type="text"]:focus, input[type="password"]:focus, input[type="email"]:focus {background-color:#EFFFF6;}
select { padding:4px; }
/* - the focus background color causes firefox to expand the padding or margins.  Either way, it jacks with the layout.
removing for now (2011.02.18-CL)
select:focus {background-color:#EFFFF6;}
*/
input.button {
	border: #999999 1px solid; 
	cursor: pointer; 
	font-size: 12px; 
	color: #333333; 
	background: url('/images/Button.png') #ffd769; 
	height:28px;
	padding: 0px 1.0em;
	width: 0;  /* IE table-cell margin fix */
	overflow: visible;
}
input.button:hover { cursor:pointer; color: #000000;background-color: #ccccdc;}
input.button:focus {background-color:#ccccdc;color: #000000;}
input.button[class] {  /* IE ignores [class] */
	width: auto;  /* cancel margin fix for other browsers */
}
td input.button[class] { 
	width: auto;/* correct problem in IE 7 */
}
.highlightButton { 
	border-top: #999999 1px solid;
	border-right: #999999 1px solid;
	border-bottom: #999999 1px solid;
	border-left: #999999 1px solid;
	cursor: pointer;
	font-size: 12px;
	color: #ffffff;
	background: url('/images/Button.png') #a65555;
	padding: 5px;
	text-decoration:none;
}
.highlightButton:hover 
{
	cursor:pointer;
	color: #000000;
	background-color: #ccccdc;
}
.previewIcon
{
	background-image:url('/Images/Preview.png');
	background-repeat: no-repeat; 
	height:24px;
	width:24px;
	float:left;
	margin-left:5px;
	margin-right:5px;
	text-decoration: none;
	cursor: pointer;
}
.previewIcon:hover {
	background-image:url('/Images/PreviewHover.png');
	text-decoration: none;
}
.greenButton { background-color: #083F09 !important; color: White !important; }

.warningImage { font-size: 16px; font-weight:bold; padding-left:20px; overflow:auto; background-repeat: no-repeat;color:Red;}
.warningRow {background-color:Yellow;}
.floatLeft {float:left;}
.floatRight { float:right;}
.setBorder { border: solid 1px #0b0c3c; }
/*****************************
	 Form Rendering
*****************************/
.renderQuest 
{
	width: 750px;
	border-collapse: collapse;
	table-layout: fixed; /* perfect for fast rendering */
	margin-top: 4px;
	margin-left: 10px;
	margin-bottom: 4px;
	margin-right: 10px;

}
tr.renderAddress > td {	padding-bottom: 4px; }
.renderQuestReadOnly
{
	width: 750px;
	border-collapse: collapse;
	table-layout: fixed; /* perfect for fast rendering */
	margin-top: 20px;
	margin-left: 10px;
	margin-bottom: 4px;
	margin-right: 10px;
}
.renderQuestFull {width:575px;}
.renderQuestStd {width:400px;}
.renderQuestMin {width:125px;}
.renderQuestAddr {width:408px;}
.renderAnswerFull {width:600px;}
.renderAnswerStd {width: 250px; }
.renderAnswerMin {width:350px;}
.renderAnswerAddr {width:342px;}
.shortForm {width:700px;}

.noFloat { clear:both; overflow:auto;}
.noFloat label {float:left; width:50px;}
.noFloat input {float:left;}
.noFloatWide label {width:200px;}

.inputCountDown { font-size: 10px; white-space: nowrap; padding-left: 1px}

ul { margin-top: 1em;margin-bottom:8px;padding-left:1em;margin-left:0;}
ol { margin-top: 1em;margin-bottom:8px;padding-left:1em;margin-left:0;}
li { list-style-type: disc;padding-left:1em;margin-left:0;list-style:decimal;}

table.renderAnswerRadio > tbody > tr > td > label { width: 150px !important;padding-bottom:4px;}
table.renderAnswerCBL > tbody > tr > td > label { padding-bottom:4px;padding-left:3px;}
table.renderAnswerCBL { width: 780px; }

/*****************************
	 Commerce Rendering
*****************************/
.commerceOptionRow td { padding-bottom:6px;}
.CommerceOptionName { width:450px;font-weight:bold;}
.CommerceOptionValue { width:200px;text-align: right;}
.productQty { width: 50px; padding:4px;}
.priceArea { width:200px; text-align: right;}
.commerceOptionValueText { padding:4px;margin-left:11px;}
.commerceOptionValueFree { padding:4px;}
.commerceOptionValueList { padding:4px; margin-left:11px;}
.commerceOptionValueCheck { margin-left:11px; }
.alertText { background-color: yellow; padding: 4px;  }
