/** * Import npm dependencies * * Prefix your imports with `~` to grab from node_modules/ * @see https://github.com/webpack-contrib/sass-loader#imports */ /** Import theme styles */ /* spacing */ /** Colors */ /** Fonts */ /** Breakpoints */ *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } html { font-family: sans-serif; line-height: 1.15; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -ms-overflow-style: scrollbar; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } @-ms-viewport { width: device-width; } article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; } body { margin: 0; font-family: "Spectral", serif; font-size: 1rem; font-weight: 400; line-height: 1.5; color: var(--body-text); text-align: left; background-color: var(--body-bg); } [tabindex="-1"]:focus { outline: none !important; } hr { -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; overflow: visible; } h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: 0.5rem; } p { margin-top: 0; margin-bottom: 1rem; } abbr[title], abbr[data-original-title] { text-decoration: underline; -webkit-text-decoration: underline dotted; text-decoration: underline dotted; cursor: help; border-bottom: 0; } address { margin-bottom: 1rem; font-style: normal; line-height: inherit; } ol, ul, dl { margin-top: 0; margin-bottom: 1rem; } ol ol, ul ul, ol ul, ul ol { margin-bottom: 0; } dt { font-weight: 600; } dd { margin-bottom: 0.5rem; margin-left: 0; } blockquote { margin: 0 0 1rem; } dfn { font-style: italic; } b, strong { font-weight: bolder; } small { font-size: 80%; } sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } a { color: var(--primary); text-decoration: none; background-color: transparent; -webkit-text-decoration-skip: objects; } a:hover, a:focus { color: var(--primary-dark); text-decoration: underline; } /* a:not([href]):not([tabindex]) { color: inherit; text-decoration: none; &:focus, &:hover { color: inherit; text-decoration: none; } &:focus { outline: 0; } } */ pre, code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; -ms-overflow-style: scrollbar; } figure { margin: 0 0 1rem; } img { vertical-align: middle; border-style: none; } svg:not(:root) { overflow: hidden; } a, area, button, [role=button], input:not([type=range]), label, select, summary, textarea { -ms-touch-action: manipulation; touch-action: manipulation; } table { border-collapse: collapse; } caption { padding-top: 0.75rem; padding-bottom: 0.75rem; color: #666; text-align: left; caption-side: bottom; } th { text-align: inherit; } label { display: inline-block; margin-bottom: 0.5rem; } button { border-radius: 0; } button:focus { outline: 1px dotted; outline: 5px auto -webkit-focus-ring-color; } input, button, select, optgroup, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; } button, input { overflow: visible; } button, select { text-transform: none; } button, html [type=button], [type=submit] { -webkit-appearance: button; } button::-moz-focus-inner, [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner { padding: 0; border-style: none; } input[type=radio], input[type=checkbox] { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; } input[type=date], input[type=time], input[type=datetime-local], input[type=month] { -webkit-appearance: listbox; } textarea { overflow: auto; resize: vertical; } fieldset { min-width: 0; padding: 0; margin: 0; border: 0; } legend { display: block; width: 100%; max-width: 100%; padding: 0; margin-bottom: 0.5rem; font-size: 1.5rem; line-height: inherit; color: inherit; white-space: normal; } progress { vertical-align: baseline; } [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; } [type=search] { outline-offset: -2px; -webkit-appearance: none; } [type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; } output { display: inline-block; } summary { display: list-item; } template { display: none; } [hidden] { display: none !important; } :root { --primary: #b01109; --primary-dark: #7f0c07; --primary-alpha: rgba(176, 17, 9, 0.25); --primary-fg: #fff; --accent: #015d75; --accent-alpha: rgba(1, 93, 117, 0.25); --accent-dark: #013542; --accent-fg: #fff; --success: #070; --error: #d00; --warning: #e90; --body-bg: #fff; --body-bg-alt: #f6f6f6; --body-text: #222; --header-bg: #fff; --header-text: #222; --footer-bg: #444; --footer-text: #fff; } .content-max-width { max-width: 1330px; margin: 0 auto; } img { max-width: 100%; } .clearfix::after { display: block; clear: both; content: ""; } /** * CSS file contents originally from WP Accessibility Plugin v.1.3.10 which is released under GPL v3 * original author Chris Rodriguez * modified by Brad Payne, Ashlee Zhang */ /***** Accessibility styles *****/ .focusable:focus { outline: none; } .has-focus { background: yellow; } .a11y-toolbar { margin: 0 auto; padding: 0 1rem; position: fixed; text-align: right; top: 0; width: 100vw; z-index: 99999; } .a11y-fontsize { background-color: var(--primary-fg); border-color: var(--primary); border-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; color: var(--primary); font-size: 1rem; font-weight: normal; line-height: 1.5; margin: 0; padding: 0.25rem 0.875rem; text-align: center; text-transform: none; } .a11y-fontsize:focus, .a11y-fontsize.focus, .a11y-fontsize:hover { background-color: var(--primary-fg); border-color: var(--primary-dark); color: var(--primary-dark); } .a11y-fontsize:focus, .a11y-fontsize.focus { -webkit-box-shadow: 0 0 0 2px var(--primary-fg), 0 0 0 4px var(--primary-dark); box-shadow: 0 0 0 2px var(--primary-fg), 0 0 0 4px var(--primary-dark); } .a11y-fontsize:active, .a11y-fontsize.active { background-image: none; -webkit-box-shadow: 0 0 0 3px var(--primary-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: 0 0 0 3px var(--primary-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); } .fontsize { font-size: 22px; } .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(50%); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */ } .screen-reader-text:focus { background-color: var(--body-bg); border-radius: 3px; -webkit-box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6); clip: auto !important; -webkit-clip-path: none; clip-path: none; color: var(--body-text); display: block; font-size: 0.875rem; font-weight: bold; height: auto; left: 5px; line-height: normal; padding: 15px 23px 14px; text-decoration: none; top: 5px; width: auto; z-index: 100000; /* Above WP toolbar. */ } .button, button, input[type=submit], a.call-to-action { border-style: solid; border-width: 2px; border-radius: 3px; display: inline-block; font-family: "Karla", sans-serif; font-weight: 600; line-height: 1.5; padding: 0.875rem 3.25rem; vertical-align: middle; text-align: center; text-decoration: none; text-transform: uppercase; } .button:focus, .button.focus, .button:hover, button:focus, button.focus, button:hover, input[type=submit]:focus, input[type=submit].focus, input[type=submit]:hover, a.call-to-action:focus, a.call-to-action.focus, a.call-to-action:hover { text-decoration: none; } .button:focus, .button.focus, button:focus, button.focus, input[type=submit]:focus, input[type=submit].focus, a.call-to-action:focus, a.call-to-action.focus { outline: 0; } .button.disabled, .button:disabled, button.disabled, button:disabled, input[type=submit].disabled, input[type=submit]:disabled, a.call-to-action.disabled, a.call-to-action:disabled { opacity: 0.65; -webkit-box-shadow: none; box-shadow: none; } .button:active, .button.active, button:active, button.active, input[type=submit]:active, input[type=submit].active, a.call-to-action:active, a.call-to-action.active { background-image: none; -webkit-box-shadow: 0 0 0 3px var(--primary-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: 0 0 0 3px var(--primary-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); } .button, button, input[type=submit] { background-color: var(--primary); border-color: var(--primary); color: var(--primary-fg); } .button:focus, .button.focus, .button:hover, button:focus, button.focus, button:hover, input[type=submit]:focus, input[type=submit].focus, input[type=submit]:hover { background-color: var(--primary-dark); border-color: var(--primary-dark); color: var(--primary-fg); } .button:focus, .button.focus, button:focus, button.focus, input[type=submit]:focus, input[type=submit].focus { -webkit-box-shadow: 0 0 0 2px var(--primary-fg), 0 0 0 4px var(--primary-dark); box-shadow: 0 0 0 2px var(--primary-fg), 0 0 0 4px var(--primary-dark); } .button.button--accent, button.button--accent, input[type=submit].button--accent { background-color: var(--accent); border-color: var(--accent); color: var(--accent-fg); } .button.button--accent:focus, .button.button--accent.focus, .button.button--accent:hover, button.button--accent:focus, button.button--accent.focus, button.button--accent:hover, input[type=submit].button--accent:focus, input[type=submit].button--accent.focus, input[type=submit].button--accent:hover { background-color: var(--accent-dark); border-color: var(--accent-dark); color: var(--accent-fg); } .button.button--accent:focus, .button.button--accent.focus, button.button--accent:focus, button.button--accent.focus, input[type=submit].button--accent:focus, input[type=submit].button--accent.focus { -webkit-box-shadow: 0 0 0 2px var(--accent-fg), 0 0 0 4px var(--accent-dark); box-shadow: 0 0 0 2px var(--accent-fg), 0 0 0 4px var(--accent-dark); } .button.button--accent:active, .button.button--accent.active, button.button--accent:active, button.button--accent.active, input[type=submit].button--accent:active, input[type=submit].button--accent.active { background-image: none; -webkit-box-shadow: 0 0 0 3px var(--accent-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: 0 0 0 3px var(--accent-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); } .call-to-action { background-color: var(--primary-fg); border-color: var(--primary); color: var(--primary); } .call-to-action:focus, .call-to-action.focus, .call-to-action:hover { background-color: var(--primary-fg); border-color: var(--primary-dark); color: var(--primary-dark); } .call-to-action:focus, .call-to-action.focus { -webkit-box-shadow: 0 0 0 2px var(--primary-fg), 0 0 0 4px var(--primary-dark); box-shadow: 0 0 0 2px var(--primary-fg), 0 0 0 4px var(--primary-dark); } .call-to-action.call-to-action--accent { background-color: var(--accent-fg); border-color: var(--accent); color: var(--accent); } .call-to-action.call-to-action--accent:focus, .call-to-action.call-to-action--accent.focus, .call-to-action.call-to-action--accent:hover { background-color: var(--accent-fg); border-color: var(--accent-dark); color: var(--accent-dark); } .call-to-action.call-to-action--accent:focus, .call-to-action.call-to-action--accent.focus { -webkit-box-shadow: 0 0 0 2px var(--accent-fg), 0 0 0 4px var(--accent-dark); box-shadow: 0 0 0 2px var(--accent-fg), 0 0 0 4px var(--accent-dark); } .call-to-action.call-to-action--accent:active, .call-to-action.call-to-action--accent.active { background-image: none; -webkit-box-shadow: 0 0 0 3px var(--accent-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: 0 0 0 3px var(--accent-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); } [class$="--accent"] .call-to-action { background-color: var(--accent); border-color: var(--accent-fg); color: var(--accent-fg); } [class$="--accent"] .call-to-action:focus, [class$="--accent"] .call-to-action.focus, [class$="--accent"] .call-to-action:hover { background-color: var(--accent-dark); border-color: var(--accent-fg); color: var(--accent-fg); } [class$="--accent"] .call-to-action:focus, [class$="--accent"] .call-to-action.focus { -webkit-box-shadow: 0 0 0 2px var(--accent-dark), 0 0 0 4px var(--accent-fg); box-shadow: 0 0 0 2px var(--accent-dark), 0 0 0 4px var(--accent-fg); } [class$="--accent"] .call-to-action:active, [class$="--accent"] .call-to-action.active { background-image: none; -webkit-box-shadow: 0 0 0 3px var(--accent-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: 0 0 0 3px var(--accent-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); } .button--circle { -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: var(--primary); border-color: var(--primary); border-radius: 50%; border-style: solid; border-width: 2px; color: var(--primary-fg); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 3.75rem; width: 3.75rem; } .button--circle:focus, .button--circle.focus, .button--circle:hover { background-color: var(--primary-dark); border-color: var(--primary-dark); color: var(--primary-fg); text-decoration: none; } .button--circle:focus, .button--circle.focus { -webkit-box-shadow: 0 0 0 2px var(--primary-fg), 0 0 0 4px var(--primary-dark); box-shadow: 0 0 0 2px var(--primary-fg), 0 0 0 4px var(--primary-dark); } .button--circle:active, .button--circle.active { background-image: none; -webkit-box-shadow: 0 0 0 3px var(--primary-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: 0 0 0 3px var(--primary-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); } .button--circle--accent { background-color: var(--accent); color: var(--accent-fg); } .button--circle--accent:focus, .button--circle--accent.focus, .button--circle--accent:hover { background-color: var(--accent-dark); border-color: var(--accent-dark); color: var(--accent-fg); } .button--circle--accent:focus, .button--circle--accent.focus { -webkit-box-shadow: 0 0 0 2px var(--accent-fg), 0 0 0 4px var(--accent-dark); box-shadow: 0 0 0 2px var(--accent-fg), 0 0 0 4px var(--accent-dark); } .button--circle--accent:active, .button--circle--accent.active { -webkit-box-shadow: 0 0 0 3px var(--accent-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); box-shadow: 0 0 0 3px var(--accent-alpha), inset 0 3px 5px rgba(0, 0, 0, 0.125); } .dropdown > p { margin-bottom: 0; } .dropdown button { border: 0; border-bottom: 3px solid var(--header-color); border-radius: 0; background: transparent; color: var(--header-color); text-transform: none; text-align: left; padding: 0 0 0.5rem; width: 100%; } .dropdown button:hover, .dropdown button:focus { color: var(--primary-dark, #7f0c07); border-bottom-color: var(--primary-dark, #7f0c07); } .dropdown button:active { -webkit-box-shadow: unset; box-shadow: unset; } .dropdown button .arrow { display: block; float: right; margin-top: 0.5rem; } .dropdown [aria-expanded=true] .arrow { -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .dropdown-menu { position: absolute; top: 100%; left: 0; z-index: 1000; display: none; float: left; min-width: 10rem; padding: 0.5rem 0; margin: 0.125rem 0 0; font-size: 1rem; color: #222; text-align: left; list-style: none; background-color: var(--body-bg); background-clip: padding-box; border: 2px solid rgba(0, 0, 0, 0.15); border-radius: 3px; -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175); box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175); } .dropdown-menu.dropdown-menu-block { width: 100%; } .dropup .dropdown-menu { margin-top: 0; margin-bottom: 0.125rem; } .dropup .dropdown-toggle::after { border-top: 0; border-bottom: 0.3em solid; } .dropdown-item { display: block; width: 100%; padding: 0.25rem 1.5rem; clear: both; font-weight: 400; color: #222; text-align: inherit; white-space: nowrap; background: var(--body-bg-alt); border: 0; } .dropdown-item:focus, .dropdown-item:hover { color: #151515; text-decoration: none; background-color: var(--accent); } .dropdown-item.active, .dropdown-item:active { color: var(--primary); text-decoration: none; background-color: var(--accent); } .dropdown-item.disabled, .dropdown-item:disabled { color: #666; background-color: transparent; } .show > a { outline: 0; } .dropdown-menu.show { display: block; } .dropdown-header { display: block; padding: 0.5rem 1.5rem; margin-bottom: 0; font-size: 0.875rem; color: #666; white-space: nowrap; } .alignleft { float: left; margin-right: 1.5em; } .alignright { float: right; margin-left: 1.5em; } .aligncenter { clear: both; } .block-reading-meta { background-color: var(--body-bg-alt); font-family: "Karla", sans-serif; padding: 2rem 1rem 4rem; } @media screen and (min-width: 768px) { .block-reading-meta { padding: 2rem 1rem 2.25rem; } } .block-reading-meta .license-attribution { font-size: 1rem; } .block-reading-meta .license-attribution img { margin-bottom: 1rem; height: 2rem; width: auto; } .block-reading-meta__inner { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; max-width: 1200px; margin: 0 auto; } .block-reading-meta__subsection { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 300px; padding-right: 2rem; } .block-reading-meta__subtitle { font-size: 1.25rem; text-align: left; color: var(--primary); margin-bottom: 1rem; } .block-reading-meta__subtitle::before { display: none; } .block-reading-meta__share { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; } .block-reading-meta__share > :first-child { margin-left: 0; } .block-reading-meta__share svg { width: 3rem; height: 2rem; } html { -webkit-font-smoothing: antialiased; } main * + p { margin-top: 1.5em; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.5rem; font-family: "Karla", sans-serif; font-weight: 700; line-height: 1.5; } h1 a, h1 a:hover, h1 a:visited, h1 a:active, h2 a, h2 a:hover, h2 a:visited, h2 a:active, h3 a, h3 a:hover, h3 a:visited, h3 a:active, h4 a, h4 a:hover, h4 a:visited, h4 a:active, h5 a, h5 a:hover, h5 a:visited, h5 a:active, h6 a, h6 a:hover, h6 a:visited, h6 a:active { color: inherit; } .home h1, .home h2, .home h3, .home h4, .home h5, .home h6 { color: var(--primary); } h1 { font-size: 2.25rem; text-align: center; text-transform: uppercase; } h1::before { content: ""; display: block; margin: 0.5rem auto 1rem; width: 2.8125rem; height: 0.3125rem; background: var(--accent); } @media screen and (min-width: 60rem) { h1::before { margin-bottom: 2rem; width: 4.6875rem; } } @media screen and (min-width: 768px) { h1 { font-size: 3rem; } } h2 { margin-bottom: 2rem; font-size: 1.875rem; font-weight: 600; text-align: center; text-transform: uppercase; } h2::before { content: ""; display: block; margin: 0.5rem auto 1rem; width: 2.8125rem; height: 0.3125rem; background: var(--accent); } @media screen and (min-width: 60rem) { h2::before { margin-bottom: 2rem; width: 4.6875rem; } } @media screen and (min-width: 768px) { h2 { font-size: 2.25rem; } } h3 { font-size: 2.25rem; } h4 { font-size: 1.875rem; } h5 { font-size: 1.5rem; } h6 { font-size: 1.25rem; } p, ul, ol { font-size: 1.125rem; line-height: 1.5; } .page-section, .wp-activate-container, .mu_register.wp-signup-container { width: 100%; padding: 4rem 1rem; background: var(--body-bg); text-align: center; } .page-section ul, .wp-activate-container ul, .mu_register.wp-signup-container ul, .page-section ol, .wp-activate-container ol, .mu_register.wp-signup-container ol { padding-left: 0; list-style-position: inside; } .page-section--accent { color: var(--accent-fg); background: var(--accent); } .page-section--accent h2 { color: var(--accent-fg); } .page-section--accent h2::before { background: var(--accent-fg); } .page-section--bordered { width: calc(100% - 2rem); margin: 5rem auto 0; border: solid 4px var(--accent); } .page-section--borderless { -webkit-box-shadow: none; box-shadow: none; } .block__subtitle { font-size: 1.5rem; margin-bottom: 1rem; text-transform: uppercase; } @media screen and (min-width: 768px) { .block__subtitle { margin-bottom: 1.5rem; } } .block-toggle__cta { position: relative; text-align: center; } @media screen and (min-width: 60rem) { .block-toggle__cta { display: none; } } .block-toggle__cta__blurb { font-size: 0.875rem; margin-bottom: 0; padding-bottom: 2.5rem; } .block-toggle__cta__button { bottom: 0; cursor: pointer; font-size: 1.5rem; left: 50%; margin: 0; position: absolute; -webkit-transform: translate(-50%, 50%); -o-transform: translate(-50%, 50%); transform: translate(-50%, 50%); z-index: 10; color: var(--primary); } .block-toggle__cta__button svg { width: 1.5rem; height: 2rem; } .block-toggle__cta__button.--visible svg { -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .block.block-toggle { padding-bottom: 0; } @media screen and (max-width: 59.975rem) { .block.block-toggle:not(.block-toggle--visible) .block-toggle__content { display: none; } .block.block-toggle.block-toggle--visible .block-toggle__cta__blurb { display: none; } } .block.block-toggle.block-meta { padding-bottom: 6rem; } @media screen and (min-width: 60rem) { .has-sections .entry-content { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; max-width: 90rem; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-pack: distribute; justify-content: space-around; } .page-section, .wp-activate-container, .mu_register.wp-signup-container { width: 100%; max-width: 50rem; margin: 4rem auto; padding: 4rem 5.625rem; -webkit-box-shadow: -3px 5px 4px 2px rgba(135, 135, 135, 0.09); box-shadow: -3px 5px 4px 2px rgba(135, 135, 135, 0.09); } .page-section:first-of-type, .wp-activate-container:first-of-type, .mu_register.wp-signup-container:first-of-type, .page-section:nth-of-type(2), .wp-activate-container:nth-of-type(2), .mu_register.wp-signup-container:nth-of-type(2) { width: calc(50% - 4rem); } .page-section:only-of-type, .wp-activate-container:only-of-type, .mu_register.wp-signup-container:only-of-type { width: 100%; max-width: 50rem; } .page-section--bordered { margin: 4rem auto; width: 100%; max-width: 50rem; -webkit-box-shadow: none; box-shadow: none; } .page-section--bordered:first-of-type, .page-section--bordered:nth-of-type(2) { width: calc(50% - 4rem); } .page-section--bordered:only-of-type { width: 100%; max-width: 50rem; } } .home h1 { text-transform: none; } .home h1::before { display: none; } .page:not(.has-sections) article { width: 100%; padding: 4rem 1rem; background: var(--body-bg); text-align: left; } @media screen and (min-width: 60rem) { .page:not(.has-sections) article { width: 100%; max-width: 50rem; margin: -80% auto 4rem; padding: 4rem 5.625rem; -webkit-box-shadow: -3px 5px 4px 2px rgba(135, 135, 135, 0.09); box-shadow: -3px 5px 4px 2px rgba(135, 135, 135, 0.09); } } .page:not(.has-sections) .entry-header { margin-bottom: 2rem; } #content { position: relative; margin: 0 auto; background-color: var(--body-bg); width: 100%; } @media screen and (min-width: 60rem) { #content { width: var(--reading-width, 40em); } } #content img { height: auto; max-width: 100%; } #content .wp-caption, #content .wp-nocaption { height: auto; max-width: 100%; } .single #content { min-height: 350px; margin-bottom: 0; } .edit-link { margin-top: 5rem; } @media print { body { background: none; } a { color: #000; } #wrap { position: relative; display: block; float: none; margin: 0 auto; clear: both; } #header { padding-bottom: 18pt; border-bottom: 2pt solid #000; } .entry-content { font-size: 14pt; line-height: 1.6em; } .entry-title { font-size: 21pt; } #branding img, #respond, #comments, #searchform, .comment-edit-link, .edit-link, .navigation, .page-link, .widget-area, .nav, .share-wrap-single, .sidebar { display: none; } #container, #header, .footer { width: 100%; margin: 0; } .footer, nav { color: #000; background: #fff; } #content { width: 100%; padding: 10px; margin: 24pt 0 0; } .wp-caption p { font-size: 11pt; } .home .sticky { border: 0; } .wrapper { height: auto; min-height: 100px; margin: 0 auto; } } .footer { --brand: var(--footer-color); --primary-dark: var(--footer-color); background-color: #444; color: #fff; font-family: "Karla", sans-serif; padding: 0 0 2rem; } .footer h1, .footer h2, .footer h3, .footer h4, .footer h5, .footer h6 { font-size: 1.125rem; font-weight: 600; margin-bottom: 1rem; } .footer h1::before, .footer h2::before, .footer h3::before, .footer h4::before, .footer h5::before, .footer h6::before { display: none; } .footer.footer--home { padding-top: 4rem; } .footer.footer--reading { padding-top: 1rem; padding-bottom: 7rem; } @media screen and (min-width: 48rem) { .footer.footer--reading { padding-bottom: 4rem; } } @media screen and (min-width: 1330px) { .footer.footer--reading { padding-bottom: 1rem; } } @media screen and (min-width: 768px) { .footer { padding-bottom: 0.5rem; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } } .footer__inner { margin: 0 auto; } .footer__pressbooks { max-width: 1330px; margin: 2rem auto 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } @media screen and (min-width: 768px) { .footer__pressbooks { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin: 2rem auto; } } .footer__pressbooks a { color: var(--footer-text); } .footer__pressbooks__icon { margin: 0 1rem; } .footer__pressbooks__icon > .icon--svg { height: 2.8125rem; width: 2.8125rem; } .footer__pressbooks__links { margin-bottom: 1.5rem; margin-top: 1.5rem; padding: 0 1.875rem; } @media screen and (min-width: 768px) { .footer__pressbooks__links { margin: 0; padding: 0; } } .footer__pressbooks__links__list { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; font-size: 0.875rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; list-style: none; margin: 0; padding-left: 0; } .footer__pressbooks__links__list li { padding: 0.125rem 0; } .footer__pressbooks__links__list a { padding-left: 0.5rem; padding-right: 0.5rem; } .footer__pressbooks__links__title { font-size: 1rem; font-weight: 600; text-align: center; } .footer__pressbooks__social { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0 1rem; } .footer__pressbooks__social a { margin: 0 0.25em; } .footer__pressbooks__social a > .icon--svg { height: 2rem; width: 2rem; } .footer__pressbooks__social a > .youtube-link { height: 2.2em; width: auto; padding-bottom: 0.6em; margin-right: 0.2em; } @media (min-width: 960px) { .footer__pressbooks__social a > .icon--svg { height: 1.5rem; width: 1.5rem; } .footer__pressbooks__social a > .youtube-link { height: 1.9em; width: auto; padding-bottom: 0.7em; margin-right: 0.2em; } } .footer__network { height: auto; margin-bottom: 0; padding: 2.5rem 1.875rem; font-family: "Karla", sans-serif; font-size: 1rem; color: var(--accent-fg); background-color: var(--accent, #015d75); text-align: center; } .footer__network .social-media { margin-top: 1em; } .footer__network .social-media a { width: 2rem; height: 2rem; margin: 0 0.25em; -webkit-transition: all 0.4s; -o-transition: all 0.4s; transition: all 0.4s; } .footer__network .social-media a > .icon--svg { height: 2rem; width: 2rem; } .footer__network ul { margin: 0; padding: 0; list-style: none; text-align: center; font-weight: 600; line-height: 2.25; } .footer__network__block { border-top: solid 1px var(--accent-fg); } .footer__network__block:first-of-type { border-top: 0; } .footer__network__block a { color: var(--accent-fg); text-decoration: none; border-bottom: solid 1px transparent; } .footer__network__block a:hover, .footer__network__block a:focus { border-bottom: solid 1px var(--accent-fg); } .footer__network__block--1 { margin: 0 -5px; padding: 0 0 40px; } .footer__network__block--2 { padding: 30px 7.5px; } .footer__network__block--2 .widget { margin-bottom: 1em; } .footer__network__menu { padding: 30px 7.5px 0; } .footer__network__block .social-media { margin-top: 0; width: 100%; } .footer__network__block .social-media a { margin: 0 0.5em 0 0; border-bottom: none; } .footer__network__block .social-media a:hover, .footer__network__block .social-media a:focus { border-bottom: none; } @media (min-width: 960px) { .footer__network { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .footer__network ul { text-align: left; } .footer__network__block { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0; padding: 0 3.75rem; border-top: 0; border-right: solid 1px var(--accent-fg); } .footer__network__block--2 { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .footer__network__block:last-of-type { border-right: 0; } .social-media a { width: 1.5rem; height: 1.5rem; margin: 0 0.5em 0 0; } .social-media a > .icon--svg { height: 1.5rem; width: 1.5rem; } } @media (min-width: 1650px) { .footer__network ul li { display: inline-block; margin-right: 3em; } } .header { font-family: "Karla", sans-serif; } .header__inside { -webkit-box-align: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; max-width: 1440px; margin: 0 auto; padding: 3.5rem 1rem 1.5rem; } @media screen and (min-width: 60rem) { .header__inside { padding: 3rem 1rem; } } .header__logo--img, .header__logo--svg { display: inline-block; width: auto; max-width: 100px; height: auto; max-height: 1.5rem; margin-bottom: -1px; margin-right: 2px; } @media screen and (min-width: 30rem) and (max-width: 60rem) { .header__logo--img, .header__logo--svg { max-width: 150px; } } @media screen and (min-width: 60rem) { .header__logo--img, .header__logo--svg { max-width: 200px; max-height: 30px; } } .header__nav-icon { display: block; position: relative; width: 25px; height: 20px; z-index: 999; text-indent: -9999em; } @media screen and (min-width: 60rem) { .header__nav-icon { display: none; } } .header__nav-icon__icon { display: block; position: absolute; top: 7px; width: 25px; height: 3px; background: var(--primary); } .header__nav-icon__icon::before, .header__nav-icon__icon::after { width: 25px; height: 3px; content: ""; background: var(--primary); } .header__nav-icon__icon::before { position: absolute; top: -7px; right: 0; } .header__nav-icon__icon::after { position: absolute; top: 7px; right: 0; } .header__nav--active .header__nav-icon__icon { --header-bg: var(--primary); --header-text: var(--primary-fg); color: var(--header-text); background: var(--header-text); } .header__nav--active .header__nav-icon__icon::before, .header__nav--active .header__nav-icon__icon::after { background: var(--header-text); } .js-header-nav .nav--primary { list-style: none; padding-left: 0; margin-bottom: 0; } .js-header-nav .nav--primary li { display: inline; padding-left: 1rem; font-size: 1.125rem; } @media screen and (max-width: 59.975rem) { .js-header-nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; left: 0; margin: 0 0 0 -100%; padding: 0 17px; position: absolute; top: 0; width: 100%; } .js-header-nav .nav--primary li { display: block; padding-left: 0; } .js-header-nav a { display: none; font-family: "Karla", sans-serif; font-size: 1.5rem; line-height: 3.3333333333; color: var(--header-color); letter-spacing: 0; } .header__nav--active .js-header-nav { --header-color: var(--primary-fg); margin: 0; padding: 6rem 52px; z-index: 99; background: var(--primary); } .header__nav--active .js-header-nav .nav--primary li { border-bottom: solid 1px var(--header-color); } .header__nav--active .js-header-nav .nav--primary li:last-child { border-bottom: 0; } .header__nav--active .js-header-nav a { display: block; width: 100%; } .header__nav--active .js-header-nav a:hover { color: var(--header-color); } } .header--home { --brand: var(--header-color); --primary-dark: var(--header-color); --brand-accent: var(--header-color); background-color: var(--header-bg); color: var(--header-color); } .header__search { position: relative; } .icon-search { vertical-align: middle; } .header:not(.header--home) .icon-search { font-size: 1.5rem; cursor: pointer; } .header__search__form { display: inline-block; position: relative; width: 12rem; } .header__search__form label { position: absolute; left: 0; width: 12rem; } .header__search__form label .icon--svg { width: 1.5rem; height: 2rem; display: inline-block; float: right; vertical-align: middle; } .header__search__form input[type=search] { background-color: transparent; border: 0 none; border-bottom: 2px solid var(--primary); color: var(--body-color); width: 12rem; } .header__search__form input[type=search]:focus { border-color: var(--brand-orig); } .header__search__form input[type=search]:focus + label { text-indent: -999999rem; } .header--home .header__search__form input[type=search] { color: var(--header-color); border-bottom: 1px solid var(--header-color); } .header--home .header__search__form input[type=search]:focus { border-color: var(--brand-orig); } .header__search__form input[type=submit] { display: none; } /** Import theme styles */ :root { --reading-width: 50em; } .book { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; width: 100%; max-width: 22.9375rem; height: 24.125rem; margin: 0 0 2rem; padding: 1.5rem 1rem 2rem; border: solid 2px var(--accent); background: var(--accent); } @media screen and (min-width: 30rem) { .book { padding: 1.5rem 1.85rem 2.1875rem; } } .book a, .book p { font-family: "Karla", sans-serif; color: var(--accent-fg); } .book a { margin: 0; text-decoration: none; text-align: center; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto; } .book__title { margin: 0; font-size: 1.25rem; font-weight: 500; line-height: 1.2; text-align: left; } @media screen and (min-width: 30rem) { .book__title { font-size: 1.75rem; } } .book__subject { margin: 0; font-size: 0.75rem; text-align: left; } @media screen and (min-width: 30rem) { .book__subject { font-size: 1rem; } } .book__institutions { margin: 0.5rem 0 0; font-size: 0.875rem; text-align: left; display: box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .book__read-more { margin: auto 0 0; font-size: 1rem; text-align: left; } @media screen and (min-width: 30rem) { .book__read-more { font-size: 1.125rem; } } .book__read-more a svg { width: 1rem; height: 1rem; vertical-align: middle; } @media screen and (min-width: 30rem) { .book__read-more a svg { width: 1.125rem; height: 1.125rem; margin-left: 0.5rem; } } .book:last-child { margin-bottom: 0; } @media screen and (min-width: 60rem) { .book:last-child { margin-bottom: 2rem; } } label { margin: 0 0 1rem; font-family: "Karla", sans-serif; } textarea { height: 7.5em; resize: none; } input[type=text], input[type=email], input[type=tel], textarea { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; border-top: 0; border-right: 0; border-left: 0; border-bottom: solid 2px var(--body-text); border-radius: 0; padding: 0 0 1.5em; font-size: 1rem; font-weight: 600; font-family: "Karla", sans-serif; background: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type=text]:focus, input[type=email]:focus, input[type=tel]:focus, textarea:focus { outline: none; border-bottom: solid 2px var(--accent); } input[type=submit] { cursor: pointer; } .form { width: 22.125rem; } .form ::-webkit-input-placeholder { color: var(--black); } .form ::-moz-placeholder { color: var(--black); } .form :-ms-input-placeholder { color: var(--black); } .form ::-ms-input-placeholder { color: var(--black); } .form ::placeholder { color: var(--black); } .form__notice { margin-bottom: 2rem; font-size: 0.875rem; font-weight: 600; font-family: "Karla", sans-serif; text-transform: uppercase; text-align: center; } .form__notice--error { color: var(--error); } .form__notice--success { color: var(--success); } .form__row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; position: relative; margin-bottom: 2rem; } .form__row label { position: absolute; left: 0; top: 0; -webkit-transition: 0.2s; -o-transition: 0.2s; transition: 0.2s; line-height: 1; } .form__row input:focus + label, .form__row input:valid + label, .form__row input.error + label, .form__row textarea:focus + label, .form__row textarea:valid + label, .form__row textarea.error + label { top: 100%; margin-top: -1.125rem; font-size: 0.75rem; } .form__row input.error, .form__row textarea.error { border-bottom: solid 2px var(--error); } .form__row input.error + label, .form__row textarea.error + label { color: var(--error); } .form__row:last-child { margin-top: 3rem; } .contact { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; padding: 4.0625rem 0 7.5rem; background: var(--body-bg-alt); } .contact h2 { margin-bottom: 2.5rem; } .footer__network { --primary: --accent-fg; } .header { background-position: bottom; background-repeat: no-repeat; background-size: cover; } .home .header { background-position: bottom; background-repeat: no-repeat; background-size: cover; height: 540px; } @media screen and (min-width: 60rem) { .home .header { height: 880px; } .home .header .header__inside { position: relative; z-index: 99; } } .home #content { margin-top: -540px; background: transparent; } @media screen and (min-width: 60rem) { .home #content { margin-top: -880px; } } .home .entry-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 33.75rem; } @media screen and (min-width: 60rem) { .home .entry-header { height: 10rem; margin: 5rem 0 0; } } .home .entry-header .entry-title { font-family: "Karla", sans-serif; font-size: 1.875rem; margin-bottom: 0; text-align: center; max-width: 100%; } @media screen and (min-width: 60rem) { .home .entry-header .entry-title { font-size: 3.25rem; line-height: 1.25em; margin-top: 1.5em; } } .home .entry-header .entry-description { font-family: "Karla", sans-serif; font-size: 1.125rem; margin-top: 0; margin-bottom: 0; text-align: center; max-width: 100%; } @media screen and (min-width: 60rem) { .home .entry-header .entry-description { font-size: 2rem; } } .page:not(.home) .header { height: 15rem; } @media screen and (min-width: 60rem) { .page:not(.home) .header { height: 55rem; } } .page.page-template-page-catalog .header { height: 23.8125rem; } .page.page-template-page-catalog .page-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 23.75rem; margin-top: -23.75rem; } @media screen and (min-width: 60rem) { .page.page-template-page-catalog .header { height: 28.125rem; } .page.page-template-page-catalog .page-header { height: 23.8125rem; margin-top: -23.8125rem; } .font-size .page.page-template-page-catalog .page-header { height: 21.875rem; margin-top: -21.875rem; } } body { display: -webkit-box; display: -ms-flexbox; display: flex; min-height: 100vh; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } body #page { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } body #content { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } body #content .entry-content a { text-decoration: underline; } body #content a.call-to-action { text-decoration: none; } .page.home:not(.has-sections) article { margin-top: 0; } .home #content { width: 100%; } @media screen and (min-width: 90rem) { .home #content { max-width: 1440px; } } .latest-books { margin: 4rem 0 8rem; } .latest-books .slider { width: 100%; max-width: 22.9375rem; margin: 0 auto; position: relative; } .latest-books .books { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; width: calc(100% - 4rem); margin: 0 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-left: 0; z-index: 99; } .latest-books .booknav { position: absolute; margin-top: 0; top: 0; left: 0; width: 100%; max-width: 28.0625rem; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .latest-books .previous, .latest-books .next { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: absolute; width: 1.5625rem; height: 100%; margin-top: 0; } .latest-books .previous svg, .latest-books .next svg { width: 1.5625rem; height: 1.5625rem; margin-top: 0; } .latest-books .previous svg path, .latest-books .next svg path { fill: var(--primary); } .latest-books .previous { left: 0; } .latest-books .next { right: 0; } @media screen and (min-width: 60rem) { .latest-books .slider { width: calc(100vw - 5.125rem); max-width: 75rem; } .latest-books .books { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .latest-books .books .book { margin-right: 1rem; margin-left: 1rem; } .latest-books .booknav { width: calc(100% + 4rem); max-width: 100vw; left: -2rem; } .latest-books .previous, .latest-books .next { width: 2rem; } .latest-books .previous svg, .latest-books .next svg { width: 2rem; height: 2rem; } } .latest-books .catalog-link { text-align: center; } fieldset { border-top: solid 2px var(--accent); font-family: "Karla", sans-serif; } fieldset h2, fieldset h3 { margin-bottom: 0; font-size: 1rem; font-weight: bold; text-align: left; text-transform: none; } fieldset h2::before, fieldset h3::before { display: none; } fieldset h2 button, fieldset h3 button { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; all: inherit; width: 100%; padding: 1rem 1.1875rem; margin: 0; border-top: 0; } fieldset h2 button svg, fieldset h3 button svg { display: block; float: right; margin-top: 0.5rem; } fieldset h2 button:hover, fieldset h2 button:focus, fieldset h3 button:hover, fieldset h3 button:focus { color: var(--primary); background: var(--bg-body); } fieldset h2 button:active, fieldset h3 button:active { -webkit-box-shadow: none; box-shadow: none; } fieldset [aria-expanded=true] { color: var(--primary); } fieldset [aria-expanded=true] svg { -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } fieldset h2 [aria-expanded=true] { border-bottom: solid 2px var(--accent); background: var(--body-bg-alt); } fieldset [type=radio] { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; border: 0 !important; overflow: hidden !important; clip: rect(1px, 1px, 1px, 1px); } fieldset .label { display: inline-block; width: calc(100% - 2rem); } fieldset [type=radio] + label { cursor: pointer; display: block; padding: 1rem 1.1875rem; margin-bottom: 0; } fieldset [type=radio] + label svg { display: none; } fieldset [type=radio]:focus label { cursor: pointer; display: block; } fieldset [type=radio]:checked + label { color: var(--primary); font-weight: bold; } fieldset [type=radio]:checked + label svg { display: block; float: right; margin-top: 0.5rem; width: 1rem; height: 1rem; fill: transparent; } fieldset:last-of-type { border-bottom: solid 2px var(--accent); margin-bottom: 1rem; } .js .filter-sort [type=submit] { display: none; } .clear-filters { width: calc(100% - 2rem); margin: 0 1rem; } .page-template-page-catalog .books { width: calc(100% - 1rem); padding: 0; margin: 2rem 0 1rem 1rem; } .page-template-page-catalog .book { height: 14.375rem; width: calc(50% - 1rem); margin: 0 1rem 1rem 0; } .catalog-navigation { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; margin-top: 2.5rem; margin-bottom: 2rem; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; font-family: "Karla", sans-serif; } .catalog-navigation a { color: var(--body-text); } .catalog-navigation a:hover, .catalog-navigation a:focus { color: var(--primary); } .catalog-navigation .previous, .catalog-navigation .next { display: block; margin: 0 1.625rem; font-family: "Karla", sans-serif; font-size: 1rem; } .catalog-navigation .previous svg, .catalog-navigation .next svg { width: 1.2rem; height: 1rem; margin: 0.25rem 0.375rem 0; } .catalog-navigation .previous svg path, .catalog-navigation .next svg path { fill: var(--primary); } .catalog-navigation .pages { display: inline-block; border-bottom: solid 2px #ececec; } .catalog-navigation .pages a, .catalog-navigation .pages span { display: inline-block; width: 2.5625rem; padding: 0.5rem 0; font-size: 1.5rem; text-align: center; } .catalog-navigation .pages .current { border-bottom: solid 0.375rem var(--primary); } @media screen and (min-width: 30rem) and (max-width: 60rem) { .filter-sort { width: calc(100% - 1rem); height: 7rem; margin: 2rem 0 1rem 1rem; } fieldset { width: calc(33.3333333333% - 1rem); margin: 0 1rem 1rem 0; float: left; border-top: 0; position: relative; } fieldset:last-of-type { border-bottom: 0; } fieldset h2 button { border-bottom: solid 2px var(--accent); } fieldset div:not([hidden]) { position: absolute; width: 100%; background: var(--body-bg); z-index: 99; border-right: 0.0625rem solid #ececec; border-left: 0.0625rem solid #ececec; border-bottom: 0.0625rem solid #ececec; } fieldset div:not([hidden]) .subject-groups { width: calc(100% + 0.125rem); margin-left: -0.0612rem; } fieldset div:not([hidden]) .subject-groups div { position: relative; width: calc(100% + 0.125rem); margin-left: -0.0612rem; border-bottom: 0; } .clear-filters { width: calc(33.3333333333% - 1rem); margin-left: 0; } .page-template-page-catalog .book { height: 16.25rem; width: calc(33.3333333333% - 1rem); margin: 0 1rem 1rem 0; } } @media screen and (min-width: 60rem) { .page-template-page-catalog #content { width: calc(100% - 1rem); margin-left: auto; margin-right: auto; max-width: 103.125rem; background: transparent; } .filter-sort { width: calc(25% - 2rem); height: auto; float: left; margin: 2rem 1rem 1rem; } fieldset { width: 100%; display: block; margin-bottom: 0; } fieldset div:not([hidden]) { position: relative; border: 0; } .clear-filters { width: 100%; margin-left: 0; } .page-template-page-catalog .books { width: 75%; float: right; margin-left: 0; } .page-template-page-catalog .book { height: 16.25rem; max-width: calc(33.3333333333% - 1rem); margin: 0 1rem 1rem 0; } .catalog-navigation { width: 75%; float: right; padding-right: 1rem; } } .wp-activate-container, .mu_register.wp-signup-container { margin: 7.5rem auto 4rem; } .wp-activate-container *, .mu_register.wp-signup-container * { text-align: left; } .wp-activate-container h2, .mu_register.wp-signup-container h2 { text-align: center; -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; } .wp-activate-container .mu_alert, .mu_register.wp-signup-container .mu_alert { margin-bottom: 2rem; } .wp-activate-container form, .mu_register.wp-signup-container form { margin-top: 0; } .wp-activate-container input:not([type=submit]), .mu_register.wp-signup-container input:not([type=submit]) { padding: 0; } .wp-activate-container .checkbox, .mu_register.wp-signup-container .checkbox { margin-right: 1em; } .wp-activate-container .submit, .mu_register.wp-signup-container .submit { text-align: center; } .wp-activate-container [type=submit], .mu_register.wp-signup-container [type=submit] { width: auto; margin: 0 auto; text-align: center; } .wp-activate-container ol, .wp-activate-container ul, .mu_register.wp-signup-container ol, .mu_register.wp-signup-container ul { list-style-position: outside; } .wp-activate-container span.h3, .mu_register.wp-signup-container span.h3 { padding: 0; font-size: 1rem; }