.header{align-items:center;display:grid;grid-template-columns:24px 1fr 24px;height:59px;justify-items:center;padding:0 16px;position:relative;top:0;width:100%;z-index:2}.header.sticky{position:-webkit-sticky;position:sticky}.header.visibleBackground{background:var(--header-background)}.header__action{color:var(--header-color);cursor:pointer;display:flex}.header__title-container{align-items:center;display:flex;flex-direction:column}.header__title-container__title{color:#fff;font-size:16px;font-weight:600;letter-spacing:.003em;text-align:center}.header__title-container__subtitle{color:#fff;font-size:10px;font-weight:300;text-align:center}.button{border:none;border-radius:40px;color:var(--button-color);cursor:pointer;font-size:12px;font-weight:600;letter-spacing:.3px;outline:none;padding:8px 16px}.button.primary{background:var(--button-primary-background)}.button.secondary{background:var(--button-secondary-background)}.hourly-weather{align-items:center;display:flex;flex-direction:column;flex-shrink:0;width:46px}.hourly-weather__time{color:var(--hourly-weather-time-color);font-size:12px;font-weight:300;line-height:18px;text-align:center}.hourly-weather__icon{height:28px;margin-top:6px;object-fit:contain;width:29px}.website .hourly-weather__icon{height:54px;margin-top:24px;width:43px}.hourly-weather__temperature{color:var(--hourly-weather-temperature-color);font-size:14px;line-height:21px;margin-top:2px;text-align:center}.website .hourly-weather__temperature{margin-top:8px}.scroll-container{box-sizing:border-box;display:flex;gap:16px;overflow:hidden}.forecast{background:linear-gradient(91.08deg,hsla(0,0%,100%,.97) .92%,hsla(0,0%,100%,.87) 99.08%);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.05);display:flex;flex-direction:column;padding:0 16px 9px;position:relative;width:100%}.forecast__header{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;padding:15px 0;width:100%}.forecast__container{cursor:grab;display:flex;gap:6px;justify-content:center;margin-top:27px}.view{display:flex;flex-direction:column;flex-grow:1;overflow-y:scroll;position:relative}.view::-webkit-scrollbar{width:0}.view .background{background:var(--view-background);border-radius:0 0 24px 24px;height:295px;left:0;position:absolute;top:0;transition:all .6s ease-out;width:100%}@-webkit-keyframes slide-up{0%{opacity:0;-webkit-transform:translateY(80px);transform:translateY(80px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@keyframes slide-up{0%{opacity:0;-webkit-transform:translateY(80px);transform:translateY(80px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}@-webkit-keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@-webkit-keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}.current-weather-info{align-items:center;display:flex;flex-direction:column;position:relative}.website .current-weather-info{align-items:center;background:linear-gradient(.717turn,#fff 1.16%,hsla(0,0%,100%,0) 192.15%);border-radius:20px;display:flex;height:167px;justify-content:center;width:100%}.current-weather-info__icon{-webkit-filter:drop-shadow(0 17.1555px 28.5926px rgba(31,36,75,.4));filter:drop-shadow(0 17.1555px 28.5926px rgba(31,36,75,.4));height:90px;object-fit:contain;width:101px}.website .current-weather-info__icon{left:50%;position:absolute;top:-50px;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.current-weather-info__title{color:#fff;font-size:20px;font-weight:700;letter-spacing:.3px;line-height:25px;margin-top:16px;text-align:center;z-index:1}.website .current-weather-info__title{color:#333;margin-top:-6px}.current-weather-info__date{color:var(--current-weather-info-color);font-size:16px;font-weight:400;letter-spacing:.3px;line-height:25px;text-align:center}.website .current-weather-info__date{color:#333}.main-view{flex-grow:1;overflow-y:scroll}.main-view,.main-view__wrapper{display:flex;flex-direction:column;position:relative}.main-view__wrapper{padding:0 10px;width:100%}.detail-card{align-items:center;background:var(--detail-card-background);border-radius:20px;display:flex;padding:18px 11px}.website .detail-card{background:var(--detail-card-website-background)}.detail-card__icon{height:40px;width:40px}.detail-card__info{display:flex;flex-direction:column;margin-left:10px}.detail-card__info__title{color:var(--detail-card-title-color);font-size:16px;font-weight:500;line-height:16px}.detail-card__info__subtitle{color:var(--detail-card-subtitle-color);font-size:12px;line-height:16px;margin-top:8px;text-transform:capitalize}.section{display:flex;flex-direction:column;margin:8px 0;position:relative;width:100%}.section__title{font-size:16px;font-weight:500;letter-spacing:.3px;line-height:24px}.section__title__dark{color:var(--section-dark-color)}.section__title__light{color:var(--section-light-color)}.website .section__title{color:#fff}.section__content{display:flex;margin-top:8px;width:100%}.card{background:var(--card-background);border-radius:20px;padding:24px;width:100%}.website .card{background:linear-gradient(257.44deg,hsla(0,0%,100%,.76) 1.17%,#fff),linear-gradient(.717turn,#fff 1.16%,hsla(0,0%,100%,0) 192.15%)}.card__properties-container{align-items:center;display:flex;justify-content:space-between}.card__property-container{display:flex;flex-direction:column}.card__property-container__label{color:#a098ae;font-size:12px;line-height:18px}.card__property-container__value{color:#363b64;font-size:14px;font-weight:600;letter-spacing:.3px;line-height:21px;margin-top:4px}.progress-bar{display:flex;flex-direction:column;margin-top:11px;width:100%}.progress-bar__bar{border-bottom:1px solid var(--progress-bar-border-color);height:37px;position:relative;width:100%}.progress-bar__track{margin-top:-1px;position:relative;-webkit-transform:translateX(-10px);transform:translateX(-10px);width:calc(100% + 20.5px)}.progress-bar__track__content{align-items:center;display:flex;flex-direction:column;width:-webkit-min-content;width:min-content}.progress-bar__track__content__icon{display:flex;height:31px;width:31px}.progress-bar__time-container{display:flex;justify-content:space-between;margin-top:3px;width:100%}.progress-bar__time-container__time{color:var(--progress-bar-color);font-size:12px;line-height:18px;margin-top:3px}.spinner{align-items:center;display:flex;flex-grow:1;justify-content:center}.spinner>:first-child{height:40px;width:40px}.loading-fallback{background:rgba(0,0,0,.3);display:flex;height:100vh;left:0;top:0;width:100vw;z-index:100}.website-main-view{display:flex;flex-direction:column;flex-grow:1;overflow-y:scroll;padding:15px;position:relative}.website-main-view__cities-container{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:0 auto 39px}.website-main-view__wrapper{display:flex;flex-direction:column;padding:0 10px;position:relative;width:100%}.website-main-view__forecast-row{grid-gap:34px;display:grid;gap:34px;grid-template-columns:362px 1fr;grid-template-rows:1fr;margin-bottom:39px}@media screen and (max-width:840px){.website-main-view__forecast-row{grid-template-columns:minmax(345px,1fr)}}.website-main-view__current-weather{margin-top:30px}.website-main-view__forecast{width:100%}.website-main-view__forecast__header{color:#fff;font-size:16px;font-style:normal;font-weight:500;letter-spacing:.3px;line-height:24px}.website-main-view__forecast__wrapper{background:linear-gradient(91.08deg,hsla(0,0%,100%,.97) .92%,hsla(0,0%,100%,.87) 99.08%);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.05);margin-top:7px;padding:15px 12px 28px;width:100%}.website-main-view__forecast__container{cursor:grab;display:flex;gap:6px;justify-content:space-between;width:100%}.website-main-view__content__row{grid-gap:34px;display:grid;gap:34px;grid-template-columns:362px 1fr;grid-template-rows:1fr}@media screen and (max-width:840px){.website-main-view__content__row{grid-template-columns:minmax(345px,1fr)}}.website-main-view__details{grid-gap:8px;display:grid;gap:8px;grid-template-columns:repeat(2,minmax(165px,1fr));width:100%}.search-input-container{display:flex;position:relative}.search-input-container .text-input{background:var(--search-input-background);border:1px solid #fff;border-radius:30px;color:var(--search-input-color);font-family:Poppins,sans-serif;font-size:16px;outline:none;padding:11px 20px;position:relative;width:100%;z-index:1}.search-input-container .text-input::-webkit-input-placeholder{color:var(--search-input-placeholder-color);opacity:.7}.search-input-container .text-input:-ms-input-placeholder{color:var(--search-input-placeholder-color);opacity:.7}.search-input-container .text-input::placeholder{color:var(--search-input-placeholder-color);opacity:.7}.search-input-container__action-icon{cursor:pointer;position:absolute;right:14px;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);z-index:1}.search-input-container__options-container{border-radius:20px;height:40vh;overflow:hidden;position:absolute;width:100%}.search-input-container__options{background:#fff;border-radius:20px;display:flex;flex-direction:column;list-style:none;max-height:40vh;overflow-y:auto;padding-top:42px;position:relative;-webkit-transform:translateY(-100%);transform:translateY(-100%);transition:all .25s ease-out;width:100%}.search-input-container__options::-webkit-scrollbar-thumb{background-color:var(--search-input-scrollbar-thumb-background)}.search-input-container__options__item{color:var(--search-input-options-item-color);cursor:pointer;padding:10px 18px;transition:all .15s ease-out}.search-input-container__options__item .match{color:var(--search-input-options-match-color)}.search-input-container__options__item:focus,.search-input-container__options__item:hover{background:rgba(0,0,0,.015);outline:none}@-webkit-keyframes search-options-in{0%{top:-100%}to{top:0}}@keyframes search-options-in{0%{top:-100%}to{top:0}}@-webkit-keyframes search-options-out{0%{top:0}to{top:-100%}}@keyframes search-options-out{0%{top:0}to{top:-100%}}.settings-view{display:flex;flex-direction:column;height:100%;overflow-y:hidden;position:relative;width:100%}.settings-view__heading{color:var(--settings-color);margin-bottom:9px}.settings-view__container{height:100vh;padding:24px;position:relative;width:100%}.settings-view__container,.settings-view__units-container{display:flex;flex-direction:column}.settings-view__units-container__item{display:flex;gap:8px;margin-top:13px}.settings-view__units-container__item__label{color:#fff;font-size:16px;margin-right:auto}.splash{align-items:center;background-color:var(--splash-background);flex-direction:column;padding:10px 15px;position:relative;z-index:2}.splash,.splash .background{display:flex;height:100%;width:100%}.splash .background{align-items:flex-end;bottom:0;left:0;position:absolute;z-index:1}.splash .logo{margin-top:88px;z-index:2}.splash .quote{line-height:24px;margin-top:50px;padding:0 42px}.splash .quote,.splash .source{color:var(--splash-color);text-align:center;z-index:2}.splash .source{bottom:10px;font-size:10px;line-height:15px;margin-top:auto;position:absolute}.app{background:var(--root-background);display:flex;height:600px;position:relative;width:360px}.website .app{background:0 0;height:100%;width:100%}.week-info{align-items:center;display:flex;flex-direction:column;margin:20px;position:relative}.week-info__title{color:#fff;font-size:20px;font-weight:700;letter-spacing:.3px;line-height:25px;margin-top:16px;text-align:center;z-index:1}.website .week-info__title{color:#333;margin-top:-6px}.week-info__weather{color:var(--heading-color);font-size:16px;font-weight:400;letter-spacing:.3px;line-height:25px;text-align:center}.website .week-info__weather{color:#333}.weather-card{align-items:center;background:linear-gradient(91.08deg,hsla(0,0%,100%,.97) .92%,hsla(0,0%,100%,.87) 99.08%);border-radius:12px;box-shadow:0 0 4px rgba(0,0,0,.05);cursor:pointer;display:flex;margin:4px auto;min-height:72px;padding:16px 20px;width:340px;z-index:10}.weather-card__image{height:100%;margin-right:23px;object-fit:contain;width:50px}.weather-card__info{align-items:center;display:flex;flex-grow:1;gap:8px;height:100%;justify-content:space-between;margin-right:15px}.weather-card__info__text-container{flex-direction:column;flex-grow:1;height:100%;justify-content:space-between}.weather-card__info__text-container__title{color:var(--weather-card-title-color);cursor:pointer;font-size:14px;font-weight:400;line-height:21px;width:100%}.weather-card__info__text-container__subtitle{color:var(--weather-card-subtitle-color);cursor:pointer;font-size:12px;font-weight:300;line-height:19px}.weather-card__info__temp{color:var(--weather-card-temp-color);font-size:26px;font-weight:400;height:100%;line-height:39px}.week-forecast{height:100%;overflow-y:scroll}.week-forecast,.week-forecast__wrapper{display:flex;flex-direction:column;flex-grow:1;position:relative}.week-forecast__wrapper{padding:0 10px;width:100%}::-webkit-scrollbar{width:.2em}::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color);border-radius:50px}:root{--transition-duration:0.25s}h1{font-size:20px;font-weight:700;letter-spacing:.3px}h1,h2{color:#fff}h2{font-size:16px}h1,h2,h3,h4,p,span{cursor:default}*,:after,:before{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Poppins,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}html{-webkit-user-select:none;-ms-user-select:none;user-select:none}