/** dokieli
 *
 * Sarven Capadisli <info@csarven.ca> http://csarven.ca/#i
 * http://www.apache.org/licenses/LICENSE-2.0.html Apache License, Version 2.0
 * https://github.com/linkeddata/dokieli
 */

@media print {
.do {
display:none !important;
}
.tabs nav {
display:none !important;
}
.tabs .selected {
border:0 !important;
padding:0 !important;
}
}

@media screen {
body.on-document-menu > *:not([class~="on"]) {
opacity:0.5;
transition: opacity 1s ease-in-out;
-moz-transition: opacity 1s ease-in-out;
-webkit-transition: opacity 1s ease-in-out;
}
}

[contenteditable=true]:focus {
outline:none;
}

#content,
#document-interactions {
position:relative;
}

menu.do,
aside.do {
position:fixed;
z-index:8;
max-height:calc(100% - 4em);
background:#fff;
font-size:0.8em;
margin:0;
}
menu.do {
top:0;
right:0;
}
aside.do {
top:1em;
}
.do.on {
padding:1em;
overflow:auto;
z-index:9;
}
.do.on p {
text-indent:0;
}

aside.do.on {
border:1px solid #ccc;
border-radius:0.5em;
box-shadow:0.25em 0.25em 0.25em rgba(0,0,0,0.1);
}
menu.do.on {
border-left:1px solid #ccc;
border-bottom:1px solid #ccc;
border-bottom-left-radius:0.5em;
box-shadow:0.25em 0.25em 0.25em rgba(0,0,0,0.1);
}
aside.do.on:not([id="toc"]) {
left: 50%;
transform: translate(-50%, 0);
}

aside.do input {
padding: 0.2em;
}

aside.note {
position:static;
border:0;
height:0;
margin:0;
padding:0;
}
aside.note:after {
width:auto;
position:static;
}

#document-editor {
position:static;
}

#toc {
left:1em;
}
.success { background-color:#FFFFFF; color:#647819; font-weight:bold; }
.warning { background-color:#FFFF00; color:#000000; font-weight:bold; }
.error { background-color:#FF0000; color:#FFFFFF; font-weight:bold; }
.highlight { background-color:#00FFFF; color:#000000; }

#document-menu > button {
position:absolute;
top:1em;
right:1em;
font-size:26px;
}
#document-menu > header {
display:none;
}
#document-menu > footer {
display:none;
margin-top:1em;
}
#document-menu.on > header,
#document-menu.on > footer {
display:block;
}

#document-menu section {
margin-top:2em;
}
#document-menu ul,
#document-menu h2,
#toc h2 {
margin:0;
padding:0;
}
#document-menu p {
text-indent:0;
}
#document-menu.do caption:before {
content: '' !important;
}


#document-do ul,
#views ul,
#document-metadata ul,
#embed-data-in-html ul,
#table-of-stuff ul {
list-style-type:none;
}
#document-metadata * {
text-align:left;
margin:0;
}
#document-metadata table,
#document-metadata table * {
border:0;
padding-left:0;
}
#document-metadata caption {
font-size:1.231em;
font-weight:bold;
}


#views li,
#embed-data-in-html li,
#table-of-stuff li,
#document-do li {
display:inline;
margin-right:1em;
}

.tabs nav {
position:relative;
z-index:9;
}
.tabs nav ul {
list-style-type: none;
margin:0 !important;
}
.tabs nav ul li {
font-weight:bold;
display:inline-block;
border:2px solid #ffffff;
border-bottom:#cccccc;
}
.tabs nav ul li.selected {
border:2px solid #cccccc;
border-bottom-color:#ffffff;
}
.tabs nav ul li a {
background-color:#eeeeee;
color:#000000;
text-decoration:none;
display:block;
padding:0.75em 1em;
outline:none;
}
.tabs nav ul li.selected a {
text-decoration:none;
color:#000000;
background-color:#ffffff;
}
.tabs > div,
.tabs > figure {
display:none;
clear:both;
margin-top:-2px;
}
.tabs > div.selected,
.tabs > figure.selected {
display:block;
}

.tabs figure.selected:not([class~=listing]),
.tabs .selected textarea {
padding:0.75em 1em;
display:block;
border:2px solid #cccccc;
}

#table-of-stuff label {
font-weight:normal;
}

#browser-contents {
overflow-x: hidden;
overflow-y: auto;
min-width: 25%;
max-height: 16em;
margin:1em 0;
}
#browser-contents ul {
margin:0;
}
#browser-contents ul input[type="radio"] {
display: none;
}
#browser-contents ul label {
display: block;
padding: 0.4em;
cursor: pointer;
}
#browser-contents .container {
background-color: #f2f2f2;
}
#browser-contents .container:hover {
background-color: #ccc;
}
#browser-contents input[checked="true"] + label {
font-weight: bold;
}
#location-final {
display: block;
max-width:24em;
word-wrap: break-word;
}
#base-url-selection label {
display: block;
}

.do.sortable .sortable-placeholder {
outline: 1px dashed #777;
}

.do.sortable .sortable li {
cursor:grab;
cursor:-moz-grab;
cursor:-webkit-grab;
position:relative;
}

.do.sortable .sortable li:active {
cursor:move;
}

.do.sortable .sortable li:before,
.do.sortable .sortable li a:before {
border-left: 2px dotted #ccc;
}
.do.sortable .sortable li a:before {
position:absolute;
top:0;
left:-1.4em;
content:"\00a0";
cursor:grab;
cursor:-moz-grab;
cursor:-webkit-grab;
}


.do button {
line-height:1;
font-family:monospace;
font-weight:bold;
padding:0.25em;
z-index:9;
}

button.close {
position:absolute;
top:0.5em;
right:0.5em;
z-index:9;
}

.do.position-relative {
position:relative;
z-index:1;
}

.slide {
display:none;
}
.do.slide {
display:block;
}
.on-slideshow > header,
.on-slideshow > footer,
.on-slideshow #comments,
.on-slideshow article h1,
.on-slideshow article #authors,
.on-slideshow article > dl,
.on-slideshow article > div > dl,
.on-slideshow article section:not([class~="do"]),
.on-slideshow aside:not([class~="do"]) {
display:none;
}

.rfc-2119 {
text-transform: lowercase;
font-variant: small-caps;
font-style: normal;
}

@media screen {
.todo {
background-color:#f0f;
}
.todo:before {
content:"TODO: ";
}

.rtl {
unicode-bidi:bidi-override;
direction:rtl;
}

.align-left { float:left; margin-right:2em; margin-bottom:2em; }
.align-right { float:right; margin-left:2em; margin-bottom:2em; }

.do.fragment {
position:absolute;
top:0;
right:0;
text-indent:0;
padding-right:10px;
font-size:1em;
}

.do.fragment a {
padding-right:10px;
height:100%;
display:block;
font-family: monospace;
font-weight:normal;
outline:none;
text-align:right;
text-decoration:none;
}
.do.fragment a:first-child {
border-right: 2px solid rgba(128,128,128,0.2);
}
.do.fragment a:nth-child(n+2) {
border-right: 2px solid rgba(64,64,64,0.9);
}

img[width="48"][height="48"][rel$="image"] {
border-radius:0.5em;
margin-right:0.5em;
vertical-align:middle;
}

.sparkline {
height: 1em;
width: 100%;
max-width: 100px;
}