.station{display:grid;grid-template-columns:3fr 2fr 1fr 1fr;gap:.25em;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d}.station .well{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:.25rem}.station iframe{grid-column-start:span 4;width:100%;height:800px}.main-card{grid-row-start:span 2}.value-container{width:100%;margin:auto}.value-container .uv-value,.value-container .uv-level{font-size:1.5em}.uv-index-container{height:3px;background:linear-gradient(to right,#0f0,#ff0,orange,#d74646,#eb3feb)}.uv-index-dot{position:relative;top:50%;transform:translateY(-50%);border:1px solid black;border-radius:50%;background-color:#fff;width:10px;height:10px}.uv-info-text{font-weight:700;font-size:1em}.wind-info{display:grid}.compass-wrapper,.wind-direction-label,.arrow-wrapper{grid-column:1;grid-row:1}.arrow-wrapper svg{height:100%;width:100%}.wind-direction-label{font-size:1.5em;display:flex;justify-content:center;align-items:center;background:#fff;height:25px;width:fit-content;transform:translate(100%,300%)}.radiation-model{width:300px;height:150px;position:relative;text-align:center;color:#fff;font-size:22px;font-weight:600;border-radius:150px 150px 0 0;overflow:hidden;color:var(--fill);display:flex;align-items:flex-end;justify-content:center;box-sizing:border-box}.radiation-model:before,.radiation-model:after{content:"";width:300px;height:150px;border:50px solid var(--fill);border-top:none;position:absolute;transform-origin:50% 0% 0;border-radius:0 0 300px 300px;box-sizing:border-box;left:0;top:100%}.radiation-model:before{border-color:#00000026;transform:rotate(180deg)}.radiation-model:after{z-index:3;animation:1s fillGraphAnimation ease-in;transform:rotate(calc(1deg * (var(--percentage) * 1.8)))}.radiation-model:hover:after{opacity:.8;cursor:pointer}.temperature-container{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;flex-direction:row;justify-content:safe space-evenly;width:100%;height:90%;justify-items:center;align-items:safe center;font-size:.75em}.temperature-container .heatindex{color:#ad0000;font-size:1.5em}.temperature-container .windchill{color:#0000db;font-size:1.5em}.temperature-container .temperature{grid-column-start:span 3;font-size:2.5em}.grid-item-title{font-size:1.5em;margin-bottom:.5em}.two-col{grid-column:span 2}.temperature-label,.wind-label,.rain-label{font-size:1em}.temperature-value{font-size:5em}.temperature-value:after{font-size:.25em;content:"°F"}.wind-value{font-size:1.5em}.wind-value:after{font-size:.75em;content:" MPH"}.rain-value{font-size:1.5em}.rain-value:after{font-size:.75em;content:" in"}.rate:after{font-size:.75em;content:" in/hr"}.center{position:relative;top:40%;transform:translateY(-50%)}.humidity{font-size:3.5em}.dewpoint-container .temperature-value{font-size:4.5em}.radar{display:none}.radar img{zoom:.4;object-fit:none;object-position:20% 10%}
