@import"https://fonts.googleapis.com/css2?family=Chewy&display=swap";:root{--shadow-colour: rgb(50, 50, 50);--card-color: radial-gradient(circle, #FFC857 30%, #FF9F68 70%);font-family:Chewy,serif;font-size:2rem}html{padding:.1rem;background:url(/fair-weather-app/assets/sky-UaeDSuCp.png);background-size:cover}@media only screen and (max-width: 767px){html{background:url(/fair-weather-app/assets/sky-mobile-4VXfmrVd.jpg);background-size:125%}}*,*:before,*:after{box-sizing:border-box}*{margin:0}body{line-height:1.5;-webkit-font-smoothing:antialiased}img,picture,video,canvas,svg{max-width:100%}input,button,textarea,select{font:inherit}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}p{text-wrap:pretty}h1,h2,h3,h4,h5,h6{text-wrap:balance}#root,#__next{isolation:isolate}.current-overview{display:flex;justify-content:space-around}h2{font-size:1.1rem;color:#fff;text-shadow:-3px 3px 3px var(--shadow-colour),-5px 5px 5px var(--shadow-colour)}.loading{display:flex;flex-direction:column;justify-content:center;align-items:center;margin-top:1rem;gap:1rem;text-align:center}.header{text-align:center;padding:1rem;border-radius:.7rem;margin:auto;margin-top:2rem;border:2px solid grey;box-shadow:-2px 2px 2px var(--shadow-colour),-4px 4px 6px var(--shadow-colour);width:80%;justify-self:center;background:linear-gradient(to bottom,#007dd3,#5cb0df,#95bfd8);color:#fff;text-shadow:-3px 3px 3px var(--shadow-colour),-5px 5px 5px var(--shadow-colour)}@media only screen and (max-width: 768px){.header{width:95%;margin-top:1rem}}@media only screen and (max-width: 650px){.header{font-size:1.6rem}}@media only screen and (max-width: 550px){.header{font-size:1.4rem;padding:1rem 0;margin-top:.5rem}}@media only screen and (max-width: 380px){.header{font-size:1.2rem}}#location{border-radius:.2rem;border:2px solid grey}.location{margin-top:-.45rem;margin-left:55%}.location input{text-indent:2.7ch;width:25ch;box-shadow:-2px 2px 2px var(--shadow-colour),-4px 4px 6px var(--shadow-colour)}.location-button{position:absolute;width:1.5rem;height:1.5rem;border-style:none;background-color:inherit;margin-top:.2rem}.location ul{width:25ch}.location li{list-style:none;margin-left:3.7ch;font-size:.8rem;padding:4px}.location ul{margin-block-start:0px;margin-block-end:0px;padding-inline-start:0px;cursor:pointer;margin-top:.2rem}.grid-row{width:50ch}.error{color:#f30;text-shadow:-1px 1px 1px var(--shadow-colour),-3px 3px 3px var(--shadow-colour)}.selected{border-bottom:2px solid #D95D39;border-left:2px solid #D95D39;border-radius:.5rem;width:fit-content;background-color:#ffd79c96}@media only screen and (max-width: 1500px){.location{margin-left:45%}}@media only screen and (max-width: 1280px){.location{margin-left:40%}}@media only screen and (max-width: 1120px){.location{margin-left:35%}}@media only screen and (max-width: 1015px){.location{margin-left:30%}}@media only screen and (max-width: 930px){.location{margin-left:30%}.location input,.location ul{width:20ch}}@media only screen and (max-width: 650px){.location{margin-left:20%}.location input{width:20ch}}@media only screen and (max-width: 550px){#location{font-size:.8rem;width:85%}.location{margin-left:12%;margin-top:-.65rem}.location ul{font-size:.6rem;width:25ch}.location li{margin-left:2.9ch;font-size:.65rem}}@media only screen and (max-width: 430px){#location{font-size:.7rem}.location input{text-indent:3ch}.location ul{width:20ch;margin-left:3ch}.location li{margin-left:.7ch;font-size:.55rem}}.date-selector{display:flex;justify-content:space-around;background:radial-gradient(circle,#e3f2fdcc 15%,#bbdefb99 40%,#90caf966 80%);border-radius:.3rem}.date-selector button{border:none;background-color:inherit;cursor:pointer}.hidden{visibility:hidden}:root{--weather-card-width: 356px;background-color:#6495ed}.weather{display:grid;gap:1rem;grid-template-columns:repeat(3,25vw);justify-content:center;margin-bottom:2.2rem}.weather-icon{background-color:#add8e6;border-radius:.5rem;border:1px solid black}.forecast{background:var(--card-color);border-radius:.7rem;padding:1rem;display:flex;flex-direction:column;margin:1rem 0;min-width:300px;height:715px;box-shadow:-2px 2px 2px var(--shadow-colour),-4px 4px 6px var(--shadow-colour);width:95%;justify-self:center}.forecast span{text-align:center}.forecast img{display:inline;max-width:fit-content;align-self:center}.forecast tr{list-style:none;line-height:2.3ch;font-size:.8rem}.forecast .dog{border-radius:1rem;width:100%;border:2px solid}.forecast .opaque{opacity:.15;border:none}.weather-images{display:grid;grid-template-columns:repeat(2,1fr);gap:.2rem;justify-items:center}.forecast .time{font-weight:700;font-size:1.2rem}.show{display:block}.hide{display:none}#weather-details-mobile{display:none;grid-column:span 3;margin:auto}.show-weather-details{display:none}.up,.down{width:30px;height:30px;display:none}.up{background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='20px'%20height='20px'%20viewBox='0%200%201024%201024'%20class='icon'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M903.232%20768l56.768-50.432L512%20256l-448%20461.568%2056.768%2050.432L512%20364.928z'%20fill='%23000000'%20/%3e%3c/svg%3e") no-repeat}.down{background:url("data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='utf-8'?%3e%3c!--%20Uploaded%20to:%20SVG%20Repo,%20www.svgrepo.com,%20Generator:%20SVG%20Repo%20Mixer%20Tools%20--%3e%3csvg%20width='20px'%20height='20px'%20viewBox='0%200%201024%201024'%20class='icon'%20version='1.1'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M903.232%20256l56.768%2050.432L512%20768%2064%20306.432%20120.768%20256%20512%20659.072z'%20fill='%23000000'%20/%3e%3c/svg%3e") no-repeat}.temp{display:none}.forecast tbody,.forecast th{text-align:initial}.forecast .table-header{text-align:center}.out-of-range *{visibility:hidden}.out-of-range{background:url(/fair-weather-app/favicon.png) center no-repeat;background-size:cover}@media only screen and (min-width: 768px){:root{--weather-card-width: 300px}.forecast{position:absolute;width:300px}.weather{display:block;position:relative;height:715px;width:80%;left:10%}.move-right,.move-left{font-size:.5rem;width:1rem;height:1rem;border-radius:.2rem;cursor:pointer;position:absolute;top:48%;box-shadow:-1px 1px 1px var(--shadow-colour),-2px 2px 2px var(--shadow-colour)}.move-left{left:-.5rem}.move-right{right:-.5rem}.left,.right{transition:.5s ease-in-out;scale:85%}.far-left{z-index:-3;box-shadow:unset}.left,.right{z-index:-1}.far-right{z-index:-3;box-shadow:unset}.left{left:calc(50% - var(--weather-card-width) / 2 * 3 + 5%)}.right{left:calc(50% + var(--weather-card-width) / 2 - 5%)}.center{transition:.5s ease-in-out;left:calc(50% - var(--weather-card-width) / 2);z-index:2}}@media only screen and (min-width: 850px){:root{--weather-card-width: 315px}.left{left:calc(50% - var(--weather-card-width) / 2 * 3 + 2%)}.right{left:calc(50% + var(--weather-card-width) / 2 - 2%)}}@media only screen and (min-width: 900px){:root{--weather-card-width: 315px}}@media only screen and (min-width: 950px){:root{--weather-card-width: 330px}}@media only screen and (min-width: 1050px){.forecast{width:var(--weather-card-width)}.left{left:calc(50% - var(--weather-card-width) / 2 * 3)}.right{left:calc(50% + var(--weather-card-width) / 2)}.center{left:calc(50% - var(--weather-card-width) / 2)}}@media only screen and (min-width: 1050px){:root{--weather-card-width: 360px}.left{left:calc(50% - var(--weather-card-width) / 2 * 3 - 3%)}.right{left:calc(50% + var(--weather-card-width) / 2 + 3%)}.center{left:calc(50% - var(--weather-card-width) / 2)}}@media only screen and (max-width: 767px){.move-right,.move-left{display:none}.up,.down{display:block}#weather-details-desktop{display:none}#weather-details-mobile,.time{display:block}.weather-overview{display:flex;flex-direction:column}.forecast{position:relative;padding:.5rem;margin:0;display:grid;align-items:center;grid-template-columns:75px 1fr 10px;grid-template-rows:180px;height:auto}.forecast .time{font-size:.9rem}.weather{gap:.3rem;grid-template-columns:1fr;margin-top:1rem;margin-bottom:1rem}.weather-icon{width:50px}.weather-images{margin:.2rem;grid-template-columns:repeat(4,1fr)}thead{columns:span 2}.forecast th,.forecast td{padding-left:1rem}.show-weather-details{display:block;width:40px;height:40px;border-radius:8px;background-color:inherit;border:1px solid;margin:0;padding:0}.temp{display:block;font-size:.65rem;font-style:italic}}@media only screen and (max-width: 630px){.weather-images{grid-template-columns:repeat(2,1fr)}.forecast .dog{width:57%}}@media only screen and (max-width: 550px){.weather-images{grid-template-columns:repeat(2,1fr)}.forecast .dog{width:65%}}@media only screen and (max-width: 500px){.forecast .dog{width:80%}}@media only screen and (max-width: 460px){.forecast .dog{width:90%}}@media only screen and (max-width: 410px){.forecast .dog{width:100%}}.current-conditions{background:var(--card-color);border-radius:.7rem;padding:.5rem;text-align:center;display:flex;flex-direction:column;margin:1.5rem 0 1rem;min-width:300px;box-shadow:-2px 2px 2px var(--shadow-colour),-4px 4px 6px var(--shadow-colour);max-width:95%}.current-conditions li img{max-width:fit-content;align-self:center}.current-conditions ul{margin:0;padding:0}.current-conditions li{list-style:none;line-height:2.3ch;font-size:.8rem}.current-conditions .time{font-weight:700;font-size:1.2rem}.current-conditions table,.current-conditions th,.current-conditions td{font-size:.8rem}.current-conditions tbody,.current-conditions th{text-align:initial}.current-conditions .table-header{text-align:center}th{font-weight:400}.table-header{font-weight:700;text-align:center}.sunrise,.sunset{border:2px solid grey;border-radius:.7rem;padding:1rem;text-align:center;height:min-content;align-self:center;box-shadow:-2px 2px 2px var(--shadow-colour),-4px 4px 6px var(--shadow-colour)}.sunrise{background:linear-gradient(to top right,#ffd89c,#ffc857,#ffae42,#ff9f68)}.sunset{background:linear-gradient(to bottom right,#ff9f68,#ffae42,#ff8000,#d95d39)}@media only screen and (max-width: 850px){.sunrise,.sunset{font-size:.9rem;padding:.5rem}}@media only screen and (max-width: 750px){.sunrise,.sunset{font-size:.8rem;padding:.3rem;align-self:flex-start;margin-top:.5rem;position:absolute}.sunrise{left:.4rem}.sunset{right:.4rem}}@media only screen and (max-width: 400px){.sunrise,.sunset{font-size:.6rem;padding:.3rem}}
