/* units philosopy, rem vs em - use em if the property scales according to font-size - use rem for everything else Stuff like layout and left/right padding, where you want left-align and have it work for many different elements, should be done with rem. Top/bottom padding can be em. */
html, body, div, span, h1, h2, h3, p, table, blockquote, pre, a { margin: 0; padding: 0; border: 0; vertical-align: baseline; }

/* header */
.masthead header { display: block; margin: 0 auto; max-width: 36rem; padding: .75rem 1.75rem; }

.masthead .callsign { display: inline-block; vertical-align: middle; margin: 0 4rem 0 0; }

.masthead .callsign img { width: 120px; vertical-align: middle; }

.masthead nav { display: inline-block; margin: auto 0; vertical-align: middle; }

main { display: block; margin: 0 auto; padding: 1rem; max-width: 36rem; }

.post, .page { margin-top: 2rem; }

.post:not(:nth-child(1)) { margin-top: 3rem; }

/* Typography settings */
html { /* this is the root font size for all rem's */ /* font-size: 20px; */ font-family: "IBM Plex Sans", Helvetica, Arial, sans-serif; font-weight: normal; font-size: 120%; line-height: 1.5; text-rendering: optimizeLegibility; color: #222; }

/* IBM Plex Sans */
@font-face { font-family: 'IBM Plex Sans'; font-weight: 400; font-style: normal; src: url(/fonts/IBMPlexSans/IBMPlexSans-Regular.eot); src: url(/fonts/IBMPlexSans/IBMPlexSans-Regular.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSans/IBMPlexSans-Regular-Latin1.woff) format("woff"), url(/fonts/IBMPlexSans/IBMPlexSans-Regular-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSans/IBMPlexSans-Regular.ttf) format("truetype"); }

@font-face { font-family: 'IBM Plex Sans'; font-weight: 400; font-style: italic; src: url(/fonts/IBMPlexSans/IBMPlexSans-Italic.eot); src: url(/fonts/IBMPlexSans/IBMPlexSans-Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSans/IBMPlexSans-Italic-Latin1.woff) format("woff"), url(/fonts/IBMPlexSans/IBMPlexSans-Italic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSans/IBMPlexSans-Italic.ttf) format("truetype"); }

@font-face { font-family: 'IBM Plex Sans'; font-weight: 700; font-style: normal; src: url(/fonts/IBMPlexSans/IBMPlexSans-SemiBold.eot); src: url(/fonts/IBMPlexSans/IBMPlexSans-SemiBold.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSans/IBMPlexSans-SemiBold-Latin1.woff) format("woff"), url(/fonts/IBMPlexSans/IBMPlexSans-SemiBold-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSans/IBMPlexSans-SemiBold.ttf) format("truetype"); }

@font-face { font-family: 'IBM Plex Sans'; font-weight: 700; font-style: italic; src: url(/fonts/IBMPlexSans/IBMPlexSans-SemiBoldItalic.eot); src: url(/fonts/IBMPlexSans/IBMPlexSans-SemiBoldItalic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSans/IBMPlexSans-SemiBoldItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexSans/IBMPlexSans-SemiBoldItalic-Latin2.woff) format("woff2"), url(/fonts/IBMPlexSans/IBMPlexSans-SemiBoldItalic.ttf) format("truetype"); }

/* IBM Plex Serif */
@font-face { font-family: 'IBM Plex Serif'; font-weight: 400; font-style: normal; src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Regular.eot); src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Regular.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Regular-Latin1.woff) format("woff"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Regular-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Regular.ttf) format("truetype"); }

@font-face { font-family: 'IBM Plex Serif'; font-weight: 400; font-style: italic; src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Italic.eot); src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Italic-Latin1.woff) format("woff"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Italic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Italic.ttf) format("truetype"); }

@font-face { font-family: 'IBM Plex Serif'; font-weight: 700; font-style: normal; src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold.eot); src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold-Latin1.woff) format("woff"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold.ttf) format("truetype"); }

@font-face { font-family: 'IBM Plex Serif'; font-weight: 700; font-style: italic; src: url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic.eot); src: url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic.ttf) format("truetype"); }

/* IBM Plex Mono */
@font-face { font-family: 'IBM Plex Mono'; font-weight: 400; font-style: normal; src: url(/fonts/IBMPlexMono/IBMPlexMono-Regular.eot); src: url(/fonts/IBMPlexMono/IBMPlexMono-Regular.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexMono/IBMPlexMono-Regular-Latin1.woff) format("woff"), url(/fonts/IBMPlexMono/IBMPlexMono-Regular-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexMono/IBMPlexMono-Regular.ttf) format("truetype"); }

@font-face { font-family: 'IBM Plex Mono'; font-weight: 400; font-style: italic; src: url(/fonts/IBMPlexMono/IBMPlexMono-Italic.eot); src: url(/fonts/IBMPlexMono/IBMPlexMono-Italic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexMono/IBMPlexMono-Italic-Latin1.woff) format("woff"), url(/fonts/IBMPlexMono/IBMPlexMono-Italic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexMono/IBMPlexMono-Italic.ttf) format("truetype"); }

@font-face { font-family: "IBM Plex Mono"; font-weight: 700; font-style: normal; src: url(/fonts/IBMPlexMono/IBMPlexMono-SemiBold.eot); src: url(/fonts/IBMPlexMono/IBMPlexMono-SemiBold.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexMono/IBMPlexMono-SemiBold-Latin1.woff) format("woff"), url(/fonts/IBMPlexMono/IBMPlexMono-SemiBold-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexMono/IBMPlexMono-SemiBold.ttf) format("truetype"); }

@font-face { font-family: "IBM Plex Mono"; font-weight: 700; font-style: italic; src: url(/fonts/IBMPlexMono/IBMPlexMono-SemiBoldItalic.eot); src: url(/fonts/IBMPlexMono/IBMPlexMono-SemiBoldItalic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexMono/IBMPlexMono-SemiBoldItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexMono/IBMPlexMono-SemiBoldItalic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexMono/IBMPlexMono-SemiBoldItalic.ttf) format("truetype"); }

/* lighten the stroke if we are high dpi */
@media screen and (-webkit-min-device-pixel-ratio: 2), screen and (min-resolution: 192dpi), screen and (min-resolution: 2dppx), print { /* IBM Plex Sans */ @font-face { font-family: "IBM Plex Sans"; font-weight: 400; font-style: normal; src: url(/fonts/IBMPlexSans/IBMPlexSans-Text.eot); src: url(/fonts/IBMPlexSans/IBMPlexSans-Text.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSans/IBMPlexSans-Text-Latin1.woff) format("woff"), url(/fonts/IBMPlexSans/IBMPlexSans-Text-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSans/IBMPlexSans-Text.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Sans"; font-weight: 400; font-style: italic; src: url(/fonts/IBMPlexSans/IBMPlexSans-TextItalic.eot); src: url(/fonts/IBMPlexSans/IBMPlexSans-TextItalic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSans/IBMPlexSans-TextItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexSans/IBMPlexSans-TextItalic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSans/IBMPlexSans-TextItalic.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Sans"; font-weight: 700; font-style: normal; src: url(/fonts/IBMPlexSans/IBMPlexSans-Bold.eot); src: url(/fonts/IBMPlexSans/IBMPlexSans-Bold?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSans/IBMPlexSans-Bold-Latin1.woff) format("woff"), url(/fonts/IBMPlexSans/IBMPlexSans-Bold-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSans/IBMPlexSans-Bold.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Sans"; font-weight: 700; font-style: italic; src: url(/fonts/IBMPlexSans/IBMPlexSans-BoldItalic.eot); src: url(/fonts/IBMPlexSans/IBMPlexSans-BoldItalic?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSans/IBMPlexSans-BoldItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexSans/IBMPlexSans-BoldItalic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSans/IBMPlexSans-BoldItalic.ttf) format("truetype"); } /* IBM Plex Serif */ @font-face { font-family: "IBM Plex Serif"; font-weight: 400; font-style: normal; src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Text.eot); src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Text.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Text-Latin1.woff) format("woff"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Text-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Text.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Serif"; font-weight: 400; font-style: italic; src: url(/fonts/IBMPlexSerif/IBMPlexSerif-TextItalic.eot); src: url(/fonts/IBMPlexSerif/IBMPlexSerif-TextItalic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSerif/IBMPlexSerif-TextItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexSerif/IBMPlexSerif-TextItalic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSerif/IBMPlexSerif-TextItalic.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Serif"; font-weight: 700; font-style: normal; src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold.eot); src: url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold-Latin1.woff) format("woff"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexSerif/IBMPlexSerif-Bold.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Serif"; font-weight: 700; font-style: italic; src: url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic.eot); src: url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic-Latin2.woff) format("woff2"), url(/fonts/IBMPlexSerif/IBMPlexSerif-BoldItalic.ttf) format("truetype"); } /* IBM Plex Mono */ @font-face { font-family: "IBM Plex Mono"; font-weight: 400; font-style: normal; src: url(/fonts/IBMPlexMono/IBMPlexMono-Text.eot); src: url(/fonts/IBMPlexMono/IBMPlexMono-Text.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexMono/IBMPlexMono-Text-Latin1.woff) format("woff"), url(/fonts/IBMPlexMono/IBMPlexMono-Text-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexMono/IBMPlexMono-Text.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Mono"; font-weight: 400; font-style: italic; src: url(/fonts/IBMPlexMono/IBMPlexMono-TextItalic.eot); src: url(/fonts/IBMPlexMono/IBMPlexMono-TextItalic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexMono/IBMPlexMono-TextItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexMono/IBMPlexMono-TextItalic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexMono/IBMPlexMono-TextItalic.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Mono"; font-weight: 700; font-style: normal; src: url(/fonts/IBMPlexMono/IBMPlexMono-Bold.eot); src: url(/fonts/IBMPlexMono/IBMPlexMono-Bold.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexMono/IBMPlexMono-Bold-Latin1.woff) format("woff"), url(/fonts/IBMPlexMono/IBMPlexMono-Bold-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexMono/IBMPlexMono-Bold.ttf) format("truetype"); } @font-face { font-family: "IBM Plex Mono"; font-weight: 700; font-style: italic; src: url(/fonts/IBMPlexMono/IBMPlexMono-BoldItalic.eot); src: url(/fonts/IBMPlexMono/IBMPlexMono-BoldItalic.eot?#iefix) format("embedded-opentype"), url(/fonts/IBMPlexMono/IBMPlexMono-BoldItalic-Latin1.woff) format("woff"), url(/fonts/IBMPlexMono/IBMPlexMono-BoldItalic-Latin1.woff2) format("woff2"), url(/fonts/IBMPlexMono/IBMPlexMono-BoldItalic.ttf) format("truetype"); } }

body { background-color: #f2f2f2; }

h1 { font-family: "IBM Plex Serif", Georgia, serif; font-weight: bold; font-size: 1.5625rem; line-height: 1.2; }

h2 { font-family: "IBM Plex Serif", Georgia, serif; font-weight: bold; font-size: 1.25rem; margin: 1em 0 0 0; line-height: 1.2; }

h3 { font-family: "IBM Plex Serif", Georgia, serif; font-weight: bold; font-size: 1rem; margin: 1em 0 0 0; line-height: 1.2; }

p, table { margin: 1.2em 0 0 0; }

header + p, h2 + p, h3 + p, header + table, h2 + table, h3 + table { margin: 0; }

a { outline: none; color: #df5b13; }

a:hover { color: #ef6c00; }

pre { margin: 1.5rem 0; overflow: auto; white-space: pre-wrap; }

pre code { font-family: "IBM Plex Mono", Consolas, Monaco, monospace; font-size: .7rem; line-height: 1.3; padding: .5rem; display: block; }

blockquote { font-style: italic; padding: 0 1.75rem 0 1.75rem; }

ul { margin: .5rem 0; }

ul + p { margin: .5rem 0; }

header + ul, h2 + ul, h3 + ul { margin: 0; }

/* masthead */
.masthead { background-color: #374a80; }

.masthead nav a { text-decoration: none; color: #ffffff; }

.masthead nav a:hover { text-decoration: underline; color: #ffffff; }

.masthead ul { margin: 0; padding: 0; }

.masthead nav li { margin: 0 1.4285rem 0 0; position: relative; display: inline-block; font-size: 0.85rem; line-height: 1.42857143; }

@media all and (max-width: 18rem) { .masthead nav li { margin: 0 1rem 0 0; } }

/* all content main is used for layout and semantics, and can contain .page .post, or multiple .post divs */
.page img, .post img { border-radius: 3px; box-shadow: 4px 4px 6px rgba(0, 0, 0, 0.4); display: block; margin: 0 auto; max-width: 100%; }

main header { margin: 0 0 1rem 0; }

main header h1 a { text-decoration: none; color: #222; }

main header h1 a:hover { color: #df5b13; }

/* posts */
.post .dateline { color: #888; font-size: 0.8rem; }

.postlinks { color: #888; font-size: 0.8rem; margin: 1rem 0 0 0; }

.postlinks td:first-child { text-align: right; vertical-align: top; white-space: nowrap; }

.post .colophon { margin-top: .4rem; font-weight: bold; }

/* pages */
.page.multipart header h2 { font-family: "IBM Plex Serif", Georgia, serif; margin: 0; }

/* other container elements and styles */
.changelog > *:not(h2) { margin-left: 2rem; }

/* css for the home page */
/* layout */
.home.masthead { width: 100%; margin: 0; position: relative; }

.home.masthead nav { display: flex; flex-flow: row nowrap; justify-content: space-between; align-items: stretch; padding: 2rem 1rem; margin: 0 auto; max-width: 44rem; }

.home.masthead nav div { max-width: 10rem; margin: 0 1rem; border-radius: 12px; }

.home.masthead nav div:first-child { margin-left: 0; }

.home.masthead nav div:last-child { margin-right: 0; }

/* this media query tells us when we should switch the nav layout from row based to column based */
@media all and (max-width: 36rem) { .home.masthead nav { flex-flow: column wrap; align-items: center; } .home.masthead nav div { margin: 1rem 0; min-width: 10rem; max-width: 10rem; } .home.masthead nav div:first-child { margin-top: 0; } .home.masthead nav div:last-child { margin-bottom: 0; } }

/* */
.home.masthead .hero { width: 100%; height: 375px; background: #ffffff url("/assets/lonepeak-wide.jpg") no-repeat center top; background-size: cover; }

.home.masthead .about { display: block; margin: 0 auto; padding: 1rem; max-width: 44rem; }

.home.masthead .intro { max-width: 50%; margin: 2rem 0; }

.home.masthead .intro p { margin: 0; }

.home.masthead .intro img.avatar { width: 75px; height: 75px; border-radius: 50%; float: left; vertical-align: middle; margin-right: 1rem; }

@media all and (max-width: 36rem) { .home.masthead .intro { margin: 2rem auto; } }

/* styling */
.home.masthead { background-color: #6086C7; }

.home.masthead .about .intro { background-color: #f2f2f2; padding: 1rem; border-radius: 25px; font-size: 0.8rem; }

.home.masthead nav { background-color: #6086C7; }

.home.masthead nav div { background-color: #374a80; color: #ffffff; padding: 1rem 1.5rem; }

.home.masthead nav h2 { font-family: "IBM Plex Sans", Helvetica, Arial, sans-serif; font-size: 1rem; text-align: center; margin: 0 0 1rem 0; }

.home.masthead nav a { text-decoration: none; color: #ffffff; }

.home.masthead nav a:hover { text-decoration: underline; color: #ffffff; }

.home.masthead nav p { font-size: 0.8rem; text-align: center; margin: .25rem; }

/* Table styles */
table.chart { font-size: 0.8rem; border-bottom: 1px solid #d9d9d9; border-collapse: collapse; border-spacing: 0; width: 100%; }

table.chart th { font-weight: bold; text-transform: uppercase; text-align: left; }

table.chart td { border-top: 1px solid #d9d9d9; padding: 2px 10px 2px 0; }

/* css for the archive page */
.page.archive ul li { margin: 0; padding: 0 0 0 2rem; text-indent: -2rem; }

.page.archive table td:nth-child(1) { width: 7rem; text-align: right; vertical-align: top; white-space: nowrap; padding-right: 2em; }

.page.archive table td:nth-child(2) { vertical-align: top; padding: 0 0 0 2rem; text-indent: -2rem; }

.page.archive time { color: #888; font-size: 0.8rem; }

/* css for the topics page */
.page.topics table td:nth-child(1) { width: 7rem; text-align: right; vertical-align: top; white-space: nowrap; padding-right: 2em; }

.page.topics table td:nth-child(2) { vertical-align: top; padding: 0 0 0 2rem; text-indent: -2rem; }

.page.topics time { color: #888; font-size: 0.8rem; }

.page.topics .reference { color: #888; font-size: 0.8rem; }

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