/**********************
	Global
**********************/
*{
	font: inherit;
}
i{ font-style:italic; }
a{
	border: 0px;
	color: #888888;
}
a:hover{
	color: #FFFFFF;
}
body{
	color: #FFF;
	background-color: #000;
	font-family: "InterstateExtraLightRegular",Helvetica,Verdana,Arial,'\5FAE\8F6F\96C5\9ED1';
	font-size: 12px;
}
::-moz-selection{
	color: #ffda9a;
	background: #5a4c19;
} 
::selection {
	color: #5a4c19;
	background: #292929;
} 
#wrapper{
	text-align:center;
}
.container{
	position:relative;
	margin: 0px auto;
	width:975px; /* default just in case */
	height:100%;
}
.tinySize .container{
	width:975px;
}
.hugeSize .container{
	width:1280px;
}

h1{ font-size:200%; margin:0px;}
h2{ font-size:180%; margin:0px;}
h3{ font-size:160%; margin:0px;}
h4{ font-size:140%; margin:0px;}
h5{ font-size:120%; margin:0px;}
h6{ font-size:100%; margin:0px;}
.demo{ display:none; }
.debug{ border: 1px #FF0000 solid; }
.debug:hover{ border: none; }

/**********************
	Scrollbar
**********************/
.scrollbar{width:100%;margin:0 5px 0 0;overflow:hidden;border:none;}
.scrollbar.simple{}
.scrollbar.noborder{border:none;}
.scrollbar p{margin:0;padding:8px;line-height:1.2;}
.scrollbar-handle-container{
	background: transparent;
	border-left:1px #333 solid;
	width:10px;
}
.scrollbar-handle{
	background:transparent;
	border-left:3px #666 solid;
	width:9px;
}
.scrollbar-handle.move,
.scrollbar-handle:hover{
	background:transparent;
	border-left:3px #999 solid;
}
.scrollbar-handle-up{
	background: transparent;
	width:10px;
	height:10px;
}
.scrollbar-handle-down{
	background: transparent;
	width:10px;
	height:10px;
}
/**********************
	Menu
**********************/
#upperSection.unzip{
	height:480px;
}
#upperSection.zip.alignTop{
	/* height: 260px */
	height: 100px;
}
.zipPatch.unzip{
	height:530px;
}
.zipPatch.zip{
	height: 150px;
}
#upperSection.zip.alignBottom{
	/* height: 260px */
	margin-top: -378px;
	height:480;
}
#lowerSection{
	position:relative;
	background: transparent url("../images/lowerSection_bg.gif") left 50px repeat-x scroll;
	width:100%;
	min-height: 300px;
}
#lowerSection .topline{ border-top:1px #424242 solid; }
#lowerSection .leftline{ border-left:1px #424242 solid; }
#lowerSection .rightline{ border-right:1px #424242 solid; }
#lowerSection .bottomline{ border-bottom:1px #424242 solid; }
#lowerSection .submenu{
	padding:0px;
	color:#000000;
	text-align:left;
	background-color:#FFF;
	background-color:rgba(255, 255, 255, 0.5);
}
.jsmenu .title a{
	background: #888 url("../images/submenu_arrow2.gif") 200px 25px no-repeat;
}
.jsmenu.active .title a{
	background: #888 url("../images/submenu_arrow2.gif") 200px -75px no-repeat;
}

#lowerSection .submenu ul,
.jsmenu ul{
	margin:0px;
	padding:0px;
	list-style-type: none;
}
#lowerSection .submenu ul li,
.jsmenu ul li{
	margin:0px;
	padding:0px;
}
.jsmenu a{
	color:#000;
	font-weight:bold;
	text-decoration:none;
}
.jsmenu a{
	display:block;
}
.jsmenu a:hover{
	color:#333;
}
#lowerSection .submenu a{
	color:#000;
	font-weight:bold;
	text-decoration:none;
	background-color:tranparent;
	padding: 8px 3px;
}
#lowerSection .submenu td a{
	display:block;
}
#lowerSection .submenu a:hover{
	color:#333;
	background-color:#FFFFFF;
}

.dropdown{
	position:absolute;
	top:0px;
	left:490px;
	z-index:10;
	margin:0px;
	padding:0px;
	width:250px;
	color:#888;
	background-color:#343434;
	background-color:rgba(52, 52, 52, 0.9);
}
.dropdown .popup li a{
	color:#888;
	padding:10px;
	text-decoration:none;
}
.dropdown .popup li a:hover{
	color:#FFF;
	text-decoration:underline;
}
#lowerSection .content{
	position:absolute;
	/* top:0px; /* don't setup */
	left:490px;
	z-index:5;
	width:250px;
	height:100%;
	margin:0px;
	padding: 0px;
	display:block;
	color:#888;
	background-color:#000;
	background-color:rgba(0, 0, 0, 0.8);
	
	font-size: 12px;
	font-family: Helvetica,Verdana,Arial,'\5FAE\8F6F\96C5\9ED1';
	line-height: 17px;
	text-align:left;
	
	overflow:hidden;
}
#lowerSection .content p{
	padding: 8px 0px;
}
#chabot_menu{
	position:fixed;
	_position:absolute;
	top:16px;
	z-index:11;
	width:100%;
	color:#929292;
	/* background:#3b3b3b; 
	background: rgba(59, 59, 59, 0.8);
	*/
	background-color:#3b3b3b;
	background-color: rgba(59, 59, 59, 0.8);
	display:block;
}
#chabot_menu .alignLeft{
	float:left;
	height:100%;
	display:table;
	text-align:left;
	vertical-align:middle;
	z-index:1;
}
#chabot_menu .alignRight{
	float:right;
	height:100%;
	display:table;
	text-align:left;
	vertical-align:middle;
	z-index:2;
}
#smallLogo{
	text-align:right;
	width:50px;
	margin:0px;
	padding:0px;
	overflow:hidden;
	display:block;
}
#smallLogo.zip{
	margin-top: -6px;
	margin-bottom: -6px;
}
#smallLogo.unzip{
	margin-top: -60px;
}
#chabot_menu .item{
	position:relative;
	font-size: 90%;
	margin:auto;
	padding:0px;
	display:table-cell;
	vertical-align:middle;
	list-style-type: none;
}
#chabot_menu .item li ul{
	position:absolute;
	/* background:#3b3b3b; */
	background:#3b3b3b;
	background-color: rgba(59, 59, 59, 0.9);
	margin:0px;
	padding:0px;
	display:none;
}
#chabot_menu .item li ul li{
	list-style-type: none;
	padding:0px;
	margin:0px;
	display:table-row;
	width:100%;
	text-align:left;
}
#chabot_menu .item li ul li a{
	border-top: 1px #cccccc solid;
	min-width:100px;
}
#chabot_menu .item li ul li a.noline{
	border: none;
}
#chabot_menu .item a{
	text-decoration:none;
	color:#b4b4b4;
	margin:0px;
	padding:8px 5px;
	display:table-cell;
}
#chabot_menu .item.active .title a,
#chabot_menu .item a:hover{
	color:#FFFFFF;
	text-decoration:underline;
}
#chabot_menu .item.active .title a,
#chabot_menu .item .title a:hover{
	background: #6d6d6d;
	text-decoration:none;
}
/**********************
	logo
**********************/
#logoBG{
	position:absolute;
	top:0px;
	left:106px;
	
	z-index:10;
	width: 185px;
	height: 100%;
	display:block;
	text-align:center;
	background: transparent url(../images/logo_mark_bg.png) repeat-y left top;
}
/**
.zip.alignBottom #logoBG{
	top:220px;
}
.tinySize #logoBG{
	left:92px;
}
.hugeSize #logoBG{
	left:245px;
}
**/
#logo{
	width:120px;
	height:111px;
	display:block;
	margin-top: 106px;
	margin-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
	background: transparent url(../images/logo.gif) no-repeat left top;
}
/**********************
	Accept T&C
**********************/
.lock{
	overflow:hidden;
}
.acceptPop{
	position:absolute;
	top:0px;
	left:0px;
	z-index:1000;
	display:block;
	width:100%;
	height:100%;
	color:#000000;
	font-family: Arial;
	background-color: #000000;
	background-color: rgba(0,0,0, 0.7);
}
.acceptPop .acceptTC{
	width:895px;
	height:450px;
	display:block;
	background: transparent url('../images/accept/white_bg.png') left top no-repeat;
}
.acceptPop .acceptTC .redLogo{
	width:100%;
	height:158px;
	display:block;
	background: transparent url(../images/accept/logo_red.png) no-repeat center center;
}
.acceptPop .acceptTC .lang{
	text-align: right;
	padding: 15px;
}
.acceptPop .acceptTC .lang a{
	color: #000000;
	padding: 5px;
	text-decoration:none;
}
.acceptPop .acceptTC .lang a:hover{
	color: #FFFFFF;
}
.acceptPop .acceptTC .text00{
	width:100%;
	height:95px;
	display:block;
	background: transparent url(../images/accept/text00.png) no-repeat center center;
}
.acceptPop .acceptTC .text01{
	width:100%;
	height:40px;
	display:block;
	background: transparent url(../images/accept/text01.png) no-repeat center center;
}
.acceptPop .acceptTC .goldline{
	width:100%;
	height:112px;
	display:block;
	background: transparent url(../images/accept/gold_line.jpg) no-repeat center center;
}
.acceptPop .acceptTC .yes,
.acceptPop .acceptTC .no{
	width: 100px;
	height: 40px;
	display:inline-block;
	margin: 0px 10px;
	cursor: pointer;
	background: transparent url(../images/accept/btn00.png) no-repeat center center;
}
.acceptPop .acceptTC .yes:hover{
	background: transparent url(../images/accept/btn00_over.png) no-repeat center center;
}
.acceptPop .acceptTC .no{
	background: transparent url(../images/accept/btn01.png) no-repeat center center;
}
.acceptPop .acceptTC .no:hover{
	background: transparent url(../images/accept/btn01_over.png) no-repeat center center;
}

/**********************
	Zip / UnZip page
**********************/
.zipLink{
	float:right;
	display:block;
	color:#888888;
	font-family: "InterstateExtraLightRegular",Verdana;
	font-weight:normal;
	font-size:180%;
	margin:0px;
	margin-right:15px;
	padding-left:15px;
	padding-right:23px;
	padding-top:20px;
	padding-bottom:8px;
	height:30px;
	cursor:pointer;
	text-decoration:none;
}
.zipLink:hover{
	color:#FFFFFF;
}
.zipLink.zipup{
	background: transparent url("../images/arrow_up.gif") no-repeat right 24px;
}
.zipLink.zipdn{
	background: transparent url("../images/arrow_dn.gif") no-repeat right 24px;
}
/**********************
	language select
**********************/
#wrapper.ENG .CHI,
#wrapper.CHI .ENG{ display:none; }
#wrapper.CHI{
	font-family: '\5FAE\8F6F\96C5\9ED1';
}
/**********************
	title setting
**********************/
.title01{
	display:block;
	color:#888888;
	font-family: "InterstateExtraLightRegular",Verdana;
	font-weight:normal;
	text-shadow: 1px 1px 2px #ccc, 0 0 0 #000 !important;
	/* filter: progid:DXImageTransform.Microsoft.MotionBlur(strength=3,direction=137)/9;*/
	/* filter: progid:DXImageTransform.Microsoft.Shadow(color=#606060,direction=137,strength=3)/9; */
	/* filter: progid:DXImageTransform.Microsoft.DropShadow(offx=1, offy=1, color=#434343); */
	filter: progid:DXImageTransform.Microsoft.Shadow(color=#434343,direction=137,strength=3)/9;
}
.title02{
	padding-left:15px;
	padding-right:15px;
	padding-top:20px;
	padding-bottom:8px;
	font-size:180%;
	height:30px;
}
.title03{
	color:#bbbbbb;
	font-size:150%;
}
.title04{
	padding-left:15px;
	padding-right:15px;
	padding-top:20px;
	padding-bottom:8px;
	color:#bbbbbb;
	padding-bottom:15px;
	font-size:150%;
}
/**********************
	Header
**********************/
#header{
	position:relative;
	height:100%;
	overflow:hidden;
}
.tinySize #head00{	width:190px;}
.hugeSize #head00{	width:230px;}

.tinySize #head01{	width:350px;}
.hugeSize #head01{	width:400px;}

#footer{
	font: normal 75% 'Arial';
	color: #888888;
	margin-bottom:30px;
}

@font-face {
    font-family: 'InterstateExtraLightRegular';
    src: url('../webfonts/interstate-extralight-webfont.eot');
    src: url('../webfonts/interstate-extralight-webfont.eot?#iefix') format('embedded-opentype'),
         url('../webfonts/interstate-extralight-webfont.woff') format('woff'),
         url('../webfonts/interstate-extralight-webfont.ttf') format('truetype'),
         url('../webfonts/interstate-extralight-webfont.svg#InterstateExtraLightRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
/**********************
	icon set
**********************/
.icon20{
	float:left;
	cursor: pointer;
	width:20px;
	height:20px;
	margin:0px 5px;
	padding:0px;
	display:block;
	overflow:hidden;
	background: transparent url(../images/icons.gif) left top no-repeat;
}

.facebook{			background-position: -20px -20px; }
.facebook:hover{	background-position: -20px 0px; }
.twitter{			background-position: -45px -20px; }
.twitter:hover{		background-position: -45px 0px; }
.renren{			background-position: -70px -20px; width:35px;}
.renren:hover{		background-position: -70px 0px; }
.weibo{				background-position: -170px -20px; width:20px;}
.weibo:hover{		background-position: -170px 0px; }
.facebookLike{		background-position: -195px -20px; width:43px;}
.facebookLike:hover{background-position: -195px 0px; }
.facebookShare{		background-position: -240px -20px; width:56px }
.facebookShare:hover{background-position: -240px 0px; }
.printbtn{			background-position: -300px -20px; }
.printbtn:hover{	background-position: -300px 0px; }
.twitterLike{			background-position: -45px -20px; }
.twitterLike:hover{		background-position: -45px 0px; }
/**********************
	facebook like-btn fix
**********************/
.fb-like{
	width:80px;
	display:inline-block;
	float:left;
	
}
.fb_edge_comment_widget.fb_iframe_widget {
	display:block;
}
.fb_edge_comment_widget.fb_iframe_widget iframe{
	width: 220px !important;
	height: 225px;
}
.leftArrow,
.rightArrow{
	position:absolute;
	top:0px;
	z-index:5;
	width: 20px;
	height: 100%;
	display: block;
	cursor: pointer;
}
.leftArrow:hover,
.rightArrow:hover{
	background-color: #CCC;
}
.leftArrow{
	left:0px;
	background: #888 url(../images/submenu_arrow4.gif) no-repeat 5px center;
}
.rightArrow{
	right:0px;
	background: #888 url(../images/submenu_arrow4.gif) no-repeat -95px center;
}