@import url("reset.css");
@import url("fontFace.css");

*{-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-tap-highlight-color: transparent;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
a{text-decoration:none;color:#666666;}
a:hover{text-decoration:underline;}
a:focus {outline:none;}
html,body {font-family: Arial, 'Microsoft JhengHei', sans-serif, simsun;font-size:12px;background-image:url('../images/bg_pattern.jpg');background-size: 70px;}
html{/*overflow-y: scroll;*/}
body{overflow-y: scroll;overflow-x: hidden;min-width: 300px;}
dl dt, dl dd {float:left;}
dt, dd{display:block;}
dt:after{clear:left;}
img{vertical-align: middle;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-o-user-select: none;user-select: none;}
input[type=text], input[type=tel], input[type=email] {width: 250px;font-family: Arial, 'Microsoft JhengHei', sans-serif, simsun;font-size:12px;background:url(../images/spacer.gif) transparent;border:0;}
textarea {font-family: Arial, 'Microsoft JhengHei', sans-serif, simsun;font-size:12px;}
select, select option {font-family: Arial, 'Microsoft JhengHei', sans-serif, simsun;font-size:12px;}

.btn{cursor:pointer;}
.btn:hover{background-position:left bottom !important;}
.aLeft{text-align:left;}
.aRight{text-align:right;}
.aCenter{text-align:center;}
.clear{clear:both;}
.clearLine{clear:both !important;height:0 !important;padding:0 !important;margin:0 !important;}

/*clearfix*/
.clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
.clearfix {display: inline-block;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}
/*clearfix eof*/

.fixDiv{position:fixed;}
.floatDiv{position:absolute;}
.containerDiv{position:relative;}
.floatLeft{float:left;}
.floatRight{float:right;}
.iframeContent {width: 100%;border: 0px;scrolling: no;}
.ulList li{list-style-type:none;float:left;}
.ulListVertical li{list-style-type:none;}

.upperText{text-transform:uppercase;}
.lowerText{text-transform:lowercase;}
.cssTrim{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}  /*you need to set width of the html element*/

::-webkit-input-placeholder { /* WebKit browsers */
    color: #000000;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #000000;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #000000;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #000000;
}

/*color*/
.wh{color:white;}
.bk{color:black;}

/*font*/
.ft0{font-size:0px;}
.ft12{font-size:12px;}
.ft24{font-size:24px;}
.ft48{font-size:48px;}

.lh0{line-height:0px;}

/*common*/
#debugPanel{background:rgba(100, 100, 100, .5);left:0px;bottom:0px;width:100%;height:250px;max-height:250px;display:none;overflow:auto;pointer-events:none;z-index:9999;}
#headerWrapper, #contentWrapper, #footerWrapper{}
#headerContent, #contentMain, #footerContent{}
#headerFixWidth, #contentFixWidth, #footerFixWidth{width:980px;margin:0 auto;}
.overlay{position: fixed;top:0;left: 0;right: 0;bottom: 0;background-image:url(../images/menu/overlayBg.png);opacity: 0;display: none;z-index: 99;}
/*header*/
#headerContent{}
#headerContent .btnLogo{display: inline-block;position: fixed;top:0;left: 0;z-index: 30;}
#headerContent .btnLogo img{width:170px;}
#headerContent .btnMenu{position: fixed;top: 36px;right: 36px;display: inline-block;padding: 10px 0px;z-index: 300;}
#headerContent .btnMenu span{display: block;height: 3px;width: 40px;background-color: #f95a57;transition:.25s;}
#headerContent .btnMenu span:before, #headerContent .btnMenu span:after{content: "";display: block;width: 40px;height: 3px;background-color: #f95a57;position: absolute;transition:.25s;}
#headerContent .btnMenu span:before{top: 0px;}
#headerContent .btnMenu span:after{top: 20px;}
#headerContent .btnMenu:hover span:before{top:-3px;}
#headerContent .btnMenu:hover span:after{top:23px;}
#headerContent .btnMenu.whiteStyle span{background-color: #ffffff;}
#headerContent .btnMenu.whiteStyle span:before, #headerContent .btnMenu.whiteStyle span:after{background-color: #ffffff;}
#headerContent .nav{position: fixed;right: 0px;top: 0px;bottom:0;background-image:url(../images/menu/navBg.png);width: 452px;overflow: auto;-webkit-overflow-scrolling: touch;z-index: 300;transform: translate3d(0,0,0);-ms-transform: translate3d(0,0,0);-webkit-transform: translate3d(0,0,0);}
#headerContent .nav.hide{visibility: hidden;}
#headerContent .nav .scroll-content{position: relative;}
#headerContent .nav ul{list-style: none;}
#headerContent .nav ul.mainNav li{color: #4c4c4c;cursor: pointer;font-size: 0;}
#headerContent .nav ul.mainNav li a{position: relative;font-size: 20px;line-height: 24px;display: inline-block;/*padding-left:120px;*/text-decoration: none;margin-left: 70px;overflow: hidden;}
#headerContent .nav ul.mainNav li a span{display: inline-block;vertical-align: middle;padding-left: 20px;}
#headerContent .nav ul.mainNav li a span.icon{display: inline-block;width: 50px;height: 80px;overflow: hidden;margin-top: 0;padding-left: 0;}
#headerContent .nav ul.mainNav li a span.icon img{width: 50px;}
#headerContent .nav ul.mainNav li.selected, #headerContent .nav ul.mainNav li:hover{background-color: #fb5959;}
#headerContent .nav ul.mainNav li.selected a, #headerContent .nav ul.mainNav li:hover a{color: #ffffff;}
#headerContent .nav ul.mainNav li.selected a span img, #headerContent .nav ul.mainNav li:hover a span img{margin-top: -80px;}
#headerContent .nav ul.bottomNav{position: absolute;bottom: 50px;}
#headerContent .nav ul.bottomNav li a{background-position: left top;background-repeat: no-repeat;background-size: 40px 80px;display: inline-block;text-decoration: none;display: inline-block;width: 40px;height: 40px;margin: 8px 0px 8px 70px;}
#headerContent .nav ul.bottomNav li a:hover{background-position: left bottom;}
#headerContent .nav ul.bottomNav li.fb a{background-image:url(../images/menu/btn_fb.png);}
#headerContent .nav .btnClose{position: absolute;top: 32px;right: 40px;z-index: 999;display: inline-block;width: 31px;height: 31px;background-image: url(../images/menu/close.png);background-position: left top;background-repeat: no-repeat;background-size: 31px;}
#headerContent .nav ul.bottomNav li.lang[data-lang="en"] a{background-image:url(../images/menu/btn_en.png);}
#headerContent .nav ul.bottomNav li.lang[data-lang="tc"] a{background-image:url(../images/menu/btn_tc.png);}
#headerContent .nav ul.bottomNav li.lang[data-lang="sc"] a{background-image:url(../images/menu/btn_sc.png);}

#loading{position: fixed;top:0;bottom:0;left:0;right:0;z-index: 9999;}
#loading .loading-bg{position: absolute;background-color: #fb5959;width:100%;height: 100%;top:0px;left:0;text-align: center;transform: translate3d(0,0,0);-ms-transform: translate3d(0,0,0);-webkit-transform: translate3d(0,0,0);}
#loading .loading-img{position: absolute;top:50%;left:50%;margin-top:-50px;margin-left: -50px;width: 100px;height: 100px;opacity: 0;transform: translate3d(0,0,0);-ms-transform: translate3d(0,0,0);-webkit-transform: translate3d(0,0,0);}
.underOverlay{z-index: 98!important;}
.isMobile{display: none;position: absolute;top:-1px;left:-1px;}
.line{height: 100%;width: 100%;position: absolute;top:0;left: 0;}
.line > div{position: absolute;background-color: #e4e4e4;}
.line .line-top{top:0;left:0;right: 0;height: 1px;}
.line .line-bottom{bottom:0;left:0;right: 0;height: 1px;}
.line .line-left{top:0;bottom:0;left:0;width: 1px;}
.line .line-right{top:0;bottom:0;right: 0;width: 1px;}

.more{position: absolute;font-size: 12px;color: #FC595A;width: 28px;height:28px;line-height: 22px;top: 50%;right: 30px;margin-top: -11px;transform: translate3d(0,0,0);-ms-transform: translate3d(0,0,0);-webkit-transform: translate3d(0,0,0);}
.more span{position: absolute;top: 0;right: 0;}
.more img{width: 28px;position: absolute;top: 0;left: 0;}

/*content*/
#mainContent{min-height: 630px;}

/*footer*/
#footerContent{}

