@charset "UTF-8";
a { color: inherit; }

.spinner-ui-toolbar { overflow: auto; max-height: 100%; background: #b0b0b0; }

.spinner-ui-documents { overflow: auto; max-height: 100%; }

.spinner-ui-document { position: relative; overflow: auto; max-height: 100%; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); opacity: 0.5; }
.spinner-ui-document[data-active="true"] { filter: progid:DXImageTransform.Microsoft.Alpha(enabled=false); opacity: 1; }
.spinner-ui-document .spinner-ui-document-selector { position: absolute; left: 5px; top: 5px; }
.spinner-ui-document h1 { margin: 0; font-size: 2em; padding: 0.5em 60px 0.5em; }
.spinner-ui-document h2 { margin: 0; font-size: 1.8em; padding: 0.5em 60px 0.5em; }
.spinner-ui-document h3 { margin: 0; font-size: 1.6em; padding: 0.5em 60px 0.5em; }
.spinner-ui-document h4 { margin: 0; font-size: 1.4em; padding: 0.5em 60px 0.5em; }
.spinner-ui-document h5 { margin: 0; font-size: 1.2em; padding: 0.5em 60px 0.5em; }
.spinner-ui-document h6 { margin: 0; font-size: 1em; padding: 0.5em 60px 0.5em; }
.spinner-ui-document p, .spinner-ui-document ul, .spinner-ui-document ol { margin: 0; padding: 0.5em 60px 0.5em; }

button, input[type=submit] { cursor: pointer; }

input[type=text] { width: 120px; }

input[type=number] { width: 40px; }

a { text-decoration: none; cursor: pointer; }
a img { border: none; }

dt { font-weight: 700; display: block; width: auto; padding: 0 0.3em 0 0; }
dt:after { content: ": "; }

dd { display: block; margin: 0; }

.btn-primary { background: #E8B00C; color: #f0f0f0; }

.btn-secondary { background: #4E88B1; color: #f0f0f0; }

[data-state="locked"] { color: #333333; }
[data-state="locked"] .lock { color: #333333; }
[data-state="locked"] .lock:before { font-family: FontAwesome; font-weight: normal; font-style: normal; text-decoration: inherit; -webkit-font-smoothing: antialiased; speak: none; content: ""; }

[data-state="unlocked"] { color: #828282; }
[data-state="unlocked"] .lock { color: #828282; }
[data-state="unlocked"] .lock:before { font-family: FontAwesome; font-weight: normal; font-style: normal; text-decoration: inherit; -webkit-font-smoothing: antialiased; speak: none; content: ""; }

[data-state="semilocked"] { color: #646464; }
[data-state="semilocked"] .lock { color: #646464; }
[data-state="semilocked"] .lock:before { font-family: FontAwesome; font-weight: normal; font-style: normal; text-decoration: inherit; -webkit-font-smoothing: antialiased; speak: none; content: ""; }

.lock { position: absolute; top: 50%; right: 1em; color: #828282; background: white; background: rgba(255, 255, 255, 0.8); box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.35); padding: 0.5em; border-radius: 1em; width: 1em; height: 1em; line-height: 1em; text-align: center; font-size: 1rem; margin-top: -1em; margin-left: -1em; display: block; float: left; cursor: pointer; transition: all 0.5s; }
.lock:before { font-family: FontAwesome; font-weight: normal; font-style: normal; text-decoration: inherit; -webkit-font-smoothing: antialiased; speak: none; content: ""; }
.lock:hover { color: #333333; }

.alternate { position: absolute; top: 50%; left: 0.5em; color: #828282; background: white; background: rgba(255, 255, 255, 0.8); box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.35); padding: 0.5em; border-radius: 1em; width: 1em; height: 1em; line-height: 1em; text-align: center; font-size: 1rem; margin-top: -1em; margin-left: -0.2em; display: block; float: left; cursor: pointer; transition: all 0.5s; transform: rotate(-90deg); }
.alternate:before { font-family: FontAwesome; font-weight: normal; font-style: normal; text-decoration: inherit; -webkit-font-smoothing: antialiased; speak: none; content: ""; }

p:hover > .alternate { color: #333333; }

button, .btn, input[type=text], input[type=number] { border: none; border-radius: 5px; padding: 8px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.35); display: inline-block; text-align: center; }

input[type=text], input[type=number] { box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.35) inset; }

label { display: inline-block; }

.separator:before { content: ""; width: 3em; display: inline-block; }

fieldset { display: block; border: none; padding: 0; margin: 0; }

.pull-right { float: right; }

.keyword-list { font-size: 0.9em; }
.keyword-list dt { display: block; float: none; position: relative; }
.keyword-list dt:before, .keyword-list dt:after { content: ""; display: table; clear: both; }
.keyword-list dt span { cursor: pointer; }

.keyword-edit, .entry-edit, .predefined-replacements { position: absolute; top: 1.1em; left: 0.1em; background: #fff; z-index: 1; padding: 22px; border-radius: 5px; box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.35); }
.keyword-edit textarea, .entry-edit textarea, .predefined-replacements textarea { width: auto; width: 180px; height: 320px; }
.keyword-edit .btn, .entry-edit .btn, .predefined-replacements .btn { display: block; width: 100%; margin: 1em 0 0; }
.keyword-edit .close-window, .entry-edit .close-window, .predefined-replacements .close-window { z-index: 5; position: absolute; top: 12px; right: 12px; cursor: pointer; }

.window .error { color: #a52e28; text-align: center; display: block; }

.editor-modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: #000; background: rgba(0, 0, 0, 0.7); }
.editor-modal .wrapper { position: absolute; top: 52px; right: 52px; bottom: 122px; left: 52px; }
.editor-modal textarea { width: 100%; height: 100%; resize: none; }
.editor-modal [id=editor-form] input[type=submit] { position: absolute; top: -42px; right: 2px; }

dl:before, dl:after { content: ""; display: table; clear: both; }

.random { text-decoration: underline; }

.replace { font-weight: 700; }

.box { padding: 22px; transition: all 0.5s; background: rgba(255, 255, 255, 0.5); }
.box > * { position: relative; transition: all 0.5s; }

#words-limit { width: 80px; text-align: right; }

.center { text-align: center; }

body { background-color: #f0f0f0; color: #333333; font-family: sans; font-size: 14px; padding: 0; margin: 0; }
body > header { background: #333333; color: #f0f0f0; }

.container { max-width: 960px; min-width: 640px; width: 100%; margin: 0 auto; position: relative; }
.container:before, .container:after { content: ""; display: table; clear: both; }

.row { position: relative; }
.row:before, .row:after { content: ""; display: table; clear: both; }

.col { width: 50%; float: left; margin: 0; padding: 0; position: relative; padding: 1em; box-sizing: border-box; }

.col-23 { width: 62%; }

.col-13 { width: 38%; }

.overlay { display: none; position: absolute; top: 1em; right: 1em; left: 1em; background: #fff; }

.hide-overlay { position: absolute; top: 22px; right: 22px; cursor: pointer; z-index: 9999; }

[id=source] > *:hover { background: #bdbdbd; }

body > header legend { display: none; }

.stick-right { float: right; }

.form-row { position: relative; }
.form-row:before, .form-row:after { content: ""; display: table; clear: both; }
.form-row > button { position: absolute; top: 0; right: 0; }
.form-row > input[type=text] { width: 100%; box-sizing: border-box; padding: 9px 40px 9px 8px; text-align: left; }

.spinner-ui-document .kw:hover { background: cyan; cursor: pointer; }
.spinner-ui-document .kw { background: rgba(0, 0, 0, 0.2); }
.spinner-ui-document .kw-active { background: yellow; }
.spinner-ui-document .kw-lock { background: magenta; }
.spinner-ui-document mark:hover { background: #E8B00C; cursor: pointer; }

.sets { display: block; list-style: none; padding: 0; margin: 0; }
.sets li { display: block; margin: 2px 0; }
.sets li .actions span { cursor: pointer; padding: 4px; font-size: 1.2em; margin-right: 10px; color: #8c8c8c; }
.sets li .actions span:hover { color: #333; }
.sets .new { color: #8c8c8c; }
.sets dd { position: relative; }
.sets .move { position: absolute; top: 0; right: 0; color: #8c8c8c; }
.sets .move span:hover { color: #333333; }

.keyword { cursor: pointer; }

.keyword-list.active { background: #bdbdbd; }

.overlay { opacity: 0.9; }