@import"https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&family=Quicksand:wght@300..700&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Outfit,sans-serif}.app{min-height:100vh;display:grid;background:#b2dbb2}.weather{place-self:center;padding:35px;border-radius:10px;background:linear-gradient(45deg,#47618a99,#0d538899);display:flex;flex-direction:column;align-items:center}.search-bar{display:flex;align-items:center;gap:12px}.search-bar input{height:40px;border:none;outline:none;border-radius:40px;padding-left:25px;color:#626262;background:#ebfffc;font-size:18px}.search-bar img{width:40px;padding:13px;border-radius:50%;background:#ebfffc;cursor:pointer}.weather-icon{width:120px;margin-top:30px}.temperature{color:#fff;font-size:50px;line-height:1}.location{color:#fff;font-size:30px}.weather-data{width:100%;margin-top:40px;color:#fff;display:flex;justify-content:center;gap:60px}.weather-data .stats{display:flex;flex-direction:column;gap:20px}.weather-data .col{display:flex;align-items:flex-start;gap:14px;font-size:14px}.weather-data .col span{display:block;font-size:12px}.weather-data .col img{width:26px;margin-top:6px}.weather-data .rec{display:flex;flex-direction:column;gap:10px}.weather-data .rec .header{font-size:25px;font-weight:700}.weather-data .rec p{font-size:12px}.forecast-data{width:100%;margin-top:40px;color:#fff;display:flex;justify-content:space-between}.forecast-data .day{display:flex;flex-direction:column;align-items:center;gap:12px;padding:12px;font-size:22px;box-shadow:0 2px 6px #0003;margin:8px}.forecast-data .day span{display:block;font-size:16px}.forecast-data .day img{width:40px;margin-top:10px}.forecast-data .day .temp{font-size:15px;margin-top:10px}