@import"https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap";.app{overflow:hidden;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center}main{height:100vh;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.appBackground{position:absolute;height:100vh;width:100%;background-size:cover;background-repeat:no-repeat;z-index:-1}meta{viewport-fit:cover}.container{border-radius:50px;display:flex;flex-direction:column;align-items:center;justify-content:space-around;height:70vh;width:100vw;transition:.7s ease}.title{text-align:center;font-weight:700;font-size:32px;margin:0;color:#000;text-shadow:1px 1px 2px rgb(159,159,159),-1px -1px 5px rgb(174,174,174)}.containerWeather{height:280px;display:flex;gap:30px;align-items:center}.sectionMain{padding:0 20px;border-radius:40px;display:flex;min-width:410px;height:100%;flex-direction:column;background-color:#ffffff80;backdrop-filter:blur(.8px);-webkit-backdrop-filter:blur(.8px)}.sectionMain h3{align-self:center;font-size:24px;font-weight:500}.sectionMain span{width:100px;font-size:125px;font-weight:300}.sectionMain img{width:100px}.containerTemp{position:relative;display:flex;align-items:center;justify-content:space-around}.sectionDetails{border-radius:20px;background-color:#ffffff80;backdrop-filter:blur(.8px);-webkit-backdrop-filter:blur(.8px);display:flex;flex-direction:column;height:100%;justify-content:space-around;align-items:start;padding:0 10px;width:120px;font-weight:700}.items{font-size:19px;width:100%;height:70%;display:flex;align-items:center;justify-content:space-around}.items img{width:35px;height:35px}.items:nth-child(2){border-top:2px solid #ffffff23;border-bottom:2px solid #ffffff23}.btn{font-weight:500;border-radius:20px;border:none;padding:7px 30px;background-color:#fff;cursor:pointer;color:#4580ba;transition:ease .3s;font-size:15px;box-shadow:0 5px 4px #0000001a}.btn:hover{transform:scale(1.05)}.btn:active{transform:scale(.9)}.btn:focus{outline-color:#4580ba}.night.container{color:#e5e5e5}.night .items img{filter:invert(1)}.night .title{color:#e5e5e5;text-shadow:none}.night .sectionDetails,.night .sectionMain{background-color:#0000004d}.night .btn{color:#e5e5e5;background-color:#4580ba}@media (width < 650px){.title{font-size:24px}.container{height:70vh;justify-content:space-around}.containerWeather{flex-direction:column;gap:10px;height:auto}.sectionMain{gap:25px;min-width:300px;min-height:215px;justify-content:center}.sectionMain span{width:auto;font-size:99px}.sectionMain h3{margin:0;font-size:20px}.sectionDetails{min-width:320px;min-height:100px;padding:0 10px;flex-direction:row;align-items:center;justify-content:start}.items{font-size:17px;gap:10px;justify-content:center}.items img{width:30px;height:30px}.items:nth-child(2){border-top:none;border-bottom:none;border-left:2px solid #ffffff23;border-right:2px solid #ffffff23}.btn{font-size:16px}}p{margin:0;color:#4580ba;font-size:25px;text-shadow:0 0 10px rgb(0,106,173),0 0 10px rgb(0,92,148)}h4{max-width:200px;text-align:center;color:#407fbf;font-size:15px;font-weight:500}.containerLoading{width:250px;height:250px;display:flex;align-items:center;justify-content:center}.cloud{width:250px}.front{padding-top:45px;margin-left:25px;display:inline;position:absolute;z-index:11;animation:clouds 8s infinite;animation-timing-function:ease-in-out}.back{margin-top:-30px;margin-left:150px;z-index:12;animation:clouds 12s infinite;animation-timing-function:ease-in-out}.right-front{width:45px;height:45px;border-radius:50% 50% 50% 0%;background-color:#4c9beb;display:inline-block;margin-left:-25px;z-index:5}.left-front{width:65px;height:65px;border-radius:50% 50% 0%;background-color:#4c9beb;display:inline-block;z-index:5}.right-back{width:50px;height:50px;border-radius:50% 50% 50% 0%;background-color:#4c9beb;display:inline-block;margin-left:-20px;z-index:5}.left-back{width:30px;height:30px;border-radius:50% 50% 0%;background-color:#4c9beb;display:inline-block;z-index:5}.sun{width:120px;height:120px;background:-webkit-linear-gradient(to right,#fcbb04,#fffc00);background:linear-gradient(to right,#fcbb04,#fffc00);border-radius:60px;display:inline;position:absolute}.sunshine{animation:sunshines 2s infinite}@keyframes sunshines{0%{transform:scale(1);opacity:.6}to{transform:scale(1.5);opacity:0}}@keyframes clouds{0%{transform:translate(15px)}50%{transform:translate(0)}to{transform:translate(15px)}}.containerSwitch{position:absolute;top:50px}.switch{font-size:13px;position:relative;display:inline-block;width:50px;height:24px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;right:0;bottom:0;left:0;background:white;border-radius:50px;overflow:hidden;transition:all .4s cubic-bezier(.215,.61,.355,1)}.slider:before{position:absolute;content:"";height:1.4em;width:1.4em;right:6px;bottom:3px;transform:translate(150%);background-color:#4580ba;border-radius:inherit;transition:all .4s cubic-bezier(.215,.61,.355,1)}.slider:after{position:absolute;content:"";height:1.4em;width:1.4em;left:6px;bottom:3px;background-color:#53388f;border-radius:inherit;transition:all .4s cubic-bezier(.215,.61,.355,1)}.switch input:focus+.slider{box-shadow:0 0 1px #59d102}.switch input:checked+.slider:before{transform:translateY(0)}.switch input:checked+.slider:after{transform:translate(-150%)}@media (width < 600px){.containerSwitch{top:20px}.switch{font-size:14px;width:55px;height:26px}}.input{z-index:5;position:relative;font-family:Lato,sans-serif;font-size:18px;font-weight:400;color:#4580ba;border:2px solid transparent;min-width:250px;height:32px;padding-left:.8em;outline:none;overflow:hidden;background-color:#f3f3f3;border-radius:50px;transition:all .5s}.input:hover,.input:focus{border:2px solid #4580BA;box-shadow:0 0 0 7px #4a9dec33;background-color:#fff}@media (width < 600px){.input{min-width:300px;height:40px}}.error{display:flex;position:absolute;left:calc(50% - 85px);width:170px;height:27px;padding:2px 4px;align-items:center;background:#ffffff;border-radius:15px;box-shadow:0 0 5px -3px #111;opacity:0;transform:translatey(-80%);transition:all .3s ease}.error__icon{width:20px;height:20px;transform:translateY(-2px);margin-right:8px}.error__icon path{fill:#fff}.error__title{font-weight:500;font-size:14px;color:#fff}.show.error{background:#ff0000;opacity:1;transform:translateY(0)}:root{font-family:Lato,sans-serif;font-weight:500}body{margin:0;height:100vh;background-color:#000}