@font-face{ font-family: Futura; src: url('../font/Futura.ttc'); }

html{ font-size: 10px; }

@media only screen and (min-width: 720px) {
    html{ font-size: 18px; }
}

@media only screen and (min-width: 960px) {
    html{ font-size: 20px; }
}

@media only screen and (min-width: 1240px) {
    html { font-size: 16px; }
}

body{ font-family: Helvetica; }
.coming-soon{ color:#71866C; font-size:3rem; font-family: Futura; }
.coming-soon a{ color:#3D4539; text-decoration:none; }
.coming-soon a:hover{ color:#B0C4B1; }
.mandatory{ color:#ff0000; }
/* page header */
div.div-header>div.div-header-1>div.div-header-logo.black img{ content:url('../images/logo-header-black.png'); max-width:160px; }
div.div-header>div.div-header-1>div.div-header-logo.white img{ content:url('../images/logo-header-white.png'); max-width:160px; }
div.div-header>div.div-header-1 div.div-media img{ max-width:50px; }
div.div-header>div.div-header-1 div.div-function img{ max-width:50px; }
div.div-header>div.div-header-1 div.div-top-menu{ text-transform: uppercase; }
div.div-header>div.div-header-1 div.div-top-menu a{ text-decoration: none; font-size:0.9rem; font-family: Futura; }
div.div-header>div.div-header-1 div.div-top-menu div.col-lg{ line-height:0.7rem; padding-left:0px; padding-right:0px; }
div.div-header>div.div-header-1 div.div-top-menu.black a{ color:#212121; }
div.div-header>div.div-header-1 div.div-top-menu.white a{ color:#ffffff; }
div.div-header.scrolling>div.div-header-1{ background-color:#212121; }
div.div-header.scrolling>div.div-header-1 div.div-top-menu.black a{ color:#ffffff; }
div.div-header.scrolling>div.div-header-1>div.div-header-logo.black img{ content:url('../images/logo-header-white.png'); }
div.div-header.scrolling>div.div-header-1 div.div-function img.headerFunction1{ content:url('../images/function/function_1_white.png'); }
div.div-header.scrolling>div.div-header-1 div.div-function img.headerFunction2{ content:url('../images/function/function_2_white.png'); }
div.div-header.scrolling>div.div-header-1 div.div-function img.headerFunction3{ content:url('../images/function/function_3_white.png'); }
div.div-header.scrolling>div.div-header-1 div.div-function img.headerFunction4{ content:url('../images/function/function_4_white.png'); }
div.div-header.scrolling>div.div-header-1 div.div-top-menu.black a:hover,
div.div-header.scrolling>div.div-header-1 div.div-top-menu.white a:hover
{ color:#D1DCD4; }
div.donation-tag{ position:fixed; top:45%; right:0; z-index:2; }
div.donation-tag img{ width:40px; }
div.donation-tag img:hover{ content:url('../images/donation-hover.png'); }

div.mobile-menu>.row{ background-color:transparent; }
div.mobile-menu.scrolling>.row{ background-color:#000000; }
div.top-mobile-menu .dropdown{ padding-left:10px; }
div.top-mobile-menu .btn{ color:#ffffff; }
div.top-mobile-menu .dropdown-menu{ background-color:#3D4539; padding:10px; width:100%; margin-top:3px !important; }
div.top-mobile-menu .dropdown-menu li{ padding:5px; text-align: center; font-size:1.5rem; }
div.top-mobile-menu .dropdown-menu a{ color:#71866C; text-decoration:none; }
div.top-mobile-menu .dropdown-menu a:hover{ color:#212121; }

div.mobile-menu .div-header-logo img{ max-width:150px; padding-top:10px; }
div.mobile-menu img.headerFunction1,
div.mobile-menu img.headerFunction2,
div.mobile-menu img.headerFunction3,
div.mobile-menu img.headerFunction4
{ max-width:40px; padding-top:10px; }
div.mobile-menu .mobile-menu-col{ padding-left:0; padding-right:0; }
/* ------ page header */

/* page footer */
div.div-footer div.footer-top-menu{ color:#212121; font-family: Futura; }
div.div-footer div.footer-menu a{ color:#71866C; text-decoration: none; font-size:0.9rem; }
div.div-footer div.footer-menu a:hover{ color:#ffffff; }
div.div-footer>div.div-footer-1{ background-color:#CFDDD4; }

div.div-footer>div.div-footer-2{ background-color:#000000; color:#ffffff; font-size:.8rem; }
div.div-footer>div.div-footer-2 img{ max-width:50px; }
div.div-footer>div.div-footer-3{ background-color:#3D4539; color:#ffffff; }
@media only screen and (min-width: 992px) {
    div.div-footer>div.div-footer-1>div.div-footer-fans-logo{ background:url('../images/logo_tiger_hk_fan_club.png') no-repeat left center; background-size:contain; }
}
@media only screen and (max-width: 992px) {
    div.div-footer>div.div-footer-1>div.div-footer-fans-logo{ background:url('../images/logo_tiger_hk_fan_club.png') no-repeat center center; background-size:contain; }
}
/* ------ page footer */

.termsAndCondition div.toc, .priceAndGift div.toc{ color:#B0C4B1; text-align:justify; }
.termsAndCondition div.gift, .priceAndGift div.gift{ color:#B0C4B1; text-align:left; font-size:1.5rem; }
.member-info, .guest-member, .termsAndCondition .form-check-label, .termsAndCondition .form-label, .customer-info .form-label, .priceAndGift .form-label{ color:#B0C4B1; }

/* message box */
div.custom_messagebox{ border-radius:15px; font-size:1rem; }
div.custom_messagebox div.messagebox_title,
div.custom_messagebox div.messagebox_buttons
{ 
    background-color:#71866C; 
    padding:10px;
}
div.custom_messagebox div.messagebox_title{ color:#CFDDD4; }
div.custom_messagebox div.messagebox_content_wrapper{ background-color: #B0C4B1; padding:10px; }
/* ------ message box */

/* home page */
@media only screen and (min-width: 992px) {
    div.banner-carousel{ margin-top:-230px; margin-left:calc(-.5 * var(--bs-gutter-x)); margin-right:calc(-.5 * var(--bs-gutter-x)); }
}
@media only screen and (max-width: 992px) {
    div.banner-carousel{ margin-top:-70px; margin-left:calc(-.5 * var(--bs-gutter-x)); margin-right:calc(-.5 * var(--bs-gutter-x)); }
    div.banner-carousel .carousel-item.active img{ width:auto !important; height:600px; }
}
div.banner-carousel .carousel-indicators > button { width:10px; height:10px; border-radius: 50%; margin-left:1rem; margin-right:1rem; }
img.home-news-icon:hover{ content:url('../images/home_news_icon_hover.png'); }
img.home-gallery-icon:hover{ content:url('../images/home_gallery_icon_hover.png'); }
img.home-about-button:hover{ content:url('../images/home_about_button_hover.png'); }
span.home-span-explore{ font-size:7rem; text-transform: uppercase; font-weight:bold; color:#212121; font-family: Futura; }
span.home-span-explorer-intro{ font-size:0.9rem; color:#212121; }
div.div-join-membership{ background:url('../images/home_membership_banner.png') no-repeat center center; background-size:cover; }
img.home-membership-button:hover{ content:url('../images/home_membership_button_hover.png'); }
/* ------ home page */

/* latest news */
@media only screen and (min-width: 992px) {
    body.body-latest-news{ background:url('../images/background_style_1.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
}
@media only screen and (max-width: 992px) {
    body.body-latest-news{ background:url('../images/mobile-background.png') no-repeat left top; background-size:contain; background-attachment:fixed; }
}

body.body-latest-news div.div-latest-news-header{ color:#ffffff; font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
#headerBannerCarouselNews-mb .card-title,
#headerBannerCarouselNews .card-title{
    font-size:1.5rem; font-weight:bold; padding-bottom:2rem;color:#212121;
}
#headerBannerCarouselNews-mb .card-text,
#headerBannerCarouselNews .card-text{ 
    font-size:1rem; color:#212121; text-align:justify; 
}
#headerBannerCarouselNews-mb button.carousel-control-prev span.carousel-control-prev-icon,
#headerBannerCarouselNews-mb button.carousel-control-next span.carousel-control-next-icon,
#headerBannerCarouselNews button.carousel-control-prev span.carousel-control-prev-icon,
#headerBannerCarouselNews button.carousel-control-next span.carousel-control-next-icon{ 
    background-color:#71866C; border-radius: 1rem; background-size:70% 70% 
}
#headerBannerCarouselNews-mb button.carousel-control-prev,
#headerBannerCarouselNews button.carousel-control-prev{ 
    justify-content: left; 
}
#headerBannerCarouselNews-mb button.carousel-control-next,
#headerBannerCarouselNews button.carousel-control-next{ 
    justify-content: right; 
}
/* ------ latest news */

/* About */
@media only screen and (min-width: 992px) {
    body.body-about{ background:url('../images/about-background.png') no-repeat top left; background-size:45%; background-attachment:fixed; }
    body.body-about .mobile-img{ display:none; }
}
@media only screen and (max-width: 992px) {
    body.body-about{ background:none; }
    body.body-about .mobile-img{ padding-left:0; padding-right:0; margin-top:-70px; } 
}

/* ------ About */

/* template-card */
.card-listing .card{ cursor:pointer; }
.card-listing .card .card-title{ font-size:1.5rem; font-weight:bold; }
.card-listing .card:hover{ box-shadow: 0 2rem 3rem rgba(0,0,0,.3)!important; }
/* ------ template-card */

/* Gallery */
@media only screen and (min-width: 992px) {
    body.body-gallery{ background:url('../images/background_style_1.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
}
@media only screen and (max-width: 992px) {
    body.body-gallery{ background:url('../images/mobile-background.png') no-repeat left top; background-size:contain; background-attachment:fixed; }
}

body.body-gallery div.div-gallery-header{ color:#ffffff; font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-gallery .card{ background-color:#ffffff52; }
body.body-gallery .card .card-body .card-title{ font-size:1.2rem; }
body.body-gallery .item{ width: 100%; height: 245px; overflow:hidden; }
/* ------ Gallery */

/* Album */
@media only screen and (min-width: 992px) {
    body.body-album{ background:url('../images/background_style_1.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
    body.body-album div.modal-content img{ height:-webkit-fill-available; width:auto; }
}
@media only screen and (max-width: 992px) {
    body.body-album{ background:url('../images/mobile-background.png') no-repeat left top; background-size:contain; background-attachment:fixed; }
    body.body-album div.modal-content img{ width:100%; height:auto; }
}

body.body-album div.div-album-header{ color:#ffffff; font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-album span.backGallery a{ color:#D1DCD4; font-size:1.5rem; text-decoration:none; }
body.body-album span.backGallery a:hover{ color:#ffffff; }
body.body-album div.modal-body{ padding:0px; overflow:hidden; }
body.body-album div.modal-content{ background-color:#3d453994; }

body.body-album .item{ 
    width: 100%; height: 245px; overflow:hidden; 
    display: flex !important;
    align-items: center !important;
}

#popmodal .modal-header{ border:0px; }
#popmodal .modal-header button{ background-color:#B0C4B1; }
/* ------ Album */

/* Performance */
@media only screen and (min-width: 992px) {
    body.body-performance{ background:url('../images/background_style_1.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
    #youtubeframe{ width:800px; height:600px; }
}
@media only screen and (max-width: 992px) {
    body.body-performance{ background:url('../images/mobile-background.png') no-repeat left top; background-size:contain; background-attachment:fixed; }
    #youtubeframe{ width:100%; height:500px; padding-top:100px; }
}

body.body-performance div.div-performance-header{ color:#ffffff; font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-performance .card{ background-color:#ffffff52; }
body.body-performance .card .card-body .card-title{ font-size:1.2rem; }
body.body-performance .card .card-body .performance-date{ font-size:1rem; font-weight: normal; }
body.body-performance div.modal-body{ padding:0px; }
body.body-performance div.modal-content{ background-color:#3d453994; }
body.body-performance div.modal .modal-backdrop{ background-color:red; }
/* ------ performance */

/* Support */
@media only screen and (min-width: 992px) {
    body.body-support{ background:url('../images/background_style_1.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
}
@media only screen and (max-width: 992px) {
    body.body-support{ background:url('../images/mobile-background.png') no-repeat left top; background-size:contain; background-attachment:fixed; }
}

body.body-support div.div-support-header{ color:#ffffff; font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-support .card .card-body .support-date{ font-size:1rem; font-weight: normal; }
body.body-support span.statement{ color:#D1DCD4; font-size:1.3rem; text-decoration:none; font-family: Helvetica; }
body.body-support div.card-body{ padding:0px; }
body.body-support h5.card-title{ background-color:#ffffff7a; margin:-60px 0 0 0; padding:3px; font-size:1.2rem!important; }

div.div-form{ background-color:#212121; opacity: 0.9; border-radius: 2rem; }
div.div-form .form-title{ color:#71866C; font-size:2rem; font-weight:bold; font-family:Futura; }
/* ------ Support */

/* Conversation */
@media only screen and (min-width: 992px) {
    body.body-conversation{ background:url('../images/conversation-background.png') no-repeat top left; background-size:45%; background-attachment:fixed; }
    body.body-conversation .mobile-img{ display:none; }
}
@media only screen and (max-width: 992px) {
    body.body-conversation{ background:none; }
    body.body-conversation .mobile-img{ padding-left:0; padding-right:0; margin-top:-70px; } 
}

/* ------ Conversation */


/* External Links */
@media only screen and (min-width: 992px) {
    body.body-external-links{ background:url('../images/background_style_1.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
}
@media only screen and (max-width: 992px) {
    body.body-external-links{ background:url('../images/mobile-background.png') no-repeat left top; background-size:contain; background-attachment:fixed; }
}

body.body-external-links div.div-external-links-header{ color:#ffffff; font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-external-links div.link-list div.link-block{ background-color:#212121; opacity: 0.9; }
body.body-external-links div.link-list div.link-block:hover{ background-color:#71866C; }
body.body-external-links div.link-list div.link-block span{ color:#ffffff; font-family:Futura; font-size:1.4rem; }
body.body-external-links div.link-list div.link-block a{ color:#71866C; font-size:1.2rem; }
body.body-external-links div.link-list div.link-block:hover a{ color:#D1DCD4; }
body.body-external-links div.link-list img{ width:5rem; }
/* ------ External Links */

/* Contact Us */
@media only screen and (min-width: 992px) {
    body.body-contact-us{ background:url('../images/background_style_1.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
}
@media only screen and (max-width: 992px) {
    body.body-contact-us{ background:url('../images/mobile-background.png') no-repeat left top; background-size:contain; background-attachment:fixed; }
}
body.body-contact-us div.div-contact-us-header{ color:#ffffff; font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-contact-us div.div-form{ background-color:#212121; opacity: 0.9; border-radius: 2rem; }
body.body-contact-us div.div-form .form-title{ color:#B0C4B1; font-size:2rem; font-weight:bold; font-family:Futura; }
body.body-contact-us div.div-form .form-label{ color:#D1DCD4; }
body.body-contact-us div.div-form .mandatory{ color:#ff0000; }
body.body-contact-us div.div-form button.btn-success{ background-color:#71866C; color:#000000; border:1px solid #71866C; font-family:Futura; }
body.body-contact-us div.div-form button.btn-success:hover{ background-color:#D1DCD4; color:#71866C; border:1px solid #D1DCD4; }
/* ------ Contact Us */

/* Login */
@media only screen and (min-width: 992px) {
    body.body-login{ background:url('../images/background_style_1.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
}
@media only screen and (max-width: 992px) {
    body.body-login{ background:url('../images/mobile-background.png') no-repeat left top; background-size:contain; background-attachment:fixed; }
}

body.body-login div.div-login-header{ color:#ffffff; font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-login div.div-form{ background-color:#212121; opacity: 0.9; border-radius: 2rem; }
body.body-login div.div-form .form-title{ color:#71866C; font-size:2rem; font-weight:bold; font-family:Futura; }
body.body-login div.div-form .form-label{ color:#D1DCD4; }
body.body-login div.div-form .mandatory{ color:#ff0000; }
body.body-login div.div-form button.btn-success{ background-color:#71866C; color:#D1DCD4; border:1px solid #71866C; }
body.body-login div.div-form button.btn-success:hover{ background-color:#D1DCD4; color:#71866C; border:1px solid #D1DCD4; }
body.body-login div.extrafunction{ color:#D1DCD4; text-decoration: none; font-weight: bold; }
body.body-login div.extrafunction a:hover{ color:#ffffff; }
body.body-login div.extrafunction a{ color:#71866C; text-decoration: none; font-weight:bold; }
body.body-login div.haveAnAccount{ color:#cccccc; font-weight: bold; }
body.body-login div.haveAnAccount a{ color:#71866C; font-weight: bold; }
body.body-login label.form-check-label{ color:#D1DCD4; }
/* ------ Login */

/* membership */
@media only screen and (min-width: 992px) {
    body.body-membership div.div-membership-header{ color:#71866C; }
}
@media only screen and (max-width: 992px) {
    body.body-membership div.div-membership-header{ color:#D1DCD4; }
}
body.body-membership{ background:url('../images/store_background.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
body.body-membership div.div-membership-header{ font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-membership div.div-form{ background-color:#212121; opacity: 0.9; border-radius: 2rem; }
body.body-membership div.div-form .form-title{ color:#71866C; font-size:2rem; font-weight:bold; font-family:Futura; }
body.body-membership div.div-members-detail .form-title,
body.body-membership div.div-members-order .form-title
{ color:#D1DCD4; font-size:1.5rem; font-weight:bold; font-family:Futura; }
body.body-membership div.div-members-order .form-title{ color:#71866C; }
body.body-membership div.div-members-order{ border:3px solid #71866C; border-radius: 30px; }
body.body-membership div.div-members-detail .form-label{ color:#D1DCD4; margin-bottom:0px; font-family:Futura; }
body.body-membership div.div-members-detail{ background-color:#71866C; border-radius: 15px;}
/* ------ membership */

/* store */
@media only screen and (min-width: 992px) {
    body.body-store div.div-store-header, body.body-store a.back-to-store{ color:#71866C; }
    body.body-store a.back-to-store{ color:#B0C4B1; }
}
@media only screen and (max-width: 992px) {
    body.body-store div.div-store-header, body.body-store a.back-to-store{ color:#D1DCD4; }
}
body.body-store .card-listing .card{ cursor:default; }
body.body-store{ background:url('../images/store_background.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
body.body-store div.div-store-header{ font-size:4rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-store div.div-form{ background-color:#212121; opacity: 0.9; border-radius: 2rem; }
body.body-store div.div-form .form-title{ color:#71866C; font-size:2rem; font-weight:bold; font-family:Futura; }
body.body-store .class_delivery_method, body.body-store .class_payment_method{ width:200px; }
body.body-store .btn-class-add-to-cart, 
body.body-store .btn-class-view-details,
body.body-store .btn-class-sold-out{ border:solid 2px #71866C; font-weight: bold; font-family:Futura; }
body.body-store .btn-class-view-details{ background-color:#ffffff; color:#71866C; } 
body.body-store .btn-class-add-to-cart{ background-color:#71866C; color:#ffffff; }
body.body-store .btn-class-sold-out{ border:solid 2px #CCCCCC; background-color:#ffffff; color:#cccccc; }
body.body-store .btn-class-view-details:hover{ background-color:#71866C; color:#ffffff; } 
body.body-store .btn-class-add-to-cart:hover{ background-color:#ffffff; color:#71866C; } 
body.body-store .card-product-name{ font-size:2rem; font-weight:bold; }
body.body-store .card-price{ color:#817e7e; font-size:1.2rem !important; }
body.body-store .card-img-top{ display:block; }
body.body-store .card-img-top.layer{ position:absolute; top:0; }
body.body-store a.back-to-store{ text-decoration: none; font-size:2rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-store a.nav-link{ border-top:0; border-left:0px; border-right:0; border-bottom:5px solid #cccccc; color:#cccccc; font-family:Futura; text-align: center; }
body.body-store a.nav-link.active{ border-bottom:5px solid #71866C; color:#71866C; }
body.body-store .tab-content p{ padding:20px; text-align: justify; }
body.body-store div.customer-info-form{ background-color:#71866C; border-radius: 15px;}
body.body-store div.customer-info-form-header{ color:#D1DCD4; font-size:2rem; font-weight:bolder; font-family:Futura; line-height:3.5rem; }
body.body-store div.customer-info-form .form-label{ color:#D1DCD4; font-family:Futura; }

body.body-store div.modal-content{ background-color:#3D4539; color:#ffffff; }
body.body-store div.modal .modal-backdrop{ background-color:red; }
body.body-store #staticBackdropPaymentMethod,
body.body-store #staticBackdropDeliverMethod{
    font-size:1.2rem;
}
/* ------ store */



/* Web Admin */
div.div-cms-header .system-title{ font-size:2rem; font-weight:bold; }
div.div-cms-header .div-cms-header-1{ background-color: #D1DCD4; }
div.div-cms-header .div-cms-header-1 img{ max-width:100px; }
div.div-cms-menu .nameitem{ color:#212121; text-decoration: none; font-size:1.1rem;}
div.div-cms-menu .menuitem a{ color:#3D4539; text-decoration: none; font-size:1.1rem; }
div.div-cms-menu .menuitem:hover{ background-color:#B0C4B1; opacity:0.8; }
div.div-cms-menu .menuitem a:hover{ color:#71866C;}
.div-cms-footer{ position:fixed; bottom:0; left:0; right:0; background-color:#3D4539; color:#ffffff; }
body.body-cms-index
{ background:url('../images/store_background.png') no-repeat left top; background-size:cover; background-attachment:fixed; }
table.cms-table-list>thead>tr, table.cms-table-detail>thead>tr{ background-color:#3D4539; }
table.cms-table-list>thead th, table.cms-table-detail>thead th{ color:#D1DCD4; white-space: nowrap; }
table.cms-table-list tbody td, table.cms-table-detail tbody td{ background-color:#ffffff; }
div.cms-page-title{ font-size: 2rem; font-family:Futura; color:#D1DCD4; text-align:right; }
.table-responsive, .table-responsive-2{ background-color:#ffffff52 !important; padding-top:10px; padding-bottom:10px; border-radius: 5px; }
.cms-detail-form{ background-color:#212121; opacity: 0.9; border-radius: 2rem; }
.cms-form-title{ font-size:1.6rem; color:#D1DCD4; }
.cms-form-label{ font-weight:bold; color:#ffffff; }
hr.cms-form-divider{ border-color:#71866C; border-width:0.2rem; }
.div-cms-form{ background-color:#4e524fa1; }
.div-cms-form .figure-number{ font-size:2rem; color:#D1DCD4; }
.div-cms-form.form-control:disabled, .form-control[readonly] { background-color: #5e7893; opacity: 1; }
/* ------ Web Admin */




/*
color:#FFFFFF;
color:#D1DCD4
color:#71866C
color:#3D4539
color:#212121
*/