.title{font-size:26px;font-weight:700;color:#000}.para{font-size:16px;font-weight:600;color:#000;text-align:center}.swipe-cond{background-color:#fff;border-radius:20px;transition:background-color .3s ease}.image-icon{transition:transform .5s ease}.swipe-cond:hover{animation:colorChange .6s forwards}.swipe-cond:hover .para,.swipe-cond:hover .title{color:#fff}.swipe-cond:hover .image-icon{animation:zoomShake 2s ease-in-out infinite}@keyframes zoomShake{0%{transform:scale(1)}25%{transform:scale(1.2)}50%{transform:scale(1.2) translate(3px)}75%{transform:scale(1.2) translate(-3px)}to{transform:scale(1)}}@keyframes colorChange{0%{background-color:#fff}50%{background-color:#007b9a}to{background-color:#333}}.cursor{cursor:pointer;transition:background-color .2s ease}.hexagon{width:100px;height:55px;position:relative;display:flex;justify-content:center;align-items:center;background-color:#fff}.hexagon:after,.hexagon:before{content:"";position:absolute;width:0;border-left:50px solid transparent;border-right:50px solid transparent}.hexagon:before{bottom:100%;border-bottom:27.5px solid #fff}.hexagon:after{top:100%;border-top:27.5px solid #fff}.hexagon:after,.hexagon:before{left:0;right:0}.hexagon-inner{width:100%;height:100%;text-align:center;display:flex;justify-content:center;align-items:center}