.button-icon{cursor:pointer;box-sizing:border-box;border:3px solid #fff;border-radius:10px;width:fit-content;height:46px;display:flex;overflow:hidden}.icon{background-color:#fff;justify-content:center;align-items:center;height:100%;padding:0 10px;display:flex}.icon svg{width:25px;height:25px}.cube{transform-style:preserve-3d;width:200px;height:100%;transition:all .4s}.button-icon:hover{border-color:#fff}.button-icon:hover .cube{transform:rotateX(90deg)}.side{text-transform:uppercase;letter-spacing:.5px;justify-content:center;align-items:center;width:200px;height:100%;font-size:.8em;font-weight:700;display:flex;position:absolute}.top{color:#fff;background:#000;transform:rotateX(-90deg)translateZ(20px)}.front{color:#fff;background:#222229;transform:translateZ(20px)}@media (max-width:768px){.button-icon{transform-origin:100% 0;transform:scale(.75)}}