body,html{background:linear-gradient(135deg,#0f2027,#203a43,#2c5364)}.nav_section{flex-direction:column;justify-content:center;align-items:center;display:flex}.nav_heading{color:#4fc3f7;font-size:42px}.nav_input-box{border:1px solid #b0bec5;border-radius:30px;justify-content:space-between;align-items:center;width:50%;padding:10px;display:flex;position:relative}.nav_search-box{align-items:center;gap:5px;display:flex}.search_icon{color:#b0bec5;width:20px;height:20px}.nav_input-box input{color:#b0bec5;background:0 0;border:none;outline:none;font-size:16px}.nav_input-btn{cursor:pointer;background-color:#4fc3f7;border:1px solid #4fc3f7;border-radius:30px;padding:6px 10px;font-size:14px;transition:all 1s;position:absolute;bottom:6px;right:5px}.nav_input-btn:hover{color:#4fc3f7;background-color:#0000;border:1px solid #4fc3f7}.weather_section{background-image:url(/assets/img-2-W3hSxcQi.jpg);background-size:cover;border-radius:40px;justify-content:space-between;align-items:center;width:75%;height:300px;margin:40px auto;padding:10px 30px;display:flex}.city_name{color:#4fc3f7;align-items:center;gap:2px;margin-bottom:3px;display:flex}.city_name h4{margin:0;font-size:26px}.weather_box-1 h1{color:#eceff1;margin:0 0 3px;font-size:100px}.weather_box-1 p{color:#eceff1;margin:0;font-size:20px;font-weight:500}.icon-location,.icon-cloud{width:20px;height:20px}.weather_box-2{flex-direction:column;align-items:center;display:flex}.icon-cloud{color:#4fc3f7;fill:#4fc3f7;width:130px;height:130px}.weather_box-2 h4{color:#eceff1;margin:0;font-size:18px}.card_section{align-items:center;gap:50px;margin:30px;display:flex}.card_box{background:#f5f5f50c;border-radius:15px;flex:1;padding:20px}.card_box h1{color:#b0bec5;font-size:20px;font-weight:400}.card_box span{color:#4fc3f7}.card_box p{color:#eceff1}.hourly_section{background:#f5f5f50c;border-radius:15px;flex-direction:column;gap:20px;margin:30px;padding:20px;display:flex}.hourly_heading{justify-content:space-between;align-items:center;display:flex}.hourly_title{align-items:center;gap:5px;display:flex}.hourly_title h3{color:#b0bec5}.time-icon{color:#4fc3f7;width:25px;height:25px}.hourly_heading p{color:#4fc3f7}.hourly_box-container{color:#eceff1;justify-content:space-around;align-items:center;display:flex}.hourly_box{flex-direction:column;align-items:center;gap:10px;display:flex}.hourly_box p{margin:0}.weekly_section{background:#f5f5f50c;border-radius:15px;margin:30px;padding:20px}.weekly_section h3{color:#b0bec5}.weekly_container{gap:20px;display:grid}.weekly_box{color:#eceff1;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);cursor:pointer;background:#f5f5f507;border-radius:14px;justify-content:space-between;align-items:center;padding:0 30px;transition:transform .3s;display:flex}.app-component{opacity:0;animation:.8s forwards fadeIn;transform:translateY(10px)}@keyframes fadeIn{to{opacity:1;transform:translateY(0)}}@media (width<=1024px){.nav_heading{font-size:32px}.nav_input-box{width:70%;padding:10px}.nav_input-btn{font-size:14px;bottom:6px;right:5px}.weather_section{width:80%;height:200px;padding:10px 30px}.city_name h4{font-size:25px}.weather_box-1 h1{font-size:70px}.weather_box-1 p{font-size:18px;font-weight:300}.icon-location{width:20px;height:20px}.icon-cloud{width:100px;height:100px}.weather_box-2 h4{font-size:15px}.card_section{grid-template-columns:repeat(2,1fr);gap:20px;margin:30px;display:grid}.card_box h1{font-size:18px}.card_box p{font-size:14px}.hourly_section{margin:30px}.hourly_title h3{font-size:18px}.time-icon{width:17px;height:17px}.hourly_heading p{font-size:14px}.hourly_box{gap:5px}.hourly_box p{font-size:14px}.weekly_section{margin:20px 30px 30px}.weekly_section h3{font-size:18px}.weekly_container{gap:15px}.weekly_box{padding:0 10px;font-size:small}}@media (width<=640px){.nav_heading{font-size:22px}.nav_input-box{width:90%;padding:8px}.nav_input-btn{font-size:10px;bottom:6px;right:5px}.weather_section{width:80%;height:150px;padding:10px 20px}.city_name h4{font-size:20px}.weather_box-1 h1{font-size:40px}.weather_box-1 p{font-size:16px;font-weight:300}.icon-location{width:15px;height:15px}.icon-cloud{width:80px;height:80px}.weather_box-2 h4{font-size:12px}.card_section{grid-template-columns:repeat(1,1fr);gap:15px;margin:10px;display:grid}.card_box h1{font-size:16px}.card_box p{font-size:12px}.hourly_section{margin:10px}.hourly_title h3{font-size:15px}.time-icon{width:15px;height:15px}.hourly_heading p{font-size:10px}.hourly_box{gap:5px}.hourly_box p{font-size:10px}.weekly_section{margin:20px 5px 5px}.weekly_section h3{font-size:16px}.weekly_container{gap:10px}.weekly_box{padding:0 10px;font-size:x-small}}