@charset "utf-8";

/* :: Base Defaults :: */

* { margin: 0; padding: 0; }
html, body { height: 100%; }

body {
	background-image: url(../images/body-bg.jpg);
	background-position: -42px 36px;
	background-repeat: repeat-x;
	background-color: #8bc53f;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000;		
}

a, a:hover { text-decoration: none; outline: 0; }
img { border: 0; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; line-height: 1em; }
li { list-style-type: none; }

/* :: Debugging Classes :: */

.debug-border { border: #777777 dashed 1px; }
.debug-fill { background-color: #777777; display: block; }

/* :: Global Layouts & Tools :: */

.left { float: left; }
.right { float: right; }
.clr { clear: both; font-size: 0; line-height: 0; height: 0; }

cufon cufontext { text-align: left; }

.wrapper { min-width: 986px; }
.container {
	background-image: url(../images/container-bg.png);
	background-position: 0 0;
	background-repeat: repeat-y;
	width: 918px;
	padding: 0 34px;
	margin: 0 auto;
	position: relative;
	z-index: 21;
}
.ie6 .container .pngdiv { left: 0 !important; }

#banana-top {
	background-image: url(../images/banana-top-bg.png);
	background-position: 30px 0;
	background-repeat: repeat-x;
	width: 100%;
	height: 173px;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 21;
}

#banana-bottom {
	background-image: url(../images/banana-bottom-bg.png);
	background-position: 80px 0;
	background-repeat: repeat-x;
	width: 100%;
	height: 173px;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: 21;
}


#body-area #paper-top {
	background-image: url(../images/paper-top-bg.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 918px;
	height: 72px;
	position: absolute;
	top: -72px;	
	left: 0;
	z-index: -1;
}
.ie6 #body-area #paper-top .pngdiv { left: 0 !important; }

#body-area #paper-bottom {
	background-image: url(../images/paper-bottom-bg.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 918px;
	height: 52px;
	position: absolute;
	bottom: -52px;	
	left: 0;
	z-index: -1;
}
.ie6 #body-area #paper-bottom .pngdiv { left: 0 !important; }

.tape-top {
	background-image: url(../images/tape-1.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 152px;
	height: 56px;
	position: absolute;
	left: 356px;
	top: -23px;
}

.tape-bottom {
	background-image: url(../images/tape-1.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 152px;
	height: 56px;
	position: absolute;
	left: 356px;
	bottom: -16px;
}

/* :: HEADER :: */

#ext-header { position: relative; z-index: 10; }
.ie6 #ext-header { zoom: 1; }

#header { padding-bottom: 50px !important; }
.ie6 #header { width: 918px; }

#logo {	margin: 163px 0 0 22px; float: left; }
.ie6 #logo { margin: 163px 0 0 11px; }

#logo a {
	background-image: url(../images/logo.gif);
	background-position: 0 0;
	background-repeat: no-repeat;	
	display: block;	
	width: 414px;
	height: 77px;
}

/* :: MENUS/NAVIGATIONS :: */

/* top-nav */

#top-nav { padding: 183px 0 0 0; float: right; }
#top-nav .button-home { margin: 0 13px 0 0; }
#top-nav .button-home a {
	background-image: url(../images/button-home.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 102px;
	height: 45px;	
	display: block;
}
#top-nav .button-blog { margin: 0 13px 0 0; }
#top-nav .button-blog a {
	background-image: url(../images/button-blog.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 102px;
	height: 45px;	
	display: block;
}
#top-nav .button-contact { margin: 2px 22px 0 0; }
.ie6 #top-nav .button-contact { margin: 2px 16px 0 0; }
#top-nav .button-contact a {
	background-image: url(../images/button-contactus.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 169px;
	height: 44px;	
	display: block;
}
#top-nav .button-home a:hover,
#top-nav .button-blog a:hover,
#top-nav .button-contact a:hover {	background-position: 0px 100%; }

/* home side-nav */

#side-nav { padding: 15px 0 0 42px; width: 388px;  }
#side-nav ul {}
#side-nav ul li { padding: 0 0 5px 0; width: 388px; display: block; }

#side-nav ul li a {
	background-position: 0 0;
	background-repeat: no-repeat;
	display: block;
	width: 388px;
}
#side-nav ul li a:hover { background-position: 0 100%; }

#side-nav ul li#btn-1 a { background-image: url(../images/button-grown-smart.gif); height: 76px; }
#side-nav ul li#btn-2 a { background-image: url(../images/button-size-smart.gif); height: 77px; }
#side-nav ul li#btn-3 a { background-image: url(../images/button-env-smart.gif); height: 77px; }
#side-nav ul li#btn-4 a { background-image: url(../images/button-kid-smart.gif); height: 76px; }
#side-nav ul li#btn-5 a { background-image: url(../images/button-health-smart.gif); height: 76px; }
#side-nav ul li#btn-6 a { background-image: url(../images/button-brain-smart.gif); height: 78px; }
#side-nav ul li#btn-7 a { background-image: url(../images/button-energy-smart.gif); height: 77px; }
#side-nav ul li#btn-8 a { background-image: url(../images/button-enjoying-smart.gif); height: 76px; }


/* internal main-nav */

#main-nav {
	background-image: url(../images/mnav-bg.gif);
	background-position: 0 bottom;
	background-repeat: no-repeat;
	width: 918px;
	height: 108px; /* 108 */
	padding: 12px 0 0 0;
}

#main-nav ul {}
#main-nav ul li { float: left; }
#main-nav ul li a { background-position: 0 0; background-repeat: no-repeat; height: 87px; display: block; }
#main-nav ul li a:hover { background-position: 0 100%; }

#main-nav ul li#mnav-1  a { background-image: url(../images/mnav-grown.png); width: 64px; margin: 0 0 0 28px; }
#main-nav ul li#mnav-2  a { background-image: url(../images/mnav-size.png); width: 68px; margin: 0 0 0 16px; }
#main-nav ul li#mnav-3  a { background-image: url(../images/mnav-env.png); width: 101px; margin: 0 0 0 24px; }
#main-nav ul li#mnav-4  a { background-image: url(../images/mnav-kid.png); width: 64px; margin: 0 0 0 18px; }
#main-nav ul li#mnav-5  a { background-image: url(../images/mnav-health.png); width: 47px; margin: 0 0 0 29px; }
#main-nav ul li#mnav-6  a { background-image: url(../images/mnav-brain.png); width: 44px; margin: 0 0 0 32px; }
#main-nav ul li#mnav-7  a { background-image: url(../images/mnav-energy.png); width: 68px; margin: 0 0 0 25px; }
#main-nav ul li#mnav-8  a { background-image: url(../images/mnav-enjoy.png); width: 59px; margin: 0 0 0 33px; }
#main-nav ul li#mnav-9  a { background-image: url(../images/mnav-feedback.png); width: 65px; margin: 0 0 0 22px; }
#main-nav ul li#mnav-10 a { background-image: url(../images/mnav-where.png); width: 41px; margin: 0 0 0 26px; }

/* :: FOOTER :: */

#ext-footer { position: relative; z-index: 20; }
.ie6 #ext-footer { zoom: 1; }

#footer { padding-top: 28px !important; padding-bottom: 127px !important; position: relative; }
.ie6 #footer { width: 918px; }

#footer .button-tradeinfo { width: 178px; margin: 14px 0 0 31px; } 
#footer .button-tradeinfo a {
	background-image: url(../images/button-tradeinfo.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 178px;
	height: 92px;	
	display: block;
}
#footer .button-tradeinfo a:hover {	background-position: 0px 100%; }

#footer .button-reblo { margin: 8px 6px 0 0; } 
#footer .button-reblo a {
	background-image: url(../images/button-reblo.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 265px;
	height: 104px;	
	display: block;
}
#footer .button-reblo a:hover {	background-position: 0px 100%; }

#footer .button-mackays { margin: 0 25px 0 0; } 
#footer .button-mackays a {
	background-image: url(../images/mackays-logo.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 338px;
	height: 144px;	
	display: block;
}

/* :: DISPLAY-AREA :: */

#ext-body-area {
	background-image: url(../images/ext-body-area-bg.gif);
	background-position: 0 bottom;
	background-repeat: repeat-x;
	background-color: #ffffff;	
	position: relative;
	z-index: 20;
}

#body-area {
	background-image: url(../images/body-area-bg.gif);
	background-position: 0 0;
	background-repeat: repeat-x;	
	position: relative;
	z-index: 0;
	padding: 0;
}

#display-area { width: auto; position: relative; }

/* :: left-area :: */

.da-home .left-area { width: 430px; }
.ie6 .da-home .left-area { position: relative; }

.da-internal .left-area { width: 627px;  }
.ie6 .da-internal .left-area { position: relative; }

.da-internal .left-area .text-content { padding: 50px 56px 100px 66px; }
.da-internal .left-area .text-content h1 { border-bottom:3px solid;color:#739E32;display:block;font-size:26px;font-weight:bold;margin:0 0 25px;padding-bottom:4px;}
.da-internal .left-area .text-content h2 { border-bottom:2px solid;color:#9A7251;font-size:20px;font-style:italic;font-weight:bold;
padding:7px 0 4px; }
.da-internal .left-area .text-content h3 { font-size: 15px; font-style: italic; color: #9a7251; font-weight:bold;padding: 10px 0 10px 0; }
.da-internal .left-area .text-content p { font-size: 13px; color: #000000; line-height: 16px; text-align: justify; padding: 5px 0 10px 0; }

.da-internal .full { width: 917px;  }
.ie6 .da-internal .full { position: relative; }

.da-internal .full .text-content { padding: 50px 56px 100px 66px; }
.da-internal .full .text-content h1 { border-bottom:3px solid;color:#739E32;display:block;font-size:26px;font-weight:bold;margin:0 0 25px;padding-bottom:4px;}
.da-internal .full .text-content h2 { border-bottom:2px solid;color:#9A7251;font-size:16px;font-style:italic;font-weight:bold;
padding:7px 0 4px; }
.da-internal .full .text-content h3 { font-size: 15px; font-style: italic; color: #9a7251; font-weight:bold;padding: 7px 0 7px 0; }
.da-internal .full .text-content p { font-size: 13px; color: #000000; line-height: 16px; text-align: justify; padding: 5px 0 0 0; }
.da-internal .full .text-content img { max-width: 795px; }

.da-tracking .left-area { width: 515px;  }
.ie7 .da-tracking .left-area { position: relative; zoom: 1; }
.ie6 .da-tracking .left-area { position: relative; }

.da-tracking .left-area .text-content { padding: 26px 27px 25px 51px; }
.da-tracking .left-area .text-content h1 { font-size: 22px; font-weight: normal; color: #c63641; padding: 0 0 25px 0; }
.da-tracking .left-area .text-content h1 span { font-weight: bold; }
.da-tracking .left-area .text-content p { font-size: 13px; color: #000000; line-height: 16px; text-align: left; padding: 5px 0 0 0; }

.da-tracking .left-area .img-group-1 { width: auto; padding: 0 0 0 22px; }
.da-tracking .left-area img.t-img-1 { padding: 20px 0 0 34px; }
.da-tracking .left-area img.t-img-2 { float: left; margin: 0 2px; }

/* :: right-area :: */

.da-home .right-area { width: 488px; }
.ie6 .da-home .right-area { position: relative; }

#code-entry-form {
	background-image: url(../images/code-bg.gif);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 346px;
	height: 253px;
	margin: 21px 0 0 61px;
	position: relative;
	
}
.ie6 #code-entry-form .pngdiv { left: 0 !important; }

#code-entry-form .code-input {
	position: absolute;
	left: 95px;
	top: 160px;
	z-index: 35;
}
#code-entry-form .code-input .code {
	font-family: "Arial";
	font-size: 30px;
	font-weight: bold;
	color: #555555;
	width: 195px;
	border: 0;
}

#code-entry-form .ca-tape {
	background-image: url(../images/tape-2.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 150px;
	height: 62px;
	position: absolute;
	left: 38px;
	bottom: -26px;
}

#code-entry-form .banana-pack {
	background-image: url(../images/banana-pack.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 184px;
	height: 199px;
	position: absolute;
	right: -58px;
	bottom: -97px;
}

#info-area {
	width: 488px;
	min-height: 414px;
	height: auto !important;
	height: 414px;
	position: relative;
	z-index: 50;
}

#info-area .button-feedback {
	width: 276px;
	position: absolute;
	top: 10px;
	left: 24px;
	z-index: 40;
}

#info-area .button-feedback a {
	background-image: url(../images/button-feedback.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 276px;
	height: 265px;	
	display: block;
}
#info-area .button-feedback a:hover {
	/*background-image: url(../images/button-feedback-hover.png);*/
	background-position: 0 100%;
	cursor: pointer;
}

#info-area .button-vending-machine {
	width: 300px;	
	position: absolute;
	top: 145px;
	left: 179px;
	z-index: 45;
}

#info-area .button-vending-machine a {
	background-image: url(../images/button-vending-machine.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 300px;
	height: 340px;	
	display: block;
}
#info-area .button-vending-machine a:hover {
	opacity:.7;
	cursor: pointer;
}

#info-area .button-facebook {
	width: 281px;	
	position: absolute;
	top: 145px;
	left: 179px;
	z-index: 45;
}
.ie6 #info-area .button-facebook .pngdiv { left: 0 !important; }
#info-area .button-facebook a {
	background-image: url(../images/button-yasi.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 281px;
	height: 274px;	
	display: block;	
}
#info-area .button-facebook a:hover {
	/*background-image: url(../images/button-facebook-hover.png);*/
	background-position: 0 -276px;
	cursor: pointer;
}

#info-area .button-where {
	width: 157px;	
	position: absolute;
	bottom: 11px;
	left: 8px;
	z-index: 45;
}
.ie6 #info-area .button-where .pngdiv { left: 0 !important; }
#info-area .button-where a {
	background-image: url(../images/button-where.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 157px;
	height: 110px;	
	display: block;	
}
#info-area .button-where a:hover {
	/*background-image: url(../images/button-facebook-hover.png);*/
	background-position: 0 100%;
	cursor: pointer;
}

.da-internal .right-area { width: 290px; padding: 67px 0 0 0; position: relative; }
.da-internal .right-area img { margin: 10px 0; }

.da-tracking .right-area { width: 402px; padding: 47px 0 0 0; position: relative; }
.da-tracking .right-area .t-img-3 { width: 402px; height: 252px; position: relative; }
.da-tracking .right-area .t-img-3 img { position: absolute; left: -28px; }

.da-tracking .right-area .t-video { width: 370px; height: 244px; margin: 6px; }
.da-tracking .right-area .t-google-map {}

/* :: BANNER :: */

#banner { position: relative; width: 893px; padding: 10px 0 0 25px; }
#banner .banner-img {
	background-image: url(../images/banner-frame.png);
	background-position: 0 0;
	background-repeat: no-repeat;
	width: 874px;
	height: 313px;
	position: relative;	
}
#banner .banner-img img { margin: 16px 0 0 16px; }

/* additional styles 20100914 */
#code-entry-form .code-input .code {
width:170px;
}

.t-video {
background-image: url(../images/img-video-mid.gif);
background-repeat: repeat-y;
width: 342px !important;
height: auto !important;
padding: 0 14px;
margin: -3px 0 0 6px !important;
}
.t-google-map {
background-image: url(../images/map-bg.jpg);
background-repeat: no-repeat;
width: 355px;
height: 216px;
padding: 102px 0 0 20px;
}
.text-content p img {
padding: 10px 10px 10px 0;
}

#banner .banner-img img {
margin:16px 0 0;
}

* html .text-content img { 
   width: expression( document.body.clientWidth > 501 ? "502px" : "auto" ); /* sets max-width for IE */
}
.text-content img { 
   max-width: 502px; /* this sets the max-width value for all standards-compliant browsers */
}

li {
color: #000000;
}
.webform{
color:#000;
}

.text-content ul li {
margin-left: 30px;
list-style-type: disc;
}
.text-content ol li {
margin-left: 34px;
list-style-type: decimal;
}

.btn-refund-policy{
	margin: 20px 0 20px 98px;
}
.btn-refund-policy a{
	height:135px;
	width:308px;
	background:url(../images/btn-refund-policy.png) no-repeat;
	text-decoration:none;
	display:block;
}
.btn-refund-policy a:hover{
    opacity:.7;
}

.menu-footer {
	margin: 0 0 5px 70px;
	padding:0;
}

.menu-footer a{
	color:#9a7251;
	text-decoration:none;
	font: 14px Arial, Helvetica, sans-serif;
	padding-left:5px;
	padding-right:5px;
}

.menu-footer a:hover{
	color:#C63641;
}
.video-popup {
	text-align:center;
}