/* fonts */
html {  -webkit-font-smoothing: antialiased !important; min-height: 100%; }

@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700");

 


/* global */
.top0{ margin-top:0 !important}

body { background:url(../images/bg-line.png) no-repeat right top #f8f8f8; font-size: 15px;font-family: 'Open Sans', sans-serif; color: #212121; font-weight: 300;  height: 100%; margin: 0; padding: 0; overflow-y: scroll;}

h1, h2, h3, h4, h5, h6 , p , div , a , ul ,li { margin: 0; padding:0;}

a { color: black; text-decoration:none;}
a:hover { color:#5BBC2E; text-decoration: none;}
a:focus { outline: none;}


h1, h2, h3, h4, h5, h6 { font-family: 'Open Sans', sans-serif; text-transform:uppercase; font-weight: 300;}
h1 { font-size: 43px;}
h2 { font-size: 40px;}
h3 { font-size: 21px; }
h4 { font-size: 27px;}
h5 {font-size: 16px;}
h6 { font-size: 14px;}

p { line-height: 30px; font-size: 18px; }

.clear { clear:both; height:0; }

.grid {  margin: 0 -15px}
.col-1 {width: 8.33333%; }
.col-2 {width: 16.6667%; }
.col-3 {width: 25%; }
.col-4 {width: 33.3333%; }
.col-5 {width: 41.6667%; }
.col-6 {width: 50%; }
.col-7 {width: 58.3333%; }
.col-8 {  width: 66.6667%; }
.col-9 {  width: 75%; }
.col-10 {  width:83.3333%; }
.col-11 {  width:91.6667%; }
.col-12 {  width:100%; }

.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 {float: left; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0 15px;   }

.clearfix:before , .clearfix:after {  content: " "; clear: both; height: 0;    display: table;}

.img-responsive {max-width: 100%; }

.mar-top-10 { margin-top: 10px; }
.mar-top-20 { margin-top: 20px; }


.pull-left {  float: left !important; }
.pull-right {  float: right !important; }

/* Globle classes */
 .text-right { text-align: right; }
 .text-center { text-align: center; }

.text-normal { text-transform: none; }

.team_contact{ margin:30px 0}
.team_contact a{ display:table-cell; background:#5bbc2e url(../images/corner-br.png) no-repeat bottom right; font-size:20px; color:white;height:150px; vertical-align:middle; text-align:center; padding:12px; border:1px solid #5BBC2E}
.team_contact a:hover{ border:6px solid #479423; transition:ease-in 0.2s}
.team_contact a span{ display:block; vertical-align:middle}
/*// Navigation */

.left-section { background: #222222; position: fixed; left: 0; height: 100%; width:230px;overflow: hidden; transition: width ease-in-out 0.28s; overflow-x: hidden; overflow-y: auto;}

/*.right-content {margin-left: 50px; padding-top: 80px; transition: margin ease-in-out 0.28s;}*/
.right-content { padding-top: 80px;}
.navbar h2 { font-size: 14px; font-weight: 400; margin:45px 0 14px 10px; color:#b0b0b0; white-space: nowrap;}


.panel-open .left-section { width: 250px; transition: width ease-in-out 0.28s; }
.panel-open .right-content { margin-left: 250px; transition: margin ease-in-out 0.28s;}

.panel-open .navbar h2 { opacity: 1; transition: opacity ease-in-out 0.28s; }
.left-section .logo {  margin: 20px 7px; padding: 0; }
.left-section .logo a { display: block; background: url(../images/logo.png) no-repeat center center; width: 211px; height:31px; text-indent: -9999em }

.nav-menu { list-style: none; padding: 0; margin: 0; border-top:1px solid #292929 ; }
.nav-menu li { list-style: none; padding: 0; margin: 0; }
.nav-menu li a {  border-bottom:1px solid #292929; display: block; color: #b0b0b0; font-size: 14px; white-space: nowrap; line-height:40px; padding-left:10px;}
.nav-menu li.active a , .nav-menu li a:hover{ background: #111111 ; color: #5bbc2e }


 

.page-title h2{  margin:0; padding: 0; font-weight: 300; }
.page-title p {  margin-top: 40px;}
.container { max-width: 798px; margin: 0 auto; padding: 0 15px; }

.profile-wrap { margin: 80px -15px 0;}
.profile-wrap .profile-col { float: left; width: 50%;  -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;padding: 0 15px; }
.profile-inner {margin-bottom: 30px; background: #fff; padding: 30px 15px 20px;border-bottom:3px solid #e6e6e6; box-shadow: 0 0 1px rgba(0, 0, 0, 0.07)  }
.profile-inner .expert-pic { overflow: hidden;width: 144px; height: 144px; border-radius: 50%; margin: auto; border:3px solid #fff; box-shadow:0 0 5px rgba(0, 0, 0, 0.2) , 0 0 3px rgba(0, 0, 0, 0.1) inset}
.profile-inner .expert-pic img{max-height:140px;}
.profile-inner h3 {    font-size: 24px; font-weight: 300; color: #3e3e3e; margin:20px 0 0; padding: 0; text-transform: uppercase;  }
.profile-inner .expert {display: inline-block; font-size: 14px; font-weight: 400; text-transform: uppercase;color:#212121;    margin-top: 10px;   }
.profile-inner span { background: #5bbc2e; width: 12px; height: 12px; float: left; margin-top: 4px; margin-right: 6px; }
.profile-inner p { color: #212121; margin:22px 0 35px; line-height: 1.6; font-size: 15px; }
.profile-inner .btn-green { background: #5bbc2e; padding:10px 35px; ; margin:0 0 10px; border-radius: 3px; color: #fff;  display: inline-block; text-decoration: none; font-weight: 600}
.profile-inner .btn-green:hover { background: #51ad26 }


/* about page */
.about-wrap {  }
.about-wrap h2 {margin-bottom: 40px; }

.about-grid { margin-top:90px;  }


.project-process { margin-top: 30px; }
.project-process ul { list-style: none; margin-right: -20px; }
.project-process ul li { float: left;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;  text-align: center; padding-right: 2%; width: 20%; position: relative;}

.project-process ul li:before { content: url(../images/separate-line.png); position: absolute; right: -2px; top: 0; top:33%;  margin-top: -1px; width: 16px; height: 1px; z-index: -1}
.project-process ul li.last:before{ display: none;}
.project-process ul li.last {   }
.project-process ul li div { background: #fff; border:1px solid #eaeaea; padding: 14px 0;   }
.project-process ul li span {display: inline-block;  }
.project-process ul li p { font-size: 14px;  }
.project-process ul li i { height: 31px; margin: 0; }


/* Portfolio */

#grid-wrap {margin-top:65px; }

.portfolio-wrap { margin-top: 70px; }
.portfolio-grid { margin-top: 60px; }
.portfolio-grid h4 {  margin: 0 0 6px 0; word-wrap: break-word; line-height: 27px;} 
.portfolio-grid p { font-size: 14px; line-height:25px; } 
.profolio-show p {padding: 0 10px; }
.portfolio-grid p b { font-weight:500; color: #5bbc2e;} 
.portfolio-grid .clients{margin-top: 30px;}
.clients h5 { color: #111; margin-bottom: 4px; text-transform: none;}
.clients a { color: #3b8318; font-size: 13px; display: block; font-weight: 400; line-height: 24px;}
.clients a:hover { text-decoration: underline; }

.portfolio-grid .img-wrap { display: block; border:1px solid #ddd; margin-bottom: 20px; }
.portfolio-grid .img-wrap img{ max-width: 100%; vertical-align: top;}
.portfolio-grid .col-4 {padding: 0 10px; }
.text-wrap { display: block; border:1px solid #ddd; height: 141px; padding-top: 45px;    margin-bottom: 20px;}
.text-wrap .h6 { font-size: 16px; font-weight: 600; color: #5bbc2e; display: block;  }
.text-wrap .p{ font-size: 13px; color: #595959;  }

.text-wrap.hide-more {  height: 141px;    padding-top: 56px; text-transform: uppercase;  }
.text-wrap.hide-more h6 { color: #121212;  }
.hide-more, .show-more ,  .profolio-more { display: none; }

.block{ display: block !important; }


* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}


/* Footer and icons */
.footer { border-top: 1px solid #e1e1e1; padding-top: 30px; text-align: center; clear: both; padding-bottom: 30px; margin-top: 30px;  font-weight: 600; }
.footer  p { padding: 0; margin: 0; color: #323232; font-size: 13px; font-weight:300 }

[class^="icons"],
[class*=" icons"] {display: inline-block; width:35px; height:30px; *margin-right: .3em; line-height: 14px; vertical-align: text-top; background-image: url(../images/sprite-image.png); background-repeat: no-repeat; float: left; margin-right: 10px; }

.icons-team { background-position:0 9px}
.icons-about { background-position: 0px -21px }
.icons-portfolio { background-position:0 -51px }
.icons-asp { background-position:0 -83px}
.icons-ios { background-position:0 -301px }
.icons-android { background-position:0 -121px }
.icons-php { background-position:0 -156px}
.icons-dsg { background-position:-2px -196px }
.icons-html { background-position:0 -232px }
.icons-seo { background-position:0 -264px}
.icons-contactus { background-position:2px -562px}
.icons-bdm { background-position:-48px -344px}

.icons-project { background-position: 0 -350px  }
.icons-plan { background-position: -5px -396px }
.icons-build { background-position: -5px -444px  }
.icons-testing { background-position: 0 -488px  }
.icons-deliver { background-position: -1px -525px }




.nav-menu li.active {  }

.nav-menu li.active .icons-team,
.nav-menu li a:hover .icons-team { background-position: -48px 9px }
.nav-menu li.active .icons-about,
.nav-menu li a:hover .icons-about { background-position:-48px -21px }
.nav-menu li.active .icons-portfolio,
.nav-menu li a:hover .icons-portfolio { background-position:-50px -51px }
.nav-menu li.active .icons-asp,
.nav-menu li a:hover .icons-asp { background-position:-48px -83px }
.nav-menu li.active .icons-ios,
.nav-menu li a:hover .icons-ios { background-position:-48px -301px }
.nav-menu li.active .icons-android,
.nav-menu li a:hover .icons-android { background-position:-48px -121px }
.nav-menu li.active .icons-php,
.nav-menu li a:hover .icons-php { background-position:-48px -156px}
.nav-menu li.active .icons-dsg,
.nav-menu li a:hover .icons-dsg { background-position:-50px -196px }
.nav-menu li.active .icons-html,
.nav-menu li a:hover .icons-html { background-position:-48px -232px }
.nav-menu li.active .icons-seo,
.nav-menu li a:hover .icons-seo { background-position:-48px -264px}
.nav-menu li.active .icons-contactus,
.nav-menu li a:hover .icons-contactus { background-position:-26px -562px}
.nav-menu li.active .icons-bdm,
.nav-menu li a:hover .icons-bdm { background-position:-48px -384px}


.form-wrap{ margin-top:50px;}
.form-wrap .form-group {margin-bottom: 22px; }
.btn-success { background: #5BBC2E; padding:10px 30px; border:none; }
.btn-success:hover ,
.btn-success:active ,
.btn-success:focus{background: #5BBC2E; border:none;}
.btn-default { border:none; background:#5BBC2E; text-transform: uppercase; color: #fff; padding: 16px 18px }
.btn-default:hover ,
.btn-default:active ,
.btn-default:focus
{ background: #5BBC2E; border-color: #5BBC2E; color: #fff;}

.form-control { border:1px solid #ddd; border-radius: ; box-shadow: none; min-height: 60px }
textarea.form-control { min-height: 180px; resize:vertical }
.form-wrap {background:#ededed;margin-top:50px;padding: 25px;}
label {display: inline-block;max-width: 100%;margin-bottom: 5px;font-weight: 700;}
.form-control {
  display: block;
  width: 100%;
  height: 34px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
  -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
  -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
  transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}
.form-control {
  border: 1px solid #ddd;
  border-radius: ;
  box-shadow: none;
  min-height: 60px;
}
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
.btn-default {
  border: none;
  background: #5BBC2E;
  text-transform: uppercase;
  color: #fff;
  padding: 16px 18px;
}

@media (max-width: 998px){

.panel-open .right-content {margin-left: 280px; }
.right-content {margin-left: 80px;  }
.profile-wrap {margin: 0 0 0 -15px }
.grid {margin: 0 0 0 -15px; }
.portfolio-grid .clients { margin-bottom: 30px }
.portfolio-grid .col-4 {width: 142px; }
.portfolio-grid .text-wrap { height: 101px; padding-top: 22px;}

.project-process ul { margin-right: 0; }

}


@media (max-width: 767px){

 .profile-wrap .profile-col { float: none; width: auto; }
.right-content { padding-top: 50px; }
.left-section{ width:50px;}
.hidden-xs{ display:none !important}
.right-content h2 br { display: none; }

.panel-open .right-content { margin-left: 80px; }
.profile-inner p { min-height: 30px }

.project-process ul { text-align: center; }
.project-process ul li { margin-top: 20px; display: inline-block; float: none; position: relative; text-align: center; width: 30%; }

.project-process ul li:nth-child(3):before {display: none; }
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 { float: none; width: auto }
.pull-right{ float: none !important }
.text-right { text-align: left; }
.about-wrap h2 {margin-bottom: 10px; }

.portfolio-grid .col-4 {width: 133px; float: left; } 
.portfolio-grid .text-wrap {height: 94px; padding-top: 22px; }

}
@media (max-width:640px){
.right-content h2 {font-size: 30px; margin: 0 0 40px}

.portfolio-grid .text-wrap.hide-more {padding-top: 36px }

}

@media(max-width: 560px){
.project-process ul li {  width: 48%; }
.project-process ul li:nth-child(2)::before,
.project-process ul li:nth-child(4)::before {display: none; }
.project-process ul li:nth-child(3)::before {display: block; }
}

.call-float{
    position: fixed;
    top: 90px;
    right: 0;
    background: white;
    padding: 20px;
	border-left:3px solid #5BBC2E;
	}