html {padding:0;margin:0;min-height:100%;height:100%;overflow-y:scroll;}

body {
	margin:0;padding:0;min-height:100%;background:#fff;
	font-family:'Roboto', sans-serif;
	font-size:18px;color:#333;
}
body *{line-height:1.25em;}

img{border:none;vertical-align:top;max-width:100%;max-height:100%;}
a{color:#2E71E8;text-decoration:none;}

/*header*/
.skin-header{padding-top:100px;}
#header {
	position:fixed;z-index:2000;top:0;left: 0;right:0;
	box-sizing:border-box;margin:0 auto;padding:0 30px;max-width:1920px;height:100px;
	background: rgba(255,255,255,.99);
	box-shadow: 0 3px 9px rgba(0,0,0,.16);
	display:flex;justify-content:space-between;align-items:center;
}

#header a.logo{
	flex:0 1 auto;display:flex;align-items:center;justify-content:flex-start;
	color:#333;font-family:'Kanit', sans-serif;font-weight:300;font-size:20px;
}
#header a.logo > img{margin-right:10px;width:62px;}
#header a.logo > span > span{display:block;}
#header a.logo > span > span:first-child{font-size:1.6em;text-transform:uppercase;}

#headerMenu{flex:0 1 auto;align-self:flex-end;}
#headerMenu ul.nav{list-style:none;margin:0;padding:0;font-family:'Kanit', sans-serif;font-size:18px;text-transform:uppercase;}
#headerMenu ul.nav li{margin-left:50px;display:inline-block;vertical-align:bottom;}
#headerMenu ul.nav li a{display:block;position:relative;padding:5px 0 15px 0;color:#707070;}
#headerMenu ul.nav li a:after{
	content:'';display:block;position:absolute;left:50%;bottom:0;width:0;height:6px;background:#6EEC9C;opacity:0;
	transition:left 0.2s, width 0.2s, opacity 0.2s;
}
#headerMenu ul.nav li a:hover,
#headerMenu ul.nav li a.selected{color:#333;}
#headerMenu ul.nav li a:hover:after,
#headerMenu ul.nav li a.selected:after{left:0;width:100%;opacity:1;}

#btnToggleMobileMenu{display:none;}

@media(max-width:1920px) {
	#headerMenu ul.nav li{margin-left:4vw;margin-left:2.5vw;}
}
@media(max-width:1024px) {
	.skin-header{padding-top:80px;}

	#header{padding:0 15px;height:80px;}

	#header a.logo{font-size:14px;}
	#header a.logo > img{width:55px;}
}
@media(max-width:900px) {
	.skin-header{padding-top:70px;}

	#header{height:70px;}
	#header.mobile-menu-showed:before{content:'';display:block;position:fixed;background:rgba(0,0,0,0.5);top:70px;left:0;right:0;bottom:0;}

	#header a.logo > img{width:45px;}

	#headerMenu{
		position:fixed;box-sizing:border-box;top:70px;right:-100%;margin:0;width:95vw;max-width:360px;bottom:0;overflow-y: auto;
		background:#fff;box-shadow:-2px 10px 10px rgba(0, 0, 0, 0.16);border-top:1px solid #ccc;border-left:1px solid #ccc;
		transition:right 0.4s;
	}
	#headerMenu ul.nav li{display:block;margin:20px;}
	#headerMenu ul.nav li a{padding-bottom:10px;}
	#header.mobile-menu-showed #headerMenu{right:0;}

	#btnToggleMobileMenu{flex:0 1 auto;display:block;width:40px;height:23px;position:relative;cursor:pointer;}
	#btnToggleMobileMenu > span{
		display:block;position:absolute;left:0;width:100%;height:3px;background:#333333;
		visibility:visible;opacity:1;transform-origin:50% 50%;
		transition:top 0.2s 0.2s, opacity 0.2s 0.2s, transform 0.2s, width 0.2s;
	}
	#btnToggleMobileMenu > span.i1{top:0;}
	#btnToggleMobileMenu > span.i2{top:50%;}
	#btnToggleMobileMenu > span.i3{top:100%;width:50%;}
	#btnToggleMobileMenu:hover > span.i3{width:100%;}

	#header.mobile-menu-showed #btnToggleMobileMenu > span{transition:top 0.2s, opacity 0.2s, transform 0.2s 0.2s, width 0.2s;}
	#header.mobile-menu-showed #btnToggleMobileMenu > span.i2{opacity:0;}
	#header.mobile-menu-showed #btnToggleMobileMenu > span.i1{top:50%;transform:rotate(45deg);}
	#header.mobile-menu-showed #btnToggleMobileMenu > span.i3{top:50%;width:100%;transform:rotate(-45deg);}
}
@media(max-width:400px) {
	#header{padding:0 10px;}
	#header a.logo > img{width:35px;}
}

/*main*/
.skin-main{margin:0 auto;max-width:1920px;background:#f9f9f9;overflow:hidden;}

.section-preview{position:relative;max-height:650px;min-height:500px;overflow:hidden;background:url(/i/preview.png) 50% 50%/cover no-repeat;}
.section-preview:before{content:'';display:block;padding-top:35%;}
.section-preview .preview-text{
	position:absolute;top:50%;transform:translateY(-50%);right:50%;margin-right:-2.2em;text-align:right;
	font-family:'Kanit', sans-serif;font-size:70px;color: #FFFFFF;
	text-shadow: 0 6px 12px rgba(0, 0, 0, 0.44);text-transform: uppercase;
}
.section-preview .preview-text .green-txt{color:#CFF889;}
/*
.section-preview:after{
	content:'';display:block;position:absolute;top:0;left:0;right:0;bottom:0;
	background: linear-gradient(135deg, rgba(255,255,255,0) 40%,rgba(255,255,255,0.8) 50%,rgba(255,255,255,0) 60%);
	transition:transform 1.2s 0.2s cubic-bezier(0.33, 1, 0.68, 1);
	transform:translateX(100%);
}
.section-preview:not(.transition-on):after{transform:translateX(-100%);}*/


@media(max-width:1920px) {
	.section-preview .preview-text{font-size:3.65vw;}
}
@media(max-width:1500px) {
	.section-preview .preview-text{font-size:55px;}
}
@media(max-width:1024px) {
	.section-preview{max-height:500px;min-height:0;}
	.section-preview:before{padding-top:50%;}
	.section-preview .preview-text{font-size:5.5vw;}
}

.section-slogan{
	display:flex;justify-content:center;align-items:center;text-align:center;box-sizing:border-box;padding:15px;
	background:url(/i/slogan-bgr.png) 50% 50%/cover no-repeat;
	color:#fff;font-family:'Kanit', sans-serif;font-weight:300;font-size:55px;line-height:1.1em;text-shadow:0 3px 6px rgba(0, 0, 0, 0.16);
	min-height:4.55em;
	transition:color 0.6s 0.3s, text-shadow 0.6s 0.3s;
}
.section-slogan:not(.transition-on){color:transparent;text-shadow:none;}
@media(max-width:1200px) {
	.section-slogan{font-size:4.58vw;}
}
@media (max-width:600px){
	.section-slogan{font-size:24px;}
}

.section{max-width:1500px;margin:0 auto;padding:50px 20px;position:relative;overflow:hidden;}
.section > a.anchor{position:absolute;top:-50px;left:50%;visibility:hidden;}
.section > .section-title{margin-bottom:0.5em;font-family:'Kanit', sans-serif;font-weight:200;font-size:80px;text-align:center;}
.section > .section-title > span{display:block;font-weight:300;font-size:0.4em;}
.section > .section-text{margin:0 auto;max-width:900px;line-height:2em;text-align:center;}
.section.v1 > .section-title > span{color:#333333;}
.section.v2 > .section-title > span{color:#15CCB3;}
.section.v3 > .section-title > span{color:#2E71E8;}
.section.v4 > .section-title > span{color:#2E71E8;}
@media(max-width:1200px) {
	.section > .section-title{font-size:6.66vw;}
}
@media(max-width:900px) {
	.section{padding:30px 20px;}
	.section > .section-title{font-size:50px;}
}


.gaims-items{margin:10px 0;display:flex;justify-content:space-between;align-items:stretch;flex-wrap:wrap;}
.gaims-items > .item{
	box-sizing:border-box;flex:0 1 calc(33.33% - 8px);margin:30px 0;padding:30px;
	background:#fff 100% 0/25% auto no-repeat;box-shadow: 0 0 20px rgba(0, 0, 0, 0.07);border-radius:10px;
	color:#1165C1;font-size:16px;
}
.gaims-items > .item.i1{background-image:url(/i/technology-icon.svg);}
.gaims-items > .item.i2{background-image:url(/i/business-icon.svg);}
.gaims-items > .item.i3{background-image:url(/i/human-capital-icon.svg);}
.gaims-items > .item > .title{font-size:32px;font-family:'Kanit', sans-serif;font-weight:500;min-height:3em;}
.gaims-items > .item > .text ul{margin:0;padding:0;list-style:none;}
.gaims-items > .item > .text ul li{margin:0 0 10px 0;padding:0 0 0 25px;background:url(/i/check.svg) 0 5px/15px auto no-repeat;}

/*transition gaims-items*/
.gaims-items {perspective:50cm;}
.gaims-items > .item{transform-origin:50% 0;backface-visibility:hidden;transition:transform 1s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.5s;}
.gaims-items > .item:not(.transition-on){transform:rotateX(90deg);opacity:0;}

@media(max-width:1200px) {
	.gaims-items > .item{padding:20px;}
	.gaims-items > .item > .title{font-size:28px;}
}
@media(max-width:1024px) {
	.gaims-items > .item > .title{font-size:24px;}
}
@media(max-width:900px) {
	.gaims-items{display:block;}
	.gaims-items > .item{max-width:550px;margin:30px auto;background-size:90px auto;}
	.gaims-items > .item > .title{font-size:28px;}
}
@media(max-width:600px) {
	.gaims-items > .item > .title{font-size:24px;}
}

.gaims-facts{margin:0 auto;max-width:1200px;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;}
.gaims-facts > .item{
	box-sizing:border-box;flex:0 1 50%;padding:15px;font-family:'Kanit', sans-serif;font-weight:300;font-size:24px;
	display:flex;justify-content:flex-start;align-items:center;
}
.gaims-facts > .item .icon{flex:0 0 auto;width:65px;height:65px;margin-right:10px;background:50% 50%/contain no-repeat;}
.gaims-facts > .item.i1 .icon{background-image:url('/i/globe-icon.svg');}
.gaims-facts > .item.i2 .icon{background-image:url('/i/apple-icon.svg');}
.gaims-facts > .item.i3 .icon{background-image:url('/i/diamond-icon.svg');}
.gaims-facts > .item.i4 .icon{background-image:url('/i/star-icon.svg');}
.gaims-facts > .item .label{flex:0 1 auto;}

/*transition gaims-facts*/
.gaims-facts > .item{transition:transform 1s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.5s;}
.gaims-facts > .item.i1:not(.transition-on),
.gaims-facts > .item.i3:not(.transition-on){transform:translateX(-100px);opacity:0;}
.gaims-facts > .item.i2:not(.transition-on),
.gaims-facts > .item.i4:not(.transition-on){transform:translateX(100px);opacity:0;}

@media(max-width:1200px) {
	.gaims-facts > .item{font-size:20px;}
	.gaims-facts > .item .icon{width:45px;height:45px;}
}
@media(max-width:1024px) {

}
@media(max-width:900px) {
	.gaims-facts{display:block;max-width:550px;}
}

.df-items{overflow:hidden;}
.df-items > .item{display:flex;justify-content:flex-start;align-items:center;margin:0 -20px;}

.df-items > .item .c1{
	flex:0 1 30%;box-sizing:border-box;padding:10px 20px;
	font-size:28px;font-family:'Kanit', sans-serif;font-weight:500;
	display:flex;justify-content:flex-start;align-items:center;
	transition:transform 1s 0s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.5s 0s;
}
.df-items > .item .c1 img{flex:0 0 auto;margin-right:20px;width:3.6em;}
.df-items > .item .c1 span{flex:0 1 auto;}

.df-items > .item .c2{flex:0 1 70%;display:flex;justify-content:flex-start;align-items:center;}
.df-items > .item .c21{
	flex:0 1 43%;box-sizing:border-box;padding:10px 20px;font-size:20px;line-height:1.5em;
	transition:transform 1s 0.3s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.5s 0.3s;
}
.df-items > .item .c22{
	flex:0 1 57%;box-sizing:border-box;padding:10px 20px;font-size:16px;line-height:1.8em;
	transition:transform 1s 0.6s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.5s 0.6s;
}

.df-items > .item:not(.transition-on) .c1,
.df-items > .item:not(.transition-on) .c21,
.df-items > .item:not(.transition-on) .c22{transform:translateY(100px);opacity:0;}


@media (max-width:1200px){
	.df-items > .item .c1{font-size:24px;}
}
@media (min-width:1025px){
	.df-items > .item{margin:40px -20px;}
	.df-items > .item:not(:last-child){margin-bottom:80px;/*double margin*/}

	.df-items > .item .c2{position:relative;}
	.df-items > .item .c2:before{content:'';display:block;position:absolute;top:0;left:0;width:3px;height:100%;background:#333;transition:height 1s 0.3s;}
	.df-items > .item .c2:after{content:'';display:block;position:absolute;top:0;left:43%;width:3px;height:100%;background:#333;transition:height 1s 0.6s;}
	.df-items.v2 > .item .c2:before,
	.df-items.v2 > .item .c2:after{background:#38D9C3;}
	.df-items.v3 > .item .c2:before,
	.df-items.v3 > .item .c2:after{background:#349EE8;}
	.df-items > .item:not(.transition-on) .c2:before,
	.df-items > .item:not(.transition-on) .c2:after{height:0;}
}
@media (max-width:1024px) and (min-width:901px){
	.df-items > .item{margin:30px -20px;}
	.df-items > .item:not(:last-child){margin-bottom:60px;/*double margin*/}

	.df-items > .item .c1{flex:0 1 40%;}
	.df-items > .item .c2{flex:0 1 60%;display:block;position:relative;}

	.df-items > .item .c2:before{content:'';display:block;position:absolute;top:0;left:0;width:3px;height:100%;background:#333;transition:height 1s 0.3s;}
	.df-items.v2 > .item .c2:before{background:#38D9C3;}
	.df-items.v3 > .item .c2:before{background:#349EE8;}
	.df-items > .item:not(.transition-on) .c2:before{height:0;}
}
@media (max-width:900px) and (min-width:601px){
	.df-items > .item{margin:20px -20px;}
	.df-items > .item:not(:last-child){margin-bottom:40px;/*double margin*/}

	.df-items > .item .c1{flex:0 1 40%;font-size:20px;}
	.df-items > .item .c2{flex:0 1 60%;display:block;position:relative;}
	.df-items > .item .c21{font-size:18px;}

	.df-items > .item .c2:before{content:'';display:block;position:absolute;top:0;left:0;width:3px;height:100%;background:#333;transition:height 1s 0.3s;}
	.df-items.v2 > .item .c2:before{background:#38D9C3;}
	.df-items.v3 > .item .c2:before{background:#349EE8;}
	.df-items > .item:not(.transition-on) .c2:before{height:0;}
}
@media (max-width:600px){
	.df-items > .item{margin:10px -20px;padding:10px 0;display:block;position:relative;}
	.df-items > .item .c1{font-size:20px;}
	.df-items > .item .c2{display:block;}
	.df-items > .item .c21{font-size:18px;}

	.df-items > .item:not(:last-child):after{content:'';display:block;position:absolute;bottom:0;left:0;height:3px;width:100%;background:#333;transition:width 1s 0.8s;}
	.df-items.v2 > .item:after{background:#38D9C3;}
	.df-items.v3 > .item:after{background:#349EE8;}
	.df-items > .item:not(.transition-on):after{width:0;}
}


/*projects*/
.projects{box-sizing:border-box;max-width:1300px;width:100%;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;}
.projects .project{
	flex:0 1 46%;margin:40px 0;
	display:flex;justify-content:flex-start;align-items:flex-start;
	line-height:1.5em;
}
.projects .project > div {flex:0 1 auto;}
.projects .project .check-icon {
	flex:0 0 auto;background:url(/i/check-icon.svg) 50% 50%/contain no-repeat;
	font-size:60px;width:1em;height:1em;margin-right:0.5em;
	transition: transform 0.8s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.4s; transition-delay:0s;
}
.projects .project .title{font-size:20px;line-height:1.5em; transition: transform 0.8s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.4s; transition-delay:0.2s;}
.projects .project .date{margin-top:5px;font-size:20px; transition: transform 0.8s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.4s; transition-delay:0.4s;}

.projects .project:not(.transition-on) .check-icon,
.projects .project:not(.transition-on) .title,
.projects .project:not(.transition-on) .date{transform:translateY(20px);opacity:0;}


@media (max-width: 900px) {
	.projects .project .check-icon{font-size:40px;}
	.projects .project .title {font-size: 18px;}
}
@media (max-width:600px) {
	.projects{display:block;}
}


/*projects*/



/*footer*/
.skin-footer{
	box-sizing:border-box;margin:0 auto;padding:0 0 30px 0;max-width:1920px;min-height:750px;background:url(/i/footer-bgr.png) 50% 50%/cover no-repeat;
	display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;
	color:#fff;text-align:center;
}
@media (max-width:1200px){
	.skin-footer{min-height:0;}
}
.skin-footer > .section{flex:0 1 auto;box-sizing:border-box;width:100%;color:#fff;}
.skin-footer > .copyrights{flex:0 1 auto;box-sizing:border-box;width:100%;font-size:14px;color:#B2D1F3;}
.skin-footer > .copyrights span{display:block;margin-bottom:10px;}

.contacts-items{max-width:800px;margin:0 auto;display:flex;justify-content:space-between;align-items:stretch;}
.contacts-items > .item{
	box-sizing:border-box;flex:0 1 calc(50% - 15px);margin:20px 0;padding:30px 20px;border: 1px solid #8EC2FC;border-radius:10px;
	font-size:16px;color:#f9f9f9;
	transition:transform 1s cubic-bezier(0.33, 1, 0.68, 1), opacity 0.5s;
}
.contacts-items > .item:not(.transition-on){transform:translateY(100px);opacity:0;}

.contacts-items > .item .title{font-family:'Kanit', sans-serif;font-size:28px;margin-bottom:0.5em;}
.contacts-items > .item .text{line-height:1.8em;margin-bottom:20px;}
.contacts-items > .item a{color:#cff889;}
.contacts-items > .item a:hover{text-decoration:underline;}
.contacts-items > .item .map a{line-height:23px;}
.contacts-items > .item .map a img{margin-right:4px;height:23px;}
@media (max-width:900px){
	.contacts-items{display:block;max-width:400px;}
}