@import"https://fonts.googleapis.com/css?family=Open Sans:400,400i,700";.fontawesome-weather-icons{width:320px;margin:50px auto}.fontawesome-weather-icons ul{list-style-type:none;padding-left:0;border-radius:3px;background-color:rgba(149,175,192,.075)}.fontawesome-weather-icons ul li{padding:5px 6px;font-size:.8em;display:flex;align-items:center}.fontawesome-weather-icons ul li:nth-child(even){background-color:rgba(149,175,192,.2)}.fontawesome-weather-icons ul li span{width:90%;display:inline-block}.fontawesome-weather-icons ul li i[class*=fa-]{font-size:1rem}.weather-wrap{container:weather-wrapper/inline-size;overflow:hidden}.weather{display:flex;text-align:center;background:linear-gradient(to bottom, #284563, #3f5877);color:#fff;border-radius:5px;font-size:1rem;font-weight:normal}.weather__current{display:flex;flex-grow:10;align-items:center;font-size:1.1em;padding:.5em .45em;justify-content:space-around;max-width:43.75rem}.weather__current-location{width:5.25rem;flex-grow:1;text-align:center;flex-direction:column;font-size:1em !important;color:#fff !important;margin:0;font-weight:400}.weather__current-state{font-size:12px;display:block}.weather__current-temp{font-size:1.6em}.weather__current-conditions{width:5.25rem;height:5rem;justify-content:center;flex-grow:1;display:-webkit-box;display:-ms-flexbox;display:flex;flex-direction:column;text-align:center}.weather__current-conditions-temp{font-size:1.6em;padding-left:4px;font-weight:600}.weather__current-conditions-conditions{font-size:.8em;color:#3e3e3e;max-width:12.5rem;padding:0 1px;margin:0 auto;color:#fff}.weather__current-icon{text-align:center;width:5.25rem;-webkit-box-flex:0;-ms-flex-positive:0;flex-grow:1}.weather__current-icon i[class^=fa-]{font-size:2.2em}.weather__forecast{-webkit-box-flex:30;-ms-flex-positive:30;flex-grow:30;font-size:.9em;text-align:center;display:flex;-webkit-box-pack:justify;justify-content:space-between}.weather__forecast-day{padding:.6em .3em;width:14.2857%;display:flex;flex-direction:column;align-items:center}.weather__forecast-day:nth-child(odd){background-color:rgba(255,255,255,.075)}.weather__forecast-day-title{text-transform:capitalize}.weather__forecast-day-title--abbrv{display:none}.weather__forecast-day-icon{margin:.6em 0;width:2.1875rem;height:2.1875rem}.weather__forecast-day-icon div{width:2.1875rem;height:2.1875rem;position:relative;overflow:hidden;margin:0 auto;font-size:1.6em}.weather__forecast-day-temps{width:85%;display:flex;flex-direction:row;justify-content:space-around;flex-grow:1}.weather__forecast-day-temps>div{width:50%;text-align:center}@container weather-wrapper (max-width: 1000px){.weather__forecast-day-title--full{display:none}.weather__forecast-day-title--abbrv{display:block}}@container weather-wrapper (max-width: 728px){.weather{display:flex;flex-direction:column;text-decoration:none}.weather__current{max-width:100%}.weather__forecast{flex-grow:12;font-size:.9em;text-align:center;display:flex;justify-content:space-between}.weather__forecast-day-temps{display:flex;flex-direction:column;text-align:center}.weather__forecast-day-temps div{width:100%;text-align:center}}@container weather-wrapper (max-width: 400px){.weather{display:flex;flex-direction:column;text-decoration:none}.weather__current{display:block;overflow:auto}.weather__current-location{width:100%}.weather__current-conditions{float:left;width:50%;margin-right:0px}.weather__current-icon{float:left;width:50%;text-align:center;height:auto;min-height:5rem;display:flex;flex-direction:column;justify-content:center;align-items:center}.weather__forecast{flex-grow:12;font-size:.9em;text-align:center;display:flex;flex-direction:column;justify-content:space-between}.weather__forecast-day{flex-direction:row;padding:.2em .2em .2em .6em;width:100%}.weather__forecast-day-title{text-transform:capitalize;width:41%;text-align:left}.weather__forecast-day-title--full{display:block}.weather__forecast-day-title--abbrv{display:none}.weather__forecast-day-temps{flex-direction:row;justify-content:space-around;flex-grow:1;width:auto}.weather__forecast-day-temps div{width:50%;text-align:center}}