22

✏️ Editing: ep-animated-card.css

.bdt-ep-animated-card-item{width:auto;max-width:350px;margin:auto;height:650px;transition:all .5s cubic-bezier(.77, 0, .175, 1);position:relative}.bdt-ep-animated-card-circle{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:20px;overflow:hidden}.bdt-ep-animated-card-circle::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:#f9fdff;clip-path:circle(120px at center);transition:all .5s cubic-bezier(.77, 0, .175, 1)}.bdt-ep-animated-card-img-wrap{width:100%;height:100%}.bdt-ep-animated-card-img-wrap img{height:300px;width:330px}.bdt-ep-animated-card-img{position:absolute;top:50%;object-fit:contain;pointer-events:none;transition:all .5s cubic-bezier(.77, 0, .175, 1)}.bdt-ep-animated-card-content{position:absolute;top:0;padding:30px;opacity:0;visibility:hidden;transition:all .5s cubic-bezier(.77, 0, .175, 1)}.bdt-ep-animated-card-sub-title{margin:0;padding-bottom:10px;font-size:20px;text-transform:capitalize;color:#f0f0f1;transition:all .3s ease;font-weight:500}.bdt-ep-animated-card-title{margin:0;font-size:40px;padding-bottom:10px;text-transform:capitalize;color:#fff;transition:all .3s ease}.bdt-ep-animated-card-text{font-size:15px;line-height:1.6;color:rgba(246,246,246,0.671);padding-bottom:10px}.bdt-ep-animated-card-btn{font-size:15px;font-weight:700;text-transform:capitalize;text-decoration:none;color:rgba(246,246,246,0.904);display:inline-flex;align-items:center;transition:all .3s ease}.bdt-ep-animated-card-btn i,.bdt-ep-animated-card-btn svg{opacity:0;transform:translateX(0);transition:all .3s cubic-bezier(.77, 0, .175, 1)}.bdt-ep-animated-card-btn:hover{color:#fff}.bdt-ep-animated-card-btn:hover i,.bdt-ep-animated-card-btn:hover svg{opacity:1;transform:translateX(10px)}.bdt-ep-animated-card-btn:hover svg{width:1em;height:1em;fill:rgba(246,246,246,0.904)}.bdt-ep-animated-card-btn svg{width:1em;height:1em;fill:rgba(246,246,246,0.904)}.bdt-ep-animated-card:hover .bdt-ep-animated-card-circle::before{background:#1e87f0;clip-path:circle(1200px at center)}.bdt-ep-animated-card:hover .bdt-ep-animated-card-img{height:300px;top:75%}.bdt-ep-animated-card:hover .bdt-ep-animated-card-content{opacity:1;visibility:visible}.bdt-style-1:hover .bdt-ep-animated-card-content{left:0}.bdt-style-1:hover .bdt-ep-animated-card-img{left:50%}.bdt-style-1 .bdt-ep-animated-card-img{left:50%;transform:translate(-50%, -50%)}.bdt-style-1 .bdt-ep-animated-card-content{left:20%}.bdt-style-2:hover .bdt-ep-animated-card-content{right:0}.bdt-style-2:hover .bdt-ep-animated-card-img{right:50%}.bdt-style-2 .bdt-ep-animated-card-img{right:50%;transform:translate(50%, -50%)}.bdt-style-2 .bdt-ep-animated-card-content{right:20%}@media (min-width:768px){.bdt-ep-animated-card:hover .bdt-ep-animated-card-img{height:500px;top:50%}.bdt-ep-animated-card-item{width:100%;height:400px;max-width:unset}.bdt-ep-animated-card-item:hover .bdt-ep-animated-card-img{height:500px;top:50%}.bdt-ep-animated-card-content{position:absolute;top:50%;transform:translateY(-50%);max-width:450px;padding:40px}.bdt-ep-animated-card-img{top:50%}.bdt-style-1 .bdt-ep-animated-card-content{left:20%}.bdt-style-1:hover .bdt-ep-animated-card-img{left:75%}.bdt-style-2:hover .bdt-ep-animated-card-img{right:75%}}@media (min-width:1024px){.bdt-ep-animated-card-content{max-width:600px;padding:70px}.bdt-style-1:hover .bdt-ep-animated-card-img{left:80%}.bdt-style-2:hover .bdt-ep-animated-card-img{right:80%}}

MR SKB