/*------------------------------------------------------------------------
# mod_ol_services Extension
# ------------------------------------------------------------------------
# author    olwebdesign
# copyright Copyright (C) 2019 olwebdesign.com. All Rights Reserved.
# @license - http://www.gnu.org/licenses/gpl-2.0.html GNU/GPL
# Websites: http://www.olwebdesign.com
-------------------------------------------------------------------------*/

.ol-services3 {
  overflow: hidden;
  padding: 30px;
  position: relative;
}
.ol-services3:last-child {
  border-right: none;
}
.ol-services3 .hover-item {
  top: 0;
  opacity: 0;
  left: -30px;
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transition: 500ms all ease;
  transition: 500ms all ease;
}
.ol-services3 .hover-item .inner-text {
  left: 0;
  right: 0;
  width: 90%;
  opacity: 0;
  bottom: -40px;
  margin: 0 auto;
  padding: 25px;
  background-color: #fff;
  -webkit-transition: 500ms all ease;
  transition: 500ms all ease;
  -webkit-transition-delay: 0.2s;
          transition-delay: 0.2s;
}

.ol-services3 .hover-item .inner-title {
  margin-top: 15px;
}
.ol-services3 .hover-item .inner-title h3 {
  color: #000000;
  font-size: 28px;
  font-weight: 500;
  line-height: 38px;
}
.ol-services3 .hover-item .inner-title a {
  color: #020202;
  font-weight: 500;
}

.ol-services3 .img-bg {
  left: 0;
  bottom: 0;
}
.ol-services3 .hover-item .inner-icon span {
  font-size: 50px;
}
.ol-services3 .hover-item .inner-icon img {
  height: 50px;
}

.ol-services3 .project-icon span {
  font-size: 100px;
}
.ol-services3 .project-icon {
  margin-bottom: 10px;
}
.ol-services3 .project-icon img {
  height: 100px;
  width: auto !important;
}
.ol-services3 .project-text h3 {
  color: #000000;
  font-size: 28px;
  font-weight: 500;
  line-height: 38px;
  padding-bottom: 15px;
}

.ol-services3 .project-text a {
  color: #020202;
  font-size: 14px;
  font-weight: 500;
}
.ol-services3 .project-text a i {
  margin-left: 5px;
}
.ol-services3:hover .hover-item {
  left: 0;
  opacity: 1;
}
.ol-services3:hover .hover-item .inner-text {
  opacity: 1;
  bottom: 25px;
}