html {
	width:100%;
	height:100%;
	position:fixed;
	top:0;
}

body {
	font-family:sans-serif;
	font-size:1em;
	overflow:auto;
	width:100%;
	height:100%;
}

#left_half {
	position:absolute;
	top:0;
	left:0;
	width:30%;
	height:100%;
	margin-top:0;
	display:block;
	background-color:hsl(220, 10%,40%);
	color:#eee;
}

#right_half {
	position:absolute;
	top:0;
	width:70%;
	left:30%;
	height:100%;
	padding-top: 3em;
}

.info #right_half, .overview #right_half {
	position:absolute;
	top:0;
	left:30%;
	width:70%;
	height:100%;
	float:right;
	margin-left:0;
	margin-top:0;
	overflow-x:auto;
	overflow-y:hidden;
	background-color:#fff;
	font-family:sans-serif;
	padding-top: 3em;
}

#container.wide.overview #right_half {
	display:block;
	width:100%;
	position:static;
	height:100%;
	margin-left:0;
	margin-top:0;
	overflow-x:auto;
	overflow-y:hidden;
	background-color:#fff;
	font-family:sans-serif;
	/* padding:0em 0em; */
}

#container.wide.overview #left_half {
	display:none;
}

#container.wide.compose #right_half {
	display:none;
}

#container.wide.compose #left_half {
	width:100%;
}

#container.present #left_half {
	display:none;
}

#container.present #right_half {
	position:relative;
	width: auto;
	height:100%;
	margin: auto;
	background-color: #fff;
	overflow:hidden;
	display:block;
	top:unset;
	left:unset;
	padding-top:unset;
}

#container.compose #left_half {
	position:relative;
	float:left;
	width:50%;
	height:100%;
	padding:0;
	margin-top:0;
}

#container.compose #right_half {
	position:relative;
	width:50%;
	height:100%;
	float:right;
	margin-left:0;
	margin-top:0;
	overflow-x:auto;
	overflow-y:hidden;
	background-color:#fff;
	font-family:sans-serif;
	top:unset;
	left:unset;
}

.ace_highlight-marker {
	position: absolute; /* without this positions will be wrong */
	background: #ddf; /* color */
	z-index: 1000; /* in front of all other markers */
}

.ace_slide-marker {
	position: absolute; /* without this positions will be erong */
	background: #ffc; /* color */
	z-index: 1000; /* in front of all other markers */
}

.paragraphs {
	white-space:normal;
}

.steps {
	visibility:hidden;
}

.steps.shown {
	visibility:visible;
}

.lcref-content .steps {
	visibility:visible;
}

.collapsea[aria-expanded="true"] .expand_less {
	display:inline-flex !important;
}

.collapsea[aria-expanded="true"] .expand_more {
	display:none;
}

.collapsea[aria-expanded="false"] .expand_less {
	display:none;
}

.collapsea[aria-expanded="false"] .expand_more {
	display:inline-flex !important;
}

mjx-math {
	padding:0.4em 0 !important;
}

#output > div.slide[contenteditable="true"] .slide_content :not([wbtag="ignore"]):not([wbtag="skip"]):not([wbtag="transparent"]):not(.paragraphs) {
	border: 1px solid grey;
	padding: 1px;
}

#output > div.slide[contenteditable="true"] .paragraphs {
	color: grey;
	font-family: monospace;
}

#loading_icon {
	position:absolute;
	top:0;
	display:table;
	height:100%;
	width:100%;
	background-color:hsla(0, 0%, 100%, 0.8);
	z-index:999;
}

#loading_icon > div {
	display:table-cell;
	vertical-align:middle;
	width:100%;
	height:5em;
	margin:0 auto;
	text-align:center;
}

.navbar-nav li.advanced:hover {
	position:relative;
}

.navbar-nav li.advanced:hover > ul.dropdown-submenu {
	display: block;
}

.dropdown-submenu {
	position:absolute;
}

.dropdown-submenu {
	top:-500%;
	left:100%;
	margin-top:-5px;
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
	border-color:#aaa !important;
}

.nav-tabs .nav-link.active {
	font-weight:bold !important;
	color:inherit !important;
	background-color:inherit !important;
	border:none !important;
}

.nav-tabs .nav-link:focus,  {
	border-color:#aaa !important;
}

.nav-tabs .nav-link {
	color:#bbb !important;
	background-color:inherit !important;
}

.nav-tabs {
	border-bottom:none;
	border-color:#ccc !important;
}

#right_half > .navbar {
	position:absolute !important;
	top:0;
	left:0;
	padding-left:5px;
	padding-right:5px;
	display:block;
}

.light {
	color:#888;
}

iframe.webwork {
	border: #ddd solid 2px;
	border-radius:5px;
}

.output .material-icons.expand_more, .output .material-icons-outlined.expand_less {
	vertical-align:sub !important;
	margin-left:-5px !important;
}

#info_half .material-icons {
	vertical-align:bottom !important;
}

.output .material-icons-outlined.expand_less {
	transform:rotate(90deg) !important;
}

.dim .menu_container, .dim .load_icon, .dim .paragraphs, .dim textarea, .dim table, .dim table * {
	background-color: #222 !important;
	color: #bbb !important;
}

.dim .lcref, .dim .lcref .paragraphs {
	background-color: #333;
	color: #bbb;
}

.progress-bar {
	background-color: #ddd !important;
}

#container.compose #left_half #normalize_icon{
	display:none;
}

#container.compose #left_half #maximize_icon{
	display:block;
}

#container.compose.wide #left_half #normalize_icon {
	display:block;
}

#container.compose.wide #left_half #maximize_icon {
	display:none;
}

.output {
	flex:auto;
	width:100%;
	height:100%;
	margin:auto;
	overflow:auto;
	font-family:Sans-Serif;
}

#print_content .output {
	font-family:Serif;
}

.present #right_half #output {
	padding: 10% 0;
	position:relative;
	background:#fff;
	text-align: justify;
	font-size:1.2em;
	overflow-x:hidden;
	overflow-y:auto;
	display:table;
	display: -webkit-flexbox;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}

.info .output, .overview .output, .compose .output {
	padding-left: 1em;
	padding-right: 1em;
	padding-bottom:5%;
}

.overview.wide .output {
	position:relative;
	font-family:Sans-Serif;
	background:#fff;
	text-align: justify;
	width:100%;
	max-height:100%;
	margin:auto;
	font-size:1.2em;
	overflow:auto;
	display:block;
}

#container.wide #info_half {
	display:none;
}

#info_half {
	display: flex;
	flex-flow: column;
	height: 100%;
}

.compose #info_half {
	display:none;
}

#container #input_container {
	display:none;
}

#container.compose #input_container {
	display:flex;
	flex-direction:column;
	background-color: #666;
	border:0;
	height:100%;
}

.info #input_container, .overview #input_container {
	display:none;
}

/* .compose #input_container {
display: flex;
flex-direction: column;
} */
#input {
	flex:0 1 auto;
	height:100%;
}

#right_half.dual #carousel, #right_half.overview #carousel, #right_half.compose #carousel , .info #right_half #carousel{
	display:none;
}

.present #right_half #output.long, #right_half.annotate #output {
	display:block;
}

.present #right_half #full_screen_icon {
	display:none;
}

.info #full_screen_icon, .compose #full_screen_icon {
	display:inline-block;
}

.present #right_half #dual_icon {
	display:inline-block;
}

.info #dual_icon, .compose #dual_icon {
	display:none;
}

.present .menu_button[function!='render'] {
	display:block;
}

.present .menu_button[function='render'] {
	display:none;
}

.info .menu_button[function='render'], .compose .menu_button[function='render'] {
	display:block;
}

#present_button {
	display:block;
}

.wide #present_button, .present #present_button {
	display:none;
}

.wide #info_button, .present #info_button {
	display:block;
}

.btn.dim {
	opacity:0.5;
	padding-right:10px;
}

.btn.dim.active {
	/* color: #aaa; */
}

.separator {
	position:relative;
	width:100%;
	height:1.5em;
	text-align:center;
	font-weight: normal;
	font-size: 1em;
	display:block;
}

.separator .slide_label {
	color: pink;
}

.slide.selected .separator .slide_label {
	font-weight: bold;
	color:red;
}

.info .separator, .compose .separator {
	display:block;
}

.present .separator {
	display:none;
}

.separator .slide_label {
	background-color:white;
}

.dim .separator .slide_label {
	background-color:#222;
}

.present #output > div.slide {
	align-content: center;
	flex-direction: column;
}

.slide_number {
	position:fixed;
	bottom:2%;
	right:2%;
	color:#ccc;
	font-size:75%;
	z-index:990;
	display:none;
}

.present .slide_number {
	position:fixed;
	bottom:2%;
	right:2%;
	color:#ccc;
	font-size:75%;
	z-index:990;
	display:block;
}

.overview .contols {
	display:none;
}

.controls {
	display:none;
}

.present .controls_container:not(.hidden) {
	width:auto;
	font-size:2em;
	color:SteelBlue;
	opacity:0.25;
	z-index:500;
	display:block;
}

.present .carousel-indicators:not(.hidden) {
	top: 0 !important;
	bottom:initial !important;
	margin-top:10px !important;
	z-index:1200 !important;
	opacity:0.25;
	display:flex;
}

#output:not(.present) .controls {
	display:none;
}

.carousel.pointer-event {
	touch-action: pan-y pinch-zoom !important;
}

select#render_sel option[value="Render"]
{
	background-image:url("icons/refresh-24px.svg");
}

#render_sel option {
	color:#ddd;
	background-color:#444;
}

textarea {
	color:#000;
	border:1;
	font-family:Courier;
	font-size:12pt;
}

iframe {
	border:0;
	width: 1px;
	min-width: 100%;
}

iframe:not(.webwork) {
	background:transparent url("icons/Loading_icon.gif") center no-repeat;
}

.loading_icon {
	text-align:center;
	overflow-y:hidden;
	height:3.5cm;
	width:5cm;
	margin:1cm auto
}

ol {
	list-style-type: decimal;
}

ol > li > ol {
	list-style-type: lower-alpha;
}

ol > li > ol > li > ol {
	list-style-type: lower-roman;
}

.collapse_icon {
	color:pink;
}

.icon.latex, .icon.xml {
	display:none;
}

#toc a.course {
	font-size:1.2em;
	font-weight:bold;
}

#toc a.chapter {
	font-size:1.2em;
}

#toc a.section {
	font-size:1em;
}

#toc a.subsection {
	font-size:0.8em;
}

#toc a.subsubsection {
	font-size:0.8em;
}

#toc a.highlighted {
	color:#9ff;
}

.list-group-item {
	background-color:inherit;
}

b.highlighted, h5.highlighted, h4.highlighted, h3.highlighted, h2.highlighted, h1.highlighted, button.highlighted{
	background-color: #fcf5cf;
	padding: 5px;
}

#info_keywords {
	width: 100%;
	overflow-x:auto;
	padding: 1em 0;
}

.newline:after{
	content: "\A";
	white-space: pre;
}

.btn_keyword {
	max-width: 100%;
	white-space: normal;
	text-align:left;
}

.highlight {
	background-color:#ff0;
}

.hidden, .comment, .hidden_collapse {
	display:none !important;
}

#info_statements {
	overflow-wrap: break-word;
	width:100%;
	height:auto;
}

#info_half {
	position:relative;
	padding-top:2em;
	padding-bottom:0em;
	width:100%;
	height:100%;
	overflow-x:hidden;
}

#info_half .nav-tabs {
	position:fixed;
	top:5px;
}

.tab-content {
	padding-top:0;
	padding-left:1em;
	padding-right:0;
	flex: 1 1 auto !important;
	overflow-y:auto;
}

#info_half hr {
	border-color: #bbb;
}

#info_half strong {
	color: #ddd;
}

#container, #container.overview {
	width:100%;
	height:100%;
	margin:auto auto;
	background-color:#fff;
	overflow-y:hidden;
	overflow-x:hidden;
	page-break-after: always;
}

#container.present {
	overflow-y: 'auto';
}

.slide_container.wide {
	width:25cm;
}

.statement, .substatement {
	/* page-break-inside:auto; */
}

tbody:before {
	content:"\200C";
	display:block;
	line-height:0px;
}

.table tr td {
	border: solid 1px #ccc;
}

.table thead th {
	font-size:1em;
	border: solid 2px #bbb;
}

.no_border {
	border:none;
	padding-top:0;
	padding-bottom:0;
	padding-left:0;
	background:#fff;
}

.plain_button {
	border:none;
	padding:0;
	background:hsla(0,0%,0%,0);
	cursor:pointer;
	text-align:left;
}

.item_button {
	border:none;
	padding:0;
	background:hsla(0,0%,0%,0);
	cursor:pointer;
}

#title {
	position:fixed;
	bottom:2%;
	left:2%;
	color:#aaa;
	/* color:#428bc1; */
}

#info_button {
	display:none;
}

.break {
	display: none;
}

.break .after {
	page-break-after: always;
}

.break .before {
	page-break-before: always;
}

.slide_button {
	color:SteelBlue;
}

.slide_button.half {
	color:black;
}

.slide_mask {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:none;
	z-index:500;
}

#compose_icon {
	width:auto;
	max-height:1.5rem;
	color:#888;
	border:none;
}

#edit_button.editing {
	background-color: red;
	color: white;
}

#edit_icon {
	width:auto;
	opacity:0.5;
	border:none;
	margin-right: 0.5rem;
}

#maximize_icon, #full_screen_icon {
	overflow:hidden;
}

#full_screen_icon {
	opacity:0.5;
}

#close_icon {
	font-size:2rem;
	line-height:1.25rem;
}

#normalize_icon, #dual_icon {
	background-color:transparent;
	border:none;
	display:none;
	margin:auto;
}

#dual_icon {
	opacity:0.5;
}

.icon.hide {
	font-size:2.5rem;
	line-height:2rem;
	width:auto;
	margin:auto;
	text-align:center;
}

#edit_menu_container, #info_menu_container {
	color:SteelBlue;
	z-index:999;
	border:none;
	text-align:center;
	overflow-x:hidden;
	overflow-y:hidden;
	display:block;
}

#output_icon_container {
	overflow:hidden;
}

#edit_menu_container {
	right:0;
	padding:0;
	width:50px;
	height:100%;
}

#info_menu_container {
	position:absolute;
	top:10px;
	right:10px;
	width:auto;
}

#menu_container {
	height:3em;
	width:100%
}

.present > #menu_container {
	position:fixed;
}

#main_menu_button {
	font-size:1.5em;
}

.present .slide_sel {
	display:none;
}

#cover_half {
	display:none;
	position:fixed;
	bottom:0;
	left:0;
	width:100%;
	height:50%;
	background-color:#000;
}

.framebox {
	padding: 10px;
	border: 10px solid SteelBlue;
	border-radius: 10px;
	width:100%;
	overflow-x:auto
}

.slide_container {
	position:relative;
	height:auto;
	width:17cm;
	margin:auto;
	overflow-x:auto;
	overflow-y:hidden;
}

.slide_content {
	position:relative;
	clear:left;
	width:100%;
	height:auto;
	overflow-x:auto;
	overflow-y:hidden;
	padding:0;
}

.menu_button.canvas {
	display:none;
}

.present .menu_button.canvas {
	display:block;
}

canvas {
	z-index:999;
	border: 1px solid #eee;
	position: absolute;
	left: 0;
}

canvas.disabled {
	z-index : 0;
}

.canvas-controls {
	position:fixed !important;
	top:50px;
	right:10px;
	display:none;
	z-index:1500;
	font-size:1rem;
	width:2.5em;
}
.canvas-controls.canvas-controls-left {
	left:10px;
}

.annotate .canvas-controls, .annotate .canvas-controls .navbar {
	display:block;
}

.annotate .slide_container {
	float:left;
	padding-left:2em;
	z-index:750;
}

@page
{
	size: auto;   /* auto is the initial value */
	/* this affects the margin in the printer settings */
	margin: 25mm 25mm 25mm 25mm;
}

.image {
	margin:1em auto;
	padding:1em;
	text-align:center;
}

.image[wbtag="figure"] {
	border: 1px solid #ddd;
	border-radius:5px;
}

.caption {
	background-color:#fafafa;
	width:100%;
	text-align:center;
	border-radius:5px;
}

.center {
	padding:1em;
}

.dual-left {
	padding:10px;
}

.dual-right {
	padding:10px;
}

.output img.loading {
	/* width:10cm;
	height:10cm; */
	/* background:transparent url("icons/Loading_icon.gif") center no-repeat !important; */
	display:none;
}

.dual-left{
	display:table-cell;
	width:50%;
	vertical-align:middle;
	text-align:center;
	padding-right:5px;
}

.dual-right{
	display:table-cell;
	width:50%;
	vertical-align:middle;
	text-align:center;
	padding-left:5px;
}

.latexSource {
	border: 1px solid;
	font-family: "Courier New";
	font-size: 0.8em;
	color : #f44;
	white-space: pre-wrap;
}

span.latex_href svg {
	fill: currentColor;
}

thead th {
	background-color:SteelBlue !important;
	color:#eee;
}

.output h5, .output h1, .output h2, .output h3, .output h4, .output b, .output strong {
	color:SteelBlue;
}

h5 {
	font-size:1.2em;
	display:inline-block;
}

hr {
	border-color:#ddd
}

.dim hr {
	border-color: #555;
}

blockquote {
	border-left: 2.5px solid #ddd;
	padding-top:0px;
	padding-left:10px;
	padding-right:0px;
}

.knowl > div > blockquote {
	border:none;
}

a:link, a:visited,  a:active {
	color:SteelBlue;
	text-decoration: none;
}

#title {
	z-index:100;
}

.icon {
	width:auto;
	text-align:center;
	clear:both;
	margin:auto;
	color:#aaa;
	overflow:hidden;
}

.plain_button:focus, .plain_button:active {
	background-color:transparent !important;
	outline:none !important;
	box-shadow:none !important;
}

#main_menu_button, #left_button, #right_button {
	line-height:1.5rem;
	background-color:transparent !important;
	color:hsl(211, 0%, 43%, 0.25) !important;
	border:none !important;
}

#main_menu_button:active, #main_menu_button:focus, #main_menu_button.active {
	background-color:transparent !important;
	color:SteelBlue !important;
	border:none !important;
}

#edit_menu_button {
	background-color:hsl(211, 0%, 43%, 0) !important;
	color:#bbb !important;
	border:none !important;
}

#main_edit_menu {
	background-color: hsla(0, 0%, 50%, 1);
}

.dropdown-menu.keywords, .popover {
	min-width:5em !important;
	box-shadow: 5px 5px 2px hsla(0,0%,0%,0.5);
}

.dropdown-menu.keywords > a {
	padding:5px;
}

.dropdown-toggle::after {
	display:none
}

.dropdown-submenu {
	position:relative;
}

#preamble {
	display:none;
}

#slider_container {
	max-width:100%;
	text-align:center;
	margin-top:1.2em;
}

#menu_container {
	z-index:1000;
}

.present #menu_container {
	background-color:#fff;
}

#main_menu {
	border:none;
}

.modal-dialog {
	max-width:21cm;
}

.modal-header {
	background-color:SteelBlue;
}

.modal .close {
	color:#fff;
}

.modal-body {
	color:SteelBlue;
}

.modal-body .share_ext {
	width:100%;
	height:3.5em;
	word-break:break-all;
	overflow-x:auto;
	font-family:Courier;
}

.modal-title {
	color:#fff;
}

.modal-footer.latex .render,
.modal-footer.latex .load-index,
.modal-footer.latex .update-index {
	display: none;
}

.modal-footer.xml .load-index,
.modal-footer.xml .update-index {
	display: none;
}

.modal-footer .github {
	display:inline-block;
}

.modal input {
	color:#666 !important;
	border:solid 1px #eee;
	border-radius:5px;
}

#text_modal .modal-dialog {
	max-width:75%;
}

.share_text {
	width:100%;
	word-break:break-all;
	overflow-y:auto;
	font-family:Courier;
}

.text_modal .modal-body {
	background-color:hsla(0,0%,100%,0.75);
}

#source_text {
	width:100%;
	height:65%;
	font-family:Courier;
}

.keywords {
	width:100%;
	text-align:left;
}

.keywords .title {
	font-size:0.8em;
	margin-right:0.5em;
}

#info {
	padding-top:1em;
	padding-bottom:1em;
	padding-right:1em;
	height:100%;
	overflow-y:auto;
}

#info_statements_num  a, #info_statements  a:visited, #info_statements  a:link{
	color:#ddd;
}

a.info_statements_num, a.share {
	color:#ddd;
}

#info_statements span {
	color:#eee;
}

h5.current_slide {
	color:#eee;
}

.slide_info > b {
	color:#eee;
}

#toc {
	background-color:transparent;
	color:#eee;
	height:100%;
	overflow-y:auto;
	padding-right:1em;
	padding-top:1em;
}

#toc ul {
	padding-left:1.2em;
}

#toc a {
	color:#eee;
}

#index {
	vertical-align:bottom;
	background-color:transparent;
	color:LightBlue;
	height:100%;
	overflow-y:auto;
	padding-right:1em;
	padding-top:1em;
}

.slide_info.share {
	background-color:transparent;
	color:LightBlue;
	border:1px solid;
	padding:10px;
	border-radius:5px
}

.slide_info .share_text {
	background-color:transparent;
	color:LightBlue;
	border:1px solid;
	border-radius:5px
}

.lecture_skip [data-lecture-skip="true"] * {
	color:#ccc !important;
}

#right_half.dimmed, #right_half.dimmed #menu_container, #right_half.dimmed #output, #right_half.dimmed #output > .paragraphs, #right_half.dimmed #output :not(.title) > .paragraphs, #right_half.dimmed .lcref, #right_half.dimmed textarea {
	background-color: #222 !important;
	color: #bbb;
}

#right_half.dimmed .separator .slide_label {
	background-color: #222;
}

.dimmed blockquote {
	border-left: 2.5px solid #555;
	padding-top:0px;
	padding-left:10px;
	padding-right:0px;
}

/* #slide_progress td {
	height:7px;
	border-color: #fff;
	border-style: none solid;
}

.dim #slide_progress td {
	border-color: #222;
}

#slide_progress td.past {
	background-color: #ccc;
}

#slide_progress td.future {
	background-color: #eee;
} */
