/* latin-ext */
@font-face {
  font-family: 'Charter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src:
    url('fonts/charter_regular.woff2') format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Charter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src:
    url('fonts/charter_regular.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Charter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src:
    url('fonts/charter_bold.woff2') format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Charter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src:
    url('fonts/charter_bold.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Charter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src:
    url('fonts/charter_italic.woff2') format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Charter';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src:
    url('fonts/charter_italic.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Charter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src:
    url('fonts/charter_bold_italic.woff2') format('woff2');
    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Charter';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src:
    url('fonts/charter_bold_italic.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}




/* @import url('https://fonts.cdnfonts.com/css/gentium-plus-2'); */

/* typography and style */
div.homepage {
    display:flex;
    flex-direction: column;

    min-height:100vh;
    width:100vw;
    margin: 0px;
    padding: 0px;

    overflow: hidden;

    font-family: "Charter", sans-serif;
    /* font-size: 14px; */
    font-size: 11pt;

    /* should never be visible... make it red to highlight errors */
    /* set to white in production! */
    background-color:#ffffff;
}

/* over-ride dash things... */
.homepage p {
    display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

/* over-ride dash things... */
.homepage h2 {
    display: block;
    font-size: 1.5em;
    margin-block-start: 0.83em;
    margin-block-end: 0.83em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    font-weight: bold;
}

/* over-ride dash things... */
.homepage {
    -webkit-font-smoothing: auto;
}

@media print {
    div.homepage {
        min-height: auto;
        overflow: visible;
        background-color: transparent;
    }
}

div.homepage a {
    text-decoration: none;
    color: #326750;
    font-weight: bold;
}

/* prevent sub- and super-scripts from affecting line height */
div.homepage sup, div.homepage sub {
    vertical-align: baseline;
    position: relative;
    top: -0.4em;
}
div.homepage sub {
    top: 0.4em;
}

main.writeup dl dt::after {
    content: ":";
}

span.ss-logo {
    /* font-variant: small-caps; */
    font-weight: bold;
    color: #326750;
}

span.tt {
    font-family: monospace;
}



/* simple footer with copyright information */
footer.footer {
    background-color: #f1f1f1;
    text-align: left;
    padding: 0px;
    margin: 0px;

    height: 1rem;               /* fix height at 1rem */
    overflow-y: hidden;
}

@media print {
    footer.footer {
        display: none;
    }
}


/* header layout */
header.topnav {
    display: flex;
    flex-direction: row;
    align-items: stretch;        /* stretch vertically */
    overflow: hidden;

    background-color: #36454F;

    height: 2.5rem;             /* fix height at 3rem */
    overflow-y: hidden;
}

@media print {
    header.topnav {
        display: none;
    }
}


/* fixed, full "page" between header and footer; no scroll */
div.page {
    display:flex;
    flex-direction: row;
    justify-content: center;

    height: calc(100vh - 3.5rem);
    width:100%;
    margin: 0px;
    padding: 0px;

    overflow: hidden;

    /* background-color:#ffeeee; */ /* debugging */
    /* background-color:#faf4e8; */ /* cream */
    background-color:#fdfbf7; /* whiter */
    color: #36454F;
}

@media print {
    div.page {
        background-color: transparent;
        color: black;
    }
}


/* variant which expands to show all content when printing (useful for
   text content, or anything that scrolls in the main app, but needs
   to be visible when printing content) */
div.page-printable {
    display:flex;
    flex-direction: row;
    justify-content: center;

    height: calc(100vh - 3.5rem);
    width:100%;
    margin: 0px;
    padding: 0px;

    overflow: hidden;

    /* background-color:#ffeeee; */ /* debugging */
    /* background-color:#faf4e8; */ /* cream */
    background-color:#fdfbf7; /* whiter */
    color: #36454F;
}

@media print {
    div.page-printable {
        height: auto;
        overflow: visible;
        background-color: transparent;
        color: black;
    }
}



/* "dummy" div takes up the full page and enable scrolling.  serves as
   a "container" for the writeup column.  expands to show all content
   when printing */
div.writeup-container {
    display: block;

    height: 100%;
    width: 100%;

    overflow-x: hidden;
    overflow-y: scroll;
}

@media print {
    div.writeup-container {
        overflow: visible;
        height: auto;
    }
}


/* single-column text for long-format "writeups" */
main.writeup {
    display: block;

    width: 50rem;
    max-width: 80%;

    /* center text using margin: auto */
    margin-left: auto;
    margin-right: auto;

    /* space at top and bottom */
    padding-left: 1em;
    padding-right: 1em;
    padding-top: 5rem;
    padding-bottom: 8rem;

    font-size: 14pt;

    /* background-color:#eeffee; */
}

/* decrease text size when printing */
@media print {
    main.writeup {
        font-size: 11pt;
    }
}

/* decrease text and margin on iphone */
@media screen and (width < 550px){
    main.writeup {
        font-size: 11pt;
        max-width: 90%;
    }
}


main.writeup p.tagline {
    font-size: 140%;

    font-weight: bold;
    font-style: italic;

    text-align: center;

    padding-left:1.5em;
    padding-right: 1.5em;

    padding-bottom: 1em;
}

main.writeup p.abstract {
    font-size: 120%;
    padding-left:1.5em;
    padding-right: 1.5em;
    padding-bottom: 1em;
}

main.writeup p {
    /* expand line-height for easier reading */
    line-height: 1.4;
}

main.writeup h1 {
    text-align: center;
    margin-top: 4em;
}

main.writeup h1:first-of-type {
    margin-top: 0;
}


main.writeup h2 {
    margin-top: 2em;
}

main.writeup a.note {
    position: relative;
    top: -0.5em;
    font-size: 70%;
}

main.writeup span.equation {
    display: block;
    margin-left: 12.5%;
    margin-top: 0.75em;
    margin-bottom: 0.75em;
}

main.writeup h2 {
    font-style: italic;
}



/* images */
main.writeup .full-column-img {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;

    margin-top: 4em;
    margin-bottom: 4em;
}

main.writeup div.screenshot{
    width:125%;
    margin-left:-12.5%;
}



main.writeup blockquote.citation {
    position: relative;
    /* background: #fafafa; */
}

main.writeup blockquote.citation:before {
    position: absolute;
    /* content: open-quote; */
    content: "\201C";
    font-size: 2em;
    margin-left: -0.6em;
    margin-top: -0.2em;
}
main.writeup blockquote.citation:after {
    position: absolute;
    /* content: close-quote; */
    content: "\201D";
    font-size: 2em;
    bottom: 0;
    right: 0;
    margin-right: -0.3em;
    margin-bottom: -0.4em;
}


main.writeup p.case-study-highlight {
    font-size: 120%;
    /* color: #326750; */

    font-weight: bold;
    font-style: italic;

    text-align: center;

    padding-left:2.5em;
    padding-right:2.5em;
}

main.writeup p.case-study-takeaway {
    font-size: 120%;

    text-align: center;

    padding-left: 1.5em;
    padding-right: 1.5em;

    padding-bottom: 1em;
}

main.writeup dl {
    /* expand line-height for easier reading */
    line-height: 1.4;
}

main.writeup dl dt {
    font-weight: bold;
    float: left;
    margin-right: 0.5em;
}

main.writeup dl dt::after {
    content: ":";
}

main.writeup dl dd {
    margin-left: 0em;
    margin-bottom: 1em;
}

main.writeup H2 {
    display: flex;
    justify-content: center;
}

main.writeup .offerings-grid {
    text-align: center;
}

main.writeup div.centered {
    /* margin-left: auto; */
    /* margin-right: auto; */
    display: flex;
    justify-content: center;
}

main.writeup div.centered-logo {
    display: flex;
    justify-content: center;
}

main.writeup div.headshot {
    display: flex;
    justify-content: center;
}

main.writeup div.headshot img {
    width: 15em;
}

main.writeup p.bio {
    margin-bottom: 7em;
}

div.homepage a:hover {
    font-weight: bold;
    text-decoration: underline;
}


div.homepage {
    display: flex;
    flex-direction: row;
    /* overflow-y: hidden; */
    /* overflow-x: hidden; */
}

/* nav.homepage-nav p.homepage-tagline { */
/*     font-size: 250%; */
/*     width: 40vw; */

/*     font-weight: bold; */
/*     font-style: italic; */

/*     text-align: center; */

/*     margin-bottom: 0px; */
/*     padding-bottom: 4em; */
/* } */

/* div.homepage-logo { */
/*     width: 50vw; */
/* } */


/* @media screen and (max-width: 1200px){ */
/*     div.homepage-logo { */
/*         display:none; */
/*     } */

/*     nav.homepage-nav p.homepage-tagline { */
/*         width:80vw; */
/*     } */
/*     div.homepage-logo { */
/*         width: 0vw; */
/*     } */
/* } */


/* div.homepage main { */
/*     display: flex; */
/*     flex-direction: column; */
/*     justify-content: center; */
/* } */

/* div.homepage nav { */
/*     padding-left: 3em; */
/*     display: flex; */
/*     flex-direction: column; */
/*     /\* align-items: center; *\/ */
/*     justify-content: center; */
/*     height: 99vh; */
/*     overflow-y: hidden; */
/* } */

/* div.homepage nav ul.homepage-links { */
/*     list-style-type: none; /\* Remove bullets *\/ */
/*     padding: 0; /\* Remove padding *\/ */
/*     margin:0; */
/*     margin-left: 10%; */

/*     font-size: 200%;  /\* 24pt; *\/ */
/*     line-height: 2.0; */

/*     font-weight: bold; */
/* } */

/* div.homepage nav ul a { */
/*     text-decoration: none; */
/*     color: #326750; */
/* } */

/* div.homepage nav ul a:hover { */
/*     font-style: italic; */
/* } */

/* details.homepage-fold{ */
/*     color: #326750; */
/* } */

/* details.homepage-fold summary{ */
/*     list-style-position: outside; */
/* } */

/* details.homepage-fold summary li{ */
/*     list-style-position: outside; */
/* } */