@import url(https://fonts.googleapis.com/css2?family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400&display=swap);@import url(https://fonts.googleapis.com/css2?family=Rajdhani:wght@300;400;500;600&family=Roboto+Condensed:ital,wght@0,300;0,400;0,700;1,300;1,400&display=swap);body{font-size:20px;margin:0}.App,body{height:100vh}.App{display:flex;width:100vw}.app-card-style{background-color:#14213d;background-image:linear-gradient(0deg,#14213d,#767474);max-width:500px;width:30%}.app-form-style{align-content:center;display:flex;flex-wrap:wrap;height:100vh;justify-content:center;width:100%}@media (max-width:550px){.app-card-style{background-color:initial;background-image:none}.App{flex-direction:column}}input,select::-webkit-inner-spin-button,select::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input,select{border:none;border-bottom:1px solid #8b9997;border-radius:4px;height:30px;width:100%}input,select:focus{outline:none}form,select{color:#8b9997;margin:0 auto;max-width:490px;width:100%}button{background-color:#001219;background-image:linear-gradient(270deg,#001219,#005f73 33%,#0a9396 66%,#94d2bd);background-size:300% 300%;border:0;border-radius:4px;color:#f5f5f5;height:30px;margin-top:16px;width:102%}@-webkit-keyframes colors{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}@keyframes colors{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}.botaoAnimado:hover{-webkit-animation:colors 2.5s ease normal;animation:colors 2.5s ease normal;cursor:pointer}.form-container{align-items:center;display:flex;font-family:Roboto Condensed,sans-serif;width:400px}.form-style{display:flex;flex-direction:column;text-transform:uppercase;width:100%}.form-style:focus{outline:none}.container-validade-cvc{align-content:center;display:flex;justify-content:space-between;width:100%}.slyte-validade-container{width:50%}select{height:33px;margin-right:6px;width:40%}.success-style{display:flex;flex-direction:column;height:100%;justify-content:center;width:100%}.img-form-style{height:180px;margin-left:41px;width:180px}.msg-success{color:#59726e;font-family:Roboto Condensed,sans-serif;right:100%;width:100%}@media (max-width:800px){.form-container{margin-bottom:30px;width:350px}}.flip-container{-webkit-perspective:1000;perspective:1000}.giro{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.back,.flip-container,.front{height:480px;width:320px}.flipper{left:100px;position:relative;top:66%;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;transition:.6s}.back,.front{-webkit-backface-visibility:hidden;backface-visibility:hidden;box-shadow:4px 4px 5px hsla(0,2%,8%,.5);position:fixed}.front{z-index:2}.back{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.front{background-color:#005f73;background-image:linear-gradient(270deg,#005f73,#608778);border-radius:8px;box-sizing:border-box;color:silver;font-family:Rajdhani,sans-serif;font-weight:500;height:200px;padding:15px;text-shadow:1px 1px 3px rgba(66,66,66,.5);width:350px}.bandeira-style-continer{display:flex;width:100%}.bandeiraSolida-style{background:#add8e6;border-radius:50%;height:40px;width:40px}.bandeiraTransparente-style{background-color:none;border:1px solid #fff;border-radius:50%;height:25px;margin-left:8px;margin-top:7px;width:25px}.style-numero-card{font-size:1.4em;letter-spacing:2px;margin:0 auto}.container-name-validade{align-items:center;display:flex;width:100%}.styles-nome-card{font-size:.9em;text-transform:uppercase;width:100%}.card-validade-style{display:flex;justify-content:center;width:100%}.back{background-color:silver;border-radius:8px;font-family:Rajdhani,sans-serif;font-weight:500;height:200px;width:350px}.tarja-style{background-color:#000;height:25%;margin-top:5%;width:100%}.style-cvc-card{background-color:#747474;border-radius:5px;box-sizing:border-box;height:18%;margin:0 auto 25px;padding-right:10px;text-align:end;width:80%}.cvc{color:#f0f8ff;padding:6px 0}span{align-items:center;color:#838383;display:block;font-size:10px;height:auto;margin:0 auto;width:165px}@media(max-width:1020px){.flipper{top:60px}}@media (min-height:400px) and (max-height:780px){.flipper{left:10px;position:relative;top:35%}.flip-container{height:200px;width:100%}.back{right:2px}}@media (max-width:800px){.flipper{top:40%}.flip-container{height:210px}}@media (max-width:600px){.flipper{top:20%}}
/*# sourceMappingURL=main.aa2b1d14.css.map*/