*{margin:0;padding:0;box-sizing:border-box}body{font-family:"montseratt","sans-serif"}.app{background-image:url(/static/media/night.61641924.jpg);background-size:cover;background-position:bottom;transition:.4 ease-out}.app.warm{background-image:url(/static/media/day.6cd00930.jpg)}main{min-height:100vh;background-image:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.75));padding:25px}.search-box{width:100%;margin:0 0 75px}.search-box .search-bar{text-align:center;display:block;width:100%;padding:15px;-webkit-appearance:none;appearance:none;background:none;border:none;outline:none;background-color:hsla(0,0%,100%,.5);border-radius:0 0 16px 16px;margin-top:-25px;box-shadow:0 5px rgba(0,0,0,.2);color:#313131;font-size:20px;transition:.4s ease}.search-box .search-bar:focus{background-color:hsla(0,0%,100%,.75)}.location-box .location{font-size:32px;font-weight:500}.location-box .date,.location-box .location{color:#fff;text-align:center;text-shadow:2px 2px rgba(50,50,70,.5)}.location-box .date{font-size:20px;font-weight:300}.weather-box{text-align:center}.weather-box .temp{position:relative;display:inline-block;margin:30px auto;background-color:hsla(0,0%,100%,.2);border-radius:16px;padding:15px 25px;color:#fff;font-size:102px;font-weight:900;text-shadow:3px 6px rgba(50,50,70,.5);text-align:center;box-shadow:3px 6px rgba(0,0,0,.2)}.weather-box .weather{color:#fff;font-size:48px;font-weight:700;text-shadow:3px 3px rgba(50,50,70,.5)}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{-webkit-animation:App-logo-spin 20s linear infinite;animation:App-logo-spin 20s linear infinite}}.App-header{background-color:#282c34;min-height:100vh;display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;font-size:calc(10px + 2vmin);color:#fff}.App-link{color:#61dafb}@-webkit-keyframes App-logo-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes App-logo-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}
/*# sourceMappingURL=main.5acfbe4e.chunk.css.map */