/* Talas Bus Park - redesign 2021 (flat, mobile first). Old style: old.css */
:root{--red:#c8281e;--red2:#a51f17;--yel:#f2b705;--blue:#1d5fa6;--ink:#22262b;--mut:#6b7178;--bg:#f1f2f4;--card:#fff;--line:#dfe2e6;--green:#2d8a3e;--wint:#1d6fb8;
--hd:"Roboto Condensed","Arial Narrow",Arial,sans-serif;--tx:"Open Sans",Arial,"DejaVu Sans",sans-serif}
*{box-sizing:border-box}
html{background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font:15px/1.6 var(--tx)}
a{color:var(--blue)}
.wrap{max-width:1140px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.ic{width:28px;height:28px;flex:none}
.ic.sm{width:16px;height:16px;vertical-align:-3px}
/* top line, header, nav */
.topline{background:var(--ink);color:#c9ccd1;font-size:12px}
.topline .wrap{display:flex;justify-content:space-between;gap:12px;padding-block:5px;flex-wrap:wrap}
.topline a{color:#fff;text-decoration:none}
.topline b{font-weight:600;margin-left:8px;color:#9aa0a6}
.topline b.on{color:#fff;border-bottom:2px solid var(--yel)}
.hd{background:var(--card);border-bottom:1px solid var(--line)}
.hd .wrap{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:12px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);min-width:0}
.brand b{display:block;font:700 24px/1.1 var(--hd);text-transform:uppercase;letter-spacing:.02em}
.brand small{display:block;color:var(--mut);font-size:12px;line-height:1.3}
.call{background:var(--yel);color:var(--ink);text-decoration:none;padding:6px 14px;border-radius:4px;text-align:right;flex:none}
.call small{display:block;font-size:11px}
.call b{font:700 22px/1 var(--hd)}
.nav{background:var(--red);position:sticky;top:env(safe-area-inset-top,0px);z-index:5}
.nav .wrap{display:flex;align-items:center;flex-wrap:wrap}
.nav a{color:#fff;text-decoration:none;padding:12px 12px;font:700 15px var(--hd);text-transform:uppercase;letter-spacing:.03em}
.nav a:hover,.nav a.on{background:var(--red2)}
.navq{margin-left:auto}
.navq input{width:96px;border:0;border-radius:3px;padding:6px 8px;font:inherit;font-size:14px}
.mbtn{display:none}
.season{background:var(--card);border-bottom:1px solid var(--line);font-size:13px}
.season .wrap{display:flex;align-items:center;gap:10px;padding-block:7px;flex-wrap:wrap}
#ttnow{font:700 12px var(--hd);letter-spacing:.08em;color:#fff;padding:3px 8px;border-radius:3px;border:0;background:var(--green)}
#ttnow.winter{background:var(--wint)}
#ttnow small{display:none}
.sn{margin-left:auto;color:var(--red);text-decoration:none;font-weight:600}
/* page */
.main{padding-block:22px 40px}
h1{font:700 30px/1.15 var(--hd);margin:4px 0 14px;text-wrap:balance}
h2{font:700 22px/1.2 var(--hd);margin:30px 0 12px;text-transform:uppercase;letter-spacing:.02em}
h3{font-size:16px;margin:6px 0}
h4{font-size:14px;margin:4px 0}
.crumb{font-size:13px;color:var(--mut);margin:0 0 6px}
.sm{font-size:13px;color:var(--mut)}
small{color:var(--mut)}
.red{color:var(--red)}
/* hero and finder */
.hero{background:var(--red);color:#fff;border-radius:6px;padding:22px;display:grid;gap:16px}
.hero h1{color:#fff;font-size:34px;margin:0}
.hero p{margin:4px 0 0;opacity:.9}
.finder{background:var(--card);color:var(--ink);border-radius:6px;padding:14px;display:grid;gap:6px}
.finder label{font-weight:600;font-size:13px;color:var(--mut)}
.finder select{width:100%;font:inherit;padding:10px;border:1px solid var(--line);border-radius:4px;background:#fff;color:var(--ink)}
.finder button{margin-top:8px;background:var(--yel);border:0;border-radius:4px;padding:12px;font:700 16px var(--hd);text-transform:uppercase;cursor:pointer;color:var(--ink)}
#fres:empty{display:none}
.fbox{background:var(--card);color:var(--ink);border-radius:6px;padding:12px 16px}
.fbox ul{margin:6px 0;padding-left:20px}
/* tiles */
.tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:18px 0}
.tile{background:var(--card);border-radius:6px;padding:14px;text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:2px;border-bottom:3px solid transparent}
.tile:hover{border-bottom-color:var(--red)}
.tile .ic{color:var(--red);margin-bottom:6px}
.tile b{font:700 17px var(--hd);text-transform:uppercase}
.tile span{font-size:13px;color:var(--mut)}
.rtiles{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.rt{display:flex;align-items:center;gap:10px;background:var(--card);border-radius:6px;padding:8px;text-decoration:none;color:var(--ink);min-width:0}
.rt b{flex:none;width:48px;height:40px;display:grid;place-items:center;border-radius:4px;font:700 20px var(--hd)}
.rt span{font-size:12px;line-height:1.3;min-width:0}
.rt-b b{background:var(--blue);color:#fff}
.rt-m b{background:var(--yel);color:var(--ink)}
.rt-all b{background:var(--ink);color:#fff;font-size:16px}
.cols2{display:grid;gap:0 30px}
.nl{list-style:none;padding:0;margin:0}
.nl li{padding:8px 0;border-bottom:1px solid var(--line)}
.nl time,.nw time,.d{display:inline-block;font-size:12px;font-weight:700;color:var(--red);margin-right:8px}
.nw{padding:8px 0;border-bottom:1px solid var(--line)}
.nw h3{margin:0}
.nw p{margin:4px 0;font-size:14px}
/* tables and route pages */
table.list,table.info,table.grid{border-collapse:collapse;width:100%;margin:8px 0;background:var(--card)}
table.list th{background:var(--ink);color:#fff;text-align:left;padding:8px 10px;font:700 13px var(--hd);text-transform:uppercase;letter-spacing:.03em}
table.list td{border-bottom:1px solid var(--line);padding:8px 10px;vertical-align:top}
table.list tr.off td{color:#9aa0a6}
table.info th{text-align:left;width:34%;padding:8px 10px;border-bottom:1px solid var(--line);color:var(--mut);font-weight:600;vertical-align:top}
table.info td{padding:8px 10px;border-bottom:1px solid var(--line)}
td.c{text-align:center}
.rn{display:inline-block;min-width:30px;text-align:center;font:700 14px var(--hd);text-decoration:none;padding:3px 5px;margin:2px 1px;border-radius:3px}
.rb{background:var(--blue);color:#fff!important}
.rm{background:var(--yel);color:var(--ink)!important}
.big{font-size:26px;padding:4px 12px;border-radius:4px;vertical-align:middle}
.note{background:#fff7dc;border-left:4px solid var(--yel);padding:10px 14px;margin:10px 0}
.note.snow{background:#e7f1fb;border-left-color:var(--wint)}
.alert{background:#fde9e7;border-left:4px solid var(--red);padding:10px 14px;margin:12px 0}
.tt{background:var(--card);border-radius:6px;margin:12px 0;padding:10px 14px;border:2px solid transparent}
.tt .cur{display:none;background:var(--green);color:#fff;font-size:11px;padding:2px 6px;border-radius:3px;margin-left:6px;vertical-align:middle}
.tt.now{border-color:var(--green)}
.tt.now .cur{display:inline}
.tt.notnow{opacity:.6}
.two{display:grid;gap:12px}
table.grid th{width:36px;background:var(--bg);border:1px solid var(--line);font:700 13px var(--hd)}
table.grid td{border:1px solid var(--line);padding:3px 6px;font-size:13px;word-spacing:4px;font-variant-numeric:tabular-nums}
.notice{background:var(--card);border-radius:6px;padding:12px 14px;margin:10px 0}
.notice p{margin:6px 0 0}
.old{background:#9aa0a6;color:#fff;font-size:11px;padding:1px 6px;border-radius:3px}
tr.claimed td{text-decoration:line-through;color:#9aa0a6}
.info2{background:var(--card);border-radius:6px;padding:4px 16px}
.mapwrap{background:var(--card);border-radius:6px;overflow:auto}
.map{width:100%;height:auto;display:block;min-width:620px}
.legend .lg{display:inline-block;margin:2px 10px 2px 0}
.legend i{display:inline-block;width:18px;height:4px;vertical-align:middle;margin-right:4px}
.hist li{margin:6px 0}
/* footer */
.ft{background:var(--ink);color:#c9ccd1;font-size:13px}
.ft .wrap{display:grid;gap:16px;padding-block:24px}
.ft b{color:#fff}
.ft a{color:#c9ccd1}
.ft-n{font-size:12px;color:#9aa0a6;border-top:1px solid #3a3f45;padding-top:12px}
/* version for the visually impaired */
html.vi body{font-size:20px;background:#fff;color:#000}
html.vi .tile,html.vi .rt,html.vi .notice,html.vi .tt{border:2px solid #000}
html.vi a{color:#000;text-decoration:underline}
/* wider screens */
@media (min-width:700px){
 .tiles{grid-template-columns:repeat(4,1fr)}
 .rtiles{grid-template-columns:repeat(3,1fr)}
 .two{grid-template-columns:1fr 1fr}
 .finder{grid-template-columns:auto 1fr auto 1fr auto;align-items:center;gap:10px}
 .finder button{margin-top:0}
}
@media (min-width:980px){
 .hero{grid-template-columns:1fr 2fr;align-items:center}
 .hero #fres{grid-column:1/-1}
 .rtiles{grid-template-columns:repeat(4,1fr)}
 .cols2{grid-template-columns:1fr 1fr}
 .ft .wrap{grid-template-columns:1.3fr 1fr 1fr}
 .ft-n{grid-column:1/-1}
}
@media (max-width:860px){
 .mbtn{display:block;width:100%;text-align:left;border:0;background:var(--red2);color:#fff;padding:12px max(16px,env(safe-area-inset-left,0px));font:700 15px var(--hd);text-transform:uppercase;position:sticky;top:0;z-index:6}
 .nav{display:none;position:static}.nav.open{display:block}
 .nav .wrap{flex-direction:column;align-items:stretch}
 .nav a{border-bottom:1px solid var(--red2)}
 .navq{margin:8px 0}
 .navq input{width:100%}
 .brand b{font-size:19px}
 .brand small{display:none}
 .call b{font-size:18px}
 h1{font-size:25px}
 .hero h1{font-size:27px}
 .sn{margin-left:0}
}
