@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;

	}


.web {

	

	background:#1b2559;

	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;

	}
	
	.web {

	

	background:#1b2559;

	background-image: url(../../upload/hero/web_small.png);

	background-size:80%;

	background-repeat:no-repeat;

	background-position:100% 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;

	}
	
	.web {

	

	background:#1b2559;

	background-image: url(../../upload/hero/web_small.png);

	background-size:80%;

	background-repeat:no-repeat;

	background-position:100% 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;

	}
	.web {

	

	background:#1b2559;

	background-image: url(../../upload/hero/web_small.png);

	background-size:80%;

	background-repeat:no-repeat;

	background-position:100% 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;}