@acrool/react-flip-countdown/dist/react-flip-countdown.css

Flip countdown library based for Reactjs

@keyframes acrool-react-flip-countdown__animated-card-module__fold{0%{transform:rotateX(0)}to{transform:rotateX(-180deg)}}@keyframes acrool-react-flip-countdown__animated-card-module__unfold{0%{transform:rotateX(180deg)}to{transform:rotateX(0)}}.acrool-react-flip-countdown__animated-card-module__root{display:flex;justify-content:center;position:absolute;left:0;width:100%;height:50%;overflow:hidden;backface-visibility:hidden;transform-style:preserve-3d}.acrool-react-flip-countdown__animated-card-module__fold{top:0;align-items:flex-end;transform-origin:50% 100%;transform:rotateX(0);background-color:#333;border-top-left-radius:3px;border-top-right-radius:3px;border-bottom:.5px solid #333;animation:acrool-react-flip-countdown__animated-card-module__fold .6s cubic-bezier(.455,.03,.515,.955) forwards}.acrool-react-flip-countdown__animated-card-module__fold .acrool-react-flip-countdown__animated-card-module__digit{transform:translateY(50%)}.acrool-react-flip-countdown__animated-card-module__unfold{top:50%;align-items:flex-start;transform-origin:50% 0;transform:rotateX(180deg);background-color:#333;border-bottom-left-radius:3px;border-bottom-right-radius:3px;border-top:.5px solid #333;animation:acrool-react-flip-countdown__animated-card-module__unfold .6s cubic-bezier(.455,.03,.515,.955) forwards}.acrool-react-flip-countdown__animated-card-module__unfold .acrool-react-flip-countdown__animated-card-module__digit{transform:translateY(-50%)}.acrool-react-flip-countdown__animated-card-module__paused{animation-play-state:paused}.acrool-react-flip-countdown__animated-card-module__digit{font-size:25px;font-weight:700;color:rgba(255,255,255,.7)}.acrool-react-flip-countdown__static-card-module__root{display:flex;position:relative;justify-content:center;width:100%;height:50%;overflow:hidden;border:1px solid transparent}.acrool-react-flip-countdown__static-card-module__root>span{font-size:25px;font-weight:700;color:rgba(255,255,255,.7);padding:0 2px}.acrool-react-flip-countdown__static-card-module__upperCard{align-items:flex-end;border-bottom:.5px solid #333;border-top-left-radius:3px;border-top-right-radius:3px}.acrool-react-flip-countdown__static-card-module__upperCard>span{transform:translateY(50%)}.acrool-react-flip-countdown__static-card-module__lowerCard{align-items:flex-start;border-top:.5px solid #333;border-bottom-left-radius:3px;border-bottom-right-radius:3px}.acrool-react-flip-countdown__static-card-module__lowerCard>span{transform:translateY(-50%)}.acrool-react-flip-countdown__flip-unit-container-module__root{display:flex}.acrool-react-flip-countdown__flip-unit-container-module__container{display:block;position:relative;perspective-origin:50% 50%;perspective:300px;background-color:#333;border-radius:3px;box-shadow:0 10px 10px -10px gray;margin:0 5px}.acrool-react-flip-countdown__index-module__root *,.acrool-react-flip-countdown__index-module__root *:before,.acrool-react-flip-countdown__index-module__root *:after{box-sizing:border-box;-webkit-box-sizing:border-box;line-height:normal}.acrool-react-flip-countdown__index-module__root{display:flex;flex-direction:column;justify-content:center;align-items:center;width:200px}.acrool-react-flip-countdown__index-module__title{display:flex;justify-content:center;align-items:center;width:100%;margin-bottom:10px}.acrool-react-flip-countdown__index-module__unit{flex:1;font-size:12px;text-align:center}.acrool-react-flip-countdown__index-module__value{display:flex;justify-content:center;align-items:center;width:100%;height:44px;overflow:hidden;background-color:#222}.acrool-react-flip-countdown__index-module__semicolon{color:rgba(255,255,255,.7);font-size:14px;font-weight:700}