.redWrap {
width:100vw;
height:100vh;
oerflow:hidden;
background-color:rgba(0,0,0,0.27);
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}
.redPacker {
outline: 0;
-web-kit-appearance: none;
-moz-appearance: none;
border: none;
width:310px;
height:395px;
background-color:transparent;
animation:redPacket 0.8s linear;
background-image:url('');
background-size:cover;
background-repeat:no-repeat;
background-position:center;
}
@keyframes redPacket {
0% {
transform:rotateY(720deg) scale(0.4);
}
50% {
transform:rotateY(360deg) scale(0.6);
}
100% {
transform:rotateY(0deg) scale(1);
}
}
|