body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{text-align:center}.App-logo{pointer-events:none;height:40vmin}@media (prefers-reduced-motion:no-preference){.App-logo{animation:20s linear infinite App-logo-spin}}.App-header{color:#fff;background-color:#282c34;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;font-size:calc(10px + 2vmin);display:flex}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.main-content{flex-direction:column;align-items:center;height:100vh;margin-top:90px;display:flex}.footer{bottom:0}nav{background-color:#ae8a58;justify-content:space-between;width:100%;padding:8px;display:none;position:fixed;top:0;left:0}.login-field{flex-direction:row;align-items:center;gap:8px;height:fit-content;display:flex}.login-field p{font-size:large;font-weight:700}*{box-sizing:border-box;margin:0;padding:0}html{background-image:url(/ReactSavory-/assets/teste1-CyWJKvTQ.jpg);background-size:150px}body{color:#f7f7f7;background-color:#000}h1{text-align:center;padding:20px;font-family:Bakbak One;font-size:24px;font-style:normal;font-weight:400;line-height:normal}h4{text-align:center;color:#fff;padding:10px;font-family:Roboto,sans-serif;font-size:10px}.card{width:200px;height:300px;transform-style:preserve-3d;background-color:#450808;background-image:url(/ReactSavory-/assets/tes-BoY7NZw3.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;border-radius:27px;flex-direction:column;justify-content:center;align-items:center;padding:20px;transition:transform .5s,box-shadow .5s,margin-right .5s;display:flex;position:relative;box-shadow:0 0 10px #00000040}.card:hover{margin-right:40px;transform:translate(50px)rotateY(180deg);box-shadow:50px 0 40px #0003}.card:hover h4{display:none}.card:not(:hover){animation:.5s voltar}@keyframes voltar{0%{transform:translate(50px)rotateY(180deg)}to{transform:translate(20px)rotateY(0)}}.cardButton{color:#fff;cursor:pointer;opacity:0;background-color:#7c7b6a;background-image:url(/ReactSavory-/assets/test-B3jb5uER.png);background-position:50%;background-repeat:no-repeat;background-size:52px;border:none;border-radius:20px;margin:4px;padding:22px;font-size:16px;transition:opacity .5s;animation:2s infinite pulo;position:absolute;top:83%;left:50%;transform:translate(-50%,-50%)}@keyframes pulo{0%{transform:translate(-50%,-50%)scale(1)}50%{transform:translate(-50%,-50%)scale(1.2)}to{transform:translate(-50%,-50%)scale(1)}}.modal{background-color:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background-color:#450808;border:1px solid #ddd;border-radius:10px;width:79%;height:85%;padding:88px}.modal-content h2{margin-top:0}.modal-content button{color:#fff;cursor:pointer;background:#b3ae68;border-radius:8px;margin:4px;padding:9px;font-size:16px;position:absolute;top:83%;left:48%;transform:translate(-50%,-50%)}.modal-content button:hover{cursor:pointer;opacity:0;background-color:#6b0000;background-image:url(/ReactSavory-/assets/test-B3jb5uER.png);background-position:50%;background-repeat:no-repeat;background-size:52px;margin:4px;padding:22px;font-size:16px;transition:opacity .5s;animation:2s infinite pulo}.card:hover .cardButton{opacity:1;opacity:1}.card:hover.cardImage{transform:scale(1.1)translateY(-80px)}.cardImage{object-fit:cover;perspective:1000px;border-radius:50%;width:150px;height:150px;margin-bottom:20px;transition:transform .5s ease-in-out;overflow:hidden}.cardImage img{object-fit:cover;border-radius:50%;width:100%;height:100%;transition:transform .5s ease-in-out}.cardImage:active img{transform:rotateX(90deg)translateY(-10px)translate(10px)}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(100deg)}}@keyframes stopRotate{0%{transform:rotate(180deg)}to{transform:rotate(0)}}.cardImage:hover{animation:2s linear infinite rotate}.cardImage.clicked{animation:.5s forwards stopRotate}.cardContainer{flex-wrap:wrap;justify-content:center;gap:20px;padding:2px;display:flex}.form-container{background-color:#0000;border-radius:20px;justify-content:center;align-items:center;height:80vh;padding:40px;display:flex;position:relative}.card-wrapper{perspective:1000px}.animated-card{width:300px;height:200px;transform-style:preserve-3d;transition:transform .1s;position:relative;transform:rotateY(0)}.animated-card:hover{transform:rotateY(180deg)}.card-inner{backface-visibility:hidden;text-align:center;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute}.card-inner.front{background-color:#450808;background-image:url(/ReactSavory-/assets/test-B3jb5uER.png);background-position:50%;background-repeat:no-repeat;background-size:150px;border-radius:20px;transition:all .3s ease-in-out;animation:2s infinite pulando;box-shadow:0 4px 8px #0000001a}@keyframes pulando{0%{transform:translateY(0)}50%{transform:translateY(-20px)}to{transform:translateY(0)}}.card-inner.front:hover{background-color:#5c0011;transform:scale(1.05);box-shadow:0 8px 16px #0003}.card-inner.front:before{content:"";background-image:url(https://i.pinimg.com/564x/16/38/ac/1638ac8….jpg);background-size:cover;border-radius:50%;width:50px;height:50px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-inner.front:hover:before{transform:scale(1)}.card-inner.back{background-color:#b3ae68;border-radius:20px;transform:rotateY(180deg);box-shadow:0 4px 8px #0000001a}.login-form{z-index:1;background-color:#ca9e4b;border-radius:16px;flex-direction:column;gap:16px;width:100%;max-width:400px;padding:40px;display:flex;position:relative;box-shadow:0 4px 8px #0000001a}.form-input{color:#5c5c54;border:1px solid #666;border-radius:12px;padding:10px;font-size:16px}input:focus{background-color:#f2f2ad;border:2px solid #666;outline:none}.submit-button{color:#fff;cursor:pointer;background-color:#5c5c54;border:none;border-radius:20px;padding:10px;font-size:16px;transition:background-color .3s}.submit-button:hover{background-color:#450808}.hero-header{background-color:#6b0000;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:0;display:flex}.hero-search{align-items:center;display:flex}.hero-search-label{color:#fff;margin-right:10px;font-size:18px}.hero-search-input{color:#450808;cursor:pointer;background-color:#fff;border:none;border-radius:5px;margin-left:10px;padding:10px 20px;font-size:16px;transition:all .3s ease-in-out}.hero-search-input:hover{color:#8b0a1a;background-color:#f2f2f2;transform:scale(1.05);box-shadow:0 0 10px #0000001a}label{color:#fff;margin-right:10px;font-size:18px}select{color:#5c5c54;background-color:#e9d8a5;border:none;border-radius:5px;width:200px;padding:10px}select option{color:#000101;border:none;border-radius:5px;width:200px;padding:10px}.hero-search-button{color:#450808;cursor:pointer;background-color:#fff;border:none;border-radius:5px;margin-left:10px;padding:10px 20px;font-size:16px}.hero-title{color:#fff;margin:0 20px 0 0;font-size:24px}.hero-input-field{margin-left:auto}.hero-recipes{width:100%;margin-top:20px}