.servces_card:before{content:"";height:100%;left:0;opacity:.4;position:absolute;top:0;width:100%;z-index:1}.servces_card:hover h3{color:var(--hover_color)!important}.servces_card h3{margin-bottom:30px!important;transition:all 1s ease-in-out}.servces_card:hover:before{border-radius:20px;opacity:.8;transition:all .3s ease-in-out}.servces_card{border-radius:20px;height:640px;transition:all 1s ease-in-out}.grid figure,.servces_card{overflow:hidden;position:relative}.grid figure{cursor:pointer;float:left;text-align:center}figure.effect-lily img{border-radius:20px;height:640px;object-fit:cover}.grid figure{margin:0}.grid figure img{display:block;position:relative}.grid figure figcaption{color:#fff;text-transform:uppercase}.grid figure figcaption:after,.grid figure figcaption:before{pointer-events:none}.grid figure figcaption{height:100%;left:0;position:absolute;top:0;width:100%}.grid figure h3{margin-bottom:30px;word-spacing:-.15em}.grid figure h3,.grid figure p{margin:0}.grid figure p{font-size:18px;font-weight:600;line-height:1.7}figure.effect-lily img{max-width:100%}figure.effect-lily figcaption{text-align:left}figure.effect-lily figcaption>div{bottom:0;height:32%;left:0;padding:40px;position:absolute;width:100%;z-index:4}.servces_card:hover figure.effect-lily figcaption>div{height:auto!important}figure.effect-lily h3,figure.effect-lily p{-webkit-transform:translate3d(0,40px,0);transform:translate3d(0,40px,0)}figure.effect-lily h3{-webkit-transition:-webkit-transform .2s;transition:transform .2s}figure.effect-lily p{color:hsla(0,0%,100%,.8);opacity:0;-webkit-transition:opacity .2s,-webkit-transform 1s;transition:opacity .2s,transform 1s}.servces_card:hover img,.servces_card:hover p{opacity:1}.servces_card:hover h3,.servces_card:hover img,.servces_card:hover p{-webkit-transform:translateZ(0);transform:translateZ(0)}.servces_card:hover p{-webkit-transition-delay:.2s;transition-delay:.2s;-webkit-transition-duration:.2s;transition-duration:.2s}@media only screen and (min-width:768px) and (max-width:900px){figure.effect-lily figcaption>div{padding:29px}}@media only screen and (min-width:300px) and (max-width:500px){figure.effect-lily figcaption>div{padding:20px}}@media(max-width:768px){figure.effect-lily figcaption>div{height:50%!important}.servces_card,.servces_card img{height:500px}.servces_card:hover figure.effect-lily figcaption>div{height:90%!important}}