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