/* ~/Scripts/style_tweaks.js adds extra markup for some of the more complex styles.
   They are annotated throughout the stylesheet & will degrade properly with JS off. */

* { margin: 0; padding: 0; }

body {
	font: .6875em/1.45em Verdana, Arial, Helvetica, sans-serif; /* 11px/16px */
	text-align: left;
	color: #666666;
	
	background-color:#fff;
	voice-family:female;
}

h1, h2, h3, h4, h5, h6 { line-height: 2em; font-weight: normal; text-transform: lowercase; }

h1 { font-size: 3.63em; } /* 40px */
h2 { font-size: 2.90em; } /* 32px */
h3 { font-size: 1.63em; } /* 18px */
h4 { font-size: 1.27em; } /* 14px */
h5 { font-size: 1.09em; } /* 12px */
h6 { font-size: 1em;    } /* 11px */

h1 { color: #a62912; line-height: 1.5em; }
h2 { line-height: 1em; margin: .5em 0; color: #0f6890; }
h2 .nextLine { display: block; color: #a62912; font-size: .6875em; /* 22px */ }
h3 { margin-top: 2em; color: #a62912; }
h4 { font-weight: bold; line-height: 1.45em; }

p { margin: 0 0 1.45em 0; }
p.intro { font-size: 1.27em; line-height: 1.45em;  }
p.next { margin-top: 3em;  color: #ad8213; }

img { border: none; }

a { text-decoration: none; color: #0f6890; }

acronym { text-transform: none; }

strong:first-child { font-weight: normal; color: #ad8213; }

ul { list-style: disc outside; }
ul li, ol li { margin: 0 0 1.45em 4em; }
ul ul { list-style: circle outside; margin-top: 1em; }
ul ul li { margin: 0 0 0 4em; }
ol { list-style-position: inside; }
ol ul { list-style: none; margin-top: 1em; overflow: auto; width: 100%;}
ol ul li { float: left; width: 14em; margin: 0; }

/* style_tweaks.js adds spans for contrasting bullets */
ul.contrast,
ol.contrast { color: #ad8213; }
ul.contrast.yellow,
ol.contrast.yellow { color: #ad8213; }
ul.contrast.green,
ol.contrast.green { color: #358129; }
ul.contrast.red,
ol.contrast.red { color: #a62912; }
ul.contrast.gold,
ol.contrast.gold { color: #ad8213; }

ul.contrast li span,
ol.contrast li span { color: #666666; }

/* style_tweaks.js adds spans & applies color classes to LIs for multi-colored bullets */
ul.rainbow li span,
ul.rainbow li span a,
ol.rainbow li span,
ol.rainbow li span a { color: #666666; }

ul.stripeYellow { list-style: none; background: url(images/common/bg_stripe_yellow.gif); padding: .125em 1em 1em 1em; margin: 2em 0; color: #ad8213; }
ul.stripeYellow li { margin: 1em 0 0 0; }

ul.stripeBlue { list-style: none; background: url(images/common/bg_stripe_blue.gif); padding: .125em 1em 1em 1em; margin: 2em 0; color: #ad8213; }
ul.stripeBlue li { margin: 1em 0 0 0; }

ul.stripeGray { list-style: none; background: url(images/common/bg_stripe_gray.gif); padding: .125em 1em 1em 1em; margin: 2em 0; color: #ad8213; }
ul.stripeGray li { margin: 1em 0 0 0; }

ul.stripeRed { list-style: none; background: url(images/common/bg_stripe_red.gif); padding: .125em 1em 1em 1em; margin: 2em 0; color: #ad8213; }
ul.stripeRed li { margin: 1em 0 0 0; }

ul.noStripe { list-style: none; background: none; background-color: #ffffff; padding: .125em 1em 1em 1em; margin: 1em 0em 0em 0em; color: #666666; }
ul.noStripe li { margin: 1em 0 0 0; }

ul.tips { list-style: none; margin-top: 1.45em; }
ul.tips li { margin: 0 0 1.45em 0; }

ul.links { background: url(images/common/dash_horizontal.gif) top left repeat-x; list-style: none; margin-top: 2.5em;}
ul.links li { background: url(images/common/dash_horizontal.gif) bottom left repeat-x; margin: 0; line-height: 2.5em; }

ul.blocks { margin: 1.5em -11px 0 0; overflow: auto; }
ul.blocks li { list-style: none; background: url(images/common/bg_stripe_yellow.gif); margin: 0 10px 10px 0; padding: 10px; width: 244px; float: left; }
ul.blocks ul { margin: 0; padding: 0; }
ul.blocks ul li { background: none; padding: 0; list-style: disc ; margin: 0 1.5em; width: auto; float: none; }
ul.blocks ul.padOneLine { margin-bottom: 1.45em; }


ul.starterpack, ul.starterpack ul, ul.starterpack li, ul.starterpack ul li { list-style: none; margin: 0; padding: 0; background: none; height: auto;}
ul.starterpack { background: url(images/starterpack_bg.gif) top left no-repeat; width: 550px; }
ul.starterpack li { width: 231px; background-position: top left; background-repeat: no-repeat; float: left;  padding-top: 140px;}
ul.starterpack li ul li { margin-left: 2em; }
ul.starterpack li.capsules { padding-right: 20px; height: 145px; background-image: url(images/starterpack_li1.jpg) }
ul.starterpack li.shuttle { margin-left: 20px; height: 145px; background-image: url(images/starterpack_li2.jpg) }
ul.starterpack li.plan { padding-right: 20px; background-image: url(images/starterpack_li3.jpg) }
ul.starterpack li.booklets {  margin-left: 20px; background-image: url(images/starterpack_li4.jpg) }

div.headingBar { background: url(images/common/dash_horizontal.gif) top left repeat-x; margin-bottom: 1em; }
div.headingBar h3 { background: url(images/common/dash_horizontal.gif) bottom left repeat-x; padding-bottom: 8px; padding-top: 10px; }
div.headingBar a { float: right; position: relative; top: -3.8em; }

/* style_tweaks.js replaces <p><a class="button"></a></p> with <div class="button"> */
div.button { float: left; }
div.button a { text-align: center; line-height: 20px; padding: 0 1em; line-height: 22px; position: relative; top: -1px; }
div.button .left { padding-left: 4px; background: url(images/common/callout_button_left.gif) top left no-repeat; }
div.button .right { padding-right: 4px; background: url(images/common/callout_button_right.gif) top right no-repeat; }
div.button .top { background: white url(images/common/dash_horizontal.gif) top repeat-x; }
div.button .bottom { background: url(images/common/dash_horizontal.gif) bottom repeat-x; }


.red, .red * { color: #a62912; }
.blue, .blue * { color: #0f6890; }	
.yellow { color: #ad8213 !important; }	
.yellow * { color: #ad8213 }
.green, .green * { color: #358129; }
.gold, .gold * { color: #ad8213; }

.clearfix:after { content: "."; display: block; height: 0; 	clear: both; visibility: hidden; }
.clearfix { min-height: 1px; height: auto !important; height: 1px; }

.clickable { cursor: pointer; }


#canvas { margin-left: auto; margin-right: auto; width: 925px; }

#header, #header * { margin: 0; padding: 0; }
#header { background: url(images/common/header_bg_gradient.jpg) left bottom repeat-x; padding: 17px 13px 21px 15px; }
#header .logo { display:block; float:left; position: relative; top: 20px; }
#header .menuContainer { float:right; margin-top: 20px; }
#header .menuContainer ul { list-style: none; text-transform: lowercase; }

ul#topNav { width: 813px; font-size: 10px; text-align:right; padding-bottom: 12px; position: relative; left: 4px}
ul#topNav li { display:inline; margin-left:16px;white-space:nowrap; }
ul#topNav li a { color:#CCCCCC; }
ul#topNav li a:hover { color:#a62912; }
ul#topNav li.selected a { color:#a62912; }

ul#mainNav { float: right; margin-right: -13px; }
ul#mainNav a { display: block; }
ul#mainNav li { width: 114px; height: 34px; line-height: 34px; float: left; position: relative; font-size:12px; text-align: center; }
ul#mainNav li.first { text-align: left; width:50px; background:none !important; }
ul#mainNav li.last { /* left: 8px; */ }
ul#mainNav ul { display: none; background: url(images/common/menu_bg_submenu.gif) left bottom no-repeat; }
ul#mainNav ul li { font-size:10px; text-align:center; height: 24px; line-height: 24px; }
ul#mainNav ul li.long { font-size: 9px; }
ul#mainNav li:hover { background: url(images/common/menu_bg_menuLi.gif) left top no-repeat; z-index: 1000; }
ul#mainNav li:hover ul { position: absolute; left: 0; top:32px; background-color: white; z-index: 999; display: block; /* match top li height */ }
ul#mainNav li:hover li { background: url(images/common/dash_horizontal.gif) left bottom repeat-x; }

ul#mainNav li.selected span a { color:#a62912; }
ul#mainNav li span a { color:#666666; }
ul#mainNav li span.selected a { color:#a62912; }
ul#mainNav ul a { color:#a62912; }
ul#mainNav ul a:hover { color:#a62912; }
ul#mainNav ul li a { color:#9D9FA2; }
ul#mainNav ul li a:hover { color:#0f6890; }
ul#mainNav ul li.selected a { color:#0f6890; }

#MainContentWrapper { border: 3px solid #e0f2ff; margin-top: 2px; background-color: white; padding: 0 2px 2px 2px; }
#MainContent { background: url(images/common/middle_gradient.jpg) bottom left repeat-x; position: relative;}
#MainContent #subheader { height:257px; position: absolute; top: 0px; left: -2px; width: 919px; }
#MainContent #text, #MainContent #callouts { margin-top: 257px; }
#MainContent #text { float: left; width: 537px; margin-left: 30px; display: inline; padding-bottom: 4em; }
#MainContent #text.nosubheader { margin-left: 0; float: none; width: auto; display: block; padding-bottom: 0px; margin-top: 0;}
#MainContent #text.full { width: auto; margin-right: 30px; display: block; }
#MainContent #callouts { background: url(images/common/dash_vertical.gif) top left repeat-y; width: 234px; padding-left: 30px; float: right; margin-bottom: 4em; }


#subheader h1,
#subheader .quote { margin-left: 500px; }
#subheader h1 { margin-top: .25em; }
#subheader .quote { margin-right: 40px; }
#subheader .quote .text { color: #358129; font-size: 1.27em; line-height: 1.4em; /* 14px */ }
#subheader .quote .username { color: #ad8213; display: block; margin: 1em 0 0 0; font-size: 1.09em; /* 12px */}

#subheader { background: url(images/subheader/whats_included.jpg) top left no-repeat; }
#subheader.about { background: url(images/subheader/about.jpg) top left no-repeat; }
#subheader.alliplan { background: url(images/subheader/alliplan.jpg) top left no-repeat; }
#subheader.healthyEating { background: url(images/subheader/healthy_eating.jpg) top left no-repeat; }
#subheader.keepingFit { background: url(images/subheader/keeping_fit.jpg) top left no-repeat; }
#subheader.allicircles { background: url(images/subheader/allicircles.jpg) top left no-repeat; }
#subheader.gettingStarted { background: url(images/subheader/getting_started.jpg) top left no-repeat; }
#subheader.whatsIncluded { background: url(images/subheader/whats_included.jpg) top left no-repeat; }

#callouts .callout { background: url(images/common/dash_horizontal.gif) left bottom repeat-x; width: 170px; margin: 0 0 .75em 0; padding: 0 0 1.25em 0; color: #7C7C7C;}
#callouts .callout h4 { margin-bottom: .25em; }
#callouts .callout img { margin-bottom: 1em; }
#callouts .callout ul { list-style: none; margin: 0; padding: 0;}
#callouts .callout ul li { margin: 0; padding: 0;}
#callouts .callout ul li a { color: #358129; }
#callouts .callout:first-child {}
#callouts .callout:last-child { padding-bottom: 0; background-image: none; }

#footer, #footer * { margin: 0; padding: 0; }
#footer { background-color:#e0f2ff; color:#999999; font-size: 9px; padding:17px 13px 24px 40px; }
#footer #footerLegal { float: left; margin-top: 0px; }
#footer #footerLegal img { float:left; }
#footer #footerLegal p { float:left; width:240px; line-height:12px; margin-left: 6px}
#footer ul#footerNav { float:right; text-transform: lowercase; }
#footer ul#footerNav li { display: block; padding: 0 8px 0 6px; float: left; background:transparent url(images/common/footer_separator.gif) right 4px no-repeat; }
#footer ul#footerNav li a { color:#999999; }
#footer ul#footerNav li.last { background:none; padding-right: 0px; }

#footer ul#socialNav { float:right; text-transform: lowercase; padding-right: 33px; }
#footer ul#socialNav li { display: block; padding: 0 8px 0 6px; float: left; }
#footer ul#socialNav li a { color:#999999; }
#footer ul#socialNav li.last { background:none; padding-right: 0px; }

.noflashPopup { text-align: center; background: transparent url(images/common/noflash_popup.png) top left no-repeat; width: 287px; height: 251px; padding: 20px 20px 25px 25px; margin-left: -5px; overflow: hidden; }
.noflashPopup h3 { color: #a62912; line-height: 1em; margin-top: 0; text-transform: none; }
.noflashPopup p { margin-top: 1em; }
.noflashPopup img.logo { margin-top: 1em; }
.noflashPopup a.continue { display: none; }

.noflash { text-align: center; position: relative;}
.noflash .noflashPopup { margin: auto; margin-top: 1em; }

#homeFlash .noflash { background: url(images/noflash.jpg) no-repeat; }
#SelfAssessment .noflashPopup { margin-top: 150px; position: relative; left: -18px;  }
#SelfAssessment .noflash { margin-left: -2px; background: white url(images/noflashSAQ.gif) no-repeat; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 50;}

#productInformation { background: url(images/home_bg_product_info.jpg) top right no-repeat; padding: 10px 0 10px 203px; position: relative; left: 2px;}
#productInformation h2 { margin: 0; color: #666666; }
#productInformation p { width:510px; font-size: 12px; margin: 1em 0; }

.columnContainer { width:919px; border-top: #e0f2ff solid 3px; margin-right: -4px; position: relative; left: -2px; }
.columnContainer h3 { margin-top: 16px; margin-bottom: 2px; }
.columnContainer img { position: relative; top: -7px; }
.columnContainer .col1,
.columnContainer .col2 { width: 228px; float:left;}
.columnContainer .col1,
.columnContainer .col2 { border-right:3px solid #e0f2ff; }
.columnContainer .col3 { float:left;}
.columnContainer p { float:left; width:185px; margin: 0 16px 15px 0; }

.columnContainer .colWrapper { border: 2px solid white; padding: 0 0 16px 34px; border-top: none; border-bottom: none;}
.columnContainer .col1 .colWrapper {  }
.columnContainer .col2 .colWrapper {  }
.columnContainer .col3 .colWrapper {  padding: 0; padding-bottom: 2px;  }

ul.FAQ, ul.FAQ li, ul.FAQ ul, ul.FAQ ul li { margin: 0; padding: 0; list-style-type: none;}
ul.FAQ { margin: 2em; }
ul.FAQ .arrow { padding-right: 1.125em; margin-bottom: -2px; background: url(images/common/arrow_expand.png) right bottom no-repeat; }
ul.FAQ .collapse .arrow { background-image: url(images/common/arrow_collapse.png); }
ul.FAQ strong { font-weight: bold; color: #666666; }
ul.FAQ li { margin-bottom: 10px; }
ul.FAQ li h4 {font-size: 1em; font-weight: normal; background: url(images/common/bg_stripe_gray.gif); color: #a62912; background-color:  #a62912; line-height: 26px; padding-left: 1em; }
ul.FAQ li.collapse h4 { color: #666666; }
ul.FAQ li.collapse ul { display: none; }
ul.FAQ li ul { background-color: White; padding: 1em 1em 0 2.5em; }
ul.FAQ li ul h4 { margin-bottom: 10px; position: relative; left: -1em; }
ul.FAQ li ul li { line-height: 16px; margin-bottom: 1em; color: #999999;}
ul.FAQ li ul li h5 { font-size: 1em; line-height: 1.25em; color: #ad8213; }
ul.FAQ li ul li.collapse * { display: none; }
ul.FAQ li ul li.collapse h5 { display: block; color: #666666; }
ul.FAQ li ul li.collapse h5 span { display: inline; }
ul.FAQ li ul li ol,
ul.FAQ li ul li ul { margin: 0 0 0 2em; padding: 0; }

ul.FAQ li ul li ol li { list-style: outside decimal; }
ul.FAQ li ul li ul li { list-style: outside disc; }

ul.FAQ li ul li ol ul { margin-top: 1em; overflow: auto; width: auto;}
ul.FAQ li ul li ol ul li { list-style: inside disc !important; float: none; width:auto; }

div.sitemap { padding: 0 0px; margin-bottom: 8em;}
div.sitemap div.column { float: left; width: 21em; background: url(images/common/dash_vertical.gif) top left repeat-y; padding-left: 1.5em;  }
div.sitemap div.column h3 { margin-top: 0; padding-top: 0; }
div.sitemap div.column ul { list-style: none; margin: 0 0 2.5em 0; padding: 0; }
div.sitemap div.column ul.last { margin: 0; }
div.sitemap div.column li { margin: 0; padding: 0; }


.ContactTable { margin: 2em 2em 4em 0; }
.ContactTable input, .ContactTable select, .ContactTable textarea { margin: 2px 0; }
.ContactTable input[type=checkbox] { margin-right: .5em; position: relative; top: 2px }
.ContactTable input[type=submit] { padding: .25em}
.ContactTable .RequiredMarkerLabel { color: Red; }
.ContactTable .contactheader { display: none; }
.ContactTable .QuestionLabel { display: block; text-align: right; }
.ContactTable .registrationRequiredTable input,
.ContactTable .registrationRequiredTable textarea,
.ContactTable .NonRequiredTd input { width: 235px; }
.ContactTable .registrationRequiredTable select,
.ContactTable .NonRequiredTd select { width: 239px; }


.HelpContainer { /*CSS for pop up hint box */
top: 300px !important;
left: 300px !important; 
background-color: #ffffe0;
width: 320px;
padding: 3px;
border:1px solid black;
z-index:100;
border-right: 3px solid black;
border-bottom: 3px solid black;
visibility: hidden;
}

.HelpTitleBar { font-weight: bold; margin-bottom: 1em;}


.alliUpdates strong { color: #666666; font-weight: bold; }
.alliUpdates a { text-decoration: underline; }

#Content 
{
    margin-left: auto;
    margin-right: auto;
}