html,body{margin:0;padding:0;box-sizing:border-box;font-family:"Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif}.header,.footer{display:flex;align-items:center;padding:0 16px;background-color:#616161;color:#fff}.header{grid-area:header}.footer{grid-area:footer}.grid-container{display:grid;grid-template-columns:1fr;grid-template-rows:50px 1fr 0 50px;grid-template-areas:'header' 'main' 'config' 'footer'}.config{grid-area:config;height:0;overflow:hidden}.config.enabled{height:auto;}.config .content{display:flex;flex-direction:column;padding:50px;background-color:#c9c9c9}.main{grid-area:main;background-color:#c9c9c9}.main-header{margin:20px;padding:20px;background-color:#e3e4e6;color:slategray}.main-kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));grid-auto-rows:130px;grid-gap:15px;margin:20px}.kpicard{display:flex;align-items:center;background-color:#fff;flex-direction:row;padding:10px;justify-content:space-evenly}.kpicard-content{display:flex;align-items:center;justify-content:space-between;flex-direction:column;flex:1;padding:5px 10px}.kpicard-title{font-size:1.2em;color:#4e4d4d}.kpicard-icon{background-color:rgb(75,75,75);color:#fff;border-radius:50%;width:50px;height:50px;display:inline-flex;align-items:center;justify-content:center;font-size:25px}.kpicard-value{font-size:1.6em;font-weight:700}.kpicard-time{font-size:1em}.kpicard-normals{padding-top:5px;font-size:.8em;color:#4e4d4d}.kpicard-normals .low{fill:#8585f7}.kpicard-normals .high{fill:#f59292}.kpicard-normals text{font-size:10px;text-anchor:middle;alignment-baseline:hanging}.main-cards{column-count:1;column-gap:20px;margin:20px}@media only screen and (min-width:65.625em){.main-cards{column-count:1}}.card{display:flex;flex-direction:column;width:100%;height:450px;background-color:#82bef6;margin-bottom:20px;-webkit-column-break-inside:avoid;box-sizing:border-box}.card__header{display:flex;align-items:center;justify-content:space-between;height:50px;background-color:#616161;color:#FFF;padding:0 15px}.card__main{display:flex;background-color:#fff;flex:1;flex-direction:column;padding:3px 3px;overflow:auto}.card.events{height:600px}.card.wxchart{height:600px}.card.wxchart .card__main svg{width:100%;height:100%;cursor:pointer}.card.wxchart svg path{stroke-width:1}.card.wxchart .lastDayLine{fill:none;stroke:#d5202a;stroke-width:2}.card.wxchart .templine{fill:none;stroke:#d5202a;stroke-width:2}.card.wxchart .tempbar{fill:#6b6767;stroke:#6b6767}.card.wxchart .tempmax{fill:#ef8a62;stroke:#ef8a62}.card.wxchart .tempnormal{fill:#a1d76a;stroke:#a1d76a}.card.wxchart .tempmin{fill:#67a9cf;stroke:#67a9cf}.card.wxchart .feelslikeline{fill:none;stroke:#ac54a0;stroke-width:2}.card.wxchart .dewpointline{fill:none;stroke:#5b9f49;stroke-width:2}.card.wxchart .cloudcoverline{fill:none;stroke:#8b8b8b}.card.wxchart .cloudcoverarea{stroke:none;fill-opacity:.1;fill:#8b8b8b}.card.wxchart .precipline{fill:none;stroke:#15aadc}.card.wxchart .preciparea{fill:#15aadc;stroke:#15aadc;fill-opacity:.1}.card.wxchart .snowline{stroke:#ac54a0}.card.wxchart .snowarea{fill:#ac54a0;stroke:#ac54a0;fill-opacity:.1}.card.wxchart .humidityline{fill:none;stroke:#87c404;stroke-width:1}.card.wxchart .windline{fill:none;stroke:brown}.card.wxchart .windarea{fill:brown;stroke:brown;fill-opacity:.9}.card.wxchart .windgust{stroke:rgb(226,223,25);fill:rgb(226,223,25);fill-opacity:.9}.card.wxchart .pressureline{fill:none;stroke:#1e2023}.card.wxchart .event{stroke:#e96c19;fill:#e96c19;fill-opacity:.1}.card.wxchart .sunrise{stroke:none;fill:#f3f3f3}.card.wxchart .sunset{stroke:none;fill:#f3f3f3}.card.wxchart .hi-lite .background{stroke:#7e7e7e;fill:#7e7e7e;opacity:.4}.card.wxchart .filterhilite .background{stroke:#7e7e7e;fill:#efefef}.card.wxchart .hi-lite text{text-anchor:middle;alignment-baseline:hanging;font-size:.6em}.card.wxchart .hi-lite .datetime{font-size:.9em;font-weight:700}.card__main .astrolabel{font-size:10px;text-anchor:middle;alignment-baseline:hanging}.card__main svg{flex:1}.time-axis .tick line{fill:none;stroke:#e0e0e0}.time-axis path.domain,.y-axis path.domain{fill:none;stroke:none}.time-axis path.domain{fill:none;stroke:none}.eventsTable{height:50%}.eventsTable tbody{display:block;height:100%;overflow:auto}.eventsTable .event{cursor:pointer}.eventsTable .event:hover{background-color:rgb(230,230,230)}.stationsTable{height:50%}.stationsTable tbody{display:block;height:100%;overflow:auto}.stationsTable .station{cursor:pointer}.stationsTable .station:hover{background-color:rgb(230,230,230)}.map{height:50%}.link{cursor:pointer;color:rgb(100,100,100);border-bottom:1px dotted darkgrey}.link:hover{color:darkgray;border-bottom:1px dotted darkgrey}.filter .close{color:rgba(41,109,138,.6);font-size:18px;font-weight:700;z-index:10;overflow:visible;padding:2px;height:10px;cursor:pointer}.filter .close:hover{color:rgba(1,98,138,.6);text-decoration:none}.wxstation{text-transform:capitalize}.header .link{color:#fff;cursor:pointer;border:0 none #fff;border-bottom:1px dotted #fff;padding:5px 5px 1px 5px;margin:0 10px 0 10px}.link,a{cursor:pointer;color:rgba(1,98,138,1);text-decoration:none}@media (max-width:800px){.hideless800{display:none}}.adcontainer{margin:25px;text-align:center}.probdistro .kpicard-value{flex:1;width:100%;max-width:800px}.probdistro rect{fill:lightblue;stroke:0;cursor:pointer}.probdistro .label{fill:#fff;font-size:14px;text-anchor:middle}.probdistro .yearlabel{fill:rgb(75 75 75);font-size:14px;text-anchor:middle}