@charset "utf-8";
/* CSS Document */

.swiper-slide img { max-width: 150px;}

.home-hero-container {background-image: url(../../upload/piling/bg_animation.gif); background-color:#08dfe6;}

.thanks-hero-container { background-image: url(../../upload/piling/thanks-big.gif);background-color:#83def0; background-position: center; background-size: auto;}

.home-hero-inner {background:url(../../upload/piling/home.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}

.thanks-hero-inner {background:url(../../upload/piling/thanks.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}

.service-hero-container {background-image: url(../../upload/hero/bg_animation_service.gif); background-color:#f6d22d}

.service-hero-inner {background:url(../../upload/hero/service.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}



.about-hero-container {background-image: url(../../upload/hero/bg_animation.gif); background-color:#1cb47c}

.about-hero-inner {background:url(../../upload/hero/about.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}



.service-title-left {text-align:left;  margin-top:30px; font-weight:normal; color:#FFF; line-height:40px;}

.service-title-right {text-align:right;  margin-top:30px; font-weight:normal; color:#FFF; line-height:40px;}

.service-desc-left {text-align: justify; width:60%; color:#FFF;}

.service-desc-right {text-align: justify; width:60%; margin-left:40%; color:#FFF;}

.service-image {}


.service-wrapper {
	width:100%;
	max-height:100vh;
	overflow-x:hidden; 
	background-color:#FFF; 
	overflow-y:visible;
	}
	
.service-left {
	height:600px;
	width:200%; 
	top:50px; 
	left:-50%; 
	position:relative; 
	overflow:hidden;
	/*-ms-transform: rotate(5deg);
	-webkit-transform: rotate(5deg);
	transform: rotate(5deg);*/
	}

.service-right {
	height:600px; 
	width:200%; 
	top:50px; 
	left:-50%; 
	position:relative; 
	overflow:hidden;
	/*-ms-transform: rotate(-5deg);
	-webkit-transform: rotate(-5deg);
	transform: rotate(-5deg);*/
	}

.service-icon-left {
	left:15%; 
	top:30%; 
	position: relative; 
	background-color:#00F; 
	width:100px; 
	height:100px; 
	z-index:900;
	}

.service-icon-right {
	left:75%; 
	top:30%; 
	position: relative; 
	background-color:#00F; 
	width:100px; 
	height:100px; 
	z-index:900;
	}
	
.col-flex-4 {
	
	width: 30.33333333%;
	position: relative;
    min-height: 1px;
	float: left;
	display: flex;
	flex-wrap: wrap;
	margin:1.5%;
	}
	
.col-flex-2 {
	
	width: 46%;
	position: relative;
    min-height: 1px;
	float: left;
	display: flex;
	flex-wrap: wrap;
	margin:1.5%;
	}
	
.col-flex-40 {
	
	width: 33.1%;
	position: relative;
    min-height: 1px;
	float: left;
	display: flex;
	flex-wrap: wrap;
	margin:0;
	}
	
.col-flex-8 {
	
	width: 66.6666666%;
	position: relative;
    min-height: 1px;
	float: left;
	display: flex;
	flex-wrap: wrap;
	}
	
.col-flex-4-right {
	
	width: 30.33333333%;
	position: relative;
    min-height: 1px;
	margin-left:66.666666%;
	float: left;
	display: flex;
	flex-wrap: wrap;
	margin:1.5%;
	}


.row-flex {
    margin-right: -15px;
    margin-left: -15px;
	display: flex;
	flex-wrap: wrap;
	}
	
	
.row-flex:before, .row-flex:after	{
	display: table;
   content: " ";}
  
  
.cell-flex {
    position: relative;
    overflow: hidden;
    text-align: center;
	display: flex;
	min-height:500px;
	flex-direction: column;
    width:100%;
	}
	
.text-flex {
    position: relative;
    overflow: hidden;
    text-align: center;
	display: flex;
	flex-direction: column;
    width:100%;
	}
	
.icon {
	
	width: 100px;
	height:100px;
	
	}

.team-media {padding:3.125em;}




.strategy {
	
	background:#e53738;
	padding:3.125em;
	min-height:37.5em;
	}

.direct {
	
	background:#3556a3;
	padding:3.125em;
	min-height:37.5em;
	}

.events {
	
	background:#ea6536;
	padding:3.125em;
	min-height:37.5em;
	}

.creative {
	
	background:#23ac7b;
	padding:3.125em;
	min-height:37.5em;
	}
	
.digital {
	
	background:#d12a76;
	padding:3.125em;
	min-height:37.5em;
	}
.outsourcing {
	
	background:#efb82e;
	padding:3.125em;
	min-height:37.5em;
	}
.activation {
	
	background:#422a9b;
	padding:3.125em;
	min-height:37.5em;
	}
.intelligence {
	
	background:#4bd4e2;
	padding:3.125em;
	min-height:37.5em;
	}
	
.service-image{ vertical-align:middle;}

.project-sidebar {
 
  padding: 150px 50px 90px;
}

	.navigation {
  
  max-width: 400px;
	
}


@media only screen and (max-width: 1200px) {
	
	.swiper-slide img { max-width: 150px;}

 .col-flex-4 {display: block; width:100%;}
 
 .col-flex-8 {visibility:hidden; max-height:0px;}
 .col-flex-4-right {display: block; width:100%; margin-left:0;}
 .cell-flex {min-height:500px;}
 .row-flex {display: block;}
 .icon {
	
	width: 100px;
	height:100px;
	
	}
 .ul { text-align:center;}
 .team-media {padding:40px;}

	.project-sidebar {
 
  padding: 150px 50px 90px;
}
	
		.navigation {
  
  max-width: 400px;
	
}

}
 
 
@media only screen and (max-width: 900px) { 
	
	.swiper-slide img { max-width: 120px;}

.home-hero-container {background-color:#54c3bf; background-image: url(../../upload/piling/bg_animation5.gif); }

.home-hero-inner {background:url(../../upload/piling/home.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}

	.thanks-hero-container { background-image: url(../../upload/piling/thanks-medium.gif);background-color:#83def0; background-position: center; background-size: auto;}

.thanks-hero-inner {background:url(../../upload/piling/thanks-medium.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}
	
	
.service-hero-container {background-color:#f6d22d; background-image: url(../../upload/hero/bg_animation_service2.gif); }

.service-hero-inner {background:url(../../upload/hero/service.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}



.about-hero-container {background-color:#1cb47c; background-image: url(../../upload/hero/bg_animation_about.gif); }

.about-hero-inner {background:url(../../upload/hero/about.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}

.service-image {visibility:hidden;}
.strategy {
	background:#e53738;
	background-image: url(../../upload/hero/strategy_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.direct {
	
	background:#3556a3;
	background-image: url(../../upload/hero/direct_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
	
.events {
	
	background:#ea6536;
	background-image: url(../../upload/hero/events_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
	
.creative {
	
	background:#23ac7b;
	background-image: url(../../upload/hero/creative_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
	
.digital {
	
	background:#d12a76;
	background-image: url(../../upload/hero/digital_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.outsourcing {
	
	background:#efb82e;
	background-image: url(../../upload/hero/outsourcing_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
.activation {
	
	background:#422a9b;
	background-image: url(../../upload/hero/activation_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.intelligence {
	
	background:#4bd4e2;
	background-image: url(../../upload/hero/intelligence_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
.col-flex-40 {display: block; width:100%;}
.col-flex-2 {display: block; width:100%;}

.service-title-left {text-align:left;  margin-top:30px; font-weight:normal; color:#FFF; line-height:35px;}
.service-title-right {text-align:right;  margin-top:30px; font-weight:normal; color:#FFF; line-height:35px;}

.service-desc-left {text-align: justify; width:100%; color:#FFF; direction:ltr;}
.service-desc-right {text-align: justify; width:100%; margin-left:0%; color:#FFF;direction:ltr;}
.team-media {padding:10px;}
	
.project-sidebar {
 
  padding: 90px 50px 90px;
}
	
		.navigation {
  
  max-width: 400px;
	
}
}

@media only screen and (max-width: 760px) {
	
	.swiper-slide img { max-width: 120px;}
	
	.home-hero-container {background-color:#54c3bf; background-image: url(../../upload/piling/bg_animation5.gif); }

.home-hero-inner {background:url(../../upload/piling/home.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}
	
.thanks-hero-container { background-image: url(../../upload/piling/thanks-small.gif); background-color:#83def0; background-position: center; background-size: auto;}

.thanks-hero-inner {background:url(../../upload/piling/thanks-small.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh;
	background-size: cover;}
	
.service-hero-container {background-color:#f6d22d; background-image: url(../../upload/hero/bg_animation_service2.gif); }

.service-hero-inner {background:url(../../upload/hero/service.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}



.about-hero-container {background-color:#1cb47c; background-image: url(../../upload/hero/bg_animation_about.gif); }

.about-hero-inner {background:url(../../upload/hero/about.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}


	.service-image {visibility:hidden;}
.strategy {
	background:#e53738;
	background-image: url(../../upload/hero/strategy_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.direct {
	
	background:#3556a3;
	background-image: url(../../upload/hero/direct_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	}	
.events {
	
	background:#ea6536;
	background-image: url(../../upload/hero/events_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.creative {
	
	background:#23ac7b;
	background-image: url(../../upload/hero/creative_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
.digital {
	
	background:#d12a76;
	background-image: url(../../upload/hero/digital_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.outsourcing {
	
	background:#efb82e;
	background-image: url(../../upload/hero/outsourcing_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
.activation {
	
	background:#422a9b;
	background-image: url(../../upload/hero/activation_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.intelligence {
	
	background:#4bd4e2;
	background-image: url(../../upload/hero/intelligence_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
 .col-flex-4 {display: block; width:100%; min-height:500px;}
 .col-flex-40 {display: block; width:100%; min-height:500px;}
 .col-flex-2 {display: block; width:100%;}
 .col-flex-8 { visibility:hidden;}
 .col-flex-4-right {display: block; width:100%; margin-left:0;}
 .cell-flex {min-height:450px;}
 .row-flex {display: block;}
 .icon {
	
	width: 70px;
	height:70px;
	
	}
	.ul { text-align:center;}
	
.clients {
	
	visibility:hidden;
	display: none;

	
	}
	
	.owl-wrapper {align-content: center;
	align-items: center;}
	
	
.team-media {padding:20px;}

.service-title-left {text-align:left;  margin-top:30px; font-weight:normal; color:#FFF; line-height:30px;}
.service-title-right {text-align:right;  margin-top:30px; font-weight:normal; color:#FFF; line-height:30px;}

.service-desc-left {text-align: justify; width:100%; color:#FFF;direction:ltr;}
.service-desc-right {text-align: justify; width:100%; margin-left:0%; color:#FFF;direction:ltr;}
.team-media {padding:10px;}

	.project-sidebar {
 
  padding: 80px 50px 80px;
}
	
		.navigation {
  
  max-width: 100%;
	
}
	
	
	
}
@media only screen and (max-width: 560px) {
	.swiper-slide img { max-width: 120px;}
	
	.home-hero-container {background-color:#54c3bf; background-image: url(../../upload/piling/bg_animation5.gif); }

.home-hero-inner {background:url(../../upload/piling/home.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}
	
.thanks-hero-container { background-image: url(../../upload/piling/thanks-small.gif); background-color: #83def0; background-position: center; background-size: auto;}

.thanks-hero-inner {background:url(../../upload/piling/thanks-small.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh;
	background-size: cover;}
	

.service-hero-container {background-color:#f6d22d; background-image: url(../../upload/hero/bg_animation_service2.gif); }

.service-hero-inner {background:url(../../upload/hero/service.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}



.about-hero-container {background-color:#1cb47c; background-image: url(../../upload/hero/bg_animation_about.gif); }

.about-hero-inner {background:url(../../upload/hero/about.png) center no-repeat; top:0; left:0; position:absolute; width:100%; height:100vh; background-size: cover;}

.service-image {visibility:hidden;}
.strategy {
	background:#e53738;
	background-image: url(../../upload/hero/strategy_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.direct {
	
	background:#3556a3;
	background-image: url(../../upload/hero/direct_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
.events {
	
	background:#ea6536;
	background-image: url(../../upload/hero/events_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.creative {
	
	background:#23ac7b;
	background-image: url(../../upload/hero/creative_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
.digital {
	
	background:#d12a76;
	background-image: url(../../upload/hero/digital_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}	
.outsourcing {
	
	background:#efb82e;
	background-image: url(../../upload/hero/outsourcing_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
.activation {
	
	background:#422a9b;
	background-image: url(../../upload/hero/activation_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:100% 100%;
	min-height:31.25em;
	}
.intelligence {
	
	background:#4bd4e2;
	background-image: url(../../upload/hero/intelligence_small.png);
	background-size:80%;
	background-repeat:no-repeat;
	background-position:0 100%;
	min-height:31.25em;
	}
 .col-flex-4 {display: block;width:100%;min-height:300px;}
 .col-flex-40 {display: block;width:100%;min-height:300px;}
 .col-flex-2 {display: block; width:100%;}
 .col-flex-8 { visibility:hidden;}
 .col-flex-4-right {display: block; width:100%; margin-left:0;}
 .cell-flex {min-height:400px;}
 .row-flex {display: block;}
 .icon {
	
	width: 60px;
	height:60px;
	
	}
	.ul { text-align:center;}
.clients {
	
	visibility:hidden;
	display: none;

	}
	
		.owl-wrapper {align-content: center;
	align-items: center;}
	
	
.team-media {padding:20px;}

.service-title-left {text-align:left;  margin-top:30px; font-weight:normal; color:#FFF; line-height:30px;}
.service-title-right {text-align:right;  margin-top:30px; font-weight:normal; color:#FFF; line-height:30px;}

.service-desc-left {text-align: justify; width:100%; color:#FFF;direction:ltr;}
.service-desc-right {text-align: justify; width:100%; margin-left:0%; color:#FFF;direction:ltr;}
.team-media {padding:10px;}
	
.project-sidebar {
 
  padding: 50px 50px 50px;
}
	
		.navigation {
  
  max-width: 100%;
	
}
}

.service { padding:15px;}