[id*="custom-html"]{padding:0 !important; position:relative;}
.zyx-paragraph--top-hero {padding: 0 !important;}
.zyx-paragraph--top-hero .row {min-height: 500px; align-items: center;}
.text-show {display: block !important;}
.text-blue {color: #00b2ff !important;}
#report-section .border-adjusted:hover {background-color: transparent!important;}

.expand-content {background: #fff;}
.open-close-button {width: 2em; height: 2em; margin: auto; margin-bottom: -1rem; font-size: 1.2rem; position: relative; -moz-transition: 0.5s; -o-transition: 0.5s; -webkit-transition: 0.5s; transition: 0.5s; -moz-transform: translateZ(0); -webkit-transform: translateZ(0); transform: translateZ(0); cursor: pointer;}
.open-close-button:before {content: ""; display: block; position: absolute; background-color: #00b2ff; width: 80%; height: 6%; left: 10%; top: 47%;}
.open-close-button:after {content: ""; display: block; position: absolute; background-color: #00b2ff; width: 6%; height: 80%; left: 47%; top: 10%;}
.open-close-button.open {-moz-transform: rotate(225deg); -ms-transform: rotate(225deg); -webkit-transform: rotate(225deg); transform: rotate(225deg);}
.timeline-content {display: none; min-height: 1000px;}

.close-button {width: 2em; height: 2em; margin: 1rem auto; font-size: 1.2rem; position: relative; -moz-transition: 0.5s; -o-transition: 0.5s; -webkit-transition: 0.5s; transition: 0.5s; -moz-transform: translateZ(0); -webkit-transform: translateZ(0); transform: translateZ(0); -moz-transform: rotate(225deg); -ms-transform: rotate(225deg); -webkit-transform: rotate(225deg); transform: rotate(225deg);  cursor: pointer;}
.close-button:before {content: ""; display: block; position: absolute; background-color: #00b2ff; width: 80%; height: 6%; left: 10%; top: 47%;}
.close-button:after {content: ""; display: block; position: absolute; background-color: #00b2ff; width: 6%; height: 80%; left: 47%; top: 10%;}

.timeline{position:relative; height:1500px;}
.middle-line{text-align:center; position:absolute; top:0; left:0; right:0; margin:0 auto; width: 2px; height:1500px; background: #555;}
.line-year{width: 100px; border: 1px dashed #444;}
.milestoneRight{position: absolute; right: 10px; width: 50%;}
.milestoneLeft{position: absolute; left: 10px; width: 50%;}
.milestone1998{top:0;}
.milestone1999{top:100px;}
.milestone2003{top:360px;}
.milestone2011{top:500px;}
.milestone2014{top:720px;}
.milestone2015{top:750px;}
.milestone2016{top:900px;}
.milestone2017{top:1200px;}
.timeline-milestone .text-year{font-size: 26px; font-weight: 500; text-align: center;}
.timeline-milestone .text-desc{font-size:16px; text-align: left;}
.timeline-milestone .desc-content{background: #fff; border: 1px solid #000; color: #000; text-align: center; padding: 1rem; width: 300px;}
.blue-bg-00b2ff {background: #00b2ff !important; border: 1px solid #00b2ff !important; color: #fff !important;}
.blue-bg-009aff {background: #009aff !important; border: 1px solid #009aff !important; color: #fff !important;}
.blue-bg-0079ff {background: #0079ff !important; border: 1px solid #0079ff !important; color: #fff !important;}
.blue-bg-004fee {background: #004fee !important; border: 1px solid #004fee !important; color: #fff !important;}
.blue-bg-003eab {background: #003eab !important; border: 1px solid #003eab !important; color: #fff !important;}

.timeline-milestone .dot span {font-size: 20px; color: #000;}
.milestoneRight .desc-left-content {position: absolute; left: 35%; top: 15%;}
.milestoneLeft .desc-right-content {position: absolute; right: 35%; top: 15%;}
.timeline-milestone .text-desc ul{padding: 0 1rem; margin: 0;}
.timeline-milestone .text-desc ul li{list-style: disc;}

#scholarship-section {padding-bottom: 0}
#scholarship-section .context-html > *:last-child {margin-bottom: 0;}
#scholarship-section blockquote {border:none; margin-top: 0 !important; margin-bottom: 0 !important;}
#scholarship-section h3{display: none;}
.scholarship-section {position: relative; height: 750px;}
.scholarship-section .img-box {position: absolute; bottom: 0; left: -20%;}
.scholarship-section .desc {width: 50%; margin-left: 50%;}
.school-logo-box img {width: 80%;}
.small-caption {font-size: 12px; font-weight: bold; margin-top: 5px;}

.left-side-image.d-flex, .right-side-image.d-flex{width: 100%; height: 500px; padding: 0; margin: 0;}
.left-side-image.d-flex .img-box img, .right-side-image.d-flex .img-box img{object-fit: cover; width: 100%; height: 500px;}
.left-side-image .img-box {position: absolute; left: 0; overflow-y: hidden; width: 50%;}
.right-side-image .img-box{position: absolute; right: 0; overflow: hidden; width: 50%;}
.left-side-image .desc, .right-side-image .desc{padding: 0; width: 45%;}
.left-side-image .desc{margin-left: 54%;}

.sponsor-box {position: relative;}
.sponsor-box img {display: block; width: 100%; height: 400px; object-fit:cover !important;}
.sponsor-box .overlay {position: absolute;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.5);overflow: hidden; width: 100%;height: 50%;vertical-align:center; transition: .5s ease;padding:1rem;}
.caption {color: #fff; display:flex;}
.caption h5{align-items: center!important; margin-top:0!important;color:#fff !important;}
.description p, .description ul{color:#fff; line-height: 1.4rem; margin: 0;}

#report-section, #contact-us-section {background-position: bottom;}
#contact-us-section {padding: 50px 0 !important;}
#report-section h2, #contact-us-section h2{display: none;}
#report-section .col-md-5, #contact-us-section .col-md-5{width: 80%;}
#contact-us-section .col-md-5 .zyx-paragraph__cta {display: block!important;}

#scholar-section h3, #rising-sun-section h3, #development-fund-section h3, #academia-section h3{display: none; margin-top: 0;}

.js-scroll {opacity: 0; transition: opacity 500ms;}
.js-scroll.scrolled {opacity: 1;}
.scrolled.fade-in {animation: fade-in 1s ease-in-out both;}
.scrolled.fade-in-bottom {animation: fade-in-bottom 1s ease-in-out both;}
.scrolled.slide-left {animation: slide-in-left 1s ease-in-out both;}
.scrolled.slide-right {animation: slide-in-right 1s ease-in-out both;}

/* ----------------------------------------------
 * Generated by Animista on 2021-2-11 23:32:31
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

@keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-100px);
    transform: translateX(-100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(100px);
    transform: translateX(100px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
    transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes fade-in {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@media (max-width:1100px) {
    #scholarship-section {margin-top: -10px;}
}

@media (max-width:900px) {
    .milestoneRight .desc-left-content {left: auto; right: 0;}
    .milestoneLeft .desc-right-content {right: auto; left: 0;}
    .scholarship-section {flex-direction: column-reverse; height: auto;}
    .scholarship-section .img-box {position: relative; left: 0; margin: auto;}
    .scholarship-section .desc {width: 90%; margin: auto; padding-bottom: 2rem;}
    .left-side-image.d-flex, .right-side-image.d-flex {height: auto; margin: auto; width: 90%;}
    .left-side-image.d-flex .img-box img, .right-side-image.d-flex .img-box img {height: 400px;}
    .left-side-image .img-box, .right-side-image .img-box {width: 100%; position: relative;}
    .left-side-image .desc, .right-side-image .desc {width: 100%; margin-left: auto;}
    .rising-sun-section .d-flex, .academia-section .d-flex{flex-direction: column-reverse;}
    #scholar-section, #rising-sun-section, #development-fund-section, #academia-section {padding: 0 !important;}
    .sponsor-box .description {display: block;} 
    .sponsor-section.d-flex{flex-direction: column;}
    .sponsor-section .col.me-2{margin-right: auto; margin-bottom: 1rem;}

}

@media (max-width:650px) {
	.line-year{width:auto;}
	.sponse-box{margin-bottom:10px;}
}

@media (max-width:450px) {
    .timeline, .middle-line {height: 1800px;}
    .timeline-milestone .desc-content {width: 150px;}
    .timeline-milestone .text-year {font-size: 20px;}
    .timeline-milestone .text-desc {font-size: 15px;}
    .timeline-milestone img {display: none;}
    .milestone1999 {top: 200px;}
    .milestone2003 {top: 400px;}
    .milestone2011 {top: 550px;}
    .milestone2014 {top: 800px;}
    .milestone2015 {top: 1000px;}
    .milestone2016 {top: 1250px;}
    .milestone2017 {top: 1500px;}
    .pr-section {flex-direction: column-reverse;}
}