@import url(http://fonts.googleapis.com/css?family=Roboto:400,300,700,500,100);
@import url(http://fonts.googleapis.com/css?family=Raleway:700);
@import url(http://fonts.googleapis.com/css?family=Raleway:300);
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600);
@import url(http://fonts.googleapis.com/css?family=Dosis:300,400,500,600,700);
body {
	font-family: roboto;
}
.logo {
	padding-top: 9px;
}

.call-us {
	float: right;
	font-family: Source Sans Pro;
	font-size: 18px;
	padding-top: 20px;
}
.pink-color {
	color: #b00645;
	font-weight: bolder;
	font-size: 24px;
}
.banner-area {
	height: auto;
	width: 100%;
	position: relative;
	top: 0;
	left: 0;
	z-index: -1;
}
#owl-demo .item img {
	display: block;
	width: 100%;
	height: auto;
}
.caption {
	top: 480px;
    left: 103px;
    background-color: rgba(94, 111, 225, 0.47);
    position: absolute;
    z-index: 100;
    padding: 0 15px 10px 15px;
}
.banner-area h1 {
	font-family: 'Raleway';
	font-size: 50px;
	font-weight: 600;
	color: yellow;
	text-shadow: 1px 1px #000;
}
.banner-area h6 {
	font-family: Source Sans Pro;
	font-size: 18px;
	font-weight: bold;
	color: #fff;
	text-shadow: 2px 2px #000;
}
.what-we-do {
	margin: 4% 0 2% 0;
}
.what-we-do h2 {
	font-family: Source Sans Pro;
	font-size: 55px;
	text-transform: uppercase;
}
.services {
	width: 100%;
	color: #222222;
	display: block;
	padding: 5px;
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
	padding: 10px 5px;
}
.services h3 {
	text-align: center;
	font-size: 18px;
	padding: 3% 0;
}
.services p {
	text-align: justify;
	font-size: 14px;
	padding-bottom: 20px;
	color: #666666;
}
.icon-service {
	width: 50px;
	height: 50px;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	background: #b00645;
	display: block;
	margin: 0 auto;
	text-align: center;
	color: #FFF;
	font-size: 25px;
	margin-bottom: 8px;
}
.services:hover {
	background: #b00645;
	text-decoration: none;
	color: #FFF !important;
}
.services:hover p {
	color: #FFF !important;
}
.icon-service i {
	padding-top: 13px;
}
.service-sub {
	font-size: 25px;
	font-family: Source Sans Pro;
	font-weight: lighter;
	padding-bottom: 3%;
}
.services-margin {
	padding-bottom: 20px;
	float: left;
}
.service-colmn img {
	max-width: 100%;
}
.service-area {
	padding-bottom: 7%;
}
.service-colmn {
	border-radius: 6px;
	background-color: #b00645;
	padding: 5% 0 20% 0;
	-webkit-box-shadow: inset 0px -5px 0px 0px rgba(199,199,199,1);
	-moz-box-shadow: inset 0px -5px 0px 0px rgba(199,199,199,1);
	box-shadow: inset 0px -5px 0px 0px rgba(199,199,199,1);
}
.service-colmn h4 {
	color: #FFFFFF;
	font-weight: bold;
	margin: 0;
	padding: 6% 0;
	line-height: 24px;
}
.service-colmn p {
	color: #CCCCCC;
	margin: 0;
	padding: 0 6%;
}
.service-colmn a {
	color: #FFFFFF;
	background-color: #3DCFC2;
	margin: 0;
	padding: 4% 17%;
	border-radius: 6px;
	position: absolute;
	bottom: -16px;
	left: 65px;
}
.service-colmn a:hover {
	text-decoration: none;
	background-color: #76c7c0;
}
.service-colmn:hover {
	background: #01AE9F;
	-webkit-box-shadow: inset 0px 0px 0px 0px rgba(199,199,199,1);
	-moz-box-shadow: inset 0px 0px 0px 0px rgba(199,199,199,1);
	box-shadow: inset 0px 0px 0px 0px rgba(199,199,199,1);
}
.service-colmn:hover.service-colmn h4 {
	color: #000000;
}
.service-colmn:hover.service-colmn p {
	color: #333333;
}
.our-clients {
	background: url(../images/clients-bg.jpg) no-repeat center;
	padding-bottom: 2%;
}
.clients-area {
	width: 80%;
}
.clients-area h2 {
	font-family: 'Raleway';
	font-size: 50px;
	color: #FFF;
	margin: 0;
	padding: 45px 0 5px 0;
	text-transform: uppercase;
}
.clients-area p {
	color: #FFF;
	font-size: 35px;
	font-family: 'Raleway';
	padding-bottom: 12px;
}
.clients {
	padding: 20px 0;
	height: 100px;
	position: relative;
}
.clients img {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
}
.our-works {
	background-color: #65109a;
	padding: 2% 0 2% 0;
}
.our-works h2 {
	font-family: Source Sans Pro;
	font-size: 50px;
	text-transform: uppercase;
	color: #FFF;
	padding: 18px 0;
	font-weight: 600;
}
.work-links {
	width: 100%;
	padding-bottom: 10px;
	margin: 10px;
}
.work-links a:hover {
	text-decoration: none;
}
.work:hover {
	background: #0a9159;
}
.more {
	text-align: center;
	font-family: Source Sans Pro;
	font-size: 25px;
	text-transform: uppercase;
	color: #FFF;
	background-color: #373737;
	text-decoration: none;
	padding: 7px 0;
	margin: 30px auto 0 auto;
	display: block;
	width: 20%;
}
.more:hover {
	text-decoration: none;
	color: #CCC;
}
.methodology-area {
	background: url(../images/methodology-bg.jpg) no-repeat top center;
	padding: 16% 0 2% 0;
}
.methodology-area h2 {
	font-family: Roboto;
	font-size: 50px;
	color: #179edc;
}
.methodology-text {
	font-family: Roboto;
	font-size: 18px;
	color: #1848484;
	margin-bottom: 20px;
}
.methodology {
	width: 100%;
	background: #179edc;
	float: left;
}
.methodology h3 {
	font-weight: bold;
	font-size: 30px;
	color: #FFF;
	padding-left: 3%;
	float: left;
}
.phase-icon {
	width: 50px;
	height: 50px;
	border-radius: 100%;
	border: 3px #FFF solid;
	display: block;
	margin: 10px 0 0 58px;
	text-align: center;
	color: #FFF;
	font-size: 25px;
	float: left;
}
.phases {
	width: 100%;
	padding: 4% 0 1% 0;
	float: left;
}
.phase-icon i {
	width: 100%;
	float: left;
	padding: 20% 0;
}
.methodology p {
	float: left;
	font-size: 18px;
	color: #FFF;
	padding: 8% 0 0 0;
	width: 100%;
}
.methodology h5 {
	float: left;
	font-size: 18px;
	color: #212121;
	padding: 6% 0 3% 0;
	border-top: #FFF solid 2px;
	width: 100%;
}
.phase-description {
	padding: 2% 0 0 0;
	float: left;
	width: 100%;
	color: #909090;
}
.letstalk-area {
	padding: 15% 0 2% 0;
	background: url(../images/letstalk-bg.png) no-repeat bottom center;
}
.letstalk-area h2 {
	color: #000;
	width: 75%;
	font-size: 40px;
	font-family: Source Sans Pro;
	margin: 5% 0 0 0;
	text-transform: uppercase;
	background-color: rgba(255,255,255,0.7);
}
.letstalk-text {
	font-family: Source Sans Pro;
	font-size: 20px;
	color: #000;
	font-weight: bold;
	padding-bottom: 1%;
	padding-top: 1%;
}
.letstalk {
	padding-top: 6%;
}
.letstalk-area a {
	font-family: Source Sans Pro;
	font-size: 22px;
	text-transform: uppercase;
	color: #000;
	border: solid 2px;
	padding: 5px 27px;
	font-weight: bold;
}
.letstalk-area a:hover {
	text-decoration: none;
}
.left-footer {
	padding-top: 1%;
}
.footer-links {
	float: left;
}
.footer-follow {
	float: left;
}
.footer-follow h4 {
	color: #878787;
	font-weight: bold;
	font-size: 20px;
	margin: 0;
	padding-bottom: 7px;
}
.footer-follow a {
	float: left;
	color: #BBBBBB;
}
.footer-follow i {
	font-size: 25px;
	float: left;
	margin-right: 13px;
}
.footer-follow a:hover {
	float: left;
	color: #FFF;
}
.footer-width {
	width: 16%;
}
.footer-width1 {
	width: 30%;
}
.footer-width2 {
	width: 25%;
}
.footer-width3 {
	width: 20%;
}
.footer-menu {
	display: inline;
	float: left;
}
.footer-links a {
	float: left;
	width: 100%;
	color: #BBBBBB;
	font-family: Source Sans Pro;
	font-size: 18px;
}
.footer-links a:hover {
	text-decoration: none;
	color: #CCC;
}
.footer-area {
	background-color: #000;
	padding: 3% 0;
	margin-top:20px;
}
.footer-links h4 {
	color: #878787;
	font-weight: bold;
	font-size: 20px;
	margin: 0;
	padding-bottom: 7px;
}
.call-footer {
	float: right;
	color: #CCC;
	font-size: 17px;
}
.copyright {
	font-family: Source Sans Pro;
	color: #5a5a5a;
	font-size: 16px;
	font-size: 16px;
	text-align: right;
	padding: 16% 0 1% 0;
}
.productsurf {
	float: right;
}
.navigation {
	width: 40px;
	height: 40px;
	border-radius: 100%;
	background: #b00645;
	color: #FFF;
}
.navigation i {
	width: 100%;
	font-size: 18px;
	padding-top: 5px;
}
.nav-tabs {
	padding-bottom: 1%;
}
.portfolioFilter {
	margin: 0;
}
.portfolioFilter a {
	border: none;
	text-decoration: none;
	background: none;
	font-family: Source Sans Pro;
	font-size: 17px;
	color: #FFF;
	font-weight: 300;
	padding: 0 10px 5px 10px;
}
.portfolioFilter a:hover {
	border: none;
	border-bottom: solid 4px #470b6d;
	text-decoration: none;
}
.portfolioFilter:second-child a {
 margin-right:0;
}
.objects {
	float: left;
}
.portfolioFilter a.current {
	font-weight: bold;
}
.portfolioContainer img {
 *width:100%;
}
.isotope-item {
	z-index: 2;
}
.isotope-hidden.isotope-item {
	pointer-events: none;
	z-index: 1;
}
.isotope, .isotope .isotope-item {
	/* change duration value to whatever you like */

	-webkit-transition-duration: 0.8s;
	-moz-transition-duration: 0.8s;
	transition-duration: 0.8s;
}
.isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	transition-property: height, width;
}
.isotope .isotope-item {
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	transition-property: transform, opacity;
}
/*-- ISOTOPE --*/

.header {
	width: 100%;
	position: absolute;
	z-index: 2;
}
.header-inner {
	width: 100%;
	padding-bottom: 10px;
}
/*-- Portfolio -- */

.portfolio {
	padding: 20px 0 30px 0;
}
.portfolio h2 {
	margin-top: 0;
	padding-bottom: 3%;
}
.portfolio-nav a {
	color: #000;
}
.caption-inner {
	top: 210px;
	left: 103px;
	position: absolute;
	z-index: 100;
}
.head-box {
	background: rgba(0,0,0,.5);
	display: block;
	margin-top: 10px;
	color: #FFF;
	font-size: 45px;
	padding: 5px;
	float: left;
}
.head-box-sub {
	background: rgba(0,0,0,.5);
	display: block;
	margin-top: 5px;
	color: #FFF;
	font-size: 20px;
	padding: 5px;
	float: left;
}
/*-- Contact-Us --*/
.contact-head {
	padding-bottom: 3%;
}
.map {
	width: 100%;
	height: 340px;
}
.contact-btn {
	width: 100%;
	padding: 18px 0 18px 60px;
	background: #1eb7c1 url(../images/send-icon.png) no-repeat 20px center;
	text-align: left;
	border: none;
	outline: none;
	margin-top: 15px;
	color: #FFF;
	font-size: 20px;
}
.social-box {
	border: 1px solid #CCC;
	padding: 15px 0 15px 50px;
	margin: 25px 0;
}
.email {
	background: url(../images/email.png) no-repeat 20px center;
}
.mobile {
	background: url(../images/mobile.png) no-repeat 20px center;
}
.twitter {
	background: url(../images/twitter.png) no-repeat 20px center;
}
.skype {
	background: url(../images/skype.png) no-repeat 20px center;
}
/*---------------------------------------*/

.heading-small {
	font-size: 30px;
	color: #999;
	margin: 0;
	line-height: 1.2em;
	font-weight: 300;
}
.all-caps {
	text-transform: uppercase;
}
.hi {
	font-size: 44px;
	color: rgb( 241, 196, 41 );
	font-weight: bold;
	text-transform: capitalize;
	text-align: left;
	float: left;
	padding-bottom: 8px;
}
.full {
	width: 100%;
}
.pNormal {
	font-size: 14px;
	color: #999;
	line-height: 1.7em;
	text-align: justify;
}
.padTop-medium {
	margin-top: 4% !important;
}
.heading-style-h {
	font-size: 1.8em;
	margin: 0;
	line-height: 25px;
	color: #666;
	font-weight: 300;
}
.principles {
	padding: 10px 0 20px 20px;
	color: #666666;
	list-style: url(../images/bullet_tick.jpg) outside;
}
.principles-grey {
	padding: 10px 0 20px 20px;
	color: #666666;
	list-style: url(../images/bullet_tick-red.png) outside;
}
.principles-grey li {
	line-height: 2em;
	margin-left: 13px;
}
.principles li {
	line-height: 2em;
	margin-left: 20px;
}
.principles a {
	text-decoration: none;
}
.padTop-small {
	margin-top: 4% !important;
}
.steps {
	background-repeat: no-repeat !important;
	background-position: center top !important;
}
.step-start {
	background: #ff6262 url(../images/steps_arrow_1.png);
}
.padTop-large {
	margin-top: 10% !important;
}
.keep-center {
	display: block;
	margin: 0 auto !important;
}
.ninty {
	width: 90%;
}
.steps h3 {
	color: #FFF;
	text-transform: uppercase;
	padding-top: 7%;
	padding-bottom: 4%;
	margin: 0;
}
.steps p {
	color: #FFF;
	padding: 0% 0 4% 0;
	margin: 0;
}
.step-one {
	background: #1dbb89 url(../images/steps_arrow_1.png);
}
.steps h4 {
	color: #FFF;
	text-transform: uppercase;
	padding-top: 6%;
	font-size: 1.2em;
	margin-top: 0;
}
.step-two {
	background: #1e5e80 url(../images/steps_arrow_2.png);
}
.step-three {
	background: #3b3b3b url(../images/steps_arrow_3.png);
}
.step-four {
	background: #7c8e32 url(../images/steps_arrow_4.png);
}
.testi {
	padding: 10px;
	border-radius: 10px;
	background-color: rgb( 255, 255, 255 );
	box-shadow: 0.5px 0.866px 5px 0px rgba(51,51,51,.2);
	margin-left: 10px;
	margin-bottom: 6%;
	margin-top: 15px;
	float: left;
}
.testi a {
	text-decoration: none;
	color: #000;
}
.testi a:hover {
	color: #007CA6;
}
.heading-normal {
	font-size: 40px;
	color: #6e6e6e;
	margin: 0;
	font-family: "Dosis";
}
.heading-normal-grey {
	font-size: 40px;
	color: #000000;
	margin: 0;
	font-family: "Dosis";
}
.heading-sm {
	font-size: 28px;
	color: #999;
	font-family: "Dosis";
	display: block;
}
.heading-sm-grey {
	font-size: 28px;
	color: #5F5A5A;
	font-family: "Dosis";
	display: block;
}
.webdesigning-img {
	max-width: 100%;
}
.heading-normal-small {
	font-size: 40px;
	color: #6e6e6e;
	margin: 0;
	font-family: "Dosis";
}
.sub-head {
	margin: 0;
	padding-bottom: 3%;
	padding-top: 20px;
}
.grey-bg {
	
}
.portfolio-info {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 999;
	-webkit-transition: .5s;
	-moz-transition: .5s;
	-ms-transition: .5s;
	-o-transition: .5s;
	transition: .5s;
}
.portfolio-info:hover {
	background: rgba(176,6,69,.7);
	cursor: pointer;
}
.info-btn {
	width: 100px;
	height: 100px;
	background: #333333 url(../images/link-icon.png) no-repeat center;
	margin: auto;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	display: none;
	color: #FFF;
	text-align: center;
	padding: 6px 0;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
	margin-top: 40px;
}
.portfolio-name {
	display: none;
	padding-top: 10px;
	font-size: 17px;
}
.portfolio-info:hover .info-btn {
	display: block;
	text-decoration: none;
	color: #FFF;
}
.portfolio-info:hover .portfolio-name {
	display: block;
	text-decoration: none;
	color: #FFF;
}
.seo-area {
	padding-bottom: 2%;
}
.padbottom {
	padding-bottom: 2%;
}
.red {
	color: #e8645a;
}
.banner-inner img {
	width: 100%;
}
.email-link{
	text-decoration:none;	
}
.email-link:hover{
	text-decoration:none;	
}

.footer-add{
	float: right;
	color: #ccc;
	font-size: 16px;
	text-align: justify;
}