@charset "UTF-8";
/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
@font-face { font-family: "Yanone Tagesschrift"; font-weight: normal; font-style: normal; font-display: swap; src: url("../font/YanoneTagesschrift.ttf"); src: local("Insula"), url("../font/YanoneTagesschrift.eot?#iefix") format("embedded-opentype"), url("../font/YanoneTagesschrift.ttf") format("truetype"), url("../font/YanoneTagesschrift.woff") format("woff"), url("../font/YanoneTagesschrift.woff2") format("woff2"), url("../font/YanoneTagesschrift.svg#Open Sans") format("svg"); }

body { font-family: Helvetica, Arial, sans-serif; line-height: 1.3; font-weight: normal; font-style: normal; font-kerning: normal; font-smooth: auto; text-rendering: optimizeLegibility; font-size-adjust: none; font-size: 14pt; }

@media screen and (max-width: 560px) { body { font-size: 11.5pt; } }

h1, h2, h3, h4, h5, h6 { font-family: "Trebuchet MS", "Geneva", Helvetica, Arial, sans-serif; line-height: 1.2; letter-spacing: -0.75px; }

h1 { font-size: 2.0em; }

h2 { font-size: 1.7em; }

h3 { font-size: 1.4em; }

h4, h5, h6 { margin: 1.5em 0; font-size: 1.1em; }

@media screen and (max-width: 560px) { h1 { font-size: 1.75em; } h2 { font-size: 1.4em; } h3, h4, h5, h6 { margin: 1.5em 0; font-size: 1.1em; } }

pre, code { font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace; }

pre { font-size: 80%; line-height: 1.2; }

pre code { padding: 0; }

code { font-size: 90%; white-space: nowrap; }

strong, b { font-weight: 700; }

i, cite, em, var, address, dfn { font-style: italic; }

figcaption { font-size: 75%; font-style: italic; font-weight: 200; }

blockquote { font-size: 100%; font-style: normal; font-weight: 200; }

sup { font-feature-settings: "lnum" 1; }

@supports (font-variant-numeric: lining-nums) { sup { font-feature-settings: normal; font-variant-numeric: lining-nums; } }

/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
.ui-background { position: fixed; z-index: 0; top: 0; left: 0; width: 80vw; min-width: 600px; height: 100vh; background-image: url("../images/broadcast_bg.jpg"); background-position: 0 0; background-size: contain; background-repeat: no-repeat; opacity: 0.25; }

@media screen and (max-aspect-ratio: 4/7) { .ui-background { position: absolute; } }

@media screen and (min-aspect-ratio: 7/4) and (max-height: 560px) { .ui-background { position: absolute; } }

@media screen and (max-width: 600px) { .ui-background { width: 100%; min-width: 100%; } }

/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
[data-role="copyright"] { position: relative; padding-top: 3em; height: 9em; color: #ccc; font-family: serif; font-size: 70%; letter-spacing: 0.25px; line-height: 1.15; text-align: right; }

[data-role="copyright"] .__summary { position: absolute; bottom: 0; left: 0; right: 0; height: 6em; padding: 1em 5vw 2em 0; background-color: #000; }

[data-role="copyright"] a { color: #fff; text-decoration-color: #ccc; }

[data-role="copyright"] a:hover, [data-role="copyright"] a:active { color: #fff; text-decoration-color: #fff; }

@media screen and (min-width: 560px) { [data-role="copyright"] { margin-top: calc((100vw - 560px) * 0.05); } }

/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
.__font_faq h2 { margin-top: 1.5em; font-size: 120%; }

.__font_faq * + h2 { margin-top: 1.5em; }

.__font_faq h3 { font-size: 100%; }

.__font_faq h4, .__font_faq h5, .__font_faq h6, .__font_faq p, .__font_faq ul, .__font_faq ol, .__font_faq th, .__font_faq td, .__font_faq .__font_size { font-size: 85%; line-height: 1.5; }

h1.__h1_quote { margin: 0 0 2em 0; padding: 0.45em 0.75em; border-radius: 0.3em; color: #444; background: #dbdba0; font-size: 100%; font-weight: 400; font-style: italic; letter-spacing: 0; text-align: left; }

.__nowrap { white-space: nowrap; }

/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
[role="navigation"] { padding: 3em 1em 0 1em; }

[role="navigation"] .__noIcon, [role="navigation"] img.__icon { display: inline-block; width: 2em; height: 2em; padding-left: 0; padding-right: 0; }

[role="navigation"] a { display: inline-block; display: flex; flex-direction: row; flex-wrap: nowrap; font-size: 90%; line-height: 1.15; position: relative; }

[role="navigation"] a span.__title { display: inline-block; position: absolute; left: 2.5em; right: inherit; top: 50%; transform: translateY(-50%); }

[role="navigation"] ul { list-style-type: none; margin: 0; padding: 0; display: flex; flex-direction: row; flex-wrap: wrap; }

[role="navigation"] li { width: 50%; flex-grow: 0; flex-shrink: 1; flex-basis: auto; margin: 0; padding: 0; padding-top: 0.5em; }

@media screen and (min-width: 560px) and (min-aspect-ratio: 1/1) { [role="navigation"] { padding-top: calc((100vw - 560px) * 0.05); } }

@media screen and (min-width: 560px) and (max-aspect-ratio: 1/1) { [role="navigation"] { padding-top: calc((100vw - 560px) * 0.35); } }

@media screen and (min-width: 560px) { [role="navigation"] .__noIcon, [role="navigation"] img.__icon { width: 4.5em; height: 4.5em; } [role="navigation"] a { line-height: 1.5; } [role="navigation"] a span.__title { left: 5em; } [role="navigation"] li { padding-top: 1em; } [role="navigation"] li:nth-child(2n) { text-align: right; } [role="navigation"] li:nth-child(2n) a { flex-direction: row-reverse; /* // alternate approach to column order :nth-child(1) { order: 2; } :nth-child(2) { order: 1; } */ } [role="navigation"] li:nth-child(2n) a .__noIcon, [role="navigation"] li:nth-child(2n) a img.__icon { padding-left: 0; padding-right: 0; } [role="navigation"] li:nth-child(2n) a span.__title { left: inherit; right: 5em; } }

/*
// https://moderncss.dev/developing-for-imperfect-future-proofing-css-styles/
//   Reflow is the term for supporting desktop zoom up to 400%.
//   CSS for "Update Column Minimum Allowed Widths"

grid-template-columns: min(64px, 15%, 10vw) 1fr;
*/
/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
[role="banner"] div.__indicators { position: absolute; right: 2em; font-size: 80%; top: 9.3em; }

[role="banner"] div.__indicators > span { display: block; position: absolute; top: 0; height: 2.3em; background-size: cover; background-repeat: no-repeat; background-position: 0 0; filter: invert(94%) sepia(10%) saturate(1224%) hue-rotate(356deg) brightness(87%) contrast(90%); }

[role="banner"] div.__indicators .__isDataLive { right: 0; width: 1.2em; background-image: url("../svg/main-app/noun_online_3967479.svg"); opacity: calc(var(--indicator-isDataLive) * 0.8); }

[role="banner"] div.__indicators .__isDataDown { right: 0; width: 1.2em; background-image: url("../svg/main-app/noun_disconnect_4004905.svg"); filter: none; opacity: calc(var(--indicator-isDataDown) * 0.25); }

[role="banner"] div.__indicators .__isStreamUp, [role="banner"] div.__indicators .__isStreamDown { right: 2.7em; width: 2.7em; background-image: url("../svg/main-app/noun_cellular_3969127.svg"); }

[role="banner"] div.__indicators .__isStreamUp { opacity: calc(var(--indicator-isStreamUp) * 0.8); }

[role="banner"] div.__indicators .__isStreamDown { filter: none; opacity: calc(var(--indicator-isStreamDown) * 0.25); }

[role="banner"] div.__indicators .__isListening { top: -0.1em; right: 6.8em; width: 2.9em; height: 2.5em; background-image: url("../svg/main-app/noun_Eye of Providence_3884001.svg"); opacity: calc(var(--indicator-isListening) * 1.0); }

/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
.ui__archival-banner { position: relative; border: 0.15em solid #ede8cb; border-radius: 0.3em; background: #ede8cb; text-align: left; padding: 0.45em 3em 0.25em 0.75em; }

.ui__archival-banner img { position: absolute; top: 0.25em; right: 0; width: 3em; height: 3em; filter: contrast(86%); }

.ui__archival-banner span { line-height: 2.3em; vertical-align: top; }

.ui__archival-banner a { color: #444; text-decoration: underline; text-decoration-color: #444; }

.ui__archival-banner a:visited { color: #444; text-decoration-color: #444; }

.ui__archival-banner a:hover, .ui__archival-banner a:active { color: #666; text-decoration-color: #666; }

* + .ui__archival-banner { margin-top: 2em; }

.ui__archival-badge { display: inline-block; padding: 0.1em 0.25em; margin: -0.1em 0.25em 0 0; font-size: 80%; font-style: italic; font-weight: 200; vertical-align: top; white-space: nowrap; color: #857137; background: #ede8cb; }

/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
a.__site, a.__ambience, a.__listen, a.__filmstrip, a[href*="//sleepbot.com/ambience/cgi/listen."]:not(.__noListen), a[href="//sleepbot.com/ambience/broadcast/reference-tone"]:not(.__noListen), .__listen_link_style { display: inline-block; padding: 0.1em 0.35em; margin: -0.1em 0; color: #444; text-decoration: underline; text-decoration-color: #444; }

a.__site:visited, a.__ambience:visited, a.__listen:visited, a.__filmstrip:visited, a[href*="//sleepbot.com/ambience/cgi/listen."]:not(.__noListen):visited, a[href="//sleepbot.com/ambience/broadcast/reference-tone"]:not(.__noListen):visited, .__listen_link_style:visited { color: #444; text-decoration-color: #444; }

a.__site:hover, a.__site:active, a.__ambience:hover, a.__ambience:active, a.__listen:hover, a.__listen:active, a.__filmstrip:hover, a.__filmstrip:active, a[href*="//sleepbot.com/ambience/cgi/listen."]:not(.__noListen):hover, a[href*="//sleepbot.com/ambience/cgi/listen."]:not(.__noListen):active, a[href="//sleepbot.com/ambience/broadcast/reference-tone"]:not(.__noListen):hover, a[href="//sleepbot.com/ambience/broadcast/reference-tone"]:not(.__noListen):active, .__listen_link_style:hover, .__listen_link_style:active { color: #666; text-decoration-color: #666; }

a.__listen, a[href*="//sleepbot.com/ambience/cgi/listen."]:not(.__noListen), .__listen_link_style { background: #d2e6df; }

a.__site, a[href="//sleepbot.com/ambience/broadcast/reference-tone"]:not(.__noListen) { background: #dbdba0; }

a.__ambience { background: #f6f7c3; }

a.__filmstrip { background: #9fe89a; }

a.__no_style, a.__filmstrip { text-decoration: none; }

a.__no_style:visited, a.__no_style:hover, a.__no_style:active, a.__filmstrip:visited, a.__filmstrip:hover, a.__filmstrip:active { text-decoration: none; }

.__link_style { text-decoration: underline; }

.__link_style:hover, .__link_style:active { text-decoration: underline; }

/* "low resolution" considerations which is Mobile-related -- eg. implied bandwidth consumption but not literally about visual dimension -- eg. '$aspect-ratio-narrow' iPhone expresses 3x resolution; cannot use 'image-map' considerations device width => 'max-width' https://iosref.com/res https://screensizemap.com/ https://en.wikipedia.org/wiki/Computer_display_standard iPad Pro 12.9" (gen 5) = 1024 High Definition (720p) = 1280x720 XGA+ (4:3) = 1152x864 */
/* AftM tiers all of which are too bright, but make good seeds */
/* SEB tier - Earth */
@media print { body { font-size: 12.5pt !important; } a[href^="http"]::after { content: "  🔗" attr(href) " "; font-style: italic; font-size: 70%; } img, svg, canvas, object, figure { page-break-inside: avoid; break-inside: avoid-page; } @page { margin: 0.8in 0.6in 0.7in 0.6in; } @page :first { margin-top: 0.3in; } @page :blank {} }

/*# sourceMappingURL=index.css.map */