آموزش طراحی کارت تیم با افکت‌ هاور جذاب در المنتور

selector{     --imageHeight: 180px;     --imageWidth: 50%;     --paddingTop: 45px; } selector .elementor-widget-image{     position: static;     height: var(--imageHeight); } selector img{     position: absolute;     top: 0;     left: 0;     width: 100% !important;     height: 100% !important;     -webkit-transition: all 0.5s ease-in-out;     -o-transition: all 0.5s ease-in-out;     transition: all 0.5s ease-in-out;     z-index: 1; } selector:hover img{     left: calc((100% - var(--imageWidth)) / 2);     top: var(--paddingTop);     height: var(--imageHeight) !important;     width: var(--imageWidth) !important; } selector .elementor-widget-heading{     opacity: 0;     -webkit-transition: all 0.5s ease-in-out 0.4s;     -o-transition: all 0.5s ease-in-out 0.4s;     transition: all 0.5s ease-in-out 0.4s; } selector:hover .elementor-widget-heading{     opacity: 1; } selector .elementor-widget-social-icons{     opacity: 0;     -webkit-transform: translateY(100px);         -ms-transform: translateY(100px);             transform: translateY(100px);     -webkit-transition: all 0.5s ease-in-out;     -o-transition: all 0.5s ease-in-out;     transition: all 0.5s ease-in-out; } selector:hover .elementor-widget-social-icons{     -webkit-transform: translateY(0);         -ms-transform: translateY(0);             transform: translateY(0);     opacity: 1; }