@import"https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Roboto,sans-serif;background:linear-gradient(to right,#00b4db,#0083b0);color:#333;line-height:1.6}.container{max-width:1000px;padding:20px;margin:0 auto;text-align:center}h1{font-size:3rem;color:#fff}input{padding:10px;border-radius:20px 0 0 20px;border:none;width:60%;max-width:300px;outline:none;margin-top:30px}button{background-color:#ff9800;border:0;padding:10px;border-radius:0 20px 20px 0;cursor:pointer;color:#fff;font-weight:700}button:hover{background-color:#f57c00}.weather-container{background-color:#fffc;border-radius:10px;padding:20px;margin:20px 0}h2{font-size:2rem}.weather-info{display:flex;align-items:center;justify-content:center}.weather-info img{width:100px}.temperature{font-weight:700;font-size:2.5rem}.description{text-transform:capitalize;font-size:1.3rem;margin-bottom:10px}.details{display:flex;justify-content:space-evenly}.weather-container{background-color:#fffc;border-radius:10px}.weather-container h3{font-size:1.5rem;margin-bottom:15px}.weather-list{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}.weather-item{text-align:center;background-color:#ffffffb3;border-radius:10px;padding:10px}.forecast-day,.forecast-description{text-transform:capitalize;font-size:1.1rem}
