@import url(https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.1/font/bootstrap-icons.css);@import url(https://fonts.googleapis.com/css2?family=Poppins&display=swap);[data-v-c4b46662]{box-sizing:border-box}body[data-v-c4b46662]{margin:0;padding:0;font-family:Poppins,sans-serif}div.container[data-v-c4b46662]{width:100%;height:clamp(100vh,650px,110vh);position:relative}div.overlay[data-v-c4b46662]{width:100%;height:100%;position:absolute;top:0;left:0;background:rgba(0,0,0,.4);z-index:1}div.my-app[data-v-c4b46662]{width:100%;height:100%;position:absolute;top:0;left:0;background-image:url(/my-weather-app/img/cloudy.4747e6f6.jpg);background-position:50%;background-size:cover;background-repeat:no-repeat;color:#fff;transition:.5s;z-index:2}div.alert[data-v-c4b46662]{width:100%;height:40px;position:sticky;top:0;left:0;display:none;justify-content:center;align-items:center;color:#fff;background-color:#f9ae00;z-index:10}header[data-v-c4b46662]{width:100%;display:flex;justify-content:flex-start;align-items:center;background:transparent}h2[data-v-c4b46662]{margin-left:15px;color:#ffe6ac}div.content[data-v-c4b46662]{width:60%;margin:auto;text-align:center}h1[data-v-c4b46662]{font-size:3.1rem;font-weight:600}.spans[data-v-c4b46662]{width:40%;margin:-20px auto 25px;display:flex;justify-content:center;align-items:center}.icon[data-v-c4b46662]{width:90px;height:90px;margin-right:30px}.spans div[data-v-c4b46662]{text-align:left}.temperature[data-v-c4b46662]{font-size:2.5rem;font-weight:600;margin-bottom:-10px}.weather-state[data-v-c4b46662]{font-size:.9rem}.bi[data-v-c4b46662]{color:#f9ae00;margin-right:10px}.date[data-v-c4b46662]{margin-right:30px;font-size:1.05rem}.time[data-v-c4b46662]{margin-left:30px;font-size:1.05rem}ul[data-v-c4b46662]{list-style:none;width:60%;margin:20px auto;padding:10px;background:hsla(0,0%,100%,.35);border-radius:10px}ul>p[data-v-c4b46662]{font-weight:600}li[data-v-c4b46662]{display:inline-block;margin-right:15px}.form[data-v-c4b46662]{width:60%;margin:auto;display:flex;justify-content:stretch;align-items:center}input[data-v-c4b46662]{width:70%;color:#000}button[data-v-c4b46662],input[data-v-c4b46662]{padding:10px 14px;outline:none;border:1px solid #f9ae00;cursor:pointer}button[data-v-c4b46662]{width:30%;color:#fff;background:#f9ae00}button[data-v-c4b46662]:hover{background:#ffb70f}@media (min-width:769px) and (max-width:992px){div.container[data-v-c4b46662]{height:clamp(100vh,1000px,120vh)}div.content[data-v-c4b46662]{width:75%;margin-top:100px}h1[data-v-c4b46662]{font-size:3rem;font-weight:600}.spans[data-v-c4b46662]{width:35%}.icon[data-v-c4b46662]{margin-right:50px}.date[data-v-c4b46662],.time[data-v-c4b46662]{font-size:1.5rem}ul[data-v-c4b46662]{width:75%;margin:50px auto}li[data-v-c4b46662]{display:block;margin-bottom:15px}.form[data-v-c4b46662]{width:75%;justify-content:stretch}}@media (max-width:768px){div.container[data-v-c4b46662]{height:clamp(100vh,800px,110vh)}div.content[data-v-c4b46662]{width:85%;margin-top:100px}h1[data-v-c4b46662]{font-size:2rem}.spans[data-v-c4b46662]{width:50%;margin:50px auto}.date[data-v-c4b46662],.time[data-v-c4b46662]{font-size:1.5rem;margin-bottom:15px}ul[data-v-c4b46662]{width:75%;margin:50px auto}li[data-v-c4b46662]{display:block;margin-bottom:15px}.form[data-v-c4b46662]{width:75%;flex-direction:column;justify-content:stretch}button[data-v-c4b46662],input[data-v-c4b46662]{width:100%}}@media (max-width:576px){div.container[data-v-c4b46662]{height:clamp(100vh,800px,120vh)}div.content[data-v-c4b46662]{width:95%;margin-top:15px}header[data-v-c4b46662]{justify-content:center}h2[data-v-c4b46662]{margin-left:0}h1[data-v-c4b46662]{font-size:1.5rem}.spans[data-v-c4b46662]{width:60%;margin:15px auto}.temperature[data-v-c4b46662]{font-size:2rem}.weather-state[data-v-c4b46662]{font-size:.8rem}.date[data-v-c4b46662],.time[data-v-c4b46662]{font-size:1rem;margin-bottom:15px}ul[data-v-c4b46662]{width:75%;margin:30px auto}li[data-v-c4b46662]{display:block;margin-bottom:10px}.form[data-v-c4b46662]{width:75%;flex-direction:column;justify-content:stretch}button[data-v-c4b46662],input[data-v-c4b46662]{width:100%}}#app{font-family:Poppins,sans-serif}