body {
  --bs-primary: #1CA9CC;
  --bs-primary-darken: #178CA9;
  --bs-primary-rgb: 28, 169, 204;
  --bs-accent: #EAF7FA;
  --bs-accent-rgb: 234, 247, 250;
  --bs-orange: #F35B04;
  --bs-orange-darken: #d75104;
  --bs-orange-rgb: 243, 91, 4;
  --bs-link-color: #1CA9CC;
  --bs-link-color-rgb: 28, 169, 204;
  --bs-link-hover-color: #F35B04;
  --bs-link-hover-color-rgb: 243, 91, 4;
  --bs-border-radius: 0.188rem;
  --bs-border-radius-sm: 0.125rem;
  --bs-border-radius-lg: 0.25rem;
  --bs-border-radius-xl: 0.5rem;
  --bs-border-radius-xxl: 1rem;
  transition: all 0.5s ease-in-out;
}

#loaderSpin {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 999;
  background-color: var(--bs-body-bg);
}

.lang-zh .lang-toggles .lang-button-zh,
.lang-en .lang-toggles .lang-button-en {
  pointer-events: none;
  background-color: var(--bs-white);
  color: var(--bs-secondary);
}

/*
.btn {
  --bs-btn-border-radius: 0;
}*/

.btn-rounded {
  --bs-btn-border-radius: 30rem;
}

.btn-primary {
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-bg: var(--bs-primary-darken);
  --bs-btn-hover-border-color: var(--bs-primary-darken);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --bs-btn-disabled-bg: var(--bs-primary);
  --bs-btn-disabled-border-color: var(--bs-primary);
}

.btn-orange {
  color: var(--bs-white);
  --bs-btn-bg: var(--bs-orange);
  --bs-btn-border-color: var(--bs-orange);
  --bs-btn-hover-bg: var(--bs-orange-darken);
  --bs-btn-hover-border-color: var(--bs-orange-darken);
  --bs-btn-active-bg: var(--bs-orange);
  --bs-btn-active-border-color: var(--bs-orange);
  --bs-btn-disabled-bg: var(--bs-orange);
  --bs-btn-disabled-border-color: var(--bs-orange);
  --bs-btn-active-color: var(--bs-white);
}

.btn-orange:hover {
  color: var(--bs-btn-active-color);
}

.text-orange {
  color: var(--bs-orange);
}

.bg-accent {
  background-color: var(--bs-accent);
}

.bd-mode-toggle {
  z-index: 999;
  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.5);
}

.bd-mode-toggle.btn-group .btn:first-child:not(:hidden) {
  border-top-left-radius: var(--bs-border-radius);
  border-bottom-left-radius: var(--bs-border-radius);
}

.lang-zh .bd-mode-toggle .lang-button-zh,
.lang-en .bd-mode-toggle .lang-button-en {
  display: none;
}

.bg-photo {
  background-color: var(--bs-accent);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}

/* not working on iOS safari */
@supports not (-webkit-overflow-scrolling: touch) {
  .bg-photo.bg-photo-fixed {
    background-attachment: fixed;
  } 
}

.bg-masked {
  position: relative;
}

.bg-masked > * {
  z-index: 1;
  position: relative;
}

.bg-masked::before {
  content: '';
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 0;
}

.bg-masked.bg-masked-dark::before {
  background-color: rgba(var(--bs-dark-rgb), .5);  
}

.bg-masked.bg-masked-light::before {
  background-color: rgba(var(--bs-light-rgb), .5);
}

.form-control:focus {
  border-color: var(--bs-primary);
  box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb),.25);
}

.carousel-caption.carousel-caption-corner {
  left: 0;
  bottom: 0;
  right: unset;
  text-align: left;
  padding: .25rem .5rem;
  margin: 1rem;
  background-color: rgba(var(--bs-body-color-rgb),.5);
  border-radius: var(--bs-border-radius);
  opacity: .75;
}

.header-sticky {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  padding-top: 1rem;
  -webkit-transition: all .75s ease 0s;
  -moz-transition: all .75s ease 0s;
  -o-transition: all .75s ease 0s;
  transition: all .75s ease 0s;
  z-index: 5;
}

.navbar-toggler .fa-solid::before {
  content: '\f00d';
}

.navbar-toggler.collapsed .fa-solid::before {
  content: '\f0c9';
}

.header-sticky .navbar .nav-item .nav-link{
  padding: .5rem 1.5rem;
  border-radius: 3rem;
}

.header-sticky .navbar .nav-item .nav-link:hover {
  background-color: rgba(255, 255, 255, .05);
}

.header-sticky .navbar .nav-item .nav-link.active {
  background-color: rgba(255, 255, 255, .15);
}

.header-sticky.header-pinned {
  position: fixed;
  background-color: var(--bs-primary);
  box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.5);
  padding-top: 0;
}

.header-sticky.header-pinned .navbar {
  padding: 1rem 0;
}

.header-sticky .navbar-toggler:focus {
  box-shadow: none;
}

.swing-in-top-fwd {
  -webkit-animation: swing-in-top-fwd 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
  animation: swing-in-top-fwd 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

.layout-home main .hero {
  height: 100vh;
  position: relative;
}

.layout-home main .hero .hero-overlay-text {
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  width: 80%;
  height: 100%;
  z-index: 4;
}

.layout-home main section {
  padding: 6rem 0;
  min-height: 100vh;
}

.layout-home main section .section-heading {
  color: var(--bs-primary);
  font-weight: 100;
  text-transform: uppercase;
}

.bg-masked-dark .section-heading {
  color: var(--bs-white);
}
    
.layout-home main section .section-sub-heading {
  color: var(--bs-orange);
}

.layout-home main section .section-heading:after {
  content: '';
  border-bottom: 6px solid var(--bs-accent);
  width: 3rem;
  display: block;
  margin: 1rem auto;
}

.layout-home main section hr.section-hr {
  margin: 3rem 0;
  border-top: 1px solid var(--bs-primary);
}

.layout-home main .partner-logo {
  max-height: 128px;
}

.layout-home main .program-tabs .nav-program-tabs .nav-link {
  padding: .5rem 1rem;
  color: var(--bs-body-color);
  border-radius: 30rem;
}

.layout-home main .program-tabs .nav-program-tabs .nav-link.active {
  color: var(--bs-white);
  background-color: var(--bs-orange);
}

.layout-home main .topic-list .topic-item {
  color: var(--bs-white);
  text-align: center;
}

.layout-home main .topic-list .topic-item:not(:last-child) {
  border-bottom: 1px solid var(--bs-accent);
}

.layout-home main .topic-list .topic-item:hover {
  background-color: var(--bs-white);
  color: var(--bs-primary);
}

.layout-home main .topic-list .topic-item:hover .topic-heading {
  color: var(--bs-orange);
}

.layout-home main .card.key-date-item,
.layout-home main .card.news-item {
  border-color: transparent;
  box-shadow: 0 20px 27px 0 rgb(0 0 0 / 5%);
  border-radius: 30rem;
}

.layout-home main .card.key-date-item .card-body,
.layout-home main .card.news-item .card-body {
  padding: 1rem 2rem;
}

.layout-home main .card.news-item .card-body h6 {
  color: var(--bs-primary);
}

.layout-home main .card.news-item .card-body p {
  color: var(--bs-secondary);
}

.layout-home main .card.news-item:hover {
  background-color: var(--bs-primary);
}

.layout-home main .card.news-item:hover .card-body h6,
.layout-home main .card.news-item:hover .card-body p {
  color: var(--bs-white);
}

.layout-home main section .accordion-item {
  --bs-half-opacity: 0.8;
  background-color:rgba(var(--bs-body-bg-rgb), var(--bs-half-opacity));
  backdrop-filter: blur(10px);
}

.layout-home main section .accordion-button:focus {
  box-shadow: none;
}

.layout-home main section .accordion-button:not(.collapsed) {
  box-shadow: none;
  background-color: var(--bs-transparent);
  color: var(--bs-accordion-btn-color);
  font-weight: bold;
}

.layout-post .container {
  max-width: 800px;
}

.layout-post .post-hero-area {
  height: 50vh;
  margin-bottom: -50vh;
}

.layout-post .mini-nav {
  height: 15vh;
  position: relative;
}

.layout-post main {
  position: relative;
  margin-bottom: 3rem;
}

.layout-post main .post-title-area {
 height: 35vh;
 margin-bottom: 2rem;
}

.layout-post main .post-title-area h1 {
  margin-bottom: -6px;
}


/* ----------------------------------------------
* Generated by Animista on 2024-5-17 8:42:25
* Licensed under FreeBSD License.
* See http://animista.net/license for more info. 
* w: http://animista.net, t: @cssanimista
* ---------------------------------------------- */

/**
* ----------------------------------------
* animation swing-in-top-fwd
* ----------------------------------------
*/
@-webkit-keyframes swing-in-top-fwd {
  0% {
    -webkit-transform: rotateX(-100deg);
    transform: rotateX(-100deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 0;
  }

  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 1;
  }
}

@keyframes swing-in-top-fwd {
  0% {
    -webkit-transform: rotateX(-100deg);
    transform: rotateX(-100deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 0;
  }

  100% {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    -webkit-transform-origin: top;
    transform-origin: top;
    opacity: 1;
  }
}

@media (min-width: 768px) {
  .layout-home main .topic-list .topic-item:not(:nth-child(2n)) {
    border-right: 1px solid var(--bs-accent);
  }

  .layout-home main .topic-list .topic-item:nth-last-child(-n+2) {
    border-bottom: 0;
  }

  .layout-post main .post-title-area h1 {
    margin-bottom: -7px;
  }
  
}

@media (min-width: 992px) {
  .layout-post main .post-title-area h1 {
    margin-bottom: -8px;
  }
}

@media (min-width: 1200px) {
  .layout-home main .topic-list .topic-item:not(:nth-child(3n)) {
    border-right: 1px solid var(--bs-accent);
  }

  .layout-home main .topic-list .topic-item:nth-child(3n) {
    border-right: 0;
  }

  .layout-home main .topic-list .topic-item:nth-last-child(-n+3) {
    border-bottom: 0;
  }

  .layout-post main .post-title-area h1 {
    margin-bottom: -9px;
  }
}