/*! normalize.css v6.0.0 | MIT License | github.com/necolas/normalize.css */ @import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,800); @import url(https://fonts.googleapis.com/css?family=PT+Serif:400,700,400italic,700italic); html { line-height: 1.15; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100% } article, aside, footer, header, nav, section { display: block } h1 { font-size: 2em; margin: .67em 0 } figcaption, figure, main { display: block } figure { margin: 1em 40px } hr { box-sizing: content-box; height: 0; overflow: visible } pre { font-family: monospace, monospace; font-size: 1em } a { background-color: transparent; -webkit-text-decoration-skip: objects } abbr[title] { border-bottom: none; text-decoration: underline; text-decoration: underline dotted } b, strong { font-weight: inherit; font-weight: bolder } code, kbd, samp { font-family: monospace, monospace; font-size: 1em } dfn { font-style: italic } mark { background-color: #ff0; color: #000 } small { font-size: 80% } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline } sub { bottom: -.25em } sup { top: -.5em } audio, video { display: inline-block } audio:not([controls]) { display: none; height: 0 } img { border-style: none } svg:not(:root) { overflow: hidden } button, input, optgroup, select, textarea { margin: 0 } button, input { overflow: visible } button, select { text-transform: none } [type=reset], [type=submit], button, html [type=button] { -webkit-appearance: button } [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner { border-style: none; padding: 0 } [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring { outline: 1px dotted ButtonText } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal } progress { display: inline-block; vertical-align: baseline } textarea { overflow: auto } [type=checkbox], [type=radio] { box-sizing: border-box; padding: 0 } [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto } [type=search] { -webkit-appearance: textfield; outline-offset: -2px } [type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration { -webkit-appearance: none } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit } details, menu { display: block } summary { display: list-item } canvas { display: inline-block } [hidden], template { display: none } body .intro { font-size: 1.25em; line-height: 1.7 } .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { margin: .5rem 0 1.5rem; font-family: Open Sans, Helvetica, Arial, sans-serif } .h1, h1 { font-size: 2em; line-height: 1.25 } @media (min-width:43.75em) { .h1, h1 { font-size: 2.5em; line-height: 1.125 } } @media (min-width:56.25em) { .h1, h1 { font-size: 3em; line-height: 1.05 } } .h2, h2 { font-size: 1.625em; line-height: 1.15384615 } @media (min-width:43.75em) { .h2, h2 { font-size: 2em; line-height: 1.25 } } @media (min-width:56.25em) { .h2, h2 { font-size: 2.25em; line-height: 1.25 } } .h3, h3 { font-size: 1.375em; line-height: 1.13636364 } @media (min-width:43.75em) { .h3, h3 { font-size: 1.5em; line-height: 1.25 } } @media (min-width:56.25em) { .h3, h3 { font-size: 1.75em; line-height: 1.25 } } .h4, h4 { font-size: 1.125em; line-height: 1.11111111 } @media (min-width:43.75em) { .h4, h4 { line-height: 1.22222222 } } blockquote { font-size: 1.25em; line-height: 1.25; padding: 0 } @media (min-width:43.75em) { blockquote { font-size: 1.5em; line-height: 1.45833333 } } .clearfix { zoom: 1 } .clearfix:after, .clearfix:before { content: "\0020"; display: block; height: 0; overflow: hidden } .clearfix:after { clear: both } .button, .button-secondary, .button-tertiary, .button__outline { background-color: #2e8b57; display: inline-block; position: relative; font-family: Open Sans, Helvetica, Arial, sans-serif; text-decoration: none; color: #fff; font-size: 1em; line-height: 1.2em; font-weight: 400; padding: .5em 1.5em; border: 0; border-radius: 4px; cursor: pointer; margin-bottom: .5em; transition: background-color .14s ease-in-out } .button-secondary:focus, .button-secondary:hover, .button-tertiary:focus, .button-tertiary:hover, .button:focus, .button:hover, .button__outline:focus, .button__outline:hover { color: #fff; text-decoration: none; background-color: #21653f } .button-secondary:active, .button-tertiary:active, .button:active, .button__outline:active { top: 1px } .button-secondary { background-color: #233e5b } .button-secondary:hover { background-color: #152536 } .button-tertiary { background-color: #aaa } .button-tertiary:hover { background-color: #919191 } .button__outline { background-color: transparent; border: 3px solid #2e8b57; color: #2e8b57 } .button__outline:hover { background-color: #2e8b57; color: #fff } label { display: block; margin-bottom: 5px } input[type=email], input[type=number], input[type=password], input[type=phone], input[type=search], input[type=text], textarea { background: #e6e6e6; padding: 5px; outline: none; border: none; height: 44px; width: 300px; margin-bottom: .5rem } input[type=email]:focus, input[type=number]:focus, input[type=password]:focus, input[type=phone]:focus, input[type=search]:focus, input[type=text]:focus, textarea:focus { border: 1px solid #2e8b57 } input[type=email].full-width, input[type=number].full-width, input[type=password].full-width, input[type=phone].full-width, input[type=search].full-width, input[type=text].full-width, textarea.full-width { width: 100% } textarea { height: 132px } form { margin-bottom: 40px } form .field { margin-bottom: 20px } form .note { margin-top: 5px; color: #aaa } form .req { font-style: italic } form .error .reason { margin-top: 5px; color: #ff4136 } form .error input[type=email], form .error input[type=number], form .error input[type=password], form .error input[type=phone], form .error input[type=search], form .error input[type=text], form .error textarea { border-color: #ff4136 } table { width: 100%; border: 1px solid #d0d0d0; margin-bottom: 1.5em } table caption { margin: 0 0 7px; font-size: .75em; color: #aaa; text-transform: uppercase; letter-spacing: 1px } tr { border-bottom: 1px solid #d0d0d0 } tr:nth-child(2n) { background-color: #f7f7f7 } td { padding: 7px; border-right: 1px solid #d0d0d0 } td:last-child { border-right: 0 } th { background-color: #f7f7f7; border-bottom: 1px solid #d0d0d0; border-right: 1px solid #d0d0d0 } th:last-child { border-right: 0 } .highlight { white-space: pre; overflow: auto; word-wrap: normal; border-radius: 3px; padding: 20px; background: #343642; color: #c1c2c3 } .highlight .hll { background-color: #ffc } .highlight .gd { color: #2e3436; background-color: #0e1416 } .highlight .gr { color: #eeeeec; background-color: #c00 } .highlight .gi { color: #babdb6; background-color: #1f2b2d } .highlight .go { color: #2c3032; background-color: #2c3032 } .highlight .kt { color: #e3e7df } .highlight .ni { color: #888a85 } .highlight .c, .highlight .c1, .highlight .cm, .highlight .cs { color: #8d9684 } .highlight .bp, .highlight .err, .highlight .g, .highlight .ge, .highlight .gp, .highlight .gs, .highlight .gt, .highlight .l, .highlight .ld, .highlight .n, .highlight .nc, .highlight .nd, .highlight .ne, .highlight .nl, .highlight .nn, .highlight .nx, .highlight .ow, .highlight .p, .highlight .py, .highlight .s, .highlight .s1, .highlight .s2, .highlight .sb, .highlight .sc, .highlight .sd, .highlight .se, .highlight .sh, .highlight .si, .highlight .sr, .highlight .ss, .highlight .sx, .highlight .w, .highlight .x { color: #c1c2c3 } .highlight .k, .highlight .kc, .highlight .kd, .highlight .kn, .highlight .kp, .highlight .kr, .highlight .nt { color: #729fcf } .highlight .cp, .highlight .gh, .highlight .gu, .highlight .na, .highlight .nf { color: #e9a94b } .highlight .il, .highlight .m, .highlight .mf, .highlight .mh, .highlight .mi, .highlight .mo, .highlight .nb, .highlight .no { color: #8ae234 } .highlight .o { color: #989daa } .highlight .nv, .highlight .vc, .highlight .vg, .highlight .vi { color: #fff } html { box-sizing: border-box } *, :after, :before { box-sizing: inherit } body { font-family: PT Serif, Georgia, Times, serif; line-height: 1.75; font-size: 112.5%; color: #111; overflow-x: hidden; margin: 0 } body p, body ul { margin: 0 0 2rem } ::-moz-selection { background: #2e8b57; color: #fff } ::selection { background: #2e8b57; color: #fff } audio, iframe, img, object, video { max-width: 100% } .container { max-width: 610px; padding: 0 20px; margin-left: auto; margin-right: auto } a { color: #2e8b57 } a:hover { color: #1b5233 } .nav-collapse { z-index: 1 } .nav-collapse ul { margin: 0; padding: 0; width: 100%; display: block; list-style: none } .nav-collapse ul li { width: 100%; display: block; background: #2e8b57; border-bottom: 2px solid #349e63 } .nav-collapse ul li a { color: #fff; text-decoration: none; display: block; padding: 5px 2rem } .js .nav-collapse { clip: rect(0 0 0 0); max-height: 0; position: absolute; display: block; overflow: hidden; zoom: 1; clear: both; width: 100% } .nav-collapse.opened { max-height: 9999px } .nav-toggle { -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; float: right; line-height: 2em; margin-top: .5em; background-color: #2e8b57; border-radius: 4px; padding: 0 .5em; color: #fff; text-decoration: none; position: relative; right: 2rem; transition: all .2s ease-in-out } .nav-toggle:hover { color: #fff; background-color: #21653f } .noList { list-style: none; padding-left: 0; margin-left: 0 } dt { font-weight: 700 } dd { margin: 0 0 1.5rem } .post ol ol, .post ol ul, .post ul ol, .post ul ul { margin: 0 } .pageTitle { margin: 2rem auto 1em; text-align: center } .content { padding-top: 1em } .header { background-color: #2092df; background-size: cover; background-position: 50%; color: #fff; padding: 0; height: 3em } .header .container { padding: 0; max-width: 100% } .header h1 { margin: 0; float: left; padding-left: 2rem; font-size: 1em; line-height: 3em; font-family: Open Sans, Helvetica, Arial, sans-serif; font-weight: 800; text-transform: uppercase } .header h1 a { color: #d0d0d0; text-decoration: none } .post .postTitle { text-align: center; margin-top: 2rem; margin-bottom: 1rem } .post blockquote { clear: both; margin: 2.5em 0; padding: 0; line-height: 1.8; position: relative } .post blockquote:before { top: -1.25em } .post blockquote:after, .post blockquote:before { content: ""; position: absolute; background: #2e8b57; display: block; height: 2px; width: 150px; left: calc(50% - 75px) } .post blockquote:after { bottom: -1.25em } .post .meta { text-align: center; color: gray; font-family: Open Sans, Helvetica, Arial, sans-serif; font-weight: 300 } .post figure { margin: 3rem 0 } .post figure figcaption { text-align: center; font-size: .9em; font-style: italic; color: #5e5e5e } .post figure img { margin: 0 auto; display: block } .post .highlight, .post img { margin-bottom: 2rem } .post .highlight { clear: both } .post .dropcap { color: #2e8b57; margin-right: .45rem } .post .featuredImage { position: relative; margin-top: 2rem } .post .featuredImage img { margin-bottom: 0 } .postNav { border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; overflow: hidden } .postNav .next, .postNav .prev { display: block; width: 100%; height: 5rem; overflow: hidden; position: relative; font-family: Open Sans, Helvetica, Arial, sans-serif; font-weight: 800; font-size: .9em; text-transform: uppercase; text-align: center } .postNav .next img, .postNav .prev img { z-index: 1; display: block; position: absolute; left: 0; height: auto } .postNav .next img, .postNav .next span, .postNav .prev img, .postNav .prev span { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 100% } .postNav .next span, .postNav .prev span { z-index: 10; position: relative; padding: .5rem; position: absolute; line-height: 1.4 } .postNav .next.image, .postNav .prev.image { text-decoration: none; color: #fff; text-shadow: 1px 1px 3px rgba(0, 0, 0, .8); padding: 0 .5rem; position: relative; transition: all .2s ease-in-out } .postNav .next:hover.image, .postNav .prev:hover.image { opacity: .8 } .postNav .prev span { left: 0 } .postNav .next span { right: 0 } .footer { text-align: center; padding: 2rem 0; clear: both } .footer .container { border-top: 4px solid #d9d9d9; padding-top: .5em; max-width: 90% } .footer .copy, .footer .footer-links { font-size: .8em } .footer .copy { margin-bottom: 1rem } .footer-links ul { text-align: center } .footer-links ul li { display: inline-block } .footer-links ul li a { display: inline-block; width: 30px; height: 30px; transition: all .2s ease-in-out } .footer-links ul li a svg { display: block; width: 100%; height: 100% } .footer-links ul li a svg .outer-shape { fill: #2e8b57 } .footer-links ul li a svg .inner-shape { fill: #fff } .footer-links ul li:hover a svg .outer-shape { fill: #21653f } .pagination .next { float: left } .pagination .previous { float: right } .posts li { margin-bottom: 4rem; position: relative } .posts li:before { content: ""; position: absolute; bottom: -2rem; left: 0; background: #e6e6e6; height: 2px; width: 60px } .posts li a { text-decoration: none } .posts li a:hover { text-decoration: underline } .posts li .date { color: gray; font-family: Open Sans, Helvetica, Arial, sans-serif; font-weight: 300; font-size: .8em } .posts li h3 { margin: 0 0 .5em } @media only screen and (min-width:800px) { body { font-size: 125% } .content { padding-top: 0; position: relative; z-index: 1 } .content:after { z-index: -1; background: #fff; content: ""; display: block; width: 100%; height: 10em; position: absolute; top: -2em; left: 0; -webkit-transform: skewY(-2deg); transform: skewY(-2deg); -webkit-transform-origin: bottom left; transform-origin: bottom left } .container { max-width: 880px; margin-left: auto; margin-right: auto; padding: 0 } #home .pageTitle, #home .pagination, #home .posts { width: 75%; float: none; margin: 0 auto 1.5em } #home .pageTitle { margin: 2rem auto 1em } .header { height: 15em; position: relative; padding-bottom: 2em } .header .container { position: relative; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); max-width: 800px; overflow: hidden } .header h1 { font-size: 3em; line-height: 1; letter-spacing: -3px; padding-left: 0 } .header nav { float: left; clear: left } .header nav ul { margin: 0 } .header nav ul li { display: inline; line-height: 3em; background: none; padding: 0 5px; border: none } .header nav ul li a { color: #fff; font-size: .9em; text-decoration: none; padding: 0 .25em } .header nav ul li a:hover { color: #ccc } .header nav ul li.current { padding-bottom: .25em; border-bottom: 4px solid hsla(0, 0%, 100%, .4) } .js .nav-collapse { position: relative; max-height: none } .js .nav-collapse.closed { max-height: none } .js .nav-collapse ul li a { display: inline-block } .nav-toggle { display: none } .post .pageTitle, .post dl, .post h1, .post h2, .post h3, .post h4, .post h5, .post h6, .post ol, .post p, .post ul { width: 75%; float: none; margin: 0 auto 2rem } .post .h1, .post .h2, .post .h3, .post .h4, .post .h5, .post .h6, .post h1, .post h2, .post h3, .post h4, .post h5, .post h6 { margin: 1rem auto } .post .pageTitle { margin: 2rem auto 1em } .post .featuredImage { position: relative; margin-top: 2rem } .post .featuredImage:before { background: #fff; content: ""; display: block; width: 100%; height: 4em; position: absolute; top: -2em; left: 0; -webkit-transform: skewY(-2deg); transform: skewY(-2deg); -webkit-transform-origin: bottom left; transform-origin: bottom left } .postNav .next, .postNav .prev { width: 50% } .postNav .prev { float: left; text-align: left } .postNav .next { text-align: right; float: right } .footer-links { float: right } .footer .copy { float: left } .footer .container { padding: 1rem 0; max-width: 800px } .contactContent { max-width: 48%; margin-right: 2%; float: left } #contact form { max-width: 48%; width: 48%; float: right; margin-right: 0 } } @media only screen and (min-width:1200px) { body { font-size: 137.5% } .container { max-width: 990px } }