html, body {
	background-color: #fff;
	width: 100%;
	height: 100%;
}

#loading {
	background-color: #000;
	position: absolute;
	z-index: 100;
	width: 100%;
	height: 100%;
}

#loading #loadingGif {
	position: absolute;
	z-index: 1;
	width: 74px;
	height: 92px;
	top: 50%;
	left: 50%;
	margin-top: -46px;
	margin-left: -37px;
}

#loading #loadingLine {
	background: url(../images/loading_bg.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 74px;
    height: 92px;
    top: 50%;
    left: 50%;
    margin-top: -40px;
    margin-left: -27px;
}

#loading #loadingText {
	position: absolute;
    z-index: 1;
    width: 100px;
    top: 50%;
    left: 50%;
    margin-left: -40px;
    text-align: center;
    color: #fff;
}

#container {
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 700px;
    top: 50%;
    margin-top: -350px;
}

#container #header {
	background: url(../images/header.png) center center no-repeat;
	position: absolute;
	z-index: 2;
	width: 100%;
	height: 82px;
	top: 0;

}

#container #header .frame,
#container #content .frame {
	position: absolute;
	z-index: 1;
	width: 1000px;
	height: 100%;
	left: 50%;
	margin-left: -500px;
}

#container #header .frame #logo {
	background: url(../images/logo.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 126px;
	height: 26px;
	top: 16px;
	left: 23px;
	cursor: pointer;
}

#container #header .frame .menu {
	background: url(../images/menu.png) no-repeat;
	position: absolute;
	z-index: 1;
	height: 67px;
	cursor: pointer;
}

#container #header .frame #homeMenu {
	width: 102px;
	left: 222px;
}

#container #header .frame #homeMenu:hover,
#container #header .frame #homeMenu.active {
	background-position: 0 -67px;
}

#container #header .frame #loveMenu {
	background-position: -102px 0;
	width: 162px;
    left: 283px;
}

#container #header .frame #loveMenu:hover,
#container #header .frame #loveMenu.active {
	background-position: -102px -67px;
}

#container #header .frame #ruleMenu {
	background-position: -264px 0;
	width: 127px;
    left: 399px;
}

#container #header .frame #ruleMenu:hover,
#container #header .frame #ruleMenu.active {
	background-position: -264px -67px;
}

#container #header .frame #titbitsMenu {
	background-position: -391px 0;
	width: 127px;
    left: 482px;
}

#container #header .frame #titbitsMenu:hover,
#container #header .frame #titbitsMenu.active {
	background-position: -391px -67px;
}

#container #header .frame #movieMenu {
	background-position: -518px 0;
	width: 124px;
    left: 567px;
}

#container #header .frame #movieMenu:hover,
#container #header .frame #movieMenu.active {
	background-position: -518px -67px;
}

#container #header .frame #kkboxMenu {
	background-position: -642px 0;
	width: 138px;
    left: 648px;
}

/*#container #header .frame #kkboxMenu:hover,
#container #header .frame #kkboxMenu.active {
	background-position: -642px -67px;
}*/

#container #header .frame #pchomeMenu {
	background-position: -780px 0;
	width: 177px;
    left: 740px;
}

#container #header .frame #pchomeMenu:hover,
#container #header .frame #pchomeMenu.active {
	background-position: -780px -67px;
}

#container #header .frame #musicMenu {
	background: url(../images/music.png) no-repeat;
	position: absolute;
    z-index: 1;
    width: 50px;
    height: 50px;
    left: 960px;
    cursor: pointer;
}

#container #content {
	position: absolute;
	z-index: 1;
	width: 100%;
	height: 700px;
}

#container #footer {
	background: url(../images/footer.png) center center no-repeat;
	position: absolute;
	z-index: 2;
	width: 100%;
	height: 62px;
	bottom: 0;
}

#index #container #content {
	background: url(../images/index_bg.jpg) center center no-repeat;
}

#index #container #content .frame #canvas {
	position: absolute;
	z-index: 1;
	width: 400px;
	height: 450px;
	top: 105px;
    left: -45px;
}

#index #container #content .frame #fbShare {
	background: url(../images/index_fb_share.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 160px;
	height: 43px;
	top: 480px;
	left: 72px;
	cursor: pointer;
}

#index #container #content .frame #fbShare:hover {	
	background-position: -160px 0px;	
}
#index #container #content .frame #fbShare #fbShare_light {
	background: url(../images/index_fb_share_light.png) no-repeat;
	position: absolute;
	z-index: 2;
	width: 160px;
	height: 43px;
	cursor: pointer;
}

#index #container #content .frame #tv {
	background: url(../images/index_tv_bg.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 502px;
	height: 316px;
	top: 213px;
	left: 308px;
}

#index #container #content .frame #tv #cover {
	background: url(../images/index_tv_cover.png) no-repeat;
	position: absolute;
	z-index: 2;
	width: 479px;
	height: 269px;
	top: 50%;
	left: 50%;
	margin-top: -134.5px;
	margin-left: -239.5px;
	display: none;
}

#index #container #content .frame #tv #player {
	position: absolute;
	z-index: 1;
	width: 479px;
	height: 269px;
	top: 50%;
	left: 50%;
	margin-top: -134.5px;
	margin-left: -239.5px;
}

#index #container #balloon {	
	position: absolute;
	z-index: 3;
	height: 174px;
	width: 159px;
	top: 30px;
	left: 50%;
    margin-left: 360px;
}

#index #container #balloon #balloonMotion {
	background-image: url(../images/index_balloon.png);
	position: absolute;
	z-index: 1;
	height: 174px;
	width: 159px;
}

#love #container #content {
	background: url(../images/love_bg.jpg) center center no-repeat;
}

#love #container #content .frame .popup {
	background: url(../images/love_popup_bg.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 643px;
	height: 490px;
	top: 50%;
	margin-top: -228px;
	margin-left: 352px;
}

#love #container #content .frame .popup #goMovie {
	background: url(../images/love_movie_btn.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 94px;
	height: 31px;
	top: 166px;
    left: 528px;
	cursor: pointer;
}

#love #container #content .frame .popup #goMovie:hover {
	background-position: -94px 0;
}

#love #container #content .frame .popup .sensor {
	position: absolute;
	z-index: 1;
	width: 50px;
	height: 20px;
	top: 304px;
	cursor: pointer;
}

#love #container #content .frame .popup #sensor1 {
    left: 195px;
}

#love #container #content .frame .popup #sensor2 {
	left: 412px;
}

#love #container #content .frame .popup #sensor3 {
	left: 560px;
}

#rule #container #content {
	background: url(../images/rule_bg.jpg) center center no-repeat;
}

#rule #container #content .frame .popup {
	background: url(../images/rule_popup_bg.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 796px;
	height: 473px;
	top: 50%;
	left: 174px;
	margin-top: -206px;
}

#rule #container #content .frame .popup #ruleContent {
	position: absolute;
    z-index: 1;
    width: 764px;
    height: 400px;
    top: 50%;
    left: 50%;
    margin-top: -200px;
    margin-left: -382px;
    overflow: hidden;
}

#rule #container #content .frame #goBtn {
	background: url(../images/rule_go_btn.png) no-repeat;
	position: absolute;
    z-index: 1;
    width: 108px;
    height: 31px;
	top: -40px;
	left: 50%;
	margin-left: -54px;
	cursor: pointer;
}

#rule #container #content .frame #goBtn:hover {
	background-position: -108px 0;
}

#titbits #container #content {
	background: url(../images/titbits_bg.jpg) center center no-repeat;
}

#titbits #container #content .frame .popup {
	background: url(../images/titbits_video_bg.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 709px;
	height: 450px;
	top: 50%;
	left: 252px;
	margin-top: -225px;
}

#titbits #container #content .frame .popup #player {
	position: absolute;
	z-index: 1;
	width: 691px;
	height: 409px;
	top: 50%;
    left: 50%;
    margin-top: -204.5px;
    margin-left: -345.5px;
}

#movie #container #content {
	background: url(../images/movie_bg.jpg) center center no-repeat;
}

#movie #container #content .frame .popup {
	background: url(../images/movie_video_bg.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 633px;
	height: 403px;
	top: 80px;
    left: 80px;
}

#movie #container #content .frame .popup #player {
	position: absolute;
	z-index: 1;
	width: 617px;
	height: 365px;
	top: 50%;
    left: 50%;
    margin-top: -184px;
    margin-left: -308.5px;
}

#movie #container #content .frame .desc {
	background: url(../images/movie_video_desc.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 442px;
	height: 48px;
	top: 580px;
	left: 180px;
}

#movie #container #content .frame .popup #preBtn {
	background: url(../images/movie_pre_btn.png) center center no-repeat;
	position: absolute;
	z-index: 1;
	width: 50px;
	height: 76px;
	top: 50%;
    left: -50px;
	margin-top: -38px;
	cursor: pointer;
}

#movie #container #content .frame .popup #nextBtn {
	background: url(../images/movie_next_btn.png) center center no-repeat;
	position: absolute;
	z-index: 1;
	width: 50px;
	height: 76px;
	top: 50%;
	right: -50px;
	margin-top: -38px;
	cursor: pointer;
}

#movie #container #content .frame .menu {
	background: url(../images/movie_video_dot.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 382px;
	height: 75px;
	top: 498px;
	left: 200px;
}

#movie #container #content .frame .menu .line {
	background: url(../images/movie_video_line.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 60px;
	height: 75px;
	left: 50px;
}

#movie #container #content .frame .menu .sensor {
	position: absolute;
	z-index: 1;
	width: 25px;
	height: 25px;
	top: 33px;
	cursor: pointer;
}

#movie #container #content .frame .menu #sensor1 {
	left: 58px;
}

#movie #container #content .frame .menu #sensor2 {
	left: 207px;
}

#movie #container #content .frame .menu #sensor3 {
	left: 358px;
}

#movie #container #content .frame .menu .title {
	background: url(../images/movie_video_title.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 123px;
	height: 21px;
	top: 3px;
	cursor: pointer;
}

#movie #container #content .frame .menu #title1 {
	background-position: 0 -21px;
	left: -20px;
}

#movie #container #content .frame .menu #title2 {
	background-position: -123px 0;
	left: 115px;
}

#movie #container #content .frame .menu #title3 {
	background-position: -246px 0;
	left: 260px;
}

#popup, #popup2 {
	position: fixed;
	z-index: 999;
	width: 100%;
	height: 100%;
}

#popup .black,
#popup2 .black {
	background-color: #000000;
    position: absolute;
    z-index: 1;
	width: 100%;
	height: 100%;
    filter:alpa(opacity=80);   /* old IE */
    filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80,FinishOpacity=15, Style=3, StartX=0, FinishX=100, StartY=0,FinishY=16); /*supported by current IE*/
    -moz-opacity:0.8;          /* Moz + FF */
    opacity:0.8;               /* 支持新版瀏覽器 */
}

#popup #notice.content {
	background: url(../images/popup_notice_bg.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 753px;
	height: 384px;
	top: 50%;
	left: 50%;
	margin-top: -192px;
	margin-left: -376.5px;
}

#popup #notice.content #okBtn,
#popup2 #message.content #sendBtn {
	background: url(../images/popup_ok_btn.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 88px;
	height: 31px;
	left: 50%;
	bottom: 35px;
	margin-left: -44px;
	cursor: pointer;
}

#popup #notice.content #okBtn:hover,
#popup2 #message.content #sendBtn:hover {
	background-position: -88px 0;
}

#popup #form.content {
	background: url(../images/popup_form_bg.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 464px;
	height: 315px;
	top: 50%;
	left: 50%;
	margin-top: -157.5px;
	margin-left: -232px;
}

#popup #form.content input {
    position: absolute;
    z-index: 1;
    width: 209px;
    height: 26px;
    left: 136px;
    padding: 0 5px;
    border: 1px solid #d0d0d0;
}

#popup #form.content input:focus { 
    outline: 0;
}

#popup #form.content input#nameText {
	top: 96px;
}

#popup #form.content input#phoneText {
	top: 144px;
}

#popup #form.content input#emailText {
	top: 193px;
}

#popup #form.content #saveBtn {
	background: url(../images/btn_form_send.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 88px;
	height: 31px;
	left: 50%;
	bottom: 38px;
	margin-left: -44px;
	cursor: pointer;
}

#popup .content .closeBtn {
	background: url(../images/btn_close.png) no-repeat;
	position: absolute;
	z-index: 1;
	width: 31px;
	height: 31px;
	top: 33px;
	right: 19px;
	cursor: pointer;
}

#popup2 #message.content {
	position: absolute;
	z-index: 1;
	width: 464px;
	height: 315px;
	top: 50%;
	left: 50%;
	margin-top: -157.5px;
	margin-left: -232px;
}