.pentagon-container{--radius:120px;--radius-max:200px;--width:240px;--height:120px;position:relative}@keyframes slowRotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.pentagon-container .wrapper{transition:transform .3s}.pentagon-container:hover .wrapper{animation:20s linear infinite slowRotate}.pentagon-item{width:var(--width);height:var(--height);margin-left:calc(var(--width)/-2);margin-top:calc(var(--height)/-2);justify-content:center;align-items:center;transition:transform .3s;display:flex;position:absolute;top:50%;left:50%}.wrapper .it1{transform:translate(calc(var(--radius)*cos(0deg)),calc(var(--radius)*sin(0deg)))rotate(90deg)}.pentagon-container:hover .wrapper .it1{transform:translate(calc(var(--radius-max)*cos(0deg)),calc(var(--radius-max)*sin(0deg)))rotate(90deg)}.wrapper .it2{transform:translate(calc(var(--radius)*cos(72deg)),calc(var(--radius)*sin(72deg)))rotate(162deg)}.pentagon-container:hover .wrapper .it2{transform:translate(calc(var(--radius-max)*cos(72deg)),calc(var(--radius-max)*sin(72deg)))rotate(162deg)}.wrapper .it3{transform:translate(calc(var(--radius)*cos(144deg)),calc(var(--radius)*sin(144deg)))rotate(234deg)}.pentagon-container:hover .wrapper .it3{transform:translate(calc(var(--radius-max)*cos(144deg)),calc(var(--radius-max)*sin(144deg)))rotate(234deg)}.wrapper .it4{transform:translate(calc(var(--radius)*cos(216deg)),calc(var(--radius)*sin(216deg)))rotate(306deg)}.pentagon-container:hover .wrapper .it4{transform:translate(calc(var(--radius-max)*cos(216deg)),calc(var(--radius-max)*sin(216deg)))rotate(306deg)}.wrapper .it5{transform:translate(calc(var(--radius)*cos(288deg)),calc(var(--radius)*sin(288deg)))rotate(378deg)}.pentagon-container:hover .wrapper .it5{transform:translate(calc(var(--radius-max)*cos(288deg)),calc(var(--radius-max)*sin(288deg)))rotate(378deg)}.pentagon-container .pentagon-desc{opacity:0;transition:opacity .3s}.pentagon-container:hover .pentagon-desc{opacity:1}