*{margin:0;padding:0;box-sizing:border-box;font-family:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif}body{position:relative;background:url(..//img/bg.baed364f5c2b9f709d38.webp) no-repeat center/cover !important;min-height:100vh;display:flex;justify-content:center;align-items:center}body h1{font-size:28px !important;color:#199cc1 !important;font-weight:500 !important;text-align:center}h2{display:flex;justify-content:center;font-size:26px;color:#c33c58;font-weight:500;margin:15px 0 15px !important}h2 span{padding-left:10px}.attr{position:absolute;bottom:15px;left:15px;background:rgba(0,0,0,.5);color:#fff;padding:10px;border-radius:15px;font-size:18px}.attr a{color:#1dd1a1;text-decoration:none}.attr a:hover{text-decoration:underline}.wrapper{position:absolute;z-index:555;max-width:1050px;display:flex;width:1050px}.container{background:#fafafa;padding:20px;border-radius:10px;box-shadow:0 5px 25px rgba(0,0,0,.5);width:100%}.container .search-box{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:5px;margin:10px 0;width:100%}.container .search-box :where(input,button){flex-grow:1;flex-shrink:0;border-radius:10px;padding:.5em;transition:.3s}.container .search-box input{font-size:16px;border:1px solid #bbb;outline:none;transition:.3s}.container .search-box input:focus{border-color:#1dd1a1;box-shadow:0 0 5px #1dd1a1}.container .search-box button{display:flex;align-items:center;justify-content:center;border:1px solid #f3bb76;background:#f3bb76;cursor:pointer}.container .search-box button:hover{background:#ffa972;border-color:#ffa972;color:#fff}.container .weather-details{flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;height:400px;overflow-y:auto}.container .weather-details.active{display:flex}.container .weather-details .grid{display:grid;grid-template-columns:1fr 1fr 2fr;gap:10px;grid-row-start:row1-start;grid-row-end:2}.container .weather-details .temperature{display:flex;justify-content:center;align-items:center;flex-direction:column;background:#f6eadb;box-shadow:0 5px 10px rgba(0,0,0,.1);border-radius:10px;max-width:210px}.container .weather-details .temperature .temperatureTxt{display:flex;justify-content:center;align-items:center;font-size:52px;font-weight:800;letter-spacing:-2px;color:#199cc1;margin-bottom:0}.container .weather-details .temperature .temperatureTxt svg{margin-top:-20px}.container .weather-details .info{display:flex;flex-direction:column;justify-content:center;align-items:center;max-width:210px;box-shadow:0 5px 10px rgba(0,0,0,.1);padding:10px;border-radius:10px;background:#ace7f9}.container .weather-details .info li{display:flex;align-items:center;gap:10px;padding-left:0;position:relative}.container .weather-details .city-map{max-width:600px;display:flex;border-radius:10px}.container .daily-cards{display:flex;justify-content:flex-start;align-items:center;overflow-x:auto;padding:15px;gap:10px}.container .daily-cards::-webkit-scrollbar{height:10px}.container .daily-cards::-webkit-scrollbar-thumb{background:#bbb;border-radius:75px}.container .daily-cards .card{width:180px;display:flex;justify-content:center;align-items:center;flex-direction:column;box-shadow:0 5px 10px rgba(0,0,0,.5);padding:10px;border-radius:10px;background:#fafafa}.container .daily-cards .card p{margin:3px 0}.container .daily-cards .card .temp{display:flex;align-items:center}.container .daily-cards .card .temp svg{width:16px;height:16px}.container .daily-cards .card .temps{display:flex;justify-content:space-between;align-items:center;width:100%}.errTxt{color:#dc3545;font-size:20px;font-weight:500}.currDate,.currTime,#weather-condition-name{color:#199cc1;font-weight:700}.currTime{position:absolute;width:100%;height:25px;text-align:center;top:16px}#weather-condition-name{font-size:18px;margin-bottom:0}.humidity{display:inline-flex;align-items:center;width:100%}.humidity .imgbx{width:64%;height:64px;background:url(..//img/humidity.e11b2f5b3c042971acc5.svg) no-repeat left top}.forecast7{font-size:22px;margin-top:35px !important;margin-bottom:5px !important}.sb-search{position:relative;margin-top:10px;width:100%;min-width:380px;height:60px;transition:width .3s}.sb-search-input{position:absolute;top:0;right:0;border:none;outline:none;background:#fff;width:100%;height:60px;margin:0;z-index:10;padding:20px 65px 20px 20px;font-family:inherit;font-size:20px;color:#2c3e50;border:1px solid #c33c58}input[type=search].sb-search-input{border-radius:10px}.sb-search-input::-webkit-input-placeholder{color:#efb480}.sb-search-input:-moz-placeholder{color:#efb480}.sb-search-input::-moz-placeholder{color:#efb480}.sb-search-input:-ms-input-placeholder{color:#efb480}.sb-icon-search,.sb-search-submit{width:60px;height:60px;display:block;position:absolute;right:0;top:0;padding:0;margin:0;line-height:60px;text-align:center;cursor:pointer}.sb-search-submit{background:#fff;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);opacity:0;color:rgba(0,0,0,0);border:none;outline:none;z-index:555}.sb-icon-search{color:#fff;background:#c33c58;z-index:90;font-size:22px;font-family:"icomoon";speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;border-radius:0 10px 10px 0}.sb-icon-search svg{margin-top:14px}.sb-search.sb-search-open,.no-js .sb-search{width:100%}.sb-search.sb-search-open .sb-icon-search,.no-js .sb-search .sb-icon-search{background:#da6d0d;color:#fff;z-index:11}.sb-search.sb-search-open .sb-search-submit,.no-js .sb-search .sb-search-submit{z-index:90}.mapPopup p,.mapPopup h2{padding:0 0 3px 0;color:#000;margin:0 !important}.mapPopup h2{font-size:18px;text-transform:capitalize}.extended{max-width:100%;display:flex;flex-direction:column}@media screen and (max-width: 1049px){.wrapper{width:90%;box-sizing:border-box}}@media screen and (max-width: 767px){.wrapper{margin:0 20px;width:100%;box-sizing:border-box}#result{font-size:16px}}@media screen and (max-width: 649px){.container .weather-details .temperature{margin-left:0}#weather-condition-name{font-size:16px}.sb-search{min-width:300px}.attr{width:100%;bottom:0;left:0;border-radius:0;text-align:center}}@media screen and (max-width: 559px){.container{width:auto;max-width:100%}.container .weather-details .grid{display:flex;flex-direction:column;align-items:center}.container .weather-details .temperature{padding:10px 0 0;width:100%;max-width:100%}.container .weather-details .info{margin:15px 0 0 0;max-width:100%;width:100%}.container .weather-details .info li{gap:5px}.container .weather-details .city-map{margin:15px 0 0 0;max-width:100%;width:100%;height:300px}}