/* Copyright (C) 2001-2011 beingmeta, inc.
   This file is a part of the FDJT web toolkit (www.fdjt.org)
   These are style declarations that work with the UI elements
    implemented in handlers.js and other files.

   This program comes with absolutely NO WARRANTY, including implied
   warranties of merchantability or fitness for any particular
   purpose.

    Use, modification, and redistribution of this program is permitted
    under either the GNU General Public License (GPL) Version 2 (or
    any later version) or under the GNU Lesser General Public License
    (version 3 or later).

    These licenses may be found at www.gnu.org, particularly:
      http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
      http://www.gnu.org/licenses/lgpl-3.0-standalone.html
*/

@charset "UTF-8";

/* New simplified display classes */

.checkspan { cursor: pointer;}
.checkspan .alt { font-size: inherit; font-weight: bold;}
span.checkspan, a.checkspan { white-space: nowrap; }
.checkspan .checked { display: none;}

.checkspan.ischecked { font-weight: bold; }
.checkspan.ischecked .alt { font-size: 80%; font-weight: normal;}
.checkspan.ischecked .unchecked { display: none;}
.checkspan.ischecked span.checked,
.checkspan.ischecked a.checked,
.checkspan.ischecked img.checked { display: inline;} 
.checkspan.ischecked div.checked { display: block;}
.checkspan.ischecked li.checked { display: list-item;}

.checkspan[ischecked] { font-weight: bold; }
.checkspan[ischecked] .alt { font-size: 80%; font-weight: normal;}
.checkspan[ischecked] { display: none;}
.checkspan[ischecked] .unchecked { display: none;}
.checkspan[ischecked] span.checked,
.checkspan[ischecked] a.checked,
.checkspan[ischecked] img.checked { display: inline;} 
.checkspan[ischecked] div.checked { display: block;}
.checkspan[ischecked] li.checked { display: list-item;}

/* Autoprompt classes */

input.autoprompt { font-family: sans,sans-serif; }
input.autoprompt[isempty] { font-style: italic; color: gray;}
input.autoprompt.isempty { font-style: italic; color: gray;}

textarea.autoprompt { font-family: sans,sans-serif;}
textarea.autoprompt[isempty] { font-style: italic; color: gray;}
textarea.autoprompt.isempty { font-style: italic; color: gray;}

/* Input help classes */

.helptext { color: purple;}
span.helptext { display: none; }
div.helptext { display: none; }
td.helptext { display: none; }
p.helptext { display: none; }

body.showhelp span.helptext { display: block;}
body.showhelp div.helptext { display: block;}
body.showhelp td.helptext { display: table-cell;}
body.showhelp p.helptext { display: block;}

img.helpicon { 
  padding-right: 2px; padding-left: 2px;
  margin-left: 1px; margin-right: 0px;
  color: yellow; background-color: gray;
  font-size: 80%; vertical-align: middle;
  font-weight: bold; font-style: normal;}

/* Tabs */

div.tabbar { line-height: 200%;}

a.tab:visited { color: inherit;}
a.tab:hover { color: darkblue; text-decoration: underline;}
a.tab, span.tab {
  color: inherit;
  font-family: sans,sans-serif;
  margin-left: 2px; margin-right: 2px;
  border: outset black 2px;
  padding: 3px;}
a.tab[shown], span.tab[shown],a.tab.fdjtshown, span.tab.fdjtshown {
  /* font-weight: bold; */
  border: inset black 2px;
  border-bottom: hidden;}
div.tabbar.vertical[shown],div.tabbar.vertical.fdjtshown {
  border-bottom: inset;}
div.tabcontent {
 margin-left: 9px; margin-top: 6px; margin-right: 9px;
 text-align: left;
 display: none;}
div.tabcontent[shown],div.tabcontent.fdjtshown { display: block; }
div.tabcontent div.tabcontent[shown],div.tabcontent div.tabcontent.fdjtshown { display: none; }
div.tabcontent[shown] div.tabcontent[shown],div.tabcontent.fdjtshown div.tabcontent.fdjtshown { display: block; }

div.tabcontent div.narrative {
 color: purple; font-family: sans; font-style: italic;}
div.tabcontent p {
 margin: 2px; padding: 2px;}

/* Lisp(ish) data */

.lispish { font-family: fixed;}
.lispexpr { font-family: fixed; font-style: italic;}
.lispvalue { font-family: fixed;}

/* KNodes (from knodules) */

span.dterm {
  opacity: .95; color: blue; font-family: sans,sans-serif; white-space: nowrap;}
span.dterm span.disambig {
  color: red;}
span.dterm .langid {
  color: green; font-style:italic; font-family: fixed;}

/* Wordforms and langids */

span.wordform {
  white-space: nowrap; color: black;}
span.wordform sub.langids {
  color: green; font-family: fixed;}
span.wordform .langid {
  color: green; font-family: fixed;}

/* Glosses */

p.gloss {
  font-style: italic; font-family: sans;}
p.gloss span.spacer {
  padding-left: 6px; padding-right: 6px;
  font-family: sans; font-weight: bold; font-size: 150%;}

/* Font sizers */

span.font_sizer {
  float: right; width: 16px; -moz-opacity: 0.75;
  font-size: 14px; font-weight: bold; 
  text-align: center; cursor: pointer; margin: 2px;
  background: gray; color: white;}

/* Flexboxes */

div.flexbox { max-height: 128px;}
div.flexbox_expanded { max-height: inherit;}

/* Formatted output */

div.fdjtdata {
  font-family: fixed; width: 100%; white-space: pre;}

/* Data tables */

table.fdjtdata {width: 100%; font-family: fixed;}
table.fdjtdata th { 
  vertical-align: top; text-align: right; padding-right: 2px;}
table.fdjtdata td { 
  vertical-align: top; text-align: left; padding-left: 2px;}

table.fdjt {width: 100%; font-family: sans,sans-serif;}
table.fdjt th { vertical-align: top; text-align: right;}
table.fdjt td { vertical-align: top; text-align: left;}
table.fdjt td input.fullwidth[type='TEXT'] { width: 100%;}
table.fdjt td textarea.fullwidth { width: 100%;}

/* Auto completion */

div.completions {font-family: sans,sans-serif;}
.completions .label { float: right;}

.completions .nocompletemsg { display: none;}
.completions.noresults span.nocompletemsg { display: inline;}
.completions.noresults li.nocompletemsg { display: list-item;}
.completions.noresults div.nocompletemsg { display: block;}
.completions.noresults p.nocompletemsg { display: block;}

.completions .completion { display: none; }
.completions .completion .variation { display: none; }
.completions .completion[displayed] .variation { display: none; }
.completions .completion.displayed .variation { display: none; }

.completions.noinput a.completion.cue { display: inline; }
.completions.noinput span.completion.cue { display: inline; }
.completions.noinput li.completion.cue { display: list-item; }
.completions.noinput div.completion.cue { display: block; }
/* Override these */
.completions.noinput .completion.cue.hidden { display: none; }

.completions.showempty.noinput a.completion { display: inline; }
.completions.showempty.noinput span.completion { display: inline; }
.completions.showempty.noinput li.completion { display: list-item; }
.completions.showempty.noinput div.completion { display: block; }
/* Override these */
.completions.showempty.noinput .completion.hidden { display: none; }

.completions .noinputmsg { display: none;}

.completions.maxcomplete .completion[displayed] { display: none;}
.completions.maxcomplete .completion.displayed { display: none;}

.completions .maxcompletemsg { display: none;}
.completions.maxcomplete span.maxcompletemsg { display: inline;}
.completions.maxcomplete a.maxcompletemsg { display: inline;}
.completions.maxcomplete li.maxcompletemsg { display: list-item;}
.completions.maxcomplete div.maxcompletemsg { display: block;}
.completions.showmaxcomplete span.maxcompletemsg { display: inline;}
.completions.showmaxcomplete a.maxcompletemsg { display: inline;}
.completions.showmaxcomplete li.maxcompletemsg { display: list-item;}
.completions.showmaxcomplete div.maxcompletemsg { display: block;}
.completions.noinput .maxcompletemsg { display: none;}

.maxcompletemsg .hideall { color: blue; font-style: italic;}
.maxcompletemsg .showall { color: blue; font-style: italic;}
.completions.maxcomplete .maxcompletemsg .hideall { display: none;}
.completions.showmaxcomplete .maxcompletemsg .showall { display: none;}

.completions.noinput span.noinputmsg { display: inline;}
.completions.noinput li.noinputmsg { display: list-item;}
.completions.noinput div.noinputmsg { display: block;}
.completions.noinput p.noinputmsg { display: block;}

/* Display rules (with displayed attribute) */

.completions a.completion[displayed] { display: inline;}
.completions span.completion[displayed] { display: inline;}
.completions li.completion[displayed] { display: list-item;}
.completions div.completion[displayed] { display: block;}

.completions .completion[displayed] span.variation[displayed] { 
   display: inline; }
.completions .completion[displayed] li.variation[displayed] { 
   display: list-item; }
.completions .completion[displayed] div.variation[displayed] { 
   display: block; }

.completions.maxcomplete .completion[displayed] .variation[displayed] { 
   display: none; }

/* Display rules (with displayed class) */

.completions a.completion.displayed { display: inline;}
.completions span.completion.displayed { display: inline;}
.completions li.completion.displayed { display: list-item;}
.completions div.completion.displayed { display: block;}

.completions a.completion.displayed span.variation.displayed { 
   display: inline; }
.completions .completion.displayed span.variation.displayed { 
   display: inline; }
.completions .completion.displayed li.variation.displayed { 
   display: list-item; }
.completions .completion.displayed div.variation.displayed { 
   display: block; }

.completions.maxcomplete .completion.displayed .variation.displayed { 
   display: none; }

/* Checkspan/completion display rules (attribute based) */

.completions.checkspans span.completion.checkspan[ischecked] { 
  display: inline; }
.completions.checkspans li.completion.checkspan[ischecked] { 
  display: list-item; }
.completions.checkspans div.completion.checkspan[ischecked] { 
  display: block; }
.completions.checkspans p.completion.checkspan[ischecked] { 
  display: block; }

.completions.checkspans .completion.checkspan[ischecked]
     span.variation[displayed] { display: inline; }
.completions.checkspans .completion.checkspan[ischecked]
     li.variation[displayed] { display: list-item; }
.completions.checkspans .completion.checkspan[ischecked]
     div.variation[displayed] { display: block; }
.completions.checkspans .completion.checkspan[ischecked]
     div.variation[displayed] { display: block; }

.completions.checkspans span.completion.checkspan[ischecked] { 
  display: inline; }
.completions.checkspans li.completion.checkspan[ischecked] { 
  display: list-item; }
.completions.checkspans div.completion.checkspan[ischecked] { 
  display: block; }
.completions.checkspans p.completion.checkspan[ischecked] { 
  display: block; }

.completions.checkspans .completion.checkspan[ischecked]
     span.variation[displayed] { display: inline; }
.completions.checkspans .completion.checkspan[ischecked]
     li.variation[displayed] { display: list-item; }
.completions.checkspans .completion.checkspan[ischecked]
     div.variation[displayed] { display: block; }
.completions.checkspans .completion.checkspan[ischecked]
     div.variation[displayed] { display: block; }

/* Checkspan/completion display rles (class based) */

.completions.checkspans span.completion.checkspan.ischecked { 
  display: inline; }
.completions.checkspans li.completion.checkspan.ischecked { 
  display: list-item; }
.completions.checkspans div.completion.checkspan.ischecked { 
  display: block; }
.completions.checkspans p.completion.checkspan.ischecked { 
  display: block; }

.completions.checkspans .completion.checkspan.ischecked
     span.variation.displayed { display: inline; }
.completions.checkspans .completion.checkspan.ischecked
     li.variation.displayed { display: list-item; }
.completions.checkspans .completion.checkspan.ischecked
     div.variation.displayed { display: block; }
.completions.checkspans .completion.checkspan.ischecked
     div.variation.displayed { display: block; }

.completions.checkspans span.completion.checkspan.ischecked { 
  display: inline; }
.completions.checkspans li.completion.checkspan.ischecked { 
  display: list-item; }
.completions.checkspans div.completion.checkspan.ischecked { 
  display: block; }
.completions.checkspans p.completion.checkspan.ischecked { 
  display: block; }

.completions.checkspans .completion.checkspan.ischecked
     span.variation.displayed { display: inline; }
.completions.checkspans .completion.checkspan.ischecked
     li.variation.displayed { display: list-item; }
.completions.checkspans .completion.checkspan.ischecked
     div.variation.displayed { display: block; }
.completions.checkspans .completion.checkspan.ischecked
     div.variation.displayed { display: block; }

/* Rich tips 
   Richtips are overlayed tooltips for metakeys, displayed
   in translucent rectangles.
*/

div.richtip {
  text-align: left; padding: 3px;
  font-size: 12px; font-family: sans-serif; font-weight: normal;
  width: 33%; position: absolute; top: 24pt; left: 24pt;
  display: none; background: lightgray;
  opacity: .85; -moz-opacity: .85; -webkit-opacity: 0.85;
  z-index: 32;}
div.richtip:hover { 
  opacity: 0.95; -moz-opacity: 0.95; -webkit-opacity: 0.95;}

div.richtip span.dterm {
  color: blue; font-size: 14px; font-weight: bold;}
div.richtip span.disambiguator {
  color: red; font-size: 14px; font-weight: bold;}
div.richtip span.term {
  color: blue; font-size: 14px; font-weight: bold;}

div.richtip span.gloss {
  color: black; font-style: italic;}
div.richtip div.rel {}
div.richtip div.rel span.relname {
  font-weight: bold; padding: 2px; color: purple;}

div.richtip span.controls { 
  float: right; display: none;
  text-align: right; vertical-align: top;}
div.richtip.static span.controls { 
  float: right; display: inline; padding-left: 5px;}
div.static.richtip { display: block;}
div.live.richtip { display: block;}

div.richtip span.controls .button {
  font-weight: bold; font-size: 150%; color: brown; 
  padding: 0px; margin: 0px; padding-right: 1px;
  cursor: pointer; vertical-align: top;}

div.richtip.minimized { max-height: 45px;}
div.richtip.minimized .maximize { display: inline; }
div.richtip.minimized .minimize { display: none; }
div.richtip .minimize { display: inline; }
div.richtip .maximize { display: none; }

/* Some utility definitions */

.fullwidth { width: 100%;}
.abstopright { position: absolute; top: 2px; right: 2px;}
.abstopleft { position: absolute; top: 2px; left: 2px;}
.abstopleft img {border: 0px;}
.abstopright img {border: 0px;}
.floatleft { float: left;}
.floatright { float: right;}

/* Tables for form input */

table.fdjtform { width: 100%;}
table.fdjtform th, table.fdjtform td { vertical-align: top;}

table.fdjtform th { text-align: right;}

table.fdjtform td { text-align: left;}
table.fdjtform td.rightalign { text-align: right;}

table.fdjtform td input[TYPE='TEXT'] {width: 100%;}
table.fdjtform td textarea { width: 100%;}

table.fdjtform td.messages {
    text-align: center; font-style: italic;}
table.fdjtform td.messages div.message {
    text-align: left; max-width: 35em; margin-left: auto; margin-right: auto;
    color: red;}

table.fdjtform tbody.collapsible tr.collapsible { display: none;}
table.fdjtform tbody.collapsible div.collapsible { display: none;}
table.fdjtform tbody.collapsible span.collapsible { display: none;}
table.fdjtform tbody.collapsible.expanded tr.collapsible { display: table-row;}
table.fdjtform tbody.collapsible.expanded div.collapsible { display: block;}
table.fdjtform tbody.collapsible.expanded span.collapsible { display: inline;}
table.fdjtform tbody.collapsible .expanded { display: none;}
table.fdjtform tbody.collapsible.expanded div.expanded { display: block;}
table.fdjtform tbody.collapsible.expanded span.expanded { display: inline;}
table.fdjtform tbody.collapsible.expanded img.expanded { display: inline;}
table.fdjtform tbody.collapsible.expanded button.expanded { display: inline;}
table.fdjtform tbody.collapsible.expanded input.expanded { display: inline;}
table.fdjtform tbody.collapsible.expanded .collapsed { display: none;}

form.evalform input[name='EXPR'] {
    font-family: fixed; width: 100%;}

/* Twisties */

div.twisties {}
div.twisties span.twisty { 
  vertical-align: top; cursor: pointer;}
div.twisties span.twisty img { font-weight: bold;}
div.twisties span.twisty img[alt='-'] { display: none;}
div.twisties.expanded span.twisty img[alt='-'] { display: inline;}
div.twisties.expanded span.twisty img[alt='+'] { display: none;}
div.twisties.expanded span.twisty { font-weight: bold;}

/* Displaying deadlinks as red, Wikipedia style */

a.deadlink { color: red;}
span.underline { text-decoration: underline;}

/* Log entries */

div.fdjtlog { text-align: left; margin-left: 2em;}
div.fdjtlog span.time {
    float: left; width: 6em; color: green;}

/* Expansion */

.fdjtexpands.closed * { display: none;}
.fdjtexpands.closed span.controller { display: inline;}
.fdjtexpands.closed div.controller { display: block;}

/* Emacs local variables
;;;  Local variables: ***
;;;  compile-command: "make; if test -f ../makefile; then cd ..; make; fi" ***
;;;  End: ***
*/

.fdjtexpands .whenexpanded { display: none;}
.fdjtexpands.fdjtexpanded .whencollapsed { display: none;}

.fdjtexpands.fdjtexpanded span.whenexpanded,
.fdjtexpands.fdjtexpanded a.whenexpanded,
.fdjtexpands.fdjtexpanded em.whenexpanded,
.fdjtexpands.fdjtexpanded strong.whenexpanded,
.fdjtexpands.fdjtexpanded cite.whenexpanded  {
    display: inline;}
.fdjtexpands.fdjtexpanded p.whenexpanded,
.fdjtexpands.fdjtexpanded blockquote.whenexpanded,
.fdjtexpands.fdjtexpanded div.whenexpanded {
    display: block;}
.fdjtexpands.fdjtexpanded li.whenexpanded {
    display: list-item;}

/* FramerD error display */

/* Error pages */

body#ERRORPAGE {
  margin: 22px; margin-right: 40px;
  background-color: black; color: ivory;}

div.server_sorry {
  font-family: sans; font-size: 120%; color: silver;}
div.server_sorry div.error {
  font-weight: bold; font-size: 140%; color: white;}

div.error {
  margin-left: 8em; text-indent: -8em; font-family: sans; }
div.error span.ex { font-weight: bold;}
div.error span.cxt { font-weight: normal; }
div.error span.details { font-weight: normal; font-style: italic; }
div.error span.irritant {
  margin-left: 6px; white-space: nowrap;
  color: red;}
div.error div.irritant {
  margin-left: 6px; font-family: fixed; white-space: pre;
  color: red;}


div.backtrace { margin-top: 18px; font-size: 120%;}

div.backtrace_indent {
  margin-left: 8px; font-size: 98%;}

div.backtrace div.expr {
  font-family: courier,fixed; white-space: pre; text-align: left;
  padding-top: 3px; padding-bottom: 3px;}
div.backtrace div.expr span.focus {
  font-weight: bold; color: yellow; font-size: 120%;}

div.backtrace div.bindings {
  background-color: ivory;  color: black;
  padding-left: 64px; text-indent: -64px;
  padding-top: 4px; padding-bottom: 4px;}
div.backtrace div.bindings span.binding {
  font-family: fixed; font-weight: bold; color: red; white-space: nowrap; }
div.backtrace div.bindings span.head {
  padding-right: 12px; color: brown; font-weight: bold;}

div.backtrace div.rail {
  background-color: green;}
div.backtrace div.rail span.name {
  color: yellow; font-family: sans; font-weight: bold; padding-right: 8px;}
div.backtrace div.rail span.arg {
  color: white; font-family: fixed; font-weight: bold;
  padding-right: 6px; padding-left: 6px;}

div.backtrace div.last_entry {
  font-size: 160%;}

/* Human libnotify CSS */

/* recommended base settings */
.humane {
  filter                : progid:DXImageTransform.Microsoft.alpha(opacity=100);
  -ms-filter            : "progid:DXImageTransform.Microsoft.alpha(opacity=100)";
  position              : fixed;
  _position             : absolute; /* ie6 */
  -moz-transition       : all .5s;  /* .5s transition */
  -webkit-transition    : all .5s;
  -o-transition         : all .5s;
  -ms-transition        : all .5s;
  transition            : all .5s;
  visibility            : hidden;
  z-index               : -100;
}
.humane.humane-show { visibility : visible;
		      z-index    : 100000;}
/* ie hover state, recommended */
.humane:hover {
  filter                : progid:DXImageTransform.Microsoft.alpha(opacity=20);
  -ms-filter            : "progid:DXImageTransform.Microsoft.alpha(opacity=20)";
}
/* standards hover state, recommended */
div.humane.humane-show:hover { opacity: 0.2; }

/* custom settings */
.humane {
  font-family           : Verdana, sans-serif;
  font-size             : 15px;
  letter-spacing        : -1px;
  bottom                : 10px;
  right                 : 30px;
  opacity               : 0;
  width                 : 150px;
  color                 : #fff;
  padding               : 10px;
  text-align            : center;
  background-color      : #000;
  background-color      : rgba(0,0,0,0.8);
  background-image      : -moz-linear-gradient(top, rgba(0,0,0,.5), rgba(50,50,50,.5));
  background-image      : -ms-linear-gradient(top,  rgba(0,0,0,.5), rgba(50,50,50,.5));
  background-image      : -o-linear-gradient(top,   rgba(0,0,0,.5), rgba(50,50,50,.5));
  background-image      : -webkit-gradient(linear, left top, left bottom, from(rgba(0,0,0,.8)), to(rgba(50,50,50,.8)));
  background-image      : -webkit-linear-gradient(top, rgba(0,0,0,.8), rgba(50,50,50,.8));
  background-image      : linear-gradient(top, rgba(0,0,0,.8), rgba(50,50,50,.8));;
  -moz-border-radius    : 5px;
  -webkit-border-radius : 5px;
  -o-border-radius      : 5px;
  border-radius         : 5px;
  -moz-box-shadow       : 0 4px 4px -4px #000;
  -webkit-box-shadow    : 0 4px 4px -4px #000;
  box-shadow            : 0 4px 4px -4px #000;
}

/* custom animation for css transition supported browsers */
.humane.humane-show { opacity: 1; }

/* other customizations */
.humane p {
  margin                : 5px;
  display               : inline;
}
.humane ul {
  list-style            : none;
  margin                : 0;
  padding               : 0;
}
.humane .error {
  color                 : red;
}
/* Copyright (C) 2001-2011 beingmeta, inc.
   This file is a part of the FDJT web toolkit (www.fdjt.org)
   These are style declarations that work with the UI elements
    implemented in handlers.js and other files.

   This program comes with absolutely NO WARRANTY, including implied
   warranties of merchantability or fitness for any particular
   purpose.

    Use, modification, and redistribution of this program is permitted
    under either the GNU General Public License (GPL) Version 2 (or
    any later version) or under the GNU Lesser General Public License
    (version 3 or later).

    These licenses may be found at www.gnu.org, particularly:
      http://www.gnu.org/licenses/old-licenses/gpl-2.0.html
      http://www.gnu.org/licenses/lgpl-3.0-standalone.html
*/

@charset "UTF-8";

/* These classes attempt to inhibit inappropriate block styling when a
   block is spread across pages. */

div.codexdupstart {
    padding-bottom: 0px; border-bottom-width: 0px; margin-bottom: 0px;}
div.codexdup {
    padding-top: 0px;    border-top-width: 0px;    margin-top: 0px;
    padding-bottom: 0px; border-bottom-width: 0px; margin-bottom: 0px;}
div.codexdupend {
    padding-top: 0px;    border-top-width: 0px;    margin-top: 0px;}
p.codexdupend, p.codexdup { text-indent: 0px;}

/* These can be used directly or inserted without the body.codexNNN root */

body.codexfixed div.codexpage {
    position: fixed; text-align: left;
    transition-property: opacity; transition-duration: 0.5s;
    -o-transition-property: opacity; -o-transition-duration: 0.5s;
    -moz-transition-property: opacity; -moz-transition-duration: 0.5s;
    -webkit-transition-property: opacity; -webkit-transition-duration: 0.5s;}
body.codexfade div.codexpage { opacity: 0; }
body.codexfade div.codexpage.curpage {opacity: 1; z-index: 50;}

/* -*- Mode: CSS; character-encoding: utf-8; -*- */

/* Copyright (C) 2009-2011 beingmeta, inc.
   This file implements a Javascript/DHTML UI for reading
    large structured documents (sBooks).

   For more information on sbooks, visit www.sbooks.net
   For more information on knodules, visit www.knodules.net
   For more information about beingmeta, visit www.beingmeta.com

   This library uses the FDJT (www.fdjt.org) toolkit.

   This program comes with absolutely NO WARRANTY, including implied
   warranties of merchantability or fitness for any particular
   purpose.

    Use and redistribution (especially embedding in other
      CC licensed content) is permitted under the terms of the
      Creative Commons "Attribution-NonCommercial" license:

          http://creativecommons.org/licenses/by-nc/3.0/ 

    Other uses may be allowed based on prior agreement with
      beingmeta, inc.  Inquiries can be addressed to:

       licensing@biz.beingmeta.com

   Enjoy!

*/

@charset "UTF-8";

/* Login tables */

table.login {}
table.login tbody { padding-bottom: 24px;}
table.login th {text-align: right; vertical-align: top; font-size: 125%;}
table.login th.or {font-size: 150%; color: gold;}
table.login td {text-align: left; vertical-align: top;}
table.login td.oneclick a { float: left; margin-right: 3px;}
table.login td.oneclick a.login {
  background-color: white; padding: 0px; margin-right: 8px;}
table.login td.oneclick a.login img {
  margin: 0px; border: 0px; padding: 0px;}
table.login td.oneclick a.login[value='facebook'] {
  background-color: inherit;}
table.login a.button { padding: 1px;}
table.login td a.button { padding: 1px; }
table.login td.oneclick button {
    min-height: 50px; max-height: 50px; height: 50px;
    border-radius: 5px; -o-border-radius: 5px;
    -moz-border-radius: 5px; -webkit-border-radius: 5px;
    vertical-align: top;}
table.login .registering input[TYPE='SUBMIT'][VALUE='Login'],
table.login input[TYPE='SUBMIT'][VALUE='Register'] {
    display: none;}
table.login .registering input[TYPE='SUBMIT'][VALUE='Register'] {
    display: inline;}
table.login td input[TYPE='TEXT'] { }
table.login td input[TYPE='TEXT'][NAME='USERNAME'] { width: 100%;}
table.login td input[TYPE='TEXT'][NAME='NAME'] { width: 100%;}
table.login td input[TYPE='TEXT'][NAME='USERID'] { width: 100%;}
table.login td input[TYPE='PASSWORD'] { 
  width: 50%; min-width: 20em;}
table.login td input[TYPE='TEXT'][NAME='OPENID'] {
  width: 100%;}
table.login td div.doc {
    display: none; font-style: italic; color: purple;}
table.login td.icon { vertical-align: top;}
table.login td.icon img.helpicon {
  color: yellow; background-color: blue;
  margin-top: 3px; margin-left: 3px;
  display: none;}
table.login tr td { }
table.login tr th { }
table.login tr.nospace td { border-bottom: 0px;}
table.login tr.nospace th { border-bottom: 0px;}
table.login a img { border: none;}
table.login td.userlogin { vertical-align: top;}
table.login td.userlogin button { padding: 2px;}
table.login td.userlogin img { vertical-align: top; height: 16px;}

table.login tr.blockstart td {
    border-bottom: solid blue 7px;}
table.login tr.blockbreak td {
    border-top: solid transparent 12px;
    border-bottom: solid blue 7px;}
table.login tr.blockstart th {
    border-bottom: solid silver 7px;}
table.login tr.blockbreak th {
    border-top: solid transparent 12px;
    border-bottom: solid silver 7px;}

/* Emacs local variables
;;;  Local variables: ***
;;;  compile-command: "cd ..; make" ***
;;;  End: ***
*/
/* -*- Mode: CSS; -*- */

/* Copyright (C) 2009-2011 beingmeta, inc.
   This file provides for the display of KNODULES
     a lightweight knowledge representation facility.

   For more information on knowlets, visit www.knowlets.net
   For more information about beingmeta, visit www.beingmeta.com

   This program comes with absolutely NO WARRANTY, including implied
   warranties of merchantability or fitness for any particular
   purpose.

    Use, modification and redistribution of this program is permitted
    under the GNU General Public License (GPL) Version 2:

          http://www.gnu.org/licenses/old-licenses/gpl-2.0.html

    Use and redistribution (especially embedding in other
      CC licensed content) is permitted under the terms of the
      Creative Commons "Attribution-NonCommercial" license:

          http://creativecommons.org/licenses/by-nc/3.0/ 

    Other uses may be allowed based on prior agreement with
      beingmeta, inc.  Inquiries can be addressed to:

       licensing@biz.beingmeta.com

   Enjoy!

*/

div.dterm {}
div.dterm span.head {
  font-weight: bold; color: blue;}
div.dterm span.head span.disambig {
  font-weight: bold; color: red;}

div.richtip .relcode {
  font-weight: bold; color: red;}

span.dterm {}
span.dterm.weak:before {
    font-weight: bold; content: '“'; color: red;}
span.dterm.weak:after {
    font-weight: bold; content: '”'; color: red;}
/* TOC rules */

div.codextoc { display: none;}
div.codextoc div.spanbar { height: 20px;}
div.codextoc > div, div.codextoc > div.head {
    margin-left: 32px; margin-right: 32px;}
div.codextoc div.head {
  position: relative; margin: 0px; padding: 0px; border: 0px;
  left: 0px; right: 0px; margin: 0px;
  margin-left: 32px; margin-right: 32px;
  display: none;}
div.codextoc > div.spanbar {
  margin-left: 0px; margin-right: 0px;}

div.codextoc div.head { min-height: 24px;}
div#CODEXFLYTOC div.codextoc div.head { min-height: inherit;}

div.codextoc div.head .progressbar { 
  color: lightblue; background-color: lightblue;
  padding: 0px; margin: 0px; border-right: solid red 3px;
  position: absolute;  left: 0px; height: 100%;
  z-index: -100; opacity: 0.5;}
div.codextoc img[alt='next'], div.codextoc img[alt='nextstop'] {
    float: right; cursor: pointer; z-index: 100;}
div.codextoc img[alt='back'], div.codextoc img[alt='backstop'] {
    float: left; cursor: pointer; z-index: 100;}

/* Conditional display, so only the live elements are displayed */
div.codextoc.live { display: block;}
div.codextoc.live div.head { display: block;}

div.codextoc.live div.codextoc { display: none;}
div.codextoc.live div.codextoc.live { display: block;}

div.codextoc div.sub {
    display: none; clear: both;}
div.codextoc.cur div.head { font-size: 125%;}
div.codextoc.cur div.sub { display: block;}

/* TOCSCAN */

div#CODEXHUD.tocscan div.codextoc.cur div.sub { display: none;}

body.hudup div#CODEXHUD.tocscan div.codextoc.live div.head,
body.hudup div#CODEXHUD.tocscan div.codextoc.live img {
    height: 0px;}
body.hudup div#CODEXHUD.tocscan div.codextoc.live.cur > div.head,
body.hudup div#CODEXHUD.tocscan div.codextoc.live.cur > img {
    height: inherit;}

div#CODEXFLYLEAF div#FLYTOC div.codextoc {
    display: block; font-size: 90%; text-align: left;}
div#CODEXFLYLEAF div#FLYTOC div.codextoc img { display: none;}
div#CODEXHUD div#CODEXFLYLEAF div#FLYTOC div.codextoc div.head {
    margin-left: 0px; margin-right: 0px;
    display: block; font-weight: bold;}
div#CODEXHUD div#CODEXFLYLEAF div#FLYTOC div.codextocleaf > div.head {
    display: block; font-weight: normal;}
div#CODEXHUD div#CODEXFLYLEAF div#FLYTOC hr.progressbar {
    display: none; border: none;}
div#CODEXHUD div#CODEXFLYLEAF div#FLYTOC div.progressbox { display: none;}
div#CODEXHUD div#CODEXFLYLEAF div#FLYTOC div.live > div.head { color: blue;}
div#CODEXHUD div#CODEXFLYLEAF div#FLYTOC
  div.live > div.head hr.progressbar {
      display: block;}
div#CODEXHUD div#CODEXFLYLEAF div#FLYTOC
  div.live > div.spanbar div.progressbox {
      display: block;}

div#CODEXFLYTOC div.codextoc.cur div.sub { display: none;}

div.codextoc .sectname.cohi { background-color: gold;}
div.codextoc .sectname { color: darkblue; cursor: pointer;}
div.codextoc div.sub a.sectname { 
  color: darkblue; font-size: 80%; white-space: nowrap;}
div.codextoc div.sub a.sectname.cohi { background-color: gold; }

div#CODEXHUD div.codextoc div.head { display: none;}
div#CODEXHUD div.codextoc div.head { display: none;}
div#CODEXHUD div.codextoc div.spanbar { display: none;}
div#CODEXHUD div.codextoc img { display: none;}

div#CODEXHUD.toc div.codextoc div.head { display: block;}
div#CODEXHUD.toc div.codextoc div.spanbar { display: block;}
div#CODEXHUD.toc div.codextoc img { display: inherit;}
div#CODEXHUD.toc div.codextoc.cur div.sub { display: block;}
div#CODEXHUD div#CODEXTOC.hover div.codextoc.cur div.sub { display: none;}

div#CODEXHUD.tocscan div.hudpanel#CODEXTOC { opacity: 0.9;}
div#CODEXHUD.tocscan div.codextoc.cur > div.head { display: block;}
div#CODEXHUD.tocscan div.codextoc.cur > img { display: inherit;}
div#CODEXHUD.tocscan div.codextoc div.spanbar { display: none;}
div#CODEXHUD.tocscan div.codextoc.cxt > div.spanbar { display: block;}

div#CODEXTOC div.spanbar {
  position: relative;
  text-align: center; clear: both;
  margin: 0px; padding: 0px; border: 0px;} /* opacity: 0.5;  */
div.spanbar div.codexhudspan a.brick.live {
    background-color: lightblue; opacity: 0.5;}
div#CODEXFLYTOC div.spanbar div.codexhudspan a.brick.live {
    background-color: blue; opacity: 0.5;}

div#CODEXTOC div.spanbar { height: 40px; }
div#CODEXTOC div.spanbar div.codexhudspan { height: 38px; z-index: 50; opacity: 0.5;}
div#CODEXTOC div.spanbar div.progressbox { height: 40px;}
div#CODEXTOC div.spanbar div.spans { border-top: solid blue 1px;}
div#CODEXTOC div.spanbar div.spans a.codextitle {
    font-size: 30px; height: 38px;}

div#CODEXTOC div.codextoc.cur > div.spanbar { height: 20px; }
div#CODEXTOC div.codextoc.cur > div.spanbar div.codexhudspan { height: 18px;}
div#CODEXTOC div.codextoc.cur > div.spanbar div.progressbox { height: 20px;}
div#CODEXTOC div.codextoc.cur > div.spanbar div.spans a.codextitle { display: none;}
div#CODEXTOC div.codextoc.cur div.spanbar div.codexhudspan a.brick.cohi {
    background-color: gold; opacity: 0.5;}

div#CODEXTOC div.codextoc {
    border-bottom-left-radius: 6px;
    -webkit-border-bottom-left-radius: 6px; 
    -moz-border-radius-bottomleft: 6px;
    -o-border-radius-bottomleft: 6px; 
    border-bottom-right-radius: 6px;
    -webkit-border-bottom-right-radius: 6px; 
    -moz-border-radius-bottomright: 6px;
    -o-border-radius-bottomright: 6px;}
div#CODEXTOC div.codextoc div.codextoc {
    border-bottom-left-radius: 0px;
    -webkit-border-bottom-left-radius: 0px; 
    -moz-border-radius-bottomleft: 0px;
    -o-border-radius-bottomleft: 0px; 
    border-bottom-right-radius: 0px;
    -webkit-border-bottom-right-radius: 0px; 
    -moz-border-radius-bottomright: 0px;
    -o-border-radius-bottomright: 0px;}

div#CODEXHUD div#CODEXFLYTOC div.spans a.codextitle { display: none;}

div#CODEXHUD div#CODEXFLYTOC div.codextoc div.spanbar { display: block;}

div#CODEXTOC div.spanbar {
    border-top: solid blue 1px; border-right: solid blue 1px;}
div#CODEXTOC div.codextoc.cxt div.spanbar {
    border-bottom: solid blue 1px;}
div.spanbar div.spans { 
  position: relative; width: 100%; /* background-color: black; */
  margin: 0px; padding: 0px; border: 0px;}
div.codextoc div.spanbar div.spans a.codextitle {font-weight: bold;}
div.codextoc div.spanbar div.spans a.codextitle {
    position: absolute; top: 4px; width: 100%; z-index: 100;
    display: none;}
div.codextoc div.spanbar:hover div.spans a.codextitle {
    z-index: 0;}
div.codextoc div.spanbar:hover div.spans a.codextitle {
    z-index: -50;}
div.codextoc div.spanbar div.spans a.codextitle.live {
    display: block;}
div.spanbar div.codexhudspan {
  background-color: transparent; clear: none; position: absolute;
  margin: 0px; padding: 0px; border: 0px;
  border-right: none; border-left: none;}
div#CODEXFLYTOC div.spanbar div.codexhudspan {
    border-top: solid blue 1px; border-bottom: solid blue 1px;}
div.spanbar div.codexhudspan a.brick {
  display: block; text-decoration: none;
  border: 0px; padding: 0px;
  border-left: solid black 1px; /* border-right: solid black 1px; */
  height: 100%;}
div.spanbar div.codexhudspan[odd] {}
div.spanbar div.codexhudspan[even] {}
div.spanbar div.codexhudspan.current {
    color: yellow; background-color: transparent;}
div#CODEXHUD div.codextoc { 
  margin-left: 16px; margin-right: 16px;}
div#CODEXHUD div#CODEXTOC div.codextoc { 
  margin-left: 0px; margin-right: 0px;}
div#CODEXHUD div.codextoc.toc0 {
  margin-left: 0px; margin-right: 0px;}

div.spanbar { padding: 0px; margin: 0px;}
div.spanbar div.spans { 
  width: 100%; padding: 0px; margin: 0px;}

div.spanbar div.progressbox { 
  width: 3px; background-color: red;
  position: absolute; z-index: 250; 
  margin: 0px; padding: 0px; border: 0px;}

/* Emacs local variables
;;;  Local variables: ***
;;;  compile-command: "cd ..; make" ***
;;;  End: ***
*/

/* sbook 'slices' of summaries or glosses */

div.codexslice.sourced div.codexcard { display: none;}
div.codexslice.sourced div.codexcard.sourced { display: block;}

div.codexslice.sourced div.codexthread { display: none;}
div.codexslice.sourced div.codexthread > div { display: none;}
div.codexslice.sourced div.codexthread.sourced { display: block;}
div.codexslice.sourced div.codexthread.sourced > div.tochead { display: block;}
div.codexslice.sourced div.codexthread.sourced > div.idhead { display: block;}
div.codexslice.sourced div.codexthread.sourced > div.codexthread { display: none;}
div.codexslice.sourced div.codexthread.sourced > div.codexthread.sourced {
    display: block;}

div.codexslice.onepassage .tocblock .tochead {display:none;}

div.codexslice .tocthread {}
div.codexslice .tocthread .codexcard .tochead { display: none;}
div.codexslice .idthread .codexcard .idhead { display: none;}

div.codexslice .tocthread .idthread:first-child
      .codexcard:first-child .tochead {
    display: block;}
div.codexslice .idthread > .codexcard:first-child .idhead {
    display: block;}

div.codexslice .codexcard div.detail { 
  display: none; color: ivory; clear: both;}
div.codexslice .showdetail div.detail { display: block;}
div.codexslice div.xrefs { display: none;}
div.codexslice .showxrefs div.xrefs { display: block;}
div.codexslice div.xrefs a { display: block;}

div.codexthread {
    clear: both; margin: 0px; border: none;
    border-right: gold solid 3px;}
div.codexthread.singleton {
    border-left: none; margin-left: 0px;
    padding-left: 0px; margin-top: 0px; margin-bottom: 6px;}
div.codexthread .locbar { background-color: silver;}
div.codexthread.headthread { border-top: solid gold 2px;}
div.codexthread.idthread {border: none;}
div.codexthread.idthread .codexcard {}
div.codexslice div.codexthread div.codexcard div.locbar {border: none;}
div.codexslice div.codexthread div.codexcard div.locbar {display:none;}
div.codexslice div.codexthread div.codexcard:first-child div.locbar {
    display:block;}

/* Emacs local variables
;;;  Local variables: ***
;;;  compile-command: "cd ..; make" ***
;;;  End: ***
*/

div.codexcard { margin-left: 20px; margin-right: 0px;}
div.codexcard div.idhead { margin-left: -10px;  }
div.codexcard div.tochead { margin-left: -20px; }

div.glosses div.codexcard > div.idhead { display: none;}
div.glosses div.codexcard > div.tochead { display: none;}

div.codexcard { position: relative;}

div.codexcard > hr {
    color: gold; background-color: gold; min-width: 3px; height: 100%;
    border-right: solid gold 1px; border-left: solid gold 1px;
    position: absolute; left: 0px; 
    border: 0px; padding: 0px; margin: 0px;}
div.codexcard > div span.count { float: right;}

/* Sbook notes */

div.codexcard { position: relative;}
div.codexcard > div { text-align: left;}

div.codexcard > hr {
    color: gold; background-color: gold; min-width: 3px; height: 100%;
    border-right: solid gold 1px; border-left: solid gold 1px;
    position: absolute; left: 0px; 
    border: 0px; padding: 0px; margin: 0px;}

.codexcard { 
    white-space: normal; clear: both;
    text-align: left; text-decoration: none;
    text-align: left;
    font-size: 90%;}
.codexcard a.ref {
  display: block; font-weight: normal;}
.codexcard a.ref span.title {
  font-family: sans,sans-serif;}
.codexcard a.ref span.uri {
  font-family: courier,fixed;}
.codexcard span.oldterm {
    color: blue; background-color: yellow;
    padding: 2px; border: solid blue 1px;
    border-top-left-radius: 6px; border-bottom-left-radius: 6px;
    border-top-right-radius: 2px; border-bottom-right-radius: 2px;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -webkit-border-top-right-radius: 2px;
    -webkit-border-bottom-right-radius: 2px;
    -o-border-top-left-radius: 6px;
    -o-border-bottom-left-radius: 6px;
    -o-border-top-right-radius: 2px;
    -o-border-bottom-right-radius: 2px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-bottomleft: 6px;
    -moz-border-radius-topright: 2px;
    -moz-border-radius-bottomright: 2px;}
div#CODEXHUD .codexcard span.oldterm {color: blue; }
.codexcard span.user { 
  color: green; font-size: 125%; font-style: italic;}
.codexcard span.overdoc { 
  color: green; font-size: 125%; font-style: normal;
  font-variant: small-caps;}
.codexcard span.link a { color: blue; text-decoration: underline;}
.codexcard span.tribe { 
  color: darkblue; font-weight: bold; font-style: italic;}
.codexcard span.audience { 
  color: silver; font-size: 75%; font-weight: normal; font-style: italic;}
body.sbook a.codexcard { display: block;}
.codexcard.gloss .codexcardbody {
    min-height: 50px;
    border-top: solid purple 2px;}
.codexcard .info { 
  float: right;}
.codexcard div.info { 
  float: right; width: 40px;}
.codexcard .info span.score {
  color: gold; display: none;}
.codexcard span.tags { font-size: 80%;}
.codexcard span.tags span.controller { cursor: pointer;}
.codexcard span.tags.fdjtexpanded { display: block;}
.codexcard span.tags.fdjtexpanded span.controller { float: right;}
.codexcard span.head {
    font-size: 75%;}
.codexcard span.headhead {
    color: blue; font-weight: bold;}
.codexcard span.controller {
    font-weight: bold; color: silver;
    white-space: nowrap;}
.codexcard span.note { font-size: 110%;}
.codexcard img.userpic, .codexcard img.sourcepic  {
    float: left; clear: left; margin-right: 3px; width: 50px;}
.codexcard div.userpic, .codexcard div.sourcepic  {
    float: left; clear: left; margin-right: 3px;
    width: 50px; height: 50px; font-size: 32px;
    text-align: center; vertical-align: top;}
.codexcard img.detailsbutton { border: none; }
.codexcard img.xrefsbutton { border: none;}
.codexcard .glossinfo {
    float: right; clear: right; display: block;
    padding: 0px; margin: 0px;
    margin-left: 3px; padding-top: 2px;
    text-align: right;}
.codexcard .glossinfo img { padding-left: 4px; cursor: pointer; }
.codexcard .tool {
    float: right; font-weight: normal;
    font-size: 60%; text-decoration: none;}
.codexcard .age {
    color: green; vertical-align: top; padding-right: 0.5em;}
.codexcard .age:hover {text-decoration: underline;} 
.codexcard a.deletebutton { 
  color: orange; text-decoration: none;
  padding-right: 3px;}
.codexcard .glossinfo img.delete { 
    padding-right: 3px;
    cursor: pointer;}
.codexcard a.headref {
    float: right; clear: right; 
    font-family: times,serif; font-style: italic; font-size: 80%;
    white-space: nowrap; padding: 2px; padding-top: 0px;
    color: lightblue;}

/* Emacs local variables
;;;  Local variables: ***
;;;  compile-command: "cd ..; make" ***
;;;  End: ***
*/
/* -*- Mode: CSS; character-encoding: utf-8; -*- */

/* Copyright (C) 2009-2011 beingmeta, inc.
   This file implements a Javascript/DHTML UI for reading
    large structured documents (sBooks).

   For more information on sbooks, visit www.sbooks.net
   For more information on knodules, visit www.knodules.net
   For more information about beingmeta, visit www.beingmeta.com

   This library uses the FDJT (www.fdjt.org) toolkit.

   This program comes with absolutely NO WARRANTY, including implied
   warranties of merchantability or fitness for any particular
   purpose.

    Use and redistribution (especially embedding in other
      CC licensed content) is permitted under the terms of the
      Creative Commons "Attribution-NonCommercial" license:

          http://creativecommons.org/licenses/by-nc/3.0/ 

    Other uses may be allowed based on prior agreement with
      beingmeta, inc.  Inquiries can be addressed to:

       licensing@biz.beingmeta.com

   Enjoy!

*/

@charset "UTF-8";

/* Major wrappers and rules */

body.sbook { }

span.codexcssversion:after {
    content: "$Id$";}

#CODEXHUD {
    position: fixed; top: 0px; left: 0px; right: 0px; width: 100%;
    font-family: sans,sans-serif;
    z-index: 100;}
div#CODEXPAGE {
    position: fixed; overflow: visible;
    padding: 0px; margin: 0px;
    left: 50px; right: 50px;
    top: 60px; bottom: 60px;
    border: solid transparent 0px;
    border-radius: 1em; -webkit-border-radius: 1em;
    -moz-border-radius: 1em; -o-border-radius: 1em;}
body.hudup div#CODEXPAGE {
    transition-property: opacity;
    -webkit-transition-property: opacity;
    -moz-transition-property: opacity;
    -o-transition-property: opacity;
    transition-duration: 1s; -webkit-transition-duration: 1s;
    -moz-duration: 1s; -o-transition-duration: 1s;
    opacity: 0.8;}
body.hudup div#CODEXPAGE {
    border-color: gray; border-style: inset;}

body.codexscalebody div#CODEXPAGE div.codexpage {
    transform: scale(1,1); -webkit-transform:scale(1,1);
    -moz-transform: scale(1,1); -o-transform:scale(1,1);
    transition-property: transform;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-duration: 1s; -webkit-transition-duration: 1s;
    -moz-duration: 1s; -o-transition-duration: 1s;}
body.codexscalebody.hudup div#CODEXPAGE div.codexpage {
    transform: scale(0.9,0.9); -webkit-transform:scale(0.9,0.9);
    -moz-transform: scale(0.9,0.9); -o-transform:scale(0.9,0.9);}
div#CODEXPAGERIGHT {
    position: fixed; overflow: visible;
    padding: 0px; margin: 0px; border: 0px;
    width: 50px; right: 0px;
    top: 60px; bottom: 60px;}
div#CODEXPAGELEFT {
    position: fixed; overflow: visible;
    padding: 0px; margin: 0px; border: 0px;
    width: 50px; left: 0px;
    top: 60px; bottom: 60px;}
div#CODEXPAGE div#CODEXPAGES {
    position: absolute; top: 0px; left: 0px;
    padding: 0px; margin: 0px; border: 0px;
    text-align: center;
    overflow: visible;}
div#CODEXPAGE div#CODEXPAGE.codexpaginating div#CODEXPAGES {
    opacity: 0.35;}
body.codexpageview div#CODEXPAGE div#CODEXPAGES {
    column-width: 40em;
    column-gap: 7em;
    column-rule-width: 4px;
    -o-column-rule-width: 4px;
    -moz-column-rule-width: 4px;
    -webkit-column-rule-width: 4px;
    /*
    column-rule-width: 7em;
    -o-column-rule-width: 7em;
    -moz-column-rule-width: 7em;
    -webkit-column-rule-width: 7em;
    */
    column-rule-color: transparent;
    -o-column-rule-color: transparent;
    -moz-column-rule-color: transparent;
    -webkit-column-rule-color: transparent;
    /*
    column-rule-color: black;
    -o-column-rule-color: black;
    -moz-column-rule-color: black;
    -webkit-column-rule-color: black;
    */
    column-rule-style: solid;
    -o-column-rule-style: solid;
    -moz-column-rule-style: solid;
    -webkit-column-rule-style: solid;}

body.sbook.codexpageview {
    margin-top: 0px; margin-bottom: 0px;
    margin-left: 0px; margin-right: 0px;}

div#CODEXCONTENT > * {
    max-width: inherit;}

div#CODEXCONTENT, div#CODEXCONTENT p, div#CODEXCONTENT div {
    user-select: auto;
    -o-user-select: auto;
    -moz-user-select: auto;
    -webkit-user-select: auto;}

body.codexstartup div#CODEXCONTENT {
    opacity: 0.35;}

div#CODEXPAGE div#CODEXPAGES div#CODEXCONTENT {
    text-align: left;
    padding: 0px; margin: 0px; border: 0px;
    /* This should make space for glossmarks and buttons */
    padding-left: 32px; padding-right: 32px;
    margin-right: 0px;}

body.codexpageview div#CODEXPAGE div#CODEXCONTENT .codexpagebreak {
    column-break-before: always;
    break-before: always;
    -o-column-break-before: always;
    -webkit-column-break-before: always;
    -moz-column-break-before: always;}

#CODEXPAGE.codexanimate #CODEXPAGES {
    transition-property: transform; transition-duration: 0.5s;
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 0.5s;
    -moz-transition-property: -moz-transform;
    -moz-transition-duration: 0.5s;
    -o-transition-property: -o-transform;
    -o-transition-duration: 0.5s;}
#CODEXASIDE {
    position: fixed; z-index: -100;
    top: 60px; left: 60px; right: 60px; bottom: 60px;
    display: none;}
#CODEXREF {
    position: fixed; z-index: -100;
    top: 60px; left: 60px; right: 60px;
    display: none;}

div#CODEXPAGINATING {
    position: absolute;
    font-family: sans,sans-serif;
    font-size: 200%; font-weight: bold;
    height: 3em; text-align: center;
    top: 5em; left: 10%; right: 10%;
    background-color: silver;
    border: solid black 3px;
    border-radius: 18px;
    -o-border-radius: 18px;
    -moz-border-radius: 18px;
    -webkit-border-radius: 18px;
    display: none;}

.codexpaginating #CODEXPAGINATING {
    display: block; opacity: 0.98;}

/* The content */

body.sbook { width: inherit;}
body.sbook div#CODEXPAGE { max-width: 40em; }

/* Display elements */

/* Gloss form */

div.codexglossform { display: none;}
div.codexglossform#CODEXADDGLOSSPROTOTYPE { display: none;}
div.codexglossform#CODEXLIVEGLOSS { display: block;}
div.codexglossform div.response {
 margin-left: 0.5em; text-align: left; color: black;}
div.codexglossform div.response .respmaker {font-weight: bold;}
div.codexglossform div.response .respnote { font-style: italic;}
div.codexglossform div.response .respnote:before { content: "“";}
div.codexglossform div.response .respnote:after { content: "”";}
div.codexglossform div.response .respexcerpt {
    font-size: 80%; background-color: yellow;}
div.codexglossform div .respdate {
    font-size: 75%; font-weight: bold; font-variant: small-caps;
    color: purple; float: right;}
div.codexglossform div .respdate:before { content: "(";}
div.codexglossform div .respdate:after { content: ")";}

div.codexglossform div.deletebox {
    text-align: right; color: black; display: none;
    font-variant: small-caps;}
div.codexglossform div.deletebox .respdate {float: left;}
div.codexglossform div.deletebox span img { vertical-align: bottom;}
div.codexglossform div.deletebox span.clickable { cursor: pointer;}
div.codexglossform.glossedit div.deletebox { display: block;}

div.codexglossform form {
    padding: 0px; margin: 0px;}
div.codexglossform form span.checkspan.excerpt {
    white-space: normal;}
div.codexglossform form .inputhelp {color: black; display: none;}
div.codexglossform form div.inputhelp {
    padding-bottom: 4px; text-align: left;}
div.codexglossform form .bracketbutton {
    font-weight: bold; font-size: 110%;
    padding: 0px; cursor: pointer;}
div.codexglossform form .bracketbutton strong {
    font-size: 110%; color: red;}
div.codexglossform form.focused div.inputhelp { display: block;}
div.codexglossform form.focused span.inputhelp { display: inline;}

div.codexglossform form textarea { display: none;}
div.codexglossform form div.textbox textarea {
    min-height: 1em; overflow: hidden; font-size: 16px;
    border: solid darkblue 1px;
    margin: 0px; width: 99%; max-width: 99%;
    background-position: right top;
    background-position-x: right; background-position-y: top;
    background-repeat: no-repeat;}
div.codexglossform form div.textbox div.inputhelp {
    font-style: italic; margin-left: 2em; text-indent: -1em;
    display: none;}
div.codexglossform form.editnote div.textbox div.inputhelp.notehelp,
div.codexglossform form.addtag div.textbox div.inputhelp.taghelp,
div.codexglossform form.addlink div.textbox div.inputhelp.linkhelp,
div.codexglossform form.excerpt div.textbox div.inputhelp.excerpthelp {
    display: none;}

div.codexglossform form div.button {
    float: right; width: 32px;}
div.codexglossform form div.textbox { 
    clear: left; margin-right: 50px;}

div.codexglossform form div.altbutton span { display: none;}
div.codexglossform form div.altbutton span.addbutton {display: inline;}

div.codexglossform.glossedit form  div.altbutton span.savebutton,
div.codexglossform.glossreply form div.altbutton span.replybutton {
    display: inline;}
div.codexglossform.glossedit form div.altbutton span.addbutton,
div.codexglossform.glossreply form div.altbutton span.addbutton {
    display: none;}

div.codexglossform form textarea[name='NOTE'] {
    background-image:
    url(https://beingmeta.s3.amazonaws.com/static/graphics/justremarkballoon24x24.png);}
div.codexglossform div.textbox textarea[name='TAG'] {
    background-image:
    url(https://beingmeta.s3.amazonaws.com/static/graphics/codex/TagIcon24x24.png);}
div.codexglossform div.textbox textarea[name='LINK'] {
    background-image:
    url(https://beingmeta.s3.amazonaws.com/static/graphics/DiagLink24x24.png);}
div.codexglossform form textarea[name='EXCERPT'] {
    background-color: yellow; color: black;
    background-image:     url(https://beingmeta.s3.amazonaws.com/static/graphics/scissorsicon24x24.png);}

div.codexglossform form.editnote div.textbox textarea[name='NOTE'],
div.codexglossform form.addtag div.textbox textarea[name='TAG'],
div.codexglossform form.excerpt div.textbox textarea[name='EXCERPT'],
div.codexglossform form.addlink div.textbox textarea[name='LINK'] {
    display: block;}

div.codexglossform form div.inputhelp {
    margin-left: 1px; margin-right: 50px;
    margin-top: 0px; padding-top: 0px;}
div.codexglossform form div.glossetc {
    display: block; text-align: left; font-size: 12px;
    margin-left: 1px; margin-right: 50px; padding-right: 1em;
    min-height: 24px;}

div.codexglossform form div.glossetc .button {
    float: right;}

div.codexglossform form div.glossetc .links,
div.codexglossform form div.glossetc .tags {
    font-size: 125%;}
div.codexglossform form div.glossetc .excerpts {
    font-size: 80%;}
div.codexglossform form div.glossetc .tags span.checkspan {
    background-color: gold; padding: 2px; padding-top: 0px;
    border-top-left-radius: 1ex; border-bottom-left-radius: 1ex;
    border: solid yellow 2px;}

div.codexglossform form div.sharing {
    line-height: 16px; text-overflow: ellipsis;
    border: dotted black 1px; border-top: 0px;
    margin-right: 1ex; padding: 0.5ex;
    margin-top: 0.5ex; padding-top: 0ex;
    overflow: hidden;}
div.codexglossform form div.sharing span { vertical-align: top;}
div.codexglossform form div.sharing { max-height: 16px;}
div.codexglossform form div.sharing img.twisty[alt='-'] { display: none;}
div.codexglossform form div.sharing.expanded {
    max-height: inherit; border-style: solid;}
div.codexglossform form div.sharing.expanded img.twisty[alt='-'] {
    display: inline;}
div.codexglossform form div.sharing.expanded img.twisty[alt='+'] {
    display: none;}
div.codexglossform form div.glossetc div.sharing span.head {
    color: black; font-weight: bold; font-size: 120%;}
div.codexglossform form div.glossetc div.sharing.nocontent { display: none;}
div.codexglossform form div.glossetc div.sharing span.head {
    color: black; font-weight: bold;}

div.codexglossform form div.glossetc div.sharing span.networks {
    color: black; font-weight: normal; float: right;}
div.codexglossform form div.glossetc div.sharing span.networks span.options {
    display: none;}
div.codexglossform form div.glossetc div.sharing
   span.networks.ischecked span.options {
    display: inline;}

div.codexglossform form div.glossetc .links span.checkspan {
    color: darkblue; text-decoration: underline;}
div.codexglossform form div.glossetc span.checkspan input {}

span.facebook_share, span.twitter_share { display: none;}
span.linkedin_share, span.google_share { display: none;}

div.codexglossform form div.glossetc .sharing .checkspan.ischecked {
    color: inherit; text-decoration: none;}
div.codexglossform form div.glossetc .checkspan .checkspan {
    text-decoration: line-through; color: red;}
div.codexglossform form div.glossetc .checkspan .checkspan.ischecked {
    text-decoration: none; color: inherit;}

div.codexglossform form div.glossetc > .checkspan.private {
    float: right; vertical-align: top; margin-left: 4px;
    padding-top: 0px; margin-top: 0px;}
div.codexglossform form div.glossetc > .button,
div.codexglossform form div.glossetc > span .button {
    float: right;
    border: darkblue solid 1px; padding: 2px;
    border-radius: 3px; -webkit-border-radius: 3px;
    -moz-border-radius: 3px; -o-border-radius: 3px;
    cursor: pointer;}
div.codexglossform form div.glossetc > span .button:hover {
    border: darkblue dotted 1px;}
div.codexglossform form div.glossetc > span .button[alt='excerpt'] {
    display: none;}
div.codexglossform.hasexcerpt form div.glossetc > span .button[alt='excerpt'] {
    display: inline;}

div.codexglossform form.editnote div.glossetc span .button[alt='note'],
div.codexglossform form.addtag div.glossetc span .button[alt='tag'],
div.codexglossform form.addlink div.glossetc span .button[alt='link'],
div.codexglossform form.excerpt div.glossetc span .button[alt='excerpt'] {
    background-color: white; border-color: darkblue; border-style: solid;}
div.codexglossform form .button {
    font-weight: bold; color: black; font-size: 24px;
    border: solid black 2px; background-color: silver; padding: 2px;
    border-radius: 4px; -o-border-radius: 4px;
    -moz-border-radius: 4px; -webkit-border-radius: 4px;
    padding: 0px; padding-right: 2px;  padding-left: 2px; 
    margin-left: 4px; 
    text-align: center; vertical-align: top;
    cursor: pointer;}
div.codexglossform form .checkspan {
    padding-left: 2px; padding-right: 2px;
    font-family: sans,sans-serif;}

div.codexglossform form span.source:before, .completions span.source:before {
    content: '@'; color: gold;}

div.codexglossform span.button.savebutton,
div.codexglossform span.button.replybutton,
div.codexglossform span.button.addbutton {
    float: right;}

div.codexglossform span.savebutton, div.codexglossform span.replybutton {
    display: none;}
div.codexglossform.glossedit span.savebutton { display: inline;}
div.codexglossform.glossreply span.replybutton { display: inline;}
div.codexglossform.glossedit span.addbutton,
div.codexglossform.glossreply span.addbutton {
    display: none;}

div.codexglossform form .submitbutton {
    border: outset gold 3px; padding: 3px; height: 25px;
    margin-right: 2px; margin-top: 2px;}

div.codexglossform.submitting { opacity: 0.5;}
div.codexglossform.submitting td.button img { opacity: 0.5;}

div.codexglossform div.textbox { /* min-height: 50px; */
    transition-property: height; transition-duration: 2s;
    -webkit-transition-property: height; -webkit-transition-duration: 2s;}
div.codexglossform form.addtag div.textbox textarea[name='TAG'],
div.codexglossform form.addtag div.textbox input[type="TEXT"][name='TAG'],
div.codexglossform form.excerpt div.textbox textarea[name='EXCERPT'],
div.codexglossform form.addlink div.textbox input[type="TEXT"][name='LINK'],
div.codexglossform form.addlink div.textbox textarea[name='LINK'] {
    display: block;}
div.codexglossform div.textbox input[type="TEXT"][name='TAG'] {
    background-image:
    url(https://beingmeta.s3.amazonaws.com/static/graphics/codex/TagIcon16x16.png);}
div.codexglossform div.textbox input[type="TEXT"][name='LINK'] {
    background-image:
    url(https://beingmeta.s3.amazonaws.com/static/graphics/DiagLink16x16.png);}

div.glossetc, div.glossetc img, div.glossetc span, div.glossetc input {
    margin-top: 0px;}

div.codexglossform form div.glossetc .tags span.checkspan {
    font-size: 80%;}

/* CODEXSOURCES */

div.sbooksources {}
div.sbooksources img.button.source {
    max-height: 50px;}
div.sbooksources .button.source {
    border: solid transparent 2px; margin: 2px;}
div.sbooksources img.button.source.selected,
div.sbooksources div.button.source.selected {
    border-color: blue;}
div.sbooksources div.button.source {
    min-height: 50px; min-width: 50px; display: inline;
    height: 50px; width: 50px; font-size: 32px;
    text-align: center; vertical-align: top;
    clear: none;}

span.excerpt { font-size: 120%; color: gray; background-color: yellow;}
span.excerpt span.content { font-size: 80%; display: none;}
.showexcerpt span.excerpt span.content { display: inline;}
.showexcerpt span.excerpt span.ellipsis { display: none;}

/* The HUD */

#CODEXHUD a { text-decoration: none;}
#CODEXHUD a img { border: transparent;}
#CODEXHUD a:hover img { border: inherit;}
#CODEXHUD a:hover { text-decoration: underline;}
#CODEXHUD a.brick:hover { text-decoration: none;}

/* HUD panels */

div#CODEXHUD div.hudpanel {
    color: #4682b4; background-color: ivory; z-index: 100;
    border: solid transparent 3px;}
/* Being on top */
div#CODEXHUD div.hudpanel {
    position: fixed; top: 0px; left: 75px; right: 75px;
    text-align: center;
    overflow: hidden;}
div#CODEXHUD div.hudpanel {
    opacity: 0.001; height: 0px; display: none;
    border-radius: 6px; -o-border-radius: 6px;
    -webkit-border-radius: 6px; -moz-border-radius: 6px;}
body.hudup div#CODEXHUD div.hudpanel {opacity: 0.95;}
div#CODEXHUD.codexanimate div.hudpanel {
    transition-property: opacity,height;
    -o-transition-property: opacity,height;
    -moz-transition-property: opacity,height;
    -webkit-transition-property: opacity,height; 
    transition-duration: 1.0s; -o-transition-duration: 1.0s;
    -webkit-transition-duration: 1.0s; -moz-transition-duration: 1.0s;}

div#CODEXHUD div#CODEXHEAD div.hudpanel,
div#CODEXHUD div.hudpanel.codexcard {
    max-height: 75%; border-top-width: 0px;
    border-top-left-radius: 0px;
    -webkit-border-top-left-radius: 0px; 
    -moz-border-radius-topleft: 0px;
    -o-border-radius-topleft: 0px; 
    border-top-right-radius: 0px;
    -webkit-border-top-right-radius: 0px; 
    -moz-border-radius-topright: 0px;
    -o-border-radius-topright: 0px;}

body.sbooktouchui .codexcard .age { font-size: 125%; padding-bottom: 10px;}

div#CODEXHUD div.hudpanel div.scrollbox {
  overflow: auto;}

div#CODEXHUD img.hudbutton {
    position: fixed; width: 50px; height: 50px; z-index: 200;
    border: solid transparent 2px; opacity: 0.2;}
body.sbooktouchui div#CODEXHUD img.hudbutton:hover {
    background-color: lightblue; border-color: blue;}
body.hudup div#CODEXHUD img.hudbutton  {}
body div#CODEXHUD img.hudbutton:hover { opacity: 0.45;}
div#CODEXHUD .topleft {top: 0px; left: 0px;}
div#CODEXHUD .topright {top: 0px; right: 0px;}
div#CODEXHUD .botleft {bottom: 0px; left: 0px;}
div#CODEXHUD .botright {bottom: 0px; right: 0px;}

div#CODEXHUD img.topleft {
    border-top-width: 0px; border-left-width: 0px;
    border-bottom-right-radius: 6px;
    -o-border-bottom-right-radius: 6px; 
    -webkit-border-bottom-right-radius: 6px; 
    -moz-border-radius-bottomright: 6px;
    -o-border-radius-bottomright: 6px;}
div#CODEXHUD img.topright {
    border-top-width: 0px; border-right-width: 0px;
    border-bottom-left-radius: 6px;
    -o-border-bottom-left-radius: 6px; 
    -webkit-border-bottom-left-radius: 6px; 
    -moz-border-radius-bottomleft: 6px;
    -o-border-radius-bottomleft: 6px;}
div#CODEXHUD img.botleft {
    border-bottom-width: 0px; border-left-width: 0px;
    border-top-right-radius: 6px;
    -o-border-top-right-radius: 6px; 
    -webkit-border-top-right-radius: 6px; 
    -moz-border-radius-topright: 6px;
    -o-border-radius-topright: 6px;}
div#CODEXHUD img.botright {
    border-bottom-width: 0px; border-right-width: 0px;
    border-top-left-radius: 6px;
    -o-border-top-left-radius: 6px; 
    -webkit-border-top-left-radius: 6px; 
    -moz-border-radius-topleft: 6px;
    -o-border-radius-topleft: 6px;}

div#CODEXHUD #CODEXFOOT {
    position: fixed; left: 0px; right: 0px; width: 100%;
    bottom: 0px; z-index: 100;}

div#CODEXHUD #CODEXHEAD {
    position: fixed; left: 0px; right: 0px; width: 100%;
    top: 0px; z-index: 100;}

/* The lower left HUD icon */

div#CODEXHUD div#CODEXBUTTON {
    position: fixed; left: 0px; bottom: 0px;
    height: 50px; width: 50px;
    opacity: 0.5;}
div#CODEXHUD div#CODEXBUTTON:hover {
    opacity: 0.5;}
div#CODEXHUD div#CODEXBUTTON img {display: none; opacity: 0.75;}
div#CODEXHUD div#CODEXBUTTON img:hover {display: none; opacity: 1.0;}
body.hudup div#CODEXHUD div#CODEXBUTTON {display: none;}

body #CODEXDROPHUD {
    position: fixed; left: 0px; bottom: 0px;
    height: 50px; width: 50px;
    border: solid transparent 2px;
    border-bottom-width: 0px; border-left-width: 0px;
    border-top-right-radius: 6px;
    -o-border-top-right-radius: 6px; 
    -webkit-border-top-right-radius: 6px; 
    -moz-border-radius-topright: 6px;
    -o-border-radius-topright: 6px;
    opacity: 0.5;
    display: none;}
body.sbooktouchui body #CODEXDROPHUD:hover {
    background-color: lightblue; border-color: blue;}
body.hudup #CODEXDROPHUD {display: block;}

body #CODEXPAGENEXT {
    display: none;
    position: fixed; right: 0px; bottom: 0px;
    height: 50px; width: 50px;
    opacity: 0.5;}
body #CODEXPAGENEXT:hover {opacity: 0.75;}
body.hudup #CODEXPAGENEXT {display: none;}

div#CODEXALLGLOSSES .tocthread, div#CODEXRESULTS .tocthread {
    /* border-left: solid purple 1px; */}

/* This enables the lower right pagenext button, which we're not currentl
   using
body #CODEXPAGENEXT { display: block;}
body div#CODEXHUD img.hudbutton#CODEXALLGLOSSESBUTTON { display: none;}
body.hudup div#CODEXHUD img.hudbutton#CODEXALLGLOSSESBUTTON { display: block;}
*/

div#CODEXHUD div#CODEXBUTTON.toc img[alt='toc'],
div#CODEXHUD div#CODEXBUTTON.search img[alt='search'],
div#CODEXHUD div#CODEXBUTTON.browse img[alt='search'],
div#CODEXHUD div#CODEXBUTTON.scan img[alt='scan'],
div#CODEXHUD div#CODEXBUTTON.addgloss img[alt='addgloss'],
div#CODEXHUD div#CODEXBUTTON.allglosses img[alt='allglosses'],
div#CODEXHUD div#CODEXBUTTON.help img[alt='help'],
div#CODEXHUD div#CODEXBUTTON.about img[alt='about'],
div#CODEXHUD div#CODEXBUTTON.sbookapp img[alt='sbookapp'],
div#CODEXHUD div#CODEXBUTTON.flytoc img[alt='flytoc'],
div#CODEXHUD div#CODEXBUTTON.scanning img[alt='scanning'],
div#CODEXHUD div#CODEXBUTTON.device img[alt='device'] {
    display: block;}

/* HUDUP rules */

body.hudup div#CODEXHUD { } /* opacity: 0.95; */
body.hudup div#CODEXHUD .hudbutton { opacity: 0.6;}
body.hudup div#CODEXHUD img.hudbutton:hover { opacity: 0.8;}

body.hudup div#CODEXPAGE p, body.hudup div#CODEXPAGE div { cursor: pointer;}

/* Mode display rules */

body.hudup div#CODEXHUD.help div.hudpanel#CODEXHELP,
body.hudup div#CODEXHUD.search div.hudpanel#CODEXSEARCH,
body.hudup div#CODEXHUD.searchresults div.hudpanel#CODEXSEARCH,
body.hudup div#CODEXHUD.searchresults div.hudpanel#CODEXSEARCHRESULTS,
body.hudup div#CODEXHUD.search div.hudpanel#CODEXSEARCHCLOUD,
body.hudup div#CODEXHUD.flyleaf div.hudpanel#CODEXFLYLEAF,
body.hudup div#CODEXHUD.addgloss div.hudpanel#CODEXADDGLOSS,
body.hudup div#CODEXHUD.editexcerpt div.hudpanel#CODEXADDGLOSS
body.hudup div#CODEXHUD.scanning div.hudpanel#CODEXSCANNER,
body.hudup div#CODEXHUD.toc div.hudpanel#CODEXTOC,
body.hudup div#CODEXHUD.allglosses div.hudpanel#CODEXBROWSEGLOSSES,
body.hudup div#CODEXHUD.tocscan div.hudpanel#CODEXTOC {
    display: block; min-height: 50px; height: auto;
    overflow: auto; border-color: darkblue;
    box-shadow: 0.5em 0.5em 0.5em #cccccc;
    -webkit-box-shadow: 0.5em 0.5em 0.5em #cccccc;
    -moz-box-shadow: 0.5em 0.5em 0.5em #cccccc;
    -o-box-shadow: 0.5em 0.5em 0.5em #cccccc;
    -webkit-transition-property: height,opacity;
    -webkit-transition-duration: 1s;}

body.hudup div#CODEXHUD div.hudpanel#CODEXBROWSEGLOSSES {
    max-height: 85%;}

body div#CODEXHUD.tocscan div.hudpanel#CODEXTOC,
body div#CODEXHUD.glosses div.hudpanel#CODEXGLOSSES,
body div#CODEXHUD.scanning div.hudpanel#CODEXSCANNER {
    display: block; height: auto; overflow: hidden;
    border-color: silver;}

body div#CODEXHUD.scanning div.hudpanel#CODEXSCANNER {
    opacity: 0.95;}

body div#CODEXHUD div.hudpanel#CODEXTOC {
    max-height: 50px;}
body.hudup div#CODEXHUD div.hudpanel#CODEXTOC,
body div#CODEXHUD div.hudpanel#CODEXTOC:hover {
    max-height: inherit;}

div.hudpanel#CODEXSCANNER div.codexslice .tocthread,
div.hudpanel#CODEXGLOSSES div.codexslice .tocthread {
    border-left-width: 0px;}

div#CODESCANNER div.codexslice .tocthread .idthread:first-child
      .codexcard:first-child .tochead,
div#CODEXSCANNER div.codexslice .idthread .codexcard:first-child .idhead,
div#CODEXGLOSSES div.codexslice .tocthread .idthread:first-child
      .codexcard:first-child .tochead,
div#CODEXGLOSSES div.codexslice .idthread .codexcard:first-child .idhead {
    height: 0px;}

div#CODEXSCANNER .hudupbutton {
    position: absolute; right: 3px; top: 3px;
    font-size: 24px; font-weight: bold; vertical-align: top;
    z-index: 800;}
div#CODEXSCANNER .hudupbutton span.up { display: none;}
body.hudup div#CODEXSCANNER .hudupbutton span.down { display: none;}
body.hudup div#CODEXSCANNER .hudupbutton span.up { display: inline;}

div#CODEXSCANNER div.tochead, div#CODEXGLOSSES div.tochead {
    border-top-width: 0px; border-bottom-width: 0px;}

body.hudup div#CODEXHUD.toc div.hudpanel#CODEXTOC {
    overflow: visible;}

body.hudup div#CODEXHUD.addgloss div.hudpanel#CODEXADDGLOSS {
    background-color: lightblue;
    border-color: silver;}

body.hudup div#CODEXHUD.help div.helphud { display: block;}

body.hudup div#CODEXHUD.gotoloc div.hudpanel#CODEXGOTOLOC,
body.hudup div#CODEXHUD.gotopage div.hudpanel#CODEXGOTOPAGE {
    border-color: darkblue;
    min-height: 50px; height: auto;
    display: block;}

body.hudup div#CODEXHUD.glosses div.hudpanel#CODEXGLOSSES {
    border-color: silver;
    min-height: 50px; height: auto;
    box-shadow: 1em 1em 1em #cccccc;
    -webkit-box-shadow: 1em 1em 1em #cccccc;
    -moz-box-shadow: 1em 1em 1em #cccccc;
    -o-box-shadow: 1em 1em 1em #cccccc;
    display: block;}

body.hudup div#CODEXHUD.glosses div.hudpanel#CODEXGLOSSES.noglosses {
    display: none;}

body.hudup div#CODEXHUD.tocscan div.hudpanel#CODEXTOC {
    border-color: darkblue;
    min-height: 50px; height: auto;
   display: block;}

div#CODEXHUD.search div#CODEXSEARCHRESULTSWRAPPER { display: none;}
div#CODEXHUD.search div.completions#CODEXSEARCHCLOUD { display: block;}
div#CODEXHUD.search div#CODEXSEARCH.norefiners div.completions#CODEXSEARCHCLOUD { display: none;}
div#CODEXHUD.search div.codexslice#CODEXSEARCHRESULTS { display: none;}
div#CODEXHUD.searchresults div#CODEXSEARCHCLOUDWRAPPER { display: none;}
div#CODEXHUD.searchresults div.completions#CODEXSEARCHCLOUD { display: none;}

div#CODEXHUD.addgloss div#CODEXADDGLOSS.tagging div.completions#CODEXGLOSSCLOUD {
    display: block;}

div#CODEXGLOSSES div.codexthread { border-right-width: 0px;}
div#SBOOKGLOSSES div.codexthread {
    border-left: none; margin-left: 0px;
    padding-left: 0px; margin-top: 0px; margin-bottom: 6px;}

body.hudup div#CODEXHUD.addgloss .hudbutton { opacity: 0.15;}

div#CODEXHUD.allglosses .hudbutton[alt='allglosses'],
div#CODEXHUD.flyleaf .hudbutton[alt='flyleaf'],
div#CODEXHUD.search .hudbutton[alt='search'],
div#CODEXHUD.searchresults .hudbutton[alt='search'],
div#CODEXHUD.toc .hudbutton[alt='toc'] {
    border-color: darkblue;
    background-color: #4682b4;}

/* Scanner rules */

body.hudup div#CODEXHUD div#CODEXSCANNER img[alt="beginning"],
body.hudup div#CODEXHUD div#CODEXSCANNER img[alt="prev"] {
    position: absolute; left: 0px; top: 8px;}
body.hudup div#CODEXHUD div#CODEXSCANNER img[alt="end"], 
body.hudup div#CODEXHUD div#CODEXSCANNER img[alt="next"] {
    position: absolute; right: 0px; top: 8px;}
body.hudup div#CODEXHUD div#CODEXSCANNER img[alt="beginning"],
body.hudup div#CODEXHUD div#CODEXSCANNER img[alt="end"] {
    display: none;}
body.hudup div#CODEXHUD div#CODEXSCANNER img[alt="beginning"],
body.hudup div#CODEXHUD div#CODEXSCANNER img[alt="end"] {
    z-index: 100;}
body.hudup div#CODEXHUD div#CODEXSCANNER.sbookatend img[alt="next"] {display: none;}
body.hudup div#CODEXHUD div#CODEXSCANNER.sbookatend img[alt="end"] {display: block;}
body.hudup div#CODEXHUD div#CODEXSCANNER.sbookatstart img[alt="prev"] {display: none;}
body.hudup div#CODEXHUD div#CODEXSCANNER.sbookatstart img[alt="beginning"] {display: block;}

div#CODEXHUD div#CODEXSCANNER .codexcard.gloss .codexcardbody,
div#CODEXHUD div#CODEXGLOSSES .codexcard.gloss .codexcardbody {
    min-height: 3ex;}
div#CODEXHUD div#CODEXSCANNER:hover .codexcard.gloss .codexcardbody,
div#CODEXHUD div#CODEXGLOSSES:hover .codexcard.gloss .codexcardbody {
    min-height: 50px;}

div#CODEXHUD div#CODEXSCANNER div.idhead,
div#CODEXHUD div#CODEXGLOSSES div.idhead {
    height: 0px;}
div#CODEXHUD div#CODEXSCANNER img.glosspic {
    max-height: 3ex; max-width: 3ex;}
body div#CODEXHUD div#CODEXSCANNER:hover img.glosspic {
    max-height: inherit; max-width: inherit;}
body div#CODEXHUD div.hudpanel#CODEXSCANNER:hover {
    max-height: inherit, height: inherit;}

div#CODEXHUD div#CODEXSCANNER div.codexcard span.glossinfo span.isclickable {
    display: none;}

body div#CODEXHUD img.codexscanbutton {
    width: 50px; position: fixed; top: 0px; opacity: 0.8;
    display: none;}
body div#CODEXHUD img.codexscanbutton#CODEXNEXTSCAN,
body div#CODEXHUD img.codexscanbutton#CODEXENDSCAN {
    right: 0px;}
body div#CODEXHUD img.codexscanbutton#CODEXPREVSCAN,
body div#CODEXHUD img.codexscanbutton#CODEXSTARTSCAN {
    left: 0px;}

body div#CODEXHUD.scanning img.codexscanbutton {display: block;}
body div#CODEXHUD.scanning img.codexscanbutton#CODEXSTARTSCAN,
body div#CODEXHUD.scanning img.codexscanbutton#CODEXENDSCAN {
    display: none;}

body div#CODEXHUD.scanning.scanstart img.codexscanbutton#CODEXSTARTSCAN,
body div#CODEXHUD.scanning.scanend img.codexscanbutton#CODEXENDSCAN {
    display: block;}
body div#CODEXHUD.scanning.scanstart img.codexscanbutton#CODEXPREVSCAN,
body div#CODEXHUD.scanning.scanend img.codexscanbutton#CODEXNEXTSCAN {
    display: none;}

/* Don't display any buttons when you're at both the start and end */
body div#CODEXHUD.scanning.scanstart.scanend img.codexscanbutton#CODEXSTARTSCAN,
body div#CODEXHUD.scanning.scanstart.scanend img.codexscanbutton#CODEXENDSCAN,
body div#CODEXHUD.scanning.scanstart.scanend img.codexscanbutton#CODEXNEXTSCAN,
body div#CODEXHUD.scanning.scanstart.scanend img.codexscanbutton#CODEXPREVSCAN {
    display: none;}

body div#CODEXHUD.scanning img.hudbutton#CODEXTOCBUTTON,
body div#CODEXHUD.scanning img.hudbutton#CODEXSEARCHBUTTON {
    display: none;}

/* About this book */

div#SBOOKABOUT { display: none;}
div#SBOOKABOUT { display: none; text-align: left;}
div#CODEXHUD div#SBOOKABOUT {
    display: block; max-width: 40em; margin-left: auto; margin-right: auto;}
div#CODEXHUD div#SBOOKABOUT img { max-width: 25%;}

div#CODEXHUD div#SBOOKABOUT div.textblock {
    margin-bottom: 2ex; clear: both;}

div#CODEXHUD div#SBOOKABOUT a.book { font-style: italic; font-weight: normal;}
div#CODEXHUD div#SBOOKABOUT a.movie { font-weight: bold; font-style: normal;}

/* The Console */

div#CODEXCONSOLE h1 { font-size: 1.5em;}
div#CODEXCONSOLE div#CODEXCONSOLELOG { margin-left: 8em;}
div#CODEXCONSOLE div.fdjtlog {
    border-top: solid black 1px;}
div#CODEXCONSOLE div.message {
    text-align: center; font-size: 150%;}

div#CODEXCONSOLE div#CODEXCONSOLEINPUT { margin-left: 8em;}
div#CODEXCONSOLE div#CODEXCONSOLEINPUT span.button { float: right;}
div#CODEXCONSOLE div#CODEXCONSOLEINPUT textarea { width: 90%;}

/* SBOOKGLOSSES */

div#CODEXHUD div.hudpanel#SBOOKGLOSSES {position: fixed; right: 50px;}

div#CODEXSOURCES {
    overflow-y: hidden; overflow-x: auto; white-space: nowrap;}

/* The flyleaf */

div#CODEXHUD div.hudpanel#CODEXFLYLEAF {
    background-color: ivory; color: #4682b4; opacity: 1.0;
    /* Transition rules for animating slide-in */
    transition-property: left;
    transition-duration: 1s;
    -webkit-transition-property: left;
    -webkit-transition-duration: 1s;
    -o-transition-property: left;
    -o-transition-duration: 1s;
    -moz-transition-property: left;
    -moz-transition-duration: 1s;
    /* Always on, hide by moving */
    display: block;}
div#CODEXHUD div.hudpanel#CODEXFLYLEAF {
    top: 70px; bottom: 60px; left: -100%; width: 90%; height: auto;
    border-left: none;
    border-top-left-radius: 0px; -o-border-radius-topleft: 0px;
    -moz-border-radius-topleft: 0px; -webkit-border-top-left-radius: 0px; 
    border-bottom-left-radius: 0px; -o-border-radius-bottomleft: 0px;
    -moz-border-radius-bottomleft: 0px; -webkit-border-bottom-left-radius: 0px;}
body.hudup div#CODEXHUD.flyleaf div.hudpanel#CODEXFLYLEAF {
    left: 0px;}

/* The glossleaf */

div#CODEXHUD div.hudpanel#CODEXGLOSSLEAF {
    background-color: ivory; color: #4682b4; opacity: 1.0;
    /* Transition rules for animating slide-in */
    transition-property: right;
    transition-duration: 1s;
    -webkit-transition-property: right;
    -webkit-transition-duration: 1s;
    -o-transition-property: right;
    -o-transition-duration: 1s;
    -moz-transition-property: right;
    -moz-transition-duration: 1s;
    /* Always on, hide by moving */
    display: block;}
div#CODEXHUD div.hudpanel#CODEXGLOSSLEAF {
    top: 70px; bottom: 60px; right: -100%; width: 90%; height: auto;
    border-right: none;
    border-top-right-radius: 0px; -o-border-radius-topright: 0px;
    -moz-border-radius-topright: 0px; -webkit-border-top-right-radius: 0px; 
    border-bottom-right-radius: 0px; -o-border-radius-bottomright: 0px;
    -moz-border-radius-bottomright: 0px; -webkit-border-bottom-right-radius: 0px;}
body.hudup div#CODEXHUD.flyleaf div.hudpanel#CODEXGLOSSLEAF {
    right: 0px;}

/* The help HUD */

div#CODEXHUD div#CODEXHELP.hudpanel {
    position: fixed; text-align: left;
    padding: 0px; padding-bottom: 24px; 
    background-color: ivory; color: black; opacity: 1.0;
    top: 75px; bottom: 75px; left: 75px; right: 75px;}
div#CODEXHUD.help div#CODEXHELP.hudpanel {
    display: block; height: inherit; border-color: blue;}
div#CODEXHUD div#CODEXHELP {
    transition-property: opacity; transition-duration: 1s;
    -o-transition-property: opacity; -o-transition-duration: 1s;
    -moz-transition-property: opacity; -moz-transition-duration: 1s;
    -webkit-transition-property: opacity; -webkit-transition-duration: 1s;}
div#CODEXHUD div#CODEXHELP p.head {
    font-weight: bold; text-align: center; margin-bottom: 0.40em;}

div#CODEXHUD div#CODEXHELP h2, div#CODEXHUD div#CODEXHELP h3 {
    text-align: center; margin: .25em;}
div#CODEXHUD div#CODEXHELP h2:first-child {
    margin-top: 0px; margin-bottom: 0px;}
div#CODEXHUD div#CODEXHELP .codexclicktohide {
    margin-top: 0px; padding-top: 3px; padding-bottom: 3px;
    text-align: center; color: red;}

div#CODEXHELP div#CODEXHELPBODY { clear: both;}
div#CODEXHELP div.helptopbanner {
    width: 100%; height: 24px; background-color: lightblue;
    text-align: right;}
div#CODEXHELP div.helptopbanner .hidespan {
    float: left; color: red;}
div#CODEXHELP div.helptopbanner .hidespan .helpcloser {
    font-weight: bold; font-size: 16px;
    padding-top: 0px; margin-top: -4px;
    padding: 4px; cursor: pointer;
    vertical-align: top;}
div#CODEXHELP #HIDESPLASHCHECKSPAN {font-size: 85%;}
div#CODEXHELP #HIDESPLASHCHECKSPAN input[type='CHECKBOX'] {
    margin-right: 0px;}

div#CODEXHELP div.codexhelp {
    max-width: 40em; margin-left: auto; margin-right: auto;}
div#CODEXHELP div.codexhelp p {
    text-align: left;
    margin-left: 5em; margin-right: 2em; text-indent: -3em;}
div#CODEXHELP div.codexhelp div.helpblock {
    margin-bottom: 1em;}
div#CODEXHELP div.codexhelp div.helpblock p {
    margin-top: 2px; margin-bottom: 2px;}
div#CODEXHELP div.codexhelp p img.right {
    float: right; max-height: 24px;}
div#CODEXHELP div.codexhelp img.left {
    width: 24px; margin-left: -24px; vertical-align: middle;}

body div#CODEXHELP #CODEXHELPTITLE {
    font-weight: bold;}
div#CODEXHELP #CODEXSTARTUPMSG {
    text-align: right; padding-top: 2px; padding-right: 8px;
    color: darkblue;
    display: none;}
body.codexstartup div#CODEXHELP #CODEXSTARTUPMSG {
    display: inline;}
body.codexstartup div#CODEXHELP #CODEXHELPTITLE {
    display: none;}

/* Help HUD */

div#CODEXHUD .helphud {
    position: fixed; background-color: ivory; z-index: 100;
    border: solid black 1px; padding: 3px; border-radius: 6px;
    font-family: sans,sans-serif;
    -o-border-radius: 6px; -webkit-border-radius: 6px; 
    -o-border-radius: 6px;
    display: none;}
div#CODEXHUD .helphud.topleft {top: 3px; left: 60px; text-align: right;}
div#CODEXHUD .helphud.topright {top: 3px; right: 60px; text-align: left;}
div#CODEXHUD .helphud.botleft {bottom: 3px; left: 60px; text-align: right;}
div#CODEXHUD .helphud.botright {bottom: 3px; right: 60px; text-align: left;}
div#CODEXHUD .helphud.topcenter {
    top: 0px; width: 66%; left: 17%; right: 17%; text-align: center;
    border-top-left-radius: 0px; border-top-right-radius: 0px;
    -o-border-top-left-radius: 0px; -o-border-top-right-radius: 0px; 
    -webkit-border-top-left-radius: 0px; -webkit-border-top-right-radius: 0px; 
    -o-border-radius-topleft: 0px; -oborder-radius-topright: 0px;}

div#CODEXHUD .helphud.botcenter {
    bottom: 0px; width: 66%; left: 17%; right: 17%; text-align: center;
    border-bottom-left-radius: 0px; border-bottom-right-radius: 0px;
    -o-border-bottom-left-radius: 0px; -o-border-bottom-right-radius: 0px; 
    -webkit-border-bottom-left-radius: 0px; -webkit-border-bottom-right-radius: 0px; 
    -moz-border-radius-bottomleft: 0px; -moz-border-radius-bottomright: 0px;}

div#CODEXHUD div.helphud.leftmiddle {
    position: fixed; max-width: 50px; padding-left: 3px;
    top: 40%; left: 0px; text-align: left; padding-right: 2px;
    border-top-left-radius: 0px; border-bottom-left-radius: 0px;
    -o-border-top-left-radius: 0px; -o-border-bottom-left-radius: 0px; 
    -webkit-border-top-left-radius: 0px; -webkit-border-bottom-left-radius: 0px; 
    -moz-border-radius-topleft: 0px; -moz-border-radius-bottomleft: 0px;}

div#CODEXHUD div.helphud.rightmiddle {
    position: fixed; max-width: 50px; padding-right: 3px;
    top: 40%; right: 0px; text-align: right; padding-left: 2px;
    border-top-right-radius: 0px; border-bottom-right-radius: 0px;
    -o-border-top-right-radius: 0px; -o-border-bottom-right-radius: 0px; 
    -webkit-border-top-right-radius: 0px; -webkit-border-bottom-right-radius: 0px; 
    -moz-border-radius-topright: 0px; -moz-border-radius-bottomright: 0px;}

.helphud span.arrow { font-weight: bold; vertical-align: top;}
.helphud.topleft span.arrow { float: left;}
.helphud.topright span.arrow { float: right;}
.helphud.botleft span.arrow { float: left;}
.helphud.botright span.arrow { float: right;}

body div#CODEXHELP p#CODEXHELPLOGIN { display: none;}
body.notsbookuser div#CODEXHELP p#CODEXHELPLOGIN { display: block;}
body.notsbookuser div#CODEXHELP p#CODEXHELPLOGGEDIN { display: none;}
body.sbookuser div#CODEXHELP p#CODEXHELPLOGGEDIN { display: block;}

/* "Leading" to fill out the top and bottom */

div.leading { height: 50px; width: 100%;}
div#SBOOKTOPLEADING { height: 50px; width: 100%;}
div#SBOOKBOTTOMLEADING { height: 50px; width: 100%;}

/* Margins */

body.sbookpagevertical { overflow: hidden;}

body div.codexmargin {
    position: fixed; display: block;
    /* opacity: 0.5; border: solid green 1px; */
    background-color: white; z-index: 5;}
body.sbooknopage div.codexmargin  { display: none;}

body div.codexmargin#CODEXPAGEHEAD,
body div.codexmargin#CODEXPAGEFOOT {
  left: 0px; right: 0px; width: 100%; height: 60px; z-index: 75;
  text-align: center;}
body div.codexmargin#CODEXPAGEHEAD { top: 0px; }
body div.codexmargin#CODEXPAGEFOOT { bottom: 0px; vertical-align: bottom;}

/* Bottom information */

div#CODEXPAGEFOOT div#CODEXPAGEINFO {
    vertical-align: bottom; height: 3ex; display: none;
    position: fixed; left: 0px; right: 0px; bottom: 0px; z-index: 100;
    width: 80%; margin-left: 10%; margin-right: 10%;
    cursor: crosshair;
    border-top: solid black 1px;}
body.codexpageview div#CODEXPAGEFOOT div#CODEXPAGEINFO {
    display: block;}
body.hudup div#CODEXPAGEFOOT div#CODEXPAGEINFO {
    opacity: 0.5;}
div#CODEXPAGEFOOT div#CODEXPAGEINFO span.locoff {
    cursor: pointer;
    float: right;}
div#CODEXPAGEFOOT div#CODEXPAGENO {
    position: absolute; bottom: 0px; width: 100%; max-height: 20px;}
div#CODEXPAGEFOOT div#CODEXPAGENO span#CODEXPAGENOTEXT { cursor: pointer;}
div#CODEXPAGEFOOT div#CODEXPAGEINFO div.progressbar {
    background-color: gray; border: solid black 1px; border-top-width: 0px;
    z-index: 50; opacity: 0.5; height: 100%; position: absolute;}
div#CODEXPAGEFOOT div#CODEXPAGELEAP {
    opacity: 0.001;}
div#CODEXPAGEFOOT div#CODEXPAGELEAP:hover {
    opacity: 0.4;}
body.hudup div#CODEXPAGEFOOT div#CODEXPAGELEAP {
    opacity: 0.7;}
div#CODEXPAGES.pageswitch {
    opacity: 0.0001;}

div#CODEXFOOT div#SBOOKFOOTINFO {
    position: fixed; left: 100px; right: 100px; bottom: 0px;
    opacity: 0.9; background-color: #4682b4; color: ivory;
    max-height: 100px; overflow: hidden;
    border-top-left-radius: 6px; 
    -o-border-radius-topleft: 6px;
    -moz-border-radius-topleft: 6px;
    -o-border-top-left-radius: 6px;
    -webkit-border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    -o-border-radius-topright: 6px;
    -moz-border-radius-topright: 6px;
    -o-border-top-right-radius: 6px;
    -webkit-border-top-right-radius: 6px;}
div#CODEXFOOT div#SBOOKFOOTINFO div#SBOOKTARGETINFO {
    padding: 1em; padding-top: 0.5em; padding-bottom: 4px;}

/* These may go away */
body div#CODEXHUD div#CODEXFOOT div#SBOOKFOOTINFO {display: none;}
body.hudup div#CODEXHUD.target div#CODEXFOOT div#SBOOKFOOTINFO {
    display: none;}
body.hudup div#CODEXHUD.tagging.target div#CODEXFOOT div#SBOOKFOOTINFO {
    display: none;}

/* The SEARCHBOX */

div.searchbox.notags div.tags { display: none;}
div.searchbox { text-align: center; }

div.searchbox div.query {
    width: 100%; text-align: right; margin-top: 2px;
    font-size: 18px;}
div.searchbox div.query input[type='TEXT'] {
    max-width: 50%; min-width: 25%; font-size: 16px;}
div.searchbox div.query input[type='TEXT'] {
    background-position: right top;
    background-position-x: right; background-position-y: top;
    background-repeat: no-repeat;
    background-image:
    url(https://beingmeta.s3.amazonaws.com/static/graphics/TagIcon24x24.png);}
div.searchbox div.query span.ampersand {
    float: right; font-weight: bold; font-size: 150%;
    padding-left: 1em; }
div.searchbox.notags div.query span.ampersand { display: none;}

div.searchbox div.query span#CODEXSEARCHPROMPT {
    float: left; font-style: italic; padding-left: 1em; display: none;}
div.searchbox.notags div.query span#CODEXSEARCHPROMPT {
    display: inline;}
div.searchbox div.query #CODEXSEARCHLABEL {
    padding-left: 1em; font-variant: small-caps;
    float: left;}
div.searchbox.notags div.query #CODEXSEARCHLABEL { display: none;}

div.searchbox div.query span.dterm {
    padding-right: 0.35em; padding-left: 1ex;
    padding-top: 0px; padding-bottom: 0px;
    border-top-left-radius: 1ex; border-bottom-left-radius: 1ex;
    color: darkblue; background-color: gold; border: solid yellow 2px;}

div.searchbox div.query img.clearsearch {
    float: right; padding-left: 0.5em;}
div.searchbox div.query input[type='TEXT'] { float: right;}

div.searchbox div.resultinfo {
    margin-right: 32px; min-height: 1ex;
    clear: both; text-align: right;}
div.searchbox div.resultinfo span.resultcount,
div.searchbox div.resultinfo span.refinecount {
    cursor: pointer;}
div#CODEXHUD.search div.searchbox div.resultinfo span.refinecount {
    font-weight: bold;}
div#CODEXHUD.searchresults div.searchbox div.resultinfo span.resultcount {
    font-weight: bold;}

div.searchbox div.toolbox div.tags {
    min-height: 1ex; clear: both; text-align: center;}
div.searchbox .completions div.tags {
    min-height: 1ex; clear: both; text-align: center;}
div.searchbox div.input {
    width: 90%; margin-left: 5%; margin-right: 5%;
    clear: both; text-align: center;}

div.searchbox div.tags img.clearsearch { float: right; color: red;}
div.searchbox div.tags img.clearsearch { float: right; color: red;}

div.searchbox div.input { }
div.searchbox div.input input[type='TEXT'] {
    width: 100%; font-size: 150%;}

div.searchbox div.resultinfo div.noresults { display: none;}
div.searchbox div.resultinfo div.noquery { display: none;}
div.searchbox.noresults div.resultinfo div.noresults { display: none;}
div.searchbox.noresults div.resultinfo span { display: none;}
div.searchbox.notags div.resultinfo div.noquery { display: none;}
div.searchbox.noresults div.resultinfo span { display: none;}
div.searchbox.notags div.resultinfo span { display: none;}

/* Tag clouds */

div.completions .label { float: left; opacity: 0.7;}
div.completions .completion:hover { text-decoration: underline; }

div.completions .cloudtoggle {
    float: right; display: none;}
div.completions.noinput .cloudtoggle {
    display: block;}

div#CODEXHUD div.completions {
    text-align: center; display: none;}
div#CODEXHUD div.completions div.doc {
    background-color: ivory; text-align: left;
    font-size: 80%; line-height: 100%;
    font-style: italic; color: black;
    padding-left: 1.5em; padding-right: 1.5em;
    margin: 0.5em; margin-right: 5em;
    border: solid black 2px; border-radius: 6px;
    -o-border-radius: 6px; -webkit-border-radius: 6px; 
    -moz-border-radius: 6px;
    /* Hide this for now */
    display: none;}

div#CODEXHUD .completions span.sep { 
  font-size: 200%; font-weight: bold; 
  color: purple; vertical-align: middle;}
div#CODEXHUD .completions span.completion {
    cursor: pointer; padding-right: 0.5em;}
div#CODEXHUD .completions span.sectname {
  white-space: nowrap;
  font-weight: bold; font-style: italic;  font-size: 70%;
  background-color: ivory; color: purple; max-width: 25%;
  padding: 0px; padding-left: 3px; padding-right: 3px; 
  margin: 0px; margin-left: 3px; margin-right: 3px; 
  -o-border-radius: 6px; 
  -webkit-border-radius: 6px; 
  -moz-border-radius: 6px; 
  border-radius: 6px;}
div#CODEXHUD .completions.showall span.dterm {display: inline;}
div#CODEXHUD .completions.showall span.dterm.singleton {display: none;}
div#CODEXHUD .completions { }
div#CODEXHUD .completions .completion.prime { 
    font-weight: bold;}
div#CODEXHUD .completions .completion .sectname { 
  white-space: nowrap;}

div#CODEXHUD .completions .completion .variation { 
  font-size: 90%; color: purple; font-style: italic;}
div#CODEXHUD .completions .completion .dterm {}
.completion .dterm {
    padding-right: 0.35em; padding-left: 0.35em; 
    border-top-left-radius: 1ex; border-bottom-left-radius: 1ex;
    color: darkblue; background-color: gold; border: solid yellow 2px;}
/*
.completion .dterm:before {
    font-weight: bold; content: "·"; color: red;
    vertical-align: middle;}
.completion .dterm.weak:before {
    content: "·‘";}
*/

body div#CODEXHUD div.codexthread > div.locrule {
    position: relative; left: 0px; bottom: 0px; z-index: 50;
    width: 100%; min-height: 10px;}

div.tochead { 
  position: relative; /* width: 100%; */
  background-color: silver; color: blue;
  border-top: solid lightblue 2px; border-bottom: solid lightblue 2px;
  text-align: left; vertical-align: middle;}
div.tochead span.spacer, div.idhead span.spacer {
    font-size: 125%; font-weight: bold; font-style: italic;}
div.tochead .paratext {
    color: darkblue; font-style: italic; padding-left: 5px;}
div.tochead span.head {
    font-size: 80%; opacity: 0.75; padding-left: 5px;}
div.tochead span.headtext {
    white-space: nowrap; font-size: 90%;}
div.tochead hr {
    color: lightblue; background-color: lightblue; min-width: 3px;
    border: none; border-right: solid gold 1px; border-left: solid gold 1px;
    position: absolute; left: 0px; top: 0px; height: 100%; 
    padding: 0px; margin: 0px;}
div.tochead span { z-index: 10;}
div.tochead a { z-index: 10;} 
div.tochead hr[about] { cursor: crosshair;}

div.idhead { 
  position: relative; white-space: nowrap; /* width: 100%; */
  background-color: silver; color: black;
  text-align: left; vertical-align: middle;
  overflow: hidden;}
div.idhead hr {
    color: lightblue; background-color: lightblue; min-width: 3px;
    border-right: solid gold 1px; border-left: solid gold 1px; 
    position: absolute; left: 0px; top: 0px; height: 100%; 
    border: 0px; padding: 0px; margin: 0px;}
div.idhead span { z-index: 10; opacity: 0.75;}
div.idhead div { z-index: 10; opacity: 0.75;}

/* Buttons */

body div#CODEXHUD div#CODEXHUDBUTTONS {
    clear: none; z-index: 150; text-align: center;
    opacity: 0.1;}
body div#CODEXHUD div#CODEXHUDBUTTONS:hover {
    opacity: 0.5;}
body.hudup div#CODEXHUD div#CODEXHUDBUTTONS {
    transition-property: opacity;
    -o-transition-property: opacity;
    -moz-transition-property: opacity;
    -webkit-transition-property: opacity; 
    transition-duration: 1.0s; -o-transition-duration: 1.0s;
    -webkit-transition-duration: 1.0s; -moz-transition-duration: 1.0s;
    display: block; opacity: 1.0;}
body div#CODEXHUD div#CODEXHUDBUTTONS img[alt='Console'] {
    display: none;}
body div#CODEXHUD.codexshowconsole div#CODEXHUDBUTTONS img[alt='Console'] {
    display: inline;}

div#CODEXHUD div#CODEXHUDBUTTONS.hudpanel {
    top: 0px; left: 60px; right: 60px; z-index: 100;}

div#CODEXHUD div#CODEXHUDBUTTONS {
    margin: 0px; padding: 0px; border-bottom-width: 0px; min-height: 60px;
    font-family: times,serif; font-variant: small-caps;
    text-align: center;}

body div#CODEXHUD div#CODEXHUDBUTTONS
   div.tabbar .tab[alt='Login'] { display: none;}
body.notsbookuser div#CODEXHUD div#CODEXHUDBUTTONS
   div.tabbar .tab[alt='Login'] { display: inline;}
body.notsbookuser div#CODEXHUD div#CODEXHUDBUTTONS
   div.tabbar .tab[alt='sBooks'] { display: none;}

/* These are all modes which use the top of the screen, so we
   hide the HUDBUTTONS. */
body.hudup div#CODEXHUD.toc div#CODEXHUDBUTTONS,
body.hudup div#CODEXHUD.search div#CODEXHUDBUTTONS,
body.hudup div#CODEXHUD.glosses div#CODEXHUDBUTTONS,
body.hudup div#CODEXHUD.searchresults div#CODEXHUDBUTTONS,
body.hudup div#CODEXHUD.tocscan div#CODEXHUDBUTTONS,
body.hudup div#CODEXHUD.addgloss div#CODEXHUDBUTTONS,
body div#CODEXHUD.scanning div#CODEXHUDBUTTONS {
    display: none;}
body.hudup div#CODEXHUD.help div#CODEXHUDBUTTONS {
    display: block; opacity: 0.7;}

div#CODEXHUD div#CODEXHUDBUTTONS div.sbookplate {
    margin: 0px; padding: 0px; border: 0px;
    margin-left: 0px; margin-right: 0px;
    clear: both; text-align: left;
    /* background-color: gold; */
    color: black;}
div#CODEXHUD div#CODEXHUDBUTTONS div.tabbar {
    margin: 0px; padding: 0px; border: 0px;
    font-variant: small-caps;}
div#CODEXHUD div#CODEXHUDBUTTONS div.tabbar .tab {
    font-variant: small-caps;
    border-bottom-right-radius: 6px;
    -o-border-bottom-right-radius: 6px; 
    -webkit-border-bottom-right-radius: 6px; 
    -moz-border-radius-bottomright: 6px;
    border-bottom-left-radius: 6px;
    -o-border-bottom-left-radius: 6px; 
    -webkit-border-bottom-left-radius: 6px; 
    -moz-border-radius-bottomleft: 6px;
    box-shadow: 2px 2px 2px #cccccc;
    -webkit-box-shadow: 2px 2px 2px #cccccc;
    -moz-box-shadow: 2px 2px 2px #cccccc;
    -o-box-shadow: 2px 2px 2px #cccccc;}
div#CODEXHUD div#CODEXHUDBUTTONS div.tabbar .tab  {
    border: transparent solid 3px;}
div#CODEXHUD div#CODEXHUDBUTTONS div.tabbar img.tab {
    height: 50px;}
body.sbooktouchui div#CODEXHUD div#CODEXHUDBUTTONS div.tabbar .tab:hover {
    background-color: lightblue;}

div#CODEXHUD.about div#CODEXHUDBUTTONS div.tabbar .tab[alt='About'],
div#CODEXHUD.flytoc div#CODEXHUDBUTTONS div.tabbar .tab[alt='ToC'],
div#CODEXHUD.device div#CODEXHUDBUTTONS div.tabbar .tab[alt='Device'],
div#CODEXHUD.sbookapp div#CODEXHUDBUTTONS div.tabbar .tab[alt='sBooks'],
div#CODEXHUD.login div#CODEXHUDBUTTONS div.tabbar .tab[alt='Login'],
div#CODEXHUD.console div#CODEXHUDBUTTONS div.tabbar .tab[alt='Console'],
div#CODEXHUD.allglosses div#CODEXHUDBUTTONS div.tabbar .tab[alt='Glosses'],
div#CODEXHUD.help div#CODEXHUDBUTTONS div.tabbar .tab[alt='Help']{
    border: gold solid 3px; background-color: gold;
    border-bottom: transparent solid 3px;
    box-shadow: 6px 6px 6px #cccccc;
    -webkit-box-shadow: 6px 6px 6px #cccccc;
    -moz-box-shadow: 6px 6px 6px #cccccc;
    -o-box-shadow: 6px 6px 6px #cccccc;}

div#CODEXHUD.tocscan div#CODEXHUDBUTTONS, div#CODEXHUD.scanning div#CODEXHUDBUTTONS {
    display: none;}

div#CODEXHUD.about div#CODEXFLYLEAF div.tabcontent {
    margin-top: 0px;}

div#CODEXHUD div#CODEXHUDBUTTONS #IDBUTTON {
    float: left; margin: 0px; padding: 0px; border: 0px;}
div#CODEXHUD div#CODEXHUDBUTTONS #HELPBUTTON {
    float: right; margin: 0px; padding: 0px; border: 0px;}
div#CODEXHUD div#CODEXHUDBUTTONS #IDBUTTON img {
  margin: 0px; border: 0px; padding: 0px; max-height: 48px;}
body.notsbookuser div#CODEXHUD div#CODEXHUDBUTTONS #IDBUTTON {
    display: none;}
div#CODEXHUD div#CODEXHUDBUTTONS .sbookplate .applinks {
    color: blue; font-size: 80%;
    font-weight: normal; font-variant: small-caps;}

div#CODEXHUD div#CODEXHUDBUTTONS .sbookplate a.logout {
    position: absolute; right: 60px;
    vertical-align: top; padding-right: 2px;
    font-family: helvetica,sans,sans-serif; font-weight: bold;
    display: none;
    color: red;}
div#CODEXHUD div#CODEXHUDBUTTONS .sbookplate a.logout:visited {
    color: red;}
div#CODEXHUD div#CODEXHUDBUTTONS .sbookplate a#SBOOKUSERNAME {
    position: absolute; left: 60px;
    vertical-align: top; padding-right: 2px;
    font-family: helvetica,sans,sans-serif; font-weight: bold;
    display: none;
    color: blue;}

body.hudup div#CODEXHUD div#CODEXHUDBUTTONS .sbookplate a.logout,
body.hudup div#CODEXHUD div#CODEXHUDBUTTONS .sbookplate a#SBOOKUSERNAME {
    display: inline;}
div#CODEXHUD div#CODEXHUDBUTTONS:hover .sbookplate a.logout,
div#CODEXHUD div#CODEXHUDBUTTONS:hover .sbookplate a#SBOOKUSERNAME {
    display: inline;}


/* The Flyleaf */

div#CODEXHUD div#CODEXFLYHEAD {
    margin: 0px; padding: 0px; border-bottom-width: 0px;
    height: 100px; min-height: 60px;
    font-family: times,serif; font-variant: small-caps;}

div#CODEXHUD div#CODEXFLYHEAD div.flyleafplate {
    margin: 0px; padding: 0px; border: 0px;
    width: 100%; clear: both;
    background-color: gold; color: black;}
div#CODEXHUD div#CODEXFLYHEAD div.tabbar {
    margin: 0px; padding: 0px; border: 0px;
    width: 100%; clear: both;
    font-variant: small-caps;}
div#CODEXHUD div#CODEXFLYHEAD div.tabbar .tab {
    font-variant: small-caps;
    border-bottom-right-radius: 6px;
    -o-border-bottom-right-radius: 6px; 
    -webkit-border-bottom-right-radius: 6px; 
    -moz-border-radius-bottomright: 6px;
    border-bottom-left-radius: 6px;
    -o-border-bottom-left-radius: 6px; 
    -webkit-border-bottom-left-radius: 6px; 
    -moz-border-radius-bottomleft: 6px;}
div#CODEXHUD div#CODEXFLYHEAD div.tabbar .tab  {
    border: transparent solid 3px;}

div#CODEXHUD div#CODEXFLYLEAF table {
    width: 90%; margin-left: auto; margin-right: auto; vertical-align: top;}

div#CODEXHUD.about div#CODEXFLYHEAD div.tabbar .tab[contentid='APPABOUT'],
div#CODEXHUD.device div#CODEXFLYHEAD div.tabbar .tab[contentid='CODEXSETTINGS'],
div#CODEXHUD.flytoc div#CODEXFLYHEAD div.tabbar .tab[contentid='FLYTOC'],
div#CODEXHUD.console div#CODEXFLYHEAD div.tabbar .tab[contentid='CODEXCONSOLE'],
div#CODEXHUD.sbookapp div#CODEXFLYHEAD div.tabbar .tab[contentid='SBOOKSAPP'] {
    border: gold solid 3px; background-color: gold;
    border-bottom: transparent solid 3px;}

div#CODEXHUD.about div#CODEXFLYLEAF div.tabcontent {
    margin-top: 0px;}

div#CODEXHUD.about div#CODEXFLYLEAF div.tabcontent[id='APPABOUT'],
div#CODEXHUD.device div#CODEXFLYLEAF div.tabcontent[id='CODEXSETTINGS'],
div#CODEXHUD.flytoc div#CODEXFLYLEAF div.tabcontent[id='FLYTOC'],
div#CODEXHUD.console div#CODEXFLYLEAF div.tabcontent[id='CODEXCONSOLE'],
div#CODEXHUD.allglosses div#CODEXFLYLEAF div.tabcontent#CODEXBROWSEGLOSSES,
div#CODEXHUD.sbookapp div#CODEXFLYLEAF div.tabcontent[id='SBOOKSAPP'] {
    opacity: 1.0; z-index: 150; display: block;}

div#CODEXHUD div#CODEXFLYLEAF div.tabcontent {
    overflow-y: auto; overflow-x: hidden;}
div#CODEXHUD div#CODEXFLYLEAF div.tabcontent#SBOOKSAPP { overflow: visible;}
div#CODEXHUD div#CODEXFLYLEAF div.tabcontent#SBOOKSAPP iframe {
  width: 100%; height: 100%; border: 0px; margin: 0px; padding: 0px;}

div#CODEXHUD div#CODEXFLYHEAD #IDBUTTON {
    float: left; margin: 0px; padding: 0px; border: 0px;}
div#CODEXHUD div#CODEXFLYHEAD #HELPBUTTON {
    float: right; margin: 0px; padding: 0px; border: 0px;}
div#CODEXHUD div#CODEXFLYHEAD #IDBUTTON img {
  margin: 0px; border: 0px; padding: 0px; max-height: 48px;}
body.notsbookuser div#CODEXHUD div#CODEXFLYHEAD #IDBUTTON {
    display: none;}
div#CODEXHUD div#CODEXFLYHEAD .flyleafplate .applinks {
    color: blue; font-size: 80%;
    font-weight: normal; font-variant: small-caps;}

div#CODEXHUD div#CODEXFLYHEAD .flyleafplate a.logout {
    float: right; vertical-align: top; padding-right: 2px;
    font-family: helvetica,sans,sans-serif; font-weight: bold;
    background-color: gold; color: red;}
div#CODEXHUD div#CODEXFLYHEAD .flyleafplate a.logout:visited {
    color: red;}
div#CODEXHUD div#CODEXFLYHEAD a.login {
    float: right; vertical-align: top; padding-right: 2px;
    font-family: helvetica,sans,sans-serif;
    background-color: gold; color: blue;
    display:none;}
body.notsbookuser a.logout {display: none;}

/* CODEXFLYLEAF content rules */

div#CODEXHUD div#CODEXFLYLEAF a,
div#CODEXHUD div#CODEXFLYLEAF a:visited { 
  color: darkblue; text-decoration: none;}
div#CODEXHUD div#CODEXFLYLEAF a:hover { text-decoration: underline;}
div#CODEXHUD div#CODEXFLYLEAF .flyleafplate a,
div#CODEXHUD div#CODEXFLYLEAF .flyleafplate a:visited {
    text-decoration: none; color: blue;}
div#CODEXHUD div#CODEXFLYLEAF .flyleafplate a:hover {
    text-decoration: underline;}

div#CODEXHUD div#CODEXFLYLEAF div#CODEXFLYTOC div.head { color: black; } 
div#CODEXHUD div#CODEXFLYLEAF div#CODEXFLYTOC div.head { padding-left: 4px;} 
div#CODEXHUD div#CODEXFLYLEAF div#CODEXFLYTOC a {
    color: inherit; font-weight: inherit;}
div#CODEXHUD div#CODEXFLYLEAF div#CODEXFLYTOC a.cohi {
    font-weight: bold; background-color: gold;}

div#CODEXHUD div#CODEXFLYLEAF div.tabcontent#CODEXBROWSEGLOSSES
  div#CODEXSOURCES {
  text-align: center;}

div#CODEXHUD.device div#CODEXFLYLEAF div.tabcontent#CODEXSETTINGS
 div.setting {
     clear: both; padding: 3px; margin-bottom: 5px; min-height: 20px;}
div#CODEXHUD.device div#CODEXFLYLEAF div.tabcontent#CODEXSETTINGS
 div.setting span.checkspan {
     font-size: 125%; color: orange;}
div#CODEXHUD.device div#CODEXFLYLEAF div.tabcontent#CODEXSETTINGS
  div.setting span.checkspan input[type='CHECKBOX'] {
      width: 16px; height: 16px; color: orange; background-color: orange;
      vertical-align: bottom;}
div#CODEXHUD.device div#CODEXFLYLEAF div.tabcontent#CODEXSETTINGS
  div.setting div.explanation { 
      font-style: italic; clear: both; margin-left: 3em;}
div#CODEXHUD.device div#CODEXFLYLEAF div.tabcontent#CODEXSETTINGS
  div.setting .button {
      float: right; clear: right; cursor: pointer; 
      background-color: orange; color: white;
      font-weight: bold; font-variant: small-caps;
      padding: 4px; border: solid orange 2px;
      border-radius: 6px;
      -o-border-radius: 6px; 
      -webkit-border-radius: 6px; 
      -moz-border-radius: 6px;}
div#CODEXFLYLEAF table.settings {
    width: 90%; margin-left: auto; margin-right: auto; vertical-align: top;}
div#CODEXFLYLEAF table.settings th {text-align: right; vertical-align: top;}
div#CODEXFLYLEAF table.settings td {
    text-align: left; vertical-align: top; padding-left: 12px;}
div#CODEXFLYLEAF table.settings td input[type='TEXT'] {
    width: 100%;}
div#CODEXHUD div#CODEXFLYLEAF table.settings .button {
    float: right; clear: right; cursor: pointer; 
    background-color: orange; color: white;
    font-weight: bold; font-variant: small-caps;
    padding: 4px; border: solid orange 2px;
    border-radius: 6px;
    -o-border-radius: 6px; 
    -webkit-border-radius: 6px; 
    -moz-border-radius: 6px;}
div#CODEXHUD.settings div#CODEXFLYLEAF table.settings .smallbutton {
    cursor: pointer;
    margin-left: 4px; margin-right: 4px; padding: 3px;
    background-color: gold; color: darkblue;
    font-size: 80%; font-weight: bold;
    border-radius: 4px;
    -o-border-radius: 4px; 
    -webkit-border-radius: 4px; 
    -moz-border-radius: 4px;}

div#CODEXSETTINGS span.button {
    float: right; font-size: 125%; cursor: pointer;
    font-family: sans,sans-serif; font-weight: bold;
    color: white; background-color: silver;
    margin-left: 6px; padding: 4px; border: solid black 2px;
    border-radius: 5px;
    -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;}

div#CODEXFLYLEAF table.settings td .checkspan { }

/* Flyleaf content rules */

/* About information */

div.sbookabout { margin-left: 70px; margin-right: 35px;}
div.sbookabout div.title { font-size: 150%;}
div.sbookabout div.byline { font-size: 125%; font-weight: bold;}
div.sbookabout div.publisher { font-style: italic;}

/* Conditional display */

div.logindoc { display: none;}

.fortouch { display: none;}
body.sbooktouchui .notouch { display: none;}
body.sbooktouchui div.fortouch,
body.sbooktouchui p.fortouch {
    display: block;}
body.sbooktouchui .fortouch {display: inline;}
body.sbooktouchui li.fortouch {display: list-item;}
body.sbooktouchui span.fortouch { display: inline;}
body.sbooktouchui div.fortouch { display: block;}
body.sbooktouchui p.fortouch { display: block;}
body.sbooktouchui li.fortouch { display: list-item;}

body img.touchicon { display: none;}
body img.mouseicon { display: inline;}
body.sbooktouchui img.touchicon { display: inline;}
body.sbooktouchui img.mouseicon { display: none;}

div.locbar {
    background-color: ivory;
    width: 100%; clear: both;
    min-height: 6px; height: 6px;
    border: 0px; margin: 0px; padding: 0px;
    margin-bottom: 2px;}
div.locbar hr {
    color: red; background-color: white; min-width: 3px;
    border-right: solid gold 1px; border-left: solid gold 1px;
    position: relative; left: 0px; width: 100%; height: 100%;
    border: 0px; padding: 0px; margin: 0px;}

/* Glossmarks */

.codexglossmark {
    position: absolute; right: 0px;
    /* float: right; text-align: right; */
    margin: 0px; padding: 0px; text-indent: 0px; 
    border: solid transparent 2px;
    width: 0px; overflow: visible;
    max-height: 32px; /* max-width: 32px; */
    min-width: 32px; min-height: 32px;
    width: 32px; height: 32px;
    z-index: 50;
    border-right-width: 0px;
    opacity: 0.0001;}
.codexglossmark {margin-right: -16px;}

body .codexglossmark { opacity: 0.4;}
*:hover > .codexglossmark { opacity: 0.7;}
body.hudup .codexglossmark { opacity: 0.6; display: block;}

.codexglossmark img {
    float: right; vertical-align: top; text-align: right;}
.codexglossmark img.tiny {width: 16px;}
.codexglossmark img.big {width: 32px;}
.codexglossmark img.tiny, span.codexglossmark img.big { visibility: hidden;}

.codexglossbutton {
    position: absolute; left: 0px;
    margin: 0px; padding: 0px; text-indent: 0px; 
    border: solid transparent 2px;
    width: 32px; height: 32px; z-index: 50;
    border-right-width: 0px;
    /* margin-left: -50px; */
    opacity: 0.0001;
    display: none;}
body.hudup .codexglossbutton { opacity: 0.5;}
body.hudup .sbooktarget .codexglossbutton { display: block;}
body.hudup .sbooktarget.codexglosstarget .codexglossbutton {
    background-color: lightblue;}

/* Sparse glossmark display (the default) */

body .codexglossmark img.tiny { position: absolute;}
body .codexglossmark img.big { position: absolute;}
body .codexglossmark img.tiny { visibility: visible;}
body.hudup .codexglossmark img.big { visibility: visible;}
body.hudup .codexglossmark img.tiny { visibility: hidden;}
body .codexglossmark:hover img.big { visibility: visible;}
body .codexglossmark:hover img.tiny { visibility: hidden;}

/* Displaying the sbook target */

body.hudup .sbooktarget { background-color: lightblue; }
body.hudup .sbooktarget, body.sbookscanning .sbooktarget {
    cursor: pointer;}
 
/* Don't color the body
   (actually, the body should probably never be a target, but when it is...)
   */
body.sbooktarget { color: inherit;}

.sbooktarget span.codexglossmark img.big { width: 32px;} 
.sbooktarget span.codexglossmark img {
    border-top: solid steelblue 2px;}
.sbooktarget:hover .codexglossmark { opacity: 0.5;}
body.hudup .sbooktarget .codexglossmark:hover { opacity: 0.9;}

/* Not logged in conditionalization */

body.notsbookuser div#CODEXHUD div#CODEXFLYHEAD #IDBUTTON {
    display: none;}
body.notsbookuser a.logout {display: none;}
body.notsbookuser #SBOOKLOGOUT { display: none;}
body.notsbookuser .tab[CONTENTID='SBOOKSAPP'] { display: none;}
body.notsbookuser div#CODEXHUD div.hud#CODEXSOURCES img.button.login {
  display: block;}

/* The add gloss panel */

body.hudup div#CODEXHUD.addgloss div.hudpanel#CODEXADDGLOSS {}

/* Style variants */

#CODEXHUD.codexuifontlarge {
    font-size: 125%;}
#CODEXHUD.codexuifontnormal {
    font-size: 100%;}
#CODEXHUD.codexuifontsmall {
    font-size: 75%;}

#CODEXPAGE.codexbodysizexlarge {
    font-size: 175%;}
#CODEXPAGE.codexbodysizelarge {
    font-size: 135%;}
#CODEXPAGE.codexbodysizenormal {
    font-size: 100%;}
#CODEXPAGE.codexbodysizesmall {
    font-size: 80%;}
#CODEXPAGE.codexbodysizetiny {
    font-size: 50%;}

#CODEXPAGE.codexbodyfamilysans {
    font-family: sans,sans-serif;}
#CODEXPAGE.codexbodyfamilyserif {
    font-family: serif;}

/* Pagination stuff */

h1[toclevel='1'],h2[toclevel='1'] { page-break-before: always;}

.forcebreakbefore { page-break-before: always;}
.forcebreakafter { page-break-after: always;}
.avoidbreakbefore { page-break-before: avoid;}
.avoidbreakafter { page-break-after: avoid;}
.avoidbreakinside { page-break-inside: avoid;}

.sbookpage {
    display: block; 
    page-break-before: always;
    -o-page-break-before: always;
    -moz-page-break-before: always;
    -webkit-page-break-before: always;
    page-break-after: always;
    -o-page-break-after: always;
    -moz-page-break-after: always;
    -webkit-page-break-after: always;
    page-break-inside: avoid;
    -o-page-break-inside: avoid;
    -moz-page-break-inside: avoid;
    -webkit-page-break-inside: avoid;}

div.codexpage .sbookpage {
    position: absolute;
    top: 0px; left: 0px; right: 0px;
    margin-left: auto; margin-right: auto;}
div.codexpage .sbookpage.titlepage {
    left: 10%; right: 10%; margin-left: 10%; margin-right: 10%;}

div.codexpage img.sbookpage {
    position: static; margin: auto;}
div.codexpage .sbookpage .sbookinfo {
    position: absolute; bottom: 0px; width: 100%;
    text-align: center;}

.backmatter {
    page-break-before: always;
    -o-page-break-before: always;
    -moz-page-break-before: always;
    -webkit-page-break-before: always;}
.frontmatter {
    page-break-after: always;
    -o-page-break-after: always;
    -moz-page-break-after: always;
    -webkit-page-break-after: always;}
.gutenberg { opacity: 0.5;}
.gutenberg:hover { opacity: 1.0;}
    
.sbookfullpage, .sbookcover, .sbooktitlepage, .titlepage, .sbookpage {
    margin-left: auto; margin-right: auto;
    page-break-before: always;
    page-break-after: always;
    page-break-inside: avoid;}
img.sbookfullpage, img.sbookcover {
    margin-left: auto; margin-right: auto;
    display: block;}

.sbooktitlepage {
    text-align: center;
    font-size: 250%;}

/* HTML5ish elements */

body.sbook div#SBOOKDETAILS,
body.sbook div#SBOOKASIDES,
body.sbook div#SBOOKNOTES {
    page-break-before: always;}

body.sbook div#SBOOKDETAILS detail,
body.sbook div#SBOOKDETAILS .sbookdetail,
body.sbook div#SBOOKDETAILS aside,
body.sbook div#SBOOKDETAILS .sbookaside {
    page-break-before: always;}

div.codexglossform form table {
    width: 100%;}
div.codexglossform form table td {
    vertical-align: top; text-align: left;}
div.codexglossform form table td.button {
    width: 50px; text-align: center;}
div.codexglossform form table td textarea { width: 100%;}

/* The Excerpt editing dialog */

div#CODEXHUD div#CODEXEXCERPT.hudpanel {
    top: 10%; right: 10%; left: 10%;
    opacity: 0.95; height: auto; width: auto;
    background-color: lightblue; color: black;
    display: none;}
body.hudup div#CODEXHUD.editexcerpt div#CODEXEXCERPT.hudpanel {
    display: block;}
div#CODEXHUD div#CODEXEXCERPT.hudpanel {
    border: solid blue 4px;}

div#CODEXEXCERPT div {
    padding: 4px; margin-bottom: 1em; 
    font-size: 125%; text-align: center;}
div #CODEXEXCERPTCANCEL, div #CODEXEXCERPTDONE {
    font-weight: bold;
    background-color: silver; color: blue;
    border: solid black 2px;
    border-radius: 5px; -o-border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;}
div#CODEXEXCERPT div #CODEXEXCERPTCANCEL { float: left;}
div#CODEXEXCERPT div #CODEXEXCERPTDONE { float: right;}
div#CODEXEXCERPT textarea {
    clear: both; font-size: 150%;
    width: 80%; min-height: 50%;}

/* Humanity */

.humane p {
    display: block; text-align: left;
    margin-left: 2em; margin-right: 2em; text-indent: -1em;
    max-width: inherit; min-width: inherit; width: auto;}

#HUMANE.humane {
    width: 70%; max-height: 50%;
    left: 15%; right: 15%; top: 20%; bottom: auto;}
#HUMANE.humane.humane-show { opacity: 0.8; }

.humanehelp { display: none;}
.humanehelp strong { color: orange;}
.humane div.humanehelp { display: block; }
.humane div.humanehelp h3 { margin-top: 0px;}
.humane div.humanehelp .clicktarget { color: lightblue; }
.humane div.humanehelp img.fullwidth {
    width: 80%; margin-left: 10%; margin-right: 10%;}
.humane div.humanehelp img.codextocbar {
    width: 70%; float: right;}

/* New pagination model */

div.codexpage {
    opacity: 0; position: fixed; text-align: left;
    transition-property: opacity; transition-duration: 0.5s;
    -o-transition-property: opacity; -o-transition-duration: 0.5s;
    -moz-transition-property: opacity; -moz-transition-duration: 0.5s;
    -webkit-transition-property: opacity; -webkit-transition-duration: 0.5s;}
div.codexpage.curpage {opacity: 1; z-index: 50;}

div.codexdupstart {
    padding-bottom: 0px; border-bottom-width: 0px; margin-bottom: 0px;}
div.codexdup {
    padding-top: 0px;    border-top-width: 0px;    margin-top: 0px;
    padding-bottom: 0px; border-bottom-width: 0px; margin-bottom: 0px;}
div.codexdupend {
    padding-top: 0px;    border-top-width: 0px;    margin-top: 0px;}
p.codexdupend, p.codexdup { text-indent: 0px;}

div#CODEXPAGE.codexpaginating div.codexpage { visiblity: hidden;}

img.codexcoverpage {
    display: block; max-width: 100%; max-height: 100%;
    margin: auto;}

/* Emacs local variables
;;;  Local variables: ***
;;;  compile-command: "cd ..; make" ***
;;;  End: ***
*/