:root{--primary-color: #41b883;--cts-color: #e63236;--cts-color-dark: #b3292b;--separator-color: #ccc;--input-border: 3px solid #ccc;--border-radius: .5rem;--focus-color: var(--primary-color);--a-textcolor: #444;--a-bgcolor: #0c8ad3;--a-bgcolor-hover: #169fee;--a-bordercolor: #ccc;--button-padding: .35rem .7rem;--input-padding: .6rem .7rem}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background:#eee}.app{display:flex;flex-direction:column;min-height:100vh}main{flex-grow:1;font-size:1rem}main h2{background:var(--cts-color);color:#fff;padding:.5rem;margin:1rem 0 0;display:flex;font-size:2rem;align-items:center}a:focus,button:focus{outline:3px solid var(--focus-color)}.error{color:#c00;padding:1rem;font-size:1.25rem}.error span{display:block;font-size:4rem}main ul{list-style:none;padding:0;margin:1rem 0}main .stop,main .line{padding:.25rem 1rem;display:flex;align-items:center}main .stop a,main .line a{flex-grow:1;display:flex;min-height:2rem;line-height:2.5rem;font-size:1.25rem;text-decoration:none;padding:.5rem 1rem;color:var(--a-textcolor);border-radius:var(--border-radius);background-color:#fff;align-items:center}main .stop a:hover,main .stop a:focus,main .stop a:active,main .line a:hover,main .line a:focus,main .line a:active{background-color:var(--a-bgcolor-hover);color:#fff;border-color:#fff}.lineref{display:inline-block;padding:.5rem;min-width:1.5rem;min-height:1.5rem;max-width:1.5rem;max-height:1.5rem;line-height:1.5rem;border:1px solid transparent;border-radius:50%;text-align:center;margin-left:.5rem;font-weight:700}.back{text-decoration:none;text-align:center;color:#fff;border:2px solid #fff;border-radius:50%;height:2rem;width:2rem;background:transparent;min-width:2rem;outline:0;margin:0 1rem;padding:.25rem;display:grid;place-content:center}.back:active,.back:focus{background:#fff;color:var(--cts-color)}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}header{font-size:1.25rem;background:#eee}header a{text-decoration:none}header h1{font-size:2rem;margin:0;color:#666;text-align:center;padding-top:.5rem}header h1 a{color:#666;border-radius:var(--border-radius)}header h1 span{color:var(--cts-color)}header nav{margin:.5rem 1rem 0}header nav ul{list-style:none;display:flex;justify-content:space-between;margin:0;padding:0;gap:.5rem}header nav ul li{flex-basis:33%;display:flex;text-align:center}header nav ul li a{background:var(--a-bgcolor);border-radius:var(--border-radius);outline:0;flex-grow:1;color:#fff;padding:.5rem;display:flex;align-items:center;justify-content:center;border-bottom:4px solid transparent}header nav ul li a:hover,header nav ul li a:active,header nav ul li a.router-link-exact-active{background-color:var(--cts-color);border-bottom:4px solid var(--cts-color-dark)}footer{text-align:center;padding:.5rem;margin-top:1rem;font-size:.75rem}footer a{color:var(--primary-color)}.lds-center{text-align:center}.lds-ellipsis{display:inline-block;position:relative;width:64px;height:64px;margin:auto}.lds-ellipsis div{position:absolute;top:27px;width:11px;height:11px;border-radius:50%;background:var(--cts-color);animation-timing-function:cubic-bezier(0,1,1,0)}.lds-ellipsis div:nth-child(1){left:6px;animation:lds-ellipsis1 .6s infinite}.lds-ellipsis div:nth-child(2){left:6px;animation:lds-ellipsis2 .6s infinite}.lds-ellipsis div:nth-child(3){left:26px;animation:lds-ellipsis2 .6s infinite}.lds-ellipsis div:nth-child(4){left:45px;animation:lds-ellipsis3 .6s infinite}@keyframes lds-ellipsis1{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes lds-ellipsis3{0%{transform:scale(1)}to{transform:scale(0)}}@keyframes lds-ellipsis2{0%{transform:translate(0)}to{transform:translate(19px)}}.fav{border:0;color:orange;background:#fefefe;border-radius:50%;border:2px solid transparent;display:grid;place-content:center;margin:0;line-height:2rem;width:3rem;height:3rem;padding:0;margin-left:.5rem;outline:0}.fav:focus,.fav:active,.fav:hover{outline-color:#ff8c00}.fav.ok{background:orange;color:#fff}.seeall{text-align:center}.seeall button{min-height:2rem;line-height:2.5rem;text-decoration:none;font-size:1.25rem;padding:var(--button-padding);border:2px solid var(--a-bordercolor);color:var(--a-textcolor);border-radius:var(--border-radius)}main .msg{display:flex;padding:0 1rem;margin-bottom:.5rem}main .refreshdate{padding:1rem 1rem 0 0;margin:0;color:#666;font-size:.75rem;text-align:right}main .inputs{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;margin:.5rem 1rem;max-width:100vw}main .search svg{flex-shrink:0;color:var(--cts-color);margin-left:.25rem}main .q{font-size:inherit;padding:var(--input-padding);min-height:1.5rem;min-width:0;flex-basis:100%;border:var(--input-border);border-radius:var(--border-radius);-webkit-appearance:none;-moz-appearance:none;appearance:none;flex-shrink:1}main .q:focus{outline-color:var(--focus-color)}main .geo{text-align:center;display:flex;flex-direction:column}main .geo button{display:grid;grid-template-columns:auto auto;line-height:2rem;flex-grow:1;font-size:inherit;border:2px solid var(--input-border);color:var(--cts-color);padding:var(--button-padding);border-radius:var(--border-radius);cursor:pointer;background:#fff}.routetype{margin:0 1rem 0 .5rem;padding:0 1rem 0 .5rem;border-right:1px solid #ccc}.twitter-flux{margin:1rem}main .monitoring{margin:1rem;padding:1rem;display:grid;background:#fff;border-radius:var(--border-radius);align-items:center;grid-template-areas:"vehicle lineref destination arrival-estimate";grid-template-columns:32px 50px auto auto;max-width:100%}main .vehicle,main .lineref{place-self:center}main .delay{color:#ff8c00;margin-left:auto;grid-area:delay}main .arrival-estimate{grid-area:arrival-estimate;display:flex;flex-direction:column}main .arrival{font-size:1.5rem;color:#444;text-align:right}main .estimate{margin-left:auto;color:#999;font-size:1rem}main .destination{margin-left:.5rem;font-size:1.25rem;grid-area:destination}@media (max-width: 480px){main .monitoring{margin:1rem 0}main .estimate{display:none}}.timetable{background:#fff;margin:1rem;width:calc(100vw - 2rem);border-radius:var(--border-radius)}.timetable td{padding:.5rem}.timetable th{padding:1rem .5rem;font-size:1.25rem}.timetable tr{border-bottom:1px solid var(--separator-color)}.timetable .arr,.timetable .dep{text-align:right}h3{margin:2rem 1rem 1rem;font-size:2rem;text-align:center}.directions{text-align:center;font-size:1.5rem;background-color:#ccc;padding:1rem;margin:1rem;border-radius:var(--border-radius)}
