.StoryTiles {
    display: flex;
}

.StoryTiles div {
    max-height: 40em;
    overflow: hidden;
}

div.SectionList {
    display: flex;
    flex-direction: column;
}

div.Scrollable {
    padding-right: 0.5em;
    overflow-y: auto;
    flex-grow: 1;
}

.SectionNumber {
    font-size: 0.9em;
    color: rgb(131, 169, 173);
}

.SectionStats {
    margin-left: 0.5em;
    padding-bottom: 0.3em;
    font-size: 0.68em;
    color: rgba(255, 255, 255, 0.5);
}

.SectionStats span {
    color: rgba(255, 255, 255, 0.7);
}

.AboutButtons {
    display: block;
    height: 5.6em;
    margin-top: 1em;
    text-align: center;
}

.AboutLinks {
    margin-left: 0.5em;
    margin-right: 0.5em;
    margin-bottom: 0;
    padding-top: 0.5em;
    padding-left: 1.3em;
    border-top: 1px solid rgba(100, 200, 255, 0.3);
    color: rgb(231, 191, 144);
}

.AboutLinks a {
    font-size: 1.2em;
    text-decoration: none;
    color: rgb(231, 191, 144);
}
.AboutLinks a:hover {
    text-decoration: underline;
    color: rgb(255, 255, 100);
}

.StartReading img {
    width: 40%;
}
.StartReading img:hover {
    filter: brightness(1.2);
}

.ViewFigures img {
    width: 40%;
}
.ViewFigures img:hover {
    filter: brightness(1.2);
}

.AboutBlock {
    display: flex;
    flex-direction: column;
}

.NarrativeText {
    font-size: 0.9em;
}

@media print {

    .SectionStats {
        color: rgb(131, 169, 173);
    }

    .SectionStats span {
        color: black;
    }

}