body,html{padding:0;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;background-image:-webkit-gradient(linear,left top,right top,from(#66b3ff),color-stop(#478de0),to(#2962c0));background-image:-moz-linear-gradient(left,#66b3ff,#478de0,#2962c0);background-image:linear-gradient(90deg,#66b3ff,#478de0,#2962c0)}a{color:inherit;text-decoration:none}span{position:relative;display:-moz-inline-box;display:inline-flex;width:180px;height:55px;margin:0 15px;perspective:1000px}span div{font-size:19px;letter-spacing:1px;transform-style:preserve-3d;-webkit-transform:translateZ(-25px);-moz-transform:translateZ(-25px);transform:translateZ(-25px);-webkit-transition:-webkit-transform .25s;transition:-webkit-transform .25s;-moz-transition:transform .25s,-moz-transform .25s;transition:transform .25s;transition:transform .25s,-webkit-transform .25s,-moz-transform .25s;font-family:Montserrat,sans-serif}span div:after,span div:before{position:absolute;content:"FLIP";height:55px;width:180px;display:-moz-box;display:flex;-moz-box-align:center;align-items:center;-moz-box-pack:center;justify-content:center;border:5px solid #000;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;border-radius:5px}span div:before{color:#fff;background:#000;-webkit-transform:rotateY(0deg) translateZ(25px);-moz-transform:rotateY(0deg) translateZ(25px);transform:rotateY(0deg) translateZ(25px)}span div:after{color:#000;-webkit-transform:rotateX(90deg) translateZ(25px);-moz-transform:rotateX(90deg) translateZ(25px);transform:rotateX(90deg) translateZ(25px)}span div:hover{-webkit-transform:translateZ(-25px) rotateX(-90deg);-moz-transform:translateZ(-25px) rotateX(-90deg);transform:translateZ(-25px) rotateX(-90deg)}*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.coin{display:-moz-box;display:flex;-moz-box-align:center;align-items:center;-moz-box-pack:center;justify-content:center;width:150px;height:150px;border:2px solid #000;border-radius:100px;margin:auto auto 1em;font-size:2em}.animate-coin{-webkit-animation:flip 4s 1;-moz-animation:flip 4s 1;animation:flip 4s 1}@-webkit-keyframes flip{0%{-webkit-transform:rotateY(0deg);transform:rotateY(0deg)}50%{-webkit-transform:rotateY(10turn);transform:rotateY(10turn)}to{-webkit-transform:rotateY(20turn);transform:rotateY(20turn)}}@-moz-keyframes flip{0%{-moz-transform:rotateY(0deg);transform:rotateY(0deg)}50%{-moz-transform:rotateY(10turn);transform:rotateY(10turn)}to{-moz-transform:rotateY(20turn);transform:rotateY(20turn)}}@keyframes flip{0%{-webkit-transform:rotateY(0deg);-moz-transform:rotateY(0deg);transform:rotateY(0deg)}50%{-webkit-transform:rotateY(10turn);-moz-transform:rotateY(10turn);transform:rotateY(10turn)}to{-webkit-transform:rotateY(20turn);-moz-transform:rotateY(20turn);transform:rotateY(20turn)}}