body { font-family: -apple-system, "Helvatica Neue", Helvetica, Arial, sans; margin: 0; background-color: #1c1c1c; color: #eeeeee; }

a { text-decoration: none; font-weight: bold; color: #7598F5; }

#header { line-height: 48px; border-bottom: 1px solid #343434; }
#header .container { box-sizing: border-box; width: 100%; padding: 0 20px; max-width: 1000px; margin: 0 auto; display: flex; justify-content: space-between; font-size: 20px; }
#header .container .app-page { height: 48px; padding: 0; display: flex; }
#header .container .app-page a.primary-link, #header .container .app-page a.secondary-link { display: flex; color: #eeeeee; }
#header .container .app-page a.primary-link .icon, #header .container .app-page a.secondary-link .icon { display: block; width: 36px; height: 36px; margin: 6px; background-size: contain; background-repeat: repeat; background-position: center; background-image: url("/assets/sasquatch.png"); }
#header .container .app-page a.primary-link .text, #header .container .app-page a.secondary-link .text { height: 48px; line-height: 48px; }
#header .container .app-page a.secondary-link .text { opacity: 0.75; font-weight: normal; }
#header .container .app-page a.secondary-link .text:hover { opacity: 1; }
#header .container .app-page a.secondary-link .text:before { content: "/"; padding: 0 4px; }
#header .container .locales .container .locale-link { display: block; line-height: 48px; margin: 0 12px; color: inherit; font-weight: normal; }
#header .container .locales .container .locale-link-current { display: none; }
#header .container .home { display: flex; align-content: stretch; width: 100%; flex-direction: row; gap: 20px; }
@media (max-width: 660px) { #header .container .home { flex-direction: column; gap: 0; } }
#header .container .home a.primary { display: flex; gap: 6px; flex-shrink: 0; }
#header .container .home a.primary .logo { width: 36px; height: 36px; background-image: url("/assets/sasquatch.png"); background-size: contain; background-position: center; background-repeat: no-repeat; margin: 6px 0; }
#header .container .home a.primary .text { font-size: 1.25rem; line-height: 36px; margin: 6px 0; font-family: Charter, Garamond, Cambria, Georgia, Times, serif; font-variant: small-caps; }
#header .container .home .secondary { display: flex; gap: 20px; align-content: stretch; width: 100%; flex-shrink: 1; }
#header .container .home .secondary .leading, #header .container .home .secondary .trailing { display: flex; gap: 20px; flex-grow: 0; flex-shrink: 0; }
#header .container .home .secondary .spacer { flex-grow: 1; min-width: 10px; }
#header .container .home a { color: inherit; }
#header .container a:hover { opacity: 0.6; }

#footer { padding: 40px 20px; color: #eeeeee; background-color: #343434; }
#footer a { font-weight: bold; padding: 6px 10px; color: inherit; }
#footer a:hover { opacity: 0.5; }
#footer .links { text-align: center; padding-bottom: 20px; display: flex; justify-content: center; }
#footer .copyright { margin: 10px 0; text-align: center; color: #aaaaaacc; font-size: 0.8rem; }

#category-header { padding: 30px 20px 0; box-sizing: border-box; max-width: 1000px; margin: 0 auto; }
#category-header a { color: inherit; }
#category-header h1 { font-size: 5rem; line-height: 1.35em; margin: 10px 0; font-family: Charter, Garamond, Cambria, Georgia, Times, serif; }
#category-header .page-summary { font-size: 1.25rem; line-height: 1.35em; }

section.hero .text-container .app-name { font-family: -apple-system, "Helvatica Neue", Helvetica, Arial, sans; color: #7598F5; }
section.hero .text-container ul.features li:before { background-color: revert; background-color: #7598F5; }

section.feature-list-a .feature-container .text-container .badge { color: #7598F5; }

section.bottom-cta .title strong { color: #1c1c1c; background-color: #7598F5; padding: 4px; margin: -4px; }