*{padding:0;margin:0;box-sizing:border-box}@font-face{font-family:BricolageGrotesque;src:url(/assets/BricolageGrotesque-VariableFont_opsz_wdth_wght-DcWnIxAz.ttf) format("truetype");font-weight:100 900;font-style:normal}@font-face{font-family:DMSansItalic;src:url(/assets/DMSans-Italic-VariableFont_opsz_wght-CT59GZwy.ttf) format("truetype");font-weight:100 900;font-style:italic}@font-face{font-family:DMsans;src:url(/assets/DMSans-VariableFont_opsz_wght-D_B5dL4R.ttf) format("truetype");font-weight:100 900;font-style:normal}:root{font-size:62.5%;--BricolageGrotesque: "BricolageGrotesque", sans-serif;--DMSansItalic: "DMSansItalic", sans-serif;--DMsans: "DMsans", sans-serif;--Neutral-900: hsl(243, 96%, 9%);--Neutral-800: hsl(243, 27%, 20%);--Neutral-700: hsl(243, 23%, 24%);--Neutral-600: hsl(243, 23%, 30%);--Neutral-300: hsl(240, 6%, 70%);--Neutral-200: hsl(250, 6%, 84%);--Neutral-0: hsl(0, 0%, 100%);--Orange-500: hsl(28, 100%, 52%);--Blue-500: hsl(233, 67%, 56%);--Blue-700: hsl(248, 70%, 36%)}body{background-color:var(--Neutral-900);color:var(--Neutral-0);min-height:100vh}.app__body{padding:1.6rem 1.6rem 0;min-height:100vh;position:relative;display:flex;flex-direction:column;max-width:121.6rem;margin-inline:auto}@media(min-width:45rem){.app__body{padding:2.4rem 2.4rem 0}}@media(min-width:75rem){.app__body{padding:0;margin-block:4.8rem 8rem}}li{list-style-type:none}a{text-decoration:none}img{display:block}button{cursor:pointer}.main__header{display:flex;width:100%}.main__nav{width:100%;display:flex;justify-content:space-between;position:relative}.main__logo{width:13.8rem}@media(min-width:45rem){.main__logo{width:19.7rem}}.unit__btn{width:8.9rem;height:3.3rem;background-color:var(--Neutral-800);padding:.8rem 1rem;color:var(--Neutral-0);display:flex;justify-content:space-between;align-items:center;border-radius:.6rem;border:1px solid #000}@media(min-width:45rem){.unit__btn{width:11.9rem;height:4.3rem;padding:1.2rem 1.6rem}}.unit__btn:hover{background-color:var(--Neutral-700)}.unit__btn--active,.unit__btn:focus{outline:none;border:2px solid var(--Neutral-0)}.unit__icon{width:1.4rem;height:1.4rem}@media(min-width:45rem){.unit__icon{width:1.6rem;height:1.6rem}}.unit__btn__text{font-family:var(--DMsans);font-size:1.4rem}@media(min-width:45rem){.unit__btn__text{font-size:1.6rem}}.icon__dropdown{width:.9rem;height:1.4rem}@media(min-width:45rem){.icon__dropdown{width:1.2rem;height:1.8rem}}.nav__dropdown{width:21.4rem;position:absolute;right:0;top:4.8rem;border-radius:1.2rem;padding:.6rem .8rem;border:1px solid var(--Neutral-600);background-color:var(--Neutral-800);display:none;flex-direction:column;gap:.4rem;font-family:var(--DMsans);z-index:999}.nav__dropdown--active{display:flex}.switch__btn{width:19.8rem;height:3.9rem;text-align:left;background-color:var(--Neutral-800);border:none;border-radius:.8rem;padding:1rem .8rem;color:var(--Neutral-0);font-size:1.6rem}.switch__btn:hover{background-color:var(--Neutral-700);border-radius:.8rem}.list__label{font-size:1.4rem;color:var(--Neutral-300);padding:.6rem .8rem 0;margin-block-end:.8rem;height:2.3rem;width:19.8rem}.line{border-block-end:1px solid var(--Neutral-600)}.nav__list__item{font-size:1.6rem;padding:1rem .8rem;margin-block-end:.4rem;width:19.8rem;height:3.9rem;display:flex;justify-content:space-between;align-items:center}.active__img{width:1.4rem;height:1.7rem;display:none}.nav__list__item--active{background-color:var(--Neutral-700);border-radius:.8rem}.nav__list__item--active>.active__img{display:block}.hero{margin:4.8rem auto;padding:0 1.4rem}@media(min-width:45rem){.hero{padding:0 11.4rem}}@media(min-width:75rem){.hero{margin-block:6.4rem}}.hero__text{font-family:var(--BricolageGrotesque);font-size:5.2rem;font-weight:700;text-align:center}.search__container{margin-block-end:3.2rem;position:relative;width:100%;margin-inline:auto}@media(min-width:45rem){.search__container{display:flex;align-items:center;gap:1.6rem;max-width:72rem}}@media(min-width:75rem){.search__container{margin-block-end:4.8rem;max-width:65.6rem}}.input__con{border-radius:1.2rem;background-color:var(--Neutral-800);height:5.6rem;margin-block-end:1.2rem;position:relative;width:100%}@media(min-width:45rem){.input__con{margin-block-end:0}}.search__icon{width:2rem;height:2rem;position:absolute;left:2.4rem;top:50%;transform:translateY(-50%)}.search__input{height:100%;width:100%;background-color:transparent;border:none;border-radius:inherit;padding:0 6.2rem;font-family:var(--DMsans);font-size:2rem;color:var(--Neutral-200)}::placeholder{font-size:2rem;color:var(--Neutral-200)}.search__input:focus{outline:none;border:2px solid var(--Neutral-0)}.search__suggestions{position:relative;border-radius:1.2rem;background-color:var(--Neutral-800);height:fit-content;width:100%;margin-block-end:1.2rem;border:1px solid var(--Neutral-700);padding:.8rem;z-index:9}@media(min-width:45rem){.search__suggestions{position:absolute;top:100%;left:0;margin-block-start:1rem;max-width:59rem}}.search__loading{width:100%;height:100%;display:flex;align-items:center;gap:1rem;padding:.8rem}.search__load__icon{width:1.6rem;height:1.9rem;animation:loaderspin 1.5s linear infinite}@media(prefers-reduced-motion:reduce){.search__load__icon{animation:none;transform:none}}@keyframes loaderspin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.search__text{color:var(--Neutral-0);line-height:1.2;font-size:1.6rem;font-family:var(--DMsans),sans-serif;font-weight:500}.search__results{display:flex;flex-direction:column;justify-content:center;gap:.8rem}.search__result{color:var(--Neutral-0);line-height:1.2;font-size:1.6rem;font-family:var(--DMsans),sans-serif;font-weight:500;padding:1rem .8rem;border:1px solid transparent;border-radius:.8rem}.search__result:hover,.search__result:focus{border-color:var(--Neutral-600);cursor:pointer;background-color:var(--Neutral-700)}.search__btn{border:1px solid #000;background-color:var(--Blue-500);border-radius:1.2rem;padding:1.6rem 2.4rem;width:100%;font-size:2rem;color:var(--Neutral-0)}@media(min-width:45rem){.search__btn{width:11.4rem}}.weather__content{margin-block-end:2rem}@media(min-width:75rem){.weather__content{display:flex;align-items:center;gap:3.2rem}}.no__result{display:flex;justify-content:center;align-items:center}.no__result p{font-family:var(--DMsans),sans-serif;font-size:2rem;margin-block-end:4rem;font-weight:700}@media(min-width:45rem){.no__result p{font-size:2.8rem}}.attribution{font-size:1.6rem;text-align:center;font-family:var(--DMsans);font-weight:600;justify-self:flex-end;margin-block-start:auto;margin-block-end:2rem}.attribution a{color:#3e52a3}.current__weather__info__con{margin-block-end:3.2rem}@media(min-width:75rem){.current__weather__info__con{margin-block-end:4.8rem}}.curr__loading__con{border-radius:2rem;padding:4rem 2.4rem;background-color:#262541;display:flex;flex-direction:column;justify-content:center;align-items:center;margin-block-end:2rem;height:28.6rem;gap:1.4rem}.load__circle__con{width:5.6rem;height:1.6rem;display:flex;justify-content:center;align-items:center;gap:1rem}.load__circle{width:1.2rem;height:1.2rem;border-radius:50%;background-color:var(--Neutral-0);opacity:.8;position:relative;animation:bounce 2s infinite ease-in-out}@media(prefers-reduced-motion:reduce){.load__circle{animation:none;transform:none}}.load__rev{top:-.5rem;animation:revbounce 2s infinite ease-in-out}@media(prefers-reduced-motion:reduce){.load__rev{animation:none;transform:none}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-.5rem)}}@keyframes revbounce{0%,to{transform:translateY(0)}50%{transform:translateY(.5rem)}}.load__text{font-family:var(--DMsans);line-height:1.2;font-size:1.8rem;font-weight:500;color:var(--Neutral-200)}.current__weather__info{border-radius:2rem;padding:4rem 2.4rem;background:url(/assets/bg-today-small-DEQrvfY6.svg) center/cover no-repeat;display:flex;flex-direction:column;gap:1.6rem;margin-block-end:2rem;height:28.6rem}@media(min-width:45rem){.current__weather__info{flex-direction:row;align-items:center;justify-content:space-between;background:url(/assets/bg-today-large-CqYszFxp.svg) center/cover no-repeat}}@media(min-width:75rem){.current__weather__info{margin-block-end:3.2rem}}.locdate__con{font-family:var(--DMsans);text-align:center;color:var(--Neutral-0)}@media(min-width:45rem){.locdate__con{text-align:left}}.location{font-size:2.8rem;margin-block-end:1.6rem;font-weight:700}.date{font-size:1.8rem;font-weight:500;color:var(--Neutral-0);opacity:.8}.temp__con{display:flex;justify-content:space-between;text-align:center}@media(min-width:45rem){.temp__con{gap:2rem}}.temperature{font-size:9.6rem;font-family:var(--DMSansItalic);font-weight:600;letter-spacing:-.2rem}.current__weather__details__con{display:grid;grid-template-columns:repeat(2,1fr);gap:1.6rem}@media(min-width:45rem){.current__weather__details__con{grid-template-columns:repeat(4,1fr)}}.current__weather__detail{border:1px solid var(--Neutral-600);background-color:var(--Neutral-800);border-radius:1.2rem;padding:2rem;font-family:var(--DMsans);height:12.1rem}.current__weather__detail__header{font-size:1.8rem;font-weight:500;color:var(--Neutral-200);margin-block-end:2.4rem}.current__weather__detail__text{font-size:3.2rem;font-weight:300;color:var(--Neutral-0)}.curr__daily__con{width:100%}.hourly__forecast__con{border-radius:2rem;display:grid;padding-block:2rem;gap:1.6rem;background-color:var(--Neutral-800);font-family:var(--DMsans);max-height:68.5rem}@media(min-width:45rem){.hourly__forecast__con{padding-block:2.4rem}}@media(min-width:75rem){.hourly__forecast__con{width:100%;max-width:38.4rem;max-height:69.3rem}}.forecast__nav__con{display:flex;justify-content:space-between;position:relative;padding-inline:1.6rem}@media(min-width:45rem){.forecast__nav__con{padding-inline:2.4rem}}.hourly__header{font-size:2rem;font-weight:600;color:var(--Neutral-0)}.day__select__btn{border-radius:.8rem;background-color:var(--Neutral-600);border:none;display:flex;justify-content:space-between;align-items:center;padding:.8rem 1.6rem;gap:.8rem}.day__btn__text{color:var(--Neutral-0);font-weight:500;font-size:1.6rem}.forecast__nav__dropdown{width:21.4rem;position:absolute;right:0;top:4.8rem;border-radius:1.2rem;padding:.8rem;border:1px solid var(--Neutral-600);background-color:var(--Neutral-800);display:none;flex-direction:column;gap:.4rem;font-family:var(--DMsans);z-index:999}.forecast__nav__dropdown--active{display:flex}.forecast__nav{padding:1rem .8rem;color:var(--Neutral-0);font-size:1.6rem;font-weight:500;background-color:transparent;border:none;outline:none;text-align:left}.forecast__nav:hover,.forecast__nav:focus .forecast__nav--active{background-color:var(--Neutral-700);border-radius:.8rem}.hourly__forecast{display:grid;gap:1.6rem;padding-inline:1.6rem;padding-block-end:2rem;overflow-y:scroll;height:59.2rem}.hourly__forecast::-webkit-scrollbar{width:.4rem}.hourly__forecast::-webkit-scrollbar-thumb{border-radius:.2rem;border:1px solid var(--Neutral-600)}@media(min-width:45rem){.hourly__forecast{padding-inline:2.4rem;padding-block-end:2.4rem}}.forecast__con{display:flex;border:1px solid var(--Neutral-600);border-radius:.8rem;background-color:var(--Neutral-700);padding:1rem 1.6rem 1rem 1.2rem;height:6rem;align-items:center;justify-content:space-between;gap:.8rem}.icon__time{display:flex;align-items:center;gap:1.5rem}.icon__time .hourly__icon{width:4rem;height:4rem}.icon__time .hour__time{font-size:2rem;font-weight:500;color:var(--Neutral-0);font-family:var(--DMsans),sans-serif}.hour__temp{font-size:1.6rem;font-weight:500}.icon__dropdown{width:1.2rem;height:1.6rem}.hourly__forecast__img{width:4rem;height:4rem}.hourly__forecast__time{font-size:2rem;color:var(--Neutral-0);font-weight:500;width:100%}.hourly__forecast__temp{font-size:1.6rem;color:var(--Neutral-0);font-weight:500}.daily__forecast__con{margin-block-end:3.2rem;font-family:var(--DMsans)}@media(min-width:75rem){.daily__forecast__con{margin-block-end:0}}.daily__forecast__header{font-size:2rem;font-weight:600;color:var(--Neutral-0);margin-block-end:2rem}.daily__forcast{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}@media(min-width:45rem){.daily__forcast{grid-template-columns:repeat(7,1fr)}}.forecast{padding:1.6rem 1rem;border:1px solid var(--Neutral-600);border-radius:1.2rem;background-color:var(--Neutral-800);display:flex;flex-direction:column;gap:1.6rem;justify-content:center;align-items:center;width:100%;height:16.5rem;justify-self:center}.forecast__day{font-size:1.8rem;font-weight:500}.forecast__img{width:6rem;height:6rem}.forecast__temp{width:100%;display:flex;justify-content:space-between}.temp__text{font-size:1.6rem;font-weight:500;color:var(--Neutral-0)}