@font-face {
  font-family: 'ENGR';
  src: url('../fonts/ENGR.eot');
  src: url('../fonts/ENGR.woff2') format('woff2'),
       url('../fonts/ENGR.eot?#iefix') format('embedded-opentype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'ENGR';
  src: url('../fonts/EngraversMT.woff') format('woff'),
       url('../fonts/EngraversMT.ttf') format('truetype'),
       url('../fonts/EngraversMT.svg#EngraversMT') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'ENGR';
  src: url('../fonts/EngraversMT-Bold.woff') format('woff'),
       url('../fonts/EngraversMT-Bold.ttf') format('truetype'),
       url('../fonts/EngraversMT-Bold.svg#EngraversMT-Bold') format('svg');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'ENGR';
  src: url('../fonts/EngraversMTBold.eot');
  src: url('../fonts/EngraversMTBold.woff2') format('woff2'),
       url('../fonts/EngraversMTBold.eot?#iefix') format('embedded-opentype');
  font-weight: bold;
  font-style: normal;
}
html{ -webkit-text-size-adjust:none;}
body{ font-size:15px; -webkit-overflow-scrolling: touch;}
body *{ box-sizing:border-box; -webkit-text-size-adjust: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.lockscreen{ overflow-y:scroll;}
.lockscreen body{ overflow:hidden;}
.lockscreen .st{ overflow:hidden; height:100vh;}
a, a:hover, a:focus{ text-decoration: none; color:inherit; outline:none;}
h1,h2,h3,h4,h5{ font-weight:normal; /*font-family:ENGR;*/font-family: 'Scheherazade', serif; text-transform:uppercase; line-height:0.8;}
h3{ font-weight:bold;}
.scheherazade{ font-family: 'Scheherazade', serif;}
h3{ font-size:33px;}
h4{ font-size:48px;}
h5{ font-size:24px;}
p{ line-height:1.2; text-align:justify;}
p:first-child{ margin-top:0;}
#wrapper{ overflow:hidden;}
.center{ width:1210px; max-width:100%; padding:0 20px; margin:auto;}
.lang-icon{ display:inline-block; font-size:22px; margin-left:5px; position:relative;}
.lang-icon.hk:before {
	content: "/";
	position: absolute;
	z-index: -1;
	top:50%;
	left:-5px;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	z-index:10;
}
#homeheader{ padding:15px 0; background:rgba(205,161,139,0.8); position:fixed; top:0; left:0; width:100%; z-index:99;}
#homeheader .lang-icon, #homeheader .lang-icon.hk::before{ color:#fff;}
#landingContent{ height:100%; position:relative; color:#fff;}
#landingContent .side-container{ height:100%;}
#landingContent .side-container .side{display:block; width:50%; float:left; height:100vh; position:relative; overflow:hidden;}
#landingContent .side-container .bg{ width:100%; height:100%; background-size:cover; background-repeat:no-repeat; transition: transform 1s; -webkit-transition: transform 1s;}
#landingContent .side-container a:hover .bg{ transform:scale(1.15);}
#landingContent .side-container a:hover .sidename{ opacity: 1; filter: alpha(opacity=100);}
#landingContent .side-container .youth .bg{ background-image:url('../img/landing_youth_bg.jpg'); background-position:right center;}
#landingContent .side-container .mothercare .bg{ background-image:url('../img/landing_mothercare_bg.jpg'); background-position:center center;}
.overlay{ width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(205,161,139,0.5); pointer-events:none;}
.sidename{ font-size:40px; position:absolute; /*background-image:url('../img/landing_decoration_line.png'); background-repeat:no-repeat; min-height:150px;*/ z-index:10; transition: left .5s, right .5s, top .5s, bottom .5s, opacity .5s; -webkit-transition: left .5s, right .5s, top .5s, bottom .5s, opacity .5s; opacity: 0.8; filter: alpha(opacity=80);}
.sidename h3{ margin:0; font-size:50px; position:relative; transition: font .5s; -webkit-transition: font .5s;}
.side.youth .sidename{ top:24%; right:18%;}
.side.youth .sidename h3{}
.side.youth h3:before{
	content: " ";
	position: absolute;
	z-index: -1;
	top: -50%;
	left: -25px;
	height:150%;
	border: 1px solid #fff;
	-ms-transform: rotate(26deg);
    -webkit-transform: rotate(26deg);
    transform: rotate(26deg);
}
.side.mothercare .sidename{ bottom:20%; left:18%;}
.side.mothercare .sidename h3{}
.side.mothercare h3:before{
	content: " ";
	position: absolute;
	z-index: -1;
	top:-20%;
	right:-15px;
	height:150%;
	border: 1px solid #fff;
	-ms-transform: rotate(26deg);
    -webkit-transform: rotate(26deg);
    transform: rotate(26deg);
}
#loader-container{ position:fixed; width:100%; height:100%; top:0; left:0; z-index:200; background:#fdeddf;}
#loader-container .gif{ position:absolute; width:100%; height:100%; top:0; left:0; background:url('../img/loader.gif') center center no-repeat #fdeddf;}
#loader-container .opening-gif{ position:absolute; width:100%; height:100%; top:0; left:0; background:url('../img/opening.gif') center center no-repeat;}
#loader{ max-width:100%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
#landingContent .center-logo{ position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); text-align:center;}
#landingContent .center-logo .icon-hexagonal{ font-size:310px; display:block;}
#landingContent .center-logo .icon-logo{ font-size:150px; display:block;}
.svg-container{ position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
#landingContent .center-logo svg{ width:100%; height:100%;}
#header{ position:relative; background:rgba(255,255,255,0.9); width:100%; top:0; left:0; z-index:99;}
.ifMobile #header, .freeyourskin #header, .mothercare #header{ position:fixed;}
#header .icon-skinvitals_logo{ font-size:48px; transition: font .5s; -webkit-transition: font .5s;}
#header a{ display:inline-block;}
#header .choose-category{ margin:0 0 0 35px; font-size:16px; position:relative; vertical-align:top; display:inline-block; transition:color .5s, background .5s; -webkit-transition:color .5s, background .5s;}
#header .choose-category:hover{ color:#fff;}
#header .choose-category h2{ line-height:70px; transition: line-height .5s; -webkit-transition: line-height .5s; padding:0 20px; cursor:pointer;}
#header .choose-category:before {
	content: " ";
	position: absolute;
	z-index: -1;
	top: 50%;
	left: -10px;
	margin-top:-10px;
	height:17px;
	border-left: 1px solid;
}
#header .hc{ height:70px; transition: height .5s; -webkit-transition: height .5s;}
#header.collapse .hc{ height:50px;}
#header.collapse .icon-skinvitals_logo{ font-size:37px;}
#header.collapse .choose-category{}
#header.collapse .choose-category h2{ line-height:50px;}

#category-menu{ position:fixed; top:70px; width:100%; left:0; visibility:hidden;opacity:0;filter: alpha(opacity=0);transition:visibility 0s linear .5s, opacity .5s,top .5s;-webkit-transition:visibility 0s linear .5s, opacity .5s, top .5s;}
.collapse #category-menu{ top:50px;}
.choose-category:hover #category-menu{ visibility:visible; opacity:1; transition-delay:0s;}
#category-menu ul{ margin-left:165px; padding:10px 0; transition:margin .5s; -webkit-transition:margin .5s;}
.collapse #category-menu ul{ margin-left:138px;}
#category-menu li{ display:inline-block; border-left:1px solid #fff; padding:0 16px; text-transform:uppercase;}
#category-menu li:first-child{ border:none;}
#category-menu a{ color:#fff; font-size:25px; line-height:0.8; display:inline-block;}
#category-menu a.active{ border-bottom:1px solid #fff;}

#menu{ display:inline-block; font-size:22px; vertical-align:top;}
#menu li{ display:inline-block; margin:0 10px;}
#menu a{ display:inline-block; text-transform:uppercase; border-bottom:3px solid transparent; padding-top:3px;}
#menu a.current{}
#header .mobilemenu-trigger{ display:none; font-size:26px;}
#header .leftcol{ height:100%;}
#mobilemenu{ position:absolute; right:0; top:100%; width:70%; background:rgba(255,255,255,0.9); border-top:1px solid; text-align:right; font-size:22px; display:none; -webkit-overflow-scrolling: touch;}
#mobilemenu li{ border-bottom:1px solid;}
#mobilemenu li.lang{ padding:0 30px;}
#mobilemenu a{ display:block; line-height:60px; padding:0 30px; text-transform:uppercase;}
#mobilemenu .lang a{ display:inline-block; padding:0;}
#mobilemenu li.subcat{ padding:0 30px;}
#mobilemenu .subcat a{ display:inline-block; padding:0 0 0 15px; margin:0 0 0 15px; position:relative;}
#mobilemenu .subcat a:first-child{ padding:0; margin:0;}
#mobilemenu .subcat a:last-child:before{
	content: " ";
	position: absolute;
	z-index: -1;
	top: 50%;
	left: 0;
	margin-top:-10px;
	height:17px;
	border-left: 1px solid;
	z-index:1;
}
#mobilemenu .subcat span{ display:inline-block; line-height:1;}
#mobilemenu .subcat a.active span{ border-bottom:1px solid;}
.engr{ /*font-family:ENGR;*/}
#content{}
#content .section{}
.h100{ height:100vh;}
#content .banner{ position:relative; height:100vh;}
.svg-ani{ position:absolute; width:570px; max-width:100%; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}
svg{ max-width:100%;}
.vertical-a-mid{
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
}
.standard-tab{ width:45px; position:fixed; left:60px; top:50%; transform: translateY(-50%); z-index:10; transition: left .5s; -webkit-transition: left .5s;}
.standard-tab li{ margin:10px 0; transition: margin .5s; -webkit-transition: margin .5s;}
.standard-tab a{ display:block; width:60%; height:2px; transition: height .5s, width .5s; -webkit-transition: margin .5s, width .5s; text-indent:-9999px;}
.standard-tab:hover li{ margin:15px 0;}
.standard-tab a:hover, .standard-tab a.current{ width:100%;}
.standard-tab:hover a{ height:8px;}
.imgbanner-container{ position:relative; height:100%;}
.imgbanner-container .bimg{ background-size:cover; background-repeat:no-repeat; background-position:center center; height:100%;}
.imgbanner-container .bimg.mb{ display:none;}
.imgbanner-container .bimg.b1{ background-image:url('../img/banner_youth.jpg'); background-position:right center;}
.imgbanner-container .bimg.b1.mb{ background-image:url('../img/banner_youth_portrait.jpg'); background-position:right center;}
.imgbanner-container .bimg.b2{ background-image:url('../img/banner_mothercare.jpg'); background-position:right center;}
.imgbanner-container .bimg.b2.mb{ background-image:url('../img/banner_mothercare.jpg'); background-position:right center;}
.scrolldown-arrow{ width:20px; height:40px; display:block; position:absolute; left:50%; bottom:45px; margin-left:-13px; background:url('../img/scrolldown.svg') left top no-repeat; background-size:100% 100%; animation:arrowAnim 1.2s ease-in-out; -moz-animation:arrowAnim 1.2s ease-in-out infinite; -webkit-animation:arrowAnim 1.2s ease-in-out infinite;}

@-moz-keyframes arrowAnim{
0%, 25%{ bottom:45px;}
50%  { bottom:10px;}
75%,100%{ bottom:45px;}
}
@-webkit-keyframes arrowAnim{
0%, 25%{ bottom:45px;}
50%  { bottom:10px;}
75%,100%{ bottom:45px;}
}

#content .story{ text-align:center; background:url('../img/story_bg.jpg') center center no-repeat; background-size:cover;}
#content .story p{ margin:5px 0;}
#content .story .truetext{ margin-top:20px;}
#content .story .icon-yourprivateformula_logo{ font-size:300px;}
.textcol{ width:50%; border-left:1px solid; padding-left:2%; margin-left:2%;}
.textcol:first-child{ width:48%; padding-left:0; margin-left:0; border:none;}
.yourprivateformula-logo{ margin-bottom:20px;}
#content .story .tc{ padding-top:60px; padding-bottom:60px;}
#content .story strong{ font-family: 'Scheherazade', serif; display:block; text-align:left; text-transform:uppercase; font-size:24px;}
.care-detail{ position:relative; padding:10px 0 0 50px; margin-top:20px;}
.care-detail:first-child{ margin-top:0;}
.care-detail .lb{ position:absolute; left:0; top:0;}
.care-detail .lb .icon-hexagonal_fill{ font-size:48px;}
.care-detail .lb .lbt{ font-family:ENGR; position:absolute; width:100%; left:0; top:0; pointer-events: none; font-size:25px; color:#fff; line-height:45px;}

#content .products{}
#content .products .product{ position:relative; background:url('../img/marble_bg.jpg'); text-align:center; overflow:hidden;}
#content .product .product-name{ position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); color:#fff; /*height:375px;*/ z-index:5; opacity: 0; filter: alpha(opacity=0);}
#content .product .product-name .product-dialog{ display:block; /*height:375px;*/}
#content .product .product-name .icon-hexagonal_fill{ font-size:400px; color:#b9876c; opacity: 0.7; filter: alpha(opacity=70);}
#content .product h4{ position:absolute; width:100%; left:0; top:50%; transform: translate(0, -50%); -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); padding:10px; text-align:center; opacity: 0; filter: alpha(opacity=0);}
#content .product h4 span{ font-size:52px;}
#content .product .product-img, #content .product .dec{ height:100%;}
#content .product .product-img img{ position:relative; z-index:3; max-height:80%; max-width:80%;}
#content .product .product-img{ background-size:cover; background-position:center center; transition: transform 1s; -webkit-transition: transform 1s;}
#content .product:hover .product-img{ transform:scale(1.02);}
#content .product .dec:before, #content .product .dec:after{
	content: " ";
	position: absolute;
	z-index: 1;
	background:#FFDCDF;
}
#content .product .dec1:before {
	bottom: -65%;
	left: 16%;
	width:100%;
	height:100%;
	-ms-transform: rotate(-7deg);
    -webkit-transform: rotate(-7deg);
    transform: rotate(-7deg);
}
#content .product .dec2:before {
	top: 5%;
	left: -56%;
	width:100%;
	height:100%;
	-ms-transform: rotate(30deg);
    -webkit-transform: rotate(30deg);
    transform: rotate(30deg);
}
#content .product .dec2:after {
	top: 5%;
	right: -56%;
	width:100%;
	height:100%;
	-ms-transform: rotate(-150deg);
    -webkit-transform: rotate(-150deg);
    transform: rotate(-150deg);
}
#content .product .dec3:before {
	top: 50%;
	left: 0;
	width:100%;
	height:50%;
}
#content .product .dec4:before {
	top: 45%;
	left: 50%;
	width:120%;
	height:100%;
	margin-left:-60%;
	transform-origin:50% 0;
	-webkit-transform-origin:50% 0;
	-ms-transform-origin:50% 0;
	-ms-transform: rotate(15deg);
    -webkit-transform: rotate(15deg);
    transform: rotate(15deg);
}
#content .product .dec5:before {
	top: 10%;
	right: 15%;
	width:100%;
	height:100%;
	transform-origin:100% 0;
	-webkit-transform-origin:100% 0;
	-ms-transform-origin:100% 0;
	-ms-transform: rotate(-21deg);
    -webkit-transform: rotate(-21deg);
    transform: rotate(-21deg);
}
#content .product .dec6:before {
	top:-270px;
	left:-250px;
	width:500px;
	height:500px;
	transform-origin:100% 100%;
	-webkit-transform-origin:100% 100%;
	-ms-transform-origin:100% 100%;
	-ms-transform: rotate(35deg);
    -webkit-transform: rotate(35deg);
    transform: rotate(35deg);
}
#content .product .dec6:after {
	bottom:-425px;
	right:-240px;
	width:500px;
	height:500px;
	transform-origin:0 0;
	-webkit-transform-origin:0 0;
	-ms-transform-origin:0 0;
	-ms-transform: rotate(-55deg);
    -webkit-transform: rotate(-55deg);
    transform: rotate(-55deg);
}
#content .product .dec6additional:before {
	top:56px;
	left:37%;
	width:700px;
	height:700px;
	transform-origin:0 0;
	-webkit-transform-origin:0 0;
	-ms-transform-origin:0 0;
	-ms-transform: rotate(35deg);
    -webkit-transform: rotate(35deg);
    transform: rotate(35deg);
}
#content .product.p1{ background-position:left top;}
#content .product.p2{ background-position:right top;}
#content .news-summary{ background:url('../img/story_bg.jpg') center center no-repeat; background-size:cover; text-align:center;}
.ns-container{ width:895px; background:rgba(185,135,108, 0.4); padding-top:40px; padding-bottom:40px;}
.ns-container .center{ width:570px; padding:0;}
.ns-container .tc{ margin-top:20px; color:#fff;}
.ns-container .newsbanner{ margin-bottom:20px;}
#newsbanner{ max-width:100%;}
.ns-container p{ text-align:justify; margin:5px 0;}
.btn{ line-height:28px; padding:0 30px; color:#fff; display:inline-block; position:relative; text-transform:uppercase;}
.btn:before, .btn:after {
    border-right: 2px solid;
    content: '';
    display: block;
    height: 8px;
    margin-top: -8px;
    position: absolute;
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
    right: 20px;
    top: 50%;
    width: 0;
}
.btn:after {
    margin-top: -3px;
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.ns-container .btn{ background:#fff; margin-top:25px; font-size:20px;}
.ns-container .news-c{ margin-top:20px;}
.news-c a{}
.contactus{ background:url('../img/contactus_bg.jpg') center center no-repeat; background-size:cover; text-align:center; position:relative;}
.contactus .fb-bar{ color:#fff; font-size:25px; padding:8px 0; text-align:center; position:absolute; width:100%; top:0; left:0; z-index:10; transition: font .5s; -webkit-transition: font .5s;}
.contactus .fb-bar.sticky{ position:fixed; top:50px;}
.fb-icon{ width:47px; height:45px; display:inline-block; background:url('../img/fb-icon.png') left top no-repeat; vertical-align:middle; margin-left:10px; background-size:100% 100%; transition: width .5s, height .5s; -webkit-transition: width .5s, height .5s;}
.contactus .contactform{ float:right; width:50%; max-width:100%; margin:30px auto 0; text-align:left;}
.contactus .name-row{}
.contactus .textfield, .contactus .textarea{ background:#fff; padding:5px; border:1px solid transparent; line-height:40px; height:40px; width:100%; font-size:21px; font-family:inherit; transition: border 1s; -webkit-transition: border 1s;}
.textfield:focus, .textarea:focus{ border-color:#000;}
.textfield.error, .textarea.error{ border-color:red;}
.contactus .name-row .textfield{ width:270px; float:left;}
.contactus .textarea{ height:180px; line-height:inherit;}
.radio-checkbox input[type="checkbox"], .radio-checkbox input[type="radio"]{ width:20px; margin:0; padding:0; opacity:0; filter: alpha(opacity=0);}
.radio-checkbox input[type="checkbox"] + label, .radio-checkbox input[type="radio"] + label{ display:inline-block; line-height:24px; margin-left:-25px; padding-left:28px; background:url('../img/checkbox_style_bg.png') left top no-repeat;}
.radio-checkbox input[type="checkbox"]:checked + label, .radio-checkbox input[type="radio"]:checked + label{ background-position:left -24px;}
.radio-checkbox .rc{ margin:0 5px 0 10px; display:inline-block;}
.radio-checkbox .l.error{ color:red;}
.contactus .gender{ margin:6px 0 0 30px;}
.contactus .rcc{ display:inline-block;}
.contactus .r{ margin:18px 0;}
.contactus .r:first-child{ margin-top:0;}
.submit-btn{ line-height:28px; padding:0 30px; color:#fff; display:inline-block; border:none; font-size:21px; cursor:pointer; -webkit-appearance: none; -moz-appearance:none; appearance:none;}
.msg-sent{ display:none;}
.contactus .ajaxloader{ position:static; width:16px; height:16px; background-color:none;}
.font10{ font-size:10px; -webkit-transform:scale(0.83); display:inline-block;}
.font11{ font-size:11px; -webkit-transform:scale(0.91); display:inline-block;}
.contactus .tc{ padding-top:60px; padding-bottom:60px;}

#footer{ padding:20px 0 30px; color:#603813;}
#footer .copyright, #footer .quicklink{}
#footer .copyright span, #footer .copyright a{ display:inline-block; line-height:12px; vertical-align:top;}
#footer .copyright .font11{ -webkit-margin-start:-15px;}
#footer .quicklink .font11{ -webkit-margin-start:-11px;}
#footer .terms, #footer .policy{ padding-left:10px; margin-left:10px; border-left:1px solid #603813;}
#footer .ql ul{ font-size:0;}
#footer .ql li{ font-size:15px; margin-left:10px; padding-left:10px; border-left:1px solid #603813; display:inline-block; text-transform:uppercase; line-height:12px;}
#footer .ql li:first-child{ margin:0; padding:0; border:none; }
#footer .icons{ clear:both; font-size:80px; margin-top:25px;}
#footer .icons li{ display:inline-block;}
#footer .icons a{ display:block;}
/*#footer .icons .sn-logo{ font-size:90px;}*/

#news-inner{}
.innerpage{ background:url('../img/story_bg.jpg') center center no-repeat; background-size:cover;}
.pageTitle{ text-transform:uppercase; text-align:center; margin-bottom:22px;}
.innerpage{ padding:50px 0;}
#news-inner .nc{}
#news-inner .n-selector{ width:270px; max-width:100%;}
#news-inner .n-selector .pager-content{ position:relative; min-height:300px;}
#news-inner .n-listing{ font-size:0;}
#news-inner .n-listing li{ font-size:15px; padding:3px 0; display:inline-block; width:100%;}
#news-inner .n-listing li:first-child{ border:none;}
.othernews-label{ font-size:25px; text-transform:uppercase;}
.n-thumbnail{ width:40px; overflow:hidden;}
.n-thumbnail img{ width:100%; max-height:100%;}
.n-overview{ margin-left:10px; max-width:215px;}
.n-overview h4{ font-size:20px; line-height:1;}
.n-overview span{ font-size:13px;}
.s-pager{ font-size:20px; text-align:center; margin-top:10px;}
.s-pager li{ display:inline-block; position:relative; line-height:30px;}
.s-pager li:before{
	border-radius:50%;
    content: '';
    display: block;
    height: 5px;
    margin-top: -3px;
    position: absolute;
    left: -3px;
    top: 50%;
    width: 5px;
}
.s-pager li:nth-child(2):before, .s-pager li:nth-child(3):before, .s-pager li:last-child:before{content: none;}
.s-pager li.sample{ display:none;}
.s-pager a{ padding:0 10px; vertical-align: middle; display:inline-block;}
.s-pager .currentpage{ font-size:28px; font-weight:bold;}
.s-pager .prevpage, .s-pager .nextpage{ padding:0;}
.n-content{ width:885px; max-width:100%; font-size:15px; margin-right:-15px; position:relative;}
.n-content img{ max-width:100%;}
.n-wrap{ width:100%; height:500px; overflow:auto;}
.n-info{ max-width:250px; padding-left:5px;}
.n-info .n-title{ font-size:30px;}
.n-info .n-update{}
.n-texting{ width:570px; max-width:100%; margin-right:25px;}
.n-info, .n-texting{ margin-top:15px;}
.newsbanner{ text-align:center;}
.jspVerticalBar{ width:8px;}
.jspDrag{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.jspTrack, .jspVerticalBar{ background:none;}
.n-content .control-bar{ border-top:1px solid; margin:15px 0 0; padding:3px 0 0;}
.dis-intro{ width:585px; max-width:100%; margin-left:auto; margin-right:auto;}
.dis-list{ text-align:center; margin-top:50px;}
.dis-list .distributor-blk{ display:inline-block; position:relative; margin:0 28px; background:url('../img/shop_hex_bg.png') left top no-repeat; background-size:100% 100%; width:160px; height:184px; vertical-align:top;}
.dis-list .distributor-blk .icon-hexagonal_fill{ font-size:200px;}
.dis-list .distributor-blk .logo{ position:absolute; width:100%; color:#fff; font-size:180px;}
.ajaxloader{ position:absolute; left:0; top:0; z-index:5; width:100%; height:100%; background:url('../img/ajaxloader.gif') center center no-repeat rgba(255,255,255,0.8);}

@-webkit-keyframes bounce{
  0%{
		/*transform: translateY(20px);*/
		transform: matrix(1, 0, 0, 1, 0, 20);
		opacity:0;
	}
	90% {
		transform: matrix(1, 0, 0, 1, 0, -2);
	}
	100%{
		transform: matrix(1, 0, 0, 1, 0, 0);
		opacity:1;
	}
}
@keyframes bounce{
	0%{
		/*transform: translateY(20px);*/
		transform: matrix(1, 0, 0, 1, 0, 20);
		opacity:0;
	}
	90% {
		transform: matrix(1, 0, 0, 1, 0, -2);
	}
	100%{
		transform: matrix(1, 0, 0, 1, 0, 0);
		opacity:1;
	}
}
.goBounce {
-webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  animation-iteration-count: 1;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-name: bounce;
  animation-name: bounce;
}

#product-detail-overlay{ background:url('../img/marble_bg.jpg') right top no-repeat;}
.product-overlay-container{ position:fixed; width:100%; height:100%; left:0; top:0; z-index:101; display:none; background:url('../img/loader.gif') center center no-repeat #fff; overflow:auto;}
#product-detail-overlay .product-intro{ width:270px;}
#product-detail-overlay .p-thumbnail{ text-align:center;}
#product-detail-overlay .p-thumbnail .p-a{ width:130px; height:140px; margin-top:-18px; display:block; position:relative; text-align:center; color:#999999; transition: color .5s; -webkit-transition: color .5s;}
#product-detail-overlay .p-thumbnail .p-a.current, #product-detail-overlay .p-thumbnail .p-a:hover{ color:inherit;}
#product-detail-overlay .p-thumbnail .p-a:first-child{ margin-top:0;}
#product-detail-overlay .p-thumbnail .p-a:nth-child(odd){ margin-left:65px;}
#product-detail-overlay .p-thumbnail .icon-hexagonal{ font-size:150px;}
#product-detail-overlay .p-thumbnail img{ position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); max-height:70%; max-width:40%; -webkit-filter: grayscale(1); filter: grayscale(1); transition: all .5s; -webkit-transition: all .5s;}
#product-detail-overlay .p-thumbnail .p-a.current img, #product-detail-overlay .p-thumbnail .p-a:hover img{ -webkit-filter:none; filter: none;}
#product-detail-overlay .product-detail{ width:300px; height:550px; position:relative;}
#product-detail-overlay .product-detail .p-container{ position:absolute; left:0; top:0; width:100%; display:none;}
#product-detail-overlay .head-s{ height:100px;}
#product-detail-overlay .head-s h4{ font-size:35px; float:left; width:270px;}
.close-x{ width:21px; height:20px; display:block; background:url('../img/close_x_btn.png') left top no-repeat;}
#product-detail-overlay .p-info{ padding:0 15px;}
#product-detail-overlay .p-info h4{ font-size:32px;}
#product-detail-overlay .capacity{ margin:5px 0;}
#product-detail-overlay .more-d{ margin-top:38px;}
#product-detail-overlay .more-d .category{ padding:0 15px;}
#product-detail-overlay .more-d .category ul{ font-size:0;}
#product-detail-overlay .more-d .category li{ font-size:18px; display:inline-block; padding:0 0 0 8px; margin:0 0 0 8px; text-transform:uppercase; position:relative;}
#product-detail-overlay .more-d .category li:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height:80%;
	border-left: 1px solid;
}
#product-detail-overlay .more-d .category li:first-child{ padding:0; margin:0;}
#product-detail-overlay .more-d .category li:first-child:before{ border:none;}
#product-detail-overlay .more-d .category a{ display:inline-block; opacity: 0.7; filter: alpha(opacity=70);}
#product-detail-overlay .more-d .category a:hover, #product-detail-overlay .more-d .category a.active{ opacity: 1; filter: alpha(opacity=100);}
#product-detail-overlay .more-d-container{ margin-top:10px; position:relative; height:330px;}
#product-detail-overlay .more-d-tab{ position:absolute; left:0; top:0; width:100%; background:#f8e7df; padding:15px; height:330px; display:none; font-size:13px; line-height:1.2;}
#product-detail-overlay .more-d-tab:first-child{ display:block;}
#product-detail-overlay .more-d-tab .icon{}
#product-detail-overlay .center{ padding-top:30px; padding-bottom:30px; min-height:100vh; position:relative;}
#product-detail-overlay .big-product-show{ position:absolute; height:70%; margin:0 320px 0 290px; left:0; right:0;}
#product-detail-overlay .big-product-show img{ max-height:100%; max-width:100%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%);}

.innerpage.st-text strong{ font-family: 'Scheherazade', serif; display:block; text-align:left; text-transform:uppercase; font-size:24px; margin-top:30px;}
.innerpage.st-text strong:first-child{ margin-top:0;}
.bulletpoint li{ display:block; background:url('../img/bullet.jpg') left 6px no-repeat; padding-left:10px; margin:5px 0;}