.fog{position:relative;height:100vh;width:100%;background-color:#000}.mainContainer_phenomenon{position:absolute;height:100%;width:100%;overflow:hidden}.fog__img{position:absolute;height:100vh;width:300vw}.fog__img1{background:url(assets/img/fog-1.png) repeat-x;background-size:contain;background-position:50%;-webkit-animation:marquee 60s linear infinite;animation:marquee 60s linear infinite}.fog__img2{background:url(assets/img/fog-2.png) repeat-x;background-size:contain;background-position:50%;-webkit-animation:marquee 40s linear infinite;animation:marquee 40s linear infinite}@-webkit-keyframes marquee{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{-webkit-transform:translate3d(-200vw,0,0);transform:translate3d(-200vw,0,0)}}@keyframes marquee{0%{-webkit-transform:translateZ(0);transform:translateZ(0)}to{-webkit-transform:translate3d(-200vw,0,0);transform:translate3d(-200vw,0,0)}}.cloud{overflow:hidden;position:relative;width:100%;padding-bottom:56.25%;height:0;background-size:cover}.cloudcontent{position:relative;padding:30px;z-index:100}.cloud img{width:100%;height:100vh;left:0;top:0;position:absolute;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;pointer-events:none}@-webkit-keyframes animCloud{0%{-webkit-transform:translateX(100%)}to{-webkit-transform:translateX(-100%)}}@keyframes animCloud{0%{-webkit-transform:translateX(10%);-ms-transform:translateX(10%);transform:translateX(10%)}to{-webkit-transform:translateX(-10%);-ms-transform:translateX(-10%);transform:translateX(-10%)}}.cloud1{-webkit-animation:animCloud 20s linear infinite;animation:animCloud 20s linear infinite}.cloud2{-webkit-animation:animCloud 40s linear infinite;animation:animCloud 40s linear infinite}.cloud3{-webkit-animation:animCloud 60s linear infinite;animation:animCloud 60s linear infinite}.cloud4{-webkit-animation:animCloud 80s linear infinite;animation:animCloud 80s linear infinite}.mainContainer{margin:0;padding:0;width:100%;height:100vh;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:url(assets/img/city2.jpg);background-attachment:fixed;background-repeat:no-repeat;background-size:cover;position:relative}.frontendPart{position:absolute;top:0}.inputCity{width:90%;max-width:600px;position:relative;margin:20px auto}.inputCity #enterCity{width:100%;border-radius:10px;padding:1px 10px;line-height:2em;font-size:1.6em;background-color:#fac4e0;font-weight:400;border:1px solid #fac4e0;opacity:.7}.inputCity .inputCity__btn{cursor:pointer;width:45px;height:25px;background:url(assets/img/cloud_btn.png);background-size:cover;position:absolute;top:30%;right:2%}.dateInfo,.weatherContainer{font-size:2em;font-weight:700;text-shadow:#000 1px 1px 0,#000 -1px -1px 0,#000 -1px 1px 0,#000 1px -1px 0;color:#ecd5c9;text-align:center}.temp_container{-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:distribute;justify-content:space-around;-webkit-box-orient:horizontal;-ms-flex-direction:row;flex-direction:row}.temp_container,.temp_container .weatherAttributes_container{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-direction:normal}.temp_container .weatherAttributes_container{-webkit-box-orient:vertical;-ms-flex-direction:column;flex-direction:column}.temp_container .weatherAttributes_container .temp_container_label{font-size:.7em;margin:0}.weatherContainer .weatherContainer_temperature{font-size:3em;background-color:#fac4e0;border-radius:20px;opacity:.7;width:16vw;margin:auto}.weatherAttributes{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.weatherAttributes .weatherAttributes_container{margin:10px}.weatherAttributes .weatherAttributes_container .weatherAttributes_container__info{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;font-size:1.6em;font-weight:700;text-shadow:#000 1px 1px 0,#000 -1px -1px 0,#000 -1px 1px 0,#000 1px -1px 0;color:#ecd5c9;border-radius:100%;width:8vw;height:8vw;background-color:#fac4e0;opacity:.7}.weatherAttributes .weatherAttributes_container .weatherAttributes_container__label{font-size:1em;text-shadow:#000 1px 1px 0,#000 -1px -1px 0,#000 -1px 1px 0,#000 1px -1px 0;color:#ecd5c9;text-align:center}.footer{position:absolute;bottom:10px;font-size:.8em;text-shadow:#000 1px 1px 0,#000 -1px -1px 0,#000 -1px 1px 0,#000 1px -1px 0;color:#ecd5c9;left:5px;opacity:.7}.footer a{color:#7fffd4;text-decoration:none}.footer a:hover{color:#93ff64}#bg-img{width:99vw;height:99vh}@media screen and (max-width:1110px){.mainContainer{background:url(assets/img/city4.jpg);background-attachment:fixed;background-repeat:no-repeat;background-size:cover;position:relative}.inputCity{max-width:76vw;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding:0;margin-top:20px}.inputCity #enterCity{line-height:2em;font-size:2.6em}.inputCity .inputCity__btn{width:70px;height:40px;top:30%;right:3%}.dateInfo,.weatherContainer{font-size:4em}.weatherContainer .weatherContainer_temperature{font-size:3em;line-height:1em;width:40vw;opacity:.7}.footer{font-size:1.8em;text-align:center}.cloud{height:100vh;width:250vw}.weatherAttributes .weatherAttributes_container .weatherAttributes_container__info{width:20vw;height:20vw;font-size:3em;background-color:#fac4e0;opacity:.7}.weatherAttributes .weatherAttributes_container .weatherAttributes_container__label{font-size:2.2em}}