*{box-sizing:border-box;margin:0;padding:0}body{font-family:Montserrat,sans-serif}.app{background-image:url(/weather-app/static/media/cold1.aef5a3383bdee8b72b35.jpeg);background-position:50%;background-size:cover;transition:background-image .4s ease-out}.cold-weather{background-image:url(/weather-app/static/media/freezing.76ed6a67aff8e1553849.webp)}.cool-weather{background-image:url(/weather-app/static/media/cold1.aef5a3383bdee8b72b35.jpeg)}.warm-weather{background-image:url(/weather-app/static/media/warm.6d3dec1f713cc56e6827.jpeg)}.hot-weather{background-image:url(/weather-app/static/media/boiling.00efb9b73b913350d240.jpeg)}main{background-image:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.75));min-height:100vh;padding:25px}.search-box{margin:0 0 75px;width:100%}.search-box .search-bar{-webkit-appearance:none;appearance:none;background-color:hsla(0,0%,100%,.5);border:none;border-radius:0 0 16px 16px;box-shadow:0 5px rgba(0,0,0,.2);color:#313131;display:block;font-family:inherit;font-size:30px;margin-top:-25px;outline:none;padding:15px;transition:background-color .4s ease;width:100%}.search-box .search-bar:focus{background-color:hsla(0,0%,100%,.75)}.search-box .search-bar:disabled{cursor:not-allowed;opacity:.6}.error-banner{background-color:rgba(220,38,38,.15);border:1px solid rgba(220,38,38,.4);border-radius:8px;color:#fca5a5;font-size:16px;margin-bottom:24px;padding:12px 16px;text-align:center}.loading-state{display:flex;justify-content:center;padding:60px 0}.spinner{-webkit-animation:spin .7s linear infinite;animation:spin .7s linear infinite;border:3px solid hsla(0,0%,100%,.2);border-radius:50%;border-top-color:hsla(0,0%,100%,.8);height:36px;width:36px}@-webkit-keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.location-box{left:0;position:absolute;right:0;text-align:center;top:80px}.location-box .location{align-items:center;color:#fff;display:flex;font-size:42px;font-weight:500;gap:12px;justify-content:center;text-align:center;text-shadow:3px 3px rgba(50,50,70,.5)}.location-box .date{color:#fff;font-size:20px;font-style:italic;font-weight:300;text-align:center;text-shadow:2px 2px rgba(50,50,70,.5)}.save-location-button{background-color:hsla(0,0%,100%,.2);border:1px solid hsla(0,0%,100%,.5);border-radius:6px;color:#fff;cursor:pointer;font-family:inherit;font-size:16px;padding:4px 12px;transition:background-color .2s ease}.save-location-button:hover{background-color:hsla(0,0%,100%,.35)}.weather-box{display:flex;height:100%;justify-content:center;text-align:center}.temp-container,.weather-box{align-items:center;flex-direction:column}.temp-container{display:inline-flex}.weather-box .temp,.weather-description{background-color:hsla(0,0%,100%,.2);border-radius:16px;box-shadow:3px 6px rgba(0,0,0,.2);color:#fff;display:inline-block;font-size:60px;font-weight:900;margin:30px auto;min-width:100px;padding:8px;position:relative;text-align:center;text-shadow:3px 6px rgba(50,50,70,.5);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.weather-description{align-items:center;display:flex;flex-direction:column;margin-top:10px}.feels-like{font-size:20px}.small-text{font-size:21px}.weather-icon{height:80px;width:80px}.weather-box .weather{align-items:flex-end;display:flex;flex:1 1;flex-direction:column;font-size:48px;font-weight:700}.weather-box .weather,.weather-box .wind{color:#fff;text-shadow:3px 3px rgba(50,50,70,.5)}.weather-box .wind{font-size:32px;font-weight:500;text-align:center}.compass-container{margin:10px auto}.stored-locations{margin-top:20px;text-align:center}.stored-locations-heading{color:#fff;font-size:20px;font-weight:500;margin-bottom:12px}.location-buttons-container{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.stored-location-box{align-items:center;border:1px solid hsla(0,0%,100%,.3);border-radius:8px;display:flex;overflow:hidden}.button-location{background-color:hsla(0,0%,100%,.15);border:none;color:#fff;cursor:pointer;font-family:inherit;font-size:15px;padding:8px 16px;transition:background-color .2s ease}.button-location:hover{background-color:hsla(0,0%,100%,.3)}.remove-location-button{background-color:initial;border:none;border-right:1px solid hsla(0,0%,100%,.3);color:hsla(0,0%,100%,.7);cursor:pointer;font-size:18px;line-height:1;padding:8px 10px;transition:all .2s ease}.remove-location-button:hover{background-color:rgba(220,38,38,.3);color:#fff}.wind-compass{display:inline-block;vertical-align:middle}
/*# sourceMappingURL=main.58489552.css.map*/