html, body {font-size:1.4vw !important;}
body {font-family: 'Lato', Arial, Tahoma, Verdana, serif;position:relative;}
.desktop {display:block;}
.mobile {display:none;}

.f07 {font-size:0.7rem;}
.f08 {font-size:0.8rem;}
.f09 {font-size:0.9rem;}
.f10 {font-size:1.0rem;}
.f11 {font-size:1.1rem;}
.f12 {font-size:1.2rem;}
.f15 {font-size:1.5rem;}
.f17 {font-size:1.7rem;}
.f20 {font-size:2.0rem;}
.f25 {font-size:2.5rem;}
.f30 {font-size:3.0rem;}
.f35 {font-size:3.5rem;}

.bg-col-white {background-color:#fff;}
.bg-col-black-tr {background-color:rgba(0,0,0,0.5);}
.bg-col-blue {background-color:#4064ad;}

.text-col-white {color:#fff !important;}
.text-col-black {color:#000 !important;}
.text-col-yellow {color:#f4cb01 !important;}

.border-col-white {border-color:#fff !important;}
.border-col-black {border-color:#000 !important;}

.navbar {padding:0 1rem;margin:0;transition: all .3s ease-in-out;}
.navbar .navbar-brand {padding:1rem 0 1rem 1rem;color:#000;font-weight:700;}
.navbar .navbar-brand img {height:4rem;transition: all .3s ease-in-out;}
.navbar .navbar-collapse {padding:0 2rem 0 0;margin:0;}
.navbar .navbar-nav {padding:0;margin:0;}
.navbar .navbar-nav .nav-item {font-family: 'Roboto Condensed', sans-serif;margin-left:0.6rem;font-size:0.8rem;}
.navbar .navbar-nav .nav-item .nav-link {color:#000;padding-left:0;padding-right:0;transition: all .3s ease-in-out;position:relative;}
.navbar .navbar-nav .nav-item .nav-link.active,
.navbar .navbar-nav .nav-item .nav-link:hover {color:#4064ad;}
.navbar .navbar-nav .nav-item.en {padding-left:1rem;}
.navbar .navbar-nav .nav-item.en .nav-link.active {border-bottom:1px solid #4064ad;}

.navbar.scroll {background-color:rgba(255,255,255,0.9);}
.navbar.scroll .navbar-brand {padding:0.5rem 0 1rem 1rem;}
.navbar.scroll .navbar-brand img {height:2.5rem;}

.footer {background-color:#f4cb01;padding-top:1.5rem;padding-bottom:1.5rem;color:#000;}
.footer img {height:3rem;margin-bottom:1rem;}

.splash {min-height:100vh;color:#000;padding:0 2rem;
background: url('../images/img-splash.jpg') no-repeat center center scroll;
background-size: cover;
height: 100%;
overflow: hidden;
}
.splash h1 {line-height:3.5rem;}

.about {color:#000;padding:4rem 2rem;
background: #c4e2ed url('../images/img-about.jpg') no-repeat top center fixed;
background-size: 100% auto;
height: 100%;
overflow: hidden;
}
.about h2 {margin-bottom:2rem;}
.about h3 {margin-bottom:1rem;font-size:1.75rem;}
.about .place {height:1.5rem;margin-right:0.3rem;}
.about .circle {width:1rem;height:1rem;background-color:#f00;margin:0 auto;margin-top:0.25rem;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;}
.about .milestone {font-size:0.9rem;}
.about2 {padding:4rem 2rem;background-color:#f0f0f0;}
.about2 h3 {margin-bottom:1rem;font-size:1.75rem;}
.about2 h4 {font-weight:bold;color:#000;font-size:1.75rem;}
.about2 h4 img {height:1.2rem;}
.about2 .timeline {height:5.5rem;}
.about2 .bg1 {background:url('../images/bg-time-1a.png') center left no-repeat,url('../images/bg-time-1.png') center right no-repeat;}
.about2 .bg2 {background:url('../images/bg-time-2a.png') center left no-repeat,url('../images/bg-time-2.png') center right no-repeat;}
.about2 .bg3 {background:url('../images/bg-time-1b.png') center left no-repeat,url('../images/bg-time-1.png') center right no-repeat;}
.about2 .bg4 {background:url('../images/bg-time-2a.png') center left no-repeat,url('../images/bg-time-3.png') center right no-repeat;}
.about2 .bg11 {background:url('../images/bg-time-11a.png') bottom center no-repeat,url('../images/bg-time-11.png') top center no-repeat;}
.about2 .bg22 {background:url('../images/bg-time-22a.png') bottom center no-repeat,url('../images/bg-time-22.png') top center no-repeat;}
.about2 .bg33 {background:url('../images/bg-time-11b.png') bottom center no-repeat,url('../images/bg-time-11.png') top center no-repeat;}
.about2 .bg44 {background:url('../images/bg-time-22a.png') bottom center no-repeat,url('../images/bg-time-33.png') top center no-repeat;}

.about3 {padding:4rem 2rem;background-color:#f0f0f0;}
.about3 h3 {margin-bottom:1rem;font-size:1.75rem;}
.about3 h4 {font-weight:bold;color:#000;font-size:1.75rem;}
.about3 h4 img {height:1.2rem;}
.about3 h4.top:before, .about3 h4.bottom:before {content:'';display:block;position:absolute;bottom:-2.5rem;left:1.5rem;width:1px;height:3rem;background-color:#999;z-index:0;}
.about3 h4.top:before {bottom:-2.5rem;top:auto;}
.about3 h4.bottom:before {top:-2.8rem;bottom:auto;}
.about3 .bar {height:1.2rem;transform: skewX(-30deg);margin:2rem 0;z-index:10;position:relative;}
.about3 .bar.blue {
background: rgb(56,88,167);
background: -moz-linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
background: linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3858a7",endColorstr="#3d6bb3",GradientType=1);}
.about3 .bar.green {
background: rgb(182,198,53);
background: -moz-linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
background: linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b6c635",endColorstr="#c6d939",GradientType=1);}

.about3 .bar2 {transform: skewY(-30deg);}
.about3 .bar2.blue {
background: rgb(56,88,167);
background: -moz-linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
background: linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3858a7",endColorstr="#3d6bb3",GradientType=1);}
.about3 .bar2.green {
background: rgb(182,198,53);
background: -moz-linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
background: linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b6c635",endColorstr="#c6d939",GradientType=1);}

.pharma {color:#000;padding:4rem 2rem;}
.supple {color:#000;padding:4rem 2rem;}
.food {color:#000;padding:4rem 2rem;}
.agri {color:#000;padding:4rem 2rem;}
.cosmetics {color:#000;padding:4rem 2rem;}

.bg-left {
background: url('../images/bg-left.jpg') no-repeat center center fixed;
background-size: cover;
height: 100%;
overflow: hidden;
}
.bg-right {
background: url('../images/bg-right.jpg') no-repeat center center fixed;
background-size: cover;
height: 100%;
overflow: hidden;
}

.services {min-height:100vh;color:#000;padding:0 2rem;
background: rgb(255,255,255);
background: -moz-linear-gradient(135deg, rgba(255,255,255,1) 00%, rgba(204,204,204,1) 100%);
background: -webkit-linear-gradient(135deg, rgba(255,255,255,1) 00%, rgba(204,204,204,1) 100%);
background: linear-gradient(135deg, rgba(255,255,255,1) 00%, rgba(204,204,204,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#cccccc",GradientType=1);}
.services h2 {margin-bottom:2rem;}
.services .item > div {display:flex;justify-content:center;align-items:center;text-align:center;height:8rem;min-height:8rem;padding:1rem;margin-bottom:1rem;color:#fff;transition: all .3s ease-in-out;}
.services .item > div.blue {
background: rgb(56,88,167);
background: -moz-linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
background: linear-gradient(90deg, rgba(56,88,167,1) 0%, rgba(61,107,179,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3858a7",endColorstr="#3d6bb3",GradientType=1);}
.services .item > div.green {
background: rgb(182,198,53);
background: -moz-linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
background: linear-gradient(90deg, rgba(182,198,53,1) 0%, rgba(198,217,57,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b6c635",endColorstr="#c6d939",GradientType=1);}
.services .item > div {transform: skewX(-15deg);}
.services .item > div > div {transform: skewX(15deg);}

.career {min-height:100vh;color:#000;padding:0 2rem;
background: rgb(155,213,236);
background: -moz-linear-gradient(135deg, rgba(155,213,236,1) 00%, rgba(213,237,247,1) 100%);
background: -webkit-linear-gradient(135deg, rgba(155,213,236,1) 00%, rgba(213,237,247,1) 100%);
background: linear-gradient(135deg, rgba(155,213,236,1) 00%, rgba(213,237,247,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#9bd5ec",endColorstr="#d5edf7",GradientType=1);}
.career h2 {margin-bottom:2rem;}

.contact {min-height:100vh;color:#000;padding:0 2rem;
background: rgb(255,255,255);
background: -moz-linear-gradient(135deg, rgba(255,255,255,1) 00%, rgba(204,204,204,1) 100%);
background: -webkit-linear-gradient(135deg, rgba(255,255,255,1) 00%, rgba(204,204,204,1) 100%);
background: linear-gradient(135deg, rgba(255,255,255,1) 00%, rgba(204,204,204,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#cccccc",GradientType=1);}
.contact h2 {margin-bottom:2rem;}

.news {color:#000;padding:4rem 2rem;}
.news h2 {margin-bottom:2rem;}
.news img {border:1px solid #ccc;width:100%;}
.news h4 {font-size:1.1rem;margin-top:0.5rem;font-weight:bold;}
.news h5 {font-size:0.9rem;font-style:italic;}
.news p {font-size:0.9rem;}
.news .read {text-align:right;display:block;font-size:0.9rem;margin-top:0;margin-bottom:2rem;}
.news .more {text-align:center;display:block;font-size:0.9rem;color:#fff;}

.news2 {color:#000;padding:4rem 2rem;}
.news2 img {border:1px solid #ccc;width:100%;}
.news2 h3 {font-size:1.4rem;margin-top:0.5rem;font-weight:bold;}
.news2 h4 {font-size:1.1rem;margin-top:0.5rem;font-weight:bold;}
.news2 h5 {font-size:0.9rem;font-style:italic;}

@media only screen and (max-width: 768px) {
	.desktop {display:none;}
	.mobile {display:block;}
	html, body {font-size:4vw !important;}
	.navbar {background-color:rgba(255,255,255,0.9);}
	.navbar .navbar-brand {padding:0.5rem 0 1rem 1rem;}
	.navbar .navbar-brand img {height:2.5rem;}
	.navbar .navbar-nav .nav-item.en {padding-left:0;padding-top:0.5rem;border-top:1px solid #ccc;}
	.navbar .navbar-nav .nav-item.en .nav-link.active {border-bottom:0;}

	.splash h1 {line-height:2.2rem;font-size:1.8rem;}
	.splash {background-position:75% 50%;background-size:auto 100%;}

	.about {background-position:70% 50%;background-size:auto 100%;background-attachment:scroll;}

	.bg-left {background-attachment:scroll;background-size:auto 100%;}
	.bg-right {background-attachment:scroll;background-size:auto 100%;}
	
	.services {min-height:auto;padding:4rem 2rem;}
	.services .row {height:auto !important;}

	.career {min-height:auto;padding:4rem 2rem;}
	.career .row {height:auto !important;}

	.contact {min-height:auto;padding:4rem 2rem;}
	.contact .row {height:auto !important;}
}
@media only screen and (max-width: 768px) and (orientation:landscape) {
	html, body {font-size:3vw !important;}
	.desktop {display:none;}
	.mobile {display:block;}
}