@charset "UTF-8";

/** Fonts. */

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url(/roboto-v32-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Lato';
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url(/lato-v24-latin.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/** Global settings. */

body {
    margin: auto;
    width: 1000px;
    padding: 5px;
}

img {
    display: block;
}

a:link {
    color: #666;
    text-decoration: none;
}

a:visited {
    color: #CCC
}

a:hover {
    color: #666;
    text-decoration: underline;
    color: #666;
    text-decoration: underline;
}

/** Common header, footer and middle row. */

header {
    padding-top: 0px;
}

.rounded_orange_line {
    border-radius: 5px 5px 5px 5px;
    width: 1000px;
    height: 5px;
    background-color: #FF6600;
    margin-top: 1px;
}

footer {
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    font-size: small;
    color: #CCC;
    text-align: center;
    padding-top: 1em;
}

.middle_row {
    display: flex;
}

/** Left (site-wide) navigation area. */

.site_navigation {
    flex: 0 0 12em;
    text-align: right;
    list-style-type: none;
    font-family: 'Roboto', Arial, Helvetica, sans-serif;
    font-size: 95%;
    color: #666;
    line-height: 160%;
    padding-right: 10px;
}

.site_navigation>header {
    font-family: Lato, Verdana, Geneva, sans-serif;
    font-weight: normal;
    font-size: 110%;
    color: #000;
    margin-top: 0em;
    margin-bottom: 2em;
}

.site_navigation>#social_media {
    display: flex;
    justify-content: end;
    gap: 5px;
    margin-block-start: 1em;
    margin-block-end: 1em;
}

/* Section container intra-section navigation and per-page contents. */
section {
    flex: 1;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

/** Intra-section header and navigation bar with squares. */
.section_header {
    display: flex;
}

.section_header>header {
    font-family: Roboto, Verdana, Geneva, sans-serif;
    font-size: 110%;
    line-height: 160%;
    color: #FF6600;
    display: inline;
    font-weight: normal;
    margin-right: 15px;
}

.nav_box_active_page {
    background-color: #ff6600;
    height: 10px;
    width: 10px;
    margin: 10px;
    vertical-align: middle;
}

.nav_box_sibling_page {
    background-color: #FFCC66;
    height: 10px;
    width: 10px;
    margin: 10px;
    vertical-align: middle;
}

.prev_next_links_div {
    font-family: Roboto, Arial, Helvetica, sans-serif;
    font-size: 100%;
    margin-left: auto;
}

/** Root page elements */

.main_page_image_container {
    columns: 3;
    column-gap: 0px;
}

.main_page_image_container>img {
    margin-bottom: 5px;
    margin-right: 5px;
}

/* Page-specific contents. */
main {
    padding-top: 5px;
    font-family: Roboto, Arial, Helvetica, sans-serif;
    font-size: 90%;
}

/* A flex box for images inside a page. */
.image_block {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

/* Allows to introduce row breaks between images. */
.image_block hr {
    border: none;
    width: 100%;
}

.image_block.centered_with_margins {
    justify-content: center;
}

.image_block.centered_with_margins img {
    margin: 10px;
}