@charset "utf-8";
/* StyleSheet Extension*/
/**
Author: Henry Wong, The Kitchen Ltd
Date: 30 Oct 2009
**/

@charset "utf-8";

/**
a new class used to clear float for better alignment in some IDE 
**/
.clearfloat {visibility:hidden; clear:both; line-height:0; font-size:0; height:0;}

/**
classes for the hero banner on the promotion landing page 
using positioning to overlay text on top of images instead of background image (for printing)
**/
.xprodBannerHero {position:relative; background-color:#fcf6c6; min-height:215px; -height:215px; }
.xprodBannerHero .banner  {position:absolute; top:0px; left:0px ;}
.xprodBannerHero .text {position:relative; width:400px; padding:10px 0 0 15px;}
.xprodBannerHero .text h2 {font-size:100%; line-height:1.5em !important; font-weight:bold; color:#4f4f4f;}

/**
new wrapper classes for the product image on the promotion landing page
using positioning to overlay text on top of images instead of background image (for printing)
**/
.xProdWrapper .special { font-style:italic; color:#F00; font-weight:bold; font-size:15px; }
.xProdWrapper {text-align:center;position:relative;text-align:center; font-size:15px; min-height:300px}
.small{color:#666; display:inline; font-size:12px}
.xProdWrapper h2 {text-align:center;position:absolute; top:130px; left:5px; padding-right:5px !important; } /* adjust padding for h2 to allow more room on Carrie Chau page */
/*.xProdWrapper h2 {position:absolute; top:0px; left:0px; text-align:left; padding-right:100px !important; }  adjust padding for h2 to allow more room on Carrie Chau page */

.xProdWrapper2 {text-align:center;position:relative;text-align:center; font-size:15px; min-height:300px}
.xProdWrapper2 .small {color:#666; display:inline; font-size:12px}
.xProdWrapper2 h2 {text-align:center;position:absolute; top:180px; left:5px; padding-right:5px !important; } 


.xProdAvailAt p {padding:5px 0 0 20px !important;}
.xProdAvailAt ul {font-size:75%; padding:0 0 5px; margin:0 0 0 20px;}
.xProdAvailAt li { list-style:outside disc; margin:0 0 5px 1.2em;}
input.button {border: 0;height:40px; width:161px; background:url(../../_images/octoContentImages/bt-sh-cart.gif) no-repeat;color: #FFF; font-weight:bold}


/**
new classes to change override the original box design (width / border etc) to allow 3 product images to be display horizontally on the same row
**/
.xprodCtnr3Col {width:33% !important;}
.xprodCtnr3Col h2 {padding:15px 10px 0 !important;}
.xprodCtnr3Col h2 span {padding:0 !important;}



/**
Author: Lith Fung, The Kitchen Ltd
Date: 30 Oct 2009
For Promotion Pages
**/

/* full frame promotion box */
.ffPromote {width:213px;height:195px;position:relative;-width:189px;}
.ffPromote .img{position:absolute;top:-3px;left:-12px;width:213px;height:170px;text-align:center;}
.ffPromote h2{position:absolute;top:1px;left:-12px;width:213px;text-align:center;}
.ffPromote .txt{position:absolute;top:132px;left:-12px;width:213px;margin-left:auto;margin-right:auto;text-align:center;}



/* promotion detail page */
.mytable {float:left;margin-left:20px;-margin-left:10px;margin-right:3px;-margin-right:12px;margin-top:30px;border:0px;width:448px;border-spacing:0px; font-family:Arial,新細明體, Helvetica, sans-serif;background:url(../../../web09_include/_images/octoFrameworkImages/background_s_bottom.jpg) no-repeat bottom center;}
.mytable .thead{background:url(../../../web09_include/_images/octoFrameworkImages/background_s_top.jpg) no-repeat top center;}
.mytable h4{font-size:16px;margin-top:0px;margin-bottom:1.33em;}
.mytable h5{font-size:14px;margin:0px;padding:0px;}
.mytable p{font-size:14px;margin-top:0px;margin-bottom:1em;}
.mytable a{font-size:12px;color:#e94226;text-decoration:underline;}
.mytable .thead {padding:4px 4px 0px 4px;}
.mytable .tbody {position:relative;width:350px;}
.mytable .tbody .txt{position:absolute;width:350px;top:15px;left:32px;}
.mytable .tbody .img{position:absolute;width:443px;top:0px;left:0px;text-align:right;}

.mytable {height:370px;}
.mytable.h300{height:300px;}
.mytable.h520{height:520px;}


/* 
new banner class to correct problem in mybanner
the border should inherit from the original style.css
thus the following new class .bannerV2 which should take care of all the image / text overlaying with flexible position
modified by: Henry Wong, Kitchen, 2009 Dec 07
*/

.bannerV2 {
	margin-left:auto;
	margin-right:auto;
	width:907px;
	padding:0;
	font-family:Arial,新細明體, Helvetica, sans-serif;
	position:relative;
}

.bannerV2 .txt {position:absolute; font-size:100%;}

.bannerV2 .left450 {top:0; left:450px; padding-top:15px;}
.bannerV2 .left480 {top:0; left:480px; padding-top:15px;}

.bannerV2 .offerTbl {width:370px;}
.bannerV2 .offerTbl td { vertical-align:top; padding-top:3px; color:#4F4F4F; font-size:80%;}
.bannerV2 .offerTbl .offercol {width:60px;}

.bannerV2 .lightbox {font-size:12px; text-decoration:underline;}

.bannerV2 .rewardLogo { vertical-align:middle;}

.bannerV2 .emTxt {font-size:110%; font-weight:bold;}

.bannerV2 .footnote {margin-top:-1.2em; margin-left:10px; position:relative; line-height:1em;}

/*end bannerV2*/

/*special text placement for the reward landing*/
.mybanner {
	margin-left:auto;
	margin-right:auto;
	width:920px;height:217px;
	padding:0px;
	border-top:1px solid white;
	font-family:Arial,新細明體, Helvetica, sans-serif;
}
/* for Height 280 Hero Banner */
.mybanner.h280 {
	height:280px !important;
}

/*special text placement for the reward landing*/
.mybanner .txt{
	margin:-90px 0px 0px 465px;
}

.mybanner .txt.paypromo_styleA {
	margin:-190px 0px 0px 550px;
	padding-right: 10px;
}
.mybanner .txt.paypromo_styleA.m240 {
	margin:-240px 0px 0px 550px !important;
}

.mybanner .txt p{
	font-size:15px;margin-bottom:1em;
}

.mybanner .txt a{
	font-size:12px;color:#e94226;text-decoration:underline;
}


/* tnc */
.tnc h1{margin-bottom:1em;}


/* latestPromo Banner sizing */
.latestPromoBanner {height:209px !important;position:relative;overflow:hidden;}
.latestPromoBanner h2{position:absolute;top:5px;left:0px;padding-left:15px;}
.latestPromoBanner .banner{position:absolute;top:0px;left:0px;padding:0px;margin:0px;}
.latestPromoBanner .desc{position:absolute;line-height:1.5em;z-index:100;font-size:14px;color:#333333;width:200px;top:20px;left:10px;}
.latestPromoBanner .tLink{position:absolute;top:185px;left:0px;padding:0 225px 6px 15px;z-index:200;font-size:12px;}
.latestPromoBanner .link{position:absolute;top:185px;left:0px;padding:0 225px 6px 15px;position:relative;z-index:200;font-size:12px;}
.latestPromoBanner .linkright{position:absolute;top:185px;left:0px;padding:0px 0px 6px 385px;position:relative;z-index:200;font-size:12px;}
.latestPromoBanner .hide {display:none;}
/* Coming Soon Text Style */
.octoContentStyle11 .octoContentStyle11c .octoContentStyle105 .octoContentStyle105a02 {	
	font-weight:bold; font-size:14px; color:#C96B24; font-style:italic; margin: 5px 0;
}

.comingsoonitem {
	font-weight:bold; font-size:14px; color:#C96B24; font-style:italic; margin: 5px 0;
}


/*lightbox*/
div.jvsPrintContent{width:700px;}
div.jvsPrintContent img{margin-left:auto;margin-right:auto;}
div.jvsPrintContent div{width:660px;margin-left:auto;margin-right:auto;}
p.tnc{font-size:14px;}
p.tncfootnote{font-size:11px;font-family:Arial, Helvetica, sans-serif;}
table.tnc td {font-size:14px;color:#4f4f4f;padding-bottom:10px;vertical-align:top;padding-right:10px;}
table.tnc td.nosep {padding-bottom:0px;}
table.tnc td.offer{width:10%;white-space:nowrap;}
table.tnc td.d1 {}
table.tnc td.d2 {white-space:nowrap;}
table.tnc td.d3 {white-space:nowrap;}
table.tnc td ul  {list-style:disc inside;}
table.tnc td ul li{list-style-type:disc;}
table.tnc {margin-bottom:17px;}
h3.headline{font-size:16px;}
h3.tnc{font-size:12px;margin-top:10px;}
ul.octoListStyle01 li{font-size:12px;}

h4.subhead {font-size:14px;font-weight:bold;margin-bottom:14px;margin-left:-16px;padding-left:16px;background:url(../../_images/octoContentImages/rewards_tnc_bullet.jpg) left center no-repeat;}
tr.grey td{background-color:#ededee;}

table.tncMTR {border-spacing:0px 5px;margin-bottom:45px;}
table.tncMTR td{width:33%;font-size:14px;padding:4px;vertical-align:top;}
table.tncMTR tr.img td{vertical-align:bottom;text-align:center;}
table.tncMTR tr.name td{vertical-align:bottom;font-weight:bold;}

table.tncMTRmore {margin-bottom:45px;}
table.tncMTRmore td{font-weight:normal;vertical-align:top;font-size:14px;padding:4px;white-space:nowrap;}

.smaller table.tnc td {font-size:13px;}

/* socialnet_lightbox extension */
.socialnet_lightbox {position:absolute;top:12px;right:8px;}
.socialnet_template, .jvsPrint {display:none;}
.socialnet_template a {float:left;padding:0 2px;}
.socialnet_template a span{display:block;width:24px;height:24px;background:url(../../_images/octoFrameworkImages/socialnet_icons.jpg);}
.socialnet_template .socialnet_facebook span {background-position:0 0;}
.socialnet_template .socialnet_twitter span {background-position:-31px 0;}
.socialnet_template .socialnet_weibo span {background-position:-61px 0;}
.socialnet_template .socialnet_print span {background-position:-91px 0;}