@charset "UTF-8";

html,body{
	width:100%; 
	height:100%;
	min-height:100vh; 
	margin:0;
	padding:0;
	font-size:16px;
	color:#17557F; 
	background:#F8F4E9;
	font-family:'Poppins', 'Quicksand', sans-serif;
	font-weight: 500;
	scroll-behavior: smooth;
	
	
	text-size-adjust:none;
	-webkit-text-size-adjust:none;
	-moz-text-size-adjust:none;
	-ms-text-size-adjust:none;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}

img{ border:none; padding:0; margin:0;  }
a{ font-size:inherit; color:inherit; text-decoration:none; }
body, html, div, select, input, textarea, img, span{ font-family:'Poppins', 'Quicksand', sans-serif; }


h1,h2,h3{ font-weight:inherit; font-size:inherit; line-height:inherit; margin:0; padding:0; display:inherit; }
p{ margin:0; }

input{ background-color:transparent; border:none; color:#17557F;  }
input:focus, textarea:focus{ outline:none; color:#17557F; }
input:-webkit-autofill, input:-webkit-autofill:focus, input:-webkit-autofill:hover {
    background:#111; -webkit-box-shadow:inset 5px 5px 3px rgba(17,88,111, 0.1); box-shadow:inset 5px 5px 3px rgba(17,88,111, 0.1); color:#17557F; -webkit-text-fill-color:#17557F !important;}
button{border:none; text-decoration: none; background-color:transparent; margin:0; padding:0}
img, video{vertical-align: bottom}


/*
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
-o-user-select: none;
user-select: none;
*/


/*others*/
.clear{ clear:both; }
sup{vertical-align: super;font-size: 0.5em;}
::selection {}

.all-container{margin:auto;}
.inner-container{position: relative; width: 90%; margin: auto;}
button{position:relative; display:inline-block; font-family:'Quicksand'; font-weight: 600; font-size:1.25em; cursor:pointer; color:#ffffff; padding: .75em 1.5em; background-color:#F47245; border-radius: 2em; transition: background-color 150ms linear;}
button:hover{ background-color:#D85F3F; transition: background-color 200ms linear; }
.bt-green{background-color:#88A139}
.bt-green:hover{background-color:#70862C}
.bt-ligreen{background-color:#B1C437}
.bt-ligreen:hover{background-color:#A3AF33}
.bt-blue{background-color:#3085A2}
.bt-blue:hover{background-color:#24667D}
.bt-pblue{background-color:#42AFD4}
.bt-pblue:hover{background-color:#379DC0}
/*others*/


/*text*/
.txt-huge{font-family:'Poppins'; font-size:4em; font-weight: 700;line-height:1.25;}
.txt-large{font-family:'Quicksand'; font-size:2em; font-weight: 500;}
.txt-big{font-family:'Poppins';  font-size:3em; font-weight: 700;line-height:1.25;}
.txt-title{font-family:'Poppins'; font-size:1.25em; font-weight: 500;}
.txt-sub{font-family:'Quicksand'; font-size:1em; font-weight: 500;}
.txt-para{font-family:'Quicksand'; font-weight: 500; line-height:1.5; }
.txt-small{font-family:'Quicksand'; font-weight: 300; line-height:1.5; font-size:0.8em}

.txt-popins{font-family:'Poppins';}
.txt-lightblue{color:#42AFD4;}
.txt-thin{font-weight: 400;}
.txt-bold{font-weight: 600;}
/*text*/

/*header*/
.header-all{position: fixed; top:0; width:100%; padding: .5em 0em; display: flex;justify-content: space-between; align-items: center; background-color:rgba(248,244,233, .8); z-index:999; backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px); }
.header-main{position:absolute; display: flex;top:50%; left:50%; transform: translate(-50%,-50%); }
.header-main > button{padding: 0; background-color: transparent; margin:0 1em; color:#17557F; transition:color 200ms linear;}
.header-main > button:hover, .header-main > button.active{color:#42AFD4;}
.header-logo{height:6em; }
.header-right{position:absolute; display: flex;top:50%; right:0; transform: translate(0,-50%); align-items: center;}
.header-right > div { margin-left: 1.5em}
.lang-bar button {font-size: 1em; padding: 0; background-color: transparent; margin-left:1em; color:#D3D3DA}
.lang-bar button.active {color:#42AFD4; transition:transform 200ms linear;}
/*header*/

/*footer*/
footer{background-color:#E9F2F9}
.link-container .inner-container{width: 80%; display:flex; flex-wrap: wrap; justify-content: space-between; padding: 3em 0 4em 0;}
footer .txt-small br{display:none;}	
.footer-copyright{background-color:#ffffff; text-align: center; padding: 2em 0 ;}
.link-info .txt-title{margin-bottom:1em;}
.link-info > div:nth-child(2) > div {position:relative; display:flex; align-items: center; margin-bottom: 1em;}
.link-info > div:nth-child(2) > div img{width:1.5em; margin-right:.75em}
.brand-logo{position: relative; display:flex;align-items: center;}
.brand-logo > div{margin-top:2.25em;}
.footer-border{height:5em; padding: 0 .5px; background-color: #C7D2DA; margin: 0 1.5em;}
.brand-logo img{width:7em;}
.social-icon{position: relative; display:flex; align-items: center;}
.soical-icon img{width:5em;}
/*footer*/

/*mobile header*/
.menu-icon-container{ position:absolute; width:1.8em; height:1.5em; right:0; top:50%; transform:translate(0,-50%); cursor:pointer;z-index:5; display: none;   }
.menu-rectangle{ position:absolute; width:100%; padding-bottom:3px; background-color:#17557F; border-radius: 3em}
.menu-rectangle:nth-child(1){ top:0; }
.menu-rectangle:nth-child(2){ top:50%; transform:translate(0,-50%); transition:transform 200ms  }
.menu-rectangle:nth-child(3){ bottom:0;  }
.menu-rectangle:nth-child(4){ top:50%; transform:translate(0,-50%); opacity:0;  transition:transform 200ms, opacity 0ms 200ms }
.menu-icon-container.active .menu-rectangle { color:#17557F}
.menu-icon-container.active .menu-rectangle:nth-child(1){ opacity:0; }
.menu-icon-container.active .menu-rectangle:nth-child(2){ transform:translate(0,-50%) rotate(45deg); }
.menu-icon-container.active .menu-rectangle:nth-child(3){ opacity:0;  }
.menu-icon-container.active .menu-rectangle:nth-child(4){ opacity:1; transform:translate(0,-50%) rotate(-45deg); transition:transform 200ms, opacity 0ms }
.menu-bar-container .logo-menu-container {  width:90%; max-width:1024px; position:fixed; height:5em;  left:50%; top:0;  transform:translate(-50%,0%); }

.menu-mobile{position: fixed; top: 7em; left:0; width: 100%; height: 100vh; background-color: #F8F4E9;
  z-index: 9999; overflow-y: auto;display:none; text-align: center;}
.menu-mobile > div{position:relative; height:calc(100vh - 7em - 5em); }
.menu-mobile .txt-huge{padding:3rem 0 ;}
.menu-mobile.active{display:block;}
.menu-mobile > div .social-icon{position: absolute; left:50;bottom:0; transform: translate(-50%,0);display:inline-flex;}
.menu-mobile > div .lang-bar{position: absolute; left:50;bottom:10em; transform: translate(-50%,0);display:inline-flex;}
.menu-mobile .social-icon img{width: 6em;}
.menu-mobile .social-icon > div:nth-child(1){margin-right:2rem}
.menu-mobile .lang-bar button{font-size:3em;}
.menu-mobile .lang-bar button:nth-child(1){margin-left:0}
/*mobile header*/

/*home hero kv*/
.first-se{padding-top:10em;}
.filter-mobile{position:absolute;top:0; width:100%;height:100%; background-color:rgba(248,244,233,.6); display:none; backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px); }
.home-hero-container{position: relative; width:100%; padding-bottom:3em; overflow: hidden; background-image: url("../img/hero-kv.png");background-repeat:no-repeat;background-size: 60%; background-position:110% bottom}
.home-hero-container .inner-container{position: relative; width:90%; }
.home-hero-kv{position: absolute; left:50%; width:60%;  display:block; }
.home-hero-kv img{position:absolute; width:100%;  }
.home-hero-txt{width:55%; padding-bottom:2em;}
.home-hero-txt .txt-huge{padding:1rem 0;}
.home-hero-txt .txt-large{padding-bottom:1.5rem;}
.home-hero-tags{position:relative; background-color:rgba(255,255,255, .8); display:inline-flex;border-radius: 2em;padding:2em;flex-direction: row;}
.home-hero-tags img{width:3em; margin-right:1em;}
.home-hero-tags > div{display: flex; margin-right:2em;align-items: center; line-height:1.25em}
.home-hero-tags > div:last-child{margin-right:0;}
/*projects*/

/*home about*/
.home-about-container, .about-team-container{position:relative; width: 100%; background-color: #BADA55; padding: 5em 0 8em 0;overflow: hidden; }
.home-about-container > div img, .about-team-container > div img{position:absolute; left: 50%; bottom:-1px; transform: translate(-50%,0); width: 120%; }
.home-about-container .inner-container, .about-team-container .inner-container{width: 60%; margin:auto; text-align: center;}
.home-about-container .txt-big, .about-team-container .txt-big{margin-bottom: 1rem}
.home-about-container .txt-large, .about-team-container .txt-large{margin-bottom: 1.5rem}
/*home about*/

/*home vision*/
.home-vision-container{position:relative; width: 100%; padding: 3em 0 6em 0; }
.home-vision-container .inner-container{width: 70%; margin:auto; text-align: center;}
.vision-card-container{position: relative; width:100%; display:flex;color:#ffffff; margin:auto; justify-content: center;}
.vision-card{position: relative; background-color: #F7A5BC; width:25%; max-width:15em; padding: 4em 2em; border-radius: 2em; margin-right:3em;min-height:30vh}
.vision-card img{width:6em; }
.vision-card > div:nth-child(1){margin-bottom:1rem;}
.vision-card > div:nth-child(2) .txt-large{line-height: 1em;  margin-bottom:1rem;}
.vision-card-container > div:nth-child(2){background-color: #F47245}
.vision-card-container > div:nth-child(3){background-color: #928DC3;margin-right:0}
.home-vision-container .txt-big{margin-bottom: 1.5rem;}
/*home vision*/

/*home highlight*/
.home-highlight-container{position:relative; width:100%;  display:flex;justify-content: space-between; color: #ffffff; overflow: hidden}
.home-highlight-container .txt-sub{margin-bottom:1rem;}
.home-highlight-container .txt-big{line-height: 1.25; margin-bottom:2rem;}
.home-highlight-container .txt-para{margin-bottom:2rem;}
.home-highlight-container > div{position:relative; width:100%;}
.home-highlight-container > div:nth-child(1){position:relative; width:50%; align-items: center}
.home-highlight-container > div:nth-child(1) .inner-container{postion:absolute; padding: 4em 0; width:80%; display:block;}
.home-highlight-container > div .txt-large{font-family:'Poppins';}
.home-highlight-container > div{position:relative; width:50%; height: auto; background-color: #42AFD4; }
.home-highlight-container > div:nth-child(2){position:relative; width:50%;background-repeat: no-repeat; background-size: cover;}
/*home highlight*/

/*home program*/
.home-program-container{position:relative; width: 100%; }
.home-program-upper{position:relative; padding: 3em 0; background-color:#5AC2C7}
.home-program-container .home-program-upper .inner-container{position: relative; display:flex; width:80%; flex-wrap:wrap; align-items: center;justify-content:space-between;}
.home-program-container .inner-container>div{width:50%;}
.home-program-container .inner-container>div .txt-large{padding-bottom:1rem}
.home-program-container .inner-container>div:nth-child(1){width:45%; margin-right:2rem}

.home-program-bottom{position:relative; width:100%; display: flex;  }
.home-program-bottom .program-intro{position:relative; width:50%; align-items: center; margin:auto;border-right: 1px #17557F solid; border-bottom: 1px #17557F solid; height:42em}
.program-intro .program-intro.no-bottom{border-bottom:0px #17557F solid;}
.home-program-bottom .program-intro .txt-large{margin: 2rem 0 1rem 0;}
.home-program-bottom .inner-container{position:relative; padding: 6em 0 4em 0; width:50%;margin:auto; text-align: center;}
.home-program-bottom .inner-container > div{position:relative; width:100%; }
.home-program-bottom .inner-container > div:nth-child(1){position:relative; width:100%;}
/*home program*/

/*home cta*/
.home-cta-container{position:relative; width: 100%; padding: 4em 0 8em 0; overflow:hidden; }
.home-cta-container > div:nth-child(2) img{position:absolute; left: 50%; bottom:-1px; transform: translate(-50%,0); width: 120%; }
.home-cta-container .inner-container{position:relative; display:flex;flex-wrap:wrap; width:65%; justify-content: space-between; align-items: center;}
.home-cta-container .inner-container > div:nth-child(1){position:relative; width:75%;display:flex; flex-wrap:wrap;align-items: center;}
.home-cta-container .inner-container > div:nth-child(1) img{width:8em;margin-right:2em;}
.home-cta-container .inner-container > div:nth-child(1) >div:nth-child(2){position: relative;}
.home-cta-container .inner-container > div:nth-child(1) >div:nth-child(2) .txt-title{font-family:'Quicksand'; margin-top:.5em;}
/*home cta*/


/*about*/
.about-banner-container{position: relative; width:100%; height: 468px;; background-image: url("../img/about-banner.png"); background-color: rgba(0,0,0,.3); background-repeat: no-repeat; margin:7em auto 0 auto;background-blend-mode: multiply;align-items: center; background-position: center;}
.about-banner-container .inner-container{position:relative;width:90%; height:inherit;}
.about-banner-txt{position:absolute; top:50%; left:50%; width:80%; display: inline-block;transform: translate(-50%,-50%); color:#ffffff; text-align: center;text-shadow: 2px 2px 10px rgba(0, 0, 0, .2);}
.about-banner-txt .txt-large{margin-top:1rem;}

.about-story-container{position:relative; width:100%;padding:4em 0;margin:auto;}
.about-story-container .inner-container{position:relative; width:80%; display:flex;}
.about-story-container .inner-container > div{width:50%}
.border{width:100%; height:1px; background-color: #17557F}
.about-team-container{background-color:#F7A5BC}
/*about*/

/*program*/
.about-banner-container.program{background-image: url("../img/program-banner.png"); background-color: rgba(0,0,0,.3); }
.program-details-container{position:relative; width:100%;padding:4em 0;margin:auto;}
.program-details-container .inner-container{position:relative; width:80%; display:flex; flex-wrap:wrap;}
.program-details-container .inner-container > div{width:50%}
.program-details-container img{height:9em}
.program-details-container .txt-para{margin: 1em 0 2em 0;}
.about-team-container{background-color:#F7A5BC}
.sub-program{margin-top:2em;}
.sub-program .txt-para{margin:.5em 0 2em 0; }
.program-details-container button{margin-right:.5em;}
/*program*/

/*scroll*/
.fadein-ele{ transform: translateY(10em); opacity: 0; transition: 500ms ease;}
.fadein-ele.one{ transition: 500ms ease .25s;}
.fadein-ele.two{ transition: 500ms ease .5s;}
.inView {opacity: 1; -webkit-transform: translateY(0px) rotate(0deg) translateZ(0); transform: translateY(0px) rotate(0deg) translateZ(0);}
.field-mobile > div:nth-last-child(1) .dot{margin-bottom:0em}
.field-mobile > div .dot.inactive{opacity:0.2; transition: all ease 300ms;}
/*scroll*/


/*gallery*/
.gallery{position:relative; width:100vw;  overflow:hidden; height:25vw; max-height:400px  }
.gallery-inner{ position:relative;  width:400%; display:flex; height:100%; }
.gallery-inner > div{ position:relative; width:8%;  height:100%; background-position:center; background-repeat: no-repeat; background-size:cover;  /*-webkit-transform: translateZ(0);*/}
.gallery-inner > div:nth-child(3n+2){ width:9%; }
.gallery-inner{ animation-name:ani-gallery; animation-duration:18s; animation-timing-function:linear; animation-iteration-count:infinite; animation-fill-mode:forwards }

@keyframes ani-gallery{
0%  { transform:translate(0%,0%); }
100%{ transform:translate(-25%,0%); }	
}
@keyframes ani-gallery-m{
0%  {transform:translate(0%,0%); }
100%{transform:translate(-50%,0%); }
}	
/*gallery*/



@media only screen and (min-width:0px) and (max-width:1024px) {
	
.home-highlight-container{flex-wrap: wrap-reverse;}
.home-highlight-container > div{width:100%;  }
.home-highlight-container > div:nth-child(1){width:100%; }
.home-highlight-container > div:nth-child(2){ width:100%;}
	
.filter-mobile{display: inherit;}
.home-hero-container{background-size: 80%; background-position:120% bottom}
.home-hero-container{background-size: 90%; background-position:center bottom}
.home-hero-txt{width:100%; padding-bottom:2em;}
/*hero*/
	
/*text*/
.txt-huge{font-size:3em;}
/*text*/
	
/*header*/
.header-main, .header-right{display: none;}
.menu-icon-container{display:inherit;}
/*header*/
	
/*vision*/
.vision-card-container{flex-wrap:wrap;}
.vision-card{width:100%;max-width:inherit;padding: 4em 2em; margin:0 0 3rem 0;}
/*vision*/
	
/*program*/
.program-details-container img{height:6em; margin-bottom:2em;}
.program-details-container .inner-container > div{width:100%}
.home-about-container .inner-container, .about-team-container .inner-container{width: 80%; margin:auto; text-align: center;}
.home-program-bottom .program-intro{height:36em}
.home-program-bottom .inner-container{padding: 4em 0 2em 0; width:70%;margin:auto; text-align: center;}
/*program*/

.about-story-container .inner-container{display:flex; flex-wrap: wrap;}
.about-story-container .inner-container > div{width:100%}
.home-about-container .inner-container, .about-team-container .inner-container{width: 80%; }
.about-story-container .txt-big{margin-bottom: 3rem}
	
/*cta*/
.home-cta-container .inner-container{position:relative; display:flex; width:80%; justify-content: space-between; align-items: center;}
.home-cta-container .inner-container {width:80%;display:flex; flex-wrap:wrap;align-items: center; text-align: center;}
.home-cta-container .inner-container > div:nth-child(1){width:100%;display:flex; flex-wrap:wrap;align-items: center;margin-bottom:2em; }
.home-cta-container .inner-container > div:nth-child(1) >div{width:100%; }
.home-cta-container .inner-container > div:nth-child(2){ width:100%;}
.home-cta-container .inner-container > div:nth-child(1) img{width:12em;margin:0 0 1em 0; }
/*cta*/
}

@media only screen and (min-width:0px) and (max-width:768px) { 
.home-hero-container{background-size: 110%; background-position:center bottom}


	
/*footer*/
.link-container .inner-container{width: 80%; display:flex; flex-wrap: wrap; justify-content: space-between; padding: 3em 0 4em 0;}
.footer-copyright{background-color:#ffffff; text-align: center; padding: 2em 0 ;}
.link-info{position:relative; width:100%; margin-bottom:2em;}
.link-info .txt-title{margin-bottom:1em;}
.link-info > div:nth-child(2) > div {position:relative; display:flex; align-items: center; margin-bottom: 1em;}
.link-info > div:nth-child(2) > div img{width:1.5em; margin-right:.75em}
.brand-logo{position: relative; display:flex;align-items: center;}
.brand-logo > div{margin-top:2.25em;}
.footer-border{height:5em; padding: 0 .5px; background-color: #C7D2DA; margin: 0 1.5em;}
.brand-logo img{width:7em;}
.social-icon{position: relative; display:flex; align-items: center;}
.soical-icon img{width:5em;}
/*footer*/	
	
.home-hero-tags{flex-wrap:wrap;margin: auto;justify-content: center}
.home-hero-tags > div{width:calc(50% - 2em);}
.home-hero-tags > div:nth-child(even){margin-right:0em;}
.home-hero-tags > div:nth-child(1), .home-hero-tags > div:nth-child(2) {margin-bottom:2em;}
.home-hero-tags br{display: none;}

.home-program-container .home-program-upper .txt-big{margin-bottom:2rem;}
.home-program-container .inner-container>div{width:100%;}
.home-program-container .inner-container>div .txt-large{padding-bottom:2rem}
.home-program-container .inner-container>div:nth-child(1){width:100%; margin-right:0rem}
	
.home-program-bottom{position:relative; width:100%; display: flex; flex-wrap:wrap; }
.home-program-bottom .program-intro{ width:100%; height:auto; border-right: 0;}
.home-program-bottom .inner-container{padding: 6em 0 4em 0; }
.home-program-bottom .program-intro.mobile-last{border-bottom:0}
}

@media only screen and (min-width:0px) and (max-width:680px) { 
.home-hero-container{background-size: 170%; }
.first-se{padding-top:9em;}

}

@media only screen and (min-width:0px) and (max-width:640px) { 
/*program*/
.program-details-container button:nth-child(1){margin-bottom:1em;}
/*program*/

/*tag*/
.home-hero-tags{padding:1.5em;}
.home-hero-tags img{width:2.25em; margin-right:1em;}
.home-hero-tags > div:last-child{margin-bottom:0;}
.home-hero-tags.txt-para{font-size:1.05em}
/*tag*/
}



@media only screen and (min-width:0px) and (max-width:479px) {
.txt-huge{font-size:2.5em;}
.menu-mobile{top: 5.5em; }
.menu-mobile .txt-huge{padding:2rem 0 ;}
.menu-mobile .social-icon img{width: 3.5em;}
.menu-mobile .lang-bar button{font-size:1.5em;}
.menu-mobile > div .lang-bar{bottom:6em; }
.menu-mobile > div .social-icon{bottom:-1em; }
	
.txt-large{font-size:1.5em; }
.about-story-container .txt-big{margin-bottom: 1.5rem}

.first-se{padding-top:7em;}
/*header*/
.header-logo{height:4.5em; }
/*header*/

/*tag*/
.home-hero-tags{padding:1.25em;}
.home-hero-tags img{width:2em; margin-right:1em;}
/*tag*/
}



@media only screen and (min-width:0px) and (max-width:375px) {

}


@media only screen and (min-width:0px) and (max-width:320px) {
	

}

@media only screen and (min-width:1025px) and (max-width:1299px) {
.home-hero-container{background-size: 75%; background-position:120% bottom}
.home-vision-container .inner-container{width: 80%; }
	
.home-cta-container .inner-container {width:80%;display:flex; flex-wrap:wrap;align-items: center; text-align: center;}
.home-cta-container .inner-container > div:nth-child(1){width:100%;display:flex; flex-wrap:wrap;align-items: center;margin-bottom:2em; }
.home-cta-container .inner-container > div:nth-child(1) >div{width:100%; }
.home-cta-container .inner-container > div:nth-child(2){ width:100%;}
.home-cta-container .inner-container > div:nth-child(1) img{width:12em;margin:0 0 1em 0; }
	
/*program*/
.program-details-container button:nth-child(1){margin-bottom:1em;}
/*program*/
}

@media only screen and (min-width:1300px) and (max-width:1599px) {
	
}


@media only screen and (min-width:1600px) and (max-width:1920px) {

}