/*** 01 - Typography ***/

/********** Body Font **********/

@font-face {
	font-family: 'montserratlight';
	src: url('../fonts/montserrat-light-webfont.woff2') format('woff2'),
	url('../fonts/montserrat-light-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'montserratregular';
	src: url('../fonts/montserrat-regular-webfont.woff2') format('woff2'),
	url('../fonts/montserrat-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'montserratmedium';
	src: url('../fonts/montserrat-medium-webfont.woff2') format('woff2'),
	url('../fonts/montserrat-medium-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'montserratbold';
	src: url('../fonts/montserrat-bold-webfont.woff2') format('woff2'),
	url('../fonts/montserrat-bold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'montserratblack';
	src: url('../fonts/montserrat-black-webfont.woff2') format('woff2'),
	url('../fonts/montserrat-black-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Noto Sans Thai';
	src: url('../fonts/NotoSansThai-Regular.woff2') format('woff2'),
	url('../fonts/NotoSansThai-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noto Sans Thai';
	src: url('../fonts/NotoSansThai-Light.woff2') format('woff2'),
	url('../fonts/NotoSansThai-Light.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}


@font-face {
	font-family: 'Noto Sans Thai SemBd';
	src: url('../fonts/NotoSansThai-SemiBold.woff2') format('woff2'),
	url('../fonts/NotoSansThai-SemiBold.woff') format('woff');
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Noto Sans Thai-Bold';
	src: url('../fonts/NotoSansThai-Bold.woff2') format('woff2'),
	url('../fonts/NotoSansThai-Bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}



@font-face {
	font-family: 'layiji_jarakefadhang_v1.0Rg';
	src: url('../fonts/layiji_jarakefadhangv1-webfont.woff2') format('woff2'),
	url('../fonts/layiji_jarakefadhangv1-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;

}

/********** Main Class **********/

html {
	font-size: 10px;
}

body {
	font-family: 'montserratlight', 'Noto Sans Thai';
	font-size: 1.5rem;
	line-height: 2.6rem;
	color: #222221;
	overflow-x: hidden;
	position: relative;
}

strong {
	/*font-family: 'promptsemibold';*/
	font-family: 'montserratbold', 'Noto Sans Thai-Bold';
	font-weight: normal;
}

a {
	color: #321c65;
}

/*img {
	border-radius: 4px;
}*/

h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'montserratbold', 'Noto Sans Thai-Bold';
}

h1 {
	font-size: 5.2rem;
}

h2 {
	font-size: 4.2rem;
	color: #000;
}

h3 {
	font-size: 1.6rem;
	color: #000;
}


.st-section {
	padding: 80px 0;
}

.heading-section {
	margin-bottom: 30px;
}

.heading-section h2 {
	color: #321c65;
	margin-bottom: 0;
}

.heading-section h3 {
	font-size: 2.4rem;
	margin-bottom: 15px;
}

.heading-line {
	margin: 15px auto 0;
}

.main-content .heading-section h2 {
	font-size: 3.6rem;
}

.st-sec {
	padding: 96px 0;
}


.btn {
	padding: 10px 40px;
	font-size: 1.6rem;
	font-family: 'montserratbold';
}

.btn-main {
	background: #321c65;
	color: #fff !important;
}

.btn-main:hover {
	background: #321c65;
	color: #fff !important;
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.btn-outline {
	border: 1px solid #fff;
	border-radius: 4px;
	color: #fff;
	background: none;
}

.btn-outline:hover {
	background: #fff;
	color: #ee1c25;
}

.cvpage-img {
	background-image: url(../images/cvpage.jpg);
	background-position: center center;
	background-size: cover;
	padding: 40px 0;
	color: #fff;
}

.cvpage-img h1 {
	font-size: 4.2rem;
}

.breadcrumb-dt {
	text-align: center;
	font-size: 14px;
	font-family: 'montserratmedium'
}

.breadcrumb-dt a {
	display: inline-block;
	color: #fff;
	margin-left: 10px;
}

.breadcrumb-dt a:hover {
	opacity: 0.6;
}

.breadcrumb-dt p {
	display: inline-block;
	color: #e99e0f;
	margin-bottom: 0;
}

.breadcrumb-dt a:first-child {
	margin-left: 0;
}

.breadcrumb-dt p {
	display: inline-block;
	margin-left: 10px;
}

.breadcrumb-ct {
	margin-bottom: 15px;
}

.breadcrumb-ct a {
	color: #333;
}

.product-cvpage .breadcrumb-dt {
	text-align: left;
}

.pagination {
	margin-top: 40px;
	justify-content: center;
}

.page-link {
	color: #000;
	font-family: 'montserratbold';
	padding: 0.7rem 1.2rem;
	margin: 0 2px;
	font-size: 1.6rem;
	border: none;
}

.page-link:hover {
	color: #0b5baf;
}

.page-link-active {
	background: #0b5baf;
	color: #fff;
	font-family: 'montserratbold';
	border-radius: 0;
}

.page-link-active:hover {
	background: #0b5baf;
	color: #fff;
}

.page-link .fa {
	font-size: 1.4rem;
}

.content-divider {
	width: 100%;
	display: block;
	margin-bottom: 30px;
}

#modal-size {
	padding: 0;
}

#modal-size .modal-dialog {
	max-width: 640px;
}

#modal-size h5 {
	font-size: 1.6rem;
}

#modal-size .close {
	font-size: 3.2rem;
	padding-top: 5px;
}

.loader {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(../images/status2-2.gif) 50% 50% no-repeat rgba(255, 255, 255, 1);
}

/*
#loader {
	position: fixed;
	width: 96px;
	height: 96px;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	background-color: rgba(255, 255, 255, 0.9);
	-webkit-box-shadow: 0px 24px 64px rgba(0, 0, 0, 0.24);
	box-shadow: 0px 24px 64px rgba(0, 0, 0, 0.24);
	border-radius: 16px;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity .2s ease-out, visibility 0s linear .2s;
	-o-transition: opacity .2s ease-out, visibility 0s linear .2s;
	transition: opacity .2s ease-out, visibility 0s linear .2s;
	z-index: 1000;
}

#loader.fullscreen {
	padding: 0;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
	background-color: #fff;
	border-radius: 0;
	-webkit-box-shadow: none;
	box-shadow: none;
}

#loader.show {
	-webkit-transition: opacity .4s ease-out, visibility 0s linear 0s;
	-o-transition: opacity .4s ease-out, visibility 0s linear 0s;
	transition: opacity .4s ease-out, visibility 0s linear 0s;
	visibility: visible;
	opacity: 1;
}

#loader .circular {
	-webkit-animation: loader-rotate 2s linear infinite;
	animation: loader-rotate 2s linear infinite;
	position: absolute;
	left: calc(50% - 24px);
	top: calc(50% - 24px);
	display: block;
	-webkit-transform: rotate(0deg);
	-ms-transform: rotate(0deg);
	transform: rotate(0deg);
}

#loader .path {
	stroke-dasharray: 1, 200;
	stroke-dashoffset: 0;
	-webkit-animation: loader-dash 1.5s ease-in-out infinite;
	animation: loader-dash 1.5s ease-in-out infinite;
	stroke-linecap: round;
}

@-webkit-keyframes loader-rotate {
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@keyframes loader-rotate {
	100% {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}

@-webkit-keyframes loader-dash {
	0% {
		stroke-dasharray: 1, 200;
		stroke-dashoffset: 0;
	}
	50% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -35px;
	}
	100% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -136px;
	}
}

@keyframes loader-dash {
	0% {
		stroke-dasharray: 1, 200;
		stroke-dashoffset: 0;
	}
	50% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -35px;
	}
	100% {
		stroke-dasharray: 89, 200;
		stroke-dashoffset: -136px;
	}
}
*/

/* Menu Fix */

#menu-fix {
	position: fixed;
	top: 0px;
	width: 100%;
	color: #333;
	z-index: 9999;
	display: none;
	-webkit-box-shadow: 0px 0px 18px -8px rgba(0, 0, 0, .45);
	-moz-box-shadow: 0px 0px 18px -8px rgba(0, 0, 0, .45);
	box-shadow: 0px 0px 18px -8px rgba(0, 0, 0, .45);
}

#menu-fix .nav-dt {
	background: #fff;
}

#menu-fix .navbar {
	padding: 5px 10px;
}

#menu-fix .nav-dt .navbar-brand img {
	max-width: 150px;
}

#menu-fix .nav-item-line {
	background: #4cb050;
}

#menu-fix .nav-item-line a:hover {
	background: #1CA822 !important;
}

#menu-fix .navbar-brand {
	margin-top: 0;
}

#menu-fix .nav-dt {
	padding: 10px 0;
	background-image: url(../images/about-bg03.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

#menu-fix .navbar-effect::after {
	display: none;
}

.img-wrapper {
	position: relative;
	overflow: hidden;
	display: inline-block;
	border-radius: 8px;
}

.img-wrapper img {
	transition: all 500ms ease-in-out;
	-webkit-transition: all 500ms ease-in-out;
}

.img-wrapper img:hover {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
}

.card-img-top {
	border-radius: 4px;
}

.st-section img {
	border-radius: 4px;
}

/* Navigation Class */

.navbar {
	padding: 0 15;
}

.nav-top .nav-link {
	padding: 0 !important;
	line-height: 10px;
}

.navbar .nav-item .dropdown-menu {
	display: block;
	opacity: 0;
	visibility: hidden;
	transition: .3s;
	margin-top: 0;
}

.navbar .dropdown-menu.fade-down {
	top: 80%;
	transform: rotateX(-75deg);
	transform-origin: 0% 0%;
}

.navbar .dropdown-menu.fade-up {
	top: 180%;
}

.navbar .nav-item:hover .dropdown-menu {
	transition: .3s;
	opacity: 1;
	visibility: visible;
	top: 100%;
	transform: rotateX(0deg);
	background-color: #5c49a0;
}

.dropdown-item {
	color: #fff;
	font-size: 1.5rem;
	min-width: 160px;
}

.dropdown-item:hover,
.dropdown-item:focus {
	color: #fff;
	text-decoration: none;
	background: #321c65;
}

.nav-dt {
	padding: 10px 0 10px;
	/*
	border-right: 16px solid #321c65;
	background: #fff;*/
	background-image: url(../images/about-bg03.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .12), inset 0 -1px 0 0 #dadce0;
}

.nav-dt .fa {
	font-size: 2rem;
}

.navbar-brand {
	padding: 0;
	margin-top: -40px;
}

.navbar-brand img {
	max-width: 130px;
    position: relative;
        top: -5px;
    /*max-width: 280px;
    position: relative;
        top: -8px;*/
}

.nav-item {
	margin-right: 30px;
}

.nav-item:last-child {
	margin-right: 0;
}

.nav-link {
	color: #000;
	font-family: 'montserratbold';
	font-size: 1.6rem;
	padding: 10px 0 !important;
}

.nav-link:hover {
	color: #5c49a0;
}

.nav-active {
	color: #5c49a0 !important;
}

.nav-active a {
	color: #5b489d !important;
}

.nav-mobile {
	display: none;
}

.eos-menu .eos-menu-title .fa {
	line-height: 64px !important;
}

.eos-menu .eos-menu-title,
.eos-menu .eos-group-title,
.eos-menu .eos-item {
	border-bottom: 1px solid #321c65 !important;
}

.technical-center {
	border-bottom: 1px solid #ddd;
	padding-bottom: 10px;
	padding-right: 25px;
}

.technical-center ul {
	display: block;
	width: 100%;
}

.technical-center li {
	display: inline-block;
	margin-left: 15px;
}
.ul-lang{
	padding-left: 0;
}
.ul-lang li{
	margin-left: 5px;
}
.ul-lang li span{
	font-family: 'montserratbold';
	color: #733e9e;
}
.ul-lang li a{
	color: #999;
	opacity: 0.8;
}
.tick {
	font-size: 1rem;
	white-space: nowrap;
	font-family: arial, sans-serif;
	display: inline-block;
}

.tick-flip,
.tick-text-inline {
	font-size: 2.5em;
}

.tick-label {
	margin-top: 1em;
	font-size: 1em;
}

.tick-char {
	width: 1.5em;
}

.tick-text-inline {
	display: inline-block;
	text-align: center;
	min-width: 1em;
}

.tick-text-inline + .tick-text-inline {
	margin-left: -.325em;
}

.tick-group {
	margin: 0 .5em;
	text-align: center;
}


.tick-text-inline {
	color: #595d63 !important;
}

.tick-label {
	color: #595d63 !important;
}

.tick-flip-panel {
	color: #fff !important;
}

.tick-flip {
	font-family:  !important;
	font-size: 16px !important;
}

.tick-flip-panel-text-wrapper {
	line-height: 1.45 !important;
}

.tick-flip-panel {
	background-color: #3c3e3c !important;
}

.tick-flip {
	border-radius: 0.12em !important;
}

.tick-flip:first-child {
	display: none;
}

/*Owl Carousel*/

.owl-theme .owl-dots {
	text-align: left;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
	background: #e99e0f;
}

.owl-theme .owl-dots .owl-dot span {
	width: 14px;
	height: 14px;
	margin: 5px;
}

.odometer.odometer-auto-theme,
.odometer.odometer-theme-car {
	font-family: 'montserratmedium';
	font-size: 1.6rem;
	vertical-align: top;
}
/*Transition*/
		.fade-in {
			animation: animationFade 20s infinite linear;
		}

		@keyframes animationFade {
  0% {
    transform: scale(0.7);
  }
  10% {
    transform: scale(0.8);
  }
  20% {
    transform: scale(0.85);
  }
  30% {
    transform: scale(0.9);
  }
  40% {
    transform: scale(0.95);
  }
  50% {
    transform: scale(1);
    opacity: 0;
  }
  90% {
    transform: scale(1);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
{
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
cursor:pointer;
}
/*Carousel*/

.carousel-inner {
	position: relative;
}

.carousel-caption {
	/**/
	top: 50%;
	bottom: auto !important;
	transform: translateY(-50%);
	position: absolute;
}

.carousel-caption h1 {
	font-size: 3.6rem;
	line-height: 5.6rem;
}

.carousel-indicators {
	bottom: 5%;
}

.carousel-indicators li {
	background: #d6d6d6;
	width: 12px;
	height: 12px;
	border-radius: 50%;
}

.carousel-indicators .active {
	background: #febd12;
	position: relative;
}

.carousel-indicators .active::after {
	content: '';
	position: absolute;
	top: -3px;
	left: -3px;
	width: 18px;
	height: 18px;
	border-radius: 100%;
	background: #de6c30;
	opacity: 0.2;
}

.carousel-control-prev,
.carousel-control-next {
	width: 5%;
}

/*Superslides*/

#superslides {
	position: relative;
}

#superslides .all-caption {
	z-index: 999;
	position: absolute;
	margin: 0 auto;
	margin-top: 0px;
	width: 100%;
	top: 50%;
	margin-top: -110px;
	color: #fff;
}

#superslides .all-caption .btn-main {
	background: #fff;
	color: #321c65 !important;
	position: relative;
	margin-top: 15px;
}

.slides-pagination {
	width: 5%;
	right: 0;
	transform: rotate(90deg);
	bottom: 55%;
}

.slides-pagination a {
	border: 2px solid #fff;
	border-radius: 15px;
	width: 14px;
	height: 14px;
	text-indent: -200%;
	margin-right: 10px;
}

.slides-pagination a.current {
	background: #fff;
}

.main-content .slides-container {
	height: 480px !important;
}

.main-content .slides-control {
	height: 480px !important;
}

.main-content #superslides {
	height: 480px !important;
}

/*.slides-container {
	height: 780px !important;
}

.slides-control {
	height: 780px !important;
}

#superslides {
	height: 780px !important;
}*/

.main-content .bounce {
	-webkit-animation: bounce 4s infinite;
	animation: bounce 4s infinite;
}

@-webkit-keyframes bounce {

	0%,
	20%,
	50%,
	80%,
	100% {
		-webkit-transform: translateY(0);
	}

	40% {
		-webkit-transform: translateY(-25px);
	}

	60% {
		-webkit-transform: translateY(-10px);
	}
}

@-moz-keyframes bounce {

	0%,
	20%,
	50%,
	80%,
	100% {
		-moz-transform: translateY(0);
	}

	40% {
		-moz-transform: translateY(-25px);
	}

	60% {
		-moz-transform: translateY(-10px);
	}
}

@keyframes bounce {

	0%,
	20%,
	50%,
	80%,
	100% {
		-webkit-transform: translateY(0);
		-moz-transform: translateY(0);
		-ms-transform: translateY(0);
		-o-transform: translateY(0);
		transform: translateY(0);
	}

	40% {
		-webkit-transform: translateY(-25px);
		-moz-transform: translateY(-25px);
		-ms-transform: translateY(-25px);
		-o-transform: translateY(-25px);
		transform: translateY(-25px);
	}

	60% {
		-webkit-transform: translateY(-10px);
		-moz-transform: translateY(-10px);
		-ms-transform: translateY(-10px);
		-o-transform: translateY(-10px);
		transform: translateY(-10px);
	}
}

.main-content .btn-slides {
	display: inline-block;
	margin-top: 50px;
	height: 50px;
	padding: 10px 10px;
	transition: all 0.2s;
}

.main-content .btn-slides:before {
	content: "";
	display: block;
	background-image: url(../images/icon-double-down.png);
	background-size: cover;
	background-repeat: no-repeat;
	width: 31px;
	height: 27px;
}

.main-content .btn-slides:hover,
.btn-slides:focus {
	opacity: 0.7;
}



/*about*/

.about-main {
	display: block;
	position: relative;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	overflow: hidden;
	padding: 80px 0;
}

.about-bg {
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	overflow: hidden;
	background-image: url(../images/about-bg02.jpg);
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}

.md-content img {
	width: 300px;
}

.md-content .heading-section h2 {
	text-transform: uppercase;
	font-size: 4rem;
}

.md-content .heading-section h2 span {
	color: #e99e0f;
}

.md-content strong {
	font-style: italic;
	font-size: 2rem;
	font-family: 'Noto Sans Thai-Bold';
}

.md-text {
	position: relative;
}

.md-text .fa-quote-left {
	position: absolute;
	left: -20px;
	font-size: 3rem;
	top: -50px;
}

.md-text .fa-quote-right {
	position: absolute;
	right: 30px;
	font-size: 3rem;
	bottom: -50px;
}

.slide-content .owl-dots {
	text-align: center;
}

.philosophy-item {
	position: relative;
	padding: 0;
	text-align: center;
}

.philosophy-item-img {
	position: absolute;
	top: 50%;
	width: 100%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	text-align: center;
	opacity: 0.5;
}

.philosophy-item p {
	z-index: 99;
	position: relative;
	margin-bottom: 0;
}

.philosophy-inner {
	position: relative;
	background: #321c65;
	color: #fff;
	padding: 30px 0;
	border: 8px solid #fff;
	min-height: 400px;
}

.philosophy-inner img {
	display: block;
	margin: 0 auto 15px;
	max-width: 64px;
}

.philosophy-inner .fa {
	font-size: 4rem;
	display: block;
	margin-bottom: 15px;
}

.philosophy-content {
	padding: 0 15px;
	position: relative;
	margin-top: 40px;
	width: 100%;
	/*
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);*/
	text-align: center;
	color: #fff;
}

.philosophy-1 {
	background-image: url(../images/philosophy-01.jpg);
	background-size: cover;
	background-position: center;
	/*
	border-radius: 0 0 0 64px;*/
}

.philosophy-2 {
	background-image: url(../images/philosophy-02.jpg);
	background-size: cover;
	background-position: center;
}

.philosophy-3 {
	background-image: url(../images/philosophy-03.jpg);
	background-size: cover;
	background-position: center;
	/*border-radius: 0 64px 0 0;*/
}

.philosophy-4 {
	background-image: url(../images/philosophy-04.jpg);
	background-size: cover;
	background-position: center;
	/*border-radius: 0 64px 0 0;*/
}

.philosophy-5 {
	background-image: url(../images/philosophy-05.jpg);
	background-size: cover;
	background-position: center;
	/*border-radius: 0 64px 0 0;*/
}

.corporate-philosophy .heading-section {
	margin-bottom: 60px;
}

.corporate-philosophy .owl-theme .owl-dots {
	text-align: center;
}

.chart-left {}

.chart-center {
	padding-left: 40px;
}

.chart-right {
	padding-left: 0;
}

.vertical-line {
	width: 1px;
	height: 100%;
	background: #ddd;
	text-align: center;
	margin: 0 auto;
}

.aboutus-statistic {
	background-image: url(../images/designinstallation-bg-01.jpg);
	/*background-attachment: fixed;*/
	background-position: top;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 60px;
	color: #fff;
	max-height: 480px;
}

.aboutus-statistic .heading-section h2 {
	color: #fff;
}

.aboutus-statistic h3 {
	font-size: 4.8rem;
	color: #fff;
}

.slide-content .owl-dots {
	text-align: center;
	margin-top: 30px;
}

.board .owl-dots {
	text-align: center;
	margin-top: 30px !important;
}

.about-row {
	margin-bottom: 40px;
}

.about-row:last-child {
	margin-bottom: 0;
}

.company-item {
	border: 1px solid #321c65;
	border-radius: 50%;
	padding: 15px;
	display: block;
}

.highcharts-legend-item {
	display: none;
}

.container-1st {
	width: 100%;
	margin: 15px auto;
}

.container-2nd {
	width: 90%;
	margin: 15px auto;
}

/*news*/

.news-section {
	background-image: url(../images/news-bg.jpg);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	position: relative;
}

.news-section .heading-section h2 {
	color: #fff;
}

.news-slider-section .owl-theme .owl-dots {
	text-align: center;
}

.news-item-section {
	background: #fff;
}

.news-item .card-title {
	font-family: 'montserratlight';
	margin-bottom: 0;
}

.news-item .card-text {
	margin: 10px 0 5px;
	line-height: 2.2rem;
	font-size: 1.5rem;
}

.news-item a {
	margin-bottom: 0;
}

.news-item a h3 {
	margin-bottom: 0;
}

.news-item p {
	margin-bottom: 20px;
}

.news-item .card-body {
	padding: 20px;
	min-height: 210px;
	position: relative;
}

.content-container ul {
	list-style-type: none;
	padding-left: 0;
}

.news-item .card-body .tag-container {
	position: absolute;
	width: 100%;
	left: 15px;
	bottom: 15px;
	display: none;
}

.news-item a h3:hover {
	color: #5b489d;
}

.news-heading {
	margin-bottom: 30px;
}

.news-heading .heading-section {
	margin-bottom: 0;
}

.filter-news .form-control {
	font-size: 1.5rem;
	height: 40px;
}

.filter-news label {
	font-family: 'montserratbold';
	margin-bottom: 0;
}

.news-tag {
	background: #5b489d;
	border-radius: 32px;
	padding: 2px;
	min-width: 25%;
	display: inline-block;
	font-size: 1.2rem;
	color: #fff;
	text-align: center;
}

.news-tag:hover {
	color: #fff;
}

.activity-tag {
	background: #0b5baf;
}

.main-control {
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 1px solid #ddd;
}

.main-control p {
	margin-bottom: 0;
}

.main-control h3 {
	margin-bottom: 0;
}

.content-container {
	margin: 30px 0;
	/*
	font-family: 'montserratregular';*/
}

.content-container:last-child {
	margin-bottom: 0;
}

.content-container img {
	margin-bottom: 15px;
}

.news-btn-section {
	/*	border-top: 1px solid #ddd;*/
	padding-top: 15px;
}

.news-btn-section .btn {
	padding: 10px;
}

.news-btn-section .btn:first-child {
	padding-left: 0;
}

.news-btn-section .btn:last-child {
	padding-right: 0;
}

.date-detail strong {
	margin-right: 15px;
}

/*contact*/

.contact-info-container .fa {
	font-size: 1.4rem;
}

.contact-info {
	list-style-type: none;
	padding-left: 0;
	margin-bottom: 30px;
	margin-bottom: 30px;
	padding-bottom: 15px;
	border-bottom: 1px solid #ddd;
}

.contact-info {
	padding-left: 0;
}

.contact-info li {
	list-style-type: none;
	padding-left: 0;
	margin-bottom: 10px;
}

.contact-info li p {
	margin-bottom: 0;
}

.contact-info strong {
	display: inline-block;
	width: 15%;
}

.contact-info p {
	display: inline-block;
	width: 80%;
}

.contact-form {
	width: 100%;
	padding: 30px;
	background: #fff;
	box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .12), inset 0 -1px 0 0 #dadce0;
	border-top: 8px solid #5b489d;
}

.contactmain-section form h1 {
	font-size: 2em;
	font-weight: 300;
	text-align: center;
	color: #321c65;
}

.contactmain-section form h5 {
	text-align: center;
	text-transform: uppercase;
	color: #c6c6c6;
}

.contactmain-section form hr.sep {
	background: #321c65;
	box-shadow: none;
	border: none;
	height: 2px;
	width: 25%;
	margin: 0px auto 45px auto;
}

.contactmain-section form .emoji {
	font-size: 1.2em;
}

.contactmain-section .group {
	position: relative;
	margin: 15px 0;
}

textarea {
	resize: none;
}

.contactmain-section input,
textarea {
	background: none;
	color: #333;
	font-size: 16px;
	padding: 10px 10px 10px 5px;
	display: block;
	width: 100%;
	border: none;
	border-radius: 0;
	border-bottom: 1px solid #c6c6c6;
}

.contactmain-section input:focus,
textarea:focus {
	outline: none;
}

.contactmain-section input:focus ~ label,
input:valid ~ label,
textarea:focus ~ label,
textarea:valid ~ label {
	top: -14px;
	font-size: 12px;
	color: #321c65;
}

.contactmain-section input:focus ~ .bar:before,
textarea:focus ~ .bar:before {
	width: 100%;
}

.contactmain-section input[type=password] {
	letter-spacing: 0.3em;
}

.contactmain-section label {
	color: #c6c6c6;
	font-size: 14px;
	font-weight: normal;
	position: absolute;
	pointer-events: none;
	left: 5px;
	top: 10px;
	transition: 300ms ease all;
}

.contactmain-section .bar {
	position: relative;
	display: block;
	width: 100%;
}

.contactmain-section .bar:before {
	content: "";
	height: 2px;
	width: 0;
	bottom: 0px;
	position: absolute;
	background: #321c65;
	transition: 300ms ease all;
	left: 0%;
}

.contactperson-section {
	background: #fff;
}

.office-location-item .card {
	/*border: none;*/
}

.office-location-item .card-body {
	/* padding: 15px 0;*/
}

.office-location-item h3 {
	font-size: 1.8rem;
}

.office-location-item ul {
	list-style-type: none;
	padding-left: 0;
}

.office-location-item li {
	margin-bottom: 10px;
}

.office-location-item strong {
	display: block;
}

.office-location-item .card-title {
	border-bottom: 1px solid #efefef;
	padding-bottom: 15px;
	margin-bottom: 15px;
}

.btn-tel {
	display: inline-block;
	vertical-align: top;
	padding: 5px 10px;
	border: 1px solid #ddd;
	margin-right: 15px;
	margin-top: 5px;
}

.btn-tel .fa {
	color: #5b489d;
}

.office-location-detail {
	display: inline-block;
}

/*Background*/

.heading-bg {
	/* If you want to implement it in very old browser-versions */
	-webkit-user-select: none;
	/* Chrome/Safari */
	-moz-user-select: none;
	/* Firefox */
	-ms-user-select: none;
	/* IE10+ */
	/* The rule below is not implemented in browsers yet */
	-o-user-select: none;

	/* The rule below is implemented in most browsers by now */
	user-select: none;
}

#welcome_msg {
	position: absolute;
	top: 50px;
	left: 30px;
	font-family: 'layiji_jarakefadhang_v1.0Rg';
	font-size: 3rem;
	font-weight: bolder;
	color: #e99e0f;
}

.welcome_msg {
	position: absolute;
	top: 50px;
	left: 30px;
	font-family: 'layiji_jarakefadhang_v1.0Rg';
	font-size: 3rem;
	font-weight: bolder;
	color: #e99e0f;
}

/*Image Hover Class*/

figure.effect-chico h2 {
	font-size: 2rem;
}

.grid figure {
	margin: 0;
	background: #000;
}

.reference-section figure.effect-chico h2 {
	color: #fff;
}

.reference-section figure.effect-chico .fa {
	color: #e99e0f;
	font-size: 2.4rem;
	display: none;
}

.reference-left figure.effect-chico h2 {
	padding: 50% 0 20px 0;
}

.work figure.effect-chico h2 {
	word-spacing: 0;
	line-height: 2.2rem;
	letter-spacing: 1px;
	line-height: 2.8rem;
}

/*Philosophy Class*/

.philosophy-section {
	position: relative;
	background-image: url(../images/philiosophy-bg.png);
	background-size: contain;
	background-position: bottom center;
	background-repeat: no-repeat;
}

.philosophy-heading {
	margin-bottom: 24px;
	position: absolute;
	top: -15%;
	background: #fff;
	padding: 15px;
	line-height: 4.8rem;
}

.caption-container {
	position: absolute;
	top: 21%;
	left: 0;
	right: -60px;
}

.caption-content {
	position: relative;
	background: #fff;
	border: 8px solid #e99e0f;
	padding: 60px 30px 30px;
}

.caption-content-bottom {
	margin-top: 30px;
}

.text-bg-01 {
	position: absolute;
	top: 0;
	left: 0;
	max-width: 560px;
}

/*Design & Installation*/

.design-section {
	position: relative;
	background-image: url(../images/designinstallation-bg-01.jpg);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	min-height: 680px;
}

.design-section .container-fluid {
	padding-left: 0;
	padding-right: 0;
}

.design-section h2 {
	color: #fff;
}

.design-image {
	position: absolute;
	top: -50px;
}

.design-image img {
	width: 100%;
}

.design-content {
	position: relative;
	z-index: 9;
}

.design-item .fa {
	color: #e99e0f;
	font-size: 2.4rem;
}

.text-bg-02 {
	position: absolute;
	top: 0;
	left: 36%;
	max-width: 560px;
}

/*Design & Installation*/

.design-section {
	position: relative;
	min-height: 680px;
}

/*Reference*/

.reference-section {
	background-image: url(../images/reference-bg.png);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	position: relative;
}

.reference-content {
	padding: 0 60px;
}

.reference-item:last-child {
	margin-top: 30px;
}

.text-bg-03 {
	position: absolute;
	top: 0;
	left: 10%;
	max-width: 560px;
}

/*Contact*/

.contact-section {
	background-image: url(../images/contact-bg.jpg);
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	padding: 200px 0;
}

.contact-section .heading-section h2 {
	color: #fff;
}

/*/

/*Footer*/

footer {
	background: #5b489d;
	color: #fff;
	padding: 80px 0;
	font-size: 1.4rem;
	font-family: 'montserratregular';
}

footer a {
	color: #fff;
}

footer a:hover {
	text-decoration: underline;
	color: #fff;
}
.logo-ft img{
    max-width: 130px;
}
.address-info p {
	margin-bottom: 0;
}


.certificate-logo {
	padding-left: 0;
	list-style-type: none;
}

.certificate-logo li {
	display: inline-block;
	margin-right: 15px;
    margin-bottom: 15px;
	width: 100%;
	text-align: center;
}
.certificate-logo li:last-child{
    margin-bottom: 0;
}
.certificate-logo img {
	border-radius: 8px;
	text-align: center;
	margin: 0 auto;
	max-width: 120px;
}
.copyright-container{
	text-align: left;
}
.policy-container {
	text-align: right;
}

.policy-container ul {
	padding-left: 0;
	list-style-type: none;
	margin-bottom: 0;
}

.policy-container ul li {
	display: inline-block;
	margin-left: 15px;
}

.policy-container ul li a {
	color: #fff;
	font-size: 1.2rem;
}
.eos-menu-title{
	position: relative;
}
.mb-lang{
	display: inline-block;  
	line-height: 64px !important;
	margin-left: 60px;
	font-size: 1.2rem;
	position: absolute;
	right: 60px;
}
.mb-lang li{
	display: inline-block;
	margin-left: 5px;
}
.mb-lang li span {
	font-weight: bold;
	color: #733e9e;
}

.mb-lang li a {
	color: #999;
	opacity: 0.8;
}
reference-bg-01 {
	background: url(.../reference-bg-01.png)
}

.certificate-logo li:last-child {
	margin-right: 0;
}

.copyright {
	background: #4c4184;
	color: #fff;
	padding: 15px 0;
}

.copyright p {
	margin-bottom: 0;
	font-size: 1.2rem;
	font-family: 'montserratregular';
}
.cookiealert a{
	color: #e99e0f;
}
.cookiealert .btn{
	background: #5b489d;
	box-shadow: none;
	border:none;
}

/*Board*/

.item-team {
	position: relative;
	box-sizing: border-box;
	overflow: hidden;
	cursor: pointer;
}

.item-team h3 {
	color: #fff;
}

.item-team p {
	color: #fff;
}

.item-team img {
	transition: all 500ms ease-in-out;
	-webkit-transition: all 500ms ease-in-out;
}

.item-team img:hover {
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
}

.team-detail {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	background: rgba(91, 72, 157, 0.65);
	color: #fff;
	padding: 15px;
}

.team-detail img {
	max-width: 24px;
}

.team-detail ul {
	padding-left: 0;
}

.team-detail ul li {
	display: inline-block;
	margin-right: 5px;
	vertical-align: middle;
}

.team-detail h3 {
	font-size: 1.6rem;
}

.team-detail p {
	margin-bottom: 0;
	line-height: 2rem;
	font-size: 1.4rem;
}

.team-detail .col-sm-8 {
	padding-right: 0;
}

.people-detail p {
	margin-top: 15px;
	margin-bottom: 0;
}

.people-detail-list p {
	margin-top: 0;
	margin-bottom: 0;
	display: inline-block;
	width: 90%;
}

.people-detail-list {
	margin-left: 0;
	padding-left: 0;
	list-style-type: none;
	padding: 15px 30px;
	background: #efefef;
	border-top: 1px solid #666;
	border-bottom: 1px solid #666;
}

.people-detail-list .fa {
	margin-right: 10px;
	margin-top: 4px;
	display: inline-block;
	width: 5%;
	vertical-align: top;
}

.work figure.effect-chico img {
	opacity: 0.6;
}

/*
.work figure.effect-chico:hover img {
	opacity: 0.8;
}
*/

/*Projects*/

.work {
	position: relative;
}

.work-title {
	padding-bottom: 30px;
	text-align: center;
}

.work .heading-section {
	margin-bottom: 60px;
	z-index: 999;
	position: relative;
	text-align: center;
}

.portfolio-controllers-container {
	margin-bottom: 30px;
	text-align: center;
	z-index: 99;
	position: relative;
}

.portfolio-controllers {
	padding: 0px;
	height: 100%;
	display: inline-block;
	border-bottom: 1px solid #ddd;
	width: 100%;
}

.portfolio-controllers .filter-btn {
	float: left;
	padding: 10px 15px;
	border: none;
	outline: 0px;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
	cursor: pointer;
	font-family: 'montserratbold';
}

.portfolio-inner {
	width: 100%;
	text-align: center;
	display: block;
}

.more-container {
	margin-top: 40px;
}

.portfolio {
	padding: 3px 7px;
}

.portfolio-image {
	position: relative;
	overflow: hidden;
}

.portfolio-image img {
	width: 100%;
	height: 100%;
	transform: scale(1);
	-webkit-transition: all 0.5s ease;
	transition: all 0.5s ease;
	position: relative;
}

.portfolio-item-title {
	width: 90%;
	height: 40px;
	overflow: hidden;
	font-size: 18px;
	position: absolute;
	left: 50%;
	top: 25%;
	transform: translateX(-50%);
}

.portfolio-item-title:after {
	position: absolute;
	bottom: 0;
	left: 35%;
	content: '';
	width: 30%;
	height: 2px;
}

.footer-bottom p {
	text-align: center;
}

.more a {
	background-color: #ff9800;
	color: #fff;
}

/*
====================================================
				Work
====================================================
*/

.work {
	background-color: #f9f9f9;
}

.portfolio-controllers .btn-default {
	color: #808080;
}

.portfolio-controllers .filter-btn {
	background-color: transparent;
	color: #222;
}

.portfolio-controllers .filter-btn.active-work {
	color: #fff;
	background: #5b489d;
	border: none;
	border-radius: 8px 8px 0 0;
}

.portfolio-link li a i {
	background-color: transparent;
	/*border: 1px solid #00CCCC;*/
	color: #fff;
}

.portfolio-link li a:hover i {
	/*border-color: transparent;*/
}

.portfolio-link li a:hover i.fa-link,
.portfolio-link li a:hover i.fa-plus {
	background-color: #ff9800;
	color: #fff;
}

.portfolio-item-title {
	color: #fff;
}

.portfolio-item-title:after {
	background-color: transparent;
}

.navbar-brand p {
	font-family: 'montserratbold';
	color: #6755a6;
}

/*Safety*/

.safety-section {
	position: relative;
}

.col-safetyquality img {
	max-width: 72px;
	display: block;
	margin: 0 auto 30px;
	text-align: center;
}

.col-safetyquality h2 {
	font-size: 3.2rem !important;
}

.col-safetyquality p {
	text-align: justify;
}


.safety-method {
	font-size: 1.4rem;
}

.safety-method .card {
	border: none;
}

.safety-method .card-title {
	font-size: 1.6rem;
}

.safety-method .card-body {
	padding: 15px 0;
}

.safety-method .card-body h3 {
	font-size: 1.8rem;
}

.row-safety .owl-theme .owl-nav.disabled + .owl-dots {
	text-align: center;
	margin-top: 30px;
}

.cert-item img {
	max-width: 160px;
	margin: 0 auto 15px;
}

.cert-item h3 {
	font-size: 1.4rem;
}

.certificate-section {
	background: #efefef;
}

.quality-section ul {
	list-style-type: none;
	padding-left: 0;
}

.quality-section ul li {
	margin-bottom: 10px;
}

.quality-section .heading-section {
	margin-bottom: 15px;
}

.quality-left {
	background: #efefef;
}

.quality-left .quality-content {
	padding: 0 0 0 60px;
}

.quality-RIGHt .quality-content {
	padding: 0 60px 0 0;
}

.quality-cert-section .owl-theme .owl-dots {
	text-align: center;
}

/*Services*/

.img-services {
	min-height: 480px;
	background-position: center;
	background-size: cover;
	width: 100%;
	height: 100%;
	overflow: hidden;
	display: block;
}

.img-services-01 {
	background-image: url(../images/services-01.jpg);
}

.img-services-02 {
	background-image: url(../images/services-02.jpg);
}

.img-services-03 {
	background-image: url(../images/services-03.jpg);
}

.img-services-04 {
	background-image: url(../images/services-04.jpg);
}

/*
.services-section {
	margin-bottom: 30px;
}*/

.services-section .heading-section {
	margin-bottom: 20px;
}

.services-section .heading-section h2 {
	font-size: 3.2rem;
}

.services-section .btn {
	margin-top: 30px;
}

.services-item {
	background: #fff;
	box-shadow: 0 2px 6px 0 rgba(0, 0, 0, .12), inset 0 -1px 0 0 #dadce0;
	position: relative;
}

.services-content {
	padding: 60px;
}

.services-img-left {
	padding-right: 0;
}

.services-img-right {
	padding-left: 0;
}

.services-top {
	padding-top: 80px;
}

.services-btm {
	padding-bottom: 80px;
}

.line-services-right {
	position: absolute;
	right: 30px;
	bottom: 30px;
}

.line-services-left {
	position: absolute;
	right: 30px;
	bottom: 30px;
}

.row-services ul {
	padding-left: 15px;
}

.row-services ul li {
	background: #1a2f73;
	padding: 5px 10px;
	border-radius: 4px;
	margin-bottom: 15px;
	width: revert;
	color: #fff;
	display: inline-block;
	font-size: 1.2rem;
}


/*Timeline*/

.technical-content {
	margin-bottom: 60px;
}

.technical-content .heading-section {
	margin-bottom: 15px;
}

.technical-content:nth-child(1n) {
	margin-top: 0;
}

.table-technical {
	background: #fff;
	border-radius: 8px;
	margin-bottom: 0;
	/**/
}

.table-responsive {
	border-radius: 8px;
	border: 1px solid #ddd;
}

.table-technical thead {
	background: #321c65;
	color: #ffffff;
	border-radius: 8px;
}

.table-technical th {
	padding: 15px;
}

.table-technical td {
	padding: 15px;
}

/******************* Timeline *****************/

/* Timeline */

.timeline,
.timeline-horizontal {
	list-style: none;
	padding: 20px 0;
	position: relative;
}

.timeline:before {
	top: 40px;
	bottom: 0;
	position: absolute;
	content: " ";
	width: 3px;
	background-color: #eeeeee;
	left: 50%;
	margin-left: -1.5px;
}

.timeline .timeline-item {
	margin-bottom: 20px;
	position: relative;
}

.timeline .timeline-item:before,
.timeline .timeline-item:after {
	content: "";
	display: table;
}

.timeline .timeline-item:after {
	clear: both;
}

.timeline .timeline-item .timeline-badge {
	color: #fff;
	width: 54px;
	height: 54px;
	line-height: 52px;
	font-size: 22px;
	text-align: center;
	position: absolute;
	top: 18px;
	left: 50%;
	margin-left: -25px;
	background-color: #333;
	border: 3px solid #ffffff;
	z-index: 100;
	border-top-right-radius: 50%;
	border-top-left-radius: 50%;
	border-bottom-right-radius: 50%;
	border-bottom-left-radius: 50%;
}

.timeline .timeline-item .timeline-badge i,
.timeline .timeline-item .timeline-badge .fa,
.timeline .timeline-item .timeline-badge .glyphicon {
	top: 2px;
	left: 0px;
}

.timeline .timeline-item .timeline-badge.primary {
	background-color: #010066;
}

.timeline .timeline-item .timeline-badge.info {
	background-color: #9a00ff;
}

.timeline .timeline-item .timeline-badge.success {
	background-color: #6600cd;
}

.timeline .timeline-item .timeline-badge.warning {
	background-color: #cc99fe;
}

.timeline .timeline-item .timeline-badge.danger {
	background-color: #cc00ff;
}

.timeline .timeline-item .timeline-panel {
	position: relative;
	width: 46%;
	float: left;
	right: 16px;
	background: #ffffff;
	border-radius: 2px;
	padding: 20px;
	color: #fff;
}

.timeline .timeline-item .timeline-panel:before {
	position: absolute;
	top: 26px;
	right: -16px;
	display: inline-block;
	border-top: 16px solid transparent;
	border-left: 16px solid #777;
	border-right: 0 solid #777;
	border-bottom: 16px solid transparent;
	content: "";
}

.timeline .timeline-item .timeline-panel .timeline-title {
	margin-top: 0;
	color: inherit;
}

.timeline .timeline-item .timeline-panel .timeline-body > p,
.timeline .timeline-item .timeline-panel .timeline-body > ul {
	margin-bottom: 0;
}

.timeline .timeline-item .timeline-panel .timeline-body > p + p {
	margin-top: 5px;
}

.timeline .timeline-item:last-child:nth-child(even) {
	float: right;
}

.timeline .timeline-item:nth-child(even) .timeline-panel {
	float: right;
	left: 16px;
}

.timeline .timeline-item:nth-child(even) .timeline-panel:before {
	border-left-width: 0;
	border-right-width: 14px;
	left: -14px;
	right: auto;
}

.timeline-horizontal {
	list-style: none;
	position: relative;
	/*padding: 20px 0px 20px 0px;*/
	display: inline-block;
}

.timeline-horizontal:before {
	height: 3px;
	top: auto;
	bottom: 26px;
	left: 56px;
	right: 0;
	width: 80%;
	margin-bottom: 20px;
}

.timeline-horizontal .timeline-item {
	display: table-cell;
	height: 200px;
	/*    width: 20%;
    min-width: 320px;*/
	width: 19%;
	min-width: 220px;
	float: none !important;
	padding-left: 0px;
	padding-right: 20px;
	margin: 0 auto;
	vertical-align: bottom;
}

.timeline-horizontal .timeline-item .timeline-panel {
	top: auto;
	bottom: 64px;
	display: inline-block;
	float: none !important;
	left: 0 !important;
	right: 0 !important;
	width: 100%;
	min-height: 180px;
	margin-bottom: 20px;
	border-radius: 8px;
}

.timeline-horizontal .timeline-item .timeline-panel:before {
	top: auto;
	bottom: -16px;
	left: 28px !important;
	right: auto;
	border-right: 16px solid transparent !important;
	border-top: 16px solid #777 !important;
	border-bottom: 0 solid #777 !important;
	border-left: 16px solid transparent !important;
}

.timeline-horizontal .timeline-item:before,
.timeline-horizontal .timeline-item:after {
	display: none;
}

.timeline-horizontal .timeline-item .timeline-badge {
	top: auto;
	bottom: 0px;
	left: 43px;
}

.timeline .timeline-item .timeline-group-1 {
	background: rgb(1, 0, 102);
	background: -moz-linear-gradient(90deg, rgba(1, 0, 102, 1) 0%, rgba(54, 53, 167, 1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(1, 0, 102, 1) 0%, rgba(54, 53, 167, 1) 100%);
	background: linear-gradient(90deg, rgba(1, 0, 102, 1) 0%, rgba(54, 53, 167, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#010066", endColorstr="#3635a7", GradientType=1);
	position: relative;
}

.timeline-horizontal .timeline-item .timeline-group-1::before {
	top: auto;
	bottom: -16px;
	left: 28px !important;
	right: auto;
	border-right: 16px solid transparent !important;
	border-top: 16px solid #010066 !important;
	border-bottom: 0 solid #010066 !important;
	border-left: 16px solid transparent !important;
}

.timeline .timeline-item .timeline-group-2 {
	background: rgb(102, 0, 205);
	background: -moz-linear-gradient(90deg, rgba(102, 0, 205, 1) 0%, rgba(131, 76, 186, 1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(102, 0, 205, 1) 0%, rgba(131, 76, 186, 1) 100%);
	background: linear-gradient(90deg, rgba(102, 0, 205, 1) 0%, rgba(131, 76, 186, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#6600cd", endColorstr="#834cba", GradientType=1);
	position: relative;
}

.timeline-horizontal .timeline-item .timeline-group-2::before {
	top: auto;
	bottom: -16px;
	left: 28px !important;
	right: auto;
	border-right: 16px solid transparent !important;
	border-top: 16px solid #6600cd !important;
	border-bottom: 0 solid #6600cd !important;
	border-left: 16px solid transparent !important;
}

.timeline .timeline-item .timeline-group-3 {
	background: rgb(154, 0, 255);
	background: -moz-linear-gradient(90deg, rgba(154, 0, 255, 1) 0%, rgba(149, 110, 189, 1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(154, 0, 255, 1) 0%, rgba(149, 110, 189, 1) 100%);
	background: linear-gradient(90deg, rgba(154, 0, 255, 1) 0%, rgba(149, 110, 189, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#9a00ff", endColorstr="#956ebd", GradientType=1);
	position: relative;
}

.timeline-horizontal .timeline-item .timeline-group-3::before {
	top: auto;
	bottom: -16px;
	left: 28px !important;
	right: auto;
	border-right: 16px solid transparent !important;
	border-top: 16px solid #9a00ff !important;
	border-bottom: 0 solid #9a00ff !important;
	border-left: 16px solid transparent !important;
}

.timeline .timeline-item .timeline-group-4 {
	background: rgb(204, 0, 255);
	background: -moz-linear-gradient(90deg, rgba(204, 0, 255, 1) 0%, rgba(226, 124, 251, 1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(204, 0, 255, 1) 0%, rgba(226, 124, 251, 1) 100%);
	background: linear-gradient(90deg, rgba(204, 0, 255, 1) 0%, rgba(226, 124, 251, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cc00ff", endColorstr="#e27cfb", GradientType=1);
	position: relative;
}

.timeline-horizontal .timeline-item .timeline-group-4::before {
	top: auto;
	bottom: -16px;
	left: 28px !important;
	right: auto;
	border-right: 16px solid transparent !important;
	border-top: 16px solid #cc00ff !important;
	border-bottom: 0 solid #cc00ff !important;
	border-left: 16px solid transparent !important;
}

.timeline .timeline-item .timeline-group-5 {
	background: rgb(204, 153, 254);
	background: -moz-linear-gradient(90deg, rgba(204, 153, 254, 1) 0%, rgba(231, 208, 255, 1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(204, 153, 254, 1) 0%, rgba(231, 208, 255, 1) 100%);
	background: linear-gradient(90deg, rgba(204, 153, 254, 1) 0%, rgba(231, 208, 255, 1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#cc99fe", endColorstr="#e7d0ff", GradientType=1);
	position: relative;
}

.timeline-horizontal .timeline-item .timeline-group-5::before {
	top: auto;
	bottom: -16px;
	left: 28px !important;
	right: auto;
	border-right: 16px solid transparent !important;
	border-top: 16px solid #cc99fe !important;
	border-bottom: 0 solid #cc99fe !important;
	border-left: 16px solid transparent !important;
}

.timeline-heading {
	border-bottom: 1px solid #fff;
	padding-bottom: 5px;
	margin-bottom: 10px;
}

.timeline-heading .timeline-title {
	font-size: 2rem;
}

.workpiece-section {
	background: #efefef;
}

.workpiece-item h3 {
	margin-top: 15px;
	text-align: left;
}

tfoot {
	background: #efefef;
	font-weight: bold;
}

.location-container {
	position: absolute;
	bottom: 0;
	width: 100%;
	text-align: center;
	left: 0;
	padding: 5px;
	background: rgba(91, 72, 157, 0.7);
	font-size: 1.3rem;
}

figure.effect-chico:hover .location-container {
	display: none;
	-webkit-transition: opacity 0.55s, -webkit-transform 0.55s;
	transition: opacity 0.55s, transform 0.55s;
}

.modal-header {
	background: #5b489d;
	color: #fff;
	border-radius: 8px 8px 0 0;
}

.close {
	color: #fff;
	font-size: 2.4rem;
}

#myModal {
	padding-right: 0 !important;
}

.modal-body {
	padding: 2rem;
}

.modal-lg {
	max-width:75%;
}

.modal-xl {
	max-width: 1140px;
}

.modal-content {
	border-radius: 8px;
	border: none;
}

/*Media Queries*/

@media (min-width:1199px) {
	.navbar-brand p {
		display: inline-block;
		font-size: 1.2rem;
		margin-left: 5px;
		margin-bottom: 0;
		position: relative;
		top: 4px;
	}
}

@media (min-width:1200px) and (max-width:1300px) {
	.navbar-brand img {
		max-width: 120px;
		position: relative;
	}

	.nav-link {
		font-size: 1.4rem;
	}
}

@media (min-width:1200px) and (max-width:1211px) {
	.nav-item {
		margin-right: 20px;
	}
}

@media (max-width:1199px) {
	body {
		font-size: 1.4rem;
	}

	.nav-link {
		font-size: 1.4rem;
	}

	.corporate-content p br {
		display: none;
	}

	.heading-section h2 {
		font-size: 3.2rem;
	}

	.certificate-logo li {
		margin-bottom: 15px;
	}

	.contact-info strong {
		width: 20%;
	}

	.contact-info p {
		width: 75%;
	}

	.nav-dt .fa {
		display: none;
	}

	.work .effect-chico h2 {
		padding: 20% 0 20px 0;
	}

	.portfolio-controllers .filter-btn {
		width: 50%;
	}

	.portfolio-controllers .filter-btn.active-work {
		border-radius: 0;
	}

	.portfolio-controllers .filter-btn {
		margin-bottom: 15px;
	}

	.portfolio-inner {
		margin-bottom: 30px;
	}

	.navbar-brand p {
		margin-top: 15px;
		margin-bottom: 0;
		line-height: 0;
	}
	.timeline,
	.timeline-horizontal {
		width: 100%;
	}

	.timeline-horizontal::before {
		width: 95%;
	}
	.timeline-horizontal .timeline-item {
		width: 49.5%;
		min-width: 49.5%;
		display: inline-block;
		margin-bottom: 120px;
	}
	.timeline-horizontal::before {
		display: none;
	}
	.timeline-horizontal .timeline-item:last-child {
		margin-bottom: 0;
	}
	.main-content .btn-slides {
		margin-top: 0;
	}

	.main-content .btn-slides::before {
		width: 16px;
		height: 15px;
	}
	.typewriter-container {
		display: none;
	}
	#welcome_msg {
		display: none;
	}
	.modal-xl {
		max-width: 100%;
		margin: 15px;
	}
}

@media (min-width:991px) {
	.nav-dt.hide-nav {
		-webkit-transform: translateY(-100%);
		transform: translateY(-100%);
	}
	.nav-dt {
		z-index: 99;
		width: 100%;
		position: fixed;
		top: 0;
		-webkit-transition: all 0.25s ease-in-out;
		transition: all 0.25s ease-in-out;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
	}
}
@media (min-width:1200px){
	#rt-carousel {
		margin-top: 130px;
	}
}
@media (max-width:1199px){
	#rt-carousel {
		margin-top: 120px;
	}
	.image-text{
		display: none;
	}
}
@media (max-width:1128px) {

	.tick-flip {
		font-size: 13px !important;
	}
}
@media (max-width:1073px) {
	.navbar-brand img{
		max-width: 120px;
	}
	#rt-carousel {
    margin-top: 115px;
}
}

@media (max-width:1039px) {
	.slides-pagination {
		width: 100%;
		transform: none;
		bottom: 30px;
	}
	.tick-flip {
		font-size: 12px !important;
	}
}

@media (max-width:1062px) {
	.nav-item {
		margin-right: 20px;
	}
}

@media (min-width:768px) and (max-width:991px) {
	.reference-section figure.effect-chico h2 {
		font-size: 1.4rem;
	}

	.reference-right figure.effect-chico h2 {
		padding: 10% 0 20px 0;
	}

	.reference-section figure.effect-chico p {
		display: none;
	}

	.work figure.effect-chico h2 {
		font-size: 2rem;
	}

	.work figure.effect-chico p {
		display: block;
	}

}

@media (min-width:577px) and (max-width:767px) {

	.reference-section figure.effect-chico figcaption::before,
	figure.effect-chico p {
		border: none;
	}
}

@media (min-width:768px) and (max-width:991px) {

	.philosophy-section {
		padding: 96px 0 360px;
	}

}

@media (max-width:991px) {
	.nav-home {
		display: none;
	}

	.nav-dt {
		display: none;
	}

	.nav-mobile {
		display: block;
		background-image: url(../images/about-bg02.jpg);
		background-position: center center;
		background-repeat: no-repeat;
	}

	.philosophy-heading {
		top: -15%;
	}

	.caption-container {
		left: 0;
		right: 0;
		top: 17%;
	}

	.caption-content {
		padding: 40px 15px;
	}

	.design-image {
		display: none;
	}

	.text-bg-02 {
		left: 0;
	}

	.text-bg-03 {
		left: 0;
	}

	.corporate-content .btn {
		width: 100%;
		padding: 10px;
	}

	.text-bg-01 {
		display: none;
	}

	.reference-left img {
		text-align: right;
		margin-right: 0;
		float: right;
	}

	.reference-content {
		padding: 15px;
	}

	.certificate-logo {
		margin-top: 30px;
	}

	.logo-ft img {
		max-width: 160px;
	}

	.form-section {
		margin-top: 30px;
	}

	.news-item-section .content-divider {
		display: none;
	}

	.news-item {
		margin-bottom: 30px;
	}

	.md-content .heading-section {
		margin-bottom: 10px;
	}

	.md-content .fa {
		display: none;
	}

	.statistic-item p {
		font-size: 1.2rem;
	}

	.projects-detail {
		margin-top: 30px;
	}

	.eos-menu-title p {
		font-family: 'montserratbold';
		color: #6755a6;
		display: inline-block;
		position: relative;
		top: 5px;
		margin-left: 10px;
	}

	.eos-menu .eos-menu-title,
	.eos-menu .eos-group-title {
		border-bottom: none !important;
	}

	/*
	.carousel-caption {
		left: auto;
		right: auto;
	}*/
	.carousel-caption h1 {
		font-size: 3.6rem;
		line-height: 4.4rem;
	}

	.carousel-caption h1 br {
		display: none;
	}

	.safety-section .content-divider {
		display: none;
	}

	.safety-method {
		margin-bottom: 30px;
	}

	.quality-left .quality-content {
		padding: 15px;
	}

	.quality-section .quality-content {
		padding: 15px;
	}

	.services-img-left {
		padding-left: 15px;
		padding-right: 15px;
	}

	.services-img-right {
		padding-left: 15px;
		padding-right: 15px;
	}

	.row-services ul {
		padding-left: 0;
	}

	.contactperson-section .content-divider {
		display: none;
	}
	.timeline-horizontal .timeline-item {
		width: 100%;
		min-width: 100%;
		display: block;
		margin-bottom: 120px;
	}
	.employee-img {
		margin-top: 30px;
	}
	.subscontractor-img {
		margin-top: 30px;
	}

	.training-container .content-divider {
		display: none;
	}
	.main-content .btn-slides {
		display: none;
	}
	.nav-mobile {
		display: block;
		position: fixed;
		right: 0;
		left: 0;
		border-radius: 0;
		top: 0;
		z-index: 9999;
		box-shadow: 0 1px 6px 0 rgba(32, 33, 36, 0.28);
		padding: 0;
	}
	.carousel {
		margin-top: 93px;
	}
	.chart-right {
		padding-left: 15px;
	}
	.certificate-logo li {
		text-align: left;
	}	
	#rt-carousel {
	    margin-top: 92px;
    }
	.modal-lg{
		max-width: 100%;
		margin: 0 15px;
	}
	.cookiealert{
		padding: 15px 0;
	}
	.cookiealert p {
		text-align: center !important;
	}
	.cookiealert p br {
		display: none;
	}
	.cookiealert .btn {
		margin: 30px auto 0 !important;
		text-align: center;
		display: block;
		width: 80%;
	}
}

@media (max-width:767px) {
	.caption-container {
		position: relative;
		top: 0;
	}

	figure.effect-chico figcaption {
		padding: 1rem;
	}

	figure.effect-chico h2 {
		font-size: 1.6rem;
	}

	.reference-left {
		margin-bottom: 30px;
	}

	.reference-left img {
		width: 100%;
	}

	.reference-right {
		display: block;
	}

	.reference-content {
		padding: 0 15px;
		margin-bottom: 30px;
	}

	.reference-content .heading-section {
		text-align: left;
	}

	.reference-content .btn {
		float: left;
	}

	.reference-content br {
		display: none;
	}

	.logo-ft {
		margin-bottom: 30px;
	}

	.about-main {
		padding-bottom: 80px;
	}

	.md-content .heading-section {
		margin-top: 30px;
		text-align: left;
	}

	.md-content .heading-section br {
		display: none;
	}

	.statistic-item {
		margin-bottom: 30px;
	}

	.statistic-item p {
		font-size: 1.4rem;
	}

	.aboutus-statistic {
		max-height: none;
	}

	.container-1st {
		margin-bottom: 30px;
	}

	.portfolio {
		padding: 15px;
	}

	.portfolio-controllers .filter-btn {
		width: 100%;
		margin-left: 0;
		border: none;
		margin-bottom: 15px;
		background: #fff;
		box-shadow: 0 2px 5px #ccc;
	}

	.portfolio-inner {
		margin-bottom: 30px;
		overflow: hidden;
		padding: 15px;
	}

	.carousel-caption h1 {
		font-size: 2.8rem;
		line-height: 3.6rem;
	}

	.office-location-item {
		margin-bottom: 30px;
	}
	.training-item {
		margin-bottom: 30px;
	}
	.breadcrumb-dt {
		display: none;
	}

	.news-item .card-body {
		min-height: auto;
	}
	.nav-mobile {
		z-index: 9999;
		padding: 0;
		width: 100%;
		position: fixed;
		top: 0;
		-webkit-transition: all 0.25s ease-in-out;
		transition: all 0.25s ease-in-out;
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
		overflow: hidden;
	}
	.navbar.hide-nav {
		-webkit-transform: translateY(-100%);
		transform: translateY(-100%);
	}
	.modal-dialog {
		max-width: 100%;
		margin: 15px;
	}
	/*.carousel {
		position: relative;
		margin-top: 93px;
	}
	.nav-mobile{
		position: fixed;
    	width: 100%;
    	display: block;
    	z-index: 999;
		top: 0;
	}
	.main-content header{
		z-index: 999;
		height: 93px;
	}
	.main-content .carousel{
		display: inline-block;
		width: 100%;
	}*/
}

@media (max-width:600px) {
	.carousel-caption h1 {
		font-size: 2.4rem;
	}

	.carousel-caption p {
		display: none;
	}
}

@media (max-width:576px) {
	.all-caption h1 {
		font-size: 3.6rem;
	}

	.philosophy-section {
		padding: 96px 0;
	}

	.caption-content {
		background: none;
	}

	.text-bg-02 {
		display: none;
	}

	.text-bg-03 {
		display: none;
	}

	.reference-item:last-child {
		margin-top: 0;
	}

	figure.effect-chico h2 {
		font-size: 1.6rem;
	}

	.design-section .btn {
		width: 100%;
	}

	.address-info {
		margin-bottom: 30px;
	}

	.design-item figure.effect-chico h2 {
		position: absolute;
		top: 50%;
		left: 0;
		width: 100%;
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
		text-align: center;
		padding: 0;
		font-size: 2rem;
	}

	.design-item figure.effect-chico p {
		display: none;
	}

	.reference-section figure.effect-chico h2 {
		position: absolute;
		top: 50%;
		left: 0;
		width: 100%;
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
		text-align: center;
		padding: 0;
	}

	.reference-section figure.effect-chico p {
		display: none;
	}

	.reference-right figure.effect-chico img {
		width: 100%;
	}

	.reference-right .reference-item {
		margin-bottom: 30px;
	}

	.news-item {
		margin-bottom: 15px;
	}

	.philosophy-item {
		padding: 0 15px;
	}

	.portfolio-inner {
		margin-bottom: 0;
	}

	.eos-menu-title p {
		display: none;
	}

	.carousel-caption h1 {
		font-size: 1.6rem;
		line-height: 2.4rem;
	}

	.philosophy-section {
		padding: 64px 0;
	}

	.img-services {
		min-height: 240px;
	}

	.services-content {
		padding: 30px;
	}

	.services-section {
		margin-bottom: 30px;
	}
	.registration .heading-section {
		text-align: center;
	}
	.registration-item {
		text-align: center;
		padding: 0 30px;
	}
	.registration-item:last-child {
		margin-bottom: 30px;
	}
	.page-link {
		padding: 0.7rem 0.5rem;
		font-size: 1.2rem;
	}
	.philosophy-content {
		position: absolute;
		width: 100%;
		position: absolute;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
		margin-top: 0;
	}
	.contact-info p {
		width: 70%;
	}	
	.cookiealert a{
		display: block;
		margin-bottom: 10px;
	}
	.cookiealert a:last-child{
		margin-bottom: 0;
	}
	.cookiealert span{
		display: none;
	}
	.copyright{
		padding: 15px;
	}
	.copyright-container{
		text-align: left;
		margin-bottom: 15px;
	}
	.policy-container{
		text-align: left;
	}
	.policy-container ul li:first-child{
		margin-left: 0;
	}
}

@media (max-width:400px) {
	.contact-info strong {
		width: 25%;
	}

	.contact-info p {
		width: 70%;
	}

	
}