:root { --green-sea: 79,212,180; --peter-river: 52,152,219; --peter-river-light: 78,184,255; --sea-foam: 37,222,216; --dark-blue: 4,84,165; --darker-blue: 0,75,156; --belize-hole: 41,128,185; --wet-asphalt: 52,73,94; --midnight-blue: 44,62,80; --freezing-blue: 97,176,254; --mountain-purple: 117,91,151; --success: 51,204,0; --vitamin-c: 255,153,0; --goldfish: 254,176,97; --that-sunday: 255,211,39; --that-sunday-light: 256,253,238; --pink-martini: 220,53,69; --ehaaf: 254,97,97; --sri-sooktham: 225,78,78; --danger: 220,53,69; --danger-dark: 168,46,58; --danger-white: 253,245,246; --danger-clouds: 235,231,232; --origin: 19,194,106; --destination: 254,97,98; --off-white: 237,240,241; --clouds: 231,235,236; --silver: 193,198,201; --concrete: 142,158,159; --dell-gray: 115,125,126; --asbestos: 88,91,92; --darker: 63,66,67; --darkest: 48,51,52; --a-grey: 187,187,187; --tab-fill: 217,220,221; --tab-fill-hover: 255,255,255; --active-sign-dark-grey: 112,112,112; --travel-time-sign-blue: 0,84,165; --blank-sign-grey: 165,165,165; --no-data-sign: 61,61,61; --theme-opacity: 1; --filter-effect-media: saturate(150%) blur(20px); --filter-effect-controls: saturate(150%) blur(10px); --filter-effect-dialogs: saturate(150%) blur(1.5px); --gap: 0.75rem; --border-radius: 0.25rem; --event-icon-size: 2.5rem; --border-width: 1px; --smaller: 0.875rem; --smallest: 0.75rem; --shadow-sm: 0 0.125rem 0.25rem 0 rgba(var(--darkest), 0.25); --shadow-md: 0 0 0.75rem 0 rgba(var(--darkest), 0.5); --shadow-lg: 0 0.125rem 1.5rem 0.125rem rgba(var(--darkest), 0.5); --form-invalid-background: 248,215,218; --form-invalid-border: 220,53,69; --form-error-text: 220,53,69; --app-search-border: var(--concrete); --app-search-border-hover: var(--asbestos); --base-font: -apple-system,BlinkMacSystemFont,'Segoe UI',Oxygen-Sans,Ubuntu,Cantarell,'Helvetica Neue',Roboto,sans-serif; --tail-color: white; --tail-border-color: rgb(var(--concrete)); --tail-border-width: var(--border-width); }

#road-segment { width: 4rem; height: 4rem; }

#road-segment { width: 4rem; height: 4rem; }

.oneweb-element { --green-sea: 79,212,180; --peter-river: 52,152,219; --peter-river-light: 78,184,255; --sea-foam: 37,222,216; --dark-blue: 4,84,165; --darker-blue: 0,75,156; --belize-hole: 41,128,185; --wet-asphalt: 52,73,94; --midnight-blue: 44,62,80; --freezing-blue: 97,176,254; --mountain-purple: 117,91,151; --success: 51,204,0; --vitamin-c: 255,153,0; --goldfish: 254,176,97; --that-sunday: 255,211,39; --that-sunday-light: 256,253,238; --pink-martini: 220,53,69; --ehaaf: 254,97,97; --sri-sooktham: 225,78,78; --danger: 220,53,69; --danger-dark: 168,46,58; --danger-white: 253,245,246; --danger-clouds: 235,231,232; --origin: 19,194,106; --destination: 254,97,98; --clouds: 231,235,236; --silver: 193,198,201; --concrete: 142,158,159; --asbestos: 88,91,92; --darker: 63,66,67; --darkest: 48,51,52; --dell-gray: 140,140,140; --a-grey: 187,187,187; --tab-fill: 217,220,221; --tab-fill-hover: 255,255,255; --active-sign-grey: 232,232,232; --travel-time-sign-blue: 0,84,165; --blank-sign-grey: 165,165,165; --no-data-sign: 61,61,61; --theme-opacity: 1; --filter-effect-media: saturate(150%) blur(20px); --filter-effect-controls: saturate(150%) blur(10px); --filter-effect-dialogs: saturate(150%) blur(1.5px); --gap: 0.75rem; --border-radius: 0.25rem; --event-icon-size: 2.5rem; --border-width: 1px; --smaller: 0.875rem; --smallest: 0.75rem; --tray-handlebar-height: 47px; --information-panel-height: 50vh; --shadow-sm: 0 0.125rem 0.25rem 0 rgba(var(--darkest), 0.25); --shadow-md: 0 0 .75rem 0 rgba(var(--darkest), 0.5); --shadow-lg: 0 0.125rem 1.5rem 0.125rem rgba(var(--darkest), 0.5); --shadow-inset-top-left: inset 0 1rem .75rem -1rem rgba(var(--darkest), 0.5),inset 1rem 0 .75rem -1rem rgba(var(--darkest), 0.5); --shadow-inset-bottom-left: inset 0 -1rem 0.25rem -1rem rgba(var(--darkest), 0.25),inset 1rem 0 0.25rem -1rem rgba(var(--darkest), 0.25); --shadow-inset-bottom-right: inset 0 -1rem 0.25rem -1rem rgba(var(--darkest), 0.25),inset -1rem 0 0.25rem -1rem rgba(var(--darkest), 0.25); --form-invalid-background: 248,215,218; --form-invalid-border: 220,53,69; --form-error-text: 220,53,69; --app-search-border: var(--concrete); --app-search-border-hover: var(--asbestos); --map-controls-btn-fill: 255,255,255; --map-controls-bg: 102,102,102; --map-controls-btn-fill-active: 255,255,255; --map-controls-btn-bg-active: 50,107,192; --origin: 88,177,62; }

.layers-legend-container { position: relative; }

.collapse-btn_layers { position: absolute; left: -.75rem; top: .75rem; z-index: 6; }

.collapse-btn_layers .inner { --inner-background-color: rgb(var(--asbestos)); --inner-fill: rgb(var(--clouds)); display: flex; align-items: center; justify-content: center; background-color: var(--inner-background-color); fill: var(--inner-fill); width: calc(1.5*var(--smaller)); height: calc(1.5*var(--smaller)); box-shadow: var(--shadow-sm); border-radius: 50%; border: solid 1px white; }

.collapse-btn_layers .collapse_icon--flipped { transform: rotate(180deg); }

.collapse-btn_layers .collapse_icon { width: 1rem; height: 1rem; fill: white; }

layers-legend-panel { flex-basis: 275px; display: block; margin: var(--gap); width: 275px; font-size: var(--smaller); box-shadow: var(--shadow-md); }

layers-legend-panel .panel-button { padding: 12px; font-size: var(--smaller); --panel-button-background-color: rgb(var(--clouds)); --panel-button-color: rgb(var(--asbestos)); background-color: var(--panel-button-background-color) !important; color: var(--panel-button-color); -webkit-clip-path: inset(-0.75rem -0.75rem 0px); clip-path: inset(-0.75rem -0.75rem 0px); border-radius: 0px; transition: color 0.15s ease-out 0s; }

layers-legend-panel .panel-button_right { box-shadow: var(--shadow-inset-bottom-left); border-top-right-radius: var(--border-radius); border-left: 0px; }

layers-legend-panel .panel-button_highlighted { --panel-button_highlighted: rgb(var(--darkest)); background-color: white !important; border-bottom-color: white; z-index: 1; color: var(--panel-button_highlighted); box-shadow: none; }

layers-legend-panel #wrapper { display: flex; align-items: center; padding: 8px 12px; }

.legend-layers-list { list-style: none; margin: 0px; padding: 0.5rem 0px; overflow: auto; }

.layers-legend-button-container_open { grid-template-columns: 1fr 1fr; }

.layers-legend-button-container { display: grid; overflow: hidden; }

.info-panel { display: flex; max-width: calc(275px - var(--border-width) * 2); background-color: white; position: relative; max-height: calc(var(--information-panel-height) - 3.5rem); grid-column: span 2 / auto; border-radius: 0px 0px 0.25rem 0.25rem; border-top: 0px; }

.partial-line { --toggle-switch-disabled-opacity: 0.5; --toggle-switch-toggle-duration: 0.1s; --toggle-switch-color: rgb(var(--concrete)); --toggle-switch-color-active: rgb(var(--peter-river)); --toggle-switch-color-focus: rgba(var(--peter-river),0.5); --toggle-switch-track-height: 0.75rem; --toggle-switch-knob-color: rgb(var(--concrete)); --toggle-switch-knob-color-active: rgb(var(--peter-river)); display: block; cursor: pointer; fill: #8e9e9f; outline: transparent solid 0.25rem; transition: fill 0.1s linear 0s, color 0.1s linear 0s, outline 0.15s ease-in-out 0s; border-top: dotted 1px var(--toggle-switch-color); }

.layers-container { display: flex; flex-direction: column; flex: 1 1 0%; }

.btn-sm { font-size: var(--smaller); }

#wrapper { display: flex; align-items: center; }

.legend-layers-list-icon { margin-right: 0.5rem; min-width: 1.25rem; height: 1.25rem; }

body { --smaller: 0.875rem; }

/** Reset some basic elements */
body, h1, h2, h3, h4, h5, h6, p, blockquote, pre, hr, dl, dd, ol, ul, figure { margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

/** Basic styling */
body { font-size: 16px; line-height: 1.5; font-weight: 400; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; color: #303334; background-color: var(--bg-color); -webkit-text-size-adjust: 100%; -o-font-feature-settings: "kern" 1; font-feature-settings: "kern" 1; -webkit-font-kerning: normal; font-kerning: normal; display: flex; min-height: 100vh; flex-direction: column; }

/** Set `margin-bottom` to maintain vertical rhythm */
p, blockquote, pre, ul, ol, dl, figure { margin-bottom: 0.5rem; }

h1, h2, h3, h4, h5, h6 { margin-bottom: 1rem; margin-top: 2rem; }

/** `main` element */
main { display: block; /* Default value of `display` of `main` element is 'inline' in IE 11. */ }

p { margin-top: 0; }

/** Images */
img { max-width: 100%; vertical-align: middle; }

/** Figures */
figure > img { display: block; }

figcaption { font-size: 14px; }

/** Lists */
ul, ol { margin-left: 3rem; }

li > ul, li > ol { margin-bottom: 0; }

/** Headings */
h1, h2, h3, h4, h5, h6 { line-height: 1.25; font-weight: bold; }

/** Links */
a { color: #0054A5; text-decoration: none; }

a:visited { color: #002d59; }

a:hover { color: #303334; }

/** Blockquotes */
blockquote { color: #828282; border-left: 4px solid #e8e8e8; padding-left: 0.5rem; font-size: 18px; letter-spacing: -1px; font-style: italic; }

blockquote > :last-child { margin-bottom: 0; }

/** Code formatting */
pre, code { font-size: 15px; border: 1px solid #e8e8e8; border-radius: 3px; background-color: #eef; }

code { padding: 1px 5px; }

pre { padding: 8px 12px; overflow-x: auto; }

pre > code { border: 0; padding-right: 0; padding-left: 0; }

/** Wrapper */
.wrapper { width: 100%; max-width: calc(800px - (1rem * 2)); margin-right: auto; margin-left: auto; padding-right: 1rem; padding-left: 1rem; }

@media screen and (max-width: 800px) { .wrapper { max-width: calc(800px - (1rem)); padding-right: 0.5rem; padding-left: 0.5rem; } }

/** Clearfix */
.wrapper:after { content: ""; display: table; clear: both; }

/** Icons */
.svg-icon { width: 16px; height: 16px; display: inline-block; fill: #828282; padding-right: 5px; vertical-align: text-top; }

/** Tables */
table { margin-bottom: 1rem; width: 100%; text-align: left; color: #5c6264; border-collapse: collapse; border: 1px solid #e8e8e8; }

table tr:nth-child(even) { background-color: #f7f7f7; }

table th, table td { padding: 0.3333333333rem 0.5rem; }

table th { background-color: #f0f0f0; border: 1px solid #dedede; border-bottom-color: #c9c9c9; }

table td { border: 1px solid #e8e8e8; }

.button { padding: 1rem 2rem; background-color: transparent; display: inline-block; border: 1px solid #7F8C8D; color: #7F8C8D; text-transform: uppercase; letter-spacing: .15rem; text-decoration: none; transition: color .15s ease-in-out, border .15s ease-in-out, box-shadow .15s ease-in-out, background-color .15s ease-in-out; -webkit-transition: color .15s ease-in-out, border .15s ease-in-out, box-shadow .15s ease-in-out, background-color .15s ease-in-out; margin: 1rem 0; }

.button:hover, .button:focus { background-color: rgba(0, 84, 165, 0.05); border: 1px solid #0054A5; color: #0054A5; box-shadow: 0 0.125rem 0.25rem 0 rgba(0, 84, 165, 0.15); }

a.button:visited { color: #7F8C8D; }

body { background-color: #ffffff; }

aside { background-color: #333333; color: #eeeeee; box-sizing: border-box; padding: 2rem; }

aside header { border-bottom: 1px dotted #95a5a6; padding: 2rem 0; text-transform: uppercase; letter-spacing: 0.2rem; margin-bottom: 1rem; }

aside a { transition: color .25s ease-in-out; color: #aeaeae; }

aside a:visited { color: #aeaeae; }

aside a:hover, aside a.active { color: #eeeeee; }

aside a.active { font-weight: 600; }

.anchor header { background-color: white; border-bottom: 1px dotted #95a5a6; margin-bottom: 1rem; margin-top: 3rem; padding-top: 1rem; padding-bottom: .5rem; position: -webkit-sticky; position: sticky; top: 0; z-index: 50; }

article { margin-bottom: 2rem; }

article header, article section { padding-right: 2rem; padding-left: 2rem; }

main { margin-bottom: 90vh; }

main li { margin: 0.3333333333rem; }

main li img { display: inline; height: 1.5rem; width: 1.5rem; }

@media (min-width: 768px) { aside { height: 100vh; position: fixed; top: 0; width: 30vw; } main { margin-left: 30vw; margin-top: 3rem; } }

.oneweb-element { display: block; vertical-align: middle; margin: 2rem 0; }

.inline { display: inline-block; margin: 0; }

figcaption { font-size: .75rem; font-style: italic; margin: .5rem 0; }

code { background-color: #ECF0F1; padding: .25rem; border-radius: var(--border-radius); box-shadow: var(--shadow-sm); }

.dropshadow { box-shadow: 2px 2px 15px #95a5a6; }

#headline img, #headline h1 { display: inline-block; vertical-align: middle; }

#headline img { margin-right: 2rem; }

#headline h1 { font-size: 48px; }

#intro header h1 { font-size: 48px; }

.oneweb-element { display: block; vertical-align: middle; margin: 1rem 0; }

.oneweb-element.inline { display: inline-block; margin: 0; }

.oneweb-element svg { height: 1.5rem; width: 1.5rem; fill: #7F8C8D; }

/* toggle */
:root { display: block; outline: transparent solid 0.25rem; transition: fill 0.1s linear 0s, color 0.1s linear 0s, outline 0.15s ease-in-out 0s; }

#inner-wrap { position: relative; height: 1.5em; width: 2.5em; display: block; cursor: pointer; }

#track { height: 1rem; width: 100%; background-color: rgba(149, 165, 166, 0.25); border-radius: 1rem; }

#knob, #track { position: absolute; top: 0px; bottom: 0px; left: 0px; margin: auto; }

#knob { position: absolute; left: 0px; top: 0px; bottom: 0px; height: 100%; width: 60%; background-color: #95a5a6; margin: auto; border-radius: 50%; }

#inner-wrap.active #track { background-color: rgba(52, 152, 219, 0.25); }

#inner-wrap.active #knob { background-color: #3498db; transform: translateX(70%); }

.btn { display: flex; align-items: center; justify-content: center; font-weight: 400; white-space: nowrap; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-color: transparent; cursor: pointer; font-size: 1rem; line-height: 1.5; -webkit-tap-highlight-color: rgba(52, 152, 219, 0.05); border-width: 0px; border-style: initial; border-color: initial; -o-border-image: initial; border-image: initial; transition: color 0.15s ease-out 0s, fill 0.15s ease-out 0s, background 0.15s ease-out 0s, border-color 0.15s ease-out 0s, box-shadow 0.15s ease-out 0s; text-decoration: none; margin: 0px; }

.btn-padding-sm { padding: 0.5rem 0.75rem; }

.btn-rounded { border-radius: var(--border-radius); }

.btn > svg, .icon { height: 1.25rem; width: 1.25rem; padding: 0.125rem; flex: 0 0 auto; transition: opacity 0.15s ease-out 0s; }

.btn-light { fill: #7F8C8D; color: #7F8C8D; }

.btn-light.active, .btn-light:active { fill: #2980b9; color: #2980b9; background: radial-gradient(white, transparent); }

.btn-dark { background: #3f4243; color: #ECF0F1; }

.btn-dark:active { color: white; background: #1a242e; }

.btn-dark:hover { color: white; background: #22303d; }

.btn-label { padding-left: 0.5rem; }

/* tab */
#tab { fill: #7F8C8D; }

#tab > svg { transform: rotate(180deg); }

img[src*="#critical"] { width: 54px; height: 54px; }

img[src*="#delay"] { width: 58px; height: 58px; }

img[src*="#highpriority"] { width: 28px; height: 28px; }

img[src*="#lowpriority"] { width: 22px; height: 22px; }

.view-more { background-color: #ECF0F1; }

.view-more-btn { transition: var(---is-flipped-dark-transition); background: radial-gradient(farthest-side ellipse at top center, #fcfcfc, transparent); }

/* Layer controls */
.controls { background-color: rgba(255, 255, 255, 0.9); box-shadow: var(--shadow-md); pointer-events: auto; width: 3.5rem; }

.controls .btn > svg, .controls .icon { height: 1.25rem; width: 1.25rem; padding: 0.75rem; flex: 0 0 auto; transition: opacity 0.15s ease-out 0s; }

.btn-link { color: #3498db; font-size: var(--smaller); display: inline-flex; text-decoration: underline; }

.btn-link:hover, .btn-link:focus { color: #2980b9; }

.layers-controls { padding: 0 var(--gap); border-bottom: var(--border-width) dotted #95a5a6; display: flex; align-items: center; position: relative; }

.layers-controls * > p { margin: calc(var(--gap) / 2) 0; }

.layer-controls_btn { padding: 0.25rem; margin: 0.25rem; }

.layers-legend-button-container_open { grid-template-columns: 1fr 1fr; }

.layers-legend-button-container { display: grid; overflow: hidden; }

.legend-layers-list label.text { display: flex; }

.legend-layers-list div.text { display: inline-flex; }

.info-panel { display: flex; max-width: calc(275px - var(--border-width) * 2); background-color: white; position: relative; grid-column: span 2 / auto; border-radius: 0px 0px 0.25rem 0.25rem; border-top: 0px; overflow: auto; }

.layers-container { display: flex; flex-direction: column; max-height: calc(var(--information-panel-height) - 3.5rem); flex: 1 1 0%; }

.search-btn-left::before, .search-btn-right::before { content: ""; display: block; position: absolute; height: 100%; transition: border-color 0.15s ease-out 0s; }

.dropdown-toggle::after { display: inline-block; margin-left: .25rem; vertical-align: .25rem; content: ""; border-top: 0.25em solid #7F8C8D; border-right: .25em solid transparent; border-bottom: 0; border-left: .25em solid transparent; transition: border .15s ease-out; }

.search-btn-left { border-top-left-radius: 0.75rem; border-bottom-left-radius: 0.75rem; min-width: 3.25rem; z-index: 3; border-right: 0px; }

.search-btn { background-color: #ECF0F1; position: relative; z-index: 2; padding: 0.5rem; border: 1px solid #c2c8cc; }

#timestamp { color: #7F8C8D; font-style: italic; }

#timestamp a { color: #3498db; }

.menu { position: relative; background: white; border: 1px solid #95a5a6; border-radius: 0.25rem; box-shadow: 0 0.125rem 1.5rem 0.125rem rgba(48, 51, 52, 0.5); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Roboto, sans-serif; font-size: 0.875rem; font-weight: 400; line-height: 1.5; margin-bottom: 2rem; }

.menu_item:first-of-type { padding-top: 0.75rem; }

.menu_item:last-of-type { padding-bottom: 0.75rem; }

.menu_item { display: flex; align-items: center; padding: 0.375rem 1rem; color: #7F8C8D; fill: #7F8C8D; outline-offset: 0px; text-decoration: none; white-space: nowrap; }

.menu-item-wrapper { position: relative; }

.menu-item-wrapper .menu_item { padding: 0.375rem 1rem; }

.menu-item-wrapper:nth-child(2) .menu_item { padding-top: 0.75rem; }

#arrow { position: absolute; width: var(--gap); height: var(--gap); z-index: 5; left: calc( ( ( var(--gap)/2 ) - 50% ) * -1); top: calc( ( var(--gap)/2 ) * -1); }

#arrow::before { content: ""; left: 0px; transform: rotate(45deg); width: var(--gap); height: var(--gap); background-color: var(--tail-color); border: var(--tail-border-width) solid var(--tail-border-color); position: absolute; border-right: none; border-bottom: none; }

.video-control { display: flex; font-size: 1rem; padding: 0px; }

.video-control > svg { width: 2rem; height: 2rem; fill: #0054A5; }

.video-control > span { color: #7F8C8D; margin-left: 0.5rem; }

video-player-controls::part(button) { padding: var(--gap); }

video-player-controls::part(icon) { width: 1.5rem; height: 1.5rem; }