/* Reset ----------------------------------------------------------------------------------------------------*/ * { margin:0; padding:0; border:0;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;} body{ font-size:14px; background:#FFFFFF; font-weight:normal; color:#393939; font-family: 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; /*min-width:1140px;*/ } html, div, p, ul, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, form, input, select, button, textarea, iframe, table, th, td { margin: 0; padding: 0; } table { width:100%; border-collapse:collapse; border-spacing:0; } table, th, td { border:0; margin: 0; padding: 0;} img { border: 0 none; vertical-align: top; width:auto; max-width: 100%;} /*ul { list-style-type:none;} CMS issue */ li { list-style-type:inherit; } button { cursor: pointer; } input{font-family: 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif;} ::placeholder{color: #999;opacity: 1} /* for Firefox */ a, a:link { text-decoration: none; color:#005880;} a:hover {color:#0b2653;} .fixed:after { content: "."; display: block; clear: both; height: 0; visibility: hidden; } .fixed { display: block; min-height: 1%; } _html .fixed { height: 1%; } .clear { display: block!important; float: none!important; clear: both; overflow: hidden; width: auto!important; height: 0!important; margin: 0 auto!important; padding: 0!important; font-size: 0; line-height: 0; } .fl, .fr { display: inline; float: left; } .fr { float: right; } .font-osc { font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .center { text-align: center !important; } .nomargin { margin: 0 !important; } #hiddenSearchInput { display: none; } /* `Grid ----------------------------------------------------------------------------------------------------*/ .wrap { max-width:100%; position:relative; margin:0 auto; padding:0 20px; width:1236px; } .col1, .col2, .col3, .col4, .col5, .col6, .col7, .col8, .col9, .col10, .col11, .col12 { float: left; margin-right: 2.7118644%; } .col1 { width: 5.8474576%; } .col2 { width: 14.4067796%; } .col3 { width: 22.9661016%; } .col4 { width: 31.5254236%; } .col5 { width: 40.0847456%; } .col6 { width: 48.6440676%; } .col7 { width: 57.2033896%; } .col8 { width: 65.7627116%; } .col9 { width: 74.3220336%; } .col10 { width: 82.8813556%; } .col11 { width: 91.4406776%; } .col12 { width: 99.9999996%; margin-right: 0; } .last { margin-right: 0; } .push0 {margin-left:0%;} .push1 {margin-left:8.559322%;} .push2 {margin-left:17.118644%;} .push3 {margin-left:25.677966%;} .push4 {margin-left:34.237288%;} .push5 {margin-left:42.79661%;} .push6 {margin-left:51.355932%;} .push7 {margin-left:59.915254%;} .push8 {margin-left:68.474576%;} .push9 {margin-left:77.033898%;} .push10 {margin-left:85.59322%;} .push11 {margin-left:94.152542%;} .pull0 {margin-right:0%;} .pull1 {margin-right:8.559322%;} .pull2 {margin-right:17.118644%;} .pull3 {margin-right:25.677966%;} .pull4 {margin-right:34.237288%;} .pull5 {margin-right:42.79661%;} .pull6 {margin-right:51.355932%;} .pull7 {margin-right:59.915254%;} .pull8 {margin-right:68.474576%;} .pull9 {margin-right:77.033898%;} .pull10 {margin-right:85.59322%;} .pull11 {margin-right:94.152542%;} .col1 img, .col2 img, .col3 img, .col4 img, .col5 img, .col6 img, .col7 img, .col8 img, .col9 img, .col10 img, .col11 img, .col12 img { width: 100%; height: auto; display: block; } .tabletOnly { display: none; } .mobileVisible { display: none; } /* Common ----------------------------------------------------------------------------------------------------*/ body .overlayWrap { display: none; width: 100%; position: fixed; background-color: rgba(30,30,30,0.9); height: 100%; z-index: 100; left: 50%; top: 0; transform: translate(-50%, 0); } body.menuOn { overflow: hidden; } #header { width:100%;background:#FFF;font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif;position: relative;} #header > .wrap {/*max-width:none;*/ min-height: 105px; width: 100%; transition: all ease-in-out 0.3s; } #header:after{content:'';clear:both;display:block;} #header .logo{top: 16%; left: 0; position: absolute; width: 236px; height: 80px; background-image: url(/share/images/logo.svg); background-repeat: no-repeat; background-size: 100% 100%; transition: all ease-in-out 0.3s;} #header .logo #hktdcdg{display: block;float: left;width: 236px;height: 80px;} /**top 18-2-2022**/ #header #navigation{display:none;vertical-align: middle;width: 100%;top:0;left: 0;background-color: rgba(255,255,255, 0.85);position: absolute;z-index: 998;overflow: auto;} #header #navigation ul:after{content:'';clear:both;display:block;} #header #navigation ul {width: 100%;margin: 0 auto;} #header #navigation > ul {width: 580px;margin: 0 auto 20px;min-height: 85vh; max-height: 85vh;} #header #navigation > ul > li{border-bottom: 2px solid #d6d6d6;position: relative;} #header #navigation > ul > li:last-child {border-bottom: 0;margin-bottom: 50px;} #header #navigation > ul > li.dropdown::before { content: ""; width: 0; height: 0; border-style: solid; border-width: 6px 5px 0 5px; border-color: #000000 transparent transparent transparent; position: absolute; right: 0; top: 24px; } #header #navigation > ul > li.dropdown.active > a { color: #EB792A; } #header #navigation > ul > li.dropdown.active::before { content: ""; width: 0; height: 0; border-style: solid; border-width: 0 5px 6px 5px; border-color: transparent transparent #EB792A transparent; position: absolute; right: 0; top: 24px; } #header #navigation > ul > li.dropdown.active > ul { display: block; } #header #navigation ul li{list-style: none;position: relative;} #header #navigation ul li > a{padding: 10px 15px 10px 0;font-size:22px;display: block;color:#1b1b1b;transition:0.1s linear background-color;position: relative;letter-spacing: 1px;} #header #navigation ul li > a:hover{color:#EA7A29;} html[lang="zh-cn"] #header #navigation ul li > a { color: #49494b; } html[lang="zh-cn"] #header #navigation ul li > a:hover{color:#EA7A29;} #header #navigation ul li > ul{position: relative;left: 0;z-index: 10;min-width: 260px;top:100%;display:none;padding-right:0;border-top: 2px solid #DEDAD7;} #header #navigation ul li > ul li{margin:0;width:100%;text-align: left;} #header #navigation ul li > ul li > a{padding:10px 15px; font-size: 14px; background-color: #d5d5d5; margin: 10px 0; font-family: 'Open Sans'; letter-spacing: 0;} #header .lang{display:inline-block;vertical-align: middle;margin-left:10px;} #header .lang a{display: inline-block;vertical-align: middle;font-size: 16px;color: #1b1b1b;margin: 0 5px;border: 1px solid rgba(0,0,0,0.2);border-radius: 20px;width: 35px;height: 35px;text-align: center;line-height: 35px;} #header .mainMenuHeader { display: block; margin: 40px auto; height: 50px; width: 580px; z-index: 999; position: relative; font-size: 15px; padding: 10px 0; } #header .mainMenuHeader a { color: #1b1b1b; } #header .mainMenuHeader .cnOnlineShop { float: left; text-align: center; } #header .mainMenuHeader .cnOnlineShop a { color: #ffffff; width: auto; background-color: #EA7A29; border-radius: 5px; padding: 2px 10px; display: block; line-height: 2; text-transform: uppercase; font-family: 'Open Sans'; font-size: 14px;} #header .mainMenuHeader .btnGroup { height: 100%; width: calc(100% - 320px); float: right; text-align: right; line-height: 1.2;} #header .mainMenuHeader .btnGroup a.btnEnquire { background-image: url(/share/images/enquiryIcon.svg); background-repeat: no-repeat; background-size: 25px; padding-left: 35px; font-size: 15px; font-family: 'Open Sans'; height: 20px; display: inline-block; line-height: 1.5; } #header .mainMenuHeader .btnGroup a.btnLang { padding: 2px 0 2px; margin: 0 5px; } #header .mainMenuHeader .btnGroup a.btnLang.active { color: #EA7A29; } #header .mainMenuHeader .btnGroup a.btnLangEn { font-family: 'Open Sans'; font-size: 15px; } #header .mainMenuHeader .btnGroup a.btnIcon { width: 30px; height: 20px; display: inline-block; vertical-align: text-bottom; text-indent: -9999px; background-position: center center; background-size: contain; background-repeat: no-repeat; } #header .mainMenuHeader .btnGroup a.btnIcon.fb { background-image: url(/share/images/fb_icon.svg); width: 20px; background-size: auto; } #header .mainMenuHeader .btnGroup a.btnIcon.ig { background-image: url(/share/images/ig_icon.svg); } #header .mainMenuHeader .btnGroup a.btnIcon.sina { background-image: url(/share/images/sina_icon.svg); } #header .mainMenuHeader .btnGroup a.btnIcon.wechat { background-image: url(/share/images/wechat_icon.svg); } #header .mainMenuHeader .btnGroup .btnGroupSplit { display: inline-block; width: 1px; height: 20px; background-color: #ccc; margin: 0 5px; position: relative; top: 5px; } #header.sticky-header .logo { width: 148px; height: 50px; } #header.sticky-header .logo #hktdcdg { width: 148px; height: 50px; } #header.sticky-header .wrap { min-height: 75px; } /**padding 0 15px;**/ #topHeaderWrap { text-align: right; height: auto; width: 100%; max-width: 100%; position: relative; margin: 0 auto 20px; padding: 0 15px; font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; transition: height 1s ease-out; background-color: #ededed; } #topHeaderWrap a { color: #1b1b1b; display: inline-block; margin: 0 5px; padding-top: 15px; padding-bottom: 15px; font-size: 13px; line-height: 1; } #topHeaderWrap a i { font-size: 12px; } #topHeaderWrap.hide { height: 0px; margin: 0; } #topHeaderWrap .wrap { padding: 0; } span.icon-user { width: 13px; height: 13px; position: relative; background-image: url(/share/images/icon_user.svg); background-repeat: no-repeat; display: inline-block; top: 2px; margin-right: 3px; } .mobileMenuBtn {display:block;position:absolute; width:24px; height:24px;text-indent: 100px;right: 1%;top: 27px;z-index: 999; outline: 0;} .mobileMenuBtn:hover {outline: 0;} .mobileMenuBtn:focus {outline: 0;} .mobileMenuBtn span,.mobileMenuBtn span:before,.mobileMenuBtn span:after{background:#333;position: absolute;left:0;width:100%;height:1.5px;transition: 0.2s linear all;} .mobileMenuBtn span{top:0px;} .mobileMenuBtn span:before{content:'';top:9px; background: linear-gradient(90deg, #EA7A29 8%, transparent 8%, transparent 22%, #EA7A29 0%); width: 125%;} .mobileMenuBtn span:after{content:'';top:18px;} .mobileMenuBtn.on span{background:none;} .mobileMenuBtn.on span:before{transform:rotate(45deg);top: 8px;left: -5px; z-index: 1;} .mobileMenuBtn.on span:after{transform:rotate(-45deg);top: 10px;} .mobileMenuMask { display:none; position:fixed; background-color:black; opacity:0.7; width:100%; height:100%; z-index:100; top:0; left:0;} a.mmCloseBtn {display:block; position:absolute; top:15px; right:15px; width:21px; height:21px; background:url(/share/images/closeBtn.svg) no-repeat; cursor:pointer; z-index:120;} /*2021-12-17-Shopping Cart*/ a.cartBtn { width: 26px; height: 20px; background: url(/share/images/btnCart.svg) no-repeat; cursor: pointer; position: absolute; right:130%; top:0px; } a.searchBtn { width: 24px; height: 24px; background: url(/share/images/btnSearch.svg) no-repeat; cursor: pointer; z-index: 120; position: absolute; right: 5%; top:25px; } .searchBtnInput { width: auto; position: absolute; right: 5%; top: 22px; display: none; } .searchBtnInput:before { content: ""; cursor: pointer; position: absolute; width: 30px; height: 30px; right: 0; background-color: #EA7A29; background-repeat: no-repeat; } .searchBtnInput input#headerSearchInput { border: 1px solid #EA7A29; width: 220px; height: 30px; padding: 2px 10px; outline: none; } .searchBtnInput input#headerSearchInput::placeholder { color: #000000; } .searchBtnInput input#headerSearchSubmit { cursor: pointer; position: absolute; top: 0; right: 0; width: 30px; height: 30px; background-color: transparent; background-image: url(/share/images/btnSearchInput.svg); background-repeat: no-repeat; text-indent: -9999px; } footer{ background-color: #ffffff; color: #959595; } footer { font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; font-size: 13px; } footer .socialIcon { text-align: center; background-color: #313131; color: #959595; padding: 40px 0; } footer .socialIcon ul { display: inline-block; margin: 0 auto; } footer .socialIcon ul li { list-style: none; display: inline-block; margin: 0 25px; } footer .sitemap { padding: 30px 0; } footer .sitemap .hktdc_logo { width: 100%; margin-bottom: 30px; } footer .sitemap .hktdc_logo img { margin-left: 10%; } footer .sitemap .links { width: 100%; text-align: center; font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; color: #1b1b1b; } footer .sitemap .links > div { margin-bottom: 10px; line-height: 1; } footer .sitemap .links a { color: #1b1b1b; font-size: 13px; display: inline-block; margin: 0 10px; } footer .sitemap .links a img { position: relative; top: -2px; } footer .sitemap .links .second img { vertical-align: middle; } footer .sitemap .links .social-icon { margin: 0 5px; } footer .sitemap .links .social-icon i { font-size: 16px; } footer .sitemap .links .social-icon svg { color:#1b1b1b; } footer .sitemap .footerSocialGroup { display: inline-block; } footer .sitemap .footerSocialGroup span.icon-youku { display: inline-block; width: 16px; height: 16px; background-image: url(/share/images/icon_youku.svg); background-repeat: no-repeat; background-size: 100%; position: relative; top: 2px; } .weixin { position: relative; } .weixin .weixinHolder { display: none; position: absolute; width: 100px; height: 122px; left: -44px; bottom: 25px; border: 1px solid #6D6D6D; } .weixin .weixinHolder .code { width: 100%; top: 0; } .weixin .weixinHolder .arrowArea { width: 100%; height: 28px; background: url("/share/images/code-arrow.png") no-repeat 0 0; color: #FFF; text-align: center; line-height: 24px; font-size: 12px; display: inline-block; } .youtube { position: relative; } .youtube .youtubeHolder { display: none; position: absolute; width: 100px; height: auto; left: -44px; bottom: 25px; } .youtube .youtubeHolder .code { width: 100%; top: 0; } .youtube .youtubeHolder .arrowArea { width: 100%; height: 28px; background: url("/share/images/code-arrow.png") no-repeat 0 0; color: #FFF; text-align: center; line-height: 24px; font-size: 12px; display: inline-block; } .youtube .youtubeHolder .arrowArea span.splitLine { background-color: #ffffff; top: 3px; } .photoFancyContainer { padding:5px; } .photoFancyContainer img { width:auto; height:auto; max-height:600px; max-width:900px; } /*content style*/ .content-container{background:#FFF;padding-top:30px;padding-bottom:30px;} .error{color:#F00 !important;border-color:#F00 !important} .breadcrumb{margin-bottom:30px;font-size:0;} .breadcrumb a{color:#777777;font-size:14px;} .breadcrumb a:after{content:'>';display:inline-block;margin:0 5px;} .breadcrumb a:last-child:after{display:none;} .breadcrumb a:last-child,.breadcrumb a.on{color:#ff0000;} .pagination{font-size:0;text-align:center;margin-bottom:30px;} .pagination .btn{width:30px;height:30px;padding:0;background:#ff0000;position: relative;margin:0 5px;min-width: 0px;} .pagination .btn:hover{background:#b00808;} .pagination .btn:before,.pagination .btn:after{content:'';border:6px transparent solid;background:#FFF;position: absolute;} .pagination input{width:30px;height:30px;text-align: center;font-size:14px;border:1px solid #f00;display:inline-block;vertical-align: middle;margin:0 5px;} .pagination p{display:inline-block;vertical-align: middle;height:30px;font-size:14px;line-height: 30px;margin:0 5px;margin-right: 10px;} .pagination p:before{content:'/';display:inline-block;vertical-align:top;margin-right:10px;} .pagination .btn.btn-first:before{height: 12px;width: 2px;border: none;top: 9px;left: 10px;} .pagination .btn.btn-first:after{border-width: 6px;border-right-color: #FFF;background: none;top: 9px;left: 7px;} .pagination .btn.btn-prev:before{display:none;} .pagination .btn.btn-prev:after{border-width: 6px;border-right-color: #FFF;background: none;top: 9px;left: 7px;} .pagination .btn.btn-next:before{display:none;} .pagination .btn.btn-next:after{border-width: 6px;border-left-color: #FFF;background: none;top: 9px;right: 7px;} .pagination .btn.btn-last:before{height: 12px;width: 2px;border: none;top: 9px;right: 10px;} .pagination .btn.btn-last:after{border-width: 6px;border-left-color: #FFF;background: none;top: 9px;right: 7px;} .pagination .btn.btn-next{background:#ff0000} .pagination .btn.btn-next:hover{background:#b00808;} .form h2{font-size:24px;font-weight: bold;color:#F00;padding-bottom:20px;margin-bottom:10px;position: relative;} .form h2:before{content:'';width:100%;height: 1px;background:#F00;position: absolute;bottom:0;left:0;} .form h3{font-size:16px;font-weight: bold;margin-bottom:10px;} .form h4{font-size:16px;font-weight: bold;margin-bottom:10px;padding-bottom:3px;position: relative;color:#F00;text-decoration: underline;} .form p{margin-bottom:20px;line-height:130%;} .form .mandatory-mark{position: relative;color: #F00;line-height: 0;height: 1px;display: inline-block;vertical-align: middle;top: -3px;margin-right: 2px;} .form .remark{font-size:16px;color:#888888;} .form p + h3, .form p + h4{margin-top:30px;} .form label{font-size:16px;} .form input[type="text"]{width:100%;height:35px;padding:10px 15px;font-size:14px;border:1px solid #000;display: inline-block;vertical-align: middle;} .form label + input[type="text"], .form label + select, .form label + .row, .form label ~ .select2-container{margin-top:5px;} .form .item{display:inline-block;vertical-align: middle;margin-right:20px;height: 35px;} .form .item:before{content:'';height:100%;display:inline-block;vertical-align: middle;} .form .item input, .form .item label{vertical-align: middle;} .form .item input + label{margin-left:5px;} .form .select2-container .select2-selection--single{height:35px;border-radius: 0;border-color: #000;} .form .select2-container--default .select2-selection--single .select2-selection__rendered{line-height:35px;} .form .select2-container--default .select2-selection--single .select2-selection__arrow{height:35px;} .form .select2-container--default .select2-selection--single .select2-selection__arrow b{border-width: 8px 8px 0 8px;margin-left: -14px;margin-top: -5px;} .form .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b{border-width: 0px 8px 8px 8px;} .form .row{display:table;width:100%;table-layout: fixed;margin:0 -20px;margin-bottom:40px;} .form .row .col{display:table-cell;width:50%;padding:0 20px;} .form .row .col .row{width:calc(100% + 20px);margin-bottom: 0;} .form .captcha{margin:40px 0;text-align: center;} .form .btn-holder{margin:40px 0;text-align: center;} .btn{display:inline-block;vertical-align: middle;padding:15px 20px;text-align: center;font-size:16px;min-width: 150px;} .btn + .btn{margin-left:10px;} .checkbox-style{display: inline-block;vertical-align: middle;width: 15px;height: 15px;border: 1px solid #B7B7B7;margin-right: 6px;position: relative;top: -2px;} .checkbox-style.disabled { cursor: not-allowed; opacity: 0.5; } .checkbox-style input[type="checkbox"]{display: block;width: 15px;height: 15px;position: absolute;top: 0;left: 0;opacity: 0; cursor: pointer;} .checkbox-style.checked{background:url(/share/images/checkbox-checked.png) no-repeat center center;background-size:11px auto;background-position: 1px 1px;} .radio-style{display: inline-block;vertical-align: middle;width: 16px;height: 16px;border: 2px solid #B7B7B7;margin-right: 5px;position: relative;top: -2px;border-radius: 20px;} .radio-style input[type="radio"]{display: block;width: 16px;height: 16px;position: absolute;top: 0;left: 0;opacity: 0;cursor: pointer;} .radio-style.checked:before{content:'';position: absolute;width:6px;height:6px;background:#E87B27;top:50%;left:50%;transform: translateX(-50%) translateY(-50%);border-radius: 20px;} /* Index */ #container { position: relative; } #container .subHeader { width: 100%; overflow: hidden; } #container, #mainSlider { position:relative; width: 100%; } #mainSlider { background-color: #f8f8f8; height: auto; text-align:center; } #mainSlider a img { width: auto; } /*#mainSlider a{ position:relative; width:100%; height:595px; display:block; overflow:hidden;text-align:center; background-position:center; } #mainSlider a img{ position:absolute; float:none; width:auto; height:auto; max-height:100%; left:50%; top:50%; transform:translate(-50%, -50%);} */ .lSSlideOuter .lSPager.lSpg {position:absolute; bottom:20px; width:100%; } .lSSlideOuter .lSPager.lSpg>li { margin: 0 5px; } .lSSlideOuter .lSPager.lSpg>li a {background-color:#666666; transition: none; width: 6px; height: 6px; color: #666666; } .lSSlideOuter .lSPager.lSpg>li.active { position: relative; } .lSSlideOuter .lSPager.lSpg>li.active:before { content: ""; border: 1px solid #f2761e; border-radius: 25px; width: 12px; height: 12px; position: absolute; top: 4px; left: 1px; } .lSSlideOuter .lSPager.lSpg>li.active a {background-color:#f2761e; } html[lang="zh-cn"] .lSSlideOuter .lSPager.lSpg>li.active:before { top: 5px; } .rowBox { position:relative; width:100%; min-height:200px; } .row1 {background-color:#ddd;} .row2 {background-color:#eee;} .row3 {background-color:#ddd;} .colContainer { padding: 10px 0;} /* .contentArea (for CMS content) ----------------------------------------------------------------------------------------------------*/ .contentArea h2 {padding:20px 0 10px; } .contentArea h4 {padding:20px 0 10px; } .contentArea h3 {padding:10px 0;} .contentArea p {padding-bottom:20px; line-height:130%; font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif;} .contentArea b{font-weight: 400;} .contentArea img {width:auto; float:left; margin:0 15px 5px 0; } .contentArea img.imgRight { float:right; margin:0 0 5px 15px; } .contentArea ul { clear:both; padding:0 0 10px 18px;} .contentArea ul li{ list-style-type:disc; list-style-position:outside; padding:0 0 10px 0;font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif;} .contentArea .genTable td, .contentArea .genTable th {padding:20px; background-color:white; text-align:left; vertical-align:top; } .contentArea .genTable th { background-color:#ccc; } .contentArea .genTable tr:nth-child(odd) td{background-color:#eee; } .contentArea .btn-holder{margin:40px 0;} .mobileMenu{ display:none; } /******************************sch css*******************************/ /*-----------------------common--------------------*/ body:lang(zh-cn) { font-size:14px; font-family: "Open Sans", Verdana, Arial, "Microsoft yahei", "微软雅黑", PMingLiU, sans-serif; } /******************************END sch css*******************************/ .fancybox-button.fancybox-button--share { display: none; } .homeSlider { position: relative; } .sectionTitle { position: relative; color: #EA7A2A; letter-spacing: 2px; font-size: 58px; text-align: left; padding-left: 15px; padding-top: 15px; line-height: 1.2; font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .sectionTitle:before { content: ""; position: absolute; width:40px; height: 1px; background-color: #EA7A2A; top: 0; left: 0; } html[lang="zh-hk"] .sectionTitle { font-size: 50px; } .homeDesigners { height: 275px; background-image: url(/share/images/home_designer_bg.jpg); background-repeat: repeat-y; background-size: contain; } .homeDesigners .homeDesignersLeft { position: relative; width: 310px; height: 275px; float: left; background-color: #343434; overflow: hidden; } .homeDesigners .homeDesignersLeft .sectionTitle { display: inline-block; top: 65px; left: 5px; line-height: 1.2; } .homeDesigners .homeDesignersRight { width: calc(100% - 310px); height: 275px; float: left; background-color: #eeeeef; } .homeDesigners .homeDesignersRight .designerPhoto { float: left; } .homeDesigners .homeDesignersRight .designerDetail { float: left; padding: 67px 67px 0; width: calc(100% - 275px); } .homeDesigners .homeDesignersRight .lSAction > a { background-image: url(../images/arrow.png); width: 30px; height: 26px; opacity: 1; } .homeDesigners .homeDesignersRight .lSAction > .lSPrev { top: auto; left: auto; right: 45px; bottom: 15px; } .homeDesigners .homeDesignersRight .lSAction > .lSNext { top: auto; bottom: 15px; } .homeDesigners #homeDesignersSlider { height: 275px !important; } .homeDesigners #homeDesignersSlider .quote { font-size: 22px; display: inline-block; width: auto; font-weight: lighter; position: relative; left: 50%; transform: translate(-50%, 0); padding: 0 10px; min-height: 70px; } .homeDesigners #homeDesignersSlider .quote::before { content: ""; width: 23px; height: 19px; position: absolute; background-image: url(/share/images/quoteStart.png); background-repeat: no-repeat; left: -25px; top: -20px; } .homeDesigners #homeDesignersSlider .quote::after { content: ""; width: 23px; height: 19px; position: absolute; background-image: url(/share/images/quoteEnd.png); background-repeat: no-repeat; right: -25px; bottom: 0; } .homeDesigners #homeDesignersSlider .quote .quote-txt-left { float: left; position: relative; } .homeDesigners #homeDesignersSlider .quote .quote-txt-right { float: right; position: relative; } .homeDesigners #homeDesignersSlider .designerPhoto img { height: 275px; } .homeDesigners #homeDesignersSlider .designerName { text-align: right; padding-top: 15px; font-size: 18px; } .homeDesigners #homeDesignersSlider .designerLearnMore { position: relative; left: -32px; bottom: -25px; } .homeDesigners #homeDesignersSlider .designerLearnMore a { color: #de7820; position: relative; font-size: 16px; } .homeDesigners #homeDesignersSlider .designerLearnMore a::before { content: ""; width: 30px; height: 1px; background-color: #de7820; position: absolute; left: -35px; top: 10px; } .homeVideo { padding: 40px 0 0; overflow: hidden; background-image: url(/share/images/design_spotlight.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; background-attachment: fixed; } /* .homeVideo #video_background { position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: -1000; width: 100%; } .homeVideo .videoDesc { position: relative; } .homeVideo .videoDesc p { color: #ffffff; width: 375px; line-height: 2; padding-top: 15px; padding-left: 15px; } .homeVideo a.learnMore { position: absolute; bottom: 0; right: 0; color: #de7820; font-size: 16px; } .homeVideo a.learnMore::before { content: ""; width: 30px; height: 1px; background-color: #de7820; position: absolute; left: -35px; top: 10px; } */ .homeVideo .homeVideoLeft { width: 300px; float: left; } .homeVideo .homeVideoLeft .sectionTitle { display: inline-block; top: 35px; left: 5px; line-height: 1.2; } html[lang="zh-hk"] .homeVideo .homeVideoLeft .sectionTitle { top: 130px; } .homeVideo .homeVideoRight { width: calc(100% - 300px); float: left; } .homeVideo .homeVideoRight .homeVideoSliderWrap { width: 650px; } .homeVideo .homeVideoRight .homeVideoSliderWrap #homeVideoSlider { position: relative; margin-bottom: 50px; } .homeVideo .homeVideoRight .homeVideoSliderWrap #homeVideoSlider .sliderItem img { width: 100%; } .homeVideo .homeVideoRight .homeVideoSliderWrap #homeVideoSlider .sliderItem a.sliderItemPlay { position: relative; display: block; } .homeVideo .homeVideoRight .homeVideoSliderWrap #homeVideoSlider .sliderItem a.sliderItemPlay::before { content: ""; width: 60px; height: 60px; background-image: url(/share/images/btnPlay.svg); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .homeVideo .homeVideoRight .homeVideoSliderWrap #homeVideoSlider .sliderItem .slideTitle { text-align: center; color: #ffffff; margin: 15px 0 5px; font-weight: bold; } .homeVideo .homeVideoRight .homeVideoSliderWrap #homeVideoSlider .sliderItem .slideTitle a { color: #ffffff; } .homeVideo .homeVideoRight .homeVideoSliderWrap .lSSlideOuter { position: relative; } .homeVideo .homeVideoRight .homeVideoSliderWrap .lSSlideOuter .lSPager.lSpg>li a { background-color: #ffffff; } .homeVideo .homeVideoRight .homeVideoSliderWrap .lSSlideOuter .lSPager.lSpg>li.active a { background-color: #de7820; } .homeVideo .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .homeVideo .video-container iframe, .homeVideo .video-container object, .homeVideo .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .homeHKBrands { padding: 70px 0 55px; } .homeHKBrands .homeHKBrandsLeft { width: 250px; float: left; } html[lang="zh-hk"] .homeHKBrands .homeHKBrandsLeft .sectionTitle { top: 58px; } .homeHKBrands .homeHKBrandsRight { width: calc(100% - 250px); float: left; padding: 0 40px; position: relative; } .homeHKBrands .homeHKBrandsRight #homeHKBrandsSlider .sliderItem > a.brandLogo { width: 182px; height: 182px; display: block; border: 1px solid #d9dcdb; position: relative; margin: 0 auto; } .homeHKBrands .homeHKBrandsRight #homeHKBrandsSlider .sliderItem img { display: block; margin: 0 auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -35%); } .homeHKBrands .homeHKBrandsRight #homeHKBrandsSlider .sliderItem .brandName { margin: 15px 22px; position: relative; padding-left: 22px; min-height: 38px; } .homeHKBrands .homeHKBrandsRight #homeHKBrandsSlider .sliderItem .brandName::before { content: ""; width: 15px; height: 1px; background-color: #de7820; position: absolute; left: 0; top: 8px; } .homeHKBrands .homeHKBrandsRight #homeHKBrandsSlider .sliderItem .brandName a { color: #393939; } .homeHKBrands .homeHKBrandsRight .lSAction > a { background-image: url(../images/arrow.png); width: 30px; height: 26px; opacity: 1; } .homeHKBrands .homeHKBrandsRight .lSAction > .lSPrev { left: 0; } .homeHKBrands .homeHKBrandsRight .lSAction > .lSNext { right: 0; } .homeHKBrands .homeHKBrandsRight .homeHKBrandsSliderControls > a { width: 16px; height: 26px; background-image: url(/share/images/arrow.png); display: block; position: absolute; } .homeHKBrands .homeHKBrandsRight .homeHKBrandsSliderControls > a.slidePrev { background-position: 0 0; left: 15px; top: 40%; } .homeHKBrands .homeHKBrandsRight .homeHKBrandsSliderControls > a.slideNext { background-position: 16px 0; right: 15px; top: 40%; } .homeService { padding: 70px 0; background-color: #343434; } .homeService .homeServiceLeft { width: 250px; float: left; } .homeService .homeServiceRight { width: calc(100% - 270px); float: left; position:relative;padding:0 40px} .homeService .homeServiceRight .serviceBox { float: left; color: #ffffff; width: 100%; padding: 0 15px; } .homeService .homeServiceRight .serviceBox .serviceBoxInner { cursor: pointer; box-shadow: inset 0 0 0 2px #EA7A29; border: 0; box-sizing: border-box; height: 120px; padding: 25px; font-size: 18px; position: relative; } .homeService .homeServiceRight .serviceBox .serviceBoxInner .dot { position: absolute; right: -4px; top: -4px; background-color: #EA7A29; border: 4px solid #343434; width: 10px; height: 10px; z-index: 2; } .homeService .homeServiceRight .serviceBox .serviceBoxInner:hover .dot { background-color: #ffffff } .homeService .homeServiceRight .serviceBox .serviceBoxInner::before, .homeService .homeServiceRight .serviceBox .serviceBoxInner::after { box-sizing: inherit; content: ''; position: absolute; width: 100%; height: 100%; } .homeService .homeServiceRight .serviceBox .serviceBoxInner { transition: color 0.25s; } .homeService .homeServiceRight .serviceBox .serviceBoxInner::before, .homeService .homeServiceRight .serviceBox .serviceBoxInner::after { border: 2px solid transparent; width: 0; height: 0; } .homeService .homeServiceRight .serviceBox .serviceBoxInner::before { bottom: 0; right: 0; } .homeService .homeServiceRight .serviceBox .serviceBoxInner::after { top: 0; left: 0; } .homeService .homeServiceRight .serviceBox .serviceBoxInner:hover { color: #EA7A29; } .homeService .homeServiceRight .serviceBox .serviceBoxInner:hover::before, .homeService .homeServiceRight .serviceBox .serviceBoxInner:hover::after { width: 100%; height: 100%; } .homeService .homeServiceRight .serviceBox .serviceBoxInner:hover::before { border-right-color: #FFFFFF; border-bottom-color: #FFFFFF; transition: width 0.25s ease-out; } .homeService .homeServiceRight .serviceBox .serviceBoxInner:hover::after { border-left-color: #FFFFFF; border-top-color: #FFFFFF; transition: border-color 0s ease-out 0.25s, width 0.25s ease-out 0.25s; } .homeService .homeServiceRight .serviceBox .serviceBoxInner span { width: 220px; display: block; position: absolute; left: 56%; top: 50%; transform: translate(-50%, -50%); } .homeService .homeServiceRight .serviceBox:nth-child(1) .serviceBoxInner span { height: auto; width: auto; } .homeService .homeServiceRight .serviceBox:nth-child(2) .serviceBoxInner span { left: 56%; width: 175px; } html[lang="zh-hk"] .homeService .homeServiceRight .serviceBox:nth-child(2) .serviceBoxInner span { left: 55%; width: auto; } .homeService .homeServiceRight .serviceBox .serviceBoxInner span::before { content: ""; width: 15px; height: 1px; background-color: #de7820; position: absolute; left: -20px; top: 11px; } html[lang="zh-hk"] .homeService .homeServiceRight .serviceBox:nth-child(3) .serviceBoxInner span { left: 58%; width: 150px; } .homeService .homeServiceRight .homeServiceSliderControls > a { width: 16px; height: 26px; background-image: url(/share/images/arrow.png); display: block; position: absolute; } .homeService .homeServiceRight .homeServiceSliderControls > a.slidePrev { background-position: 0 0; left: 15px; top: 40%; } .homeService .homeServiceRight .homeServiceSliderControls > a.slideNext { background-position: 16px 0; right: 15px; top: 40%; } .homeDGClub { padding: 70px 0 55px; background-image: url(/share/images/home_dgclub_bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; background-attachment: fixed; } .homeDGClub .homeDGClubLeft { width: 300px; float: left; text-align: center; } .homeDGClub .homeDGClubRight { width: calc(80% - 300px); float: left; padding: 30px 0; } .homeDGClub .homeDGClubRight p { line-height: 1.8; } html[lang="zh-hk"] .homeDGClub .homeDGClubRight p { font-size: 18px; } .homeDGClub a.joinNow { position: relative; color: #de7820; font-size: 16px; padding-left: 30px; } .homeDGClub a.joinNow::before { content: ""; width: 25px; height: 1px; background-color: #de7820; position: absolute; left: 0; top: 10px; } .homeStores { padding: 70px 0; background-color: #343434; } .homeStores .homeStoresLeft { width: 270px; float: left; } .homeStores .homeStoresLeft .sectionTitle { display: inline-block; top: 65px; left: 5px; line-height: 1.2; } .homeStores .homeStoresRight { width: calc(100% - 270px); float: left; } .homeStores .homeStoresRight .storePhoto { float: left; width: 50%; position: relative; height: 265px; overflow: hidden; } .homeStores .homeStoresRight .storePhoto:first-child { border-right: 1px solid #ffffff; width: calc(50% - 1px); } .homeStores .homeStoresRight .storePhoto img { width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .homeStores .homeStoresRight .storePhoto a { position: relative; display: block; width: 100%; height: 100%; } .homeStores .homeStoresRight .storePhoto a:before { content: ""; position: absolute; display: block; background-color: rgba(0,0,0,0.1); height: 100%; width: 100%; z-index: 1; } .homeStores .homeStoresRight .storePhoto span.storeLocation { position: absolute; bottom: 15px; color: #ffffff; left: 50%; transform: translate(-50%, 0); padding-left: 25px; text-shadow: 1px 1px 5px #333333; z-index: 2; } .homeStores .homeStoresRight .storePhoto span.storeLocation::before { content: ""; width: 15px; height: 1px; background-color: #de7820; position: absolute; left: 0; top: 10px; } .homeBottomBanner { padding: 40px 0 20px; position: relative; width: 100% } .homeBottomBanner .slide-img { width: 48%; float: left; } .homeBottomBanner .slide-img:first-child { margin-right: 4%; } .homeBottomBanner .slide-img img { width: 100%; border: 1px solid #E5E5E5; } .homeBottomBanner .customLink { width: 16px; height: 26px; background-image: url(/share/images/arrow.png); display: block; position: absolute; } .homeBottomBanner .customLink.prev { background-position: 0 0; left: -50px; top: 50%; } .homeBottomBanner .customLink.next { background-position: 16px 0; right: -50px; top: 50%; } .homeNews { padding: 40px 0 0; min-height: 280px; overflow: hidden; background-image: url(/share/images/design_spotlight2.jpg); background-repeat: no-repeat; background-size: cover; background-position: center center; background-attachment: fixed; } .homeNews .homeNewsLeft { width: 300px; float: left; } .homeNews .homeNewsLeft .sectionTitle { display: inline-block; top: 35px; left: 5px; line-height: 1.2; font-size: 50px; } .homeNews .homeNewsRight { width: calc(100% - 300px); float: left; } .homeNews .homeNewsRight .homeNewsLink { color: #ffffff; display: block; margin-top: 6.5%; font-size: 40px; letter-spacing: 5px; } .homeNews .homeNewsRight p { color: #ffffff; font-size: 18px; line-height: 1.8; margin-top: 52px; margin-bottom: 60px; } .homeNews a.more { position: relative; color: #de7820; font-size: 16px; padding-left: 30px; } .homeNews a.more::before { content: ""; width: 25px; height: 1px; background-color: #de7820; position: absolute; left: 0; top: 10px; } .homeJoin { padding: 40px 0 0; min-height: 260px; position: relative; overflow: hidden; background-color: #ffffff; } .homeJoin .homeJoinLeft { width: 300px; float: left; } .homeJoin .homeJoinLeft .sectionTitle { display: inline-block; top: 35px; left: 5px; line-height: 1.2; font-size: 50px; } .homeJoin .homeJoinRight { width: calc(100% - 300px); float: left; } .homeJoin .homeJoinRight p { color: #333333; font-size: 18px; line-height: 1.8; margin-top: 52px; margin-bottom: 60px; } .homeJoin a.more { position: relative; color: #de7820; font-size: 16px; padding-left: 30px; } .homeJoin a.more::before { content: ""; width: 25px; height: 1px; background-color: #de7820; position: absolute; left: 0; top: 10px; } .footerTop { width: 100%; padding: 20px 0; } .footerTop .btnTop { display: block; width: 24px; height: 40px; background-image: url(/share/images/btnTop.svg); background-repeat: no-repeat; margin: 0 auto; } html[lang="zh-hk"] .footerTop .btnTop { width: 30px; height: 41px; background-image: url(/share/images/btnTop_tc.svg); } html[lang="zh-cn"] .footerTop .btnTop { width: 30px; height: 41px; background-image: url(/share/images/btnTop_sc.svg); } .subHeader { position: relative; } .subHeader .subHeaderWrap img { display: block; width: 100%; } .subHeader .subHeaderWrap h1 { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-weight: normal; letter-spacing: 5px; font-size: 46px; font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .subHeader .subHeaderWrap h1 span { color: #EA7A2A; } .subHeader .subHeaderWrap .breadcrumb { width: 1236px; max-width: 100%; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 0); margin-bottom: 15px; padding: 0 20px } .breadcrumb a:last-child, .breadcrumb a.on { color: #EA7A2A; cursor: auto; } .mainContent { margin-bottom: 70px; } .mainContent .mainPageTitle { text-align: center; padding: 70px 0 50px; } .mainContent .mainPageTitle h2 { position: relative; display: inline-block; color: #EA7A2A; letter-spacing: 2px; font-size: 58px; text-align: left; padding-left: 15px; padding-top: 15px; line-height: 1.2; font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; font-weight: normal; text-transform: uppercase; } .mainContent .mainPageTitle h2:before { content: ""; position: absolute; width:40px; height: 1px; background-color: #EA7A2A; top: 0; left: 0; } .mainContent .mainPageSubTitle { text-align: center; padding: 30px 0 50px; } .mainContent .mainPageSubTitle h3 { font-size: 22px; color: #EA7A2A; font-weight: normal; } .mainContent .mainPageDesc p { line-height: 1.8; text-align: justify; } .mainContent .mainPageTitle h4 { position: relative; display: inline-block; color: #EA7A2A; letter-spacing: 2px; font-size: 58px; text-align: left; padding-left: 15px; padding-top: 15px; line-height: 1.2; font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; font-weight: normal;} .mainContent .mainPageTitle h4:before { content: ""; position: absolute; width:40px; height: 1px; background-color: #EA7A2A; top: 0; left: 0; } .mainContent .mainPageTitle h5 { position: relative; display: inline-block; color: #EA7A2A; letter-spacing: 2px; font-size: 36px; text-align: left; padding-left: 15px; padding-top: 15px; line-height: 1.2; font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; font-weight: normal;} .aboutus p { line-height: 1.8; color: #000000; text-align: justify; } .aboutus a{color:#00afff;} .aboutus a:hover{color:#65cfff;} .stores p, .stores strong { line-height: 1.8; color: #000000; } .stores .storeSelect { text-align: center; margin-bottom: 70px; } .stores .storeSelect .storeSelectWrap { display: inline-block; position: relative; background: #ffffff; } .stores .storeSelect .storeSelectWrap:after { content: ""; display: none; z-index: 1; position: absolute; right: 10px; top: 14px; width: 20px; height: 12px; background-image: url(/share/images/selectArrow.svg); background-repeat: no-repeat; } .stores .storeSelect .storeSelectWrap #selectStoresArea { z-index: 2; background: transparent; position: relative; font-size: 16px; border: 1px solid #EA7A2A; padding: 10px 10px; width: 240px; appearance: none; -moz-appearance: none; -webkit-appearance: none; } .stores .storeWrap { margin-bottom: 80px; } .stores .storeWrap .storePhoto { position: relative; z-index: -1; } .stores .storeWrap .storePhoto img { width: 100%; margin: 0; max-width: 97%; } .stores .storeWrap .storeDesc h3 { color: #EA7A2A; font-size: 22px; font-weight: normal; padding: 0; margin-bottom: 25px; } .stores .storeWrap .storeDesc .storeDetail { font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; color: #333333; font-size: 15px; } .stores .storeWrap .storeDesc strong { padding-bottom: 5px; display: inline-block; font-size: 16px; } .stores .storeWrap.otherStores { font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; margin-bottom: 10px; } .stores .storeWrap.otherStores h3 { color: #EA7A2A; font-size: 22px; font-weight: normal; padding: 0; margin-bottom: 25px; } .stores .storeWrap.otherStores .otherStoreItem { border-bottom: 1px solid #dddddd; margin-bottom: 25px; } .stores .storeWrap.otherStores .otherStoreItem:last-child { border-bottom: 0; } .stores .showFloorPlan { width: 130px; height: 40px; padding: 0; line-height: 40px; text-align: center; position: relative; display: inline-block; margin-right: 5px; cursor: pointer; } .stores .showFloorPlan { cursor: pointer; box-shadow: inset 0 0 0 2px #EA7A29; border: 0; box-sizing: border-box; position: relative; } .stores .showFloorPlan a { color: #333333; display: block; padding-left: 22px; outline: none; } html[lang="zh-hk"] .stores .showFloorPlan a { padding-left: 15px; } html[lang="zh-cn"] .stores .showFloorPlan a { padding-left: 15px; } .stores .showFloorPlan a:after { content: ""; width: 17px; height: 24px; background-image: url(/share/images/btnFloorplan.svg); position: absolute; top: 7px; left: 17px; } html[lang="zh-hk"] .stores .showFloorPlan a:after { top: 7px; left: 25px; } html[lang="zh-cn"] .stores .showFloorPlan a:after { top: 7px; left: 25px; } .stores .showFloorPlan:hover a { color: #cc6114; position: relative; z-index: 2; } .stores .showFloorPlan .dot { position: absolute; right: -4px; top: -4px; background-color: #EA7A29; border: 4px solid #ffffff; width: 10px; height: 10px; z-index: 2; } .stores .showFloorPlan:hover .dot { background-color: #cc6114 } .stores .showFloorPlan::before, .stores .showFloorPlan::after { box-sizing: inherit; content: ''; position: absolute; width: 100%; height: 100%; } .stores .showFloorPlan { transition: color 0.25s; } .stores .showFloorPlan::before, .stores .showFloorPlan::after { border: 2px solid transparent; width: 0; height: 0; } .stores .showFloorPlan::before { bottom: 0; right: 0; } .stores .showFloorPlan::after { top: 0; left: 0; } .stores .showFloorPlan:hover { color: #EA7A29; } .stores .showFloorPlan:hover::before, .stores .showFloorPlan:hover::after { width: 100%; height: 100%; } .stores .showFloorPlan:hover::before { border-right-color: #b55612; border-bottom-color: #b55612; transition: width 0.25s ease-out; } .stores .showFloorPlan:hover::after { border-left-color: #b55612; border-top-color: #b55612; transition: border-color 0s ease-out 0.25s, width 0.25s ease-out 0.25s; } .stores .showMapSelectWrap { display: inline-block; width: 120px; position: relative; } .stores .showMapSelectWrap .selectMap { width: 120px; height: 40px; line-height: 1.4; border: 2px solid #EA7A29; padding: 9px 0; position: relative; background-image: url(/share/images/btnArrowDown.svg); background-repeat: no-repeat; background-position: 90px 15px; cursor: pointer; } .stores .showMapSelectWrap .selectMap.on { background-image: url(/share/images/btnArrowUp.svg); background-color: #FDEDE0; } .stores .showMapSelectWrap .selectMap { cursor: pointer; box-shadow: inset 0 0 0 2px #EA7A29; border: 0; box-sizing: border-box; position: relative; text-align: center; } .stores .showMapSelectWrap .selectMap span { color: #333333; display: block; padding-left: 5px; } .stores .showMapSelectWrap .selectMap span:after { content: ""; width: 24px; height: 24px; background-image: url(/share/images/btnMap.svg); position: absolute; top: 7px; left: 15px; } .stores .showMapSelectWrap .selectMap:hover span { color: #cc6114; } .stores .showMapSelectWrap .selectMap .dot { position: absolute; right: -4px; top: -4px; background-color: #EA7A29; border: 4px solid #ffffff; width: 10px; height: 10px; z-index: 2; } .stores .showMapSelectWrap .selectMap:hover .dot { background-color: #cc6114 } .stores .showMapSelectWrap .selectMap::before, .stores .showMapSelectWrap .selectMap::after { box-sizing: inherit; content: ''; position: absolute; width: 100%; height: 100%; } .stores .showMapSelectWrap .selectMap { transition: color 0.25s; } .stores .showMapSelectWrap .selectMap::before, .stores .showMapSelectWrap .selectMap::after { border: 2px solid transparent; width: 0; height: 0; } .stores .showMapSelectWrap .selectMap::before { bottom: 0; right: 0; } .stores .showMapSelectWrap .selectMap::after { top: 0; left: 0; } .stores .showMapSelectWrap .selectMap:hover { color: #EA7A29; } .stores .showMapSelectWrap .selectMap:hover::before, .stores .showMapSelectWrap .selectMap:hover::after { width: 100%; height: 100%; } .stores .showMapSelectWrap .selectMap:hover::before { border-right-color: #b55612; border-bottom-color: #b55612; transition: width 0.25s ease-out; } .stores .showMapSelectWrap .selectMap:hover::after { border-left-color: #b55612; border-top-color: #b55612; transition: border-color 0s ease-out 0.25s, width 0.25s ease-out 0.25s; } .stores .storesMap { display: none; } .storesMap { padding: 0; } .stores .selectMapOption { border: 1px solid #C6C6C6; border-top: 0; background-color: #ffffff; display: none; width: 100%; position: absolute; } .stores .selectMapOption.on { display: block; } .stores .selectMapOption a { padding: 10px; display: block; color: #333333; } .stores .selectMapOption a:hover { background-color: #EA7A29; color: #ffffff; } .newsSelectWrap { text-align: right; margin-top: 60px; margin-bottom: 60px; } .newsSelectWrap .selectWrap { display: inline-block; position: relative; background: #ffffff; } /*.newsSelectWrap .selectWrap:after { content: ""; z-index: 1; position: absolute; right: 10px; top: 14px; width: 20px; height: 12px; background-image: url(/share/images/selectArrow.svg); background-repeat: no-repeat; }*/ .newsSelectWrap .selectWrap select { border-radius: 0; z-index: 2; background: transparent; position: relative; font-size: 16px; border: 1px solid #EA7A2A; padding: 10px 40px 10px 10px; width: auto; min-width: 150px; appearance: none; -moz-appearance: none; -webkit-appearance: none; line-height: 1.2; } .happenings .newsListWrap { width: 820px; display: block; margin: 0 auto; position: relative; } .happenings .newsListWrap .newsItem > div { display: block; width: 100%; margin: 0 auto; } .happenings .newsListWrap .newsItem { width: 252px; float: left; margin-right: 32px; margin-bottom: 40px; } .happenings .newsListWrap .newsItem:nth-child(3n) { margin-right: 0; } .happenings .newsListWrap .newsItem:nth-child(3n+1) { clear: left; } .happenings .newsListWrap .newsItem .newsThumb { border: 1px solid #BABABA; height: 168px; overflow: hidden; position: relative; } .happenings .newsListWrap .newsItem .newsThumb img { float: none; margin: 0; width: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .happenings .newsListWrap .newsItem .newsInfoWrap { height: 75px; } .happenings .newsListWrap .newsItem .newsDate { font-weight: bold; margin: 15px 0; padding-left: 20px; position: relative; } .happenings .newsListWrap .newsItem .newsDate:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .happenings .newsListWrap .newsItem .newsTitle { padding-left: 20px; height: auto; } .happenings .newsListWrap .newsItem .newsTitle a { color: #333333; } .happenings .newsListWrap .newsItem .newsMediaRelease { padding-left: 20px; } .happenings .newsListWrap .newsItem .newsMediaRelease a { color: #333333; } .hkdesigners .hkdesignersIntro { font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; text-align: center; margin-bottom: 50px; } .hkdesigners .hkdesignersList .hkdesigner { width: 25%; float: left; border: 1px solid #ffffff; margin-bottom: 30px; } .hkdesigners .hkdesignersList .hkdesigner .hkdesignerPhoto img { margin: 0; float: none; width: 100%; } .hkdesigners .hkdesignersList .hkdesigner .hkdesignerName { margin: 15px 0; padding-left: 20px; position: relative; } .hkdesigners .hkdesignersList .hkdesigner .hkdesignerName:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .hkdesigners .hkdesignersList .hkdesigner .hkdesignerName a { color: #333333; } .hkdesigners .hkdesignerDetail .hkdesigner .hkdesignerPhoto img { margin: 0; float: none; width: 100%; } .hkdesigners .hkdesignerDetail .hkdesigner .hkdesignerName { margin: 15px 0; padding-left: 20px; position: relative; text-transform: uppercase; } .hkdesigners .hkdesignerDetail .hkdesigner .hkdesignerName:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .hkdesignerSliderWrap { margin: 60px 0; border-left: 1px solid #dddddd; border-right: 1px solid #dddddd; position: relative; } #hkdesignerSlider .slideItem { border-left: 1px solid #dddddd; padding: 20px 0; cursor: pointer; } #hkdesignerSlider .slideItem.active { border-left: 0; } #hkdesignerSlider .slideItem .slideItemImg img { margin: 0; float: none; width: 100%; } #hkdesignerSlider .slideItem .slideItemTitle { margin: 15px 0 0; padding-left: 20px; position: relative; } #hkdesignerSlider .slideItem .slideItemTitle:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .hkdesignerSliderWrap .lSAction > a { background-image: url(../images/arrow.png); width: 30px; height: 26px; opacity: 1; } .hkdesignerSliderWrap .lSAction > .lSPrev { left: 0; } .hkdesignerSliderWrap .lSAction > .lSNext { right: 0; } .hkdesignerSliderWrap .hkdesignerSliderControls > a { width: 16px; height: 26px; background-image: url(/share/images/arrow.png); display: block; position: absolute; } .hkdesignerSliderWrap .hkdesignerSliderControls > a.slidePrev { background-position: 0 0; left: -35px; top: 40%; } .hkdesignerSliderWrap .hkdesignerSliderControls > a.slideNext { background-position: 16px 0; right: -35px; top: 40%; } .hkdesigners .hkdesignerDesc p { font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; text-align: justify; line-height: 1.8; color: #333333; } /**hkBrands= previous was replaced by -2020 adding pagnation hkBrands2022 **/ .hkBrands .hkBrandsIntro { font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; text-align: center; margin-bottom: 50px; } .hkBrands .hkBrandsList .hkBrand { width: 20%; float: left; margin-bottom: 30px; } .hkBrands .hkBrandsList .hkBrand:nth-child(5n+1) { clear:both; } .hkBrands .hkBrandsList .hkBrand .hkBrandPhoto { border: 1px solid #DFE1E0; border-right:0; } .hkBrands .hkBrandsList .hkBrand:nth-child(5n+5) .hkBrandPhoto, .hkBrands .hkBrandsList .hkBrand:last-child .hkBrandPhoto { border-right: 1px solid #DFE1E0; } .hkBrands .hkBrandsList .hkBrand .hkBrandPhoto img { margin: 0 auto; float: none; width: auto; padding-top: 25px; } .hkBrands .hkBrandsList .hkBrand .hkBrandName { margin: 15px 0; padding-left: 20px; position: relative; } .hkBrands .hkBrandsList .hkBrand .hkBrandName:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .hkBrands .hkBrandsList .hkBrand .hkBrandName a { color: #333333; } .hkbrands .hkbrandDetail .hkbrand .hkbrandPhoto { text-align: center; } .hkbrands .hkbrandDetail .hkbrand .hkbrandPhoto img { margin: 0; float: none; width: auto; } .hkbrands .hkbrandDetail .hkbrand .hkbrandName { margin: 15px 0; padding-left: 20px; position: relative; text-transform: uppercase; display: none; } .hkbrands .hkbrandDetail .hkbrand .hkbrandName:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .hkbrands .hkbrandDetail .col4.push4 .hkbrand { width: 158px; margin: 0 auto; display: block; } .hkbrands .hkbrandDetail .col4.push4 .hkbrand .hkbrandPhoto img { margin: 0 auto; } .hkbrandSliderWrap { margin: 40px 0; border-left: 1px solid #dddddd; border-right: 1px solid #dddddd; position: relative; } #hkbrandSlider .slideItem { border-left: 1px solid #dddddd; padding: 20px 0; cursor: pointer; } #hkbrandSlider .slideItem.active { border-left: 0; } #hkbrandSlider .slideItem .slideItemImg img { margin: 0; float: none; width: 100%; } #hkbrandSlider .slideItem .slideItemTitle { margin: 15px 0 0; padding-left: 20px; position: relative; } #hkbrandSlider .slideItem .slideItemTitle:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .hkbrandSliderWrap .lSAction > a { background-image: url(../images/arrow.png); width: 30px; height: 26px; opacity: 1; } .hkbrandSliderWrap .lSAction > .lSPrev { left: 0; } .hkbrandSliderWrap .lSAction > .lSNext { right: 0; } .hkbrandSliderWrap .hkbrandSliderControls > a { width: 16px; height: 26px; background-image: url(/share/images/arrow.png); display: block; position: absolute; } .hkbrandSliderWrap .hkbrandSliderControls > a.slidePrev { background-position: 0 0; left: -35px; top: 40%; } .hkbrandSliderWrap .hkbrandSliderControls > a.slideNext { background-position: 16px 0; right: -35px; top: 40%; } .hkbrands .hkbrandDesc p { font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; text-align: justify; line-height: 1.8; color: #333333; } .products .productFilterWrap { text-align: right; margin-top: 60px; } .products .productFilterWrap > div { display: inline-block; vertical-align: middle; } .products .productFilterWrap .selectWrap { display: inline-block; position: relative; background: #ffffff; } /*.products .productFilterWrap .selectWrap:after { content: ""; z-index: 1; position: absolute; right: 10px; top: 14px; width: 20px; height: 12px; background-image: url(/share/images/selectArrow.svg); background-repeat: no-repeat; }*/ .products .productFilterWrap .selectWrap select { border-radius: 0; z-index: 2; background: transparent; position: relative; height: 40px; font-size: 16px; border: 1px solid #EA7A2A; padding: 10px 50px 10px 10px; width: auto; appearance: none; -moz-appearance: none; -webkit-appearance: none; } .products .productSearchInputWrap { width: auto; position: relative; } .products .productSearchInputWrap:before { content: ""; cursor: pointer; position: absolute; width: 40px; height: 40px; right: 0; background-color: #EA7A29; background-repeat: no-repeat; } .products .productSearchInputWrap input#productSearchInput { border-radius: 0; border: 1px solid #EA7A29; height: 40px; padding: 2px 10px; outline: none; width: 240px; font-size: 14px; } .products .productSearchInputWrap input#productSearchInput::placeholder { color: #000000; } .products .productSearchInputWrap input#productSearchSubmit { cursor: pointer; position: absolute; top: 0; right: 0; width: 40px; height: 40px; background-color: transparent; background-image: url(/share/images/btnSearch_40x40.svg); background-repeat: no-repeat; text-indent: -9999px; } .products .productList .productListWrap { border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD; } .products .productList .productListWrap .productItem { width: 25%; float: left; border-right: 1px solid #DDDDDD; padding: 30px 0 0; } .products .productList .productListWrap .productItem:nth-child(4n) { border-right: 0; } .products .productList .productListWrap .productItem .productThumb { height: 297.5px; position: relative; overflow: hidden; background-image: url(/share/images/ajax-loader.gif); background-repeat: no-repeat; background-position: center center; } .products .productList .productListWrap .productItem .productThumb a { width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .products .productList .productListWrap .productItem .productThumb img { float: none; margin: 0; width: 100%; } .products .productList .productListWrap .productItem .productTitle { margin: 15px 0 5px; padding-left: 20px; position: relative; height: 38px; overflow: hidden; } .products .productList .productListWrap .productItem .productTitle:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .products .productList .productListWrap .productItem .productTitle a { color: #EA7A2A; width: 95%; display: block; } .products .productList .productListWrap .productItem .productDesigner { padding-left: 20px; min-height: 25px; } .products .productList .productListWrap .productItem .productDesigner a { color: #333333; } .products .filterSplit { width: 1px; height: 40px; margin: 0 15px; position: relative; background-color: #C6C6C6; } .products .backWrap { margin-bottom: 20px; } .products .backWrap a { display: block; margin-top: 15px; color: #EA7A29; letter-spacing: 2px; font-size: 14px; } .products .backWrap img { margin: 0 5px 0 0; width: auto; } .productDetail .backWrap { margin-bottom: 20px; } .productDetail .backWrap a { display: block; margin-top: 15px; color: #EA7A29; letter-spacing: 2px; font-size: 14px; } .productDetail .backWrap img { margin: 0 5px 0 0; width: auto; } .productDetail .productFilterWrap { text-align: right; margin-top: 60px; } .productDetail .productFilterWrap > div { display: inline-block; vertical-align: middle; } .productDetail .filterSplit { width: 1px; height: 40px; margin: 0 15px; position: relative; background-color: #C6C6C6; } .productDetail .productSearchInputWrap { width: auto; position: relative; } .productDetail .productSearchInputWrap:before { content: ""; cursor: pointer; position: absolute; width: 40px; height: 40px; right: 0; background-color: #EA7A29; background-repeat: no-repeat; } .productDetail .productSearchInputWrap input#productSearchInput { border: 1px solid #EA7A29; height: 40px; padding: 2px 10px; outline: none; width: 220px; font-size: 14px; border-radius: 0; } .productDetail .productSearchInputWrap input#productSearchInput::placeholder { color: #000000; } .productDetail .productSearchInputWrap input#productSearchSubmit { cursor: pointer; position: absolute; top: 0; right: 0; width: 40px; height: 40px; background-color: transparent; background-image: url(/share/images/btnSearch_40x40.svg); background-repeat: no-repeat; text-indent: -9999px; } .productDetail #productGallery .productGalleryItem { border: 1px solid #dddddd; } .productDetail #productGallery .productGalleryItem img { width: 100%; float: none; margin: 0; } .productDetail .productGalleryWrap { position: relative; } .productDetail .productGalleryWrap .lSSlideWrapper { margin-bottom: 20px; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery img { float: none; margin: 0; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery li.active, .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery li:hover { border-radius: 0; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery li.active img, .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery li:hover img { border-radius: 0; } .productDetail .productGalleryWrap .lSAction > a { background-image: url(../images/arrow.png); width: 30px; height: 26px; opacity: 1; } .productDetail .productGalleryWrap .lSAction > .lSPrev { left: 0; } .productDetail .productGalleryWrap .lSAction > .lSNext { right: 0; } .productDetail .productGalleryWrap .productGalleryControls > a { width: 21px; height: 40px; background-image: url(/share/images/arrow_20x40.svg); display: block; position: absolute; } .productDetail .productGalleryWrap .productGalleryControls > a.slidePrev { background-position: 0 0; left: -45px; top: 40%; } .productDetail .productGalleryWrap .productGalleryControls > a.slideNext { background-position: 21px 0; right: -45px; top: 40%; } .productDetail .productInfo h3 { padding-top: 0; } .productDetail .productInfo .productInfoField { width: 100%; display: block; margin-bottom: 30px; } .productDetail .productInfo .productInfoField .productName { font-size: 21px; color: #EA7A29; } /*.productDetail .productInfo .btnEnquire { border: 2px solid #EA7A29; width: 125px; height: 40px; padding: 7px; font-size: 14px; position: relative; margin-top: 10px; margin-right: 10px; display: inline-block; }*/ /*.productDetail .productInfo .btnEnquire:before { content: ""; position: absolute; right: -6px; top: -6px; background-color: #EA7A29; border: 4px solid #ffffff; width: 2px; height: 2px; }*/ /*.productDetail .productInfo .btnEnquire span { color: #333333; position: relative; padding-left: 45px; line-height: 1.4; font-size: 15px; }*/ /*.productDetail .productInfo .btnEnquire span:before { content: ""; position: absolute; width: 26px; height: 21px; background-image: url(/share/images/btnEnquireIcon.svg); left: 5px; top: 0; }*/ /*.productDetail .selectWrap.active .select2-container .select2-selection--single .select2-selection__rendered { color: #ffffff; background-color: #EA7A29; } .productDetail .selectWrap.active .select2-container--default .select2-selection--single .select2-selection__arrow:after { background-image: url(/share/images/selectArrow_white.svg); }*/ .productDetail .productInfo .btnEnquire { cursor: pointer; box-shadow: inset 0 0 0 2px #EA7A29; border: 0; box-sizing: border-box; position: relative; width: 125px; height: 40px; font-size: 14px; display: inline-block; margin-right: 10px; } .productDetail .productInfo .btnEnquire .btnEnquireInner { color: #333333; display: block; padding-left: 54px; outline: none; line-height: 40px; } html[lang="zh-hk"] .productDetail .productInfo .btnEnquire .btnEnquireInner { padding-left: 60px; } html[lang="zh-cn"] .productDetail .productInfo .btnEnquire .btnEnquireInner { padding-left: 60px; } .productDetail .productInfo .btnEnquire .btnEnquireInner:after { content: ""; width: 26px; height: 21px; background-image: url(/share/images/btnEnquireIcon.svg); position: absolute; top: 10px; left: 17px; } html[lang="zh-hk"] .productDetail .productInfo .btnEnquire .btnEnquireInner:after { left: 25px; } html[lang="zh-cn"] .productDetail .productInfo .btnEnquire .btnEnquireInner:after { left: 25px; } .productDetail .productInfo .btnEnquire:hover .btnEnquireInner { color: #cc6114; position: relative; z-index: 2; } .productDetail .productInfo .btnEnquire .dot { position: absolute; right: -4px; top: -4px; background-color: #EA7A29; border: 4px solid #ffffff; width: 10px; height: 10px; z-index: 2; } .productDetail .productInfo .btnEnquire:hover .dot { background-color: #cc6114 } .productDetail .productInfo .btnEnquire::before, .productDetail .productInfo .btnEnquire::after { box-sizing: inherit; content: ''; position: absolute; width: 100%; height: 100%; } .productDetail .productInfo .btnEnquire { transition: color 0.25s; } .productDetail .productInfo .btnEnquire::before, .productDetail .productInfo .btnEnquire::after { border: 2px solid transparent; width: 0; height: 0; } .productDetail .productInfo .btnEnquire::before { bottom: 0; right: 0; } .productDetail .productInfo .btnEnquire::after { top: 0; left: 0; } .productDetail .productInfo .btnEnquire:hover { color: #EA7A29; } .productDetail .productInfo .btnEnquire:hover::before, .productDetail .productInfo .btnEnquire:hover::after { width: 100%; height: 100%; } .productDetail .productInfo .btnEnquire:hover::before { border-right-color: #b55612; border-bottom-color: #b55612; transition: width 0.25s ease-out; } .productDetail .productInfo .btnEnquire:hover::after { border-left-color: #b55612; border-top-color: #b55612; transition: border-color 0s ease-out 0.25s, width 0.25s ease-out 0.25s; } /*.productDetail .productInfo .btnShare { border: 2px solid #EA7A29; width: 125px; height: 40px; padding: 7px; font-size: 14px; position: relative; margin-top: 10px; display: inline-block; } .productDetail .productInfo .btnShare:before { content: ""; position: absolute; right: -6px; top: -6px; background-color: #EA7A29; border: 4px solid #ffffff; width: 2px; height: 2px; } .productDetail .productInfo .btnShare span { color: #333333; position: relative; padding-left: 45px; line-height: 1.4; font-size: 15px; } .productDetail .productInfo .btnShare span:before { content: ""; position: absolute; width: 25px; height: 27px; background-image: url(/share/images/btnShareIcon.svg); left: 5px; top: -2px; }*/ .productDetail .productInfo .btnShare { cursor: pointer; box-shadow: inset 0 0 0 2px #EA7A29; border: 0; box-sizing: border-box; position: relative; width: 125px; height: 40px; font-size: 14px; display: inline-block } .productDetail .productInfo .btnShare .btnShareInner { color: #333333; display: block; padding-left: 54px; outline: none; line-height: 40px; } html[lang="zh-hk"] .productDetail .productInfo .btnShare .btnShareInner { padding-left: 60px; } html[lang="zh-cn"] .productDetail .productInfo .btnShare .btnShareInner { padding-left: 60px; } .productDetail .productInfo .btnShare .btnShareInner:after { content: ""; width: 25px; height: 27px; background-image: url(/share/images/btnShareIcon.svg); position: absolute; top: 6px; left: 17px; } html[lang="zh-hk"] .productDetail .productInfo .btnShare .btnShareInner:after { left: 25px; } html[lang="zh-cn"] .productDetail .productInfo .btnShare .btnShareInner:after { left: 25px; } .productDetail .productInfo .btnShare:hover .btnShareInner { color: #cc6114; position: relative; z-index: 2; } .productDetail .productInfo .btnShare .dot { position: absolute; right: -4px; top: -4px; background-color: #EA7A29; border: 4px solid #ffffff; width: 10px; height: 10px; z-index: 2; } .productDetail .productInfo .btnShare:hover .dot { background-color: #cc6114 } .productDetail .productInfo .btnShare::before, .productDetail .productInfo .btnShare::after { box-sizing: inherit; content: ''; position: absolute; width: 100%; height: 100%; } .productDetail .productInfo .btnShare { transition: color 0.25s; } .productDetail .productInfo .btnShare::before, .productDetail .productInfo .btnShare::after { border: 2px solid transparent; width: 0; height: 0; } .productDetail .productInfo .btnShare::before { bottom: 0; right: 0; } .productDetail .productInfo .btnShare::after { top: 0; left: 0; } .productDetail .productInfo .btnShare:hover { color: #EA7A29; } .productDetail .productInfo .btnShare:hover::before, .productDetail .productInfo .btnShare:hover::after { width: 100%; height: 100%; } .productDetail .productInfo .btnShare:hover::before { border-right-color: #b55612; border-bottom-color: #b55612; transition: width 0.25s ease-out; } .productDetail .productInfo .btnShare:hover::after { border-left-color: #b55612; border-top-color: #b55612; transition: border-color 0s ease-out 0.25s, width 0.25s ease-out 0.25s; } .addthis_inline_share_toolbox { display: none; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery { display: inline-flex; flex-wrap: wrap; width: 100%; padding-bottom: 0; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery li { padding: 0; display: flex; flex-direction: column; vertical-align: middle; border: 1px solid #dddddd; position: relative; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery li.active:before { content: ""; width: 100%; z-index: 99; border-bottom: 4px solid #EA7A29; position: absolute; bottom: 0; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery li a { display: block; height: 100%; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery img { float: none; margin: 0; position: relative; top: 50%; transform: translate(0, -50%); } .productDetail .mobileThumbGalleryWrap { width: 70%; display: none; margin: 30px auto; position: relative; } .productDetail .mobileThumbGalleryWrap .mobileThumbGalleryControls > a { width: 21px; height: 40px; background-image: url(/share/images/arrow_20x40.svg); display: block; position: absolute; } .productDetail .mobileThumbGalleryWrap .mobileThumbGalleryControls > a.slidePrev { background-position: 0 0; left: -45px; top: 40%; } .productDetail .mobileThumbGalleryWrap .mobileThumbGalleryControls > a.slideNext { background-position: 21px 0; right: -45px; top: 40%; } .consignment .consignmentPhoto { margin-bottom: 60px; display: flex; justify-content: center;} .consignment .consignmentPhoto .consignmentPhotoItem { float: left; width: 33.33%; } .consignment .consignmentPhoto .consignmentPhotoItem:nth-child(1) { border-right: 1px solid #ffffff; } .consignment .consignmentPhoto .consignmentPhotoItem:nth-child(2) { border-right: 1px solid #ffffff; } .consignment .consignmentPhoto .consignmentPhotoItem img { float: none; margin: 0; width: 100%; } .consignment2 .consignmentPhoto2 { margin-bottom: 60px; display: flex; justify-content: center;} .consignment2 .consignmentPhoto2 .consignmentPhotoItem2 { float: left; width: 50%; } .consignment2 .consignmentPhoto2 .consignmentPhotoItem2:nth-child(1) { border-right: 1px solid #ffffff; } .consignment2 .consignmentPhoto2 .consignmentPhotoItem2:nth-child(2) { border-right: 1px solid #ffffff; } .consignment2 .consignmentPhoto2 .consignmentPhotoItem2 img { float: none; margin: 0; width: 100%; } .consignment .consignmentDesc p { line-height: 1.8; text-align: justify; } .consignment .consignmentCriteria { margin-bottom: 50px; } .consignment .consignmentCriteria h3 { text-align: center; color: #E87B27; margin-bottom: 20px; font-size: 20px; font-weight: normal; } .consignment .consignmentCriteria .consignmentCriteriaItem { text-align: center; } .consignment .consignmentCriteria .consignmentCriteriaItem img { float: none; display: block; margin: 0 auto 15px; width: auto; } .consignment .consignmentCriteria .consignmentCriteriaItem h4 { width: 75%; line-height: 1.4; display: block; margin: 0 auto; font-size: 14px; font-weight: normal; } .consignment .consignmentDesc .btnShowDesign { border: 2px solid #EA7A29; text-align: center; width: auto; min-height: 40px; height: auto; padding: 7px 25px; font-size: 14px; position: relative; margin-top: 40px; display: inline-block; } .consignment .consignmentDesc .btnShowDesign:before { content: ""; position: absolute; right: -6px; top: -6px; background-color: #EA7A29; border: 4px solid #ffffff; width: 2px; height: 2px; } .consignment .consignmentDesc .btnShowDesign > span { color: #333333; position: relative; line-height: 1.4; font-size: 15px; } .consignment .consignmentDesc .btnShowDesign > span:before { content: ""; position: absolute; width: 26px; height: 21px; left: 5px; top: 0; } .consignment .consignmentDesc .btnShowDesign > span > span { color: #EA7A29; } .gifts .giftFilterWrap { text-align: right; margin-top: 60px; } .gifts .giftFilterWrap > div { display: inline-block; vertical-align: middle; } .gifts .giftFilterWrap .selectWrap { display: inline-block; position: relative; background: #ffffff; } /*.gifts .giftFilterWrap .selectWrap:after { content: ""; z-index: 1; position: absolute; right: 10px; top: 14px; width: 20px; height: 12px; background-image: url(/share/images/selectArrow.svg); background-repeat: no-repeat; }*/ .gifts .giftFilterWrap .selectWrap select { border-radius: 0; z-index: 2; background: transparent; position: relative; height: 40px; font-size: 16px; border: 1px solid #EA7A2A; padding: 10px 50px 10px 10px; width: auto; appearance: none; -moz-appearance: none; -webkit-appearance: none; } .gifts .giftSearchInputWrap { width: auto; position: relative; } .gifts .giftSearchInputWrap:before { content: ""; cursor: pointer; position: absolute; width: 40px; height: 40px; right: 0; background-color: #EA7A29; background-repeat: no-repeat; } .gifts .giftSearchInputWrap input#giftSearchInput { border-radius: 0; border: 1px solid #EA7A29; height: 40px; padding: 2px 10px; outline: none; width: 220px; font-size: 14px; } .gifts .giftSearchInputWrap input#giftSearchInput::placeholder { color: #000000; } .gifts .giftSearchInputWrap input#giftSearchSubmit { cursor: pointer; position: absolute; top: 0; right: 0; width: 40px; height: 40px; background-color: transparent; background-image: url(/share/images/btnSearch_40x40.svg); background-repeat: no-repeat; text-indent: -9999px; } .gifts .giftList .giftListWrap { border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD; } .gifts .giftList .giftListWrap .giftItem { display: block; width: 25%; float: left; border-right: 1px solid #DDDDDD; padding: 30px 0 0; } .gifts .giftList .giftListWrap .giftItem:nth-child(4n) { border-right: 0; } /*.gifts .giftList .giftListWrap .giftItem .giftThumb img { float: none; margin: 0; width: 100%; } .gifts .giftList .giftListWrap .giftItem .giftTitle { margin: 15px 0 5px; padding-left: 20px; position: relative; } .gifts .giftList .giftListWrap .giftItem .giftTitle:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .gifts .giftList .giftListWrap .giftItem .giftTitle a { color: #333333; }*/ .gifts .giftList .giftListWrap .giftItem .giftThumb { height: 297.5px; position: relative; overflow: hidden; background-image: url(/share/images/ajax-loader.gif); background-repeat: no-repeat; background-position: center center; } .gifts .giftList .giftListWrap .giftItem .giftThumb a { width: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } .gifts .giftList .giftListWrap .giftItem .giftThumb img { float: none; margin: 0; width: 100%; } .gifts .giftList .giftListWrap .giftItem .giftTitle { margin: 15px 0 5px; padding-left: 20px; position: relative; height: 38px; overflow: hidden; } .gifts .giftList .giftListWrap .giftItem .giftTitle:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .gifts .giftList .giftListWrap .giftItem .giftTitle a { color: #EA7A2A; width: 95%; display: block; } .gifts .filterSplit { width: 1px; height: 40px; margin: 0 15px; position: relative; background-color: #C6C6C6; } .gifts .backWrap { margin-bottom: 20px; } .gifts .backWrap a { display: block; margin-top: 15px; color: #EA7A29; letter-spacing: 2px; font-size: 14px; } .gifts .backWrap img { margin: 0 5px 0 0; width: auto; } .gifts .giftList .giftListWrap .giftItem .giftDesigner { padding-left: 20px; min-height: 25px; } .gifts .giftList .giftListWrap .giftItem .giftDesigner a { color: #333333; } .gifts .lSSlideOuter .lSPager.lSGallery { display: flex; flex-wrap: wrap; padding-bottom: 0; } .gifts .lSSlideOuter .lSPager.lSGallery li { padding: 0; display: flex; flex-direction: column; vertical-align: middle; border: 1px solid #dddddd; position: relative; } .gifts .lSSlideOuter .lSPager.lSGallery li.active:before, .gifts .lSSlideOuter .lSPager.lSGallery li:hover:before { content: ""; width: 100%; z-index: 99; border-bottom: 4px solid #EA7A29; position: absolute; bottom: 0; } .gifts .lSSlideOuter .lSPager.lSGallery li a { display: block; height: 100%; } .gifts .lSSlideOuter .lSPager.lSGallery img { float: none; margin: 0; position: relative; top: 50%; transform: translate(0, -50%); } .wsrService .wsrServiceDesc h3 { text-align: center; font-weight: bold; } .wsrService .wsrServiceDesc h3.subTitle { color: #EA7A2A; margin-bottom: 15px; text-align: center; font-size: 20px; font-weight: normal; padding-top: 0; } .wsrService .wsrServiceDesc p { line-height: 1.8; text-align: justify; } .wsrService .wsrServiceDesc .wsrServicePhoto img { float: none; margin: 0 auto; } .wsrService .wsrProgram { margin-top: 30px; } .wsrService .wsrProgram .wsrProgramItem { text-align: center; } .wsrService .wsrProgram .wsrProgramItem2 { text-align: center; } .wsrService .wsrProgram .wsrProgramItem img { float: none; margin: 0 auto 20px; display: block; width: auto; } .wsrService .wsrProgram .wsrProgramItem2 img { float: none; margin: 0 auto 20px; display: block; width: auto; } .wsrService .wsrProgram .wsrProgramItem h4 { width: 90%; line-height: 1.4; display: block; margin: 0 auto; font-family: "Roboto", "Microsoft JhengHei", 微軟正黑體, Verdana, Arial, PMingLiU, sans-serif; font-weight: normal; } .wsrService .wsrProgram .wsrProgramItem2 h4 { width: 90%; display: block; margin: 0 auto; font-family: "Roboto", "Microsoft JhengHei", 微軟正黑體, Verdana, Arial, PMingLiU, sans-serif; font-weight: normal; } .wsrService .btnShowProgram { border: 2px solid #EA7A29; text-align: center; width: auto; min-height: 40px; height: auto; padding: 7px 25px; font-size: 14px; position: relative; margin-top: 40px; display: inline-block; } .wsrService .btnShowProgram:before { content: ""; position: absolute; right: -6px; top: -6px; background-color: #EA7A29; border: 4px solid #ffffff; width: 2px; height: 2px; } .wsrService .btnShowProgram > span { color: #EA7A29; position: relative; line-height: 1.4; font-size: 15px; } .wsrService .btnShowProgram > span:before { content: ""; position: absolute; width: 26px; height: 21px; left: 5px; top: 0; } .dgClub h3 { font-size: 20px; color: #997629; font-weight: normal; } .dgClub .dgClubTop h3 { float: left; } .dgClub .dgClubTop .btnBack { float: right; display: block; margin-top: 15px; color: #EA7A29; letter-spacing: 2px; font-size: 10px; } .dgClub .dgClubTop .btnBack img { margin: 0 5px 0 0; } .dgClub .dgClubMain h3 { font-size: 15px; color: #000000; font-weight: bold; } .dgClub .dgClubMain ol { list-style-position: inside; } .dgClub .dgClubMain ol li { line-height: 30px; font-size: 14px; } .dgClub .dgClubSliderWrap { position: relative; margin-bottom: 80px; } .dgClub .dgClubSliderWrap img { width: 100%; float: none; margin: 0; } .dgClub .dgClubSliderWrap .lSSlideOuter .lSPager.lSpg { bottom: -30px; } .dgClub .dgClubSliderWrap .lSSlideOuter .lSPager.lSpg>li.active:before { border: 1px solid #C6B385; top: 3px; } .dgClub .dgClubSliderWrap .lSSlideOuter .lSPager.lSpg>li.active a { background-color: #C6B385; } .dgClub .dgClubDesc h3 { font-size: 22px; } .dgClub .dgClubDesc p { line-height: 2; font-size: 16px; } .dgClub .dgClubBorderTopWrap { min-height: 400px; border: 1px solid #C8B285; border-bottom: 0; margin-top: 160px; } .dgClub .dgClubBorderBottomWrap { min-height: 500px; border: 1px solid #C8B285; border-top: 0; padding: 0 30px; } .dgClubSection .mainContent2 { background-color: #F5F5F1; padding-bottom: 40px; } .dgClubSection .footerTop { background-color: #F5F5F1; } .dgClub .privilegesWrap { width: 75%; text-align: center; margin: -130px auto 0; display: block; position: relative; } .dgClub .privilegesWrap .privilegesItem { display: inline-block; margin: 0 20px; border: 10px solid #ffffff; position: relative; } .dgClub .privilegesWrap .privilegesItem img { float: none; margin: 0; } .dgClub .privilegesWrap .privilegesItem:nth-child(1) { margin-right: 10px; border-left: 25px solid #ffffff; } .dgClub .privilegesWrap .privilegesItem:nth-child(3) { margin-left: 10px; border-right: 25px solid #ffffff; } .dgClub .privilegesWrap .privilegesItem:nth-child(4) { top: -35px; position: relative; border: 0; margin: 0 25px; } .dgClub .privilegesWrap .privilegesItem:nth-child(5) { top: -35px; position: relative; border: 0; margin: 0 25px; } .dgClub .privilegesWrap .privilegesItem .privilegesItemContent { position: absolute; font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; width: 85%; top: 55%; height: 60px; text-align: center; left: 50%; transform: translate(-50%, 0); } .dgClub .termsWrap { text-align: center; position: relative; top: -40px; } .dgClub .termsWrap a { display: inline-block; color: #ffffff; padding: 10px 20px; background-color: #987629; } .dgClub .dgClubRewards .rewardsWrap { border-bottom: 1px solid #C8B285; padding: 20px 0 10px; margin-bottom: 20px; } .dgClub .dgClubRewards .rewardsWrap p { line-height: 2; } .dgClub .dgClubRewards .rewardsWrap p.rewardsDesc { width: 715px; max-width: 100%; margin: 0 auto; } .dgClub .dgClubRewards .rewardsProgramWrap { width: 60%; display: block; margin: 0 auto; } .dgClub .dgClubRewards .rewardsProgramWrap img { float: none; margin: 15px auto; display: block; width: auto; } .dgClub .dgClubRewards .rewardsProgramWrap ol { list-style-position: inside; } .dgClub .dgClubRewards .rewardsProgramWrap ol li { line-height: 2; font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .dgClub .dgClubRewards .rewardsProgramWrap p { line-height: 2; } .dgClub .dgClubRewards .rewardsProgramWrap table th, .dgClub .dgClubRewards .rewardsProgramWrap table td { border: 1px solid #C8B285; padding: 15px 25px; } .dgClub .dgClubRewards .rewardsProgramWrap table th { background-color: #EBE9E3; } .dgClub .dgClubRewards .rewardsProgramWrap table td:first-child { text-align: center; vertical-align: top; } .dgClub .rewardsTable { margin: 10px 0; width: 95%; font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .dgClub .rewardsTable .rewardName { float: left; font-weight: bold; color: #67614E; } .dgClub .rewardsTable .btnRedeem { float: right; background-color: #987629; color: #ffffff; padding: 10px 30px; } .dgClub .rewardsLine { display: inline-block; width: 100%; height: 1px; background-color: #C8B285; margin-bottom: 10px; } .dgClub .dgClubRewards .rewardsProgramWrap { width: 60%; display: block; margin: 0 auto; } .dgClub .bonusPointsWrap { width: 60%; display: block; margin: 0 auto; padding-bottom: 100px; } .dgClub .bonusPointsWrap p { line-height: 2; } .dgClub .bonusPointsWrap ol { margin-left: 15px; } .dgClub .bonusPointsWrap ol li { line-height: 2; font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .dgClub .bonusPointsWrap a { text-decoration: underline; color: #333333; } .dgClub .termsTable { font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .dgClub .termsTable tr td:first-child { padding: 3px 5px 10px 0; vertical-align: top; } .dgClub .termsTable tr td:nth-child(2) { padding: 0 0 10px 0; vertical-align: top; line-height: 1.8; } .enquire .selectEnquireWrap { width: 670px; max-width: 100%; display: block; margin: 30px auto 30px; } html[lang="zh-hk"] .enquire .selectEnquireWrap { width: 400px; } html[lang="zh-cn"] .enquire .selectEnquireWrap { width: 400px; } .enquire .selectEnquireWrap .selectEnquire { display: block; width: auto; padding-bottom: 15px; margin: 0 auto; } .enquire .selectEnquireWrap .selectEnquire .radio-style { display: inline-block; vertical-align: middle; top: -1px; } .enquire .selectEnquireWrap .selectEnquire label { display: inline-block; cursor: pointer; } .enquire .selectEnquireWrap .selectEnquire .enquireCheck { margin-bottom: 8px; margin-left: 25px; } .enquire .enquireLine { display: inline-block; width: 100%; height: 1px; background-color: #DDDDDD; margin-bottom: 10px; } .enquire .enquireForm .enquireFormHeader { text-align: center; } .enquire .enquireForm .enquireFormHeader h3 { font-size: 20px; color: #E97929; font-weight: normal; margin-bottom: 10px; } .enquire .enquireForm .enquireFormHeader h4 { margin-bottom: 5px; font-family: Arial, "Microsoft JhengHei", "微軟正黑體", PMingLiU, sans-serif; } .enquire .enquireForm .enquireFormHeader h4 span { color: #E97929; font-size: 22px; font-weight: bold; position: relative; top: 5px; } .enquire .enquireForm .enquireFormMain { font-family: Arial, "Microsoft JhengHei", "微軟正黑體", PMingLiU, sans-serif; } .enquire .enquireForm .formRow { display: inline-block; width: 100%; margin: 5px 0 0; } .enquire .enquireForm .formRow .formLabel { display: block; float: left; width: 43%; text-align: right; padding-right: 15px; line-height: 25px; } .enquire .enquireForm .formRow .formLabel span { font-weight: bold; } .enquire .enquireForm .formRow .formLabel span span.required { color: #E97929; font-size: 22px; font-weight: bold; position: relative; top: 5px; } .enquire .enquireForm .formRow .formInput { display: block; float: left; width: 57%; } .enquire .enquireForm .formRow .formInput input[type="text"] { border: 1px solid #B7B7B7; padding: 5px; height: 35px; width: 370px; } .enquire .enquireForm .formRow .formInput .telWrap1 { display: inline-block; } .enquire .enquireForm .formRow .formInput .telWrap1 input { width: 40px; } .enquire .enquireForm .formRow .formInput .telWrap2 { display: inline-block; width: 266px; } .enquire .enquireForm .formRow .formInput .telWrap2 input { width: 100%; } .enquire .enquireForm .formRow .formInput .formInputGroup .selectWrap { display: inline-block; position: relative; background: #ffffff; margin-right: 10px; } .enquire .enquireForm .formRow .formInput .formInputGroup .selectWrap:after { content: ""; z-index: 1; position: absolute; right: 10px; top: 14px; width: 20px; height: 12px; background-image: url(/share/images/selectArrow.svg); background-repeat: no-repeat; } .enquire .enquireForm .formRow .formInput .formInputGroup .selectWrap select { z-index: 2; background: transparent; position: relative; font-size: 16px; border: 1px solid #B7B7B7; padding: 8px 10px; height: 35px; width: 85px; appearance: none; -moz-appearance: none; -webkit-appearance: none; line-height: 1; } html[lang="zh-hk"] .enquire .enquireForm .formRow .formInput .formInputGroup .selectWrap select { padding: 5px 10px; } html[lang="zh-cn"] .enquire .enquireForm .formRow .formInput .formInputGroup .selectWrap select { padding: 5px 10px; } .enquire .enquireForm .formRow .formInput .formInputGroup input[type="text"] { width: 272px; } .enquire .enquireForm .formRow .formInput .inputCheck { margin-bottom: 5px; } .enquire .enquireForm .formRow .formInput .inputCheck:first-child { margin-top: 8px; } .enquire .enquireForm .formRow .formInput .inputCheck label { cursor: pointer; display: inline-block; } .enquire .enquireForm .formRow .formInput .inputCheck .checkbox-style { vertical-align: top; top: 1px; } .enquire .enquireForm .formRow .formInput .inputCheck input[type="text"] { border: 0; border-bottom: 1px solid #000000; width: 115px; height: 20px; padding: 5px; } .enquire .enquireForm .formRow .formInput textarea { border: 1px solid #B7B7B7; padding: 5px; height: 75px; width: 370px; resize: none; font-family: 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .enquire .enquireForm .enquireFormFooter { margin-top: 30px; margin-bottom: 30px; font-family: Arial, "Microsoft JhengHei", "微軟正黑體", PMingLiU, sans-serif; } .enquire .enquireForm .enquireFormFooter .formCaptchaWrap { display: block; margin: 0 auto 50px; } .enquire .enquireForm .enquireFormFooter .formCaptchaWrap .formLabel span { font-weight: bold; } .enquire .enquireForm .enquireFormFooter .formCaptchaWrap .formLabel span span.required { color: #E97929; font-size: 22px; font-weight: bold; position: relative; top: 5px; } .enquire .enquireForm .enquireFormFooter .formCaptchaWrap .formCaptcha { margin: 25px 0; } .enquire .enquireForm .enquireFormFooter .formCaptchaWrap .formCaptcha img { display: block; margin: 0 auto; float: none; border: 1px solid #B7B7B7; } .enquire .enquireForm .enquireFormFooter .formCaptchaWrap .formCaptchaInput input[type="text"] { border: 1px solid #B7B7B7; padding: 5px 10px; height: 35px; width: 170px; } .enquire .enquireForm .enquireFormFooter .formSubmitWrap { text-align: center } .enquire .enquireForm .enquireFormFooter .formSubmitWrap .btnFormButton { display: inline-block; border: 2px solid #EA7A29; padding: 0; position: relative; margin: 0 5px; } .enquire .enquireForm .enquireFormFooter .formSubmitWrap .btnFormButton.btnReset { border: 2px solid #333333; } .enquire .enquireForm .enquireFormFooter .formSubmitWrap .btnFormButton:before { content: ""; position: absolute; right: -6px; top: -6px; background-color: #EA7A29; border: 4px solid #ffffff; width: 2px; height: 2px; } .enquire .enquireForm .enquireFormFooter .formSubmitWrap .btnFormButton.btnReset:before { content: ""; position: absolute; right: -6px; top: -6px; background-color: #333333; border: 4px solid #ffffff; width: 2px; height: 2px; } .enquire .enquireForm .enquireFormFooter .formSubmitWrap .btnFormButton input { display: inline-block; background: #ffffff; cursor: pointer; border-radius: 0; padding: 10px 15px; width: 95px; outline: 0; } .enquire .enquireForm .enquireFormFooter .form_enquire1_footer { margin-top: 50px; } .enquire .iconHelp { display: inline-block; position: relative; top: 4px; margin-left: 5px; } .enquire .iconHelp img { float: none; margin: 0; } .enquire .iconInfo { display: inline-block; position: relative; top: 4px; } .enquire .iconInfo img { float: none; margin: 0; } .worldwide img { max-width: 100%; float: none; margin: 0; } .worldwide .worldwideBannerWrap { margin-bottom: 80px; position: relative; } .worldwide .worldwideBannerWrap .lSSlideOuter .lSPager.lSpg { bottom: -30px; } .worldwide .worldwideBannerWrap #worldwideBanner .worldwideBannerItem img { width: 100%; float: none; margin: 0; } .worldwide .title { color: #EA7A29; padding-bottom: 15px; border-bottom: 1px solid #EA7A29; font-size: 20px; margin-bottom: 15px; } .worldwide .onlineStore { margin-bottom: 50px; } .worldwide .onlineStore .onlineStoreLogo { min-height: 150px; } .worldwide .onlineStore .onlineStoreType { text-align: center; padding-top: 15px; margin-top: 5px; border-top: 1px solid #DDDDDD; } .worldwide .redemption { margin-bottom: 50px; } .worldwide .redemption .redemptionLogo { min-height: 150px; } .worldwide .redemption .redemptionType { text-align: center; padding-top: 15px; margin-top: 5px; border-top: 1px solid #DDDDDD; } .worldwide .productCategory { color: #EA7A29; padding-bottom: 15px; font-size: 20px; margin-bottom: 15px; } .worldwide .productList .productListWrap { border-left: 1px solid #DDDDDD; border-right: 1px solid #DDDDDD; } .worldwide .productList .productListWrap .productItem { display: block; width: 25%; float: left; border-right: 1px solid #DDDDDD; padding: 15px 25px 15px; } .worldwide .productList .productListWrap .productItem:nth-child(4n) { border-right: 0; } .worldwide .productList .productListWrap .productItem .productThumb img { float: none; margin: 0; width: 100%; } .worldwide .productList .productListWrap .productItem .productTitle { margin: 15px 0 5px; padding-left: 20px; position: relative; height: 38px; overflow: hidden; } .worldwide .productList .productListWrap .productItem .productTitle:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 8px; left: 0; } .worldwide .productList .productListWrap .productItem .productTitle a { color: #EA7A2A; } .worldwide .productList .productListWrap .productItem .productDesigner { padding-left: 20px; } .worldwide .productList .productListWrap .productItem .productDesigner a { color: #333333; } .worldwide .productList .productListWrap .productCatTitle { position: relative; } .worldwide .productList .productListWrap .productCatTitle .select_a { border: 1px solid #EA7A29; padding: 10px; width: 100%; display: block; color: #1b1b1b; background-image: url(/share/images/btnArrowDown.svg); background-repeat: no-repeat; background-position: 95% 50%; } .worldwide .productList .productListWrap .productCatTitle .select_a.on { background-image: url(/share/images/btnArrowUp.svg); } .worldwide .productList .productListWrap .productCatTitle .select_list { display: none; position: absolute; border: 1px solid #EA7A29; width: 100%; padding: 0; } .worldwide .productList .productListWrap .productCatTitle .select_list li { list-style: none; border-bottom: 1px solid #ffffff; padding: 0; background-color: #EA7A29; } .worldwide .productList .productListWrap .productCatTitle .select_list li:hover { background-color: #cc6114; } .worldwide .productList .productListWrap .productCatTitle .select_list li:last-child { border-bottom: 0; } .worldwide .productList .productListWrap .productCatTitle .select_list li a { color: #ffffff; padding: 10px; display: block; } .homeCnShop .mainPageTitle { text-align: center; padding: 70px 0 50px; } .homeCnShop .mainPageTitle h2 { position: relative; display: inline-block; color: #EA7A2A; letter-spacing: 2px; font-size: 58px; text-align: left; padding-left: 15px; padding-top: 15px; line-height: 1.2; font-family: 'Open Sans Condensed', 'Montserrat', "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; font-weight: normal; text-transform: uppercase; } .homeCnShop .mainPageTitle h2:before { content: ""; position: absolute; width:40px; height: 1px; background-color: #EA7A2A; top: 0; left: 0; } .homeCnShop .mainPageTitle h4 { font-size: 20px; font-weight: normal; margin-top: 40px; margin-bottom: 20px; } .homeCnShop .cnShopList .cnShopItem { margin-bottom: 50px; } .homeCnShop .cnShopList .cnShopItem .cnShopImage { border: 1px solid #E5E5E5; margin: 0 0 15px; } .homeCnShop .cnShopList .cnShopItem .cnShopImage img { float: none; } .homeCnShop .cnShopList .cnShopItem .cnShopTitle { margin: 15px 0; padding-left: 20px; position: relative; text-transform: uppercase; } .homeCnShop .cnShopList .cnShopItem .cnShopTitle:before { content: ""; position: absolute; width: 15px; height: 1px; background-color: #EA7A2A; top: 10px; left: 0; } .homeCnShop .cnShopList .cnShopItem .cnShopTitle a { color: #4A494B; } .homeCnShop .cnShopList .cnShopItem .cnShopTitle a span { color: #EA7A2A; } .cnShopBreadcrumb { position: absolute; font-size: 0; top: -30px; } .cnShopBreadcrumb a{ color:#777777; font-size: 14px; } .cnShopBreadcrumb a:after{ content: '>'; display: inline-block; margin: 0 5px; } .cnShopBreadcrumb a:last-child:after{ display: none; } .cnShopBreadcrumb a:last-child,.breadcrumb a.on{ color:#EA7A2A; } .select2-container { height: 40px; } .select2-search--dropdown { display: none; } .select2-container--default .select2-results > .select2-results__options { max-height: 100%; overflow-y: unset; } /* 4/5/2022 padding en version size Gift-cglist */ .select2-container .select2-selection--single .select2-selection__rendered { padding-left: 10px; padding-right: 70px; text-align: left; line-height: 40px; color: #393939; } .select2-container--default .select2-selection--single { height: 100%; border: 1px solid #EA7A29; border-radius: 0; outline: none; } .select2-container--default .select2-selection--single .select2-selection__arrow:after { content: ""; z-index: 1; position: absolute; right: 10px; top: 14px; width: 20px; height: 12px; background-image: url(/share/images/selectArrow.svg); background-repeat: no-repeat; } .select2-container--default .select2-selection--single .select2-selection__arrow b { display: none; } .select2-dropdown { border-radius: 0; } .select2-container--default .select2-results__option[aria-selected=true] { background-color: transparent; } .select2-container--default .select2-results__option--highlighted[aria-selected] { background-color: #EA7A2A; } .select2-results__option { padding: 10px; border-bottom: 1px solid #C6C6C6; } .select2-results__option:last-child { border-bottom: 0; } .cookiesWrap { background-color: rgba(64,64,64,0.95); width: 100%; min-height: 60px; height: auto; position: fixed; bottom: 0; z-index: 99; line-height: 1; } .cookiesWrap .wrap { width: 800px; font-size: 15px; height: 100%; } html[lang="en-hk"] .cookiesWrap .wrap { width: 920px; } .cookiesWrap .wrap .cookiesMessage { color: #FFFFFF; width: 100%; line-height: 60px; } .cookiesWrap .wrap .cookiesMessage a { color: #EA7A2A; text-decoration: underline; } .cookiesWrap .wrap .cookiesMessage a.acceptCookies { float: right; font-size: 14px; text-decoration: none; color: #FFFFFF; background-color: #EA7A2A; border-radius: 5px; padding: 0 10px; width: 150px; height: 30px; line-height: 30px; text-align: center; margin-top: 15px; } span.splitLine { display: inline-block; width: 1px; height: 15px; background-color: #333333; position: relative; top: 3px; } html[lang="zh-hk"] span.splitLine { top: 1px; } html[lang="zh-cn"] span.splitLine { top: 1px; } span.topHeaderSplit { display: inline-block; width: 1px; height: 15px; background-color: #aaaaaa; position: relative; top: 3px; margin: 0 15px; } .tooltip { position: relative; display: inline-block; top: 4px; } .tooltip .tooltiptext { visibility: hidden; width: 190px; background-color: #E97929; color: #fff; text-align: center; border-radius: 6px; padding: 5px 0; position: absolute; z-index: 99; bottom: 150%; left: 0; margin-left: -85px; } .tooltip .tooltiptext2 { width: 220px; margin-left: -100px; } .tooltip .tooltiptext3 { width: 260px; margin-left: -120px; } .tooltip .tooltiptext::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: #E97929 transparent transparent transparent; } .tooltip:hover .tooltiptext { visibility: visible; } .tooltip img { margin: 0; } .langGroup { display: block; position: absolute; right: 10%; top: 27px ;color: #1b1b1b; font-size: 16px; } .langGroup.expand { right: 300px; } .langGroup a { color: #1b1b1b; font-family: "Roboto", "Microsoft JhengHei", "微軟正黑體", Verdana, Arial, PMingLiU, sans-serif; } .langGroup a.btnLangEn { margin-left: 15px; } .langGroup a.active { color: #E97929; font-weight: bold; } html[lang="zh-cn"] .langGroup { right: 5%; } /*----------------------------------------------------------------- For Tablet -----------------------------------------------------------------*/ @media screen and (max-width: 1024px) { .wrap { max-width:768px; } .Tcol1, .Tcol2, .Tcol3, .Tcol4, .Tcol5, .Tcol6, .Tcol7, .Tcol8, .Tcol9, .Tcol10, .Tcol11, .Tcol12 { float: left; margin-right:2.7118644%; } .Tcol1 { width: 5.8474576%; } .Tcol2 { width: 14.4067796%; } .Tcol3 { width: 22.9661016%; } .Tcol4 { width: 31.5254236%; } .Tcol5 { width: 40.0847456%; } .Tcol6 { width: 48.6440676%; } .Tcol7 { width: 57.2033896%; } .Tcol8 { width: 65.7627116%; } .Tcol9 { width: 74.3220336%; } .Tcol10 { width: 82.8813556%; } .Tcol11 { width: 91.4406776%; } .Tcol12 { width: 99.9999996%; margin-right: 0; } .Tpush0 {margin-left:0%;} .Tpush1 {margin-left:8.559322%;} .Tpush2 {margin-left:17.118644%;} .Tpush3 {margin-left:25.677966%;} .Tpush4 {margin-left:34.237288%;} .Tpush5 {margin-left:42.79661%;} .Tpush6 {margin-left:51.355932%;} .Tpush7 {margin-left:59.915254%;} .Tpush8 {margin-left:68.474576%;} .Tpush9 {margin-left:77.033898%;} .Tpush10 {margin-left:85.59322%;} .Tpush11 {margin-left:94.152542%;} .Tpull0 {margin-right:0%;} .Tpull1 {margin-right:8.559322%;} .Tpull2 {margin-right:17.118644%;} .Tpull3 {margin-right:25.677966%;} .Tpull4 {margin-right:34.237288%;} .Tpull5 {margin-right:42.79661%;} .Tpull6 {margin-right:51.355932%;} .Tpull7 {margin-right:59.915254%;} .Tpull8 {margin-right:68.474576%;} .Tpull9 {margin-right:77.033898%;} .Tpull10 {margin-right:85.59322%;} .Tpull11 {margin-right:94.152542%;} .Tlast { margin-right: 0; } .Tcol1 img, .Tcol2 img, .Tcol3 img, .Tcol4 img, .Tcol5 img, .Tcol6 img, .Tcol7 img, .Tcol8 img, .Tcol9 img, .Tcol10 img, .Tcol11 img, .Tcol12 img { width: 100%; height: auto; display: block; } body.menuOn { overflow: auto; } .mobileVisible { display: none; } /* Common*/ .photoFancyContainer img { max-height:600px; max-width:600px; } /*body { min-width:760px; }*/ #header .logo{padding: 12px 0; top: 12px;} #header .logo #hktdcdg { top: 0; position: absolute; } #header #navigation{position: absolute;top:0;left:0;width:100%;text-align: left;display:none;} #header #navigation ul{width: 768px; max-width: 100%;padding-right:0;max-height:unset;} #header #navigation ul li{float:none;margin: 0 10px;} #header #navigation ul li > a{padding: 15px 20px;} #header #navigation ul li > a:before{content:'';position: absolute;width:15px;height:15px;border:1px solid #FFF;border-top:none;border-left:none;right:20px;top:50%;margin-top:-7.5px;transform: rotate(-45deg);transition: 0.2s cubic-bezier(0.55, 0.055, 0.675, 0.19) all;display:none;} #header #navigation ul li > a:only-child:before{display:none;} #header #navigation ul li > ul{position: relative;top: 0;background: none;display:none;} #header #navigation ul li > ul li > a{padding:10px 15px;padding-left:20px;} #header #navigation ul li:hover > ul{display:none;} #header #navigation ul li.on > a:before{transform: rotate(45deg);margin-top: -12px;} #header .lang {margin-left: 15px;margin-top: 20px;margin-bottom: 30px;} #header .lang a{color:#FFF;border-color:#FFF;} #header .mainMenuHeader { margin: 0 auto; width: 768px; max-width: 100%; padding: 25px 20px 10px 20px; height: auto; } html[lang='zh-cn'] #header .mainMenuHeader { height: 75px; } #header #navigation > ul > li.dropdown::before { right: 15px; top: 28px; } #header #navigation > ul > li.dropdown.active::before { right: 15px; top: 28px; } #header .mainMenuHeader .btnGroup { width: auto; position: relative; right: 55px; } #header > .wrap { max-width: 100%; } #header > .wrap > .wrap { width: 100%; max-width: 768px; } #topHeaderWrap { max-width: 100%; padding: 0 20px; margin-bottom: 0; } #topHeaderWrap a { font-size: 14px; } #topHeaderWrap .wrap { width: 100%; } footer .sitemap .links a { font-size: 13px; } .subHeader .subHeaderWrap h1 { font-size: 32px; } .mobileMenuBtn {display:block;} #mainHeaderWrap a.searchBtn { display: none !important; right: 8%; } .searchBtnInput { display: inline-block !important; position: relative; right: unset; width: 100%; top: unset; margin-top: 25px; opacity: 0; transition: all 2s; } .searchBtnInput input#headerSearchInput { width: 100%; height: 40px; font-size: 14px; } .searchBtnInput #headerSearchInput { background-color: transparent; border-radius: 0; } .searchBtnInput:before { width:40px; height: 40px; } .searchBtnInput input#headerSearchSubmit { width:40px; height: 40px; background-position: 5px; } /* Index */ .controls .prevBtn, .controls .nextBtn { bottom:90px;} .tabletOnly { display: block; } html[lang="zh-hk"] .sectionTitle { font-size: 40px; } .homeDesigners { height: auto; position: relative; background-color: #343434; background-image: none; } .homeDesigners .wrap { padding: 0; } .homeDesigners #homeDesignersSlider { height: auto !important; } .homeDesigners .homeDesignersLeft { width: 80%; float: none; margin: 0 auto; height: 245px; } .homeDesigners .homeDesignersLeft .tabletOnly.designerPhoto { float: right; } .homeDesigners .homeDesignersRight { width: 100%; height: auto; float: none; } .homeDesigners .homeDesignersRight .designerPhoto { display: none; } .homeDesigners .homeDesignersRight .designerDetail { padding: 50px 67px; width: 100%; } .homeVideo { position: relative; background-image: none; } .homeVideo .homeVideoLeft { width: 100%; float: none; margin-bottom: 30px; background: none; position: relative; } .homeVideo .homeVideoLeft .sectionTitle { top: 0; } html[lang="zh-hk"] .homeVideo .homeVideoLeft .sectionTitle { top: 0; } .homeVideo .homeVideoRight { width: 100%; float: none; } .homeVideo .homeVideoRight .homeVideoSliderWrap { width: 100%; } .homeVideo::before { content: ""; display: block; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: -10; background: url(/share/images/design_spotlight.jpg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .homeService { padding: 50px 0; } .homeService .homeServiceLeft { width: 100%; margin-bottom: 30px; } .homeService .homeServiceRight { width: 100%; } .homeService .homeServiceRight .serviceBox .serviceBoxInner { height: 65px; font-size: 14px; } .homeService .homeServiceRight .serviceBox:first-child .serviceBoxInner span { width: 95px; height: auto; } html[lang="zh-hk"] .homeService .homeServiceRight .serviceBox:first-child .serviceBoxInner span { width: auto; } .homeService .homeServiceRight .serviceBox:nth-child(2) .serviceBoxInner span { left: 56%; width: 135px; } .homeService .homeServiceRight .serviceBox:nth-child(3) .serviceBoxInner span { width: 168px; left: 56%; } html[lang="zh-hk"] .homeService .homeServiceRight .serviceBox:nth-child(3) .serviceBoxInner span { width: 120px; } .homeService .homeServiceRight .serviceBox .serviceBoxInner span::before { top: 10px; } .homeHKBrands { background-color: #ffffff; } .homeDGClub { padding: 50px 0 50px; } .homeDGClub .homeDGClubRight { padding: 0; } .homeStores { padding: 0; } .homeStores .homeStoresLeft { width: 220px; } .homeStores .homeStoresLeft .sectionTitle { top: 60px; } .homeStores .homeStoresRight { width: calc(100% - 220px); } .homeStores .homeStoresRight .storePhoto { width: calc(50% - 1px); height: 210px; overflow: hidden; } .homeStores .homeStoresRight .storePhoto img { width: auto; max-width: unset; height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .homeStores .homeStoresRight .storePhoto:nth-child(2) span.storeLocation { width: auto; } .homeHKBrands .homeHKBrandsLeft { width: 220px; } .homeHKBrands .homeHKBrandsRight { width: calc(100% - 220px); } .homeBottomBanner { padding: 50px 0 40px; } .homeBottomBanner .customLink { display: none; } .homeCnShop { background-color: #ffffff; } .homeNews { min-height: 300px; position: relative; background: none; } .homeNews .homeNewsRight p { margin-top: 52px; } .homeNews::before { content: ""; display: block; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: -10; background: url(/share/images/design_spotlight2.jpg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .homeJoin { min-height: 300px; } .homeBottomBanner { background-color: #ffffff; } .footerTop { background-color: #ffffff; } .subHeader .subHeaderWrap .breadcrumb { width: 100%; max-width: 768px; } .happenings .newsListWrap { width: 100%; } .happenings .newsListWrap .newsItem { width: 221px; } .hkdesigners .hkdesignerDetail .hkdesignerVideo { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .hkdesigners .hkdesignerDetail .hkdesignerVideo iframe, .hkdesigners .hkdesignerDetail .hkdesignerVideo object, .hkdesigners .hkdesignerDetail .hkdesignerVideo embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .products .productList .productListWrap .productItem { width: 50%; } .products .productList .productListWrap .productItem:nth-child(2n) { border-right: 0; } .products .productList .productListWrap .productItem .productThumb { height: 362px; } .consignment .consignmentCriteria .consignmentCriteriaItem h4 { width: 90%; } .consigneasy h5 { width: 90%; } .hkdesignerSliderWrap .hkdesignerSliderControls > a { z-index: 99; } .hkdesignerSliderWrap .hkdesignerSliderControls > a.slidePrev { left: 15px; top: 48%; } .hkdesignerSliderWrap .hkdesignerSliderControls > a.slideNext { right: 15px; top: 48%; } #hkbrandSlider .slideItem { touch-action: none; } .hkbrandSliderWrap .hkbrandSliderControls > a { z-index: 99; } .hkbrandSliderWrap .hkbrandSliderControls > a.slidePrev { left: 15px; top: 48%; } .hkbrandSliderWrap .hkbrandSliderControls > a.slideNext { right: 15px; top: 48%; } #hkdesignerSlider .slideItem { touch-action: none; } .gifts .giftList .giftListWrap .giftItem { width: 50%; } .gifts .giftList .giftListWrap .giftItem:nth-child(2n) { border-right: 0; } .gifts .giftList .giftListWrap .giftItem .giftThumb { height: 362px; } .dgClub .privilegesWrap { width: 100%; } .dgClub .privilegesWrap .privilegesItem { width: 200px; } .dgClub .privilegesWrap .privilegesItem:nth-child(1) { border: 10px solid #ffffff; } .dgClub .privilegesWrap .privilegesItem:nth-child(3) { border: 10px solid #ffffff; } .dgClub .privilegesWrap .privilegesItem:nth-child(4) { border: 10px solid transparent; } .dgClub .privilegesWrap .privilegesItem:nth-child(5) { border: 10px solid transparent; } .dgClub .privilegesWrap .privilegesItem img { width: 100%; } .dgClub .privilegesWrap .privilegesItem .privilegesItemContent { font-size: 12px; width: 90%; } .dgClub .dgClubRewards .rewardsProgramWrap { width: 100%; } .dgClub .bonusPointsWrap { width: 100%; } .dgClub .termsTable tr td:first-child { padding: 5px 5px 10px 0; } .dgClub .termsTable tr td:nth-child(2) { line-height: 2.1; } .dgClub .dgClubTop .btnBack img { width: auto; } .enquire .enquireForm .mHidden { display: none; } .enquire .enquireForm .formRow .formInput .inputCheck label { width: 345px; } .enquire .enquireForm .formRow .formInput .inputCheck:last-child label { width: auto; } .enquire .enquireForm .formRow .formInput textarea { padding: 5px; } .stores .showFloorPlan::before, .stores .showFloorPlan::after { display: none; } .stores .selectMap::before, .stores .selectMap::after { display: none; } .storesMap > iframe { max-width: 100%; } .productDetail .productInfo .btnEnquire::before, .productDetail .productInfo .btnEnquire::after { display: none; } .productDetail .productInfo .btnShare::before, .productDetail .productInfo .btnShare::after { display: none; } footer .sitemap .links > div { line-height: 1.5; } footer .sitemap .hktdc_logo img { margin-left: 0; } .worldwide .onlineStore .onlineStoreLogo img { width: auto; margin: 0 auto; } .worldwide .productList .productListWrap .productItem { width: 50%; } .worldwide .productList .productListWrap .productItem:nth-child(2n) { border-right: 0; } .worldwide .onlineStore .onlineStoreType { padding-bottom: 15px; } span.topHeaderSplit { display: none; } .happenings .newsListWrap .newsItem .newsThumb { height: 148px; } .langGroup.expand { right: 55px; } html[lang="zh-cn"] .langGroup { right: 55px; } html[lang="zh-cn"] .langGroup.expand { right: 55px; } } @media screen and (max-width: 980px) { #topHeaderWrap { max-width: 768px; } #header .mainMenuHeader { height: auto; } html[lang='zh-cn'] #header .mainMenuHeader { height: 75px; } } /*----------------------------------------------------------------- For Mobile -----------------------------------------------------------------*/ @media screen and (max-width: 767px) { /* `Grid ----------------------------------------------------------------------------------------------------*/ .wrap { min-width:320px; padding:0 15px; max-width: 100%; } .Mcol1, .Mcol2, .Mcol3, .Mcol4, .Mcol5, .Mcol6, .Mcol7, .Mcol8, .Mcol9, .Mcol10, .Mcol11, .Mcol12 { float: left; margin-right:2.7118644%; } .Mcol1 { width: 5.8474576%; } .Mcol2 { width: 14.4067796%; } .Mcol3 { width: 22.9661016%; } .Mcol4 { width: 31.5254236%; } .Mcol5 { width: 40.0847456%; } .Mcol6 { width: 48.6440676%; } .Mcol7 { width: 57.2033896%; } .Mcol8 { width: 65.7627116%; } .Mcol9 { width: 74.3220336%; } .Mcol10 { width: 82.8813556%; } .Mcol11 { width: 91.4406776%; } .Mcol12 { width: 100%; margin-right: 0; } .Mlast { margin-right: 0; } .Mpush0 {margin-left:0%;} .Mpush1 {margin-left:8.559322%;} .Mpush2 {margin-left:17.118644%;} .Mpush3 {margin-left:25.677966%;} .Mpush4 {margin-left:34.237288%;} .Mpush5 {margin-left:42.79661%;} .Mpush6 {margin-left:51.355932%;} .Mpush7 {margin-left:59.915254%;} .Mpush8 {margin-left:68.474576%;} .Mpush9 {margin-left:77.033898%;} .Mpush10 {margin-left:85.59322%;} .Mpush11 {margin-left:94.152542%;} .Mpull0 {margin-right:0%;} .Mpull1 {margin-right:8.559322%;} .Mpull2 {margin-right:17.118644%;} .Mpull3 {margin-right:25.677966%;} .Mpull4 {margin-right:34.237288%;} .Mpull5 {margin-right:42.79661%;} .Mpull6 {margin-right:51.355932%;} .Mpull7 {margin-right:59.915254%;} .Mpull8 {margin-right:68.474576%;} .Mpull9 {margin-right:77.033898%;} .Mpull10 {margin-right:85.59322%;} .Mpull11 {margin-right:94.152542%;} .Mcol1 img, .Mcol2 img, .Mcol3 img, .Mcol4 img, .Mcol5 img, .Mcol6 img, .Mcol7 img, .Mcol8 img, .Mcol9 img, .Mcol10 img, .Mcol11 img, .Mcol12 img { width: 100%; height: auto; display: block; } .mobileHidden { display: none !important; } .mobileVisible { display: block; margin: 0 auto; } /* Common ----------------------------------------------------------------------------------------------------*/ body {min-width:320px;} .mobileMenuBtn {display:block; right: 5px;} .photoFancyContainer { min-width:auto; min-height:auto;} .form .row{margin:0px;} .form .row .col{display:inline-block;width:100%;padding:0px;margin-bottom:20px;} .form .row .col .row{width: 100%;margin-left:0;margin-right:0;} .form .row .col .row .col{margin-bottom:10px;} .form .row .col .row .col:last-child{margin-bottom:0;} /* .contentArea (for CMS content) ----------------------------------------------------------------------------------------------------*/ .contentArea img { width:100%; } #header .wrap { min-height: 80px; } #header > .wrap > .wrap { padding: 0; } #header .logo { top: 10px; left: 0; max-width: 148px; height: 50px; padding: 0; } #header .logo img { max-width: 100%; } #header .logo #hktdcdg { width: 148px; height: 50px; } #header .mainMenuHeader { height: auto; padding: 10px; } html[lang='zh-cn'] #header .mainMenuHeader { height: auto; } #header .mainMenuHeader .btnGroup { float: none; width: 100%; text-align: left; margin: 40px 2px 20px; right: unset; } #header .mainMenuHeader .cnOnlineShop { float: none; width: 100%; } #header .mainMenuHeader .cnOnlineShop a { width: 100%; text-transform: capitalize; } #header #navigation ul { min-height: auto; max-height:unset; } #header #navigation ul li > a { padding: 15px 0; font-size: 20px; } #header #navigation ul li > ul li > a { padding: 10px; } #header > .wrap > .wrap { min-width: 100%; } #topHeaderWrap { min-width: 320px; padding: 0 15px; max-width: 100%; } #topHeaderWrap a { font-size: 12px; padding: 5px 0; } #topHeaderWrap .wrap { min-width: 100%; } span.icon-user { width: 18px; height: 18px; background-image: url(/share/images/icon_user_m.svg); top: 3px; } .tabletOnly { display: none; } a.searchBtn { display: none !important; } .searchBtnInput { display: inline-block; position: relative; right: unset; width: 100%; top: unset; margin-top: 25px; } .searchBtnInput input#headerSearchInput { width: 100%; height: 40px; font-size: 14px; } .searchBtnInput #headerSearchInput { background-color: transparent; border-radius: 0; } .searchBtnInput:before { width:40px; height: 40px; } .searchBtnInput input#headerSearchSubmit { width:40px; height: 40px; background-position: 5px; } #header .mainMenuHeader .btnGroup a.btnIcon { margin: 0 1%; } #header .mainMenuHeader .btnGroup a.btnEnquire { padding-right: 1%; } /* index */ .homeSlider { padding-bottom: 50px; background-color: #ffffff; } .homeSlider .lSSlideOuter .lSPager.lSpg { bottom: 16px; } .homeDesigners { background-image: none; height: auto; background-color: #ffffff; } .homeDesigners .wrap { padding: 0 !important; width: 80%; } .homeDesigners .homeDesignersLeft { width: 100%; float: none; } html[lang="zh-hk"] .homeDesigners .homeDesignersLeft { height: 230px; } .homeDesigners .homeDesignersRight { width: 100%; height: auto; float: none; overflow: hidden; margin-bottom: 30px; } .homeDesigners #homeDesignersSlider { height: auto !important; } .homeDesigners .homeDesignersRight .designerDetail { width: 100%; padding: 50px; } .homeDesigners .homeDesignersRight .designerPhoto { width: 100%; display: block; } .homeDesigners .homeDesignersRight .designerPhoto img { width: 100%; } .homeDesigners #homeDesignersSlider .designerPhoto img { height: auto; } .homeDesigners #homeDesignersSlider .quote { font-size: 20px; } .homeDesigners #homeDesignersSlider .quote .quote-txt-left { float: none; } .homeDesigners #homeDesignersSlider .quote .quote-txt-right { float: none; } .homeDesigners #homeDesignersSlider .quote .quote-txt-right::before { right: -60px; } .homeDesigners #homeDesignersSlider .designerLearnMore { left: -15px; } .homeDesigners #homeDesignersSlider .quote::after { bottom: 0; } .homeVideo { padding: 50px 0; height: auto; overflow: hidden; position: relative; background: none; } .homeVideo #video_background { top: 50%; left: 50%; width: 250%; transform: translate(-50%, -50%); } .homeVideo .videoDesc p { width: 100%; } .homeVideo a.learnMore { bottom: -30px; } .homeVideo .homeVideoLeft { width: 100%; margin-bottom: 0; } .homeVideo .homeVideoLeft .sectionTitle { top: 0; left: 0; margin-bottom: 35px; } .homeVideo .homeVideoRight { width: 100%; } .homeVideo .homeVideoRight .homeVideoSliderWrap { width: 100%; } .homeVideo::before { content: ""; display: block; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: -10; background: url(/share/images/design_spotlight.jpg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .homeHKBrands { padding: 50px 0; background-color: #ffffff; } .homeHKBrands .homeHKBrandsLeft { width: 100%; margin-bottom: 40px; } .homeHKBrands .homeHKBrandsRight { width: 100%; } html[lang="zh-hk"] .homeHKBrands .homeHKBrandsLeft .sectionTitle { top: 0; } .homeService .homeServiceLeft { width: 100%; margin-bottom: 40px; } .homeService .homeServiceRight { width: 100%; } .homeService .homeServiceRight .serviceBox { width: 100%; margin-bottom: 20px; } .homeService .homeServiceRight .serviceBox:nth-child(3) .serviceBoxInner span { width: auto; } .homeDGClub .homeDGClubLeft { width: 100%; margin-bottom: 30px; } .homeDGClub .homeDGClubRight { width: 100%; } .homeStores { padding: 50px 0; } .homeStores .homeStoresLeft { width: 100%; height: 120px; } .homeStores .homeStoresLeft .sectionTitle { top: 0; } .homeStores .homeStoresRight { width: 100%; } .homeStores .homeStoresRight .storePhoto { width: calc(100vw - 30px); height: calc(100vw - 30px); overflow: hidden; position: relative; } .homeStores .homeStoresRight .storePhoto:first-child { border-right: 0; width: 100%; height: auto; overflow: hidden; position: relative; border-bottom: 1px solid #ffffff; } .homeStores .homeStoresRight .storePhoto img { width: 100%; height: auto; position: relative; top: unset; left: unset; transform: unset; } .homeStores .homeStoresRight .storePhoto:nth-child(2) { width: 100%; height: auto; overflow: hidden; position: relative; } .homeStores .homeStoresRight .storePhoto:nth-child(2) span.storeLocation { width: auto; } .homeStores .homeStoresRight .storePhoto a:before { background-color: rgba(0,0,0,0); } .homeBottomBanner .homeBottomBannerLeft { margin-right: 0; width: 100%; margin-bottom: 20px; } .homeBottomBanner .homeBottomBannerRight { width: 100%; } .homeBottomBanner .slide-img { width: 100%; } .homeBottomBanner .slide-img:first-child { margin-bottom: 20px; } .homeBottomBanner .customLink { display: none; } .homeService .homeServiceRight .serviceBox .serviceBoxInner span { left: 53%; } .homeService .homeServiceRight .serviceBox:nth-child(2) .serviceBoxInner span { left: 55%; width: 135px; } .homeService .homeServiceRight .serviceBox:nth-child(3) .serviceBoxInner span { left: 55%; width: 170px; max-width: 100%; } html[lang="zh-hk"] .homeService .homeServiceRight .serviceBox:first-child .serviceBoxInner span { width: 58px; left: 54%; } html[lang="zh-hk"] .homeService .homeServiceRight .serviceBox:nth-child(2) .serviceBoxInner span { width: auto; } html[lang="zh-hk"] .homeService .homeServiceRight .serviceBox:nth-child(3) .serviceBoxInner span { width: 115px; left: 55%; } .homeCnShop { background-color: #ffffff; } .homeNews { min-height: 350px; position: relative; background: none; } .homeNews .homeNewsLeft { width: 100%; } .homeNews .homeNewsLeft .sectionTitle { top: 0; font-size: 38px; } .homeNews .homeNewsRight { width: 100%; padding: 0 7%; } .homeNews .homeNewsRight p { margin-top: 60px; } .homeNews::before { content: ""; display: block; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: -10; background: url(/share/images/design_spotlight2.jpg) no-repeat center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } .homeBottomBanner { background-color: #ffffff; } .footerTop { background-color: #ffffff; } .homeJoin .homeJoinLeft { width: 100%; } .homeJoin .homeJoinRight { width: 100%; padding: 0 7%; } .homeJoin .homeJoinLeft .sectionTitle { top: 0; font-size: 38px; } .subHeader .subHeaderWrap .breadcrumb { display: none; } .mainContent .mainPageTitle { padding: 50px 0 50px; } .mainContent .mainPageTitle h2 { font-size: 36px; } .mainContent .mainPageTitle h4 { font-size: 36px; } .mainContent .mainPageTitle h5 { font-size: 22px; } .mainContent .contentArea img { width: auto; max-width: 100%; display: block; margin: 0 auto; float: none; } .subHeader { height: 200px; overflow: hidden; } .subHeader .subHeaderWrap img { width: auto; max-width: unset; height: 200px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } .subHeader .subHeaderWrap h1 { font-size: 36px; text-align: center; width: 100%; } .subHeader .subHeaderWrap .breadcrumb { width: 100%; } .stores .storeSelect { margin-bottom: 40px; } .stores .storeSelect .storeSelectWrap { width: 100%; } .stores .storeSelect .storeSelectWrap #selectStoresArea { width: 100%; border-radius: 0; } .stores .storeWrap { margin-bottom: 50px; } .stores .storeWrap .storePhoto img { max-width: 100%; } .stores .storeDesc { border: 1px solid #dddddd; margin-top: 20px; padding: 15px 15px 0; } .stores .storeDesc.on { padding: 15px 15px } .stores .storeDesc .storeDetail { display: none; } .stores .storeWrap .storeDesc h3 { margin-bottom: 20px; position: relative; font-size: 20px; max-width: 95%; } .stores .storeWrap .storeDesc h3:after { content: ""; position: absolute; width: 20px; height: 20px; background-image: url(/share/images/btnPlus.svg); background-repeat: no-repeat; background-size: contain; right: -20px; top: 50%; transform: translate(0, -50%); } .stores .storeWrap .storeDesc.on h3:after { background-image: url(/share/images/btnMinus.svg); } .contentArea .stores .storeDesc p { padding-bottom: 15px; } .stores .selectMapOption a { text-align: center; } .stores .storeWrap.otherStores { margin-top: 30px; margin-bottom: 0; } .stores .storeWrap.otherStores .otherStoreItem { border-bottom: 0; margin-bottom: 5px; } .stores .otherStoreItem .otherStoreArea { margin-bottom: 15px; } .stores .otherStoreItem .otherStoreWrap { border: 1px solid #dddddd; padding: 15px; display: inline-block; margin-bottom: 10px; width: 100%; } .stores .otherStoreItem .otherStoreWrap .otherStoreTitle { position: relative; } .stores .otherStoreItem .otherStoreWrap .otherStoreTitle:after { content: ""; position: absolute; width: 20px; height: 20px; background-image: url(/share/images/btnPlus.svg); background-repeat: no-repeat; background-size: contain; right: -5px; top: 50%; transform: translate(0, -50%); } .stores .otherStoreItem .otherStoreWrap.on .otherStoreTitle:after { background-image: url(/share/images/btnMinus.svg); } .stores .otherStoreItem .otherStoreWrap .otherStoreAddress { display: none; } .stores .otherStoreItem .otherStoreWrap .otherStoreAddress p { padding-bottom: 0; } .storesMap > iframe { max-width: 100%; } .stores .showFloorPlan { width: 100%; margin-bottom: 15px; } .stores .showFloorPlan a:after { left: 32%; } html[lang="zh-hk"] .stores .showFloorPlan a:after { left: 35%; } html[lang="zh-cn"] .stores .showFloorPlan a:after { left: 35%; } .stores .showMapSelectWrap { width: 100%; } .stores .showMapSelectWrap .selectMap { width: 100%; background-position: 95% 15px; } .stores .showMapSelectWrap .selectMap span:after { left: 34%; } .newsSelectWrap { text-align: center; } .happenings .newsListWrap .newsItem { width: 100%; margin-right: 0; } .happenings .newsListWrap .newsItem .newsThumb { height: auto; } .happenings .newsListWrap .newsItem .newsThumb img { width: 100%; position: relative; left: 0; top: 0; transform: none; } .hkdesigners .hkdesignersList .hkdesigner { width: 100%; } .hkdesigners .hkdesignerDetail .hkdesignerVideo { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .hkdesigners .hkdesignerDetail .hkdesignerVideo iframe, .hkdesigners .hkdesignerDetail .hkdesignerVideo object, .hkdesigners .hkdesignerDetail .hkdesignerVideo embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .hkdesigners .mobileHkdesignerDesc p { padding: 15px 0 50px; line-height: 1.8; } .hkdesignerSliderWrap { border: 0; } #hkdesignerSlider .slideItem { border: 0; touch-action: none; } .hkdesignerSliderWrap .hkdesignerSliderControls > a.slidePrev { left: 5px; top: 48%; } .hkdesignerSliderWrap .hkdesignerSliderControls > a.slideNext { right: 5px; top: 48%; } .hkBrands .hkBrandsList .hkBrand { width: 50%; height: 200px; } .hkBrands .hkBrandsList .hkBrand:nth-child(5n+1) { clear: none; } .hkBrands .hkBrandsList .hkBrand .hkBrandPhoto { border-right: 1px solid #DFE1E0; } .hkBrands .hkBrandsList .hkBrand .hkBrandPhoto img { padding-top: 25%; padding-bottom: 15%; } .hkbrandSliderWrap .hkbrandSliderControls > a { z-index: 99; } .hkbrandSliderWrap .hkbrandSliderControls > a.slidePrev { left: 15px; top: 48%; } .hkbrandSliderWrap .hkbrandSliderControls > a.slideNext { right: 15px; top: 48%; } .hkbrandSliderWrap { border: 0; } #hkbrandSlider .slideItem { border: 0; touch-action: none; } .hkbrands .hkbrandDetail .hkbrand .hkbrandPhoto img { margin: 0 auto; } .products .productList .productListWrap .productItem { width: 50%; padding-top: 20px; } .products .productFilterWrap { text-align: center; } .products .productFilterWrap > div { width: 100%; } .products .productFilterWrap > div:first-child { margin-bottom: 15px; } .products .productFilterWrap > div.filterSplit { display: none; } .products .select2-container { width: 100% !important; } .products .productFilterWrap .selectWrap select { width: 100%; } .products .productSearchInputWrap input#productSearchInput { width: 100%; } .products .productList .productListWrap .productItem .productThumb { height: 300px; } .products .productList .productListWrap .productItem .productTitle a { width: 95%; display: block; } .productDetail .productGalleryWrap .productGalleryControls > a.slidePrev { left: 0; top: 30%; z-index: 99; } .productDetail .productGalleryWrap .productGalleryControls > a.slideNext { right: 0; top: 30%; z-index: 99; } .productDetail #productGallery .productGalleryItem { border: 0; } .productDetail #productGallery .productGalleryItem img { width: 70%; display: block; margin: 0 auto; border: 1px solid #dddddd; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery { display: block; flex-wrap: unset; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery li { display: block; flex-direction: unset; height: 85px; } .consignment .consignmentPhoto { margin-bottom: 30px; } .consignment .consignmentPhoto .consignmentPhotoItem { width: 100%; } .consignment .consignmentPhoto .consignmentPhotoItem:nth-child(1) { border-bottom: 1px solid #ffffff; } .consignment .consignmentPhoto .consignmentPhotoItem:nth-child(2) { border-bottom: 1px solid #ffffff; } .consignment .consignmentCriteria .consignmentCriteriaItem { margin-bottom: 30px; } .consignment2 .consignmentPhoto2 { margin-bottom: 30px; } .consignment2 .consignmentPhoto2 .consignmentPhotoItem2 { width: 100%; } .consignment2 .consignmentPhoto2 .consignmentPhotoItem2:nth-child(1) { border-bottom: 1px solid #ffffff; } .consignment2 .consignmentPhoto2 .consignmentPhotoItem2:nth-child(2) { border-bottom: 1px solid #ffffff; } .consignment2 .consignmentCriteria2 .consignmentCriteriaItem2 { margin-bottom: 30px; } .gifts .giftList .giftListWrap .giftItem { width: 50%; padding-top: 20px; } .gifts .giftList .giftListWrap .giftItem .giftThumb { height: 300px; } .gifts .giftList .giftListWrap .giftItem .giftTitle a { width: 95%; display: block; } .gifts .giftFilterWrap { text-align: center; } .gifts .giftFilterWrap > div { width: 80%; } .gifts .giftFilterWrap > div.filterSplit { display: none; } .gifts .giftFilterWrap > div:first-child { margin-bottom: 15px; } .gifts .giftFilterWrap .selectWrap select { width: 100%; } .gifts .giftSearchInputWrap input#giftSearchInput { width: 100%; } .dgClub .privilegesWrap .privilegesItem { width: 90%; margin: 10px !important; background-color: #ffffff; } .dgClub .privilegesWrap .privilegesItem .privilegesItemContent { font-size: 18px; } .dgClub .privilegesWrap .privilegesItem:nth-child(4) { top: 0; } .dgClub .privilegesWrap .privilegesItem:nth-child(5) { top: 0; } .dgClub .termsWrap { top: 0; } .dgClub .dgClubBorderTopWrap { padding-bottom: 40px; } .dgClub .dgClubRewards .rewardsProgramWrap table th, .dgClub .dgClubRewards .rewardsProgramWrap table td { padding: 15px; } .dgClub .rewardsTable .rewardName { float: none; } .dgClub .rewardsTable .btnRedeem { float: none; padding: 10px 15px; display: inline-block; margin-top: 10px; } .dgClub .dgClubBorderBottomWrap { padding: 0 15px; } .dgClub .rewardsTable { width: 100%; } .dgClub .dgClubRewards .rewardsProgramWrap table td:first-child { vertical-align: middle; } .dgClub .bonusPointsWrap { padding-bottom: 30px; } .dgClub .termsTable tr td:first-child { padding: 5px 5px 10px 0; } .dgClub .termsTable tr td:nth-child(2) { line-height: 2.1; } .enquire .selectEnquireWrap .selectEnquire label { width: 90%; } .enquire .enquireForm input, .enquire .enquireForm textarea, .enquire .enquireForm select { border-radius: 0; } .enquire .enquireForm .formRow .formLabel { width: 100%; text-align: left; } .enquire .enquireForm .formRow .formInput input[type="text"] { width: 100%; } .enquire .enquireForm .formRow .formInput .telWrap1 input[type="text"] { width: 40px; } .enquire .enquireForm .formRow .formInput .telWrap2 { display: inline-block; width: calc(100% - 106px); } .enquire .enquireForm .formRow .formInput .telWrap2 input[type="text"] { width: 100%; } .enquire .enquireForm .formRow .formInput { width: 100%; } .enquire .enquireForm .formRow .formInput .formInputGroup input[type="text"] { width: calc(100% - 100px); } .enquire .enquireForm .formRow .formInput textarea { width: 100%; } .enquire .enquireForm .formRow .formInput .inputCheck label { width: 90%; } .enquire .enquireForm .formRow .formInput .inputCheck:last-child label { width: auto; } .enquire .enquireForm .mHidden { display: none; } .enquire .enquireForm .enquireFormFooter .formSubmitWrap .btnFormButton input { appearance: none; -moz-appearance: none; -webkit-appearance: none; } .enquire .selectEnquireWrap .selectEnquire .radio-style { vertical-align: top; top: 5px; } .tooltip .tooltiptext { width: 160px; margin-left: -70px; padding: 0 10px; } .tooltip .tooltiptext2 { width: 120px; margin-left: -50px; padding: 0 10px; } .tooltip .tooltiptext3 { width: 130px; margin-left: -55px; padding: 0 10px; } .productDetail .backWrap a { font-size: 16px; line-height: 1.1; } .mainContent .contentArea .backWrap img { display: inline-block; float: left; margin: 0 5px 0 0; } .productDetail .mobileThumbGalleryWrap { display: block; } .productDetail .selectWrap.categorySelectWrap select { width: 100%; } .productDetail .productFilterWrap > div { width: 100%; } .productDetail .productFilterWrap > div.filterSplit { display: none; } .productDetail .productSearchInputWrap { width: 100%; } .productDetail .productSearchInputWrap input#productSearchInput { width: 100%; } .productDetail .productFilterWrap > div.categorySelectWrap { margin-bottom: 15px; } .productDetail .select2-container { width: 100% !important; } .productDetail .productGalleryWrap .lSSlideOuter .lSPager.lSGallery { margin-bottom: 30px; } #topHeaderWrap { display: none; } #navigation .topHeaderGroup { margin: 0 10px; padding-top: 25px; } #navigation .topHeaderGroup a { display: block; color: #1b1b1b; font-size: 20px; margin-bottom: 15px; letter-spacing: 1px; } #navigation .topHeaderGroup a i { font-size: 16px; margin-right: 5px; } footer { font-size: 12px; } footer .sitemap ul li { line-height: 35px; } footer .copyright { line-height: 35px; } footer .sitemap .hktdc_logo img { margin: 0; max-width: 80%; display: block; } footer .sitemap .links > div { line-height: 1.5; text-align: left } footer .sitemap .links > div.second { display: none; } footer .sitemap .links > div a { display: block; margin: 0 0 10px; } footer .sitemap .links > div span.splitLine { display: none; } footer .sitemap .links .footerSocialGroup a.footerSocialGroupTitle { display: block; margin-bottom: 10px; } footer .sitemap .links .footerSocialGroup a { display: inline-block; } footer .sitemap .links .footerSocialGroup a.social-icon { margin: 0 10px; } footer .sitemap .links .footerSocialGroup a i { font-size: 24px; } footer .sitemap .footerSocialGroup span.icon-youku { width: 24px; height: 24px; top: 2px; background-image: url(/share/images/icon_youku_m.svg); } .cnShopBreadcrumb { top: 55px; } .homeCnShop .mainPageTitle { padding: 100px 0 50px; } .homeCnShop .mainPageTitle h2 { font-size: 38px; } .wsrService .wsrProgram .wsrProgramItem { margin-bottom: 35px; } .wsrService .wsrProgram .wsrProgramItem2 { margin-bottom: 0px; } .wsrService .wsrProgram .wsrProgramItem:last-child { margin-bottom: 0; } .wsrService .wsrProgram .wsrProgramItem2:last-child { margin-bottom: 0; } .wsrService .wsrServiceDesc .wsrServicePhoto img { width: auto; margin: 0 auto 20px; } .wsrService .wsrServiceDesc p { text-align: justify !important; } .cookiesWrap .wrap .cookiesMessage { line-height: 1.5; padding-top: 15px; } .cookiesWrap .wrap .cookiesMessage a.acceptCookies { float: none; margin: 15px auto; display: block; } .worldwide .productList .productListWrap .productItem { width: 100%; border-right: 0; } .newsSelectWrap .selectWrap { width: 100% !important; margin-bottom: 15px; } .newsSelectWrap .selectWrap:last-child { margin-bottom: 0; } .newsSelectWrap .selectWrap select { width: 100% !important; } .newsSelectWrap .select2-container { width: 100% !important; } .langGroup { right: 15%; } .langGroup.expand { right: 45px; } html[lang="zh-cn"] .langGroup { right: 45px; } html[lang="zh-cn"] .langGroup.expand { right: 45px; } } @media screen and (max-width: 700px) { .products .productList .productListWrap .productItem { padding-top: 10px; } .products .productList .productListWrap .productItem .productThumb { height: 250px; } .gifts .giftList .giftListWrap .giftItem { padding-top: 10px; } .gifts .giftList .giftListWrap .giftItem .giftThumb { height: 250px; } } @media screen and (max-width: 580px) { .products .productList .productListWrap .productItem { padding-top: 10px; } .products .productList .productListWrap .productItem .productThumb { height: 200px; } .gifts .giftList .giftListWrap .giftItem { padding-top: 10px; } .gifts .giftList .giftListWrap .giftItem .giftThumb { height: 200px; } } @media screen and (max-width: 480px) { .products .productList .productListWrap .productItem .productThumb { height: 163px; } .gifts .giftList .giftListWrap .giftItem .giftThumb { height: 163px; } } @media screen and (max-width: 360px) { #header .mainMenuHeader .btnGroup a.btnEnquire { padding-left: 32px; } #header .mainMenuHeader .btnGroup a.btnEnquire { font-size: 14px; } #header .mainMenuHeader .btnGroup a.btnLang { font-size: 14px; margin: 0 3px; } } @media screen and (max-width: 359px) { #header .mainMenuHeader .btnGroup a.btnIcon { margin: 0; } #header .mainMenuHeader .btnGroup a.btnEnquire { padding-right: 0; } #header .mainMenuHeader .btnGroup .btnGroupSplit { margin: 0 4px; } footer .sitemap .links .footerSocialGroup a i { font-size: 18px; } footer .sitemap .footerSocialGroup span.icon-youku { width: 18px; height: 18px; } } @media screen and (max-width: 320px) { .products .productList .productListWrap .productItem .productThumb { height: 143px; } .gifts .giftList .giftListWrap .giftItem .giftThumb { height: 143px; } }