22

✏️ Editing: ps-vertex.css

:root{--item-height:150px;--border-width:10px}.bdt-vertex-slider .swiper-vertex{position:relative;overflow:hidden;padding:220px 0}.bdt-vertex-slider .swiper-vertex::before{position:absolute;content:'';border:0;height:var(--border-width);background:#2b2d42;width:99%;margin:auto;top:50%;left:0;right:0;transform:translate(0, -50%)}.bdt-vertex-slider .bdt-item{height:var(--item-height);position:relative;text-align:center;overflow:inherit}.bdt-vertex-slider .bdt-item.swiper-slide-active .bdt-img{transform:scale(1.7);margin-top:0}.bdt-vertex-slider .bdt-item.swiper-slide-active .bdt-content{opacity:1}.bdt-vertex-slider .bdt-img-wrap{width:100%;height:100%;position:relative}.bdt-vertex-slider .bdt-img-wrap .bdt-img{width:var(--item-height);height:var(--item-height);object-fit:cover;border-radius:25px;transform:scale(1);transition:all .3s cubic-bezier(.645, .045, .355, 1);border-width:var(--border-width);border-color:#2b2d42;border-style:solid;background:#2b2d42}.bdt-vertex-slider .bdt-content{padding-top:75px;overflow:hidden;opacity:0}.bdt-vertex-slider .bdt-content div{line-height:1}.bdt-vertex-slider .bdt-title{font-size:18px;font-weight:600;width:100%;margin:0;text-transform:capitalize}.bdt-vertex-slider .bdt-title a{color:#2B2D42;transition:all .3s ease}.bdt-vertex-slider .bdt-title a:hover{color:#D90429}.bdt-vertex-slider .bdt-category{margin-bottom:10px;display:inline-flex}.bdt-vertex-slider .bdt-category a{color:#7e8796;font-size:12px;text-transform:uppercase;transition:all .3s ease}.bdt-vertex-slider .bdt-category a:hover{color:#D90429}.bdt-vertex-slider .bdt-category a+a{margin-left:7px}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-next,.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-prev{position:absolute;top:50%;transform:translateY(-50%);font-size:12px;color:#fbfbfb;transition:all .3s ease;z-index:1;background:#2b2d42;width:40px;height:40px;line-height:40px;text-align:center;border-radius:6px;overflow:hidden;cursor:pointer}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-next::before,.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-prev::before{content:'';position:absolute;background-color:#D90429;transition:all 300ms ease;right:-50%;left:auto;top:0;width:0;height:100%;transform:skewX(-45deg)}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-next:hover::before,.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-prev:hover::before{width:260%}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-next i,.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-prev i{transition:transform .3s ease;transform:scale(1) translateX(0);display:inline-flex}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-prev{left:0}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-prev:hover{background:#D90429}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-prev:hover i{transform:scale(1.1) translateX(-3px)}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-next{right:0}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-next:hover{background:#D90429}.bdt-vertex-slider .bdt-navigation-wrap .bdt-navigation-next:hover i{transform:scale(1.1) translateX(3px)}@media (min-width:1024px){.bdt-vertex-slider .bdt-title{font-size:25px}}

MR SKB