.card-area-effect{grid-gap:40px;display:grid;grid-auto-columns:1fr;grid-auto-rows:1fr}.card-area-effect .box-grid{align-items:center;display:flex;flex-wrap:wrap;overflow:hidden;position:relative}.card-area-effect .box-grid:before{height:100%;opacity:0;transition:opacity .65s cubic-bezier(.05,.2,.1,1);width:calc(100% + 10px)}.card-area-effect .box-grid:after,.card-area-effect .box-grid:before{bottom:0;content:"";display:block;left:0;position:absolute;z-index:10}.card-area-effect .box-grid:after{height:30%;opacity:.4;width:100%}.hover-content-text{margin-top:0;padding:0 20px 20px}.card-area-effect .box-grid .promo-box-bg{backface-visibility:hidden;background-position:50%;background-size:cover;height:100%;left:0;opacity:1;overflow:hidden;position:absolute;top:0;transition:transform 1s ease,opacity .5s ease .25s;width:100%;z-index:1}.card-area-effect .box-grid .card-text p:first-child{margin-top:0}.card-area-effect .box-grid .card-text p:last-child{margin-bottom:0}.card-area-effect .promo-box-icon svg{fill:#fff;height:40px;margin-bottom:20px}.card-area-effect .promo-box-icon{display:block;margin-bottom:10px}.card-area-effect .promo-box-icon img{height:50px;width:auto}.card-area-effect .box-grid .heading-wrapper{padding:20px}.card-area-effect .box-grid .heading-wrapper,.card-area-effect .box-grid .onhover-content{transform:translateY(0);transition:opacity .2s cubic-bezier(.05,.2,.1,1),transform .2s cubic-bezier(.05,.2,.1,1)}.card-area-effect .box-grid .onhover-content{bottom:0;font-size:18px;left:0;margin-top:0;opacity:0;position:absolute}.card-area-effect .box-grid:hover:before{opacity:1}.card-area-effect .box-grid:hover .promo-box-bg{transform:scale(1.1);transition:transform 1s cubic-bezier(.1,.2,.7,1)}.card-area-effect .box-grid:hover .onhover-content{opacity:1;transform:translateY(0);transition:opacity .65s cubic-bezier(.05,.2,.1,1) .15s,transform .65s cubic-bezier(.05,.2,.1,1) .15s}