/* News 2026 jan*/
.hkjcLogo-yoh{
    display: flex;
}
.hkjcLogo-yoh img{
    height: 60px;
    width: auto !important;    
}

/* News 2025 DEC 02*/

.content-en, .content-ch {
	color: #333333;
    padding: 10px 10px;
    margin-bottom: 20px;
    border: 1px #E5E5E5 solid;
    max-width: 1350px;
    margin: auto;
	margin-bottom: 30px;
    margin-top: 30px;
}
.followUs > a:nth-child(4) {
  display: none;
}

/* News 2023 627 */
.lot-detail-weight {
  flex-direction: column;
}
.lots-tr{
border-bottom: 1px solid #ddd;
}
.lots-td-center{
text-align: center;
}
.lots-info-col {
display: flex;
gap: 30px;
background-color: #f6f6f6;
padding: 15px 15px 15px 15px;
border-radius: 6px;
align-items: center;
}
.btn-container{
display: flex;
gap: 30px;
}
.popup-txt .pop-date{
color: #ffffff;
margin-top: 30px;
margin-bottom: 5px;
}
.popup-txt{
padding-bottom: 30px;
color: #cccccc;
}
.popup-txt .pop-date b {
font-weight: 300;
font-size: 1.6em;
}
.footerSection .faq-container a:focus {
color: #cccccc;
}
.search_form_container{
display: none;
}
.news #article-list-right {
padding-top: 0px;
}
.news #article-list-right .article-list-container .othersList .row {
display: flex;
flex-wrap: wrap;
}
.news #article-list-right .article-list-container .othersList .list-row {
width: 50%;
}
.news #article-list-right .article-list-container .othersList h3 {
min-height: 80px;
}
.news .article-content h1.page-title {
margin-top: 15px;
border-bottom: 0px solid #022169;
}
.news #article-list-right .article-list-container .othersList a.active blockquote {
background: rgba(0, 0, 0, 0.03);
}
.news #article-list-right .article-list-container .othersList a blockquote:hover {
background: rgba(0, 0, 0, 0.03);
}
@media (max-width: 768px) {
.news #article-list-right .article-list-container .othersList .list-row {
width: 100%;
}
}
/* News 2023 end */

.vc_sep_color_grey {
margin-top: 30px;
}

.vc_separator.vc_sep_color_grey .vc_sep_line {
border-color: #d2d2d2;
}

.vc_btn3.vc_btn3-shape-rounded {
border-radius: 48px;
}

.vc_btn3.vc_btn3-color-primary.vc_btn3-style-modern {
color: #fff;
border-color: #022169;
background-color: #022169;
}

h1,
h2,
h3,
h4,
h5,
h6 {

}

html:lang(zh-HK) h1,
h2,
h3,
h4,
h5,
h6 {

}

.nav>li>a {
padding: 10px 15px 10px 15px !important;
}

.navbar-nav>li>a {
line-height: 16px;
}

ul#menu-menu {
font-size: 16px;
padding-bottom: 5px;
}

/* Top Menu.. */

#site-navigation .navbar {
min-height: 32px;
}



#site-navigation .navbar-header {
float: none !important;
margin-left: auto !important;
margin-right: auto !important;
display: table !important;
}

#site-navigation .navbar-nav>li>a {
/*text-transform: uppercase;*/
font-weight: normal;
border-bottom: #22305B solid 1px;
}

.navbar .menu-item.current-menu-item a {
border-bottom: #ffffff solid 1px;
}

.navbar .menu-item.current-menu-item a {
border-bottom: #ffffff solid 1px;
}

.navbar .menu-item:hover {
background: transparent !important;
}

#site-navigation .navbar-nav>li>a:hover {
border-bottom: #ffffff solid 1px;
}

.navbar .navbar-nav>li.current-menu-item>a {
border-bottom: #ffffff solid 1px;
}


/* MMenu style */
#mmenu .langToggle a {
color: #fff;
}

#mmenu .ewin_link a {
color: #fff;
}

#mmenu .followUs p,
#mmenu .followUs span {
color: #fff;
}

#mmenu {
background-color: #666;
}

#mmenu #menu-main-menu>.menu-item {
background: #787878;
}


/* Table Style */
.generalTable {}

table thead tr {
/*background: #ddd;*/
background: rgba(228, 228, 228, 0.5) none repeat scroll 0px 0px;
}

table tbody tr {
background: rgba(255, 255, 255, 0.8) none repeat scroll 0px 0px;
}

table tbody tr:nth-child(even) {
background: rgba(228, 228, 228, 0.5) none repeat scroll 0px 0px;
}

table tbody tr:nth-child(odd) {
background: rgba(255, 255, 255, 0.8) none repeat scroll 0px 0px;
}

td,
th {
/*padding: 3px;*/
padding: 0.5em !important;
/*text-align: center;*/
}

.responsive-table-container table th {
color: #fff;
background: #1b3767;

}

table.raceinfo th {
background-color: #1b3767 !important;

}

table.raceinfo td.bg-blue {
background-color: #ccc !important;

}

table.post-number tbody tr td {
background-color: transparent !important;
border-top: 0px solid #ddd;
border-bottom: 0px solid #ddd;
}

table.post-number {
border-bottom: 0px solid #ddd;
}


table.post-number tbody tr:nth-child(odd) {
background-color: transparent !important;
}

td.num-center div {
font-size: 13.6875px !important;
}

h1,
h2 {
margin-bottom: 12px;
font-weight: bold;
/*font-family: 'open sans', 'Roboto Condensed', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
}

h1 {
color: #1d0e47;
font-size: 1.8em;
line-height: 1.4em;
}

h2 {
color: #1b3767;
font-size: 1.3em;
line-height: 1.2em;
}

h3 {
color: #1b3767;
font-size: 1.2em;
line-height: 1.3em;
margin-bottom: 10px;
}

h4 {
color: #1b3767;
}

.messagebox h3 {
color: #888888;
}


.ewin_logo img {
    display: none;
}
.ewinIcon .ewin_link {
    display: none;
    }

.ewinIcon .ewin_link a {
color: #fff
}

.gotoTop .fa {
color: #888888;
}

h1.page-title {
color: #1b3767;
}

.single-post .site-content {
/*background:#f7efe2;*/
padding-bottom: 25px;
}

.wpb_image_grid .wpb_image_grid_ul .isotope-item {

margin: 0 1px 2px 0 !important;

}

.subpage-top-container {
background: #transparent !important;
}

.subpage-top-container>.container {
background: #transparent !important;
}


.page-template-page-fullwidth #content,
#content>.container,
.widget>.container,
.content-header>.container,
#content .subpage-top-container .container,
.vc_section.container {
/*background-color:#f7efe2;*/
}

.maincolor {
color: #888888
}

.secondarycolor {
color: #f7efe2
}

/* news */
.article-list .article-list-container h2 {

padding: 0.3em;
background: #1b3767 !important;
color: #fff;
margin: 0px;

}

.article-list .article-list-container .othersList blockquote {
padding: 0.3em;
padding-bottom: 10px;
margin-top: 2px;
margin-bottom: 0;
border-top: 0px solid #cecece;
border-right: 0px solid #cecece;
border-bottom: 1px solid #888888;
border-left: 0px solid #cecece;
}

.othersList h3 {
color: #555;
font-weight: nomal;
line-height: 1.3em;
font-size: 1em;
}

.article-list .article-list-container .othersList a.active blockquote {
background: rgba(255, 255, 255, 0);
}

.footerSection .rgp-container .rgp-text {
font-size: 18px;
}


/*race*/
.race-icon {
background: #8e8998;
}


.pastwinnerlist table th {
color: #fff !important;
}



/* Contenders */

.subStarContent {
background: rgba(255, 255, 255, 0.2) none repeat scroll 0px 0px !important;
border-bottom: 1px solid #ccc !important;
}

.subStarContent:hover {
color: #888888;
opacity: 0.7;
}


.subStarContent.on {
background: #888888 !important;
color: #fff;
}

.rating.ng-binding {
background: #888888 !important;
}


.ng-binding ul {
list-style: none;
}

.ng-binding ul li::before {
content: "\2022";
color: #ccc;
font-weight: bold;
display: inline-block;
width: 1em;
margin-left: -1em;
}

.messageFirst {
background: #888888 !important;
color: #fff;
}

.messagebox {
background: rgba(255, 255, 255, 0.5) none repeat scroll 0px 0px;
border: 1px solid #ccc;
}

.graphTitle {
font-size: 1.2em;
}

.highlight-box h4 {
background-color: #888888 !important;
}

.highlightTable table tr:first-child>td {
background-color: #ccc;
}

.btn-primary {
color: #888888;
background-color: #ccc;
border-color: #fff;
}

.btn-primary:active,
.btn-primary.active,
.open>.dropdown-toggle.btn-primary {
color: #fff;
background-color: #888888;
border-color: #fff;
}

.fa-play-circle {
color: #1b3767 !important;
}


/* Extra add CSS for NEWs style */

/* === listing ===*/

ul.list-circle li {
list-style-type: circle !important;
}

ul.list-square li {
list-style-type: square !important;
}

ol.list-upper-roman li {
list-style-type: upper-roman !important;
}

ol.list-lower-alpha li {
list-style-type: lower-alpha !important;
}

ol.list-upper-alpha li {
list-style-type: upper-alpha !important;
}

/* === Group Photo Caption ===*/
.group-photo-caption {
margin-top: .2em;
font-size: .8em;
line-height: 1.5em;
margin-top: 5px;
color: #666;

}

.group-photo-no-margin-bottom {
margin-bottom: 0px !important;
}


.caption {
margin-top: .2em;
font-size: .8em;
color: #666;
line-height: 1.5em;
}

@media all and (max-width: 767px) {
.group-photo-no-margin-bottom {
margin-bottom: 0px !important;
}

.group-photo-caption {
margin-top: .2em;
font-size: .8em;

margin-top: -10px;
}

/*
.article-content .wpb_single_image .vc_single_image-wrapper {
margin-bottom: 15px;
}*/
}


/* === Float News === */

.wpb_single_image .vc_figure-caption {
line-height: 1.5em !important;
padding-bottom: 20px;
}


.racing-news-float-left-photo {
position: relative;
float: left;
width: 40%;
margin-right: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
padding-left: 0px !important;
padding-right: 0px !important;
}

.racing-news-float-right-photo {
position: relative;
float: right;
width: 40%;
margin-left: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
padding-left: 0px !important;
padding-right: 0px !important;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 90%;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 90%;
}

.racing-news-caption {
color: #666;
padding: 0.3em;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 95%;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 95%;
}


@media (max-width: 991px) {
.racing-news-float-left-photo {
float: left;
width: 45%;
margin-right: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
}

.racing-news-float-right-photo {
float: right;
width: 45%;
margin-left: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
}

@media (max-width: 550px) {

.wpb_gallery_slides.wpb_image_grid .wpb_image_grid_ul .isotope-item {
width: 49% !important;
/* margin: 1%; */
}

.wpb_image_grid .wpb_image_grid_ul .isotope-item {

margin: 0 2px 2px 0 !important;

}


.racing-news-float-right-photo {
padding-left: 0px !important;
width: 100% !important;
}

.racing-news-float-right-photo {
padding-right: 0px !important;
width: 100% !important;
}

.racing-news-float-right-photo {
width: 100% !important;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 100% !important;
}

.racing-news-float-left-photo {
width: 100% !important;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 100% !important;
}
}

/* === News author ===*/
.article-mauthor {
font-size: 0.9375em;
color: #555;
}

/* === no manifier  ===*/
.prettyphoto.cboxElement:not(.imageThumb)::after {
display: none;
}



.vc_figure-caption {
color: #666666;
}



/* for lucky start */

.pageTopMenu.fixedTop {
border-bottom: 0px solid #fff;
-webkit-box-shadow: 0px 7px 5px -4px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0px 7px 5px -4px rgba(0, 0, 0, 0.3);
box-shadow: 0px 7px 5px -4px rgba(0, 0, 0, 0.3);




}

.pageTopMenu.hidden-xs.fixedTop .navbar-container {
border-bottom: 0px solid #fff;
}

.ult-ih-info-back {
background-color: rgba(0, 0, 0, 0.75) !important;
}

#food-container h3.ult-ih-heading.ult-responsive {
color: #a21d23 !important;
font-size: 1.5em !important;
line-height: 1.4em !important;
}


#food-container .ult-ih-description.ult-responsive.ult-ih-description p {
font-size: 1em !important;
line-height: 1.4em !important;
}


.navbar-container {
border-bottom: 0px solid #fff;
}

.marginTop-15px {
margin-top: 15px;
}

.marginTop-20px {
margin-top: 20px;
}

.marginTop-25px {
margin-top: 25px;
}

.marginTop-30px {
margin-top: 30px;
}

#kv-index-container {
padding-top: 0px !important;
padding-bottom: 0px !important;
}


.topMainvisual {
background: #1b3767;
}

.topmainvisual-img {
padding-top: 0px !important;
padding-bottom: 0px !important;
}


.ult-ih-description.ult-responsive.ult-ih-description p {
color: #ffffff !important;
}

#mobile-flip .ult-ih-list-item {
margin: 0px !important;
}

#keychain-container {
padding: 15px 0px;
padding-top: 30px;
padding-bottom: 0px;
background-color: #ffffff;
/*-webkit-box-shadow: inset 0px 5px 15px 0px rgba(0,0,0,0.2);
-moz-box-shadow: inset 0px 5px 15px 0px rgba(0,0,0,0.2);
box-shadow: inset 0px 5px 15px 0px rgba(0,0,0,0.2);*/
}

.site-content {}

#content .subpage-top-container .container {
background-color: transparent;
}



#countdown-bar {
padding: 15px 0px;
padding-top: 30px;
padding-bottom: 30px;
background-color: #1b3767;
-webkit-box-shadow: inset 0px 5px 15px 0px rgba(0, 0, 0, 0.2);
-moz-box-shadow: inset 0px 5px 15px 0px rgba(0, 0, 0, 0.2);
box-shadow: inset 0px 5px 15px 0px rgba(0, 0, 0, 0.2);
}


.ult-ih-divider-block {
display: none;
}


.pageHeader {
/*background: #1b3767;*/
}





.ult-ih-description.ult-responsive h2 {
color: #1b3767 !important;
}


html,
body,
p {
color: #333;
}

.pageFooter,
.sidebar-footer {
background-color: #761619;

}

.navbar-container {
/*border-bottom: 1px solid #fff;*/
}

.navbar .menu-item,
.navbar-nav>li>.dropdown-menu {
/* background: #888888; */
/* background:none;*/
}

.smile_icon_list.top li .icon_list_connector {
border-color: #fff !important;
}

.ult-ih-divider-block {
display: none;
}

@media (max-width: 991px) {
.ult_countdown.ult-cd-s2 .ult_countdown-section {
padding: 0 12px !important;
}

.countdown-text {
text-align: center !important;
font-size: 22px !important;
}

.dishes-text {
width: 100% !important;
}

.dishes-photo {
width: 100% !important;
}


}

@media (max-width: 768px) {

#kv-index-container {
padding-top: 0px !important;
padding-bottom: 0px !important;
}

.topmainvisual-img {
padding-top: 0px !important;
padding-bottom: 0px !important;
}







.smile_icon_list.top li .icon_list_icon {
margin: 0 auto;
float: left;
}

.smile_icon_list.top li .icon_description {
text-align: left;
margin: 0px;
padding-bottom: 0;
}


.smile_icon_list.top li .icon_list_icon {
/* margin: 0 auto; */
float: left;
margin-right: 10px;
}

.smile_icon_list.left li .icon_list_connector {
left: .5em !Important;
border-right-width: 1px !Important;
border-right-style: dashed !Important;
display: block !Important;
margin-top: 15px;
}

.smile_icon_list li .icon_list_connector {
height: 100% !Important;
position: absolute !Important;
top: .5em !Important;
z-index: 1 !Important;
display: block !Important;
}

.smile_icon_list.top li .icon_list_connector {
/* position: absolute;
top: .5em;*/
left: .6em;
width: 100%;
/*height: 10px;*/
border-left-width: 1px;
border-left-style: dashed;
border-top-width: 0px;
margin-left: 0;
}

.smile_icon_list li:last-child .icon_list_connector {
display: none !important;
}

.ult_countdown.ult-cd-s2 .ult_countdown-section {
padding: 0 7px !important;
}

.ult_countdown,
.wpb_row .wpb_column .wpb_wrapper .ult_countdown {
float: unset !important;
text-align: center !important;

}




}

span.typed-cursor {
color: #fff !Important;
}

.ult_countdown-period {
text-align: center;
}

.ult_countdown,
.wpb_row .wpb_column .wpb_wrapper .ult_countdown {
width: 100%;
height: auto;
display: block;
line-height: 1;
margin-bottom: 0px;
float: right;
/* text-align: center; */
text-align: inherit;
}

/* space between the bar and your content */
#barwrap {
margin-bottom: 30px;
}

.bar {
text-align: center;
padding: 8px;
padding-top: 0px;
background-color: rgba(0, 0, 0, 0.5);
/* set it at will according to your message's length in small devices */
max-height: 100px;
position: fixed;
top: 0px;
left: 0px;
right: 0px;
color: #f5f5f5;
border-bottom: thick ridge rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0px 2px 13px 0.5px rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 13px 0.5px rgba(0, 0, 0, 0.3);
display: none;
z-index: 3008;
}

#head-image {
margin-right: 1%;
position: relative;
top: 8px;
}

#text {
position: relative;
}

#ok {
float: right;
margin-top: 6px;
margin-right: 10px;
font-size: 25px;
}

#ok a {
color: #3EAAEE;
text-decoration: none;
}


#mobile-flip .ult-ih-image-block {
width: 100% !important;
height: 100% !important;
}

#mobile-flip .ult-ih-item {
width: 100% !important;
height: 100% !important;
}

#ult-ih-list-item-2449 {
width: 100% !important;
height: 100% !important;
}

#ult-ih-list-item-5955 {
width: 100% !important;
height: 100% !important;
}

.wpb_single_image.wpb_content_element.vc_align_left {
margin-bottom: 0px;
}

.gift-keychain {
position: relative;
margin-top: -60px;
left: 0%;
}

.recreationBg {
/*background-image: url(https://cdn.shopify.com/s/files/1/0337/7469/products/blue-sky-and-clouds-wall-mural.jpeg);*/
}

.fixedBg {
position: fixed !important;
width: 100%;
height: 100%;
top: 0;
left: 0;
background-repeat: no-repeat;
background-size: cover;
}

.fixedPattern {
position: fixed !important;
width: 100%;
height: 100%;
top: 0;
left: 0;
/*background-image: url("https://www.transparenttextures.com/patterns/climpek.png");*/
background-repeat: repeat;
-webkit-transition: all 3s;
transition: all 3s;
}

/*
.navbar .menu-item.current-menu-item, .navbar .menu-item:hover, .navbar .menu-item:focus {
background: #3f8d8a;
} 

.dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus, .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus, .navbar .navbar-nav > li.current-menu-item > a, .navbar .navbar-nav .current-menu-item > li > span, .navbar .navbar-nav>li>a:hover, .navbar .navbar-nav>li>a:focus {
background: #1b3767;
}*/

.vc_figure-caption {
color: #666666;
}

/* === Drop down menu ===*/
.dropdown-menu {
width: 100%;
/*height: 150px;*/
overflow-y: scroll;
overflow-x: hidden;
}

.open>.dropdown-toggle.btn-default {
width: 100%;
}

.dropdown.otherlist-dropdown {
margin-bottom: 20px;
}

.btn-sm,
.btn-group-sm>.btn {
width: 100%;
}

/*
h3 {
font-size: 1em !important;
line-height: 1.4em !important;
text-align: left;
color: #86665d !important;
}

a:hover h3 {
color: #4a3834 !important;
} */

.dropdown-menu>li>a {

white-space: normal;
}


.entry-content table.raceinfo-table-list,
.comment-content table.raceinfo-table-list {
border-bottom: 0px solid #ddd !important;
}


.raceinfo-table-list td {
border-top: 0px solid #ddd !important;
background-color: transparent !important;
}

table.raceinfo-table-list tbody tr {
background: none !important;
}

table.raceinfo-table-list tbody tr:nth-child(odd) {
background: none !important;
}


.raceinfo-table-list td.raceinfo-icon-width {
padding: 0px !important;
text-align: left !important;
}

.raceinfo-table-list td.raceinfo-icon-txt-width {
padding: 0px 3px 0px 8px !important;
font-size: 0.8125em;
text-align: left !important;
line-height: 1.5em;
vertical-align: top !important;
}

.raceinfo-icon-width {
width: 40px !important;
}


.race-static td {
border: 0px;
background-color: transparent !important;
white-space: normal !important;
padding: 5px 5px !important;
float: left;
}

.race-static td:nth-child(1) {

padding: 5px 5px 5px 0px !important;

}

.raceinfoDivWidth {
/*min-width:80px;*/
}

table.race-static {
border-bottom: 0px solid #ddd !important;
width: 100%;
background-color: transparent !important;
background: none !important;

}


table.race-static tr {

background-color: transparent !important;
background: transparent !important;
border-bottom: 0px solid #ddd !important;
border-top: 0px solid #ddd !important;

}


.width-race-info-box-raceday {
width: 17%;
}


.width-padding {
width: 8%;
display: inline-block;
}

.width-race-info-box {
width: 17%;
padding: 5px 5px;
display: inline-block;
}

.raceinfo-icon {
float: left;
display: block;
width: auto !important;
color: #1b3767;
}

.raceinfo-icon-title {
float: right;
display: block;
}

.raceinfo-icon-txt {
font-size: 0.9375em;
display: block;
}

@media (max-width: 1199px) {
.width-padding {

display: none;
}

.width-race-info-box {
width: 19.5%;
padding: 5px 5px;
display: inline-block;
}

.width-race-info-box-raceday {
width: 20%;
}



}

@media (max-width: 991px) {

.width-race-info-box {
width: 32%;
padding: 5px 5px;
display: inline-block;
}

.width-race-info-box-raceday {
width: 32%;

}

.raceinfo-icon-title {
width: 73%;
display: block;
}



}

@media (max-width: 650px) {

.width-race-info-box {
width: 48%;
padding: 5px 5px;
display: inline-block;
}

.width-race-info-box-raceday {
width: 48%;
}




}


@media (max-width: 413px) {

.raceinfo-icon-title {
width: 73%;
}



.width-race-info-box {
width: 48%;
padding: 0px 0px;
display: inline-block;
}

.width-race-info-box-raceday {
width: 47%;
}

.width-race-info-box-raceday-01 {
width: 47%;
}

.width-race-info-box-raceday-02 {
width: 47%;
}

.race-icon {

background: #8e8998;
width: 35px;
height: 35px;

}

.raceinfo-top-icon {
border-bottom: 1px solid #caaf80;
width: 120%;
padding-bottom: 0px;
padding-top: 20px;
/* margin-left: -15px;
margin-right: -15px;*/
}


}

#related-links .vc_row {
margin-left: 0px !important;
margin-right: 0px !important;
}


#related-links .vc_column_container>.vc_column-inner {
box-sizing: border-box;
padding-left: 15px;
padding-right: 15px;
width: 100%;
}

span {
color: inherit;
}


.entry-content th,
.comment-content th {

text-transform: none;
text-align: center;
letter-spacing: 0em;

}

.entry-content th,
.comment-content th {

text-transform: none;
text-align: center;
letter-spacing: 0em;

}

.entry-content td,
.comment-content td {
/*text-align:center;*/
}

#article-list-right.is_stuck {
margin-top: 35px
}


.wpb_gallery_slides.wpb_image_grid .wpb_image_grid_ul .isotope-item {
z-index: 0;
width: 33%;
}

.rgp-container>.col-md-2 {
padding-right: 0px;
}

#xsbf-entry-content .vc_row-has-fill+.vc_row>.vc_column_container>.vc_column-inner {
padding-top: 0px;
}

.dropdown-menu>.active>a {
background: #1b3767;
}

.entry-content th,
.comment-content th {

line-height: 1.5em;

}

.marginBottom-10px {

margin-bottom: 10px;

}

.article-content h1.page-title {
color: #333;
font-size: 1.3em;
line-height: 1.2em;

}


#content>.container,
.content-header>.container {
background-color: transparent;

}



.pageFooter .footerFollowus {
display: none;
}




.smallcaption {
font-size: 0.8em;
}

#main {
margin-bottom: 0px;

}

/* New Race info bar */
table.race-info-bar-table {
border-bottom: 0px solid #ddd !important;
margin: 0 0 1.625em;
width: 100%;
}

.race-info-bar-table td {
text-align: left;
border-top: 0px solid #ddd !important;
background: none !important;
}

.race-info-bar-table tr {
background: none !important;
}

/* === add table mobile hand icon ===*/
.arial {
font-family: arial !important;
}

.vc_mobile .handIconNode {
z-index: 1;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: block;
background: rgba(39, 47, 56, 0.2) url(//res.hkjc.com/campaigns/wp-content/uploads/sites/146/hand.png) center top no-repeat;
background-position: 50% 5%;
-webkit-transition: opacity 0.15s;
-o-transition: opacity 0.15s;
transition: opacity 0.15s;
-webkit-background-size: 50% 160px;
background-size: 60px;
}

.responsive-table-container table {
text-align: left;
}

.responsive-table-container table th {
text-align: left;
}

.am-table {
position: relative;
overflow-y: hidden;
overflow-x: auto;
margin-bottom: 35px;
margin-top: 0px;
letter-spacing: 0px;
font-size: 0.9125em;
white-space: nowrap;
}

.wrap {
white-space: normal;
}

.nowrap {
white-space: nowrap;
}


.am-table:last-child {
margin-bottom: 0;
}

.am-table table th {
background: #1b3767;
color: #fff;
line-height: 1.2em;
text-transform: capitalize;
padding: 10px 0px;
}

.am-table table th,
.am-table table td {
padding-left: 5px;
line-height: 18px;
}

.entry-content td,
.comment-content td,
.post-number td {
border-top: 0px;
border-bottom: 0px;
}

.entry-content td,
.comment-content td {
padding: 6px 10px 6px 5px;
}

.entry-content table,
.post-number td {
border-top: 0px;
border-bottom: 0px;
}

table tbody tr:nth-child(even),
.raceresult-table tbody tr:nth-child(even) .post-number td {
/* background: #f1f1f1!important;*/
}



.entry-content table {
margin: 0px;
}


.num-center {
text-align: center !important;
padding-left: 3px !important;
padding-right: 3px !important;
}


@media only screen and (max-width: 1199px) {
.isTouch .handIconNode {
display: none;
}
}

/* === end table mobile hand icon ===*/

/* === video play icon iphone === */
@media only screen and (max-width: 768px) {
.vjs-hkjc-replay-skin.vjs-big-play-centered .vjs-big-play-button {
display: none;
}
}


/* === Float News === */

.wpb_single_image .vc_figure-caption {
line-height: 1.5em !important;
}


.racing-news-float-left-photo {
position: relative;
float: left;
width: 40%;
margin-right: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
padding-left: 0px !important;
padding-right: 0px !important;
}


.racing-news-float-right-photo {
position: relative;
float: right;
width: 40%;
margin-left: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
padding-left: 0px !important;
padding-right: 0px !important;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 90%;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 90%;
}

.racing-news-caption {
color: #666;
padding: 0.3em;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 95%;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 95%;
}


@media (max-width: 991px) {
.racing-news-float-left-photo {
float: left;
width: 45%;
margin-right: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
}

.racing-news-float-right-photo {
float: right;
width: 45%;
margin-left: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
}

@media (max-width: 550px) {
.racing-news-float-right-photo {
padding-left: 0px !important;
width: 100% !important;
}

.racing-news-float-right-photo {
padding-right: 0px !important;
width: 100% !important;
}

.racing-news-float-right-photo {
width: 100% !important;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 100% !important;
}

.racing-news-float-left-photo {
width: 100% !important;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 100% !important;
}
}

/* === News author ===*/
.article-mauthor {
font-size: 0.9375em;
color: #555;
}


/* === race result info table ===*/
table.race-static tbody tr:nth-child(2n) {
/*background-color: #ffffff !important;*/
}

.race-static td {
border: 0px;
/*background-color: #ffffff !important;*/
white-space: normal !important;
padding: 3px 5px !important;
float: left;
line-height: 20px;
}

table.race-static {
margin-left: -5px;
}

/* ===  caption style CC ===*/
.wpb_single_image .vc_figure-caption {
margin-bottom: 10px;
}

.caption,
.group-photo-caption,
.vc_figure-caption {
color: #666 !important;
font-style: italic !important;
font-size: 0.8125em !important;
line-height: 1.5em !important;
margin-top: 5px !important;
}


/* === Raceinfo icon CC ===*/
/*race*/

.racing-move-left {
margin-left: 0px !important;
}

.raceinfo-icon-title {
width: 68%;
float: left;
line-height: 1.5em;
font-size: 0.85em;
padding-left: 4px;
}


.raceinfo-icon,
.raceinfo-icon-title {
margin-top: 40px;
font-weight: 400;
}

.raceinfo-icon {
width: auto;
float: left;
}

.race-icon {
margin-right: 0px;
margin-left: 0px;
width: 40px;
height: 40px;

float: left;
margin-right: 5px;
margin-bottom: 5px !important;
border-radius: 3px;
}


.next-line {
display: block;
Font-size: 13px;
line-height: 16px;
}

.raceinfo-icon-m li {
margin-top: 38px;
float: left;
}

.raceinfo-icon-m ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}

.gap {
display: none;
}


@media (max-width: 1199px) {
.next-line {
font-size: 10.5px;
}
}



@media (max-width: 1024px) {
.raceinfo-icon {
width: auto;
}

.raceinfo-icon-title {
font-size: 0.875em;
width: auto;
}



}




@media (max-width:767px) {
.racing-move-left {
margin-left: 0px !important;
}

.racing-mobile-width.vc_col-sm-11 {
width: 100%;
}

.cup-cc,
.raceinfo-icon {
display: none;
}

.raceinfo-icon-title {
margin-top: 0px;
margin-bottom: 0px;
border-bottom: 1px solid #ccc;
width: 100% !important;
}

.raceinfo-icon,
.raceinfo-icon-title {
margin-top: 0px;
}
}




@media (max-width: 767px) {
.next-line {
display: inline;
font-size: 1em;
}

.raceinfo-icon-m li {
margin-top: 0px;
border-bottom: 1px dotted #ccc;
width: 100%;
display: block;
margin-bottom: 10px !important;
}

.gap {
display: inline;
margin-right: 5px;
}
}




/* news */
.article-list .article-list-container h2 {
padding: 5px 10px;
background: #888888;
color: #fff;
}

.article-list .article-list-container .othersList blockquote {
padding: 8px;
padding-bottom: 10px;
margin-top: 2px;
margin-bottom: 0;
border-top: 0px solid #cecece;
border-right: 0px solid #cecece;
border-bottom: 1px solid #888888;
border-left: 0px solid #cecece;
}

.othersList h3 {
color: #333;
font-weight: nomal;
}

.article-list .article-list-container .othersList a.active blockquote {
background: rgba(255, 255, 255, 0);
}




/* === News === */
.article-content h1.page-title {
text-align: left !important;
font-size: 1.2em !important;
color: #666 !important;
font-weight: normal;
text-transform: none;
font-stretch: normal;
line-height: 1.4em;
}

/* === News others === */
.article-list .article-list-container .othersList a.active blockquote {
background: rgba(0, 0, 0, 0.1);
}

.otherlist-dropdown>.dropdown-menu>.active>a,
.otherlist-dropdown>.dropdown-menu>.active>a:hover,
.otherlist-dropdown>.dropdown-menu>.active>a:focus {
color: #fff !important;
/*background: #266632;*/
background: #5e90bb;
white-space: normal;
}

.article-list .article-list-container h2 {
background: #266632;
color: #fff;
font-size: 1.3125em;
margin-bottom: 0px;
}

.othersList h3 {
padding-bottom: 8px;
font-size: 1em;
}

.otherlist-dropdown.btn-sm {
width: 100%;
}

.single-post .btn-sm {
width: 100%;
}

.single-post .dropdown-menu {
width: 100%;
}

.single-post .dropdown-menu a:hover {
color: #fff;
}

.single-post .dropdown-menu a:link {
color: #333;
}

.single-post .dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus {
text-decoration: none;
color: #333;
}

.single-post .dropdown-menu>li>a:link {
white-space: normal;
}

.prettyphoto.cboxElement:not(.imageThumb)::after {
content: "" !important;
position: absolute;
right: 10px;
top: 5px;
font-size: 1.2em;
font-family: "fontawesome";
display: none !important;
}

/*photo*/

/* 3 col */
.wpb_gallery_slides.wpb_image_grid .wpb_image_grid_ul .isotope-item {
width: 32%;
margin: 2px;
}

/* 2 col in mobile */
@media (max-width: 550px) {
.wpb_gallery_slides.wpb_image_grid .wpb_image_grid_ul .isotope-item {
width: 47%;
margin: 1%;
}
}

.site-content {
min-height: 850px;
}


.videoListHolder .videoPlayIcon::before {
content: "" !important;
font-family: "fontawesome";
font-size: 2.5em;
line-height: 1em;
}

.videoListHolder .videoPlayIcon {
display: none !important;
}


@media (max-width:991px) {
.site-content {
min-height: 900px;
}
}


@media (max-width: 767px) {
#fontSizeSelecter {
display: none !important;
}

h1.page-title {
color: #1b3767;
display: block;
}

#main {}

}

.pageFooter .footerFollowus {
display: none !important;
}



.current_page_item {
background: #1d0e47 !important;
}

h1.page-title {
color: #1b3767;
/*display:none;*/
}

.article-content .page-title {

display: block !important;
}


/**Gallery prettyphoto**/
.wpb_gallery_slides.wpb_image_grid .wpb_image_grid_ul .isotope-item {
width: 32% !important;
margin: 2px !important;
}

.wpb_gallery .prettyphoto.cboxElement:not(.imageThumb)::after {
display: none;
}

@media (max-width: 550px) {
.wpb_gallery_slides.wpb_image_grid .wpb_image_grid_ul .isotope-item {
width: 47% !important;
margin: 1% !important;
}

}


/*=== race info icon ===*/
.raceinfo-icon-title {
width: 68%;
float: left;
line-height: 1.5em;
font-size: 0.85em;
padding-left: 4px;
}


.raceinfo-icon,
.raceinfo-icon-title {
margin-top: 40px;
font-weight: 400;
}

.raceinfo-icon {
width: auto;
float: left;
}

.race-icon {
margin-right: 0px;
margin-left: 0px;
width: 40px;
height: 40px;
background: #888888;
float: left;
margin-right: 5px;
margin-bottom: 5px !important;
border-radius: 3px;
}


.next-line {
display: block;
font-size: 13px;
line-height: 16px;
}

.raceinfo-icon-m li {
margin-top: 38px;
float: left;

}

.raceinfo-icon-m ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}

.gap {
display: none;
}

.raceinfo-icon-m li {
margin-top: 38px;
float: left;
}

.raceinfo-icon-m ul {
list-style-type: none;
padding: 0px;
margin: 0px;
}

@media (max-width: 1024px) {
.raceinfo-icon {
width: auto;
}

.raceinfo-icon-title {
font-size: 0.875em;
width: auto;
}

}



@media (max-width: 1199px) {
.next-line {
font-size: 10.5px;
}
}

@media (max-width:991px) {

.cup-cc,
.raceinfo-icon {
display: none;
}


.raceinfo-icon-title {
margin-top: 0px;
margin-bottom: 0px;
border-bottom: 1px solid #ccc;
width: 100% !important;
}

.raceinfo-icon,
.raceinfo-icon-title {
margin-top: 38px;
}

.raceinfo-icon-m li {
margin-top: 0px;
border-bottom: 1px dotted #ccc;
width: 100%;
display: block;
margin-bottom: 10px !important;
}
}

@media (max-width: 769px) {
.next-line {
font-size: 13px;
display: inline;
padding-left: 5px;
}

.gap {
display: inline;
}
}

@media (max-width: 1199px) {
.entry-content .wpb_content_element {
margin-top: 0px;
}

}


/**** 2018 addition css START*************/
/* ============== Float News START  ===================== */
.racing-news-float-left-photo {
position: relative;
float: left;
width: 40%;
margin-right: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
padding-left: 0px !important;
padding-right: 0px !important;
}

.racing-news-float-right-photo {
position: relative;
float: right;
width: 40%;
margin-left: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
padding-left: 0px !important;
padding-right: 0px !important;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 90%;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 90%;
}

.racing-news-caption {
color: #888;
padding: 0.3em;
}

.caption,
.group-photo-caption,
.vc_figure-caption {
color: #888;
font-style: italic;
font-size: 0.9125em !important;
line-height: 1.2em;
}

.caption {
/*margin-top:-5px!important;*/
}

.videoBox {
margin-bottom: 12.5px;
}

.wpb_video_widget.wpb_content_element.vc_clearfix.vc_video-aspect-ratio-169.vc_video-el-width-100.vc_video-align-left {
margin-bottom: 10px;
}

.category-news p.caption {
margin-bottom: 15px;
line-height: 1.5em;
}

.category-news p.caption span {
color: #888;
}

.category-news .videoBox {
margin-bottom: 10px;
}

.category-news .caption {
margin-top: 0px !important;
}



@media (max-width: 991px) {
.videoBox {
margin-bottom: 20px;
}

.caption {
margin-top: -10px !important;
}
}

.vc_figure-caption {
margin-top: 10px !important;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 95%;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 95%;
}




@media (max-width: 991px) {
.racing-news-float-left-photo {
float: left;
width: 45%;
margin-right: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
}

.racing-news-float-right-photo {
float: right;
width: 45%;
margin-left: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
}

@media (max-width: 550px) {
.racing-news-float-right-photo {
padding-left: 0px !important;
width: 100% !important;
}

.racing-news-float-right-photo {
padding-right: 0px !important;
width: 100% !important;
}

.racing-news-float-right-photo {
width: 100% !important;
}

.racing-news-float-right-photo .wpb_single_image .vc_figure {
width: 100% !important;
}

.racing-news-float-left-photo {
width: 100% !important;
}

.racing-news-float-left-photo .wpb_single_image .vc_figure {
width: 100% !important;
}

.category-news .videoBox {
margin-bottom: 0px;
}
}

/* ============== Float News END  ===================== */

/**** 2018 addition css END*************/




/*==== news group photo caption ===*/
.group-photo-caption {
margin-top: 10px !important;
}

@media (max-width: 767px) {
.group-photo-caption {
margin-top: 0px !important;
}
}

@media (max-width: 767px) {
h1.page-title {
color: #1b3767;
display: block !important;
}
}



@media (max-width: 991px) .raceinfo-icon-m li {
margin-top: 0px;
border-bottom: 1px dotted #ccc;
width: 100%;
display: block;
margin-bottom: 10px !important;
}


@media (max-width: 991px) {
.raceinfo-icon-m li {
margin-top: 0px;
border-bottom: 1px dotted #ccc;
width: 100% !important;
display: block;
margin-bottom: 10px !important;
}

.raceinfo-icon {
float: left;
display: none !important;
}

}

.related-links>h3 {
border-bottom: 2px solid #bbb !important;
font-size: 1em;
}

.key-dates>h3 {
border-bottom: 2px solid #bbb !important;
font-size: 1em;
}


.key-dates li {

border-bottom: 1px dotted #787589 !important;

}

.related-links li {

border-bottom: 1px dotted #787589 !important;
}


#index-content-section {
-moz-box-shadow: inset 0 10px 10px -10px grey;
-webkit-box-shadow: inset 0 10px 10px -10px grey;
box-shadow: inset 0 10px 10px -10px grey;
}



/* 20201207 Sync Old CSS */

@charset "utf-8";

/* CSS Document */
.show-grid [class^="col-"] {
padding-top: 10px;
padding-bottom: 10px;
background-color: rgba(86, 61, 124, 0.15);
border: 1px solid rgba(86, 61, 124, 0.2);
}

.News_Sub_Heading {
color: #666666;
/* font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
font-size: 0.8125em;
line-height: 1.6em;
}

.index-margin {
margin-top: 30px;
}

#headerMenu {
position: fixed;
height: 70px;
display: block;
z-index: 1000;
text-align: center;
color: #000;
padding: 0;
top: 0px;
right: 0px;
}

#headerMenu-logo {
position: absolute;
height: 70px;
display: block;
text-align: center;
color: #000;
padding: 0;
top: 0px;
-webkit-box-shadow: 0px 3px 3px 0px rgba(50, 50, 50, 0.3);
-moz-box-shadow: 0px 3px 3px 0px rgba(50, 50, 50, 0.3);
box-shadow: 0px 3px 3px 0px rgba(50, 50, 50, 0.3);
width: 100%;
}

#fullpage h1 {
font-weight: 300;
/*font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
font-weight: bold;
font-size: 2em;
letter-spacing: 0px;
line-height: 70px;
color: #B9480C;
text-align: left;
}

#fullpage h2 {
font-weight: 300;
/*font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.75);
font-size: 1.8em;
color: #fff;
margin-top: 20px;
line-height: 1.5em;
}

body {
font-size: 16px;
line-height: 1.8em;
background: #eee;
color: #000;
}

h1,
h2,
h3,
h4,
h5,
h6 {
margin: 0;
font-weight: 300;
color: inherit;
}

h1 small,
h2 small,
h3 small,
h4 small,
h5 small,
h6 small {
font-weight: normal;
line-height: 1;
color: #614200;
}

/*
h1 {
color: #60616d;
font-weight: bold;

font-size: 1.5em;
padding-bottom: 10px;
float: left;
}
h2 {
color: #60616d;
font-size: 1.125em;
font-weight: bold;
margin: 10px 0px 5px 0px;
line-height: 1.5em;
}
h3.subtitle {
color: #49000e;


font-size: 1.125em;
font-weight: bold;
margin: 20px 0px 5px 0px;
}
.h2bottomline {
margin: 15px 0;
border-bottom: 1px dotted #3f625f;
}
h3 {
color: #49000e;
font-size: 1em;
line-height: 1.1875em;
font-weight: bold;
margin: 10px 0px 10px 0px;
}
h3.social {
color: #004E9F;
font-size: 1.125em;
line-height: 1.25em;
font-weight: bold;
margin: 8px 0px 10px 0px;
}
h4 {
color: #1abec7;
font-size: 0.9375em;
line-height: 1.6em;
font-weight: bold;
}
h5 {
color: #bf3100;
font-size: 0.875em;
line-height: 1.4em;
font-weight: bold;
margin-bottom: 5px;
}
h6 {
color: #fff;
font-size: 1em;
font-weight: bold;
margin-bottom: 5px;
}
*/

h1 {
font-size: 5.375em;
}

h2 {
font-size: 4em;
}

h3 {
font-size: 3em;
font-weight: 300;
}

h4 {
font-size: 2.25em;
}

h5 {
font-size: 2em;
}

h6 {
font-size: 1.5em;
}

.bold {
font-weight: 700;
}

a {
color: #22305B;
text-decoration: none;
}

a:focus,
a:hover {
color: #22305B;
text-decoration: underline;
}

/* --------------  ghost-button ------------------ */
.ghost-button-full-color {
cursor: pointer;
display: inline-block;
padding: 8px 10px;
color: #6c6c6c;
font-weight: bold;
border: 2px solid #ddc59c;
background-color: #ddc59c;
text-align: center;
outline: none;
text-decoration: none;
border-radius: 8px;
line-height: normal;
font-size: 18px;
margin: 15px 3px;
letter-spacing: 0px;
position: relative;
width: 65% !important;
transition: color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out;
}

.ghost-button-full-color:hover,
.ghost-button-full-color:active {
background-color: #ebd9ba;
border: 2px solid #ebd9ba;
/* border-color: #a5015d; */
color: #6c6c6c;
text-decoration: none;
transition: color 0.3s ease-in, background-color 0.3s ease-in, border-color 0.3s ease-in;
}

.ghost-button-full-color:visited,
.ghost-button-full-color a:visied,
.ghost-button-full-color a:focus {
color: #fff;
text-decoration: none;
}

/* --------------  popup container ------------------ */
#popupDetail {
transform: scale(0.8);
}

.popup_visible #popupDetail {
transform: scale(1);
}

.popContainer {
overflow: auto;
-webkit-overflow-scrolling: touch;
max-width: 1170px;
}

.popContainer p {
font-weight: 300;
/* font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
font-size: 1em;
color: #ffffff;
margin-top: 20px;
/*    max-width: 700px; */
}

.popContain {
/*margin: 0 20px;*/
}

.popContain h1 {
/*font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
display: inline;
font-size: 1.6em;
font-weight: 300;
color: #ffffff;
}

.popContain ul {
color: #ffffff;
margin-top: 10px;
margin-bottom: 10px;
margin-left: 20px;
list-style-type: disc;
}

.overlayContainer {
background: #000000;
max-width: 550px;
}

.contentContainer {
margin: 0;
background: #fff url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/556/1920-content-bg.jpg) repeat-y;
background-size: 100%;
auto;
}

.focuspoint {
height: 100%;
width: 100%;
overflow: hidden;
position: absolute;
top: 0;
}

.shareBtn {
padding: 5px 10px;
}

.shareBtn .fa.fa-share-alt {
font-size: 28px;
text-shadow: none;
}

.jthumb {
width: 30%;
}

.jkThumbGrp a {
display: block;
margin-bottom: 15px;
padding: 0 10px;
color: #B9480C;
}

.jkThumbGrp a img {
width: 100%;
padding: 5px;
}

.btnRgp {
background: rgba(0, 0, 0, 0.5);
font-size: 12px;
position: fixed;
bottom: 0;
width: 100px;
display: block;
text-align: center;
z-index: 99999;
}

.btnRgp a {
color: #666666;
}

#fp-nav ul li,
.fp-slidesNav ul li {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.3);
border-radius: 0px;
height: 16px;
margin: 7px;
width: 14px;
}

body #fp-nav ul li .fp-tooltip {
opacity: 1;
width: auto;
font-size: 12px;
margin-right: -20px;
}

body #fp-nav ul li a span,
.fp-slidesNav ul li a span {
background: rgba(0, 0, 0, 0.0);
}

.socialBlock {
float: left;
width: 28%;
margin: 1%;
}

div.page {
background: #ffffff url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/556/1920-content-bg.jpg) repeat-y bottom right;
background-size: 100%;
}

html.mm-background body .page.mm-page {

background-color: #ffffff;
background-size: 100%;
auto;
}

.indexContainer {
margin: 0;
background-size: 100%;
auto;
}

.container-fluid {
padding-right: 20px;
padding-left: 20px;
*zoom: 0;
padding-top: 20px;
margin-top: 12px;
margin-bottom: 15px;
border-left: 0px solid #000000;
border-right: 0px solid #000000;
}

.containerBackground {
*zoom: 0;
/*    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
background: rgba(255, 255, 255, 0.7) none repeat scroll 0px 0px;  */
padding-right: 30px;
padding-left: 30px;
padding-top: 10px;
padding-bottom: 10px;
min-height: 500px;
}

.content-title-margin {
margin-top: 20px;
margin-bottom: 20px;
}

.heroContainer {
margin: 0;
}

.heroImg {
width: 100%;
margin-top: -35px;
}

.heroImg-insidepage {
width: 100%;
margin-top: -35px;
min-height: 100px;
}

/* EWIN LOGO */
.ewinLogo {
position: relative;
float: right;
width: 170px;
margin-right: 10px;
z-index: 1;
}

.ewin_logo_all {
float: right;
height: 73px;
}

.ewin_logo_if {
top: 20px;
margin-left: 20px;
position: absolute;
bottom: 20px;
right: 20px;
}

.ewin_logo {
float: left;
/* margin-top: -10px;*/
}

.ewin_logo_if .others {
margin-top: -10px;
float: left;
/* margin-left: 3px; */
}

.ewin_logo_if .others div {
height: 12px;
/* margin-left:6px; */
}

.ewin_logo_if .others a {
font-size: 11px;
line-height: 13px;
display: block;
/* margin-left: 2px; */
}

.hkjcLogo {
display: block;
/* margin: 10px 15px 0px;*/
margin: 15px 0 0 0px;
position: absolute;
z-index: 9999;



padding-top: 0px !important;


}

.hkjcLogo img {
width: 100%;
    display: none;
    max-width: 170px;
}

.shortcutMenu {
/*top: 0;
right: 120px;
z-index: 9999;
color: #999;
border-radius: 0px 0px 4px 4px;
position: relative;
float: right;*/
}

.shortcutMenu a {
color: #fff;
margin: 0px 5px;
opacity: 1;
font-weight: 300;
font-size: 0.875em;
line-height: 1em;
}

.shortcutMenu a:hover {
color: #d8a548;
transition: color 0.3s ease-in, background-color 0.3s ease-in;
text-decoration: none;
}

.shortcutMenuHeadbar {
background: none !important;
top: 42px !important;
}

.shortcutMenuHeadbar a:hover {
color: #000 !important;
transition: color 0.3s ease-in, background-color 0.3s ease-in !important;
}

div#nextrace {
background: rgba(110, 75, 45, 0.01) !important;
}

.footer-container {
width: 100%;
margin: 0;
padding: 0 -15px !important;
background-size: 100% auto;
background-repeat: repeat-y;
}

.photo_fullwidth img {
max-width: 100%;
}

/* --------------  RGP style ------------------ */
.rgp-container {
color: #ffffff;
font-size: 1em;
text-align: left;
}

a.rgp-text {
color: #ffffff;
font-size: 1.2em;
}

a.rgp-text:hover {
color: #ffd503;
text-decoration: none;
}

.rgp-container ul li {
color: #ffffff;
font-size: 0.9em;
list-style: disc;
}

.footer-margintop {
bottom: -100px;
}

.container .footer-projectlist ul li {
list-style: none;
}

.360-view {
display: none;
}

.mobile-view {
display: none;
}

/* --------------  panel-default style ------------------ */
.panel-title {
margin-top: 0px;
margin-bottom: 0px;
font-size: 16px;
color: inherit;
}

.panel-title a {
text-decoration: none;
}

.panel-default {
border-color: #ddd;
}

.panel-default>.panel-heading {
color: #ffffff;
background-color: #1abec7;
border-color: #ddd;
}

.panel-default>.panel-heading a:hover {
color: #ff0420;
}

.panel-default>.panel-heading a {
color: #ffffff;
}

.panel-default>.panel-heading+.panel-collapse>.panel-body {
border-top-color: #ddd;
}

.panel-default>.panel-heading .badge {
color: #f5f5f5;
background-color: #333;
}

.panel-default>.panel-footer+.panel-collapse>.panel-body {
border-bottom-color: #ddd;
}

/* --------------  hr style ------------------ */
hr {
margin-top: 10px;
margin-bottom: 10px;
border-right: 0px none;
border-width: 1px 0px 0px;
border-style: solid none none;
border-color: #DEDEDE;
-moz-border-top-colors: none;
-moz-border-right-colors: none;
-moz-border-bottom-colors: none;
-moz-border-left-colors: none;
border-image: none;
}

hr.header-line {
margin-top: 5px;
}

/* --------------  caption style ------------------ */
.caption {
font-size: 0.8125em;
color: #5a5a5a;
line-height: 1.5em;
}

/* =========== what's next ============== */
.next-photo {
border-left: 8px solid #ec8bb9;
padding-right: 10px;
}

table.next {
width: 100%;
}

h2.next {
color: #383838;
font-size: 1.1em;
line-height: 1.4em;
font-weight: bold;
margin: 10px 0px 10px 0px;
/* text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.85); */
}

a.next-txt {
/*color: #999999;*/
color: #22305B;
line-height: 1.25em;
/*  font-weight:bold; */
margin: 10px 0px 10px 0px;
/* text-decoration: underline;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.85); */
}

a:hover.next-txt {
/*color: #999999;*/
color: #22305B;
line-height: 1.25em;
/* font-weight:bold; */
margin: 10px 0px 10px 0px;
text-decoration: underline;
/* text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.85); */
}

h1.lastest {
color: #ffffff;
font-weight: 400;
/* font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
font-size: 1.5em;
padding: 10px;
margin-top: 15px;
border-left: #ff0000 solid 6px;
float: left;
}

.social-button {
/*  bottom: 0%; position: absolute; text-align: right;*/
display: block;
margin-top: 0px;
margin-right: 15px;
z-index: 9999;
/* position:absolute; */
bottom: 0;
right: 0;





}

/* ========== 2nd level ========== */
.droplist {
float: right;
}

.bcLv1 {
color: #333333;
border-bottom: 1px solid #b6b6b6;
margin: 5px 0px;
font-size: 0.9375em;
min-height: 40px;
}

.content-bg {
margin-top: 20px;
/*margin-top:40px;*/
/*padding: 10px;*/
/* background: rgba(255, 255, 255, 1) none repeat scroll 0px 0px;*/
}

/* ========== race submenu ========== */
.race-submenu {
font-size: 0.9375em;
line-height: 2em;
/*background-position: right center;
background-color: #696263;*/
color: #333333;
padding: 0px;

margin-bottom: 10px;
}

.race-submenu a {
color: #333333;
padding: 7px;
}

.race-submenu a:hover {
text-decoration: none;
color: #ffffff;
background-color: #cc0000;
}

.race-submenu>.active,
.race-submenu>.active {
padding: 5px;
text-decoration: none;
color: #ffffff;
background-color: #cc0000;
}

/* ========== index feature ========== */
.feature-date {
font-size: 0.8125em;
color: #5a5a5a;
padding-left: 15px;
}

.feature-index-more {
font-size: 0.875em;
line-height: 1.25em;
color: #b9480c;
}

h3.feature {
color: #003366;
font-size: 1em;
line-height: 1.2em;
margin: 0px;
padding-left: 10px;
border-left: #ff0000 solid 6px;
/* font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
padding-top: 10px;
font-weight: bold;
}

h3.feature-title {
color: #003366;
font-size: 1em;
line-height: 1.2em;
margin: 0px;
padding-left: 10px;
border-left: #ff0000 solid 6px;
/*font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
padding-top: 5px;
font-weight: 400;
}

.feature-box {
position: relative;
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
background: rgba(255, 255, 255, 0.8) none repeat scroll 0px 0px;
padding: 0px;
}

.feature-box a:hover {
color: #003366;
text-decoration: none;
}

.feature-text {
color: #333333;
font-size: 0.9375em;
line-height: 1.2em;
text-align: left;
padding: 5px 15px 5px 0px;
}

.feature-news-box {
background-color: #cccccc;
height: 240px;
margin-bottom: 20px;
}

/* ========== social share & fontChange ========== */
.socialutility {
float: right;
}

.iconsContainer * {
/*float: right;*/
margin-top: 3px;
}

@media all and (max-width: 480px) {
.iconsContainer * {
margin-top: 10px;
}

.social-float {
float: left;
}
}

.social-float {
float: right;
}

/* fontChange */
body #fontSizeSelecter {
background: none;
}

#fontSizeSelecter a {
color: #999999 !important;
}

#fontSizeSelecter a:hover {
color: #3b3b3b !important;
;
background: none !important;
transition: .25s ease-out;
border-radius: 4px 4px 4px 4px;
}

#fontSizeSelecter a.active {
background: #949494 !important;
border-radius: 4px 4px 4px 4px;
}

#fontSizeSelecter span {
color: #333333 !important;
}

/* race */
.race-hightlight1 {
display: inline-block;
padding: 2px 30px;
width: 100%;
color: #FFF;
font-weight: bold;
font-size: 1.2em;
line-height: 1.3em;
background-color: #777777;
/* background-color:#1b3767; gold version*/
outline: medium none;
text-decoration: none;
border-radius: 7px;
margin: 0px;
letter-spacing: 0px;
position: relative;
transition: color 0.3s ease-out 0s, background-color 0.3s ease-out 0s, border-color 0.3s ease-out 0s;
/*font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
padding: 5px;
}

.race-hightlight2 {
display: inline-block;
padding: 2px 30px;
width: 100%;
color: #ffffff;
font-weight: bold;
font-size: 1.2em;
line-height: 1.3em;
background-color: #777777;
/* background-color:#1b3767; gold version*/
outline: medium none;
text-decoration: none;
border-radius: 7px;
margin: 0px;
letter-spacing: 0px;
position: relative;
transition: color 0.3s ease-out 0s, background-color 0.3s ease-out 0s, border-color 0.3s ease-out 0s;
/*font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
padding: 5px;
}

.race-icon {
width: 30px !important;
margin-right: 10px;
margin-left: 10px;
}

table.pastwinnerlist td {
color: #666;
border-bottom: 1px solid #666;
padding: 7px 3px;
}

table.pastwinnerlist th {
color: #666;
border-bottom: 2px solid #666;
padding: 7px 3px;
}

.racedata {
width: 100%;
}

/* ============ 2016 hkis sale information ============== */
.top-submenu {
font-size: 1em;
line-height: 2em;
color: #333333;
padding: 2px 2px;
margin-bottom: 20px;
border: 1px #E5E5E5 solid;
/* border-radius: 30px;
background-color: #E5E5E5; */
background-color: #f2f2f2;
}

.top-submenu a {
margin: 5px 0px;
padding: 0px 10px;
white-space: nowrap;
border-right: 1px #b8b8b8 solid;
}

.top-submenu a:last-child {
border-right: 0px #b8b8b8 solid;
}
.top-submenu a:hover {
color: #35A6DE;
text-decoration: none;
/* background-color: #555555; */
/* background-color: #1b3767;
}

.popup-txt {
color: #ffffff;
/*font-family: 'open sans', 'arial', "Meiryo", "Meiryo UI", "Microsoft JhengHei UI", "Microsoft JhengHei", "微軟正黑體";*/
font-size: 16px;
line-height: 1.8em;
margin-bottom: 20px;
}

h1.popup-header {
color: #ffffff;
float: none;
}

h2.popup-subheader {
color: #ffffff;
}

.race-hightlight {
/*cursor: pointer; */
display: inline-block;
padding: 5px 30px;
width: 100%;
color: #fff;
font-weight: bold;
font-size: 1.2em;
line-height: 1.3em;

background-color: #6c6c6c;
outline: none;
text-decoration: none;
border-radius: 7px;
margin: 0 0px;
letter-spacing: 0px;
position: relative;
transition: color 0.3s ease-out, background-color 0.3s ease-out, border-color 0.3s ease-out;
}

.sale-box {
background-color: #ffffff;
border: 1px solid #eeeeee;
min-height: 190px;
padding: 5px;
}

/* ============ 2016 hkis purchaser information ============== */
.features-table01 ul,
li {
margin: 0px;
padding: 0px;
list-style: outside none none;
}

ul.checklist li {
line-height: 1.25em;
margin: 0px 5px 10px;
list-style: outside square;
}

.terms-list ol li {
list-style: outside lower-alpha;
}

.date-list ol li {
list-style: outside none none;
margin-left: -40px;
}

.dateTable {
width: 100%;
}

.dateTable tr {
border: solid 1px #dedede;
}

.dateTable td {
font-size: 0.9375em;
line-height: 1.5em;
vertical-align: middle;
padding: 3px;
border: solid 1px #dedede;
text-align: center;
}

.dateTable th {
font-size: 0.9375em;
line-height: 1.0625em;
color: #ffffff;
background-color: #6c6c6c;
border: solid 1px #dedede;
padding: 8px;
text-align: center;
}

/* ============ 2016 hkis past result ============== */
.hkisTable {
width: 100%;
}

.hkisTable tr {
border: solid 1px #dedede;
}

.hkisTable td {
font-size: 0.8125em;
/*  vertical-align: top; */
padding: 3px;
border: solid 1px #dedede;
text-align: center;
}

.hkisTable.recentWinners td {
line-height: 20px;
padding: 6px 5px;
}

.hkisTable th {
font-size: 0.8125em;
line-height: 1.125em;
color: #ffffff;
background-color: #777777;
padding: 8px;
text-align: center;
}

.hkisTable ul.thumbnails {
padding: 0;
}

.pastSelect {
margin-top: 15px;
}

@media (max-width: 550px) {
.pastSelect {
float: none;
}
}

/* ============ 2016 hkis hall of fame ============== */
li.hall-photo {
list-style: outside none none;
}

/* ============ 2016 hkis breeze up ============== */
.rightbox-all {
width: 100%;
border: 0px solid #C0C0C0;
}

.rightbox {
border-bottom: 0px dotted #CCC;
margin-bottom: 5px;
margin-top: 5px;
padding: 5px;
}

.rightbox ul {
padding: 0px;
margin-left: 5px;
}

.rightbox ul li {
font-size: 15px;
list-style: outside none none;
}

.videolink {
cursor: pointer;
}

/* ============ 2016 hkis lotsTable ============== */
.lotsTable {
background-color: #FFF;
width: 100%;
}

.lotsTable th {
color: #FFF;
font-size: 1em;
/*font-weight: bold;*/
padding: 10px 5px;
text-align: center;
background-color: #6c6c6c;
}

.lotsTable td {
color: #333;
font-size: 0.875em;
border-bottom: 1px dotted #95969A;
text-align: center;
}

.alttable {
font-size: 0.875em;
line-height: 1.3em;
}

/* ============ 2016 hkis webcast ============== */
.live-rightbox {
width: 100%;
border: 1px solid #C0C0C0;
}

.live-rightbox {
padding: 5px;
}

.live-rightbox ul {
padding: 0px;
margin-left: 5px;
}

.live-rightbox ul li {
font-size: 15px;
list-style: outside none none;
line-height: 20px;
}

.lots-no {
color: #ffffff;
background-color: #717171;
padding: 3px;
font-weight: bold;
margin: 0px;
}

.live-info {
color: #333;
font-size: 0.875em;
line-height: 18px;
margin: 3px;
}

table.live-info td {
vertical-align: top;
}

.pedigee {
font-size: 0.625em;
line-height: 1.25em;
}

/* ============ 2016 hkis contact us ============== */
table.contactDetail {
font-size: 0.875em;
border-collapse: collapse;
line-height: 1.6em;
padding: 5px;
}

table.contactDetail th {
background-color: #6c6c6c;
color: #FFF;
font-weight: bold;
padding: 5px;
text-align: left;
font-size: 0.8125em;
}

table.contactDetail td {
vertical-align: top;
padding: 0px 5px;
}

/* ============ Page top bg color ============== */
.pageHeader {
/*  background:#00011c;
background: #123e69; */
}

.pageTop {
background: #333;
}

/** Style for DIM menu **/
.nav>li>span {
padding: 5px 12px;
line-height: 19px;
color: #cbcbcb;
font-size: 0.875em;
font-weight: 300;
}

.dropdown-menu>li>span {
clear: both;
color: #cbcbcb;
display: block;
font-weight: 400;
line-height: 1.42857;
padding: 3px 20px;
margin: 0 5px;
font-size: 0.875em;
}

/* =========== sale infomation inspection time ===========*/
.inspection-time {
padding-top: 20%;
}

.inspection-time-2 {
padding-top: 12%;
}

@media (max-width: 767px) {
.inspection-time {
padding-top: 0;
}

.inspection-time-2 {
padding-top: 0;
}
}

/* =========== purchaser button ===========*/
img.purchaser-btn {
width: 160px;
}

@media (max-width: 550px) {
img.purchaser-btn {
width: 130px;
}
}

.Section {
display: none;
}

@media (max-width: 991px) {
.Section {
display: block;
}
}

.withdrawn-red-video {
color: red;
font-size: 11px;
}

.withdrawn-red {
color: red;
}



/********** Additional 2020  START  ******************/

.dropdown-menu {
overflow-y: hidden;
min-width: 350px;
}

ul.dropdown-menu {
background: #fff !important;
}

.current_page_item {
background: #333333 !important;
}


/*
.dropdown-menu>.active>a {
background: #8b8b99!important;
color:#222;
}*/

.navbar .dropdown-menu>li>a {
color: #222;
background: #fff;
}

.navbar .dropdown-menu>li>a:hover {
color: #222;
background-color: #E5E5E5;
transition: color 0.3s ease-in, background-color 0.3s ease-in;
}

.hall-photo .thumbnail a>img {
min-width: 125px;
}

/**** past-results-2020jul Start  *****/
.highlight-icon {
float: left;
width: 30px !important;
margin-right: 10px;
vertical-align: middle;
}


.race-hightlight2 {
padding: 10px 0px 10px 0px;
}

.highlight-info {
padding-top: 3px;
margin: 0px;
}

.highlight-h1 {
/* margin-top: -70px;
position: absolute;*/
}

.sr-mg {
margin-bottom: 0px;
margin-top: 20px !important;
text-align: right;
}

.responsive-table-container table th {
text-align: center;
}

.responsive-table-container table th {
color: #fff;
background: #777777;
}


table tbody tr {
background: none;
}

table tbody tr:nth-child(even) {
background: none;
}

table tbody tr:nth-child(odd) {
background: none;
}

.site-content {}

.subpage-top-container {
/* background: #f2f1f7;*/
/* height: 0px;*/
}

.am-table {
font-size: 1em;
white-space: normal;
}

#fontSizeSelecter a.active {
color: #fff !important;
}

/**** past-results-2020jul End *****/



/**** Past ISG Bonus Recipients  Start  *****/

.hkisTable .thumbnail {
margin-bottom: 0px;
background-color: transparent;
background-color: rgba(255, 255, 255, 0);
border: 0px solid #ddd;
padding: 4px 4px 0px 4px;
}

table thead tr {
background-color: transparent;
}



/*#cboxContent #cboxCurrent {
bottom: 30px;
}*/

/**** Past ISG Bonus Recipients  End *****/


@media (max-width: 1023px) {
.am-table {
white-space: nowrap;
}
}



@media (max-width: 767px) {
.sr-mg {
margin-top: 0px !important;
text-align: left;
}

.highlight-h1 {
margin-top: 0px;
position: inherit;
}

h1.page-title {
/*display: none!important;*/
}

#socialutility {
float: left !important;
margin: 0px 0px;
}


}


/********** Additional 2020  END  ******************/


/* Start - Replace icon width images png */
html:lang(zh-TW).fa-home {
/* height: 15px; */
}

.fa-home:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-home.png');
position: relative;
top: -2px;
}

.fa-facebook-official:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-index-facebook.png');
}

.fa-twitter-square:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/737/icon-index-x.png.png');
}

.fa-weibo:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-index-sina.png');
}

.fa-wechat:before,
.fa-weixin:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-index-wechat.png');
}

.fa-youtube:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-index-youtube.png');
}


.fa-arrow-circle-up:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-back-to-top.png');
}



.fa-external-link-square:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-rgp.png') !important;
}


.fa-play-circle:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-play-btn.png') !important;
}

.highlightVideo .fa-play-circle:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-contender-play-btn.png') !important;
}

.fa-caret-right:before {
content: url('') !important;
width: 0;
height: 0;
display: inline-block;
vertical-align: middle;
border: 4px solid transparent;
border-left-color: #122a68;
margin-top: -5px;
}

.fa-info-circle:before {
content: url('//res.hkjc.com/campaigns/wp-content/uploads/sites/404/icon-contender-info.png') !important;
}

/* End - Replace icon width images png */

.ultsl-arrow-left4:before {
margin-left: 10px;
}


@media (max-width: 1024px) {
.ultsl-arrow-left4:before {
margin-left: 12px;
}
}

@media (max-width: 991px) {
.ultsl-arrow-left4:before {
margin-left: 14px;
}

.ultsl-arrow-right4:before {
margin-left: -5px;
}

.nav>li>a {
position: relative;
display: block;
padding: 10px 10px;
}

}

@media (max-width: 767px) {
button.btn.btn-default.btn-sm.dropdown-toggle {
margin-top: 10px;
}
}

@media (max-width: 550px) {
.pageHeader {
min-height: 75px;
}
}

.highlight-h1 {
display: none !important;
}

#pastSelectDropdown {
width: 280px;
}


.site-main {
margin-top: 0px !important;
}

h1.page-title {
/* display: none!important; */
margin-bottom: 30px;
}

.navbar .menu-item.active ul li a {

/* color: #ffffff !important; */
color: #222 !important;
}

.navbar .menu-item.active ul li a:hover {
/* color: #ffffff !important; */
color: #222 !important;
}

.navbar .menu-item.active ul li.active {
/* color: #ffffff !important; */
color: #222 !important;
background-color: #E5E5E5;
}


.navbar .menu-item.active ul li a.active {
/* color: #ffffff !important; */
color: #222 !important;
background-color: #E5E5E5;
}


span.vc_icon_element-icon.fas.fa-bullhorn.notice-icon {
font-size: 2em;
color: #1b3767 !important;
}

.notice-text {
color: #1b3767 !important;
font-size: 16px;
line-height: 1.4em;
}

#index-notice.vc_row-has-fill>.vc_column_container>.vc_column-inner {
padding-top: 0px !important;
}

#index-notice {
margin-top: 15px;
}



.ubtn-ctn-center.btn-index {
margin-bottom: 25px !important;
}

.notify-content {
text-align: center;
font-size: 24px;
line-height: 1.4em;
color: #ffffff;
}

.notify-content a {
color: #ffffff;
  }
  .notify-content a:hover {
    color: #ebebeb;
    text-decoration: none;
}

.live-red {
color: #ef0000 !important
}

.live-watch-btn {
margin-top: 10px;
}


/************ addition Css 02-jun 2021 Start ****************/

@media (max-width: 991px) {
.dropdown-menu>li>a {
padding: 0px 20px 5px 20px;
line-height: 1.2;
}

.lotsIndex-table td {
min-height: 29px;
}
}

/************ addition Css 02-jun 2021 End ****************/

.widthdraw-horse-color {
color: red !important;
}

#menuIcon {
z-index: 1079;
}

#mmenu {

z-index: 999 !important;
}

.video_close {
height: 65px;
}

@media (max-width: 768px) {
#menuIcon {
z-index: 1;
}
}


.topMainvisual {
background: #1b3767;
}



/************  2022 Apr HKIS Start ****************/

h2 {
color: #22305B;
font-weight: 300;
font-size: 2.25em;
}



.footerSection {
background: #22305B;
/* background: linear-gradient(25deg, #141f48 70%, #0e3679 100%); */
position: relative;
}

.caret {
border-right: 3px solid transparent;
border-left: 3px solid transparent;
}

.pageTopMenu,
.navbar,
.navbar-default {
background-color: #22305B;
}

.pageTopMenu .container {
width: 100%;
padding: 0 60px;
}

.navbar .menu-item,
.navbar-nav>li>.dropdown-menu {
background: transparent;
}

.topMainvisual {
background: #0e0f23 url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/556/kv-top-bg.jpg) top center repeat;
background-size: cover;
}

.pageHeader {
/* background-image: linear-gradient(#1b3767 23.85%, #0e203f 91.39%); */
background-color: #22305B;
background-image: none;
}



.slick-next::before {
content: url('https://res.hkjc.com/campaigns/wp-content/uploads/sites/556/btn-arrow-right.png') !important;
}

.slick-prev::before {
content: url('https://res.hkjc.com/campaigns/wp-content/uploads/sites/556/btn-arrow-left.png') !important;
}

#horse-detail-slider .slick-prev:before,
#horse-detail-slider .slick-next:before {
font-size: 40px;
}


#horse-detail-slider .slick-prev,
#horse-detail-slider .slick-next {
height: 40px;
}

.slick-next:before,
.slick-prev:before {
font-size: 40px !important;
}

.slick-next,
.slick-prev {
height: 40px !important;
}

#mmenu {
background-color: #242f5c;
}

#mmenu #menu-main-menu>.menu-item {
background: #35a1d9;
}


.navbar li ul li.menu-item.active a,
.navbar li ul li.menu-item.active a:hover {
color: #222 !important;
}

.current_page_item {
background: #242f5c !important;
}

#mmenu .menu-item .active.current-menu-item {
background: #242f5c;
}

#mmenu .menu-item:hover {
background: #1e4382;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus,
.navbar .navbar-nav>li.current-menu-item>a,
.navbar .navbar-nav .current-menu-item>li>span,
.navbar .navbar-nav>li>a:hover,
.navbar .navbar-nav>li>a:focus {
background: #22305B;
border-bottom: #ffffff solid 1px !important;
}

.race-icon {
background: transparent;
}


#horse-detail-slider .slick-prev,
#horse-detail-slider .slick-next {
top: 300px;
}

#horse-detail-popup-container {
min-height: 600px;
}


/****** ISG Start *************/
.isg-container {
display: flex;
justify-content: space-between;
margin: 0px auto;
max-width: 100%;
background: #fff;
box-shadow: 0 0 10px #888;
margin-bottom: 20px !important;
}

.isg-container-800width {
margin: 0px auto;
max-width: 100%;
}


.isg-container-800width .vc_column_container>.vc_column-inner {
padding-left: 8px;
}

.isg-1 {
width: 40%;
position: relative;
}

.isg-2 {
width: 60%;
/*padding: 20px;
padding-top:50px;*/
display: flex;
}

.isg-2 h1 {
font-size: 1.5em;
color: #022169;
display: block;
float: none;
margin-bottom: 15px;
margin-top: 15px;
text-transform: uppercase;
}


.isg-2 span.title {
color: #022169;
font-weight: 300;
}

.isg-2 p {
margin: 0 0 5px;
}

.isg-horse-img {
width: 100%
}

.arrow-down-lightblue {
width: 0px;
height: 0px;
border-left: 20px solid transparent;
border-right: 20px solid transparent;
border-top: 20px solid #45aadb;
margin: auto;
}

.arrow-down-deepblue {
width: 0px;
height: 0px;
border-left: 20px solid transparent;
border-right: 20px solid transparent;
border-top: 20px solid #294069;
margin: auto;
}

.arrows-row {
padding: 15px;
}


.isg-horse-year-desktop,
.isg-horse-year-mobile {
position: absolute;
top: 0;
width: 100%;
}

.isg-horse-year-mobile {
display: none;
}

.isg-hrsinfo {
display: flex;
flex-direction: column;
/*align-items: center;*/
justify-content: center;
margin-left: 20px;
margin-right: 20px;
position: relative;
width: 100%;
}

.isg-hrsinfo span.break {
display: block;
}


#horse-detail_wrapper .popContainer {
overflow-x: hidden;
}




@media (max-width: 767px) {
.isg-container {
display: block;
}

.isg-1 {
width: 100%;
}

.isg-2 {
width: 100%;
padding: 15px 5px 15px 25px;
}



.deepblue-line {
border-top: 3px solid #294069;
}

.lightblue-line {
border-top: 3px solid #369bcf;
}

.isg-horse-year-desktop {
display: none;
}

.isg-horse-year-mobile {
display: block;
}
}

/****** ISG End *************/

/****** race highlight Start ************/

.race-hightlight1,
.race-hightlight2 {
background-color: #22305B;
background: linear-gradient(135deg, #22305B 70%, #22305B 100%);
}


.racedata td {
padding: 0em !important;
}


/****** race highlight End ************/


/******** test top Header animation bg Start ******************/

.topMainvisual:before {
width: 100%;
height: 100%;
content: "";
position: absolute;
z-index: 0;
/* background: linear-gradient(291deg, rgba(79, 215, 254, 0.5) 0%, rgba(23, 96, 252, 0) 20%, rgba(79, 215, 254, 0.8) 80%);
background: linear-gradient(291deg, rgba(79, 215, 254, 0.5), rgba(23, 96, 252, 0) );
background-size: 100% 100%;*/
background: linear-gradient(291deg, rgba(79, 215, 254, 0.3) 0%, rgba(47, 70, 118, 0) 20%, rgba(79, 215, 254, 0.5) 80%, rgba(47, 70, 118, 0) 100%);
background-size: 400% 400%;

-webkit-animation: AnimationName 30s ease infinite;
-moz-animation: AnimationName 30s ease infinite;
animation: AnimationName 30s ease infinite;
}



@-webkit-keyframes AnimationName {
0% {
background-position: 0% 10%
}

50% {
background-position: 100% 91%
}

100% {
background-position: 0% 10%
}
}

@-moz-keyframes AnimationName {
0% {
background-position: 0% 10%
}

50% {
background-position: 100% 91%
}

100% {
background-position: 0% 10%
}
}

@keyframes AnimationName {
0% {
background-position: 0% 10%
}

50% {
background-position: 100% 91%
}

100% {
background-position: 0% 10%
}
}


.site-content {
position: relative;
}


/******** test top Header animation bg End ******************/



/************* index of lots Start ****************/

.lot-detail span.title {
white-space: nowrap;
}

/************* index of lots End ****************/

/************  2022 Apr HKIS End ****************/


/** Notice Popup**/
.sn-overlay {
position: fixed;
top: 0;
left: 0;
z-index: 9999999;
background-color: rgba(0, 0, 0, 0.5);
width: 100%;
height: 100vh;
}

.sn-overlay.close {
display: none;
}

.sn-overlay__context {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
width: 95%;
max-width: 765px;
}

.hkis-entry-overlay-layout {
max-width: 765px;
width: 100%;
margin: 0 auto;
height: auto;
background: linear-gradient(62deg, #22305B 50%, #222e5a 100%);
border-radius: 10px;

box-shadow: 0px 0px 10px 0px rgb(250 250 250 / 50%);
-webkit-box-shadow: 0px 0px 10px 0px rgb(250 250 250 / 50%);
-moz-box-shadow: 0px 0px 10px 0px rgba(250, 250, 250, 0.5);
}

.hkis-entry-overlay-layout-left {
display: inline-block;
width: 50%;
max-width: 407px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 10px 0px 0px 10px;
z-index: 1;
position: relative;
}

.hkis-entry-overlay-layout-right {
display: inline-block;
float: right;
text-align: center;
width: 50%;
max-width: 358px;
box-sizing: border-box;
padding: 50px 30px 50px 0px;
padding-left: 0px;
border-radius: 0px 10px 10px 0px;
}


.hkis-entry-overlay-layout-left img {
border-radius: 10px 0px 0px 10px;
width: 100%;
}

.hkis-entry-overlay-logo {
width: 100%;
max-width: 330px;
}

.hkis-entry-overlay-layout h2 {
color: #addef7;
padding: 25px 0px 10px 0px;
font-size: 1.4em;
line-height: 1.3;
}

.hkis-entry-overlay-layout h2 span {
color: #addef7;
}

.sub-h2 {
font-size: 0.65em;
}

html:lang(zh-TW) .sub-h2 {
font-size: 0.85em;
display: block;
}

.sn-overlay__close-btn {
text-decoration: none;
background-color: #35a2db;
color: #fff;
padding: 10px 20px;
display: inline-block;
border-radius: 40px;
border: 0px;
font-size: 1em;
}

.hkis-entry-overlay-layout-button {
display: inline-block;
width: 100%;
/*margin-top: 20px;*/
}

.hkis-entry-overlay-layout-button a {
text-decoration: none;
background-color: #35a2db;
color: #fff;
padding: 10px 20px;
display: inline-block;
border-radius: 40px;
border: 0px;
font-size: 1em;
line-height: 1.3;
}


.hkis-entry-overlay-layout-button a:hover {
opacity: 0.8;
}

.visible-mobile {
display: none;
}

.btn-small {
display: block;
font-size: 0.85em;
color: #fff;
}

@media screen and (max-width: 767px) {
.subpageHeader .hkjcLogo {
max-width: 250px;
}

.hkis-entry-overlay-layout {
max-width: 95% !important;
}

.visible-desktop {
display: none;
}

.visible-mobile {
display: block;
}

.sub-h2 {
display: block;
}

.hkis-entry-overlay-layout h2 {
padding: 25px 0px 5px 0px;
font-size: 1.6em;
}

.hkis-entry-overlay-layout-left {
width: 100%;
max-width: 100%;
float: none;
border-radius: 10px 10px 0px 0px;
min-height: 160px;
}

.hkis-entry-overlay-layout-left img {
border-radius: 10px 10px 0px 0px;
}


.hkis-entry-overlay-layout {
  background: linear-gradient(235deg, #22305B 50%, #222e5a 100%);
}

.hkis-entry-overlay-layout-right {
width: 100%;
max-width: 100%;
float: none;
border-radius: 0px 0px 10px 10px;
min-height: 200px;
padding: 30px;
margin-top: -10px;

}
}


/*2023 new css*/
.single-post .content-header h1.page-title {
width: fit-content;
}

#content>.container,
.content-header>.container {
width: 100%;
background-color: transparent;
padding: 0 15px;
/* max-width: 2560px; */
max-width: 1350px;
}

h1.page-title {
color: #022169;
font-weight: 300;
margin-top: 0px;
margin-bottom: 30px;
border-bottom: 1px solid #022169;
width: fit-content;
padding-bottom: 10px;
font-size: 3em;
}

h2 {
margin-bottom: 30px !important;
margin-top: 30px !important;
}

.nav .navHome a {
/* padding-bottom: 7px !important; */
}

.pageHeader .topvisual img {
margin-left: auto;
width: auto;
margin-right: auto;
}

.col-6 {
width: 50%;
}

.mb-30 {
margin-bottom: 30px !important;
}

.mobile-on {
display: none;
}

.content-img {
display: flex;
justify-content: center;
}

.wpb_raw_html {
margin-bottom: 0px;
}

#content .subpage-top-container .container {
width: 100%;
padding: 30px 60px 0px 60px;
}

#fontSizeSelecter {
margin: 0px 0px 0px 15px;
}

#page {}

.site-content {
background-color: #ffffff;
}


.pageHeader .container {
width: 100%;
padding: 0 60px;
}

.btn-blue-line {
display: flex;
flex-direction: row;
align-items: center;
padding: 10px 15px;
gap: 15px;
width: fit-content;
font-size: 20px;
line-height: 20px;
/* background: #ffffff; */
border-radius: 30px;
border: #022169 solid 1px;
color: #022169;
margin-bottom: 10px;
-webkit-transition: color .2s ease, background-color .3s ease;
-moz-transition: color .2s ease, background-color .3s ease;
-ms-transition: color .2s ease, background-color .3s ease;
transition: color .2s ease, background-color .3s ease;
text-decoration: none;
}

.btn-blue-line:hover,
.btn-blue-line:focus {
background: #022169;
color: #ffffff;
text-decoration: none;
}

.btn-white-line {
font-size: 18px;
line-height: 1.1;
background: none;
border: #ffffff solid 1px;
color: #ffffff;
padding: 10px 30px;
}

.btn-white-line:hover,
.btn-white-line:focus {
background: #ffffff;
color: #022169;
}
.lots-info-col .btn-blue-line-small {
margin-bottom: 0px;
}
.btn-blue-line-small {
display: flex;
flex-direction: row;
align-items: center;
padding: 10px 30px;
gap: 15px;
width: fit-content;
font-size: 18px;
line-height: 1.1;
/* background: #ffffff; */
border-radius: 30px;
border: #022169 solid 1px;
color: #022169;
margin-bottom: 10px;
-webkit-transition: color .2s ease, background-color .3s ease;
-moz-transition: color .2s ease, background-color .3s ease;
-ms-transition: color .2s ease, background-color .3s ease;
transition: color .2s ease, background-color .3s ease;
text-decoration: none;
}

.btn-blue-line-small:hover{
background: #022169;
color: #ffffff;
text-decoration: none;
}
.btn-blue-line-small:focus {
background: #ffffff;
color: #022169;
text-decoration: none;
}
.btn-deep-blue-line-small {
border: #022169 solid 1px;
color: #022169;
}

.btn-deep-blue-line-small:hover,
.btn-deep-blue-line-small:focus {
background: #022169;
}



.sub-section {
padding: 60px 60px 60px 60px;
}

.hkis-section {
max-width: 1350px;
/* padding: 0px 60px 60px 60px; */
padding: 0px 15px 60px 15px;
margin-left: auto;
margin-right: auto;
}
.content-section {
max-width: 1350px;
padding: 0px 15px 60px 15px;
display: flex;
align-items: center;
gap: 30px;
padding-top: 30px;
margin-left: auto;
margin-right: auto;
}

.content-top-section {
display: flex;
align-items: flex-start;
gap: 0px;
padding-top: 30px;
flex-direction: column;
}

.swiper-section {
padding: 0px 0px 30px 15px;
}

.first-section {
padding-top: 90px;
}

.gray-bg-color {
padding-top: 30px;
background: #F2F2F2;
}

.hall-container {}

.date-container {
display: flex;
margin-top: 30px;
gap: 30px;
flex-wrap: wrap;
}

.date-container .btn-blue-line {
font-size: 24px;
line-height: 24px;
padding: 15px 30px;
margin-bottom: 0px;
}

.hkis-section h3 {
color: #022169;
font-weight: 300;
margin-top: 0px;
margin-bottom: 15px;
border-bottom: 1px solid #022169;
width: fit-content;
padding-bottom: 10px;
}

.phase-2 {
display: flex;
gap: 60px;
}

.hkis-logo {}

.phase-2 h3 {
color: #000000;
font-weight: 300;
margin-top: 0px;
margin-bottom: 15px;
border-bottom: 0px solid #022169;
width: fit-content;
padding-bottom: 0px;
}

.phase-2 h2 {
color: #022169;
font-weight: 700;
font-size: 4em;
margin-top: 0px !important;
}

/*swiper*/
.swiper {
width: 100%;
height: 100%;
padding-right: 90px !important;
padding-bottom: 60px !important;
}

.swiper-slide {
text-align: center;
/* Center slide text vertically */
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: flex-start;
}

.swiper-slide img {}

.swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: 0px;
}

.swiper-pagination-bullet-active {
background-color: rgba(34, 48, 91, 1) !important;
}

.m-slider__item:nth-child(2n) {
margin-top: 60px;
}

.m-slider__item:nth-child(3n) {}

/*m-card*/
.m-slider {
width: 500px !important;
}

.m-slider .m-slider__item {}

.m-card {
display: flex;
flex-direction: column;
padding: 0px;
width: 100%;
border-radius: 10px;
background-color: #F2F2F2;
/* box-shadow: 0 0 6px rgba(0, 0, 0, .1); */
transition-duration: 0.3s;
transition-property: box-shadow;
position: relative;

}

.m-card .m-card__header {
padding-top: 56.25%;
height: 0;
background-position: center;
background-size: cover;
border-radius: 10px 10px 0px 0px;
}

.m-card .m-card__body {
padding: 30px;
text-align: left;
}

.m-card__body h4 {
color: #022169;
font-weight: 300;
margin-top: 0px;
margin-bottom: 15px;
border-bottom: 1px solid #022169;
width: fit-content;
padding-bottom: 10px;
}

.m-card__body h5 {
color: #022169;
font-weight: 300;

}

.m-card__body h6 {
color: #000000;
font-weight: 300;
margin-top: 0px;
margin-bottom: 15px;
}

.m-card__body p {
margin-bottom: 15px;
}
.m-card:after {
content: "";
position: absolute;
width: 90px;
height: 180px;
display: flex;
right: -45px;
bottom: 0px;
background-size: contain;
background-repeat: no-repeat;
background-position: bottom center;
}

.m-card:active {
box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

.slider {
margin: 0 -30px;
}

.cards {
margin-top: 30px;
}

.cards .cards__note {
margin-top: 30px;
}

.cards .cards__body {
margin-top: 30px;
}

@media screen and (min-width: 768px) {
.cards .cards__body {
display: flex;
}
}

.cards .cards__item {
display: flex;
flex: 0 1 auto;
margin-top: 30px;
width: 100%;
}

@media screen and (min-width: 768px) {
.cards .cards__item {
margin-top: 0;
}
}

@media screen and (min-width: 768px) {
.cards .cards__item:not(:last-of-type) {
margin-right: 30px;
}
}



@media only screen and (max-width: 455px) {
.subpageHeader .hkjcLogo {
max-width: 200px;
}
.m-slider {
width: 300px !important;
}

.m-card .m-card__body {
min-height: 375px;
padding: 30px 15px;
}

.m-card:after {
width: 90px;
height: 130px;
right: -30px;
}
.date-container .btn-blue-line {
font-size: 1em;
}

.date-container .btn-blue-line {
width: 100%;
justify-content: center;
}
}
@media only screen and (max-width: 320px) {
.m-slider {
width: 245px !important;
}

.m-card .m-card__body {
min-height: 400px;
}
}



/*becoming*/
.becoming {
display: flex;
justify-content: center;
}

.becoming-container {
flex-wrap: wrap;
display: flex;
justify-content: flex-end;
}

.becoming_item_con {
width: 264px;
height: 280px;
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/659/become-cycle-left.png);
background-repeat: no-repeat;
background-position-y: 28px;
}

.becoming_item_con:nth-child(5) {
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/659/become-cycle-last.png);
}

.becoming_item {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
margin-right: 23px;
}

.becoming_item .number {
display: flex;
justify-content: center;
align-items: center;
background-color: #022169;
width: 68px;
height: 68px;
border-radius: 50%;
color: #fff;
font-size: 36px;
font-weight: 700;
margin-bottom: 10px;
}

.becoming_item .title {
color: #022169;
font-size: 24px;
font-weight: 300;
border-bottom: #022169 solid 1px;
padding-bottom: 10px;
margin-bottom: 10px;
}

html:lang(zh-TW) .becoming_item .title {
font-size: 20px;
margin-top: 5px;
}

html:lang(zh-TW) .becoming_item .content {
line-height: 1.6;
height: 70px;
}

.becoming_item .content {
color: #000;
text-align: center;
margin-bottom: 5px;
line-height: 1.3;
font-size: 15px;
padding: 0px 15px;
height: 73px;
width: 240px;
}

.becoming_item .icon {}

@media only screen and (max-width: 1439px) {
.becoming-container {
width: 800px;
justify-content: center;
}

.becoming_item_con:nth-child(3) {
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/659/become-cycle-right-down.png);
}

.becoming_item_con:nth-child(4) {
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/659/become-cycle-right.png);
order: 5;
margin-right: 23px;
}

.becoming_item_con:nth-child(4) .becoming_item {
margin-left: 23px;
margin-right: 0;
}

.becoming_item_con:nth-child(5) {
order: 4;
background-position-x: 23px;
}

.becoming_item_con:nth-child(5) .becoming_item {
margin-right: 0px;
margin-left: 23px;
}
}

@media only screen and (max-width: 912px) {
.becoming-container {
width: 100%;
justify-content: center;
flex-direction: column;
align-content: center;
}

.becoming_item_con {
width: 235px;
background-position-x: center;
height: 286px;
margin-bottom: 30px;
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/659/become-cycle-down.png);
}

.becoming_item {
margin-right: 0px;
}

.becoming_item_con:nth-child(3) {
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/659/become-cycle-down.png);
}

.becoming_item_con:nth-child(4) {
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/659/become-cycle-down.png);
order: 4;
margin-right: 0px;
}

.becoming_item_con:nth-child(4) .becoming_item {
margin-left: 0px;
margin-right: 0px;
}

.becoming_item_con:nth-child(5) {
order: 5;
background-position-x: 0px;
}

.becoming_item_con:nth-child(5) .becoming_item {
margin-right: 0px;
margin-left: 0px;
}
}


/*kv-2023-banner*/
.kv-logo-img{
margin-left: -5%;
}
.kv-2023-banner {
background-color: #22305B;
}

.kv-2023-banner-container {
max-width: 2160px;
margin-left: auto;
margin-left: auto;
margin-right: auto;
display: flex;
flex-direction: row-reverse;
}

.kv-2023-banner-container .kv-img {
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/737/2024-kv-banner-d-e.jpg);
flex: 1 1 auto;
background-repeat: no-repeat;
background-position: center right;
background-size: contain;
}

.kv-2023-banner-container .info {
color: #fff;
display: flex;
flex-direction: column;
/* margin-right: 15px; */
flex: 0 0 544px;
padding: 30px 60px;
margin: 0px 0px;
}

.kv-2023-banner-container .info img {
width: 100%;
}

.kv-2023-banner-container .date {
display: flex;
align-items: center;
margin-top: 30px;
margin-bottom: 30px;
}

.kv-2023-banner-container .date .logo {
margin-right: 10px;
}

.kv-2023-banner-container .date .logo img {
width: 100px;
}

.kv-2023-banner-container .date .content {
text-align: left;
}

.kv-2023-banner-container .date .content p,
h3 {
margin: 0px;
color: #ffffff;

}

@media only screen and (max-width: 1300px) {
.kv-2023-banner-container .info {
flex: 0 0 37vw;
}

.kv-2023-banner-container .date {
align-items: flex-start;
flex-direction: column;
}

.kv-2023-banner-container .kv-img {
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/737/2024-kv-banner-d-e.jpg);
flex: 1 1 auto;
background-repeat: no-repeat;
background-position: center left;
background-size: contain;
}
}


@media only screen and (max-width: 1024px) {
.btn-container {
flex-direction: column;
gap: 15px;
}
}

@media only screen and (max-width: 850px) {
.phase-2 {
flex-direction: column-reverse;
gap: 30px;
}
}

@media only screen and (max-width: 768px) {
.mobile-on {
display: block;
}

.mobile-off {
display: none;
}

.kv-2023-banner-container {
flex-direction: column-reverse;
}

.kv-2023-banner-container .kv-img {
background-image: url(https://res.hkjc.com/campaigns/wp-content/uploads/sites/737/2024-kv-banner-m-e.jpg);
flex: 0 1 107vw;
background-size: contain;
}

.kv-2023-banner-container .info {
  z-index: 200;
margin-top: -15vw;
margin-bottom: 30px;
margin-left: 0px;
margin-right: 0px;
padding: 0 60px;
}

.pageHeader .container {
padding: 0 15px;
}

.content-section {
flex-direction: column-reverse;
}

.col-6 {
width: 100%;
}
}

@media only screen and (max-width: 455px) {
.subpageHeader .topHeader {
height: 80px;
}  
h1.page-title {
font-size: 2.2em;
}
h1 {
font-size: 2.2em;
}

h2 {
font-size: 2em;
}

h3 {
font-size: 1.9em;
font-weight: 300;
}

h4 {
font-size: 1.8em;
line-height: 1;
}

h5 {
font-size: 1.5em;
}

h6 {
font-size: 1.4em;
}

.phase-2 {
gap: 15px;
}

.phase-2 h2 {
font-size: 2.250em;
}

.hkis-logo img {
width: 100px;
}
#content>.container,
.content-header>.container {
padding: 0 15px;
}

#content .subpage-top-container .container {
padding: 30px 15px 0px 15px;
}

.hkis-section {
padding: 0px 15px 30px 15px;
}

.sub-section {
padding-top: 30px;
}

.first-section {
padding-top: 30px;
}


.kv-2023-banner-container .info {
z-index: 99;
padding: 0 15px;
}

.kv-2023-banner-container .date .content h3 {
font-size: 2.25em;
}

.btn-white-line {

}

.m-slider__item:nth-child(2n) {
margin-top: 0px;
}

.swiper {
padding-right: 30px !important;
}
.btn-blue-line-small {
font-size: 1em;
}
.btn-white-line {
font-size: 1em;
}
}

/*** start of relive pop up  ****/



:root {

  --popup-alert-inner-bg-color: #fff;
  --popup-alert-h1-color: #022169;
  --popup-alert-close-btn-bg-color: #022169;
  --popup-alert-close-btn-text-color: #fff;
}



.sn-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999999;
  background-color: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100vh;
}



.sn-overlay.close {
  display: none;
}



.sn-overlay__context {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  width: 95%;
  max-width: 765px;
}



.entry-overlay-layout {
  max-width: 520px;
  width: 100%;
  margin: 0 auto;
  background-color: var(--popup-alert-layout-bg-color);
  height: auto;
  box-sizing: border-box;
  text-align: center;
  position: relative;
  padding-top: 10px;
  padding-bottom: 20px;
  border-radius: 10px;
}



.entry-overlay-layout-top {
  display: inline-block;
  width: 100%;
}



img.entry-overlay-logo {
  max-width: 160px;
  position: relative;
  z-index: 2;
  margin-top: 20px;
}



.entry-overlay-layout-bottom {
  margin-left: 20px;
  margin-right: 20px;
  background-color: var(--popup-alert-inner-bg-color);
  border-radius: 10px;
  padding: 20px 20px 28px 20px;
  box-sizing: border-box;
  margin-top: 10px;
}





.entry-overlay-layout-bottom h1 {
  font-size: 24px;
  font-weight: bold;
  color: var(--popup-alert-h1-color);
  line-height: 1.2em;
}



.entry-overlay-layout-bottom p {
  line-height: 1.5em;
  font-size: 16px;
  margin-bottom: 5px;
  margin-top: 0px;
}



.entry-overlay-layout-button {
  display: inline-block;
  width: 100%;
  margin-top: 20px;
}



.sn-overlay__close-btn {
  text-decoration: none;
  background-color: var(--popup-alert-close-btn-bg-color);
  color: var(--popup-alert-close-btn-text-color);
  padding: 10px 20px;
  display: inline-block;
  border-radius: 40px;
  border: 0;
  outline: none;
  cursor: pointer;
}



.sn-overlay__close-btn:hover {
  opacity: 0.8;
background-color: var(--popup-alert-close-btn-bg-color)!important;
}

/*** end of relive pop up  ****/
.icon-twitter:before {
    background-image: url(//res.hkjc.com/campaigns/wp-content/uploads/sites/737/icon_share_x.png.png);
}


/* start of popup old event */
:root {
    /*--popup-alert-layout-bg-color: #1FB5D6;*/
    --popup-alert-inner-bg-color: #fff;
    --popup-alert-h1-color: #000b38;
    --popup-alert-close-btn-bg-color: #000b38;
    --popup-alert-close-btn-text-color: #fff;
}

.sn-overlay {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999999;
    background-color: rgba(0, 0, 0, 0.5);
    width: 100%;
    height: 100vh;
}

.sn-overlay.close {
    display: none;
}

.sn-overlay__context {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    width: 95%;
    max-width: 765px;
}

.entry-overlay-layout {
    max-width: 520px;
    width: 100%;
    margin: 0 auto;
    background-color: var(--popup-alert-layout-bg-color);
    height: auto;
    box-sizing: border-box;
    text-align: center;
    position: relative;
    padding-top: 10px;
    padding-bottom: 20px;
    border-radius: 10px;
}

.entry-overlay-layout-top {
    display: inline-block;
    width: 100%;
}

img.entry-overlay-logo {
    max-width: 160px;
    position: relative;
    z-index: 2;
    margin-top: 20px;
}

.entry-overlay-layout-bottom {
    margin-left: 20px;
    margin-right: 20px;
    background-color: var(--popup-alert-inner-bg-color);
    border-radius: 10px;
    padding: 20px 20px 28px 20px;
    box-sizing: border-box;
    margin-top: 10px;
}


.entry-overlay-layout-bottom h1 {
    font-size: 24px;
    font-weight: bold;
    color: var(--popup-alert-h1-color);
    line-height: 1.2em;
    margin-bottom:20px;
}

.entry-overlay-layout-bottom p {
    line-height: 1.5em;
    font-size: 16px;
    margin-bottom: 5px;
    margin-top: 0px;
}

.entry-overlay-layout-button {
    display: inline-block;
    width: 100%;
    margin-top: 20px;
}

.sn-overlay__close-btn {
    text-decoration: none;
    background-color: var(--popup-alert-close-btn-bg-color);
    color: var(--popup-alert-close-btn-text-color);
    padding: 10px 20px;
    display: inline-block;
    border-radius: 40px;
    border: 0;
    outline: none;
    cursor: pointer;
}

.sn-overlay__close-btn:hover {
    opacity: 0.8;
    background-color: var(--popup-alert-close-btn-bg-color)!important;
}
/* end of popup old event */


@media only screen and (max-width: 455px) {
    .aution-card.m-card .m-card__body {
 		min-height: unset
    }
}