
body {
    color: #23262A;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
    font-size: 16px !important;
    line-height: 24px !important;
}

.hkjcLogo {
    position: relative;
    margin: 0px;
    z-index: 9999;
    width: 100%;
    height: auto;
    padding: 24px 0px;
    display: block;
}

.hkjc-logo-svg{
    padding:0px;
}


div.pageHeader {
    height: auto;
    background: #0A2240;
}
@media (min-width: 576px) {
    div.pageHeader .container {
        max-width: 1504px !important;
        padding: 0px !important;
        width: 100% !important;
    }
}

@media (max-width: 576px) {
    .pageHeader > .container{
     padding-right: 0px;
    padding-left: 0px;
    }
}

@media (max-width: 992px) {
    .hkjcLogo {
        margin: 0px !important;
    }
}

@media (max-width: 550px) {
    .hkjcLogo {
     margin: 0px !important;
    }
     div.pageHeader {
     height: auto !important;
    }
        .hkjcLogo img {
     margin: 0px;
     width:auto;
     }
}


@media (max-width: 1528px) {
    .hkjcLogo {
        padding: 24px;
    }
}

.hkjc-logo-svg {
    width: Auto;
    height: 48px;
    background:none;
}



.langToggle a{
        color:#ccc!important;
    padding-right:24px;
}

.langToggle{
    padding:0px;
    margin-top:30px;
}

@media (max-width: 1024px) {
    .langToggle{
        margin-top:20px;
    }
    .langToggle a{
         padding-right:16px;
    }

        .hkjc-logo-svg {
        height: 36px;
    }

    .hkjcLogo {
        padding: 16px 16px;
    }

}

@media (max-width: 767px) {
    div.pageHeader {
        height: auto !important;
    }
       .hkjcLogo {
        padding: 16px 16px;
    }
       .langToggle a{
         padding-right:16px;
    }
}
@media (max-width: 550px) {
     .hkjcLogo {
        padding: 16px 6px;
    }
    .langToggle a{
         padding-right:6px;
    }
}

.footer-bottom {
    text-align: center;
     padding:0px 16px;
     font-size:14px;
     line-height:20px;
         border-top: 1px solid #976C43;
             padding: 80px 24px;
    margin-top: 120px;
}



h2.page__title {
    color: #0A2240;
    font-family: Prata !important;
    font-size: 36px !important;
    font-style: normal;
    font-weight: 400;
    line-height: 44px !important;
    text-align: center;
    padding: 80px 24px 48px 24px;
    margin-top: 0px;
    width: 100%;
}


.container-summer-odyssey h6.fm-blk__label_focus {
 font-family: "Montserrat", "Arial", "Verdana", "Helvetica", "sans-serif" !important;
    color: #666669 !important;
    font-size: 16px;
    font-style: normal;
    line-height: 24px;
    letter-spacing: 0.4px;
    font-weight: normal;
}


.container-summer-odyssey h2.fm-blk__label {
    color:#0A2240;
    font-family: Prata;
    font-size: 30px;
    font-style: normal;
    font-weight: 400;
    line-height: 36px; 
}


@media (max-width: 1024px) {}


#formEnrolment{
    background: #FBF8F5;
    border-radius:8px;
    padding:24px;
}

.cta-button--primary {
    padding-top: 0.875em;
    padding-bottom: 0.875em;
    background-color: #976C43;
    color: rgb(255, 255, 255);
    text-transform: uppercase;
    font-family: "Noto Sans", 微軟正黑體, "Microsoft JhengHei", "Meiryo UI", Meiryo, arial, sans-serif !important;
}

.fm-blk__select-group--theme-otp .select-dropdown__select{
     font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

.control-label.form-control--old {
 font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji" !important;
}

@media (max-width: 1024px) {
    h2.page__title {
         font-size: 30px !important;
        line-height: 36px !important;
        padding: 48px 0px 32px 0px;
    }
.footer-bottom {
      padding: 48px 24px;
      margin-top: 80px;
}
.container-summer-odyssey h2.fm-blk__label {
    font-size: 24px;
    line-height: 32px; 
}

#formEnrolment{
    padding:16px;
}
}

#max_part{
    margin-left:15px;
}

.cta-button--primary.isClicked, .cta-button--primary:hover, .cta-button--primary:focus{
    background-color: #976C43;
}

@media (max-width: 450px) {
    .enrol-info div {
        padding: 4px;
    }
}

.mobile-nextline{
    display:inline;
}
.timeline{
    padding:0px!important;
}
@media (max-width: 992px) {
    .mobile-nextline{
    display:block;
    margin-bottom:8px;
}

}