


 .about-feature.about-box {

  

  background-size: cover;

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  position: relative;

  padding-top: 1px;
  margin-top: 50px;

}

 .about-feature.about-box .inner-about-box {

  overflow: hidden;

  margin-top: -51px;

}
.about-feature.about-box .inner-about-box .row > .col-md-3.col-sm-6.col-xs-12{
  padding-right: 0!important;
  padding-left: 0!important;
}
 .about-feature.about-box .about-post {

  text-align: center;

  float: left;

  width: 100%;

  position: relative;

  padding-bottom: 340px;

  background: transparent;

  margin-top: 50px;

  z-index: 2;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

}

 .about-feature.about-box .about-post .about-post-content {

  background: #ffffff;

  padding: 0 30px 60px;

  border-top: 1px solid #ececec;

  border-right: 1px solid #ececec;

  position: relative;

  z-index: 2;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

}

 .about-feature.about-box .about-post .about-post-content a {

  display: inline-block;

  text-decoration: none;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

  width: 100px;

  height: 100px;

  margin: -50px 0 24px;

  line-height: 100px;

  color: #dadfe1;

  font-size: 30px;

  text-align: center;

  background: #ffffff;

  border: 1px solid #ececec;

  -webkit-border-radius: 50%;

  -moz-border-radius: 50%;

  -o-border-radius: 50%;

  border-radius: 50%;

}

 .about-feature.about-box .about-post .about-post-content a:hover {

  background: #f27935;

  color: #ffffff;

}

 .about-feature.about-box .about-post .about-post-content h2 {

  color: #222222;

  font-size: 15px;

  font-family: 'Lato', sans-serif;

  font-weight: 700;

  margin: 0 0 15px;

  text-transform: uppercase;

  letter-spacing: 1.8px;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

}

 .about-feature.about-box .about-post .about-post-content p {

  margin: 0 auto;

  max-width: 210px;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

}

 .about-feature.about-box .about-post .hover-about {

  position: absolute;

  top: 50%;

  width: 100%;

  left: 0;

  height: 100%;

  padding: 0 30px;

  padding-top: 80px;

  background: transparent;

  text-align: center;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

}

 .about-feature.about-box .about-post .hover-about h2 {

  color: #222222;

  font-size: 15px;

  font-family: 'Lato', sans-serif;

  font-weight: 700;

  margin: 0 0 15px;

  font-size: 13px;

  color: #ffffff;

  font-weight: 400;

  text-transform: uppercase;

  letter-spacing: 1.8px;

  margin-bottom: 6px;

}

 .about-feature.about-box .about-post .hover-about h1 {

  color: #222222;

  font-size: 30px;

  font-family: 'Lato', sans-serif;

  font-weight: 900;

  margin: 0 0 30px;

  text-transform: uppercase;

  color: #ffffff;

  letter-spacing: 2px;

  margin-bottom: 40px;

}

 .about-feature.about-box .about-post .hover-about span {

  display: inline-block;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

  width: 62px;

  height: 5px;

  border-top: 1px solid #ffffff;

  border-bottom: 1px solid #ffffff;

  margin: 0 0 40px;

  opacity: 0;

}

 .about-feature.about-box .about-post .hover-about p {

  color: #ffffff;

  max-width: 340px;

  margin: 0 auto;

  opacity: 0;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

}

 .about-feature.about-box .about-post:hover .about-post-content {

  background: transparent;

}

 .about-feature.about-box .about-post:hover .about-post-content h2,

 .about-feature.about-box .about-post:hover .about-post-content p {

  opacity: 0;

}

 .about-feature.about-box .about-post:hover .about-post-content a {

  background: #f27935;

  border: 1px solid #f27935;

  color: #ffffff;

}

 .about-feature.about-box .about-post:hover .hover-about {

  top: 0;

  padding-top: 100px;

}

 .about-feature.about-box .about-post:hover .hover-about span,

 .about-feature.about-box .about-post:hover .hover-about p {

  opacity: 1;

}

 .about-feature.about-box .about-post:before {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: url('../images/pattern.png');

  opacity: 0;

  transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -webkit-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

}

 .about-feature.about-box .about-post:hover:before {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: url('../images/pattern.png');

  opacity: 0.85;

}

 .about-feature.about-box:after {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: rgba(51, 51, 51, 0.6);

}