.ReadPanelContainer {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.ReadPanel {
    padding: 1.5em;
    padding-top: 1em;
    padding-bottom: 1em;
    background-color: rgba(0, 0, 0, 0.7);
    color: white;
    border-radius: 1em;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.ReadPanel.AsPreview {
    background-image: url(../../../Include/DraftWatermark.png);
    background-position-x: center;
}

.AsPreviewHeader {
    margin-bottom: 0.5em;
    padding: 0.5em;
    padding-left: 1em;
    padding-right: 1em;
    text-align: center;
    font-style: italic;
    font-size: 1.6em;
    color: rgb(200, 0, 0);
    background-color: rgba(255, 0, 0, 0.1);
    border-radius: 1em;
}

.ReadPanelChooseSection {
    text-align: center;
    margin-bottom: 0.5em;
}

.ReadPanelChooseSection label {
    font-size: 0.9em;
    color: rgb(180, 180, 180);
}

.ReadPanelHeader {
    text-align: center;
    font-size: 0.9em;
    color: rgb(120, 120, 120);
}

.ReadPanelHeader label {
    color: rgb(180, 180, 180);
}

.ReadPanelFooter {
    padding-top: 1.5em;
    text-align: center;
}

.ReadPanelFooter .Button {
    min-height: 2em;
    margin-left: 0em;
    margin-right: 0em;
    background-color: rgb(104, 47, 47);
    border-color: rgb(151, 105, 123);
    color: rgb(180, 159, 153);
    font-size: 1em;
    border-radius: 0.3em;
}
.ReadPanelFooter .Button:hover {
    background-color: rgb(168, 8, 56);
    color: white;
}

.ReadPanelDocTitle {
    margin-top: 0.9em;
    font-size: 1.1em;
    text-align: center;
    color: rgb(203, 211, 212);
}

.ReadPanel .ReadPanelDocTitle a {
    color: rgb(203, 211, 212);
}
.ReadPanel .ReadPanelDocTitle a:hover {
    color: rgb(218, 122, 77);
}

.ReadPanelSectionTitle {
    font-size: 1.8em;
    text-align: center;
    color: rgb(203, 211, 212);
}

.ReadPanelSectionTitle label {
    font-size: 0.9em;
    color: rgb(153, 173, 175);
}

.ReadPanel .UpToMain {
    display: block;
    margin-top: 1em;
    color: rgb(216, 171, 130);
}

#ChapterList {
    margin-top: 0.25em;
    color: rgb(180, 180, 180);
}
#ChapterList a {
    display: block;
    color: rgb(255, 255, 228);
}
#ChapterList a:hover {
    color: rgb(218, 122, 77);
}

.ReadPanel h2 {
    margin-top: 1em;
    font-size: 1.5em;
    font-weight: normal;
    color: rgb(42, 100, 143);
}

.ReadPanel h3 {
    margin-top: 1.5em;
    font-size: 1.4em;
    font-weight: normal;
    color: rgb(88, 178, 194);
}

.ReadPanel a {
    color: rgb(200, 0, 0);
    text-decoration: none;
}
.ReadPanel a:hover {
    color: red;
    text-decoration: underline;
}

.ReadPanel .PauseDivider {
    font-size: 0.7em;
    text-align: center;
    color: rgb(216, 171, 130);
}
.ReadPanel .PauseDividerTts {
    display: none;
}
.ReadPanel .PauseDividerManuscript {
    display: none;
}

@media screen and (max-width: 700px) {

    #ChapterList li {
        padding-top: 0.5em;
        padding-bottom: 0.5em;
    }

}

#BodyHtml {
    margin-top: 1em;
}

#BodyHtml p span {
    color: rgb(255, 255, 228);
}

#BodyHtml h2 p span {
    margin-top: 1.5em;
	font-family: Suez One, serif;
    font-weight: normal;
    color:rgb(216, 171, 130);
}

#BodyHtml h2 label {
    font-size: 0.9em;
    color: rgb(180, 180, 180);
}

#BodyHtml h2 label span {
    display: none;
}

.FigureBlock {
}

.NoFigureBlock {
}

.Figure {
    display: block;
    max-width: 100%;
    margin: 0.5em;
    margin-bottom: 0.25em;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid rgb(184, 202, 207);
    border-radius: 1em;
}

.FigureCaption {
    margin-bottom: 0.2em;
    text-align: center;
    font-style: italic;
}

.FigureSubtitle {
    text-align: center;
    font-size: 0.8em;
}


#PresentationYouTubeFrame {
    width: 100%;
    height: 326px;
    max-width: 400px;
    margin-top: 2em;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid black;
    border-radius: 1em;
    overflow: hidden;
    background-color: black;
}

#PresentationYouTubeTitle {
    height: 26px;
    padding-top: 3px;
    font-size: 17px;
    text-align: center;
    color: rgb(200, 200, 200);
    background-color: rgb(8, 56, 79);
}

#PresentationYouTube {
    width: 100%;
    height: 300px;
}

.YouTubeVidFrame {
    width: 100%;
    height: 460px;
    margin-left: auto;
    margin-right: auto;
    border: 1px solid rgb(42, 72, 113);
    border-radius: 1em;
    overflow: hidden;
    background-color: black;
}

.YouTubeVid {
    border: none;
    width: 100%;
    height: 100%;
}

#AuthorNotes {
    color: rgb(168, 165, 120);
}

#AuthorNotes .NotesHeader {
    margin-top: 2em;
    margin-bottom: 0.2em;
    padding-top: 0.5em;
    border-top: 1px solid rgb(124, 155, 167);
    font-size: 2em;
    text-align: center;
}

#AuthorNotes .NotesAbout {
    margin-bottom: 1em;
    font-size: 0.8em;
    font-style: italic;
}

.NotesTeaser {
    font-size: 0.8em;
    font-style: italic;
}

.NextSection {
    display: block;
    margin-top: 2em;
    text-align: center;
}

.NextSection img {
    width: 12em;
}
.NextSection img:hover {
    filter: brightness(1.1);
}


/****************************************************************/

.TrackBlock {
    margin-left: 1em;
    margin-right: 1em;
    margin-top: 0.75em;
    margin-bottom: 0.75em;
    padding: 0.5em;
    padding-top: 0.25em;
    border-radius: 1em;
    background: linear-gradient(
        180deg,
        rgba(212, 229, 234, 1) 0%,
        rgba(212, 229, 234, 0.2) 100%
    );
    text-align: center;
}

.TrackBlockHeader {
    margin-bottom: 0.4em;
    font-size: 0.7em;
    color: rgba(0, 0, 0, 0.5);
}

.TrackNotFound {
    font-style: italic;
    color: red;
}

.TrackTitle {
    margin-bottom: 0.5em;
    font-size: 0.9em;
}

.TrackByline {
    font-size: 0.75em;
}

.TrackPlayers {
    display: flex;
    flex-direction: row;
    flex-flow: wrap;
    justify-content: center;
}

.TrackPlayers div:first-child {
    padding-top: 0.3em;
    color: rgba(0, 0, 0, 0.3);
    white-space: nowrap;
}

.TrackPlayers a {
    display: block;
    margin-left: 0.5em;
}

.TrackBlock .SpotifyLink img {
    height: 2em;
}

.TrackBlock .YoutubeLink img {
    height: 1.5em;
    padding-top: 0.25em;
}


/****************************************************************/

body.textOnly #PageHeader {
    display: none;
}

body.textOnly .AboveBodyHtml {
    display: none;
}

body.textOnly .BelowBodyHtml {
    display:none;
}

body.textOnly #EditorBlock {
    display: none;
}

body.textOnly #PageFooter {
    display: none;
}

body.textOnly .TrackBlock {
    display: none;
}

body.textOnly .FigureBlock {
    display: none;
}

body.textOnly .PauseDivider {
    display: none;
}
body.textOnly .PauseDividerTts {
    display: block;
    color: gray;
    font-style: italic;
}

body.textOnly #BodyHtml h2 label span {
    display: initial;
}

body.textOnly #MenuPanel {
    display: none;
}


/****************************************************************/

body.manuscript {
    background: rgb(240, 240, 240);
    font-family: Courier, monospace;
}

body.manuscript a {
    color: black;
    text-decoration: none;
    text-decoration-color: transparent;
}

body.manuscript #MenuPanel {
    display: none;
}

body.manuscript #PageContent {
    padding: 0;
}

body.manuscript .ReadPanelContainer {
    max-width: 8.5in;
    width: 8.5in;
}

body.manuscript .ReadPanel {
    padding: 1in;
    background: white;
    border-radius: 0;
    box-shadow: none;
}

body.manuscript #PageHeader {
    display: none;
}

body.manuscript #EditorBlock {
    display: none;
}

body.manuscript .BelowBodyHtml {
    display: none;
}

body.manuscript #PageFooter {
    display: none;
}

body.manuscript .AboveBodyHtml {
    display: none;
}

body.manuscript #ManuscriptHeader {
    display: block;
    font-size: 12pt;
}

body.manuscript #ManuscriptHeader .Right {
    float: right;
    text-align: right;
}

body.manuscript #ManuscriptHeader .Title {
    margin-top: 4em;
    text-align: center;
}

body.manuscript #BodyHtml p {
    line-height: 2em;
    text-indent: 0.5in;
    margin-block-start: 0;
    margin-block-end: 0;
    text-align: initial;
    font-size: 12pt;
}

body.manuscript #BodyHtml h2,
body.manuscript #BodyHtml h2 label {
    color: black;
    font-size: 1em;
}

body.manuscript #BodyHtml h2 p {
    text-indent: 0;
}

body.manuscript .TrackBlock {
    display: none;
}

body.manuscript .FigureBlock {
    display: none;
}

body.manuscript .PauseDivider {
    display: none;
}
body.manuscript .PauseDividerManuscript {
    display: block;
    text-align: center;
}


/****************************************************************/
/* Screen */

#ManuscriptHeader {
    display: none;
}

#PrintHeader {
    display: none;
}

.PrintTocHeader {
    display: none;
}


@media print {

    /*
    #PageHeader {
        display: none;
    }
    */

    #PagePrintHeader {
        display: none;
    }

    #PrintHeader {
        display: block;
        margin-bottom: 2em;
        color: black;
        text-align: center;
    }

    body.manuscript #PrintHeader {
        display: none;
    }

    #PrintHeader label {
        padding-right: 0.5em;
        font-weight: normal;
        font-size: 0.8em;
        color: rgb(159, 183, 190);
    }

    #PrintHeader div:nth-child(1) { /* Site title */
        margin-bottom: 0.5em;
        font-family: BlackWolf;
        font-size: 1.2em;
    }

    #PrintHeader div:nth-child(2) { /* Page title */
        font-family: Orbitron;
        font-size: 1.5em;
        font-weight: bold;
    }

    #PrintHeader div:nth-child(3) { /* Author */
        font-family: Orbitron;
        font-size: 1em;
    }

    #PrintHeader div:nth-child(4) { /* Section title */
        font-family: Orbitron;
        font-size: 1.3em;
        font-weight: bold;
    }

    #PrintHeader div:nth-child(5) { /* Stats */
        margin-top: 0.75em;
        font-size: 0.9em;
    }

    .ReadHeader {
        display: none;
    }

    .ReadPanelContainer {
        margin: 0em;
        max-width: 100%;
    }

    .ReadPanel {
        margin: 0em;
        padding: 0em;
        background-color: white;
        color: black;
        border-radius: 0em;
        border: none;
        box-shadow: none;
    }

    .PrintTocHeader {
        display: block;
        font-weight: bold;
        color: rgb(100, 100, 100);
    }

    .ReadPanel .UpToMain {
        display: none;
    }

    .ReadPanel h2 {
        color: black;
    }

    #BodyHtml p span {
        color: black;
    }
    
    #BodyHtml h2 p span {
        margin-top: 1.5em;
        font-family: Suez One, serif;
        font-weight: normal;
        color:rgb(85, 85, 85);
    }
    
    #BodyHtml h2 label {
        font-size: 0.9em;
        color: rgb(180, 180, 180);
    }
    
    #ChapterList {
        color: rgb(160, 160, 160);
    }

    #ChapterList a {
        color: rgb(100, 100, 100);
    }

    .Figure {
        width: 100%;
        max-width: 6in;
        border-radius: 0em;
    }

    .FigureSubtitle {
        display: none;
    }

    #AuthorNotes {
        color: black;
    }

    #PresentationYouTubeFrame {
        display: none;
    }

    .NextSection {
        display: none;
    }

    .ReadPanelFooter {
        display: none;
    }

    #EditorBlock {
        display: none;
    }

    #PageFooter {
        color: black;
    }

    #PageFooter address {
        background-color: transparent;
        box-shadow: none;
    }

    .TrackBlock {
        display: none;
    }

}