#todays-weather-wrapper{flex-direction:column;gap:30px;display:flex}.todays-weather-container{box-sizing:border-box;background-image:url(/bg-today-large.svg);border-radius:10px;justify-content:space-between;align-items:center;width:100%;max-width:800px;height:287px;padding:20px;display:flex}#todays-weather-information{flex-direction:column;gap:10px;display:flex}#todays-weather-place{font-size:28px;font-weight:700}#todays-weather-date{color:#aeaeb7;font-size:18px}.todays-temperature{font-size:100px;font-style:italic;font-weight:700}.todays-temperature span{box-sizing:border-box;padding-left:10px;font-style:normal}#todays-weather-img{width:125px;height:125px}.todays-weather-temperature{align-items:center;gap:15px;display:flex}#todays-weather-details{justify-content:space-between;width:100%;display:flex}.details{box-sizing:border-box;background-color:#312f4b;border-radius:10px;flex-direction:column;justify-content:space-evenly;width:183px;height:118px;padding-left:15px;font-size:30px;display:flex}.details-title{font-size:20px}
#daily-forecast-title{margin-bottom:20px;font-weight:700}#days{justify-content:space-between;display:flex}.day{box-sizing:border-box;background-color:#272541;border:1px solid #312f4b;border-radius:10px;flex-direction:column;justify-content:space-between;align-items:center;width:100%;max-width:100px;height:165px;padding:10px;display:flex}.weather-img{height:60px;display:flex}.days-temperatures{flex-direction:row;justify-content:space-between;align-self:normal;display:flex}.high-temperature{color:#fff}.low-temperature{color:#aeaeb7}
.main-section{flex-direction:column;gap:45px;width:100%;max-width:800px;display:flex}
#error-container{flex-direction:column;justify-content:center;align-items:center;gap:20px;display:flex}#error-img{width:40px}#error-title{font-size:53px;font-weight:700}#error-description{text-align:center;width:500px}#error-retry-button{cursor:pointer;background-color:#3d3b5e;border-radius:10px;justify-content:center;align-items:center;gap:10px;width:98px;height:45px;display:flex}
#no-result{text-align:center;font-size:28px;font-weight:700}
#search-in-progress{align-items:center;gap:10px;height:50px;padding-left:10px;display:flex}
.top-nav{flex-direction:column;justify-content:center;align-items:center;width:100%;display:flex}.top-wrapper{justify-content:space-between;width:100%;margin-bottom:90px;display:flex}#title{margin-bottom:60px;font-size:50px;font-weight:700}#search-wrapper{justify-content:center;gap:10px;width:100%;height:57px;margin-bottom:45px;display:flex}#search-text{background-color:#312f4b;border:3px solid #03012d;border-radius:8px;outline:3px solid #03012d;flex-direction:row;justify-content:space-between;align-items:center;width:528px;padding:12.5px;display:flex}#search-text input{color:#fff;background-color:#312f4b;border:none;width:100%;padding-left:10px;font-size:20px;font-weight:700}::placeholder{color:#fff;opacity:1}#search-text:has(input:focus){border:3px solid #03012d;outline:3px solid #fff}#search-input{cursor:pointer;outline:none}#search-button{box-sizing:border-box;cursor:pointer;background-color:#4455da;border:3px solid #03012d;border-radius:8px;outline:3px solid #03012d;justify-content:center;align-items:center;width:100%;max-width:115px;display:flex}#search-button:active{outline:3px solid #4455da}#search-container{display:inline;position:relative}#results-window{box-sizing:border-box;background-color:#312f4b;border-radius:8px;flex-direction:column;gap:3px;width:100%;max-width:556px;padding:5px;display:flex;position:absolute;top:63px;right:0}.search-result{cursor:pointer;box-sizing:border-box;border-radius:8px;align-items:center;height:40px;padding-left:10px;display:flex}.search-result:hover{background-color:#3d3b5e}#units-container{background-color:#3d3b5e;border:2px solid #03012d;border-radius:10px;justify-content:center;width:120px;height:45px;display:flex;position:relative}.units-container-active{outline:2px solid #fff}#units-wrapper{cursor:pointer;flex-direction:row;justify-content:center;align-items:center;gap:10px;display:flex}#units-dropdown{z-index:1;box-sizing:border-box;cursor:pointer;background-color:#312f4b;border:1px solid #3d3b5e;border-radius:10px;width:220px;padding:5px;position:absolute;top:55px;right:0}.unit-title{color:#aeaeb7;padding-left:5px;font-size:15px}.unit-choice{box-sizing:border-box;border:1px solid #312f4b;border-radius:10px;justify-content:space-between;padding:15px 5px;display:flex}.unit-choice:hover{box-sizing:border-box;background-color:#3d3b5e}.active-unit{background-color:#3d3b5e}.unit-choice:active{outline:1px solid #fff}
#side-section{box-sizing:border-box;background-color:#272541;border-radius:20px;flex-direction:column;gap:15px;width:383px;display:flex;position:relative}#hourly-forecast{justify-content:space-between;align-items:center;padding:20px 25px 0;display:flex}#hourly-forecast-title{font-size:20px;font-weight:700}#day-wrapper{position:relative}#active-day-wrapper{box-sizing:border-box;cursor:pointer;background-color:#3d3b5e;border-radius:10px;justify-content:center;gap:10px;width:120px;padding:7.5px;display:flex;position:relative}#active-day-drop-down{box-sizing:border-box;background-color:#312f4b;border:1px solid #3d3b5e;border-radius:10px;flex-direction:column;justify-content:space-between;width:212px;height:314px;padding:7px 5px;display:flex;position:absolute;top:45px;right:0}.day-choice{cursor:pointer;border-radius:10px;align-items:center;height:40px;padding-left:8px;display:flex}.day-choice:hover{background-color:#3d3b5e}#list-of-hours-container{flex-direction:column;justify-content:space-evenly;gap:15px;height:590px;padding:0 25px;display:flex;overflow-y:scroll}.forecast-hour{box-sizing:border-box;background-color:#312f4b;border:1px solid #3d3b5e;border-radius:10px;justify-content:space-between;align-items:center;height:60px;padding:15px;display:flex}.forecast-hour-wrapper{align-items:center;gap:10px;font-weight:600;display:flex}.forecast-hour-weather{width:30px}.degree{font-weight:600}
.todays-weather-container-loading{box-sizing:border-box;background-color:#312f4b;border-radius:10px;justify-content:center;align-items:center;width:100%;max-width:800px;height:287px;padding:20px;display:flex}.details-loading{box-sizing:border-box;background-color:#312f4b;border-radius:10px;flex-direction:column;justify-content:space-evenly;width:183px;height:118px;padding-left:15px;font-size:30px;display:flex}#side-section-loading{box-sizing:border-box;background-color:#272541;border-radius:20px;flex-direction:column;gap:15px;width:383px;display:flex;position:relative}#list-of-hours-container-loading{flex-direction:column;justify-content:space-evenly;gap:15px;height:590px;padding:0 25px;display:flex;overflow-y:scroll}.forecast-hour-loading{background-color:#312f4b;border:1px solid #3d3b5e;border-radius:10px;justify-content:space-between;align-items:center;height:60px;padding:28.5px;display:block}
#container{flex-direction:column;width:100%;max-width:1217px;padding-top:23px;display:flex}#sections{gap:30px;display:flex}
@media (max-width:1050px){#container{max-width:375px;padding-top:0}.top-wrapper{box-sizing:border-box;margin-bottom:41px;padding-left:15px;padding-right:15px}#logo{width:140px}#units-container{width:90px;height:30px}#units-wrapper{gap:5px}#units{font-size:14px}#units-img{width:14px}#units-dropdown-img{width:12px}#wrapper{flex-direction:column;align-items:center;display:flex}#title{text-align:center;width:300px;margin-bottom:41px}#search-wrapper{box-sizing:border-box;flex-direction:column;align-items:center;gap:6px;height:100%;margin-bottom:27px}#search-text{box-sizing:border-box;width:351px;height:59px}#search-button{box-sizing:border-box;flex-direction:row;width:351px;max-width:100%;height:59px}.main-section{justify-content:center;align-items:center;max-width:375px}#todays-weather-wrapper{box-sizing:border-box;align-items:center;width:100%}.todays-weather-container{background-image:url(/bg-today-small.svg);background-repeat:no-repeat;flex-direction:column;justify-content:center;align-items:center;max-width:345px;padding-top:40px;padding-bottom:40px}#todays-weather-details{flex-wrap:wrap;justify-content:center;gap:20px}.details{width:162px}#daily-forecast{flex-direction:column;width:100%;max-width:345px;display:flex}#days{flex-wrap:wrap;gap:20px}#sections{flex-direction:column;align-items:center}#side-section{width:345px}.todays-weather-container-loading{max-width:345px}.details-loading{width:162px}#side-section-loading{width:345px}}