#app{font-family:Avenir,Helvetica,Arial,sans-serif;text-align:center}*{margin:0;padding:0;box-sizing:border-box}body{height:100%;background:#ccc;justify-content:center;align-items:center}.board,body{display:flex}.board{width:640px;height:640px;margin:auto;flex-wrap:wrap;perspective:1000px}@media screen and (max-width:768px){.board{width:420px;height:420px}}.card{width:calc(25% - 20px);height:calc(33% - 20px);margin:10px;position:relative;transform:scale(1);transform-style:preserve-3d;transition:transform .5s;border-radius:10px;box-shadow:2.25px 2.25px 2.25px rgba(0,0,0,.2)}@media screen and (max-width:768px){.card{width:calc(25% - 10px);height:calc(33% - 10px);margin:5px}}.card:hover{transform:scale(1.1);transition:transform .3s}.card.flip{transform:rotateY(180deg)}.back,.front{width:100%;height:100%;padding:10px;position:absolute;background:#fff;backface-visibility:hidden;border-radius:10px}.front{transform:rotateY(180deg)}.pokeball{margin:35px 10px;height:100px;width:100px;border:6px solid #383b4f;border-radius:50%;background-image:linear-gradient(#f51939 50px,#fff 0);position:relative;backface-visibility:hidden;display:block}@media screen and (max-width:768px){.pokeball{margin:15px 0;height:80px;width:80px;border:4px solid #383b4f;background-image:linear-gradient(#f51939 40px,#fff 0)}}.pokeball:before{position:absolute;content:"";height:6px;width:94px;background-color:#383b4f;top:44px;left:0}@media screen and (max-width:768px){.pokeball:before{height:6px;width:74px;top:36px;left:0;height:4px}}.pokeball:after{position:absolute;content:"";height:38px;width:38px;background-image:radial-gradient(#fff 0,#fff 3px,#383b4f 0,#383b4f 7px,#fff 0,#fff 16px,#383b4f 0);border-radius:50%;top:27px;left:27px}@media screen and (max-width:768px){.pokeball:after{top:22px;left:22px;height:29px;width:29px;background-image:radial-gradient(#fff 0,#fff 3px,#383b4f 0,#383b4f 7px,#fff 0,#fff 12px,#383b4f 0)}}.title{font-size:3rem}