.turning[data-v-26d5a8a9]{--background:linear-gradient(135deg,#56f9c8,#396ffa);--shadow:rgba(39,94,254,.28);--text:#6c7486;--page:hsla(0,0%,100%,.36);--page-fold:hsla(0,0%,100%,.52);--duration:3s;height:70px;position:relative;width:100px}.turning[data-v-26d5a8a9]:after,.turning[data-v-26d5a8a9]:before{--r:-6deg;bottom:10px;box-shadow:0 16px 10px var(--shadow);content:"";position:absolute;top:80%;transform:rotate(var(--r));width:110px}.turning[data-v-26d5a8a9]:before{left:4px}.turning[data-v-26d5a8a9]:after{--r:6deg;right:4px}.turning div[data-v-26d5a8a9]{background-image:var(--background);border-radius:6px;box-shadow:0 2px 5px var(--shadow);height:100%;perspective:600px;position:relative;width:100%;z-index:1}.turning div ul[data-v-26d5a8a9]{list-style:none;margin:0;padding:0;position:relative}.turning div ul li[data-v-26d5a8a9]{--r:180deg;--o:0;--c:var(--page);animation:var(--duration) ease infinite;color:var(--c);left:5px;opacity:var(--o);position:absolute;top:5px;transform:rotateY(var(--r));transform-origin:100% 50%}.turning div ul li[data-v-26d5a8a9]:nth-child(2){--c:var(--page-fold);animation-name:page-2-26d5a8a9}.turning div ul li[data-v-26d5a8a9]:nth-child(3){--c:var(--page-fold);animation-name:page-3-26d5a8a9}.turning div ul li[data-v-26d5a8a9]:nth-child(4){--c:var(--page-fold);animation-name:page-4-26d5a8a9}.turning div ul li[data-v-26d5a8a9]:nth-child(5){--c:var(--page-fold);animation-name:page-5-26d5a8a9}.turning div ul li svg[data-v-26d5a8a9]{display:block;height:60px;width:45px}.turning div ul li[data-v-26d5a8a9]:first-child{--r:0deg;--o:1}.turning div ul li[data-v-26d5a8a9]:last-child{--o:1}.turning span[data-v-26d5a8a9]{color:var(--text);display:block;left:0;margin-top:15px;right:0;text-align:center;top:100%}@keyframes page-2-26d5a8a9{0%{opacity:0;transform:rotateY(180deg)}20%{opacity:1}35%,to{opacity:0}50%,to{transform:rotateY(0)}}@keyframes page-3-26d5a8a9{15%{opacity:0;transform:rotateY(180deg)}35%{opacity:1}50%,to{opacity:0}65%,to{transform:rotateY(0)}}@keyframes page-4-26d5a8a9{30%{opacity:0;transform:rotateY(180deg)}50%{opacity:1}65%,to{opacity:0}80%,to{transform:rotateY(0)}}@keyframes page-5-26d5a8a9{45%{opacity:0;transform:rotateY(180deg)}65%{opacity:1}80%,to{opacity:0}95%,to{transform:rotateY(0)}}