* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;

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


}
nav {
  background-color: black;
}




#services{
  margin-top: 130px;
}


a {
  text-decoration: none !important;
}
.center-heading {
text-align: center;
}

.center-heading .section-title {
font-weight: 700;
font-size: 40px;
color: #3B566E;
letter-spacing: 1.1px;
line-height: 38px;
margin-bottom: 20px;
}

.center-heading.colored .section-title {
color: #ffffff;
}

.center-text {
text-align: center;
font-weight: 400;
font-size: 16px;
color: #6F8BA4;
line-height: 28px;
letter-spacing: 1px;
margin-bottom: 50px;
}

.center-text.colored {
color: #C7E5FF;
}

.center-text p {
margin-bottom: 30px;
}

.services-small-item {
display: block;
background: #ffffff;
box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.06);
border-radius: 5px;
padding: 15px;
text-align: center;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
position: relative;
z-index: 2;
margin-bottom: 30px;
height: 100%;
}






.services-small-item:before {
content: '';
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
border-radius: 5px;
background-image: linear-gradient(135deg, #80d0c7 0%, #13547a 100%);
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
opacity: 0;
}
.services-small-item.active:before, .services-small-item:hover:before {
opacity: 1;
}

.services-small-item.active .icon:before, .services-small-item:hover .icon:before {
opacity: .26;
}

.services-small-item.active .icon i, .services-small-item:hover .icon i {
background: -webkit-linear-gradient(#fff, #fff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.services-small-item.active .services-title, .services-small-item:hover .services-title {
color: #ffffff;
}

.services-small-item.active p, .services-small-item:hover p {
color: #ffffff;
}

.services-small-item.active .button i, .services-small-item:hover .button i {
background-image: linear-gradient(135deg, #fff 0%, #fff 100%) !important;
color: #2b708b !important;
}




.services-small-item .icon {
width: 139px;
height: 80px;
margin: auto;
position: relative;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}


.services-small-item .icon i {
display: block;
height: 67px;
line-height: 67px;
position: absolute;
width: 100%;
top: 22px;
z-index: 2;
font-size: 28px;
background-image: linear-gradient(135deg, #80d0c7 0%, #13547a 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}

.services-small-item .services-title {
font-weight: 400;
font-size: 20px;
font-weight: 600;
color: #183044;
letter-spacing: 0.7px;
margin-bottom: 15px;
position: relative;
z-index: 2;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
}

.services-small-item p {
font-weight: 400;
font-size: 14px;
color: #2b4155;
letter-spacing: 0.88px;
line-height: 26px;
position: relative;
z-index: 2;
-webkit-transition: all 0.3s ease 0s;
-moz-transition: all 0.3s ease 0s;
-o-transition: all 0.3s ease 0s;
transition: all 0.3s ease 0s;
text-align: left;
}

.services-small-item .button {
position: relative;
z-index: 2;
}

.services-small-item .button i {
width: 42px;
height: 42px;
background-image: linear-gradient(135deg, #80d0c7 0%, #13547a 100%);
line-height: 42px;
text-align: center;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
color: #fff;
padding-left: 3px;
}

.services-small-item:hover + .item-bg {
bottom: 30px;
}


.services-item-wrapper {
  display: flex;
  flex-direction: column;
}

/* @media (max-width: 1700px){
  .services-item-wrapper{
    height: 634px;
  }
}


@media (max-width: 1400px){
  .services-item-wrapper{
    height: 688px;
  }
} */

.wrapper1{
  height: 450px;
  overflow: hidden;

}

.wrapper2{
  height: 550px;
  overflow: hidden;
}


@media (max-width: 1887px) {
  .wrapper2 { height: 600px; }
  .wrapper1 { height: 500px; }
}

@media (max-width: 1702px) {
  .wrapper2 { height: 650px; }
}

@media (max-width: 1579px) {
  .wrapper1 { height: 550px; }
}

@media (max-width: 1540px) {
  .wrapper2 { height: 750px; }
}

@media (max-width: 1390px) {
  .wrapper1 { height: 600px; }
}

@media (max-width: 1199px) {
  .wrapper1 { height: 635px; }
  .wrapper2 { height: 841px; }
}

@media (max-width: 1024px) {
  .wrapper1 { height: 770px; }
  .wrapper2 { height: 999px; }
}

@media (max-width: 991px) {
  .wrapper1, .wrapper2 { height: auto; }
}








.services-item-wrapper .col-lg-4 {
  flex: 1;
}












/* footer */
footer {
  background-color: #212121;
  color: #ffffff;
}
/* end of footer */