@import url(https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@300&display=swap);html{font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif}*{margin:0;padding:0;box-sizing:border-box}.App{height:100vh;width:100%;transition:all .8s cubic-bezier(1,.01,0,1)}.header{text-align:center;font-family:"Roboto Mono",monospace;padding-top:25px}.subtitle{font-size:small;color:#5b5b5b}.dark-mode-toggle{margin-top:25px}.cards-container{margin:10px auto 0;width:75%;display:flex;align-items:center;justify-content:center;flex:1 1;flex-wrap:wrap}.card{width:31.33%;height:180px;padding:0;margin:1%;border-radius:50px;box-sizing:border-box;overflow:hidden;cursor:pointer}.card *{transition:all .3s ease}.card img{margin:0;width:100%;height:120px;object-fit:cover;display:block;max-width:100%;max-height:100%}.card h3{margin:0;padding:12px 12px 48px;line-height:32px;font-weight:500;font-size:20px}.card .focus-content{display:block;padding:8px 12px}.card p{margin:0;line-height:1.5;color:#5b5b5b}.card:hover{background-color:rgba(0,0,0,.05)}.card:focus-within img,.card:hover img{margin-top:-80px}.card:focus-within h3,.card:hover h3{padding:8px 12px 0}@media only screen and (max-width:600px){.card{width:100%}}
/*# sourceMappingURL=main.d8bf4b37.chunk.css.map */