/*
*  BackTypo Main Style
*  -----------------------------------------------------------------------------
*
*   Index:
* 
*     1. General
*     2. Header
*     4. Sidenav
*     5. Toolbar
*     6. Top nav
*     7. Main
*     8. Hero
*     9. Themes section
*    10. Prices page
*    11. Info box
*    12. Footer
*    13. Common
*    14. Buttons
*    15. Other UI elements
*    16. Toggle
*    17. Bundler dialog
*    18. Zendesk
*    19. Help link
*    20. Dialogs
*    21. Features tour
*    22. Errors and Warnings UI
*    23. Zenbox tab
*    24. QTip
*    25. User avatar
*    26. Warning bar
*    27. Data page
*    28. Print page
*    29. Floating actions
*    30. Search bar
*    31. Backtypo containers and heading
*    32. Backtypo tabs
*    33. Page disabler
*    34. Warning box
*    35. Flex container
*    36. Customized inputs
*    37. Backtypo wizard
*    38. Backtypo slide
*    39. Grid
*    40. Layout with sidebar
*    41. Downgrade page
*    42. Tier warns
*    43. Public pages
*    44. Media Query
*    45. Transitions
*    46. Context Menu
*    47. Panel Detection Settings
*    48. Unlabeled Images Widget
*
*     Useful comments
*
*     - @new (recent changes)
*     - Old graphic identity (commented properties of the old graphic identity)
*
*
*     New graphic identity
*
*     - Text color: #000
*     - Background color: #fff
*     - Font family: Roboto
*     - Accent color: #e8a724
*     - Error color: rgb(215,31,38)
*     - Success color: #3db64e
*
*  -----------------------------------------------------------------------------
*/

/*@import url("style.css");*/

@import url(https://fonts.googleapis.com/css?family=PT+Sans:400,700,400italic,700italic);
@import url(https://fonts.googleapis.com/css?family=Noto+Serif:400,700,400italic,700italic);
@import url('https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900,900i&display=swap&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese');

/* GENERAL */

* {
    -webkit-font-smoothing: antialiased;
    padding: 0;
    margin: 0;
    border: 0;
    outline: 0;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html,
body,
#page {
    height: 100%;
}

body {
    width: 100%;
    padding: 0;
    margin: 0;
    border: 0;
    background-color: #fff;
    color: #000;
    font-family: 'Roboto', sans-serif;
    /* 
    * Old graphic identity.
    *
    * color:rgb(78,78,78);
    * background-color:#E9E9E9;
    * font-family: 'PT Sans', sans-serif;
    */
}

#page {
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
}

/* Enable GPU acceleration on fontawesome spinners. */
.fa-spin,
.fa-spinner {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.close_dialog {
    font-size: 0.8em;
    margin: 0.6em;
    color: rgb(232, 167, 36);
    background-color: transparent;
    position: absolute;
    top: 0;
    right: 0;
}

html[lang="it"] *[lang="en"],
html[lang="en"] *[lang="it"] {
    display: none;
}

a:link,
a:visited,
a:hover,
a:active,
li {
    text-decoration: none;
    list-style: none;
}

a:link,
a:visited {
    color: #4E4E4E;
}

a:hover,
a:active {
    color: #636363;
}

::-moz-selection {
    background-color: rgba(232, 167, 36, 0.4);
}

::selection {
    background-color: rgba(232, 167, 36, 0.4);
}

#contents-list li.content input::-moz-selection,
#content-header input::-moz-selection,
.redactor_editor *::-moz-selection {
    background-color: rgba(232, 167, 36, 0.4) !important;
}

#contents-list li.content input::selection,
#content-header input::selection,
.redactor_editor *::selection {
    background-color: rgba(232, 167, 36, 0.4) !important;
}

#browser-warning {
    color: red;
    font-weight: bold;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
}

.modal-mask {
    background-color: rgba(0, 0, 0, 0.6);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10009;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: opacity 0.4s;
    transition: opacity 0.4s;
}

.cookie-banner {
    position: fixed;
    inset: 0px;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 100000;
    padding: 10px;
    overflow-y: auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    color: rgb(51, 51, 51);
    background-color: rgba(0, 0, 0, 0.6);
}

.cookie-banner.hidden {
    display: none;
}

.cookie-banner>div {
    max-width: 1170px;
    background-color: rgb(255, 255, 255);
    border-radius: 4px;
    padding: 20px 30px;
    margin-bottom: 10px;
    width: 100%;
    -webkit-box-shadow: rgba(177, 131, 39, 0.45) 0px 9px 30px -5px;
    box-shadow: rgba(177, 131, 39, 0.45) 0px 9px 30px -5px;
    position: relative;
}

.cookie-banner p {
    color: rgb(93, 100, 109);
    font-size: 16px;
    line-height: 1.5;
    font-weight: 300;
}

.cookie-banner ul {
    margin-bottom: 20px;
}

.cookie-banner button:not(.sl-close-btn) {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-height: 46px;
    border-radius: 3px;
    font-family: inherit;
    font-weight: 500;
    text-decoration: none;
    padding: 8px 15px;
    border: 0px #E8A724;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
    color: rgb(255, 255, 255);
    background-color: #E8A724;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-right: 18px;
    margin-left: 18px;
    margin-bottom: 18px;
    min-width: 120px;
    font-size: 14px;
}

.cookie-banner button:not(.sl-close-btn).sl-accept-btn {
    float: right;
    margin-right: 0px;
}

.cookie-banner button.decline {
    background-color: rgb(202, 53, 43);
}

.cookie-banner .switch {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.cookie-banner .switch-btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.cookie-banner label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.cookie-banner label .label {
    color: rgb(118, 118, 118);
    font-size: 16px;
    font-weight: 500;
}

.cookie-banner input[type="checkbox"].switch {
    opacity: 0;
    position: absolute;
    margin: 0px;
    z-index: -1;
    width: 0px;
    height: 0px;
    overflow: hidden;
    left: 0px;
    pointer-events: none;
}

.cookie-banner input[type="checkbox"]+div {
    vertical-align: middle;
    width: 46px;
    min-width: 46px;
    height: calc(23px);
    border-radius: 450px;
    border-width: 2px;
    border-style: solid;
    border-color: #E8A724;
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-property: background-color, -webkit-box-shadow;
    transition-property: background-color, box-shadow, -webkit-box-shadow;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
}

.cookie-banner input[type="checkbox"]:disabled+div {
    border-color: rgb(191, 191, 191);
}

.cookie-banner input[type="checkbox"]+div>div {
    float: left;
    width: calc(15px);
    height: calc(15px);
    border-radius: 50%;
    pointer-events: none;
    top: 2px;
    left: 2px;
    position: absolute;
    background-color: #E8A724;
    -webkit-transition-timing-function: cubic-bezier(1, 0, 0, 1);
    transition-timing-function: cubic-bezier(1, 0, 0, 1);
    -webkit-transition-duration: 0.4s;
    transition-duration: 0.4s;
    -webkit-transition-property: left, background-color;
    transition-property: left, background-color;
}

.cookie-banner input[type="checkbox"]:disabled+div>div {
    background-color: rgb(191, 191, 191);
}

.cookie-banner input[type="checkbox"].switch:checked+div {
    width: 46px;
    background-position: 0px 0px;
    background-color: #E8A724
}

.cookie-banner input[type="checkbox"].switch:disabled:checked+div {
    background-color: rgb(191, 191, 191);
}

.cookie-banner input[type="checkbox"].switch:checked+div>div {
    background-color: rgb(255, 255, 255);
    left: calc(26px);
}

section.cookie-banner h3 {
    color: #000;
    font-size: 22px;
}

.cookie-banner p,
#footer .cookie-banner p {
    padding: 0;
    margin-top: 20px;
    font-size: 16px;
}

#footer .cookie-banner ul {
    max-width: 100%;
}

.cookie-banner ul>li {
    margin-top: 15px;
}

.cookie-banner .label {
    margin-left: 10px;
    line-height: 1.1em;
}

#footer .cookie-banner a {
    color: #e7a823 !important;
}

.bt-mb-20 {
    margin-bottom: 20px;
}

.bt-autogenerate-icon svg {
    width: 25px;
    height: 20px;
}

.bt-autogenerate-icon {
    display: inline-block;
    vertical-align: middle;
}

.bt-autogenerate-icon svg path {
    fill: #e7a923;
}

.bt-autogenerate-icon .fa-spinner {
    color: #a1a1a1;
    background-color: #f0f0f0;
    margin-left: -26px;
    padding: 4px;
    border-radius: 50%;
    font-size: 20px;
}


/* /GENERAL - END */

/* HEADER */

#ebook-authoring-header {
    background-color: #fff;
    border-bottom: 1px solid #ccc;
    padding-left: 40px;
    padding-right: 40px;
    position: fixed;
    left: 0;
    right: 0;
    z-index: 1000;
    /* 
    * Old graphic identity.
    *
    * background-color:#E9E9E9;
    */
}

#ebook-authoring-header .header-content {
    height: 78px;
    padding: 8px 0;
}

#ebook-authoring-header .header-content>div:first-child {
    padding-right: 16px;
    min-width: 262px;
}

#ebook-authoring-header .header-content>div:last-child {
    padding-left: 16px;
}

#ebook-authoring-header .actions {
    text-align: left;
    width: auto;
    margin-right: 0;
    margin-top: 0;
}

#ebook-authoring-header .actions button {
    display: inline-block;
    margin: auto;
}

#ebook-authoring-header .actions .menu-label::first-letter {
    text-transform: uppercase;
}

#ebook-authoring-header .actions .text-button {
    background-color: transparent;
    color: #929292;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 12px;
    font-style: italic;
    border: none;
    letter-spacing: 0.1em;
    padding: 0 10px;
    line-height: 27px;
    min-width: 80px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border-radius: 0;
    -webkit-transition: none !important;
    transition: none !important;
    text-transform: none;
}

#ebook-authoring-header .actions .dark-button {
    background-color: #4e4e4e;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    font-style: normal;
    text-transform: uppercase;
    padding: 0 10px;
    min-width: 100px;
    height: 30px;
    border-radius: 10px;
}

#ebook-authoring-header .actions .dark-button:last-child {
    margin-left: 8px;
}

#ebook-authoring-header .actions .dark-button span {
    vertical-align: middle;
    line-height: 30px;
}

#ebook-authoring-header .actions .text-button:hover,
#navigation-bar .add:hover,
#open-map-btn:hover,
#customize-btn:hover {
    color: #e8a724;
    opacity: 1 !important;
}

#ebook-authoring-header .actions button:active {
    color: #aaa;
}

#ebook-authoring-header .actions .dark-button.disabled,
#ebook-authoring-header .actions .dark-button.disabled:hover {
    background-color: #7d7d7d !important;
    color: #cfcfcf !important;
}

#ebook-authoring-header .actions button.disabled {
    pointer-events: none;
}

#ebook-authoring-header .actions button.active {
    color: #e8a724;
}

#ebook-authoring-header .menu-label-note {
    display: block;
    line-height: 10px;
    font-size: 10px;
    color: #efad29;
    letter-spacing: 0.05em;
}

#ebook-authoring-header .menu-label-note.no-error {
    color: #4ec14e;
}

#ebook-authoring-header .report-saved.text-button {
    line-height: 11px;
}

#ebook-authoring-header .report-saved .menu-icon {
    line-height: 34px;
}

#ebook-authoring-header .report-saved .menu-label {
    margin-top: 7px;
    display: block;
}

#ebook-authoring-header .actions .report-saved.text-button .menu-label::first-letter {
    text-transform: lowercase !important;
}

@media only screen and (min-width: 1101px) and (max-width: 1400px) {

    #ebook-authoring-header .actions .text-button {
        width: 50px;
        min-width: 50px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        position: relative;
    }

    #ebook-authoring-header .actions .text-button .menu-label {
        background-color: #4e4e4e;
        padding: 5px;
        line-height: 1em;
        position: absolute;
        top: 35px;
        color: #fff;
        border-radius: 4px;
        font-style: normal;
        font-size: 11px;
        display: none;
    }

    #ebook-authoring-header .report-saved .menu-icon {
        line-height: 28px;
    }

    #ebook-authoring-header .menu-label-note {
        margin-bottom: -20px;
    }

    #ebook-authoring-header .actions .text-button:hover .menu-label {
        display: block;
    }

    #ebook-authoring-header .actions .text-button,
    #ebook-authoring-header .actions .text-button:hover .menu-label {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    #ebook-authoring-header .actions .text-button .menu-label::before {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        top: -6px;
        border-bottom: 6px solid #4e4e4e;
        z-index: 3;
    }

    #main-menu.public-page-menu li.header-link,
    #main-menu.public-page-menu .action_my_books {
        margin-right: 15px;
        padding-right: 0;
        white-space: normal;
        text-align: center;
        height: auto;
    }

    #main-menu.public-page-menu li.header-link a,
    #main-menu.public-page-menu .action_my_books a {
        line-height: 1.1em;
        font-size: 15px !important;
    }

    #main-menu.public-page-menu li.language-switcher .lang-selector {
        font-size: 13px;
    }

    .public-page img#logo {
        height: 37px;
    }

    .public-page #ebook-authoring-header {
        padding-left: 20px;
        padding-right: 20px;
    }

    .public-page #ebook-authoring-header .header-content>div:first-child {
        padding-right: 10px;
        min-width: 200px;
    }

    .public-page #ebook-authoring-header .header-content>div:last-child {
        padding-left: 10px;
    }

}

@media only screen and (min-width: 1101px) and (max-width: 1460px) {
    
    #main-menu.public-page-menu li.header-link a,
    #main-menu.public-page-menu .action_my_books a {
        line-height: 1.1em;
        font-size: 15px !important;
    }
}

@media only screen and (min-width: 1101px) and (max-width: 1200px) {

    #main-menu.public-page-menu li.header-link,
    #main-menu.public-page-menu .action_my_books {
        max-width: 125px;
    }

    [lang="de"] #main-menu.public-page-menu li {
        margin-right: 8px !important;
    }

    .public-page #ebook-authoring-header .header-content>div:first-child {
        min-width: 188px;
    }

    .public-page img#logo {
        height: 35px;
    }

    [lang="de"] #main-menu.public-page-menu li.header-link, 
    [lang="de"] #main-menu.public-page-menu .action_my_books {
        max-width: 104px;
    }

    [lang="de"] #main-menu.public-page-menu li.header-link a, 
    [lang="de"] #main-menu.public-page-menu .action_my_books a {
        font-size: 14px !important;
    }

    [lang="de"] #main-menu.public-page-menu li.language-switcher .lang-selector {
        font-size: 12px;
    }

    [lang="de"] #ebook-authoring-header .yellow-button {
        font-size: 13px !important;
    }

}

#ebook-authoring-header .yellow-button {
    min-width: 80px;
}

html[lang=de] div.actions.ebook-actions button {
    font-size: 0.53em;
}

#ebook_preview {
    padding: 0;
}

#preview_close {
    display: inline-block;
    width: auto;
    position: absolute;
    top: 3px;
    right: 1em;
    color: #fff;
    text-transform: uppercase;
    background-color: transparent;
    padding: 0.15em;
    padding-left: 0.50em;
    padding-right: 0.50em;
    padding-bottom: 0.12em;
    cursor: pointer;
}

.book-preview-loader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: transparent;
    z-index: 10000;
}

.book-preview-loader .fa-spin {
    color: #aaa;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -0.5em;
    margin-left: -0.5em;
}

.preview-nav-button {
    background-color: #fff;
    color: #999;
    line-height: 50px;
    vertical-align: middle;
    text-align: center;
    position: absolute;
    top: 50%;
    margin-top: -25px;
    width: 50px;
    height: 50px;
    border-radius: 25px;
    cursor: pointer;
}

.preview-nav-button.prev {
    margin-left: -1em;
}

.preview-nav-button.next {
    margin-left: 1em;
}

.preview-nav-button .fa,
.preview-nav-button .far {
    line-height: 50px;
    vertical-align: middle;
}

.preview-nav-button.prev .fa,
.preview-nav-button.prev .far {
    margin-left: -0.2em;
}

.preview-nav-button.next .fa,
.preview-nav-button.next .far {
    margin-left: 0.2em;
}

#ebook_publish {
    color: rgb(232, 167, 36);
    position: relative;
}

#ebook_publish>span {
    background-size: 10px;
    background-image: url('/images/narcissus_favicon.png');
    background-repeat: no-repeat;
    display: none;
    width: 16px;
    height: 16px;
    text-align: center;
    border: 1px solid rgb(232, 167, 36);
    border-radius: 50%;
    padding: 2px;
    background-position: center center;
    margin-right: 10px;
    margin-top: -1px;
}

.actions.ebook-actions button a {
    color: inherit;
    display: inline-block;
    padding-top: 0;
    padding-bottom: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
    width: 100%;
}

.actions .text-button .menu-icon,
.actions .text-button .fa.menu-icon,
.actions .text-button .far.menu-icon {
    font-size: 21px;
    margin-bottom: 10px;
    line-height: 30px;
    display: block;
    margin: 0 auto;
}

.actions .dark-button .menu-icon {
    font-size: 14px;
    line-height: 30px;
    margin-right: 10px;
}

.actions {
    left: 0;
    right: 0;
    clear: both;
    width: 100%;
    margin-top: 22px;
    margin-left: auto;
    margin-right: auto;
}

.actions .text-button.text-button-big,
.public-page #footer a.text-button.text-button-big {
    font-size: 1.5em;
    text-transform: none;
}

.actions .find-more-link {
    font-style: italic;
    display: block;
}

.actions .find-more-link:not(.lowercase)::first-letter {
    text-transform: uppercase !important;
}

.actions .find-more-link.text-button .fa {
    margin-right: 0;
    margin-left: 0.5em;
}

#user-panel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    height: 100%;
    white-space: nowrap;
}

#project-main-menu {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 78px;
    margin-top: -8px;
    padding: 4px 16px;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    position: relative;
}

#project-main-menu>div:first-child {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#project-main-menu,
#main-menu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#main-menu {
    margin: auto 0;
}

#project-main-menu li,
#main-menu li {
    position: relative;
    font-weight: bold;
    letter-spacing: 0.05em;
    display: inline-block;
    margin-left: 0.2em;
}

#project-main-menu li {
    font-size: 0.8em;
}

#main-menu li {
    font-size: 0.75em;
    text-transform: uppercase;
    /*height: 30px;*/
    vertical-align: top;
}

#main-menu li.header-link {
    padding-right: 15px;
}

.header-link .menu-icon {
    font-size: 13px;
    margin-right: 0.25em;
}

.only-icon .header-link .menu-icon {
    font-size: 16px;
}

#project-main-menu li span {
    line-height: 19px;
    vertical-align: middle;
    text-transform: lowercase;
}

#project-main-menu li::before,
#main-menu li::before {
    content: '|';
    margin-right: 0.2em;
    color: #b2b2b2;
    vertical-align: top;
}

.only-icon #project-main-menu li::before {
    display: none;
}

#project-main-menu li::before {
    line-height: 16px;
}

#main-menu li::before {
    line-height: 30px;
}

#project-main-menu li:first-child::before,
#main-menu li:first-child::before,
#main-menu li:last-child::before {
    display: none;
}

#main-menu li:last-child {
    margin-left: 0.5em;
}

#project-main-menu li a,
#main-menu li a {
    color: #929292;
    vertical-align: top;
    display: inline-block;
}

#main-menu li a {
    line-height: 30px;
}

#project-main-menu li a:hover,
#project-main-menu li a.active,
#main-menu li a:hover,
#main-menu li a.active {
    color: rgb(232, 167, 36);
}

#display-tour {
    cursor: pointer;
    font-size: 1.3em;
    vertical-align: middle;
    line-height: 30px;
}

#logout-button,
#save-book-data {
    background-color: #fff;
    color: rgb(78, 78, 78);
    font-size: 0.9em;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    border: 2px solid rgb(232, 167, 36);
    border-radius: 10px;
    padding: 2px;
    position: relative;
    top: -45px;
    width: 70px;
    height: 30px;
}

.logo-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

img#logo {
    height: 42px;
    cursor: pointer;
    position: relative;
    z-index: 1000;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.logo-container a {
    height: 42px;
}

/* Breadcrumb - HEADER */

#breadcrumb {
    background-color: #ddd;
    position: relative;
    top: 78px;
    padding: 10px 50px;
}

#breadcrumb li {
    color: #878787;
    font-size: 0.9em;
    font-weight: bold;
    letter-spacing: 0.05em;
    vertical-align: middle;
    display: inline-block;
    margin-right: 0.5em;
    opacity: 0.5;
}

#breadcrumb li:last-child {
    color: #4e4e4e;
}

/* /Breadcrumb - HEADER - END */

/* Storage - HEADER */

.bt-storage {
    position: relative;
}

.bt-storage-prog {
    margin-left: 8px;
    margin-right: 8px;
    height: 100%;
    position: relative;
    min-width: 52px; /* @new */
}

.bt-storage-prog .progressbar-text span {
    height: 1em;
    color: #b3b3b3;
    font-size: 12px;
    font-weight: bold;
    font-style: italic;
    text-align: center;
    line-height: 2.3em;
}

.bt-storage-prog .progressbar-text>span:nth-child(1):not(.big-value) {
    background-color: rgba(255, 255, 255, 1);
    padding-left: 6px;
    padding-right: 6px;
}

.bt-storage-prog .progressbar-text .big-value {
    font-size: 19px;
    padding-right: 0;
    font-weight: 400;
    line-height: 1.7em;
}

.bt-storage-prog .progressbar-text .big-value+span {
    font-size: 10px;
}

.bt-storage-prog .progressbar-text span:nth-child(3) {
    margin-left: 8px;
}

/*.bt-storage-prog .progressbar-text span:nth-child(2) {
width: 100%;
height: 1px;
background-color: #ccc;
display: block;
margin: 2px 0;
-webkit-transform: rotate(-25deg);
transform: rotate(-25deg);
}*/

.bt-storage-prog .progressbar-text span:nth-child(2) {
    font-size: 14px;
    font-weight: bold;
    padding-left: 0;
}

.bt-storage-details {
    background-color: #fff;
    color: #a2a2a2;
    font-size: 12px;
    font-style: italic;
    text-align: left;
    /*padding: 6px 8px;
    margin-left: 10px;
    margin-right: 10px;
    border: 2px solid #ccc;
    border-radius: 4px;*/
    min-height: 50px;
    position: relative;
    z-index: 2;
    -webkit-transition: opacity 0.25s ease-in-out;
    transition: opacity 0.25s ease-in-out;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.bt-storage-details.flex-container {
    display: none;
}

.bt-storage-row {
    margin-top: 4px;
}

.bt-storage-details .max-reached *:not(.tier-tag, a),
.bt-storage-details p.max-reached,
.bt-storage-details .no-credits {
    color: #ff0000 !important;
}

.bt-storage-details .last-credit {
    color: #ff6a00 !important;
}

.bt-credits-row .bt-credits-value,
.bt-credits-row .bt-credits-max {
    font-weight: bold;
    color: #808080;
}

.bt-storage-details.hidden,
.bt-storage.hidden-details .bt-storage-details {
    display: none;
    opacity: 0;
}

.bt-storage.hidden-details .bt-storage-details {
    -webkit-box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
    padding: 12px 8px;
    border-radius: 4px;
    border: 2px solid #ccc;
}

.bt-storage.hidden-details .bt-storage-prog {
    cursor: pointer;
}

.bt-storage-details.bt-storage-show,
.bt-storage-details.el-shown {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.bt-storage-details a,
#bt-user-submenu li a,
.bt-dropdown-menu li span {
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.bt-dropdown-menu li {
    cursor: pointer;
}

.bt-storage-details a:link,
.bt-storage-details a:visited,
#bt-user-submenu a:hover,
.bt-dropdown-menu li:hover span {
    color: #efac28;
    opacity: 1;
}

.bt-storage-details a:hover {
    text-decoration: underline;
}

/*.bt-storage-details.arrow-left::before,
.bt-storage-details::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
}

.bt-storage-details.arrow-left::before {
    top: 14px;
    left: -8px;
    border-right: 10px solid #fff;
    z-index: 3;
}

.bt-storage-details.arrow-left::after {
    top: 14px;
    left: -11px;
    border-right: 10px solid #ccc;
    z-index: 1;
}*/

.bt-storage-details>div {
    /*margin-bottom: 4px;*/
    text-align: left;
    width: 100%;
}

.bt-storage-row .bt-storage-value,
.bt-storage-row .bt-storage-max {
    color: #e8a724;
    font-weight: bold;
}

#bt-user-submenu,
.bt-dropdown-menu {
    position: absolute;
    right: -3px;
    top: 44px;
    width: 250px;
    background-color: #fff;
    border: 2px solid #ccc;
    border-radius: 4px;
    text-align: left;
    z-index: 10000000;
    display: none;
    opacity: 0;
    -webkit-transition: opacity 0.25s ease-in-out;
    transition: opacity 0.25s ease-in-out;
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
    pointer-events: none;
}

#bt-user-submenu ul {
    max-height: calc(100vh - 80px);
    overflow-y: auto;
}

#bt-user-submenu.user-submenu-show,
#bt-user-submenu.el-shown,
.bt-dropdown-menu.el-shown {
    display: block;
    pointer-events: auto;
}

#main-menu .user-avatar-btn,
.bt-dropdown-box {
    position: relative;
}

#new-project-box {
    display: inline-block;
}

#bt-user-submenu li,
.bt-dropdown-menu li {
    display: block;
    text-transform: none;
    padding: 4px 0;
    margin-left: 16px;
    margin-right: 16px;
    border-top: 2px solid #ccc;
    height: auto;
}

#bt-user-submenu li a,
.bt-dropdown-menu li {
    color: #4e4e4e;
    font-size: 14px !important;
    font-weight: bold;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    line-height: 30px;
}

#bt-user-submenu li a {
    width: 100%;
}

.bt-dropdown-menu li {
    width: 210px;
}

.bt-dropdown-menu li .fa,
.bt-dropdown-menu li .fas {
    color: #AFAFAF;
}

#bt-user-submenu li a::first-letter,
#bt-user-submenu li a span::first-letter,
.bt-dropdown-menu li span::first-letter {
    text-transform: uppercase;
}

#bt-user-submenu li:first-child,
.bt-dropdown-menu li:first-child {
    border-top: 0;
}

#bt-user-submenu li:last-child{
    padding: 4px 16px;
    margin-left: 0;
    margin-right: 0;
}

#bt-user-submenu li::before,
.bt-dropdown-menu li::before {
    display: none;
}

#bt-user-submenu::before,
#bt-user-submenu::after,
.bt-storage-details.arrow-top::before,
.bt-storage-details.arrow-top::after,
.bt-dropdown-menu::before,
.bt-dropdown-menu::after {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
}

#bt-user-submenu::before,
#bt-user-submenu::after,
.bt-dropdown-menu::before,
.bt-dropdown-menu::after {
    right: 5px;
}

.bt-storage-details::after,
.bt-dropdown-menu::after {
    pointer-events: none;
}

.bt-dropdown-menu::before,
.bt-dropdown-menu::after {
    right: 11px;
}

.bt-storage-details.arrow-top::before,
.bt-storage-details.arrow-top::after {
    right: 22px;
}

#bt-user-submenu::before,
.bt-storage-details.arrow-top::before,
.bt-dropdown-menu::before,
.bt-dropdown-menu::after {
    top: -9px;
    border-bottom: 10px solid #fff;
    z-index: 3;
}

#bt-user-submenu::after,
.bt-storage-details.arrow-top::after,
.bt-dropdown-menu::after {
    border-bottom: 10px solid #ccc;
    z-index: 2;
}

#bt-user-submenu::after,
.bt-dropdown-menu::after {
    top: -12px;
}

.bt-storage-details.arrow-top::after {
    top: -12px;
}

#bt-user-submenu li a::-moz-selection {
    background-color: transparent;
}

#bt-user-submenu li a::selection {
    background-color: transparent;
}

#bt-user-submenu .user-details {
    margin-left: 0;
    margin-right: 0;
    padding-left: 16px;
    padding-right: 16px;
}

.bt-storage-details.arrow-top {
    position: absolute;
    top: 67px;
    right: 0;
    min-width: 250px;
}

#bt-user-submenu .user-details div>span {
    display: block;
    color: #757575;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 10px;
}

#bt-user-submenu .user-details div {
    padding-top: 20px;
    padding-bottom: 10px;
}

/* /Storage - HEADER - END */

/* Only icon - HEADER */


.only-icon .menu-icon {
    margin-right: 0.5em;
}

.only-icon #ebook-authoring-header .actions button {
    min-width: 50px;
}

.only-icon #project-main-menu li {
    margin-left: 0;
}

.only-icon #project-main-menu li a {
    width: 35px;
    text-align: center;
    padding-bottom: 4px;
}

.only-icon #project-main-menu li a span {
    margin: 0;
}

/* /Only icon - HEADER - END */

.tier-tag {
    display: inline;
    color: #9c9c9c;
    font-size: 12px;
    font-weight: bold;
    line-height: 0.9;
    letter-spacing: 0.1em;
    font-family: 'Roboto', sans-serif;
    background-color: rgb(229, 229, 229);
    width: auto;
    margin: auto;
    min-width: 150px;
    border-radius: 2px;
    padding: 2px 6px;
}

.tier-tag.free-bg,
.tier-tag.premium-bg,
.tier-tag.unlimited-bg {
    color: #fff;
}

.tier-tag.free-bg {
    background-color: #e8a724;
}

.tier-tag.premium-bg {
    background-color: #001eff;
}

.tier-tag.unlimited-bg {
    background-color: #00d965;
}

/* /HEADER - END */

/* SIDENAV */

.side-nav-show .modal-mask {
    visibility: visible;
    opacity: 1;
}

.side-nav {
    background-color: #fff;
    position: fixed;
    bottom: 0;
    top: 0;
    left: -100%;
    width: calc(100% - 48px);
    max-width: 260px;
    overflow-x: hidden;
    z-index: 100010;
    border-right: 1px solid #f2f2f2;
    -webkit-transition: left 0.4s ease-in-out, opacity 0.4s ease-in-out;
    transition: left 0.4s ease-in-out, opacity 0.4s ease-in-out;
}

.side-nav-show .side-nav {
    left: 0;
}

.open-side-nav-btn {
    color: #000;
    position: fixed;
    left: 0;
    top: 16px;
    padding: 12px 10px;
    display: none;
    z-index: 1001;
}

.open-side-nav-btn button {
    background-color: transparent;
}

.open-side-nav-btn span {
    color: #000;
    font-size: 22px;
}

.side-nav .logo-container {
    height: 78px;
    padding: 8px 0 8px 40px;
    border-bottom: 1px solid #e9e9e9;
}

.side-nav .logo-container .logo {
    height: 38px;
}

.side-nav-section {
    border-bottom: 1px solid #e9e9e9;
    padding-top: 10px;
    padding-bottom: 10px;
}

.side-nav-section:first-child {
    padding-top: 0;
}

.side-nav-section.copyright-info {
    color: #939292;
    border-bottom: none;
}

.side-nav-section.copyright-info/*,
.side-nav-section:not(ul)*/,
.side-nav-section:has(.language-switcher) {
    padding: 20px 8px 20px 40px;
}

.side-nav-section .language-switcher {
    margin-top: 10px;
}

.side-nav-section.copyright-info p {
    color: #939292;
}

.side-nav-section.copyright-info p a {
    color: #4e4e4e;
}

.side-nav-section li>a {
    padding: 10px 8px 10px 40px;
    display: block;
}

.side-nav-section li a,
.public-page .side-nav-section li a {
    color: #000;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    position: relative;
    text-align: left !important;
}

.side-nav-section li a:hover {
    background-color: #e0e0e0;
}

.side-nav-section li a.active {
    background-color: #f0f0f0;
    color: rgb(232, 167, 36) !important;
}

.side-nav-section li .fa,
.side-nav-section li .far {
    position: absolute;
    left: 10px;
    font-size: 18px;
}

.side-nav-book-section {
    background-color: #f2f2f2;
}

.side-nav-book-section>div {
    padding: 10px 8px 10px 40px;
}

.side-nav-book-section .main-title {
    margin-bottom: 10px;
    line-height: 1.3em;
}

.side-nav-book-section li a.active {
    background-color: #e4e4e4;
}

.side-nav-book-sectio li a:hover {
    background-color: #e4e4e4;
}

.side-nav-book-section .main-title .book-title {
    font-size: 1.1em;
}

.side-nav-book-section .product-info,
.side-nav-book-section .product-info>div {
    display: block;
}

.side-nav-book-section .product-info>div::before {
    display: none;
}

/* /SIDENAV - END */

/* TOOLBAR */

.open-actions-btn {
    position: absolute;
    right: 20px;
    top: 0;
    height: 100%;
    z-index: 10000000;
    display: none;
}

.open-actions-btn button {
    background-color: #000;
    color: #fff;
    font-size: 24px;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto 0;
    /* 
    * Old graphic identity.
    *
    * background-color: #4e4e4e;
    */
}

.open-actions-btn button:hover,
div.actions.ebook-actions.ebook-actions-show+.open-actions-btn button {
    background-color: rgb(232, 167, 36);
    opacity: 1;
}

.bt-touch .open-actions-btn button:hover {
    background-color: auto;
}

.open-actions-btn button span {
    display: block;
    margin: auto;
    line-height: 35px;
    color: #fff;
    letter-spacing: normal;
}

/* /TOOLBAR - END */

/* TOP NAV */

.top-nav {
    background-color: #fff;
    position: fixed;
    left: 0;
    top: 76px;
    right: 0;
    height: 44px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    text-align: left;
    display: none;
}

.top-nav>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 42px;
    line-height: 42px;
    vertical-align: middle;
    border-right: 1px solid #ccc;
}

.top-nav>div:last-child {
    border-right: none;
}

.top-nav .prev-btn {
    width: 42px;
    text-align: center;
}

.top-nav .prev-btn a {
    display: block;
    width: 100%;
    height: 100%;
}

.top-nav .prev-btn a span {
    line-height: 42px;
    width: 100%;
    height: 100%;
    font-size: 24px;
}

.top-nav .nav-title {
    padding-left: 10px;
    padding-right: 10px;
    border-right: none;
}

.top-nav .nav-title,
.top-nav .tab {
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    color: #808080;
}

.top-nav .tab.current {
    background-color: #ccc;
}

.nav-tabs ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.nav-tabs li {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-left: 10px;
    padding-right: 10px;
    vertical-align: middle;
}

.nav-tabs li button {
    margin-top: auto;
    margin-bottom: auto;
}

.top-nav .button.small-button {
    min-width: 80px;
}

/* /TOP NAV - END */

/* MAIN */

#main {
    padding-top: 140px;
    min-height: 100%;
    height: auto !important;
    width: 100%;
    margin: 0 0 -76px 0 !important;
}

#nav-panel *::-moz-selection,
.nav-panel *::-moz-selection {
    background-color: transparent;
}

#nav-panel *::selection,
.nav-panel *::selection {
    background-color: transparent;
}

input::-moz-selection {
    background-color: #eee;
}

input::selection {
    background-color: #eee;
}

.fa-spin,
.fa-spinner {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

.product-date,
.product-import-status,
.product-weight,
.product-info .product-publish-status,
.grid-item-date,
.grid-item-weight {
    color: #a5a5a5;
    font-size: 13px;
    font-style: italic;
    font-weight: bold;
}

.product-date,
.product-weight,
.product-info .product-publish-status,
.grid-item-date,
.grid-item-weight {
    display: inline;
}

#project-main-menu .product-date,
#project-main-menu .product-weight,
#project-main-menu .product-info .product-publish-status {
    font-size: 12px;
    line-height: 1.2em;
    vertical-align: middle;
}

.product-weight::before,
.product-info .product-publish-status::before,
.grid-item-weight::before {
    content: '|';
    display: inline;
    color: #999;
    font-size: 1.2em;
    margin-left: 0.25em;
    margin-right: 0.5em;
}

#project-main-menu .product-weight::before {
    margin-left: 0.55em;
    margin-right: 0.5em;
}

.product-publish-status>div {
    display: inline;
}

.product-weight.low-weight,
.grid-item-weight.low-weight {
    color: #39b54a;
}

.product-weight.high-weight,
.grid-item-weight.high-weight {
    color: #ff7d1d;
}

.disabled-books-list .product-weight::before,
products-selection-list .product-weight::before {
    color: #d3d3d3;
}

/* /MAIN - END */

/* HERO */

.hero>div {
    min-height: 100px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.hero .hero-content {
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.hero .hero-content>div {
    max-width: 500px;
    text-align: left;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.hero.centered .hero-content {
    margin-left: auto;
    margin-right: auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.hero.centered .hero-content>div {
    text-align: center;
    max-width: 600px;
}

.hero h1 {
    font-family: 'Roboto', "PT Sans", sans-serif;
    font-size: 1.6em;
    font-weight: 300;
}

.radial-gradient-yellow-bg.hero h1 {
    font-weight: 500;
    font-size: 1.9em;
}

.radial-gradient-yellow-bg.hero + #themes-section {
    margin-top: 40px;
}

.hero .hero-content a {
    color: #efac28;
    font-family: 'Roboto', "PT Sans", sans-serif;
    font-size: 0.9em;
    font-style: italic;
    font-weight: 400;
}

.hero p {
    color: #999999;
    font-size: 18px;
    margin-top: 0.5em;
}

.themes-short-list .fa-check {
    display: none;
}

#highlight-section .multiple-images img:first-child {
    max-width: 200px;
}

#highlight-section .multiple-images {
    padding: 0 20px;
    text-align: center;
}

#highlight-section .wrapped-lg {
    padding-left: 40px;
    padding-right: 40px;
    max-width: 1440px;
    margin: auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#highlight-section .wrapped-lg>div {
    padding: 0 20px;
}

#highlight-section .multiple-images img:last-child {
    left: 30%;
    max-width: 300px;
    bottom: 15px;
}

#highlight-section {
    background-color: #faebd7;
    justify-content: space-around;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-bottom: 20px;
    margin-top: -42px;
}

#highlight-section .img-container {
    text-align: center;
    padding: 5px;
}

#highlight-section img {
    max-width: 220px;
    min-width: 180px;
}

#highlight-section h2 {
    margin-bottom: 15px;
    font-weight: 500;
    font-size: 22px;
}

#highlight-section h2 + .actions {
    margin-top: 0;
}

#highlight-section .button {
    margin-right: 10px;
    border: 2px solid #000 !important;
    background-color: transparent !important;
    color: #000 !important;
    line-height: 1.4em;
}

#highlight-section .button span {
    display: block;
}

/* THEMES SECTION */

#themes-section ul {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    height: 218px;
    overflow: hidden;
}

#themes-section .theme-container {
    background-color: #fff;
    width: 150px;
    position: relative;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    margin: 8px;
    overflow: hidden;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

#themes-section .theme-container:hover {
    border-color: #e8a724;
}

#themes-section .theme {
    height: 160px;
    width: 160px;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% -10px;
    margin: -5px;

}

#themes-section .theme-container .theme-footer {
    background-color: #fff;
    height: 50px;
    padding: 0 38px 0 18px;
}

#themes-section .theme-container .theme-name {
    font-size: 0.8em;
    font-weight: 300;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

#themes-section .theme-actions {
    position: absolute;
    right: 4px;
}

.theme-actions button:not(.preview-button),
.theme-actions .button.small-button:not(.preview-button),
#themes-section .edit-button {
    display: none;
}

#themes-section .theme-action {
    background-color: transparent;
    color: rgb(74, 74, 74);
    font-size: 22px;
    cursor: pointer;
    width: 36px;
    opacity: 0.5;
}

#themes-section .theme-action:hover {
    opacity: 1;
}

#themes-section .create-book-button {
    width: auto;
    min-width: auto !important;
    margin: 30px auto 0;
    opacity: 0;
    pointer-events: none;
}

#themes-section .theme-container:hover .create-book-button {
    opacity: 1;
    pointer-events: auto;
}

.theme-type-tag {
    color: #b3b3b3;
    font-size: 11px;
    font-weight: bold;
    background-color: rgba(242, 242, 242, 0.8);
    text-transform: uppercase;
    padding: 2px 6px;
    border-radius: 4px;
    position: absolute;
    left: 6px;
    top: 6px;
    z-index: 2;
    height: 23px;
    line-height: 19px;
}

/* /THEMES SECTION - END */

/* PRICES PAGE */

#prices-page {
    margin-bottom: 60px;
}

#prices-page .hero {
    margin-bottom: 20px;
}

.tiers-grid .flex-grid-3 {
    max-width: 1100px;
    margin-left: auto;
    margin-right: auto;
}

.tier-filters {
    text-align: center;
    position: relative;
    margin-top: 20px;
}

.tier-filters .segmented-selector {
    max-width: 250px;
    margin-bottom: 30px;
}

.public-page .tier-filters .segmented-selector {
    margin-bottom: 0;
}

.tier-filters .segmented-selector li {
    font-size: 15px;
}

.tier-filters .filter-details {
    position: absolute;
    top: 35px;
    left: 0;
    right: 0;
    opacity: 0;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    pointer-events: none;
}

.filter-details>span {
    opacity: 0;
}

.filter-details span {
    font-size: 14px;
    font-weight: bold;
    color: #999;
    font-style: italic;
    text-transform: none;
}

.filter-details .save-price {
    margin-left: 0.25em;
}

.tier-filters li:hover>.filter-details,
.tier-filters .selected>.filter-details {
    opacity: 1;
}

.tier>div,
.flex-grid.flex-grid-4>div.tier>div {
    background-color: #fff;
    padding: 40px 20px;
    border: 2px solid #fff;
    text-align: center;
    border-radius: 4px;
    position: relative;
    -webkit-box-shadow: 0 1px 2px rgba(181, 181, 181, 0.4);
    box-shadow: 0 1px 2px rgba(181, 181, 181, 0.4);
    height: 100%;
}

.tier.current-tier>div,
.flex-grid.flex-grid-4>.tier.current-tier>div {
    background-color: #F2F2F2;
    border-color: #B3B3B3;
}

.tier.recommended>div,
.flex-grid.flex-grid-4>.tier.recommended>div {
    border-color: #E8A724;
}

.tier.recommended>div::before {
    content: 'Recommended';
    text-transform: uppercase;
    background-color: #E8A724;
    color: #fff;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    position: absolute;
    top: -12px;
    left: -2px;
    right: -2px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    font-weight: bold;
    letter-spacing: 0.05em;
}

[lang="it"] .tier.recommended>div::before {
    content: 'Consigliato per te';
}

[lang="en"] .tier.recommended>div::before {
    content: 'Recommended for you';
}

.tier .tier-title {
    margin-bottom: 20px;
}

.tier h3 {
    font-size: 30px;
    font-weight: 400;
    color: #4D4D4D;
}

.tier h4 {
    font-size: 1em;
    font-weight: 400;
    font-style: italic;
    margin-bottom: 20px;
    margin-top: 10px;
}

.tier h4::first-letter {
    text-transform: uppercase;
}

.tier-price {
    color: #4D4D4D;
}

.tier .currency {
    font-size: 24px;
    font-weight: bold;
}

.tier-price .price:not(.not-discounted-price) {
    color: #E8A724;
    font-size: 60px;
    font-weight: normal;
}

.tier-price .price .small {
    font-size: 24px;
    font-weight: bold;
}

.tier-price .filter {
    color: #999;
    font-size: 16px;
    font-weight: bold;
    font-style: italic;
}

.tier-price .filter::before {
    content: '/';
    margin-right: 0.5em;
    font-style: normal;
}

.tier.with-user-price .tier-price .price {
    text-decoration: line-through;
}

.tier .tier-user-price {
    display: none;
    color: green;
}

.tier.with-user-price .tier-user-price {
    display: block;
}

.tier.with-user-price .tier-save-monthly {
    display: none;
}

.tier .tier-features {
    text-align: left;
}

.tier .tier-features li::before {
    content: "\f00c";
    color: #E8A724;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    line-height: 1;
    text-rendering: auto;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    position: absolute;
    top: 4px;
    left: 0;
}

.tier .tier-features ul {
    margin-bottom: 20px;
}

.tier .tier-features ul:last-child {
    margin-bottom: 0;
}

.tier .tier-features .tier-featured-features li::before {
    content: '';
}

.tier-features .feature-label {
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0.05em;
}

.tier .tier-actions {
    margin-top: 20px;
    margin-bottom: 20px;
    min-height: 64px;
}

.tier .tier-actions button {
    background-color: #E8A724 !important;
}

.current-tier-label {
    font-size: 1em;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 28px;
    text-transform: uppercase;
    height: 32px;
    border-radius: 2px;
    padding: 4px 8px;
    display: none;
}

.current-tier-label::first-letter {
    text-transform: uppercase;
}

.tier.current-tier .tier-actions button,
.tier.scheduled-tier .tier-actions button {
    display: none;
}

.tier.current-tier.activable-type .tier-actions button {
    display: initial;
}

.tier.current-tier.expired .tier-actions .use-tier {
    display: inline-block;
    background-color: red !important;
}

.tier .tier-actions button {
    margin-bottom: 32px;
}

.tier.current-tier .current-tier-label,
.tier.scheduled-tier .current-tier-label {
    display: block;
}

.tier-featured-features {
    color: #4e4e4e;
    font-size: 14px;
    text-align: center;
    margin-bottom: 40px;
}

.tier-features .highlight,
.tier-featured-features .highlight {
    color: #E8A724;
    font-weight: bold;
}

.tier-featured-features .storage,
.tier-featured-features .max-books,
.tier-featured-features .themes-amount,
.tier-featured-features .credits-amount,
.tier-featured-features .upload-limit {
    color: #4d4d4d;
    font-size: 21px;
    font-weight: 400;
}

.tier-featured-features .highlight .storage,
.tier-featured-features .highlight .max-books,
.tier-featured-features .highlight .themes-amount,
.tier-featured-features .highlight .credits-amount,
.tier-featured-features .highlight .upload-limit {
    color: #E8A724;
    font-weight: bold;
    text-decoration: underline;
}

.tier .tier-features ul li {
    font-size: 14px;
    position: relative;
    margin-bottom: 10px;
    padding-left: 25px;
}

.tier .tier-features ul li::first-letter {
    text-transform: uppercase;
}

.tier .tier-featured-features li,
.tier .tier-featured-features ul li {
    padding-left: 0;
}

.scheduled-tier-time,
.current-tier-expire-time {
    color: #fff;
    font-size: 15px;
    font-weight: 500;
    margin-top: 4px;
    padding: 2px 8px;
    border-radius: 2px;
    display: none;
}

.scheduled-tier-time {
    background-color: #e79037;
}

.current-tier-expire-time {
    background-color: #3db64e;
}

.scheduled-tier .scheduled-tier-time,
.current-tier.scheduled-type .scheduled-tier-time,
.expiring-tier .current-tier-expire-time {
    display: inline-block;
}

.tier-featured-features+div {
    border-top: 2px solid #ddd;
    padding-top: 20px;
}

.tier>div {
    border-radius: 10px;
    -webkit-box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
}

.tiers-preview .tier-price .price,
.tier h3 {
    color: #000;
}

.tiers-preview .tier>div {
    position: relative;
    padding-bottom: 20px;
}

.tiers-preview .tier>div::before {
    content: '';
    display: block;
    position: absolute;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    right: 10px;
    top: 10px;
}

.tiers-preview .tier.has-discounts:not(.has-plan-discount)>div::before {
    top: 47px;
}

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

    .tier.has-discounts {
        margin-top: 20px;
    }

}

.tiers-preview .tier[data-name="free"]>div::before {
    background-color: #e8a724;
}

.tiers-preview .tier[data-name="premium"]>div::before {
    background-color: #001eff;
}

.tiers-preview .tier[data-name="unlimited"]>div::before {
    background-color: #00d965;
}

.tier .price>span {
    font-size: 0.4em;
    font-weight: 400;
    margin-right: 0.25em;
}

[data-name="free"] .tier-save-monthly {
    visibility: hidden;
}

.credits-consuming-tip {
    color: #999;
    text-align: left;
}

.credits-consuming-tip span:nth-child(2)::first-letter {
    text-transform: uppercase;
}

.tier-footer,
.tiers-footer {
    margin-top: 20px;
}

.tier .asterisk {
    font-size: 18px;
}

.not-discounted-price {
    display: none
}

.has-plan-discount .not-discounted-price.price {
    display: inline-block;
    font-weight: 500;
    font-size: 26px;
    color: #999;
    font-style: italic;
    margin-bottom: 10px;
    position: relative;
}

.has-plan-discount .not-discounted-price::before {
    content: '';
    display: block;
    width: 110%;
    height: 2px;
    background-color: #9b9b9b;
    -webkit-transform: rotate(-15deg);
    transform: rotate(-15deg);
    bottom: 12px;
    left: -1px;
    position: absolute;
    -webkit-box-shadow: 1px 1px 1px #fff;
    box-shadow: 1px 1px 1px #fff;
    opacity: 0.8;
    border-radius: 2px;
}

.discount-badge {
    color: #fff;
}

.has-plan-discount .discount-badge {
    position: absolute;
    top: -30px;
    right: -15px;
    width: 100px;
    height: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.has-plan-discount .discount-percent {
    z-index: 2;
    font-size: 16px;
    font-weight: bold;
    color: #fff;
}

.has-plan-discount .discount-percent .discount-percent-label {
    font-size: 12px;
    text-transform: uppercase;
    padding-left: 0.25em;
    display: block;
}

.discount-percent .discount-percent-label>span:first-child {
    display: none;
}

.has-plan-discount .discount-percent .discount-percent-label>span:first-child {
    display: block;
}

.has-discounts .discount-percent .discount-percent-val {
    font-size: 25px;
    line-height: 0.8em;
    font-weight: bold;
}

.has-plan-discount.has-discounts .discount-percent .discount-percent-val {
    font-size: 30px;
}

.discount-badge .discount-badge-icon {
    display: none;
}

.has-plan-discount .discount-badge .discount-badge-icon {
    display: block;
}

.has-plan-discount .discount-badge .discount-badge-icon::before {
    content: "\f0a3";
    color: #C850C0;
    background-color: #C850C0;
    background-image: linear-gradient(43deg, #C850C0 0%, #FFCC70 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    line-height: 1;
    text-rendering: auto;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-size: 100px;
    position: absolute;
    top: 0;
    right: 0;
}

.has-plan-discount .discount-notes {
    padding: 20px 10px;
    color: #de5696;
}

.discount-badge .discount-notes {
    color: #fff;
    padding: 4px;
    font-size: 12px;
}

.has-plan-discount .discount-notes .discount-expire-val {
    font-weight: bold;
}

[data-name="free"] .discount-notes,
[data-name="free"] .discount-badge,
[data-name="free"] .not-discounted-price {
    display: none;
}

.has-discounts:not(.has-plan-discount) .discount-badge {
    position: static;
    width: calc(100% + 48px);
    height: auto;
    background-color: #C850C0;
    background-image: linear-gradient(43deg, #C850C0 0%, #FFCC70 100%);
    margin-bottom: 20px;
    margin-left: -24px;
    margin-right: -24px;
    min-width: 100%;
    margin-top: -56px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    padding-top: 6px;
    padding-bottom: 6px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.has-discounts:not(.has-plan-discount) .discount-badge:hover {
    -webkit-box-shadow: rgba(136, 136, 136, 0.57) 0px 4px 10px -5px;
    box-shadow: rgba(136, 136, 136, 0.57) 0px 4px 10px -5px;
}

*:not(.discount-badge) .discount-notes {
    display: none;
}

.discount-notes-details {
    font-size: 12px;
    line-height: 13px;
    color: #717171;
    display: none;
}

.discount-notes-details>span>span:first-child {
    font-weight: bold;
    margin-right: 0.1em;
    font-size: 14px;
}

.has-discounts:not(.has-plan-discount) .discount-badge>.discount-notes,
.has-discounts.has-plan-discount *:not(.discount-badge)>.discount-notes,
.has-discounts.has-plan-discount *:not(.discount-badge)>.discount-notes-details {
    display: block;
}

.has-discounts .discount-plan-label,
.has-discounts.has-plan-discount .discount-badge .discount-notes {
    display: none;
}

.has-discounts.has-plan-discount.user-current-discount .discount-notes {
    visibility: hidden;
}

.has-discounts:not(.has-plan-discount) .discount-percent {
    position: static;
}

.has-discounts:not(.has-plan-discount) .discount-percent-label,
.has-discounts:not(.has-plan-discount) .discount-plan-label {
    display: inline;
}

.has-discounts:not(.has-plan-discount) .discount-plan-label {
    font-size: 16px;
}

.discount-plan-label>span:last-child {
    font-weight: bold;
    text-decoration: underline;
}

.has-discounts:not(.has-plan-discount) .discount-percent * {
    vertical-align: middle;
}

.has-discounts .fa-exchange-alt {
    font-size: 22px;
    padding-left: 0.5em;
    vertical-align: middle;
    display: none;
}

.has-discounts:not(.has-plan-discount) .fa-exchange-alt {
    display: inline;
    font-size: 16px;
}

.expiring-discount :not(.discount-badge) .discount-notes {
    display: inline
}

.expiring-discount .discount-badge .discount-notes {
    display: block
}

/* /PRICES PAGE - END */

/* INFO BOX */

#ebook-info-box {
    width: 100%;
    margin-top: 20px;
    padding-left: 100px;
    padding-right: 100px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
}

#minimal-help {
    width: 75%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
}

#legal-info {
    width: 25%;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
}

/* FOOTER */

#footer {
    background-color: #000;
    color: #999;
    font-family: 'Roboto', sans-serif;
    font-size: 1.1em;
    font-weight: 400;
    line-height: 1.5em;
    letter-spacing: 0.1em;
    vertical-align: middle;
    text-align: center;
    position: relative;
    bottom: 0;
    min-height: 70px;
    width: 100%;
    margin-top: 6px;
    clear: both;
    padding-top: 40px;
    padding-bottom: 40px;
    /* 
    * Old graphic identity.
    *
    * background-color:rgb(78,78,78);
    * color:#fff;
    */
}

#footer .flex-container {
    margin-bottom: 40px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

#footer .flex-container:last-child {
    margin-bottom: 0;
}

#footer a {
    color: #ccc;
    font-weight: bold;
}

#footer a:hover {
    opacity: 0.6;
}

#footer-push {
    clear: both;
    height: 76px;
}

#footer ul {
    margin-left: auto;
    margin-right: auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

#footer a.active {
    color: #e8a723;
}

#footer h3::first-letter {
    text-transform: uppercase;
}

#footer p {
    margin-bottom: 1em;
    font-size: 0.85em;
    line-height: 1.4em;
}

#footer .action_my_books {
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 10px;
}

.sl-prefooter {
    background-color: #1a1a1a;
    color: #ccc;
    text-align: center;
}

.sl-prefooter h3 {
    color: #ccc;
}

.sl-prefooter p {
    color: #ccc;
    font-size: 18px;
    margin-top: 20px;
}

.sl-prefooter .btn {
    color: #e8a824;
    font-size: 20px;
    padding: 5px 10px;
    display: inline-block;
}

.sl-prefooter .btn .fa {
    margin-left: 0.5em;
}

.sl-prefooter .dark-button span {
    color: #e8a824;
}

.sl-prefooter .button .fa {
    margin-right: 0.5em;
}

.sl-prefooter a.button {
    line-height: 180%;
}

.app-prefooter h2 {
    font-size: 22px;
}

section.sl-prefooter.app-prefooter p {
    font-size: 18px !important;
}

#footer .social-links {
    margin-bottom: 50px;
}

#footer .social-links h3 {
    margin-bottom: 20px;
}

#footer .social-links li {
    display: inline-block;
}

/* /FOOTER - END */

/* COMMON */

.middle {
    vertical-align: middle;
}

.centered {
    text-align: center;
}

.beta::before {
    content: 'Beta';
    width: 46px;
    height: 17px;
    display: inline-block;
    background-color: rgb(232, 167, 36);
    color: #fff;
    position: absolute;
    right: -57px;
    top: -11px;
    vertical-align: top;
    padding: 4px;
    text-transform: lowercase;
    border-radius: 2px;
    border-bottom-left-radius: 0;
    font-size: 15px;
    line-height: 18px;
}

.beta::after {
    content: '';
    min-width: 7px;
    height: 14px;
    display: inline-block;
    background-image: url(/images/beta_arrow.png);
    background-position: left bottom;
    background-size: 7px 14px;
    background-origin: border-box;
    background-repeat: no-repeat;
    position: absolute;
    right: -3px;
    top: 0;
}

.fa.tip-mark,
.far.tip-mark {
    cursor: pointer;
    color: rgb(232, 167, 36)
}

.main-title {
    font-size: 1.2em;
    text-transform: uppercase;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.05em;
    margin-bottom: 20px;
}

.wrapped {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.wrapped-lg {
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

.img-container img {
    height: auto;
    width: 100%;
}

.main-title .book-title {
    text-transform: none;
    font-weight: bold;
    letter-spacing: normal;
}

#project-main-menu .main-title {
    margin-bottom: 0;
    color: #666;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 1.1em;
}

#project-main-menu .product-info {
    margin-top: 2px;
    margin-bottom: 4px;
}

.select-container {
    position: relative;
}

.select-container .fa,
.select-container .far {
    position: absolute;
    right: 4px;
    top: 2px;
    pointer-events: none;
}

.full-width {
    width: 100% !important;
    max-width: 100% !important;
}

.highlighted {
    color: #e6a636;
}

.language-switcher .dropdown-toggle {
    padding: 8px;
    border-radius: 8px;
    background-color: transparent;
    display: flex;
    align-items: center;
    font-weight: 700;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.language-switcher .dropdown-toggle:hover {
    background-color: rgba(0, 0, 0, 0.08);
    opacity: 1;
}

.language-switcher .dropdown-toggle::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    fill: rgb(76, 173, 186);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-right: 8px;
    /* SVG as Background Image */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 19 19' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.86524 0.32032C7.95469 0.0153324 9.09324-0.07252 10.2168 0.0595782C10.7257 0.101245 11.2299 0.194706 11.7197 0.338875C13.6731 0.877563 15.3968 2.04293 16.624 3.65528C17.8511 5.2675 18.5156 7.23761 18.5147 9.26368C18.5136 11.2899 17.8471 13.26 16.6182 14.8711C15.3892 16.4822 13.6658 17.646 11.7119 18.1826L11.7109 18.1816C10.9146 18.4047 10.0916 18.5173 9.26465 18.5166L9.26563 18.5176L9.2627 18.5166L9.26074 18.5176C9.17336 18.5199 9.08617 18.5127 9 18.4981C8.25937 18.4894 7.52326 18.3834 6.81055 18.1816C4.85528 17.6468 3.12979 16.485 1.89942 14.874C0.668924 13.2627 0.00105974 11.2911 1.04033e-06 9.26368C-0.000960641 7.23642 0.664835 5.26482 1.89356 3.65235C3.12201 2.04036 4.84555 0.875887 6.79981 0.338875L6.86426 0.321297L6.86524 0.32032ZM1.96875 12.6231C2.43973 13.6515 3.12106 14.5704 3.97363 15.3164C4.76995 16.0132 5.69516 16.5447 6.69531 16.8809L7.12891 17.0127L7.12988 17.0137C7.34923 17.076 7.57177 17.1258 7.7959 17.167C6.7329 15.8243 5.95455 14.2783 5.50781 12.6231H1.96875ZM12.9971 12.6231C12.551 14.2724 11.779 15.8141 10.7285 17.1592C10.9515 17.1165 11.1736 17.0693 11.3936 17.0127C12.5593 16.6916 13.6379 16.1117 14.5479 15.3154C15.4003 14.5695 16.0817 13.6509 16.5537 12.6231H12.9971ZM6.77734 12.6231C7.27391 14.2539 8.12125 15.7561 9.26074 17.0244C10.4008 15.7589 11.2442 14.2558 11.7285 12.6231H6.77734ZM1.51856 7.11427C1.31863 7.81346 1.21588 8.53806 1.21582 9.26563C1.21548 9.99035 1.31828 10.7111 1.51856 11.4072H5.25391C5.13407 10.6996 5.06978 9.98357 5.06836 9.26563C5.06927 8.54475 5.13361 7.82483 5.25391 7.11427H1.51856ZM6.49024 7.11427C6.35373 7.82293 6.28328 8.54277 6.28516 9.26466C6.28265 9.98366 6.35319 10.7016 6.49024 11.4072H12.0313C12.2905 9.98773 12.2905 8.53377 12.0313 7.11427H6.49024ZM13.2607 7.11427C13.5061 8.53506 13.5052 9.98645 13.2598 11.4072H17.0029C17.1992 10.7104 17.2988 9.98991 17.2969 9.26563L17.293 8.97755C17.2723 8.34661 17.1717 7.72081 16.9951 7.11427H13.2607ZM7.78906 1.36134C7.56677 1.40128 7.34622 1.45039 7.12793 1.5088L7.12695 1.50782L7.06543 1.52638L7.06445 1.5254C5.91536 1.85853 4.85473 2.44332 3.95801 3.23536C3.11854 3.97684 2.44514 4.88484 1.97461 5.89942H5.5166C5.95944 4.24753 6.7323 2.70355 7.78906 1.36134ZM9.26074 1.50587C8.11345 2.76503 7.26465 4.2658 6.77637 5.89747H11.7275C11.2376 4.27026 10.3953 2.77141 9.26074 1.50587ZM10.7305 1.35352C11.7812 2.70107 12.5525 4.2456 12.9971 5.89747H16.5527C16.0798 4.87075 15.3989 3.95256 14.5469 3.20704C13.637 2.41093 12.5588 1.83017 11.3936 1.50782C11.1754 1.44554 10.9534 1.39487 10.7305 1.35352' fill='rgb(232, 167, 36)'/%3E%3C/svg%3E");
}

.language-switcher .dropdown-toggle::after {
    content: '';
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    /* SVG encoded per background-image */
    background-image: url("data:image/svg+xml,%3Csvg width='28' height='28' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M6 9L12 15L18 9' stroke='rgba(60, 60, 60, 0.37)' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.language-switcher .lang-selector {
    background-color: #f2f2f2;
    cursor: pointer;
    color: #c2c2c2;
    font-size: 15px;
    font-weight: bold;
    line-height: 28px;
    padding-left: 8px;
    padding-right: 8px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.language-switcher .lang-selector.active,
[lang="it"] .language-switcher .lang-it,
[lang="en"] .language-switcher .lang-en,
[lang="de"] .language-switcher .lang-de {
    color: #000;
    background-color: #fff;
}

.language-switcher .lang-selector:hover {
    color: #000;
    opacity: 1;
}

.language-switcher .lang-selector:not(:last-child) {
    border-right: 2px solid #ddd;
}

.language-switcher .dropdown-menu {
    background-color: rgb(255, 255, 255);
    -webkit-overflow-scrolling: touch;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-radius: 12px;
    width: 100%;
    z-index: 1;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 16px 8px;
    position: absolute;
    width: 210px;
    right: 0;
    top: 55px;
    display: none;
    gap: 8px;
    flex-direction: column;
}

.language-switcher .dropdown-menu.toggled {
    display: flex;
}

.language-switcher .dropdown-menu .lang-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    text-align: left;
    color: rgb(52, 61, 72);
    font-size: 18px;
    font-weight: 600;
    line-height: 1.66;
    letter-spacing: 0;
    padding: 6px 16px;
    border-radius: 8px;
    background: none;
    border: none;
    cursor: pointer;
}

.language-switcher .dropdown-menu .lang-btn:hover {
    text-decoration: none;
    background-color: rgba(239, 172, 40, 0.1) !important;
    opacity: 1;
}

.language-switcher .dropdown-menu .lang-btn.toggled,
[lang="it"] .language-switcher .dropdown-menu .lang-it,
[lang="en"] .language-switcher .dropdown-menu .lang-en,
[lang="de"] .language-switcher .dropdown-menu .lang-de {
    background-color: rgba(239, 172, 40, 0.15);
    color: rgb(232, 167, 36);
}

.language-switcher .dropdown-menu .lang-btn.toggled::after,
[lang="it"] .language-switcher .dropdown-menu .lang-it::after,
[lang="en"] .language-switcher .dropdown-menu .lang-en::after,
[lang="de"] .language-switcher .dropdown-menu .lang-de::after {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='rgb(232, 167, 36)' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
}

.side-nav .language-switcher {
    border-radius: 4px;
    height: 32px;
    margin-right: 10px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding-right: 0;
    position: relative;
}

.side-nav .language-switcher .dropdown-menu {
    top: 35px;
}

/*.language-switcher .lang-selector:not(:last-child)::after {
content: '|';
margin-left: 0.5em;
margin-right: 0.25em;
}*/

/*.trustpilot-widget {
-webkit-filter: saturate(0) invert(1) sepia(4%);
filter: saturate(0) invert(1) sepia(4%);
}*/

.trustpilot-box {
    margin-bottom: 40px;
}

.trustpilot-box+div {
    margin-bottom: 50px;
}

.trustpilot-box::after {
    content: '';
    display: block;
    height: 2px;
    width: 100px;
    background-color: #9e9e9e75;
    margin: 60px auto;
}

.trustpilot-box h2 {
    margin-bottom: 20px;
    color: #cccccc;
    font-weight: 400;
}

.trustpilot-btn {
    border: 1px solid #00b67a;
    border-radius: 6px;
    display: inline-block;
    font-size: 16px;
    padding: 4px;
}

.trustpilot-btn span {
    color: #fff;
    vertical-align: middle;
    display: inline-block;
}

.trustpilot-btn img {
    height: 23px;
}

@media screen and (min-width: 350px) {

    .trustpilot-btn {
        padding: 10px 15px;
    }

}

.trustpilot-btn:hover {
    opacity: .6;
}

/* /COMMON - END */

/* BUTTONS */

button.button,
a.button {
    background-color: transparent;
}

button,
.button {
    -webkit-tap-highlight-color: transparent;
    letter-spacing: 0.05em;
}

button[disabled] {
    opacity: 0.4;
}

.button.small-button,
button.small-button,
button.button.yellow-button.small-button,
a.button.yellow-button.small-button {
    min-width: 170px;
    min-height: 26px;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 11px;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 2em;
    padding: 1px;
    padding-left: 6px;
    padding-right: 6px;
    border-radius: 8px;
    display: inline-block;
    cursor: pointer;
}

.dark-button {
    min-width: 180px;
    /* 200px */
    min-height: 32px;
    background-color: #000 !important;
    color: #fff !important;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 10px;
    border: none !important;
    padding: 4px 8px;
}

.button.dark-button {
    background-color: #000;
    /*
    * Old graphic identity
    * background-color: rgb(78,78,78);
    */
}

.button.light-button {
    background-color: #B3B3B3 !important;
    color: rgb(78, 78, 78);
}

a.button {
    display: inline-block;
}

button.button.big-button,
button.button.big-button.yellow-button,
a.button.big-button,
a.button.big-button.yellow-button {
    min-height: 40px;
    font-size: 18px;
    min-width: 220px;
}

button.button.yellow-button,
a.button.yellow-button {
    background-color: #E8A724;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    min-width: 180px;
    min-height: 32px;
    border-radius: 10px;
    border: none !important;
    padding: 4px 8px;
}

button.button.big-button {
    padding-left: 20px;
    padding-right: 20px;
}

.actions .text-button,
.actions a.text-button,
#book-actions .action-button,
.public-page #footer a.text-button {
    color: #e8a724;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.actions .text-button .fa,
.actions .text-button .far {
    margin-right: 0.5em;
}

.actions .text-button .fa.fa-arrow-right,
.actions .text-button .fa.fa-exchange-alt,
.actions .text-button .far.fa-arrow-right,
.actions .text-button .far.fa-exchange-alt {
    margin-right: 0;
    margin-left: 0.5em;
    ;
}

.text-button.del-button {
    color: rgb(215, 31, 38);
}

.red-button {
    min-width: 200px;
    height: 32px;
    background-color: rgb(215, 31, 38) !important;
    color: #fff !important;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 10px;
    border: none !important;
    padding: 4px 8px;
}

button#login-button {
    background-color: #E8A724;
    color: #fff;
    font-weight: bold;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    height: 30px;
    margin-top: auto;
    margin-bottom: auto;
    padding: 5px 18px;
    border-radius: 5px;
}

button,
.button,
.add-user,
.medium-button {
    outline: none;
    cursor: pointer;
    text-align: center;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

button:hover,
.button:hover,
.add-user:hover,
.medium-button:hover {
    opacity: 0.6;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.actions .text-button:hover {
    opacity: 0.6;
}

button:active,
.button:active,
.add-user:active {
    opacity: 0.95;
}

.button.button-o {
    background-color: #fff;
    color: rgb(78, 78, 78);
    border: 2px solid #e8a724;
}

.button.button-o:hover,
#bundler-book-actions button:hover {
    background-color: #e8a724;
    color: #fff;
    opacity: 1;
}

#bundler-book-actions button.dark-button:hover {
    opacity: 0.6;
}

#bundler-book-actions button[active]:hover {
    background-color: inherit;
    color: inherit;
    opacity: inherit;
}

.button.button-o:hover:active,
.edit:hover:active,
#bundler-book-actions button:hover:active {
    background-color: #e8a724;
    border-color: #e8a724;
    color: #fff;
    opacity: 1;
}

.button.button-o-gray {
    color: #808080;
    border: 2px solid #808080;
    line-height: 22px;
}

.green-button-o.button-o {
    color: #3db64e;
    border-color: #3db64e;
}

.green-button-o.button-o:hover {
    background-color: #3db64e;
}

.button-o.small-button {
    line-height: 20px;
}

.button:disabled:hover {
    opacity: 0.4;
    cursor: default;
}

.button-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.button-icon span {
    display: inline-block;
    vertical-align: middle;
}

.button-icon span.fa,
.button-icon span.far {
    font-size: 22px;
    line-height: 16px;
}

.gdrive-picker-button img {
    height: 19px;
    line-height: 19px;
    display: inline-block;
    vertical-align: middle;
    margin-left: 8px;
    margin-bottom: 4px;
}

.info-icon,
.tip-mark {
    color: #999;
    font-size: 16px;
    vertical-align: middle;
    cursor: pointer;
    margin-bottom: 2px;
    margin-left: 4px;
    display: inline-block;
    opacity: 0.6;
}

.info-icon {
    color: #999;
}

.info-icon:hover,
.tip-mark:hover {
    opacity: 1;
}

.sl-anchor-link {
    position: absolute;
    top: -100px;
}

button .btn-label-enabled {
    display: block;
}

button .btn-label-disabled {
    display: none;
    line-height: 26px;
}

button[disabled] .btn-label-enabled {
    display: none;
}

button[disabled] .btn-label-disabled {
    display: block;
}

button .btn-label-disabled span {
    font-size: 12px;
    margin-top: -2px;
}

/* /BUTTONS - END */

/* OTHER UI ELEMENTS */

ul.segmented-selector {
    list-style-type: none;
    list-style-position: inside;
    text-align: center;
    margin: auto;
    padding: 0;
    background-color: #4E4E4E;
    color: #bbb;
    border-radius: 10px;
    overflow: hidden;
    display: inline-block;
}

ul.segmented-selector li {
    display: table-cell;
    min-width: 110px;
    height: 30px;
    font-family: 'Roboto', sans-serif;
    font-size: 0.70em;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 31px;
    text-align: center;
    text-transform: uppercase;
    border-right: 2px solid #999;
    white-space: nowrap;
    text-overflow: ellipsis;
    cursor: pointer;
    padding: 0 10px;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

ul.segmented-selector li:last-of-type {
    border-right: 0px none;
}

ul.segmented-selector li.selected {
    color: #fff;
    background-color: #777;
}

ul.segmented-selector li:hover {
    background-color: #939393;
    color: #fff;
}

ul.segmented-selector li:active {
    background-color: #565656;
}

.segmented-selector.outline {
    background-color: transparent;
    border: 2px solid #ccc;
}

.segmented-selector.outline li {
    background-color: transparent;
    border-color: #000;
    color: #808080;
}

.segmented-selector.outline,
ul.segmented-selector li {
    border-color: #000;
}

.segmented-selector.outline li.selected,
ul.segmented-selector li.selected {
    background-color: #000;
    color: #E8A724;
}

.disabled-books-actions .actions {
    margin-top: 0;
    text-align: right;
}

.disabled-books-actions .actions>span {
    margin-right: 0.5em;
    color: #a5a5a5;
    font-style: italic;
    font-weight: bold;
    letter-spacing: 0.025em;
}

/* /OTHER UI ELEMENTS - END */

/* TOGGLE */

.backtypo-toggle {
    position: relative;
    display: inline-block;
    width: 46px;
    height: 25px;
    vertical-align: middle;
}

.backtypo-toggle-control,
#sanitizer-control {
    display: none;
}

.backtypo-toggle .backtypo-toggle-btn {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    cursor: pointer;
    -webkit-transition: .4s;
    transition: .4s;
}

.backtypo-toggle .backtypo-toggle-btn:before {
    content: '';
    position: absolute;
    height: 19px;
    width: 19px;
    left: 3px;
    bottom: 3px;
    background-color: #fff;
    -webkit-transition: .4s;
    transition: .4s;
}

input.backtypo-toggle-control:checked+.backtypo-toggle .backtypo-toggle-btn,
input#sanitizer-control:checked+.backtypo-toggle .backtypo-toggle-btn {
    background-color: #e8a724;
}

input.backtypo-toggle-control:focus+.backtypo-toggle .backtypo-toggle-btn,
input#sanitizer-control:focus+.backtypo-toggle .backtypo-toggle-btn {
    -webkit-box-shadow: 0 0 1px #e8a724;
    box-shadow: 0 0 1px #e8a724;
}

input.backtypo-toggle-control:checked+.backtypo-toggle .backtypo-toggle-btn:before,
input#sanitizer-control:checked+.backtypo-toggle .backtypo-toggle-btn:before {
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
}

.backtypo-toggle .backtypo-toggle-btn {
    border-radius: 25px;
}

.backtypo-toggle .backtypo-toggle-btn:before {
    border-radius: 50%;
}

.backtypo-toggle+span {
    color: #999;
    font-size: 15px;
    font-weight: 600;
    vertical-align: middle;
    margin-left: 6px;
}

input.backtypo-toggle-control:checked+.backtypo-toggle+span,
input#sanitizer-control:checked+.backtypo-toggle+span {
    color: rgb(78, 78, 78);
}

input.backtypo-toggle-control:disabled+.backtypo-toggle {
    opacity: 0.5;
    pointer-events: none;
}

/* /TOGGLE - END */

/* BUNDLER DIALOG */

#bundler-dialog {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 10001;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.6);
    font-family: 'Roboto', sans-serif;
    text-align: center;
    overflow-y: auto;
    display: none;
}

#bundler-dialog-content {
    background-color: #fff;
    font-size: 0.9em;
    position: absolute;
    top: 20%;
    left: 0;
    right: 0;
    min-height: 250px;
    width: 50%;
    min-width: 700px;
    margin: auto;
    margin-bottom: 5%;
    border-radius: 10px;
}

#bundler-dialog-content .book-details {
    width: 20%;
    margin: 40px 4% 4% 4%;
    float: left;
    position: relative;
    height: 100%;
    min-height: 269px;
    text-align: center;
}

#bundler-dialog .book-cover {
    width: 100%;
    max-width: 108px;
    height: 150px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #fff;
    background-size: cover;
    position: relative;
    display: block;
    margin: 20px auto;
    border-radius: 4px;
    -webkit-box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
}

#bundler-dialog .bundler-box {
    width: 100%;
    overflow: hidden;
    display: inline-block;
}

#bundler-dialog .book-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 1em;
    font-weight: bold;
    padding: 10px 20px;
    display: block;
}

#bundler-dialog .current-theme {
    display: inline-block;
    padding: 5px;
    border: 1px solid #BABABA;
    border-radius: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.9em;
    width: 145px;
    vertical-align: middle;
    margin-right: 5px;
}

#bundler-dialog #current-theme-container #change-theme-button {
    background-color: #000;
    color: #fff;
    font-size: 0.8em;
    font-weight: bold;
    text-transform: uppercase;
    line-height: 30px;
    height: 30px;
    vertical-align: middle;
    display: inline-block;
    padding: 0 10px;
    border-radius: 10px;
    cursor: pointer;
}

#bundler-dialog .current-theme span {
    color: rgb(232, 167, 36);
    font-weight: bold;
}

#bundler-book-actions {
    float: right;
    min-height: 269px;
    width: 68%;
    margin: 40px 4% 4% 0;
    text-align: center;
    position: relative;
    display: none;
    padding-bottom: 20px;
    padding-top: 20px;
}

#bundler-dialog #publish-actions,
#bundler-dialog #print-actions {
    display: none;
}

.credits-display-dialog .credits-warn {
    margin-top: 0.5em;
    font-weight: bold;
    text-align: center;
    color: #175c7d;
    margin-bottom: 0;
}

.credits-display-dialog .credits-warn.last-credit {
    color: #ff9a00;
}

.credits-display-dialog .credits-warn.no-credits {
    color: red;
}

#bundler-book-actions button {
    height: 30px;
    min-width: 220px;
    background-color: #fff;
    color: #000;
    font-family: 'Roboto', sans-serif;
    font-size: 0.9em;
    font-weight: bold;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border: 2px solid #e8a724;
    border-radius: 10px;
    padding: 2px 8px;
    display: block;
    margin: 12px auto;
}

#bundler-book-actions #accessibility-section button {
    width: 320px;
    max-width: 100%;
}

#bundler-book-actions button:hover a,
#bundler-book-actions button:hover:active a {
    color: #fff;
}

#gen_cover .cover-status {
    color: #888;
    font-weight: normal;
    text-transform: none;
    max-width: 8em;
    display: inline-block;
    width: 8em;
    overflow: hidden;
    word-break: break-all;
    text-overflow: ellipsis;
    margin: initial;
    white-space: nowrap;
    vertical-align: middle;
}

#bundler-book-actions section h3 {
    color: #000;
}

#send-report-btn.sent {
    background-color: transparent !important;
    color: green !important;
    cursor: auto;
}

#send-report-btn.sent .fa,
#send-report-btn.sent .far {
    display: none !important;
}

#choose-another-format-btn {
    display: none;
}

#bundler-book-actions #gen_epub_fxl {
    margin-top: 60px;
}

#bundler-book-actions button .fa,
#bundler-book-actions button .fas {
    float: left;
    margin-top: 3px;
    margin-left: 4px;
    margin-right: 10px;
}

#bundler-book-actions button[disabled] {
    opacity: 0.6;
    cursor: none;
    pointer-events: none;
}

#bundler-dialog .status-content {
    position: absolute;
    top: 0;
    right: 0;
    float: right;
    min-height: 269px;
    width: 68%;
    margin: 40px 4% 4% 0;
    text-align: center;
    background-color: transparent;
    margin: auto;
}

#bundler-dialog .status-content h3 {
    margin-top: 60px;
}

#download-actions h3,
#bundler-dialog .download-options h3 {
    margin-bottom: 20px;
    color: #000;
}

#bundler-dialog .close_dialog {
    display: none;
    z-index: 1;
}

#bundler-dialog img {
    position: absolute;
    left: 50%;
}

#bundler-dialog .status span {
    color: #aaa;
    font-style: italic;
}

#bundler-dialog .status span.fa-spin {
    color: #aaa;
    font-size: 1.8em;
    font-style: normal;
    display: inline-block;
    vertical-align: middle;
}

#bundler-dialog .status .progress-circle {
    display: inline-block;
    vertical-align: middle;
    min-height: 25px;
}

#bundler-dialog .status .failed {
    color: red;
}

#bundler-dialog .status.success .message {
    font-style: normal;
    font-weight: bold;
}

#bundler-dialog .status.success .fa-spin {
    display: none;
}

#bundler-dialog .status .fa-check-circle {
    color: #4fa54f;
    font-style: normal;
    font-size: 2.5em;
    display: none;
}

#bundler-dialog .status.success .fa-check-circle {
    display: inline-block;
}

#bundler-dialog .log {
    display: none;
    height: 0px;
    overflow-y: auto;
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 5px 20px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    font-weight: 300;
    text-transform: none;
    clear: both;
    text-align: left;
    margin: 10px 4% 4% 4%
}

#bundler-dialog .log div {
    border-bottom: 1px dashed #aaa;
    padding-bottom: 3px;
    margin-bottom: 5px;
}

#bundler-dialog .log div .err_loc {
    font-style: italic;
    display: block;
}

#bundler-dialog .log div .content_title {
    color: #f05;
    font-style: normal;
    font-weight: bold;
}


#bundler-dialog .log div .content_title,
#bundler-dialog .log div .content_title a {
    color: #f05;
    font-style: normal;
    font-weight: bold;
}

#bundler-dialog .log div .content_title a {
    text-decoration: underline;
}

#bundler-dialog .bottom_bar,
#bundler-dialog .bottom_prompt_bar {
    display: none;
    text-align: center;
    margin: 40px 4% 4% 4%;
    clear: both;
}

#bundler-dialog .bottom_bar button {
    margin: auto;
}

#bundler-dialog .bottom_prompt_bar {
    margin-top: 0;
}

#bundler-dialog .bottom_prompt_bar #buttons_bar {
    margin: auto;
}

#bundler-dialog .bottom_prompt_bar button,
#bundler-dialog button.close {
    min-width: 4em;
    background-color: #4E4E4E;
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: 10px;
    padding: 0.5em;
    margin: 1em;
    height: 30px;
}

#bundler-dialog .status {
    color: #333333;
    font-family: 'Roboto', sans-serif;
    margin: 30px 0.8em;
}

#bundler-dialog .message {
    font-style: italic;
    font-weight: 400;
    display: block;
    margin: 30px 0 0.5em 0;
    min-height: 17px;
}

#bundler-dialog #narcissus-new-book {
    display: none;
    background-color: #fff;
    border-radius: 4px;
    padding: 10px 0;
}

#bundler-dialog #narcissus-new-book .narcissus-logo,
#bundler-dialog #narcissus-new-book .narcissus-logo img {
    height: 94px;
}

#bundler-dialog #narcissus-new-book .narcissus-logo {
    margin-top: 0.3em;
}

#bundler-dialog #narcissus-new-book .narcissus-logo img {
    position: static;
    left: 0;
}

#bundler-dialog #narcissus-new-book .narcissus-disclaimer {
    text-align: justify;
    padding: 1em;
    padding-bottom: 0.5em
}

#bundler-dialog #narcissus-new-book .narcissus-disclaimer a {
    text-decoration: underline;
}

#bundler-dialog #narcissus-new-book .book-metadata {
    text-align: left;
    position: relative;
    min-height: 102px;
    padding: 0.1em 1em 0;
}

#bundler-dialog #narcissus-new-book .book-metadata>dl,
#bundler-dialog #narcissus-new-book .book-metadata>div {
    display: inline-block;
}

#bundler-dialog #narcissus-new-book .book-metadata>dl {
    text-align: left;
    max-width: 55%;
}

#bundler-dialog #narcissus-new-book .book-metadata dt {
    font-weight: bold;
}

#bundler-dialog #narcissus-new-book .book-metadata dd {
    margin-bottom: 0.4em;
    max-width: 100%;
    overflow-x: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#bundler-dialog #narcissus-new-book .book-metadata>div.book-cover {
    display: inline-block;
    width: 73px;
    height: 100px;
    margin: 0;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #fff;
    background-size: cover;
    vertical-align: top;
    position: absolute;
    right: 1em;
    border: 1px solid #ddd;
    border-radius: 3px;
}

#bundler-dialog #narcissus-new-book .narcissus-actions {
    padding: 0 1em;
}

#bundler-dialog #narcissus-new-book .narcissus-actions .tip-mark {
    font-size: 1.5em;
    line-height: 30px;
    vertical-align: middle;
    height: 30px;
    display: inline-block;
    margin-left: 0.5em;
}

#bundler-dialog #narcissus-new-book #narcissus-create-book {
    padding-left: 0.5em;
    padding-right: 0.5em;
    display: inline-block;
    font-weight: 700;
}

#bundler-dialog.narcissus-new-book #narcissus-new-book {
    display: block;
    white-space: normal;
}

#bundler-dialog.narcissus-new-book div.book-cover {
    display: none;
}

#bundler-dialog.narcissus-new-book #bundler-book-actions {
    background-color: transparent;
    float: none;
    height: auto;
    width: auto;
    margin: 40px 4% 4% 4%;
    display: block;
}

#bundler-dialog.narcissus-new-book #download-actions,
#bundler-dialog.narcissus-new-book #publish-actions {
    display: none;
}

#bundler-dialog.narcissus-new-book #bundler-dialog-content {
    top: 20px;
}

#bundler-dialog .download-options div {
    text-align: left;
    /*width: 95%;*/
    margin: auto;
    margin-bottom: 0.5em;
}

#bundler-dialog .download-options div:first-of-type {
    padding-top: 0.1em;
}

#bundler-dialog #fxl-options>div,
#bundler-dialog #kindle-options>div,
#bundler-dialog #kf8-options>div {
    width: 260px;
}

#bundler-dialog #fxl-options.download-options fieldset {
    margin-bottom: 10px;
}

#bundler-dialog #fxl-options.download-options select {
    width: 100%;
}

#bundler-dialog .opt-row.hidden {
    display: none;
}

#bundler-dialog #gen_pdf {
    margin-top: 38px;
}

#bundler-dialog #bundler-settings {
    font-size: 0.9em;
    text-align: left;
    margin: auto;
    width: auto;
    display: inline-block;
    margin-bottom: 5px;
}

#bundler-dialog #bundler-settings label {
    margin-left: 0.5em;
}

#bundler-dialog.fxl-book-bundler #bundler-settings .for-reflowable {
    display: none;
}

#bundler-dialog .send-error-report-container {
    margin-bottom: 20px;
    text-align: center;
    font-weight: bold;
    margin-top: -0.5em
}

#bundler-dialog .send-error-report-container>span:first-child {
    padding: 0.5em 1em;
    background-color: #4e4e4e;
    color: #fff;
    border-radius: 0.5em;
    cursor: pointer;
}

#bundler-dialog .cover-options {
    margin-top: 30px;
    margin-left: 30px;
}

#bundler-dialog .cover-options > div{
    text-align: left;
}

.fxl-page-preview {
    background-repeat: no-repeat;
    background-position: center;
    border: 1px solid #999;
    position: relative;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    box-sizing: content-box !important;
    margin-top: 0.5em !important;
}

.fxl-page-preview .fa,
.fxl-page-preview .far {
    display: none;
}

.fxl-page-preview:hover .fa,
.fxl-page-preview:hover .far {
    display: inline-block;
}

.fxl-page-preview .fa[name=prev],
.fxl-page-preview .fa[name=next],
.fxl-page-preview .far[name=prev],
.fxl-page-preview .far[name=next] {
    position: absolute;
    top: 50%;
    margin-top: -7px;
    cursor: pointer;
    background-color: rgba(255, 255, 255, 0.9);
    color: #c4c4c4;
    font-size: 20px;
    text-align: center;
    line-height: 16px;
    width: 28px;
    height: 28px;
    padding: 6px;
    border-radius: 50%;
}

.fxl-page-preview .fa:hover,
.fxl-page-preview .far:hover {
    color: inherit;
}

.fxl-page-preview .fa[name=prev],
.fxl-page-preview .far[name=prev] {
    left: -15px;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.33);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.33);
    padding-right: 10px;
}

.fxl-page-preview .fa[name=next],
.fxl-page-preview .far[name=next] {
    right: -15px;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.33);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.33);
    padding-left: 8px;
}

.fxl-page-preview .tip-mark {
    position: absolute;
    top: 1px;
    right: 1px;
    color: #666;
    text-shadow: 0px 0px 1px #fff;
}

#kindle-options select[name=format],
#kindle-options select[name=page_spread],
#kindle-options select[name=book_orientation],
#kindle-options select[name=fxl_file_format],
#kf8-options select[name=format],
#kf8-options select[name=page_spread],
#kf8-options select[name=book_orientation] {
    margin-left: 20px;
    margin-top: 5px;
    margin-bottom: 5px;
    width: 220px;
}

#fxl-options input[name=zoomable_frames] {
    vertical-align: middle;
}

#fxl-options label[for=zoomable_frames] {
    text-transform: capitalize;
    margin-left: 0.5em;
}

#fxl-options .bt-collapsable-toggler {
    opacity: 0;
    margin-left: 0.5em;
    cursor: pointer;
}

#fxl-options input[name=zoomable_frames]:checked ~ .bt-collapsable-toggler {
    opacity: 0.6;
}

#fxl-options .bt-collapsable-toggler:hover,
#fxl-options .bt-collapsable-toggler.active {
    opacity: 1;
}

#fxl-options .bt-collapsable-toggler.active {
    color: rgb(232, 167, 36);
    opacity: 1;
}

#fxl-options .bt-collapsable {
    padding-top: 0.5em !important;
    padding-left: 0.4em;
}

#fxl-options .bt-collapsable > div {
    border-left: 2px dotted #b0b0b0;
    padding-left: 0.85em;
    padding-top: 8px !important;
}

#fxl-options .settings-container {
    display: none;
}

#kindle-options input[name=zoomable_frames],
#kindle-options label[for=zoomable_frames],
#kindle-options label[for=zoomable_frames]+.tip-mark,
#kf8-options input[name=zoomable_frames],
#kf8-options label[for=zoomable_frames],
#kf8-options label[for=zoomable_frames]+.tip-mark {
    display: none
}

.download-options {
    background-color: #fff;
    border-radius: 4px;
    padding: 10px;
    margin-left: 20px;
    margin-right: 20px;
}

.download-options .fa-question-circle {
    padding-top: 0;
}

.download-options p {
    padding: 0 10px 10px;
    font-style: italic;
}

.download-options>p {
    white-space: normal;
}

.download-options label {
    display: inline-block;
    min-width: 50%;
    text-align: right;
    text-transform: uppercase;
    font-size: 0.8em;
}

#fxl-options label,
#kindle-options label,
#kf8-options label {
    text-align: left;
    min-width: initial;
}

#kindle-options label,
#kf8-options label {
    margin-left: 20px;
}

#fxl-options label[for="fxl-first-page-cover"] {
    margin-left: 4px;
}

#bundler-dialog #fxl-options h3,
#bundler-dialog #kindle-options h3,
#bundler-dialog #kf8-options h3 {
    margin-bottom: 0;
}

#bundler-dialog label[for=fxl-page-preview] {
    display: block;
    width: 100%;
    text-align: center;
    margin-left: 0;
    padding-left: 0;
    font-weight: bold;
    margin-top: 10px;
}

.download-options .back {
    position: absolute;
    top: 30px;
    left: 30px;
    font-size: 1.4em;
    cursor: pointer;
}

.download-options select,
#bundler-book-actions #print-actions select,
.download-options input[type=text],
.download-options input[type=number] {
    border: 1pt solid rgb(78, 78, 78);
    border-radius: 0.4em;
}

.download-options #excerpt-content {
    min-width: 15em;
    max-width: 15em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.download-options .excerpt-tip {
    font-size: 0.9em;
    text-align: justify;
}


#excerpt-options p {
    padding: 20px;
}

#excerpt-options label {
    width: 100%;
    text-align: left;
    color: #808080;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    vertical-align: middle;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    height: 18px;
}

#excerpt-options div {
    max-width: 280px;
}

.download-options #excerpt-content {
    min-width: 15em;
    max-width: 280px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: 29px;
    background-color: #fff;
    color: #000;
    font-family: 'Roboto', sans-serif;
    font-size: 0.9em;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.05em;
    border-radius: 5px;
    border: 1px solid #000;
    outline: none;
    white-space: pre;
    padding: 0 0.5em;
    margin: 6px 0;
    width: 100%;
}

.download-options select#pdf_footer_content {
    max-width: 100px;
}

#bundler-dialog #browser_preview {
    margin-top: 3em;
}

#bundler-dialog #browser_preview a {
    color: #000;
}

#bundler-dialog #browser_preview a:hover {
    color: #fff;
}

.download-options input[type=checkbox]+label {
    text-align: left;
    margin-left: 0.5em;
}

.download-options input[type=number] {
    width: 3em;
    text-align: right;
    padding: 0.2em;
}

#bundler-dialog .kindle-email-form p {
    font-style: italic;
    margin: auto;
    padding-bottom: 0.5em;
}

#bundler-dialog .kindle-email-form input[type="email"] {
    font-size: 1em;
    font-weight: bold;
    width: 60%;
    color: rgb(78, 78, 78);
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.05em;
    border-radius: 5px;
    border: 1px solid #000;
    outline: none;
    white-space: pre;
    padding: 0 0.5em;
    margin: 4px 0;
}

#bundler-dialog #send-to-kindle {
    display: inline-block;
    border: 0px none;
    margin: 0;
    padding: 0.3em;
    height: auto;
    width: 44px;
    min-width: initial;
    border-radius: 0;
    background: transparent;
    position: absolute;
    font-weight: bold;
    font-size: 1.2em;
    display: none;
}

.kindle-email-form .fa-question-circle {
    position: absolute;
    font-size: 1.2em;
    margin-left: 0.5em;
    height: auto;
    padding: 0.3em;
    display: inline-block;
    margin-top: 2px;
    color: rgb(232, 167, 36);
    cursor: pointer;
}

#epub-errors-actions p {
    color: rgb(255, 87, 0);
    margin-top: 0.5em;
    font-size: 1.2em;
    /* @new */
}

#bundler-dialog #bundler-log-toggler {
    text-transform: uppercase;
    font-size: 0.8em;
    margin: 0;
    /*position: absolute;
    bottom: 5px;*/
    /* @new */
    width: 100%;
    text-align: center;
    font-weight: bold;
    color: #787878;
    cursor: pointer;
}

#bundler-dialog .download-options .pdf_margins_container {
    display: inline-block;
    width: 45%;
    vertical-align: baseline;
    margin-bottom: 0;
}

#bundler-dialog .download-options .pdf_margin_field {
    width: 50%;
    display: inline-block;
    margin-right: -4px;
    margin-bottom: 0;
}

.pdf_margin_field label {
    display: block;
    text-align: left;
    font-size: 10px;
    font-weight: 500;
}

.download-options input[type=number] {
    margin-right: 4px;
}

#pdf_auto_pagination {
    margin-left: 0.5em;
}

label[for="auto_pagination"] {
    font-size: 10px;
    display: inline-block;
    margin-left: 0.5em !important;
    vertical-align: middle;
    max-width: 120px;
    min-width: 20px;
}

#bundler-dialog .download-manager-widget {
    position: absolute;
    background-color: transparent;
    color: #666;
}

#bundler-dialog .download-manager-widget>div {
    display: inline-block;
}

#bundler-dialog .download-manager-widget .file {
    cursor: pointer;
}

table.download-manager-widget-tip {
    font-weight: normal;
    font-size: 0.9em;
    width: auto !important;
    border-collapse: collapse;
    border: 0;
    display: block;
    max-width: 100%;
}

table.download-manager-widget-tip tr,
table.download-manager-widget-tip td,
table.download-manager-widget-tip tbody {
    display: block;
}


table.download-manager-widget-tip td {
    padding: 0.25em;
    vertical-align: top;
}

table.download-manager-widget-tip td.field {
    font-weight: bold;
    text-align: left;
    padding-right: 1em;
    width: auto;
    overflow: visible;
    white-space: nowrap;
    padding-bottom: 0;
}

table.download-manager-widget-tip td.value {
    width: auto;
    max-width: auto;
    min-width: auto;
    overflow: visible;
    white-space: normal;
    text-align: left;
}

ul.ebook-warnings-links {
    margin: 0;
    margin-top: 0.5em;
    margin-left: 0.5em;
}

.ebook-warnings-links li {
    font-weight: bold;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    border-bottom: 1px dashed #ccc;
}

.ebook-warnings-links li a {
    color: rgb(208 86 14);
}

.accessibility-dialog #bundler-book-actions,
.bt-dialog #bundler-book-actions {
    width: 100%;
    margin-right: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.accessibility-dialog #bundler-book-actions[style="display: block;"],
.bt-dialog #bundler-book-actions[style="display: block;"] {
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
}

.bt-dialog .bt-dialog-section.bt-dialog-section-show {
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-height: 100%;
    padding-left: 20px;
    padding-right: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

#bundler-dialog .bt-dialog-header p {
    color: #888;
    font-size: 16px;
    margin-top: 1em;
}

#bundler-dialog .status-details,
#bundler-dialog .message-details {
    font-size: 1.1em;
    color: #888;
}

.bt-dialog .bt-dialog-section .warning-box {
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
}

.bt-dialog-footer {
    padding: 20px 0 0;
}

.bt-dialog-footer a {
    color: #929292;
    font-weight: 700;
    font-size: 12px;
    font-style: italic;
    text-align: right;
    margin-top: 0.5em;
    letter-spacing: 0.05em;
}

.bt-dialog-footer a.right {
    float: right;
}

.bt-dialog-footer a:hover {
    color: #e8a724;
}

.bt-dialog-footer a .fa {
    margin-left: 0.5em;
}

.bt-dialog-status > p:first-child {
    margin-top: 30px;
}

/* /BUNDLER DIALOG - END */

/* ZENDESK */

#zenbox_tab img {
    max-width: 30px !important;
}

#launcher.ze-launcher-hide {
    margin-left: -29px !important;
}

/* HELP LINK */

#help_link {
    position: fixed;
    top: 253px;
    left: 0;
    z-index: 10000;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: 8px 8px;
    transform-origin: 8px 8px;
    margin-top: 20px;
    width: 120px;
    color: rgb(232, 167, 36);
    padding: 3.5px;
    display: inline-block;
    line-height: 1.2em;
    background-color: #000;
    text-align: center;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}

#help_link a {
    display: block;
    width: 100%;
}

#help_link span {
    display: inline-block;
    color: rgb(232, 167, 36);
}

#help_link #help_text {
    font-size: 16px;
    letter-spacing: 0.01em;
    vertical-align: bottom;
}

#help_link span.fa,
#help_link span.far {
    margin-right: 10px;
}

/* DIALOGS */

.backtypo-dialog {
    position: fixed;
    top: 50%;
    left: 0;
    right: 0;
    margin: auto;
    width: 350px;
    background-color: #fff;
    z-index: 100000000001;
    text-align: center;
    border: 1px solid #999;
    padding: 1em;
    border-radius: 10px;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: translate3d(0, 0, 0);
    transition: translate3d(0, 0, 0);
}

.backtypo-dialog section.message {
    margin-bottom: 1em;
    vertical-align: middle;
    font-style: normal;
}

.backtypo-dialog .fa,
.backtypo-dialog .far {
    display: block;
    height: 100%;
    font-size: 3em;
    line-height: 1.6em;
}

#error-dialog .fa-warning,
#error-dialog .fa {
    color: rgb(233, 13, 24);
}

#warning-dialog .fa-warning,
#warning-dialog .fa {
    color: rgb(232, 167, 36);
}

#success-dialog .fa-thumbs-up {
    color: rgb(37, 105, 31);
}

#confirm-dialog .fa-warning,
#info-dialog .fa-info,
#confirm-dialog .fa {
    color: #b1b1b1;
}

.backtypo-dialog span.msg {
    display: inline-block;
    max-width: 100%;
    overflow-x: hidden;
    word-break: break-word;
    max-height: 70vh;
}

.backtypo-dialog span.msg::before {
    content: '';
    display: block;
    position: absolute;
    bottom: 4px;
    width: 100%;
    height: 20px;
    pointer-events: none;
    left: 0;
    background: rgba(255, 255, 255, 0);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), color-stop(80%, rgba(255, 255, 255, 1)));
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 80%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#fff', GradientType=0)
}

.backtypo-dialog span.msg::after {
    content: '';
    display: block;
    width: 100%;
    height: 20px;
}

.backtypo-dialog span.msg header {
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 0.5em;
}

.backtypo-dialog span.msg a {
    font-weight: bold;
}

.backtypo-dialog span.msg ul {
    margin-left: 1em;
}

.backtypo-dialog span.msg ul li {
    list-style-type: disc;
    list-style-position: outside;
}

.backtypo-dialog button.close-dialog {
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    padding: 0.4em;
    border-radius: 6px;
}

#error-dialog button.close-dialog {
    background-color: rgb(233, 13, 24);
}

#warning-dialog button.close-dialog {
    background-color: rgb(232, 167, 36);
}

#info-dialog button.close-dialog,
#success-dialog button.close-dialog {
    background-color: #4E4E4E;
}

.backtypo-dialog button.yes-button {
    background-color: #0F4D80;
    margin-right: 0.5em;
}

.backtypo-dialog button.no-button {
    margin-left: 0.5em;
    background-color: #4e4e4e;
}

.backtypo-dialog button.extra-button {
    margin-left: 0.5em;
    background-color: #999;
}

#confirm-dialog button {
    margin-bottom: 0.2em;
}

#confirm-dialog button.close-dialog {
    padding-left: 1em;
    padding-right: 1em;
    margin: 0;
    margin-top: 0px;
    margin-right: 0px;
    margin-bottom: 0.2em;
    margin-left: 0px;
    margin-bottom: 0.2em;
    max-width: 80%;
    width: 80%;
    overflow: hidden;
}

.backtypo-dialog .message .current-storage,
.backtypo-dialog .message .max-storage,
.backtypo-dialog .message .tier-name,
.backtypo-dialog .message .tier-price {
    font-weight: bold;
}

.backtypo-dialog .message .current-storage.exceeded {
    color: red;
}

#dialog-overlay {
    z-index: 10999;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #000;
    opacity: 0.7;
    width: 100%;
    height: 100%;
}

.dialog-generic-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    z-index: 9999999999;
}

.backtypo-dialog .delete-image-warn {
    text-align: left;
    margin: auto;
    list-style-type: square;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: 1.5em !important;
}

.backtypo-dialog .delete-image-warn li {
    margin-bottom: 0.25em;
}

/* Backtypo dialog */

.bt-main-dialog,
.create-dialog,
/* TO DELETE AFTER CLASS FIX */
#bundler-dialog-content
/* TO DELETE AFTER CLASS FIX */
    {
    min-width: 700px;
}

/* Create dialog */

.create-dialog-overlay {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 10001;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.6);
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    overflow-y: auto;
    display: none;
}

.create-dialog {
    background-color: #fff;
    border-radius: 10px;
    overflow-x: hidden;
    /* TO CHECK */
    overflow-y: auto;
    /* TO CHECK */
    width: 50%;
    margin: auto;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.create-dialog.disabled {
    pointer-events: none;
}

.create-dialog.disabled .dialog-steps {
    opacity: 0.5;
}

.create-dialog h3 {
    font-size: 1.4em;
    color: #000;
    text-align: center;
    padding: 0.4em;
    line-height: 1.4em;
    vertical-align: middle;
    letter-spacing: 0.1em;
    margin: 1em 0;
}

.create-dialog .theme-details {
    display: none;
    width: 80%;
    margin: -20px auto 30px;
    color: #a5a5a5;
    font-size: 14px;
    font-style: italic;
    font-weight: bold;
    text-align: left;
}

.create-dialog .theme-details span:first-child::after {
    content: ':';
    margin-right: 0.5em;
}

.create-dialog .theme-details .selected-theme {
    text-transform: capitalize;
}

.create-dialog input[type=text] {
    font-family: 'Roboto', sans-serif;
    font-size: 1.6em;
    font-weight: 400;
    line-height: 1.4em;
    width: 100%;
    display: block;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    letter-spacing: 0.05em;
    outline: none;
    white-space: pre;
    border-left: 2px solid rgb(232, 167, 36);
    border-radius: 10px;
    width: 80%;
    margin: auto;
    height: 2em;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-top: none;
    margin-bottom: 1em;
    padding-left: 0.3em;
    background-color: #f3f3f3;
}

#new-cover-dialog #cover-title,
#new-cover-dialog #cover-author,
#new-cover-dialog #cover-layout {
    margin-bottom: 0;
    margin: 6px auto 0;
    font-size: 14px;
    height: 38px;
    padding: 0 1em;
}

#new-cover-dialog #cover-title[disabled],
#new-cover-dialog #cover-author[disabled] {
    opacity: 0.4;
    background-color: #f0f0f0;
}

.create-dialog input[type=text]::-webkit-input-placeholder {
    color: #aaa;
}

.create-dialog input[type=text]:-ms-input-placeholder {
    color: #aaa;
}

.create-dialog input[type=text]::placeholder {
    color: #aaa;
}

#new-cover-dialog input[type=text]::-webkit-input-placeholder {
    color: rgb(232, 167, 36);
    font-weight: bold;
}

#new-cover-dialog input[type=text]:-ms-input-placeholder {
    color: rgb(232, 167, 36);
    font-weight: bold;
}

#new-cover-dialog input[type=text]::placeholder {
    color: rgb(232, 167, 36);
    font-weight: bold;
}

#new-cover-dialog input[type=text]:focus::-webkit-input-placeholder {
    color: #aaa;
}

#new-cover-dialog input[type=text]:focus:-ms-input-placeholder {
    color: #aaa;
}

#new-cover-dialog input[type=text]:focus::placeholder {
    color: #aaa;
}

#new-cover-dialog input[type=text]:focus {
    background-color: #f7f7f7;
}

.create-dialog select {
    width: 240px;
    height: 29px;
    line-height: 29px;
    background-color: #fff;
    color: rgb(78, 78, 78);
    font-family: 'Roboto', sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 10px;
    border: 1px solid rgb(78, 78, 78);
    outline: none;
    white-space: pre;
    padding: 0 0.5em;
    vertical-align: middle;
    -webkit-appearance: button;
    -moz-appearance: none;
    appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
}

.create-dialog select+span.fa-sort {
    position: relative;
    left: -23px;
    margin-right: -13px;
    vertical-align: middle;
    background-color: #FFF;
    height: 27px;
    line-height: 27px;
    width: 17px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    padding-right: 10px;
    pointer-events: none;
    cursor: pointer;
}

#new-ebook-dialog.create-dialog .dialog-second-step label {
    text-transform: uppercase;
    margin-right: 0.25em;
    font-size: 1.2em;
    vertical-align: middle;
}

#new-cover-dialog input[type="checkbox"] + label {
    text-transform: none;
    font-size: 14px;
    color: #B5B5B5;
}

#new-cover-dialog .fa-info-circle {
    color: #B1B1B1;
    vertical-align: middle;
}

.create-dialog .create-button {
    margin-bottom: 2em;
}

.create-dialog .tip {
    background-color: transparent;
    
}

.create-dialog .tip .fa {
    font-size: 18px;
}

.create-dialog .inline-input > * {
    vertical-align: middle;
}


.create-dialog input + span {
    margin-left: 0.5em;
}

#new-cover-dialog .create-dialog .cover-spine-settings {
    display: none;
}

#new-cover-dialog .create-dialog.print-cover .cover-spine-settings {
    display: inherit;
}

#new-cover-dialog .secondary-color-fieldset {
    padding-top: 5px;
    padding-bottom: 5px;
}

#new-cover-dialog .secondary-color-fieldset > span {
    max-width: calc(100% - 40px);
    width: 300px;
    display: inline-block;
    text-align: left;
    /* vertical-align: middle; */
}

#new-cover-dialog .secondary-color-fieldset input,
#new-cover-dialog .secondary-color-fieldset label {
    vertical-align: middle;
}

#new-cover-dialog #new-cover-wizard fieldset:last-of-type {
    margin-bottom: 0;
}

#new-cover-dialog #new-cover-wizard .bt-wizard-step:last-of-type .dialog-section {
    margin-bottom: 0;
}

/* Share dialog */

#share-dialog {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 10001;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.6);
    font-family: 'Roboto', sans-serif;
    font-size: 1.1em;
    text-align: center;
    overflow-y: auto;
    display: none;
}

#share-dialog-content {
    background-color: #fff;
    font-size: 0.9em;
    border-radius: 10px;
    width: 50%;
    margin: auto;
    position: absolute;
    top: 20%;
    left: 0;
    right: 0;
    min-height: 250px;
    margin-bottom: 5%;
    min-width: 700px;
}

#share-dialog-content h3 {
    color: #4E4E4E;
    font-size: 1.5em;
    line-height: 1.4em;
    letter-spacing: 0.1em;
    vertical-align: middle;
    text-align: center;
    padding: 0.4em;
    margin: 1em 0;
}

#share-dialog .close_dialog {
    display: none;
}

#share-dialog-content>div {
    margin-top: 20px;
}

#share-dialog #user-email,
#share-dialog #share-invite-url {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    width: 100%;
    display: block;
    font-size: 1.6em;
    line-height: 1.4em;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    letter-spacing: 0.05em;
    outline: none;
    white-space: pre;
    border-left: 2px solid #afafaf;
    border-radius: 10px;
    width: 80%;
    margin: auto;
    height: 2em;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-top: none;
    margin-bottom: 1em;
    padding-left: 0.3em;
    background-color: #eee;
}

#share-dialog #user-email:focus,
#share-dialog #share-invite-url:focus {
    background-color: #f9f9f9;
}

#share-dialog #share-invite-url {
    display: inline-block;
    border-left-color: rgb(0, 139, 200);
}

#share-dialog .copy-button {
    position: absolute;
    display: inline-block;
    margin-left: -1px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: rgb(78, 78, 78);
    color: #fff;
    text-transform: uppercase;
    padding-left: 0.5em;
    padding-right: 0.5em;
}

#share-dialog .copy-button+.fa-spinner {
    position: absolute;
    z-index: 10;
    left: 50%;
    margin-left: -7px;
    top: 25%;
    margin-top: -2px;
}

#share-dialog input#invite-mode {
    vertical-align: middle;
}

#share-dialog label[for="invite-mode"] {
    margin-left: 0.6em;
    vertical-align: middle;
}

#share-dialog #share-book-button {
    width: 220px;
    height: 32px;
    background-color: rgb(232, 167, 36);
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 0.9em;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 10px;
    border: none;
    padding: 8px;
    margin: 30px auto;
    cursor: pointer;
}

.add-user-icon {
    display: inline-block;
    position: relative;
    width: 22px;
    margin-right: 4px;
}

.add-user-icon span.fa.fa-user,
.add-user-icon span.far.fa-user {
    font-size: 16px;
    margin-right: 2px;
}

.add-user-icon span.fa.fa-plus,
.add-user-icon span.far.fa-plus {
    position: absolute;
    font-size: 8px;
    top: 0;
    right: 0;
}

#share-dialog-content>p {
    max-width: 80%;
    margin: auto;
}

#share-dialog-content .share-message-success {
    color: rgb(33, 134, 33);
    font-weight: bold;
    margin-top: 20px;
}

#share-dialog-content .share-message-error {
    color: rgb(239, 9, 36);
    font-weight: bold;
    margin-top: 20px;
}

.share-message-success button,
.share-message-error button {
    margin-top: 1em;
}

/* /Share dialog - END */

/* Dialogs steps */

.dialog-steps {
    white-space: nowrap;
    overflow: hidden;
    -webkit-transition: -webkit-transform 0.25s ease-out 0.1s;
    transition: -webkit-transform 0.25s ease-out 0.1s;
    transition: transform 0.25s ease-out 0.1s;
    transition: transform 0.25s ease-out 0.1s, -webkit-transform 0.25s ease-out 0.1s;
}

.dialog-step {
    width: 100%;
    display: inline-block;
    position: relative;
    -webkit-transition: opacity 0.25s ease-out 0.1s;
    transition: opacity 0.25s ease-out 0.1s;
    vertical-align: middle;
    padding: 20px;
    white-space: normal;
    
}

.dialog-step+.dialog-step {
    margin-left: -4px;
}

.dialog-section h4 {
    color: #808080;
    margin-bottom: 20px;
    font-size: 18px;
}

.dialog-section.hidden {
    display: none;
}

.dialog-info {
    color: #b3b3b3;
    font-style: italic;
    margin-top: 20px;
}

.dialog-warn {
    color: red;
}

.dialog-first-step .dialog-info {
    visibility: hidden;
}

.dialog-first-step .checkbox-field .check-icon-container {
    margin-top: 4px;
    vertical-align: middle;
}

.dialog-first-step .checkbox-field .check-icon-container~span,
.notifications-control * {
    vertical-align: middle;
}

.notifications-control {
    margin-top: 10px;
    display: block;
}

.notifications-control label {
    font-size: 15px;
    color: #808080;
}

.notifications-info-button {
    background-color: transparent;
}

.notifications-info-button span {
    color: #808080;
    margin-left: 5px;
    font-size: 18px;
}

/* /Dialogs steps - END */

/* Cover dialog */

.cover-type-selectors {
    padding-top: 20px;
}

.cover-type-selectors button {
    background-color: transparent;
    text-align: center;
    display: inline-block;
    padding: 10px;
    min-width: 150px;
    border: 2px solid transparent;
    border-radius: 6px;
    margin: 5px;
}

.cover-type-selectors button:hover {
    border-color: #e8a824;   
    opacity: 1;
}

.cover-type-selectors button span {
    display: block;
    text-align: center;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 10px;
}

/* /Cover dialog - END */

/* /DIALOGS - END */

/* FEATURES TOUR */

#features-tour {
    position: fixed;
    z-index: 10000000;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    text-align: center;
    top: 0;
    left: 0;
}

#features-tour-content {
    background-color: rgb(106, 106, 106);
    width: 90%;
    height: 90%;
    margin: 35px auto;
    border-radius: 10px;
    text-align: left;
    border: 1px solid #ddd;
    position: relative;
    padding: 1%;
}

#features-tour-action {
    margin: auto;
    width: 300px;
    height: 60px;
    text-align: center;
}

#features-tour-content div.screenshot {
    width: 100%;
    height: 100%;
    position: absolute;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.slide-buttons a {
    width: 16px;
    height: 16px;
    border: 2px solid #fff;
    border-radius: 16px;
    display: inline-block;
    background-color: transparent;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-right: 4px;
}

.slide-buttons a.active-slide {
    background-color: #fff;
}

.slide-buttons a:last-child {
    margin-right: 0;
}

#features-tour-action span {
    line-height: 52px;
    margin: 4px;
    font-size: 20px;
    color: #fff;
}

.scroll-arrows {
    cursor: pointer;
}

.screenshots {
    background-position: top;
    background-repeat: no-repeat;
    background-size: contain;
    display: inline-block;
    height: 90%;
    width: 79%;
    background-color: rgb(78, 78, 78);
    border: 15px solid rgb(78, 78, 78);
    border-radius: 10px;
    text-align: center;
    position: relative;
}

/*.screenshots img {
max-height: 100%;
max-width: 100%;
line-height: 100%;
vertical-align: middle;
position: absolute;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}*/

#features-tour #descriptions {
    margin: 10px 10px 0;
    width: 18%;
    display: inline-block;
    vertical-align: top;
    color: #fff;
    height: 89%;
    overflow-y: auto;
    position: relative;
}

#descriptions::before {
    content: '';
    display: block;
    height: 20px;
    width: 18%;
    position: fixed;
    bottom: 15%;
    background: rgba(107, 107, 107, 0);
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(107, 107, 107, 0)), color-stop(80%, rgba(107, 107, 107, 1)));
    background: linear-gradient(to bottom, rgba(107, 107, 107, 0) 0%, rgba(107, 107, 107, 1) 80%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#006b6b6b', endColorstr='#6b6b6b', GradientType=0);
}

#features-tour .description h1 {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 1.6em;
    margin-bottom: 1em;
}

#features-tour .description p {
    color: #e6e6e6;
    font-size: 1.2em;
    text-align: left;
}

#features-tour a.slidesjs-navigation {
    color: #fff;
    font-size: 2em;
    font-weight: bold;
    display: block;
    position: fixed;
    top: 50%;
    margin-top: -1em;
    text-decoration: none;
}

#features-tour a.slidesjs-previous {
    left: 30px;
}

#features-tour a.slidesjs-next {
    right: 30px;
}

#features-tour .slidesjs-pagination-item {
    display: inline-block;
    margin-right: 3px;
}

#features-tour .slidesjs-pagination-item a {
    text-decoration: none;
    display: inline-block;
    color: transparent;
    background-color: transparent;
    border: 1px solid #fff;
    width: 14px;
    height: 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    border-radius: 7px;
    -moz-border-radius: 7px;
    -ms-border-radius: 7px;
}

#features-tour .slidesjs-pagination-item a.active {
    background-color: #fff;
}

#features-tour ul.slidesjs-pagination {
    /*margin: 0;
    margin-top: 1em;
    list-style-position: inside;
    padding: 0;
    text-align: center;*/
    display: none;
}

#features-tour-action span.close-button {
    position: absolute;
    top: 0;
    right: 10px;
    line-height: 35px;
    cursor: pointer;
}

#features-tour #descriptions a {
    color: rgb(232, 167, 36);
}

#features-tour .features-loader {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    color: #fff;
}

#features-tour .features-loader .fa-spin {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -16px;
    margin-left: -14px;
}

/* /FEATURES TOUR - END */

/* SSO REGISTER */

#sso_register {
    width: 50%;
    margin: auto;
    text-align: center;
    background-color: #fff;
    padding: 1em;
    border-radius: 0.4em;
    margin-top: -40px;
}

#sso_register h3 {
    margin-bottom: 1em;
}

#sso_disclaimer {
    font-size: 1.2em;
    text-align: justify;
}

#sso_disclaimer a {
    font-weight: bold;
}

#sso_register form {
    text-align: left;
    width: 100%;
    margin: 2em auto;
}

#sso_register form a {
    font-weight: bold;
}

#sso_register form input[type=submit] {
    cursor: pointer;
}

#sso_register div.sso_register_submit {
    margin-top: 3em;
    text-align: center;
}

#sso_register form input[name=email],
#sso_register form label[for=email] {
    display: block;
}

#sso_register form input[name=email] {
    font-size: 1.2em;
    padding: 0.3em;
    border: 1px solid #bbb;
    border-radius: 0.4em;
    margin-top: 0.5em;
    margin-bottom: 1em;
    min-width: 280px;
}

#sso_register form label[for=email] {
    font-weight: bold;
    text-transform: uppercase;
}

#sso_register div.sso_register_submit input {
    left: 0;
    right: 0;
    width: 280px;
    height: 32px;
    background-color: rgb(78, 78, 78);
    color: #fff;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    border-radius: 10px;
    border: none;
    font-size: 0.9em;
    padding: 4px;
    letter-spacing: 0.1em;
}

/* /SSO REGISTER - END */

/* RESET PASSWORD */

#reset_passw {
    position: relative;
    height: 400px;
    margin: auto;
    text-align: center;
    width: 380px;
}

#reset_passw table {
    text-align: right;
}

#reset_passw td {
    margin-top: 1.3em;
    text-align: right;
    padding-right: 10px;
    position: relative;
    vertical-align: middle;
}

#reset_passw tr {
    margin-left: -90px;
}

#reset_passw .inputtext {
    width: 170px;
    height: 29px;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    border-radius: 10px;
    font-size: 0.8em;
    letter-spacing: 0.05em;
    background-color: #fff;
    color: rgb(78, 78, 78);
    border: 1pt solid rgb(78, 78, 78);
    outline: none;
    white-space: pre;
    padding: 0 0.5em;
    vertical-align: middle;
    float: left;
    margin: 0.5em;
}

#reset_passw .inputbutton,
a.error_action {
    min-width: 170px;
    height: 30px;
    background-color: #fff;
    color: rgb(78, 78, 78);
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    font-weight: 600;
    border: 2px solid rgb(232, 167, 36);
    border-radius: 10px;
    font-size: 0.9em;
    padding: 2px 10px;
    letter-spacing: 0.05em;
    position: static;
    top: 0;
    text-align: center;
    margin: 1em auto;
    cursor: pointer;
    display: inline-block;
    width: auto;
}

/* /RESET PASSWORD - END */

/* ERRORS AND WARNINGS UI */

a.error_action {
    /*width: 180px;*/
    vertical-align: middle;
    line-height: 22px;
}

.errorbox {
    text-align: center;
}

.errorbox,
.warningbox,
.infobox,
.info-message,
#internal-error {
    background-color: #fff;
    color: rgb(233, 13, 24);
    font-size: 14px;
    font-weight: bold;
    font-style: normal;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    min-height: 100%;
    height: auto;
    min-height: 300px;
    width: 80%;
    min-width: 300px;
    margin: auto auto 60px;
    padding: 30px 0;
    border-radius: 10px;
}

.info-message {
    background-color: #fff;
    color: inherit;
    font-family: 'Roboto', sans-serif;
    font-size: 1em;
    font-weight: normal;
    max-width: 600px;
    padding: 50px 40px;
    position: relative;
}

.info-message a {
    color: rgb(232, 167, 36);
}

.infobox {
    background-color: #fff;
    color: inherit;
    font-size: 1em;
    font-weight: normal;
    max-width: 600px;
    padding: 20px 40px;
    position: relative;
}

.errorbox .img-container,
.warningbox .img-container,
.infobox .img-container,
.info-message .img-container,
#internal-error .img-container,
.no-contents-box .img-container {
    margin-bottom: 20px;
    text-align: center;
}

.no-contents-box {
    margin-bottom: 60px;
    text-align: center;
}

.errorbox .img-container img,
.warningbox .img-container img,
.infobox .img-container img,
.info-message .img-container img,
#internal-error .img-container img,
.no-contents-box .img-container img {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
}

.no-contents-box .img-container img {
    max-width: 300px;
}

.errorbox>div,
.warningbox>div,
.infobox>div,
.info-message>div,
#internal-error>div {
    margin: auto;
}

.infobox>div {
    margin: auto;
}

.errorbox a.error_action {
    left: 0;
    right: 0;
    width: 200px;
    height: 32px;
    background-color: rgb(78, 78, 78);
    color: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 0.9em;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    border-radius: 10px;
    border: none;
    padding: 4px;
    margin-top: 2em;
    display: inline-block;
    width: auto;
}

.infobox a.error_action {
    display: inline-block;
    height: auto;
    background-color: rgb(78, 78, 78);
    border-color: rgb(78, 78, 78);
    color: #fff;
    font-size: 0.8em;
    font-weight: bold;
    width: auto;
    padding: 0 10px;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.errorbox h2,
.warningbox h2,
.infobox h2,
.info-message h2,
#internal-error h2,
.no-contents-box h2 {
    font-size: 1.6em;
    font-weight: 300;
}

.errorbox h2::first-letter,
.warningbox h2::first-letter,
.infobox h2::first-letter,
.info-message h2::first-letter,
#internal-error h2::first-letter,
#internal-error::first-letter,
.no-contents-box h2::first-letter {
    text-transform: uppercase;
}

.errorbox .message,
.warningbox .message,
.infobox .message,
.info-message .message,
#internal-error .message {
    font-size: 18px;
    font-weight: 400;
    color: #000;
}

.errorbox .message a,
.warningbox .message a,
.infobox .message a,
.info-message .message a,
#internal-error .message a {
    font-weight: bold;
}

.errorbox .message a:hover,
.warningbox .message a:hover,
.infobox .message a:hover,
.info-message .message a:hover,
#internal-error .message a:hover {
    text-decoration: underline;
}

.infobox a.error_action:hover {
    text-decoration: none;
    opacity: 0.6;
}

div#relogging-msg {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    padding-top: 10em;
    text-align: center;
}

/* /ERRORS AND WARNINGS UI - END */

/* ZENBOX TAB */

#zenbox_tab img {
    visibility: hidden;
}

#zenbox_tab {
    background-color: transparent !important;
    border: none !important;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    top: 440px !important;
}

#zenbox_tab:before {
    content: attr(title);
    background-color: rgb(232, 167, 36);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    width: 100px;
    height: 1.2em;
    color: #fff;
    padding: 5px;
    display: inline-block;
    line-height: 1.2em;
    text-align: center;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    position: absolute;
    left: -1px;
}

iframe#launcher {
    margin: 0 !important;
    -webkit-transform: rotate(-90deg) !important;
    transform: rotate(-90deg) !important;
    -webkit-transform-origin: 0 0 !important;
    transform-origin: 0 0 !important;
    width: 110px !important;
    z-index: 10000 !important;
    /* Zendebox button style fixes 2018 */
    left: -12px !important;
    min-height: 40px !important;
    height: 28px !important;
    border-radius: 10px;
    background-color: #e8a800 !important;
    overflow: hidden;
    /* /Zendebox button style fixes 2018 - END */
}

/* /ZENBOX TAB - END */

/* EPUB READER */

#epub_reader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 9999999;
    opacity: 1;
    background-color: #e9e9e9;
}

#epub_reader iframe {
    width: 100%;
    height: 100%;
    background-color: transparent;
}

#readium-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -16px;
    margin-left: -14px
}

/* /EPUB READER - END */

/* TOOLTIPSTER THEMES */

/*.tooltipster-backtypo-light {
border-radius: 5px;
border: 1px solid #dedede;
background: #fefefe;
color: #4e4e4e;
}
.tooltipster-backtypo-light .tooltipster-content {
font-family: Arial, sans-serif;
font-size: 14px;
line-height: 16px;
padding: 8px 10px;
}*/

/* TOOLTIPSTER CONTENTS */

/*.tooltipster-content caption{
font-weight: bold;
margin-bottom: 1.5em;
}

.tooltipster-content td.label{
min-width: 6em;
padding-top: 0.2em;
padding-bottom: 0.2em;
text-align: right;
font-weight: bold;
color: rgb(232, 167, 36);
}

.tooltipster-content td.value{
padding-left: 1em;
font-size: 0.9em;
} */

/* QTIP */

.qtip-tipsy {
    /* Check and remove !IMPORTANT */
    background: rgba(77, 77, 77, 1) !important;
    -webkit-box-shadow: 1px 1px 0 rgba(173, 173, 173, 0.7) !important;
    box-shadow: 1px 1px 0 rgba(173, 173, 173, 0.7) !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 0.9em !important;
    line-height: 1.2em !important;
    text-shadow: none !important;
    border-radius: 4px !important;
}

.qtip-tipsy li.active {
    color: #e8a724;
}

div.qtip-backtypo-light {
    border: 1px solid #dedede;
    background: #fefefe;
    color: #4e4e4e;
    max-width: 500px;
}

div.qtip-backtypo-tutorials {
    z-index: 100000000000000 !important;
    -webkit-box-shadow: 0px 0px 6px #ccc;
    box-shadow: 0px 0px 6px #ccc;
    border-radius: 0;
}

.qtip-backtypo-light .qtip-content {
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
    line-height: 16px;
    padding: 8px 10px;
}

.qtip-resource-info caption {
    font-weight: bold;
    margin-bottom: 1.5em;
}

.qtip-resource-info td.label {
    min-width: 6em;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
    text-align: right;
    font-weight: bold;
    color: rgb(232, 167, 36);
}

.qtip-resource-info td.value {
    padding-left: 1em;
    font-size: 0.9em;
}

.qtip-content a {
    color: #fff;
    text-decoration: underline;
}

div.qtip-backtypo-fixed {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(0, 0, 0, 0.3);
    max-width: 100% !important;
    font-size: 1.2em;
    position: fixed;
}

div.qtip-backtypo-fixed .qtip-content {
    background-color: #fff;
    position: absolute;
    bottom: 0;
    padding: 1.5em;
    -webkit-box-shadow: 0px -1px 6px rgba(0, 0, 0, 0.2);
    box-shadow: 0px -1px 6px rgba(0, 0, 0, 0.2);
    line-height: normal;
}

div.qtip-backtypo-fixed .qtip-content a {
    color: inherit;
    font-weight: bold;
}

div.qtip-backtypo-fixed .qtip-tip {
    display: none !important;
}

.qtip-backtypo-fixed .qtip-content .qtip-title {
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 0.5em;
    top: -0.5em;
}

.qtip-backtypo-fixed .qtip-content .qtip-close {
    position: absolute;
    top: 0;
    right: 0;
    border: 0;
    background-color: transparent;
    color: #666;
    font-size: 1.2em;
    padding: 0.2em;
}

.qtip-backtypo-fixed .qtip-content .qtip-title .qtip-close {
    padding: 0;
    height: 100%;
    vertical-align: middle;
    margin-top: -0.25em;
}

.qtip-tipsy .theme-list,
.qtip-tipsy .device-list {
    -webkit-column-count: 2;
    column-count: 2;
}

.qtip-tipsy .theme-list li,
.qtip-tipsy .device-list li,
.qtip-tipsy .font-size-selector .decr {
    cursor: pointer;
}

.qtip-tipsy .theme-list li:hover,
.qtip-tipsy .device-list li:hover,
.qtip-tipsy .font-size-selector .decr:hover,
.qtip-tipsy .font-size-selector .incr:hover {
    opacity: 0.8;
}

.qtip-tipsy .font-size-selector {
    padding: 10px;
}

.qtip-tipsy .font-size-selector .cur-size-lbl,
.qtip-tipsy .zoom-selector .cur-size-lbl {
    margin-left: 20px;
    margin-right: 20px;
    min-width: 38px;
    display: inline-block;
    text-align: center;
}

.qtip-tipsy .font-size-selector .incr,
.qtip-tipsy .font-size-selector .decr {
    cursor: pointer;
}

.qtip-tipsy .font-size-selector .incr:active,
.qtip-tipsy .font-size-selector .decr:active {
    opacity: 0.4;
}

.qtip-tipsy .font-size-selector .decr {
    font-size: 20px;
}

.qtip-tipsy .font-size-selector .incr {
    font-size: 28px;
}

/* /QTIP - END */

/* CODEMIRROR */

.CodeMirror-hints {

    padding: 0.5em !important;
    -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, .2) !important;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, .2) !important;
    min-width: 10em;
    border: 0px none !important;
    border-radius: 0.5em !important;
    background: #333 !important;
    background: rgba(51, 51, 51, 0.9) !important;
    color: #fff !important;
    font-size: 0.9em !important;
    font-family: monospace;
    max-height: 20em;
    overflow-y: auto;
}

.CodeMirror-hint {
    margin: 0;
    padding: 0 4px;
    border-radius: 2px;
    max-width: 19em;
    overflow: hidden;
    white-space: pre;
    color: #fff !important;
    cursor: pointer;
}

.CodeMirror-hint-active {
    background: #f92672 !important;
    color: #fff;
}

/* COURTESY */

#courtesy-title,
#courtesy-message {
    width: 100%;
    text-align: center;
}

/* MESSAGE BANNER */


#main-banner {
    position: absolute;
    bottom: -2px;
    width: 100%;
    text-align: center;
    color: rgb(255, 71, 0);
    font-size: 0.9em;
    font-weight: bold;
}

#main-banner .fa,
#main-banner .far {
    cursor: pointer;
    margin-right: 1em;
}

.bt-banner {
    padding-left: 40px;
    padding-right: 40px;
    margin-bottom: 20px;
}

.bt-banner>div {
    position: relative;
    padding: 20px;
    border-radius: 4px;
}

.bt-banner.green-banner>div {
    background-color: #a4e0d4;
    color: #384d49;
}

.bt-banner .icon-box .img-container {
    margin-bottom: 0;
}

.bt-banner .close-banner {
    position: absolute;
    right: 20px;
    top: 20px;
    cursor: pointer;
    font-size: 22px;
}

/* SCREENSHOT VIEWER */

#theme_descr {
    position: absolute;
    top: 30px;
    right: -200px;
    max-width: 180px;
    height: 160px;
    color: #444;
    font-style: italic;
}

#screenshots_viewer {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 10000;
    background-color: rgba(0, 0, 0, 0.8);
}

#screenshots {
    position: absolute;
    width: 460px;
    height: 100%;
    margin: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    list-style-position: inside;
    list-style-type: none;
    padding: 0;
    margin: auto;
    margin-top: 15px;
}

#screenshots>div {
    text-align: center;
}

a.slidesjs-navigation {
    color: #fff;
    font-size: 2em;
    font-weight: bold;
    display: block;
    position: fixed;
    top: 50%;
    margin-top: -1em;
    text-decoration: none;
}

a.slidesjs-previous {
    left: 30px;
}

a.slidesjs-next {
    right: 30px;
}

.slidesjs-pagination-item {
    display: inline-block;
    margin-right: 3px;
}

.slidesjs-pagination-item a {
    text-decoration: none;
    display: inline-block;
    color: transparent;
    background-color: transparent;
    border: 1px solid #fff;
    width: 14px;
    height: 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    border-radius: 7px;
    -moz-border-radius: 7px;
    -ms-border-radius: 7px;
}

.slidesjs-pagination-item a.active {
    background-color: #fff;
}

ul.slidesjs-pagination {
    margin: 0;
    margin-top: 1em;
    list-style-position: inside;
    padding: 0;
    text-align: center;
}

#screenshots_viewer .preview-loader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    color: #fff;
    pointer-events: none;
}

#screenshots_viewer .preview-loader .fa-spin {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -0.5em;
    margin-left: -0.5em;
}

#screenshots_viewer .preview-loader .loader-message {
    position: absolute;
    top: 50%;
    margin-top: 2em;
    width: 100%;
    text-align: center;
    left: 0;
    right: 0;
    font-weight: bold;
    font-style: italic;
}

/* /SCREENSHOT VIEWER - END */

/* USER AVATAR */

.user-avatar {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #fff;
    line-height: 20px;
    vertical-align: middle;
}

.user-avatar.medium,
.bt-tab-box .user-avatar  {
    width: 30px;
    height: 30px;
    line-height: 30px;
}

.user-avatar span {
    line-height: 20px;
    letter-spacing: 0;
}

.user-avatar.medium span {
    line-height: 30px;
    font-size: 15px;
}

.user-avatar.medium span {
    line-height: 30px;
    font-size: 15px;
}

.user-avatar.big {
    width: 100px;
    height: 100px;
    line-height: 100px;
}

.user-avatar.big .avatar-icon {
    font-size: 58px;
}

span.user-avatar {
    display: inline-block;
}

/* /USER AVATAR - END */

/* WARNING BAR */

#warning-bar,
.top-bar {
    width: 100%;
    background-color: rgb(255, 0, 68);
    color: #fff;
    font-size: 0.95em;
    font-weight: bold;
    text-align: center;
    padding: 0.3em 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    min-height: 30px;
    -webkit-animation-name: warning-bar-bgcolor;
    animation-name: warning-bar-bgcolor;
    -webkit-animation-duration: 800ms;
    animation-duration: 800ms;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
    animation-direction: alternate;
    position: fixed;
    z-index: 10000;
}

#warning-bar.hidden,
.top-bar.hidden {
    display: none;
}

#warning-bar>div,
.top-bar>div {
    position: relative;
    padding: 0 40px;
}

#warning-bar:not(.hidden)+#ebook-authoring-header,
.top-bar:not(.hidden)+#ebook-authoring-header {
    top: 30px !important;
}

#warning-bar+#ebook-authoring-header .open-side-nav-btn,
.top-bar+#ebook-authoring-header .open-side-nav-btn {
    margin-top: 30px;
}

#warning-bar~#main,
.top-bar~#main {
    padding-top: 130px !important;
}

#warning-bar~#main #book-map,
.top-bar~#main #book-map {
    top: 108px !important;
}

#warning-bar~#main #book-map>h1,
.top-bar~#main #book-map>h1 {
    border-top: 110px solid #fff !important;
}

#warning-bar~#main #book-map #close-map-btn,
.top-bar~#main #book-map #close-map-btn {
    top: 130px !important;
}

#warning-bar~#main #theme-chooser,
.top-bar~#main #theme-chooser {
    padding-top: 110px !important;
}

#warning-bar~#main #theme-chooser-header,
#warning-bar~#main #theme-preview-container,
.top-bar~#main #theme-chooser-header,
.top-bar~#main #theme-preview-container {
    top: 110px !important;
}

#warning-bar .icon-wrapper,
.top-bar .icon-wrapper {
    margin-right: 0.5em;
}

#wrapper-bar .message,
.top-bar .message {
    vertical-align: middle;
}

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

    #wrapper-bar .message,
    .top-bar .message {
        font-size: 13px;
    }

}

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

    #warning-bar,
    .top-bar {
        position: static;
        margin-top: 78px;
        z-index: 0;
    }

    #warning-bar+#ebook-authoring-header .open-side-nav-btn,
    .top-bar+#ebook-authoring-header .open-side-nav-btn {
        margin-top: 0;
    }

    #warning-bar+#ebook-authoring-header,
    .top-bar+#ebook-authoring-header {
        top: 0 !important;
    }

    #warning-bar~#main,
    .top-bar~#main {
        padding-top: 30px !important;
    }

    #warning-bar>div,
    .top-bar>div {
        padding: 0 30px 0 20px;
    }

}

@media only screen and (min-width: 681px) and (max-width: 1100px) {

    :not(.public-page)>#warning-bar~#main,
    :not(.public-page)>.top-bar~#main {
        padding-top: 160px !important;
    }

    :not(.public-page)>.top-nav {
        top: 76px;
        /* 106 */
    }
}

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

    :not(.public-page)>.top-nav {
        position: relative;
        top: 0;
    }
}

#warning-bar .username,
.top-bar .username {
    text-decoration: underline;
}

#warning-bar button,
.top-bar button {
    background-color: rgb(155, 0, 28, 0.7);
    vertical-align: middle;
    margin-left: 1em;
    margin-top: -3px;
}

.top-bar.promo-bar {
    background-color: #C850C0;
    background-image: linear-gradient(43deg, #C850C0 0%, #FFCC70 100%);
}

.top-bar.promo-bar .fa {
    color: #fff;
}

.top-bar.promo-bar .message {
    color: #fff;
}

.top-bar.promo-bar a * {
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.top-bar .close-bar-btn,
#warning-bar .close-bar-btn {
    float: right;
    padding: 2px 4px;
    border-radius: 50%;
    display: inline-block;
    line-height: 17px;
    cursor: pointer;
    margin-left: 10px;
    position: absolute;
    right: 10px;
    top: 0;
}

.top-bar.promo-bar a *:hover,
.top-bar .close-bar-btn:hover,
#warning-bar .close-bar-btn:hover {
    color: #000;
}

@-webkit-keyframes warning-bar-bgcolor {
    from {
        background-color: rgb(255, 0, 68);
    }

    to {
        background-color: rgb(250, 80, 80);
    }
}

@keyframes warning-bar-bgcolor {
    from {
        background-color: rgb(255, 0, 68);
    }

    to {
        background-color: rgb(250, 80, 80);
    }
}

/* /WARNING BAR - END */

/* TUTORIALS */

div#backtypo-tutorials-overlay {
    background-color: rgba(0, 0, 0, 0);
    pointer-events: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 99999999999999;
}

.tutorial-tip-content {
    font-size: 1.1em;
    font-family: 'PT Sans', 'sans serif';
    line-height: 1.3;
}

.tutorial-tip-text {
    padding: 0.3em;
}

.tutorial-tip-actions {
    padding: 0.3em;
    text-align: right;
    border-top: 1px solid #ccc;
    margin-top: 0.5em;
}

span.tutorial-tip-done {
    text-transform: uppercase;
    color: rgb(0, 168, 255);
    cursor: pointer;
}

.backtypo-tutorials-hightlighted {
    background-color: rgb(0, 168, 255) !important;
}

/* DATA PAGE */

.data-page {
    text-align: center;
    margin-bottom: 60px;
    padding-left: 40px;
    padding-right: 40px;
}

.data-page h1 {
    font-weight: bold;
    margin-top: 40px;
}

.data-page h2 {
    color: #000;
    font-size: 24px;
    font-weight: normal;
    font-style: normal;
    text-align: left;
    text-transform: none;
    margin-top: 0;
    margin-bottom: 1em;
}

.data-page section h2 {
    width: 300px;
    margin-left: 190px !important;
}

.data-page .twocol {
    margin: auto;
    display: block;
    width: 800px;
    margin-bottom: 40px;
}

.data-page .two-col-1,
.data-page .two-col-2 {
    margin: 0;
    display: inline-block;
    vertical-align: top;
}

.data-page .two-col-1 {
    width: 240px;
}

.data-page .two-col-2 {
    width: 540px;
}

.data-page .cover-preview-container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
    position: relative;
    margin-top: 4px;
}

#print-settings .cover-preview-container {
    width: 240px;
    height: 180px;
}

#bundler-dialog .book-cover.print-cover {
    width: 240px;
    max-width: 170px;
    height: 115px;
    margin: 50px 0;
}


.data-page .actions-container {
    margin-top: 15px;
    margin-bottom: 15px;
}

.data-page .cover-preview {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0;
    -moz-opacity: 0;
    -webkit-transition: opacity 0.1s;
    -webkit-transition: opacity 0.3s;
    transition: opacity 0.3s;
    border-radius: 4px;
}

.data-page .cover-preview.visible {
    opacity: 1 !important;
}

.data-page form {
    text-align: left;
}

.data-page .label,
#bundler-dialog #fxl-options.download-options .label {
    color: #808080;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    height: 18px;
    display: block;
}

#bundler-dialog #fxl-options.download-options [type="checkbox"] + .label,
#bundler-dialog #fxl-options.download-options [type="checkbox"] {
    display: inline;
    vertical-align: middle;
}

.data-page .label span,
#bundler-dialog #fxl-options.download-options .label span {
    vertical-align: middle;
}

#bundler-dialog #fxl-options.download-options div.format-scale {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
    justify-content: space-between;
}

#bundler-dialog #fxl-options.download-options div.format-scale.hidden {
    display: none;
}

#bundler-dialog #fxl-options.download-options output {
    vertical-align: middle;
    flex: 2;
}

#bundler-dialog #fxl-options.download-options div.format-scale .format-scale-field {
    vertical-align: middle;
    min-width: 4em;
}

#bundler-dialog #fxl-options.download-options div.format-scale .unit {
    vertical-align: middle;
}

#bundler-dialog .fxl-pixel-limit-warning {
    color: #b94a00;
    background: #fff3e0;
    border: 1px solid #ffe0b2;
    border-radius: 4px;
    padding: 6px 8px;
    margin-top: 6px;
    font-size: 0.85em;
    line-height: 1.3;
}

#bundler-dialog .fxl-pixel-limit-warning .fas {
    margin-right: 4px;
}

#bundler-dialog .fxl-pixel-limit-warning.hidden {
    display: none;
}

.data-page fieldset {
    margin-bottom: 20px;
}

.data-page .bt-tab-panel:last-child fieldset:last-child,
.data-page .bt-tab-box>div:last-child>fieldset:last-child {
    margin-bottom: 0;
}

.data-page fieldset[data-name="author_picture"] {
    text-align: center;
}

.data-page .flex-3 fieldset {
    margin-bottom: 0;
}

.data-page .bt-tab-box.flex-2,
.data-page .bt-tab-box.flex-3,
.data-page .bt-tab-box.flex-4 {
    text-align: center;
}

.data-page ul select {
    -webkit-appearance: button;
    -moz-appearance: none;
    appearance: none;
    text-indent: 0.01px;
    text-overflow: '';
}

.data-page .inputtext,
.data-page select,
.data-page input[type=number],
#new-cover-wizard input[type=number],
#new-cover-wizard select,
#new-cover-wizard input[type=text] {
    width: 300px;
    height: 29px;
    background-color: #fff;
    color: #000;
    font-family: 'Roboto', sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    line-height: 27px;
    letter-spacing: 0.05em;
    border-radius: 5px;
    border: 1px solid #000;
    outline: none;
    white-space: pre;
    padding: 0 0.5em;
    margin: 6px 0;
}

#new-cover-wizard input[name="spine_size"] {
    width: 60px;
    display: inline-block;
}

#new-cover-wizard fieldset {
    margin-bottom: 10px;
    padding-right: 10px;
}

#new-cover-wizard fieldset h5,
#new-cover-wizard .inputs-group h5 {
    margin-bottom: 0;
    font-size: 12px;
}

.data-page input[type=number] {
    text-align: right;
}

.data-page output {
    display: block;
}

.data-page output[name="email"] {
    text-align: left;
}

.data-page .bt-tab-panel>.flex-2.bt-tab-box .label,
.data-page .bt-tab-panel>.flex-3.bt-tab-box .label,
.data-page .bt-tab-panel>.flex-4.bt-tab-box .label {
    margin-bottom: 8px;
}

.data-page input[disabled],
.data-page select[disabled],
.data-page textarea[disabled],
.data-page select[disabled]+span:before {
    opacity: 0.6 !important;
}

.data-page textarea.inputtext {
    padding-top: 5px;
    min-height: 100px;
    vertical-align: top;
    max-width: 300px;
    overflow-x: hidden;
    white-space: normal;
    overflow-y: auto;
}

.data-page .value span.fa-sort {
    position: absolute;
    right: 1px;
    top: 7px;
    vertical-align: middle;
    background-color: #FFF;
    height: 27px;
    line-height: 27px;
    width: 17px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    padding-right: 10px;
    pointer-events: none;
    cursor: pointer;
}

.data-page .checkbox {
    margin-left: 200px;
}

.data-page .checkbox-label {
    width: auto;
    margin-right: 0;
    margin-left: 10px;
    margin-bottom: 10px;
}

.data-page .value {
    text-align: center;
    display: inline-block;
    position: relative;
}

.data-page .big-value {
    /* @new */
    font-size: 24px;
}

.data-page .left-value {
    text-align: left;
    padding-left: 20%;
}

.data-page .value.textarea-container,
.data-page .value.textarea-container>textarea {
    width: 100%;
    text-align: left;
}

.data-page .value.textarea-container>textarea {
    max-width: 800px;
}

.data-page h3 {
    margin-top: 0;
    margin-bottom: 15px;
    letter-spacing: 0.1em;
    font-size: 1.4em;
}

.data-page h4 {
    font-size: 1.3em;
    margin-bottom: 15px;
    letter-spacing: 0.05em;
}

.data-page .disabled {
    height: 29px;
    display: inline-block;
}

.data-page .missing {
    border-color: rgb(215, 31, 38) !important;
}

.data-page .value input~span.fa-asterisk,
.data-page .value select~span.fa-asterisk,
.data-page .label span.fa-asterisk,
.data-page .label span.fa-asterisk {
    padding-left: 0.5em;
    vertical-align: super;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 0.7em;
}

.data-page .value input.missing~span.fa-asterisk,
.data-page .value select.missing~span.fa-asterisk,
.data-page .missing>.label span.fa-asterisk,
.data-page .missing>.label span.fa-asterisk {
    display: inline-block;
    color: rgb(215, 31, 38);
}

.data-page>div>div {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.data-page input[type="checkbox"] {
    margin-right: 0.5em;
}

#ebook-data.data-page>div:first-child>div,
#ebook-data .page-heading,
.data-page>div:first-child>div {
    max-width: 1000px;
}

.data-page fieldset p {
    color: #999;
    font-size: 16px;
    margin-top: 8px;
    margin-bottom: 8px;
}

.data-page .google-status-descr {
    padding-right: 10px;
}

/* Theme tab - DATA PAGE */

.data-page .theme-container {
    padding-right: 20px;
}

.data-page .theme-container>div {
    max-width: 338px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    background-color: #fff;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid #ddd;
}

.data-page .theme-details h4 {
    text-transform: uppercase;
    color: #939292;
    letter-spacing: 0.1em;
}

.data-page .theme-details h3 {
    margin-top: 10px;
    text-transform: capitalize;
}

#ebook-actions,
#theme-actions {
    margin-top: 15px;
}

#theme #theme-actions button {
    margin-right: 8px;
}

#theme-actions .small-button {
    margin-bottom: 0.5em;
}

.data-legend {
    text-align: left;
    color: #808080;
}

.product-print-status+.data-legend {
    margin-top: 20px;
}

.data-legend .fa-asterisk {
    font-size: 9px;
    margin-right: 0.5em;
    vertical-align: top;
}

.inputtext.inputtext-md {
    max-width: 230px;
    margin-right: 8px;
}

.inputtext.inputtext-sm {
    max-width: 63px;
}

/* /Theme tab - DATA PAGE - END */

/* /DATA PAGE - END */

/* PRINT PAGE */

.print-version .usage-type.certified-tag,
.print-version.certified .usage-type.personal-use-tag {
    display: none;
}

.print-version.certified .usage-type.certified-tag {
    display: block;
}

/*.print-version .usage-type { REMOVED - WRITE 4.0
padding: 2px 6px;
border-radius: 4px;
opacity: 0.8;
}*/

/*.print-version .usage-type span:first-child {
font-size: 12px;
font-family: 'Open Sans', sans-serif;
font-weight: bold;
letter-spacing: 1px;
}*/

.print-version .usage-type span:first-child::first-letter,
#print-settings .usage-type span:first-child::first-letter {
    text-transform: uppercase;
}

.print-version .usage-type span,
#print-settings .usage-type span {
    display: inline-block;
    vertical-align: middle;
    line-height: 16px;
    color: #fff;
}

.print-version .usage-type .fa,
#print-settings .usage-type .fa,
.print-version .usage-type .far,
#print-settings .usage-type .far {
    margin-left: 4px;
    opacity: 0.6;
    font-size: 16px;
    cursor: pointer;
}

.print-version .usage-type .fa:hover,
#print-settings .usage-type .fa:hover,
.print-version .usage-type .far:hover,
#print-settings .usage-type .far:hover {
    opacity: 1;
}

.print-version .usage-type.personal-use-tag>span,
#print-settings .usage-type.personal-use-tag>span {
    background-color: #ccc;
}

.print-version .usage-type.certified-tag>span,
#print-settings .usage-type.certified-tag>span {
    color: #fff;
    background-color: #22b573;
}

/* /PRINT PAGE - END */

/* FLOATING ACTIONS */

.floating-actions {
    width: 100%;
    text-align: right;
    display: none;
}

.bt-fab {
    height: 56px;
    width: 56px;
    background-color: rgb(232, 167, 36);
    color: #fff;
    border-radius: 50%;
    -webkit-box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12);
    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12);
    position: fixed;
    z-index: 1000;
}

.floating-actions.floating-bottom .bt-fab {
    right: 16px;
    bottom: 16px;
}

.bt-fab:hover,
.bt-fab:active {
    opacity: 1;
    outline: none;
}

.bt-fab .fa,
.bt-fab .far {
    font-size: 24px;
}

.bt-fab .fa:before,
.bt-fab .far:before {
    height: 24px;
    line-height: 24px;
    margin-top: 2px;
    display: block;
}

.fa.bt-mini-fab,
.far.bt-mini-fab {
    font-size: 24px;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    margin-right: 8px;
    margin-left: 12px;
    margin-bottom: 8px;
    margin-top: 8px;
    border-radius: 50%;
    color: #fff;
    background-color: #000;
    -webkit-box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12);
    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, .2), 0 6px 10px 0 rgba(0, 0, 0, .14), 0 1px 18px 0 rgba(0, 0, 0, .12);
    display: inline-block;
    vertical-align: middle;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.floating-actions-list li>a:active .bt-mini-fab,
.floating-actions-list li>a:active .button {
    background-color: rgb(39, 39, 39) !important;
    opacity: 1;
}

.bt-fab:hover,
.floating-actions-list li>a:hover .bt-mini-fab {
    -webkit-box-shadow: 0 4px 8px -1px rgba(0, 0, 0, .3), 0 8px 16px 0 rgba(0, 0, 0, .16), 0 1px 28px 0 rgba(0, 0, 0, .14);
    box-shadow: 0 4px 8px -1px rgba(0, 0, 0, .3), 0 8px 16px 0 rgba(0, 0, 0, .16), 0 1px 28px 0 rgba(0, 0, 0, .14);
}

.bt-fab:active,
.floating-actions-list li>a:active .bt-mini-fab {
    -webkit-box-shadow: 0 6px 10px -2px rgba(0, 0, 0, .4), 0 12px 20px 0 rgba(0, 0, 0, .18), 0 2px 36px 0 rgba(0, 0, 0, .16);
    box-shadow: 0 6px 10px -2px rgba(0, 0, 0, .4), 0 12px 20px 0 rgba(0, 0, 0, .18), 0 2px 36px 0 rgba(0, 0, 0, .16);
}

.floating-actions-list .button.small-button {
    min-width: 140px;
}

.floating-actions-list {
    position: fixed;
    z-index: 1000;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.8);
    -webkit-transition: opacity 0.8s;
    transition: opacity 0.8s;
    top: 0;
    left: 0;
    margin-top: 0;
    opacity: 0;
    pointer-events: none;
}

.floating-actions-list.floating-actions-list-show {
    display: block;
    text-align: right;
    padding-top: 76px;
    opacity: 1;
    pointer-events: all;
}

.floating-actions-list ul {
    position: absolute;
    bottom: 80px;
    right: 16px;
}

/* /FLOATING ACTIONS - END */

/* SEARCH BAR */

.bt-search-bar {
    display: inline-block;
    height: 60px;
    line-height: 60px;
    margin-right: 20px;
    position: relative;
    overflow: hidden;
    vertical-align: middle;
}

.bt-search-bar input {
    font-family: 'Roboto', sans-serif;
    letter-spacing: 0.05em;
    height: 35px;
    font-size: 16px;
    padding-left: 8px;
    padding-right: 45px;
    min-width: 300px;
    border-radius: 10px;
    -webkit-box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.05);
    box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.05);
    background-color: #eee;
    -webkit-appearance: textfield;
    appearance: textfield;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.bt-search-bar input:hover {
    background-color: #e8e8e8;
}

.bt-search-bar input:focus {
    background-color: #f9f9f9;
    -webkit-box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15) inset;
    box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.15) inset;
    border-right: none;
    border-bottom: none;
}

.bt-search-bar button {
    height: 35px;
    width: 45px;
    min-width: 45px;
    letter-spacing: 0;
    background-color: transparent;
    font-size: 16px;
    vertical-align: middle;
    display: inline-block;
    position: absolute;
    right: 0;
    top: 13px;
    color: #aaa;
}

.bt-search-bar button:hover {
    color: rgb(78, 78, 78)
}

.bt-search-bar input:focus::-webkit-input-placeholder {
    color: rgb(232, 167, 36);
}

.bt-search-bar input:focus:-ms-input-placeholder {
    color: rgb(232, 167, 36);
}

.bt-search-bar input:focus::placeholder {
    color: rgb(232, 167, 36);
}

#search-book-field::-webkit-calendar-picker-indicator {
    display: none;
}

/* /SEARCH BAR - END */

/* BACKTYPO CONTAINERS AND HEADING */

.bt-header-container {
    text-align: center;
}

.bt-header-container h1 {
    font-family: 'Roboto', sans-serif;
    font-size: 1.7em;
    text-transform: none;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.05em;
}

.bt-header-container h1::first-letter {
    text-transform: uppercase;
}

.bt-big-container {
    overflow-y: auto;
}

.bt-big-container section {
    margin-bottom: 20px;
}

.bt-big-container h2 {
    font-weight: 300;
    font-size: 1.3em;
    text-align: center;
    margin-bottom: 20px;
}

/* /BACKTYPO CONTAINERS AND HEADING - END */

/* BACKTYPO TABS */

.bt-tabs {
    text-align: left;
}

#revision-changes.bt-tabs {
    border: 2px solid #ddd;
    border-radius: 4px;
}

.bt-tabs .bt-tabs-nav li {
    color: #4d4d4d;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    vertical-align: middle;
    display: inline-block;
    padding-right: 16px;
    opacity: 0.3;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer;
}

#revision-changes.bt-tabs .bt-tabs-nav li {
    border-right: 2px solid #ddd;
    min-height: 34px;
    line-height: 34px;
    padding: 10px 16px 10px 10px;
}

.bt-tabs .bt-tabs-nav li.current,
.bt-tabs .bt-tabs-nav li:hover {
    opacity: 1;
}

#revision-changes.bt-tabs .bt-tabs-nav,
#revision-changes.bt-tabs .bt-tabs-content li.revision-change {
    border-bottom: 2px solid #ddd;
}

.bt-tabs .bt-tabs-content li.revision-change:last-child {
    border-bottom: none;
}

.bt-tabs .bt-tabs-content li.revision-change {
    padding: 10px;
    position: relative;
}

.change-details li {
    padding-left: 1em;
}

.change-details li span {
    cursor: pointer;
}

.tab-icon {
    margin-right: 6px;
    background-color: #4d4d4d;
    color: #fff;
    font-size: 16px;
    height: 30px;
    line-height: 30px;
    vertical-align: middle;
    text-align: center;
    width: 30px;
    border-radius: 50%;
    display: inline-block;
}

.bt-tab-panel,
.bt-tab-panel.flex-container {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 20px 0 0;
    margin-left: -8px;
    margin-right: -8px;
    display: none;
}

.bt-tab-panel.active,
.bt-tab-panel.flex-container.active {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.tab-title {
    padding: 0 8px;
}

.bt-tab-box {
    min-height: 100px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 20px;
    padding: 0 8px;
}

.bt-tab-box.flex-1:last-child {
    margin-bottom: 0;
}

.bt-tab-box>div {
    background-color: #F2F2F2;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 2px rgba(181, 181, 181, 0.4);
    box-shadow: 0 1px 2px rgba(181, 181, 181, 0.4);
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    position: relative;
    padding: 40px 16px;
}

.flex-3.bt-tab-box>div,
.flex-2.bt-tab-box>div,
.flex-4.bt-tab-box>div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.bt-tab-box fieldset .actions {
    margin-top: 5px;
}

#accessibility .bt-tab-box>div>div:not(:last-child) {
    margin-bottom: 20px;
}

.bt-tab-box .accessibility-report {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.bt-tab-box .accessibility-report .value {
    text-align: left !important;
}

.collaborators-list {
    margin-top: 15px;
    text-align: left;
}

.collaborator-item span, .collaborator-item div {
    display: inline-block;
}

.collaborator-item {
    margin-right: 10px;
    background-color: #ddd;
    display: inline-block;
    padding: 3px;
    border-radius: 36px;
    margin-bottom: 10px;
}

.collaborator-item.btn {
    cursor: pointer;
}

.collaborator-item .button {
    cursor: inherit;
}

.collaborator-item span span {
    color: #808080;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.collaborator-item span span:first-child {
    margin-right: 5px;
}

.collaborator-item span .fa {
    font-size: 14px;
    margin-right: 4px;
}

.collaborator-item:hover >span span {
    color: rgb(215, 31, 38);
}

@media only screen and (min-width: 451px) {
    
    .bt-tab-box .accessibility-report {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
    }

    .bt-tab-box .accessibility-report>fieldset {
        padding-right: 20px;
    }

    .bt-tab-box .accessibility-report>fieldset:not(:last-child) {
        border-right: 2px solid #ccc;
    }

    .bt-tab-box .accessibility-report>fieldset:not(:first-child) {
        padding-left: 20px;
    }

    
}

/* /BACKTYPO TABS - END */

/* PAGE DISABLER */

#bt-page-disabler {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    z-index: 99999999999999999999;
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
}

#bt-page-disabler .disabler-content {
    position: absolute;
    text-align: center;
    width: 100%;
}

#bt-page-disabler .message {
    margin-top: 1em;
    font-style: italic;
}

/* /PAGE DISABLER - END */

/* WARNING BOX */

.warning-box {
    position: relative;
    padding: 20px 20px 0 40px;
    margin-bottom: 20px;
}

.warning-box .warning-icon {
    position: absolute;
    font-size: 34px;
    color: #ff9f56;
    left: 0;
}


.warning-box.tips-box .warning-icon {
    color: #e8a724;
}

.warning-box.tips-box .warning-content {
    text-align: left;
    font-size: 0.9em;
}

.warning-box h3 {
    text-align: left;
    display: inline;
}

.warning-box p {
    display: inline;
}

.warning-content>div {
    margin-bottom: 8px;
}

.warning-box .warning-content input[type="checkbox"],
.warning-box .warning-content input[type="checkbox"]+label {
    vertical-align: middle;
    cursor: pointer;
    color: #6d6d6d;
}

.warning-box .warning-content input[type="checkbox"]:checked,
.warning-box .warning-content input[type="checkbox"]:checked+label {
    color: #333;
}

.status-content .warning-box {
    margin-top: 20px;
}

/* WARNING BOX - END */

/* FLEX CONTAINER */

.flex-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.flex-col {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.flex-space-a {
    -ms-flex-pack: distribute;
    justify-content: space-around;
}

.flex-space-b {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.flex-space-c {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.flex-space-e {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.flex-centered {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.flex-1,
.flex-2,
.flex-3,
.flex-4,
.flex-3-4 {
    width: 100%;
}

.flex-grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -8px;
    margin-left: -8px;
}

.flex-grid.flex-grid-4>div {
    width: 25%;
    padding: 8px;
}

.flex-grid.flex-grid-3>div {
    width: 33.333%;
    padding: 8px;
}

.flex-grid.flex-grid-3>div.flex-1 {
    width: 100%;
}

.flex-wrap {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.justify-start,
.bt-tab-box>div.justify-start {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.flex-alternate>div:nth-child(even) {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
}

/* /FLEX CONTAINER - END */

/* CUSTOMIZED INPUTS */

.inputs-group {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 450px;
    margin: 20px auto;
}

.inputs-group h5 {
    font-size: 14px;
    text-transform: uppercase;
    text-align: left;
    max-width: 130px;
}

.checkbox-field,
.radio-button-field {
    position: relative;
    overflow: hidden;
}

.radio-button-field {
    display: inline-block;
    margin-right: 8px;
    min-width: 150px;
    text-align: left;
}

.radio-button-field:last-child {
    margin-right: 0;
}

.radio-button-field.centered {
    text-align: center;
}

.checkbox-field label,
.radio-button-field label {
    position: relative;
    cursor: pointer;
    font-weight: bold;

}

.checkbox-field label {
    padding-left: 24px;
    font-size: 18px;
    text-transform: none;
}

.radio-button-field label {
    padding-left: 38px;
    font-size: 13px;
    height: 34px;
    line-height: 34px;
    display: inline-block;
    vertical-align: middle;
}

.checkbox-field label span::-moz-selection,
.radio-button-field label span::-moz-selection {
    background-color: transparent;
}

.checkbox-field label span::selection,
.radio-button-field label span::selection {
    background-color: transparent;
}

.dialog-section .checkbox-field label,
.dialog-section .radio-button-field label {
    color: #808080;
}

.checkbox-field input[type="checkbox"],
.radio-button-field input[type="radio"] {
    position: absolute;
    left: -99999px;
}

.checkbox-field .icon-checked,
.radio-button-field .icon-checked {
    display: none;
}

.checkbox-field input:checked+label .icon-unchecked,
.radio-button-field input:checked+label .icon-unchecked {
    display: none;
}

.checkbox-field input:checked+label .icon-checked,
.radio-button-field input:checked+label .icon-checked {
    display: block;
}

.checkbox-field input:disabled+label,
.radio-button-field input:disabled+label {
    opacity: 0.5;
}

.check-icon-container {
    position: absolute;
    left: 0;
}

.checkbox-field .check-icon-container {
    padding: 2px;
    width: 20px;
    height: 20px;
}

.radio-button-field .check-icon-container {
    padding: 2px;
    width: 34px;
    height: 34px;
}

.check-icon-container .fa,
.check-icon-container .far {
    position: absolute;
    left: 0;
}

.radio-button-field .check-icon-container .fa,
.radio-button-field .check-icon-container .far {
    right: 0;
    font-size: 30px;
    color: #4D4D4D;
    padding-left: 1px;
}

.radio-button-field .check-icon-container .fa-circle,
.radio-button-field .check-icon-container .fa-dot-circle {
    font-weight: 300;
}

.radio-button-field input:disabled+label .fa,
.radio-button-field input:disabled+label .far {
    color: inherit;
    opacity: 0.4;
}

.radio-button-field label[data-value="white"] .check-icon-container,
.radio-button-field label[data-value="cream"] .check-icon-container {
    width: 24px;
    height: 24px;
    border: 2px solid #4D4D4D;
    margin-top: 4px;
    text-align: center;
    left: 2px;
}

.radio-button-field label[data-value="white"] .fa,
.radio-button-field label[data-value="cream"] .fa,
.radio-button-field label[data-value="white"] .far,
.radio-button-field label[data-value="cream"] .far {
    font-size: 16px;
    margin-left: auto;
    margin-right: auto;
}

.radio-button-field label[data-value="white"] .check-icon-container {
    background-color: #fff;
}

.radio-button-field label[data-value="cream"] .check-icon-container {
    background-color: #FFF0B6;
}

.create-dialog select {
    line-height: 29px;
    border-width: 1px;
}

/* /CUSTOMIZED INPUTS - END */

/* BACKTYPO WIZARD */

.bt-wizard-nav,
.bt-wizard-footer {
    z-index: 2;
}

.bt-wizard-nav {
    -webkit-box-shadow: 15px 0 15px 20px #fff;
    box-shadow: 15px 0 15px 20px #fff;
}

.bt-wizard-footer {
    -webkit-box-shadow: -15px 0 15px 20px #fff;
    box-shadow: -15px 0 15px 20px #fff;
}

.bt-wizard-nav li {
    display: inline-block;
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    padding: 4px 0 4px 4px;
    letter-spacing: 0.05em;
}

.bt-wizard-nav li span {
    opacity: 0.4;
    display: inline-block;
    line-height: 18px;
    height: 18px;
}

.bt-wizard-nav li .current-step {
    opacity: 1;
}

.bt-wizard-nav li .fa,
.bt-wizard-nav li .far {
    margin-left: 8px;
    font-size: 21px;
}

.bt-wizard .button-icon {
    min-width: 100px;
}

.bt-wizard .button-icon.finish-btn {
    text-align: center;
    background-color: rgb(232, 167, 36) !important;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.bt-wizard-steps {
    overflow-x: hidden;
    overflow-y: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.bt-wizard-step {
    width: 100%;
    min-width: 100%;
    overflow-y: auto;
    padding-top: 20px;
    padding-bottom: 40px;
    max-height: calc(100vh - 200px);
}

.bt-wizard-step::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}

.bt-wizard-step::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background-color: rgba(0, 0, 0, .5);
    -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, .5);
}

.bt-wizard-step h4 {
    margin-top: 10px;
    margin-bottom: 20px;
}

/* /BACKTYPO WIZARD - END */

/* BACKTYPO SLIDE */

.bt-slide {
    position: relative;
    overflow: hidden;
}

.bt-slide-content {
    overflow-x: auto;
}

.bt-slide .slide-control {
    position: absolute;
    top: 0;
    bottom: 0;
}

.bt-slide .slide-control {
    position: absolute;
    height: 100%;
    width: 40px;
    background-color: #fff;
    font-size: 18px;
    display: block;
    border-radius: 0px;
    opacity: 0.8;
}

.bt-slide .prev-button {
    left: 0;
    -webkit-box-shadow: 0px 15px 15px 30px #fff;
    box-shadow: 0px 15px 15px 30px #fff;
}

.bt-slide .next-button {
    right: 0;
    -webkit-box-shadow: 0px -15px 15px 30px #fff;
    box-shadow: 0px -15px 15px 30px #fff;
}

.bt-slider-full-w .bt-slide-content > div {
    min-width: 100vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#highlight-section .bt-slide .slide-control {
    background-color: #faebd7;
}

#highlight-section .bt-slide .prev-button {
    -webkit-box-shadow: 0px 15px 15px 30px #faebd7;
    box-shadow: 0px 15px 15px 30px #faebd7;
}

#highlight-section .bt-slide .next-button {
    -webkit-box-shadow: 0px -15px 15px 30px #faebd7;
    box-shadow: 0px -15px 15px 30px #faebd7;
}

#highlight-section .bt-slide .slide-control {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding-top: 13px;
}

#highlight-section .bt-slide .slide-control span {
    padding: 5px 10px;
    background-color: #0000001a;
    border-radius: 8px;
    color: #0000006e;
}

#highlight-section .bt-slide .slide-control span:hover {
    color: #000;
}

#highlight-section .bt-slide .wrapped-lg {
    padding: 0 50px;
}

#highlight-section .bt-slide h2 {
    font-weight: 600;
    font-size: 22px;
}

#highlight-section .bt-slide img[src="/images/highlight-section/standalone-covers.png"] {
    max-width: 280px;
}

#highlight-section .bt-slide h3 {
    color: #787878;
    font-weight: 400;
    font-size: 20px;
}

.bt-slider-full-w .bt-slide-content {
    overflow-x: hidden ;
}

.bt-slider-full-w .hide-next-btn ~ .next-button,
.bt-slider-full-w .bt-slide-content ~ .prev-button {
    visibility: hidden;
}

.bt-slider-full-w .bt-slide-content.show-prev-btn ~ .prev-button {
    visibility: visible;
}

.bt-slide-pager {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 20px 40px 0;
}

.bt-slide-page-control.dot {
    width: 8px;
    height: 8px;
    margin: 3px;
    border-radius: 4px;
    display: inline-block;
    background-color: #000;
    opacity: 0.3;
    cursor: pointer;
}

.bt-slide-page-control.dot.current {
    opacity: 0.9;
}

.bt-slide-page-control.dot:hover {
    opacity: 0.7;
}

/* /BACKTYPO SLIDE - END */

/* GRID */

/* Grid actions and nav */

.grid-actions {
    padding: 20px 0 20px;
}

.grid-nav li span,
.grid-filters span,
.grid-filters select {
    color: #4d4d4d;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    margin-right: 16px;
    opacity: 0.3;
    cursor: pointer;
    letter-spacing: 0.05em;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.grid-nav li span:hover {
    opacity: 0.8;
}

.grid-nav li .active,
.grid-filters span,
.grid-filters select {
    opacity: 1;
}

.grid-nav li:last-child {
    margin-right: 0;
}

#themes-nav {
    /* TO CHANGE - WRITE 4.0.1 */
    display: none;
}

#themes-nav.grid-nav .flex-container {
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

#themes-nav.grid-nav .flex-container li {
    margin-bottom: 10px;
}

.grid-filters select {
    background-color: transparent;
    -webkit-appearance: none;
    appearance: none;
    color: #efac28;
    padding: 0;
    line-height: 1;
    width: auto;
}

.grid-filters select {
    color: #808080;
    font-family: 'Roboto', sans-serif;
}

.grid-filters select [selected] {
    color: #efac28;
}

.grid-filters .descending-order .fa-arrow-down,
.grid-filters .ascending-order .fa-arrow-up {
    display: inline-block;
}

.grid-filters .ascending-order .fa-arrow-down,
.grid-filters .descending-order .fa-arrow-up {
    display: none;
}

.grid-filters .order-button {
    background-color: #b3b3b3;
    color: #fff;
    border-radius: 4px;
    padding: 4px 8px;
}

.grid-filters .order-button span {
    color: #fff;
    margin-right: 0;
}

.grid-filters .select-container .fa,
.grid-filters .select-container .far {
    font-size: 16px;
}

/* /Grid actions and nav - END */

/* Grid main */

.grid .product>div,
.grid .create-product-box>div,
.grid .grid-item>div,
.grid .create-box>div {
    background-color: #F0F0F0;
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    min-height: 322px;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
    padding-bottom: 15px;
}

.grid .product,
.grid .grid-item {
    padding-bottom: 16px;
}

.grid .product>div,
.grid .grid-item>div {
    text-align: center;
    position: relative;
    border: 1px solid #d9d9d9;
}

.grid .create-product-box>div,
.grid .create-box>div {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.grid .create-first-book-label,
.grid .create-first-label {
    display: none;
}

.grid .create-first-book-label,
.grid .create-first-cover-label,
.grid.no-own-book .create-book-label,
.grid.no-own-book .create-cover-label,
.grid .create-first-label,
.grid.no-own .create-label {
    display: none;
}

.grid.no-own-book .create-first-book-label,
.grid.no-own .create-first-label {
    display: block;
}

.grid .create-product-box button,
.grid .create-box button {
    background-color: transparent;
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 100%;
    padding: 0 30px;
}

.grid .create-product-box button span:not(.fa),
.grid .create-box button span:not(.fa) {
    color: #4d4d4d;
    font-size: 14px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    white-space: normal;
}

.grid .create-product-box button .fa,
.grid .create-box button .fa,
.grid .create-product-box button .far,
.grid .create-box button .far {
    display: block;
    color: #999999;
    font-size: 42px;
    margin-top: 20px;
}

.grid .cover {
    display: block;
    margin: auto;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
}

.grid .cover:hover {
    -webkit-transform: translateZ(0) scale(1.04);
    transform: translateZ(0) scale(1.04);
}

.grid .product-info,
.grid-item-info {
    margin-top: 16px;
    padding: 0 16px;
}

.grid .product-icon,
.grid .product-info,
.grid .product-actions .grid .grid-item-icon,
.grid .grid-item-info,
.grid .grid-item-actions {
    display: inline-block;
    vertical-align: top;
}

.grid .product-icon,
.grid .grid-item-icon {
    overflow: hidden;
    border-radius: 4px 4px 0 0;
}

.grid .product-actions,
.grid .product-import-actions,
.grid .grid-item-actions {
    padding: 0 16px;
}

.project-tags,
.grid-item-tags {
    position: absolute;
    left: 8px;
    top: 8px;
    text-align: left;
}

.project-tags.project-tags-static,
.grid-item-tags.grid-item-tags-static {
    position: static;
    text-align: center;
}

.project-tags>div:not(.book-type)>span,
.grid-item-tags>div:not(.grid-item-type)>span,
#print-settings .usage-type>span {
    color: #999;
    background-color: #e5e5e5;
    border-radius: 2px;
    font-weight: bold;
    margin-top: 8px;
    max-width: 80px;
}

.project-tags.project-tags-static>div,
.grid-item-tags.grid-item-tags-static>div {
    display: inline-block;
    vertical-align: middle;
}

.project-tags .shared-tag,
.project-tags.project-tags-static>.shared-tag {
    display: none;
}

.product.shared .project-tags .shared-tag {
    display: inline-block;
}

.project-tags .sample-tag,
.project-tags.project-tags-static>.sample-tag {
    display: none;
}

.product.public .project-tags .sample-tag {
    display: inline-block;
}

.project-tags .sample-tag span,
.project-tags.project-tags-static>.sample-tag span {
    background-color: #39b54a;
    color: #fff;
}

.product.public .book-print-tag {
    display: none;
}

.project-tags .book-print-tag {
    cursor: pointer;
}

.project-tags .book-print-tag:hover span {
    color: rgb(232, 167, 36);
}

.project-tags>div>span,
.grid-item-tags>div>span {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 5px 8px;
    font-size: 13px;
    display: inline-block;
    line-height: 1.1em;
}

.project-tags.project-tags-static>div>span:not(.fa),
.grid-item-tags.grid-item-tags-static>div>span,
#print-settings .usage-type>span:not(.fa) {
    font-size: 12px;
    line-height: 0.9;
    max-width: none;
    letter-spacing: 0.1em;
    font-family: 'Roboto', sans-serif;
}

.project-tags .accessibility-icon {
    font-size: 18px;
    background-color: transparent !important;
    padding: 0 2px;
}

.project-tags .accessibility-icon.accessible-ebook {
    color: #39b54a;
}

.project-tags .accessibility-icon.not-accessible-ebook {
    color: rgb(215, 31, 38);
}

#print-settings .usage-type>span {
    margin-top: 0;
    padding: 5px 8px;
}

#print-settings .usage-type {
    float: right;
}

#print-settings .usage-type span.fa,
#print-settings .usage-type span.far {
    color: #fff !important;
}

.project-tags>div .versions-number,
.grid-item-tags>div .versions-number {
    color: #666;
}

.product-info .book-type,
.grid-item-info .grid-item-type {
    padding: 0;
    margin-top: 8px
}

.product-actions,
.grid-item-actions {
    margin-top: 20px;
}

.grid .action {
    background-color: transparent;
    font-family: 'Roboto', sans-serif;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0.1em;
    color: #939393;
    -webkit-appearance: none;
    appearance: none;
    text-transform: uppercase;
    -webkit-transition: none;
    transition: none;
}

.grid .action.cancel {
    color: rgb(215, 31, 38);
}

.grid .action:hover {
    color: rgb(232, 167, 36);
    opacity: 1;
}

.grid .action::before {
    content: '|';
    display: inline;
    margin-left: 0.5em;
    margin-right: 0.5em;
    color: #999;
}

.grid .action:first-child::before {
    display: none;
}

.grid .product-title,
.grid .grid-item-title {
    font-family: 'Roboto', sans-serif;
    font-size: 1.3em;
    text-transform: none;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.05em;
    margin-bottom: 6px;
    text-overflow: ellipsis;
    max-height: 3em;
    overflow-y: hidden;
    overflow-x: hidden;
    word-wrap: break-word;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.grid .product-title::first-letter,
.grid .grid-item-title::first-letter {
    text-transform: uppercase;
}

.grid .product-title.empty,
.grid .grid-item-title.empty {
    color: #aaa;
    font-style: italic;
}

.product-icon div.cover,
.grid-item-icon div.cover {
    position: relative;
    background-color: #fff;
    width: 100%;
    height: 150px;
    border: 0px none;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    outline: 0;
    display: inline-block;
    cursor: pointer;
}

.importing .product-icon div.cover.missing {
    background-image: url(/images/create_dialog_bg.png) !important;
    background-size: contain;
    opacity: 0.5;
}

.product-icon div.cover-overlay,
.grid-item-icon div.cover-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #fff;
    overflow: hidden;
    border-radius: inherit;
}

.importing div.cover-overlay {
    background-color: transparent;
}

.product-icon .cover-overlay .fa-spin,
.grid-item-icon .cover-overlay .fa-spin {
    color: rgb(136, 136, 136);
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -16px;
    margin-left: -14px;
}

/* /Grid main - END */

/* Small cards grid */

.small-cards-grid .grid-item>div,
.small-cards-grid .product>div {
    padding-left: 70px;
}

.small-cards-grid .product-icon,
.small-cards-grid .grid-item-icon {
    width: 70px;
    height: 96px;
    position: absolute;
    left: 1px;
    top: 1px;
    border-top-right-radius: 0;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 0;
}

.small-cards-grid .product-icon div.cover,
.small-cards-grid .grid-item-icon div.cover {
    height: 96px;
}

.small-cards-grid .product-info,
.small-cards-grid .product-actions {
    text-align: left;
    margin-top: 0;
    margin-bottom: 8px;
}

.small-cards-grid .product>div,
.small-cards-grid .create-product-box>div,
.small-cards-grid .grid-item>div,
.small-cards-grid .create-box>div {
    max-width: 100%;
    height: 100px;
    min-height: 100px;
    background-color: #F0F0F0;
    border-color: #fff;
    padding-top: 8px;
    padding-bottom: 8px;
}

.small-cards-grid .product-title,
.small-cards-grid .grid-item-title {
    margin-bottom: 0;
    font-size: 1.2em;
}

.small-cards-grid .button {
    min-width: 81px;
}

/* Small cards grid - END */

.covers-grid.products-grid {
    background-color: #f3f3f3;
    margin-top: 30px;
    padding-bottom: 30px;
}

.covers-list .product > div {
    background-color: rgb(223, 227, 239);
}

.covers-list .cover-type .type {
    color: #fff;
}

.covers-list .ebook-cover .cover-type .type {
    background-color: rgb(114, 112, 218);
}

.covers-list .print-cover .cover-type .type {
    background-color: rgb(95, 141, 225);
}

.product > div::before {
    content: '';
    width: 45px;
    height: 45px;
    font-size: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 10px;
    left: 10px;
    background-color: #ddd;
    color: #000;
    z-index: 1;
    border-radius: 4px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

.books-list .product > div::before {
    content: '\f518';
}

.covers-list .product > div::before {
    content: '\f02d';
}

/* /GRID - END */

/* LAYOUT WITH SIDEBAR */

.with-sidebar.right-sidebar>div:first-child {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-right: 40px;
}

.with-sidebar.left-sidebar>div:last-child {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-left: 40px;
}

.with-sidebar .sidebar {
    text-align: left;
    min-width: 260px;
    max-width: 320px;
}

.with-sidebar .sidebar,
.with-sidebar .sidebar a {
    color: #999;
}

.with-sidebar .sidebar a {
    font-weight: bold;
    font-size: 14px;
    font-style: italic;
}

.with-sidebar .sidebar a:hover {
    color: #e8a724;
}

.with-sidebar .sidebar ul {
    border-bottom: 2px solid #ccc;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.with-sidebar .sidebar ul:last-child {
    border-bottom: 0;
}

.with-sidebar .sidebar ul li {
    margin-bottom: 15px;
}

.with-sidebar .sidebar ul li:last-child {
    margin-bottom: 0;
}

.with-sidebar .sidebar .fa-info {
    width: 30px;
    text-align: center;
    height: 30px;
    line-height: 26px;
    border-radius: 50%;
    border: 2px solid #999;
    font-size: 16px;
    margin-right: 0.5em;
}

.with-sidebar .sidebar h3 {
    margin-top: 0;
    margin-bottom: 20px;
    text-transform: uppercase;
    font-size: 14px;
}

/* /LAYOUT WITH SIDEBAR - END */

/* DOWNGRADE PAGE */

.feature-list {
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 20px;
    margin-bottom: 20px;
}


.feature-list>li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 300px;
    text-align: left;
}

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

    .feature-list,
    .feature-list li,
    .feature-list li>div {
        display: block;
    }

    .feature-list li,
    .feature-list li>div {
        margin-left: auto;
        margin-right: auto;
        text-align: center;
    }

    .feature-list li {
        margin-bottom: 20px;
    }

}


.feature-list>li .feature-icon {
    font-size: 30px;
    padding: 8px;
    color: #999;
}

.feature-list>li .feature-icon.fa-check-circle {
    color: #22b573;
}

.feature-list .bt-storage-prog {
    margin-left: 0;
    padding: 8px;
}

.products-selection-list .product>div,
.products-select-mode .product>div {
    background-color: #fff;
    min-height: auto;
    overflow: hidden;
}

.products-selection-list .product-icon,
.products-selection-list .product-info,
.products-select-mode .product-icon, 
.products-select-mode .product-info {
    pointer-events: none;
}

.products-selection-list .product.checked>div,
.products-selection-list .product.checked .check-edge::after {
    border: 2px solid #22b573;
}

.product .check-action-name {
    display: none;
}

.products-selection-list .product .check-action-name {
    display: inline;
    position: absolute;
    top: 0;
    width: 100%;
    color: #999;
    z-index: 1;
    text-transform: uppercase;
}

.products-selection-list .product.checked .check-action-name {
    color: #22b573;
}

.product .check-edge {
    position: absolute;
    z-index: 1;
    background-color: #fff;
    padding: 8px 8px 0 0;
    right: 0;
    top: 0;
    display: none;
}

.products-selection-list .check-edge {
    display: block;
}

.product .check-edge>div {
    position: relative;
    z-index: 2;
}

.product .check-edge::after {
    content: '';
    width: 120px;
    height: 90px;
    display: block;
    position: absolute;
    top: -36px;
    right: -52px;
    background-color: #fff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    z-index: 1;
    border: 1px solid #d9d9d9;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.product .check-edge .disabled-icon {
    display: none;
}

.product .check-edge span {
    font-size: 30px;
    color: #b3b3b3;
}

.product .check-btn {
    width: 30px;
    height: 30px;
    position: relative;
    cursor: pointer;
}

.product .check-btn>span {
    position: absolute;
    right: 0;
    top: 0;
}

.product .check-btn span {
    z-index: 1;
}

.product .check-btn .check-icon {
    color: #22b573;
    display: none;
    z-index: 2;
}

.product.checked .check-icon {
    display: block;
}

.product.disabled .check-btn {
    display: none;
}

.product.disabled .disabled-icon {
    display: block;
}

.tab-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background-color: #E9E9E9;
    z-index: 1000;
    border-top: 1px solid #ccc;
    height: 78px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-left: 40px;
    padding-right: 40px;
}

.tab-bar .downgrade-info {
    margin-right: 8px;
}

.button-icon span.fa,
.button-icon span.far {
    font-size: 16px;
    margin-right: 8px;
}

.button-icon.finish-btn span.fa,
.button-icon.finish-btn span.far {
    margin-right: 0;
}

.button-icon span.fa-angle-right {
    margin-right: 0;
    margin-left: 8px;
}

.light-button {
    min-width: 180px;
    min-height: 32px;
    text-transform: uppercase;
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    border-radius: 10px;
    border: none !important;
    font-size: 0.9em;
    padding: 4px 8px;
    letter-spacing: 0.05em;
}

.accent-button {
    color: #E8A724 !important;
}

/* /DOWNGRADE PAGE - END */

/* TIER WARNS */

.tier-warning {
    margin: auto;
    max-width: 80%;
    padding: 2em;
    background-color: #fff;
    border-radius: 1em;
}


.tier-warning h2 {
    width: 100%;
    text-align: center;
    margin-bottom: 1em;
}

.tier-warning ul.actions {
    margin: auto;
    width: 70%;
    margin-top: 1em;
}

.tier-warning ul.actions li {
    text-align: center;
    margin-bottom: 0.5em;
}

.tier-warning .message {
    text-align: center;
}

.tier-warning.warningbox .actions button {
    width: 450px;
    overflow: hidden;
    white-space: break-spaces;
    height: auto;
    min-height: 32px;
}

.tier-warning.warningbox .actions button.upgrade-tier {
    background-color: #0F4D80 !important;
}

/* /TIER WARNS */

/* PUBLIC PAGES */

.public-page .hero h1 {
    font-size: 2.5em;
    font-weight: bold;
    letter-spacing: 0.05em;
    line-height: 1.1;
    margin-bottom: 10px;
}

.public-page .hero h2 {
    color: #4d4d4d;
    font-size: 1.5em;
    font-weight: 400;
    letter-spacing: 0.05em;
    margin-bottom: 20px;
}

.public-page .hero h1+button {
    margin-top: 20px;
}

.public-page .hero .hero-content>div {
    max-width: 100%;
    text-align: center;
}

.public-page .hero .hero-content>div.flex-2 {
    max-width: 50%;
}

.public-page .hero .hero-content>div.flex-2,
.hero>div,
.tiers-grid {
    padding-left: 40px;
    padding-right: 40px;
}

.public-page .hero .hero-content>div.flex-2:first-child {
    text-align: left;
}

.public-page #help_link,
.public-page #new_product,
.public-page #write_ebook,
.public-page #gen_ebook,
.public-page #gen_kindle_ebook,
.public-page #icon-upload-appearance,
.public-page #import_new_product,
.public-page .dark-button {
    background-color: #000;
}

.public-page .u-userLauncherColor:not([disabled]) {
    color: #000 !important;
    fill: #000 !important;
}

#help_link #help_text {
    font-weight: 600;
}
.public-page section {
    padding-top: 60px;
    padding-bottom: 60px;
}

#footer > div > .sl-prefooter {
    padding-top: 40px;
    padding-bottom: 40px;
}

.public-page section,
#footer > div > .sl-prefooter,
#footer > div > p {
    padding-left: 40px;
    padding-right: 40px;
}

#footer > div > .sl-prefooter {
    margin-bottom: 40px;
}

.public-page section.pt-sm {
    padding-top: 20px;
}

.feature-img {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
}

.feature-img img {
    max-width: 600px;
    border-radius: 10px;
    -webkit-box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
}

.feature-img>div,
.multiple-images>div {
    position: relative;
}

.multiple-images img:first-child {
    position: relative;
    z-index: 1;
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
}

.multiple-images img:last-child {
    position: absolute;
    z-index: 2;
}

.multiple-images.nav-panel-feature img:last-child {
    right: 0;
}

.feature-img .feature-zoom-icon {
    width: 94px;
    top: 15px;
    right: -15px;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.multiple-images.book-map-feature>img {
    left: 0;
}

.multiple-images.content-editor-feature,
.multiple-images.print-feature {
    text-align: left;
    padding-bottom: 40px;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

.multiple-images.content-editor-feature img:first-child {
    -webkit-filter: none;
    filter: none;
}

.multiple-images.content-editor-feature img:last-child {
    right: 0;
    bottom: -20px;
}

.multiple-images.print-feature {
    padding-bottom: 140px;
}

.multiple-images.print-feature img:last-child {
    right: 0;
    bottom: 0;
}

#main-menu.public-page-menu li {
    margin-right: 20px;
}

#main-menu.public-page-menu li:last-child {
    padding-right: 0;
    margin-right: 0;
}

#main-menu.public-page-menu li a {
    font-size: 1.5em;
}

#main-menu.public-page-menu li a,
.public-page .side-nav-section li a {
    color: #000;
    font-size: 16px;
    text-transform: none;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    white-space: normal;
    text-align: center;
    line-height: 1.2em;
}

#main-menu.public-page-menu li a {
    max-width: 100px;
}

#main-menu.public-page-menu li a.active {
    color: rgb(232, 167, 36) !important;
}

#main-menu.public-page-menu li a:hover:not(.active) {
    opacity: 0.5;
}

#main-menu.public-page-menu li a::first-letter,
.side-nav-section li a::first-letter {
    text-transform: uppercase;
}

#main-menu.public-page-menu {
    margin-right: 10px;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

#main-menu.public-page-menu li::before {
    display: none;
}

/* Icon boxes */

.icon-box {
    text-align: center;
}

.icon-box .img-container {
    margin-bottom: 20px;
}

.icon-box .img-container img {
    width: 100px;
}

.icon-box .img-container .icons8 {
    font-size: 100px;
}

.bt-tab-box .icon-box .img-container .icons8 {
    font-size: 70px;
    color: #b5b5b5;
}

.bt-tab-box>div>div:not(:last-child) {
    margin-bottom: 20px;
}

.icon-box h3 {
    font-size: 1.4em;
    margin-bottom: 10px;
}

.icon-box p {
    color: #4d4d4d;
    font-size: 1.1em;
    font-weight: 400;
    letter-spacing: 0.05em;
}

.icon-box p a {
    color: #E8A724;
}

.icon-box p a:hover {
    text-decoration: underline;
}

/* /Icon boxes - END */

.public-page #footer {
    background-color: #000;
    color: #999;
    height: auto;
    padding-top: 0;
    margin-top: 0;
}

.public-page #footer p {
    color: #999;
}

.public-page #footer a {
    font-weight: bold;
    color: #ccc;
}

.public-page #footer .actions a {
    margin-bottom: 10px;
}

.public-page #footer a:hover {
    opacity: 0.6;
}

.public-page #footer .wrapped-lg>div:first-child {
    margin-bottom: 40px;
}

.public-page .sl-prefooter {
    background-color: #2e2e2e;
}

.public-page .sl-prefooter p {
    color: #949494;
}

.dark-bg {
    background-color: #1a1a1a;
    color: #ccc;
}

.gray-bg {
    background-color: #f2f2f2;
}

section {
    position: relative;
}

section h2 {
    font-size: 2.2em;
    font-weight: 500;
    margin-bottom: 20px;
    letter-spacing: 0.05em;
    line-height: 1.2;
}

section h2.has-subtitle {
    margin-bottom: 0;
}

section h3,
section h4 {
    letter-spacing: 0.05em;
}

section h3 {
    color: #666;
    font-size: 1.6em;
}

section h4 {
    font-size: 1.6em;
    margin-bottom: 10px;
}

/*section h4 span,
section h2 span {
vertical-align: middle;
display: inline-block;
}*/

section p,
section ul.feature-details-list,
#footer .sl-prefooter p {
    font-weight: 400;
    font-size: 1.4em;
    letter-spacing: 0.05em;
}

section p,
section ul.feature-details-list {
    color: #4d4d4d;
}

section p,
#footer .sl-prefooter p {
    margin-bottom: 1em;
    line-height: 1.4em;
}

section p:last-child {
    margin-bottom: 0;
}

section .centered>div {
    margin-left: auto;
    margin-right: auto;
}

section .section-note {
    font-size: 1.2em;
    font-style: italic;
    color: #838383;
}

section ul.feature-details-list li {
    margin-bottom: 10px;
}

.dash-list {
    list-style: disc;
}

.disc-list {
    margin-top: 1em;
    padding-left: 40px;
}

.disc-list li {
    display: list-item;
    list-style-type: disc;
}

.feature-label {
    border-radius: 14px;
    background-color: #000;
    color: #fff;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.3em;
    margin-left: 5px;
    padding: 4px 10px;
    vertical-align: middle;
    bottom: 3px;
    position: relative;
    display: inline-block;
}

.new-feature-label {
    background-color: #e8a724;
}

.premium-tier-label {
    background-color: #001eff;
}

.unlimited-tier-label {
    background-color: #00d965;
}

.radial-gradient-yellow-bg {
    background: #fff;
    background: radial-gradient(closest-side, rgba(239, 172, 40, 0.2763480392156863) 0%, rgba(255, 255, 255, 0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#efac28", endColorstr="#ffffff", GradientType=1);
}

.radial-gradient-yellow-bg p a {
    color: #efac28;
}

.radial-gradient-yellow-bg p a:hover {
    opacity: 0.6;
}

.icon-box,
section .flex-2 {
    padding-left: 40px;
    padding-right: 40px;
}

.features-list>div {
    margin-bottom: 100px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    position: relative;
}

.features-list>div:last-child {
    margin-bottom: 0;
}
.features-links :not(.flex-2) > h2 {
    margin-bottom: 40px;
}

.gray-bg.features-links {
    margin-top: 30px;
}

.features-links div:not(:last-child, .flex-2) {
    margin-bottom: 40px;
}

.features-links ul a {
    color: #000;
    font-size: 1.8em;
    font-weight: bold;
    display: inline-block;
    padding-bottom: 4px;
    /*border-bottom: 3px solid #000;*/
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
    position: relative;
}

.features-links ul a::before {
    content: '';
    display: block;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 3px;
    background-color: #000;
    position: absolute;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.features-links ul a:hover::before {
    width: 0;
    left: 50%;
    right: 50%;
}

.features-links ul a:hover {
    background: transparent;
    background: radial-gradient(closest-side, rgba(239, 172, 40, 0.4) 0%, transparent 100%);
}


.public-page #themes-container,
.public-page .themes-container {
    max-width: 100%;
    margin-top: 0;
}

.public-page #themes-container section.themes.current {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 0;
    margin-left: auto;
    margin-right: auto;
}

.public-page #themes-container section.themes div.theme-container,
.public-page .themes-container section.themes div.theme-container>div {
    width: 100%;
    margin: 0;
    pointer-events: none;
}

.public-page .theme-container .theme-actions {
    pointer-events: auto;
}

.public-page .theme-container .theme {
    width: 100%;
}

.public-page .theme-container .theme .activate-button {
    display: none;
}

.privacy-page section h2 {
    margin-bottom: 40px;
}

.privacy-page section h3 {
    margin-top: 40px;
    margin-bottom: 20px;
    color: #000;
}

.privacy-page section h4 {
    font-weight: 500;
    color: #666;
}

.privacy-page section p a {
    text-decoration: underline;
}

.privacy-page section .sl-list {
    text-indent: -1.25em;
    padding-left: 1.25em;
}

.sl-sublist {
    padding-left: 1.8em;
}

.sl-sublist p {
    margin-bottom: 0.5em;
}

.privacy-page section .sl-sublist .sl-list {
    text-indent: -0.65em;
}

/* /PUBLIC PAGES - END */

/* Cover editor stand alone */

#nnew-cover-wizard .tip .fa {
    font-size: 18px;
    color: #B1B1B1;
}

.cover-gallery {
    padding: 0;
}

.cover-gallery .cover-image {
    width: 78px;
    height: 103px;
    display: block;
    background-repeat: no-repeat;
    background-size: contain;
}

.cover-gallery .radio-button-field {
    min-width: 60px;
}

.cover-gallery .radio-button-field label {
    display: block;
    height: auto;
    padding: 4px;
    border: 2px solid transparent;
}

.cover-gallery .radio-button-field input:checked + label {
    border: 2px solid #E7A636;
    border-radius: 6px;
}

.bt-wizard-style-step .inputs-group {
    text-align: left;
    align-items: baseline;
}

.bt-wizard-style-step h5 {
    margin-bottom: 10px;
    max-width: max-content;
}

.color-palette {
    margin-top: 10px;
}

.color-palette:not(.default-color-palette) > span:not(:first-child) {
    margin-top: 5px;
}

.color-palette .color-box,
.color-palette input[type='color'].color-box {
    width: 25px;
    height: 25px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    border-radius: 4px;
}

.other-color-palette .color-box {
    margin-right: 0;
}

.other-color-palette > span {
    padding: 4px;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: 4px;
    margin-right: 5px;
}

.other-color-palette > span:hover {
    border-color: #ddd;
}

.other-color-palette > span.selected {
    border-color: #e8a824;
}

.color-palette input[type='color'].color-box {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: transparent;
    border: none;
    cursor: pointer;

}

.color-palette input[type='color'].color-box::-webkit-color-swatch {
    border-radius: 4px;
    border: none;
}

.color-palette input[type='color'].color-box::-moz-color-swatch {
    border-radius: 4px;
    border: none;
}

.color-palette .color-box.light {
    border: 1px solid #aaa !important;
    box-sizing: border-box;
    inline-size: auto !important;
    block-size: auto !important;
    width: 25px !important;
    height: 25px !important;
}

.color-palette input[type='color'].color-box.light,
.color-palette input[type='color'].color-box {
    margin-left: 3px;
    margin-top: 3px;
    margin-bottom: 3px;
}

/* Is Chromium */
.color-palette input[type='color'].color-box.is-chromium {
    inline-size: 29px;
    block-size: 33px;
    margin-left: 0;
    margin-top: 0;
    margin-bottom: 0;
} 

.color-palette input[type='color'].color-box.light.is-chromium {
    margin-left: 2px;
    margin-bottom: 3px;
}
/* /Is Chromium - End */

#new-cover-dialog .dialog-steps:has(.dialog-second-step[style="transform: translate(0px, 0px);"]) .dialog-step {
    max-height: calc(100vh - 200px);
    overflow-y: auto;
}

#new-cover-dialog .color-label {
    font-weight: 500;
    font-size: 14px;
    cursor: pointer;
}

#new-cover-dialog .color-label:hover {
    opacity: 0.6;
}

#new-cover-dialog .custom-cover-format {
    display: none;
}

#new-cover-dialog .inputs-group:has(#custom-size:checked) .custom-cover-format {
    display: block;
}

#new-cover-dialog .inputs-group:has(#custom-size:checked) .cover-format {
    display: none;
}

#new-cover-dialog .bt-wizard-step {
    padding-bottom: 20px;
}

#new-cover-dialog .bt-wizard-step[data-id="step-2"],
#new-cover-dialog .bt-wizard-step[data-id="step-3"] {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

#new-cover-dialog .bt-wizard-step[data-id="step-3"] fieldset {
    padding-right: 0;
}

#new-cover-dialog .bt-wizard-step[data-id="step-3"] select {
    text-transform: none;
}

#new-cover-dialog .bt-wizard-step[data-id="step-3"] select+span.fa-sort {
    margin-right: -21px;
    line-height: 34px;
    height: 34px;
    vertical-align: middle;
    margin-top: 5px;
}

#new-cover-dialog .cover-preview-section h4 {
    color: #5ba25b;
    margin-bottom: inherit;
    display: none;
}

#new-cover-dialog .dialog-section.cover-preview-section {
    margin-bottom: inherit;
    padding: 0;
}

#new-cover-dialog .cover-preview-container {
    width: 100%;
    height: 200px;
}

#new-cover-dialog .cover-preview {
    margin: auto;
    -webkit-box-shadow: 0 16px 20px -7px rgba(0,0,0,.24);
    box-shadow: 0 16px 20px -7px rgba(0,0,0,.24);
    position: relative;
    border-radius: 2px;
    border: 1px solid rgba(0, 0, 0, 0.05);
    box-sizing: content-box;
    overflow: hidden;
}

#new-cover-dialog .cover-preview .frame {
    text-align: initial;
}

#new-cover-dialog .cover-preview.print .section.back {
    border-right: 1px dashed #bbb;
}

#new-cover-dialog .cover-preview.print .section.front {
    border-left: 1px dashed #bbb;
}

#new-cover-dialog:has([name="custom_size"]:checked) input[name="spine_width"] {
    margin-top: 20px !important;
}

#new-cover-wizard fieldset input,
#new-cover-wizard fieldset select {
    max-width: calc(100% - 40px);
}

#new-cover-wizard fieldset.inline-input {
    padding-right: 0;
}

#new-cover-dialog input[type="checkbox"] + label {
    max-width: calc(100% - 30px);
    display: inline-block;
    vertical-align: middle;
    padding-left: 5px;
}

/* /Cover editor stand alone - End */

/* MEDIA QUERY */

/* @new */

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

    .bt-search-bar.visible {
        padding-left: 0 !important;
    }

    .bt-search-bar.visible input {
        padding-left: 40px !important;
    }

}

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

    #ebook-authoring-header {
        padding-left: 36px;
    }

    .side-nav-book-section>div {
        padding: 10px 8px 10px 36px;
    }

    .side-nav .logo-container {
        padding: 8px 0 8px 36px;
    }

    #ebook-authoring-header .header-content>div:first-child {
        min-width: 188px !important;
    }

    .bt-storage {
        position: absolute;
        left: 190px;
        top: 38px;
        display: none;
    }

    .bt-storage-prog {
        height: 25px;
        width: 25px;
        margin-left: 6px;
    }

    .bt-storage-prog>svg {
        width: 20px !important;
        overflow: visible;
    }

    .bt-storage-prog>svg>path {
        stroke-width: 12;
    }

    .bt-storage-details.arrow-top {
        margin-right: -6px;
    }

    #user-panel {
        right: 5px !important;
    }

    .data-page .value,
    .data-page .inputtext,
    .data-page select,
    .data-page input[type=number],
    #publication_year_field,
    #language_field,
    .section-position {
        width: 100% !important;
        max-width: 100%;
    }

    #ebook-authoring-header .header-content>div:first-child {
        min-width: 200px !important;
    }

    .public-page .hero .hero-content>div,
    .icon-box,
    section .flex-2 {
        padding-left: 0;
        padding-right: 0;
    }

    .data-page .billing-form .flex-2.flex-container,
    .data-page .zip-code .flex-2.flex-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

}

@media only screen and (min-width: 361px) and (max-width: 480px) {

    .bt-storage-prog>svg {
        width: 24px !important;
        overflow: visible;
    }

    .bt-storage {
        padding-left: 8px;
    }

}

@media only screen and (min-width: 361px) and (max-width: 600px) {

    .public-page .hero .hero-content>div,
    .icon-box,
    section .flex-2 {
        padding-left: 0;
        padding-right: 0;
    }

}

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

    ul.segmented-selector li {
        display: block;
        border: none;
        width: 100% !important;
    }

    .bt-search-bar {
        margin-right: 8px;
    }

    .bt-search-bar button {
        height: 35px;
        width: 35px;
        min-width: 35px;
    }

    .bt-search-bar input {
        height: 35px;
        width: 35px !important;
        min-width: 35px !important;
        padding-right: 0;
    }

    #ebook-authoring-header .header-content>div:first-child {
        min-width: 226px;
    }

    .bt-storage-prog {
        margin-left: 0;
    }

    #main-menu li:last-child {
        margin-left: 0;
    }

    .bt-storage-prog>svg>path {
        stroke-width: 12;
    }

    .progressbar-text {
        display: none;
    }

    .flex-grid.flex-grid-4>div,
    .flex-grid.flex-grid-3>div {
        width: 100%;
    }

    .flex-grid-3 .product {
        max-width: 100%;
    }

    .flex-grid-3 .product-icon div.cover {
        margin-top: 0;
        margin-bottom: 0;
    }

    .small-cards-grid .product>div,
    .small-cards-grid .create-product-box>div,
    .small-cards-grid .grid-item>div,
    .small-cards-grid .create-box>div {
        padding-top: 0;
        padding-left: 0;
        height: auto;
    }

    .small-cards-grid .product-icon,
    .small-cards-grid .grid-item-icon {
        position: static;
        width: 100%;
        display: block;
        height: 100px;
        border-top-right-radius: 4px;
    }

    .small-cards-grid .product-info,
    .small-cards-grid .product-actions {
        text-align: center;
    }

    .small-cards-grid .product-info,
    .small-cards-grid .product-actions {
        text-align: center;
    }

    .bt-tab-footer .actions {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .infobox {
        padding-left: 0;
        padding-right: 0;
    }

    .public-page #themes-container section.themes div.theme-container,
    .public-page .themes-container section.themes div.theme-container>div {
        max-width: 100%;
    }

    .cookie-banner button {
        float: none !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    /* @new */

    .public-page section,
    #footer > div > .sl-prefooter,
    #footer > div > p {
        padding: 30px 20px;
    }

    #footer .action_my_books {
        min-width: 100%;
    }

    .public-page .hero h1 {
        font-size: 2em;
    }

    .public-page section h2 {
        font-size: 1.8em;
    }

    .features-links div:not(:last-child, .flex-2) {
        margin-bottom: 20px;
    }

    .trustpilot-box::after {
        margin-top: 40px;
        margin-bottom: 20px;
    }

    /* /@new - end */

}


@media only screen and (min-width: 481px) and (max-width: 1100px) {

    .public-page #themes-container {
        width: 100%;
    }

}

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

    body {
        font-size: 0.9em;
    }

    #main {
        margin: 0 auto -76px auto;
    }

    #open-map-btn {
        display: none !important;
    }

    /* SEARCH BAR - MOVED - WRITE 4.0

    .bt-search-bar {
    transition: all 300ms;
    -webkit-transition: all 300ms;
    -ms-transition: all 300ms;
}

    .bt-search-bar input {
    width: 45px;
    min-width: 45px;
    padding-left: 0;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    transition: all 300ms;
    -webkit-transition: all 300ms;
    -ms-transition: all 300ms;
}

    .bt-search-bar button {
    font-size: 22px;
}

    .bt-search-bar.visible {
    background-color: #E9E9E9;
    position: fixed;
    left: 0;
    right: 0;
    z-index: 1002;
    margin-right: 0;
}

    .bt-search-bar.visible input {
    width: 100%;
    min-width: 45px;
    padding-left: 0;
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
    padding-left: 45px;
}

    .bt-search-bar.visible input:focus {
    background-color: transparent;
}

    .bt-search-bar.visible button {
    color: rgb(78,78,78);
}

    .bt-search-bar .back {
    position: absolute;
    left: 0;
    top: 13px;
    display: none;
}

    .bt-search-bar.visible .back {
    display: block;
}

    .bt-search-bar .back span {
    font-size: 22px;
    color: rgb(78,78,78);
}

    /* /SEARCH BAR */

    #features-tour-action span.close-button {
        margin: 1px -5px;
    }

    /* SEARCH BAR - @new */

    .bt-search-bar {
        transition: all 300ms;
        -webkit-transition: all 300ms;
        -ms-transition: all 300ms;
    }

    .bt-search-bar input {
        width: 45px;
        min-width: 45px;
        padding-left: 0;
        background-color: transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
        border: none;
    }

    .bt-search-bar button {
        font-size: 22px;
        top: 12px;
        background-color: #fff;
    }

    .bt-search-bar.visible {
        background-color: #fff;
        position: fixed;
        left: 0;
        right: 0;
        z-index: 1002;
        margin-right: 0;
        padding-left: 45px;
        padding-right: 36px;
    }

    .bt-search-bar.visible input {
        width: 100% !important;
        min-width: 45px;
        padding-left: 0;
        background-color: transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .bt-search-bar.visible input:focus {
        background-color: transparent;
    }

    .bt-search-bar.visible button {
        color: rgb(78, 78, 78);
    }

    .bt-search-bar .back {
        position: absolute;
        left: 0;
        top: 13px;
        display: none;
    }

    .bt-search-bar.visible .back {
        display: block;
    }

    .bt-search-bar .back span {
        font-size: 22px;
        color: rgb(78, 78, 78);
    }

    /* /SEARCH BAR */

    .icon-box h3 {
        font-size: 1.6em;
    }

    .icon-box p {
        font-size: 1.3em;
    }

}


@media only screen and (min-width: 601px) and (max-width: 680px) {

    .bt-search-bar input {
        min-width: 200px;
    }

}

@media only screen and (min-width: 601px) and (max-width: 1100px) {

    body {
        font-size: 1em;
    }

    .icon-box h3 {
        font-size: 1.5em;
    }

    .icon-box p {
        font-size: 1.2em;
    }

}


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


    #books-actions {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    #books-nav {
        margin-bottom: 20px;
    }

    .disabled-books-actions .actions {
        text-align: left;
    }

    /*#ebook-authoring-header .open-actions-btn {
        position: fixed;
        right: 10px;
        top: 82px;
        height: 35px;
    }*/
}

@media only screen and (max-height: 600px) {

    .bt-wizard-step {
        display: inline-block;
    }

}

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

    /* BACKTYPO DIALOG */

    .backtypo-dialog {
        width: 98%;
    }

    .bt-main-dialog,
    .create-dialog
    /* TO DELETE AFTER CLASS FIX */
    ,
    #bundler-dialog-content
    /* TO DELETE AFTER CLASS FIX */
    ,
    #print-version-dialog .create-dialog

    /* TO DELETE AFTER CLASS FIX */
    ,
    #share-dialog-content,
    /* TO DELETE AFTER CLASS FIX */
    #fxl-configuration-dialog .configuration-dialog {
        width: 100%;
        height: 100%;
        min-width: 100%;
        border-radius: 0;
        padding: 10px;
        min-height: 100%;
        overflow-y: auto;
    }

    #share-dialog-content {
        top: 0;
    }

    .dialog-step {
        padding: 0;
    }

    .bt-main-dialog h3,
    .create-dialog h3
    /* TO DELETE AFTER CLASS FIX */
    ,
    #bundler-dialog-content h3

    /* TO DELETE AFTER CLASS FIX */
        {
        margin: 60px 0 1em 0;
    }

    .bt-main-dialog .bt-fieldset,
    .create-dialog input[type=text]
    /* TO DELETE AFTER CLASS FIX */
    ,
    #book_models

    /* TO DELETE AFTER CLASS FIX */
        {
        width: 100%;
        min-width: 300px;
    }

    .bt-main-dialog .bt-fieldset label,
    .create-dialog label

    /* TO DELETE AFTER CLASS FIX */
        {
        display: block;
        margin-bottom: 6px;
    }

    .bt-main-dialog .bt-col,
    #bundler-dialog-content .book-details
    /* TO DELETE AFTER CLASS FIX */
    ,
    #bundler-book-actions

    /* TO DELETE AFTER CLASS FIX */
        {
        width: 100%;
        float: none;
        min-height: 10px;
        height: auto !important;
        margin: 0;
        background-color: transparent;
    }

    .bt-main-dialog,
    #bundler-dialog-content

    /* TO DELETE AFTER CLASS FIX */
        {
        margin-bottom: 0;
    }

    #bundler-dialog-content h3 {
        margin-top: 0;
    }

    #bundler-dialog .status-content {
        position: static;
        width: 100%;
        margin: auto;
        min-height: 40px;
    }

    .close_dialog span {
        font-size: 35px;
    }

    .download-options .opt-row>label {
        display: inline-block;
        text-align: left;
        margin-top: 10px;
        margin-bottom: 10px;
        vertical-align: middle;
    }

    #pdf-page-config input[type=number]+input[type="checkbox"] {
        display: block;
        margin-bottom: 0;
        margin-top: 10px;
        float: left;
        clear: both;
    }

    #pdf-page-config label[for="auto_pagination"] {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 2px;
        max-width: 180px;
    }

    .download-options .opt-row>label+input[type="checkbox"] {
        float: left;
        margin-top: 10px;
        margin-right: 20px;
    }

    .download-options .opt-row>label+select,
    #pdf-page-config input[type=number] {
        float: right;
        margin-top: 6px;
    }

    #bundler-dialog .download-options .pdf_margins_container {
        vertical-align: middle;
    }

}

@media only screen and (min-width: 481px) and (max-width: 768px) {

    .flex-grid.flex-grid-4>div {
        width: 50%;
    }

    .flex-grid.flex-grid-3>div {
        width: 100%;
    }

}


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

    #mypage-actions {
        display: none;
    }

    .button {
        font-size: 12px;
        min-height: 32px;
    }

    .revision-creator .button.user-avatar {
        height: 20px;
    }

    #themes-section {
        padding: 20px 16px 0;
    }

    #themes-section .flex-2 {
        max-width: 100%;
    }

    .hero>div {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .hero .hero-content>div {
        margin-bottom: 0;
    }

    #prices-page .hero {
        padding: 0;
    }

    .tiers-grid {
        max-width: 100%;
        padding-left: 16px;
        padding-right: 16px;
    }

    .hero h1 {
        font-size: 1.3em;
    }

    .data-page fieldset[data-name="author_picture"] {
        text-align: left;
    }

    span.user-avatar {
        font-size: 16px;
        width: 32px;
        line-height: 32px;
    }

    .flex-grid.flex-grid-3>div {
        width: 100%;
    }

    .hero>div,
    #themes-section .hero-content {
        min-height: 100px;
    }

    .hero {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .icon-box,
    section .flex-2 {
        padding-left: 0;
        padding-right: 0;
        margin-bottom: 30px;
    }

    .public-page .flex-grid.flex-grid-3 .tier,
    .public-page .hero .hero-content>div.flex-2,
    .hero>div,
    .tiers-grid {
        padding-left: 0;
        padding-right: 0;
    }

    #highlight-section {
        margin-top: 0;
    }

    #highlight-section .wrapped-lg,
    #highlight-section h2 + .actions {
        flex-direction: column;
        text-align: center;
    }

    #highlight-section h2 + .actions > * {
        margin-top: 10px;
    }

    #highlight-section .wrapped-lg>div:last-child {
        display: none;
    }

    #highlight-section h2 {
        margin-bottom: 10px;
        font-size: 18px;
    }

}

@media only screen and (max-height: 600px) {

    #themes-section {
        display: none;
    }

    #products-list {
        padding-top: 0 !important;
    }

}

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

    #project-main-menu>div:first-child {
        display: none;
    }

    #ebook-authoring-header .header-content>div:first-child {
        padding-right: 0;
    }

    #ebook-authoring-header .header-content>div:last-child {
        padding-left: 0;
        min-width: 35px;
    }

    #ebook-authoring-header {
        padding-right: 10px;
    }

    #project-main-menu {
        border: 0;
        padding: 0;
    }

    #ebook-authoring-header .actions {
        padding-top: 130px;
    }

    #ebook-authoring-header .actions button,
    #ebook-authoring-header .actions button#ebook_preview {
        margin-right: 6px;
    }

    #ebook-authoring-header .actions .dark-button:last-child {
        margin-left: auto;
    }

    #ebook-authoring-header #download_book {
        margin-right: 10px;
    }

    #nav-panel #nav-header {
        padding-left: 10px;
    }

    .bt-tab-content.flex-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .bt-tab-panel,
    .bt-tab-panel.flex-container {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        min-width: 100%;
        padding-top: 0;
        margin-bottom: 30px;
    }

    .bt-tab-panel:last-child,
    .bt-tab-panel.flex-container:last-child {
        margin-bottom: 0;
    }

    .bt-tab-panel:first-child,
    .bt-tab-panel.flex-container:first-child {
        padding-top: 0;
    }

    .bt-tabs-nav {
        display: none;
    }

    .data-page {
        padding-left: 10px;
        padding-right: 10px;
    }

    .data-page h4 {
        color: #6f6f6f;
    }

}

@media only screen and (min-width: 801px) {

    #nav-header .book-title,
    .data-page .tab-title {
        display: none;
    }

    .data-page fieldset:last-child,
    .data-page .bt-tab-box:last-child fieldset:last-child {
        margin-bottom: 0;
    }

}

@media only screen and (min-width: 769px) {

    .flex-1 {
        max-width: 100%;
    }

    .flex-2 {
        max-width: 50%;
    }

    .flex-3 {
        max-width: 33.333%;
    }

    #tier-details .bt-tab-box:first-child>div {
        padding-top: 67px;
        padding-bottom: 20px;
    }

    .data-page .tab-title+.bt-tab-box.flex-2+.flex-1 {
        max-width: 50%;
        margin-bottom: 20px;
    }

}

@media only screen and (min-width: 769px) and (max-width: 960px) {

    .flex-grid.flex-grid-4>div {
        width: 50%;
    }

    .flex-grid.flex-grid-3>div {
        width: 33.333%;
    }

    .flex-4 {
        max-width: 50%;
    }

    .flex-3-4 {
        max-width: 50%;
    }

    .tiers-grid .flex-grid.flex-grid-3>div {
        width: 100%;
    }

}

@media only screen and (min-width: 769px) and (max-width: 1200px) {

    .flex-grid.flex-grid-3>div {
        width: 50%;
    }

}

@media only screen and (min-width: 961px) and (max-width: 1279px) {

    .data-page .flex-3.bt-tab-box fieldset,
    .data-page .flex-4.bt-tab-box fieldset {
        margin-left: auto;
        margin-right: auto;
    }

}

@media only screen and (min-width: 961px) and (max-width: 1200px) {

    .flex-grid.flex-grid-4>div,
    .flex-grid.flex-grid-3>div {
        width: 33.333%;
    }

}

@media only screen and (min-width: 961px) {

    .flex-4 {
        max-width: 25%;
    }

    .flex-3-4 {
        max-width: 75%;
    }

}

@media only screen and (min-width: 800px) and (max-width: 1024px) {

    .data-page .inputtext,
    .data-page select,
    .data-page input[type=number],
    #publication_year_field,
    #language_field,
    .section-position {
        width: 280px !important;
    }

}

@media only screen  and (min-width: 481px) and (max-width: 960px) {

    .public-page section,
    #footer > div > .sl-prefooter,
    #footer > div > p {
        padding-top: 30px;
        padding-bottom: 30px;
    }

}

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

    #ebook-authoring-header {
        left: 0;
        right: 0;
    }

    #user-panel {
        right: 10px;
    }

    img#logo {
        height: 42px;
        top: 0;
    }

    #project-main-menu .actions button {
        min-width: 70px;
    }

    #zenbox_tab,
    #help_link {
        display: none !important;
        /* Da rivedere alla creazione del menù per tablet e mobile */
    }

    .floating-actions {
        display: block;
    }

    /* FEATURES TOUR */

    #features-tour #descriptions,
    #features-tour .screenshots {
        width: 100%;
    }

    #features-tour #descriptions {
        margin: 0;
        padding: 40px 20px;
    }

    #features-tour #descriptions::before {
        display: none;
    }

    #features-tour {
        overflow-y: auto;
    }

    #features-tour-content {
        height: auto;
        min-height: 100%;
        margin: 0;
        border-radius: 0;
        width: 100%;
        border: 0 none;
    }

    #features-tour .screenshots {
        height: 300px;
        height: 50vh;
        border-radius: 0;
    }

    features-tour #descriptions {
        margin: 0;
        padding: 10px;
        height: auto;
    }

    #preview_close {
        right: 0;
    }

    .hero>.flex-container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .hero .hero-content>div {
        max-width: 100%;
        text-align: center;
    }

    .hero .hero-content,
    .hero .themes-short-list {
        width: 100%;
        max-width: 100%;
        text-align: center;
    }

    .grid-actions {
        padding: 20px 0 20px;
    }

    img#logo {
        height: 38px;
    }

    .logo-container a {
        height: 38px;
    }

    .public-page #user-panel {
        display: none;
    }

    #ebook-authoring-header .header-content>div:first-child {
        min-width: 200px;
    }

    #ebook-authoring-header .header-content>div:last-child {
        padding-left: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .public-page .hero .hero-content>div.flex-2 {
        max-width: 100%;
        padding-left: 0;
        padding-right: 0;
    }

    .public-page .hero .hero-content>div.flex-2:first-child {
        margin-bottom: 30px;
        text-align: center;
    }

    button.button.big-button,
    button.button.big-button.yellow-button,
    a.button.big-button,
    a.button.big-button.yellow-button {
        font-size: 16px;
    }

    .public-page .icon-box {
        margin-bottom: 40px;
    }

    .features-links ul li:not(:last-child) {
        margin-bottom: 30px;
    }

    .features-links ul {
        margin-bottom: 0;
    }


    .multiple-images.book-map-feature>div {
        max-width: 290px;
    }

    .multiple-images.book-map-feature>img {
        top: 80px;
        right: auto;
        left: auto;
    }

    .features-list>div {
        margin-bottom: 60px;
    }

}

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

    #project-main-menu li,
    #main-menu li {
        font-size: 0.7em;
    }

}

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

    .open-side-nav-btn {
        display: block;
    }

    #project-main-menu li.header-link,
    #main-menu li.header-link {
        display: none;
    }

    #main-menu li.user-avatar-btn {
        width: 35px;
        height: 35px;
        line-height: 35px;
    }

    #main-menu li.user-avatar-btn a,
    #main-menu li.user-avatar-btn div {
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    #bt-user-submenu {
        right: 0;
        top: 50px;
    }

    #main-menu li.user-avatar-btn .user-avatar.medium {
        width: 100%;
        height: 100%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin: auto 0;
    }

    #main-menu li.user-avatar-btn .user-avatar.medium span {
        display: block;
        margin: auto;
        letter-spacing: 0;
    }

    .top-nav {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    /* TOOLBAR */

    .open-actions-btn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    div.actions.ebook-actions {
        position: fixed;
        z-index: 10000000;
        width: 100%;
        height: 100%;
        background-color: rgba(255, 255, 255, 0.9);
        -webkit-transition: opacity 0.8s;
        transition: opacity 0.8s;
        top: 0;
        left: 0;
        margin-top: 0;
        opacity: 0;
        pointer-events: none;
        padding-top: 76px;
    }

    div.actions.ebook-actions.ebook-actions-show {
        display: block;
        text-align: right;
        opacity: 1;
        pointer-events: all;
    }

    #ebook-authoring-header .actions button {
        display: block;
        margin-bottom: 16px;
        border: none;
        border-radius: 10px;
        font-size: 12px;
        height: 32px;
        min-width: 100px;
    }

    #ebook-authoring-header .actions button .menu-icon {
        margin-left: 10px;
        float: right;
    }

    #ebook-authoring-header .actions button {
        text-align: right;
        font-size: 14px;
    }

    #ebook-authoring-header .actions .dark-button .menu-icon {
        margin-left: 0;
    }

    #ebook-authoring-header .actions .dark-button .menu-label {
        display: inline !important;
        min-width: 110px;
        border-radius: 10px;
        text-align: center;
        font-size: 12px;
        margin-right: 10px;
    }

    .only-icon #ebook-authoring-header .actions button {
        min-width: 35px;
    }

    #ebook-authoring-header .actions .dark-button {
        text-align: center;
    }

    .with-sidebar.right-sidebar>div:first-child {
        padding-right: 0;
    }

    .with-sidebar.left-sidebar>div:last-child {
        padding-left: 0;
    }

    /* FOOTER */

    #page:not(.public-page) #footer,
    #page:not(.public-page) #footer-push {
        display: none;
    }

    /* FEATURES TOUR */

    #features-tour-action span.close-button {
        margin: 16px 6px;
        font-size: 35px;
    }

    /* HIDDEN ELEMENTS */

    .bt-touch #import_new_product,
    .edit.print,
    .side-nav-section li.action_print_revisions,
    .side-nav-section li.action_print_versions,
    .bt-fla.import_new_book,
    .bt-touch .create-dialog .import-section,
    .bt-touch .product.importing {
        display: none !important;
    }


    iframe#launcher {
        display: none !important;
    }

    .with-sidebar {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .with-sidebar.right-sidebar>div,
    .with-sidebar.left-sidebar>div {
        padding-right: 0;
        padding-left: 0;
    }

    .with-sidebar .sidebar {
        margin-top: 40px;
    }

}

@media only screen and (min-width: 801px) and (max-width: 1100px) {

    #ebook-authoring-header .actions button,
    #ebook-authoring-header .actions button#ebook_preview {
        min-width: 120px;
        margin-right: 113px;
    }

    .only-icon #ebook-authoring-header .actions button,
    .only-icon #ebook-authoring-header .actions button#ebook_preview {
        min-width: 35px;
    }

    #ebook-authoring-header #download_book {
        margin-right: 118px;
    }

    #ebook-authoring-header .actions .dark-button:last-child {
        margin-left: auto;
    }

}

@media only screen and (min-width: 961px) and (max-width: 1100px) {

    /* FEATURES TOUR */

    .screenshots {
        width: 60%;
    }

    #features-tour #descriptions {
        width: 32%;
    }

    #features-tour #descriptions::before {
        width: 32%;
    }

    #themes-section.hero .hero-content {
        max-width: 25%;
    }

    hero .hero-content {
        max-width: 100%;
    }

}

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

    img#logo {
        left: 0;
    }

    #project-main-menu .actions button {
        padding: 0 5px;
    }

}


@media only screen and (min-width: 1101px) and (max-width: 1200px) {

    #ebook-authoring-header .actions button .menu-label {
        display: none;
    }

}

/* HEADER */

@media only screen and (min-width: 1101px) and (max-width: 1260px) {

    #ebook-authoring-header .actions .dark-button {
        width: 32px;
        min-width: 32px;
        line-height: 30px;
        border-radius: 50%;
        padding: 0;
        text-align: center;
        margin-left: 8px;
        margin-top: 0;
    }

}

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

    .bt-storage-details {
        display: none;
        opacity: 0;
        position: absolute;
        top: 67px;
        right: 0;
        min-width: 250px;
    }

    .bt-storage-prog {
        cursor: pointer;
    }

    .bt-storage-details.bt-storage-show,
    .bt-storage-details.el-shown {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        padding-top: 8px;
        padding-bottom: 8px;
    }

    #ebook-authoring-header .actions .text-button {
        min-width: 50px;
    }

    #ebook-authoring-header .actions .dark-button .menu-label {
        display: none;
    }

    #ebook-authoring-header .actions .dark-button .menu-icon {
        margin-right: 0;
    }

}

/* /HEADER - END */


@media only screen and (min-width: 801px) and (max-width: 1100px) {

    #project-main-menu {
        max-width: 75%;
        max-width: calc(100% - 322px);
        padding-right: 70px;
    }

}


@media only screen and (min-width: 1101px) {

    #ebook-authoring-header .actions {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    .only-icon .menu-label {
        display: none;
    }

    .only-icon #ebook-authoring-header .actions .dark-button {
        width: 32px;
        min-width: 32px;
        border-radius: 50%;
        padding: 0;
        text-align: center;
        margin-left: 10px;
    }

    .only-icon #ebook-authoring-header .actions .dark-button .menu-icon {
        margin-right: 0;
    }

}

@media only screen and (min-width: 1101px) and (max-width: 1200px) {

    [lang="de"] .public-page #ebook-authoring-header {
        padding-left: 20px;
        padding-right: 20px;
    }

    [lang="de"] #main-menu.public-page-menu li a {
        font-size: 15px;
    }

    [lang="de"] #main-menu.public-page-menu li.language-switcher {
        margin-left: 10px;
    }

}

@media only screen and (min-width: 1101px) and (max-width: 1350px) {

    [lang="de"] #ebook-authoring-header .header-content>div:first-child {
        padding-right: 10px;
        min-width: 200px;
    }

    [lang="de"] img#logo {
        height: 38px;
    }

    [lang="de"] #main-menu.public-page-menu li {
        margin-right: 8px;
    }

    [lang="de"] .language-switcher .lang-selector {
        font-size: 13px;
    }

    [lang="de"] #ebook-authoring-header .yellow-button {
        font-size: 14px;
    }

    [lang="de"] #main-menu.public-page-menu li.language-switcher {
        margin-left: 15px;
    }

}

@media only screen and (min-width: 1351px) and (max-width: 1400px) {

    [lang="de"] #main-menu.public-page-menu li {
        margin-right: 10px;
    }
}

@media only screen and (min-width: 1101px) and (max-width: 1400px) {

    #project-main-menu {
        max-width: 62%;
        max-width: calc(100% - 390px);
    }

    #ebook-authoring-header .header-content {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    #ebook-authoring-header .ebook-actions {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: auto;
        margin-top: auto;
        margin-bottom: auto;
        position: relative;
    }

}

@media only screen and (min-width: 1401px) and (max-width: 1700px) {
    /* @new */

    #project-main-menu {
        max-width: 70%;
        max-width: calc(100% - 390px);
    }

}

@media only screen and (min-width: 1701px) and (max-width: 1900px) {

    #project-main-menu {
        max-width: 75%;
        max-width: calc(100% - 390px);
    }

    .flex-grid.flex-grid-4>div {
        width: 20%;
    }

}

@media only screen and (min-width: 1901px) {

    #project-main-menu {
        max-width: 80%;
        max-width: calc(100% - 390px);
    }

    .flex-grid.flex-grid-4>div {
        width: 16.666%;
    }

}

/* TRANSITIONS */

/*body {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
}*/

body.page-transition-fade-out {
    -webkit-animation: fade-out .7s ease both;
    animation: fade-out .7s ease both;
    pointer-events: none;
}

body.page-transition-fade-in #page,
body.page-transition-fade-in .public-page #ebook-authoring-header,
body.page-transition-fade-in .public-page #main {
    opacity: 0;
    -webkit-animation: fade-in .7s ease both;
    animation: fade-in .7s ease both;
    -webkit-animation-delay: .1s;
    animation-delay: .1s;
    pointer-events: auto;
}

body.page-transition-fade-in .public-page #ebook-authoring-header {
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

body.page-transition-fade-in .public-page #main {
    -webkit-animation-delay: 2s;
    animation-delay: 2s;
}

.page-transition-mask {
    display: block;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background: #e9e9e9;
    z-index: 9999999999999999;
    opacity: 1;
    -webkit-transition: opacity .7s ease-in-out;
    transition: opacity .7s ease-in-out;
}

/*.page-transition-mask.page-transition-mask-out {
opacity: 0;
display: none;
}*/

/* FADE TRANSITION */

@-webkit-keyframes fade-out {
    from {}

    to {
        opacity: 0.3;
    }
}

@keyframes fade-out {
    from {}

    to {
        opacity: 0.3;
    }
}

@-webkit-keyframes fade-in {
    from {}

    to {
        opacity: 1;
    }
}

@keyframes fade-in {
    from {}

    to {
        opacity: 1;
    }
}

/* /TRANSITIONS */


[lang="it"] .hide-lang.lang-en,
[lang="it"] .hide-lang.lang-de,
[lang="en"] .hide-lang.lang-it,
[lang="en"] .hide-lang.lang-de,
[lang="de"] .hide-lang.lang-it,
[lang="de"] .hide-lang.lang-en,
.hide-if-de,
[lang="en"] .hide-if-en {
    display: none !important;
}

[lang='en'] .bt-community {
    display: none !important;
}

/* CONTEXT MENU */

.bt-context-menu {
    position: absolute;
    z-index: 99999999;
    background-color: #fff;
    list-style-type: none;
    list-style-position: inside;
    padding: 0;
    font-size: 0.95em;
    border: 2px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
    min-width: 200px;
}

.bt-context-menu.submenu {
    z-index: 100000000;
}

.bt-context-menu li.item {
    cursor: pointer;
    color: #4e4e4e;
    font-size: 14px !important;
    font-weight: bold;
    line-height: 30px;
    min-width: 100%;
    padding: 3px 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
    flex-direction: row-reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.bt-context-menu li.item:hover {
    background-color: #eee;
}

.bt-context-menu .icon {
    display: inline-block;
    min-width: 16px;
    color: #656565;
    font-size: 16px;
    opacity: 0.4;
}

.bt-context-menu .label {
    display: inline-block;
    padding-right: 10px;
    color: #656565;
    font-weight: 500;
}

.bt-context-menu .toggler .active {
    display: none;
}

.bt-context-menu .toggler.active .active {
    display: inline-block;
}

.bt-context-menu .toggler.active .inactive {
    display: none;
}

.bt-context-menu li.separator {
    height: 2px;
    width: 100%;
    background-color: #ccc;
}

.bt-context-menu .icon .md-icon:before {
    background-size: contain;
    width: 25px;
    height: 25px;
    vertical-align: middle;
    display: inline-block;
}

/* PANEL DETECTION SETTINGS */

.fxl-panel-detection-settings {
    background-color: #fff;
    overflow-y: auto;
    container-type: scroll-state;
    container-name: fxl-panel-detection-settings-scroller;
}

.fxl-panel-detection-settings.dialog {
    position: fixed;
    z-index: 999999;
    /*box-shadow: 0px 0px 5px 0px #0000009c;*/
    box-shadow: 0px 0px 13px 0px #00000059;
    padding: 30px 20px;
    border-radius: 10px;
}

.fxl-panel-detection-settings.hidden {
    display: none;
}

.fxl-panel-detection-settings .title {
    position: sticky;
    top: 0;
    background-color: #ffffffb0;
    text-align: center;
    font-weight: bold;
    padding: 0.3em;
    padding-bottom: 0.5em;
    text-transform: uppercase;
}

.fxl-panel-detection-settings > fieldset {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid #ddd;
}

.fxl-panel-detection-settings > fieldset:last-of-type {
    border-bottom: 0px none;
}

.fxl-panel-detection-settings fieldset > label {
    font-weight: bold;
    text-align: center;
    display: block;
    text-transform: uppercase;
    font-size: 0.85em;
    padding-top: 0.25em;
    padding-bottom: 0.25em;
}

.fxl-panel-detection-settings fieldset .preview.aspect-ratio {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
    padding: 0.2em;
}

.fxl-panel-detection-settings fieldset .panel-shape {
    background-color: #ccc;
    width: 50px;
    height: 50px;
}

.fxl-panel-detection-settings fieldset .field {
    display: flex
;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-start;
    align-items: center;
    padding: 0.5em;
}

.fxl-panel-detection-settings fieldset .field label {
    font-weight: bold;
    min-width: 9em;
    margin-left: 1em;
}

.fxl-panel-detection-settings fieldset .field output {
    margin-left: 1em;
}

.fxl-panel-detection-settings select,
.fxl-panel-detection-settings input[type="number"]  {
    border: 1px solid #938a8a;
    border-radius: 0.4em;
}

.fxl-panel-detection-settings input[type="number"] {
    text-align: right;
}

.fxl-panel-detection-settings input[name="padding"] {
    max-width: 4em;
}

.fxl-panel-detection-settings .actions {
    margin: 0;
    padding: 0.5em;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
}

.fxl-panel-detection-settings.no-actions .actions {
    display: none;
}

.fxl-panel-detection-settings .actions .small-button {
    min-width: 100px;
}

/*.fxl-panel-detection-settings .actions .small-button.save {
    background-color: rgb(232, 167, 36);
}

.fxl-panel-detection-settings .actions .small-button.close {
    background-color: rgb(215, 31, 38);
}*/

.fxl-panel-detection-settings > .title .close {
    position: absolute;
    right: 8px;
    top: 8px;
    cursor: pointer;
}

@container fxl-panel-detection-settings-scroller scroll-state(scrollable: top){
    .fxl-panel-detection-settings .title {
        background-color: #ffffffcf;
        box-shadow: 0px 0px 3px 0px #00000073;
    }
}

/* ACCESSIBILITY WIDGET - UNLABELED IMAGES WIDGET */

.bt-accessibility-widget {
    padding: 1em;
    background-color: #fff;
    overflow: hidden;
}

.bt-accessibility-widget.stand-alone {
    position: fixed;
    /*z-index: 9999999999999;*/
    border-radius: 10px;
    padding: 0 0 20px;
    overflow-y: hidden;
}


.bt-accessibility-widget.stand-alone .scroll-container {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    overflow-y: auto;
    height: 100%;
    scrollbar-width: thin;
    scrollbar-color: #888 #f1f1f1;
}

.bt-accessibility-widget.stand-alone .scroll-container::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.bt-accessibility-widget.stand-alone .scroll-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 10px;
}

.bt-accessibility-widget.stand-alone .scroll-container::-webkit-scrollbar-thumb {
    background-color: #888;
    border-radius: 10px;
    border: 3px solid #f1f1f1;
}

.bt-unlabeled-images-widget.wizard-mode {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-between;
    align-items: stretch;
}

.bt-accessibility-widget.hidden {
    display: none;
}

.bt-accessibility-widget-overlay {
    position: fixed;
    z-index: 9999;
    background-color: rgba(0, 0, 0, 0.6);
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.bt-accessibility-widget-overlay.hidden {
    display: none;
}

.bt-accessibility-widget-overlay .bt-accessibility-widget {
    position: absolute;
}

.bt-accessibility-widget .header {
    text-align: center;
    position: sticky;
    z-index: 2;
    top: 0;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
    margin-bottom: 0.5em;
    padding: 20px 40px;
    background-color: rgba(255,255,255,0.9);
}

.bt-accessibility-widget .header .title {
    font-weight: bold;
    font-size: 1.6em;
    color: #000;
    letter-spacing: 0.05em;
}

.bt-accessibility-widget .header .title::first-letter {
    text-transform: uppercase;
}

.bt-accessibility-widget .header .controls {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: flex-end;
    align-items: center;
    margin-top: 0;
    width: 100%;
    margin-top: 15px;
}

.bt-accessibility-widget .controls >*:not(:first-child)::before {
    content: '|';
    display: inline;
    margin-left: 0.5em;
    margin-right: 0.5em;
}

.bt-accessibility-widget .fixed-toggler {
    color: #888;
    cursor: pointer;
}

.bt-accessibility-widget .fixed-toggler .fa {
    min-width: 22px;
    display: inline-block;
}

.bt-accessibility-widget .fixed-toggler .fa-eye-slash {
    display: none;
}

.bt-accessibility-widget.hide-fixed .fixed-toggler .fa-eye {
    display: none;
}

.bt-accessibility-widget.hide-fixed .fixed-toggler .fa-eye-slash {
    display: inline-block;
}

.bt-accessibility-widget .fixed-toggler span.label {
    margin-left: 0.5em;
}

.bt-accessibility-widget .header .subtitle,
.bt-accessibility-widget .counter-container > span:first-child {
    color: #888;
    font-size: 16px;
    margin-top: 1em;
    overflow: hidden;
    opacity: 1;
    overflow: hidden;
    max-height: 200px;
    transition: all 0.3s ease;
}

.bt-accessibility-widget.is-scrolling .header .subtitle {
    max-height: 0;
    opacity: 0;
    margin: 0;
    padding: 0;
}

.bt-accessibility-widget.is-scrolling .header {
    border-bottom: 1px solid #aaa;
}

.bt-accessibility-widget .header .close-btn {
    position: absolute;
    top: 0;
    right: 0;
    cursor: pointer;
    font-size: 0.8em;
    margin: 0.6em;
    color: rgb(232, 167, 36);
    background-color: transparent;
}


.bt-unlabeled-images-widget .header .mode-selector {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-around;
    align-items: center;
    border: 1px solid #aaa;
    display: inline-block;
    vertical-align: middle;
}

.bt-unlabeled-images-widget .header .mode-selector .mode {
    text-transform: uppercase;
    font-size: 0.8em;
    cursor: pointer;
    text-align: center;
    display: inline-block;
    min-width: 2em;
    opacity: 0.6;
}

.bt-unlabeled-images-widget .header .mode-selector .mode:first-of-type {
    border-right: 1px solid #aaa;
}

.bt-unlabeled-images-widget .header .mode-selector .mode:last-of-type {
    border-left: 1px solid #aaa;
}

.bt-unlabeled-images-widget .header .mode-selector .mode.selected {
    opacity: 1;
    color: #ddb527;
}

.bt-unlabeled-images-widget .header .mode-selector.disabled .mode {
    pointer-events: none;
    cursor: default;
    opacity: 0.4;
}

.bt-unlabeled-images-widget .footer .actions {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: space-evenly;
    align-items: center;
}

.bt-unlabeled-images-widget.wizard-mode .item-container {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-content: flex-start;
    justify-content: flex-start;
    align-items: flex-start;
    flex: 2;
}

.bt-unlabeled-images-widget.wizard-mode .wizard-step {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    display: none;
}

.bt-unlabeled-images-widget.wizard-mode .wizard-step.current {
    display: flex;
}

.bt-unlabeled-images-widget.wizard-mode.loading .wizard-step {
    display: none;
}

.bt-unlabeled-images-widget.wizard-mode .loader {
    /*display: flex;*/
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    display: none;
}

.bt-unlabeled-images-widget.wizard-mode.loading .loader {
    display: flex;
}

.bt-accessibility-widget ul {
    list-style-type: none;
    border-bottom: 1px solid #eee;
}

.bt-accessibility-widget ul li {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-around;
    align-items: center;
    padding: 20px;
    border-bottom: 1px solid #ddd;
}

.bt-unlabeled-images-widget.list-mode ul li.fixed {
    background-color: #7bed7b21;
}

.bt-unlabeled-images-widget.list-mode.hide-fixed ul li.fixed {
    display: none;
}

.bt-unlabeled-images-widget.list-mode ul li:has(.highlight-alt-image) {
    background-color: #FEF9F1;
}

.bt-accessibility-widget ul li.loader {
    color: #666;
    display: none;
}

.bt-accessibility-widget.loading ul li {
    display: none;
}

.bt-accessibility-widget.loading ul li.loader {
    display: flex;
}

.bt-unlabeled-images-widget .image-container {
    flex: 1;
    max-width: 50%;
    display: flex;
    align-items: center;
    align-content: center;
    justify-items: center;
    flex-wrap: nowrap;
}

.bt-unlabeled-images-widget .image {
    /* background-size: contain;
    background-repeat: no-repeat;
    background-position: center; */
    cursor: pointer;
}

.bt-unlabeled-images-widget li .image {
    /* width: 40%;
    height: 100%;
    min-height: 100px;
    min-width: 100px;
    flex: 1; */
    object-fit: contain;
    max-width: 100%;
    max-height: 200px;
    margin: auto;
    display: block;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.05), 0 2px 15px 0 rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    -webkit-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

.bt-unlabeled-images-widget li .image:hover {
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.05), 0 5px 30px 0 rgba(0, 0, 0, 0.2);
}

.bt-unlabeled-images-widget .wizard-step .image {
    flex: 1;
}

.bt-accessibility-widget .fields {
    flex: 1;
}

.bt-accessibility-widget fieldset {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: start;
    padding-left: 40px;
    position: relative;
    z-index: 0;
}

.bt-accessibility-widget fieldset.vertical {
    flex-direction: column;
    /* flex-flow: column; */
    align-content: flex-start;
    align-items: flex-start;
}

.bt-accessibility-widget fieldset label,
.bt-unlabeled-images-widget fieldset:not(.decorative-check) label {
    color: #808080;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 18px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    height: 18px;
    display: block;
}

.bt-accessibility-widget fieldset .value {
    letter-spacing: 0.05em;
    border-radius: 5px;
    border: 1px solid #000;
    padding: 0.5em;
    margin: 6px 0;
    width: calc(100% - 35px);
    font-family: 'Roboto', sans-serif;
}

.bt-accessibility-widget fieldset .value:focus {
    border-color: rgb(232, 167, 36);
}

.bt-accessibility-widget fieldset .bt-autogenerate-icon {
    position: absolute;
    right: 0;
    bottom: 17px;
}

.bt-accessibility-widget fieldset input,
.bt-accessibility-widget fieldset textarea {
    border: 1px solid #ddd;
}

.bt-accessibility-widget fieldset textarea {
    display: block;
    min-width: 2em;
    text-align: left;
    /*resize: none;*/
}

.bt-unlabeled-images-widget.wizard-mode fieldset.description {
    align-items: flex-start;
}

/*.bt-unlabeled-images-widget fieldset .missing {
    border-color: red;
}*/

.bt-unlabeled-images-widget.wizard-mode fieldset.description {
    align-items: flex-start;
}

.bt-unlabeled-images-widget .fixed fieldset.description input,
.bt-unlabeled-images-widget .fixed fieldset.description textarea {
    border-color: green;
}

.bt-unlabeled-images-widget .wizard-step .content-list {
    width: 100%;
    height: 5em;
    max-height: 5em;
    overflow: hidden;
}

.bt-unlabeled-images-widget .wizard-step .content-list label {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 0.9em;
    width: 100%;
}

.bt-unlabeled-images-widget .wizard-step .content-list ul {
    overflow-y: auto;
    height: 3em;
}

.bt-unlabeled-images-widget .wizard-step .content-list ul li {
    text-align: left;
    display: block;
    cursor: pointer;
}

.bt-unlabeled-images-widget .wizard-step .actions {
    text-align: center;
}

/*.bt-unlabeled-images-widget .counter-container {
    margin-top: 15px;
}*/

.bt-unlabeled-images-widget .counter-container .sep {
    margin-left: 0.25em;
    margin-right: 0.25em;
}

.bt-unlabeled-images-widget .counter-container .done {
    font-weight: bold;
}

.bt-unlabeled-images-widget fieldset.decorative-check {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}

.bt-unlabeled-images-widget fieldset.decorative-check input {
    order: 1;
    max-width: fit-content;
    margin-right: 0.5em;
}

.bt-unlabeled-images-widget fieldset.decorative-check label {
    order: 2;
    color: #808080;
}

.decorative-check-info-button {
    order: 3;
    color: #808080;
    margin-left: 5px;
    font-size: 18px;
    background-color: transparent;
}

.bt-toc-page-list-widget .num {
    /* width: 4em; */
    flex: 0.5;
}

.bt-toc-page-list-widget .content {
    flex: 1.5;
    font-weight: bold;
}

.bt-toc-page-list-widget span.content {
    cursor: pointer;
    color: #4E4E4E;
}

.bt-toc-page-list-widget span.content:hover {
    color: #636363;
}

.bt-toc-page-list-widget fieldset.label {
    flex: 1;
}

.bt-unlabeled-images-widget .bt-autogenerate-icon {
    cursor: pointer;
}

.bt-unlabeled-images-widget .bt-autogenerate-icon.loading {
    pointer-events: none;
}

.bt-unlabeled-images-widget .bt-autogenerate-icon .fa-spinner {
    background-color: #fff;
}