: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
--body-bg-color: rgba(212, 212, 215, 1);
--toolbar-bg-color: rgb(249 249 250);
--toolbar-icon-color: rgb(0 0 0);
--toolbar-text-color: rgb(0 0 0);
--toolbar-active-icon-bg-color: rgb(221 222 223);
--toolbar-item-hover-bg-color: rgb(221 222 223);
--toolbar-current-page-number-bg-color: #ddd;
--toolbar-page-number-bg-color: #ccc;
@media (prefers-color-scheme:dark) {
--body-bg-color: rgba(42, 42, 46, 1);
--toolbar-bg-color: #3c3c3c;
--toolbar-icon-color: #fff;
--toolbar-text-color: #fff;
--toolbar-active-icon-bg-color: #222;
--toolbar-item-hover-bg-color: #333;
--toolbar-current-page-number-bg-color: #222;
--toolbar-page-number-bg-color: #333;
--body-bg-color: rgba(212, 212, 215, 1);
--toolbar-bg-color: rgb(249 249 250);
--toolbar-icon-color: rgb(0 0 0);
--toolbar-active-icon-bg-color: rgb(221 222 223);
--toolbar-item-hover-bg-color: rgb(221 222 223);
--toolbar-text-color: rgb(0 0 0);
--toolbar-current-page-number-bg-color: #ddd;
--toolbar-page-number-bg-color: #ccc;
--body-bg-color: rgba(42, 42, 46, 1);
--toolbar-bg-color: #3c3c3c;
--toolbar-icon-color: #fff;
--toolbar-text-color: #fff;
--toolbar-active-icon-bg-color: #222;
--toolbar-item-hover-bg-color: #333;
--toolbar-current-page-number-bg-color: #222;
--toolbar-page-number-bg-color: #333;
background-color: var(--body-bg-color);
.flip-book .view .prev, .flip-book .view .next {
transform: translate(0, -50%);
.flip-book .view .fnav a {
.flip-book .view .fnav a:hover {
text-shadow: 0 0 7px #000;
.flip-book .view .fnav a:active {
.flip-book .view .fnav .hidden {
.flip-book .view .fnav .active {
.flip-book .view .fnav .disabled {
.flip-book .view .fnav .disabled:hover {
.flip-book .view .loading-progress {
transform: translate(-50%, -50%);
.flip-book .view .loading-progress.hidden {
.flip-book .loading-progress .progress {
box-shadow: 0px 0px 3px var(--body-bg-color);
.flip-book .loading-progress .progress::after {
background-size: contain;
background-image: url('../images/light-loader.gif');
.flip-book .page-loading {
transform: translate(-50%, -50%);
.flip-book .page-loading.hidden {
.flip-book .page-loading::after {
background-size: contain;
background-image: url('../images/light-loader.gif');
.flip-book .loading-progress .caption {
border: 1px solid var(--toolbar-item-hover-bg-color);
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
/* .flip-book .controls .fnavbar {
transition: opacity 2s ease-in-out 3s;
.flip-book .controls .fnavbar:hover {
transition: opacity 1s ease;
.flip-book .controls .ctrl {
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
/* background-image: linear-gradient(to bottom,#3c3c3c 0,#222 100%); */
background-repeat: repeat-x;
background-color: var(--toolbar-bg-color);
.ctrl .fnavbar .fnav li {
.ctrl .fnavbar .fnav .fnav-item {
display: flex !important;
.ctrl .fnavbar .fnav .hidden {
.ctrl .fnavbar .fnav .fnav-item>a {
.ctrl .fnavbar .fnav .fnav-item>a {
.ctrl .fnavbar .fnav>.active>a {
.ctrl .fnavbar .fnav .fnav-item>a:hover {
.ctrl .fnavbar .fnav .fnav-item>a:active {
text-shadow: 0 0 2px #fff;
.ctrl .fnavbar .fnav>.disabled>a {
.ctrl .fnavbar .fnav>.disabled>a:hover {
.ctrl .fnavbar .fnav>.active a {
background: var(--toolbar-active-icon-bg-color);
.ctrl .fnavbar .fnav .dropdown, .ctrl .fnavbar .fnav .dropup {
.ctrl .fnavbar .fnav .dropdown .menu {
box-shadow: 3px 0 3px var(--toolbar-bg-color);
.ctrl .fnavbar .fnav .icon-caret {
.ctrl .fnavbar .fnav .dropdown .caret {
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #ccc;
.ctrl .fnavbar .fnav .dropup .menu {
box-shadow: 3px 0 3px var(--toolbar-bg-color);
.ctrl .fnavbar .fnav .dropup .caret {
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 5px solid #ccc;
border: 1px solid var(--toolbar-item-hover-bg-color);
background-color: var(--toolbar-bg-color);
.ctrl .fnavbar .menu li {
.ctrl .fnavbar .menu .divider {
background-color: var(--toolbar-item-hover-bg-color);
.ctrl .fnavbar .menu .active {
background-color: var(--toolbar-active-icon-bg-color);
.ctrl .fnavbar .menu li:hover {
background-color: var(--toolbar-item-hover-bg-color);
.ctrl .fnavbar .menu li a {
color: var(--toolbar-text-color);
.ctrl .fnavbar .menu .disabled a {
.ctrl .fnavbar .menu .icon {
.ctrl .pages .number, .ctrl .pages .amount {
color: var(--toolbar-text-color);
background-color: var(--toolbar-page-number-bg-color);
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
background-color: var(--toolbar-current-page-number-bg-color);
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
border-radius: 5px 5px 0 0;
background-color: #1a1a1a;
box-shadow: 3px 0 3px var(--toolbar-toolbar-bg-color);
.flip-book .float-wnd.hidden {
.flip-book .float-wnd .header {
border-radius: 4px 4px 0 0;
background-color: var(--toolbar-item-hover-bg-color);
background-repeat: repeat-x;
border: 1px solid var(--toolbar-item-hover-bg-color);
.flip-book .float-wnd .header .close {
.flip-book .float-wnd .header .close svg {
.flip-book .float-wnd .header .close:hover {
.flip-book .float-wnd .header .close:active {
.flip-book .float-wnd .body {
border: 1px solid var(--toolbar-item-hover-bg-color);
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
background-color: var(--body-bg-color);
.ctrl .toc .toc-menu ul {
.ctrl .toc .toc-menu li {
.ctrl .toc .toc-menu a:hover {
.ctrl .toc .toc-menu a:active {
text-shadow: 0 0 2px #fff;
.ctrl .toc .toc-menu .active a {