/* F4 brookmere pages styles */
body { margin: 0 auto; padding: 20px 10px; font-family: sans-serif; font-size: 95%; max-width: 1024px; }
h1 { font-size: 1.6em; background-color: #fdf9b7; padding: 10px 10px; margin: -20px -10px 10px -10px; }
h1.split { display: grid; grid-template-columns: auto auto; }
h1.split .right { text-align: right; }
h1.split .button { font-size: 75%; }
h1 a { text-decoration: none; }
h2 { padding-bottom: 1px; border-bottom: 1px dashed #bbb; }
input[type=submit] { padding: 0 1em; }
#debug { background-color: #eee; padding: 10px 0; margin: 1em 0; }
#debug .line { font-family: monospace; white-space: pre; }
.error { font-weight: normal; color: #e00; }
#options input[type=text] { width: 20px; }
.b { font-weight: bold; }
#reload { text-align: center; }
.stack { display: inline-block; }
.footer { margin-top: 2em; padding: 1em 0; border-top: 1px dashed #bbb; }
img.photo { display: block; margin: 2em auto; max-width: 100%; height: auto; }
/* Weather */
.current div,
.forecast div { }
.current div span,
.forecast div span { /* padding-right: 2px; */ }
.current div i.fa,
.forecast div i.fa { width: 18px; text-align: center; }
.current .temp .v { font-size: 1.7em; }
/* Forecast */
.forecast .day { margin-bottom: 1em; }
.forecast .dayname { margin: 0 0 1em 0; }
.forecast .narrative { margin: 0; }
.forecast .fcdetail { display: grid; grid-template-columns: 2.5em auto; column-gap: 18px; }
.forecast .fcdetail.night { background-color: #f0f0f0; }
.forecast .fcdetail > div { padding: 2px 0; position: relative; }
.forecast .fcdetail .icon {  width: 2.5em; height: 3em; }
.forecast .fcdetail .icon img { width: 100%; }
.forecast .fcdetail .icon .temp { position: absolute; bottom: 2px; right: -10px; font-size: 80%; text-shadow: 0 0 2px #eef;}
.forecast .fcdetail .text { padding: 4px 0; }
.forecast .icongrid3 { display: inline-grid; margin: 2px 0; grid-template-columns: 1em minmax(125px, auto) auto; column-gap: 8px; align-items: center; }
.forecast .icongrid4 { display: inline-grid; margin: 2px 0; grid-template-columns: 1em minmax(125px, auto) auto auto; column-gap: 8px; align-items: center; }
.forecast .icongrid > div { }
/* Cams */
.camblock { margin: 1em auto; text-align: center; }
.camblock img { max-width: 99%; height: auto; }
a.replay { display: inline-block; margin-left: 0.75em; font-size: 85%; }
.hwycam { display: inline-block; border: 1px solid #ccc; background-color: #e8e8e8; }
.hwycam .caption { padding: 2px 0; }
.hwycam .fa { margin-right: 3px; }
/* AQI */
.pawidget { width: 280px; margin: 1em auto; overflow: hidden; /* prevents horiz scroll bar */ }
/* Media queries */
@media (prefers-color-scheme: dark) {
    body { background: #222; color: #eee; }
    h1 { color: #333; }
    a { color: cadetblue; }
    .forecast .fcdetail.night { background-color: #444; }
}
/* use body max-width instead
@media screen and (min-width: 1025px) {
    body { margin: 0 15%; }
}
*/