@import url(https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600;700&display=swap);*{box-sizing:border-box;font-family:Open Sans,sans-serif;margin:0;padding:0}body{background:#e3f2fd}h1{background:#5372f0;color:#fff;font-size:1.75rem;padding:18px 0;text-align:center}.container{display:flex;gap:35px;padding:30px}.weather-input{width:550px}.weather-input input{border:1px solid #ccc;border-radius:4px;font-size:1.07rem;height:46px;margin:10px 0 20px;outline:none;padding:0 17px;width:100%}.weather-input input:focus{border:2px solid #5372f0;padding:0 16px}.weather-input .separator{align-items:center;background:#bbb;display:flex;height:1px;justify-content:center;margin:25px 0;width:100%}.weather-input .separator:before{background:#e3f2fd;color:#6c757d;content:"or";font-size:1.18rem;margin-top:-4px;padding:0 15px}.weather-input button{background:#5372f0;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:1rem;outline:none;padding:10px 0;transition:.2s ease;width:100%}.weather-input .search-btn:hover{background:#2c52ed}.weather-input .location-btn{background:#6c757d}.weather-input .location-btn:hover{background:#5c636a}.weather-data{width:100%}.weather-data .current-weather{background:#5372f0;border-radius:5px;color:#fff;display:flex;justify-content:space-between;padding:20px 70px 20px 20px}.current-weather h2{font-size:1.7rem;font-weight:700}.weather-data h6{font-size:1rem;font-weight:500;margin-top:12px}.current-weather .icon{text-align:center}.current-weather .icon img{margin-top:-15px;max-width:120px}.current-weather .icon h6{margin-top:-10px;text-transform:capitalize}.days-forecast h2{font-size:1.5rem;margin:20px 0}.days-forecast .weather-cards{display:flex;gap:20px}.weather-cards .card{background:#6c757d;border-radius:5px;color:#fff;list-style:none;padding:18px 16px;width:20%}.weather-cards .card h3{font-size:1.3rem;font-weight:600}.weather-cards .card img{margin:5px 0 -12px;max-width:70px}@media (max-width:1400px){.weather-data .current-weather{padding:20px}.weather-cards{flex-wrap:wrap}.weather-cards .card{width:calc(25% - 15px)}}@media (max-width:1200px){.weather-cards .card{width:calc(33.33333% - 15px)}}@media (max-width:950px){.weather-input{width:450px}.weather-cards .card{width:calc(50% - 10px)}}@media (max-width:750px){h1{font-size:1.45rem;padding:16px 0}.container{flex-wrap:wrap;padding:15px}.weather-input{width:100%}.weather-data h2{font-size:1.35rem}}
/*# sourceMappingURL=main.cac58b34.css.map*/