@charset "utf-8";
.container, html { -webkit-text-size-adjust: 100% }
body, cite, em, i { font-family: Arial, Helvetica, sans-serif }
#search-page .search-list p a, cite, em, i, mark, sup { vertical-align: baseline }
a, cite, code, dd, dl dt, em, i, ins, mark, p, pre, strong, sup { text-decoration: none }
.container, .overlay-menu, .search-form, body, svg:not(:root) { overflow: hidden }
.hotline a, .nav li a h1, .nav li:after, a.language, cite, em, h1, h2, h3, h4, h5, h6, i, p, strong, sup { font-weight: 400 }
#product-detail-page .title-right h2, #product-detail-page .title-right p, #search-page .search-list h3, #search-page .search-list p a, .about-info h2, .agent-details h3, .agent-head h2, .agent-search span, .album-pic-center .pic-name h3, .bg-title h2, .block h2, .block-pro-title h2, .block-pro-title span, .btn-back, .caption, .column-name h2, .column:nth-child(3) p, .copyright, .detail-text h3, .detail-text h4, .fengshui-cate li a, .fengshui-title h2 a, .footer-nav li a h1, .house-title h2, .link-agent, .link-detail, .name, .nav li a h1, .nav-click:after, .news-cate a, .page-num span, .pro-link, .pro-text p, .product-text h3, .product-title h2, .product-title h3, .sub-name, .sub-nav li a, .title-left h2, .title-left p, .title-right h2, .title-right p, a.language, input[type=button], input[type=reset], table.agent td.t-name { text-transform: uppercase }
.all-album, .all-pics .text-length, .dragscroll, .full2 img, .overlay-menu, .slide-slidebox, .slider-home, .slider-inner { -webkit-user-select: none }
.search, .social li a, a.link-home { text-indent: -9999px }
@font-face { font-family: avantgarde; src: url(../fonts/avantg.eot); src: url(../fonts/avantgd41d.eot?#iefix)format('embedded-opentype'), url(../fonts/avantg.woff)format('woff'), url(../fonts/avantg.ttf)format('truetype'), url(../fonts/avantg.svg#avantgarde)format('svg'); font-weight: 400; font-style: normal }
@font-face { font-family: avantgarde-demi; src: url(../fonts/avantgdemi.eot); src: url(../fonts/avantgdemid41d.eot?#iefix)format('embedded-opentype'), url(../fonts/avantgdemi.woff)format('woff'), url(../fonts/avantgdemi.ttf)format('truetype'), url(../fonts/avantgdemi.svg#avantgarde-demi)format('svg'); font-weight: 400; font-style: normal }
@font-face { font-family: MyriadLight; src: url(../fonts/myriadpro-light.eot); src: url(../fonts/myriadpro-lightd41d.eot?#iefix)format('embedded-opentype'), url(../fonts/myriadpro-light.woff)format('woff'), url(../fonts/myriadpro-light.ttf)format('truetype'), url(../fonts/myriadpro-light.svg#MyriadLight)format('svg'); font-weight: 400; font-style: normal }
@font-face { font-family: MyriadBold; src: url(../fonts/myriadpro-semibold.eot); src: url(../fonts/myriadpro-semiboldd41d.eot?#iefix)format('embedded-opentype'), url(../fonts/myriadpro-semibold.woff)format('woff'), url(../fonts/myriadpro-semibold.ttf)format('truetype'), url(../fonts/myriadpro-semibold.svg#MyriadBold)format('svg'); font-weight: 400; font-style: normal }
@font-face { font-family: MyriadCondensed; src: url(../fonts/myriadpro-cond.eot); src: url(../fonts/myriadpro-condd41d.eot?#iefix)format('embedded-opentype'), url(../fonts/myriadpro-cond.woff)format('woff'), url(../fonts/myriadpro-cond.ttf)format('truetype'), url(../fonts/myriadpro-cond.svg#MyriadCondensed)format('svg'); font-weight: 400; font-style: normal }
@font-face { font-family: MyriadRegular; src: url(../fonts/myriadpro-regular.eot); src: url(../fonts/myriadpro-regulard41d.eot?#iefix)format('embedded-opentype'), url(../fonts/myriadpro-regular.woff)format('woff'), url(../fonts/myriadpro-regular.ttf)format('truetype'), url(../fonts/myriadpro-regular.svg#MyriadRegular)format('svg'); font-weight: 400; font-style: normal }
@font-face { font-family: Futurab; src: url(../fonts/futurab.eot); src: url(../fonts/futurabd41d.eot?#iefix)format('embedded-opentype'), url(../fonts/futurab.woff)format('woff'), url(../fonts/futurab.ttf)format('truetype'), url(../fonts/futurab.svg#Futurab)format('svg'); font-weight: 400; font-style: normal }
@font-face { font-family: Futurab-bold; src: url(../fonts/futurab-bold.eot); src: url(../fonts/futurab-boldd41d.eot?#iefix)format('embedded-opentype'), url(../fonts/futurab-bold.woff)format('woff'), url(../fonts/futurab-bold.ttf)format('truetype'), url(../fonts/futurab-bold.svg#Futurab-bold)format('svg'); font-weight: 400; font-style: normal }
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video { margin: 0; padding: 0; border: 0; vertical-align: baseline }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block }
body { background-color: #f4f0e4; margin: 0; left: 0; top: 0; right: 0; bottom: 0; padding: 0; line-height: 1 }
* { -webkit-font-smoothing: antialiased }
*, :after, :before { box-sizing: border-box }
*, .clearfix:after, .clearfix:before, :after, :before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box }
iframe[name=google_conversion_frame] { position: absolute; bottom: 0; z-index: -9999; width: 0; height: 0; overflow: hidden }
ol, ul { list-style: none }
blockquote, q { quotes: none }
blockquote:after, blockquote:before, q:after, q:before { content: ''; content: none }
:focus { outline: 0; border: none }
a { color: #f2b819 }
p { font-size: 100%; -webkit-text-size-adjust: none }
strong { font-family: MyriadBold }
cite, em, i { line-height: 1; font-style: italic }
sup { bottom: 5px; font-size: 70%; position: relative }
mark { font-weight: 400 }
.column, .nav, a.link-home { vertical-align: middle }
del { text-decoration: line-through }
.btn:hover { background-position: bottom }
img[alt] { font-size: 0 }
.clear { clear: both }
.clearfix:after, .clearfix:before { content: " "; display: table; box-sizing: border-box }
.clearfix:after { clear: both }
.nicescroll-rails { cursor: pointer!important; margin-left: 6px }
.loadicon { background: url(../images/load.png)center center no-repeat; position: fixed; top: 50%; left: 50%; z-index: 110000; width: 60px; height: 60px; margin: -30px 0 0 -30px; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; animation: Rotate 2s linear infinite; -webkit-animation: Rotate 2s linear infinite }
.loadicon span.circle { border: 3px solid rgba(247,211,109,.5); width: 120px; height: 120px; position: absolute; left: 50%; top: 50%; margin: -60px 0 0 -60px; border-radius: 50%; box-shadow: 0 0 20px rgba(255,255,255,.5); animation: Ani 1s infinite }
.loadicon span.circle, .loadx span.circle { -webkit-border-radius: 50%; -webkit-animation: Ani 1s infinite }
.loadx { background: url(../images/ajaxloader.gif)center center no-repeat; position: fixed; top: 0; left: 0; z-index: 110000; width: 100%; height: 100%; margin: 0 }
.loadx span.circle { border: 3px solid rgba(247,211,109,.5); width: 120px; height: 120px; position: absolute; left: 50%; top: 50%; margin: -60px 0 0 -60px; border-radius: 50%; box-shadow: 0 0 20px rgba(255,255,255,.5); animation: Ani 1s infinite }
.header { width: 100%; height: 83px; position: fixed; left: 0; top: 0; z-index: 20; background: url(../images/line.png)right top no-repeat; background-color: #efefef; /*rgba(0,25,62,1);*/ transition: background-color .5s ease-in-out; -webkit-transition: background-color .5s ease-in-out; box-shadow: 0 0 5px #ccc;}
.header.off { background-color: #efefef;/*rgba(0,25,62,.5)*/ }
.top { position: absolute; left: 210px; top: 0; width: calc(100% - 210px); height: 100%; z-index: 200 }
.logo, .logo span { width: 210px; height: 83px }
.logo { position: fixed; top: 0; left: 0; z-index: 100; cursor: pointer; margin: 0 ; display: none !important;}
.logomain{width: 250px; height: 83px; position: fixed; top: 10px; left: 0; z-index: 100; cursor: pointer; margin: 0 ;}
.logomain img{width: 250px; height: 83px;}
.facilities-nav, .form-row-search, .logo span, .navigation, .search, .search-form, a.language { position: absolute }
.logo span { left: 0; top: 0; opacity: 1 }
.l-01 { background: url(../images/logo_01.svg)center center no-repeat }
.l-02 { background: url(../images/logo_02.svg)center center no-repeat }
.l-03 { background: url(../images/logo_03.svg)center center no-repeat }
.l-04 { background: url(../images/logo_04.svg)center center no-repeat }
.l-05 { background: url(../images/logo_05.svg)center center no-repeat }
.l-06 { background: url(../images/logo_06.svg)center center no-repeat }
#home-page .logo span { opacity: 0 }
#home-page .logo.auto-play span, .search { opacity: 1 }
.logo.auto-play { -webkit-animation: Zoom 1s ease-out; animation: Zoom 1s ease-out }
.anilog { -webkit-animation: Opacity 1s ease-in-out; animation: Opacity 1s ease-in-out }
.logo:hover { animation: none; -webkit-animation: none }
.navigation { width: calc(100% - 512px); height: 100%; text-align: center; line-height: 83px; left: 0; top: 0 }
a.link-home { width: 43px; height: 44px; display: inline-block; background: url(../images/home.png)center top no-repeat; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out }
a.link-home.current, a.link-home:not(.current):hover { background-position: center bottom }
.nav, .nav li { display: inline-block; cursor: pointer; }
.nav li:after { content: '/'; color: #3e4095; font-family: avantgarde-demi; font-size: 15px }
.nav li:last-child:after { content: '' }
.nav li a { display: inline-block ;cursor: pointer; }
.nav li a h1 {cursor: pointer; padding: 0 24px; font-family: avantgarde; font-size: 15px; font-weight: bold; color: #3e4095; -webkit-transition: all .3s ease-in-out }
.nav li a h1 label{cursor: pointer !important;}
.nav li a h1, .search { transition: all .3s ease-in-out }
.nav li.current a h1, .nav li:not(.current) a:hover h1 { color: #f2b819 }
.nav li.current, .nav li.current a { pointer-events: none }
.nav li.current:nth-child(3), .nav li.current:nth-child(3) a, .nav li.current:nth-child(4), .nav li.current:nth-child(4) a { pointer-events: auto }
.facilities-nav { width: 130px; height: 83px; right: 0; top: 0 }
.search { top: 22px; right: 40px; width: 39px; height: 39px; border-radius: 50%; -webkit-border-radius: 50%; background-color: #3e4095; display: inline-block; background-image: url(../images/icon_search.png); background-repeat: no-repeat; background-position: center center; -webkit-transition: all .3s ease-in-out }
.search:hover { opacity: .5 }
.search-form { background-color: #3e4095; width: 0; height: 44px; right: 90px; top: 21px; z-index: 100; display: block; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-border-radius: 30px; border-radius: 30px; border: 1px solid rgba(220,220,220,1); opacity: 0; box-shadow: 5px 5px 0 rgba(0,0,0,.1) }
.form-row-search { width: 100%; height: 44px; top: 0; left: 0 }
.form-row-search input[type=text] { border: none; background: 0 0; width: 100%; height: 42px; padding: 0 10px; font-family: Arial, Helvetica, sans-serif; font-size: 16px; color: #333; line-height: 42px; position: absolute; display: block; opacity: .7; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-border-radius: 20px 0 20px 20px; border-radius: 20px 0 20px 20px }
.hotline a, a.language { font-family: Futurab-bold }
.form-row-search input[type=text]:focus { opacity: 1 }
a.language { top: 22px; right: 20px; width: 39px; height: 39px; border-radius: 50%; -webkit-border-radius: 50%; background-color: #f2b819; font-size: 14px; line-height: 39px; text-align: center; color: #fff; text-shadow: 4px 4px rgba(0,0,0,.1); -webkit-transition: all .3s ease-in-out; opacity: 1 }
.hotline a, a.language { transition: all .3s ease-in-out }
a.language:hover { opacity: .5 }
#change_lang { display: none }
.hotline { position: fixed; top: 25px; right: 130px; z-index: 100; height: 33px; background: url(../images/icon-call.png)left top no-repeat; padding-left: 40px }
.hotline.hide { z-index: -1 }
.hotline a { font-size: 18px; color: #3e4095; line-height: 20px; display: block; -webkit-transition: all .3s ease-in-out }
.hotline a:hover { color: #f2b819 }
.hotline span {display: none !important; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 14px; font-weight: 700; display: block; text-align: left; margin: 0 5px; color: #fff }
.nav-click:after, .social { width: 100%; height: auto; text-align: center }
.nav-click { background: url(../images/nav-click.png)center top no-repeat; width: 60px; height: 48px; right: 30px; top: 10px; position: fixed; cursor: pointer; display: none; opacity: 0; z-index: 600; -webkit-transition: all .3s ease 0s; transition: all .3s ease 0s }
.nav-click.active { background-position: center bottom }
.nav-click:after { content: 'menu'; display: block; position: absolute; bottom: 0; color: #fff; font-size: 14px; font-family: MyriadCondensed; font-weight: 400 }
.column:nth-child(3) a, .column:nth-child(3) p { font-family: MyriadRegular }
.container, .content-page, .copyright, .footer-nav, .social { position: relative }
#product-detail-page .title-right:after, #product-detail-page .title-right:before, .about-box.company .detail-box:after, .about-box.company .detail-box:before, .about-box.expo .detail-text:after, .about-box.expo .detail-text:before, .about-box.oexpo .detail-text:after, .about-box.oexpo .detail-text:before, .agent-head:after, .album-pic-center:after, .album-pic-center:before, .block-news:after, .block-news:before, .block:after, .block:before, .expo .product-note:after, .expo .product-note:before, .expo-oil .product-note:after, .expo-oil .product-note:before, .oexpo .product-note:after, .oexpo .product-note:before, .title-left:after, .title-left:before, .title-right h2:before, .title-right:after, .title-right:before { content: '' }
.nav-click.active:after { color: #f2b819 }
.social { background-color: #fff; padding: 12px 0; box-shadow: 0 3px 10px rgba(0,0,0,.2) }
.column { display: inline-block; padding: 8px 0; min-height: 65px; margin: 0 10px }
.column:nth-child(2n) { border-left: 1px dotted #000; border-right: 1px dotted #000; padding: 8px 26px }
.column:nth-child(3) p { font-weight: 400; font-size: 12px; color: #777; text-align: left }
.column:nth-child(3) a { font-weight: 400; font-size: 30px; color: #5a010b }
.column:nth-child(3) span { font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 14px; display: block; text-align: left; margin: 0 5px; color: #777 }
.social li { display: inline-block; width: 49px; height: 49px }
.container, .content-page, .copyright, .footer-nav { height: auto; width: 100% }
.social li a { display: block; width: 100%; height: 100%; border-radius: 50%; -webkit-border-radius: 50%; -webkit-transition: all .3s ease-in-out; opacity: 1 }
.footer-nav li a, .social li a { transition: all .3s ease-in-out }
.social a:hover { opacity: .5 }
.facebook { background: url(../images/scl_facebook.png)center center no-repeat }
.google { background: url(../images/scl_google.png)center center no-repeat }
.youtube { background: url(../images/scl_youtube.png)center center no-repeat }
.skype { background: url(../images/skype.png)center center no-repeat }
.yahoo { background: url(../images/yahoo.png)center center no-repeat }
.footer-nav { background: url(../images/pattern.png)left top; text-align: center; padding: 59px 0 }
.footer-nav li { display: inline-block; margin: 0 -2px }
.footer-nav li a { line-height: 22px; -webkit-transition: all .3s ease-in-out; display: block }
.footer-nav li a h1 { padding: 13px 15px; font-family: MyriadRegular; font-weight: 400; font-size: 16px; color: #b1b3b5 }
.copyright, .scroll-down-desktop { font-family: Arial, Helvetica, sans-serif }
.footer-nav li.current a, .footer-nav li:not(.current) a:hover { background-color: #00193e }
.footer-nav li.current, .footer-nav li.current a { pointer-events: none }
.footer-nav li.current:nth-child(3), .footer-nav li.current:nth-child(3) a, .footer-nav li.current:nth-child(4), .footer-nav li.current:nth-child(4) a, .scroll-next, .scroll-prev { pointer-events: auto }
#home-page .logo, .fengshui-cate li.active, .fengshui-list .link-page.current, .fengshui-title h2.active a, .link-page.current, .link-page.current a, .nav-scroll ul li img, .nav-scroll ul li.current, .news-cate li.active, .next-pic.disable, .prev-pic.disable, .pro-pic img, .scroll-btn, .sub-nav li.active, .sub-nav li.active a { pointer-events: none }
.copyright { color: #828282; font-size: 11px; line-height: 12px; font-weight: 400; background: #00193e; padding: 18px 0; text-align: center }
.copyright a { color: #828282; white-space: nowrap }
.container { margin: 0; padding: 0; left: 0; top: 0; -webkit-transition: all 300ms ease 0s; transition: all 300ms ease 0s; opacity: 0 }
.scroll-down { position: absolute; top: auto; right: 10px; width: 18px; height: 46px; background: url(../images/scroll-down.png)repeat-y; -webkit-background-size: 90px 46px; -o-background-size: 90px 46px; -ms-background-size: 90px 46px; background-size: 90px 46px; opacity: .7; -webkit-animation: play 2s steps(20)infinite alternate; animation: play 2s steps(20)infinite alternate; display: none; z-index: 10 }
.scroll-down-desktop { background: url(../images/mouse_down.png)center center no-repeat; width: 60px; height: 60px; -webkit-border-radius: 50%; border-radius: 50%; position: absolute; top: auto; left: auto; margin: 0 auto; right: 80px; z-index: 20; font-size: 12px; line-height: 40px; color: #fff; padding: 10px; text-align: center; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; cursor: pointer; text-indent: -9999px; border: 1px solid rgba(255,255,255,.3) }
.scroll-down-desktop:hover { background-color: rgba(0,0,0,.3) }
.go-top { background: url(../images/top.png)center center no-repeat; width: 61px; height: 61px; position: fixed; bottom: 30px; right: 20px; cursor: pointer; display: none; -webkit-border-radius: 50%; border-radius: 50%; background-color: rgba(0,0,0,.5); opacity: 1; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; z-index: 3000 }
.go-top:hover { box-shadow: 0 0 20px rgba(255,255,255,.5) }
.overlay-menu { background-color: rgba(0,0,0,.4); height: 0; width: 100%; position: fixed; top: 0; left: 0; -webkit-transition: height 500ms ease 0s; transition: height 500ms ease 0s; z-index: 10; -webkit-touch-callout: none; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none }
.overlay-menu.show { height: 100% }
.no-scroll, .no-scroll-nav { overflow-x: hidden; overflow-y: hidden!important }
.about-box, .about-content, .bg-about, .block p, .block-pro-wrap, .option-wrap { overflow: hidden }
.animation { -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out }
.transform { -webkit-transition: all .6s ease-in-out .2s; transition: all .6s ease-in-out .2s }
.bg-title { position: absolute; top: 130px; right: 5%; width: 90%; max-width: 550px }
.bg-title h2 { font-family: MyriadLight; font-weight: 400; font-size: 48px; color: #fff; line-height: 54px; text-shadow: 5px 5px 0 rgba(0,0,0,.2); text-align: right }
.bg-title h2 [class*=word1], .bg-title h2 strong { font-family: MyriadBold; font-weight: 400 }
.bg-title h2>span>span { -webkit-transition: all 600ms ease; -moz-transition: all 600ms ease; -o-transition: all 600ms ease; -ms-transition: all 600ms ease; opacity: 0 }
.bg-title.move h2>span>span.move { opacity: 1 }
.block-news { position: relative; text-align: right; z-index: 1; background: url(../images/line.png)right top repeat-x #fff; padding-top: 4px; opacity: 0; box-shadow: 0 3px 10px rgba(0,0,0,.2) }
.block-news:after { display: block; width: 100%; height: 1px; clear: both }
.block-news:before { position: absolute; top: 40px; left: 50px; width: 270px; height: 80px; background: url(../images/Logo-vietnhat-chuan.png)center center no-repeat; background-size: cover }
.block-news .link-page { float: none; display: inline-block; margin: -1px -2px -3px; padding: 0 20px; max-width: 370px }
.block-news .link-page h3 { font-size: 18px }
.block-news .link-page p { font-size: 14px }
.block-news .link-page .new-icon { right: auto; left: 10px; top: 2px }
.block-news .link-page:nth-child(2n+1), .block-news .link-page:nth-child(2n+1) span.white { background-color: #001b42 }
.block-news .link-page:nth-child(2n+1) h3, .block-news .link-page:nth-child(2n+1) p { color: #fff }
.block-news .link-page:nth-child(2n+1):hover h3, .block-news .link-page:nth-child(2n+1):hover p, .block-news .link-page:nth-child(2n+2) h3, .block-news .link-page:nth-child(2n+2) p { color: #0a0a0a }
.block-news .link-page:nth-child(2n+1):hover, .block-news .link-page:nth-child(2n+1):hover span.white { background-color: #ccc }
.block-news .link-page:nth-child(2n+2), .block-news .link-page:nth-child(2n+2) span.white { background-color: #f2b819 }
.block-news .link-page:nth-child(2n+2):hover, .block-news .link-page:nth-child(2n+2):hover span.white { background-color: #ccc }
.block-pro-content { position: relative; width: 100%; background: url(../images/bg_gray.png)right top repeat-y #fff }
.block-pro-wrap { width: 100%; padding: 5% 0 3%; margin: 0 auto; text-align: right; opacity: 0 }
.block-pro-text { display: inline-block; width: 30%; padding: 0 5%; vertical-align: top; text-align: left }
.about-box.company, .block, .option-wrap { text-align: center }
.block-pro-title { width: 100%; margin-bottom: 25px }
.block-pro-title span { font-family: MyriadLight; font-weight: 400; font-size: 36px; color: #909090; display: block }
.block-pro-title h2 { font-family: MyriadBold; font-weight: 400; font-size: 72px; color: #001b42; line-height: 72px }
.block-pro-text p { font-family: Arial, Helvetica, sans-serif; font-weight: 400; font-size: 15px; color: #212121; line-height: 24px; margin-bottom: 20px }
.block-pro-pic { display: inline-block; width: 60%; padding-top: 30px; vertical-align: top }
.block-pro-pic img { width: 100%; max-width: 100%; display: block }
.link-detail { background-color: #e7bc1e; color: #fff; font-family: MyriadCondensed; font-weight: 400; font-size: 30px; padding: 11px 30px; margin-top: 15px; border-radius: 10px; -webkit-border-radius: 10px; display: inline-block; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out }
.link-detail:hover { background-color: #00193e; cursor: pointer }
.option-content { position: relative; width: 100%; background-color: #fff }
.option-wrap { width: 100%; margin: 0 auto }
.block { width: 25%; float: left; height: 330px; position: relative; opacity: 0; background-repeat: no-repeat; -webkit-background-size: cover; background-size: cover; background-position: center center }
.block a { position: absolute; width: 100%; height: 100%; left: 0; top: 0; border: 0; transition: border .3s ease-in-out; -webkit-transition: border .3s ease-in-out }
.block:after, .block:before { height: 100%; display: inline-block; vertical-align: middle }
.block:hover a { border: 10px solid #001b42 }
.block .block-inner { display: inline-block; vertical-align: middle; width: 80% }
.block h2 { font-family: Futurab-bold; font-weight: 400; font-size: 30px; color: #fff; margin-bottom: 15px; text-align: left; line-height: 40px }
.block p { font-family: Arial; font-size: 15px; color: #fff; margin-bottom: 20px; text-align: left; line-height: 24px; max-height: 120px }
.about-info h2, .sub-nav li a { font-family: MyriadBold }
.block:nth-child(2) { background: url(../images/pattern.png)center center }
.block:nth-child(4) { background: url(../images/pattern1.png)center center }
.about-box, .bg-about { background-attachment: scroll }
.sub-nav { position: fixed; top: 50%; margin-top: -35px; z-index: 10; transition: border .6s ease-in-out; -webkit-transition: border .6s ease-in-out; opacity: 0 }
.sub-nav ul { width: auto }
.sub-nav li { margin-bottom: 3px }
.sub-nav li:hover { cursor: pointer }
.sub-nav li a { font-weight: 400; font-size: 24px; color: #fff; display: inline-block; vertical-align: middle; line-height: 40px; margin: 0 7px; opacity: 0; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; white-space: nowrap; text-shadow: 2px 2px 0 rgba(0,0,0,.2) }
.detail-text h4, .detail-text p { font-size: 18px; color: #282828; line-height: 24px }
.sub-nav li .circle { display: inline-block; width: 23px; height: 23px; border: 1px solid rgba(255,255,255,0); border-radius: 50%; -webkit-border-radius: 50%; padding: 7px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; vertical-align: middle }
.close-about, .sub-nav li.active .circle, .sub-nav li:hover .circle { border: 1px solid rgba(255,255,255,.5) }
.sub-nav li.active a, .sub-nav li:hover a { opacity: 1 }
.sub-nav li span { display: block; background-color: #fff; border-radius: 50%; -webkit-border-radius: 50%; width: 100%; height: 100% }
.sub-nav.left { left: 40px; right: auto; opacity: 1; transition: all .3s ease-in-out }
.sub-nav.left, .sub-nav.right { -webkit-transition: all .3s ease-in-out }
.sub-nav.right { right: 40px; left: auto; opacity: 1; transition: all .3s ease-in-out }
.about-content { position: relative; padding-top: 83px; width: 100%; height: auto }
.about-box { position: relative; width: 100%; height: 100%; -webkit-background-size: cover; min-height: 350px; margin: 0; padding: 0 }
.about-box, .bg-about { background-size: cover }
.bg-about, .close-about, .detail-box { position: absolute }
.bg-about { -webkit-background-size: cover; width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat; z-index: -1; -webkit-transition: all .6s ease-in-out; transition: all .6s ease-in-out; background-color: #00193e }
.about-info { width: auto; max-width: 400px; height: auto; max-height: 350px; opacity: 0 }
.about-info.hide { opacity: 0!important }
.about-info h2 { font-weight: 400; font-size: 72px; color: #fff; text-shadow: 8px 8px 0 rgba(0,0,0,.1); margin-bottom: 12px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out }
.about-info p { font-family: MyriadLight; font-weight: 400; font-size: 18px; color: #fff; line-height: 24px; margin-bottom: 12px; -webkit-transition: all .3s ease-in-out; text-shadow: 1px 1px 2px rgba(0,0,0,.5) }
.about-info p, .close-about { transition: all .3s ease-in-out }
.detail-text h3, .detail-text h4 { font-family: MyriadBold }
.close-about { background: url(../images/close3.png)center center no-repeat; width: 50px; height: 50px; bottom: 10px; text-indent: 99999px; -webkit-transition: all .3s ease-in-out; border-radius: 50%; -webkit-border-radius: 50%; box-shadow: 0 0 30px rgba(255,255,255,0) }
.close-about:hover { box-shadow: 0 0 30px rgba(255,255,255,.8); border: 1px solid rgba(0,0,0,.5) }
.detail-box { width: 100%; height: 100%; left: 0; top: 0; opacity: 0; z-index: auto; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both }
.detail-pic, .detail-text { width: 50%; height: 100% }
.detail-text { padding: 70px 6%; position: relative }
.detail-text .inner { width: 90%; height: auto; margin: 0 5%; position: relative; display: block }
.detail-text h3 { font-weight: 400; font-size: 48px; color: #00193e; text-shadow: 5px 5px 0 rgba(0,0,0,.1); margin-bottom: 20px }
.agent-head h2, .contact-info h2 { text-shadow: 5px 8px 0 rgba(0,0,0,.1) }
.detail-text h4 { font-weight: 400; margin-bottom: 10px }
.detail-text p { font-family: MyriadLight; font-weight: 400; margin-bottom: 12px }
.fengshui-cate li a, .fengshui-title h2 a { font-family: MyriadCondensed }
.detail-pic { -webkit-background-size: contain; background-size: contain; background-repeat: no-repeat; background-position: center center }
.detail-pic img { display: none }
.detail-text h3 img { height: 100%; width: auto; display: block; margin: 0 auto }
.about-box.company .circle { float: right }
.about-box.company .about-info { display: inline-block; position: relative; z-index: 5; vertical-align: middle; transform: scale(0); -webkit-transform: scale(0); top: 50%; margin-top: -175px; transition: all .6s linear; -webkit-transition: all .6s linear }
.about-box.company .detail-box { background-color: rgba(255,255,255,.5); text-align: center }
.about-box.company .detail-box.show { -webkit-animation-name: flipInX1; animation-name: flipInX1; opacity: 1; z-index: 8 }
.about-box.company .detail-box.hide { -webkit-animation-name: flipOutX1; animation-name: flipOutX1; opacity: 1; z-index: auto }
.about-box.company .detail-box:after, .about-box.company .detail-box:before { height: 100%; display: inline-block; vertical-align: middle }
.about-box.company .detail-text { display: inline-block; vertical-align: middle; width: 70%; max-width: 1000px; float: none }
.about-box.company .about-info.animation { transform: scale(1); -webkit-transform: scale(1); opacity: 1 }
.about-box.company .close-about { border: 1px solid rgba(0,0,0,.5); left: 50%; margin-left: -30px; background-image: url(../images/close4.png); background-repeat: no-repeat; background-position: center center; box-shadow: 0 0 30px transparent }
.about-box.company .close-about:hover { box-shadow: 0 0 30px rgba(0,0,0,.5); border: 1px solid rgba(255,255,255,.5) }
.about-box.oexpo .circle { float: right }
.about-box.oexpo .about-info { position: absolute; left: 7%; bottom: 54px; text-align: left; transform: translate3d(-500px, 0, 0); -webkit-transform: translate3d(-500px, 0, 0); transition: all .6s linear; -webkit-transition: all .6s linear }
.about-box.oexpo .detail-box.show { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; z-index: 8 }
.about-box.oexpo .detail-box.hide { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; z-index: auto }
.about-box.oexpo .detail-pic { float: right; position: absolute; z-index: -1; width: 58%; right: 0 }
.about-box.oexpo .detail-text { background-image: url(../images/conner_white_rgt.png); background-repeat: no-repeat; background-position: right bottom; z-index: 1; text-align: right; float: left }
.about-box.oexpo .detail-text:before { position: absolute; left: -100px; top: 0; width: 100%; height: 100%; z-index: -1; background-color: #fff }
.about-box.oexpo .detail-text:after { position: absolute; right: 0; top: -99px; width: 100%; height: 100%; z-index: -1; background-color: #fff }
.about-box.oexpo .close-about { right: -20px }
.about-box.oexpo .about-info.animation { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); opacity: 1 }
.about-box.expo .circle { float: left }
.about-box.expo .about-info { position: absolute; right: 7%; bottom: 54px; text-align: right; transform: translate3d(500px, 0, 0); -webkit-transform: translate3d(500px, 0, 0); transition: all .6s linear; -webkit-transition: all .6s linear }
.about-box.expo .detail-box.show { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; z-index: 8 }
.about-box.expo .detail-box.hide { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; z-index: auto }
.about-box.expo .detail-text { background-image: url(../images/conner_white_lft.png); background-repeat: no-repeat; background-position: left bottom; float: right; text-align: left; z-index: 1 }
.agent-title, .link-page, .pic-thumb { float: left }
.about-box.expo .detail-pic { float: left; position: absolute; left: 0; width: 58%; z-index: -1 }
.about-box.expo .detail-text:before { position: absolute; right: -100px; top: 0; width: 100%; height: 100%; z-index: -1; background-color: #fff }
.about-box.expo .detail-text:after { position: absolute; left: 0; top: -99px; width: 100%; height: 100%; z-index: -1; background-color: #fff }
.about-box.expo .close-about { left: -20px }
.about-box.expo .about-info.animation { transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); opacity: 1 }
#fengshui-page .content-page { background-color: #00193e }
.fengshui-content { position: relative; width: 100%; padding-bottom: 68px; z-index: 1; opacity: 0 }
.wrap-fengshui { width: 100% }
.fengshui-box { position: relative; width: 90%; max-width: 1156px; margin: 0 auto; background: url(../images/pattern.png)left top; padding: 0 40px 36px; top: -30px }
.fengshui-title { position: relative; width: 100%; text-align: center; top: -45px }
.fengshui-title h2 { display: inline-block; vertical-align: middle; padding: 5px; border-radius: 10px; -webkit-border-radius: 10px; margin: 6px 12px; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; border: 1px solid #e7bc1e }
.fengshui-title h2.active, .fengshui-title h2:hover { border: 1px solid #00193e }
.fengshui-title h2 a { display: block; text-align: center; font-weight: 400; font-size: 30px; color: #fff; border-radius: 10px; -webkit-border-radius: 10px; padding: 10px 20px; transition: all .3s ease-out; -webkit-transition: all .3s ease-out; background-color: #e7bc1e }
.fengshui-title h2.active a { background-color: #00193e }
.fengshui-title h2:hover a { background-color: #00193e }
.fengshui-box.iron { background: #d8d9da }
.fengshui-box.wood { background: #74aa00 }
.fengshui-box.water { background: #006cb7 }
.fengshui-box.fire { background: #b00000 }
.fengshui-box.land { background: #daa900 }
.fengshui-cate { position: relative; display: inline-block; margin: 6px 12px }
.fengshui-cate li { display: inline-block; width: 72px; height: 72px; -webkit-border-radius: 50%; padding: 5px; margin: 0 2px; -webkit-transition: all .3s ease-out }
.fengshui-cate li, .fengshui-cate li a { border-radius: 50%; transition: all .3s ease-out }
.fengshui-cate li a { display: block; width: 100%; height: 100%; -webkit-border-radius: 50%; font-weight: 400; font-size: 24px; text-align: center; line-height: 60px; -webkit-transition: all .3s ease-out }
.fengshui-cate li.iron { border: 1px solid #fff }
.fengshui-cate li.wood { border: 1px solid #74aa00 }
.fengshui-cate li.water { border: 1px solid #006cb7 }
.fengshui-cate li.fire { border: 1px solid #b00000 }
.fengshui-cate li.land { border: 1px solid #daa900 }
.fengshui-cate li.iron a { background-color: #fff; color: #484848 }
.fengshui-cate li.wood a { background-color: #74aa00; color: #fff }
.fengshui-cate li.water a { background-color: #006cb7; color: #fff }
.fengshui-cate li.fire a { background-color: #b00000; color: #fff }
.fengshui-cate li.land a { background-color: #daa900; color: #fff }
.fengshui-cate li.fire:hover, .fengshui-cate li.iron:hover, .fengshui-cate li.land:hover, .fengshui-cate li.water:hover, .fengshui-cate li.wood:hover { border: 1px solid #001b42 }
.fengshui-cate li.fire:hover a, .fengshui-cate li.iron:hover a, .fengshui-cate li.land:hover a, .fengshui-cate li.water:hover a, .fengshui-cate li.wood:hover a { background-color: #001b42; color: #fff }
.fengshui-list .link-page.current span.white, .fengshui-list .link-page:not(.current):hover, .fengshui-list .link-page:not(.current):hover span.white { background-color: #00193e }
.fengshui-cate li.active { border: none; box-shadow: 0 0 30px #fff }
.fengshui-list { width: 100%; margin-bottom: 5px }
.fengshui-list .link-page:not(.current):hover h3, .fengshui-list .link-page:not(.current):hover p { color: #fff }
.fengshui-list .link-page.current { background-color: #00193e }
.fengshui-list .link-page.current h3, .fengshui-list .link-page.current p { color: #fff }
.fengshui-load { width: 99.4%; height: auto; margin: 0 5px; display: block; position: relative; background-color: #fff }
.detail-fengshui { position: relative; width: 90%; height: auto; margin: 0 5%; padding: 30px 0 }
.detail-fengshui h3 { font-family: MyriadRegular; font-size: 30px; color: #010101; line-height: 30px; position: relative; font-weight: 400; margin: 0 0 20px; padding-bottom: 20px; border-bottom: dotted 1px rgba(0,0,0,.5); text-align: center }
.fengshui-text { width: 100%; height: auto; position: relative; margin: 0; padding-bottom: 30px }
.fengshui-text p { font-family: Arial!important; font-weight: 400; font-size: 15px; color: #010101; line-height: 26px; position: relative; margin: 0 0 20px; text-align: left }
.caption, .news-cate, .news-cate a { text-align: center }
.fengshui-text p strong { font-family: Arial!important; font-weight: 700 }
.caption, .detail-news h3, .link-page h3, .link-page p, .news-cate a, .news-text p { font-weight: 400 }
.fengshui-text img { max-width: 100%; width: auto!important; height: auto!important; position: relative; margin: 10px auto; display: block; text-align: center }
.caption, .shape { position: absolute }
#search-page .agent-head, .news-box { max-width: 1156px }
.fengshui-text p a { color: #d39f3e }
.fengshui-text p a:hover { color: #010101 }
.fengshui-text iframe { display: block; margin: auto }
.caption { width: 204px; height: 51px; line-height: 51px; background-color: #fff; border-radius: 10px; -webkit-border-radius: 10px; box-shadow: 4px 4px 0 rgba(0,0,0,.1); color: #3a3a3a; font-family: MyriadLight; font-size: 18px; left: 13px; top: -60px }
.shape { bottom: -20px; left: 46px; width: 36px; height: 20px; background: url(../images/icon_tri.png)center center no-repeat }
.news-box, .news-cate, .news-content { position: relative }
#news-page .content-page { background-color: #00193e }
.news-content { width: 100%; padding-bottom: 68px; z-index: 1; opacity: 0 }
.news-box { width: 90%; margin: 0 auto; background: url(../images/pattern1.png)left top; padding: 0 40px 36px; top: -30px }
.news-cate { width: 100%; top: -32px; white-space: nowrap; overflow: hidden; overflow-x: auto }
.news-cate li { display: inline-block; padding: 5px; border: 1px solid #00193e; border-radius: 10px; -webkit-border-radius: 10px; -webkit-transition: all .3s ease-out; margin: 0 2px 5px; white-space: nowrap }
.news-cate a, .news-cate li { transition: all .3s ease-out }
.news-cate li.active, .news-cate li:not(.active):hover { border: 1px solid #e7bc1e }
.news-cate a { display: block; width: 190px; font-family: MyriadCondensed; font-size: 30px; color: #fff; background-color: #00193e; border-radius: 10px; -webkit-border-radius: 10px; padding: 10px 0; -webkit-transition: all .3s ease-out }
.news-cate li.active a, .news-cate li:not(.active):hover a { background-color: #e7bc1e }
.link-page h3, .link-page p { width: auto; text-align: left }
.news-cate li.active a { pointer-events: none }
.wrap-list { width: 100%; margin-bottom: 5px }
.list-link .slide-controls { position: absolute; top: 50%; margin-top: -29px; height: auto }
.list-link .slide-buttons { width: 100%; position: absolute; height: auto; top: 0; z-index: 200 }
.list-link .slide-buttons .slide-prev { position: absolute; height: 58px; width: 58px; left: -80px; top: 0; background: url(../images/previous2.png)center center no-repeat; -webkit-background-size: contain; background-size: contain; border: 1px solid rgba(255,255,255,.3) }
.link-page a, span.white { position: absolute; left: 0 }
.list-link .slide-buttons .slide-next { position: absolute; height: 58px; width: 58px; right: -80px; top: 0; background: url(../images/next2.png)center center no-repeat; -webkit-background-size: contain; background-size: contain; border: 1px solid rgba(255,255,255,.3) }
.list-link, .wrap-news { width: 100% }
.list-link { height: auto; display: block; position: relative }
.new-icon { background: url(../images/new.png)no-repeat; width: 50px; height: 30px; position: absolute; top: 0; right: 0; z-index: 4 }
.link-page, span.white { background-color: #fff }
.link-page { height: 130px; width: 98%; max-width: 480px; position: relative; display: block; margin: 0 5px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; cursor: pointer; overflow: hidden }
.link-page a { display: block; width: 100%; height: 100%; top: 0; z-index: 10 }
.link-page h3 { font-family: MyriadBold; font-size: 16px; color: #000; line-height: 22px; margin: 10px 20px 0 10px; transition: color .3s ease-in-out }
.link-page h3, .link-page p { -webkit-transition: color .3s ease-in-out }
.link-page p { font-family: MyriadLight; font-size: 16px; color: #000; line-height: 21px; margin: 0 20px 10px 10px; transition: color .3s ease-in-out }
span.white { height: 11px; width: 100%; bottom: 0; z-index: 1; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out }
.agent-content, .agent-head, .agent-search, .detail-news, .detail-news h3, .news-load, .news-text img, .news-text p, .pic-thumb, .pic-thumb img { position: relative }
.link-page.current, .link-page.current span.white, .link-page:not(.current):hover, .link-page:not(.current):hover span.white { background-color: #e7bc1e }
.pic-thumb { width: auto; max-width: 150px; height: 110px; margin: 10px; overflow: hidden; display: block; border: 1px solid #ccc; z-index: 2 }
.pic-thumb.no-img { line-height: 110px; background-color: #001b42 }
.pic-thumb.no-img img { width: 100%; height: auto; max-width: 150px; max-height: 110px; display: inline-block; vertical-align: middle }
.pic-thumb img { display: block; height: 100%; margin: 0 auto; width: auto; background-color: #333 }
.news-load { width: 99.4%; height: auto; margin: 0 5px; display: block; background-color: #fff }
.detail-news { width: 90%; height: auto; margin: 0 5%; padding: 30px 0 }
.detail-news h3 { font-family: MyriadRegular; font-size: 30px; color: #010101; line-height: 30px; margin: 0 0 20px; padding-bottom: 20px; border-bottom: dotted 1px rgba(0,0,0,.5); text-align: center }
.news-text { width: 100%; height: auto; position: relative; margin: 0; padding-bottom: 30px }
.news-text p { font-family: Arial!important; font-size: 15px; color: #010101; line-height: 26px; margin: 0 0 20px; text-align: left }
table.agent td.t-name, table.agent tr td.t-text { color: #000; font-family: Arial; text-align: center }
.news-text p strong { font-family: Arial!important; font-weight: 700 }
.news-text img { max-width: 100%; width: auto!important; height: auto!important; margin: 10px auto; display: block; text-align: center }
.news-text p a { color: #d39f3e }
.news-text p a:hover { color: #010101 }
.news-text iframe { display: block; margin: auto }
#contact-page .content-page { background-color: #00193e }
.agent-content { width: 100%; z-index: 1; top: -116px; opacity: 0 }
.agent-head { width: 96%; margin: 0 auto 20px; max-width: 1400px; z-index: 1 }
.agent-head:after { display: block; width: 100%; height: 1px; clear: both }
.agent-head h2 { font-family: MyriadBold; font-weight: 400; font-size: 72px; color: #fff; padding-left: 50px }
.agent-search select, .agent-search select option, .agent-search span { font-family: MyriadLight }
.agent-search { float: right; width: 316px; height: 60px; -webkit-border-radius: 10px; border-radius: 10px; box-shadow: 8px 8px rgba(0,0,0,.1); margin-right: 10px; top: 10px }
.agent-search span { width: 100%; height: 100%; position: absolute; z-index: -1; background: url(../images/icon_tri_down.png)95% center no-repeat #00193e; -webkit-border-radius: 10px; border-radius: 10px; padding: 0 20px; font-weight: 400; color: #fff; line-height: 60px }
.agent-search form { display: block; width: 100%; height: 100% }
.agent-search select { display: block; width: 100%; height: 100%; border: none; background: 0 0; font-weight: 400; font-size: 18px; opacity: 0; padding: 0 20px; -webkit-appearance: none; -moz-appearance: none; position: relative }
.agent-search select option { color: #fff; background-color: #00193e; font-weight: 400; line-height: 26px; padding: 5px 20px }
.agent-wrap { width: 96%; margin: 0 auto; max-width: 1400px; position: relative; z-index: 1 }
table.agent { width: 100%; height: 100%; min-width: 600px }
table.agent td.t-name { font-weight: 700; font-size: 15px; line-height: 24px; background-color: #f2b819; padding: 10px 15px; vertical-align: middle; -webkit-border-radius: 5px; border-radius: 5px }
table.agent tr td.t-text { font-weight: 400; font-size: 14px; line-height: 22px; background-color: #e0e3e8; padding: 10px; vertical-align: middle; -webkit-border-radius: 5px; border-radius: 5px }
table.agent tr td.t-shop { text-align: left; padding: 5px 15px; background-color: #e0e3e8; vertical-align: middle; line-height: 40px; min-width: 150px }
.link-agent { font-family: MyriadCondensed; font-weight: 400; text-align: center; font-size: 18px; color: #fff; min-width: 60px; background-color: #f2b819; padding: 9px 14px; -webkit-border-radius: 5px; border-radius: 5px; float: right; line-height: 100%; -webkit-transition: all .3s ease-in-out }
.contact-info li a, .link-agent { transition: all .3s ease-in-out }
.contact-info h2, .contact-info h3 { font-family: MyriadBold }
.link-agent:hover { background-color: #00193e }
table.agent tr td:nth-child(4), table.agent tr td:nth-child(5) { text-align: left; min-width: 200px }
table.agent tr td:nth-child(6) { min-width: 120px }
.contact-content { position: relative; width: 100%; background-size: cover; -webkit-background-size: cover; background-attachment: fixed; padding: 70px 0 50px }
.contact-wrap { width: 90%; max-width: 1300px; overflow: hidden; margin: 0 auto; position: relative; z-index: 1; opacity: 0 }
.contact-info { width: 48%; float: left }
.contact-info h2 { font-weight: 400; font-size: 72px; text-transform: uppercase; color: #fff; margin-bottom: 20px }
.contact-info h3 { font-weight: 400; font-size: 18px; color: #fff; margin-bottom: 10px }
.contact-info li, .contact-info li a, .input-area textarea { font-family: MyriadLight }
.contact-info ul { display: block; width: 100%; margin-bottom: 20px }
.contact-info li { font-weight: 400; font-size: 18px; color: #fff; margin-bottom: 5px; text-shadow: 1px 1px 2px rgba(0,0,0,.5) }
#product-detail-page .title-right h2, .title-left h2, .title-right h2 { text-shadow: 5px 8px 0 rgba(0,0,0,.1) }
.contact-info li a { font-weight: 400; font-size: 18px; color: #fff; -webkit-transition: all .3s ease-in-out }
.contact-info li a:hover { color: #001b42 }
.contact-form { width: 48%; float: right }
.contact-form form { width: 100%; display: block; position: relative; text-align: center }
.require-col { position: relative; width: 100% }
.input-text { width: 100%; height: 50px; position: relative; margin: 0 0 2px }
.input-text input[type=text] { font-family: MyriadLight; font-weight: 400; color: #fff; font-size: 18px; line-height: 48px; padding: 0 15px; border: none; width: 100%; height: 50px; background-color: rgba(255,255,255,.55); -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; border-radius: 10px; -webkit-border-radius: 10px }
.input-text input[type=text]:focus { background-color: #00193e }
.input-area { width: 100%; height: 160px; position: relative; margin: 0 }
.input-area textarea { font-weight: 400; color: #fff; font-size: 18px; line-height: 24px; border: none; width: 100%; height: 157px; padding: 10px 15px; background-color: rgba(255,255,255,.55); resize: none; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; border-radius: 10px; -webkit-border-radius: 10px }
.input-area textarea:focus, input[type=button]:hover, input[type=reset]:hover { background-color: #00193e }
input[type=button], input[type=reset] { border-radius: 10px; display: inline-block; background-color: #e7bc1e; font-family: Futurab }
.input-but { width: 100%; height: auto; position: relative; display: block; margin: 0; text-align: right }
input[type=button] { -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; font-size: 24px; line-height: 30px; padding: 10px 20px; text-align: center; font-weight: 400; color: #fff; width: auto; height: auto; position: relative; -webkit-appearance: none; cursor: pointer; border: none; margin: 0 0 0 10px; -webkit-border-radius: 10px }
input[type=reset] { -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; font-size: 24px; line-height: 30px; text-align: center; font-weight: 400; color: #fff; position: relative; -webkit-appearance: none; cursor: pointer; border: none; -webkit-border-radius: 10px; width: 0; height: 0; padding: 0; z-index: -99999; margin: 0 }
.close-agent, .close-album, .close-video, .close-video-about, .next-pic, .prev-pic { border: 1px solid rgba(255,255,255,.5) }
.focus-text { font-family: MyriadLight; font-weight: 400; color: #707070; font-size: 18px; line-height: 48px; padding: 0 15px; width: auto; height: 50px; position: absolute; left: 0; top: 0; z-index: 1; opacity: 1; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; overflow: hidden }
.focus-text mark { background-color: transparent; color: #ed1c24; margin: 0 0 0 10px }
.focus-text.hide { opacity: 0; width: 0 }
.all-agent { width: 900px; min-height: 500px; height: auto; position: absolute; z-index: 5000; background-color: #001b42; padding: 60px; left: 50%; top: 50%; margin: -300px 0 0 -450px; display: none; -ms-border-radius: 20px; -o-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px }
.agent-details { width: 100%; height: auto; position: relative; opacity: 0; margin: 0 }
.agent-details h3 { font-family: avantgarde; font-weight: 400; text-align: center; font-size: 24px; line-height: 28px; color: #fff; margin: 0 0 20px; position: relative }
.agent-details p, .title-left p { font-family: MyriadLight }
.agent-details p { font-weight: 400; font-size: 18px; line-height: 24px; color: #fff; text-align: center; margin: 20px 0 }
.agent-details img { width: 100%; height: auto; display: block }
.close-agent { background: url(../images/close.png)center center no-repeat; width: 60px; height: 60px; text-indent: -9999px; font-size: 0; cursor: pointer; position: absolute; right: -30px; top: -30px; z-index: 99999; -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; -ms-transition: all .5s ease-in-out; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; display: block; box-shadow: 0 0 60px rgba(0,0,0,.2); background-color: rgba(255,255,255,.1) }
.close-agent:hover { background-color: rgba(255,255,255,.3); box-shadow: 0 0 20px rgba(255,255,255,.8) }
.title-left:after, .title-left:before { transform: skewX(-30deg); top: 0; background-color: #00193e }
.title-left { position: absolute; top: 50%; left: 0; padding: 36px 75px 36px 44px; margin-top: -90px; z-index: 1 }
.title-left:before { position: absolute; width: 100%; height: 100%; left: 0; z-index: -1; -webkit-transform: skewX(-30deg) }
.title-left:after { position: absolute; width: 100%; height: 100%; left: -50%; z-index: -1; -webkit-transform: skewX(-30deg) }
.title-left p { font-weight: 400; font-size: 36px; color: #fff; text-align: left }
.title-left h2 { position: relative; font-family: MyriadBold; font-weight: 400; font-size: 72px; color: #fff; text-align: left; line-height: 72px }
.title-left h2:before { content: ''; position: absolute; bottom: -82px; left: 0; width: 60px; height: 75px; background: url(../images/arrow_down.png)center center no-repeat rgba(255,255,255,.5); transform: skewX(-30deg); -webkit-transform: skewX(-30deg) }
.title-right:after, .title-right:before { top: 0; width: 100%; height: 100%; background-color: #e7bc1e }
.title-right { position: absolute; top: 50%; right: 0; padding: 36px 44px 36px 75px; margin-top: -90px }
.pro-pic, .pro-pic img { height: auto; margin: 0 auto }
.title-right:before { position: absolute; left: 0; z-index: -1; transform: skewX(-30deg); -webkit-transform: skewX(-30deg) }
.title-right:after { position: absolute; right: -50%; z-index: -1; transform: skewX(-30deg); -webkit-transform: skewX(-30deg) }
.title-right p { font-family: MyriadLight; font-weight: 400; font-size: 36px; color: #000; text-align: right }
.title-right h2 { position: relative; font-family: MyriadBold; font-weight: 400; font-size: 72px; color: #000; text-align: right; line-height: 72px }
.title-right h2:before { position: absolute; bottom: -82px; right: 30px; width: 60px; height: 75px; background: url(../images/arrow_down.png)center center no-repeat rgba(255,255,255,.5); transform: skewX(-30deg); -webkit-transform: skewX(-30deg) }
.pro-item { width: 100%; height: auto; position: relative; background-color: rgba(255,255,255,.2) }
.pro-item a { position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 0; transition: border .3s ease-in-out; -webkit-transition: border .3s ease-in-out; z-index: 1 }
.pro-link, .pro-pic, .product-column, .product-content, .product-slide { position: relative }
.pro-item:hover a { border: 10px solid #ccc }
.pro-pic { width: 100%; max-width: 500px; max-height: 420px; display: block; overflow: hidden; z-index: 0 }
.pro-pic img { width: 80%; display: block; max-height: 280px; padding-top:10px;}
.name, .pro-link, .sub-name { display: inline-block }
#product-slide-page .pro-pic { max-height: 350px }
#product-list-page .pro-pic { max-height: 500px }
.pro-text { background: url(../images/pattern1.png)center center; text-align: center; padding: 15px 0 0; width: 100%; min-height: 186px }
.pro-name { margin-bottom: 10px; white-space: nowrap }
.sub-name { font-family: MyriadLight; font-weight: 400; font-size: 18px; color: #fff; text-align: right; vertical-align: middle; padding-top: 6px; width: 90px; white-space: normal; margin: 0 2px }
.name, .pro-text p { font-family: MyriadBold }
.name { font-weight: 400; font-size: 48px; color: #fff; text-align: left; height: 48px; vertical-align: middle; width: auto; white-space: nowrap; margin: 0 2px }
.name.name-product-group-new { font-weight: 400; font-size: 34px; color: #fff; text-align: left; height: 34px; vertical-align: middle; width: auto; white-space: nowrap; margin: 0 2px }
.pro-text p { font-weight: 400; font-size: 14px; color: #fff; line-height: 20px; max-width: 80%; margin: 0 auto 10px }
.pro-link { font-family: MyriadCondensed; font-weight: 400; font-size: 18px; padding: 15px 20px; color: #fff; background: url(../images/arrow_white.png)right center no-repeat; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out; z-index: 1 }
.pro-link:hover { cursor: pointer; color: #e7bc1e!important }
.product-content { width: 100%; height: auto; margin: 0 }
.product-column { width: 100%; height: auto; background: #00193e; padding-top: 20px }
.product-column .slide-item { vertical-align: top }
.album-pic-center img, .house-slide .house-box.slide-slidebox .slide-item, .nav-scroll ul li, .nav-scroll ul li img, .page-num span, .product-note li p, .product-note li span, .product-pic, .product-text, .slide-next, .slide-prev { vertical-align: middle }
.product-column.expo { background: #e7bc1e }
.column-name { width: 100%; text-align: center; margin-bottom: 20px; opacity: 0 }
.column-name h2 { font-family: MyriadLight; font-weight: 400; font-size: 24px; color: #fff }
.oexpo .slide-item:nth-child(odd) .sub-name, .product-column.expo .column-name h2 { color: #000 }
.column-name h2 strong { font-family: MyriadBold; font-weight: 400; font-size: 24px }
.product-column.expo-oil .product-slide .product-box { margin: 20px auto }
.product-slide { width: 100%; margin: 0 auto; height: auto; text-align: center; opacity: 0 }
.product-slide .product-box { width: 90%; max-width: 1400px; height: auto; position: relative; text-align: left; padding: 0; margin: 0 auto }
.product-slide .product-box .slide-item { height: 100% }
.product-slide .product-box .slide-item.loading .pro-item { display: none }
.product-slide .slide-pagination { margin: 20px 0 }
.product-slide .slide-controls { position: initial }
.product-slide .slide-buttons { position: absolute; width: 100%; height: 100% }
.product-slide .slide-prev { position: absolute; left: -80px; top: -60% }
.product-slide .slide-next { position: absolute; right: -80px; top: -60% }
.oexpo .slide-item:nth-child(odd) .pro-pic { background-color: #fff }
.oexpo .slide-item:nth-child(odd) .pro-text { background: #eaebed }
.oexpo .slide-item:nth-child(odd) .name { color: #00558b }
.expo .slide-item:nth-child(even) .sub-name, .oexpo .slide-item:nth-child(odd) .pro-item p { color: #000 }
.oexpo .slide-item:nth-child(odd) .pro-link { color: #000; background: url(../images/arrow_blu.png)right center no-repeat }
.expo .slide-item:nth-child(even) .pro-pic { background-color: #fff }
.expo .slide-item:nth-child(even) .pro-text { background: #eaebed }
.expo .slide-item:nth-child(even) .name { color: #00558b }
#product-list-page .product-column:nth-child(odd) .column-item:nth-child(even) .sub-name, .expo .slide-item:nth-child(even) .pro-item p { color: #000 }
.expo .slide-item:nth-child(even) .pro-link { color: #000; background: url(../images/arrow_blu.png)right center no-repeat }
.expo-oil .pro-item { width: 80%; margin: 0 auto; display: block }
#product-detail-page .title-left h2:before, #product-detail-page .title-right h2:before { display: none }
.expo-oil .pro-item:hover .pro-text { border-radius: 0; -webkit-border-radius: 0 }
.expo-oil .product-slide { background-repeat: no-repeat; background-size: cover; -webkit-background-size: cover; background-position: center center }
.expo-oil .pro-text { background: url(../images/pattern.png)center center; border-radius: 10px; -webkit-border-radius: 10px }
.column-wrap { width: 90%; max-width: 1000px; overflow: hidden; margin: 0 auto }
.column-item { float: left; width: 50%; opacity: 0 }
#product-list-page .pro-text { min-height: 118px }
#product-list-page .pro-name { margin-bottom: 0 }
#product-list-page .product-column:nth-child(odd) .column-item:nth-child(even) { background-color: #fff }
#product-list-page .product-column .column-name { opacity: 0 }
#product-list-page .product-column:nth-child(odd) .column-item:nth-child(even) .pro-text { background: #eaebed }
#product-list-page .product-column:nth-child(odd) .column-item:nth-child(even) .name { color: #00558b }
#product-list-page .product-column:nth-child(2) .column-name h2, #product-list-page .product-column:nth-child(even) .column-item:nth-child(odd) .sub-name, #product-list-page .product-column:nth-child(odd) .column-item:nth-child(even) .pro-item p { color: #000 }
#product-list-page .product-column:nth-child(odd) .column-item:nth-child(even) .pro-link { color: #000; background: url(../images/arrow_blu.png)right center no-repeat }
#product-list-page .sub-name { width: auto; padding: 10px 0 0 20px }
#product-list-page .product-column:nth-child(2) { background-color: #e7bc1e }
#product-list-page .product-column:nth-child(3) { padding: 0; background-repeat: no-repeat; background-size: cover; -webkit-background-size: cover; background-position: center center }
#product-list-page .product-column:nth-child(3) .column-name { padding: 20px 0; background-color: #e7bc1e }
#product-list-page .product-column:nth-child(even) .column-item:nth-child(odd) { background-color: #fff }
#product-list-page .product-column:nth-child(even) .column-item:nth-child(odd) .pro-text { background: #eaebed }
#product-list-page .product-column:nth-child(even) .column-item:nth-child(odd) .name { color: #00558b }
#product-list-page .product-column:nth-child(even) .column-item:nth-child(odd) .pro-item p { color: #000 }
#product-list-page .product-column:nth-child(even) .column-item:nth-child(odd) .pro-link { color: #000; background: url(../images/arrow_blu.png)right center no-repeat }
#product-list-page .product-column:nth-child(3) .column-item:nth-child(2n), #product-list-page .product-column:nth-child(3) .column-item:nth-child(2n+1) { background: 0 0 }
#product-list-page .product-column:nth-child(3) .pro-text { background: url(../images/pattern.png)center center!important }
#product-list-page .product-column:nth-child(3) .pro-item p, #product-list-page .product-column:nth-child(3) .pro-text .name, #product-list-page .product-column:nth-child(3) .pro-text .sub-name { color: #fff!important }
#product-list-page .product-column:nth-child(3) .column-item:nth-child(2n) .pro-link { color: #fff; background: url(../images/arrow_white.png)right center no-repeat }
#product-list-page .product-column:nth-child(3) .column-item { width: 49% }
#product-list-page .product-column:nth-child(3) .column-item:nth-child(2) { float: right }
#product-detail-page .title-right { position: absolute; top: 50%; right: auto; left: 0; padding: 42px 75px 42px 44px; margin-top: -90px }
#product-detail-page .title-right:before { position: absolute; width: 100%; height: 100%; background-color: #e7bc1e; left: 0; top: 0; z-index: -1; transform: skewX(-30deg); -webkit-transform: skewX(-30deg) }
#product-detail-page .title-right:after { position: absolute; width: 100%; height: 100%; background-color: #e7bc1e; left: -50%; top: 0; right: auto; z-index: -1; transform: skewX(-30deg); -webkit-transform: skewX(-30deg) }
#product-detail-page .title-right.expo-oil:after, #product-detail-page .title-right.expo-oil:before, #product-slide-page .title-right.expo-oil:after, #product-slide-page .title-right.expo-oil:before { background-color: #55010a }
#product-detail-page .title-right.expo-oil h2, #product-detail-page .title-right.expo-oil p { color: #fff }
#product-detail-page .title-right p { font-family: MyriadLight; font-weight: 400; font-size: 36px; color: #000; text-align: left }
#product-detail-page .title-right h2 { position: relative; font-family: MyriadBold; font-weight: 400; font-size: 72px; color: #000; text-align: left; line-height: 72px }
#product-slide-page .title-right.expo-oil h2, #product-slide-page .title-right.expo-oil p { color: #fff }
.product-wrap { width: 90%; max-width: 1200px; margin: 0 auto; padding: 30px 0; opacity: 0 }
.product-title { width: 100%; margin-bottom: 20px }
.product-title h2 { font-family: MyriadLight; font-weight: 400; font-size: 60px; color: #000 }
.product-title h2 strong { font-family: MyriadBold; font-weight: 400 }
.product-title h3 { font-family: Arial, Helvetica, sans-serif; font-weight: 400; font-size: 18px; color: #000 }
.product-detail { width: 100%; overflow: hidden }
.product-pic { width: 40%; float: none; display: inline-block; position: relative }
.product-pic img { width: 100%; max-width: 440px; height: auto; display: block }
.product-text { width: 100%; float: none; padding: 15px; display: inline-block; position: relative; margin: 0 -10px }
.product-text h3 { font-family: MyriadBold; font-weight: 400; font-size: 18px; color: #000; line-height:1.4; margin-bottom: 24px }
.product-note li, .product-note li p, .product-text p { font-family: MyriadLight }
.product-text p { font-weight: 400; color: #000; font-size: 18px; line-height: 24px; margin-bottom: 24px }
.product-note li { position: relative; font-size: 18px; margin: 0 0 10px; line-height: 24px; font-weight: 400; width: 100%; display: block; float: left }
.product-note li span { width: 50px; height: 50px; border-radius: 50%; -webkit-border-radius: 50%; overflow: hidden; margin: 0 10px 0 0; position: relative; display: block; float: left }
.product-note li span img { width: 100%; height: auto; max-width: 100%; border-radius: 50%; -webkit-border-radius: 50%; display: block }
.product-note li p { font-size: 18px; line-height: 22px; font-weight: 400; display: table-cell; height: 50px }
.oexpo .product-note { position: relative; display: inline-block; width: 60%; float: right; overflow: hidden; background: url(../images/conner_blu.png)right bottom no-repeat; padding: 50px }
.oexpo .product-note:before { position: absolute; width: 100%; height: 100%; left: -52px; top: 0; background-color: #00193e; z-index: -1 }
.oexpo .product-note:after { position: absolute; width: 100%; height: 100%; left: 0; top: -51px; background-color: #00193e; z-index: -1 }
.oexpo .product-note h4 { font-family: MyriadBold; font-weight: 400; color: #fff; font-size: 18px; line-height: 24px; margin-bottom: 10px }
.oexpo .product-note ul { width: 100%;  border-top: 1px dotted rgba(255,255,255,.5); padding: 10px 0; display: inline-block; position: relative; margin: 0 0 10px }
.oexpo .product-note li { color: #fff }
.oexpo .product-note p { font-family: MyriadLight; font-weight: 400; color: #fff; font-size: 18px; line-height: 24px; margin-bottom: 10px }
.oexpo .product-note p strong { font-family: MyriadBold; font-weight: 400 }
.expo .product-note { position: relative; display: inline-block; width: auto; overflow: hidden; background: url(../images/conner_yel.png)right bottom no-repeat; padding: 50px }
.expo .product-note:after, .expo .product-note:before { position: absolute; width: 100%; background-color: #e7bc1e }
.expo .product-note:before { height: 100%; left: -52px; top: 0; z-index: -1 }
.expo .product-note:after { height: 100%; left: 0; top: -51px; z-index: -1 }
.expo .product-note h4 { font-family: MyriadBold; font-weight: 400; color: #000; font-size: 18px; line-height: 24px; margin-bottom: 10px }
.expo .product-note ul { width: 100%;  border-top: 1px dotted rgba(0,0,0,.5); padding: 10px 0; display: inline-block; position: relative; margin: 0 0 10px }
.expo .product-note li { color: #fff }
.expo .product-note p { font-family: MyriadLight; font-weight: 400; color: #000; font-size: 18px; line-height: 24px; margin-bottom: 10px }
.expo .product-note p strong { font-family: MyriadBold; font-weight: 400 }
.expo-oil .product-note { position: relative; display: inline-block; width: auto; overflow: hidden; background: url(../images/conner_pink.png)right bottom no-repeat; padding: 50px }
.expo-oil .product-note:before { position: absolute; width: 100%; height: 100%; left: -52px; top: 0; background-color: #55010a; z-index: -1 }
.expo-oil .product-note:after { position: absolute; width: 100%; height: 100%; left: 0; top: -51px; background-color: #55010a; z-index: -1 }
#product-slide-page .product-column:nth-child(2n).expo, #product-slide-page .product-column:nth-child(2n).oexpo { background-color: rgba(240,240,240,1) }
.play-video, .player { top: 50%; z-index: 10; left: 50% }
.house-column, .house-slide, .house-title { width: 100%; height: auto }
.expo-oil .product-note h4 { font-family: MyriadBold; font-weight: 400; color: #fff; font-size: 18px; line-height: 24px; margin-bottom: 10px }
.expo-oil .product-note ul { width: 100%; border-bottom: 1px dotted rgba(255,255,255,.5); border-top: 1px dotted rgba(255,255,255,.5); padding: 10px 0; display: inline-block; position: relative; margin: 0 0 10px }
.expo-oil .product-note li { color: #fff }
.expo-oil .product-note p { font-family: MyriadLight; font-weight: 400; color: #fff; font-size: 18px; line-height: 24px; margin-bottom: 10px }
#product-slide-page .product-column:nth-child(2).expo .column-name h2, #product-slide-page .product-column:nth-child(2n).oexpo .column-name h2 { color: #000 }
.btn-back, .expo-oil .product-note p strong { font-family: MyriadBold }
.expo-oil .product-note p strong { font-weight: 400 }
#product-slide-page .product-column:nth-child(2n) .product-slide .slide-next, #product-slide-page .product-column:nth-child(2n) .product-slide .slide-prev { border: 1px solid rgba(0,0,0,.2); background-color: rgba(0,0,0,.4) }
#product-slide-page .product-column:nth-child(2n) .product-slide .slide-next:hover, #product-slide-page .product-column:nth-child(2n) .product-slide .slide-prev:hover { box-shadow: 0 0 30px rgba(0,0,0,.5) }
#product-slide-page .product-column:nth-child(2) .slide-controls .slide-page { border: 1px solid transparent }
#product-slide-page .product-column:nth-child(2) .slide-controls .slide-page.active, #product-slide-page .product-column:nth-child(2) .slide-controls .slide-page:hover { border: 1px solid rgba(0,0,0,.5) }
#product-slide-page .product-column:nth-child(2) .slide-controls .slide-page span { background-color: rgba(0,0,0,.3) }
.btn-back { position: relative; z-index: 10; font-size: 20px; color: #fff; padding: 12px 20px; border-radius: 10px; margin: 15px auto; display: block; width: 120px; cursor: pointer; -webkit-transition: all .3s ease-in-out; font-weight: 400; text-align: center }
.album-pic-center .pic-name h2, .album-pic-center .pic-name h3, .all-pics .text-length h3, .all-pics .text-length p, .house-title h2, .text-des h3, .text-des p { font-family: MyriadLight }
.btn-back, .house-title { transition: all .3s ease-in-out }
.btn-back.oexpo { background: #00193e }
.btn-back.oexpo:hover { background-color: #fff; color: #00193e }
.btn-back.expo { background: #e7bc1e }
.btn-back.expo:hover { background-color: #fff; color: #e7bc1e }
.btn-back.oil { background: #55010a }
.btn-back.oil:hover { background-color: #fff; color: #55010a }
.house-content { position: relative; width: 100% }
.house-column { padding-bottom: 20px }
.house-column:nth-child(1n) { background-color: #e7bc1e }
.house-column:nth-child(2n) { background-color: #014783 }
.house-column:nth-child(3n) { background-color: #00a8a2 }
.house-column:nth-child(4n) { background-color: #a86300 }
.house-title { opacity: 0; -webkit-transition: all .3s ease-in-out }
.house-title h2 { font-weight: 400; font-size: 48px; color: #fff; text-align: center; padding: 24px 0 15px }
.house-slide { position: relative; margin: 0 auto; text-align: center; opacity: 0 }
.house-slide .house-box { width: 90%; height: 330px; position: relative; text-align: left; padding: 0; margin: 0 auto; max-width: 1400px }
.house-slide .house-box .item-box { width: auto; max-width: 600px; height: auto; position: relative; text-align: center; margin: 10px; transform: none; -webkit-transform: none; opacity: 1; box-shadow: none; padding: 0; overflow: visible; display: block }
.album-center, .all-album, .all-pics, .allvideo, .bg-cover, .bg-inner, .full, .house-slide .house-box .item-pic, .nav-scroll, .nav-scroll ul li, .overlay-album, .overlay-dark, .overlay-video, .pinch-zoom-container, .scrollD, .slide-bg, .slide-bg-inner, .slide-slidebox .slide-wrapper-outer, .slider-home, .slider-inner { overflow: hidden }
.house-slide .house-box .slide-item.loading { min-height: 300px }
.house-slide .house-box .slide-item.loading .item-box { display: none }
.house-slide .house-box.slide-slidebox .slide-item { float: none; display: inline-block; margin: 0 }
.house-slide .house-box .slide-wrapper-outer { min-height: 320px }
.house-slide .house-box .item-pic { position: relative; width: 100%; height: auto; display: block; max-width: 600px; max-height: 400px; border: 2px solid #fff; box-shadow: 10px 10px 0 rgba(0,0,0,.1) }
.house-slide .house-box .item-pic img { width: 100%; height: auto; max-width: 100%; position: relative; display: block; margin: 0 auto; z-index: -1 }
.zoom-details { background: url(../images/zoom.png)center center no-repeat; width: 62px; height: 62px; position: absolute; left: 50%; bottom: 20px; margin-left: -31px; -webkit-border-radius: 50%; border-radius: 50%; z-index: 20; opacity: 1; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; display: block; cursor: pointer }
.video-list, .video-skin, .video-wrap, .video-wrap iframe { width: 100%; height: 100% }
.zoom-details:hover { box-shadow: 0 0 30px rgba(255,255,255,1); opacity: 1 }
.allvideo { position: fixed; width: 0; height: 100%; z-index: 4000; left: 0; top: 0; display: none }
.video-list, .video-skin, .video-wrap { position: absolute }
.video-list { left: 0; top: 0; background-color: rgba(0,0,0,.5); z-index: 100 }
.video-wrap { background-color: rgba(0,0,0,1); top: 0; left: 0; z-index: 100 }
.video-skin { background-color: rgba(0,0,0,.8); top: 0; left: 0; z-index: 10 }
.video-wrap iframe { position: absolute; background-color: rgba(0,0,0,1); display: block; top: 0; left: 0; z-index: 10 }
.video-center iframe { background-color: #000; display: block; height: 500px; margin: 0; position: relative; width: 100% }
.close-video, .play-video, .player { position: absolute }
.close-video { background: url(../images/close.png)center center no-repeat; width: 60px; height: 60px; cursor: pointer; right: 20px; top: 20px; z-index: 999999; transition: all .5s ease-in-out; -webkit-border-radius: 50%; border-radius: 50%; display: block; box-shadow: 0 0 60px rgba(0,0,0,.2); background-color: rgba(255,255,255,.1) }
.album-center, .album-load, .all-album, .overlay-album { width: 100%; display: none }
.close-video, .player { -webkit-transition: all .5s ease-in-out }
.close-video:hover { background-color: rgba(255,255,255,.3); box-shadow: 0 0 20px rgba(255,255,255,.8) }
.player { background: url(../images/play.html)no-repeat; width: 131px; height: 131px; margin: -65px 0 0 -65px; box-shadow: 0 0 30px rgba(0,0,0,.3); -webkit-border-radius: 50%; border-radius: 50%; transition: all .5s ease-in-out; background-size: cover }
.player:hover { box-shadow: 0 0 30px rgba(255,255,255,.8) }
.play-video { background: url(../images/play2.html)center center no-repeat; width: 88px; height: 88px; margin: -44px 0 0 -44px; box-shadow: 0 0 30px rgba(0,0,0,.3); -webkit-border-radius: 50%; border-radius: 50%; transition: all .5s ease-in-out; cursor: pointer }
.close-video-about, .play-video { -webkit-transition: all .5s ease-in-out }
.play-video:hover { box-shadow: 0 0 30px rgba(255,255,255,.8) }
.close-video-about { background: url(../images/close.png)center center no-repeat; width: 60px; height: 60px; cursor: pointer; position: absolute; right: 20px; top: 20px; z-index: 999999; transition: all .5s ease-in-out; -ms-border-radius: 50%; -o-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; display: none; box-shadow: 0 0 60px rgba(0,0,0,.2); background-color: rgba(255,255,255,.1) }
.close-video-about:hover { background-color: rgba(255,255,255,.3); box-shadow: 0 0 20px rgba(255,255,255,.8) }
.all-album { height: 100%; position: fixed; left: 0; top: 0; -khtml-user-select: none; -moz-user-select: -moz-none; z-index: 3600 }
.overlay-album { background: url(../images/pattern1.png); height: 0; position: fixed; top: 0; left: 0; z-index: 3500 }
.album-load { height: 100%; position: absolute; text-align: center; left: 0; top: 0 }
.album-center { position: relative; height: 100% }
.album-pic-center { width: 100%; height: auto; position: relative; text-align: center; display: block }
.album-pic-center:after, .album-pic-center:before { display: inline-block; vertical-align: middle; height: 100% }
.album-pic-center img { width: auto; height: auto; position: relative; display: inline-block; margin: auto; box-shadow: 0 0 5px rgba(0,0,0,.2); border: 2px solid rgba(255,255,255,0); max-height: 95%; max-width: 95% }
.next-pic, .prev-pic { box-shadow: 0 0 60px rgba(0,0,0,.2) }
.album-pic-center .pic-name { position: absolute; left: 0; top: 0; z-index: 5; width: 100%; height: auto }
.album-pic-center .pic-name h2 { font-weight: 400; font-size: 22px; line-height: 22px; text-align: left; position: relative; display: block; margin-bottom: 10px; color: rgba(255,255,255,1); text-shadow: 1px 1px 1px rgba(0,0,0,.5) }
.album-pic-center .pic-name h2>span { -webkit-transition: all 800ms ease; transition: all 800ms ease; opacity: 0 }
.album-pic-center .pic-name.move h2>span.move { opacity: 1 }
.album-pic-center .pic-name h3 { color: #fff; font-weight: 400; font-size: 24px; line-height: 30px; text-align: center; display: inline-block; position: relative; text-shadow: 1px 1px 1px rgba(0,0,0,.5); padding: 10px 20px; background-color: rgba(0,0,0,.5) }
.close-album, .nav-content, .next-pic, .prev-pic, .slide-pic-nav { position: absolute }
.album-pic-center .pic-name h3>span>span { -webkit-transition: all 900ms ease; transition: all 900ms ease; opacity: 0 }
.album-pic-center .pic-name.move h3>span>span.move { opacity: 1 }
.slide-pic-nav { width: 100%; height: auto; top: 50%; margin-top: -20px; bottom: auto; left: 0; z-index: 200; display: none }
.next-pic, .prev-pic { width: 40px; height: 40px }
.next-pic { background: url(../images/next_s.png)center center no-repeat; right: 30px; top: 0; cursor: pointer; transition: all .3s ease-in-out; -webkit-border-radius: 50%; border-radius: 50%; background-color: rgba(255,255,255,.1) }
.next-pic, .prev-pic { -webkit-transition: all .3s ease-in-out }
.prev-pic { background: url(../images/previous_s.png)center center no-repeat; left: 30px; top: 0; cursor: pointer; transition: all .3s ease-in-out; border-radius: 50%; background-color: rgba(255,255,255,.1) }
.close-album, .prev-pic { -webkit-border-radius: 50% }
.next-pic:hover, .prev-pic:hover { background-color: rgba(255,255,255,.3); box-shadow: 0 0 20px rgba(255,255,255,.8) }
.next-pic.disable, .prev-pic.disable { opacity: .5 }
.close-album { background: url(../images/close.png)center center no-repeat; width: 60px; height: 60px; text-indent: -9999px; font-size: 0; cursor: pointer; right: 20px; top: 20px; left: auto; bottom: auto; margin: 0; z-index: 9999; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; border-radius: 50%; display: block; box-shadow: 0 0 60px rgba(0,0,0,.2); background-color: rgba(255,255,255,.1) }
.close-album:hover { background-color: rgba(255,255,255,.3); box-shadow: 0 0 20px rgba(255,255,255,.8) }
.nav-content { width: 100%; height: 80px; left: 0; bottom: 0 }
.nav-wrap { position: relative; width: 90%; height: 100%; max-width: 1200px; margin: 0 auto }
.nav-scroll { position: absolute; width: 100%; height: 100% }
.nav-scroll ul { position: relative; width: auto; height: auto; white-space: nowrap }
.nav-scroll ul li { width: 80px; height: 60px; margin: 10px -1px; line-height: 56px; border: 2px solid #fff; display: inline-block; white-space: nowrap; opacity: .5; transition: all .3s ease-in-out; -webkit-transition: all .3s ease-in-out }
.scroll-next, .scroll-prev { height: 30px; border: 1px solid #fff }
.nav-scroll ul li img { height: 100%; width: auto; max-width: 76px; display: inline-block }
.nav-scroll ul li.current, .nav-scroll ul li:not(.current):hover { opacity: 1 }
.scroll-btn { position: absolute; top: 50%; width: 100%; height: 30px; margin-top: -15px; display: none }
.scroll-next, .scroll-prev { border-radius: 50%; top: 0; width: 30px }
.scroll-prev { background: url(../images/previous_s.png)center center no-repeat; -webkit-border-radius: 50%; position: absolute; left: -40px; text-indent: 9999px; -webkit-transition: all .3s ease-in-out }
.scroll-next, .scroll-prev { transition: all .3s ease-in-out }
.scroll-next { background: url(../images/next_s.png)center center no-repeat; -webkit-border-radius: 50%; position: absolute; right: -40px; text-indent: 9999px; -webkit-transition: all .3s ease-in-out }
.slide-next, .slide-prev { opacity: 1; z-index: 20; text-indent: -9999px }
.bg-home, .scrollD, .slide-bg, .slider-home { position: relative }
.nextslide, .prevslide { border: 1px solid rgba(255,255,255,.5) }
.scroll-next:hover, .scroll-prev:hover { box-shadow: 0 0 10px rgba(255,255,255,1); cursor: pointer }
.nextslide, .prevslide { box-shadow: 0 0 60px rgba(0,0,0,.2) }
.scrollD { width: 100%; height: 100% }
.slider-home { width: 100%; height: 100%; padding: 0; margin: 0; text-align: center; -webkit-touch-callout: none; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none; display: block }
.slide-bg { width: 100%; height: 100%; z-index: 1 }
.bg-home { width: 100%; height: 100%; overflow: hidden }
.bg-home img { width: 100%; height: auto; position: absolute; left: 0; top: auto; bottom: 0; z-index: -1; display: block }
.bg-inner, .bg-inner img, .slide-bg-inner, .slider-inner { position: relative }
.slider-inner { width: 100%; height: auto; padding: 0; margin: 0; text-align: center; -webkit-touch-callout: none; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none; display: block }
.slide-bg-inner { width: 100%; height: auto; z-index: 1 }
.bg-inner { width: 100%; height: auto }
.bg-inner img { width: 100%; height: auto; z-index: -1; display: block }
.bg-cover, .next-prev, .nextslide, .prevslide { position: absolute }
.bg-cover { background-position: center top; background-repeat: no-repeat; left: 0; top: 0; height: 100%; width: 100%; background-size: cover; -webkit-background-size: cover; background-attachment: fixed; z-index: 0 }
.blur { -webkit-filter: blur(15px); -o-filter: blur(8px); -ms-filter: blur(15px); filter: url(../images/blur.svg#blur); filter: blur(15px) }
.next-prev { left: 0; top: 50%; width: 100%; height: auto; z-index: 90; display: none }
.nextslide, .prevslide { width: 70px; height: 70px }
.prevslide { left: 10px; top: 0; background: url(../images/previous.png)center center no-repeat; -webkit-border-radius: 50%; border-radius: 50%; cursor: pointer; transition: all .3s ease-in-out; opacity: 1; z-index: 99999 }
.nextslide, .prev, .prevslide { -webkit-transition: all .3s ease-in-out }
.nextslide, .show-zoom { -ms-border-radius: 50% }
.nextslide { right: 10px; top: 0; background: url(../images/next.png)center center no-repeat; -o-border-radius: 50%; border-radius: 50%; cursor: pointer; transition: all .3s ease-in-out; opacity: 1; z-index: 99999 }
.close-popup, .nextslide { -webkit-border-radius: 50% }
.overlay-dark, .overlay-video { position: fixed; height: 100%; width: 100% }
.nextslide:hover, .prevslide:hover { background-color: rgba(0,0,0,.1); box-shadow: 0 0 20px rgba(255,255,255,.8) }
.nextslide.disable, .prevslide.disable { opacity: .3; pointer-events: none }
.full img, .full2 img { border: none; opacity: 0 }
.overlay-video { background-color: rgba(0,0,0,.5); top: 0; left: 0; z-index: 1100; display: none }
.overlay-dark { background-color: rgba(0,0,0,.8); top: 0; left: 0; z-index: 1100; display: none }
.close-popup, .popup-pics img { display: block; position: absolute }
.popup-pics { height: 510px; width: 910px; position: absolute; left: 50%; top: 50%; margin: -250px 0 0 -450px; z-index: 1200; text-align: center; display: none; border: 5px solid rgba(255,255,255,.1); box-shadow: 0 0 60px rgba(0,0,0,.8) }
.popup-pics img { width: auto; height: 500px; left: 0; top: 0 }
.close-popup { background: url(../images/close.png)center center no-repeat; width: 60px; height: 60px; cursor: pointer; right: -33px; top: -33px; z-index: 999999; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; border-radius: 50%; box-shadow: 0 0 60px rgba(0,0,0,.2); border: 1px solid rgba(255,255,255,.5); background-color: rgba(255,255,255,.1) }
.close-popup:hover { background-color: rgba(255,255,255,.3); box-shadow: 0 0 20px rgba(255,255,255,.8) }
.all-pics { height: 100%; width: 100%; position: fixed; left: 0; top: 0; z-index: 4000; display: none; background-color: rgba(97,103,109,0); -webkit-transition: background-color .5s ease-in-out; transition: background-color .5s ease-in-out }
.full img, .full2, .full2 img { display: block }
.all-pics.show { background-color: rgba(97,103,109,1) }
.all-pics .text-length { width: 500px; height: auto; background-color: rgba(0,0,0,.5); position: absolute; left: 50%; top: 0; margin-left: -250px; z-index: 9998; opacity: 0; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none; padding: 10px 20px }
.all-pics .text-length h3 { font-size: 30px; color: #fff; line-height: 32px; position: relative; text-align: center; font-weight: 400 }
.all-pics .text-length p { font-size: 18px; color: #fff; line-height: 26px; position: relative; text-align: center; font-weight: 400 }
.text-des h3, .text-des p { position: relative; text-align: left }
.full { position: relative; width: 100%; height: 100% }
.full img, .full2, .full2 img { width: auto; height: auto }
.full img { outline: 0; margin: 0 auto }
.full2 { position: relative; z-index: 9997; margin: 0 }
.close-pics, .close-pics-small, .show-zoom { top: 20px; z-index: 99999 }
.full2 img { position: relative; outline: 0; margin: 0 auto; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none }
.dragscroll { cursor: url(../images/hand.html)6 8, move; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none }
.close-pics, .next, .prev, .show-zoom, .slide-controls .slide-buttons div, .slide-controls .slide-page { cursor: pointer }
.pinch-zoom-container { height: auto; width: 100%; position: relative; left: 0; top: 0 }
.show-zoom { background: url(../images/show.png)center center no-repeat; width: 40px; height: 40px; position: absolute; left: 20px; background-color: rgba(0,0,0,.5); -o-border-radius: 50%; border-radius: 50%; display: none }
.close-pics, .show-zoom.show { display: block }
.close-pics, .show-zoom { -webkit-border-radius: 50% }
.close-pics { background: url(../images/close.png)center center no-repeat; width: 60px; height: 60px; position: fixed; right: 20px; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; border-radius: 50%; box-shadow: 0 0 60px rgba(0,0,0,.2); border: 1px solid rgba(255,255,255,.5); background-color: rgba(0,0,0,.2) }
.close-pics:hover { background-color: rgba(0,0,0,.5); box-shadow: 0 0 20px rgba(255,255,255,.8) }
.close-pics-small { background: url(../images/close3.png)center center no-repeat; width: 40px; height: 40px; cursor: pointer; position: fixed; right: 20px; background-color: rgba(0,0,0,.5); border-radius: 50%; display: none }
.close-pics-small, .prev { -webkit-border-radius: 50% }
.go-next, .go-prev { right: 0; top: auto; z-index: 200 }
.close-box, .go-next, .go-prev, .next, .nextprev, .prev, .show-box, .text-des, .zoom { position: absolute }
.go-next, .go-prev { width: 30%; height: 60px }
.go-prev { bottom: auto; background: url(../images/previous.png)center center no-repeat }
.go-next { bottom: auto; background: url(../images/next.png)center center no-repeat }
#contact-loader, #contact-loader span.circle, .contact-success { position: fixed; left: 50%; top: 50% }
.nextprev { width: 100%; height: auto; top: 50%; margin-top: 30px; left: 0; z-index: 200; display: none }
.next, .prev, .zoom { display: block }
.next, .prev { z-index: 100; width: 54px; top: 0; height: 54px }
.prev { left: 0; background: url(../images/previous4.png)center center no-repeat; border-radius: 50%; transition: all .3s ease-in-out; opacity: .5 }
.next, .prev { -o-border-radius: 50%; -ms-border-radius: 50% }
.next { right: 0; background: url(../images/next4.png)center center no-repeat; border-radius: 50%; transition: all .3s ease-in-out; opacity: .5 }
.next, .zoom { -webkit-transition: all .3s ease-in-out; -webkit-border-radius: 50% }
.next:hover, .prev:hover { opacity: 1 }
.next.disable, .prev.disable { opacity: .2; pointer-events: none }
.text-des { width: 60%; height: auto; background-color: rgba(0,0,0,.5); left: 2px; bottom: 2px; z-index: 2; padding: 20px }
.text-des h3 { font-size: 24px; color: #fff; line-height: 26px; font-weight: 400; margin: 0 }
.text-des p { font-size: 16px; color: #fff; line-height: 24px; font-weight: 400 }
.contact-success, .item, .page-num, .page-num span, .slide-buttons, .slide-controls, .total-page { text-align: center }
.zoom { background: url(../images/zoom.png)center center no-repeat; background-color: rgba(0,0,0,.5); width: 62px; height: 62px; left: 50%; bottom: 20px; margin-left: -31px; box-shadow: 0 0 30px rgba(0,0,0,.3); border-radius: 50%; z-index: 20; opacity: 1; transition: all .3s ease-in-out }
.close-box, .show-box { left: 20px; z-index: 10; width: 30px; height: 30px }
.zoom:hover { box-shadow: 0 0 30px rgba(255,255,255,1); opacity: 1 }
.close-box { background: url(../images/close3.png)center center no-repeat; bottom: -35px; background-color: rgba(0,0,0,.5); border-radius: 50%; display: none }
.close-box, .show-box { -webkit-border-radius: 50% }
.show-box { background: url(../images/show.png)center center no-repeat; bottom: 10px; background-color: rgba(0,0,0,.5); -o-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; display: none }
.slide-slidebox .slide-wrapper:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0 }
.slide-slidebox .slide-wrapper { display: none; position: relative; height: auto }
.slide-slidebox .slide-wrapper-outer { position: relative; width: 100% }
.slide-slidebox .slide-wrapper-outer.autoheight { -webkit-transition: height 300ms ease-in-out; transition: height 300ms ease-in-out }
.slide-slidebox .slide-item { position: relative; min-height: 1px; float: left; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none }
.slide-slidebox { display: none; position: relative; -ms-touch-action: pan-y; -webkit-tap-highlight-color: transparent; -khtml-user-select: none; -moz-user-select: -moz-none; -ms-user-select: none }
.slide-loaded { display: block }
.slide-loading { opacity: 0; display: block }
.grabbing { cursor: url(../images/grabbing.png)8 8, move }
.item, .slide-next, .slide-prev { cursor: pointer }
.bg-about, .full>*, .nav-list>*, .slide-slidebox .slide-item, .slide-slidebox .slide-wrapper { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) }
.slide-controls { width: 100%; position: relative; height: auto; z-index: 2 }
.slide-pagination { position: relative; width: 100%; height: auto; margin: 10px 0 }
.slide-controls .slide-page { display: inline-block; position: relative; width: 22px; height: 22px; border: 1px solid rgba(255,255,255,0); -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-border-radius: 50%; border-radius: 50%; margin: 0 2px }
.slide-controls .slide-page.active, .slide-controls.clickable .slide-page:hover { border: 1px solid rgba(255,255,255,1) }
.slide-controls .slide-page span { display: block; width: 12px; height: 12px; margin: 4px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; -webkit-border-radius: 50%; border-radius: 50%; background-color: rgba(255,255,255,.8) }
.slide-controls .slide-page.active span, .slide-controls.clickable .slide-page:hover span { background-color: rgba(255,255,255,1) }
.slide-next, .slide-prev { display: inline-block; margin: 0 5px }
.slide-controls .slide-page.active { pointer-events: none }
.slide-next, .slide-prev { border: 1px solid rgba(255,255,255,.5) }
.slide-controls .slide-page span.slide-numbers { font-family: Arial, Helvetica, sans-serif; font-weight: 400; color: #666; padding: 0; font-size: 14px; line-height: 35px; text-align: center; display: block }
.slide-next, .slide-prev { width: 60px; height: 60px; font-size: 0 }
.contact-success, .item, .page-num span { font-family: MyriadLight }
.slide-item.loading { background: url(../images/loader.gif)center center no-repeat; min-height: 100px }
.loader { background: url(../images/ajaxloader.gif)center center no-repeat; min-height: 100% }
.column-slide .slide-item.loading { background-image: none; min-height: inherit }
.slide-buttons { position: relative; width: 100%; height: auto }
.slide-prev { position: relative; background: url(../images/previous2.png)center center no-repeat; -webkit-border-radius: 50%; border-radius: 50%; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; box-shadow: 0 0 60px rgba(0,0,0,.2); background-color: rgba(255,255,255,.1) }
.slide-next { position: relative; background: url(../images/next2.png)center center no-repeat; -webkit-border-radius: 50%; border-radius: 50%; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out; box-shadow: 0 0 20px rgba(0,0,0,.1); background-color: rgba(255,255,255,.1) }
.slide-next:hover, .slide-prev:hover { background-color: rgba(0,0,0,.1); box-shadow: 0 0 30px rgba(255,255,255,.8) }
.slide-next.disable, .slide-prev.disable { pointer-events: none; opacity: .5 }
.page-num { width: 100%; margin: 0; padding: 0; background-color: #c6c6c6; display: none; line-height: 106px; height: 106px }
.item, .page-num span, .total-page { display: inline-block }
.page-num span { font-size: 17px; color: #333; position: relative; font-weight: 400; margin: 0 3px 0 0; line-height: 40px }
.total-page { height: auto; position: relative; vertical-align: top }
.item { font-weight: 400; color: #000; font-size: 16px; width: 40px; height: 40px; border: none; background-color: #fff; transition: all .3s ease-in-out; border-radius: 50%; line-height: 40px }
#contact-loader, .item { -webkit-border-radius: 50% }
#search-page .search-list p a, .item { -webkit-transition: all .3s ease-in-out }
.item:not(.current):hover { background-color: #0054a6; color: #fff }
.item.current { background-color: #0054a6; color: #fff; pointer-events: none }
.slider-home .slide-controls { bottom: 100px; position: absolute; left: auto; right: 60px; width: auto }
.slider-inner .slide-controls { bottom: 10px; right: 10px; position: absolute; left: auto; width: auto; margin: 0 }
#home-page .copyright a, .class-hidden { display: none }
#contact-loader span.circle { border: 3px solid rgba(247,211,109,.5); width: 120px; height: 120px; margin: -60px 0 0 -60px; -webkit-border-radius: 50%; border-radius: 50%; box-shadow: 0 0 20px rgba(255,255,255,.5); -webkit-animation: Ani 1s infinite; animation: Ani 1s infinite }
.contact-success { margin: -50px 0 0 -150px; padding: 20px; line-height: 25px; width: 300px; min-height: 100px; height: auto; background: #8C0047; border-radius: 15px; color: #fff; font-weight: 400; z-index: 99999; text-shadow: 0 0 2px rgba(0,0,0,.8) }
.color-red { background: rgba(167,14,19,1); color: #fff }
.color-blue { background: rgba(4,39,80,1); color: #fff }
#contact-loader { background: url(../images/load.png)center center no-repeat; z-index: 110000; width: 60px; height: 60px; margin: -30px 0 0 -30px; -ms-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; animation: Rotate 2s linear infinite; -webkit-animation: Rotate 2s linear infinite }
#fengshui-page .fengshui-text table, #news-page .news-text table, td, th { border: 1px solid #000 }
#search-page .content-page { background-color: #00193e }
#search-page .agent-content { position: relative; width: 100%; z-index: 1; top: -116px }
#search-page .news-box { position: relative; max-width: 1156px; margin: 0 auto; background: url(../images/pattern1.png)left top; padding: 50px 5% 30px; width: 100%; top: auto }
#search-page .detail-news { position: relative; width: 90%; height: auto; margin: 0 5%; padding: 30px 0 }
#search-page .search-list { width: 99.4%; height: auto; margin: 0 5px; display: block; position: relative; background-color: #fff }
#search-page .search-list h3 { font-family: avantgarde; font-weight: 400; text-align: left; font-size: 24px; line-height: 30px; color: #537b00; margin-bottom: 25px }
#search-page .search-list p { font-family: Arial, Helvetica, sans-serif; font-weight: 400; font-size: 16px; line-height: 24px; color: #000; position: relative; text-align: left; margin-bottom: 15px }
#search-page .search-list p a { color: #fff; font-size: 14px; line-height: 24px; background-color: #f2b819; padding: 5px 15px; -webkit-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; margin: 0 10px; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; white-space: nowrap; display: inline-block }
#search-page .search-list p a:hover { color: #fff; background-color: #00193e }
@keyframes Color { 0%, 100% {
background-color:rgba(0,0,0,.5)
}
50% {
background-color:rgba(0,0,0,1)
}
}
@-webkit-keyframes Color { 0%, 100% {
background-color:rgba(0,0,0,.5)
}
50% {
background-color:rgba(0,0,0,1)
}
}
@-webkit-keyframes play { from {
background-position:0
}
to { background-position: -360px }
}
@keyframes play { from {
background-position:0
}
to { background-position: -360px }
}
@-webkit-keyframes Ani { 0% {
box-shadow:0 0 0 rgba(255,255,255,0);
border:1px solid rgba(255,255,255,0);
-webkit-transform:scale(0);
transform:scale(0)
}
70% {
box-shadow:0 0 50px rgba(255,255,255,1);
border:1px solid rgba(255,255,255,1);
-webkit-transform:scale(1);
transform:scale(1)
}
100% {
box-shadow:0 0 60px rgba(255,255,255,0);
border:0 solid rgba(255,255,255,0);
-webkit-transform:scale(1.5);
transform:scale(1.5)
}
}
@keyframes Ani { 0% {
box-shadow:0 0 0 rgba(255,255,255,0);
border:1px solid rgba(255,255,255,0);
transform:scale(0)
}
70% {
box-shadow:0 0 50px rgba(255,255,255,1);
border:1px solid rgba(255,255,255,1);
transform:scale(1)
}
100% {
box-shadow:0 0 60px rgba(255,255,255,0);
border:0 solid rgba(255,255,255,0);
transform:scale(1.5)
}
}
@-webkit-keyframes Opacity { 0%, 100% {
-webkit-transform:scale(1);
transform:scale(1);
opacity:1
}
25% {
-webkit-transform:scale(1.2);
transform:scale(1.2);
opacity:1
}
50% {
-webkit-transform:scale(.5);
transform:scale(.5);
opacity:.5
}
}
@keyframes Opacity { 0%, 100% {
transform:scale(1);
opacity:1
}
25% {
transform:scale(1.2);
opacity:1
}
50% {
transform:scale(.5);
opacity:.5
}
}
@-webkit-keyframes Zoom { 0% {
-webkit-transform:scale(0);
transform:scale(0)
}
80% {
-webkit-transform:scale(1.2);
transform:scale(1.2)
}
100% {
-webkit-transform:scale(1);
transform:scale(1)
}
}
@keyframes Zoom { 0% {
transform:scale(0)
}
80% {
transform:scale(1.2)
}
100% {
transform:scale(1)
}
}
@keyframes Rotate { from {
transform:rotate(0)translateZ(0)
}
to { transform: rotate(360deg)translateZ(0) }
}
@-webkit-keyframes Rotate { from {
-webkit-transform:rotate(0)translateZ(0)
}
to { -webkit-transform: rotate(360deg)translateZ(0) }
}
.fade-out { -webkit-animation: fadeOut .9s both ease; -moz-animation: fadeOut .9s both ease; animation: fadeOut .9s both ease }
.fade-in { -webkit-animation: fadeIn .9s both ease; -moz-animation: fadeIn .9s both ease; animation: fadeIn .9s both ease }
.slide-fade-out { z-index: 10; -webkit-animation: fadeOut .9s both ease; -moz-animation: fadeOut .9s both ease; animation: fadeOut .9s both ease }
.slide-fade-in { -webkit-animation: fadeIn .9s both ease; -moz-animation: fadeIn .9s both ease; animation: fadeIn .9s both ease }
.slide-backSlide-out { -webkit-animation: backSlideOut 1s both ease; -moz-animation: backSlideOut 1s both ease; animation: backSlideOut 1s both ease }
.slide-backSlide-in { -webkit-animation: backSlideIn 1s both ease; -moz-animation: backSlideIn 1s both ease; animation: backSlideIn 1s both ease }
.slide-goDown-out { -webkit-animation: scaleToFade .9s ease both; -moz-animation: scaleToFade .9s ease both; animation: scaleToFade .9s ease both }
.slide-goDown-in { -webkit-animation: goDown .9s ease both; -moz-animation: goDown .9s ease both; animation: goDown .9s ease both }
.slide-fadeUp-in { -webkit-animation: scaleUpFrom .9s ease both; -moz-animation: scaleUpFrom .9s ease both; animation: scaleUpFrom .9s ease both }
.slide-fadeUp-out { -webkit-animation: scaleUpTo .9s ease both; -moz-animation: scaleUpTo .9s ease both; animation: scaleUpTo .9s ease both }
@-webkit-keyframes empty { 0% {
opacity:1
}
}
@keyframes empty { 0% {
opacity:1
}
}
@-webkit-keyframes fadeIn { 0% {
opacity:0
}
100% {
opacity:1
}
}
@keyframes fadeIn { 0% {
opacity:0
}
100% {
opacity:1
}
}
@-webkit-keyframes fadeOut { 0% {
opacity:1
}
100% {
opacity:0
}
}
@keyframes fadeOut { 0% {
opacity:1
}
100% {
opacity:0
}
}
@-webkit-keyframes fadeOff { 0% {
opacity:1
}
100% {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
}
@keyframes fadeOff { 0% {
opacity:1
}
100% {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
-ms-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
}
@-webkit-keyframes fadeOn { 0% {
opacity:0
}
100% {
opacity:1;
margin-top:0
}
}
@keyframes fadeOn { 0% {
opacity:0
}
100% {
opacity:1;
margin-top:0
}
}
@-webkit-keyframes backSlideOut { 25% {
opacity:.5;
-webkit-transform:translateZ(-500px)
}
100%, 75% {
opacity:.5;
-webkit-transform:translateZ(-500px)translateX(-200%)
}
}
@-moz-keyframes backSlideOut { 25% {
opacity:.5;
-moz-transform:translateZ(-500px)
}
100%, 75% {
opacity:.5;
-moz-transform:translateZ(-500px)translateX(-200%)
}
}
@keyframes backSlideOut { 25% {
opacity:.5;
transform:translateZ(-500px)
}
100%, 75% {
opacity:.5;
transform:translateZ(-500px)translateX(-200%)
}
}
@-webkit-keyframes backSlideIn { 0%, 25% {
opacity:.5;
-webkit-transform:translateZ(-500px)translateX(200%)
}
75% {
opacity:.5;
-webkit-transform:translateZ(-500px)
}
100% {
opacity:1;
-webkit-transform:translateZ(0)translateX(0)
}
}
@-moz-keyframes backSlideIn { 0%, 25% {
opacity:.5;
-moz-transform:translateZ(-500px)translateX(200%)
}
75% {
opacity:.5;
-moz-transform:translateZ(-500px)
}
100% {
opacity:1;
-moz-transform:translateZ(0)translateX(0)
}
}
@keyframes backSlideIn { 0%, 25% {
opacity:.5;
transform:translateZ(-500px)translateX(200%)
}
75% {
opacity:.5;
transform:translateZ(-500px)
}
100% {
opacity:1;
transform:translateZ(0)translateX(0)
}
}
@-webkit-keyframes scaleToFade { to {
opacity:0;
-webkit-transform:scale(.8)
}
}
@-moz-keyframes scaleToFade { to {
opacity:0;
-moz-transform:scale(.8)
}
}
@keyframes scaleToFade { to {
opacity:0;
transform:scale(.8)
}
}
@-webkit-keyframes goDown { from {
-webkit-transform:translateY(-100%)
}
}
@-moz-keyframes goDown { from {
-moz-transform:translateY(-100%)
}
}
@keyframes goDown { from {
transform:translateY(-100%)
}
}
@-webkit-keyframes scaleUpFrom { from {
opacity:0;
-webkit-transform:scale(1.5)
}
}
@-moz-keyframes scaleUpFrom { from {
opacity:0;
-moz-transform:scale(1.5)
}
}
@keyframes scaleUpFrom { from {
opacity:0;
transform:scale(1.5)
}
}
@-webkit-keyframes scaleUpTo { to {
opacity:0;
-webkit-transform:scale(1.5)
}
}
@-moz-keyframes scaleUpTo { to {
opacity:0;
-moz-transform:scale(1.5)
}
}
@keyframes scaleUpTo { to {
opacity:0;
transform:scale(1.5)
}
}
@-webkit-keyframes fadeInUp { 0% {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
100% {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInUp { 0% {
opacity:0;
-webkit-transform:translate3d(0, 100%, 0);
-ms-transform:translate3d(0, 100%, 0);
transform:translate3d(0, 100%, 0)
}
100% {
opacity:1;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
}
@-webkit-keyframes fadeInRight { 0% {
opacity:0;
-webkit-transform:translate3d(-100%, 0, 0)
}
100% {
opacity:1;
-webkit-transform:none
}
}
@keyframes fadeInRight { 0% {
opacity:0;
transform:translate3d(-100%, 0, 0)
}
100% {
opacity:1;
transform:none
}
}
@-webkit-keyframes fadeOutRight { 0% {
opacity:1;
transform:none
}
100% {
opacity:0;
transform:translate3d(-100%, 0, 0)
}
}
@keyframes fadeOutRight { 0% {
opacity:1;
transform:none
}
100% {
opacity:0;
transform:translate3d(-100%, 0, 0)
}
}
@-webkit-keyframes fadeInLeft { 0% {
opacity:0;
-webkit-transform:translate3d(100%, 0, 0)
}
100% {
opacity:1;
transform:none
}
}
@keyframes fadeInLeft { 0% {
opacity:0;
transform:translate3d(100%, 0, 0)
}
100% {
opacity:1;
transform:none
}
}
@-webkit-keyframes fadeOutLeft { 0% {
opacity:1;
transform:none
}
100% {
opacity:0;
transform:translate3d(100%, 0, 0)
}
}
@keyframes fadeOutLeft { 0% {
opacity:1;
transform:none
}
100% {
opacity:0;
transform:translate3d(100%, 0, 0)
}
}
@-webkit-keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
100% {
opacity:1;
-webkit-transform:none;
transform:none
}
}
@keyframes fadeInDown { 0% {
opacity:0;
-webkit-transform:translate3d(0, -100%, 0);
-ms-transform:translate3d(0, -100%, 0);
transform:translate3d(0, -100%, 0)
}
100% {
opacity:1;
-webkit-transform:none;
-ms-transform:none;
transform:none
}
}
@-webkit-keyframes flipInX { 0% {
opacity:0;
-webkit-transform:scale(.5)
}
100% {
opacity:1;
-webkit-transform:scale(1)
}
}
@keyframes flipInX { 0% {
opacity:0;
transform:scale(.5)
}
100% {
opacity:1;
transform:scale(1)
}
}
@-webkit-keyframes flipInX1 { 0% {
opacity:0;
-webkit-transform:scale(0)
}
100% {
opacity:1;
-webkit-transform:scale(1)
}
}
@keyframes flipInX1 { 0% {
opacity:0;
transform:scale(0)
}
100% {
opacity:1;
transform:scale(1)
}
}
@-webkit-keyframes flipOutX1 { 0% {
opacity:1;
-webkit-transform:scale(1)
}
100% {
opacity:0;
-webkit-transform:scale(0)
}
}
@keyframes flipOutX1 { 0% {
opacity:1;
transform:scale(1)
}
100% {
opacity:0;
transform:scale(0)
}
}
.flipinx { -webkit-animation-name: flipInX; animation-name: flipInX; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -ms-animation-fill-mode: both; animation-fill-mode: both }
.fadeindown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; animation-duration: 1s; animation-fill-mode: both }
.fadeindown, .fadeinup { -webkit-animation-fill-mode: both; -webkit-animation-duration: 1s }
.fadeinup { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; animation-duration: 1s; animation-fill-mode: both }
.fadein { -webkit-animation-name: fadeIn; animation-name: fadeIn; animation-duration: 1s; animation-fill-mode: both }
.fadein, .fadeout { -webkit-animation-fill-mode: both; -webkit-animation-duration: 1s }
.fadeout { -webkit-animation-name: fadeOut; animation-name: fadeOut; animation-duration: 1s; animation-fill-mode: both }
.fadeoff { -webkit-animation-name: fadeOff; animation-name: fadeOff; -webkit-animation-duration: .3s; animation-duration: .3s; animation-fill-mode: both }
.fadeoff, .fadeon { -webkit-animation-fill-mode: both }
.fadeon { -webkit-animation-name: fadeOn; animation-name: fadeOn; -webkit-animation-duration: 1s; animation-duration: 1s; animation-fill-mode: both }
@media screen and (max-width:1480px) {
.pro-text p { max-width: 90% }
}
@media screen and (max-width:1480px)and (min-height:740px) {
.house-slide .house-box { width: 100%; height: 440px }
.house-slide .house-box .slide-item.loading { min-height: 360px }
.house-slide .house-box .slide-wrapper-outer { min-height: 380px }
.house-slide .house-box .item-pic { max-height: 360px }
.house-slide .house-box .item-box { margin: 10px 20px }
.house-slide { width: 90% }
}
@media screen and (max-width:1480px)and (max-height:720px) {
.house-slide .house-box { width: 100%; height: 480px }
.house-slide .house-box .slide-wrapper-outer { min-height: 420px }
.house-slide .house-box .slide-item.loading { min-height: 400px }
.house-slide .house-box .item-pic { max-height: 400px }
.house-slide .house-box .item-box { margin: 10px 20px }
.house-slide { width: 90% }
}
@media screen and (max-width:1380px) {
.nav li a h1 { padding: 0 10px }
.product-slide .slide-prev { position: absolute; width: 50px; height: 50px; left: -60px; top: -60% }
.product-slide .slide-next { position: absolute; width: 50px; height: 50px; right: -60px; top: -60% }
}
@media screen and (max-width:1380px)and (max-height:720px) {
.house-slide .house-box { height: 400px }
.house-slide .house-box .slide-wrapper-outer { min-height: 390px }
.house-slide .house-box .item-pic { max-height: 370px }
}
@media screen and (max-width:1300px) {
.nav li a h1 { font-family: MyriadCondensed }
.sub-name { font-size: 17px }
.pro-text p { font-size: 13px }
.name { font-size: 40px; height: 40px }
.name.name-product-group-new { font-size: 16px; height: 16px }
}
@media screen and (max-width:1300px)and (max-height:720px) {
.house-slide .house-box { width: 100%; height: 390px }
.house-slide .house-box .slide-item.loading { min-height: 360px }
.house-slide .house-box .slide-wrapper-outer { min-height: 380px }
.house-slide .house-box .item-pic { max-height: 360px }
}
@media screen and (max-width:1200px)and (max-height:720px) {
.house-slide .house-box { width: 100%; height: 350px }
.house-slide .house-box .slide-item.loading { min-height: 320px }
.house-slide .house-box .slide-wrapper-outer { min-height: 340px }
.house-slide .house-box .item-pic { max-height: 320px }
}
@media screen and (max-width:1100px) {
.logo span, a.language:hover, a.search.active, a.search:hover { opacity: 1 }
.scroll-next:hover, .scroll-prev:hover, .search-form, a.search { box-shadow: none }
.block-news .link-page:nth-child(1):hover h3, .block-news .link-page:nth-child(1):hover p, .form-row-search input[type=text], .hotline a:hover, .nav li.current a h1 { color: #fff }
html { -webkit-text-size-adjust: 100% }
.scroll-down-desktop { display: none; z-index: -99999 }
.nav, .nav li, .nav li a h1, .top, table { display: block }
table { width: 100%; overflow-x: auto; overflow-y: hidden; margin: 20px auto }
.header>*, .navigation>*, .scroll-nav>*, table>* { -webkit-transform: translate3d(0, 0, 0); -webkit-transform: translateZ(0) }
.hotline a { -webkit-transition: none; transition: none }
.hotline span{display: none;}
.logo.auto-play { -webkit-animation: none; animation: none }
.top { width: 0; position: absolute; height: auto; left: auto; right: 0; top: 83px; z-index: 99999; transition: width .3s ease-in-out; -webkit-transition: width .3s ease-in-out }
.top.show { width: 260px!important }
.facilities-nav { position: relative; left: auto; top: auto; right: auto; height: 72px; background-color: #656565; width: 100% }
a.language { top: -62px; right: 15px; position: absolute; margin: 0; transition: none; -webkit-transition: none }
a.search { position: absolute; top: 16px; left: 0; background: url(../images/search2.png)no-repeat; width: 40px; height: 40px; transition: none }
.search-form, a.search { -webkit-transition: none }
.bg-cover, .navigation { top: auto; left: auto; position: relative }
.search-form { top: 14px; right: auto; left: 40px; transition: none; -webkit-border-radius: 10px; border-radius: 10px; width: 80%!important; opacity: 1!important; background-color: rgba(0,0,0,.3); border: none }
.form-row-search { width: 100%!important }
a.link-home { margin: 5px auto; transition: none; -webkit-transition: none }
a.link-home:not(.current):hover { background-position: center top }
.navigation { right: auto; line-height: inherit; background-color: #001b42; width: 100%; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch }
.nav { width: 100%; padding-bottom: 40px }
.nav li { width: 100%; line-height: 50px; background-color: #fff; margin: 1px 0 0 }
.nav li.current { background-color: #f2b819 }
.nav li a h1, .nav li:not(.current):hover a h1 { color: #001b42 }
.nav li a h1 { width: 100%; padding: 0 20px; font-family: avantgarde-demi; font-size: 16px; transition: none; -webkit-transition: none; text-align: center }
.close-pics, .nav li:after, .slide-buttons { display: none }
.social a { transition: none!important; -webkit-transition: none!important }
.social a:hover { opacity: 1 }
.footer-nav { padding: 15px 0 }
.footer-nav li { margin: 0 5px }
.footer-nav li a h1 { transition: none; -webkit-transition: none }
.footer-nav li:not(.current) a:hover { background-color: inherit }
.go-top:hover { box-shadow: 0 0 20px rgba(0,0,0,.1) }
.copyright { padding: 15px 5% }
.bg-cover { background-position: center center; background-attachment: scroll; -webkit-background-size: cover; background-size: cover; z-index: auto }
.all-pics { overflow: hidden }
.all-pics.show { background: url(../images/pinchzoom.html)left top no-repeat; background-color: rgba(97,103,109,1) }
.full.lock, .full2.lock { overflow-x: hidden }
.all-pics .text-length h3 { font-size: 20px; line-height: 26px; padding: 10px 20px }
.all-pics .text-length p { font-size: 16px; line-height: 22px }
.video-skin { width: 100%; height: 80%; top: 15% }
.album-pic-center img { max-width: 90%; max-height: 90% }
.close-album { right: auto; top: auto; left: 50%; margin-left: -20px; bottom: 73px; position: absolute; width: 40px; height: 40px; background-size: cover }
.close { right: 10px; top: 10px; width: 50px; height: 50px; position: absolute }
.popup-pics-mobile, .popup-pics-mobile img { display: block; width: 100%; position: relative }
.close-pics-small { display: block }
.close-video { right: auto; left: 50%; top: 10px; margin-left: -30px }
.go-top { -webkit-transition: none; transition: none; background: url(../images/top.png)center center no-repeat; width: 40px; height: 40px; bottom: 20px; right: 20px; background-color: rgba(0,0,0,.2); box-shadow: 0 0 30px transparent }
.bg-page { background-position: center center; background-attachment: scroll; position: relative; left: auto; top: auto; z-index: auto; -webkit-background-size: cover; background-size: cover }
.view-album, .zoom { width: 50px; height: 50px; right: 20px; top: 20px; -webkit-transition: none; transition: none }
.color-show { -webkit-transition: none; transition: none }
.popup-pics { display: none; z-index: -99999 }
.popup-pics-mobile { height: 0; text-align: center; z-index: auto; -webkit-transition: height 600ms ease; transition: height 600ms ease; overflow: hidden }
.popup-pics-mobile img { height: auto; z-index: 1; opacity: 0 }
.popup-pics-mobile.loading { background: url(../images/ajaxloader.gif)center center no-repeat; min-height: 150px }
.close-popup-mobile { background: url(../images/close_s.png)center center no-repeat; width: 40px; height: 40px; position: absolute; right: 20px; top: 20px; z-index: 999999; -webkit-border-radius: 50%; border-radius: 50%; display: block; border: 1px solid rgba(255,255,255,.5); background-color: rgba(0,0,0,.5) }
.slider-home .slide-controls { bottom: 10px; right: auto; width: 100%; text-align: center }
.slide-controls { height: auto }
.slide-controls .slide-page { width: 16px; height: 16px }
.slide-controls .slide-page span { width: 8px; height: 8px; margin: 3px }
.next-pic, .prev-pic, .slide-next, .slide-prev { height: 40px; width: 40px }
.next-pic, .prev-pic { display: none }
.block-pro-pic, .block-pro-text { width: 90%; float: none; display: block }
.slide-pic-nav { top: auto; margin-top: 0; bottom: 60px; left: 0 }
.next-pic { right: 10px; opacity: .5 }
.prev-pic { left: 10px; opacity: .5 }
.next-pic.disable, .prev-pic.disable { opacity: .2 }
.nav-scroll ul li { transition: none; -webkit-transition: none }
.nav-scroll ul li:not(.current):hover { opacity: .5 }
.block, .block-news, .block-pro-wrap { opacity: 1!important }
.scroll-next, .scroll-prev { transition: none; -webkit-transition: none }
.block-pro-content { background-image: none }
.detail-pic, .detail-text { background-image: none!important }
.bg-title h2 { font-size: 30px; text-align: center; line-height: 36px }
.link-detail { transition: none; -webkit-transition: none }
.link-detail:hover { background-color: #e7bc1e }
.block-news { text-align: center }
.block-news .link-page { width: 50%; max-width: none; float: left; margin: 0 auto }
.block { width: 50% }
.block-news:before { top: -90px; left: 30px }
.block-news .link-page, .block-news .link-page h3, .block-news .link-page p, .block-news .link-page span.white { transition: none!important; -webkit-transition: none!important }
.block-news .link-page:nth-child(1):hover, .block-news .link-page:nth-child(1):hover span.white { background-color: #001b42 }
.block-news .link-page:nth-child(2):hover, .block-news .link-page:nth-child(2):hover span.white { background-color: #f2b819 }
.block-news .link-page:nth-child(2):hover h3, .block-news .link-page:nth-child(2):hover p { color: #0a0a0a }
.block a { transition: none; -webkit-transition: none }
.block:hover a { border: 0 }
.block-pro-text { padding: 0; margin: 0 auto }
.block-pro-pic { margin: 0 auto }
.about-box.company :after, .about-box.company :before, .sub-nav { display: none }
.about-box { text-align: center }
.bg-about { transition: none; -webkit-transition: none }
.detail-text h3 img { height: 100px }
.about-box.company .about-info { position: relative; left: auto; bottom: auto }
.about-box.oexpo .about-info { position: relative; right: auto; bottom: auto }
.about-box.company .about-info, .about-box.expo .about-info, .about-box.oexpo .about-info { width: 100%; margin: 0 auto; text-align: center; padding: 80px 0; max-width: inherit; display: none }
.detail-text p { text-shadow: 1px 1px 2px rgba(0,0,0,.7) }
.about-box.company .detail-text { width: 100% }
.about-info.hide { opacity: 1 }
.about-box.company .detail-box:before, .about-box.company detail-box:after, .about-box.expo .detail-text:after, .about-box.expo .detail-text:before, .about-box.oexpo .detail-text:after, .about-box.oexpo .detail-text:before { left: auto; top: auto; height: auto!important; width: auto!important; display: block!important; content: normal; clear: both }
.about-box.company:after, .about-box.company:before { display: none }
.detail-box { position: relative; left: auto; top: auto; opacity: 1!important; text-align: center; background-color: rgba(0,0,0,.6)!important; width: 100%; height: auto!important; display: block; margin: 0; float: left; clear: both }
.fengshui-list, .wrap-fengshui { width: 90%; margin: 0 auto }
.detail-box:after, .detail-box:before { display: none!important }
.detail-text { float: none!important; width: 100%; padding: 30px 5%; display: inline-block; vertical-align: top }
.detail-pic { float: none!important; display: block; padding: 0 5% 30px; position: relative!important; width: 100%!important }
.detail-text h3 { text-align: center; color: #fff; font-size: 18px }
.detail-text h4, .detail-text p { color: #fff; font-size: 16px }
.detail-text .inner { text-align: center }
.detail-pic img { width: 100%; height: auto; max-width: 400px; display: block; margin: 0 auto }
.close-about, .detail-text:after, .detail-text:before { display: none!important }
.scrollD { padding: 0; width: 100%; height: auto }
.about-box.company .detail-text { max-width: inherit; height: auto; vertical-align: top }
.about-box.expo .detail-pic, .about-box.oexpo .detail-pic { z-index: auto; float: none }
.about-box.company .detail-box.hide { opacity: 1!important; -webkit-transform: scale(1)!important; transform: scale(1)!important }
.about-box.expo .detail-box.hide, .about-box.oexpo .detail-box.hide { opacity: 1!important; -webkit-transform: translate3d(0, 0, 0)!important; transform: translate3d(0, 0, 0)!important }
.fengshui-content { padding: 0; opacity: 1 }
.fengshui-box { padding: 0 0 30px; width: 100%; top: auto }
.fengshui-title h2, .fengshui-title h2 a { transition: none; -webkit-transition: none }
.fengshui-title h2.active { border: 1px solid #00193e }
.fengshui-title h2.active a { background-color: #00193e }
.fengshui-title h2:not(.active):hover { border: 1px solid #e7bc1e }
.fengshui-title h2:not(.active):hover a { background-color: #e7bc1e }
.fengshui-load { margin: 20px 5px 0 }
.detail-fengshui h3 { font-size: 20px; line-height: 26px }
.link-page h3, .link-page p { font-size: 14px; line-height: 18px }
.fengshui-cate li, .fengshui-cate li a { transition: none; -webkit-transition: none }
.fengshui-cate li.iron:not(.active):hover { border: 1px solid #fff }
.fengshui-cate li.wood:not(.active):hover { border: 1px solid #74aa00 }
.fengshui-cate li.water:not(.active):hover { border: 1px solid #006cb7 }
.fengshui-cate li.fire:not(.active):hover { border: 1px solid #b00000 }
.fengshui-cate li.land:not(.active):hover { border: 1px solid #daa900 }
.fengshui-cate li.iron:not(.active):hover a { background-color: #fff; color: #484848 }
.fengshui-cate li.wood:not(.active):hover a { background-color: #74aa00; color: #fff }
.fengshui-cate li.water:not(.active):hover a { background-color: #006cb7; color: #fff }
.fengshui-cate li.fire:not(.active):hover a { background-color: #b00000; color: #fff }
.fengshui-cate li.land:not(.active):hover a { background-color: #daa900; color: #fff }
.fengshui-list .link-page:not(.current):hover, .fengshui-list .link-page:not(.current):hover span.white { background-color: #fff }
.fengshui-list .link-page:not(.current):hover h3 { color: #010101 }
.fengshui-list .link-page:not(.current):hover p { color: #666 }
.news-content { padding: 0; opacity: 1 }
.agent-content, .column-item, .column-name, .contact-wrap, .house-slide, .house-title, .product-slide, .product-wrap { opacity: 1!important }
.news-box { padding: 0 5% 30px; width: 100%; top: auto }
.news-cate li, .news-cate li a { transition: none; -webkit-transition: none }
.news-cate li a { width: auto; padding: 10px 20px }
.news-cate li:not(.active):hover { border: 1px solid #00193e }
.news-cate li:not(.active):hover a { background-color: #00193e }
.list-link .slide-buttons .slide-next, .list-link .slide-buttons .slide-prev { display: none }
.list-link { top: auto }
.list-link.slide-slidebox .slide-wrapper-outer { overflow: visible }
.news-load { margin-top: 20px }
.link-page { height: 110px; -webkit-transition: none; -moz-transition: none; -o-transition: none; -ms-transition: none }
.link-page h3 { -webkit-transition: none; transition: none }
.link-page p { transition: none; margin: 0 10px 5px 5px }
.link-page p, span.white { -webkit-transition: none }
span.white { -moz-transition: none; -o-transition: none; -ms-transition: none }
.pic-thumb { max-width: 110px; height: 90px }
.pic-thumb.no-img { line-height: 90px; background-color: #001b42 }
.pic-thumb.no-img img { width: 100%; height: auto; max-width: 130px; max-height: 90px; display: inline-block; vertical-align: middle }
.detail-news h3 { font-size: 20px; line-height: 26px }
.link-page:not(.current):hover, .link-page:not(.current):hover span.white { background-color: #fff }
.link-page:not(.current):hover h3 { color: #010101 }
.link-page:not(.current):hover p { color: #666 }
.title-left { margin-top: -47px; padding: 20px 44px 20px 24px }
.title-left p { font-size: 18px; line-height: 18px }
.title-left h2 { font-size: 36px; line-height: 36px }
.title-right { margin-top: -47px; padding: 20px 24px 20px 44px }
.title-right p { font-size: 18px; line-height: 18px }
.title-right h2 { font-size: 36px; line-height: 36px }
.title-left h2:before, .title-right h2:before { display: none }
#product-detail-page .title-right { margin-top: -47px; padding: 20px 44px 20px 24px }
#product-detail-page .title-right p { font-size: 18px; line-height: 18px }
#product-detail-page .title-right h2 { font-size: 36px; line-height: 36px }
.expo-oil .pro-item { width: 98% }
.sub-name { font-size: 16px }
.pro-text p { font-size: 14px }
.name { font-size: 35px; height: 35px }
.name.name-product-group-new { font-size: 14px; height: 14px }
.pro-link { font-size: 16px; transition: none; -webkit-transition: none }
.oexpo .slide-item:nth-child(odd) .pro-link:hover { color: #000!important }
.oexpo .slide-item:nth-child(even) .pro-link:hover { color: #fff!important }
.expo .slide-item:nth-child(even) .pro-link:hover { color: #000!important }
.expo .slide-item:nth-child(odd) .pro-link:hover, .expo-oil .pro-link:hover { color: #fff!important }
.pro-item a { transition: none; -webkit-transition: none }
.pro-item:hover a { border: 0 }
.expo-oil .pro-item:hover .pro-text { border-radius: 10px; -webkit-border-radius: 10px }
.column-name { transition: none; transform: none }
#product-list-page .pro-pic, #product-slide-page .pro-pic { max-height: inherit }
.expo .product-note, .expo-oil .product-note, .oexpo .product-note { float:none; width: 100% }
.btn-back { transition: none; -webkit-transition: none }
.btn-back.oexpo:hover { background-color: #00193e; color: #fff }
.btn-back.expo:hover { background-color: #e7bc1e; color: #fff }
.btn-back.oil:hover { background-color: #55010a; color: #fff }
.house-slide .house-box { width: 100%; height: auto }
.house-slide .house-box.slide-slidebox .slide-item { float: left; display: block; vertical-align: top; margin: 0 }
.contact-form, .contact-info { width: 100%; float: none }
.house-slide .house-box .item-box { margin: 5px 10px }
.house-slide .house-box .item-pic { max-height: 240px }
.house-slide .house-box .slide-wrapper-outer { min-height: inherit }
.house-slide .house-box .slide-item.loading { min-height: 230px }
.house-title h2 { font-size: 30px }
.input-but { text-align: center }
.agent-wrap>* { -webkit-transform: translate3d(0, 0, 0); -webkit-transform: translateZ(0) }
.agent-wrap { width: 90%; overflow: hidden; overflow-x: scroll; -webkit-overflow-scrolling: touch }
.agent-head { width: 90%; padding-bottom: 10px }
table.agent { display: table }
.agent-head h2 { padding-left: 0 }
table.agent tr td.t-shop { line-height: 24px; text-align: center }
.link-agent { margin: 5px auto; display: block; max-width: 82px; float: none; transition: none; -webkit-transition: none }
.link-agent:hover { background-color: #f2b819 }
.agent-search select { top: -10px }
.contact-content { background-attachment: scroll; padding: 30px 0; background-position: center center }
.contact-info li a { transition: none; -webkit-transition: none }
.contact-info li a:hover { color: #fff }
input[type=button], input[type=reset] { transition: none; -webkit-transition: none; margin: 0 5px; font-size: 18px; line-height: 24px }
input[type=button]:hover, input[type=reset]:hover { background-color: #e7bc1e }
.all-agent { width: 90%; margin: 50px 5%; position: relative; left: auto; top: auto; padding: 60px 30px 30px }
.close-agent { right: auto; left: 50%; margin-left: -20px; width: 40px; height: 40px }
.input-area textarea, .input-text input[type=text] { background-color: rgba(255,255,255,.7) }
}


.pm-phoimau{
    padding: 108px 0 25px 0;
    max-width: 1000px;
    margin: 0 auto;
    background: #fff;
}
.pm-phoimau h3{
    background: rgba(0,25,62,1);
    color: #fff;
    padding: 10px 10px;
}
.phoi-mau{
    display: block;
    margin: 20px;
}
.phoi-mau p{
    margin-bottom: 10px;
}
.anh-congtrinh{
    position: relative;
    overflow: hidden;
    width: 100%;
}
.anh-full{
    position: relative; 
    z-index: 5; 
    max-width:100%;
}
.phoi-mau button{
    border: 1px solid #ddd;
    padding: 8px 15px;
    background: rgba(0,25,62,1);
    color: #fff;
    margin-top: 36px
}

.phoimau-nen{
    position: absolute;
    top: 0 ; left: 0;
    width: 1135px;
    height: 900px;
    background-repeat: no-repeat;
    background-blend-mode: multiply;
    mix-blend-mode: multiply;
}
.phoimau-nen:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1135px;
    height: 900px;
    background-size:100%;
}
.phoimau-chi{
    position: absolute;
    top: 0 ; left: 0;
    width: 1135px;
    height: 900px;
    background-repeat: no-repeat;
    background-blend-mode: multiply;
    mix-blend-mode: multiply;
}
.phoimau-chi:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 1135px;
    height: 900px;
    background-size:100%;
}
/*.nen-congtrinh{
    position: absolute;
    top: 0 ; left: 0;
    width: 1135px;
    height: 900px;
}*/
.select-color{
    margin: 10px 30px 10px 0;
    float: left;
}
.select-color input{
    width: 120px;
    height: 90px;
}
.select-color select{
    padding: 6px 10px;
    height: 32px;
    border: 1px solid #bbb;
}

#phoimau-nen1{
    background-color: #f7f3da;
}
#phoimau-nen1:before {
    background: url(../images/chi.png) no-repeat;
}
#phoimau-chi1{
    background-color: #c4aa84;
}
#phoimau-chi1:before {
    background: url(../images/nen.png) no-repeat;
}

#phoimau-nen2{
    background-color: #fffff7;
}
#phoimau-nen2:before {
    background: url(../images/chi2.png) no-repeat;
}
#phoimau-chi2{
    background-color: #996650;
}
#phoimau-chi2:before {
    background: url(../images/nen2.png) no-repeat;
}


#phoimau-nen3{
    background-color: #e7ffd1;
}
#phoimau-nen3:before {
    background: url(../images/chi3.png) no-repeat;
}
#phoimau-chi3{
    background-color: #a6c468;
}
#phoimau-chi3:before {
    background: url(../images/nen3.png) no-repeat;
}


#phoimau-nen4{
    background-color: #AADEEC;
}
#phoimau-nen4:before {
    background: url(../images/chi4.png) no-repeat;
}
#phoimau-chi4{
    background-color: #72B8DA;
}
#phoimau-chi4:before {
    background: url(../images/nen4.png) no-repeat;
}


#phoimau-nen5{
    background-color: #fffff7;
}
#phoimau-nen5:before {
    background: url(../images/chi5.png) no-repeat;
}
#phoimau-chi5{
    background-color: #6b5756;
}
#phoimau-chi5:before {
    background: url(../images/nen5.png) no-repeat;
}


#phoimau-nen6{
    background-color: #fcf7d6;
}
#phoimau-nen6:before {
    background: url(../images/chi6.png) no-repeat;
}
#phoimau-chi6{
    background-color: #dbb176;
}
#phoimau-chi6:before {
    background: url(../images/nen6.png) no-repeat;
}

@media screen and (max-width:1023px) {
.sub-name { font-size: 16px; padding: 5px 0 0 10px }
.name { font-size: 30px; height: 30px }
.name.name-product-group-new { font-size: 14px; height: 14px }
.pro-text p { font-size: 14px }
.pro-link { font-size: 18px }
.anh-congtrinh{width: 600px;}
.phoimau-nen, .phoimau-nen:before, .phoimau-chi, .phoimau-chi:before {
    background-size: 600px 476px !important;
}
}
@media screen and (max-width:820px) {
.agent-title h2, .product-title h2, .product-title h3 { text-align: center }
.agent-search, .agent-title, .product-pic, .product-text { display: block; float: none }
.nav-wrap { width: 80%; bottom: 10px }
.close-album { bottom: 90px }
.detail-text h3 { font-size: 30px }
.caption { display: none }
.product-text { width: 100%; padding-left: 0; padding-right: 0; margin: 0 }
.product-pic { width: 50%; padding: 0; margin: 0 auto 30px }
.agent-search, .product-pic img { margin: 0 auto }
.product-title h3 { font-size: 16px }
.title-left, .title-right { -webkit-transform: scale(.9); transform: scale(.9); top: 55% }
.house-slide .house-box .item-pic { max-height: 220px }
.agent-content { top: -100px }
.agent-title { width: 100% }
.agent-title h2 { font-size: 40px }
.contact-info h2 { font-size: 40px; line-height: 42px }
.agent-search { height: 50px; width: 260px }
.agent-search span { line-height: 50px }
.phoi-mau button{margin-top:0;}
}
@media screen and (max-width:720px) {
.house-slide .house-box .item-pic { max-height: inherit }
.fengshui-load, .news-load { width: 98.8% }
.pic-thumb { max-width: 100px; height: 90px }
.title-left, .title-right { -webkit-transform: scale(.8); transform: scale(.8); top: 60% }
}
@media screen and (max-width:620px) {
.product-title h2 { font-size: 50px }
.footer-nav li { margin: 0 5px; width: 130px; vertical-align: top }
.block-news .link-page { width: 100% }
.anh-congtrinh{width: 328px;}
.phoimau-nen, .phoimau-nen:before, .phoimau-chi, .phoimau-chi:before {
    background-size: 328px 260px !important;
}
}
@media screen and (max-width:619px) {
.agent-title h2, .column:nth-child(3) p { text-align: center }
.social { padding: 15px 0 }
.column { padding: 0!important; border: none!important; margin: 5px!important; min-height: inherit }
.block { width: 100%; height: auto; padding: 20% 0 }
.column-item { float: none!important; width: 100%!important; margin: 0 auto }
.column-item .pro-pic { width: 70%; margin: 0 auto }
.agent-title h2 { font-size: 30px }
.contact-info h2 { font-size: 30px; line-height: 32px }
}
@media screen and (max-width:530px) {
.nav-wrap { width: 70% }
.hotline { display: none }
.footer-nav li a h1 { font-family: MyriadCondensed; font-weight: 400 }
.bg-title h2 { font-size: 20px; line-height: 26px }
.wrap-list, .wrap-news { width: 100% }
.detail-news h3 { font-size: 15px; line-height: 22px }
.news-text { font-size: 15px; line-height: 24px }
.pic-thumb { max-width: 90px; height: 90px }
.pic-thumb.no-img { line-height: 90px; background-color: #001b42 }
.pic-thumb.no-img img { width: 100%; height: auto; max-width: 100px; max-height: 90px; display: inline-block; vertical-align: middle }
.link-page h3, .link-page p { font-size: 13px; line-height: 18px }
.title-right { transform: scale(.7); top: 70%; right: -20px }
.title-left, .title-right { -webkit-transform: scale(.7) }
.title-left { transform: scale(.7); top: 70%; left: -20px }
.product-title h2 { font-size: 30px }
.expo .product-note, .expo-oil .product-note, .oexpo .product-note { padding: 30px 20px }
.product-text p { font-size: 16px }
}
@media screen and (max-width:519px) {
.block-pro-title h2 { font-size: 50px; line-height: 50px }
.block h2 { font-size: 20px; line-height: 26px }
.fengshui-title h2 a, .news-cate li a { font-size: 24px }
.fengshui-title { top: -34px }
.fengshui-cate { margin: 0 }
.fengshui-cate li { width: 52px; height: 52px; margin: 0 1px }
.fengshui-cate li a { line-height: 40px; font-size: 17px }
}
@media screen and (max-width:420px) {
.block-news:before { transform: scale(.8); -webkit-transform: scale(.8); left: 0 }
.product-pic { width: 70% }
.all-agent { width: 100%; margin: 50px 0; padding: 50px 20px 20px }
.agent-title h2 { font-size: 26px }
}