
.section-title{
  text-align: center;
  align-items: center;

    margin:0px 0px;
font-size: 1.5rem;

  color: white;
}
#services{
 padding: 4% 7%;
  position: relative;
  z-index: 1;
}


.column {
  text-align: center;
  padding:4.5%;
}

.card {
  text-align: center;
  width: 100%;
  height: 100%;
  padding: 2em 1.5em;
  background: linear-gradient(#E8BE3C 50%, #ffffff 50%);
  background-size: 100% 200%;
  background-position: 0 2.5%;
  border-radius: 5px;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.12);
  cursor: pointer;
  transition: 0.5s;
}
h3 {
  font-size: 20px;
  font-weight: 600;
  color: #black;
  margin: 1em 0;
}
p {
  ;
  font-size: 15px;
  line-height: 1.6;
  letter-spacing: 0.03em;
}
.icon-wrapper {
  background-color: #ffffff;
  position: relative;
  margin: auto;
  font-size: 30px;
  height: 2.5em;
  width: 2.5em;
  color: #ffffff;
  border-radius: 50%;
  display: grid;
  place-items: center;
  transition: 0.5s;
}
.card:hover {
  background-position: 0 100%;
}
.img1{
  width: 55px;
  height: 55px;
    display: none;
    position: absolute;
    top: 20;
    left: 20;
    z-index: 95;

}
.img-top {
    width: 55px;
  height: 55px;
}

.card:hover .img1 {
        display: inline;
    }

.card:hover .icon-wrapper {
  background-color: black};
  color: white;
}
.card:hover h3 {
  color: black;
}
.card:hover p {
  color: #black;
}
@media screen and (min-width: 768px) {


  }
}
@media screen and (min-width: 992px) {
  
}

