p {
    padding-bottom: 1em;
}

i {
    font-style: italic;
}

em {
    font-style: italic;
}

figcaption {
    font-size: 0.6875em;
    line-height: 1.1em;
    color: #585858;
    text-decoration: none;
}

#contents {
    visibility: hidden;
    height: 0;
}


.index li {
    padding: 0.5em;
    min-width: 8em;
}

.index-title {
    font-weight: bold;
    font-size: 1.25em;
    border-bottom: 1px solid #ccc;
}

.reference,
.indent {
    text-indent: -1em;
    margin-left: 1em;
}

.section-image {
    text-align: center;
	float: right;
}

    .section-image figure {
        border: 1px solid #ccc;
        border-bottom: none;
        padding: 0.5em;
        padding-bottom: 0.1em;
        min-width: 15.13333em;
    }

        .section-image figure figcaption {
            padding: 0.5em;
            border: 1px solid #ccc;
            border-top: none;
            font-size: 0.7333em;
            line-height: 1.2em;
        }

#images-content .section-image {
    float: left;
	margin: 1em; 
	min-height: 24.9em; 
}

#illustrations-content .section-image {
    float: left;
    margin: 1em;
    min-height: 24.9em;
}

#page-controls {
    position: fixed;
    bottom: 0;
    right: 1em;
    z-index: 300;
}

    #page-controls li {
        display: inline-block;
        background-color: rgba(215, 215, 215, 0.8);
        min-width: 0;
        cursor: pointer;
        text-align: center;
        color: #4e8a00;
        border-radius: 0.5em;
        margin-left: 0.5em;
        margin-top: 0.5em;
    }

        #page-controls li:hover {
            background-color: rgba(215, 215, 215, 1);
        }

li#scroll-top {
    display: none;
}

.indexes {
    height: 0;
}

.profile-content,
.gallery-content {
    margin-bottom: 2.5em;
    overflow: hidden;
}

@media screen and (min-width: 460px) {
    #images-content .section-image {
        float: left;
        margin: 1em;
        min-height: 24.9em;
    }
}

@media screen and (min-width: 750px) {
    .flex-container {
        display: flex;
        flex-direction: row;
    }

    .profile-content {
        order: 2;
        margin-left: 1em;
        width: 100%;
        max-width: 82%;
    }

    .indexes {
        order: 1;
        height: 100%;
        max-width: 18%;
        background-color: #f9f9f9;
        z-index: 0;
        padding: 0 1em;
    }

    #contents {
        visibility: visible;
        height: auto;
    }

    .main-header {
        margin-bottom: 0;
    }

    .profile-content,
    .gallery-content {
        margin-top: 1.9em;
        margin-bottom: 0;
    }

    .reference {
        text-indent: -2em;
        margin-left: 2em;
    }

    .single-image {
        display: flex;
    }

        .single-image p {
            order: 1;
        }

        .single-image .section-image {
            order: 2;
            margin-left: 1em;
            margin-top: -2.6em;
        }

        .single-image.no-heading .section-image {
            margin-top: 0;
        }

    .profile-section {
        clear: left;
    }
}

@media screen and (min-width: 1350px) {
    .profile-content {
        /*margin-left: 15%;*/
        width: 100%;
        max-width: 87%;
    }

    .indexes {
        max-width: 13%;
    }
}

.title {
    font-size: 2.25em;
    text-align: center;
    padding-bottom: 0.5em;
}

.key-image {
    text-align: center;
    padding: 0.3125em;
    width: 90%;
    margin: auto;
}

    .key-image figure {
        border: 1px solid #ccc;
        border-bottom: none;
        padding: 0.5em;
        padding-bottom: 0.2em;
        min-width: 15.13333em;
    }

    .key-image img {
        max-width: 100%;
    }

    .key-image figure figcaption {
        padding: 0.5em;
        border: 1px solid #ccc;
        border-top: none;
    }

.profile-section {
    clear: both;
}

    .profile-section .section-heading {
        font-size: 1.5em;
        padding: 0.5em 0;
        border-top: 1px solid #c6c6c6;
        margin-top: 0.5em;
    }

    .profile-section .section-content {
        font-size: 0.9375em;
        line-height: 1.5em;
        padding-top: 0.5em;
        padding-bottom: 1em;
        overflow: hidden;
    }

        .profile-section .section-content p {
            font-size: inherit;
            line-height: 1.375em;
			padding-bottom: 0.5em;
			margin-bottom: 0.5em;
        }

.table-container {
    float: left;
    padding: 0.5em;
    margin-left: 0.5em;
    margin-bottom: 1em;
}

    .table-container table caption {
        color: #666;
        font-size: 0.8em;
        line-height: 1.2667em;
        text-align: left;
        padding-bottom: 1em;
    }

    .table-container table tr {
        border-top: 1px solid #e8e8e8;
        border-bottom: 1px solid #e8e8e8;
        border-collapse: collapse;
        text-align: left;
    }

    .table-container table th {
        font-weight: bold;
    }

    .table-container th {
        background-color: #f1f1f1;
    }

    .table-container td, .table-container th {
        padding: 0.5em;
    }

.label {
    font-weight: bold;
}

.field-set {
    clear: both;
}

    .field-set .label {
        float: left;
        width: 38%;
    }

    .field-set .value {
        float: left;
        width: 62%;
    }

@media screen and (min-width: 600px) {
    .field-set .label {
        width: 28%;
    }

    .field-set .value {
        width: 72%;
    }
}

@media screen and (min-width: 1300px) {
    .field-set .label {
        width: 18%;
    }

    .field-set .value {
        width: 82%;
    }
}

@media screen and (min-width: 1700px) {
    .field-set .label {
        width: 13%;
    }

    .field-set .value {
        width: 87%;
    }
}

.author {
    text-align: center;
}

.index h3 {
    font-size: 1.25em;
    border-top: 1px solid #c6c6c6;
    border-bottom: 1px solid #c6c6c6;
    text-align: center;
    padding: 0.5em 0;
    margin-top: 0.5em;
}

.index ul {
    margin: 1em 0;
    line-height: 1.5em;
}

.split-column-list {
    padding-left: 1em;
}

@media screen and (min-width: 400px) {
    .split-column-list {
        padding-left: 0;
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}

@media screen and (min-width: 700px) {
    .split-column-list {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
    }
}

@media screen and (min-width: 750px) {
    .split-column-list {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2;
    }
}

@media screen and (min-width: 900px) {
    .split-column-list {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
    }
}

@media screen and (min-width: 1200px) {
    .split-column-list {
        -webkit-column-count: 4;
        -moz-column-count: 4;
        column-count: 4;
    }
}

@media screen and (min-width: 1600px) {
    .split-column-list {
        -webkit-column-count: 5;
        -moz-column-count: 5;
        column-count: 5;
    }
}

.synopsisEntry {
    margin-left: 1em;
    margin-bottom: 0.5em;
}

.tableKey td {
    padding-top: 0.2em;
    line-height: 1.2em;
}

.tableKey .keyLine1 td {
    padding-bottom: 0.2em;
}

.tableKey .keyLine2 td {
    padding-bottom: 1em;
}

.tableKey .lineNumber {
    width: 6.25%;
    min-width: 1.33333em;
}

.tableKey .features {
    width: 62.5%;
}

.tableKey .result {
    width: 31.25%;
    min-width: 6.66667em;
    text-align: right;
    vertical-align: bottom;
}

.columnheader-landscape{
}
.columnheader-landscape caption{ 
	color: #666; 
	font-size: 0.8em; 
	line-height: 1.2667em; 
	text-align: left; 
	padding-bottom: 1em; 
} 

.columnheader-landscape tr { 
	border-top: 1px solid #e8e8e8; 
	border-bottom: 1px solid #e8e8e8; 
	border-collapse: collapse; 
	text-align: left; 
} 

.columnheader-landscape th { 
	font-weight: bold; 
	text-align: left; 
	background-color: #f1f1f1; 
	padding: 0.2em 
} 

.columnheader-landscape td{ 
	padding: 0.1em 
} 

.line-columnheader{}

    .line-columnheader caption {
        color: #666;
        font-size: 0.8em;
        line-height: 1.2667em;
        text-align: left;
        padding-bottom: 1em;
    }

.line-columnheadere tr {
    border-top: 1px solid #e8e8e8;
    border-bottom: 1px solid #e8e8e8;
    border-collapse: collapse;
    text-align: left;
}

.line-columnheader th {
    font-weight: bold;
    text-align: left;
    background-color: #f1f1f1;
    padding: 0.2em
}

.line-columnheader td {
    padding: 0.1em
}