@charset "utf-8";
#promotionWrapper, #whatsHappenWrapper {position: absolute; bottom: 10px; left: 0px; color: #fff; color: #fff; z-index: 100; margin-bottom: 0px;}
#promotionWrapper {bottom: 210px; margin-left: 50px; z-index: 0;}

#promotionWrapper .promotionItem, #whatsHappenWrapper .promotionItem {position: relative;}
.whatsTitle, #whatsItemWrapper, #proItemWrapper, #firstPromotionMask {float: left;} 


.whatsTitle {width: 240px; height: 142px; background:url(../images/promotions/bg_promotion.png) repeat 0 0; display: block; padding: 48px 20px 0 20px; margin: 0px 10px 0 0;font-size: 70%; line-height: 140%; position: absolute; bottom: 0; left: 210px;}
.whatsTitle div {position: absolute; bottom: -10px; left: 10px;}
.whatsTitle h2 {padding-bottom: 7px;}
#promotionWrapper .whatsTitle h2, #promotionWrapper .whatsTitle h1 {padding-bottom: 20px;}

#whatsItemWrapper, #proItemWrapper, #firstPromotionMask {width: 570px; height: 190px; display: block; overflow: hidden;  position: absolute; bottom: 0;}
#whatsItemWrapper {left: 500px;}
#firstPromotionMask {width: 200px; margin-right: 10px;}


div#whatsItemList, div#proItemList, #promotionWrapper #firstPromotion {left: 0; position: absolute; bottom: 0px;}

div.whatsItem {width: 180px; height: 300px; padding: 10px; display: block; float: left; margin-right: 10px; background-color:#316F71; position: relative; bottom: -130px; left: 0; cursor:pointer;}


#proItemWrapper div.whatsItem {background-color: #0B825B;}
#firstPromotionMask div.whatsItem {bottom: 0px;}
div.whatsItem h3 {font-family: Helvetica, Arial, sans-serif; color: #fff; font-size: 90%; line-height: 110%; padding: 6px 3px 0px 3px; height: 30px; margin-bottom: 10px; overflow: hidden;}
div.whatsItem div.scroll-pane { width: 184px;	height: 112px;	overflow: auto; position: relative; font-size: 70%; line-height: 140%;}
.whatsItem div.scroll-pane .jspDrag {background: url(../images/promotions/btn_scroll.png) no-repeat scroll 0 0 transparent; box-shadow: none; left: -6px; position: relative; top: 0; width: 21px !important;}

#promotionWrapper .whatsTitle {position: relative; left: 210px;}
#proItemWrapper {margin-left: 500px; *margin-left: 210px;}

#whatsHappen .whatsTitle div {bottom: 10px;}

#whatsHappenWrapper .promotionItem p {padding-bottom: 0; margin-bottom: 0; padding-right: 20px;}
#whatsHappenWrapper .jspHorizontalBar { height: 0; visibility: hidden;}