li{
list-style-type:none;
z-index:1
}
li:nth-child(1) p{left:405px}
li:nth-child(2) p{left:145px}
li:nth-child(3) p{left:665px}
.pro{
position:absolute;top:540px;
max-width:175px;
border:solid 1px;
border-radius:50%;
box-shadow:0 12px 20px rgba(0,0,0,.8);
cursor:pointer;
animation:scale .5s linear;
transform-origin:50% 50%;
animation-fill-mode:forwards;
z-index:9
}
.pro:hover{
width:175px;height:175px;
box-shadow:0 12px 20px rgba(0,0,0,.8);
animation:circle .7s linear;
transform-origin:50% 50%;
animation-fill-mode:forwards;
z-index:9
}
@keyframes circle{
0%{
transform:scale(1) rotate(0deg)
}
100%{
transform:scale(1.1) rotate(360deg)
}
}
@keyframes scale{
0%{
transform:scale(1.1)
}
100%{
transform:scale(1)
}
}