*,*::after,*::before{margin:0;padding:0;box-sizing:inherit}html{font-size:62.5%}body{box-sizing:border-box;background:linear-gradient(180deg, #002947 0%, rgba(56,144,207,0.79) 100%)}body{font-family:"Ubuntu", sans-serif;font-weight:300;font-size:1.6rem;color:#fff}@media only screen and (max-width: 54.5em){body{font-size:1.3rem}}.header{font-size:7rem;text-shadow:0px 0.4rem 0.4rem rgba(0,0,0,0.25)}@media only screen and (max-width: 54.5em){.header{font-size:4rem}}#weather-sections-wrapper{height:100%;width:100%;animation:fadeIn 2s ease-in, roolIn 1.5s ease-in}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes roolIn{0%{transform:translateY(-100%)}100%{transform:translateY(0)}}.main-positioner{width:35rem;margin:0 auto}@media only screen and (max-width: 75em){.main-positioner{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}}@media only screen and (max-width: 54.5em){.main-positioner{width:26rem}}.main{text-align:center;align-self:center;flex:1}@media only screen and (max-width: 75em){.main{position:relative;width:100%}}.main .openbtn{position:absolute;top:1.5rem;left:2rem;color:#fff;text-decoration:none;font-size:2.5rem;display:none}@media only screen and (max-width: 54.5em){.main .openbtn{display:inline}}.main__box1{position:relative;margin-bottom:2rem;word-wrap:break-word}.main__box1--icon{position:absolute;right:-25%;top:-40%;height:11rem;width:11rem}@media only screen and (max-width: 54.5em){.main__box1--icon{height:6rem;width:6rem;right:-10%}}.main__box1--paragraph{font-size:1.9rem}@media only screen and (max-width: 54.5em){.main__box1--paragraph{font-size:1.4rem}}.main__box2{display:flex;align-items:center}.main__box2 div{padding:1rem}@media only screen and (max-width: 54.5em){.main__box2--minMax{text-align:left}}.main__box3{display:flex;justify-content:stretch}.main__box3 .weather-info{flex:1;text-align:center;border-left:1px solid rgba(212,237,255,0.2);line-height:3rem}@media only screen and (max-width: 54.5em){.main__box3 .weather-info{line-height:2rem}}.main__box3 .weather-info--bold{display:block;font-weight:400}.main__box3 .weather-info:last-child{border-right:1px solid rgba(212,237,255,0.2)}.rightAside{margin:4rem;max-width:30rem;display:flex;flex-direction:column;justify-content:stretch}@media only screen and (max-width: 75em){.rightAside{margin:0;max-width:100%}}.rightAside__date{font-size:2.8rem;margin-bottom:5rem;text-align:center}@media only screen and (max-width: 75em){.rightAside__date{display:none}}.rightAside__forcast{background-color:rgba(212,237,255,0.2);flex:1}.rightAside__forcast--list{display:flex;justify-content:stretch;flex-direction:column;height:100%;list-style-type:none}@media only screen and (max-width: 75em){.rightAside__forcast--list{flex-direction:row;min-height:25rem}}@media only screen and (max-width: 54.5em){.rightAside__forcast--list{min-height:21rem}}.rightAside__forcast--list:last-child{border-bottom:1px solid rgba(212,237,255,0.2)}.rightAside__forcast--listItem{display:flex;flex-direction:column;flex-wrap:wrap;border:1px solid rgba(212,237,255,0.2);border-bottom:none;padding:1rem;flex:1;flex-basis:20%}@media only screen and (max-width: 75em){.rightAside__forcast--listItem{text-align:center}}.rightAside__forcast--day{font-weight:400}.rightAside__forcast--date{flex-basis:30%}@media only screen and (max-width: 54.5em){.rightAside__forcast--date{flex-basis:20%}}.rightAside__forcast--icon>img{flex-grow:1;width:5rem}@media only screen and (max-width: 54.5em){.rightAside__forcast--icon>img{width:4rem}}.rightAside__forcast--minMax{display:flex;flex-direction:column;justify-content:center;flex-grow:1}*:focus{outline:none}@media only screen and (max-width: 54.5em){.leftAside{width:0;z-index:1}}.leftAsideBox{display:flex;flex-direction:column;align-items:center;justify-content:center;width:323px;height:100%;position:relative;background-color:rgba(255,255,255,0.23)}@media only screen and (max-width: 54.5em){.leftAsideBox{margin-left:-323px;background:linear-gradient(180deg, #5a8bad 0%, #6DA7D0 100%);transition:0.5s}}.leftAsideBox .closebtn{position:absolute;top:1.5rem;right:2rem;color:#fff;text-decoration:none;font-size:4rem;display:none}@media only screen and (max-width: 54.5em){.leftAsideBox .closebtn{display:inline}}.leftAsideBox__image{position:absolute;width:323px;height:323px;left:0px;top:170px}.leftAsideBox__image img{position:absolute;width:192.96px;height:213.28px;left:65px;top:79px}.leftAsideBox__form{display:flex;flex-direction:column;justify-content:space-around;position:absolute;width:224px;height:128px;left:50px;top:479px}.leftAsideBox__chooseCity{position:relative;top:0;left:0}.leftAsideBox__chooseCity--input{display:block;width:100%;height:40px;text-align:center;background-color:#d5edff;border:none;box-shadow:0px 2px 4px rgba(0,0,0,0.25);border-radius:5px}.leftAsideBox__chooseCity--button{position:absolute;top:25%;right:10%;background-color:transparent;border:none;cursor:pointer}.leftAsideBox__findCity{display:flex;flex-direction:column;align-items:center;justify-content:center}.leftAsideBox__findCity--label{color:rgba(0,0,0,0.78);line-height:35px}.leftAsideBox__findCity--button{position:relative;top:0;left:0;background-color:#002947;height:40px;width:100%;border:none;box-shadow:0px 2px 4px rgba(0,0,0,0.25);border-radius:5px;color:#fff;cursor:pointer}.leftAsideBox__findCity--button img{position:absolute;display:block;top:25%;right:10%;width:22px;height:22px}.no-connection{position:absolute;width:20em;height:2rem;top:15%;text-align:center;color:#002947;background-color:#FFFFFF;border:1px solid rgba(255,255,255,0.24);border-radius:5px}@media only screen and (max-width: 75em){.no-connection{top:-30%}}.redAlert{color:red;font-size:1.4rem}#weather-sections-wrapper{display:flex;justify-content:stretch;min-height:100vh}#right-side-wrapper{display:flex;justify-content:stretch;width:100%}@media only screen and (max-width: 75em){#right-side-wrapper{flex-direction:column}}.loading{position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.loading__image{margin:1em}.hidden{animation:fadeOut 1s;animation-fill-mode:forwards}.loading__bar{display:flex;align-items:center;width:88px;height:8px;background-color:#fff;border-radius:10px;overflow:hidden}.loading__bar--status{width:95%;height:100%;background-color:rgba(0,60,103,0.24);border-radius:10px;animation:load 2s infinite linear}@keyframes load{0%{transform:translateX(-100px)}100%{transform:translateX(100px)}}@keyframes fadeOut{100%{opacity:0;visibility:hidden}}

