*{box-sizing:border-box;margin:0;padding:0}html{font-size:62.5%}body{height:100vh;min-height:80rem;background-color:gray;background-image:url(wallpaperflare.com_wallpaper.a4b1903a.jpg);background-position:50% 0;background-size:cover;justify-content:center;align-items:center;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;display:flex}.header-section{position:absolute;top:1.5rem;right:1rem}.container{max-width:120rem;margin:0 auto}.city-search{text-transform:capitalize;color:#fff;background-color:#555;border:none;border-radius:.5rem;padding:.5rem 1rem;font-size:1.7rem}.city-search:focus{outline:none;box-shadow:0 0 10px 1px #aaa}.city-search::-webkit-input-placeholder{color:#eee}.city-search::-moz-placeholder{color:#eee}.city-search:-ms-input-placeholder{color:#eee}.city-search::placeholder{color:#eee}.weather-brief__box{flex-direction:column;align-items:center;gap:.4rem;padding-bottom:3rem;display:flex}.brief-heading{color:#fff;margin-bottom:-.5rem;font-size:2.8rem}.brief-deg{color:#fff;font-size:3.8rem}.brief-state{color:#fff;font-size:1.8rem}.brief__high-low{color:#fff;font-size:1.7rem}.grid-item{background-color:#00000070;border-radius:1rem;padding:1.2rem 1rem}.weather-hourly__container{-ms-grid-column:1;-ms-grid-column-span:4;grid-column:1/5}.weather-daily__container{-ms-grid-column:1;-ms-grid-column-span:2;-ms-grid-row:2;-ms-grid-row-span:3;grid-area:2/1/5/3}.weather-map__container{-ms-grid-column:5;-ms-grid-column-span:2;-ms-grid-row:1;-ms-grid-row-span:3;grid-area:1/5/4/7}.weather-card__hourly{flex-direction:column;align-items:center;gap:1rem;display:flex}.weather-hourly__icons{width:2.4rem;height:2.4rem;color:#fff}.weather-daily__cards{padding-top:1rem}.weather-card__daily{border-bottom:1px solid #aaa;padding:1rem 0}.weather-card__daily p{font-size:1.7rem;font-weight:600}.weekday{width:5rem;font-size:1.4rem}.weekday-temp__min{align-items:center;display:flex}.weekday-temp__min:after{content:"";width:8rem;height:.4rem;background:linear-gradient(90deg,#020024 0%,#228be6 0%,#fc4646 100%,#fa5252 100%);border-radius:.5rem;margin:0 1rem;display:inline-block}.weather-card__daily p ion-icon{padding-right:5rem}.weather-card__daily:nth-child(1){border-top:1px solid #aaa}.weather-card__daily:nth-child(10){border-bottom:#0000}.weather-uv__card div{height:.4rem;background:linear-gradient(90deg,#020024 0%,#51cf66 0%,#ffd43b 25%,#ffa94d 50%,#f03e3e 75%,#da77f2 100%);border-radius:.5rem;margin:1.5rem 0 1.3rem;display:block;position:relative}.weather-uv__card div p{width:.4rem;height:.4rem;background-color:#fff;border:.5px solid #000;position:absolute;top:50%;left:50%;transform:translateY(-50%)}.weather-uv__card p:last-child{margin-top:auto}.weather-precipitation__card p:last-child,.weather-realfeel__card p:last-child,.weather-humidity__card p:last-child,.weather-visibility__card p:last-child,.weather-sunstate__card p:last-child,.weather-winddirect__card p:last-child,.weather-pressure__card p:last-child{max-width:13rem;margin-top:auto}.weather-wind__compass{max-width:10rem;width:100%;max-height:10rem;height:100%;background-color:#0000;border:.5rem solid #222;border-radius:100%;margin:0 auto;display:block;position:relative}.wind-direction{color:#aaa;width:1.3rem;text-transform:uppercase;justify-content:center;align-items:center;font-size:1.1rem;display:flex;position:absolute}.wind-direction.north{top:.2rem;left:50%;transform:translate(-50%)}.wind-direction.east{top:50%;right:.2rem;transform:translateY(-50%)}.wind-direction.south{bottom:.2rem;left:50%;transform:translate(-50%)}.wind-direction.west{top:50%;left:.2rem;transform:translateY(-50%)}.wind-direction__indicator{min-width:9rem;height:.2rem;z-index:999;background:linear-gradient(90deg,#ccc 9%,#0000 10% 84%,#fff 85%);border-radius:.5rem;display:block;position:absolute;top:50%;left:0;transform:translateY(-50%)}.wind-current_speed{color:#fff;flex-direction:column;align-items:center;font-size:1.7rem;font-weight:700;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.wind-kmh{margin-top:-.2rem;font-size:1.1rem}.weather-wind__compass ion-icon:nth-child(2),.weather-wind__compass ion-icon:nth-child(3),.weather-wind__compass ion-icon:nth-child(4),.weather-wind__compass ion-icon:nth-child(5){width:1.1rem;height:1.1rem;color:#bbb;position:absolute;top:-9%;left:50%;transform:translate(-50%)}.weather-wind__compass ion-icon:nth-child(3){top:unset;bottom:-9%}.weather-wind__compass ion-icon:nth-child(4){top:50%;left:-9%;transform:translateY(-50%)}.weather-wind__compass ion-icon:nth-child(5){left:unset;top:50%;right:-9%;transform:translateY(-50%)}.map-tiles{-webkit-filter:brightness(.6)invert()contrast(3)hue-rotate(200deg)saturate(.3)brightness(.7);filter:brightness(.6)invert()contrast(3)hue-rotate(200deg)saturate(.3)brightness(.7)}.marker-color{-webkit-filter:saturate(.2);filter:saturate(.2)}.leaflet-bar a{color:#fff;background-color:#000}.leaflet-bar a:hover{background-color:red}.leaflet-container .leaflet-control-attribution{background-color:#000}.leaflet-bar a.leaflet-disabled{background-color:#555}
/*# sourceMappingURL=index.007638f2.css.map */