.services-hero{background-color: whitesmoke;}

.services-hero .img-box{width: 100%; height: auto;}
.services-hero .img-box img{width: 100%;height: auto; aspect-ratio: 850/500}
.services-hero p{font-size: 18px;letter-spacing: 1px; padding: 10px 45px;margin-top: 25px;}
@media(min-width: 768px) and (max-width: 950px)
{
    .services-hero p{font-size: 17px;letter-spacing: 0.5px; padding: 5px 20px;margin-top:0;}
}

.service-list .item-box{width:95%;box-shadow:2px 2px 4px #a0a0a0; margin:0 auto 30px; padding: 20px 10px;
display: block; cursor: pointer; text-decoration: none; color: #444;}

.service-list .img-box{width: 100%;height: auto;}
.service-list .img-box img{width: 50%; display: block; margin: 30px auto; aspect-ratio: 1/1}

.service-list .desc{width: 100%; height: 100%; text-align: center;}
.service-list .desc h3{color: #7E3C2B; margin: 20px 0; font-weight: bold;}
.service-list .desc p{font-size: 16px;margin: 5px 20px 25px}

.service-list .desc .values:before{background-image: url('../img/svg/check-all.svg');
    background-size: 23px 23px; background-repeat: no-repeat;background-position: center;content:"";
     display: inline-block;  width: 16px;  height: 16px; position:relative;top:3px; left: -10px;  }

.service-list .item-box:hover{box-shadow:2px 2px 6px #7E3C2B, -2px -2px 6px #7E3C2B;}
.service-list .item-box:hover h3{color: #005D3A;}