@charset "utf-8";
/* CSS Document */
@font-face {
	font-family:'skypost-icon';
	src:url('/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/fonts/skypost-icon.eot');
	src:url('/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/fonts/skypost-icon.eot') format('embedded-opentype'),
		url('/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/fonts/skypost-icon.ttf') format('truetype'),
		url('/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/fonts/skypost-icon.woff') format('woff'),
		url('/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/fonts/skypost-icon.svg#skypost-icon') format('svg');
	font-weight:normal;
	font-style:normal;
}

[class^="skypost-icon-"], [class*=" skypost-icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family:'skypost-icon' !important;
}

.skypost-icon-rss:before, .skypost-icon-arrow-left:before, .skypost-icon-arrow-right:before, .skypost-icon-flip-epaper:before, .skypost-icon-past-epaper:before, .skypost-icon-facebook:before, .skypost-icon-search:before, .skypost-icon-share:before, .skypost-icon-sun:before, .skypost-icon-close:before, .skypost-icon-fire:before, .skypost-icon-image:before,  .skypost-icon-copylink:before, .skypost-icon-more-article:before, .skypost-icon-facebook-share:before, .skypost-icon-weibo:before, .skypost-icon-wechat:before, .skypost-icon-line:before, .skypost-icon-whatapps:before, .skypost-icon-email:before, .skypost-icon-arrow-up:before, .skypost-icon-arrow-down:before, .skypost-icon-arrow-first:before, .skypost-icon-arrow-last:before, .skypost-icon-print:before, .skypost-icon-announcement:before, .skypost-icon-time:before, .skypost-icon-font-lg:before, .skypost-icon-font-sm:before, .skypost-icon-play:before, .weather-icon-sunny-intervals-52:before, .weather-icon-rain-red:before, .weather-icon-tyhoon-8nw:before{display:inline-block; content:attr(data-icon);}


/* 1 column widget */
.column-1-widget__large-image{padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #dfdfdf;}
.column-1-list-widget div.horizontal-line:last-child{display:none;}
.column-4-grid-widget > div:after{content:''; display:block; margin:15px 0; border-bottom:1px solid #dfdfdf;}
.column-4-grid-widget > div:last-child:after{display:none;}

/* 2 column widget */
.column-2-widget__column-left, .column-2-widget__column-right{padding-left:0; padding-right:0;}
.column-2-widget__column-right > div.horizontal-line:last-child{display:none;}
.column-2-list-grid-widget > .column-2-grid-widget:last-child:after{display:none;}

/* 3 column widget */
.col-offset-215:after, .col-offset-330:after, .col-offset-70:after{content:''; display:block; margin:15px 0; border-bottom:1px solid #dfdfdf;}
.column-2-grid-widget > div:after, .column-3-grid-widget > div:after{content:''; float:left; display:block; width:100%; margin:15px 0; border-bottom:1px solid #dfdfdf;}
/*.column-3-grid-widget > div:last-child:after{display:none;}*/

/* listing widget */
.section-09-widget .column-2-grid-widget.ex-section-01 > div:last-child:after{display:none;}
.listing-widget-01, .listing-widget-02, .listing-widget-03, .listing-widget-04, .listing-widget-05, .listing-widget-06{display:table; position:relative; width:100%; overflow:hidden;}
.listing-image-container, .main-article .listing-image-container{float:left; position:relative; max-width:135px; margin-right:15px; overflow:hidden;}
.listing-image-container img{width:100%;}
.listing-image-icon{position:absolute; top:0; left:0; width:36px; height:36px; text-align:center; background:rgba(0,0,0,0.5);}
.listing-image-icon li span{line-height:36px; color:#fff;}
.listing-image-icon__multi-img span{font-size:14px;}
.listing-image-icon__play span{font-size:18px;}
.listing-title-container{height:50px; overflow:hidden;}
.listing-title-container h6{margin-top:0; margin-bottom:0; line-height:26px; font-weight: 300; color:#505050;}
.columnist-slogan{ color:#999}

.listing-channel-container{display:inherit; position:relative; margin-top:7px; margin-right:10px; z-index:3;}        
.listing-channel-container:hover{color:#fcc800;}
.listing-channel-container span{vertical-align:middle; line-height:22px;}
.listing-channel-container span:first-child{display:inline-block; margin-right:4px; font-size:15px;}
.listing-channel-container:hover{color:#fcc800;}
.listing-date-container{float:left; line-height:20px; color:#999;}
/*modify@29-Nov-2018*/
button.share-container{float:right; position:relative; margin-top:-12px; padding:10px 8px 0 8px; border:0; font-size:16px; color:#636363; background-color:transparent; line-height:28px; z-index:3; transition:color 0.3s ease;}
/*end of modify*/
button.share-container:focus, button.share-pop-close:focus{outline:0;}
button.share-container:hover{color:#f7941e; background-color:transparent;}

.share-pop{visibility:hidden; position:absolute; top:0; bottom:0; right:0; width:0%; background:rgba(0, 0, 0, 0.8); opacity:0; -webkit-transition:visibility 0s 0.4s, opacity 0.35s, width 0.25s ease, color 0.3s ease; transition:visibility 0s 0.4s, opacity 0.35s, width 0.25s ease, color 0.3s ease; z-index:4;}
.share-pop-container{position:absolute; left:50%; top:50%; width:150px; -webkit-transform:translate(-50%, -50%); transform:translate(-50%, -50%);}
.popup-btn{display:inherit; padding:6px 0px; font-size:16px; color:#fff; clear:both; line-height:0.8em;}
.popup-btn:hover, button.share-pop-close:hover{color:#f39801;}
.popup-btn .popup-btn-name, .popup-btn .popup-icon{vertical-align:middle; line-height:28px;}
.popup-btn .popup-icon{display:inline-block; margin-right:4px; font-size:16px;}    
.share-pop-open{visibility:visible; opacity:1; width:100%; z-index:4; transition-delay:0s;}
.share-pop-close{position:absolute; top:10px; right:10px; padding:0; line-height:20px; font-size:16px; border:none; background:none; color:#fff;}
.listing-overlay{display:block; width:100%; height:100%; position:absolute; top:0; bottom:0; left:0; right:0; text-indent:-9999px; z-index:2;}
.listing-title-container:hover{color:#f39801;}
.listing-widget-03 .listing-title-container, .listing-widget-03 .listing-detail-container, .listing-widget-03 .share-container{display:inline-block;}
.listing-widget-03 .listing-title-container{width:100%; height:36px; vertical-align:top;}
.listing-widget-03 .listing-title-container h4{margin-top:5px; margin-bottom:5px;}
.listing-widget-03 .listing-detail-container{float:left;}
.listing-widget-03 .listing-channel-container{display:inline-block; margin-top:0px; margin-right:20px; line-height:2.45em;}
.listing-widget-03 .listing-date-container{line-height:36px; margin-right:10px;} 
.listing-widget-03 .share-container{margin-top:4px;}
.listing-widget-03 .share-pop-container{width:150px;}
.listing-widget-03 .popup-btn .popup-btn-name, .listing-widget-03 .popup-btn .popup-icon{line-height:18px;}


/* columnist 02 & recommend widget */
.columnist-widget-01, .columnist-widget-02, .columnist-widget-03, .columnist-widget-04, .recommend-widget{float:left; width:100%; margin-bottom:15px;}
.columnist-widget-02 .section-topic-widget .topic-more:hover, .columnist-widget-02 .listing-title-container:hover{color:#f7941e;}

.columnist-article-container, .recommend-article-container{float:left; width:100%; padding:15px; border:1px solid #ccc; border-top:none;}
.columnist-article-container .listing-image-container, .recommend-article-container .listing-image-container{width:100px;}
.columnist-article-container .listing-image-container img, .recommend-article-container .listing-image-container img{width:100px; height:100px;}
.columnist-article-container .listing-channel-container{margin-right:0;}

.columnist-article-container .listing-channel-container .icon-text, .recommend-article-container .listing-channel-container .icon-text{display:inline-block; width:auto; height:22px; vertical-align:middle; overflow:hidden;}
/*modify@13-Dec*/
.columnist-article-container .listing-channel-container .icon-text span, .recommend-article-container .listing-channel-container .icon-text span{font-size:14px; margin-right:0; height: 23px;}
/**/
.columnist-article-container .listing-channel-container .icon-text{display:block;}

@media(min-width: 768px){
.columnist-article-container .listing-channel-container .icon-text{display:block;}
.recommend-article-container .listing-channel-container .icon-text{width:96px;}
}

/* sharing widget */
.article-title-widget{margin-bottom:30px;}
.sharing-widget{float:left; width:100%; background:#f39801;}
.sharing-widget li{padding:0;}
.sharing-widget li:after{content:''; display:inline-block; height:14px; border-right:1px solid #fff;}
.sharing-widget li:nth-last-child(2):after{display:none;}
.sharing-widget li > a{display:inline-block; width:calc(100% - 1px); height:50px; margin-bottom:0px; line-height: 50px; font-size:20px; text-align:center; color:#fff;}
.sharing-widget .facebook-btn{background:none;}
.sharing-widget .weibo-btn{background:none;}
.sharing-widget .email-btn{width:100%; font-size:12px; background:none;}
.sharing-widget .link-btn{background:none;}
.sharing-widget .facebook-btn:hover, .sharing-widget .whatapp-btn:hover, .sharing-widget .line-btn:hover, .sharing-widget .wechat-btn:hover, .sharing-widget .weibo-btn:hover, .sharing-widget .email-btn:hover, .sharing-widget .link-btn:hover{background-color:rgba(255,255,255,0.50); color:#cc5f00;}

@media (min-width: 768px){
.sharing-widget{background:none;}
.sharing-widget li > a{display:block; margin-bottom:1px;}
.sharing-widget li:after{display:none;}
.facebook-like{display:block;}
.mobile-show{display:none;}
.desktop-show{display:block;}
.sharing-widget .facebook-btn{background-color:#4267b2;}
.sharing-widget .weibo-btn{background-color:#d52b2b;}
.sharing-widget .email-btn{width:calc(100% - 1px); font-size:12px; background-color:#0099ff;}
.sharing-widget .link-btn{background-color:#999;}
.sharing-widget .facebook-btn:hover{background-color:#6885c1; color:#fff;}
.sharing-widget .weibo-btn:hover{background-color:#dd5555; color:#fff;}
.sharing-widget .email-btn:hover{background-color:#33adff; color:#fff;}
.sharing-widget .link-btn:hover{background-color:#adadad; color:#fff;}
}

/* columnist 01 widget - carousel */
.carousel-nav{border-bottom:1px solid #dfdfdf; margin-bottom:20px;}
.carousel-cell{width:100%; margin-right:15px; cursor:pointer; font-size:15px;}
.carousel-cell:before{display:block; text-align:center; line-height:200px; font-size:80px; color:white;}
.carousel-nav .carousel-cell{width:auto; height:40px; margin-right:0; text-align:center;}
.carousel-nav .carousel-cell:before{font-size:50px; line-height:80px;}
.carousel-nav .carousel-cell.is-nav-selected{border-bottom:2px solid #f7941e; color:#f7941e;}
.carousel-nav .carousel-cell span{display:block; width:100px; padding:0 10px; margin:10px 0; border-right:1px solid #dfdfdf;}
.carousel-nav .carousel-cell:last-child span{border:none;}
.columnist-article-container .columnist-listing{padding-left:0; padding-right:0; margin-bottom: 0px;}
.columnist-article-container .columnist-listing:nth-last-child(-n+2) {display:none;}
.section-13-widget .flickity-prev-next-button, .section-15-widget .flickity-prev-next-button{width:20px; height:20px;}
.columnist-widget-01{margin-bottom:0;} 
.columnist-widget-01 .column-3-grid-widget div .horizontal-line{display:none;}
.columnist-widget-01 .columnist-article-container{padding:0; border:none;}
@media (min-width: 768px){
.columnist-article-container .columnist-listing:nth-last-child(-n+2){display:block;}
}

@media (min-width: 992px){
.section-13-widget .flickity-prev-next-button, .section-15-widget .flickity-prev-next-button{display:block;}
    .columnist-article-container .columnist-listing{padding-left:15px; padding-right:15px;}
}
@media (min-width: 1200px){
.section-13-widget .flickity-prev-next-button, .section-15-widget .flickity-prev-next-button{display:none;}
.columnist-widget-01 .column-3-grid-widget div:nth-child(3n+3){border-right:none;}
.columnist-widget-01 .column-3-grid-widget div .horizontal-line{display:block;}
.columnist-widget-01 .column-3-grid-widget div:nth-last-child(-n+3) .horizontal-line{display:none;}
.columnist-article-container .columnist-listing{padding-left:15px; padding-right:15px;}
}

/*! Flickity v2.0.2
http://flickity.metafizzy.co
---------------------------------------------- */

.flickity-enabled {
  position: relative;
}

.flickity-enabled:focus { outline: none; }

.flickity-viewport {
  overflow: hidden;
  position: relative;
  height: 100%;
}

.flickity-slider {
  position: absolute;
  width: 100%;
  height: 100%;
}

/* draggable */

.flickity-enabled.is-draggable {
  -webkit-tap-highlight-color: transparent;
          tap-highlight-color: transparent;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.flickity-enabled.is-draggable .flickity-viewport {
  cursor: move;
  cursor: -webkit-grab;
  cursor: grab;
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

/* ---- previous/next buttons ---- */

.flickity-prev-next-button {
  position: absolute;
  top: 50%;
  width: 30px;
  height: 30px;
  border: none;
  border-radius: 50%;
  background: white;
  background: hsla(0, 0%, 100%, 0.75);
  cursor: pointer;
  /* vertically center */
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
}

.flickity-prev-next-button:hover { background: white; }

.flickity-prev-next-button:focus {
  outline: none;
  box-shadow: 0 0 0 5px #09F;
}

.flickity-prev-next-button:active {
  opacity: 0.6;
}

.flickity-prev-next-button.previous { left: 10px; }
.flickity-prev-next-button.next { right: 10px; }
@media (min-width: 820px){
.flickity-prev-next-button { display: none;}
}
/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
  left: auto;
  right: 10px;
}
.flickity-rtl .flickity-prev-next-button.next {
  right: auto;
  left: 10px;
}

.flickity-prev-next-button:disabled {
  opacity: 0.3;
  cursor: auto;
}

.flickity-prev-next-button svg {
  position: absolute;
  left: 20%;
  top: 20%;
  width: 60%;
  height: 60%;
}

.flickity-prev-next-button .arrow {
  fill: #f7941e;
}

/* ---- page dots ---- */

.flickity-page-dots {
  position: absolute;
  width: 100%;
  bottom: -25px;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
  line-height: 1;
}

.flickity-rtl .flickity-page-dots { direction: rtl; }

.flickity-page-dots .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 8px;
  background: #333;
  border-radius: 50%;
  opacity: 0.25;
  cursor: pointer;
}

.flickity-page-dots .dot.is-selected {
  opacity: 1;
}
/* -------- */
button.share-container.columnist-share-position {margin-top: -35px;}
.listing-widget-02 .columnist:hover {color:#fcc800;}
.listing-widget-02 .columnist-name {color:#636363;}
.article-detail-share-icon {float: left;}
.article-detail-label h2 {color:#f7941e;}
.article-detail-label {overflow: hidden; width: 100%;  padding: 5px 0; line-height: 2.2em;}
.article-detail-label ul{ float: left; padding: 0;}
.article-detail-label ul li{padding-bottom: 8px; margin-right: 10px; list-style-type: none; display: inline;}
.article-detail-label ul li :hover{background-color:#fcc800;}
.section-header-profile{height:245px;background-size:cover;}.section-header-profile .title-container{text-align:center;display:block;margin:auto 0;color:#fff}
.section-header-profile .chi-title{font-family:"Noto Sans TC";font-weight:500;font-size:25px!important;text-shadow:0 0 10px rgba(0,0,0,.5);letter-spacing:8px; color: #f7941e;}
.section-header-profile .profile-img {height: 100px; width: 100px; border-radius: 100%; margin: 15px 0;}
.section-header-profile-article{height:120px;background-size:cover; margin-bottom: 15px; overflow: hidden;}
.section-header-profile-article .title-container{margin:auto 0;color:#fff}
.section-header-profile-article .profile-columnist{color:#636363}
.section-header-profile-article .chi-title-article{font-family:"Noto Sans TC";font-weight:500;font-size:25px!important;letter-spacing:8px; color: #f7941e;}
.section-header-profile-article .profile-img {height: 100px; width: 100px; border-radius: 100%; margin: 10px 0;}
.more-result a{float: left;font-size:15px;display:inline-block;}.more-result a:hover{background-color:#fcc800;color:#fff}
.columnist-img-widget-L {width: 50%; float: left; text-align: right; padding: 0 10px}
.columnist-info-widget-R {width: 50%; float: left; text-align: left; color: #fff; padding: 30px 0 0 10px;}        
.columnist-info-widget-R  .more-result a{ padding: 4px; font-size: 15px; border-radius: 5px; border: 1px solid #636363; margin: 5px auto; display: inline-block; font-weight: 400; color: #636363 line-height: 20px; width: 80px;}
.article-head h1 { font-size: 2rem;}
@media only screen and (max-width: 755px){
.article-head h1 {font-size: 25px; padding: 8px; margin-bottom: 0; border-left: 10px solid #636363;}}
.card-title-flipping {margin:0;font-size: 15px; color: #636363}
.wide-ratio-flipping {border: 1px solid #eeeeee}
.wide-ratio-flipping>img{width: 100%; height: auto;}
.wide-ratio-flipping .card-detail {padding: 5px 10px 0}
.wide-ratio-flipping .card-detail {padding: 5px 10px 0}
.card-title-flipping{margin:0;font-size:16px;color:#505050;padding:4px 0;font-weight:300}
.columnist-listing-top-banner{padding-top: 35px;}
@media only screen and (max-width: 575px){.columnist-listing-top-banner{padding-top: 22px;}}
.flipping-top-banner{padding-top: 35px;}
@media only screen and (max-width: 575px){.flipping-top-banner{padding-top: 22px;}}
.flippping-footer-download-widget { width: 100%}  
.flippping-footer-download-widget-L {width: 50%; float: left; padding: 20px 0;}
.flippping-footer-download-widget-R {width: 50%; float: left; padding: 20px 0;}
.flippping-footer-download-widget-L a{width: 112px; height=42; border: 1px solid #999; float: right; margin-right: 10px;}
.flippping-footer-download-widget-R a{width: 112px; height=42; border: 1px solid #999; float: left; margin-left: 10px;}

@media only screen and (max-width: 1255px){.columnist-article-article-tag{ margin-left: -10px}}

.selection__title {width: 100%;}

.columnist-profile-list {color: #505050; border-top: 4px solid #636363; padding: 5px 0;}
.columnist-profile-list .title { color: #f7941e; font-size: 21px; height: 25px; min-height: 25px;  overflow: hidden;  margin: 10px 0;}
.columnist-profile-list .title:hover {color: #fccb0f;}
.columnist-profile-list p {font-size: 14px; font-weight: 300; height: 60px; min-height: 60px; overflow: hidden;}
.columnist-profile-list a{ color: #505050;}
.columnist-profile-list .time { float: left; color: #757575; font-size: 12px;}

.columnist-cancer-list{ margin: 15px 0 5px 0; padding: 20px 10px; float: left; background-color: #f5f5f5;}
.columnist-cancer-list .title { color: #f7941e; font-size: 21px; }
@media only screen and (max-width: 991px){.columnist-cancer-list .title { color: #f7941e; font-size: 21px; margin-top: 10px;}}
.columnist-cancer-list .time { float: left; color: #757575; font-size: 12px; width: 100%; margin: 10px 0;}
.columnist-cancer-list p {font-size: 14px; font-weight: 300;}

.top-theme h1 {margin-bottom: 0;}
.ad-zone-desktop {
    padding: 10px 0px;
}
.ad-zone-desktop img {
    display: block;
    margin: 0 auto;
}

.lazy-article.active .sticky-banner.stay {
   /* position: fixed;*/ /* Deleted@31-Oct-2018*/
    bottom: 0px;
}

.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;}

.wide-ratio { position: relative; overflow: hidden; background-color:#facf9a;}.card-img-top-H { width: auto; height: 100%;}@media (min-width: 992px){.card-img-top-H:hover {height: 107%; transition: all .15s ease-in; opacity: .9;}.card-img-top-H,.card .card-img-top-H{transition:all .15s ease-out}.card-detail .card-tag a:hover{color:#f7941e!important}.card:hover>div .card-title a{color:#000000!important}.card:hover>a div .card-img-top-H{height: 107%;transition:all .15s ease-in;opacity:.9}}

/*Added@31-Oct-2018*/
.ad-zone-mobile{text-align: center; padding:10px 0; margin: 0 auto;}
.ad-zone-mobile .container{padding:0}
@media (min-width:768px){.ad-zone-mobile{display:none!important}}

.ad-zone-mobile-focus{text-align: center; padding:10px 0; margin: 0 auto;}
.ad-zone-mobile-focus .container{padding:0}
@media (min-width:576px){.ad-zone-mobile-focus{display:none!important}}

.ad-zone-desktop{text-align: center; padding:10px 0; margin: 0 auto;}
.ad-zone-desktop .container{padding:0}
@media (max-width:767px){.ad-zone-desktop{display:none!important}}
/*Added@29-Nov-2018*/
.ad-zone-desktop-v2{text-align: center; padding:10px 0; margin: 0 auto;}
.ad-zone-desktop-v2 .container{padding:0}
@media (max-width:991px){.ad-zone-desktop-v2{display:none!important}}
.ad-zone-mobile-v2{text-align: center; padding:10px 0; margin: 0 auto; float:left;}
.ad-zone-mobile-v2 .container{padding:0}
@media (min-width:991px){.ad-zone-mobile-v2{display:none!important}}
/*End of Added@29-Nov-2018*/   
/*Added@03-Dec-2018*/
.ad-zone-v2{text-align: center; padding:13px 0; margin: 0 auto;}
.ad-zone-v2 .container{padding:0}
@media (max-width:991px){.ad-zone-v2{display:none!important}}

.ad-zone-desktop-v3{text-align: center; padding:10px 0; margin: 0 auto;}
.ad-zone-desktop-v3 .container{padding:0}
@media (max-width:767px){.ad-zone-desktop-v3{display:none!important}}
@media (min-width:992px){.ad-zone-desktop-v3{display:none!important}}
/*End of Added@03-Dec-2018*/  
.ad-zone-R-bottom {padding:0 0 10px 0;margin: -5px auto 0 auto;}   
/*End of Added @31-Oct-2018*/

/*Added@6-May-2019*/
.ad-zone-R-bottom .container{padding:0; text-align: center;}
@media (max-width:767px){.ad-zone-R-bottom {padding:0 0 10px 0;margin:0 auto;}
}
.ad-zone-R{padding:0 0 10px 0; margin:0 auto;}
.ad-zone-R .container{padding:0; text-align: center;}
@media (max-width:767px){.ad-zone-R {padding:0 0 10px 0;margin:0 auto;}
}
@media (max-width:991px){.theme-card-hidden{display: none;}
}
/*End of Added@6-May-2019*/

/*add@4Mar2019*/
.ad-zone-mobile-list{text-align: center; padding:10px 0; margin: 0 auto;}
.ad-zone-mobile-liast .container{padding:0}
@media (min-width:768px) and (max-width:992px){.ad-zone-mobile-list{display:none!important}}
.ad-zone-desktop-list{text-align: center; padding:10px 0; margin: 0 auto;}
.ad-zone-desktop-list .container{padding:0}
@media (min-width:992px) {.ad-zone-desktop-list{display:none!important}}
@media (max-width:767px){.ad-zone-desktop-list{display:none!important}}

/*Added@21-Nov-2018*/
.blur-bg{filter: blur(10px);}
.section-header .title{font-family:"Noto Sans TC";font-weight:300;font-size:15px!important;text-shadow:0 0 10px rgba(0,0,0,.5);letter-spacing:2px; color: #ffffff; display: block;}
.section-header .section{font-family:"Noto Sans TC";font-weight:500;font-size:36px!important;text-shadow:0 0 10px rgba(0,0,0,.5);letter-spacing:8px; color: #ffffff; width: 100%; display: block;}
/*End of Added@21-Nov-2018*/
/*modify@11-Dec-2018*/
.columnist-listing-top-banner-icon{padding-top: 5px;}
@media (max-width:575px){.columnist-listing-top-banner-icon{padding-top: 18px;}}
.columnist-listing-top-banner-icon .icon{padding: 0px;}
@media (max-width:575px){.columnist-listing-top-banner-icon .icon{ float: left; padding-left: 10px;}}
/*end*/
/*Added@20-Dec-2018*/
.list-h-line{
border-bottom:1px solid #e0e0e0; margin-top: 15px;
}
/*Added@27-Dec-2018*/
.bulletpotint{margin: 0}
.bulletpotint ul{padding-left:20px; list-style-type: disc; }
.bulletpotint ul li{display: list-item;}
/*add@13Feb2019*/
.health-bg { background-image: url("/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/demo-img/health-bg.png");}
/*add@11Mar2019*/
@media (max-width:767px){.m-hidden{display:none!important;}}
/*add@29Mar2019*/
.submit-success-wrap{text-align: center; padding: 20px 0 10px 0;}
.submit-success-wrap h5{color: #f7941e;}
.submit-success-wrap time{color: #f7941e;}
.submit-success-wrap p{color: #999999;}
.submit-success-wrap a {text-decoration: underline;}
/*add@27May2019*/
.skingcare-content{padding: 0;}
@media (max-width:767px){.skingcare-content{display: none;}}
.adinmobile{padding: 0;}
@media (max-width:767px){.adinmobile{display: none;}}
/*add@20Feb2020*/
.ad-zone-desktop-theme{text-align: center; padding:10px 0 0 0; margin:0 auto; clear: both;}
@media (max-width:1085px) {.ad-zone-desktop-theme{display:none!important}}
.ad-zone-mobile-theme{text-align: center; padding:20px 0 10px 0; margin: 0 auto; clear: both;}
@media (min-width:1086px) {.ad-zone-mobile-theme{display:none!important}}
/*add@20Mar2020*/
.top-theme {
    position: relative;
    overflow: hidden;
}
.top-theme-bg {
    position: absolute;
    width: 110%;
    height: 110%;
    opacity: 1;
}
.blur {
    width: 100%;
    height: 100%;
    background-size: cover;
    -webkit-filter: blur(4px);
    -moz-filter: blur(4px);
    -ms-filter: blur(4px);
    -o-filter: blur(4px);
    filter: blur(4px);
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
@media only screen and (max-width: 1000px){
.img-title {
    bottom: 8%;
    left: 3%;
    right: 3%;
}
}

.img-title {
    position: absolute;
    color: #fff;
    text-align: center;
    left: 8%;
    right: 8%;
    bottom: 8%;
    letter-spacing: 3px;
    z-index: 10;
    text-align: left;
}

.theme-title, .img-gradient {
    width: 100%;
}
.theme-title, .img-gradient {
    width: 100%;
}

.img-gradient {
    position: relative;
    display: inline-block;
}
.img-gradient:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -7px;
    width: 100%;
    height: 102%;
    display: inline-block;
    background: rgba(0,0,0,0.57);
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 37%, rgba(0,0,0,1) 78%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.57)), color-stop(37%, rgba(0,0,0,0)), color-stop(78%, rgba(0,0,0,1)));
    background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 37%, rgba(0,0,0,1) 78%);
    background: -o-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 37%, rgba(0,0,0,1) 78%);
    background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 37%, rgba(0,0,0,1) 78%);
    background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 37%, rgba(0,0,0,1) 78%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000', GradientType=0 );
}

.black {
    background-color: #000;
}
@media only screen and (max-width: 767px){
.black {
    padding-bottom: 40%;
    background-color: #000;
}
}
@media only screen and (max-width: 767px){
.black {
    padding-bottom: 33.5%;
}
}
.display-4 {
    font-size: 3.5rem;
}
.display-3, .display-4 {
    font-weight: 300;
    line-height: 1.2;
}

.card-tag-border {
    color: #FFF;
    background-color:#f7941e;
    padding: 5px 10px;
    display: inline-block;
    text-decoration: none;
    font-size: 1rem;
}

.card-tag-border a {
    color: #FFF;
}
a .title_h2 {
    color: #FFF;
}
@media screen and (max-width: 600px){
.title_h2 {
    font-size: 1.3rem;
    line-height: 2.5rem;
}
}

.card-title {
    font-weight: 100;
    font-size: 1.25rem;
    color: #ffffff;
}
@media screen and (max-width: 600px){
.card-title {
    font-size: 15px;
    font-weight: 300;
    letter-spacing: 0.1rem;
}
}
@media screen and (max-width: 600px){
.card-tag-border {
    font-size: 15px;
    padding: 4px 10px;
}
}
.column {
    float: left;
    width: 40px;
    padding: 0 5px 0 0;
    margin-top: 5px;
}
#section05 a span {
    position: absolute;
    bottom: -30%;
    left: 50%;
    width: 24px;
    height: 24px;
    margin-left: -12px;
    border-left: 3px solid #fff;
    border-bottom: 3px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    box-sizing: border-box;
}

@media screen and (max-width: 600px){
#section05 a span {
    bottom: -60%;
    width: 15px;
    height: 15px;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    box-sizing: border-box;
}
}

#section05 a {
    padding-top: 70px;
}
@media only screen and (max-width: 1000px)
.demo a {
    bottom: 5px;
}
.demo a {
    position: absolute;
    bottom: 20px;
    left: 50%;
    z-index: 2;
    display: inline-block;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    color: #fff;
    font: normal 400 20px/1 'Josefin Sans', sans-serif;
    letter-spacing: .1em;
    text-decoration: none;
    transition: opacity .3s;
}
.section-title h2 {
    font-size: 28px;
    color: #f7941e;
    padding-left: 0px!important;
    margin-bottom: 4px!important;
}
/* */
.theme-card .card-detail .card-title {
    margin: 0;
    height: 100px;
    min-height: 100px;
    overflow: hidden;
    font-size: 16px;
    line-height: 24px;
    font-weight: 300;
    color: #212529;
}

.card-info ul{
margin: 0;
    padding: 0;
    clear: left;
    height: 45px;
}
.card-info ul li {
    margin: 10px 20px 0 0;
    padding: 0;
    list-style: none;
    float: left;
}
.card-info ul li img {
    width: 30px;
    height: 30px!important;
}

.theme-card .card-detail .theme-list-title a:hover{color: #f7941e;}
.theme-card .card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border-radius: .25rem;
    border: 0px solid #fff!important;
    box-shadow: 0px 0px 8px 0px rgba(255,153,0,0.3);
}
.theme-card .card-detail .card-title a {
    color: #212529;}
.theme-card .card-detail .card-title a:hover {
    color: #f7941e;}
.theme-card .theme-list-title-link a {
    color: #212529;}
.theme-card .theme-list-title-link a:hover {
    color: #f7941e;}

.theme-card .card-tag a{
    color: #f7941e!important;}

.theme-card .card-detail {
    border-top: 4px solid #f7941e!important;
    padding: 5px 10px 0;
}

.skypost-pagination {
    text-align: center;
    padding: 20px 0;
}
.skypost-pagination .mobile-pagination, .skypost-pagination .pagination-control {
    display: inline-block;
}

.skypost-pagination .desktop-pagination {
    margin: 0 10px;
    display: none;
}
.skypost-pagination .desktop-pagination a.active-page {
    background-color: #f7941e;
    color: #fff;
    font-weight: 500;
}
.skypost-pagination .desktop-pagination a {
    display: inline-block;
    border-radius: 5px!important;
    color: #000000;
    padding: 4px 12px;
    background-color: #fafafa;
    margin: 0 4px;
    box-shadow: 0px 0px 8px 0px rgba(255,153,0,0.3);
}
.skypost-pagination .desktop-pagination a:hover{
    display: inline-block;
    border-radius: 5px!important;
    color: #fff;
    padding: 4px 12px;
    background-color: #f7941e;
    margin: 0 4px;
    box-shadow: 0px 0px 8px 0px rgba(255,153,0,0.3);
}
.skypost-pagination .pagination-control a {
    display: inline-block;
    border: 1px solid #f7941e;
    border-radius: 5px!important;
    color: #f7941e;
    padding: 4px 15px;
    height: 36px;
    width: 80px;
    background-color: #fff;
    font-weight: 500;
}
.skypost-pagination .pagination-control.control-disabled a {
    display: inline-block;
    border: 1px solid #e0e0e0;
    border-radius: 5px!important;
    color: #e0e0e0;
    padding: 4px 15px;
    height: 36px;
    width: 80px;
    background-color: #f5f5f5;
}
.skypost-pagination .desktop-pagination {
    margin: 0 10px;
    display: none;
}
@media (min-width: 576px){
.skypost-pagination .desktop-pagination {
    display: inline-block;}
    .skypost-pagination .mobile-pagination {
    display: none;
}
}
/*20Oct2020*/
.section-header {
    height: 130px;
    background-size: cover;
    background-position: center;
}
@media (max-width: 575px){
.section-header {
    height: 100px!important;
}
}
.video-wrap{}
.video-wrap .card-detail {
    border-top: 0px;
    padding: 5px 10px 0;
}
.video-wrap .duration {
    position: absolute;
    transition: all .15s ease-out;
    top: calc(100% - 95px);
    transform: translate(0%, -50%);
    z-index: 1;
    width: 100%;
    font-size: 12px;
    text-align: right;
}
.video-wrap .duration span {
    background: rgba(17, 17, 17, 0.8);
    padding: 5px 7px;
    color: #fff;
}

.video-wrap .duration span:before {
    content: " ";
    background: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon.svg) no-repeat;
    width: 12px;
    height: 10px;
    display: inline-block;
    margin: 0px 5px;
}
.video-wrap-main {
    background-color: #fff;
    margin: 0 0 20px 0;
}
.video-wrap-main .card-title-main {
    font-weight: 500;
    font-size: 27px;
    color: #FC942E;
    height: 95px;
    min-height: 95px;
    overflow: hidden;
}

@media(max-width: 768px){
.video-wrap-main .card-title-main {
    font-size: 21px;
    color: #FC942E;
    height: 77px;
    min-height: 77px;
}
}

.video-wrap-main .description{
    font-size: 17px;
    color: #505050;
}
@media (max-width: 991px){
    .video-wrap-main .description{
        display: none;
    }
}
.video-wrap-main .card-detail {
    border-top: 0px;
    padding: 0px 5px;}
.video-wrap-main .duration-main {
    position: absolute;
    transition: all .15s ease-out;
    top: calc(100% - 14px);
    transform: translate(0%, -50%);
    z-index: 1;
    width: 100%;
    font-size: 12px;
    text-align: right;
}
.video-wrap-main .duration-main span {
    background: rgba(17, 17, 17, 0.8);
    padding: 5px 7px;
    color: #fff;
}

.video-wrap-main .duration-main span:before {
    content: " ";
    background: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon.svg) no-repeat;
    width: 12px;
    height: 10px;
    display: inline-block;
    margin: 0px 5px;
}
 .video-wrap .moreVideo {
    text-align: center;
    margin: 10px auto;
}

.btn-more-video { 
  color: #ffffff; 
  background-color: #FC942E; 
  width: 200px;
  padding: 10px 20px;
} 
 
.btn-more-video:hover, 
.btn-more-video:focus, 
.btn-more-video:active, 
.btn-more-video.active, 
.open .dropdown-toggle.btn-more-video { 
  color: #ffffff; 
  background-color: #FCC800; 
} 


 .video-section-title {
    width: 100%;
    border-bottom: 4px solid #f7941e;
    padding-top: 25px;
    float: left;
}
.video-section-title a {
    color: #f7941e;
}
.video-section-title a:hover{
    color: #fcc800;
}
.video-section-title div {
    display: inline-block;
}
.video-section-title div:last-child {
    text-align: right;
    float: right;
}
.video-section-title h2 {
    font-size: 28px;
    color: #f7941e;
    padding-left: 0px!important;
    margin-bottom: 4px!important;
}

.icon-new-video {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-new-video.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-entertainment {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-entertainment.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-family {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-family.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-food {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-food.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-goods {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-goods.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-housework {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-housework.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-interview {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-interview.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-play {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-play.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-program {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-program.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-sick {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-sick.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.icon-wednesday-soup {
    background-image: url(/20221209110736oe_/https://skypost.ulifestyle.com.hk/store/prod/iskypost/res/assets/img/video-icon/icon-wednesday-soup.png);
        display: inline-block;
    width: 30px;
    height: 30px;
    margin: 2px 6px 0px 0px;
    float: left;
    background-size: 100%;
}
.section-video {
    width: 100%;
}
.section-video-black-bg{
    text-align: center;
    margin: -13px auto 0 auto;
    background-color: #000000;
    top: 0;
    max-width: 1150px;
}
.section-video-white-bg{
    float: left;
    background-color: #fff;
    padding: 20px;
}
@media(max-width: 767px){
    .section-video-white-bg{
    padding: 20px 10px;
}
}
.section-video iframe {
	width: 100%;
}
.section-video img {
	width: 100%;
}
.main-video-title{
    font-size: 21px;
    color:#f7941e;
}
.main-video-descrition{
    font-size: 15px;
    color: #505050;
    padding: 10px 0;
    margin-top: 20px;
    font-weight: 400;
    width: 100%;
    border-top: 1px solid #ccc;
}
.channel{text-align: right;}
@media(max-width: 767px){
.channel{
    text-align: left;
    margin-top: 0px;
    }
.channel img{
    width: 134px!important;
    height: 45px!important;
    float: right;
}
.section-video .column {
    width: 38px!important;
    padding: 0 5px 0 0!important;
}

}
.channel img{
    width: 190px;
    height: 64px;
}

.section-video .publish-date{
    font-size: 15px;
    color:#999999;
    width: 100%;
    margin:10px 0 20px 0;
}

.section-video .social-icon{
   text-align: left;
   float: left;
    margin-top: 20px;
}

.section-video .column {
    width: 50px;
    padding: 0 10px 0 0;
}

@media(max-width: 767px){
.section-video .column {
    float: left;
}
.section-video .social-icon{
    margin-top: 0px;
}
.section-video .col-xs-6{
    position: relative;
    width: 50%!important;
    min-height: 1px;
    padding-left: 10px!important;
}
