/*** general tags ***/
body
{
    /*background-color: #CC3300;*/
    /*background-color: #b42015;*/
    background-color: #7d6e6e;
    font-family: Verdana;
    font-size: 16px;
    color: #ffffff;
    margin: 0;
    padding: 0;
}

a, a:link, a:visited, a:hover, a:active { color: #ffffff; text-decoration: none; }

h1 { display: block; font-size: 34px; font-weight: normal; margin: 0 0 25px 0; line-height: 1.3em; }

p {
	margin: 0 0 25px 0;
	font-size: 14px;
	line-height: 1.5em;
}
p a { font-weight: bold; }

sup { font-size: 0.6em; line-height: 0.5em; vertical-align: super; }

.iepngfix { behavior: url(iepngfix.htc) }

img, div, a, input { behavior: url(../iepngfix.htc) }

.oldBrowser { display: none; }
.ie6 .oldBrowser { position:absolute; top: 50px; left: 280px; display: block; font-size: 12px; padding: 5px 30px; background-color: #b42015; }

/*** general classes ***/
.left {float: left;}

.container
{
    width: 1024px;
    height: 768px;
    background: url(../images/background2.png) no-repeat;
    margin: 0 auto;
    padding: 0;
    position: relative;
}

.ajaxloader { position:absolute; top: 200px; left:448px; z-index: 10; }

/*** menu ***/
.menu { font-size:12px; display:block; }

.logo   {height:89px; width:265px; float:left; background: url(../images/logo.png) no-repeat; }
.logo a {display: block; height:89px; width:265px; float:left;}

.mainnav            { display: block; position: absolute; top: 0px; left: 310px; }
.mainnav li         { display: inline; float: left; margin-right: 28px; }
.mainnav li a       { display: block; padding: 18px 7px 5px; }
.mainnav li a:hover { background-color: #b42015; }
.mainnav li .active { background-color: #b42015; }

.subnav            { display: block; position: absolute; top: 45px; left: 298px; }
.subnav li         { display: inline; float: left; padding: 0 16px 0 16px; border-right: solid 1px; }
.subnav li.last    { border-right: none !important; }
.subnav li a       { display: block; padding: 1px 3px; }
.subnav li a:hover { text-decoration: underline; }
.subnav li .active { font-weight: bold; }


/*** pages ***/
.home, .howitworks, .thankyou, .signup, .mealplan, .wheretobuy, .products, .alitips, .smartsnacking, .sensiblemeals {position: absolute; top: 105px; padding: 0 45px 0 135px; }


/*** home page ***/
.home                    { padding-left: 50px; }
.home h1                 { margin-bottom: 14px; }
.home p                  { font-size: 16px; }
.home .wrapper           { width: 896px; height: 550px; }
.home .left              { width: 610px; }
.home .left p            { line-height: 1.4em; margin: 0 0 36px 0; }
.home .left ul           { font-size: 14px; }
.home .left ul li        { display: inline; float: left; margin: 0 20px 0 0; width: 166px; }
.home .left ul li a      { display: block; padding: 205px 0 20px 20px; line-height: 1.5em; }
.home .left ul .three    { background: url(../images/home_3.png) no-repeat; }
.home .left ul .two      { background: url(../images/home_2.png) no-repeat; }
.home .left ul .one      { background: url(../images/home_1.png) no-repeat; margin-right: 0px; }
.home .right             { font-size: 12px; height:400px; width:261px; float: left; }
.home .right ul          { margin: 0 0 0 0; }
.home .right ul li       { margin: 0 0 15px 0; display: block; }
.home .right .alinav     { background: url(../images/home_aliNav.png) no-repeat; height: 115px; width: 276px; }
.home .right .alinav a   { display: block; padding: 80px 0 0 15px; line-height: 36px; }
.home .right .rightnav   { background: url(../images/home_rightNav.png) no-repeat; height: 36px; width: 267px; }
.home .right .rightnav a { display: block; padding:  0 0 0 15px; line-height: 36px; }


/*** how it works page ***/
.howitworks h1          { margin-bottom: 14px; }
.howitworks p           { margin-bottom: 14px; }
.howitworks ul          { margin-top:14px; font-size: 16px; background: url(../images/how_321.png) no-repeat; height: 400px; }
.howitworks ul li       { height: 118px; }
.howitworks ul li a     { display: block; padding: 55px 0 20px 160px; line-height: 1.4em; }
.howitworks ul .three   { width: 600px; }
.howitworks ul .two     { width: 500px; }
.howitworks ul .one     { width: 500px; }
.howitworks ul .one a   { padding-top: 65px; }

.howitworks .mealplanlink   { position: absolute; top: 330px; left: 670px; font-size: 12px; height: 110px; width: 210px; background: url(../images/how_mealPlanLink.png) no-repeat; }
.howitworks .mealplanlink a { display: block; padding: 70px 0 0 0; line-height: 40px; }



/*** meal plan page ***/
.mealplan #emptybox {
	background-color: #bd6a5a;
	height: 280px;
	width: 752px;
	margin: 0 15px 14px 0;
	background: url(../images/meal_planGrid.png) no-repeat;
}
.mealplan a         { display: block; font-size: 14px; font-weight: bold; }
.mealplan p         { margin-bottom: 14px; }


/*** smart snacking page ***/
.smartsnacking #bottom                   { height: 188px;  font-size: 14px; padding: 0 0 0 0; background: url(../images/smart_image.png) no-repeat 0 14px;  }
.smartsnacking #bottom p                 { display: block; margin: 0 0 0 185px; }
.smartsnacking #bottom ul                { font-size: 12px; display: block; margin: 0 0 0 185px; }
.smartsnacking #bottom .column           { display: inline; float: left; background: url(../images/smart_vertRule.png) no-repeat; height: 288px; padding-top: 10px; }
.smartsnacking #bottom ul li ul          { font-size: 12px; display: block; float: left; height:200px; margin: 0 }
.smartsnacking #bottom ul li ul li       { display: block; margin: 0 10px 10px 10px;}
.smartsnacking #bottom ul li ul li.first { font-weight: bold; margin-top: 20px;}


/*** sensible meals page ***/
.sensiblemeals                           { padding-left: 60px; }
.sensiblemeals h1                        { margin-left:75px; }
.sensiblemeals p                         { margin-left:75px; }
.sensiblemeals #bottom                   { height: 328px; font-size: 14px; padding: 0 0 0 0; background: url(../images/sensible_image.png) no-repeat 0 10px; }
.sensiblemeals #bottom a                 { font-weight: bold; }
.sensiblemeals #bottom p                 { display: block; margin: 0 50px 0 320px; }
.sensiblemeals #bottom ul                { font-size: 12px; display: block; margin: 0 0 0 320px; }
.sensiblemeals #bottom .column           { display: inline; float: left; background: url(../images/sensible_vertRule.png) no-repeat; height: 346px; padding-top: 10px; }
.sensiblemeals #bottom ul li ul          { font-size: 12px; display: block; float: left; height:320px; margin: 0; }
.sensiblemeals #bottom ul li ul li       { display: block; margin: 0 30px 7px 10px;}
.sensiblemeals #bottom ul li ul li.first { font-weight: bold; margin-top: 20px;}


/*** products page ***/
.products                      { padding-left: 20px; }
.products .left                { width:265px; height: 525px; font-size: 12px; background: url(../images/prod_vertRule2.png) no-repeat; }
.products .left #three         { padding-left: 35px; display: block; width: 230px; background: url(../images/prod_list3.png) no-repeat; }
.products .left #two           { padding-left: 35px; display: block; width: 230px; background: url(../images/prod_list2.png) no-repeat; }

.products .left ul             { width: 215px; padding-top: 7px; margin-bottom: 8px; }
.products .left ul li          {  }
.products .left ul li a        { display: block; width: 220px; padding: 2px 0 2px 5px; }
.products .left ul li a:hover  { background-color: #7d6e6e; }
.products .left ul li .active  { background-color: #7d6e6e; }
.products .left .first         { font-weight: bold; padding: 1px 0 1px 5px; }
.products .left #three ul      {  }
.products .left #three .first  { color: #6fb84c; }
.products .left #two .first    { color: #0cace6; }

.products .right              { float: left; }
.products .right h1           { margin-bottom: 14px; margin-left: 25px; }
.products .right p            { margin: 0 0 14px 25px; font-size: 14px; line-height: 1.4em; }
.products .right ul           { font-size: 14px; }
.products .right ul li        { display: inline; float: left; }
.products .right ul li a      { display: block; padding: 20px 0 225px 60px; }
.products .right .three       { width: 235px; margin: 0 40px 0 0; background: url(../images/products_3.png) no-repeat; }
.products .right .two         {
	width: 305px;
	background: url(../images/products_2.png) no-repeat;
	height: 300px;
}

.products .productView           { position: absolute; top: 100px; left: 300px; width: 725px; }
.products .productimage          { background-repeat: no-repeat; width: 294px; height: 369px; float:left; }
.products .productinfo           {
	background: url(../images/products_infoPanel.png) no-repeat;
	width: 390px;
	height:400px;
	float: left;
	font-size: 10px;
}
.products .productinfo .tablabel { padding: 8px 0 2px 14px; font-size: 11px; font-weight: bold; color: #cccccc; }
.products .productinfo .tablink  { padding: 5px 0 8px 14px; font-size: 11px; font-weight: bold; color: #999999; }
.products .productinfo .tablink a { color: #999999; }
.products .productinfo .tablink a.active { color: #ffffff; cursor: default; }

.products #info_container {
	width: 380px;
	height: 315px;
	overflow:auto;
	padding: 0;
}
.products #info_container1 {
	width: 383px;
	height: 315px;
	overflow-y: auto;
	overflow-x: hidden;
	padding: 0;
}


.products .right .nutrition                  { margin: 0; padding: 0; }
.products .right .nutrition .nutriall       { margin: 0; padding: 5px 5px 15px 17px; float: left; width: 339px; }
.products .right .nutrition .nutrileft       { margin: 0; padding: 5px 5px 15px 17px; float: left; width: 224px; }
.products .right .nutrition .NutriInfo       { margin: 0; padding: 0; }
.products .right .nutrition .NutriInfo li    { display: list-item; margin: 0; color: #000000; font-size: 9px; float:none; line-height: 1.2em; }
.products .right .nutrition .nutriright      { margin: 0; padding: 5px 0 15px 0; float: left; width: 115px; }
.products .right .nutrition .VitaInfo        { margin: 0; padding: 0; }
.products .right .nutrition .VitaInfo li     { display: list-item; margin: 0; color: #000000; font-size: 9px; float:none; line-height: 1.2em; }
.products .right .nutrition .nutribottom     { margin: 0; padding: 0 5px 5px 17px; }
.products .right .nutrition .FootnoteInfo    { margin: 0; padding: 0; }
.products .right .nutrition .FootnoteInfo li { display: list-item; float: none; margin: 0; color: #000000; font-size: 9px; line-height: 1.2em; }

.products .right .ingredients                        { margin: 0; padding: 0; }
.products .right .ingredients .nutriingredients      { margin: 0; padding: 5px 5px 5px 17px; }
.products .right .ingredients .nutriingredients span { display: block; font-size: 9px; color: #000000; line-height: 1.2em; }



/*** ali's tips ***/
.alitips                             { padding-left: 135px; background: url(../images/tips_image.png) no-repeat 0 68px; }
.alitips h1                          { margin-bottom: 20px; }
.alitips p                           { margin-bottom: 30px; }
.scroll-pane                         { width: 610px; height: 290px; overflow: auto; background: transparent; }
.alitips .tip_container              { font-size: 13px; padding: 0 20px 0 0; }
.alitips .tip_container h2           { margin: 0 0 3px 0; }
.alitips .tip_container .tip_message { margin: 0 0 14px 0; line-height:15px; }


/*** where to buy ***/
.wheretobuy     { padding-left: 135px; }
.wheretobuy a   { font-weight: bold; }
.wheretobuy div { margin: 100px 0 0 0; }


/*** sign up ***/
.signup  { padding: 0 200px 0 135px; }
.signup p { margin: 0 0 22px 0; font-size: 14px; line-height: 1.4em; }
.signup .formtable { font-size: 13px; text-align:left; line-height: 1.3em; }
.signup .formtable td { padding: 3px 5px; }
.signup .formtable td p { font-size: 13px; text-align:left; line-height: 1.3em; padding: 14px 0 5px 0; margin: 0; }
.signup .formtable td table td { padding: 0; }
.signup .formtable .formlabel {
	font-weight: bold;
}
.signup .formtable .column1 { height:20px; width:180px; }
.signup .formtable .column2 { height:20px; width:185px; }
.signup .formtable .column3 { height:20px; width:200px; }
.signup .formtable .formcaption { text-align:left; margin-bottom:10px; }
.signup .formtable .invalidtextbox{background-color: #b42015;}
.signup .formtable .invalidlabel{background-color: #b42015;}
.formbutton { height: 33px; width: 140px; border: none; color: #ffffff; background: url(../images/form_button.png) no-repeat; margin: 10px 0 5px 100px; cursor:pointer; behavior: url(iepngfix.htc); }


/*** thank you ***/
.thankyou     { padding-left: 135px; }
.thankyou p   { margin: 0 0 28px 0; font-size: 14px; line-height: 1.5em; }
.thankyou a   { font-weight: bold; font-size: 14px; line-height: 28px; }



/*** global sign up link ***/
.global_signUp   { display: block; position: absolute; top: 590px; left: 660px; font-size: 12px; width: 219px; height: 35px; background: url(../images/global_signUpLnk.png) no-repeat; }
.global_signUp a { display: block; padding:11px; }


/*** footer ***/
.footer     { display: block; position: absolute; top: 660px; left: 0; margin:0 52px 0 52px; font-size: 10px; line-height: 14px; }
.footer a   { font-weight: bold; }
.footnav li { display: inline; margin-right: 100px; }
.footnav li.last { margin-right: 0; }
.footer .hr  { height: 2px; width: 670px; margin: 8px 0 9px 0; padding: 0; background: url(../images/footer_hr.png) no-repeat; }


/*** clearfix ***/
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix       { min-height:1px; _height:1px; }





/*** Ali's Tips jScrollPane ***/
.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: url(../images/scroll_track.png) no-repeat 12px 0;
	behavior: url(iepngfix.htc);
}
.jScrollPaneDrag {
	position: absolute;
	background: transparent;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
	background: url(../images/scroll_dragTop.png) no-repeat 24px 0;
	height: 7px;
	behavior: url(iepngfix.htc);
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
	background: url(../images/scroll_dragBottom.png) no-repeat 24px 0;
	height: 7px;
	behavior: url(iepngfix.htc);
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}




/*** Nutrition Info Scroll Pane ***/
.productinfo .jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.productinfo .jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #999999;
}
.productinfo .jScrollPaneDrag {
	position: absolute;
	background: #7d6e6e;
	cursor: pointer;
	overflow: hidden;
}
.productinfo .jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.productinfo .jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
.productinfo a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
.productinfo a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

.productinfo a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
.productinfo a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
.productinfo a.jScrollActiveArrowButton, .productinfo a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}

#voken {
	position:absolute; 
	top:0; 
	left:670px;
}