.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion: no-preference){.App-logo{animation:App-logo-spin infinite 20s linear}}.App-header{background-color:#282c34;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:calc(10px + 2vmin);color:#fff}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}button{font-size:calc(10px + 2vmin)}.card{background-color:#ffffffc8;width:20rem;margin:2.5rem 1rem 1rem;border-radius:18px;padding:1rem;display:flex;flex-direction:column;align-items:center;transition:.7s;height:14rem}.card:hover{transform:translateY(-3px)}.close-btn{background-color:#2d3047;border:none;height:2rem;width:2rem;border-radius:6px;margin-left:auto;margin-right:1rem;cursor:pointer;color:#fff;font-weight:500;font-size:18px;padding:1px}.container-bottom{display:flex;gap:1rem;padding-left:2.5rem;padding-right:2.5rem;border-radius:12px;margin-top:3rem}.temp-min,.temp-max{padding-right:1rem;padding-left:1rem;background-color:#5c6392;border-radius:12px;font-size:12px;font-weight:100;min-width:3.5rem;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff}.title{font-size:40px;text-decoration:none;color:#2d3047;margin-bottom:0}.card-title{text-decoration:none}@media screen and (max-width: 400px){.card{width:15rem;align-items:center;height:9.5rem}.temp-min,.temp-max{height:4.5rem}.container-bottom{margin-top:1.7rem}.temps{margin:0 0 1rem;padding-bottom:.5rem}.title{font-size:34px;margin-top:1.2rem}.temps-m{padding-top:.5rem}}.cards{display:flex;flex-wrap:wrap;align-items:center;justify-content:center}.input{margin-left:auto;margin:1rem}.header{display:flex}.container-header{width:100%;display:flex}.icon-github{height:4rem;padding:2rem;cursor:pointer}.box{display:flex;justify-content:center;align-items:center;width:30%;margin:2rem;margin-left:auto;border:none;background-color:#ffffffda;border-radius:20px}.submit{height:35px;width:10%;border-radius:10px;border:none;margin-top:2rem;margin-bottom:2rem;font-size:12px;cursor:pointer;background-color:#2d3047;color:#fff;font-weight:600;transition:1.5s;outline:none}.submit:hover{color:#fff;box-shadow:1px 2px 4px -1px #2d3047}.input{border-radius:10px;border:none;height:2rem;width:70%;padding:3px 3px 3px 8px;transition:1s;background-color:#2d3047;color:#fff}.input:focus,.input:hover{outline:none;box-shadow:1px 2px 8px -1px #2d3047}@media screen and (max-width: 700px){.box{border-radius:8px;width:75%;height:12vh}.input{height:5vh;border-radius:6px;width:100%}.submit{width:25%;margin-right:1rem;height:6vh;border-radius:6px}}.city{display:flex;justify-content:center;align-items:center;cursor:default;margin-bottom:1rem;width:auto}.container-city{background-color:#ffffffc5;width:35%;flex-direction:column;display:flex;justify-content:center;align-items:center;border-radius:28px;transition:1s}.return{margin:1.5rem;margin-right:auto;margin-bottom:0}.return-btn{background-color:#2d3047;color:#fff;border:none;border-radius:8px;min-height:2rem;font-size:18px;width:3rem;transition:1s}.return-btn:hover{cursor:pointer;transform:translateY(-2px)}.container:hover{transform:translateY(-3px)}.container-temp{display:flex;gap:1.5rem}.container-bottom-city{display:flex;gap:1rem;margin:1rem;margin-top:0}.title-city{position:relative;font-size:28px;margin-bottom:1rem;margin-top:0;transition:1s;color:#2d3047}.title-city:hover{color:#2d3047}.temp-exact{transition:.2s;cursor:default;background-color:#161c4dad;padding:.3rem;border-radius:8px;color:#fff}.temp-exact:hover{transform:translateY(-1px)}.wind-box,.lat-box{background-color:#2d3047be;color:#fff;font-weight:700;font-size:14px;border-radius:50%;min-width:9rem;min-height:9rem;margin:1rem;padding:.5rem;display:flex;justify-content:center;flex-direction:column;align-items:center;gap:0}@media screen and (max-width: 700px){.container-city{width:18rem;height:70vh}.wind-box,.lat-box{min-width:3.5rem;min-height:3.5rem;margin:0;margin-bottom:1rem;border-radius:10px}.wind-box p,.lat-box p{margin:.2rem;font-size:12px}.container-temp{gap:1rem;font-size:14px;margin:5px 5px 0}.return-btn{margin-top:.5rem;width:3rem;height:2rem}}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{background-color:#2d3047}
