@import"https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Outfit&family=Poppins:ital,wght@0,400;1,700&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}.app{min-height:100vh;display:grid;background-color:#e2d4ff}body{background-color:#e2d4ff}.weather{place-self:center;padding:40px;border-radius:10px;background-image:linear-gradient(45deg,#2f4680,#500ae4);display:flex;flex-direction:column;align-items:center}.search-bar{display:flex;align-items:center;gap:7px}.search-bar input{height:50px;border:none;outline:none;border-radius:40px;padding-left:25px;background-color:#ebfffc;color:#626262;font-size:18px}.search-bar img{width:48px;padding:15px;border-radius:50%;background-color:#ebfffc;color:#fff;cursor:pointer;outline:none}.weather-icon{width:150px;margin:30px 0}.temperature{color:#fff;font-size:80px;line-height:1}.city{color:#fff;font-size:40px}.weather-data{width:100%;margin-top:40px;color:#fff;display:flex;justify-content:space-between;gap:25px}.weather-data .col{display:flex;align-items:flex-start;gap:5px;font-size:22px}.weather-data .col img{width:56px}.weather-data .col span{display:block;font-size:16px}@media(max-width:500px){.weather{max-width:90vw}.weather-data{margin-right:20px;gap:10px}.weather-data .col img{width:35px}.search-bar input{height:40px;font-size:14px;width:90%}.search-bar img{width:40px}.search-bar{gap:2px}}