@font-face {
    font-family: 'andlso_1';
    src: url('../fonts/andlso_1.ttf');
}
@font-face {
    font-family: 'ARBATDI_0';
    src: url('../fonts/ARBATDI_0.TTF');
}
body {font-family: 'Yantramanav', sans-serif; text-rendering: optimizeLegibility; }
ul li {text-decoration: none; list-style: none;}
a, a:hover { text-decoration: none; color: #090909; }

/*header section */
.navigation { position: fixed; top: 0; left: 0; width: 100%; z-index: 150; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); text-align: center; } 

.navigation ul, .navigation li { padding: 0; margin: 0; list-style: none; display: block; position: relative; text-align: center; }
.navigation li a { font-family: "Open Sans", sans-serif; font-weight: 400; height: 65px; display:inline-block; color: #090909; font-size: 16px; padding: 1.5em 1em; text-transform: capitalize; text-align: center; letter-spacing: 1px; -webkit-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); transition: all 0.27s cubic-bezier(0.000, 0.000, 0.580, 1.000); text-decoration: none; z-index: 160; position: relative; }
.navigation li { float: left; }
.navigation li:before { -webkit-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; content: " "; width: 100%; height: 5px; background: #000; position: absolute; top: 0; left: 0; }
.navigation li.nav-aboutus:before { background: #91d306; }
.navigation li:hover a { color: #FFF; }
.navigation li:hover:before, .navigation li.active:before { height: 100%; }
.navigation li.active a { color: #FFF; }
.navigation li.nav-ourprocess:before {background: #27d3eb;}
.navigation li.nav-services:before {background: #e8e8e8;}
.navigation li.nav-clients:before {background: #ed1941;}
.navigation li.nav-testimonial:before {background: #2e373c;}
.navigation li.nav-careers:before {background: #e77817;}
.navigation li.nav-address:before{background: #c82927;}
.navigation ul { display: inline-block; margin-bottom: -11px; }
.navigation.sm { background: rgba(255,255,255,0.7); }
/*.navigation.sm li a { padding: 1.5em 1em 1.5em 1em; }*/


.navigation-button { padding: 10px 10px; text-align: right; }
.navigation.mobile { background: rgba(255,255,255,0.9); }
.navigation.mobile ul { display: block; }
.navigation.mobile li { float: none; }
.navigation.mobile li a { padding: 1.5em 1em 1.5em 1em; display: block; text-align: left; }

#scrollNav { padding: 7px 120px; font-size: 22px; border: 0; background: transparent; outline: 0; text-align: right;  }

/* Slider section */
.slider{max-width: 100%;}

/* about us */
.aboutus {background: url(../img/abouutus1.jpg) center bottom repeat-x; max-width: 100%; overflow: hidden;}
.aboutus .heading{padding-top: 55px; padding-left: 230px;}
.aboutus .heading span{ text-transform: uppercase; font-weight: 800; color: #333; z-index: 100; color:#91d306; position: relative; }
.aboutus .heading p{ text-transform: uppercase; font-weight: 700; font-size: 60px; color: #ffffff;}
.description p { font-size: 16px; font-weight: 400; color: #f8fcf4; font-family: 'Open Sans', sans-serif; padding-bottom: 1em; }

.quoteline { position: relative; text-align: center; margin-top: 45px; }
.quoteline p.quote{ font-size: 30px; color:#f8fcf4; font-weight: 800; }
p.quote::before {content: "\f10d"; font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; top:0; left: 10%; } 
p.quote::after {content: "\f10e";font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; right: 10%;}

.bottomline {z-index: 20; background: url(../img/abouutus1.jpg) center bottom; position: relative; padding-top: 70px; padding-bottom: 45px;}
.bottomline p.title{text-align: center; color: #f8fcf4; font-size: 36px; font-weight: 800;}
.bottomline p {text-align: center; color: #f8fcf4; font-size: 18px;  font-family: 'Open Sans', sans-serif; font-style: italic; }
.A { font-size: 64px; font-family: "Yantramanav"; color: rgb( 255, 255, 255 ); text-align: right; -moz-transform: matrix( 15.5342677708693,5.39208553073831,-5.39208553073831,15.5342677708693,0,0); -webkit-transform: matrix( 15.5342677708693,5.39208553073831,-5.39208553073831,15.5342677708693,0,0); -ms-transform: matrix( 15.5342677708693,5.39208553073831,-5.39208553073831,15.5342677708693,0,0); position: absolute; right: 55.2%; top: 140px; font-weight: 800; }

/* our process */
.ourprocess {background: url(../img/ourprocess.jpg); padding: 3em 0; }
.about-container-block { background: url(../img/shape.png) center -60px no-repeat; }
.ourprocess h2 {text-align: center;text-transform: uppercase; font-size: 60px; color: #fff; font-weight: 800;}
.ourprocess p.tagline{ padding: 0 20px; font-size: 36px; color:#090909; padding-top: 50px; padding-bottom: 0px;color:#fff;text-align: center; }
.ourprocess p.tagline span { color: #FFF; position: relative; display: inline-block; font-weight: 800; }
.ourprocess p.tagline span::before {content: "\f10d"; font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; top:0; left: -5%; } 
.ourprocess p.tagline span::after {content: "\f10e";font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; right: -5%;}


.about-container-block { margin: 2em auto 2em; }
.about-container::after, .about-container-block::after { content: ''; clear: both; display: block; }
.about-block { height: 200px; margin: 0 auto; float: left; padding: 0 58px; display: table; }
.about-block .text { font-size: 16px; text-align: center; color: #FFF; margin-top: 20px; font-family: "Open Sans", sans-serif; font-weight: 700; text-transform: none; }
.about-block:last-child { padding-right: 0; }
.about-block .block { display: table; }
.about-block .block > div { display: table-cell; width: 150px; height: 150px; border-radius: 50%; vertical-align: middle; text-align: center; } 
.about-block .block > div img { margin: 0 auto; }
.about-block .block > div.ourwork img { margin: 0 auto; padding: 10px; background-color: #FFF; }
#about h3 { text-indent: 0; text-transform: none; }
.strategy { border-radius: 50%; position: relative; top: 50px; }
.planning { position: relative; top: 65px; }
.planning img { position: relative; left: 7px; }
.about-block .block > div.ourwork .image, .ourwork { width: 200px !important; height: 200px !important; position: relative; cursor: pointer; }
.about-block .block > div.ourwork .image .worklist { width: 200px !important; height: 200px !important; position: absolute; top: 0; left: 0; background: #FFF; border-radius: 50%; display: table; }
.about-block .block > div.ourwork .image .worklist span { vertical-align: middle; display: table-cell; font-size: 16px; }
.worklist a { display: block; }
.about-block .block > div.ourwork img { position: absolute; top: 0; left: 0; }
.about-block .block > div.ourwork img { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }
.about-block .block > div.ourwork .image:hover img { webkit-transform: rotate(-120deg); */ -moz-transform: rotate(-120deg); -o-transform: rotate(-120deg); -ms-transform: rotate(-120deg); transform: rotate(-120deg); -webkit-transform-origin: 76% 10%; -moz-transform-origin: 76% 10%; -o-transform-origin: 76% 10%; -ms-transform-origin: 76% 10%; transform-origin: 76% 10%; }
.ourwork img { border-radius: 50%; border: 5px solid #54d0ed; }

.connections.fixed { position: fixed; top: 130px; right: 0; z-index: 150; }
.connections.fixed a { display: block; margin-bottom: 1px; border-radius: 0; width: 45px; height: 45px; background: #414042 !important; }
.connections.fixed a.facebook:hover { background: #39599f !important; }
.connections.fixed a.linkedin:hover { background: #1884bc !important; }
.connections.fixed a.twitter:hover { background: #00aced !important; }
.connections.fixed a.email:hover { background: #fce415 !important; }
.connections.fixed a.google:hover { background: #d22930 !important; }
.connections.fixed a.pinterest:hover { background: #910101 !important; }
.connections.fixed a.blog:hover { background: #f87f14 !important; }

/* our Services */

.services-images{  margin: 0 auto;}
.automobile{background-color:#91d306;border: 14px solid #9add0c; height:200px; width:200px; overflow:hidden; border-radius:50%; display: table;  margin:0 auto;}
.corporate {background-color:#16d0eb;border: 14px solid #04ddfd; height:200px; width:200px; overflow:hidden; border-radius:50%; display: table;  margin:0 auto;} 
.graphics {background-color:#ba1284;border: 14px solid #ed1fab; height:200px;width:200px; overflow:hidden; border-radius:50%; display: table;  margin:0 auto;}
.services {background-color:#ffcb05;border: 14px solid #f9951d; height:200px; width:200px; overflow:hidden; border-radius:50%; display: table;  margin:0 auto;} 

/*.overlay { position: absolute; top: 0; left: 0; z-index: 200; }
.overlay .expand { cursor: initial; }*/
.overlay { position: fixed; width: 100%; height: 100%; overflow: hidden; top: 0; left: 0; z-index: 200; visibility: hidden; -webkit-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; } 
.overlay > div { -webkit-transition: all 500ms ease-in-out; -o-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; }
.expand { cursor: pointer; -webkit-transform: scale(1); -moz-transform: scale(1,1);
-ms-transform: scale(1,1);
-o-transform: scale(1,1);
transform: scale(1,1); }
.expand-contents { width: 100%; height: 100%; position: fixed; left: 0; top: 0; visibility: hidden; /*padding: 40px;*/ color: #FFF; overflow: auto; }
.expand-header { text-align: center; padding-bottom: 20px; }
.expand-header img { width: 80px; }
.expand-contents .tagline { font-size: 24px; color: #090909; line-height: 1; letter-spacing: 1px; }
.close { font-size: 40px; opacity: 0.5; position: fixed; top: 10px; right: 30px; }

.works-list { font-family: "Open Sans", sans-serif; font-size: 16px; padding-top: 50px; }
.works-list li { list-style: square; }


.automobile i { display: table-cell; color: #ffffff; vertical-align:middle; text-align:center; }
.corporate i { display: table-cell; color: #ffffff; vertical-align:middle; text-align:center; } 
.graphics i { display: table-cell; color: #ffffff; vertical-align:middle; text-align:center; }
.services i { display: table-cell; color: #ffffff; vertical-align:middle; text-align:center; }
.services-images p {text-align: center; font-size: 23.53px; }
p.automobile-text {color: #91d306;text-align: center;padding-top: 20px; text-transform: uppercase; line-height: 1; font-size: 24px; font-weight: 800; }
p.corporate-text {color:#16d0eb; font-weight: 800; text-align: center;padding-top: 20px; text-transform: uppercase; line-height: 1;}
p.graphics-text {color: #ba1284; font-weight: 800; text-align: center;padding-top: 20px; text-transform: uppercase; line-height: 1;}
p.special-text {color: #d14c03; font-weight: 800; text-align: center;padding-top: 20px; text-transform: uppercase; line-height: 1;}

.our-services { background-image: url(../img/services.jpg); max-width: 100%; padding: 6em 0; }
.our-services h2 { margin:0; padding:0;text-align: center;text-transform: uppercase; font-size: 60px; color: #58595b; font-weight: 800; padding-bottom: 60px; }
.our-services p.tagline { position: relative; font-size: 30px; color:#58595b; margin-top: 2em; font-weight: 800; }
.our-services p.tagline::before {content: "\f10d"; font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; top:0; left: 10%; } 
.our-services p.tagline::after {content: "\f10e";font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; right: 10%;}

/* Client Section */
.clients img{max-width: 100%;}



/* testimonial section */
.testimonial { background: #2e373c url(../img/testimonial.jpg) center top no-repeat; max-width: 100%;}
.testimonial ul, .testimonial li {text-align: center; list-style: none; color: #fff;}
.testimonial img {border-radius: 50%; border:5px solid #fff; display: block; margin:0 auto; width: 135px; position: relative; z-index: 100; }


/* address section */
.address { background: #ce252a url(../img/address.jpg) center top no-repeat; padding: 4em 0; }
.address h2 { margin:0; padding:0;text-align: center;text-transform: uppercase; font-size: 60px; color: #f8fcf4; font-weight: 800; }
.address .content {text-align: center; font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 20px; color:#f8fcf4 }
.address .content img { display: block; margin: 0 auto; }

/*location section */
.location iframe{width: 100%;}
.gmap { height: 420px; }
/* footer page */
#footer {background-color: #090909;}
#footer h4 {padding:0; margin: 0; font-family: 'Open Sans', sans-serif; font-weight: 400; font-size: 14px; text-align: center; color: #f8fcf4; padding: 35px 0px;}
#footer a {font-family: 'Open Sans', sans-serif; font-weight: 700; color: #f8fcf4; }




#timeline {
	width: 100%;
	overflow: hidden;
	margin: 5em 0 5em;
	position: relative;
}
#users {
	width: 800px;
	height: 140px;
	overflow: hidden;
	padding: 0; 
	margin: 0;
}
#users li {
	list-style: none;
	float: left;
	width: 163px;
	height: 140px;
	font-size: 24px;
	text-align: center;
}
#users li a { display: block; width: 180px; }
#users li a { -webkit-transform: scale(0.7); -ms-transform: scale(0.7); -o-transform: scale(0.7); transform: scale(0.7); -webkit-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; opacity: 0.4; position: relative; } 
#users li a.selected { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); opacity: 1; }
#users li a.selected:after { width: 20px; height: 20px; background: #FFF; position:absolute; bottom: -8px; left: 50%; margin-left: -10px; content:  " "; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } 
#users li a { display: block; margin: 0 auto; }
		
#issues {
	width: 1170px;
	overflow: hidden;
	padding: 0; margin: 0;
}	
#issues li {
	width: 1170px;
	list-style: none;
	float: left;
}
#issues li p {
	width: auto;
	font-size: 14px;
	font-weight: normal;
	line-height: 30px;
	font-family: "Open Sans", sans-serif;
	padding: 20px 115px 0 70px;
	margin-bottom: 0;
}
#issues li p.name { line-height: 1.5; }

.bottomline p, .about-block .block, .services-images .col-md-3 > div { opacity: 0; }

.services-images .col-md-3 > div:hover { opacity: 1; -webkit-animation-name: scaleOut; animation-name: scaleOut; }

.getInTouch, .news { position: fixed; top: 130px; width: 300px; background: #fff; z-index: 200; padding: 25px 25px 10px 15px; -webkit-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; border: 1px solid #eee; font-family: "Open Sans", sans-serif; border-radius: 0 10px 10px 0; }
.news button, .getInTouch button { position: absolute; top: 15px; right: -40px; border: 0; outline: 0; padding: 5px 5px 5px 0; color: #ed3237; background: #fff; width: 40px; height: 50px; font-size: 20px; border-top: 1px solid #eee; border-right: 1px solid #eee; border-bottom: 1px solid #eee; font-weight: bold; }
.news.sm { right: -300px; }
.getInTouch { left: 0; }

.getInTouch button { height: 155px; }
.getInTouch button div { width: 40px; overflow: hidden; margin: 0 auto; }
.getInTouch button div img { position: relative; left: -36px; }
.getInTouch.sm button div img { position: relative; left: 13px; }
.getInTouch .form-control { border: 1px solid #e2e2e2; box-shadow: none; border-radius: 0; font-size: 12px; }
.getInTouch .form-control:focus { box-shadow: none; }
.getInTouch input[type="submit"].form-control { background: #ed3237; text-transform: uppercase; color: #FFF; font-size: 14px; font-weight: bold; }
.getInTouch input[type="submit"].active { background: #cf1b20; opacity: 0.7; }
.getInTouch.sm { left: -300px; }
.news { right: 300px; }
.news.sm button, .getInTouch.sm button { background: #ed3237; color: #FFF; border: 0; }

.news { top: 0px; right: 0; border-radius: 0 0 0 10px; }
.news h2 { font-weight: bold; font-family: "Yantramanav", sans-serif; font-weight: 800; line-height: 1; font-size: 26px; margin-top: 0; }
.news p { font-family: "Open Sans", sans-serif; color: #5c5c5c; }

.news button { background: none; border: 0; width: 120px; height: 120px; padding: 0; top: -1px !important; left: -120px !important; }
.news button img { width: 120px; height: 120px; }
.news.sm button { background: none; width: 120px; height: 120px; color: #FFF; border: 0; left: -118px; top: -3px; padding: 0;  }
.news.sm button img { width: 120px; height: 120px; }

.foldWrapper.work_1 { background: url(../img/ourwork/Bajaj_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_2 { background: url(../img/ourwork/DSK_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_3 { background: url(../img/ourwork/Mahindra_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_4 { background: url(../img/ourwork/Piaggio_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_5 { background: url(../img/ourwork/Kirloskar_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_6 { background: url(../img/ourwork/Force_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_7 { background: url(../img/ourwork/SR3_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_8 { background: url(../img/ourwork/Shree_Motors_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_9 { background: url(../img/ourwork/Yamaha_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }
.foldWrapper.work_10 { background: url(../img/ourwork/Vespa_B.jpg) center center no-repeat; background-position: fixed; height: 719px; }

#container {
	z-index: 2;
	width:100%;
	position:fixed; 
	top:65px;
	left:0px;
}
.foldWrapper img { max-width: 100%; }
.topHalf,
.bottomHalf {
	position: relative;
	display: block;
	z-index: 2;
	width:100%;
	transition:none;
	overflow: hidden;
}

.topHalf{
	z-index: 3 !important;
	-webkit-transform-origin:top;
	transition: -webkit-transform 500ms cubic-bezier(0.000, 0.450, 1.000, 0.950), background-color 500ms ease-in;
	position: absolute;
	top:0px;
	transition:none;
}
.bottomHalf{
	transition: -webkit-transform 500ms cubic-bezier(0.000, 0.450, 1.000, 0.950), background-color 500ms ease-in;
	-webkit-transform-origin:bottom;
	position: absolute;
	bottom:0px;
	
	transition:none;
}
.bottomHalf img{
	top:-100%;
	position: absolute;
}
.foldWrapper {
	position:relative;
	vertical-align: top;
	padding: 0px;
	width: 100%; height: auto;
	background: rgba(0,0,0,0.1);
	z-index: 1;
	display: block;
	overflow:hidden;
	-webkit-transform-style: preserve-3d;
	-webkit-perspective: 1000px;
	transition:none;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes scaleOut {
  0% {
    /*opacity: 0;*/
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  100% {
    /*opacity: 1;*/
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
}

@keyframes scaleOut {
  0% {
    /*opacity: 0;*/
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  100% {
    /*opacity: 1;*/
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }
}

.scaleOut {
  -webkit-animation-name: scaleOut;
  animation-name: scaleOut;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes zoomIn{
	0%{
		-webkit-transform: translate3d(0px, 0px, 1px);
		opacity: 0; 
		transform-style: preserve-3d;
		transform: translate3d(0px, 0px, 0.1px) scale(1.5, 1.5); 
		transform-origin: 50% 50% 0px;
	}
	100%{
		-webkit-transform: translate3d(0px, 0px, 1px);
		opacity: 1; 
		transform-style: preserve-3d;
		transform: translate3d(0px, 0px, 0.1px) scale(1, 1); 
		transform-origin: 50% 50% 0px;
	}
}
@-moz-keyframes zoomIn{
	0%{
		-webkit-transform: translate3d(0px, 0px, 1px);
		opacity: 0; 
		transform-style: preserve-3d;
		transform: translate3d(0px, 0px, 0.1px) scale(1.5, 1.5); 
		transform-origin: 50% 50% 0px;
	}
	100%{
		-webkit-transform: translate3d(0px, 0px, 1px);
		opacity: 1; 
		transform-style: preserve-3d;
		transform: translate3d(0px, 0px, 0.1px) scale(1, 1); 
		transform-origin: 50% 50% 0px;
	}
}
@keyframes zoomIn{
	0%{
		-webkit-transform: translate3d(0px, 0px, 1px);
		opacity: 0; 
		transform-style: preserve-3d;
		transform: translate3d(0px, 0px, 0.1px) scale(1.5, 1.5); 
		transform-origin: 50% 50% 0px;
	}
	100%{
		-webkit-transform: translate3d(0px, 0px, 1px);
		opacity: 1; 
		transform-style: preserve-3d;
		transform: translate3d(0px, 0px, 0.1px) scale(1, 1); 
		transform-origin: 50% 50% 0px;
	}
}
.zoomIn {-webkit-animation-name:zoomIn;animation-name:zoomIn;-webkit-animation-duration:500ms;animation-duration:500ms;-webkit-animation-fill-mode:both;animation-fill-mode:both}

@-webkit-keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
     opacity: 1;
  }
}

@keyframes flipInX {
  0% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
     opacity: 1;
  }
}

.typed-cursor{
    opacity: 1;
    -webkit-animation: blink 0.7s infinite;
    -moz-animation: blink 0.7s infinite;
    animation: blink 0.7s infinite;
    display: none;
}
@keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes blink{
    0% { opacity:1; }
    50% { opacity:0; }
    100% { opacity:1; }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

.connections { padding: 2em 0 0; text-align: center; }
.connections a { display: inline-block; height: 50px; background: #d22930; width: 50px; display: inline-block; border-radius: 50%; padding-top: 14px; -webkit-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; }
.connections a:hover { border-radius: 0; }
.connections a .fa { color: #FFF !important; font-size: 22px; line-height: 1; }
.connections a.facebook { background: #39599f; }
.connections a.linkedin { background: #1884bc; }
.connections a.twitter { background: #00aced; }
.connections a.email { background: #fce415; }
.connections a.pinterest { background: #910101; }
.connections a.blog { background: #f87f14; }

.logo { padding: 5px; background: #FFF; width: 115px; }
.logo img { width: 86px; }


@media (max-width: 480px) {
	.fa-5x { font-size: 3em; }
	.automobile, .corporate, .graphics, .services { height:200px; width:200px; }
}
@media (max-width: 767px) {
	.aboutus { background: #91d306 url(../img/aboutus-sm.jpg) center center no-repeat; background-position: center top; }
	.aboutus .heading { padding-left: 0; text-align: center; }
	.aboutus .heading span { color: #FFF; }
	.bottomline { background: none; padding-top: 30px; }
	.quoteline p.quote { padding: 0 20px; font-size: 22px; }
	p.quote::before { left: 0%; } 
	p.quote::after { right: 0%;}
	.bottomline p.title { font-size: 30px; }
	.bottomline p:nth-child(2) { padding-bottom: 10px; }
	p.quote::after, p.quote::before { display: none; }
	p.quote span { position: relative; display: inline-block; }
	p.quote span::before {content: "\f10d"; font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; top:0; left: -5%; } 
	p.quote span::after {content: "\f10e";font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; right: -5%;}
	.about-block { float: none; height: auto; padding: 0; width: 100%; }
	.strategy, .planning { top: 0; }
	.about-block .block > div { width: auto; height: auto; display: block; margin: 0 auto; }
	.about-block .block { display: block; }
	.about-block .block { padding:  15px 0; }
	.planning img { left: 0px; }
	.ourprocess h2, .aboutus .heading p, .our-services h2, .address h2 { font-size: 40px; }
	.our-services { background: url(../img/services-sm.jpg) center top no-repeat; }
	.our-services p.tagline::before, .our-services p.tagline::after { display: none; } 
	.our-services p.tagline { padding: 0 20px; font-size: 22px; }
	.our-services p.tagline span { display: inline-block; position: relative; }
	.our-services p.tagline span::before {content: "\f10d"; font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#090909; position: absolute; top:0; left: -5%; } 
	.our-services p.tagline span::after {content: "\f10e";font-family:'FontAwesome'; font-style: normal; font-weight: normal; text-decoration: inherit; color:#0.our-services p.tagline span::before, 90909; position: absolute; right: -5%;}
	.ourprocess p.tagline { font-size: 22px; }
	.address { background: url(../img/address-sm.jpg) center top no-repeat; }
	#issues li p { padding: 20px 15px 0 0px; }
	.address .content { padding: 1em 0; }
	/*.expand-contents { padding: 20px; }*/
	.about-container-block { background: none; }
	.automobile, .corporate, .graphics, .services { margin-bottom: 5px; }
	.navigation.mobile li a { padding: 1.1em 1em 1.1em 1em; }
}
@media (min-width: 768px) {
	/*.aboutus { background: #91d306; }*/
	.aboutus .heading { padding-left: 0; text-align: center; }
	.aboutus .heading span { color: #FFF; }
	.bottomline { padding-top: 25px; }
	.bottomline p.title { font-size: 34px; }
	.bottomline p { font-size: 16px; }
	.aboutus .heading { padding-top: 35px; }
	.about-block .block img { -webkit-transform: scale(0.9); -ms-transform: scale(0.9); -o-transform: scale(0.9); transform: scale(0.9); }
	.about-block { padding: 0 5px; }
	.ourprocess p.tagline { padding-top: 40px; }

	.automobile{ height:150px; width:150px; }
	.corporate { height:150px; width:150px; } 
	.graphics { height:150px;width:150px; }
	.services { height:150px; width:150px; } 
	.fa-5x { font-size: 4em; }
	.our-services { padding: 4em 0; }
	.our-services p.tagline { font-size: 24px; }
	.our-services p.tagline::before { left: 5%; } 
	.our-services p.tagline::after { right: 5%;}
	.services-images p { font-size: 21px; }
	#users li { width: 155px; }
	#issues li { width: 750px; }
	.address h2 { padding-bottom: 40px; }
	.address .content { font-size: 18px; }
	.ourprocess p.tagline span::before { left: -10%; }
	.ourprocess p.tagline span::after { right: -10%; }
	.about-container-block { background: url(../img/shape-sm.png) center center no-repeat; }
	.about-block .text { margin-top: 10px; }
	.navigation li a { padding: 1.5em 8px; }
}
@media (min-width: 992px) {
	.quoteline p.quote { font-size: 28px; }
	p.quote::before { left: 5%; } 
	p.quote::after { right: 5%;}
	.aboutus .heading { padding-left: 203px; }

	.about-block { padding: 0 33px; }
	.about-container-block { background: url(../img/shape.png) center center no-repeat; }
	.ourprocess p.tagline { padding-top: 30px; }
	.our-services p.tagline::before { left: 1%; } 
	.our-services p.tagline::after { right: 1%;}
	#issues li { width: 970px; }
	#users li { width: 157px; }
	.about-block .block img { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }
	.automobile{ height:200px; width:200px; }
	.corporate { height:200px; width:200px; } 
	.graphics { height:200px; width:200px; }
	.services { height:200px; width:200px; } 
	/*.address { padding: 6em 0; }*/
	.address .content { font-size: 20px; }
	.bottomline { padding-top: 70px; }
	.bottomline p.title { font-size: 36px; }
	.bottomline p { font-size: 18px; }
	.quoteline p.quote { font-size: 30px; }
	.aboutus .heading { padding-top: 55px; }
	.aboutus .heading { text-align: left; }
	.aboutus .heading span { color:#91d306; }
	.fa-5x { font-size: 5em; }
	.our-services p.tagline { font-size: 30px; }
	.services-images p { font-size: 23.53px; }
	.about-container-block { background: url(../img/shape-md.png) center center no-repeat; }
	.about-block .text { margin-top: 10px; }
	.navigation li a { padding: 1.5em 1em; }
}
@media (min-width: 1200px) {
	.about-block { padding: 0 58px; }
	.about-container-block { background: url(../img/shape.png) center center no-repeat; }
	.ourprocess p.tagline { padding-top: 50px; }
	.our-services p.tagline::before { left: 10%; } 
	.our-services p.tagline::after { right: 10%;}
	#issues li { width: 1170px; }
	#users li { width: 163px; }
	.about-block .block img { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }
	.our-services p.tagline { font-size: 36px; }
	.aboutus .heading { padding-left: 230px; }
	.about-block .text { margin-top: 20px; }
}