/* Theme DHK HelloHK – Section Home */
/* @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap'); */
@import url('font-opensans.css');

:root{
	--main-font: 'Open Sans', arial, 'PingFang TC', 'Microsoft JHei TC Bold', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif;
}
html[lang="zh-CN"]{--main-font: 'Open Sans', arial, 'PingFang SC', 'Microsoft JHei TC Bold', \5FAE\8EDF\6B63\9ED1\9AD4, 'MHei', PMingLiU, sans-serif;}

/** Common **/
html[dir] body{background-color:#fff !important;}
html[dir] .footer{border-top:0 !important;}
.noselect, .noselect *{pointer-events:none; user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; -o-user-select:none;}
.fancybox__carousel .fancybox__slide.has-video .fancybox__content, .fancybox__carousel .fancybox__slide.has-html5video .fancybox__content{width:1920px; height:1080px;}
#hellohk p, #hellohk a, #hellohk li, #hellohk th, #hellohk td, #hellohk span{font-size:1.125rem; font-family:var(--main-font) !important;}
#hellohk .data-listing.data-listing--articles .data-listing__excerpt .text .cmp-text p,
#hellohk .cmp-breadcrumb__item-link span{
	font-size:.9375rem;
}
#hellohk *:not(.article-detail__heading .heading .cmp-title .cmp-title__text > h1){font-family:var(--main-font) !important;}
#hellohk img{max-width:100%;}
#hellohk .title > .cmp-title > .cmp-title__text > h3{/*font-size:2.813rem;*/ font-size:40px; font-weight:800; line-height:1.1;}
html[dir=ltr] .dhk #hellohk .text.padding-horizontal .cmp-text{margin-left:-20px; margin-right:-20px;}
#hellohk .breadcrumb > .cmp-breadcrumb > .container{max-width:none !important; padding-left:0 !important; padding-right:0 !important;}
@media (min-width: 1599.98px) {
	#hellohk .container-cust{max-width:1720px; padding:0 40px;}
	#hellohk .aem-GridColumn--default--10, #hellohk .aem-GridColumn.aem-GridColumn--default--8{float:none !important; max-width:1365px !important; width:100% !important; margin-left:auto !important; margin-right:auto !important; padding:0 !important; clear:both !important;}
	#hellohk .container.dhk-container.max-width-1100 .cmp-container{max-width:none !important;}
}
#hellohk .desc-container{position:relative; width:100%; max-width:992px; margin:0 auto; padding:0 20px 30px; text-align:center;}
#hellohk .slick-slide img{display:inline-block;}

#hellohk .header-banner, #hellohk .hot-topic-list{visibility:hidden; opacity:0; transition:visibility .25s linear, opacity .25s linear; -moz-transition:visibility .25s linear, opacity .25s linear; -ms-transition:visibility .25s linear, opacity .25s linear; -webkit-transition:visibility .25s linear, opacity .25s linear;}
#hellohk .ele-loaded{visibility:visible !important; opacity:1 !important;}
#hellohk .itinerary-title{position:relative;}

/* navigation */
html[dir] .rainbow-bar--animated{background-image:none; background-color:#FFF; background-color:#ED1C24;}
html[dir] .navbar-container{background:none;}
html[dir] .navbar{/*border-bottom:1px solid transparent;*/ border-bottom:0;}
html[dir] .navbar-nav .dropdown-menu{background-color:#fff;}
html[dir] .navbar-expand-md .navbar-nav .dropdown-menu.w-100{margin-top:0; border-top:1px solid #ccc;}

/* Component {header banner} */
#page-header, #hot-topic-list-1{position:relative;}
#hot-topic-list-1 { padding: 40px 0 80px !important;}
#page-header:before,
#hot-topic-list-1:before{display:block; content:''; width:100%; height:95%; position:absolute; left:0; top:0;}
#hot-topic-list-1:before { height: 100%;}
#page-header :is(h1, h2, h3, h4, h5, h6), #page-header .desc-container, #page-header .desc-container p{color:#fff;}
html[dir] #hellohk .header-banner-container .header-banner .swiper-button-prev, html[dir] #hellohk .header-banner-container .header-banner .swiper-button-next{border-radius:50%; box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15); -webkit-box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15); -moz-box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15);}
#page-header .header-banner a.banner{padding-bottom:31.25%;}
#page-header .header-banner .textbox{padding-left:13%; width:50%; height:100%; display:flex; flex-direction:column; justify-content:center;}
#page-header .header-banner .hb-title{margin-bottom:15px;}
#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:55px; font-weight:800; line-height:1; letter-spacing:-1px;}
#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img {margin-bottom:15px;}
#page-header .header-banner .hb-text{font-weight:600; line-height:1.4;}
#page-header .header-banner .cover-wrapper:after{display:block; content:''; position:absolute; left:0; bottom:0; width:100%; height:100%; background-size:auto 100%; background-position:left center; background-repeat:no-repeat; pointer-events:none; user-select:none; -moz-user-select:none; -khtml-user-select:none; -webkit-user-select:none; -o-user-select:none;}
#page-header .header-banner .cover-wrapper.pc-cover:after, #page-header .header-banner .cover-wrapper.mb-cover:after{background-image:url(../png/experience-hong-kong-shadow.png);}
 /* AE */
 html[dir=rtl] #page-header .header-banner .cover-wrapper.pc-cover:after,
 html[dir=rtl] #page-header .header-banner .cover-wrapper.mb-cover:after{transform: rotate(180deg);}
#page-header img.circle-play,
#hot-topic-list-1 img.circle-play{display:block; margin-top:25px; width:60px;}
#page-header .topic-desc,
#hot-topic-list-1 .topic-desc{line-height:1.2;}
#page-header .topic-desc:after,
#hot-topic-list-1 .topic-desc:after{display:block; content:''; width:30px; height:30px; margin-top:14px; background-size:100% auto;  background-position:0 0; background-repeat:no-repeat;}
.fancybox__slide.has-iframe .fancybox__content{padding:0 !important;}

/* Component {hot topic} */
/* #hellohk .hot-topic-title-container{display:none;} */
#hellohk .hot-topic-list-container .line.line-l,
#hellohk .hot-topic-list-container .line.line-r{
	display: none;
}
#hellohk .hot-topic-list-container .hot-topic-title {
	padding: 0;
	height: auto;
}
#hellohk .hot-topic-list-container .-es-font-title {
	margin-bottom: 0;
	color: #fff;
	font-size: 40px;
}
#hellohk .hot-topic-list-container{padding:0;}
#hellohk .hot-topic-title-container {margin-bottom: 25px;}
@media (min-width: 1599.98px) {
	html[dir] #hellohk .hot-topic-list-container{width:100%; max-width:1365px; padding:0 !important; margin:0 auto;}
	html[dir] #hellohk .hot-topic-list-container .hot-topic-list-content .swiper-button-next, html[dir] .hot-topic-list-container .hot-topic-list-content .swiper-button-prev{width:65px !important; height:65px !important; border-radius:50%; box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15); -webkit-box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15); -moz-box-shadow:-1px -1px 19px 0px rgba(0,0,0,0.15);}
}
html[dir] #hellohk .hot-topic-list-container .hot-topic-list-content .swiper-slide a.topic .topic-content{left:10.3896% !important; right:10.3896% !important; bottom:25px !important; flex-direction:column-reverse !important; align-items:flex-start !important;}
html[dir] #hellohk .hot-topic-list-container .hot-topic-list-content .swiper-slide a.topic .topic-content .topic-tag{margin-bottom:0 !important; margin-top:18px !important; font-weight:800;}
html[dir] #hellohk .hot-topic-list-container .hot-topic-list-content .swiper-slide a.topic .topic-content .topic-desc{text-align:left !important; font-weight:800; font-size:1.25rem;}
 /* AE */
 html[dir=rtl] #hellohk .hot-topic-list-container .hot-topic-list-content .swiper-slide a.topic .topic-content .topic-desc{text-align:right !important;}
#hellohk .itinerary-title.itinerary-article,
#hellohk .hot-topic-list-container .-es-font-title{font-weight:800 !important; line-height:1.2 !important;}
#hellohk .itinerary-title-container{margin-top:0 !important; margin-bottom:12px !important;}
#hellohk .topic-desc{line-height:1.2;}

/* Component {tab} */
#hellohk ol.cmp-tabs__tablist{display:flex; flex-direction:row; margin-bottom:0;}
#hellohk li.cmp-tabs__tab{position:relative; flex:1 1 100%; line-height:1.2; white-space:pre-wrap; padding:8px 16px 12px; text-align:center; border-bottom:0; font-weight:700;}
#hellohk li.cmp-tabs__tab.cmp-tabs__tab--active:before{display:block; content:''; position:absolute; width:100%; height:4px; left:0; bottom:0;}
#hellohk li.cmp-tabs__tab.tab-divider:after{position:absolute; margin-left:0; right:0; top:calc(50% - 7px - 4px); opacity:1; background-color:#ccc;}
body.ar #hellohk li.cmp-tabs__tab.tab-divider:after{left:0; right:auto;}
#hellohk .tabs div[data-listing="article"]{margin:30px auto;}
#hellohk .tabs div[data-listing="article"] > .container{max-width:none;}

/* Component {DHK e-solution suggested content} */
#hellohk .container.dhk-container.max-width-1100 .suggested-content.main-content{padding-left:0; padding-right:0;}
#hellohk .suggested-content-title{display:none;}
#hellohk .suggested-content .route-left{width:35% !important;}
#hellohk .suggested-content .route-left > img{height:auto !important;}
#hellohk .suggested-content .route-right{padding:0.8em 2.2em !important;}

/* Component {Recommendation Tiles} */
#hellohk .recommendation-tiles__container{padding-left:0; padding-right:0;}
#hellohk .recommendation-tiles__grid .card-label{display:none;}

/* Component {Article Listing} */
#hellohk .articlelisting .default-container{margin:40px auto;}
#hellohk .articlelisting .default-container > .container{padding-left:0; padding-right:0;}

/* Component {Offer Cross-Sell Banner} */
#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-pc-wrapper{padding:0;}
#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-pc-wrapper .offer-cross-sell-item .item-photo-wrapper .item-photo-inner-wrapper{height:100%; padding-bottom:0;}
#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-pc-wrapper .offer-cross-sell-item .item-photo-wrapper .item-photo{position:relative; width:auto; height:auto; min-height:0; top:auto; object-fit:cover;}
#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-mb-wrapper .offer-cross-sell-item .item-photo-wrapper{padding-bottom:0;}
#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-mb-wrapper .offer-cross-sell-item .item-photo-wrapper .item-photo{position:relative; top:auto; height:auto; min-height:0;}
@media (min-width: 1500.98px) {
	#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-pc-wrapper .offer-cross-sell-item .item-details-wrapper{padding:40px 100px;}
}
#hellohk .offer-cross-sell-cmp-container .item-details .item-brand{display:none;}
#hellohk .offer-cross-sell-cmp-container .item-details .offer-name{line-height:1.5;}
#hellohk .offer-cross-sell-cmp-container .item-details .offer-name > .desc{font-size:18px; margin-top:8px;}

/* Component {QTS Shop Finder} */
html[dir] .dhk #hellohk .shopsfinder > .container.cmp-container{padding-top:0 !important; padding-left:0 !important; padding-right:0 !important;}
html[dir] .dhk #hellohk .shopsfinder .accommodation__filter--mobile-heading > .cmp-container{padding-top:0 !important;}

/* Component {Event Listing} */
#hellohk .eventlisting > .events-container{margin:25px 0 0 0;}
#hellohk .eventlisting > .events-container > .container{width:83.33333333%; padding-left:0; padding-right:0;}
#hellohk .event-listing{margin-left:-15px; margin-right:-15px;}
#hellohk .js-filter-mobile{width:83.33333333%; margin:0 auto;}
#hellohk .js-filter-mobile > .great-outdoor__filter--mobile > .container{padding-left:0; padding-right:0;}
@media (min-width: 1199.98px){
	.daterangepicker .drp-calendar{max-width:none !important;}
	.daterangepicker .calendar-table td:after{width:calc(100% + 2px) !important;}
	#hellohk .eventlisting > .events-container > .container{max-width:1100px !important;}
}
@media (min-width: 1599.98px){ #hellohk .eventlisting > .events-container > .container{width:auto; max-width:1365px !important;} }
@media (max-width: 1199.98px){ 
	#hellohk .eventlisting > .events-container > .container{max-width:900px !important;}
}
@media (max-width: 991.98px){ 
	#hellohk .event-listing{margin-left:-10px; margin-right:-10px;}
}
html[lang="ar"] #hellohk .eventlist .events__listing-data-excerpt{direction:ltr !important;}

/* Component {Event List V2} */
#hellohk .new_eventlist .event-listing{padding:0; margin-left:-30px; margin-right:-30px;}

/* Component {User Dedined Article Listing} */
#hellohk .userdefinedarticlelisting .featured-event__listing--wrapper .cmp-title__text:before{display:none;}
#hellohk .userdefinedarticlelisting .featured-event__listing--wrapper .cmp-title__text h3{padding-bottom:0; font-size:40px;}

/* Component {Article Info} */
#hellohk .article-detail__heading{padding-left:0 !important; padding-right:0 !important;}
#hellohk .article-detail__heading .rainbow-bar--vertical .cmp-title__text > h1:before{top:10px !important; bottom:3px !important;}

/* Component {DHK Non Featured Offer List} */
#hellohk .non-featured-offers-header{display:none;}
#hellohk .non-featured-offers .non-featured-offers-container{width:83.33333333%; max-width:1100px !important;}
#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-content{padding:15px 20px;}
#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-spot-text,
#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-des{
	line-height:1.2;
}
#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-des{font-size:22px;}
@media (min-width: 1599.98px){
	#hellohk .non-featured-offers .non-featured-offers-container{width:auto; max-width:1365px !important;}
}
@media (min-width: 1439.98px){
	#hellohk .non-featured-offers .non-featured-offers-content .general-list .hot-offer-item{width:calc((100% - 60px) / 4);}
}
@media (max-width: 1199.98px){ 
	#hellohk .non-featured-offers .non-featured-offers-container{width:83.33333333%; max-width:900px !important;}
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-des{font-size:20px;}
}

/* Component {Announcement / Tip with Icon Text} */
html[dir=ltr] #hellohk .announce-box-container .tip__container .tip__content .cmp-title h5{color:#FFFFFF;}
html[dir=ltr] #hellohk .announce-box-container .tip__container .tip__content .cmp-title h5 a{font-size:15px !important; line-height:28px !important; font-weight:bold !important; text-decoration:underline !important; color:#FFFFFF !important;}
html[dir=ltr] #hellohk .announce-box-container .tip__container .tip__content .cmp-title h5 a:hover{color:#e2002c !important;}
html[dir] #hellohk .announce-box>.announce-box-container{padding-left:0 !important; padding-right:0 !important;}
html[dir] #hellohk .announce-box>.announce-box-container img{max-width:unset !important;}
html[dir] #hellohk .dhk .container.no-padding-top .recommendationtiles .cmp-container{padding-top:0px !important;}



/* theme color */
:root {
	--orange: #e74124;
	--purple: #b1599e;
	--green: #95c13d;
	--bluegreen: #3cb5a1;
	--lightorange: #ed7e23;

	--events-festivals-orange: #e74124;
	--attractions-purple: #b1599e;
	--art-culture-green: #95c13d;
	--dining-bluegreen: #3cb5a1;
	--great-outdoor-orange: #ed7e23;
	--neighbourhoods-orange: #d45842;
	--nightlife-purple: #5000d0;
	--shopping-pink: #d50a77;
	--culture-yellow: #b78704;
}

#hellohk.section-events-festivals ::selection{background-color:var(--events-festivals-orange); color:#fff;}
#hellohk.section-events-festivals #page-header ::selection{background-color:#fff; color:var(--events-festivals-orange);}
#hellohk.section-events-festivals #page-header:before{background-color:var(--events-festivals-orange);}
#hellohk.section-events-festivals #page-header .topic-desc:after{background-image:url(../svg/circle-arrow-events-festivals.svg);}
#hellohk.section-events-festivals li.cmp-tabs__tab:hover{color:var(--events-festivals-orange);}
#hellohk.section-events-festivals li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--events-festivals-orange);}
#hellohk.section-events-festivals li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--events-festivals-orange);}
#hellohk.section-events-festivals .suggested-content-item{border:1px solid #D0BBD9 !important;}

#hellohk.section-attractions ::selection{background-color:var(--attractions-purple); color:#fff;}
#hellohk.section-attractions #page-header ::selection{background-color:#fff; color:var(--attractions-purple);}
#hellohk.section-attractions #page-header:before{background-color:var(--attractions-purple);}
#hellohk.section-attractions #page-header .topic-desc:after{background-image:url(../svg/circle-arrow-attractions.svg);}
#hellohk.section-attractions li.cmp-tabs__tab:hover{color:var(--attractions-purple);}
#hellohk.section-attractions li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--attractions-purple);}
#hellohk.section-attractions li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--attractions-purple);}
#hellohk.section-attractions .suggested-content-item{border:1px solid #D0BBD9 !important;}

#hellohk.section-art-culture ::selection{background-color:var(--art-culture-green); color:#fff;}
#hellohk.section-art-culture #page-header ::selection{background-color:#fff; color:var(--art-culture-green);}
#hellohk.section-arts-culture #page-header:before{background-color:var(--art-culture-green);}
#hellohk.section-arts-culture #page-header .topic-desc:after{background-image:url(../svg/circle-arrow-art-culture.svg);}
#hellohk.section-arts-culture li.cmp-tabs__tab:hover{color:var(--art-culture-green);}
#hellohk.section-arts-culture li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--art-culture-green);}
#hellohk.section-arts-culture li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--art-culture-green);}
#hellohk.section-arts-culture .suggested-content-item{border:1px solid #D9D0BB !important;}

#hellohk.section-dining ::selection{background-color:var(--dining-bluegreen); color:#fff;}
#hellohk.section-dining #page-header ::selection{background-color:#fff; color:var(--dining-bluegreen);}
#hellohk.section-dining #page-header:before{background-color:var(--dining-bluegreen);}
#hellohk.section-dining #page-header .topic-desc:after{background-image:url(../svg/circle-arrow-dining.svg);}
#hellohk.section-dining li.cmp-tabs__tab:hover{color:var(--dining-bluegreen);}
#hellohk.section-dining li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--dining-bluegreen);}
#hellohk.section-dining li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--dining-bluegreen);}
#hellohk.section-dining .suggested-content-item{border:1px solid #D9D0BB !important;}

#hellohk.section-great-outdoor ::selection{background-color:var(--great-outdoor-orange); color:#fff;}
#hellohk.section-great-outdoor #page-header ::selection{background-color:#fff; color:var(--great-outdoor-orange);}
#hellohk.section-great-outdoor #page-header:before,
#hellohk.section-great-outdoor #hot-topic-list-1:before{background-color:var(--great-outdoor-orange);}
#hellohk.section-great-outdoor #page-header .topic-desc:after,
#hellohk.section-great-outdoor #hot-topic-list-1 .topic-desc:after{background-image:url(../svg/circle-arrow-great-outdoor.svg);}
#hellohk.section-great-outdoor li.cmp-tabs__tab:hover{color:var(--great-outdoor-orange);}
#hellohk.section-great-outdoor li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--great-outdoor-orange);}
#hellohk.section-great-outdoor li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--great-outdoor-orange);}
#hellohk.section-great-outdoor .suggested-content-item{border:1px solid #D9D0BB !important;}

#hellohk.section-neighbourhoods ::selection{background-color:var(--neighbourhoods-orange); color:#fff;}
#hellohk.section-neighbourhoods #page-header ::selection{background-color:#fff; color:var(--neighbourhoods-orange);}
#hellohk.section-neighbourhoods #page-header:before{background-color:var(--neighbourhoods-orange);}
#hellohk.section-neighbourhoods #page-header .topic-desc:after{background-image:url(../svg/circle-arrow-neighbourhoods.svg);}
#hellohk.section-neighbourhoods li.cmp-tabs__tab:hover{color:var(--neighbourhoods-orange);}
#hellohk.section-neighbourhoods li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--neighbourhoods-orange);}
#hellohk.section-neighbourhoods li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--neighbourhoods-orange);}
#hellohk.section-neighbourhoods .suggested-content-item{border:1px solid #D9D0BB !important;}

#hellohk.section-nightlife ::selection{background-color:var(--nightlife-purple); color:#fff;}
#hellohk.section-nightlife #page-header ::selection{background-color:#fff; color:var(--nightlife-purple);}
#hellohk.section-nightlife #page-header:before{background-color:var(--nightlife-purple);}
#hellohk.section-nightlife #page-header .topic-desc:after{background-image:url(../svg/circle-arrow-nightlife.svg);}
#hellohk.section-nightlife li.cmp-tabs__tab:hover{color:var(--nightlife-purple);}
#hellohk.section-nightlife li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--nightlife-purple);}
#hellohk.section-nightlife li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--nightlife-purple);}
#hellohk.section-nightlife .suggested-content-item{border:1px solid #D9D0BB !important;}

#hellohk.section-shopping ::selection{background-color:var(--shopping-pink); color:#fff;}
#hellohk.section-shopping #page-header ::selection{background-color:#fff; color:var(--shopping-pink);}
#hellohk.section-shopping #page-header:before{background-color:var(--shopping-pink);}
#hellohk.section-shopping #page-header .topic-desc:after{background-image:url(../svg/circle-arrow-shopping.svg);}
#hellohk.section-shopping li.cmp-tabs__tab:hover{color:var(--shopping-pink);}
#hellohk.section-shopping li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--shopping-pink);}
#hellohk.section-shopping li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--shopping-pink);}
#hellohk.section-shopping .suggested-content-item{border:1px solid #D9D0BB !important;}

#hellohk.section-culture ::selection{background-color:var(--culture-yellow); color:#fff;}
#hellohk.section-culture #page-header ::selection{background-color:#fff; color:var(--culture-yellow);}
#hellohk.section-culture #page-header:before{background-color:var(--culture-yellow);}
#hellohk.section-culture #page-header .topic-desc:after{background-image:url(../svg/circle-arrow-culture.svg);}
#hellohk.section-culture li.cmp-tabs__tab:hover{color:var(--culture-yellow);}
#hellohk.section-culture li.cmp-tabs__tab.cmp-tabs__tab--active{color:var(--culture-yellow);}
#hellohk.section-culture li.cmp-tabs__tab.cmp-tabs__tab--active:before{background-color:var(--culture-yellow);}
#hellohk.section-culture .suggested-content-item{border:1px solid #D9D0BB !important;}




/* Page Arts in HK */
#arts-venues .hot-topic-title-container{display:none;}




/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1679.98px) {
	/* Component {header banner} */
	#page-header .header-banner .textbox{width:55%;}
	#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:50px;}
	#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img{height:105px;}
	#page-header img.circle-play,
	#hot-topic-list-1 img.circle-play{width:60px; margin-top:20px;}
}


/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
	/* Component {header banner} */
	#page-header .header-banner .textbox{width:60%;}
	#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:40px;}
	#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img{height:100px;}
	#page-header img.circle-play,
	#hot-topic-list-1 img.circle-play{width:40px;}
}


/* `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
	/* common */
	/* #hellohk .title > .cmp-title > .cmp-title__text > h2, #hellohk .title > .cmp-title > .cmp-title__text > h3{font-size:2.5rem;} */
	#hellohk .itinerary-title-container{padding-left:0 !important; padding-right:0 !important;}
	
	/* Component {header banner} */
	#page-header .header-banner .textbox{padding-left:5%;}
	#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:30px;}
	#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img{height:90px;}
	
	/* Component {DHK e-solution suggested content} */
	#hellohk .suggested-content-content .route > a{padding:0 10px !important;}

	/* Component {DHK Non Featured Offer List} */
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-content{padding:12px 15px;}
}

/* */
@media screen and (max-width: 1024px) {
	#hellohk .hot-topic-list-container .-es-font-title{font-size:22px;}

	/* Component {User Dedined Article Listing} */
	#hellohk .userdefinedarticlelisting .featured-event__listing--wrapper .cmp-title__text h3,
	#hellohk .title > .cmp-title > .cmp-title__text > h2, #hellohk .title > .cmp-title > .cmp-title__text > h3{
		font-size:22px !important;
	}
}

/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
	/* common */
	html[dir] .dhk-content{position:unset !important;}
	#hellohk .title > .cmp-title > .cmp-title__text > h2, #hellohk .title > .cmp-title > .cmp-title__text > h3{font-size:2.125rem;}
	#hellohk .title > .cmp-title > .cmp-title__text > h2 br, #hellohk .title > .cmp-title > .cmp-title__text > h3 br{display:none;}
	#hellohk p, #hellohk a, #hellohk li, #hellohk th, #hellohk td, #hellohk span{font-size:1rem;}
	#hellohk .desc-container{padding:0 10px 15px;}
	#hellohk .desc-container br{display:none;}
	.fancybox-slide{padding:0;}
	html[dir] #hellohk .hot-topic-list-container .hot-topic-list-content .swiper-slide a.topic .topic-content{left:25px !important; right:25px !important; bottom:30px !important;}
	html[dir] #hellohk .hot-topic-list-container .hot-topic-list-content .swiper-slide a.topic .topic-content .topic-desc{font-size:1rem;}
	
	/* Component {header banner} */
	#page-header .header-banner .cover-wrapper.pc-cover{display:block !important;}
	#page-header .header-banner .cover-wrapper.mb-cover{display:none !important;}
	#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6){font-size:26px; letter-spacing:0;}
	#page-header .header-banner .hb-title :is(h1, h2, h3, h4, h5, h6) > img{height:75px; margin-bottom:8px;}
	#page-header .header-banner .hb-text{font-size:15px;}
	#page-header img.circle-play,
	#hot-topic-list-1 img.circle-play{margin-top:15px; width:30px;}
	
	/* Component {tab} */
	#hellohk li.cmp-tabs__tab{flex:1 1 auto; white-space:nowrap;}
	#hellohk .articlelisting .data-listing-item{padding-left:0; padding-right:0;}
	
	/* Component {DHK e-solution suggested content} */
	#hellohk .suggested-content.main-content{padding-bottom:50px !important;}
	#hellohk .suggested-content:not(.main-content){padding-left:0 !important; padding-right:0 !important; padding-top:0 !important; padding-bottom:0 !important;}
	#hellohk .suggested-content .swiper-container{overflow:hidden !important;}
	#hellohk .suggested-content-content .route > a{padding:0 !important;}
	#hellohk .suggested-content-content .route .route-right{padding:5px 15px !important;}
	#hellohk .suggested-content-content .route .route-desc{font-size:14px !important; line-height:1.3 !important;}
	
	/* Component {Event List V2} */
	#hellohk .new_eventlist > .container{padding-left:0 !important; padding-right:0 !important; max-width:none;}
	#hellohk #arts-events .event-listing{margin-left:-25px; margin-right:-25px;}
	#hellohk .event-listing__item{padding-left:10px !important; padding-right:10px !important;}
	
	/* Component {Recommendation Tiles} */
	#hellohk .recommendation-tiles__row, #hellohk .js-recommendation-tiles .swiper-container{margin-left:0; margin-right:0;}
	
	/* Component {Article Listing} */
	#hellohk .articlelisting .default-container{margin:20px auto;}
	#hellohk .articlelisting .data-listing.data-listing--articles > .row{margin-left:0; margin-right:0;}
	
	/* Component {Offer Cross-Sell Banner} */
	#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-pc-wrapper .offer-cross-sell-item .item-details-wrapper{padding:2.4% 6%;}
	#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-mb-wrapper{width:auto !important;}

	/* Component {DHK Non Featured Offer List} */
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-list{margin-left:-5px; margin-right:-5px; width:auto;}
	#hellohk .non-featured-offers .non-featured-offers-content .general-list .hot-offer-item{width:calc(50% - 10px); margin-left:5px; margin-right:5px;}
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-spot .hot-offer-spot-text{font-size:16px;}
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-des{font-size:18px;}
	#hotel-offers .es-btn-group-container, #offers .es-btn-group-container{margin-top:10px; margin-bottom:10px;}
}


/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	/* common */
	#hellohk .masthead.aem-GridColumn--default--12{margin-left:-30px; margin-right:-30px; width:100vw;}
	.aem-GridColumn.aem-GridColumn--default--12:not(.aem-GridColumn--offset--extrasmall--1) .no-padding-top > .dhk-content{padding-top:0;}
	html[dir=ltr] .dhk #hellohk .text.padding-horizontal .cmp-text{margin-left:-10px; margin-right:-10px;}
	html[dir] #hellohk .hot-topic-list-container .hot-topic-list-content .swiper-slide{width:calc(100% - 5px);}
	
	/* Component {header banner} */
	#page-header, #hot-topic-list-1{width:auto; margin-left:-30px; margin-right:-30px;}
	#page-header:before,
	#hot-topic-list-1:before{width:calc(100% + 60px); left:-30px; top:-15px;}
	#page-header .header-banner-container{margin-left:-30px; margin-right:-30px;}
	#page-header .header-banner a.banner{padding-bottom:119.4%}
	#page-header .header-banner .cover-wrapper.pc-cover{display:none !important;}
	#page-header .header-banner .cover-wrapper.mb-cover{display:block !important;}
	#hot-topic-list-1 { padding: 0 0 80px !important;}
	
	/* Component {Offer Cross-Sell Banner} */
	#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-mb-wrapper .offer-cross-sell-item .item-photo-wrapper .item-photo{object-fit:cover !important;}
	#hellohk .offer-cross-sell-cmp-container .item-details .offer-name > .desc{font-size:15px; margin-top:6px;}

	/* Component {User Dedined Article Listing} */
	#hellohk .userdefinedarticlelisting .featured-event__listing{margin-left:-30px; margin-right:-30px;}

	/* Component {DHK Non Featured Offer List} */
	#hotel-offers, #offers{width:auto; margin-left:-30px; margin-right:-30px;}
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-list{margin-left:-3px; margin-right:-3px;}
	#hellohk .non-featured-offers .non-featured-offers-content .general-list .hot-offer-item{width:calc(50% - 6px); margin-left:3px; margin-right:3px; margin-bottom:6px;}
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-content{padding:10px;}
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-spot-icon{width:30px; height:30px; margin-right:6px;}
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-spot .hot-offer-spot-text{width:calc(100% - 36px); margin-left:-4px; font-size:14px;}
	#hellohk .non-featured-offers .non-featured-offers-content .hot-offer-item .hot-offer-des{font-size:15px;}
	#hotel-offers .es-btn-group-container, #offers .es-btn-group-container{padding:0;}

	/* Component {Announcement / Tip with Icon Text} */
	html[dir=ltr] #hellohk .announce-box-container .tip__container .tip__content .cmp-title h5 a{font-size:13px !important; line-height:18px !important; font-weight:bold !important; text-decoration:underline !important; color:#FFFFFF !important;}	
	html[dir=ltr] #hellohk .announce-box-container .tip__container .tip__content .cmp-title h5 a:hover{color:#e2002c !important;}
}


/* `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
	/* common */
	#hellohk .container-cust{padding:0;}
	#hellohk .title > .cmp-title > .cmp-title__text > h2, #hellohk .title > .cmp-title > .cmp-title__text > h3{font-size:1.438rem;}
	#hellohk p, #hellohk a, #hellohk li, #hellohk th, #hellohk td, #hellohk span{font-size:0.929rem;}
	#hellohk .aem-Grid.aem-Grid--default--12>.aem-GridColumn.aem-GridColumn--offset--default--1{margin-left:0 !important; width:100% !important;}
	
	/* Component {header banner} */
	#page-header .header-banner .cover-wrapper.mb-cover:after{background-image:url(../png/experience-hong-kong-shadow_m.png);}
	#page-header .header-banner .textbox{width:56%; padding-left:30px;}
	#page-header .header-banner .textbox .hb-content{padding-left:0; padding-right:0;}
	
	/* Component {tab} */
	#hellohk li.cmp-tabs__tab{font-size:16px;}
	
	/* Component {Offer Cross-Sell Banner} */
	#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-mb-wrapper .offer-cross-sell-item .item-details-wrapper{padding:20px;}
	#hellohk .offer-cross-sell-cmp-container .offer-cross-sell-cmp-mb-wrapper .offer-cross-sell-item .item-details .see-more-btn .btn-text{font-size:16px;}

	/* Component {Event Listing} */
	#hellohk .js-filter-mobile,
	#hellohk .eventlisting > .events-container > .container{
		width:auto;
	}
	#hellohk .eventlisting .events__listing-data-title h6{font-size:16px; line-height:1.4 !important;}
	#hellohk .event-listing{margin-left:-6px; margin-right:-6px;}
	#hellohk .event-listing__item{padding-left: 6px !important; padding-right: 6px !important;}

	/* Component {DHK Non Featured Offer List} */
	#hellohk .non-featured-offers .non-featured-offers-container{width:auto; max-width:none;}
}





/* touch device fix */
@media (hover: none) and (pointer: coarse) {
	
}

/* IE 10 & 11 fix */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	
}

/* 202212 */
.articlelisting > div > .container {
	max-width: 1365px;
}

#hellohk .shopsfinder .cmp-title .cmp-title__text,
#hellohk .shopsfinder .accommodation__filter--mobile button,
#hellohk .restaurantfinder .cmp-title .cmp-title__text,
#hellohk .restaurantfinder .accommodation__filter--mobile button {
	/* font-family: 'Open Sans Bold' !important; */
	font-weight: 700;
}

@media screen and (min-width: 1599.98px) {
	#hellohk .eventlist > div > .container {
		max-width: none !important;
	}
}


/* 202301 reset shopsfinder & restaurantfinder style */
html[dir] .dhk #hellohk .restaurantfinder .filter__nav--listing-items > .cmp-container,
html[dir] .dhk #hellohk .restaurantfinder .filter__nav--listing-main--heading > .cmp-container {
	padding-top: 0 !important;
}

html[dir] .dhk #hellohk .shopsfinder .filter__nav--listing-items > .cmp-container,
html[dir] .dhk #hellohk .shopsfinder .filter__nav--listing-main--heading > .cmp-container {
	padding-top: 0 !important;
}

html[dir] .dhk #hellohk .restaurantfinder .accommodation__filter--mobile-option {
	/* position: fixed; */
}

html[dir] .dhk #hellohk .shopsfinder .accommodation__filter--mobile-option {
	/* position: fixed; */
}

/* reset header banner text style */
@media screen and (min-width: 1600px) {
	html[dir] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox {
		padding: 0 !important;
		width: 100%;
	}
	
	html[dir] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox .hb-content {
		width: 100%;
		max-width: 1365px;
		margin-left: auto;
		margin-right: auto;
		padding: 0;
		padding-right: 36%;
	}
	
	/* AE */
	html[dir=rtl] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox .hb-content {
		padding: 0;
		padding-left: 36%;
	}
}

@media screen and (max-width: 1599px) {
	html[dir] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox {
		padding: 0 !important;
		margin-left: 8.333%;
		width: 83.333%;
	}
	
	html[dir] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox .hb-content {
		width: 100%;
		max-width: 1100px;
		margin-left: auto;
		margin-right: auto;
		padding: 0;
		padding-right: 36%;
	}
	
	/* AE */
	html[dir=rtl] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox {
		margin-left: 0;
		margin-right: 8.333%;
	}
	
	html[dir=rtl] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox .hb-content {
		padding: 0;
		padding-left: 36%;
	}
}

@media screen and (max-width: 1200px) { 
	html[dir] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox .hb-content {
		max-width: 900px;
	}
}

@media screen and (max-width: 767.98px) {
	html[dir] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox {
		width: 60%;
		margin-left: calc(8.333% + 30px);
	}
	html[dir] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox .hb-content {
		padding-right: 18%;
	}
	
	/* AE */
	html[dir=rtl] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox {
		width: 60%;
		margin-left: 0;
		margin-right: calc(8.333% + 30px);
	}
	html[dir=rtl] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox .hb-content {
		padding-right: 0;
		padding-left: 18%;
	}
}

@media screen and (max-width: 480px) {
	html[dir] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox {
		margin-left: 8.333%;
	}
	
	/* AE */
	html[dir=rtl] .dhk #hellohk #page-header .header-banner-container .swiper-slide .textbox {
		margin-left: 0;
		margin-right: 8.333%;
	}
}

/* html[dir] #hellohk .header-banner-container .header-banner .swiper-container .swiper-wrapper .swiper-slide .cover-wrapper {
	overflow: hidden;
}
html[dir] #hellohk .header-banner-container .header-banner .swiper-container .swiper-wrapper .swiper-slide .cover-wrapper video {
	height: auto !important;
	object-fit: unset !important;
	top: -20%;
	position: absolute;
}
html[dir] #hellohk .header-banner-container .header-banner .swiper-container .swiper-wrapper .swiper-slide .cover-wrapper.pc-cover::after,
html[dir] #hellohk .header-banner-container .header-banner .swiper-container .swiper-wrapper .swiper-slide .cover-wrapper.mb-cover::after {
	display: none !important;
} 