/*services listing page*/
.services-listing {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; column-gap: 20px; row-gap: 30px; }
.services-list {position: relative; }
.service-charge {background: #34A853; padding: 7px 15px 7px 15px; border-radius: 0 16px 0 16px; color: #fff; position: absolute; right: 0; top: 0; font-size: 12px; font-weight: 500; }
.service-charge span {display: inline-flex; }
.service-title-link {display: flex ; width: 100%; align-items: end; position: absolute; bottom: 0; padding: 15px 20px; justify-content: space-between; gap: 20px; height: 100%; background: linear-gradient(360deg, rgba(0, 0, 0, 0.8) 0%, rgba(36, 36, 36, 0.5) 14.29%, rgba(232, 232, 234, 0) 70.36%);    transition: 0.5s;}
.services-list:hover .service-title-link {background: linear-gradient(0deg, #E7EAEE 0%, rgba(231, 234, 238, 0.5) 64.68%, rgba(231, 234, 238, 0) 100%); }

.services-list .service-img a img {display: block; width: 100%; height: 263px;    object-fit: cover; }
.services-list:hover .service-title {color: #0E2E57; }
.services-list:hover .service-link img {filter: brightness(0) saturate(100%) invert(12%) sepia(79%) saturate(1256%) hue-rotate(188deg) brightness(95%) contrast(94%); }
.service-link img {display: block; }
.service-link {min-width: 30px; height: 30px; }


.services-list {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
}

















@media screen and (max-width: 1100px) {



}

@media screen and (max-width: 960px) {



}

@media screen and (max-width: 767px) {



}



@media screen and (max-width: 480px) {


}