﻿/*=--------------GENERAL STYLES ------------------*/

* {margin: 0; padding: 0;}

html, body, form {height: 100%; margin: 0; padding: 0;}
form {cursor: default;}
body {background: #fff url(../images/backgrounds/bgMain.gif) repeat center top; font: 12px Verdana, sans-serif; color: #535353; line-height: 1.6em; text-align: center;}

a {color: #ec1d25; text-decoration: underline;}
a:link, a:visited {color: #ec1d25;}
a:hover, a:active {color: #737373;}
p {margin-bottom: 1em;}
img {border: 0;}
input, textarea {font-size: 11px; font-family: Verdana, Arial, sans-serif; color: #666;}
ul, ol {padding-left: 1.5em; margin-bottom: 1em;}

.floatRight{float: right;}
.floatLeft {float: left;}
.noFloat {float: none; display: inline;}
.clearBoth {clear: both;}

.redText {color: #ec1d25;}
.blackText {color: #737373;}
.twoTimes {font-size: 18px;}
.fourTimes {font-size: 24px;}

/*=------------------ Header Styles -----------------------*/

h1, h2, h3, h4, h5 {margin-bottom: 1em; font-weight: bold;}

h1 {font-size: 18px; color: #ec1d25;}

h3 {font-size: 16px; color: #939393; margin-bottom: 0;}

h4 {font-size: 14px; color: #ec1d25; font-weight: bold;}

/*=------------------ End Header Styles -----------------------*/

/*=------------------ Button and Link Styles -----------------------*/

.button {overflow: hidden; padding: 0;}

.button a.buttonRed {background: transparent url(../images/inputs/buttonRedCap.gif) no-repeat left top; display: block;
font: bold 11px Verdana; text-transform: uppercase; line-height: 22px; height: 24px; padding-left: 4px; text-decoration: none; cursor: pointer;}
.button a.buttonRed:link, .button a.buttonRed:visited, .button a.buttonRed:active {color: #fff;}
.button a.buttonRed:hover {background-position: left bottom;}
.button a.buttonRed span{background: transparent url(../images/inputs/buttonRed.gif) no-repeat right top; height: 24px; display: block; padding: 0 12px 0 6px; float: left;}
.button a.buttonRed:hover span {background-position: right bottom; text-decoration: none; color: #fff;}

.button a.buttonGrey {background: transparent url(../images/inputs/buttonGreyCap.gif) no-repeat left top; display: block;
font: bold 11px Verdana; text-transform: uppercase; line-height: 22px; height: 24px; padding-left: 4px; text-decoration: none; cursor: pointer;}
.button a.buttonGrey:link, .button a.buttonGrey:visited, .button a.buttonGrey:active {color: #fff;}
.button a.buttonGrey:hover {background-position: left bottom;}
.button a.buttonGrey span{background: transparent url(../images/inputs/buttonGrey.gif) no-repeat right top; height: 24px; display: block; padding: 0 12px 0 6px; float: left;}
.button a.buttonGrey:hover span {background-position: right bottom; text-decoration: none; color: #fff;}

a.learnMore {color: #737373;}
a.learnMore:hover {color: #ec1d25;}

/*------------------ END Button Styles -----------------------*/

#container {background: transparent url(../images/backgrounds/bgContent.gif) repeat-y right top; width: 800px; min-height: 100%; margin: -224px auto 0 auto; padding-bottom: 0; position: relative; z-index: 1;}


/*=------------------ Content Styles -----------------------*/

#content {padding: 234px 0 100px 0; text-align: left;}

.contentMain {width: 579px; float: left; padding: 38px 38px 76px 45px; margin-right: -662px; text-align: left;}

*html .contentMain {height: 300px;}
		
	/*=----------------------------------------------Componant Boxes--------*/
	
	.sideBoxes {width: 176px; border: solid 2px #fff; margin: 15px 0 0 30px; text-align: left;}
	
	.loginBox {background: #fff url(../images/backgrounds/bgLogin.gif) no-repeat center bottom; padding: 12px 20px; float: right; clear: right;}
	.loginBox ol {list-style: none; margin: 15px 0; padding: 0; float: left;}
	.loginBox ol li {float: left; margin-bottom: 9px;}
	.loginBox ol li label {width: 4em; font-size: 12px; font-weight: bold; color: #4e4d4d; float: left;}
	.loginBox ol li input {width: 124px; height: 19px; border: solid 1px #585757; font-size: 12px;}
	.loginBox a.loginLink {font-size: 9px; display: block; width: 90px; float: right; letter-spacing: .01em; text-align: right;}
	
	.memberloginBox {background: #fff url(../images/backgrounds/bgLogin.gif) no-repeat center bottom; padding: 12px 20px; float: right; clear: right;}
	.memberloginBox ol {list-style: none; margin: 15px 0; padding: 0; float: left;}
	.memberloginBox ol li {float: left; margin-bottom: 9px;}
	.memberloginBox ol li label {width: 100%; font-size: 12px; font-weight: bold; color: #4e4d4d; float: left; display: block;}
	.memberloginBox ol li input {width: 124px; height: 19px; border: solid 1px #585757; font-size: 12px; clear: both;}
	.memberloginBox a.loginLink {font-size: 9px; display: block; width: 100%; float: right; letter-spacing: .01em; text-align: right;}

	
	.magazineBox {background: #e3e3e3 url(../images/backgrounds/bgMag.jpg) no-repeat right bottom; padding: 12px 20px; float: right; clear: right;}
	.magazineBox h3 {margin-bottom: 1em;}
	.magazineBox p {width: 100px; display: block; font-size: 10px; color: #6c5754; line-height: 1.5em; margin: 1em 0 2em 0;}
	
	.videoBox {background: #e3e3e3 url(../images/backgrounds/bgCheckoutbox.gif) no-repeat right bottom; padding: 12px 20px; float: right;} 
	.videoBox h3 {margin-bottom: 1em;}
	.videoBox p {font-size: 10px; color: #6c5754; line-height: 1.5em; margin: 0 0 10px 0;}
	.videoBox img {float: right; margin: 0 auto 10px auto;}
	
	.boxFirst {margin-top: 0;}
	.boxLast {margin-bottom: 30px;}
		
	/*=---------------------------------------------- END Componant Boxes--------*/
	
	/*=----------------------------------------------Checkout Boxes--------*/

	.checkoutBox  {background: #fff url(../images/backgrounds/bgCheckoutbox.gif) no-repeat scroll right bottom; padding: 12px 20px 20px 20px; border: solid 2px #fff; float: left; margin-bottom: 1em; text-align: left;}
	.checkoutThin {width: 237px;}
	.checkoutWide {width: 535px;}
	.checkoutSummary {float: right;}
		.checkoutSummary table {width: 100%; font-size: 10px; margin-bottom: 1em;}
		.checkoutSummary td {padding: 0 5px 5px 0;}
		.checkoutSummary td.summaryItem {width: 50%; font-weight: bold; line-height: 1.1em;}
		.checkoutSummary td.summaryInfo {text-align: right;}
		.checkoutSummary td.summaryAmount {padding: 0; text-align: right; font-weight: bold;}
	.checkoutDiscount {float: right; clear: right;}
	.checkoutShipping {display: block;} /*<------CHANGE BACK TO DISPLAY NONE WHEN SITE GOES UP --*/
	.checkoutError {background: #fff url(../images/backgrounds/bgErrorbox.jpg) no-repeat scroll left top; padding-left: 80px; width: 475px; color: #333; display: block;} /*<------CHANGE BACK TO DISPLAY NONE WHEN SITE GOES UP --*/}
	
	.checkoutBox p {display: block; width: 100%; clear: both; float: left; font-size: 11px;}
	.checkoutBox p a {font-size: 11px;}
	.checkoutBox ol {list-style: none; margin: 0; padding: 0;}
	.checkoutBox ol li {float: left; width: auto; margin: 0 5px 5px 0;}
		*html .checkoutBox ol li {margin: 0;}
	.checkoutBox ol li.fullLine {width: 100%;}
	.checkoutBox ol li label {display: block; width: 100%;}
	.checkoutBox ol li label.inlineInput {display: inline; width: auto; padding-right: 5px;}
	.checkoutBox ol li input [type=text] {width: 100%;}
	.checkoutBox ol li input [type=checkbox] {margin-top: 5px; vertical-align: top;}
	.checkoutBox ol li select {margin-bottom: 5px;}
	.checkoutBox ol li select, .checkoutBox ol li option {font-size: 11px; font-family: Verdana, Arial, sans-serif; color: #666;}
	.checkoutBox ol li span.additionalInfo {font-size: 10px; color: #999; font-style: italic; line-height: 1em;}
	.checkoutBox ol li span.requiredText {font-size: 10px; color: #ec1d25; font-style: italic; visibility: hidden;}
	
	/*=----------------------------------------------END Checkout Boxes--------*/
	
	/*=----------------------------------------------Survey Styles--------*/
		
	ol.surveyList {margin: 0; padding: 0; list-style: none;}
	ol.surveyList li {background: #fff url(../images/backgrounds/bgCheckoutbox.gif) no-repeat scroll right bottom; width: 535px; padding: 12px 20px 20px 20px; border: solid 2px #fff; float: left; margin-bottom: 1em;}
	ol.surveyList li span {display: block; margin-bottom: 1em; font-weight: bold;}
	ol.surveyList li input {vertical-align: baseline; margin-right: 1em;}
	
	/*=----------------------------------------------END Survey Styles--------*/
	
/*=------------------ End Content Styles -----------------------*/

/*=------------------ Mast Styles -----------------------*/

.mastWrapper {background: transparent url(../images/backgrounds/bgHeader.gif) no-repeat center top; width: 100%; height: 224px; position: relative; z-index: 100000; text-align: center;}
.mast {width: 800px; height: 176px; margin: 0 auto; text-align: left;}
.mast h2 {margin-left: -10000px;} 

.mast .cfsLogo {float: left; margin-top: 48px;}
.mast .mastImage {float: right;}

/*=------------------ End Mast Styles -----------------------*/

/*=------------------ Navigation Styles -----------------------*/

.globalNav {width: 138px; float: left; margin-top: 26px;}
*html .globalNav {overflow: hidden;}

.globalNavErrorPage {width: 138px; float: left; margin-top: 26px;}
.globalNavErrorPage ul {list-style: none; margin: 0; padding: 0;}
.globalNavErrorPage a {background: transparent url(../images/nav/navDefault.png) no-repeat 0 0; width: 87px; height: 38px; padding: 0 28px 0 23px; display: block;
font-family: Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: #fff; text-decoration: none; line-height: 36px;}
.globalNavErrorPage a:hover {background-position: 0 -38px;}
*html .globalNavErrorPage a {background: transparent url(../images/nav/navDefault.gif) no-repeat 0 0; color: #fff!important;}

ul.interiorNav {background: #e3e3e3; list-style: none; margin: 1em 0; padding: 0; width: 100%;}
ul.interiorNav li {display: inline; border-right: solid 1px #b3b3b3;}
ul.interiorNav li a {padding: 0 10px;}
ul.interiorNav li.first a {padding-left: 0;}
ul.interiorNav li.last {border: 0;}
ul.interiorNav li.last a {padding-right: 0;}

/*=------------------ End Navigation Styles -----------------------*/

/*=---------------------------------------------- Footer Styles --------*/
	
#footer {background: transparent url(../images/backgrounds/bgFooter.gif) no-repeat left top; width: 579px; height: 76px; text-align: center; margin: 0 0 0 0; padding: 72px 38px 0 183px; clear: both; position: absolute; bottom: 0; left: 0;}
#footer ul {width: 579px; list-style: none; margin: 0; padding: 0 0 5px 0; border-bottom: solid 1px #fff;}
#footer ul li {display: inline;}
#footer ul li.last a {border: 0;}
#footer ul li a {height: 10px; font-size: 8px; font-weight: normal; color: #fff; text-decoration: none; text-transform: uppercase; padding: 0 7px 0 3px; border-right: solid 1px #fff;}
#footer ul li a:hover {text-decoration: underline;}
#footer p {width: 579px; font-size: 10px; color: #fff; margin: 5px 0 0 0; padding: 0;}

*html #footer {background: transparent url(../images/backgrounds/bgFooter.gif) no-repeat left top;}
	
	/*=---------------------------------------------- Footer Styles --------*/

/*=------------------ Error Messaging Styles -----------------------*/

#error {margin: 12px 0; padding: 10px 5px 10px 10px; background: #ffdfdf url(../images/icons/error.gif) no-repeat 10px 50%; color: #cc0000; border: 1px solid #EFA4A4;}
#error ul {list-style: none; margin: 0; padding: 0 30px; font-weight: bold;}
#error ul li {list-style: none;}
#action {margin: 1.2em 0; padding: .25em 0; background: #edffdf url(../images/icons/action.gif) no-repeat 6px 50%; color: #009900; border: 1px solid #B6EFA4;}
#action ul {list-style: none; margin: 0; padding: 0 30px; font-weight: bold;}

/*=------------------ END Error Messaging Styles -----------------------*/

