img {
max-width: 100%
}

a {
    color: #424242;

}

navigation {
    margin: 4px;
    padding: 5px;
    justify-content: space-between;
    width: 100%
}

#pdficon {
    width: 50px;
    height: 50px;
}

#main {
    min-height: 800px;
    width: 90%;
    padding-left: 5%;
    display: flex;
    flex-flow: row;
}


#main > about {
    flex: 3 1 60%;
    order: 2;
}

#main > articleimages {
    flex: 1 6 10%;
    order: 3;
    margin: 10px;
}
    video {
        min-width: 200px;
    }

#main > article {
    flex: 3 1 60%;
    order: 4;
}

#main > publications {
    flex: 1 6 20%;
    order: 5;
}

header, footer {
  display: block;
  margin: 4px;
  padding: 5px;
  padding-top: 10px;
  padding-bottom: 10px;
  min-height: 100px;
  text-align: center;
}

name {
    font: 28px arial;
    font-weight: bold;
}

.inline-fig {
  display: inline-block;
  margin-left: auto;
  margin-right: auto;
  padding-left: 20px;
}

figcaption {
  font-size: 12px;
  text-align: center;
}

li {
    margin: 7px 0 7px 0;
}

sectionhead {
font: 18px arial;
font-weight: bold;
}

projectlink {
    margin-bottom: 10px;
}

table, th, td {
    border: 1px solid black;
}

audio {
    width: 175px;
}

#pdficon {
  width: 50px;
  height: 50px;
}

/* Too narrow to support three columns */
    @media all and (max-width: 640px) {
        #main, #page {
            flex-direction: column;
        }

        #main > about, #main > articleimages, #main > article, #main > publications {
        /* Return them to document order */
            order: 0;
        }

        header, footer {
            min-height: 50px;
            max-height: 150px;
        }
    }

/* Gallery shit */
.galleryimg {
        max-width: 20cm;
        max-height: 20cm;
        vertical-align: bottom;
        display:block;
        margin:auto;
    }

.container {
        display: flex;
        flex-wrap: wrap;
}
.mcbox {
        flex: 1 1 auto;
        text-align: center
}

#articleimges {
    margin: 0;
}

.footnote {
    font-size: smaller;
}

.inline {
    display: inline
}
.center-text {
    text-align: center;
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.indented {
    margin-left: 50px;
}

.hideable {
  display: none;
}
#trigger:focus + .hideable {
  display: block;
}