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 { font-size: 15pt; }
@media (max-width: 700px) { section { font-size: 13pt; } }

section.hero { margin: 0 auto 80px; }
section.hero .image-container { width: 100%; margin: 0 auto; max-width: 1250px; margin: 0 auto; padding: 0 30px; box-sizing: border-box; }
section.hero .image-container .image { height: 70vh; width: 100%; background-size: contain; background-repeat: no-repeat; background-position: center; max-height: 80vw; }
section.hero .text-container { text-align: left; max-width: 660px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }
section.hero .text-container .app-icon { width: 96px; height: 96px; background-size: contain; background-repeat: no-repeat; background-position: center; margin: 3em 0 1em; }
section.hero .text-container .app-name { font-size: 1.5rem; margin: 0; }
section.hero .text-container .title { font-size: 2.25rem; font-weight: bold; text-align: left; margin: 0; }
section.hero .text-container ul.features { padding: 0; font-size: 1.25rem; line-height: 2rem; }
section.hero .text-container ul.features li { list-style: none; text-indent: -1.5em; padding-left: 1.5em; }
section.hero .text-container ul.features li:before { content: ""; display: inline-block; height: 1.25em; width: 1.5em; margin-bottom: -0.25em; mask-image: url("/assets/shared/checkmark.svg"); -webkit-mask-image: url("/assets/shared/checkmark.svg"); background-color: #eeeeee; mask-size: contain; mask-position: center; mask-repeat: no-repeat; -webkit-mask-size: contain; -webkit-mask-position: left; -webkit-mask-repeat: no-repeat; }
section.hero .text-container .cta-download { display: inline-block; margin: 30px 0; }
section.hero .text-container .cta-download .cta-image { display: inline-block; width: 144px; margin: 0 -2px; }
section.hero h4 { text-transform: uppercase; font-family: -apple-system, "Helvatica Neue", Helvetica, Arial, sans; font-size: 21px; margin: 10px 30px; font-weight: 300; }
section.hero h1 { font-family: Charter, Garamond, Cambria, Georgia, Times, serif; font-size: 36px; margin: 10px 30px; font-weight: bold; text-align: center; }
section.hero p { font-size: 21px; font-weight: 300; margin: 10px 30px; line-height: 1.43em; }

section.feature-list-a { list-style-type: none; }
section.feature-list-a .feature-container { padding: 0 20px; box-sizing: border-box; max-width: 900px; margin: 0 auto; display: flex; flex-direction: row-reverse; justify-content: center; margin: 0 auto; gap: 20px; }
section.feature-list-a .feature-container .image-container { width: 38.2%; min-width: 350px; flex-shrink: 0; flex-grow: 0; margin: 0 auto; }
section.feature-list-a .feature-container .image-container .image { width: 100%; height: 0; padding-top: 100%; background-size: contain; background-position: bottom; background-repeat: no-repeat; }
section.feature-list-a .feature-container .text-container { flex-grow: 1; display: flex; flex-direction: column; justify-content: center; font-size: 15pt; }
section.feature-list-a .feature-container .text-container .badge { color: #7598F5; font-family: -apple-system, "Helvatica Neue", Helvetica, Arial, sans; font-size: 1rem; text-transform: uppercase; font-weight: 500; margin: 0.25em 0; }
section.feature-list-a .feature-container .text-container .title { font-size: 1.5rem; font-weight: bold; font-family: Charter, Garamond, Cambria, Georgia, Times, serif; margin: 0; }
section.feature-list-a .feature-container .text-container .message { font-size: 1rem; line-height: 1.43em; }
@media (max-width: 700px) { section.feature-list-a .feature-container { flex-direction: column !important; max-width: 450px; margin: 0 auto; } }
section.feature-list-a .background:nth-of-type(2n) .feature-container { flex-direction: row; }

section.feature-list-b { list-style-type: none; padding: 0 20px; box-sizing: border-box; max-width: 900px; margin: 0 auto; }
section.feature-list-b .section-header { margin-bottom: 1em; }
section.feature-list-b .section-header .title { font-size: 2rem; margin: 0.25em 0; }
section.feature-list-b .section-header .subtitle { font-size: 1.25rem; color: #aaaaaacc; font-weight: normal; margin: 0.25em 0; }
section.feature-list-b ul.item-list { padding: 0; list-style-type: none; display: flex; justify-content: center; flex-wrap: wrap; gap: 20px; align-items: flex-start; justify-content: left; }
section.feature-list-b ul.item-list li.item { flex-grow: 0; flex-shrink: 0; width: 33.333%; max-width: 270px; }
@media (max-width: 660px) { section.feature-list-b ul.item-list li.item { width: 50%; } }
@media (max-width: 450px) { section.feature-list-b ul.item-list li.item { width: 100%; max-width: 300px; } }
section.feature-list-b ul.item-list li.item .feature-icon { display: block; width: 64px; height: 64px; background-size: contain; background-repeat: no-repeat; background-position: center; margin-bottom: 8px; }
section.feature-list-b ul.item-list li.item .feature-title { font-family: Charter, Garamond, Cambria, Georgia, Times, serif; font-size: 1.25rem; margin: 0; color: #7598F5; }
section.feature-list-b ul.item-list li.item .feature-message { font-size: 1rem; line-height: 1.5em; }

section.feature-list-c { padding: 0 20px; }
section.feature-list-c ul.features { list-style-type: none; padding-inline-start: 0; }
section.feature-list-c ul.features li.item { max-width: 540px; margin: 80px auto; box-sizing: border-box; }
section.feature-list-c ul.features li.item .container .feature-image { display: block; width: 100%; padding-top: 100%; height: 0; margin: 20px 0; background-size: contain; background-repeat: no-repeat; background-position: center; }
section.feature-list-c ul.features li.item .container .feature-text .feature-title { margin: 0; font-size: 1.75rem; text-align: center; }
section.feature-list-c ul.features li.item .container .feature-text .feature-description { font-size: 1.5rem; line-height: 1.35em; }
section.feature-list-c ul.features li.item .container .feature-text .feature-description p { margin: 0.5em 0; }

section.bottom-cta { width: 100%; max-width: 900px; margin: 80px auto 20px; text-align: center; background-color: #343434; padding: 40px 20px; box-sizing: border-box; }
section.bottom-cta .image { width: 100%; height: 200px; background-size: contain; background-repeat: no-repeat; background-position: center; }
section.bottom-cta .text-container { max-width: 450px; margin: 0 auto; }
section.bottom-cta .text-container .title { margin: 0; }
section.bottom-cta .text-container .message { font-size: 1.25rem; line-height: 1.45em; }
section.bottom-cta .text-container a.cta-download img { width: 144px; margin: 30px auto; }