From a4be94a752f6fc5c8af2ca4a4b6c03b0e9c6ab12 Mon Sep 17 00:00:00 2001
From: Johannes Wilm <mail@johanneswilm.org>
Date: Tue, 10 Dec 2024 16:24:27 +0100
Subject: [PATCH] convert HTML + print exporters from DOMExporter to string
 concatenation

---
 .../book/fixtures/initial_book_data.json      |  10 +-
 .../book/migrations/0017_book_styles.py       |  30 ++
 .../js/modules/books/exporter/epub/index.js   |   2 +-
 .../js/modules/books/exporter/epub/tools.js   |  31 ++
 .../js/modules/books/exporter/html/index.js   | 400 +++++++++++++++++-
 .../modules/books/exporter/html/multifile.js  | 371 ----------------
 .../modules/books/exporter/html/singlefile.js | 165 --------
 .../modules/books/exporter/html/templates.js  | 111 ++++-
 .../js/modules/books/exporter/html/tools.js   |  44 +-
 .../js/modules/books/exporter/print/index.js  | 177 ++------
 .../modules/books/exporter/print/templates.js |  17 -
 .../book/static/js/modules/books/menu.js      |   7 +-
 12 files changed, 622 insertions(+), 743 deletions(-)
 create mode 100644 fiduswriter/book/migrations/0017_book_styles.py
 delete mode 100644 fiduswriter/book/static/js/modules/books/exporter/html/multifile.js
 delete mode 100644 fiduswriter/book/static/js/modules/books/exporter/html/singlefile.js

diff --git a/fiduswriter/book/fixtures/initial_book_data.json b/fiduswriter/book/fixtures/initial_book_data.json
index 737114b..d4ef1df 100644
--- a/fiduswriter/book/fixtures/initial_book_data.json
+++ b/fiduswriter/book/fixtures/initial_book_data.json
@@ -5,7 +5,7 @@
 		"fields": {
 			"title": "Springer",
 			"slug": "springer",
-			"contents": "@font-face {font-family: 'Source Sans Pro';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(SourceSansPro-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold Italic'), local('NoticiaText-BoldItalic'), url(NoticiaText-BoldItalic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text Italic'), local('NoticiaText-Italic'), url(NoticiaText-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text'), local('NoticiaText-Regular'), url(NoticiaText-Regular.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold'), local('NoticiaText-Bold'), url(NoticiaText-Bold_2.woff) format('woff');}\r\n\r\ndiv#print {\r\n    font-size: 9pt;\r\n}\r\ndiv#flow {\r\n    font-size: 12pt;\r\n}\r\n.user-contents {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    line-height: 1.25em;\r\n    text-align: justify;\r\n    word-wrap: break-word;\r\n    hyphens: auto;\r\n}\r\ndiv#print,\r\ndiv#flow {\r\n    counter-reset: footnote-counter footnote-marker-counter heading section subsection cat-figure cat-equation cat-photo cat-table !important;\r\n}\r\n.article-title {\r\n    margin-bottom: 30px;\r\n    font-size: 2em;\r\n    font-weight: 700;\r\n    text-transform: initial;\r\n}\r\n.article-title,\r\n.article-part.metadata {\r\n    padding-left: 50px;\r\n    padding-right: 50px;\r\n}\r\ndiv#print .article-title {\r\n    display: flex;\r\n    justify-content: center;\r\n    text-align: center;\r\n    align-items: center;\r\n}\r\n.article-subtitle {\r\n    font-size: 1.5em;\r\n    font-weight: 400;\r\n    display: inline;\r\n    text-align: justify;\r\n}\r\ndiv#print .article-subtitle:not([data-hidden]) {\r\n    display: flex;\r\n    justify-content: center;\r\n}\r\n.article-authors {\r\n    font-weight: 400;\r\n    break-after: always;\r\n    font-size: 1em;\r\n    text-decoration: none;\r\n    margin-top: 20pt;\r\n    margin-bottom: 20pt;\r\n    -moz-hyphens: none;\r\n    -webkit-hyphens: none;\r\n    -ms-hyphens: none;\r\n    hyphens: none;\r\n}\r\ndiv#print .article-authors {\r\n    text-align: center;\r\n}\r\n.article-abstract {\r\n    font-size: 0.9em;\r\n    margin: 1cm 0 0;\r\n    line-height: 0.999000;\r\n    min-height: 1.5em;\r\n    text-align: justify;\r\n}\r\n.article-part.article-abstract:before {\r\n    content: '';\r\n}\r\n.article-abstract > p:first-child:before {\r\n    content: 'Abstract. ';\r\n    color: black;\r\n    font-weight: 700;\r\n}\r\n.article-keywords {\r\n    font-size: 0.9em;\r\n    padding: 0 2.5em;\r\n    margin: 15px 0 0;\r\n    line-height: 1.2em;\r\n    text-align: justify;\r\n}\r\n.article-part.metadata.article-keywords:before {\r\n    content: 'Keywords: ';\r\n    color: black;\r\n    font-weight: 700;\r\n}\r\n.article-part.metadata {\r\n    margin-top: 30px;\r\n    margin-bottom: 20px;\r\n    line-height: 18px;\r\n}\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-weight: 400;\r\n    font-size: 1em;\r\n    text-align: center;\r\n    font-style: normal;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n.pagination-footnote > * > * {\r\n    font-weight: 400;\r\n    font-size: 1.3em;\r\n    line-height: 1.35em;\r\n}\r\n.pagination-pagenumber {\r\n    font-size: 1.25em;\r\n    font-weight: 400;\r\n    text-align: left !important;\r\n}\r\n.pagination-footnotes {\r\n    padding-top: 25px;\r\n}\r\nfigure {\r\n    font-style: italic;\r\n    font-size: 1.25em;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6,\r\n.user-contents p,\r\n.user-contents dl,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 12px;\r\n    margin-top: 12px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    hyphens: none;\r\n    line-height: 1.5em;\r\n    font-size: 1em;\r\n}\r\n.user-contents h1 {\r\n    font-size: 1.4em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h2 {\r\n    font-size: 1.3em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h3 {\r\n    font-size: 1.2em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h4 {\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    font-style: italic;\r\n}\r\n.user-contents h5 {\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    font-variant: small-caps;\r\n}\r\n.user-contents h6 {\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    text-decoration: underline;\r\n}\r\n.article-body h1:not(:empty):before {\r\n    counter-increment: heading;\r\n    /* add 1 to heading */\r\n    \r\n    content: counter(heading) \" \";\r\n    width: 2em;\r\n    display: inline-block;\r\n}\r\n.article-body h1:not(:empty) {\r\n    counter-reset: subheading section;\r\n    /* set section to 0 */\r\n}\r\n.article-body h2:not(:empty):before {\r\n    content: counter(heading) \".\" counter(subheading) \" \";\r\n    counter-increment: subheading subsection;\r\n    width: 2em;\r\n    display: inline-block;\r\n}\r\n.article-body h2:not(:empty) {\r\n    counter-reset: section;\r\n}\r\n.article-body h3:not(:empty):before {\r\n    content: counter(heading) \".\" counter(subheading) \".\" counter(section) \" \";\r\n    counter-increment: section;\r\n    width: 2em;\r\n    display: inline-block;\r\n}\r\n.article-body h3:not(:empty) {\r\n    counter-reset: subsection;\r\n}\r\ndiv#print .article-body,\r\n.pagination-footnote > * > * {\r\n    font-size: 1em;\r\n}\r\n/*unordered lists (<ul>) - the list items are marked with bullets*/\r\n/*ordered lists (<ol>) - the list items are marked with numbers or letters*/\r\n/*Anything added to the <ol> or <ul> tag, affects the entire list, while properties added to the <li> tag will affect the individual list items*/\r\n\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 1em;\r\n    margin: auto;\r\n    line-height: 1.4em;\r\n    text-indent: 0;\r\n    margin-block-start: 7px;\r\n    margin-inline-start: 5px;\r\n}\r\n.user-contents strong {\r\n    font-weight: 700;\r\n}\r\n.user-contents em {\r\n    font-style: italic;\r\n}\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: disc;\r\n    /*A filled circle*/\r\n}\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n.user-contents blockquote {\r\n    font-style: italic;\r\n    margin-left: 10px;\r\n    margin-right: 10px;\r\n    font-size: 2.2em;\r\n    line-height: 2.3em;\r\n}\r\n.user-contents code {\r\n    display: block;\r\n    font-family: \"Courier New\", Courier, mono-space;\r\n    font-size: 1.3em;\r\n    line-height: 1.75em;\r\n}\r\n#flow .article-bibliography {\r\n    background-color: lightgrey;\r\n}\r\n#flow .article-bibliography p {\r\n    font-size: 1.4em;\r\n    margin-bottom: 18px;\r\n}\r\n#flow .article-bibliography ol li {\r\n    counter-increment: list-order;\r\n    list-style-position: outside;\r\n    list-style-type: none;\r\n    margin-left: 1.1em;\r\n    font-size: 0.923em;\r\n}\r\n.equation {\r\n    margin: 3pt 0;\r\n    align-items: center;\r\n    justify-content: center;\r\n    font-size: 1.3em;\r\n}\r\n.pagination-page .pagination-main-contents-container {\r\n    height: 957px;\r\n}\r\ndiv#print table {\r\n    border-collapse: initial;\r\n    border-spacing: initial;\r\n    margin-bottom: 10px;\r\n}\r\ndiv#print tr,\r\ndiv#print td {\r\n    padding: 4px;\r\n    border: 1px solid black;\r\n}\r\ndiv#print figure {\r\n    margin: 0 0 10px 0;\r\n}"
+			"contents": "@font-face {font-family: 'Source Sans Pro';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(SourceSansPro-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold Italic'), local('NoticiaText-BoldItalic'), url(NoticiaText-BoldItalic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text Italic'), local('NoticiaText-Italic'), url(NoticiaText-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text'), local('NoticiaText-Regular'), url(NoticiaText-Regular.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold'), local('NoticiaText-Bold'), url(NoticiaText-Bold_2.woff) format('woff');}\r\n\r\ndiv#print {\r\n    font-size: 9pt;\r\n}\r\ndiv#flow {\r\n    font-size: 12pt;\r\n}\r\n.user-contents {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    line-height: 1.25em;\r\n    text-align: justify;\r\n    word-wrap: break-word;\r\n    hyphens: auto;\r\n}\r\ndiv#print,\r\ndiv#flow {\r\n    counter-reset: footnote-counter footnote-marker-counter heading section subsection cat-figure cat-equation cat-photo cat-table !important;\r\n}\r\n.doc-title {\r\n    margin-bottom: 30px;\r\n    font-size: 2em;\r\n    font-weight: 700;\r\n    text-transform: initial;\r\n}\r\n.doc-title,\r\n.doc-part.metadata {\r\n    padding-left: 50px;\r\n    padding-right: 50px;\r\n}\r\ndiv#print .doc-title {\r\n    display: flex;\r\n    justify-content: center;\r\n    text-align: center;\r\n    align-items: center;\r\n}\r\n.doc-subtitle {\r\n    font-size: 1.5em;\r\n    font-weight: 400;\r\n    display: inline;\r\n    text-align: justify;\r\n}\r\ndiv#print .doc-subtitle:not([data-hidden]) {\r\n    display: flex;\r\n    justify-content: center;\r\n}\r\n.doc-authors {\r\n    font-weight: 400;\r\n    break-after: always;\r\n    font-size: 1em;\r\n    text-decoration: none;\r\n    margin-top: 20pt;\r\n    margin-bottom: 20pt;\r\n    -moz-hyphens: none;\r\n    -webkit-hyphens: none;\r\n    -ms-hyphens: none;\r\n    hyphens: none;\r\n}\r\ndiv#print .doc-authors {\r\n    text-align: center;\r\n}\r\n.doc-abstract {\r\n    font-size: 0.9em;\r\n    margin: 1cm 0 0;\r\n    line-height: 0.999000;\r\n    min-height: 1.5em;\r\n    text-align: justify;\r\n}\r\n.doc-part.doc-abstract:before {\r\n    content: '';\r\n}\r\n.doc-abstract > p:first-child:before {\r\n    content: 'Abstract. ';\r\n    color: black;\r\n    font-weight: 700;\r\n}\r\n.doc-keywords {\r\n    font-size: 0.9em;\r\n    padding: 0 2.5em;\r\n    margin: 15px 0 0;\r\n    line-height: 1.2em;\r\n    text-align: justify;\r\n}\r\n.doc-part.metadata.doc-keywords:before {\r\n    content: 'Keywords: ';\r\n    color: black;\r\n    font-weight: 700;\r\n}\r\n.doc-part.metadata {\r\n    margin-top: 30px;\r\n    margin-bottom: 20px;\r\n    line-height: 18px;\r\n}\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-weight: 400;\r\n    font-size: 1em;\r\n    text-align: center;\r\n    font-style: normal;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n.pagination-footnote > * > * {\r\n    font-weight: 400;\r\n    font-size: 1.3em;\r\n    line-height: 1.35em;\r\n}\r\n.pagination-pagenumber {\r\n    font-size: 1.25em;\r\n    font-weight: 400;\r\n    text-align: left !important;\r\n}\r\n.pagination-footnotes {\r\n    padding-top: 25px;\r\n}\r\nfigure {\r\n    font-style: italic;\r\n    font-size: 1.25em;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6,\r\n.user-contents p,\r\n.user-contents dl,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 12px;\r\n    margin-top: 12px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    hyphens: none;\r\n    line-height: 1.5em;\r\n    font-size: 1em;\r\n}\r\n.user-contents h1 {\r\n    font-size: 1.4em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h2 {\r\n    font-size: 1.3em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h3 {\r\n    font-size: 1.2em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h4 {\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    font-style: italic;\r\n}\r\n.user-contents h5 {\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    font-variant: small-caps;\r\n}\r\n.user-contents h6 {\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    text-decoration: underline;\r\n}\r\n.doc-body h1:not(:empty):before {\r\n    counter-increment: heading;\r\n    /* add 1 to heading */\r\n    \r\n    content: counter(heading) \" \";\r\n    width: 2em;\r\n    display: inline-block;\r\n}\r\n.doc-body h1:not(:empty) {\r\n    counter-reset: subheading section;\r\n    /* set section to 0 */\r\n}\r\n.doc-body h2:not(:empty):before {\r\n    content: counter(heading) \".\" counter(subheading) \" \";\r\n    counter-increment: subheading subsection;\r\n    width: 2em;\r\n    display: inline-block;\r\n}\r\n.doc-body h2:not(:empty) {\r\n    counter-reset: section;\r\n}\r\n.doc-body h3:not(:empty):before {\r\n    content: counter(heading) \".\" counter(subheading) \".\" counter(section) \" \";\r\n    counter-increment: section;\r\n    width: 2em;\r\n    display: inline-block;\r\n}\r\n.doc-body h3:not(:empty) {\r\n    counter-reset: subsection;\r\n}\r\ndiv#print .doc-body,\r\n.pagination-footnote > * > * {\r\n    font-size: 1em;\r\n}\r\n/*unordered lists (<ul>) - the list items are marked with bullets*/\r\n/*ordered lists (<ol>) - the list items are marked with numbers or letters*/\r\n/*Anything added to the <ol> or <ul> tag, affects the entire list, while properties added to the <li> tag will affect the individual list items*/\r\n\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 1em;\r\n    margin: auto;\r\n    line-height: 1.4em;\r\n    text-indent: 0;\r\n    margin-block-start: 7px;\r\n    margin-inline-start: 5px;\r\n}\r\n.user-contents strong {\r\n    font-weight: 700;\r\n}\r\n.user-contents em {\r\n    font-style: italic;\r\n}\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: disc;\r\n    /*A filled circle*/\r\n}\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n.user-contents blockquote {\r\n    font-style: italic;\r\n    margin-left: 10px;\r\n    margin-right: 10px;\r\n    font-size: 2.2em;\r\n    line-height: 2.3em;\r\n}\r\n.user-contents code {\r\n    display: block;\r\n    font-family: \"Courier New\", Courier, mono-space;\r\n    font-size: 1.3em;\r\n    line-height: 1.75em;\r\n}\r\n#flow .doc-bibliography {\r\n    background-color: lightgrey;\r\n}\r\n#flow .doc-bibliography p {\r\n    font-size: 1.4em;\r\n    margin-bottom: 18px;\r\n}\r\n#flow .doc-bibliography ol li {\r\n    counter-increment: list-order;\r\n    list-style-position: outside;\r\n    list-style-type: none;\r\n    margin-left: 1.1em;\r\n    font-size: 0.923em;\r\n}\r\n.equation {\r\n    margin: 3pt 0;\r\n    align-items: center;\r\n    justify-content: center;\r\n    font-size: 1.3em;\r\n}\r\n.pagination-page .pagination-main-contents-container {\r\n    height: 957px;\r\n}\r\ndiv#print table {\r\n    border-collapse: initial;\r\n    border-spacing: initial;\r\n    margin-bottom: 10px;\r\n}\r\ndiv#print tr,\r\ndiv#print td {\r\n    padding: 4px;\r\n    border: 1px solid black;\r\n}\r\ndiv#print figure {\r\n    margin: 0 0 10px 0;\r\n}"
 		}
 	},
 	{
@@ -14,7 +14,7 @@
 		"fields": {
 			"title": "ACM",
 			"slug": "acm",
-			"contents": "@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold Italic'), local('NoticiaText-BoldItalic'), url(NoticiaText-BoldItalic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text Italic'), local('NoticiaText-Italic'), url(NoticiaText-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text'), local('NoticiaText-Regular'), url(NoticiaText-Regular.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold'), local('NoticiaText-Bold'), url(NoticiaText-Bold_2.woff) format('woff');}\r\n\r\n.user-contents {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    line-height: 18pt;\r\n    text-align: justify;\r\n    word-wrap: break-word;\r\n    hyphens: auto;\r\n}\r\ndiv#flow {\r\n    font-size: 12pt;\r\n}\r\ndiv#print {\r\n    font-size: 9pt;\r\n}\r\ndiv#print,\r\ndiv#flow {\r\n    counter-reset: footnote-counter footnote-marker-counter heading section subsection cat-figure cat-equation cat-photo cat-table !important;\r\n}\r\n.article-title {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    margin: 0 0 0.333em;\r\n    font-size: 2em;\r\n    font-weight: 700;\r\n    text-transform: capitalize;\r\n}\r\ndiv#print .article-title {\r\n    justify-content: center;\r\n    display: flex;\r\n    align-items: center;\r\n}\r\n.article-subtitle {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 1.6em;\r\n    font-weight: 400;\r\n}\r\ndiv#print .article-subtitle {\r\n    justify-content: center;\r\n}\r\n.article-authors {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-weight: 400;\r\n    break-after: always;\r\n    font-size: 1.25em;\r\n    margin-top: 20px;\r\n    margin-bottom: 20px;\r\n    text-decoration: none;\r\n}\r\ndiv#print .article-authors {\r\n    display: center;\r\n    text-align: center;\r\n}\r\n.article-abstract {\r\n    margin: 0 0 0.5em;\r\n    line-height: 15pt;\r\n}\r\n.article-part.article-abstract::before {\r\n    content: 'ABSTRACT';\r\n    color: black;\r\n    font-weight: 700;\r\n}\r\ndiv#print .article-abstract {\r\n    column-count: 2;\r\n    column-fill: auto;\r\n    -moz-column-count: 2;\r\n}\r\n.article-part.article-keywords::before {\r\n    content: 'Keywords\\A';\r\n    color: black;\r\n    font-weight: 700;\r\n}\r\n.article-keywords {\r\n    margin: 0 -10 0.5em;\r\n    line-height: 15pt;\r\n}\r\n.article-part.metadata {\r\n    margin-top: 30px;\r\n    margin-bottom: 40px;\r\n    line-height: 25px;\r\n}\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 700;\r\n    font-size: 1em;\r\n    text-align: left;\r\n    font-style: normal;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n.pagination-footnote > * > * {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    font-size: 1.1em;\r\n    line-height: 1.35em;\r\n}\r\n.pagination-pagenumber {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 1em;\r\n    font-weight: 400;\r\n    text-align: center !important;\r\n}\r\n.pagination-footnotes {\r\n    margin-top: 25px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents p,\r\n.user-contents dl,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 18px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 700;\r\n    hyphens: none;\r\n    line-height: 1.0 em;\r\n}\r\n.user-contents h1 {\r\n    font-size: 1.4em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h2 {\r\n    font-size: 1.3em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h3 {\r\n    font-size: 1.2em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h4 {\r\n    margin: 1.33333333em 0 0 0;\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    font-style: italic;\r\n}\r\n.user-contents h5 {\r\n    margin: 1.33333333em 0 0 0;\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    font-variant: small-caps;\r\n}\r\n.user-contents h6 {\r\n    margin: 1.33333333em 0 0 0;\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    text-decoration: underline;\r\n}\r\ndiv#print .article-body {\r\n    column-count: 2;\r\n    column-fill: auto;\r\n    -moz-column-count: 2;\r\n}\r\n.article-body h1:before {\r\n    counter-increment: heading;\r\n    /* add 1 to heading */\r\n    \r\n    content: counter(heading) \". \";\r\n}\r\n.article-body h1 {\r\n    counter-reset: subheading section;\r\n    /* set section to 0 */\r\n}\r\n.article-body h2:before {\r\n    content: counter(heading) \".\" counter(subheading) \" \";\r\n    counter-increment: subheading subsection;\r\n}\r\n.article-body h2 {\r\n    counter-reset: section;\r\n}\r\n.article-body h3:before {\r\n    content: counter(heading) \".\" counter(subheading) \".\" counter(section) \" \";\r\n    counter-increment: section;\r\n}\r\n.article-body h3 {\r\n    counter-reset: subsection;\r\n}\r\ndiv#print .article-body,\r\n.pagination-footnote > * > * {\r\n    font-size: 1em;\r\n}\r\n/*unordered lists (<ul>) - the list items are marked with bullets*/\r\n/*ordered lists (<ol>) - the list items are marked with numbers or letters*/\r\n/*Anything added to the <ol> or <ul> tag, affects the entire list, while properties added to the <li> tag will affect the individual list items*/\r\n\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 1em;\r\n    margin: 0 0 0.5em;\r\n    line-height: 18pt;\r\n    text-indent: 0;\r\n    counter-reset: figures;\r\n}\r\n.user-contents strong,\r\ndiv#print strong {\r\n    font-weight: 700;\r\n}\r\n.user-contents em,\r\ndiv#print em {\r\n    font-style: italic;\r\n}\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: disc;\r\n    /*A filled circle*/\r\n}\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n.user-contents blockquote {\r\n    font-style: italic;\r\n    margin-left: 20px;\r\n    margin-right: 20px;\r\n    font-size: 1.8em;\r\n    line-height: 1.4em;\r\n}\r\n.user-contents code {\r\n    display: block;\r\n    font-family: 'Courier', monospace;\r\n    font-size: 1.1em;\r\n    line-height: 1.75em;\r\n    white-space: pre-line;\r\n}\r\n.article-bibliography p {\r\n    font-size: 1.2em;\r\n    margin-bottom: 18px;\r\n}\r\n.figure {\r\n    counter-increment: figures;\r\n}\r\n.figcaption:before {\r\n    content: \"Fig. \" counter(figures) \" - \";\r\n}\r\n.equation {\r\n    margin: 3pt 0;\r\n    align-items: center;\r\n    justify-content: center;\r\n    font-size: 1.1em;\r\n}\r\n.pagination-page .pagination-contents-container {\r\n    right: 80px !important;\r\n    left: 80px !important;\r\n}\r\n.pagination-page .pagination-main-contents-container {\r\n    height: 927px;\r\n}\r\ndiv#print table {\r\n    border-collapse: initial;\r\n    border-spacing: initial;\r\n    margin-bottom: 30px;\r\n}\r\ndiv#print tr,\r\ndiv#print td {\r\n    padding: 4px;\r\n    border: 1px solid black;\r\n}\r\ndiv#print figure {\r\n    margin: 0 0 30px 0;\r\n}\r\n.article-bibliography-header {\r\n    text-transform: 'uppercase';\r\n}\r\ndiv#print .article-bibliography {\r\n    margin-top: 30px;\r\n    column-count: 2;\r\n    column-fill: auto;\r\n    -moz-column-count: 2;\r\n}"
+			"contents": "@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold Italic'), local('NoticiaText-BoldItalic'), url(NoticiaText-BoldItalic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text Italic'), local('NoticiaText-Italic'), url(NoticiaText-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text'), local('NoticiaText-Regular'), url(NoticiaText-Regular.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold'), local('NoticiaText-Bold'), url(NoticiaText-Bold_2.woff) format('woff');}\r\n\r\n.user-contents {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    line-height: 18pt;\r\n    text-align: justify;\r\n    word-wrap: break-word;\r\n    hyphens: auto;\r\n}\r\ndiv#flow {\r\n    font-size: 12pt;\r\n}\r\ndiv#print {\r\n    font-size: 9pt;\r\n}\r\ndiv#print,\r\ndiv#flow {\r\n    counter-reset: footnote-counter footnote-marker-counter heading section subsection cat-figure cat-equation cat-photo cat-table !important;\r\n}\r\n.doc-title {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    margin: 0 0 0.333em;\r\n    font-size: 2em;\r\n    font-weight: 700;\r\n    text-transform: capitalize;\r\n}\r\ndiv#print .doc-title {\r\n    justify-content: center;\r\n    display: flex;\r\n    align-items: center;\r\n}\r\n.doc-subtitle {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 1.6em;\r\n    font-weight: 400;\r\n}\r\ndiv#print .doc-subtitle {\r\n    justify-content: center;\r\n}\r\n.doc-authors {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-weight: 400;\r\n    break-after: always;\r\n    font-size: 1.25em;\r\n    margin-top: 20px;\r\n    margin-bottom: 20px;\r\n    text-decoration: none;\r\n}\r\ndiv#print .doc-authors {\r\n    display: center;\r\n    text-align: center;\r\n}\r\n.doc-abstract {\r\n    margin: 0 0 0.5em;\r\n    line-height: 15pt;\r\n}\r\n.doc-part.doc-abstract::before {\r\n    content: 'ABSTRACT';\r\n    color: black;\r\n    font-weight: 700;\r\n}\r\ndiv#print .doc-abstract {\r\n    column-count: 2;\r\n    column-fill: auto;\r\n    -moz-column-count: 2;\r\n}\r\n.doc-part.doc-keywords::before {\r\n    content: 'Keywords\\A';\r\n    color: black;\r\n    font-weight: 700;\r\n}\r\n.doc-keywords {\r\n    margin: 0 -10 0.5em;\r\n    line-height: 15pt;\r\n}\r\n.doc-part.metadata {\r\n    margin-top: 30px;\r\n    margin-bottom: 40px;\r\n    line-height: 25px;\r\n}\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 700;\r\n    font-size: 1em;\r\n    text-align: left;\r\n    font-style: normal;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n.pagination-footnote > * > * {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    font-size: 1.1em;\r\n    line-height: 1.35em;\r\n}\r\n.pagination-pagenumber {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 1em;\r\n    font-weight: 400;\r\n    text-align: center !important;\r\n}\r\n.pagination-footnotes {\r\n    margin-top: 25px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents p,\r\n.user-contents dl,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 18px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 700;\r\n    hyphens: none;\r\n    line-height: 1.0 em;\r\n}\r\n.user-contents h1 {\r\n    font-size: 1.4em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h2 {\r\n    font-size: 1.3em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h3 {\r\n    font-size: 1.2em;\r\n    font-weight: 700;\r\n}\r\n.user-contents h4 {\r\n    margin: 1.33333333em 0 0 0;\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    font-style: italic;\r\n}\r\n.user-contents h5 {\r\n    margin: 1.33333333em 0 0 0;\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    font-variant: small-caps;\r\n}\r\n.user-contents h6 {\r\n    margin: 1.33333333em 0 0 0;\r\n    font-size: 1.1em;\r\n    font-weight: 400;\r\n    text-decoration: underline;\r\n}\r\ndiv#print .doc-body {\r\n    column-count: 2;\r\n    column-fill: auto;\r\n    -moz-column-count: 2;\r\n}\r\n.doc-body h1:before {\r\n    counter-increment: heading;\r\n    /* add 1 to heading */\r\n    \r\n    content: counter(heading) \". \";\r\n}\r\n.doc-body h1 {\r\n    counter-reset: subheading section;\r\n    /* set section to 0 */\r\n}\r\n.doc-body h2:before {\r\n    content: counter(heading) \".\" counter(subheading) \" \";\r\n    counter-increment: subheading subsection;\r\n}\r\n.doc-body h2 {\r\n    counter-reset: section;\r\n}\r\n.doc-body h3:before {\r\n    content: counter(heading) \".\" counter(subheading) \".\" counter(section) \" \";\r\n    counter-increment: section;\r\n}\r\n.doc-body h3 {\r\n    counter-reset: subsection;\r\n}\r\ndiv#print .doc-body,\r\n.pagination-footnote > * > * {\r\n    font-size: 1em;\r\n}\r\n/*unordered lists (<ul>) - the list items are marked with bullets*/\r\n/*ordered lists (<ol>) - the list items are marked with numbers or letters*/\r\n/*Anything added to the <ol> or <ul> tag, affects the entire list, while properties added to the <li> tag will affect the individual list items*/\r\n\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 1em;\r\n    margin: 0 0 0.5em;\r\n    line-height: 18pt;\r\n    text-indent: 0;\r\n    counter-reset: figures;\r\n}\r\n.user-contents strong,\r\ndiv#print strong {\r\n    font-weight: 700;\r\n}\r\n.user-contents em,\r\ndiv#print em {\r\n    font-style: italic;\r\n}\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: disc;\r\n    /*A filled circle*/\r\n}\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n.user-contents blockquote {\r\n    font-style: italic;\r\n    margin-left: 20px;\r\n    margin-right: 20px;\r\n    font-size: 1.8em;\r\n    line-height: 1.4em;\r\n}\r\n.user-contents code {\r\n    display: block;\r\n    font-family: 'Courier', monospace;\r\n    font-size: 1.1em;\r\n    line-height: 1.75em;\r\n    white-space: pre-line;\r\n}\r\n.doc-bibliography p {\r\n    font-size: 1.2em;\r\n    margin-bottom: 18px;\r\n}\r\n.figure {\r\n    counter-increment: figures;\r\n}\r\n.figcaption:before {\r\n    content: \"Fig. \" counter(figures) \" - \";\r\n}\r\n.equation {\r\n    margin: 3pt 0;\r\n    align-items: center;\r\n    justify-content: center;\r\n    font-size: 1.1em;\r\n}\r\n.pagination-page .pagination-contents-container {\r\n    right: 80px !important;\r\n    left: 80px !important;\r\n}\r\n.pagination-page .pagination-main-contents-container {\r\n    height: 927px;\r\n}\r\ndiv#print table {\r\n    border-collapse: initial;\r\n    border-spacing: initial;\r\n    margin-bottom: 30px;\r\n}\r\ndiv#print tr,\r\ndiv#print td {\r\n    padding: 4px;\r\n    border: 1px solid black;\r\n}\r\ndiv#print figure {\r\n    margin: 0 0 30px 0;\r\n}\r\n.doc-bibliography-header {\r\n    text-transform: 'uppercase';\r\n}\r\ndiv#print .doc-bibliography {\r\n    margin-top: 30px;\r\n    column-count: 2;\r\n    column-fill: auto;\r\n    -moz-column-count: 2;\r\n}"
 		}
 	},
 	{
@@ -23,7 +23,7 @@
 		"fields": {
 			"title": "Drowsy Owl",
 			"slug": "owl",
-			"contents": "@font-face {font-family: 'Open Sans';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Open Sans Bold'), local('OpenSans-Bold'), url(OpenSans-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Open Sans';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Open Sans'), local('OpenSans-Regular'), url(OpenSans-Regular.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Cardo';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Cardo Italic'), local('Cardo-Italic'), url(Cardo-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Cardo';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Cardo Bold'), local('Cardo-Bold'), url(Cardo-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Cardo';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Cardo'), local('Cardo-Regular'), url(Cardo-Regular.woff) format('woff');}\r\n\r\n.user-contents {\r\n    font-family: 'Cardo', serif;\r\n    font-weight: 400;\r\n    font-size: 1.2em;\r\n    /*text-align: justify;*/\r\n    \r\n    word-wrap: break-word;\r\n}\r\n.article-authors,\r\n.article-keywords {\r\n    line-height: 1.6em;\r\n}\r\n.article-title {\r\n    font-family: 'Open Sans', sans-serif;\r\n    font-size: 48px;\r\n    font-weight: 700;\r\n}\r\n.article-subtitle {\r\n    font-family: 'Open Sans', sans-serif;\r\n    font-size: 40px;\r\n    font-weight: 900;\r\n}\r\n.article-abstract {\r\n    margin-left: 50px;\r\n    margin-right: 50px;\r\n}\r\n.article-part.metadata {\r\n    margin-bottom: 20px;\r\n}\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-family: 'Cardo', serif;\r\n    font-weight: 700;\r\n    font-size: 9px;\r\n    text-align: left;\r\n    font-style: normal;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n.pagination-footnote > * > * {\r\n    font-family: 'Cardo', serif;\r\n    font-weight: 400;\r\n    font-size: 12px;\r\n    line-height: 1.35em;\r\n}\r\n.pagination-pagenumber {\r\n    font-family: 'Open Sans', sans-serif;\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    text-align: center !important;\r\n    line-height: 30px;\r\n    right: auto !important;\r\n    left: 50% !important;\r\n    width: 60px;\r\n    height: 30px;\r\n    background-color: #f3f3f3;\r\n    -webkit-border-radius: 15px;\r\n    border-radius: 15px;\r\n    vertical-align: middle;\r\n    margin-left: -25px;\r\n}\r\n.pagination-footnotes {\r\n    margin-top: 25px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6,\r\n.user-contents p,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 35px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    font-family: 'Open Sans', sans-serif;\r\n    font-weight: 400;\r\n    line-height: 1.35em;\r\n    text-align: left;\r\n}\r\n.user-contents h1 {\r\n    font-size: 28px;\r\n}\r\n.user-contents h2 {\r\n    font-size: 26px;\r\n}\r\n.user-contents h3 {\r\n    font-size: 24px;\r\n}\r\n.user-contents h4 {\r\n    font-size: 22px;\r\n}\r\n.user-contents h5 {\r\n    font-size: 20px;\r\n}\r\n.user-contents h6 {\r\n    font-size: 18px;\r\n}\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 18px;\r\n    line-height: 1.5em;\r\n}\r\n.user-contents strong {\r\n    font-weight: 700;\r\n}\r\n.user-contents em {\r\n    font-style: italic;\r\n}\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: disc;\r\n}\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n.user-contents blockquote {\r\n    font-style: italic;\r\n    margin-left: 50px;\r\n    font-size: 18px;\r\n    line-height: 1.5em;\r\n}\r\n.user-contents code {\r\n    display: block;\r\n    font-family: \"Courier New\", Courier, mono-space;\r\n    font-size: 13px;\r\n    line-height: 1.75em;\r\n}\r\n.article-bibliography p {\r\n    font-size: 14px;\r\n    margin-bottom: 18px;\r\n}\r\n.equation {\r\n    font-size: 80%;\r\n}\r\n.pagination-contents-container {\r\n    bottom: 120px;\r\n    top: 80px;\r\n    height: auto;\r\n}"
+			"contents": "@font-face {font-family: 'Open Sans';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Open Sans Bold'), local('OpenSans-Bold'), url(OpenSans-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Open Sans';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Open Sans'), local('OpenSans-Regular'), url(OpenSans-Regular.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Cardo';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Cardo Italic'), local('Cardo-Italic'), url(Cardo-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Cardo';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Cardo Bold'), local('Cardo-Bold'), url(Cardo-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Cardo';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Cardo'), local('Cardo-Regular'), url(Cardo-Regular.woff) format('woff');}\r\n\r\n.user-contents {\r\n    font-family: 'Cardo', serif;\r\n    font-weight: 400;\r\n    font-size: 1.2em;\r\n    /*text-align: justify;*/\r\n    \r\n    word-wrap: break-word;\r\n}\r\n.doc-authors,\r\n.doc-keywords {\r\n    line-height: 1.6em;\r\n}\r\n.doc-title {\r\n    font-family: 'Open Sans', sans-serif;\r\n    font-size: 48px;\r\n    font-weight: 700;\r\n}\r\n.doc-subtitle {\r\n    font-family: 'Open Sans', sans-serif;\r\n    font-size: 40px;\r\n    font-weight: 900;\r\n}\r\n.doc-abstract {\r\n    margin-left: 50px;\r\n    margin-right: 50px;\r\n}\r\n.doc-part.metadata {\r\n    margin-bottom: 20px;\r\n}\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-family: 'Cardo', serif;\r\n    font-weight: 700;\r\n    font-size: 9px;\r\n    text-align: left;\r\n    font-style: normal;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n.pagination-footnote > * > * {\r\n    font-family: 'Cardo', serif;\r\n    font-weight: 400;\r\n    font-size: 12px;\r\n    line-height: 1.35em;\r\n}\r\n.pagination-pagenumber {\r\n    font-family: 'Open Sans', sans-serif;\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    text-align: center !important;\r\n    line-height: 30px;\r\n    right: auto !important;\r\n    left: 50% !important;\r\n    width: 60px;\r\n    height: 30px;\r\n    background-color: #f3f3f3;\r\n    -webkit-border-radius: 15px;\r\n    border-radius: 15px;\r\n    vertical-align: middle;\r\n    margin-left: -25px;\r\n}\r\n.pagination-footnotes {\r\n    margin-top: 25px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6,\r\n.user-contents p,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 35px;\r\n}\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    font-family: 'Open Sans', sans-serif;\r\n    font-weight: 400;\r\n    line-height: 1.35em;\r\n    text-align: left;\r\n}\r\n.user-contents h1 {\r\n    font-size: 28px;\r\n}\r\n.user-contents h2 {\r\n    font-size: 26px;\r\n}\r\n.user-contents h3 {\r\n    font-size: 24px;\r\n}\r\n.user-contents h4 {\r\n    font-size: 22px;\r\n}\r\n.user-contents h5 {\r\n    font-size: 20px;\r\n}\r\n.user-contents h6 {\r\n    font-size: 18px;\r\n}\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 18px;\r\n    line-height: 1.5em;\r\n}\r\n.user-contents strong {\r\n    font-weight: 700;\r\n}\r\n.user-contents em {\r\n    font-style: italic;\r\n}\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: disc;\r\n}\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n.user-contents blockquote {\r\n    font-style: italic;\r\n    margin-left: 50px;\r\n    font-size: 18px;\r\n    line-height: 1.5em;\r\n}\r\n.user-contents code {\r\n    display: block;\r\n    font-family: \"Courier New\", Courier, mono-space;\r\n    font-size: 13px;\r\n    line-height: 1.75em;\r\n}\r\n.doc-bibliography p {\r\n    font-size: 14px;\r\n    margin-bottom: 18px;\r\n}\r\n.equation {\r\n    font-size: 80%;\r\n}\r\n.pagination-contents-container {\r\n    bottom: 120px;\r\n    top: 80px;\r\n    height: auto;\r\n}"
 		}
 	},
 	{
@@ -32,7 +32,7 @@
 		"fields": {
 			"title": "Foxy Fox",
 			"slug": "fox",
-			"contents": "@font-face {font-family: 'Lobster 1.4';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Lobster 1.4'), local('Lobster-1.4'), url(Lobster-1.4.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Crimson Text';\r\nfont-style: italic;\r\nfont-weight: 700;\r\nsrc: local('Crimson Text Bold Italic'), local('CrimsonText-BoldItalic'), url(CrimsonText-BoldItalic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Crimson Text';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Crimson Text Italic'), local('CrimsonText-Italic'), url(CrimsonText-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Crimson Text';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Crimson Text Bold'), local('CrimsonText-Bold'), url(CrimsonText-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Crimson Text';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Crimson Text'), local('CrimsonText-Roman'), url(CrimsonText-Roman.woff) format('woff');}\r\n\r\n.user-contents {\r\n    font-family: 'Crimson Text', serif;\r\n    font-weight: 400;\r\n    font-size: 1.2em;\r\n    /*text-align: justify;*/\r\n    word-wrap: break-word;\r\n}\r\n\r\n.article-authors, .article-keywords  {\r\n    line-height: 1.6em;\r\n}\r\n\r\n.article-title {\r\n    font-family: 'Lobster 1.4', sans-serif;\r\n    font-size: 48px;\r\n    font-weight: 700;\r\n    text-align: center;\r\n}\r\n\r\n.article-subtitle {\r\n    font-family: 'Lobster 1.4', sans-serif;\r\n    font-size: 40px;\r\n    font-weight: 900;\r\n}\r\n\r\n.article-abstract {\r\n    margin-left: 50px;\r\n    margin-right: 50px;\r\n}\r\n\r\n.article-part.metadata {\r\n    margin-bottom: 20px;\r\n}\r\n\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-family: 'Crimson Text', serif;\r\n    font-weight: 700;\r\n    font-size: 9px;\r\n    text-align: left;\r\n    font-style: normal;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n\r\n.pagination-footnote > * > * {\r\n    font-family: 'Crimson Text', serif;\r\n    font-weight: 400;\r\n    font-size: 13px;\r\n    line-height: 1.35em;\r\n}\r\n\r\n.pagination-pagenumber {\r\n    font-family: 'Lobster 1.4', sans-serif;\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    text-align: center !important;\r\n}\r\n\r\n.pagination-footnotes {\r\n    margin-top: 25px;\r\n}\r\n\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6,\r\n.user-contents p,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 35px;\r\n}\r\n\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    font-family: 'Lobster 1.4', sans-serif;\r\n    font-weight: 400;\r\n    line-height: 1.35em;\r\n    text-align: center;\r\n}\r\n\r\n.user-contents h1  {\r\n    font-size: 25px;\r\n}\r\n\r\n.user-contents h2 {\r\n    font-size: 23px;\r\n}\r\n\r\n.user-contents h3 {\r\n    font-size: 21px;\r\n}\r\n\r\n.user-contents h4 {\r\n    font-size: 19px;\r\n}\r\n\r\n.user-contents h5 {\r\n    font-size: 17px;\r\n}\r\n\r\n.user-contents h6 {\r\n    font-size: 15px;\r\n}\r\n\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 20px;\r\n    line-height: 1.4em;\r\n}\r\n\r\n.user-contents strong {\r\n    font-weight: 700;\r\n}\r\n\r\n.user-contents em {\r\n    font-style: italic;\r\n}\r\n\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: disc;\r\n}\r\n\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n\r\n.user-contents blockquote {\r\n    font-style: italic;\r\n    margin-left: 20px;\r\n    margin-right: 20px;\r\n    font-size: 20px;\r\n    line-height: 1.4em;\r\n}\r\n\r\n.user-contents code {\r\n    display: block;\r\n    font-family: \"Courier New\", Courier, mono-space;\r\n    font-size: 13px;\r\n    line-height: 1.75em;\r\n}\r\n\r\n.article-bibliography p {\r\n    font-size: 14px;\r\n    margin-bottom: 18px;\r\n}\r\n.equation {\r\n    font-size: 260%;\r\n}\r\n\r\n.pagination-page .pagination-contents-container {\r\n    right: 80px !important;\r\n    left: 80px !important;\r\n}"
+			"contents": "@font-face {font-family: 'Lobster 1.4';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Lobster 1.4'), local('Lobster-1.4'), url(Lobster-1.4.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Crimson Text';\r\nfont-style: italic;\r\nfont-weight: 700;\r\nsrc: local('Crimson Text Bold Italic'), local('CrimsonText-BoldItalic'), url(CrimsonText-BoldItalic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Crimson Text';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Crimson Text Italic'), local('CrimsonText-Italic'), url(CrimsonText-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Crimson Text';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Crimson Text Bold'), local('CrimsonText-Bold'), url(CrimsonText-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Crimson Text';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Crimson Text'), local('CrimsonText-Roman'), url(CrimsonText-Roman.woff) format('woff');}\r\n\r\n.user-contents {\r\n    font-family: 'Crimson Text', serif;\r\n    font-weight: 400;\r\n    font-size: 1.2em;\r\n    /*text-align: justify;*/\r\n    word-wrap: break-word;\r\n}\r\n\r\n.doc-authors, .doc-keywords  {\r\n    line-height: 1.6em;\r\n}\r\n\r\n.doc-title {\r\n    font-family: 'Lobster 1.4', sans-serif;\r\n    font-size: 48px;\r\n    font-weight: 700;\r\n    text-align: center;\r\n}\r\n\r\n.doc-subtitle {\r\n    font-family: 'Lobster 1.4', sans-serif;\r\n    font-size: 40px;\r\n    font-weight: 900;\r\n}\r\n\r\n.doc-abstract {\r\n    margin-left: 50px;\r\n    margin-right: 50px;\r\n}\r\n\r\n.doc-part.metadata {\r\n    margin-bottom: 20px;\r\n}\r\n\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-family: 'Crimson Text', serif;\r\n    font-weight: 700;\r\n    font-size: 9px;\r\n    text-align: left;\r\n    font-style: normal;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n\r\n.pagination-footnote > * > * {\r\n    font-family: 'Crimson Text', serif;\r\n    font-weight: 400;\r\n    font-size: 13px;\r\n    line-height: 1.35em;\r\n}\r\n\r\n.pagination-pagenumber {\r\n    font-family: 'Lobster 1.4', sans-serif;\r\n    font-size: 12px;\r\n    font-weight: 400;\r\n    text-align: center !important;\r\n}\r\n\r\n.pagination-footnotes {\r\n    margin-top: 25px;\r\n}\r\n\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6,\r\n.user-contents p,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 35px;\r\n}\r\n\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    font-family: 'Lobster 1.4', sans-serif;\r\n    font-weight: 400;\r\n    line-height: 1.35em;\r\n    text-align: center;\r\n}\r\n\r\n.user-contents h1  {\r\n    font-size: 25px;\r\n}\r\n\r\n.user-contents h2 {\r\n    font-size: 23px;\r\n}\r\n\r\n.user-contents h3 {\r\n    font-size: 21px;\r\n}\r\n\r\n.user-contents h4 {\r\n    font-size: 19px;\r\n}\r\n\r\n.user-contents h5 {\r\n    font-size: 17px;\r\n}\r\n\r\n.user-contents h6 {\r\n    font-size: 15px;\r\n}\r\n\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 20px;\r\n    line-height: 1.4em;\r\n}\r\n\r\n.user-contents strong {\r\n    font-weight: 700;\r\n}\r\n\r\n.user-contents em {\r\n    font-style: italic;\r\n}\r\n\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: disc;\r\n}\r\n\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n\r\n.user-contents blockquote {\r\n    font-style: italic;\r\n    margin-left: 20px;\r\n    margin-right: 20px;\r\n    font-size: 20px;\r\n    line-height: 1.4em;\r\n}\r\n\r\n.user-contents code {\r\n    display: block;\r\n    font-family: \"Courier New\", Courier, mono-space;\r\n    font-size: 13px;\r\n    line-height: 1.75em;\r\n}\r\n\r\n.doc-bibliography p {\r\n    font-size: 14px;\r\n    margin-bottom: 18px;\r\n}\r\n.equation {\r\n    font-size: 260%;\r\n}\r\n\r\n.pagination-page .pagination-contents-container {\r\n    right: 80px !important;\r\n    left: 80px !important;\r\n}"
 		}
 	},
 	{
@@ -41,7 +41,7 @@
 		"fields": {
 			"title": "Comfy Elephant",
 			"slug": "elephant",
-			"contents": "@font-face {font-family: 'Source Sans Pro';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(SourceSansPro-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold Italic'), local('NoticiaText-BoldItalic'), url(NoticiaText-BoldItalic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text Italic'), local('NoticiaText-Italic'), url(NoticiaText-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text'), local('NoticiaText-Regular'), url(NoticiaText-Regular.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold'), local('NoticiaText-Bold'), url(NoticiaText-Bold_2.woff) format('woff');}\r\n\r\n.user-contents {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    font-size: 1.2em;\r\n    /*text-align: justify;*/\r\n    word-wrap: break-word;\r\n}\r\n\r\n.article-authors, .article-keywords {\r\n    line-height: 1.6em;\r\n}\r\n\r\n.article-title {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 48px;\r\n    font-weight: 700;\r\n}\r\n\r\n.article-subtitle {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 40px;\r\n    font-weight: 900;\r\n}\r\n\r\n.article-abstract {\r\n    margin-left: 50px;\r\n    margin-right: 50px;\r\n}\r\n\r\n.article-part.metadata {\r\n    margin-bottom: 20px;\r\n}\r\n\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    font-size: 9px;\r\n    text-align: left;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n\r\n.pagination-footnote > * > * {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    font-size: 10px;\r\n}\r\n\r\n.pagination-pagenumber {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 12px;\r\n    font-weight: 700;\r\n}\r\n\r\n.pagination-footnotes {\r\n    margin-top: 25px;\r\n}\r\n\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6,\r\n.user-contents p,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 35px;\r\n}\r\n\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-weight: 700;\r\n    line-height: 1.25em;\r\n}\r\n\r\n.user-contents h1  {\r\n    font-size: 36px;\r\n}\r\n\r\n.user-contents h2 {\r\n    font-size: 32px;\r\n}\r\n\r\n.user-contents h3 {\r\n    font-size: 28px;\r\n}\r\n\r\n.user-contents h4 {\r\n    font-size: 26px;\r\n    font-style: italic;\r\n}\r\n\r\n.user-contents h5 {\r\n    font-size: 24px;\r\n    font-variant: small-caps;\r\n}\r\n\r\n\r\n.user-contents h6 {\r\n    font-size: 22px;\r\n    text-decoration: underline;\r\n}\r\n\r\n\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 16px;\r\n    line-height: 1.75em;\r\n}\r\n\r\n.user-contents strong {\r\n    font-weight: 700;\r\n}\r\n\r\n.user-contents em {\r\n    font-style: italic;\r\n}\r\n\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: square;\r\n}\r\n\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n\r\n.user-contents blockquote {\r\n    margin-left: 40px;\r\n    margin-right: 40px;\r\n    font-size: 13px;\r\n    line-height: 1.8em;\r\n}\r\n\r\n.user-contents code {\r\n    display: block;\r\n    font-family: \"Courier New\", Courier, mono-space;\r\n    font-size: 13px;\r\n    line-height: 1.75em;\r\n}\r\n\r\n.article-bibliography p {\r\n    font-size: 14px;\r\n    margin-bottom: 18px;\r\n}\r\n\r\n.equation {\r\n    font-size: 80%;\r\n}"
+			"contents": "@font-face {font-family: 'Source Sans Pro';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(SourceSansPro-Bold.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold Italic'), local('NoticiaText-BoldItalic'), url(NoticiaText-BoldItalic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: italic;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text Italic'), local('NoticiaText-Italic'), url(NoticiaText-Italic.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 400;\r\nsrc: local('Noticia Text'), local('NoticiaText-Regular'), url(NoticiaText-Regular.woff) format('woff');}\r\n\r\n@font-face {font-family: 'Noticia Text';\r\nfont-style: normal;\r\nfont-weight: 700;\r\nsrc: local('Noticia Text Bold'), local('NoticiaText-Bold'), url(NoticiaText-Bold_2.woff) format('woff');}\r\n\r\n.user-contents {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    font-size: 1.2em;\r\n    /*text-align: justify;*/\r\n    word-wrap: break-word;\r\n}\r\n\r\n.doc-authors, .doc-keywords {\r\n    line-height: 1.6em;\r\n}\r\n\r\n.doc-title {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 48px;\r\n    font-weight: 700;\r\n}\r\n\r\n.doc-subtitle {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 40px;\r\n    font-weight: 900;\r\n}\r\n\r\n.doc-abstract {\r\n    margin-left: 50px;\r\n    margin-right: 50px;\r\n}\r\n\r\n.doc-part.metadata {\r\n    margin-bottom: 20px;\r\n}\r\n\r\n.pagination-footnote:before,\r\n.pagination-footnote > * > *:first-child:before {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    font-size: 9px;\r\n    text-align: left;\r\n    vertical-align: super;\r\n    line-height: 0;\r\n}\r\n\r\n.pagination-footnote > * > *:first-child:before {\r\n    margin-right: 5px;\r\n}\r\n\r\n.pagination-footnote > * > * {\r\n    font-family: 'Noticia Text', serif;\r\n    font-weight: 400;\r\n    font-size: 10px;\r\n}\r\n\r\n.pagination-pagenumber {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-size: 12px;\r\n    font-weight: 700;\r\n}\r\n\r\n.pagination-footnotes {\r\n    margin-top: 25px;\r\n}\r\n\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6,\r\n.user-contents p,\r\n.user-contents blockquote,\r\n.user-contents code,\r\n.user-contents ol,\r\n.user-contents ul {\r\n    margin-bottom: 35px;\r\n}\r\n\r\n.user-contents h1,\r\n.user-contents h2,\r\n.user-contents h3,\r\n.user-contents h4,\r\n.user-contents h5,\r\n.user-contents h6 {\r\n    font-family: 'Source Sans Pro', sans-serif;\r\n    font-weight: 700;\r\n    line-height: 1.25em;\r\n}\r\n\r\n.user-contents h1  {\r\n    font-size: 36px;\r\n}\r\n\r\n.user-contents h2 {\r\n    font-size: 32px;\r\n}\r\n\r\n.user-contents h3 {\r\n    font-size: 28px;\r\n}\r\n\r\n.user-contents h4 {\r\n    font-size: 26px;\r\n    font-style: italic;\r\n}\r\n\r\n.user-contents h5 {\r\n    font-size: 24px;\r\n    font-variant: small-caps;\r\n}\r\n\r\n\r\n.user-contents h6 {\r\n    font-size: 22px;\r\n    text-decoration: underline;\r\n}\r\n\r\n\r\n.user-contents p,\r\n.user-contents ol li,\r\n.user-contents ul li {\r\n    font-size: 16px;\r\n    line-height: 1.75em;\r\n}\r\n\r\n.user-contents strong {\r\n    font-weight: 700;\r\n}\r\n\r\n.user-contents em {\r\n    font-style: italic;\r\n}\r\n\r\n.user-contents ul,\r\n.user-contents ol {\r\n    padding-left: 15px;\r\n}\r\n.user-contents ul {\r\n    list-style: square;\r\n}\r\n\r\n.user-contents ol {\r\n    list-style: decimal;\r\n}\r\n\r\n.user-contents blockquote {\r\n    margin-left: 40px;\r\n    margin-right: 40px;\r\n    font-size: 13px;\r\n    line-height: 1.8em;\r\n}\r\n\r\n.user-contents code {\r\n    display: block;\r\n    font-family: \"Courier New\", Courier, mono-space;\r\n    font-size: 13px;\r\n    line-height: 1.75em;\r\n}\r\n\r\n.doc-bibliography p {\r\n    font-size: 14px;\r\n    margin-bottom: 18px;\r\n}\r\n\r\n.equation {\r\n    font-size: 80%;\r\n}"
 		}
 	},
 	{
diff --git a/fiduswriter/book/migrations/0017_book_styles.py b/fiduswriter/book/migrations/0017_book_styles.py
new file mode 100644
index 0000000..4846256
--- /dev/null
+++ b/fiduswriter/book/migrations/0017_book_styles.py
@@ -0,0 +1,30 @@
+# Generated by Django 5.1.2 on 2024-12-10 11:49
+
+from django.db import migrations
+
+
+def article_to_doc_selector(apps, schema_editor):
+    BookStyle = apps.get_model("book", "BookStyle")
+    for style in BookStyle.objects.all():
+        style.contents = style.contents.replace(".article-", ".doc-")
+        style.save()
+
+
+def doc_to_article_selector(apps, schema_editor):
+    BookStyle = apps.get_model("book", "BookStyle")
+    for style in BookStyle.objects.all():
+        style.contents = style.contents.replace(".doc-", ".article-")
+        style.save()
+
+
+class Migration(migrations.Migration):
+    dependencies = [
+        ("book", "0016_book_docx_template"),
+    ]
+
+    operations = [
+        migrations.RunPython(
+            article_to_doc_selector,
+            doc_to_article_selector,
+        ),
+    ]
diff --git a/fiduswriter/book/static/js/modules/books/exporter/epub/index.js b/fiduswriter/book/static/js/modules/books/exporter/epub/index.js
index fd4a3c8..4e4bd27 100644
--- a/fiduswriter/book/static/js/modules/books/exporter/epub/index.js
+++ b/fiduswriter/book/static/js/modules/books/exporter/epub/index.js
@@ -19,6 +19,7 @@ import {
 } from "./templates"
 import {
     addCategoryLabels,
+    modifyImages,
     orderLinks,
     setLinks,
     styleEpubFootnotes
@@ -34,7 +35,6 @@ import {removeHidden} from "../../../exporter/tools/doc_content"
 import {createSlug} from "../../../exporter/tools/file"
 import {node2Obj, obj2Node} from "../../../exporter/tools/json"
 import {ZipFileCreator} from "../../../exporter/tools/zip"
-import {modifyImages} from "../html/tools"
 
 export class EpubBookExporter extends DOMExporter {
     constructor(schema, csl, bookStyles, book, user, docList, updated) {
diff --git a/fiduswriter/book/static/js/modules/books/exporter/epub/tools.js b/fiduswriter/book/static/js/modules/books/exporter/epub/tools.js
index 8e5d11e..968ed2f 100644
--- a/fiduswriter/book/static/js/modules/books/exporter/epub/tools.js
+++ b/fiduswriter/book/static/js/modules/books/exporter/epub/tools.js
@@ -134,3 +134,34 @@ export function addCategoryLabels(htmlEl, language, footnote = false) {
         })
     return htmlEl
 }
+
+export const modifyImages = htmlEl => {
+    const imageLinks = htmlEl.querySelectorAll("img"),
+        images = []
+
+    imageLinks.forEach((el, index) => {
+        const src = el.getAttribute("src").split("?")[0]
+        let filename = `images/${src.split("/").pop()}`
+        // JPGs are output as PNG elements as well.
+        if (filename === "images/") {
+            // name was not retrievable so we give the image a unique numerical
+            // name like 1.png, 2.jpg, 3.svg, etc. .
+            filename = `images/${index}`
+        }
+
+        const newImg = document.createElement("img")
+        // We set the src of the image as "data-src" for now so that the browser
+        // won't try to load the file immediately
+        newImg.setAttribute("data-src", filename)
+        el.parentNode.replaceChild(newImg, el)
+
+        if (!images.find(image => image.filename === filename)) {
+            images.push({
+                filename,
+                url: src
+            })
+        }
+    })
+
+    return images
+}
diff --git a/fiduswriter/book/static/js/modules/books/exporter/html/index.js b/fiduswriter/book/static/js/modules/books/exporter/html/index.js
index 0805708..9e15785 100644
--- a/fiduswriter/book/static/js/modules/books/exporter/html/index.js
+++ b/fiduswriter/book/static/js/modules/books/exporter/html/index.js
@@ -1,3 +1,397 @@
-export {HTMLBookExporter} from "./multifile"
-export {SingleFileHTMLBookExporter} from "./singlefile"
-export {htmlBookIndexBodyTemplate} from "./templates"
+import download from "downloadjs"
+import pretty from "pretty"
+import {addAlert, get} from "../../../common"
+import {HTMLExporter} from "../../../exporter/html/index"
+import {createSlug} from "../../../exporter/tools/file"
+import {ZipFileCreator} from "../../../exporter/tools/zip"
+import {LANGUAGES} from "../../../schema/const"
+import {getMissingChapterData} from "../tools"
+import {
+    htmlBookChapterTemplate,
+    htmlBookExportTemplate,
+    htmlBookIndexBodyTemplate,
+    htmlBookIndexTemplate,
+    singleFileHTMLBookCSSTemplate,
+    singleFileHTMLBookChapterTemplate,
+    singleFileHTMLBookTemplate
+} from "./templates"
+import {orderLinks} from "./tools"
+
+export class HTMLBookExporter {
+    constructor(
+        schema,
+        csl,
+        bookStyles,
+        book,
+        user,
+        docList,
+        updated,
+        multiDoc = true,
+        {relativeUrls = true}
+    ) {
+        this.schema = schema
+        this.csl = csl
+        this.bookStyles = bookStyles
+        this.book = book
+        this.user = user
+        this.docList = docList
+        this.updated = updated
+        this.multiDoc = multiDoc
+        this.relativeUrls = relativeUrls
+        this.chapters = []
+        this.includeZips = []
+        this.textFiles = []
+        this.httpFiles = []
+        this.math = false
+        this.bibCSS = ""
+        this.chapterTemplate = multiDoc
+            ? htmlBookExportTemplate
+            : singleFileHTMLBookChapterTemplate
+        this.indexTemplate = multiDoc
+            ? htmlBookIndexTemplate
+            : htmlBookIndexBodyTemplate
+        this.singleFileHTMLBookTemplate = singleFileHTMLBookTemplate
+        this.singleFileHTMLBookCSSTemplate = singleFileHTMLBookCSSTemplate
+        this.styleSheets = [{url: staticUrl("css/book.css")}]
+    }
+
+    async init() {
+        if (this.book.chapters.length === 0) {
+            addAlert(
+                "error",
+                gettext("Book cannot be exported due to lack of chapters.")
+            )
+            return false
+        }
+
+        await getMissingChapterData(this.book, this.docList, this.schema)
+
+        this.addBookStyle()
+
+        await Promise.all(
+            this.styleSheets.map(async sheet => await this.loadStyle(sheet))
+        )
+
+        await this.exportChapters()
+
+        return true
+    }
+
+    async loadStyle(sheet) {
+        if (sheet.url) {
+            const response = await get(sheet.url)
+            const text = await response.text()
+            sheet.contents = text
+            sheet.filename = `css/${sheet.url.split("/").pop().split("?")[0]}`
+            delete sheet.url
+        }
+        if (sheet.filename) {
+            this.textFiles.push(sheet)
+        }
+        return Promise.resolve(sheet)
+    }
+
+    async exportChapters() {
+        let footnoteCounter = 0,
+            affiliationCounter = 0,
+            figureCounter = 0,
+            equationCounter = 0,
+            photoCounter = 0,
+            tableCounter = 0
+
+        for (const chapterInfo of this.book.chapters.sort(
+            (a, b) => a.number - b.number
+        )) {
+            const chapterNumber = chapterInfo.number
+            const chapterPart = chapterInfo.part
+            const doc = this.docList.find(doc => doc.id === chapterInfo.text)
+
+            if (!doc) {
+                continue
+            }
+
+            const imageDB = {db: doc.images}
+            const bibDB = {db: doc.bibliography}
+            const styleSheets = this.styleSheets.slice()
+
+            const options = {
+                xhtml: false,
+                epub: false,
+                relativeUrls: this.relativeUrls,
+                footnoteNumbering: "decimal",
+                affiliationNumbering: "alpha",
+                idPrefix: `c-${chapterNumber}-`,
+                footnoteOffset: footnoteCounter,
+                affiliationOffset: affiliationCounter,
+                figureOffset: {
+                    figure: figureCounter,
+                    equation: equationCounter,
+                    photo: photoCounter,
+                    table: tableCounter
+                }
+            }
+
+            const documentHTMLExporter = new HTMLExporter(
+                doc,
+                bibDB,
+                imageDB,
+                this.csl,
+                this.updated,
+                [],
+                options,
+                htmlBookChapterTemplate
+            )
+
+            await documentHTMLExporter.process()
+            const {metaData, converter, textFiles, httpFiles, includeZips} =
+                documentHTMLExporter.getProcessedFiles()
+
+            const contents = textFiles.find(
+                textFile => textFile.filename === "document.html"
+            )?.contents
+            if (!contents) {
+                continue
+            }
+            this.includeZips = this.includeZips.concat(includeZips)
+            this.httpFiles = this.httpFiles.concat(httpFiles)
+
+            // Update counters
+            footnoteCounter = converter.fnCounter
+            affiliationCounter = converter.affCounter
+            figureCounter = converter.categoryCounter.figure || figureCounter
+            equationCounter =
+                converter.categoryCounter.equation || equationCounter
+            photoCounter = converter.categoryCounter.photo || photoCounter
+            tableCounter = converter.categoryCounter.table || tableCounter
+
+            if (converter.features.math) {
+                this.math = true
+                styleSheets.push({filename: "css/mathlive.css"})
+            }
+
+            // Collect stylesheets
+            if (converter.citations.bibCSS) {
+                if (!this.bibCSS) {
+                    this.bibCSS = pretty(converter.citations.bibCSS, {
+                        ocd: true
+                    })
+                }
+                styleSheets.push({filename: "css/bibliography.css"})
+            }
+
+            const chapterHTML = this.chapterTemplate({
+                part: chapterInfo.part,
+                currentPart: chapterPart,
+                contents,
+                title: doc.title,
+                settings: doc.settings,
+                styleSheets
+            })
+
+            this.textFiles.push({
+                filename: `document-${chapterNumber}.html`,
+                contents: pretty(chapterHTML, {ocd: true})
+            })
+
+            // Store chapter info for TOC
+            this.chapters.push({
+                number: chapterNumber,
+                part: chapterPart,
+                doc,
+                metaData,
+                toc: converter.metaData.toc
+            })
+        }
+
+        await this.exportBook()
+    }
+
+    async exportBook() {
+        // Add math stylesheets if needed
+        if (this.math) {
+            this.includeZips.push({
+                directory: "css",
+                url: staticUrl("zip/mathlive_style.zip")
+            })
+        }
+
+        if (this.bibCSS) {
+            this.textFiles.push({
+                filename: "css/bibliography.css",
+                contents: this.bibCSS
+            })
+        }
+
+        let contentItems = []
+        for (const chapter of this.chapters) {
+            const chapterNumber = chapter.number
+            const chapterPart = chapter.part
+
+            // Prepare contentItems for TOC
+            if (chapterPart && chapterPart !== "") {
+                contentItems.push({
+                    link: this.multiDoc
+                        ? this.getChapterLink(chapterNumber)
+                        : `#c-${chapterNumber}-body`,
+                    title: chapterPart,
+                    docNum: chapterNumber,
+                    id: 0,
+                    level: -1,
+                    subItems: []
+                })
+            }
+
+            const contentItemsFromChapter = chapter.toc.map(item => {
+                return {
+                    link: `${this.multiDoc ? this.getChapterLink(chapter.number) : ""}#c-${chapter.number}-${item.id}`,
+                    title: item.title,
+                    docNum: chapterNumber,
+                    id: item.id,
+                    level: item.level,
+                    subItems: []
+                }
+            })
+
+            contentItems = contentItems.concat(contentItemsFromChapter)
+        }
+
+        contentItems = orderLinks(contentItems)
+
+        // Generate the index.html
+        this.textFiles.push({
+            filename: "index.html",
+            contents: pretty(
+                this.indexTemplate({
+                    contentItems,
+                    book: this.book,
+                    creator: this.user.name,
+                    styleSheets: this.styleSheets, // Include book stylesheets
+                    language: LANGUAGES.find(
+                        lang => lang[0] === this.book.settings.language
+                    )[1],
+                    multiDoc: this.multiDoc
+                }),
+                {ocd: true}
+            )
+        })
+        if (!this.multiDoc) {
+            this.joinChapters()
+        }
+        await this.createZip()
+    }
+
+    joinChapters() {
+        // Used for single file export
+        const styleSheets = this.styleSheets.slice()
+        if (this.bibCSS) {
+            styleSheets.push(
+                this.relativeUrls
+                    ? {filename: "css/bibliography.css"}
+                    : {contents: this.bibCSS}
+            )
+        }
+        if (this.math) {
+            styleSheets.push(
+                this.relativeUrls
+                    ? {filename: "css/mathlive.css"}
+                    : {filename: staticUrl("css/mathlive.css")} // this.loadStyle() has been executed already.
+            )
+        }
+        let html = ""
+        this.textFiles = this.textFiles
+            .sort((a, b) => {
+                if (a.filename === "index.html") {
+                    return -1
+                }
+                if (b.filename === "index.html") {
+                    return 1
+                }
+                if (
+                    Number.parseInt(a.filename.match(/\d+/g)) <
+                    Number.parseInt(b.filename.match(/\d+/g))
+                ) {
+                    return -1
+                }
+                if (
+                    Number.parseInt(a.filename.match(/\d+/g)) >
+                    Number.parseInt(b.filename.match(/\d+/g))
+                ) {
+                    return 1
+                }
+                return 0
+            })
+            .filter(({filename, contents}) => {
+                if (filename.slice(-5) !== ".html") {
+                    return true
+                }
+                html += contents
+                return false
+            })
+        const css = this.singleFileHTMLBookCSSTemplate({
+                papersize: this.book.settings.papersize
+            }),
+            title = this.book.title,
+            settings = this.book.settings,
+            htmlDoc = this.singleFileHTMLBookTemplate({
+                css,
+                html,
+                title,
+                styleSheets,
+                settings
+            })
+
+        this.textFiles.push({
+            filename: "index.html",
+            contents: pretty(htmlDoc, {ocd: true})
+        })
+    }
+
+    addBookStyle() {
+        const bookStyle = this.bookStyles.find(
+            bookStyle => bookStyle.slug === this.book.settings.book_style
+        )
+        if (!bookStyle) {
+            return false
+        }
+        let contents = bookStyle.contents
+        bookStyle.bookstylefile_set.forEach(
+            ([_url, filename]) =>
+                (contents = contents.replace(
+                    new RegExp(filename, "g"),
+                    `media/${filename}`
+                ))
+        )
+
+        this.styleSheets.push({contents, filename: `css/${bookStyle.slug}.css`})
+        this.httpFiles = this.httpFiles.concat(
+            bookStyle.bookstylefile_set.map(([url, filename]) => ({
+                filename: `css/media/${filename}`,
+                url
+            }))
+        )
+    }
+
+    async createZip() {
+        const zipper = new ZipFileCreator(
+            this.textFiles.concat(this.styleSheets),
+            this.httpFiles,
+            this.includeZips,
+            "application/zip",
+            this.updated
+        )
+        const blob = await zipper.init()
+        return this.download(blob)
+    }
+
+    download(blob) {
+        return download(
+            blob,
+            `${createSlug(this.book.title)}.html.zip`,
+            "application/zip"
+        )
+    }
+
+    getChapterLink(chapterNumber) {
+        return `document-${chapterNumber}.html`
+    }
+}
diff --git a/fiduswriter/book/static/js/modules/books/exporter/html/multifile.js b/fiduswriter/book/static/js/modules/books/exporter/html/multifile.js
deleted file mode 100644
index 73da04e..0000000
--- a/fiduswriter/book/static/js/modules/books/exporter/html/multifile.js
+++ /dev/null
@@ -1,371 +0,0 @@
-import download from "downloadjs"
-import pretty from "pretty"
-import {DOMSerializer} from "prosemirror-model"
-
-import {RenderCitations} from "../../../citations/render"
-import {addAlert} from "../../../common"
-import {removeHidden} from "../../../exporter/tools/doc_content"
-import {createSlug} from "../../../exporter/tools/file"
-import {ZipFileCreator} from "../../../exporter/tools/zip"
-import {LANGUAGES} from "../../../schema/const"
-import {BIBLIOGRAPHY_HEADERS, CATS} from "../../../schema/i18n"
-import {DOMExporter} from "../dom_export"
-import {orderLinks, setLinks} from "../epub/tools"
-import {getMissingChapterData, uniqueObjects} from "../tools"
-import {htmlBookExportTemplate, htmlBookIndexTemplate} from "./templates"
-import {modifyImages} from "./tools"
-
-export class HTMLBookExporter extends DOMExporter {
-    constructor(schema, csl, bookStyles, book, user, docList, updated) {
-        super(schema, csl, bookStyles)
-        this.book = book
-        this.user = user
-        this.docList = docList
-        this.updated = updated
-
-        this.multiDoc = true
-        this.chapters = []
-        this.includeZips = []
-        this.outputList = []
-        this.math = false
-        this.chapterTemplate = htmlBookExportTemplate
-        this.indexTemplate = htmlBookIndexTemplate
-        this.styleSheets = [{url: staticUrl("css/book.css")}]
-    }
-
-    init() {
-        if (this.book.chapters.length === 0) {
-            addAlert(
-                "error",
-                gettext("Book cannot be exported due to lack of chapters.")
-            )
-            return false
-        }
-
-        return getMissingChapterData(this.book, this.docList, this.schema).then(
-            () => this.exportOne()
-        )
-    }
-
-    addBookStyle() {
-        const bookStyle = this.documentStyles.find(
-            bookStyle => bookStyle.slug === this.book.settings.book_style
-        )
-        if (!bookStyle) {
-            return false
-        }
-        // The files will be in the base directory. The filenames of
-        // BookStyleFiles will therefore not need to replaced with their URLs.
-        let contents = bookStyle.contents
-        bookStyle.bookstylefile_set.forEach(
-            ([_url, filename]) =>
-                (contents = contents.replace(
-                    new RegExp(filename, "g"),
-                    `media/${filename}`
-                ))
-        )
-
-        this.styleSheets.push({contents, filename: `css/${bookStyle.slug}.css`})
-        this.fontFiles = this.fontFiles.concat(
-            bookStyle.bookstylefile_set.map(([url, filename]) => ({
-                filename: `css/media/${filename}`,
-                url
-            }))
-        )
-        return `css/${bookStyle.slug}.css`
-    }
-
-    getBookFootnoteAnchor(chapterCounter, bookCounter) {
-        const footnoteAnchor = document.createElement("a")
-        footnoteAnchor.setAttribute("href", "#fn" + bookCounter)
-        // RASH 0.5 doesn't mark the footnote anchors, so we add this class
-        footnoteAnchor.classList.add("fn")
-        footnoteAnchor.innerHTML = `<span class="footnote-counter" data-chapter-counter="${chapterCounter}" data-book-counter="${bookCounter}"></span>`
-        return footnoteAnchor
-    }
-
-    addFootnotes(
-        contentsEl,
-        offset // Offset for continous footnote counting throughout book.
-    ) {
-        // Replace the footnote markers with anchors and put footnotes with contents
-        // at the back of the document.
-        // Also, link the footnote anchor with the footnote according to
-        // https://rawgit.com/essepuntato/rash/master/documentation/index.html#footnotes.
-        const footnotes = contentsEl.querySelectorAll(".footnote-marker")
-        const footnotesContainer = document.createElement("section")
-        footnotesContainer.classList.add("fnlist")
-        footnotesContainer.setAttribute("role", "doc-footnotes")
-
-        footnotes.forEach((footnote, index) => {
-            const chapterCounter = index + 1
-            const bookCounter = offset + chapterCounter
-            const footnoteAnchor = this.getBookFootnoteAnchor(
-                chapterCounter,
-                bookCounter
-            )
-            footnote.parentNode.replaceChild(footnoteAnchor, footnote)
-            const newFootnote = document.createElement("section")
-            newFootnote.id = "fn" + bookCounter
-            newFootnote.setAttribute("role", "doc-footnote")
-            newFootnote.dataset.chapterCounter = chapterCounter
-            newFootnote.dataset.bookCounter = bookCounter
-            newFootnote.innerHTML = footnote.dataset.footnote
-            const newFootnoteCounter = document.createElement("span")
-            newFootnoteCounter.classList.add("footnote-counter")
-            newFootnoteCounter.dataset.chapterCounter = chapterCounter
-            newFootnoteCounter.dataset.bookCounter = bookCounter
-            if (
-                ["P", "H1", "H2", "H3", "H4", "H5", "H6"].includes(
-                    newFootnote.firstElementChild?.tagName
-                )
-            ) {
-                newFootnote.firstElementChild.prepend(newFootnoteCounter)
-            } else {
-                newFootnote.prepend(newFootnoteCounter)
-            }
-            footnotesContainer.appendChild(newFootnote)
-        })
-        contentsEl.appendChild(footnotesContainer)
-        return offset + footnotes.length
-    }
-
-    getChapterLink(chapterNumber) {
-        return `document-${chapterNumber}.html`
-    }
-
-    exportOne() {
-        let footnoteCounter = 0,
-            figureCounter = 0,
-            equationCounter = 0,
-            photoCounter = 0,
-            tableCounter = 0
-
-        this.chapters = this.book.chapters
-            .sort((a, b) => (a.number > b.number ? 1 : -1))
-            .map(chapter => {
-                let chapterFigureCounter = 0,
-                    chapterEquationCounter = 0,
-                    chapterPhotoCounter = 0,
-                    chapterTableCounter = 0
-                const doc = this.docList.find(doc => doc.id === chapter.text),
-                    schema = this.schema
-                schema.cached.imageDB = {db: doc.images}
-                const docContent = removeHidden(doc.content, false),
-                    serializer = DOMSerializer.fromSchema(schema),
-                    contents = serializer.serializeNode(
-                        schema.nodeFromJSON(docContent)
-                    ),
-                    equations = contents.querySelectorAll(".equation"),
-                    figureEquations =
-                        contents.querySelectorAll(".figure-equation")
-                footnoteCounter = this.addFootnotes(contents, footnoteCounter)
-                if (equations.length || figureEquations.length) {
-                    this.math = true
-                }
-                contents
-                    .querySelectorAll(
-                        "figure[data-category='figure'] figcaption span.label"
-                    )
-                    .forEach(el => {
-                        el.innerHTML = CATS["figure"][doc.settings.language]
-                        el.dataset.bookCounter = ++figureCounter
-                        el.dataset.chapterCounter = ++chapterFigureCounter
-                        el.classList.add("label-counter")
-                        el.classList.remove("label")
-                    })
-                contents
-                    .querySelectorAll(
-                        "figure[data-category='equation'] figcaption span.label"
-                    )
-                    .forEach(el => {
-                        el.innerHTML = CATS["equation"][doc.settings.language]
-                        el.dataset.bookCounter = ++equationCounter
-                        el.dataset.chapterCounter = ++chapterEquationCounter
-                        el.classList.add("label-counter")
-                        el.classList.remove("label")
-                    })
-                contents
-                    .querySelectorAll(
-                        "figure[data-category='photo'] figcaption span.label"
-                    )
-                    .forEach(el => {
-                        el.innerHTML = CATS["photo"][doc.settings.language]
-                        el.dataset.bookCounter = ++photoCounter
-                        el.dataset.chapterCounter = ++chapterPhotoCounter
-                        el.classList.add("label-counter")
-                        el.classList.remove("label")
-                    })
-                contents
-                    .querySelectorAll(
-                        "figure[data-category='table'] figcaption span.label,table[data-category='table'] caption span.label"
-                    )
-                    .forEach(el => {
-                        el.innerHTML = CATS["table"][doc.settings.language]
-                        el.dataset.bookCounter = ++tableCounter
-                        el.dataset.chapterCounter = ++chapterTableCounter
-                        el.classList.add("label-counter")
-                        el.classList.remove("label")
-                    })
-                contents.querySelectorAll(".cross-reference").forEach(el => {
-                    const rEl = contents.querySelector(
-                        `#${el.dataset.id} .label-counter`
-                    )
-                    if (!rEl) {
-                        return
-                    }
-                    el.innerHTML = `<a href="#${el.dataset.id}" class="reference-counter" data-chapter-counter="${rEl.dataset.chapterCounter}" data-book-counter="${rEl.dataset.bookCounter}">${rEl.innerHTML}</a>`
-                    delete el.dataset.title
-                })
-
-                return {
-                    doc,
-                    contents
-                }
-            })
-
-        const citRendererPromises = this.chapters.map(chapter => {
-            // add bibliographies (asynchronously)
-            const bibliographyHeader =
-                chapter.doc.settings.bibliography_header[
-                    chapter.doc.settings.language
-                ] || BIBLIOGRAPHY_HEADERS[chapter.doc.settings.language]
-            const citRenderer = new RenderCitations(
-                chapter.contents,
-                this.book.settings.citationstyle,
-                bibliographyHeader,
-                {db: chapter.doc.bibliography},
-                this.csl
-            )
-            return citRenderer.init().then(() => {
-                const bibHTML = citRenderer.fm.bibHTML
-                if (bibHTML.length > 0) {
-                    chapter.contents.innerHTML += bibHTML
-                }
-                this.content = chapter.contents
-                this.cleanHTML(citRenderer.fm)
-                chapter.contents = this.content
-                delete this.content
-                return Promise.resolve()
-            })
-        })
-        return Promise.all(citRendererPromises).then(() => this.exportTwo())
-    }
-
-    prepareBinaryFiles(contents) {
-        this.binaryFiles = this.binaryFiles.concat(modifyImages(contents))
-    }
-
-    exportTwo() {
-        const bookStyle = this.addBookStyle()
-        let contentItems = []
-        let currentPart = false
-        this.chapters.forEach((chapter, index) => {
-            const contents = chapter.contents,
-                doc = chapter.doc,
-                title = doc.title,
-                styleSheets = []
-            if (bookStyle) {
-                styleSheets.push({filename: bookStyle})
-            }
-            this.prepareBinaryFiles(contents)
-
-            if (this.book.chapters[index].part !== "") {
-                contentItems.push({
-                    link: this.getChapterLink(this.book.chapters[index].number),
-                    title: this.book.chapters[index].part,
-                    docNum: this.book.chapters[index].number,
-                    id: 0,
-                    level: -1,
-                    subItems: []
-                })
-                currentPart = this.book.chapters[index].part
-            }
-
-            // Make links to all H1-3 and create a TOC list of them
-            contentItems.push(
-                ...setLinks(contents, this.book.chapters[index].number)
-            )
-
-            const contentsCode = this.replaceImgSrc(contents.innerHTML)
-
-            const htmlCode = this.chapterTemplate({
-                part: this.book.chapters[index].part,
-                currentPart,
-                title,
-                metadata: doc.metadata,
-                settings: doc.settings,
-                styleSheets,
-                contents: contentsCode,
-                math: this.math
-            })
-
-            this.outputList.push({
-                filename: `document-${this.book.chapters[index].number}.html`,
-                contents: pretty(htmlCode, {ocd: true})
-            })
-        })
-
-        contentItems = orderLinks(contentItems)
-
-        this.outputList.push({
-            filename: "index.html",
-            contents: pretty(
-                this.indexTemplate({
-                    contentItems,
-                    book: this.book,
-                    creator: this.user.name,
-                    styleSheets: [{filename: bookStyle}],
-                    language: LANGUAGES.find(
-                        lang => lang[0] === this.book.settings.language
-                    )[1],
-                    multiDoc: this.multiDoc
-                }),
-                {ocd: true}
-            )
-        })
-
-        return this.exportThree()
-    }
-
-    exportThree() {
-        this.binaryFiles = uniqueObjects(
-            this.binaryFiles.concat(this.fontFiles)
-        )
-        this.styleSheets = uniqueObjects(this.styleSheets)
-        if (this.math) {
-            this.includeZips.push({
-                directory: "css",
-                url: staticUrl("zip/mathlive_style.zip")
-            })
-        }
-
-        return this.loadStyles().then(() => {
-            this.styleSheets.forEach(styleSheet => {
-                if (styleSheet.filename) {
-                    this.outputList.push(styleSheet)
-                }
-            })
-            return this.createZip()
-        })
-    }
-
-    createZip() {
-        const zipper = new ZipFileCreator(
-            this.outputList,
-            this.binaryFiles,
-            this.includeZips,
-            undefined,
-            this.updated
-        )
-        return zipper.init().then(blob => this.download(blob))
-    }
-
-    download(blob) {
-        return download(
-            blob,
-            createSlug(this.book.title) + ".html.zip",
-            "application/zip"
-        )
-    }
-}
diff --git a/fiduswriter/book/static/js/modules/books/exporter/html/singlefile.js b/fiduswriter/book/static/js/modules/books/exporter/html/singlefile.js
deleted file mode 100644
index f195c59..0000000
--- a/fiduswriter/book/static/js/modules/books/exporter/html/singlefile.js
+++ /dev/null
@@ -1,165 +0,0 @@
-import pretty from "pretty"
-
-import {HTMLBookExporter} from "./multifile"
-import {
-    htmlBookIndexBodyTemplate,
-    singleFileHTMLBookChapterTemplate,
-    singleFileHTMLBookTemplate
-} from "./templates"
-
-const CSS_PAPER_SIZES = {
-    folio: "12in 15in",
-    quarto: "9.5in 12in",
-    octavo: "6in 9in",
-    a5: "A5",
-    a4: "A4"
-}
-
-export class SingleFileHTMLBookExporter extends HTMLBookExporter {
-    constructor(schema, csl, documentStyles, book, user, docList) {
-        super(schema, csl, documentStyles, book, user, docList)
-        this.chapterTemplate = singleFileHTMLBookChapterTemplate
-        this.indexTemplate = htmlBookIndexBodyTemplate
-        this.multiDoc = false
-    }
-
-    getChapterLink(chapterNumber) {
-        return `#_${chapterNumber}_0`
-    }
-
-    exportThree() {
-        let html = ""
-        this.outputList = this.outputList
-            .sort((a, b) => {
-                if (a.filename === "index.html") {
-                    return -1
-                }
-                if (b.filename === "index.html") {
-                    return 1
-                }
-                if (
-                    Number.parseInt(a.filename.match(/\d+/g)) <
-                    Number.parseInt(b.filename.match(/\d+/g))
-                ) {
-                    return -1
-                }
-                if (
-                    Number.parseInt(a.filename.match(/\d+/g)) >
-                    Number.parseInt(b.filename.match(/\d+/g))
-                ) {
-                    return 1
-                }
-                return 0
-            })
-            .filter(({filename, contents}) => {
-                if (filename.slice(-5) !== ".html") {
-                    return true
-                }
-                html += contents
-                return false
-            })
-        const css = this.getBookCSS(),
-            title = this.book.title,
-            settings = this.book.settings,
-            htmlDoc = singleFileHTMLBookTemplate({
-                css,
-                html,
-                title,
-                styleSheets: this.styleSheets,
-                settings
-            })
-
-        this.outputList.push({
-            filename: "index.html",
-            contents: pretty(htmlDoc, {ocd: true})
-        })
-
-        return super.exportThree()
-    }
-
-    getBookCSS() {
-        const css = `a.fn {
-            -adapt-template: url(data:application/xml,${encodeURI(
-                '<html xmlns="http://www.w3.org/1999/xhtml" xmlns:s="http://www.pyroxy.com/ns/shadow"><head><style>.footnote-content{float:footnote}</style></head><body><s:template id="footnote"><s:content/><s:include class="footnote-content"/></s:template></body></html>#footnote'
-            )});
-            text-decoration: none;
-            color: inherit;
-            vertical-align: baseline;
-            font-size: 70%;
-            position: relative;
-            top: -0.3em;
-
-        }
-        body {
-            background-color: white;
-        }
-        section[role=doc-footnote] .footnote-counter:after {
-            content: ". ";
-        }
-        section.fnlist {
-            display: none;
-        }
-        section:footnote-content {
-            display: block;
-            font-style:normal;
-            font-weight:normal;
-            text-decoration:none;
-        }
-        .table-of-contents a {
-            display: inline-flex;
-            width: 100%;
-            text-decoration: none;
-            color: currentColor;
-            break-inside: avoid;
-            align-items: baseline;
-        }
-        .table-of-contents a::before {
-            margin-left: 1px;
-            margin-right: 1px;
-            border-bottom: solid 1px lightgray;
-            content: "";
-            order: 1;
-            flex: auto;
-        }
-        .table-of-contents a::after {
-            text-align: right;
-            content: target-counter(attr(href, url), page);
-            align-self: flex-end;
-            flex: none;
-            order: 2;
-        }
-        @page {
-            size: ${CSS_PAPER_SIZES[this.book.settings.papersize]};
-            @top-center {
-                content: env(doc-title);
-            }
-            @bottom-center {
-                content: counter(page);
-            }
-        }
-        @page :first {
-	          @bottom-center { content: normal; }
-	          @top-center { content: normal; }
-        }
-        figure img {
-            max-width: 100%;
-        }
-        .article-title {
-            page-break-before: right;
-        }
-        h1.part {
-            page-break-before: right;
-        }
-        .copyrightpage {
-            page-break-before: left;
-        }
-        .tocpage {
-            page-break-before: right;
-        }
-        .booktitle {
-            text-align: center;
-        }`
-
-        return css
-    }
-}
diff --git a/fiduswriter/book/static/js/modules/books/exporter/html/templates.js b/fiduswriter/book/static/js/modules/books/exporter/html/templates.js
index 5f39fa6..be4e9de 100644
--- a/fiduswriter/book/static/js/modules/books/exporter/html/templates.js
+++ b/fiduswriter/book/static/js/modules/books/exporter/html/templates.js
@@ -1,5 +1,8 @@
 import {escapeText, localizeDate} from "../../../common"
 import {bookTerm} from "../../i18n"
+
+export const htmlBookChapterTemplate = ({body, back}) => `${body}${back}`
+
 /** A template for HTML export of a book. */
 export const htmlBookExportTemplate = ({
     styleSheets,
@@ -14,7 +17,6 @@ export const htmlBookExportTemplate = ({
     <head>
         <meta charset="UTF-8">
         <title>${title}</title>
-        <link type="text/css" rel="stylesheet" href="css/book.css" />
         ${styleSheets
             .map(
                 sheet =>
@@ -22,7 +24,7 @@ export const htmlBookExportTemplate = ({
             )
             .join("")}
     </head>
-    <body class="book-chapter${
+    <body class="user-contents book-chapter${
         currentPart && currentPart.length
             ? ` ${currentPart.toLowerCase().replace(/[^a-z]/g, "")}`
             : ""
@@ -148,7 +150,7 @@ export const htmlBookIndexTemplate = ({
             )
             .join("")}
     </head>
-    <body class="book-index">
+    <body class="user-contents book-index">
         ${htmlBookIndexBodyTemplate({
             book,
             contentItems,
@@ -174,7 +176,6 @@ export const singleFileHTMLBookTemplate = ({
     <head>
         <meta charset="UTF-8">
         <title>${title}</title>
-        <link type="text/css" rel="stylesheet" href="css/book.css" />
         <style>
             ${css}
         </style>
@@ -182,11 +183,107 @@ export const singleFileHTMLBookTemplate = ({
             .map(sheet =>
                 sheet.filename
                     ? `<link type="text/css" rel="stylesheet" href="${sheet.filename}" />`
-                    : ""
+                    : sheet.contents
+                      ? `<style>${sheet.contents}</style>`
+                      : ""
             )
             .join("")}
     </head>
-    <body class="user-contents">
-        ${html}
+    <body>
+        <div class="user-contents" id="flow">
+            ${html}
+        </div>
     </body>
 </html>`
+
+const CSS_PAPER_SIZES = {
+    folio: "12in 15in",
+    quarto: "9.5in 12in",
+    octavo: "6in 9in",
+    a5: "A5",
+    a4: "A4"
+}
+
+export const singleFileHTMLBookCSSTemplate = ({papersize}) =>
+    `a.fn {
+      -adapt-template: url(data:application/xml,${encodeURI(
+          '<html xmlns="http://www.w3.org/1999/xhtml" xmlns:s="http://www.pyroxy.com/ns/shadow"><head><style>.footnote-content{float:footnote}</style></head><body><s:template id="footnote"><s:content/><s:include class="footnote-content"/></s:template></body></html>#footnote'
+      )});
+      text-decoration: none;
+      color: inherit;
+      vertical-align: baseline;
+      font-size: 70%;
+      position: relative;
+      top: -0.3em;
+
+  }
+  body {
+      background-color: white;
+  }
+  section[role=doc-footnote] .footnote-counter:after {
+      content: ". ";
+  }
+  section.fnlist {
+      display: none;
+  }
+  section:footnote-content {
+      display: block;
+      font-style:normal;
+      font-weight:normal;
+      text-decoration:none;
+  }
+  .table-of-contents a {
+      display: inline-flex;
+      width: 100%;
+      text-decoration: none;
+      color: currentColor;
+      break-inside: avoid;
+      align-items: baseline;
+  }
+  .table-of-contents a::before {
+      margin-left: 1px;
+      margin-right: 1px;
+      border-bottom: solid 1px lightgray;
+      content: "";
+      order: 1;
+      flex: auto;
+  }
+  .table-of-contents a::after {
+      text-align: right;
+      content: target-counter(attr(href, url), page);
+      align-self: flex-end;
+      flex: none;
+      order: 2;
+  }
+  @page {
+      size: ${CSS_PAPER_SIZES[papersize]};
+      @top-center {
+          content: env(doc-title);
+      }
+      @bottom-center {
+          content: counter(page);
+      }
+  }
+  @page :first {
+	          @bottom-center { content: normal; }
+	          @top-center { content: normal; }
+  }
+  figure img {
+      max-width: 100%;
+  }
+  .doc-title {
+      page-break-before: right;
+      counter-reset: cat-figure cat-equation cat-photo cat-table;
+  }
+  h1.part {
+      page-break-before: right;
+  }
+  .copyrightpage {
+      page-break-before: left;
+  }
+  .tocpage {
+      page-break-before: right;
+  }
+  .booktitle {
+      text-align: center;
+  }`
diff --git a/fiduswriter/book/static/js/modules/books/exporter/html/tools.js b/fiduswriter/book/static/js/modules/books/exporter/html/tools.js
index c0c3a7d..87b8fde 100644
--- a/fiduswriter/book/static/js/modules/books/exporter/html/tools.js
+++ b/fiduswriter/book/static/js/modules/books/exporter/html/tools.js
@@ -1,30 +1,22 @@
-export const modifyImages = htmlEl => {
-    const imageLinks = htmlEl.querySelectorAll("img"),
-        images = []
-
-    imageLinks.forEach((el, index) => {
-        const src = el.getAttribute("src").split("?")[0]
-        let filename = `images/${src.split("/").pop()}`
-        // JPGs are output as PNG elements as well.
-        if (filename === "images/") {
-            // name was not retrievable so we give the image a unique numerical
-            // name like 1.png, 2.jpg, 3.svg, etc. .
-            filename = `images/${index}`
+export function orderLinks(contentItems) {
+    for (let i = 0; i < contentItems.length; i++) {
+        contentItems[i].subItems = []
+        if (i > 0) {
+            for (let j = i - 1; j > -1; j--) {
+                if (contentItems[j].level < contentItems[i].level) {
+                    contentItems[j].subItems.push(contentItems[i])
+                    contentItems[i].delete = true
+                    break
+                }
+            }
         }
+    }
 
-        const newImg = document.createElement("img")
-        // We set the src of the image as "data-src" for now so that the browser
-        // won't try to load the file immediately
-        newImg.setAttribute("data-src", filename)
-        el.parentNode.replaceChild(newImg, el)
-
-        if (!images.find(image => image.filename === filename)) {
-            images.push({
-                filename,
-                url: src
-            })
+    for (let i = contentItems.length; i > -1; i--) {
+        if (contentItems[i]?.delete) {
+            delete contentItems[i].delete
+            contentItems.splice(i, 1)
         }
-    })
-
-    return images
+    }
+    return contentItems
 }
diff --git a/fiduswriter/book/static/js/modules/books/exporter/print/index.js b/fiduswriter/book/static/js/modules/books/exporter/print/index.js
index e350016..91acb5c 100644
--- a/fiduswriter/book/static/js/modules/books/exporter/print/index.js
+++ b/fiduswriter/book/static/js/modules/books/exporter/print/index.js
@@ -1,61 +1,40 @@
 import {printHTML} from "@vivliostyle/print"
 
-import {HTMLBookExporter, htmlBookIndexBodyTemplate} from "../html"
-import {chapterTemplate, printHTMLTemplate} from "./templates"
-
-const CSS_PAPER_SIZES = {
-    folio: "12in 15in",
-    quarto: "9.5in 12in",
-    octavo: "6in 9in",
-    a5: "A5",
-    a4: "A4"
-}
+import {HTMLBookExporter} from "../html"
+import {chapterTemplate} from "./templates"
 
 export class PrintBookExporter extends HTMLBookExporter {
     constructor(schema, csl, documentStyles, book, user, docList) {
-        super(schema, csl, documentStyles, book, user, docList)
+        super(schema, csl, documentStyles, book, user, docList, false, false, {
+            relativeUrls: false
+        })
         this.chapterTemplate = chapterTemplate
-        this.indexTemplate = htmlBookIndexBodyTemplate
-        this.multiDoc = false
     }
 
-    // We can ignore preparing binary files in print
-    prepareBinaryFiles() {
-        return []
-    }
+    addBookStyle() {
+        const bookStyle = this.bookStyles.find(
+            bookStyle => bookStyle.slug === this.book.settings.book_style
+        )
+        if (!bookStyle) {
+            return false
+        }
+        let contents = bookStyle.contents
+        bookStyle.bookstylefile_set.forEach(
+            ([url, filename]) =>
+                (contents = contents.replace(
+                    new RegExp(filename, "g"),
+                    url // Use original URL
+                ))
+        )
 
-    exportThree() {
-        const html = this.outputList
-                .filter(({filename}) => filename.slice(-5) === ".html")
-                .sort((a, b) => {
-                    if (a.filename === "index.html") {
-                        return -1
-                    }
-                    if (b.filename === "index.html") {
-                        return 1
-                    }
-                    if (
-                        Number.parseInt(a.filename.match(/\d+/g)) <
-                        Number.parseInt(b.filename.match(/\d+/g))
-                    ) {
-                        return -1
-                    }
-                    if (
-                        Number.parseInt(a.filename.match(/\d+/g)) >
-                        Number.parseInt(b.filename.match(/\d+/g))
-                    ) {
-                        return 1
-                    }
-                    return 0
-                })
-                .map(({contents}) => contents)
-                .join(""),
-            css = this.getBookCSS(),
-            title = this.book.title,
-            settings = this.book.settings,
-            htmlDoc = printHTMLTemplate({css, html, title, settings})
+        this.styleSheets.push({contents})
+    }
 
-        const config = {title}
+    async createZip() {
+        const htmlDoc = this.textFiles.find(
+            file => file.filename === "index.html"
+        ).contents
+        const config = {title: this.book.title}
 
         if (navigator.userAgent.includes("Gecko/")) {
             // Firefox has issues printing images when in iframe. This workaround can be
@@ -79,103 +58,11 @@ export class PrintBookExporter extends HTMLBookExporter {
         printHTML(htmlDoc, config)
     }
 
-    getBookCSS() {
-        let css = `a.fn {
-            -adapt-template: url(data:application/xml,${encodeURI(
-                '<html xmlns="http://www.w3.org/1999/xhtml" xmlns:s="http://www.pyroxy.com/ns/shadow"><head><style>.footnote-content{float:footnote}</style></head><body><s:template id="footnote"><s:content/><s:include class="footnote-content"/></s:template></body></html>#footnote'
-            )});
-            text-decoration: none;
-            color: inherit;
-            vertical-align: baseline;
-            font-size: 70%;
-            position: relative;
-            top: -0.3em;
-
-        }
-        body {
-                background-color: white;
-        }
-        .article-title {
-            counter-reset: cat-figure cat-equation cat-photo cat-table;
-        }
-        section.fnlist {
-            display: none;
-        }
-        section:footnote-content {
-            display: block;
-            font-style:normal;
-            font-weight:normal;
-            text-decoration:none;
-        }
-        .table-of-contents a {
-            display: inline-flex;
-            width: 100%;
-            text-decoration: none;
-            color: currentColor;
-            break-inside: avoid;
-            align-items: baseline;
-        }
-        .table-of-contents a::before {
-            margin-left: 1px;
-            margin-right: 1px;
-            border-bottom: solid 1px lightgray;
-            content: "";
-            order: 1;
-            flex: auto;
+    async loadStyle(sheet) {
+        if (sheet.url) {
+            sheet.filename = sheet.url
+            delete sheet.url
         }
-        .table-of-contents a::after {
-            text-align: right;
-            content: target-counter(attr(href, url), page);
-            align-self: flex-end;
-            flex: none;
-            order: 2;
-        }
-        @page {
-            size: ${CSS_PAPER_SIZES[this.book.settings.papersize]};
-            @top-center {
-                content: env(doc-title);
-            }
-            @bottom-center {
-                content: counter(page);
-            }
-        }
-        @page :first {
-	          @bottom-center { content: normal; }
-	          @top-center { content: normal; }
-        }
-        figure img {
-            max-width: 100%;
-        }
-        .article-title {
-            page-break-before: right;
-        }
-        h1.part {
-            page-break-before: right;
-        }
-        .copyrightpage {
-            page-break-before: left;
-        }
-        .tocpage {
-            page-break-before: right;
-        }
-        .booktitle {
-            text-align: center;
-        }`
-        const bookStyle = this.documentStyles.find(
-            style => style.slug === this.book.settings.book_style
-        )
-        if (bookStyle) {
-            let contents = bookStyle.contents
-            bookStyle.bookstylefile_set.forEach(
-                ([url, filename]) =>
-                    (contents = contents.replace(
-                        new RegExp(filename, "g"),
-                        url
-                    ))
-            )
-            css += contents
-        }
-
-        return css
+        return await Promise.resolve(sheet)
     }
 }
diff --git a/fiduswriter/book/static/js/modules/books/exporter/print/templates.js b/fiduswriter/book/static/js/modules/books/exporter/print/templates.js
index 25f717c..e285b24 100644
--- a/fiduswriter/book/static/js/modules/books/exporter/print/templates.js
+++ b/fiduswriter/book/static/js/modules/books/exporter/print/templates.js
@@ -3,20 +3,3 @@ import {escapeText} from "../../../common"
 export const chapterTemplate = ({part, contents}) => `
     ${part && part.length ? `<h1 class="part">${escapeText(part)}</h1>` : ""}
     ${contents}`
-
-export const printHTMLTemplate = ({css, html, title, settings}) => `<!DOCTYPE html>
-<html lang="${settings.language.split("-")[0]}">
-    <head>
-        <meta charset="UTF-8">
-        <title>${title}</title>
-        <link type="text/css" rel="stylesheet" href="${staticUrl(
-            "css/book.css"
-        )}" />
-        <style>
-            ${css}
-        </style>
-    </head>
-    <body class="user-contents">
-        ${html}
-    </body>
-</html>`
diff --git a/fiduswriter/book/static/js/modules/books/menu.js b/fiduswriter/book/static/js/modules/books/menu.js
index b7aa72e..56d8444 100644
--- a/fiduswriter/book/static/js/modules/books/menu.js
+++ b/fiduswriter/book/static/js/modules/books/menu.js
@@ -3,7 +3,7 @@ import {BookAccessRightsDialog} from "./accessrights"
 import {BITSBookExporter} from "./exporter/bits"
 import {DOCXBookExporter} from "./exporter/docx"
 import {EpubBookExporter} from "./exporter/epub"
-import {HTMLBookExporter, SingleFileHTMLBookExporter} from "./exporter/html"
+import {HTMLBookExporter} from "./exporter/html"
 import {LatexBookExporter} from "./exporter/latex"
 import {ODTBookExporter} from "./exporter/odt"
 import {PrintBookExporter} from "./exporter/print"
@@ -113,14 +113,15 @@ const exportSingleHTML = (book, overview) => {
         "info",
         book.title + ": " + gettext("Unified HTML export has been initiated.")
     )
-    const exporter = new SingleFileHTMLBookExporter(
+    const exporter = new HTMLBookExporter(
         overview.schema,
         overview.app.csl,
         overview.styles,
         book,
         overview.user,
         overview.documentList,
-        new Date(book.updated * 1000)
+        new Date(book.updated * 1000),
+        false
     )
     return exporter.init()
 }