@charset "utf-8";
/* CSS Document */
@import url(http://fonts.googleapis.com/css?family=Roboto+Slab:400,300,700|Roboto+Mono:400,300,300italic,400italic,500,500italic,700,700italic|Roboto+Condensed|Roboto:500,900italic,900,400italic,100,700italic,300,700,500italic,400);

/*
font-family: 'Roboto Slab', serif;
font-family: 'Roboto Mono', ;
font-family: 'Roboto Condensed', sans-serif;
font-family: 'Roboto', sans-serif;

*/ 
body, * { margin:0; padding:0;font-family: 'Roboto Slab', serif;}
a { text-decoration:none;}
ul, li { list-style:none;}
.main_wraper, .header_con { display:block; margin:0 auto;}
.header_con { background:#24292f;}
.header { width: calc(100% - 100px); height:90px; margin:0 50px;}
.header .logo { margin-top:14px; float:left;}
ul.menu_con { float:right;}
ul.menu_con li { padding-top:43px; float:left; height:47px;}
ul.menu_con li { font-size:20px; color:#fff; margin-right:10px; float:left;}
ul.menu_con li img { font-size:20px; color:#fff; padding:0 0 0 10px;}
ul.menu_con li a { font-size:20px; color:#fff;}

.p_80 { padding:80px 0 0 !important;}


.banner {
	width:100%; height:auto; float:left;
}
.btn { background:#fff; color:#000 !important; width:auto; padding: 5px 10px 5px 5px !important; font-size:16px !important;}
.btn:hover { background:#000; color:#fff !important; cursor:pointer;}

.services_con, .contact {
	width:100%; height:auto;
	padding:40px 0 70px; float:left; background:url(../images/bg_service.png) 0 0 no-repeat;
	background-size: 100% 100%;
}
.services_con .content {
	width:70%; height:auto;
	margin:0 15%; float:left;
}
h1 {
	font-family: 'Roboto Slab', serif;
	font-size:40px; color:#202020; font-weight:200;
	text-align:center; text-transform:uppercase;
}
h2 {
	font-family: 'Roboto Slab', serif;
	font-size:30px; color:#f16334; font-weight:400;
	text-align:center;
}

h3 {
	font-family: 'Roboto Slab', serif;
	font-size:20px; color:#f16334; font-weight:200;
	text-align:center; text-transform:uppercase;
}
.services_con .content ul.service li p {
	font-family: 'Roboto Slab', serif;
	font-size:12px; color:#363636; font-weight:200;
	text-align:center; margin-bottom:7px;
}
.services_con .content h2 {margin-top: 40px; float:left; width:100%;}

.services_con .content ul.service li h3 { margin-top:45px;}
.services_con .content ul.service li:nth-child(3n) { margin: 0 0 0 0;}
.services_con .content ul.service {
	width:100%; height:auto;
	margin:40px 0 0; float:left;
}
.services_con .content ul.service li {
	width:30.33%; height:auto;
	margin:0 3% 0 0; float:left;
	position:relative; text-align:center;
}
.services_con .content ul.service li .circle {
	width: 100%; height:117px; position:absolute; top:0; left:0; z-index:1;
	-webkit-transition: all 0.5s ease 0s;
}
@-webkit-keyframes rotating /* Safari and Chrome */ {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes rotating {
  from {
    -ms-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  to {
    -ms-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.rotating {
  -webkit-animation: rotating 6s linear infinite;
  -moz-animation: rotating 6s linear infinite;
  -ms-animation: rotating 6s linear infinite;
  -o-animation: rotating 6s linear infinite;
  animation: rotating 6s linear infinite;
}
.services_con .content ul.service li img.icon {
	width:auto; height:auto; margin:0 auto; padding-top:36px;
}

.clients_con {
	width:100%; height:auto;
	padding:40px 0 70px; float:left; background:#f16334;
}
.clients_con .content {
	width:70%; height:auto;
	margin:0 15%; float:left;
  background:url(../images/clients_left.png) 7% 300px no-repeat, url(../images/clients_right.png) 90% 300px no-repeat;
}
.clients_con .content h1 {
	color:#fff !important;
}

.clients_con .content ul.clients {
	width:100%; height:auto;
	margin:40px 0 0; float:left;
}
.clients_con .content ul.clients li {
	width:24%; height:auto;
	padding:0 1% 0 0; float:left; margin:0 auto;
	position:relative; text-align:center;
}
.clients_con .content ul.clients li:nth-child(4n) { padding:0 0 0;}
.clients_circle img {
  position: relative;
  top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.clients_circle {
  width:137px; height:137px; background:#fff; border-radius:50%; margin:0 auto;
}
#slider {
  position: relative;
  overflow: hidden;
  margin: 20px auto 0;
  border-radius: 4px;
  width:100% !important;
}

#slider ul {
  position: relative;
  margin: 0 auto !important;
  padding: 0;
  height: 200px;
  list-style: none;
  width:80% !important;
  overflow:hidden;
}

#slider ul li {
  position: relative;
  display: block;
  margin: 0 auto;
  padding: 0 10% 0 8%;
  width: 82%;
  height: 225px;
  text-align: center;
}
#slider ul li p {
	display:block;
	font-size:14; color:#fff;
	line-height:20px;
	text-align:center;
	margin-bottom:20px;
}
#slider ul li .txt {
	display:inline;
	font-size:12px; color:#fff;
	line-height:20px;
	text-align:center;
	padding:0 60px;
	font-weight:100;
	background:url(../images/line.png) 0 50% no-repeat, url(../images/line.png) 100% 50% no-repeat;
}
#slider ul li .txt span{
	font-size:14; color:#fff;
	font-weight: 700;
	text-align:center;
}

#slider ul li {
    -webkit-transform: translateY(40%);
    -ms-transform: translateY(40%);
    transform: translateY(40%);
}


a.control_prev {
  position: absolute;
  top: 40%;
  z-index: 999;
  display: block;
  padding: 0;
  width: auto;
  height: auto;
  background:url(../images/slider-controls.png) 0 50% no-repeat;
  overflow:hidden;
  text-decoration: none;
  width:50px; height:97px;
}
a.control_next {
  position: absolute;
  top: 40%; left:92%;
  z-index: 999;
  display: block;
  padding: 0;
  width: auto;
  height: auto;
  background:url(../images/slider-controls.png) 100% 50% no-repeat;
  overflow:hidden;
  text-decoration: none;
  width:50px; height:97px;
}

a.control_prev:hover, a.control_next:hover {
  opacity: .5;
  -webkit-transition: all 0.2s ease; cursor:pointer;
}

a.control_prev {
  border-radius: 0 2px 2px 0;
}

a.control_next {
  right: 0;
  border-radius: 2px 0 0 2px;
}

.slider_option {
  position: relative;
  margin: 10px auto;
  width: 160px;
  font-size: 18px;
}

.service_con, .contact {
	width:100%; height:auto;
	padding:0; float:left; background:#fff;
}
ul.box {
    float: left;
    height: auto;
    margin: 0 5%;
    width: 90%;
}
ul.box li {
	display:inline-block;
	width:25%; padding:0; margin:0;
	background:#f7f7f7; float:left;
	overflow:hidden;
}
ul.box li .image {
	width:100%; height:400px; float:left; overflow:hidden;
}
ul.box li .image img {
	width:100%; height:auto; float:left;
	-webkit-transition: 0.4s ease;
  transition: 0.4s ease;
}
ul.box li:hover .image img {
	width:100%; height:auto; float:left;
	-webkit-transform: scale(1.08);
  transform: scale(1.08);
}
ul.box li .details {
	display:block;height:auto;
	padding: 10px;
}
ul.box li .details {
	display:block;height:auto; float:left;
	padding: 10px 10px 28px; position:relative;
}
ul.box li .details .orange_box {
	display:block;height:34px;
	background:url(../images/orange_box.png) 50% 0 no-repeat;
	margin:-27px 0 0 0;
}
ul.box li:nth-child(2n) .details .orange_box {
	display:block;height:34px;
	background:url(../images/orange_box.png) 50% 0 no-repeat;
	margin:19px 0 -17px;
}

ul.box li:nth-child(2n) .details {
	padding: 10px 10px 0; z-index:1000;
}

ul.box li .details h3 { margin-top:20px;}

ul.box li .details p {
	display:block;height:auto;
	text-align:center; font-size:16px;
	color:#101010; font-weight:100;
	margin-top:10px;
}





/*Contact*/
		#mail-status {
			padding: 12px 20px;
			width:auto;
			display:none; 
			font-size: 1em;
		}
	  .error{color: #F7902D;  margin-bottom: 40px;}
	  .success{color: #48e0a4; }
		.g-recaptcha {margin:0 auto; width:304px;}
		#captcha {
			width:100%;
			margin:0 auto; padding-bottom:20px; 
		}






.service_con, { margin-top:80px;}
.contact { margin:0;}
.contact_con {
    float: left;
    height: auto;
    width: 90%;
	margin:0 5% 50px;
}
.p_0 { padding:0 !important;}

.contact_bg {
	background:url(../images/contact_bg.jpg) 0 100% no-repeat;
	background-size:100% auto;
}
.bg {
	background:url(../images/contact_bg1.png) 50% 100% no-repeat;
}
.contact_page_icon {
	width:172px; height:auto; float:left;
	padding:0 0 0;
}
.contact_form .contact_page_icon {padding: 0 0; float:none !important; margin:0 auto !important;}
.contact_page_icon {
	width:250px; height:auto; float:left;text-align:center;
}
.contact_form {
	width: calc(100% - 500px); height:auto; float:left;
	margin:55px 0 0;
	text-align:center;
}
.contact_con h1, .service_con h1, .contact h1 {
	font-size:40px; color: #f16334; font-weight:300;
	margin-bottom:10px;
}
.contact_con h3, .service_con h3, .contact h3 {
	color: #fff; font-weight:100; margin-bottom:20px;
}
.service_con .details h3, .contact .details h3 { color:#ff7f17;}
.contact_page_icon h3 {
	color: #fff; font-weight:400; margin:10px 0 15px; text-transform:capitalize;
}

.contact_con h2 {
	color: #fff; font-weight:100; font-size:14px; margin:10px 0 7px;
}
.c_light_gray { color:#dbdbdb !important;}

.contact_form .txt_field {
	width: calc(66% - 2px); height:40px; border-bottom:1px solid #777777; border-left:none; border-top:none; border-right:none;
	/*background: rgba(0,0,0, .3);*/ background:none; margin:0 15% 22px; padding:0 2%;
	font-size:14px; font-weight:100; color:#fff;
}
.contact_form .txt_area {
	width: calc(66% - 2px); height:60px; border-bottom:1px solid #777777; border-left:none; border-top:none; border-right:none;
	/*background: rgba(0,0,0, .3);*/ background:none; margin:0 15% 22px; padding:0 2%;
	font-size:14px; font-weight:100; color:#fff; resize:none;
}
.contact_form .txt_area:focus, .contact_form .txt_field:focus {border-bottom:1px solid #ff7f17; border-left:none; border-top:none; border-right:none; outline:none;}
.contact_form .submit {
	width: calc(20% - 2px); height:40px; border:1px solid #ff7f17;
	background: none; margin:0 40% 22px; padding:0;
	font-size:16px; font-weight:100; color:#ff7f17; text-align:center; text-transform:uppercase;
}
.contact_form .submit:hover {color:#fff; cursor:pointer; background:#ff7f17;}

.footer_s_container { width:100%; height:60px; float:left; background:#f16334;}
.footer_s_content { width:90%; height:60px; padding: 0 5%; float:left;}
.footer_s_content .title { width:30%; height:60px; padding: 0; float:left; font-size:22px; color: #fff; line-height:60px; opacity: .8;}
.footer_s_content .c_txt { width:42%; height:60px; padding: 0; float:left; font-size:14px; text-align:center; color: #fff; line-height:60px; opacity: .6;}
.footer_s_content ul.social { width:auto; height:34px; padding: 13px 0 0; float:right;}
.footer_s_content ul.social li { display:inline-block; width:34px; height:34px; margin:0 5px 0 0; float:left; overflow:hidden;}
.footer_s_content ul.social li:nth-child(1) { background:url(../images/social.png)0 0 no-repeat;}
.footer_s_content ul.social li:nth-child(2) { background:url(../images/social.png)-39px 0 no-repeat;}
.footer_s_content ul.social li:nth-child(3) { background:url(../images/social.png)-77px 0 no-repeat;}
.footer_s_content ul.social li:nth-child(4) { background:url(../images/social.png)-116px 0 no-repeat;margin:0 0 0 0;}
.footer_s_content ul.social li:hover { cursor:pointer; opacity:.5;}

.footer_menu_container { width:100%; height:60px; float:left; background:#24292f;}
.footer_menu_content { width:90%; height:60px; padding: 0 5%; float:left;}
.footer_menu_content ul.f_menu { width:auto; height:21px; padding: 23px 0 0; float:left;}
.footer_menu_content ul.f_menu li { width:auto; height:21px; padding: 0 24px; float:left; color:#a3a4a6; font-size:14px;
border-right: 1px solid #a3a4a6;}
.footer_menu_content ul.f_menu li:first-child { padding: 0 24px 0 0;}
.footer_menu_content ul.f_menu li:last-child { padding: 0 0 0 24px; border:none;}
.footer_menu_content .copy { width:auto; height:60px; padding: 0; float:right; color:#a3a4a6; font-size:12px;
line-height:60px; text-align:right;}
.footer_menu_content ul.f_menu li:hover { cursor:pointer; color: #fff;}

.popup_menu {
	width:100%; height: calc(100% - 88px); background: rgba(0,0,0, .8);
	position:fixed; left:0; bottom:0px; z-index:1000000;
}
ul.p_menu {
	width: 100%;
	height:auto;
	float:right;
	margin: 72px 0 0 0;
}
ul.p_menu li {
	display:inline-block;
	width:100%;
	height:auto;
	float:right;
	margin: 0 0 20px 0;
}
ul.p_menu li a {
	display:block;
	font-size:60px; font-weight:700;
	color:#fff;
	text-align:center;
}
ul.p_menu li a:hover,ul.p_menu li a.active  {
	display:block;
	font-size:60px; font-weight:700;
	color:#ff7e16;
}
.popup_menu ul.menu_con li { background: rgba(0,0,0, .4); padding: 43px 5px 0px 5px;}
.popup_menu ul.menu_con{ margin: -90px 41px 0 0; background:#24292f;}



/*INNER PAGES*/
ul.tabs, ul.tabs1 {
	margin: 0 auto;
	padding: 0;
	list-style: none;
	height: auto;
	width: 888px;
	position:relative;
	z-index:1;
	display:none;
}
ul.filter {
	margin: 0;
	padding: 0;
	float: left;
	list-style: none;
	height: 30px;
	width: auto;
}
ul.tabs .div, ul.tabs1 .div {
	float: left;
	margin: 0 0 0 0;
	cursor: pointer;
	padding: 0px 30px;
	height: 30px;
	line-height: 36px;
	overflow: hidden;
	width: auto;
	font-size: 22px;
	color: #fff;
	position:relative;
}
ul.tabs li, ul.filter li, ul.tabs1 li {
	float: left;
	margin: 0 0;
	cursor: pointer;
	padding: 0 24px 0;
	height: 30px;
 line-height:30px;  text-align:center;
	position: relative;
	width: auto;
	font-size: 20px;
	color: #78797a;
	font-weight:300;
	border-right: 1px solid #1a1c1c;
}
ul.tabs li:last-child { border:none;padding: 0 0 0 24px;}
ul.tabs li a, ul.filter li a, ul.tabs1 li a {color: #78797a;}
ul.tabs li span, ul.tabs1 li span, ul.filter li span {
	width: 4px;
	height: 9px;
	margin: 0 5px 0 0;
}
ul.tabs li:hover, ul.tabs1 li:hover, ul.filter li:hover {
	background-color: tranparent;
	color: #00d096;
}
ul.tabs li:hover:after, ul.tabs1 li:hover:after, ul.filter li:hover:after {
	background-color: tranparent;
	color: #000;
	margin: 27px 45% 0 -39%;
	position: absolute;
	content: '';/*border-left: 6px solid transparent;
		border-right: 6px solid transparent;
		border-top: 6px solid #8B4F07;*/
}
ul.tabs li.active, ul.tabs1 li.active {
	background-color: tranparent;
	color:#00d096;
}
.tab_content {
	width:100%; height:auto;
	float:left; margin-top:50px;
	position:relative;
	background:#f1f1f1;
}
.tab_content .main_title {
	width:70%; height:auto;
	float:left; padding: 20px 15% 35px;
	background:#00d096;
	font-size:95px; font-weight:700; color:#fff;
	position:relative;
}
.tab_content .main_title:after {
	content: '';
	display: block;  
	position: absolute;
	left: 48%;
	bottom: 100%;
	width: 0;
	height: 0;
	border-bottom: 29px solid #00d096;
	border-top: 29px solid transparent;
	border-left: 29px solid transparent;
	border-right: 29px solid transparent;
}
.tab_content .main_title:after {
	border-bottom-color: #00d096;
}
.service_con.wrks {
    margin: 44px 0 0;
}
.m_0 { margin:0 auto !important;}
.w_100 { width:100% !important;}

ul.works { width:90%; height:auto; float:left; margin:50px 5% 0;}
ul.works li { width:31.33%; height:auto; float:left; margin:0 3% 3% 0;
-webkit-transition:cubic-bezier(.77,0,.175,1).5s;
transition:cubic-bezier(.77,0,.175,1).5s;
box-shadow:0 2px 4px rgba(0,0,0,.3);
box-sizing:border-box;
position:relative;
}
ul.works li:hover {box-shadow:0 12px 10px rgba(0,0,0,.2);}
ul.works li .img, ul.works li .img a { width: calc(100% - 3px);}
ul.works li .img a { background: #fff; padding:5px;}
ul.works li .img a img { width:100%;}
ul.works li:nth-child(3n) {margin:0 0 3% 0;}

/*About us style*/
.about_content{ width:90%; height:auto; float:left; padding: 50px 5%;}
.about_content .about_left_panel {
	width:47%; height:auto; float:left; padding: 0 3% 30px 0;
}
.about_content .about_right_panel {
	width:47%; height:auto; float:left; padding: 0 0 30px 3%;
}

.about_content p {
	font-family: 'Roboto Slab', serif;
	font-size:14px; color:#252525; font-weight:200; line-height:22px; text-align:justify;
	margin-bottom:7px;
}

ul.box_container {
	width:100%;
	height:auto;
	float:left;
	margin:0 auto;
	padding: 0;
}
ul.box_container li {
	width:30%;
	height:auto;
	min-height:415px;
	margin:0 5% 20px 0;
	float:left;
	text-align:center;
	position:relative;
}
ul.box_container li:nth-child(3n) { margin:0 0 20px 0;}
ul.box_container li .circle {
	width:100%;
	height:auto;
	margin:0 0 20px 0;
	float:left;
	text-align:center;
}
ul.box_container li .circle img {
	width:188px;
	height:188px;
	text-align:center;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	border-radius: 50%;
}
ul.box_container li .t1, .what_we_do_title {
	width:100%;
	height:auto;
	float:left;
	text-align:center;
	font-family: 'Roboto Slab', serif;
	font-size:24px; color:#737373;
	line-height:30px;
	margin: 0 0 20px 0;
}
ul.box_container li p { text-align: justify;}

ul.box_container li .description, .what_we_do_description {
	width:100%; height:auto;
	font-family: 'Roboto Slab', serif; float:left;
	font-size:14px; color:#252525; font-weight:400; line-height:22px; text-align:center;
	margin:-10px 0 20px;
}
.what_we_do {
	width:100%; float:left;
	height:auto; text-align:center;
}

ul.box_container li .t1, .what_we_do_txt {
	width:100%;
	height:auto;
	float:left;
	text-align:center;
	font-family: 'Roboto Slab', serif;
	font-size:16px; color:#737373;
	line-height:30px;
	margin: -20px 0 20px 0;
}
.c_orange { color: #ff7f17 !important;}

ul.what_we_do_circle li {width: calc(50% - 1px) !important; margin:0 0 0 !important; padding:0 0 30px; border-bottom: 1px solid #ccc;border-right: 1px solid #ccc;}
ul.what_we_do_circle li:nth-child(2n) {border-right: none;}
ul.what_we_do_circle li:nth-child(3n), ul.what_we_do_circle li:nth-child(4n) {padding: 30px 0 0 !important; border-bottom: none !important;}
ul.what_we_do_circle li:nth-child(3n) .circle, ul.what_we_do_circle li:nth-child(4n) .circle {margin: 30px 0 0 !important;}
ul.what_we_do_circle li h3 { color:#000 !important; margin: 40px 0 10px !important;}
ul.list { width:calc(100% - 20px); float:left; height:auto; margin:0 0 0 20px;}
ul.list li {
	font-family: 'Roboto Slab', serif;
	font-size:14px; color:#252525; font-weight:200; line-height:22px; text-align:justify;
	margin-bottom:7px;
	list-style:circle; list-style-position:inside;
}

.slider_con {
width:300px;
height:auto;
float:left;
position:absolute;
left:5%; right:0;
top:0;
z-index:10000;
padding: 54px 0 0;
}
.slider_content {
	width:100%; height:auto; float:left;
	float:left; margin:0 auto;
}
.slider_content .txt {
	width:100%; height:auto;
	margin:0 auto;
	position:relative;
}
.slider_content .txt h1 {
	color: #FFF;
	padding: 0;
	float:left;
	font-family: 'Roboto Slab', serif;
	font-size: 40px;
	line-height:40px;
	font-weight:500;
	text-align:left;
}
.slider_content .txt p {
	color: #FFF;
	padding: 0;
	float:left;
	margin: 20px 0;
	font-family: 'Roboto Slab', serif;
	font-size: 16px;
	line-height:25px;
	font-weight:200;
	text-align:left;
	word-wrap:break-word;
	
}

.slider_content .txt a {
	width:auto; height:40px;
	padding:0 30px;
	color: #000;
	float:left;
	background:#fff;
	text-align:center;
	font-family: 'Roboto Slab', serif;
	font-size: 18px;
	line-height:40px;
	font-weight:200;
	white-space:nowrap;
}
.slider_content .txt a:hover { cursor:pointer;}


