@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@500&display=swap);@import url(https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap);.container{position:absolute;width:100%;height:820px;top:0;left:0;z-index:-1;overflow:hidden;background:rgba(0,0,0,.1);background-repeat:no-repeat;background-size:cover;background-position:50%;transition:.4s}.container .cloud.one{background-color:#cecece;width:150px;height:50px;border-radius:100px;position:absolute;top:20%;left:-105%;opacity:.5;z-index:10;box-shadow:5px 5px 15px 5px rgba(0,0,0,.55)}.container .cloud.one:after,.container .cloud.one:before{content:"";position:absolute;display:inline-block;background:inherit;border-radius:inherit;box-shadow:11px -15px 15px -9px rgba(0,0,0,.55)}.container .cloud.one:after{width:50px;height:50px;top:-30px;left:30px}.container .cloud.one:before{width:65px;height:65px;top:-40px;left:70px}.container .cloud.two{background-color:#cecece;width:259px;height:69px;border-radius:100px;position:absolute;top:15%;left:-100%;opacity:.5;z-index:-1;box-shadow:5px 5px 15px 5px rgba(0,0,0,.55)}.container .cloud.two:after,.container .cloud.two:before{content:"";position:absolute;display:inline-block;background:inherit;border-radius:inherit;box-shadow:11px -15px 15px -9px rgba(0,0,0,.55)}.container .cloud.two:after{width:105px;height:105px;top:-65px;left:59px}.container .cloud.two:before{width:90px;height:90px;top:-38px;left:148px}.container .cloud.three{background-color:#cecece;width:518px;height:138px;border-radius:200px;position:absolute;top:5%;left:-200%;opacity:.5;z-index:-2;box-shadow:5px 5px 15px 5px rgba(0,0,0,.55)}.container .cloud.three:after,.container .cloud.three:before{content:"";position:absolute;display:inline-block;background:inherit;border-radius:inherit;box-shadow:11px -15px 15px -9px rgba(0,0,0,.55)}.container .cloud.three:after{width:210px;height:210px;top:-130px;left:118px}.container .cloud.three:before{width:180px;height:180px;top:-76px;left:296px}.container .cloud.four{background-color:#cecece;width:148px;height:39.42px;border-radius:100px;position:absolute;top:25%;left:-200%;opacity:.5;z-index:3;box-shadow:5px 5px 15px 5px rgba(0,0,0,.55)}.container .cloud.four:after,.container .cloud.four:before{content:"";position:absolute;display:inline-block;background:inherit;border-radius:inherit;box-shadow:11px -15px 15px -9px rgba(0,0,0,.55)}.container .cloud.four:after{width:60px;height:60px;top:-38px;left:76px}.container .cloud.four:before{width:51.42px;height:51.42px;top:-29px;left:31px}.container .cloud.five{background-color:#cecece;width:397px;height:130px;border-radius:200px;position:absolute;top:80%;left:-200%;opacity:.5;z-index:4;box-shadow:5px 5px 15px 5px rgba(0,0,0,.55)}.container .cloud.five:after,.container .cloud.five:before{content:"";position:absolute;display:inline-block;background:inherit;border-radius:inherit;box-shadow:11px -15px 15px -9px rgba(0,0,0,.55)}.container .cloud.five:after{width:165px;height:165px;top:-106px;left:34px}.container .cloud.five:before{width:128px;height:128px;top:-76px;left:176px}.container .cloud.six{background-color:#cecece;width:150px;height:70px;border-radius:200px;position:absolute;top:40%;left:-200%;opacity:.5;z-index:5;box-shadow:5px 5px 15px 5px rgba(0,0,0,.55)}.container .cloud.six:after,.container .cloud.six:before{content:"";position:absolute;display:inline-block;background:inherit;border-radius:inherit;box-shadow:11px -15px 15px -9px rgba(0,0,0,.55)}.container .cloud.six:after{width:40px;height:40px;top:-24px;left:34px}.container .cloud.six:before{width:69px;height:69px;top:-44px;left:63px}.container .cloud.seven{background-color:#cecece;width:518px;height:138px;border-radius:200px;position:absolute;top:50%;left:-200%;opacity:.5;z-index:6;box-shadow:5px 5px 15px 5px rgba(0,0,0,.55)}.container .cloud.seven:after,.container .cloud.seven:before{content:"";position:absolute;display:inline-block;background:inherit;border-radius:inherit;box-shadow:11px -15px 15px -9px rgba(0,0,0,.55)}.container .cloud.seven:after{width:210px;height:210px;top:-130px;left:118px}.container .cloud.seven:before{width:180px;height:180px;top:-76px;left:296px}.container .layer{position:absolute;width:100%;height:100%}.container .layer.back{z-index:-2}.container .layer.middle{z-index:-1}.container .layer.front{z-index:0}.container .fogbank{-moz-filter:blur(10px);-o-filter:blur(10px);-ms-filter:blur(10px);filter:blur(5px)}.container .fogbank.back{z-index:-2;background-color:#fff;height:50%;opacity:.3}.container .fogbank.middle{background-color:#fff;z-index:-1;height:45%;opacity:.2}.container .fogbank.front{z-index:0;background-color:#fff;height:30%;opacity:.1}.container .lightning{position:absolute;top:0;width:100%;height:100%;z-index:2;opacity:.5}*{padding:0;box-sizing:border-box}*,body{margin:0}body{font-family:Roboto,sans-serif}#app{background-position:top;transition:.4s;position:relative;z-index:0}#app .load{position:absolute;width:100vw;height:100vh;background:rgba(0,0,0,.664);z-index:5;display:flex;justify-content:center;align-items:center}#app .load .loader{border:10px solid #f3f3f3;border-top:10px solid #0f213e;border-radius:50%;width:100px;height:100px;-webkit-animation:spin .9s linear infinite;animation:spin .9s linear infinite}@-webkit-keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}main{height:100%;padding:25px;background-image:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.5));z-index:2}.search-box{width:100%;margin-bottom:20px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}.search-box .country-select,.search-box .search-bar{text-align:center;width:100%;max-width:500px;padding:15px;color:#313131;font-size:20px;font-weight:400;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;outline:none;background:none;box-shadow:0 0 8px rgba(0,0,0,.25);background-color:hsla(0,0%,100%,.5);border-radius:25px;transition:.4s}.search-box .country-select{padding:5px;font-size:15px;font-weight:700}.search-box .country-select option{max-width:100%;font-size:12px;white-space:break-spaces}::-moz-placeholder{color:#1f1f1f;font-weight:700;font-family:Roboto,sans-serif}:-ms-input-placeholder{color:#1f1f1f;font-weight:700;font-family:Roboto,sans-serif}::placeholder{color:#1f1f1f;font-weight:700;font-family:Roboto,sans-serif}.search-box .country-select:focus,.search-box .search-bar:focus{box-shadow:0 0 16px rgba(0,0,0,.25);background-color:hsla(0,0%,100%,.75)}.location-box .location{color:#fff;font-size:40px;font-weight:500;text-align:center;text-shadow:1px 3px rgba(0,0,0,.25)}.location-box .date{font-size:20px;font-style:italic}.location-box .date,.weather-box{color:#fff;text-align:center}.weather-box .temp{display:inline-block;padding:10px 25px;font-size:102px;background-color:rgba(65,65,65,.25);border-radius:16px;margin:15px auto;box-shadow:3px 6px rgba(0,0,0,.25)}.weather-box .temp,.weather-box .weather{color:#fff;font-weight:700;text-shadow:3px 6px rgba(0,0,0,.25)}.weather-box .weather{display:block;font-size:45px}.location-box .icon{display:flex;justify-content:center;align-items:center;color:#fff}.location-box .icon img{filter:drop-shadow(0 0 5px #fff)}.location-box .icon .day-night{font-size:30px;font-weight:500}.weather-extra,.weather-extra .bottom,.weather-extra .top{display:flex}.weather-extra{max-width:500px;flex-direction:column;align-items:center;justify-content:center;margin:20px auto}.weather-extra h6{font-size:28px;text-shadow:3px 3px rgba(0,0,0,.25)}.weather-extra .bottom,.weather-extra .top{justify-content:space-around;width:95%;margin:10px 0}.message{text-align:center}.message h2{color:#fff;text-shadow:9px 4px 1px rgba(0,0,0,.25);font-size:39px;font-family:Montserrat,sans-serif}