﻿/* ------ common style for racing pack + summer odyssey ------- */
.checkbox-sel-label {
    margin-left: 0.6875rem;
    display: flex;
    flex-wrap: wrap;
}
.checkbox-sel-label__val {
    font-family: "fontMR", "Montserrat", "Helvetica Neue", Arial, "Microsoft JhengHei Fix", "Microsoft JhengHei", "PingFang HK", "PingFang TC", sans-serif!important;
    display: inline-block;
    width: 100%;
    font-size: 0.875rem;
    flex: 0 0 100%;
}
.checkbox-sel-label__val--font-s {
    color: #23262a;
    font-size: 0.75rem;
} 

.form-check-input--checkbox {
    flex: 0 0 1.25rem;
    width: 1.25em !important;
    height: 1.25em !important;
    border-radius: 2px !important;
    border: 2px solid #000 !important;  /*for fireFox fixing */
  }

  .select-dropdown__select {
    border-radius: 50px;
    padding: 0.625rem 3.125rem 0.625rem 1.25rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-color: #23262a;
    font-size: 0.875rem;
    box-shadow: 0;
    background: transparent;
    transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    /*for fireFox fixing */
    border-width: 1px;
    border-style: solid;
	font-weight: bold;
  }
  
a.url-link {
     Word-break:break-all;
}

.no-gutter {
	padding-right: 0px;
    padding-left: 0px;
}	

.no-gutter-form {
    padding-right: 5px;
    padding-left: 5px;
}


/* ------- style for summer odyssey ------- */
html {
    font-size:16px;
}

.langToggle {
    font-size: 0.9em;
    padding: 40px 0px 30px;
}

.contentpage-container {
    font-size:16px!important;
}

.langToggle a {
    /* color:#315580; 
    color:#022169; */
    text-decoration: none;
}

.langToggle a:hover {
    /* color:#315580; */
    color:#022169;
}
/*
.container-racing-pack {
    color:#212223;
    font-size:16px!important;
}

.container-racing-pack a {
    text-decoration: underline!important;
}
*/

@media (max-width: 576px) {
    .langToggle {
        padding: 35px 0px 30px;
    }
}

 hr.line-gold {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    border-right: 0px none;
    border-width: 0.5px 0px 0px;
    border-style: solid none none;
    border-color: #f1efe9;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    border-image: none;
    opacity: 1;
 }

 .container-summer-odyssey {
    color:#212223;
	min-height: 65vh; 
    /* background-color:#f1efe9; */
}

h2.page__title {
    font-family:"fontCG","Cormorant Garamond",Georgia,"Times New Roman",Times,serif!important;
    font-size: 1.625rem;
    line-height: 1.875rem;
    padding:1.5rem 0 1.5rem;
    font-weight: 600;
    letter-spacing: 0em;
     color: #022169;    
    /* color: #1D314F; */ 
    text-align:center;
}

.page__subtitle {
    font-family:"fontCG","Cormorant Garamond",Georgia,"Times New Roman",Times,serif!important;
    font-size: 1.375rem;
    line-height: 1rem;
    font-weight: 600;
    letter-spacing: 0em;
     color: #022169;    
    text-align:center;
    margin-bottom:2.5rem;
}

/* 
@media (max-width: 576px) {
    h2.page__title {
        text-align:left;
    }
} */

.container-summer-odyssey .fm-blk {
    padding: 1.375em 1.5em;
    margin-bottom: 2em;
    background-color: #ffffff;
    border-radius: 0.5rem;
    font-size: 16px;
    border: 1px solid #A0926E;
}

.container-summer-odyssey h2.fm-blk__label {
    font-family: "fontCG_Medium","Cormorant Garamond",Georgia,"Times New Roman",Times,serif!important;
    font-size: 1.5rem;
    font-weight:500;
    letter-spacing: 0em;
    color:#000000;
} 

.container-summer-odyssey h2.fm-blk__label_participant {
    font-family: "fontCG_Medium","Cormorant Garamond",Georgia,"Times New Roman",Times,serif!important;
    font-size: 1.25rem;
    font-weight:500;
    letter-spacing: 0em;
    color:#000000;
}

.container-summer-odyssey .fm-blk__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.8rem;
    min-width:300px;
}

.container-summer-odyssey .radio-sel-label__val--font-s, .container-summer-odyssey .checkbox-sel-label__val--font-s {
    font-size: .875rem;
    color:#212223;
}

.container-summer-odyssey .fm-blk-bottom {
    margin-top:2rem;
    margin-bottom:2rem;
}

/*
h6.fm-blk__subTitle {
    color:#212223;
} */

@media (max-width: 576px) {
 .container-summer-odyssey .form-check-inline {
    display: block!important;
    margin-right: 1rem;
 }
} 

.container-summer-odyssey label {
    /* display: inline-block; */
    max-width: 100%;
    margin-bottom: 0px;
    margin-top: 5px;
    font-weight: 700;
}

.container-summer-odyssey .fm-blk__remarks {
    font-size: 0.625rem;
	line-height:1.2rem;
	font-family: "fontMR_semiBold", "Montserrat", "Helvetica Neue", Arial, "Microsoft JhengHei Fix", "Microsoft JhengHei", "PingFang HK", "PingFang TC", sans-serif!important;
    color: #787b80;
}

.fm-blk__rank {
   margin-top:0.5rem;
}

.fm-blk__rank--no {
    font-size: 1rem;
	font-family: "fontMR_semiBold", "Montserrat", "Helvetica Neue", Arial, "Microsoft JhengHei Fix", "Microsoft JhengHei", "PingFang HK", "PingFang TC", sans-serif;
    font-weight:600;
    display:inline-block;
    width:1rem;
    text-align:top;
}
.fm-blk__rank .fm-blk__select {
    display:inline-block;
    width:90%;
    padding-left:0.8rem;
}

@media (max-width: 576px) {
 .fm-blk__header--mobile {
    margin-bottom: 0rem!important;
 }
 .options-group--mobile {
    margin: 0 0 1rem;
 }
}

.hkjc-logo-svg {
    width:274px;
}

.fm-blk__content {
    font-size:0.875rem;
    line-height: 1.375rem;
}

.fm-blk__content ol li {
    font-size:0.875rem;
    margin-left:-1rem;
}


.fm-blk__select-group--theme-otp.adjustTopRight {
    margin-top: 1.7rem!important;
}

@media (max-width: 576px) {
    .fm-blk__select-group--theme-otp.adjustTopRight {
        margin-top: 1.7rem!important;
        margin-right: 0;
    }
} 
/*--- summer logo center ---*/
.blk-logo-summer {
    text-align:center;
    margin-bottom:2rem;
} 
.blk-logo-summer__img {
    padding:1rem 2rem;
    width:250px;
}

/*--- summer logo align left ---*/
.logo-summer-svg {
    width: 350px;
	padding:15px;
}

@media (max-width: 576px) {
 .hkjcLogo img.logo-summer-svg {
    width: 220px;
 }
}

.fm-blk__remark {
	color:#A1A5AA;
	font-size:0.75rem;
	line-height: 1.2rem;
}	

/* ------ Form select & input box ------- */
.container-summer-odyssey .select-dropdown__select.select-dropdown__lineStyle {
    border-radius: 50px;
    /* padding: 0.625rem 3.125rem 0.5rem 1.25rem;  */
     padding: 0.625rem 1.925rem 0.5rem 0.5rem;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* border-color: #242426; */
	border-color:#23262a;
    
    font-size: 0.875rem;
    box-shadow: 0;
    background: transparent;
    transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    border-radius: 0;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    width:100%;
	/* for FireFox fixing */
    border-bottom-width: 1px!important;
    border-bottom-style: solid!important;
}

@media (max-width: 576px) {
    .container-summer-odyssey .select-dropdown__select.select-dropdown__lineStyle {
        width:100%;
    }
} 

.container-summer-odyssey .select-dropdown__select.select-dropdown__lineStyle:hover {
    cursor: pointer;
    /* box-shadow: 0 0 4px 0 rgba(2, 10, 22, 0.15); */
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.075);
    transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);

  outline: 0;
  outline: thin dotted \9;
  -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 52 139 / 60%);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(38, 52, 139, 0.6);
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 52 139 / 60%);
}


.container-summer-odyssey input[type="text"] {
    background-color: #ffffff;
    border: 1px solid #cccccc;
    -webkit-box-shadow: inset 0 0 1px rgb(0 0 0 / 0%);
    -moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0);
    box-shadow: inset 0 0 1px rgb(0 0 0 / 0%);
    -webkit-transition: border linear .2s, box-shadow linear .2s;
    -moz-transition: border linear .2s, box-shadow linear .2s;
    -o-transition: border linear .2s, box-shadow linear .2s;
    transition: border linear .2s, box-shadow linear .2s;
    padding-left: 5px;
	height:46px;
}

@media all and (-ms-high-contrast:none) {
     .container-summer-odyssey input[type="text"] { height: 38px } /* IE10 */
     *::-ms-backdrop, .container-summer-odyssey input[type="text"] { height: 38px; } /* IE11 */
}

.container-summer-odyssey input[type="text"]:hover {
    -webkit-box-shadow: inset 1px 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 52 139 / 60%);
    -moz-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgb(38 52 139 / 60%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 52 139 / 60%);
}

.container-summer-odyssey .select-dropdown__select:focus {
    border-color: #a0926e;
    /* outline-color rgb(229, 151, 0); */
}

.container-summer-odyssey .select-dropdown__select:hover {
    cursor: pointer;
    /* box-shadow: 0 0 4px 0 rgb(2 10 22 / 15%);
    transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
    outline-color: rgba(38, 52, 139, 0.6); */
	box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.075);
    transition: box-shadow 0.5s cubic-bezier(0.23, 1, 0.32, 1);
  outline: 0;
  outline: thin dotted \9;
  -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 52 139 / 60%);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(38, 52, 139, 0.6);
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 52 139 / 60%);
}

.container-summer-odyssey .select-dropdown__arrow {
    position: absolute;
    top: 6px;
    /* right: 12px; */
    right: -5px;
    width: 32px;
    pointer-events: none;
}

 @media (max-width: 576px) { 
  .container-summer-odyssey .select-dropdown__arrow {
    /* right: 0; */
    right: -5px;
  }
}

.container-summer-odyssey .fm-blk__select-group--theme-otp .select-dropdown__arrow {
    top: 0;
    right: -2px;
}


/*-------------- footer ---------------*/

.footer-container {
    /* background-color: rgba(248, 248, 248, 0.82); 
	box-shadow: 0px -0.3px 0px #AEAEB4;*/
	background-color: #ffffff;
    height:52px;
}

.footer-container > .container .footer {
    margin: 0px auto;
}

.footer-container > .container {
    width: 100%;
    /* background-color: rgba(248, 248, 248, 0.82); */
	background-color: #ffffff;
    margin-bottom: 0px;
    text-align:center;
}

.footer-member-hkjc {
    color: rgba(0, 0, 0, 0.8);
    font-size:0.75rem;
    padding: 1rem;
}



 
 
 /*===================== summer thankyou page new ===================*/
 .thankyou-blk__subTitle {
    font-family: "fontCG_Bold", "Cormorant Garamond", Georgia, "Times New Roman", Times, serif !important;
    font-size: 1.2rem;
    color: #000000;
	margin-bottom:0;
}

 .thankyou-blk__font-m {
   font-family: "fontMR", "Montserrat", "Helvetica Neue", Arial, "Microsoft JhengHei Fix", "Microsoft JhengHei", "PingFang HK", "PingFang TC", sans-serif;
    font-size: 1rem;
    line-height: 1.375rem;
    padding: 1rem 0 ;
    color: #212223;
}
 .container-summer-thankyou .fm-blk__header {
	 margin-bottom: 0.5rem;
 } 
 
 .container-summer-thankyou {
	 margin-bottom:80px;
 } 
 
 
 /*===================== summer OTP new ===================*/
 .fm-blk__rankNumber--font-lg {
	font-family: "fontMR_semiBold", "Montserrat", "Helvetica Neue", Arial, "Microsoft JhengHei Fix", "Microsoft JhengHei", "PingFang HK", "PingFang TC", sans-serif!important;
    font-size: 4.5rem;
    line-height: 4rem;
    margin-bottom: 0rem;
	text-align: center;
} 
  

/*===================== summer OTP + Ranking page ===================*/
.container-summer-odyssey input[type="email"], .container-summer-odyssey input[type="tel"] {
    background-color: #ffffff;
    border: 1px solid #cccccc;
    -webkit-box-shadow: inset 0 0 1px rgb(0 0 0 / 8%);
    -moz-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 0 1px rgb(0 0 0 / 8%);
    -webkit-transition: border linear .2s, box-shadow linear .2s;
    -moz-transition: border linear .2s, box-shadow linear .2s;
    -o-transition: border linear .2s, box-shadow linear .2s;
    transition: border linear .2s, box-shadow linear .2s;
    padding-left: 5px;
}

.container-summer-odyssey input[type="email"]:hover, .container-summer-odyssey input[type="tel"]:hover   {
    -webkit-box-shadow: inset 1px 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 52 139 / 60%);
    -moz-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgb(38 52 139 / 60%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(38 52 139 / 60%);
}


/* --------------  footer flex -------------- */

.fluid-policy {
	padding-top:20px;
    padding-bottom:20px;
    padding-left: 0px!important;
	padding-right: 0px!important;
	/* position: absoulte;
    bottom: 0;
    width: 100%;
	margin-top:50px; */
}
/*
@media (max-width: 991px) {
	.fluid-policy {
		position: relative;
	}
} */	

.footer-bottom {
    text-align:center;
    font-size:0.75rem;
}	

.footer-bottom--policy {
	 margin:1rem 1rem;
}	

.footer-bottom--policy a {
	color:#1c73b8;
	padding: 0 .5rem;
    text-decoration: none;
}

.hkjc-logo-svg {
    width: 274px;
}

p.logo-line {
    display: flex;
    flex-direction: row;	
}

p.logo-line img {
    padding: 0.5rem 2rem;
}
          
p.logo-line:before,
p.logo-line:after {
    content: "";
    flex: 1 1;
    border-bottom: 1.2px solid #A0926E;
    margin: auto;
}

.footer-bottom--copyright {
	line-height:1.2rem;
	padding:5px;
}	


.container-summer-odyssey h6.fm-blk__label_focus {
    font-family: "fontCG_Medium", "Cormorant Garamond", Georgia, "Times New Roman", Times, serif!important;
    font-size: 0.875rem;
    color: #23262a;
    margin-bottom: 0;
}

/*=========== start summer form bootstrap 4 ==========*/
.visually-hidden {
	display:none;
}	

.table td {
    padding: 5px !important;
    color: #000;
	background-color: #fff;
    border: 2px solid #fff;
    border-top: 1px solid #fff !important;
    border-right: 2px solid #ff0000
    border-bottom: 0px;
}


.enrol-detail--category {	
}	

.enrol-detail--font-m {
	font-weight:bold;
}	

hr.table-line {
	border-color: #e5e5e5;
}	

/* ------ remove ie default dropdown arrow ------ */
@media all and (-ms-high-contrast:none) {
	select::-ms-expand {
		display: none;
	}
} /* IE10 */
	 
     *::-ms-backdrop, select::-ms-expand {
		display: none;
	} /* IE11 */
}

/* ------ form checkbox compatible with IE11 ------ */
.form-check--box .checkbox input[type="checkbox"] {
    position: absolute;
    margin-top: 4px\9;
    margin-left: -30px;
    outline: 0px !important;
    border: 2px solid #000 !important;
    width: 1.25em !important;
    height: 1.25em !important;
    outline: 3px solid #23262a;
}
/* 
.form-check.form-check--box {
    padding-left: 0;
}	*/
.form-check--box .form-check--box-center {
	 margin: 0 25%;
	 background-color:#ff0000!important;
}	

@media (max-width: 576px) {
.form-check--box .form-check--box-center {
    margin: 0 0;
}
}


.form-check--box .checkbox input[type="checkbox"] {
    position: absolute;
    margin-top: 4px\9;
    /* margin-left: -30px; */
	margin-left: auto;
    outline: 0px !important;
    border: 2px solid #000 !important;
    width: 1.5em !important;
    height: 1.5em !important;
    outline: 3px solid #23262a;
}


.form-check-box--font-s {
    font-size: 0.875rem;
    color: #212223; 
    font-weight: 700;	
}

.form-check--box .check-btn-left {
	margin-left:35px;
	margin-top: -2px; 
}	

.form-check--box .checkbox  {
    float: left;
	background-color:#fff000;
	margin: 0px 0px 15px -20px;
}	


.no-gutter {
    padding-right: 0px;
    padding-left: 0px;
}


/*------ form check align page center ie compatible -------*/
.form-check--align {
    height: 2em;
    position: relative; 
	margin-top:3rem;
}
.form-check--align .form-check--align-center {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%) 
}  

.container-summer-odyssey .form-check--align-center label {
    max-width: 100%;
    margin-bottom: 0px;
    margin-top: 5px;
    font-weight: 700;
} 

.form-check--align-center input[type=checkbox] {
	position: absolute;
    /* margin-top: 4px\9; */
    outline: 0px !important;
    border: 2px solid #000 !important;
    width: 1.5em !important;
    height: 1.5em !important;
    outline: 3px solid #23262a;
	margin-top:3px;
}	

.form-check--align-center-font-s {
    font-size: 0.875rem;
    color: #212223; 
    font-weight: 700;	
}

.form-check--align-center .check-btn-left {
	margin-left:35px;
	display:inline-block;
}	


/*------ footer hkjc logo ie compatible -----*/
a.hkjc-logo-line {
  display: block;
  text-align: center;
  position: relative;
}
a.hkjc-logo-line:after {
  content: "";
  width: 100%;
  position: absolute;
  left: 0;
  top: 50%;
  /* height: 1px; */
  height: 0px;
  background: #A0926E;
  z-index: -1;
}

.hkjc-logo-svg {
    /* width: 220px; */
	width: 300px;
    background: #fff;
    padding: 15px;
}

/* ---- summer landing ---*/
.container-summer-odyssey .fm-blk__subTitle {
    font-family: "fontCG_Medium", "Cormorant Garamond", Georgia, "Times New Roman", Times, serif !important;  
    font-size: 1.2rem; 
    color:#000000; 
}

.landing-blk__note {
    font-family: "fontMR", "Montserrat", "Helvetica Neue", Arial, "Microsoft JhengHei Fix", "Microsoft JhengHei", "PingFang HK", "PingFang TC", sans-serif!important;
    font-size:1rem;
    line-height: 1.375rem;
     /*color: #242426;*/
	color: #212223;
}

.landing-blk__remind {
    font-family: "fontCG", "Cormorant Garamond", Georgia, "Times New Roman", Times, serif;
    font-size:1.25rem;
    line-height: 1.625rem;
     /*color: #242426;*/
	color: #212223;
    margin-bottom:0.5rem;
	text-align:center;
}

.container-summer-odyssey .fm-blk__subTitle_large {
    font-family: "fontCG_Medium", "Cormorant Garamond", Georgia, "Times New Roman", Times, serif !important;  
    font-size: 1.5rem; 
    color:#000000; 
}

.container-summer-odyssey .fm-blk__header.fm-blk__header-center {
    justify-content: center;
}

.container-summer-odyssey-landing .fm-blk {
    padding: 1.375em 1.5em;
    margin-bottom: 2.5em;
    background-color: #ffffff;
    border-radius: 1rem;
    font-size: 16px;
    border: 1px solid #A0926E;
}

.cta-button--primary {
    padding-top: 0.625em;
    padding-bottom: 0.625em;
}	

.container-summer-odyssey-landing .fm-blk-bottom {
    margin-top: 0rem;
    margin-bottom: 0.2rem;
}
.landing-blk__updateContact {
    font-size: 0.875rem;
    font-family: "fontMR", "Montserrat", "Helvetica Neue", Arial, "Microsoft JhengHei Fix", "Microsoft JhengHei", "PingFang HK", "PingFang TC", sans-serif!important;
    margin-top: 2rem;
    /* margin-bottom: 5rem; */
}

hr.line-lightgrey {
    /* margin-top: 0px; */
    margin-bottom: 10px;
    border-right: 0px none;
    border-width: 0.5px 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;
}

/*------ table-enrol-detail with scroll bar at bottom -----*/
.table td {
    border: 0px solid #fff;
	border-top: 0px solid #fff !important;
}

.bold {
	font-weight:bold;
}	

.table-enrol-details.table td {
	padding: 15px 5px!important;
    border-bottom: 1px solid #c3c3c3;
	font-size: 1rem;
}

.table-enrol-details td.column-1 {
	min-width:30px;
}	

.table-enrol-details td.column-2 {
	min-width:200px;
}	

.table-enrol-details td.column-3 {
	min-width:130px;
}	

.table-enrol-details td.column-4 {
	min-width:160px; 
}	

.table-enrol-details td.column-5 {
	min-width:auto;
}	


/*------ table-enrol-detail-2 mobile display vertical  -----*/
.table-enrol-details-2.table td {
	padding: 15px 5px!important;
	/* font-size: 1rem;*/
	font-size: 0.875rem;
}

.table-enrol-details-2 td.column-1 {
	min-width:40px;
}	

.table-enrol-details-2 td.column-2 {
	width:40%;
}	

.table-enrol-details-2 td.column-3 {
	width:25%;
}	

.table-enrol-details-2 td.column-4 {
	width:30%;
}	

.table-enrol-details-2 td.column-5 {
	width:10%;
}	

.table-enrol-details-2 tr.bottom-line-tr {
	border-bottom: 1px solid #e5e5e5;
}	

@media only screen and (max-width: 991px){ 

		/* Force table to not be like tables anymore */
		.table-enrol-details-2.table, .table-enrol-details-2 thead, .table-enrol-details-2 tbody, .table-enrol-details-2 th, .table-enrol-details-2 td, .table-enrol-details-2 tr {
			display: block;
		}

		/* Hide table headers (but not display: none;, for accessibility) */
		.table-enrol-details-2 thead tr {
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
    
		.table-enrol-details-2 td {
			/* Behave  like a "row" */
			border: none;
			border-bottom: 0px solid #eee;
			position: relative;
			padding-left: 5px;
		}

		.table-enrol-details-2 td:before {
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 0;
			left: 6px;
			width: 45%;
			padding-right: 10px;
			white-space: nowrap;
		}

		/*
		Label the data
    You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
		*/
		
	
	.table-enrol-details-2.table td {
		padding: 5px 0px!important;
	}		
	
	.table-enrol-details-2 tr.bottom-line-tr {
		padding-top: 15px;
		padding-bottom: 15px;
	}	
	
	.table-enrol-details-2 td.column-1 {
		min-width:40px;
	}	

	.table-enrol-details-2 td.column-2, .table-enrol-details-2 td.column-3, .table-enrol-details-2 td.column-4, .table-enrol-details-2 td.column-5  {
	width:100%;
	}	

}

/*=== radio button ===*/
.form-check-input[type="radio"]:checked {
	position: absolute;
}	

.form-check-input[type="radio"]:checked::before {
    background-color: transparent;
}

/*=== mobile errors message ===*/
@media (max-width: 1024px) {
.errors-message  {
	line-height:1.2rem;
}	
}

/*=== caring heart 2 dropdown columns ===*/
.adjustTop {
	margin-top:-.2rem;
}


/*=== caring heart formcheck align left ===*/

.container-summer-odyssey .form-check--align-center label {
    max-width: 100%;
    margin-bottom: 0px;
    margin-top: 5px;
    font-weight: 700;
} 

.form-check--align-left input[type=checkbox] {
	position: absolute;
    /* margin-top: 4px\9; */
    outline: 0px !important;
    border: 2px solid #000 !important;
    width: 1.5em !important;
    height: 1.5em !important;
    outline: 3px solid #23262a;
	margin-top:3px;
}	


.form-check--align-left .check-btn-left {
	margin-left:35px;
	/* display:inline-block; */
}	

.fm-blk__remark-dark {
	/* color:#A1A5AA; */
	color:#212223;
	font-size:0.75rem;
	line-height: 1.2rem;
	font-weight:normal;
}

/*=== move logo to top header ===*/
.hkjcLogo-top {
    display: block;
    margin: 10px 0px 0px;
    z-index: 9999;
}

.hkjcLogo-top-mb {
	float:left;
}

.hkjc-logo-svg-top {
    width: 280px;
    padding: 15px 20px 15px 0;
}	

@media (max-width: 767px) {
    div.pageHeader {
        /*height: 160px!important;*/
  }
  .logo-summer{
    text-align:center;
    margin: 0 auto;
   }

    .logo-summer img{
        width:80%;
    }  
} 

@media (max-width: 576px) {
  .hkjc-logo-svg-top {
    width: 240px;
    background: #fff;
    padding: 15px 5px;
  }	
  div.pageHeader {
    /*height: 150px!important;*/
  }

  .logo-summer{
   text-align:center;
  }
  
   .logo-summer img{
   width:75%;
  }  
}	

@media (max-width: 450px) {
    .logo-summer img{
        width:90%;
    }  
}    

.hkjcLogo-top::before {
  content: url('../images/logo_line.png');
}

.logo-summer-svg {
    width: 350px;
    padding: 0 15px;
}

.margin_top20{
	margin-top:16px;
}

/*=== For kids form OTP ===*/
.capImgWrap {
    float: left;
    max-width: 240px;
}

#capReload {
    line-height: 66px;
    font-size: 28px;
    margin-left: 0px;
    float: left;
}

#captcha {
    /* max-width: 240px; */
    max-width: 100%;
    display: block;
    text-transform: uppercase;
    margin-top: 20px;
}

/*
.club_privacy_center {
	width: 95%;
    margin: auto;
    text-align: center;
    line-height: 1rem;
    margin-top: 1.5rem;
} */	

.container-summer-odyssey .form-check--align-center label .ValidationErrors {
	font-weight:normal!important;
}	


@media (max-width: 576px) {
	.container-summer-odyssey .fm-blk__header {
		min-width: 300px;
	}    
}

/* === form pony ===*/
.container-summer-odyssey h2.fm-blk__label.sub-title-bold {
    font-weight:bold;
    color: #A0926E;
    ;
}

.fm-blk__content-color-bg {
    background-color: #F2EDD8;
    padding: 30px 15px 15px;
    
}

.enrol-info div {
    padding: 0.3rem 0.5rem;
}

@media (max-width: 450px) {
.enrol-info div {
    padding: 0.1rem 0.5rem;
}
}