﻿/* clearfix */
html .clearfix { height: 1%; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

html { height: 100%; }
body { background: #5b5b5b; padding: 0; margin: 0; height: 100%; font-family: Arial; font-size: 12px; color: #484849; }
body.study #room { background: url(/fr/images/bg_study.jpg) no-repeat top; }
body.bedroom #room { background: url(/fr/images/bg_bedroom.jpg) no-repeat top; }
body.kitchen #room { background: url(/fr/images/bg_kitchen.jpg) no-repeat top; }
body.exercise #room { background: url(/fr/images/bg_exercise.jpg) no-repeat top; }
body.dining_room #room { background: url(/fr/images/bg_dining_room.jpg) no-repeat top; }
body.living_room #room { background: url(/fr/images/bg_living_room.jpg) no-repeat top; }
body.home #room { background: url(/fr/images/bg_home.jpg) no-repeat top; }
form { height: 100%; }
fieldset { border: none; }
input[type="text"] { border: 1px solid #798788; }
input[type="submit"] { background: #e02027; color: White; border: 1px solid #c61c23; padding: 2px 6px 2px 6px; }
textarea { border: 1px solid #798788; }
span.hidden { visibility: hidden; overflow: hidden; }
h1, h2, h3, h4 { color: #b52025; }
h1 { line-height: 1.1em; }
h2 { margin-top: 0; margin-bottom: 0; }
h3 { font-size: 13px; letter-spacing: -1px; }
a { color: #b61f24; }
a.button { display: block; height: 100%; width: 100%; text-decoration: none; overflow: hidden; }
#nav { display: inline; float: left; list-style-type: none; margin: 0 0 0 220px; padding: 0; height: 70px; width: 680px; position: relative; z-index: 200; }
#nav li { float: left; overflow: hidden; background: url(/fr/images/nav_teabag_01.png) no-repeat; width: 163px; height: 160px; z-index: 220; cursor: pointer; }
#nav a { text-decoration: none; }
#nav.transparent li p { background: url(/fr/images/nav_sprites_24.png) no-repeat; display: block; margin: 0; z-index: 800; position: absolute; }
#nav li p { background: url(/fr/images/nav_sprites.png) no-repeat; display: block; margin: 0; z-index: 800; position: absolute; }
#nav li p span { visibility: hidden; overflow: hidden; }
#nav li a.button { width: 159px; height: 158px; position: absolute; }
#nav li#nav_red_rose { position: absolute; top: -90px; left: 0; }
#nav li#nav_red_rose p { background-position: 0 -12px; top: 94px; left: 29px; width: 100px; height: 40px; }
#nav li#nav_red_rose p:hover { background-position: 0 -62px; }
#nav li#nav_about_tea { position: absolute; top: -90px; left: 130px; }
#nav li#nav_about_tea p { background-position: 0 -124px; top: 107px; left: 22px; width: 108px; height: 40px; }
#nav li#nav_about_tea p:hover { background-position: 0 -174px; }
#nav li#nav_health_wellness { position: absolute; top: -90px; left: 260px; }
#nav li#nav_health_wellness p { background-position: 0 -209px; top: 96px; left: 23px; width: 108px; height: 40px; }
#nav li#nav_health_wellness p:hover { background-position: 0 -259px; }
#nav li#nav_sustainable_tea { position: absolute; top: -90px; left: 390px; }
#nav li#nav_sustainable_tea p { background-position: 0 -317px; top: 104px; left: 20px; width: 118px; height: 40px; }
#nav li#nav_sustainable_tea p:hover { background-position: 0 -367px; }
#nav li#nav_tea_topics { position: absolute; top: -90px; left: 520px; }
#nav li#nav_tea_topics p { background-position: 0 -412px; top: 104px; left: 33px; width: 118px; height: 40px; }
#nav li#nav_tea_topics p:hover { background-position: 0 -462px; }
#nav li#nav_news_promotions { position: absolute; top: -90px; left: 650px; }
#nav li#nav_news_promotions p { background-position: 0 -510px; top: 104px; left: 23px; width: 118px; height: 40px; }
#nav li#nav_news_promotions p:hover { background-position: 0 -560px; }
.language {float: left; border: 0px solid red; margin: 7px 0 0 10px; font-size: 8pt;}
#sub_nav { width: 174px; float: left; margin-top: 80px; }
#sub_nav ul { background: #606654 url(/fr/images/subnav_mid_green.png) no-repeat right; width: 166px; margin: 0; padding: 0 0 0 8px; overflow: hidden; list-style-type: none; }
#sub_nav ul li { margin-bottom: 8px; }
#sub_nav div.top { background: url(/fr/images/subnav_top_green.png) no-repeat; width: 174px; height: 16px; overflow: hidden; }
#sub_nav div.bottom { background: url(/fr/images/subnav_bottom_green.png) no-repeat; width: 174px; height: 17px; }
#sub_nav div.top h1 { visibility: hidden; height: 1px; width: 1px; overflow: hidden; margin: 0; }
#sub_nav a { text-decoration: none; display: block; width: 100%; height: 100%; overflow: hidden; }

body.exercise #sub_nav ul { background: #465e60 url(/fr/images/subnav_mid_health.png) no-repeat right; margin: 0; overflow: hidden; } 
body.exercise #sub_nav div.top { background: url(/fr/images/subnav_top_health.png) no-repeat; width: 174px; height: 57px; overflow: hidden; }
body.exercise #sub_nav div.bottom { background: url(/fr/images/subnav_bottom_health.png) no-repeat; width: 174px; height: 28px; }
body.dining_room #sub_nav ul { background: #4d5253 url(/fr/images/subnav_mid_abouttea.png) no-repeat right; margin: 0; overflow: hidden; } 
body.dining_room #sub_nav div.top { background: url(/fr/images/subnav_top_abouttea.png) no-repeat; width: 174px; height: 60px; overflow: hidden; }
body.dining_room #sub_nav div.bottom { background: url(/fr/images/subnav_bottom_abouttea.png) no-repeat; width: 174px; height: 28px; }
body.living_room #sub_nav ul { background: #606654 url(/fr/images/subnav_mid_sustain.png) no-repeat right; margin: 0; overflow: hidden; } 
body.living_room #sub_nav div.top { background: url(/fr/images/subnav_top_sustain.png) no-repeat; width: 174px; height: 66px; overflow: hidden; }
body.living_room #sub_nav div.bottom { background: url(/fr/images/subnav_bottom_sustain.png) no-repeat; width: 174px; height: 28px; }
body.kitchen #sub_nav ul { background: #798788 url(/fr/images/subnav_mid_redrosetea.png) no-repeat right; margin: 0; overflow: hidden; } 
body.kitchen #sub_nav div.top { background: url(/fr/images/subnav_top_redrosetea.png) no-repeat; width: 174px; height: 52px; overflow: hidden; }
body.kitchen #sub_nav div.bottom { background: url(/fr/images/subnav_bottom_redrosetea.png) no-repeat; width: 174px; height: 28px; }
body.bedroom #sub_nav ul { background: #484d49 url(/fr/images/subnav_mid_teatopics.png) no-repeat right; margin: 0; overflow: hidden; } 
body.bedroom #sub_nav div.top { background: url(/fr/images/subnav_top_teatopics.png) no-repeat; width: 174px; height: 67px; overflow: hidden; }
body.bedroom #sub_nav div.bottom { background: url(/fr/images/subnav_bottom_teatopics.png) no-repeat; width: 174px; height: 28px; }
body.study #sub_nav ul { background: #766c6b url(/fr/images/subnav_mid_news.png) no-repeat right; margin: 0; overflow: hidden; } 
body.study #sub_nav div.top { background: url(/fr/images/subnav_top_news.png) no-repeat; width: 174px; height: 52px; overflow: hidden; }
body.study #sub_nav div.bottom { background: url(/fr/images/subnav_bottom_news.png) no-repeat; width: 174px; height: 28px; }
/*timeline callout*/
div#timeline_holder { clear: both; margin: 0 0 10px 0; }
div#timeline_holder ul { float: left; display: inline; margin-bottom: 35px; padding: 0 20px; margin: 0; }
div#callout_timeline { background: url(/images/images/callout_timeline.jpg) no-repeat 0 0; width: 292px; height: 160px; margin: 0; float: left; display: inline; }
div#callout_timeline a { width: 100%; height: 100%; display: block; text-decoration: none; }

#floor { background: url(/fr/images/bg_floor.jpg) repeat; width: 100%; max-width: 1280px; height: 100%; margin: 0 auto; }
#room { width: 100%; max-width: 1280px; height: 100%; margin: 0 auto; }
#container { width: 985px; height: auto; margin: 0 auto; position: relative; }
#container div.logo { display: block; position: absolute; top: 33px; left: 0; }
#container div.logo a {cursor: hand;}
#content_container { width: 778px; height: auto; float: left; margin-top: 20px;  }
#content_container div.top { background: url(/fr/images/content_top_bg.png) no-repeat; width: 743px; height: 24px; overflow: hidden; }
#content_container div.bottom { background: url(/fr/images/content_bottom_bg.png) no-repeat; width: 743px; height: 24px; overflow: hidden; }
#content { background: #fff; overflow: hidden; padding: 30px; line-height: 18px; min-height: 545px; }
#content ul li { padding: 2px 0; }
#content ul.bullet { margin: 10px 0; padding: 0; border: 0px solid red;}
#content ul.bullet li { margin: 3px 0; padding: 0 0 0 15px; background: url(/images/arrow.gif) no-repeat 0px 4px; list-style-type: none;  border: 0px solid blue;}
#content ol li { padding: 5px 0 5px 0; }
.footnote { clear: both;  margin: 10px 0; border: 0px solid red;}
.clear { clear: both; }
.clearFix { height: 1px; clear: both; }
#footer { text-align: center; color: White; font-size: 10px; padding-top: 16px; }
#footer a { color: #fff1f2; }
#footer ul { list-style-type: none; padding: 0; }
#footer li { display: inline; padding: 0 4px 0 4px; }
body.home #content_container { padding-left: 203px; width: 778px; margin-top: 0; }
body.home #content { background: none; padding: 0; }
body.home div.rounded { width: 742px; }
body.home #feature_callout { background: url(/fr/images/home_feature.jpg) no-repeat; width: 743px; height: 291px; border: 0px solid blue;  }
body.home #feature_callout a { display: block; width: 743px; height: 286px; border: 0px solid yellow; text-decoration: none; }
body.home #bottom_callout { height: 225px; }
body.home #bottom_callout div.callout { margin: 5px; display: inline; overflow: hidden; float: left; }
body.home #bottom_callout div.callout * { visibility: hidden; height: 1px; margin: 0; }
body.home #bottom_callout div.callout a.button { visibility: visible; height: 100%; }
body.home #bottom_callout div#callout_01 { background: url(/fr/images/home_callout_rainforest.png) no-repeat; width: 237px; height: 247px; border: 0px solid red; }
body.home #bottom_callout div#callout_02 { background: url(/fr/images/home_callout_teatime_snacks.png) no-repeat; width: 237px; height: 247px; border: 0px solid red;}
body.home #bottom_callout div#callout_03 { background: url(/fr/images/home_callout_perfect_cup.png) no-repeat; width: 237px; height: 247px; border: 0px solid red;}
div.rounded { background: white; margin-bottom: 40px; margin-top: 20px; }

fieldset#contact_us ul { list-style-type: none; }
fieldset#contact_us label { width: 130px; display: block; float: left; text-align: right; padding-right: 6px; }
fieldset#contact_us li.comment_types label { width: auto; display: inline; float: none; }

/* jqModal popups */
/* -------------------------------- */
/* jqModal base Styling courtesy of;
	Brice Burgess <bhb@iceburg.net> */

 /* jqModal */
        /* The Window's CSS z-index value is respected (takes priority). If none is supplied,
            the Window's z-index value will be set to 3000 by default (via jqModal.js). */
            
        .jqmWindow { display: none; position: fixed; top: 5%; left: 50%; margin-left: -268px; width: 550px; z-index: 4000; }
        .jqmOverlay { background: #000; }
        
        /* Background iframe styling for IE6. Prevents ActiveX bleed-through (<select> form elements, etc.) */
        * iframe.jqm { position: absolute; top: 0; left: 0; z-index: -1; width: expression(this.parentNode.offsetWidth+'px'); height: expression(this.parentNode.offsetHeight+'px'); }
        
        /* Fixed posistioning emulation for IE6
             Star selector used to hide definition from browsers other than IE6
             For valid CSS, use a conditional include instead */
        body.ie6 .jqmWindow { position: absolute; top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(5 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px'); }
		
body.ie6 #modal_help a.close_window { margin-top: 10px; }


table.recipeTable { background: #ecedec; border: dotted #b5b5b5; border-width: 0px 1px 1px 0; }
table.recipeTable td { background: #ecedec; border: dotted #b5b5b5; border-width: 1px 0px 0px 1px; }
ol.recipeDirections { border: 0px solid red; margin: 15px 0; padding: 0; }
ol.recipeDirections li { border: 0px solid blue; margin: 0 0 0 20px ; padding: 0;  }
