@media screen and (min-width: 600px) {
    html {
        font-size: 9px;
    }
}
@media screen and (min-width: 900px) {
    html {
        font-size: 10px;
    }
}
@media screen and (min-width: 1200px) {
    html {
        font-size: 12px;
    }
}
@font-face {
    font-family: 'defaultsans';
    src: url('/fonts/default-sans-roman.eot');
    src: url('/fonts/default-sans-roman.eot') format('embedded-opentype'),
        url('/fonts/default-sans-roman.woff2') format('woff2'),
        url('/fonts/default-sans-roman.woff') format('woff'),
        url('/fonts/default-sans-roman.ttf') format('truetype'),
        url('/fonts/default-sans-roman.svg#defaultsansroman') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'defaultsans';
    src: url('/fonts/default-sans-bold.eot');
    src: url('/fonts/default-sans-bold.eot') format('embedded-opentype'),
        url('/fonts/default-sans-bold.woff2') format('woff2'),
        url('/fonts/default-sans-bold.woff') format('woff'),
        url('/fonts/default-sans-bold.ttf') format('truetype'),
        url('/fonts/default-sans-bold.svg#defaultsansroman') format('svg');
    font-weight: bold;
    font-style: normal;
}
.code {
    font-family: monospace;
}
.box {
    border-style: solid;
    border-width: 1px 1px 1px 5px;
    margin: 0.75em 2em 3em 2em;
    padding: 12px 1.75em 12px 2.75em;
    color: #444444;
}
.quotebox {
    border-color: #6FA6A9;
    background-color: #E4ECEC;
}
.codebox {
    border-color: #A9C98B;
    background-color: #EFF4E9;
    font-family: monospace;
}
.yellowbox {
    border-color: #FDD73F;
    background-color: #FFF8DD;
}
.small {
    font-size: small;
}
body {
    margin: 6ex 5% 18ex 5%;
    width: 90%;
    /* color: #646567; old gray, changed to darker one */
    /* color: #454447; */
    /*font-family: "defaultsans", Helvetica, Arial, sans-serif;*/
    /* line-height: 150%; */
}
a:link, a:active, a:visited {
    /* color: #646567; old gray, changed to darker one */
    color: var(--text-color-normal);
    text-decoration: none;
    border-bottom: 1px solid #6EA945;
}
a:hover {
    color: #6EA945;
    border-bottom: none;
}
a.no-uline {
    border-bottom: none!important;
}
h2 {
    color: #6FA6A9;
    line-height: 120%;
}
h2.omnipath, a.omnipath:link, a.omnipath:active, a.omnipath:visited {
    color: #6EA945;
    text-decoration: none;
}
h2.base, a.base:link, a.base:active, a.base:visited {
    /* color: #646567; old gray, changed to darker one */
    color: #454447;
    text-decoration: none;
}
.align-middle {
    display: table-cell;
    vertical-align: middle;
}
.nav {
    padding: 7px 5px 5px 5px;
    color: #FFFFFF;
    background-color: #6EA945;
    cursor: pointer;
    margin: 5px 5px 5px 5px;
    display: inline-block;
    font-weight: 600;
    text-align: center;
    font-size: smaller;
}
.nav:hover {
    background-color: #FCCC06;
}
.nav a {
    text-decoration: none!important;
    border-bottom: none!important;
    font-weight: 600;
}
a.topmenu {
    text-decoration: none!important;
    border-bottom: none!important;
}
#logos {
    display: table;
    width: 100%;
}
.logo {
    margin: 10px 1.8% 10px 0;
    width: 100%;
}
#top-left {
    width: calc(100% - 245px);
    min-width: 400px;
    float: left;
}
#top-right {
    width: 240px;
    padding-left: 5px;
    float: left;
}
.timeline-Header-title {
    color: #6EA945!important;
}
.timeline-Header-byline {
    color: #6EA945!important;
}
.paper-link {
    font-size: larger;
    color: #FFFFFF;
    background-color: #007B7F;
    padding: 12px 25px 7px 25px;
    display: inline-block;
}

figure {
    width: 100%;
    max-width: 900px;
}

.plot {
    width: 100%;
    max-width: 900px;
}

.caption, .font-medium {
    font-size: medium;
}

.caption {
    font-style: italic;
}

.picture {
    margin-bottom: 0px;
}

.content-box:hover {
    background-color: #F7F7F7;
}

#twitter-widget-0 {
    float: right;
}

.full-width {
    width: 100%;
}

.target:target {
    animation: blinker 0.33s linear 3;
}

@keyframes blinker {
    0%{
      border-radius: 5px;
    }
    75% {
      box-shadow: 0 0 10px 5px #FCCC06;
      border-radius: 5px;
    }
}

@keyframes yellow-sweep {
    to {
        background-position: 100vw;
    }
}

#browse-button {
    padding: 7px 5px 5px 5px;
    color: #FFFFFF;
    background-color: #6EA945;
    cursor: pointer;
    margin: 5px 5px 5px 5px;
    display: inline-block;
    font-weight: 600;
    text-align: center;
    font-size: x-large;
    text-decoration: none;
    animation: yellow-sweep 5s linear infinite;
    background-size: 500% 100%;
    background-position: -100vw;
    background-image: linear-gradient(90deg, #6EA945 0%, #FCCC06 10%, #FCCC06 13%, #6EA945 23%);
    border-width: 0px;
}

#browse-button:visited {
    border-bottom: 0px;
}

.new {
    background-color: #FFFFFF;
    font-size: small;
    font-weight: 600;
    padding: 3px;
    color: #007B7F;
    margin-bottom: 5px;
    margin-right: 5px;
}