/*
Theme Name: CUHK STA
Author: DOMs
Version: 0.4
*/

/**
 * Table of Contents
 *
 * 00.0 - Font
 * 01.0 - Basic Elements
 * 02.0 - For IE10+ Only
 * 03.0 - Header
 * 04.0 - Top Menu
 * 05.0 - Footer
 * 06.0 - FC-Programme Hero Block 1
 * 07.0 - FC-Programme Hero Block 2
 * 08.0 - FC-Special Feature Block 1
 * 09.0 - FC-Special Feature Block 2
 * 10.0 - FC-Section Title
 * 11.0 - FC-Full Column Description
 * 12.0 - FC-Bottom Feature Block 1
 * 13.0 - FC-Overview Hero Block 1
 * 14.0 - FC-IMG Bg Full Column Description
 * 15.0 - FC-Mutli Columns Feature Block
 * 16.0 - FC-Testimonial Block
 * 17.0 - FC-Detail Content Feature Blocks
    * 17.1 - FC-Detail Content Feature Block - Title + Description
    * 17.2 - FC-Detail Content Feature Block - Content + Feature Box
    * 17.3 - FC-Detail Content Feature Block - Two Column Content
    * 17.4 - FC-Detail Content Feature Block - Image Gallery
 * 18.0 - FC-Full Image Block
 * 19.0 - FC-Section Title with Bg
 * 20.0 - FC-FAQ
 * 21.0 - FC-Curriculum Block
 * 22.0 - FC-Events and Sharing Block
 * 23.0 - FC-Submission Form
 */

/**
 * 00.0 - Font
 */
 @font-face {
   font-family: Calibri;
   src: url(fonts/Calibri.ttf);
   font-weight: Normal;
 }
 @font-face {
   font-family: Montserrat;
   src: url(fonts/Montserrat_Regular_300.ttf);
   font-weight: Normal;
 }
 @font-face {
   font-family: Montserrat;
   src: url(fonts/Montserrat_SemiBold_400.ttf);
   font-weight: Bold;
 }
 @font-face {
   font-family: BlissPro;
   src: url(fonts/BlissPro_Regular_300.otf);
   font-weight: 300;
 }
 @font-face {
   font-family: BlissPro;
   src: url(fonts/BlissPro_Medium_400.otf);
   font-weight: 400;
 }
 @font-face {
   font-family: BlissPro;
   src: url(fonts/BlissPro_Bold_500.otf);
   font-weight: 500;
 }

/**
 * 01.0 - Basic Elements
 */
body {font-family: 'BlissPro', sans-serif, "Microsoft YaHei", PMingLiu, mingliu; color: #000; background-color: #e5dfd9; font-weight: 300;}
div[id^="flexible_content"], section[id^="post-content"], header, footer, #top-bar {background-color: #404040;}
h2 {font-size: 38px;text-align: center; color: #fff; font-family: 'Montserrat'; font-weight: normal; letter-spacing: 10px;}
h3, form .forminator-row .forminator-label {font-size: 22px; font-weight: 500; letter-spacing: 3px; padding-bottom: 10px;}
h6 {font-size: 20px;}
b, strong {font-family: 'BlissPro', sans-serif, "Microsoft YaHei", PMingLiu, mingliu;}
p, ul li, ol li {font-size: 16px; line-height: 1.4; letter-spacing: 1px; color:#000; font-family: 'Calibri'; text-align: justify; font-weight: normal; overflow-wrap: break-word; word-wrap: break-word;}
p {margin-bottom: 1rem;}
ul li, ol li {margin-bottom: 0.5rem;}
ul li ol li, ol li ul li{margin-bottom: 0;}
p:last-child {margin-bottom: 0;}
a {color: #fff; text-decoration: none;}
a:hover {color: #fff;}
img {width: 100%; height: auto;}
div {position: relative;}
ul, ol {margin-bottom: 0;}

.m-t-40 {margin-top: 40px;}
.m-b-40 {margin-bottom: 40px;}

.container-fluid {padding-right: 0; padding-left: 0; overflow: hidden;}
.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {max-width: 1000px;}

.font-white {color: #fff;}
.font-blue {color: #546b8e;}
.font-brown {color: #ae8c70;}
.font-purple {color: #403163;}

.dp-full-column-description-container .row>* {padding: 0;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  p, ul li { text-align: left;}
  h2 {font-size: 4.5vw;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  p, ul li, ol li {font-size: 12px;}
  h3, form .forminator-row .forminator-label {font-size: 14px; letter-spacing: 1px;}
}

/**
 * 02.0 - For IE10+ Only
 */
.IECheck {display: none}
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
    .IECheck {display: block; position: absolute; top: 0; left: 0; z-index: 999999; background-color: #4e4e4e; width: 100vw; height: 100vh; padding: 20%; font-size: 64px;}
    div[id^="flexible_content"], header, footer {display: none;}
}

/**
 * 03.0 - Header
 */
header {z-index: 998;position: -wbkit-sticky; position: sticky; top:0; }
header .lang-opt {position: absolute; left: 20px; top: 20px; color: #fff; font-size: 16px; letter-spacing: 3px;}
header .lang-opt a {font-weight: 300;}
.RMDA .color-bar {height: 15px; background-color: #546B8E;}
.DSBS .color-bar {height: 15px; background-color: #403163;}
@media only screen and (max-width: 575.98px) /* Under sm */ {
    header .lang-opt {font-size: 10px; left: 10px; top: 24px; letter-spacing: 1px;}
}

/**
 * 04.0 - Top Menu
 */
.top-menu .navbar {padding-top: 10px; padding-bottom: 10px;}
.RMDA .top-menu .navbar {background-color: #000;}
.DSBS .top-menu .navbar {background-color: #ae8c70;}
.top-menu button {border: 0;}
.RMDA .top-menu .navbar-brand {margin-left: calc(50% - 115px); margin-right: 0;}
.DSBS .top-menu .navbar-brand {margin-left: calc(50% - 150px); margin-right: 0;}
.top-menu .navbar-brand img {width: auto; height: 30px;}
.top-menu ul li {padding-top: 2px; padding-bottom: 0;}
.top-menu a {text-decoration: none; font-weight: 700; letter-spacing: 2px; line-height: 2.5;}
.top-menu .menu-item {min-width: 250px; text-align: center;}
.top-menu .menu-item:last-child {min-width:0px;}
.top-menu .sub-menu { display: none; background-color: #fff; padding-inline-start:0; z-index: 10; position: absolute; list-style-type: inherit; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);}
.top-menu .sub-menu a {color: #000; line-height: 1.5;}
html[lang="en"] .top-menu .sub-menu a {letter-spacing: 0px; line-height: 1;}
.top-menu .sub-menu .menu-item {padding: 12px 16px;}
.top-menu .sub-menu .menu-item:hover {background-color: #9f2c4e;}
.top-menu .sub-menu .menu-item:hover a {color: #fff;}
.navbar-toggler:focus {box-shadow: 0 0 0 0rem;}
.top-menu .menu-item-has-children:hover .sub-menu {display: block; max-width: 250px;}
 .navbar-toggler-icon {width: 3rem; height: 3rem; background-image: none;}
 .bar1, .bar2, .bar3 {
   width: 100%;
   height: 1px;
   background-color: #fff;
   margin: 11px 0;
   transition: 0.4s;
 }
 button[aria-expanded="true"] .bar1 {
   -webkit-transform: rotate(-45deg) translate(-10px, 11px);
   transform: rotate(-45deg) translate(-10px, 11px);
 }
 button[aria-expanded="true"] .bar2 {opacity: 0;}
 button[aria-expanded="true"] .bar3 {
   -webkit-transform: rotate(45deg) translate(-5px, -8px);
   transform: rotate(45deg) translate(-5px, -8px);
 }

@media only screen and (max-width: 1199.98px) /* Under xl */ {
  .top-menu ul li {padding-left: 20px; padding-right: 20px;}
  .top-menu .sub-menu {position: relative;}
  .top-menu .menu-item-has-children:hover .sub-menu {max-width: 100%;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
   .top-menu .navbar {padding-top: 0; padding-bottom: 0;}
   .top-menu .navbar-brand img {height: 20px;}
   .RMDA .top-menu .navbar-brand {margin-left: calc(50% - 77px)}
   .DSBS .top-menu .navbar-brand {margin-left: calc(50% - 100px)}
   .navbar-toggler-icon {width: 2rem; height: 2rem;}
   .bar1, .bar2, .bar3 {margin: 7px 0;}
   button[aria-expanded="true"] .bar1 {
     -webkit-transform: rotate(-45deg) translate(-8px, 6px);
     transform: rotate(-45deg) translate(-8px, 6px);
   }
   button[aria-expanded="true"] .bar3 {
     -webkit-transform: rotate(45deg) translate(-5px, -4px);
     transform: rotate(45deg) translate(-5px, -4px);
   }
 }

/**
 * 05.0 - Footer
 */
 footer {text-align: center; font-family: 'Calibri'; font-weight: normal;}
.footer-level-1 {padding: 30px 0; border-bottom: 6px solid;}
.footer-level-1 img {height: 30px; width: auto;}
.footer-level-2 {color: #fff; padding: 30px 0; font-size: 13px;}
.footer-level-2 .col {padding: 0 5px;}
.footer-level-2 .tel {max-width: 180px;}
.footer-level-2 .link {max-width: 210px;}
.footer-level-3 {padding: 30px 0;}
.footer-level-3 img {height: 60px; width: auto; padding: 0 7px;}
.footer-level-3 .social img {height: 30px; width: auto; padding: 0 7px;}
@media only screen and (max-width: 767.98px) /* Under md */ {
  .footer-level-3 .social {padding-top: 20px;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .footer-level-1 img {height: 20px;}
  .footer-level-2 .tel, .footer-level-2 .link {max-width: 100%;}
  .footer-level-3 img {height: 45px;}
}

/**
 * 06.0 - FC-Programme Hero Block 1
 */

.programme-hero-block-1-container .background-layer-container,
.programme-hero-block-2-container .background-layer-container {padding-left: 0; padding-right: 0;}
.programme-hero-block-1-container .hero-text-layer,
.programme-hero-block-2-container .hero-text-layer {position: absolute; top: 0; z-index: 10;}
.programme-hero-block-1-container .title-row-1,
.programme-hero-block-2-container .title-row-1 {color: #fff; padding-top: 120px; letter-spacing: 16px; padding-bottom: 20px; margin-bottom: 0; text-align: left; font-family: 'BlissPro'; font-weight: 300;}
.programme-hero-block-1-container .title-row-2,
.programme-hero-block-2-container .title-row-2 {opacity: 0; position: absolute; margin-bottom: 0;}
.programme-hero-block-1-container .progrmme-logo,
.programme-hero-block-2-container .progrmme-logo {height: 60px; width: auto;}
.programme-hero-block-1-container h1,
.programme-hero-block-2-container h1 { color: #fff; padding-top: 20px; letter-spacing: 2px; font-size: 42px; font-weight: 300;}

.programme-hero-block-1-container .background-layer-bottom,
.programme-hero-block-2-container .background-layer-bottom {position: relative; z-index: 1; }
.programme-hero-block-1-container .background-layer-middle {position: relative; z-index: 2;}
.programme-hero-block-1-container .background-layer-middle .col-12 {position: absolute; bottom: 0;}
.programme-hero-block-1-container .background-layer-top {position: relative;; z-index: 3;}
.programme-hero-block-1-container .background-layer-top .col-12 {bottom: 0; position: absolute;}

.programme-hero-block-1-container .bottom-title-container,
.programme-hero-block-2-container .bottom-title-container {position: absolute; bottom: 20px; width: 100%; z-index: 11;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .programme-hero-block-1-container .title-row-1,
  .programme-hero-block-2-container .title-row-1 {padding-top: 9vw; padding-bottom:2vw;}
  .programme-hero-block-1-container .progrmme-logo,
  .programme-hero-block-2-container .progrmme-logo {height: 7vw;}
  .programme-hero-block-1-container h1,
  .programme-hero-block-2-container h1 {font-size: 4vw; padding-top: 2vw;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .programme-hero-block-1-container .title-row-1,
  .programme-hero-block-2-container .title-row-1 {letter-spacing: 7px;}
  .programme-hero-block-1-container .bottom-title,
  .programme-hero-block-2-container .bottom-title {letter-spacing: 5px;}
}

/**
 * 07.0 - FC-Programme Hero Block 2
 */


/**
 * 08.0 - FC-Special Feature Block 1
 */
.special-feature-block-1-container {z-index: 10;}
.special-feature-block-1-container .container-top-border {border-top: 5px solid;}
.special-feature-block-1-container h3 {padding: 100px 0 10px 0;}
.special-feature-block-s2-container {background-size: contain; background-repeat: no-repeat; margin: 60px calc(-.5 * var(--bs-gutter-x));}
.special-feature-block-s3 {padding-bottom: 30px;}
.RMDA .special-feature-block-s3 {padding-bottom: 60px;}
.special-feature-block-s3 h2:nth-child(2) {padding-top: 60px;}
.special-feature-block-s3 h2:nth-child(4) {padding-bottom: 60px;}
.special-feature-block-s3 .feature-title {font-family: 'Montserrat';font-weight: normal; letter-spacing: 20px;}
.special-feature-block-s3 .feature-title-shape-container {padding-left: calc(50% - 30px);}
.special-feature-block-s3 .feature-title-shape {margin:20px;background: #fff;height: 40px;position: relative;width: 5px;}
.special-feature-block-s3 .feature-title-shape:after {background: #fff;content: "";height: 5px;left: -17px;position: absolute;top: 18px;width: 40px;}
.special-feature-block-s4 {background-repeat: no-repeat; text-align: center; background-position: center 0%; background-size: contain;}
.special-feature-block-s4 img {position: relative; z-index: 10; width: 69%; bottom: -103px; padding-bottom: 100px;}

.special-feature-block-1-container .bottom-container {background-color: #000; overflow: hidden;}
.special-feature-block-1-container .bottom-container .background {background-size: 100%; background-position: top; background-repeat: no-repeat; margin-top: -15%; position: relative; z-index: 9;}
.special-feature-block-1-container .title {font-family: 'Montserrat';font-weight: normal; letter-spacing: 10px; font-size: 44px; padding-top: 45%; line-height: 1.4;}

.special-feature-block-s6 {padding-top: 60%; z-index: 10;}
.special-feature-block-s6 .col {max-width: 445px;}
.special-feature-block-s6 img {width: 60px; height: auto;}
.special-feature-block-s6 span {font-family: 'Montserrat';font-weight: normal; letter-spacing: 7px; font-size: 24px; padding-left: 50px;}
.special-feature-block-s6 .cross-shape-container {padding-left: calc(50% - 33px); margin: -28px 0 -10px 0;}
.special-feature-block-s6 .cross-shape {margin:20px;background: #fff;height: 20px;position: relative;width: 3px;}
.special-feature-block-s6 .cross-shape:after {background: #fff;content: "";height: 3px;left: -9px;position: absolute;top: 8px;width: 20px;}
.special-feature-block-s7 {padding-bottom: 50px; z-index: 10;}
.special-feature-block-s7 h3 {padding-top: 70px;}
.special-feature-block-s8 {padding: 0; position: absolute; bottom: 0; z-index: 9;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .special-feature-block-s4 img { bottom: -10.3vw; padding-bottom: 10vw;}
  .special-feature-block-1-container .title {font-size: 4.6vw;}
  .special-feature-block-s6 .col {max-width: 49vw;}
  .special-feature-block-s6 img {width: 6vw;}
  .special-feature-block-s6 span {font-size: 2.4vw; letter-spacing: 0.7vw; padding-left: 4vw;}
  .special-feature-block-s8 {top: 90vw; max-width: 170%; width: 170%; padding-left: calc(var(--bs-gutter-x) * .5);}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .special-feature-block-1-container h3 {padding-top: 60px;}
  .special-feature-block-s2-container {margin: 30px calc(-.5 * var(--bs-gutter-x));}
  .RMDA .special-feature-block-s3 {padding-bottom: 30px;}
  .special-feature-block-s3 h2:nth-child(2) {padding-top: 30px;}
  .special-feature-block-s3 h2:nth-child(4) {padding-bottom: 30px;}
  .special-feature-block-s3 .feature-title {letter-spacing: 12px;}
  .special-feature-block-s3 .feature-title-shape-container {padding-left: calc(50% - 20px);}
  .special-feature-block-s3 .feature-title-shape {margin:13px; height: 20px; width: 3px;}
  .special-feature-block-s3 .feature-title-shape:after {height: 3px;left: -9px;top: 8px;width: 20px;}
  .special-feature-block-1-container .title {letter-spacing: 6px; font-size: 24px;}
  .special-feature-block-s6 span {font-size: 3.4vw;}
  .special-feature-block-s6 .col {max-width: 54vw;}
  .special-feature-block-s6 .cross-shape-container {padding-left: calc(50% - 23px); margin: -18px 0 -19px 0;}
  .special-feature-block-s6 .cross-shape {height: 15px; width: 3px;}
  .special-feature-block-s6 .cross-shape:after {height: 3px; left: -6px; top: 6px; width: 15px;}
  .special-feature-block-s8 {top: 88vw; max-width: 250%; width: 250%;}
}

/**
 * 09.0 - FC-Special Feature Block 2
 */
.special-feature-block-2-container {z-index: 10;}
.special-feature-block-2-container .container-top-border {border-top: 5px solid;}
.special-feature-block-2-container h3 {padding: 100px 0 10px 0;}

.special-feature-block-2-container .special-feature-block-s2, .special-feature-block-2-container .special-feature-block-s4 {max-width: 196px; width: 22vw;}
.special-feature-block-2-container .special-feature-block-s4 img {max-width: 90%; padding-top: 30px;}
.special-feature-block-2-container .special-feature-block-s5 p {padding-bottom: 100px;}

@media only screen and (max-width: 575.98px) /* Under sm */ {
  .special-feature-block-2-container h3 {padding-top: 60px;}
  .special-feature-block-2-container .special-feature-block-s2, .special-feature-block-2-container .special-feature-block-s4 {max-width: 30vw; width: 30vw;}
  .special-feature-block-2-container .special-feature-block-s3 {padding-bottom: 0;}
  .special-feature-block-2-container .special-feature-block-s5 p {padding-bottom: 60px;}
}

/**
 * 10.0 - FC-Section Title
 */
.section-title-container .col-12 {padding: 80px 0;}
.section-title-container h2 {margin: 0; line-height: 1;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .section-title-container .col-12 {padding: 8vw 0;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .section-title-container .col-12 {padding: 13vw 0;}
}

/**
 * 11.0 - FC-Full Column Description
 */
.full-column-description-container .container {z-index: 10;}

/**
 * 12.0 - FC-Bottom Feature Block 1
 */
.bottom-feature-block-1-container .container {padding: 0; background-color: #000;}
.bottom-feature-block-1-container .content {position: absolute; bottom: 10%; padding: 40px; background-color: rgba(74,100,138,0.82);}
.DSBS .bottom-feature-block-1-container .container {background-color: #403163;}
.DSBS .bottom-feature-block-1-container .content {position: relative; background-color: #ae8c70; margin: 100px 0;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .DSBS .bottom-feature-block-1-container .content {margin: 8vw 0;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .bottom-feature-block-1-container .content {padding: 20px; position: relative; margin-top: -80px;}
}

/**
 * 13.0 - FC-Overview Hero Block 1
 */
.overview-hero-block-1-container .main-container {padding-left: 0 ;padding-right: 0;}
.overview-hero-block-1-container .hero-text-layer {position: absolute; top: 0; z-index: 10;}
.overview-hero-block-1-container .title-row-1 {color: #524674; padding-top: 80px; letter-spacing: 16px; padding-bottom: 20px; margin-bottom: 0; text-align: left; font-family: 'BlissPro'; font-weight: 300;}
.RMDA .overview-hero-block-1-container .title-row-1 {color:#4a648a; padding-top: 170px;}
.overview-hero-block-1-container .title-row-2 {opacity: 0; position: absolute; margin-bottom: 0;}
.overview-hero-block-1-container .progrmme-logo {height: 60px; width: auto;}
.overview-hero-block-1-container h1 { color: #000; padding-top: 20px; letter-spacing: 2px; font-size: 42px; font-weight: 300;}
.overview-hero-block-1-container .date-feature-block-container {z-index: 12; margin-left: 0; margin-right: 0;}
.overview-hero-block-1-container .date-feature-block {position: absolute; bottom: 0; background-size: cover;}
.overview-hero-block-1-container .date-feature-item {padding: 70px 0; font-weight: 500; top: 0; transition-property: top; transition-duration: 0.3s;}
.overview-hero-block-1-container .date-feature-item:hover {top: -5px;}
.overview-hero-block-1-container .date-box {width: 140px; max-width: 140px; height: 140px; padding:10px; background-color: #ae8c70;}
.RMDA .overview-hero-block-1-container .date-box {background-color: #a3d4ff; color: #000;}
.date-box .day {font-size: 64px;}
.date-box .month {font-size: 24px; letter-spacing: 7px; margin-top: -23px;}
.overview-hero-block-1-container .date-description {font-size: 22px; line-height: 1.2; letter-spacing: 2px; padding-left: 25px;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .overview-hero-block-1-container .title-row-1 {padding-top: 9vw; padding-bottom:2vw;}
  .RMDA .overview-hero-block-1-container .title-row-1 {padding-top: 15vw; padding-bottom:2vw;}
  .overview-hero-block-1-container .progrmme-logo {height: 7vw;}
  .overview-hero-block-1-container h1 {font-size: 4vw; padding-top: 2vw;}
  .overview-hero-block-1-container .date-feature-item {padding: 7vw 0;}
  .overview-hero-block-1-container .date-box {width: 14vw; max-width: 14vw; height: 14vw;}
  .date-box .day {font-size: 6.4vw; line-height: 1.4;}
  .date-box .month {font-size: 2.4vw; letter-spacing: 0.7vw; margin-top: -2.3vw;}
  .overview-hero-block-1-container .date-description {font-size: 2.2vw; line-height: 1.2; letter-spacing: 0.2vw; padding-left: 2.5vw;}

}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .overview-hero-block-1-container .title-row-1 {letter-spacing: 7px;}
  .date-box .day {line-height: 1.2;}
  .date-box .month {margin-top: -1.3vw;}
}
/**
 * 14.0 - FC-IMG Bg Full Column Description
 */
.img-bg-full-column-description-container .row {background-size: cover; background-position: center center;}
.img-bg-full-column-description-container .content {color: #fff; padding-top: 100px; padding-bottom: 150px;}
.DSBS .img-bg-full-column-description-container .content {padding-top: 150px; padding-bottom: 400px;}
.img-bg-full-column-description-container .content p {color: #fff;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .img-bg-full-column-description-container .content {padding-top: 13vw; padding-bottom: 15vw;}
  .DSBS .img-bg-full-column-description-container .content {padding-top: 15vw; padding-bottom: 40vw;}
}

/**
 * 15.0 - FC-Mutli Columns Feature Block
 */
.multi-columns-feature-block-container .container {background-color: #fff;}
.multi-columns-feature-block-container .title {padding-top: 70px;}
.multi-columns-feature-block-container .feature-container {padding-bottom: 40px;}
.multi-columns-feature-block-container .feature-item {width: 220px; max-width: 220px; padding: 30px;}
.multi-columns-feature-block-container .feature-image {width: 100%; padding-top: 100%; position: relative;}
.multi-columns-feature-block-container .feature-image img {position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
.multi-columns-feature-block-container .feature-title {color: #ae8c70; padding: 15px 0; font-size: 26px; font-weight: 500; letter-spacing: 3px; line-height: 1; height: 75px;}
.RMDA .multi-columns-feature-block-container .feature-title {color: #4a648a;}
.multi-columns-feature-block-container .feature-text p {line-height: 1.3; text-align: center;}

@media only screen and (max-width: 575.98px) /* Under sm */ {
  .multi-columns-feature-block-container .feature-title {font-size: 20px; padding: 15px 0; height: auto;}
}

/**
 * 16.0 - FC-Testimonial Block
 */
.testimonial-block {padding: 60px 0;}
.testimonial-block .title-tag {font-weight: 400; font-size: 25px; letter-spacing: 5px; line-height: 1;}
.testimonial-block .title-description {padding: 30px calc(var(--bs-gutter-x) * .5);}
.testimonial-block .testimonial-row {padding: 20px 0;}
.testimonial-block .testimonial-row img {max-width: 30px; height: auto;}
.testimonial-block .testimonial-row .open-quot {max-width: 30px; height: auto; padding: 0;}
.testimonial-block .testimonial-row .end-quot {transform: scale(-1,-1); padding: 0;}
.testimonial-block .testimonial-content p {display: inline;}
.testimonial-block .writer-name {text-align: right; font-size: 24px; letter-spacing: 3px; padding-top: 20px;}
.testimonial-block .writer-title {text-align: right; font-size: 18px; letter-spacing: 3px; line-height: 1.2;}
.testimonial-block-container .bottom-description p {padding: 50px 0; font-weight: bold;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .testimonial-block {padding: 6vw 0;}
  .testimonial-block .title-tag {font-size: 2.5vw; letter-spacing: 0.5vw;}
  .testimonial-block .title-description {padding: 3vw calc(var(--bs-gutter-x) * .5);}
  .testimonial-block .testimonial-row {padding: 2vw 0;}
  .testimonial-block .testimonial-row img {max-width: 3vw; }
  .testimonial-block .testimonial-row .open-quot {max-width: 3vw;}
  .testimonial-block .writer-name {font-size: 20px; letter-spacing: 2px; padding-top: 2vw;}
  .testimonial-block .writer-title {font-size: 16px; letter-spacing: 2px;}

}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .testimonial-block-container .logo {padding-bottom: 10px;}
  .testimonial-block-container .bottom-description p {padding: 10vw 0;}
  .testimonial-block .writer-name {font-size: 16px; letter-spacing: 2px;}
  .testimonial-block .writer-title {font-size: 12px; letter-spacing: 2px;}

}
/**
 * 17.0 - FC-Detail Content Feature Block
 */
.dcfb .content-container {background-color: #fff;}
.dcfb .content {padding: 50px 0;}
.dcfb .bottom-border {border-bottom: solid 4px #000;}
.dcfb a {color: #546b8e;}
.dcfb a:hover {color: #546b8e; text-decoration: underline;}
.dcfb p, .dcfb ul li {text-align: left;}
.dcfb h3 {padding-bottom: 30px;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .dcfb .content {padding: 5vw 0;}
  .dcfb h3 {padding-bottom: 3vw;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .dcfb .content {padding: 8vw 0;}
}
/**
 * 17.1 - FC-Detail Content Feature Block - Title + Description
 */

/**
 * 17.2 - FC-Detail Content Feature Block - Content + Feature Box
 */
.dcfb-content-feature-box-container .feature-box-container { padding:0 25px; margin-bottom: 40px;}
.dcfb-content-feature-box-container .feature-box {min-height: 140px; border: solid 2px #000; border-radius: 20px; padding: 30px 15px;}
.dcfb-content-feature-box-container .feature-box .title {padding-bottom: 0;}
.dcfb-content-feature-box-container .description-1 {margin-bottom: 40px;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .dcfb-content-feature-box-container .feature-box-container { padding:0 2.5vw; margin-bottom: 4vw;}
  .dcfb-content-feature-box-container .feature-box {padding: 3vw 1.5vw;}
  .dcfb-content-feature-box-container .description-1 {margin-bottom: 4vw;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .dcfb-content-feature-box-container .feature-box {min-height: 28vw;}
  .dcfb-content-feature-box-container .feature-box-container h3 {font-size: 4.8vw;}
}
/**
 * 17.3 - FC-Detail Content Feature Block - Two Column Content
 */
 @media only screen and (max-width: 991.98px) /* Under lg */ {
   .dcfb-two-column-container .description-1 {margin-bottom: 2rem;}
 }

/**
 * 17.4 - FC-Detail Content Feature Block - Image Gallery
 */
.dcfb-image-gallery-container .image-box {width: 100%; padding: 100% 20px 0 20px; position: relative;}
.dcfb-image-gallery-container .image-box img {position: absolute; bottom:0; right: 0; left: 0;}
.dcfb-image-gallery-container .image-container p {font-weight: bold; padding-top: 20px;}

/**
 * 18.0 - FC-Full Image Block
 */
.full-image-block-container .container {padding-right: 0; padding-left: 0;}


/**
 * 19.0 - FC-Section Title with Bg
 */
.section-title-with-bg-container .container{padding-right: 0; padding-left: 0;}
.section-title-with-bg-container .title {position: absolute; padding-top: 21%;}


/**
 * 20.0 - FC-FAQ
 */
.faq-container .faq-block {padding: 50px 0;}
.faq-container .faq-section {padding: 20px 0;}
.faq-container h3 {margin-top: 15px; margin-bottom: 25px; padding:0 30px; border-left: solid 2px #fff;}
.faq-container .question {margin:0.5rem 0; margin-left: 70px; cursor: pointer; letter-spacing: 1px;}
.faq-container .answer-box {background-color: #e0e0e1; margin-left: 30px;}
.faq-container .answer {padding: 10px 20px;}
.faq-container .marker {position: absolute; top: 5px; width: 0; height: 0; border-style: solid; border-width: 8px 0 8px 14px; border-color: transparent transparent transparent #e0e0e1; left: -40px; transition: 0.35s ease;}
.faq-container [aria-expanded="true"] .marker {transform: rotate(90deg);}
.faq-container a {color: #546b8e;}
.faq-container a:hover {text-decoration: underline;}

@media only screen and (max-width: 575.98px) /* Under sm */ {
  .faq-container .faq-block {padding: 5vw 0;}
  .faq-container .faq-section {padding: 2vw 0;}
  .faq-container h3 {margin-top: 1.5vw; margin-bottom: 2.5vw; padding:0 3vw;}
  .faq-container .question {font-size: 12px; margin-left: 10vw;}
  .faq-container .answer-box {margin-left: 3vw;}
  .faq-container .marker {left: -6.5vw; border-width: 6px 0 6px 9px;}
}

/**
 * 21.0 - FC-Curriculum Block
 */
.curriculum-block-container .curriculum-block {padding-top: 40px; padding-bottom: 80px;}
.curriculum-block-container h2 {color: #000; padding-bottom: 20px}
.DSBS .curriculum-block-container h2 {padding-top: 30px;}
.curriculum-block-container h3 {padding-top: 15px; padding-bottom: 40px;}
.curriculum-block-container .non-collapse-part {border-bottom: solid 3px #fff; padding: 30px 0;}
.curriculum-block-container .non-collapse-part.b-border {border-bottom: 0px;}
.curriculum-block-container .non-collapse-part h3 {color: #4a648a; padding:0;}
.DSBS .curriculum-block-container .non-collapse-part h3 {color: #403163;}
.curriculum-block-container .mode-name {padding: 0;}
.curriculum-block-container .mode-image {max-width: 100px;}
.curriculum-block-container .mode-button {padding: 5px 15px; width: 180px; border-radius: 20px; cursor: pointer;}
.curriculum-block-container .mode-button p {color: #fff; margin:0; text-align: center;}
.curriculum-block-container .mode-button .marker {width: 0; height: 0; border-style: solid; border-width: 6px 0 6px 11px; border-color: transparent transparent transparent #fff; transition: .5s ease; font-size: 0; margin-left: 10px; margin-top: -5px;}
.curriculum-block-container .non-collapse-part [aria-expanded="true"] .marker {transform: rotate(90deg);}
.curriculum-block-container .collapse-part {background-color: #fff;}
.curriculum-block-container .collapse-part-o-box {border: solid 2px #000; margin:50px 0; padding: 30px;}
.curriculum-block-container .top-row-container, .curriculum-block-container .course-container {border-bottom: solid 4px #000;}
.curriculum-block-container .collapse-part h3 {padding-top: 40px; margin:0;}
.curriculum-block-container .collapse-part a {color: unset;}
.curriculum-block-container .collapse-part a:hover {text-decoration: underline;}
.curriculum-block-container .collapse-part .row-container {padding-bottom: 40px;}
.curriculum-block-container .collapse-part .title div {padding-top: 15px; padding-bottom: 15px;}
.curriculum-block-container .collapse-part .title h3 {color:#4a648a; padding-top: 0; padding-bottom: 20px;}
.DSBS .curriculum-block-container .collapse-part .title h3 {color:#ae8c70;}
.curriculum-block-container .collapse-part .title .column-3 h3 {min-width: 150px;}
.curriculum-block-container .collapse-part .remark {padding-top: 15px;}
.curriculum-block-container .collapsing {transition:height 1s ease;}
.curriculum-block-container .course-ball-container {padding:15px;}
.curriculum-block-container .course-ball {border-radius: 50%; padding-top: 100%; cursor: pointer;}
.curriculum-block-container .course-ball .course-code {color: #fff; position: absolute; top: 31%; padding:0 5px;}
.close-button {position: absolute; right: 5%; top: 4%; width: 32px; height: 32px; opacity: 0.3; cursor: pointer; z-index: 30;}
.close-button:hover {opacity: 1;}
.close-button:before, .close-button:after {position: absolute; left: 15px; content: ' '; height: 33px; width: 2px; background-color: #fff;}
.close-button:before {transform: rotate(45deg);}
.close-button:after {transform: rotate(-45deg);}
.pop-up-container {display: none; position: fixed; width: 100vw; height: 100vh; top:0; left:0; background-color: rgba(0,0,0,0.1); z-index: 998;}
.pop-up-detail {display: none; position: fixed; width: 80vw; height: 80vh; top: 10vh; left: calc(0.5 * ( 100vw - 800px) ); background-color: rgba(0,0,0,0.9); padding: 50px; color: #fff; z-index: 999; max-width: 800px;}
.pop-up-detail p {color: #fff; font-size: 22px;}
.pop-up-container.display-block, .pop-up-detail.display-block {display: block;}
.disable-scroll {overflow:hidden;}
.enable-scroll {overflow-y:scroll;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .curriculum-block-container .curriculum-block {padding-top: 4vw; padding-bottom: 8vw;}
  .curriculum-block-container h2 {padding-bottom: 2vw}
  .DSBS .curriculum-block-container h2 {padding-top: 7vw;}
  .curriculum-block-container h3 {padding-top: 1.5vw; padding-bottom: 4vw;}
  .curriculum-block-container .mode-image {padding-bottom: 20px;}
  .curriculum-block-container .collapse-part-o-box {margin:5vw 0; padding: 3vw;}
  .curriculum-block-container .collapse-part h3 {padding-top: 4vw;}
  .curriculum-block-container .collapse-part .row-container {padding-bottom: 4vw;}
  .curriculum-block-container .collapse-part .title div {padding-top: 1.5vw; padding-bottom: 1.5vw;}
  .curriculum-block-container .collapse-part .title h3 {padding-bottom: 2vw;}
  .curriculum-block-container .collapse-part .title .column-3 h3 {min-width: unset;}
  .curriculum-block-container .collapse-part .remark {padding-top: 1.5vw;}
  .curriculum-block-container .course-ball-container {padding: 1.5vw;}
  .curriculum-block-container .course-ball .course-code {padding:0 0.5vw; font-size: 2.2vw;}
  .pop-up-detail {left: 10vw; padding: 5vw;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .curriculum-block-container .mode-button {width: 150px;}
  .curriculum-block-container .mode-button .marker {margin-top: -3px;}
  .curriculum-block-container .course-ball .course-code {font-size: 3vw; top: 27%;}
  .pop-up-detail {padding: 10vw 5vw 5vw 5vw;}
  .pop-up-detail p {font-size: 14px;}
}
/**
 * 22.0 - FC-Events and Sharing Block
 */
.eands-container .eands-row {padding-bottom: 120px; padding-top: 20px;}
.eands-container .story-col {padding:calc(var(--bs-gutter-x) * .5);}
.eands-container .story {padding-top: 100%; width: 100%; position: relative; background-size: cover; background-position: center center; transition: all .35s;}
.eands-container .story:hover {opacity: .7; cursor: pointer;}
.eands-container .story-type {position: absolute; top: 15px; left: 15px; height: 15px; width: 15px; border-radius: 50%; display: inline-block;}
.eands-container .photo-sharing {background-color: #68a8c3;}
.eands-container .events {background-color: #0081ab;}
.eands-container .sharings {background-color: #8e2c69;}
.eands-container .miscellaneous {background-color: #697b62;}
.eands-container .announcements {background-color: #8e623f;}
.eands-container .video {background-color: #e5a923;}
.eands-container .remark {padding-top: 15px;}
.eands-container .remark div {display: inline-block; font-family: 'Calibri'; color: #fff; font-size: 16px;}
.eands-container .remark .dot {height: 15px; width: 15px; border-radius: 50%; display: inline-block; margin-right: 10px; margin-left: 20px;}

.eands-container .pop-up-detail {background-color:rgba(0,0,0,0.85); padding-top: 100px;}
.eands-container .social-icon-box {padding-top: 50px; padding-bottom: 20px;}
.eands-container .social-icon-box a:hover {opacity: .7;}

@media only screen and (max-width: 991.98px) /* Under lg */ {
  .eands-container .eands-row {padding-bottom: 12vw; padding-top: 2vw;}
  .eands-container .story-col {padding:1.2vw;}
  .eands-container .story-type {position: absolute; top: 1.5vw; left: 1.5vw; height: 1.5vw; width: 1.5vw;}
  .eands-container .remark {padding-top: 1.5vw;}
  .eands-container .remark .dot {height: 1.5vw; width: 1.5vw; margin-right: 1vw; margin-left: 2vw;}
  .eands-container .pop-up-detail {padding-top: 17vw; width: 90vw; height: 90vh; left: 5vw; top: 5vh;}
  .eands-container .social-icon-box {padding-top: 5vw; padding-bottom: 2vw;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  .eands-container .remark div {font-size: 12px;}
}

/**
 * 23.0 - FC-Submission Form
 */
form .forminator-row {font-size: 16px; color: #000; letter-spacing: 1px;}
form .forminator-row .forminator-label {color: #546b8e; display: inline-block; width: 50%;}
h4[id^="forminator-checkbox-group-"].forminator-label {width: 100%;}
form .forminator-row .forminator-radio-inline {padding-right: 20px;}
form .forminator-row .forminator-radio-label, form .forminator-row .forminator-checkbox-label {padding-left: 10px;}
form .forminator-row .forminator-input {display: inline-block; width: 50%; border: 1px solid #888484; line-height: 3; border-radius: 20px; padding-left: 20px;}
form .forminator-row .forminator-error-message {text-align: right; color: #546b8e; display: block;}
form .forminator-row .forminator-file-upload {width: 50%; display: inline-block;}
form .forminator-row .forminator-checkbox {display: block; line-height: 3;}
form .forminator-row #text-4 {top: -35px;}
form .forminator-row #text-4 .forminator-label {font-size: 16px; width: auto; padding-right: 20px;}
form .forminator-row #text-4 .forminator-input {width: auto; line-height: 2; border-radius: 15px;}
form .forminator-row-last .forminator-field {text-align: center;}
form .forminator-row button {line-height: 2; color: #fff; letter-spacing: 2px; font-size: 16px; background-color: #000; padding: 3px 40px; border-radius: 20px; border: #000;}

@media only screen and (max-width: 767.98px) /* Under md */ {
  form .forminator-row .forminator-label {width: 100%;}
  form .forminator-row .forminator-input {width: 100%;}
  form .forminator-row .forminator-error-message {text-align: left;}
}
@media only screen and (max-width: 575.98px) /* Under sm */ {
  form .forminator-row {font-size: 12px;}
  form .forminator-row #text-4 {top: -25px;}
  form .forminator-row #text-4 .forminator-label {font-size: 14px;}
}