body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f6f6f8}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}.App{display:flex;align-items:center;justify-content:stretch;margin:0 auto;font-family:"Quicksand",sans-serif;box-sizing:border-box;min-height:100vh;min-width:100vw}.App,.Content{flex-direction:column}.Content{margin-top:100px;display:inline-flex;flex-grow:1}.Header{justify-content:space-between;align-items:center;height:56px;width:100%;margin-bottom:40px}.Header,.ToggleContainer{display:flex;flex-direction:row}.SpinnerContainer{height:161px;width:320px;display:flex;justify-content:center;align-items:center}@media (min-width:641px){.SpinnerContainer{height:280px;width:732px}}@media (min-width:961px){.SpinnerContainer{height:250px;width:880px}}.ToggleButton{height:30px;width:30px;font-size:12px;margin:0 4px;border-radius:50%;background-color:#fff;font-weight:700;display:flex;justify-content:center;align-items:center;transition:background-color .5s cubic-bezier(.5,1,.89,1)}.UnitToggled{background-color:#000;color:#ffa011}@media (min-width:641px){.ToggleButton{height:40px;width:40px;font-size:16px;margin:0 8px}}@media (min-width:961px){.ToggleButton{height:52px;width:52px;font-size:24px;margin:0 10px}}.SearchInput{font-size:12px;width:160px;font-family:inherit;border:none;background-color:inherit;padding:4px 0;transition:opacity .2s cubic-bezier(.5,1,.89,1),-webkit-clip-path .2s cubic-bezier(.5,1,.89,1);transition:clip-path .2s cubic-bezier(.5,1,.89,1),opacity .2s cubic-bezier(.5,1,.89,1);transition:clip-path .2s cubic-bezier(.5,1,.89,1),opacity .2s cubic-bezier(.5,1,.89,1),-webkit-clip-path .2s cubic-bezier(.5,1,.89,1)}.SearchInput:focus{outline:none}.SearchInputOpen{-webkit-clip-path:polygon(0 0,100% 0,100% 100%,0 100%);clip-path:polygon(0 0,100% 0,100% 100%,0 100%);opacity:1}.SearchInputClosed{-webkit-clip-path:polygon(0 0,0 0,0 100%,0 100%);clip-path:polygon(0 0,0 0,0 100%,0 100%);opacity:0}@media (min-width:641px){.SearchInput{font-size:18px;width:200px}}@media (min-width:961px){.SearchInput{width:400px;font-size:24px}}.SearchIcon{width:24px;height:24px;margin-left:4px}.SearchIconContainer{width:30px;height:30px;margin:0 4px;background-color:#fff;border-radius:26px;display:flex;align-items:center;transition:width .5s cubic-bezier(.5,1,.89,1)}.SearchBarOpen{width:200px}.SearchBarClosed{width:30px}.SearchBarContainer{padding:36px 0;display:flex;flex-direction:row;justify-content:center;align-items:center}::-webkit-input-placeholder{color:rgba(0,0,0,.5);opacity:1}:-ms-input-placeholder{opacity:1}::-ms-input-placeholder{opacity:1}::placeholder{color:rgba(0,0,0,.5);opacity:1}:-ms-input-placeholder{color:rgba(0,0,0,.5)}::-ms-input-placeholder{color:rgba(0,0,0,.5)}@media (min-width:641px){.SearchIcon{width:36px;height:36px;margin-left:3px}.SearchIconContainer{width:40px;height:40px;margin:0 8px}.SearchBarOpen{width:532px}.SearchBarClosed{width:40px}}@media (min-width:961px){.SearchBarClosed{width:52px}.SearchIconContainer{width:52px;height:52px;margin:0 10px}.SearchBarOpen{width:700px}.SearchIcon{width:42px;height:42px;margin-left:6px}}.Forecast{display:flex;flex-direction:column}.ForecastTitleContainer{display:flex;align-items:center}.ForecastTitle{font-size:12px;margin:0 4px 16px;font-weight:700;text-transform:capitalize}.ForecastLocation{font-weight:400}.CardContainer{display:flex;flex-direction:row}@media (min-width:641px){.ForecastTitle{font-size:22px;margin:0 10px 24px}}@media (min-width:961px){.ForecastTitle{font-size:36px;margin:0 10px 20px}}.WeatherCard{background-color:#fff;font-weight:400;width:60px;height:120px;font-size:10px;margin:4px;border-radius:6px;display:flex;flex-direction:column}.WeatherCard img{width:24px;height:24px}.WeatherCardContent{display:flex;flex-direction:column;align-items:center;justify-content:space-between;flex:1 1;margin:16px 4px}.TempMax,.TempMin{margin:0;padding:0}.TempMin{color:#aaa}.Date{margin:0;padding:0}@media (min-width:641px){.WeatherCard{width:120px;height:144px;font-size:16px;margin:0 8px;border-radius:12px}.WeatherCard img{width:48px;height:48px}.WeatherCardContent{margin:16px}}@media (min-width:961px){.WeatherCard{width:160px;height:192px;margin:0 10px;font-size:20px;border-radius:16px}.WeatherCard img{width:60px;height:60px}.WeatherCardContent{margin:20px}}.ReactIcon{height:40px;width:40px;margin:0 6px;-webkit-animation:spin 4s linear infinite;animation:spin 4s linear infinite}@-webkit-keyframes spin{to{transform:rotate(1turn)}}@keyframes spin{to{transform:rotate(1turn)}}.Footer{margin-bottom:100px;height:32px;display:flex;flex-direction:row;align-items:center}.FooterText{text-align:center;font-size:12px;color:rgba(0,0,0,.34);padding:0;margin:0;height:16px;font-weight:600}@media (min-width:961px){.Footer{margin-bottom:200px}.FooterText{text-align:center;font-size:16px}}.ErrorMessageContainer{height:161px;width:320px;display:flex;justify-content:center;align-items:center}.ErrorMessage{color:rgba(0,0,0,.34);font-size:12px;font-weight:600;margin:0;padding:0 8px}@media (min-width:641px){.ErrorMessageContainer{height:280px;width:732px}.ErrorMessage{font-size:18px}}@media (min-width:961px){.ErrorMessageContainer{height:250px;width:880px}.ErrorMessage{font-size:24px}}
/*# sourceMappingURL=main.27aebe71.chunk.css.map */