@import url(https://fonts.googleapis.com/css2?family=Kalam:wght@300;400;700&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{font-family:Kalam,cursive}.App{text-align:center}.App-header{align-items:center;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);height:100vh;justify-content:center}.main{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background-color:hsla(0,0%,100%,.03);border:2px solid #fff;border-radius:30px;box-shadow:0 0 1rem 0 #f0f8ff;max-height:80%;max-width:700px;min-width:40%;overflow-y:scroll;padding:20px}.logo{pointer-events:none;width:60%}.heading p{color:#fff;font-size:20px}.heading>.Typewriter{color:#fff;font-size:40px}.fade-in{-webkit-animation:fadeInAnimation 1s ease-in forwards;animation:fadeInAnimation 1s ease-in forwards;opacity:0}@-webkit-keyframes fadeInAnimation{0%{-webkit-filter:blur(5px);filter:blur(5px);-webkit-transform:translateY(-50%);transform:translateY(-50%)}to{opacity:1}}@keyframes fadeInAnimation{0%{-webkit-filter:blur(5px);filter:blur(5px);-webkit-transform:translateY(-50%);transform:translateY(-50%)}to{opacity:1}}.input__container{align-items:center;background:hsla(0,0%,100%,.664);border-radius:22px;display:flex;gap:5px;justify-content:center;margin:25px auto 7px;max-width:60%;padding:10px 15px;position:relative;-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.shadow__input{background-color:#e6e6e6;background-image:radial-gradient(at 85% 51%,#c5c5c5 0,transparent 50%),radial-gradient(at 74% 68%,#9c9ca0 0,transparent 50%),radial-gradient(at 64% 79%,silver 0,transparent 50%),radial-gradient(at 75% 16%,#bfbcc0 0,transparent 50%),radial-gradient(at 90% 65%,#696e6c 0,transparent 50%),radial-gradient(at 91% 83%,#050405 0,transparent 50%),radial-gradient(at 72% 91%,#9c9999 0,transparent 50%);border-radius:20px;bottom:0;content:"";-webkit-filter:blur(5px);filter:blur(5px);height:100%;left:0;position:absolute;width:100%;z-index:-1}.input__button__shadow{align-items:center;background:none;border:none;border-radius:12px;cursor:pointer;display:flex;justify-content:center;padding:5px;transition:background .4s,-webkit-transform .4s;transition:transform .4s,background .4s;transition:transform .4s,background .4s,-webkit-transform .4s}.input__button__shadow:hover{background:hsla(0,0%,100%,.411)}.input__search{border:none;border-radius:20px;font-size:17px;outline:none;padding:8px;position:relative;width:100%}.btn-main{border-radius:22px;color:#000;font-size:23px;margin-bottom:7px;margin-top:5px;max-width:50%;padding:5px 15px;text-decoration:none}.heading .heading-main{color:#fff;font-size:50px;margin:20px}.copyright{bottom:0;color:#fff;position:absolute}.suggest-div{background:hsla(0,0%,100%,.664);border-radius:22px;font-size:20px;left:0;position:absolute;top:105%;width:100%}.suggest-sub-div{border-radius:22px;cursor:pointer;margin:5px}.suggest-sub-div:hover{background-color:#fff}@media (max-width:550px){.main{max-width:80%}.logo{width:73%}.input__container{max-width:80%}.App-header{height:92vh}.heading>.Typewriter{font-size:30px}.heading p{font-size:16px}.btn-main{font-size:20px;max-width:80%}}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-thumb{background:linear-gradient(transparent,#fff);border-radius:10px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(transparent,#dddcdc)}.main-weather{-webkit-animation:mainWeather 1s linear;animation:mainWeather 1s linear;margin-bottom:60px}@-webkit-keyframes mainWeather{0%{width:0}}@keyframes mainWeather{0%{width:0}}.heading-weather{color:#fff}.heading-weather .sub-head-weather{font-size:40px;line-height:.8}.heading-weather .sub-head-weather span{font-size:20px;margin-top:0}.weather-main-div{display:grid;grid-template-columns:repeat(auto-fit,minmax(50%,1fr))}.weather-main-div .div1 span{display:block}.weather-main-div .div1 span:nth-child(2){-webkit-transform:translateY(-8px);transform:translateY(-8px)}.weather-main-div .div2{align-items:center;display:inline-block;font-size:40px;white-space:nowrap}.weather-main-div .div2 span{cursor:pointer;display:inline-block;font-size:20px}.weather-info-main{margin-bottom:20px}.weather-info-div p{margin:0;white-space:nowrap}.weather-info-div{display:grid;grid-template-columns:repeat(auto-fit,minmax(50%,1fr));justify-content:space-between;margin:auto;width:100%}.weather-info-main .weather-info-head{font-size:27.5px;margin:0;text-decoration:underline}.aqi-div-cover{padding-top:17px}.aqi-div-cover>p{margin:0}@media (max-width:550px){.main-weather{margin-bottom:35px;width:80%}.weather-main-div .div1 span:nth-child(2){-webkit-transform:translateY(-3px);transform:translateY(-3px)}.weather-main-div .div2{font-size:30px}.weather-main-div .div2 span{font-size:18px}.weather-info-div{margin-bottom:17.5px;margin-top:17.5px}.weather-info-main .weather-info-head{margin-bottom:-10px}}