.book
{
    position:   absolute;
    top:        0px;
    left:       0px;
    right:      0px;
    bottom:     0px;
}
.contentTable
{
    background-color:   rgba(250, 250, 250, 1);
    border-right:       solid 1px rgba(0, 0, 0, .1);
    position:           absolute;
    top:                0px;
    left:               0px;
    width:              300px;
    bottom:             0px;
    overflow-y:         hidden;
}
.contentSearch
{
    background-color:   rgba(255, 255, 255, 1);
    padding:            8px;
    position:           absolute;
    top:                0px;
    left:               0px;
    width:              100%;
}
.contentSearch input
{
    border:     none;
    outline:    none;
    padding:    5px;
    width:      100%;
}
.bookTitle, .navButton
{
    border-top: solid 1px rgba(0,0,0,.1);
    padding:    8px 8px 0;
}
.bookTitleLink, .navButtonLink
{
    display:        block;
    padding:        10px 15px;
    text-overflow:  ellipsis;
    overflow:       hidden;
    white-space:    nowrap;
    color:          rgba(0,0,0, .75);
}
.bookTitleLink:hover, .navButtonLink:hover
{
    background-color:   rgba(0,160,255,.8);
}
.contentAndEditor
{
    position:                   absolute;
    top:                        0px;
    left:                       300px;
    right:                      0px;
    bottom:                     0px;
    -webkit-overflow-scrolling: touch;
}
.searchResultsPanel
{
    display:                    none;
    position:                   absolute;
    top:                        0px;
    left:                       300px;
    right:                      0px;
    bottom:                     0px;
    -webkit-overflow-scrolling: touch;
}
.searchResultsListItem
{
    list-style:     none;
    line-height:    1em;
    margin-bottom:  40px;
}
.book.displaySearchResults .contentAndEditor    { display: none; }
.book.displaySearchResults .searchResultsPanel  { display: block; }
.searchResultsSummary
{
    text-transform: uppercase;
    text-align:     center;
    font-weight:    100;
}
.searchResultChapterTitle
{
    font-size:      22px;
    margin-top:     0px;
    margin-bottom:  0px;
}
.searchResultContent
{
    background-color:   rgb(250,250,250);
    margin-top:         10px;
    margin-bottom:      0px;
    padding:            1px 10px 10px 10px;
    font-size:          smaller;
}
.contentEditor
{
    display:        none;
    top:            0px;
    width:          50%;
    left:           0px;
    bottom:         0px;
    position:       absolute;
    overflow-y:     auto;
    border-right:   solid 1px rgba(0,0,0,.1);
}
.contentEditor .editor
{
    top:        0px;
    left:       0px;
    right:      0px;
    bottom:     0px;
    position:   absolute;
}
.content
{
    top:        0px;
    width:      100%;
    right:      0px;
    bottom:     0px;
    position:   absolute;
    padding:    0px 20px;
    overflow-y: auto;
}
.book.editing .contentEditor
{
    display:    block;
}
.book.editing .content
{
    width:  50%;
}
.chapterNavigation
{
    padding:                    4px 0 8px 0;
    position:                   absolute;
    top:                        42px;
    bottom:                     0px;
    left:                       0px;
    right:                      0px;
    overflow-y:                 auto;
    -webkit-overflow-scrolling: touch;
}
.actionNavigation
{
    border-top:         solid 2px rgb(0, 0, 0);
    display:            none;
    position:           absolute;
    left:               0px;
    width:              100%;
    bottom:             0px;
    height:             200px;
    background-color:   rgba(255, 255, 255, .97);
}
.editing .chapterNavigation { bottom: 200px; }
.editing .actionNavigation  { display: block; }
.chapterList
{
    padding:    0;
    margin:     0;
}
.chapterListItem, .subChapterListItem
{
    list-style: none;
    padding:    8px 0px 0px 15px;
    font-size:  14px;
}
.chapterListControl.collapsed > .chapterList > .chapterListItem:not(.hasSelected)
{
    display: none;
}
.chapterListItem > .dragger
{
    position:   relative;
}
.chapterListItem > .chapterTitleInput
{
    width:      100%;
    outline:    none;
    margin:     -2px 0 -2px -2px;
    padding:    5px 0 5px 1px;
    border:     solid 1px rgba(0,0,0,.25);
}
.chapterListItem.dragging
{
    display:    none;
}
.sectionHeader
{
    color:          rgba(0,0,0,.5);
    border-top:     solid 1px rgba(0,0,0,.1);
    margin-top:     8px;
    padding-top:    12px;
}
.chapterTitle
{
    flex-wrap:      nowrap;
    white-space:    nowrap;
    display:        flex;
}
.chapterListItem.dragging .chapterTitle
{
    background-color:   rgba(250,250,250,.5);
}
.chapterListItem.draggingAfter
{
    border-bottom:  solid 2px rgba(0,128,255,1);
}
.chapterListItem.draggingInto > .subChapters
{
    border-bottom:  solid 2px rgba(0,128,255,.2);
}
.chapterListItem.draggingBefore
{
    border-top:     solid 2px rgba(0,128,255,1);
}
.chapterListItem.draggingAfter > .dragger > .shield,
.chapterListItem.draggingBefore > .dragger > .shield
{
    position:   absolute;
    z-index:    10;
    opacity:    0;
    left:       0px;
    bottom:     0px;
    right:      0px;
    top:        0px;
}
.chapterListItem.draggingAfter > .subChapters,
.chapterListItem.draggingBefore > .subChapters
{
    opacity:    .25;
}
.chapterLink
{
    color:          rgba(0,0,0,1);
    cursor:         pointer;
    flex-grow:      100;
    overflow-x:     hidden;
    text-overflow:  ellipsis;
    padding:        4px 5px 4px 0;
}
.chapterLink.active
{
    text-decoration:    none;
    color:              rgba(0,160,255,1);
}
.chapterListItem
{
    position:   relative;
}
.chapterListItem > .actionMenu
{
    position:           absolute;
    top:                5px;
    right:              5px;
    border:             solid 1px rgba(0,0,0,.25);
    border-radius:      2px;
    z-index:            200;
    background-color:   rgb(255,255,255);
    display:            none;
    padding:            0;
    outline:            none;
}
.chapterListItem > .actionMenu.open
{
    display:    block;
}
.link
{
    cursor: pointer;
}
.actionMenu > li > .link:hover
{
    text-decoration:    none;
}
.chapterListItem > .actionMenu > li
{
    list-style: none;
    text-align: right;
    width:      100%;
}
.chapterListItem > .actionMenu > li:not(:first-child)
{
    border-top: solid 1px rgba(0,0,0,.25);
}
.chapterListItem > .actionMenu > li:hover
{
    background-color:   rgba(0,160,255,.8);
}
.chapterListItem > .actionMenu > li > a
{
    display:    inline-block;
    padding:    5px 10px 5px 40px;
    width:      100%;
}
.chapterListItem > .actionMenu > li:hover > a
{
    color:              rgb(255,255,255);
}
.chapterListItem > .dragger > .chapterTitle > .toggleButton { width: 14px; }
.chapterListItem > .dragger > .chapterTitle > .toggleButton .expanded,
.chapterListItem.displaySubChapters > .dragger > .chapterTitle > .toggleButton .collapsed   { display: none; }
.chapterListItem.displaySubChapters > .dragger > .chapterTitle > .toggleButton .expanded    { display: inline; }
.chapterListItem > .dragger > .chapterTitle > .actionButton
{
    display:        none;
    cursor:         pointer;
    opacity:        .5;
    margin-left:    5px;
}
.chapterListItem > .dragger > .chapterTitle > .toggleButton
{
    cursor:     pointer;
    padding:    5px 5px 0 0;
}
.book.editing .chapterListItem > .dragger:hover > .chapterTitle > .actionButton
{
    display:    inline-block;
}
.book.editing .chapterListItem > .dragger:hover > .chapterTitle > .actionButton:hover
{
    opacity:    1;
}
.chapterListItem > .dragger:active > .chapterTitle > .actionButton
{
    opacity:    0;
}
.toggleEditMode
{
    border-left:                solid 1px rgba(0,0,0,.05);
    border-bottom:              solid 1px rgba(0,0,0,.05);
    border-bottom-left-radius:  10px;
    position:                   absolute;
    top:                        0px;
    right:                      0px;
    width:                      50px;
    height:                     50px;
    text-align:                 center;
    color:                      rgba(0,0,0,.05);
    font-size:                  32px;
    background-color:           rgba(255,255,255,.5);
}
.toggleEditMode:hover
{
    color:     rgba(0,0,0,1);
}
.book.editing .toggleEditMode
{
    border-left:    solid 1px rgba(0,0,0,1);
    border-bottom:  solid 1px rgba(0,0,0,1);
    color:          rgba(0,0,0,1);
}