.sablon-services .icon-box {
  padding: 30px;
  position: relative;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 0 29px 0 rgba(68, 88, 144, 0.12);
  transition: all 0.3s ease-in-out;
  border-radius: 8px;
  z-index: 1;
}

.sablon-services .icon-box::before {
  content: '';
  position: absolute;
  background: #d9f1f2;
  right: 0;
  left: 0;
  bottom: 0;
  top: 100%;
  transition: all 0.3s;
  z-index: -1;
}

.sablon-services .icon-box:hover::before {
  background: #3fbbc0;
  top: 0;
  border-radius: 0px;
}

.sablon-services .icon {
  margin-bottom: 15px;
}

.sablon-services .icon i {
  font-size: 48px;
  line-height: 1;
  color: #3fbbc0;
  transition: all 0.3s ease-in-out;
}

.sablon-services .title {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 16px;
}

.sablon-services .title a {
  color: #111;
}

.sablon-services .description {
  font-size: 15px;
  line-height: 28px;
  margin-bottom: 0;
}

.sablon-services .icon-box:hover .title a, .sablon-services .icon-box:hover .description {
  color: #fff;
}

.sablon-services .icon-box:hover .icon i {
  color: #fff;
}

<!------------------------------------------------------------>

#alan {
    position: relative;
    width: 800px;
    height: auto;
    margin: 0 auto;
}

#ana-kurumsal-devam{ position:relative; display:block; font-family: 'Exo', sans-serif; font-weight:600; font-size:18px; color:#333; text-decoration:none; padding:5px; line-height:40px; margin-top:20px; border-radius:10px; background:#fff; border:1px solid #0071b9; float:right; }
#ana-kurumsal-devam:hover{ background:#0071b9; color:#FFF; }



#orta1 {
    width: 49%;
    height: auto;
    float: left;
    position: relative;
    z-index: 1;
    margin: 20px auto;
    box-sizing: border-box;
    text-align: left;
}

#orta1 h1{ color:#f2bc00; font-weight:500; font-size:20px; margin:20px auto; }

.ic {
    font-family: 'Rajdhani', sans-serif;
    font-size: 18px;
    color: #818080;
    line-height: 24px;
    font-weight: 500;
}



#orta2 {
    width: 49%;
    height: auto;
    float: right;
    position: relative;
    z-index: 1;
    margin: 20px auto;
    box-sizing: border-box;
    text-align: left;
}

#temizle {
    clear: both;
}


img {
    vertical-align: middle;
}
img {
    border: 0;
}



img {
    vertical-align: middle;
}
img {
    border: 0;
}



p {
    margin: 0 0 10px; font-size:15px;
}



#orta-bslk{width:auto;min-height:40px;line-height:40px;padding-bottom:10px;font-family: 'Rajdhani', sans-serif; font-weight:350; font-size:30px; color:#000; text-decoration:none;}
#orta-bslk span{ font-weight:300; }


#orta-kutu{ width:15.6%; height:auto; float:left; position:relative; z-index:1; margin:20px 0.5%; padding:30px 0px; box-sizing:border-box; text-align:center; background:#0071b9; font-family: 'Rajdhani', sans-serif; font-weight:700; font-size:14px; color:#fff; border-radius:30px; box-sizing:border-box; }
#orta-kutu img{ height:35px; margin-bottom:10px; }


#footer .footer-newsletter {
  padding: 50px 0;
  background: #eff2f8;
  text-align: center;
  font-size: 15px;
}

#footer .footer-newsletter h4 {
  font-size: 24px;
  margin: 0 0 20px 0;
  padding: 0;
  line-height: 1;
  font-weight: 600;
  color: #47536e;
}

#footer .footer-newsletter form {
  margin-top: 30px;
  background: #fff;
  padding: 6px 10px;
  position: relative;
  border-radius: 50px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
  text-align: left;
}

#footer .footer-newsletter form input[type="email"] {
  border: 0;
  padding: 4px 8px;
  width: calc(100% - 100px);
}

#footer .footer-newsletter form input[type="submit"] {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  border: 0;
  background: none;
  font-size: 16px;
  padding: 0 20px;
  background: #5777ba;
  color: #fff;
  transition: 0.3s;
  border-radius: 50px;
  box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
}

#footer .footer-newsletter form input[type="submit"]:hover {
  background: #415f9d;
}