/* 
Table of content
(1) General
(2) Plugins common
(3) Plugin Adminconsole
(4) Plugin Renaming
(5) Plugin HTML Dialog
(6) Plugin KnowledgeBasesGenerator
(7) Plugin KnowObjectTypeActivator
(8) Plugin Testsuite
(9) Plugin TemplateTagHandler
(10) Default Interview

used colors
#D2D2D2 ~ even tbl column color
#5DA4B6 ~ links
#A375D1 ~ link visited
#FFD324 ~ lines info boxes
#FFF6BF ~ bg info boxes
#F1F6FA ~ bg rename tbl + input fields
#96BBD9 ~ bg headerboxes | borders
*/
/* ################################################## */
/* ------ overwritten settings from jspwiki --------- */
/* ################################################## */
.applicationlogo a:hover {
	background-position: 10px 0px; /*prevent logo hopping*/
}

/* ################################################## */
/* -------------- general settings    --------------- */
/* ################################################## */

#KnowWENotificationMessage {
	white-space: pre-wrap;
	font-weight: 600;
}

#KnowWENotificationDom {
	color: white;
	position: fixed;
	z-index: 2000;
	box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.15);
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	padding: 5px 7px;
}

#KnowWENotificationDom.notification-success {
	background-color: var(--text-color-success); /*#1aa52a;*/
}

.dark-mode #KnowWENotificationDom.notification-success {
	color: var(--text-color-success);
	background-color: var(--bg-color-infobox);
}

#KnowWENotificationDom.notification-success #KnowWENotificationQuit a {
	color: var(--text-color-primary);
}

#KnowWENotificationDom.notification-warn {
	background-color: var(--bg-color-warning);
}

.dark-mode #KnowWENotificationDom.notification-warn {
	color: var(--bg-color-warning);
	background-color: var(--bg-color-infobox);
}

#KnowWENotificationDom.notification-warn #KnowWENotificationQuit a {
	color: var(--text-color-primary);
}

#KnowWENotificationDom.notification-error {
	background-color: var(--text-color-error);
}

.dark-mode #KnowWENotificationDom.notification-error {
	color: var(--text-color-error);
	background-color: var(--bg-color-infobox);
}

#KnowWENotificationDom.notification-error #KnowWENotificationQuit a {
	color: var(--text-color-primary);
	user-select: none;
}

#KnowWENotificationQuit a {
	position: fixed;
	top: 0;
	right: 6px;
}

#KnowWENotificationQuit a {
	padding: 0 7px;
	margin-top: 5px;
	background-color: var(--bg-color-primary);
	border-radius: 3px;
}

#KnowWENotificationCounter a {
	color: white;
}

#KnowWENotificationCounter {
	padding: 5px;
	position: fixed;
	top: 0;
	right: 33px;
	font-weight: 600;
	user-select: none;
}

#KnowWENotificationCounter .next-notification, #KnowWENotificationCounter .prev-notification {
	padding: 5px 10px;
}

#KnowWENotificationCounter .notification-counter {
	position: relative;
	top: -1px;
}

#KnowWENotificationCounter .inactive {
	pointer-events: none;
	opacity: 0.4;
}

#KnowWENotificationMessage {
	margin-right: 120px;
}

.fa-pencil.image-icon {
	width: 16px;
	margin-right: 4px;
}

.noselect {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

a {
	color: #003366;
	cursor: pointer;
	text-decoration: none;
}

a:hover {
	color: #003DF5;
	text-decoration: underline;
}

/* #CCFF00; */

.KnowWE .hidden {
	display: none;
}

.KnowWE .visible {
	display: inline;
}

.KnowWE .visibleBlock {
	display: block;
}

.even {
	background-color: #D2D2D2;
}

.left {
	float: left;
}

.right {
	float: right;
}

.clear {
	clear: both;
}

.small {
	font-size: 10px;
}

.bg-green {
	background-color: #CFC;
}

.bg-red {
	background-color: #FCC;
}

.bg-blue {
	background-color: #CCF;
}

.pointer {
	cursor: pointer;
}

.extend-panel-down {
	padding: 0 5px;
}

.extend-panel-up {
	padding: 0 5px;
}

.extend-panel-right {
	padding: 0 5px;
}

.objectInfoPanel .extend-panel-right,
.objectInfoPanel .extend-panel-up,
.objectInfoPanel .extend-panel-down {
	margin-left: 16px;
}

.extend-panel-right i,
.extend-panel-up i,
.extend-panel-down i {
	margin-right: 10px;
}

.message-dialog {
	position: fixed;
	background: var(--bg-color-infobox);
	border-bottom: 2px solid #FFD324;
	border-top: 2px solid #FFD324;
	z-index: 9999;
	top: 50%;
	left: 50%;
	padding: 5px;
}

.message-dialog h2 {
	background: var(--bg-color-infobox) url(../images/msg_info.png) center no-repeat;
	background-position: 10px 50%; /* x-pos y-pos */
	padding: .5em;
	padding-left: 40px;
	margin: 0;
	height: 1em;
}

.message-dialog p {
	margin: 0;
	margin-top: .5em;
	padding: .5em;
	overflow: hidden;
	height: 50%;
}

.message-dialog .buttons {
	height: 2em;
	padding: .5em;
	text-align: right;
	background-color: var(--bg-color-infobox);
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

code.box {
	background-color: #F9F9F9;
	border: 1px solid #DDDDDD;
	margin: 1em;
	padding: 0.2em;
	display: block;
}

.ajaxloader {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-left: -50px;
	margin-top: -50px;
	z-index: 2000;
}

/* ################################################## */
/* ------------->>> info boxes       <<<------------- */
.box {
	text-align: left;
	border-top: 2px solid #FFD324;
	border-bottom: 2px solid #FFD324;
	margin: 10px 0px;
}

.warning {
	background: var(--bg-color-infobox);
	padding: 5px 20px 5px 45px !important;
	color: var(--text-color-warning);
}

.error {
	background: var(--bg-color-infobox);
	padding: 5px 20px 5px 45px;
	position: relative;
}

.error i, .warning i {
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
}

.ci-title .trigger-build-icon {
	position: static;
	color: var(--text-color-primary-link);
	margin-right: 3px;
}

.error i {
	color: var(--color-red);
}

.warning i {
	color: var(--color-orange-light);
}

.error_highlight {
	background-color: var(--bg-color-infobox);
}

.ok {
	background: var(--bg-color-infobox) url(../images/msg_checkmark.png) center no-repeat;
	background-position: 10px 50%; /* x-pos y-pos */
	padding: 5px 20px 5px 45px;
}

.hint {
	display: none;
	position: absolute;
	right: 30px;
	width: 200px;
	margin-top: -4px;
	border: 1px solid #c93;
	padding: 10px 12px;
	background-color: #ffc;
}

.knowwetable select {
	width: 100px;
}

/* ################################################## */
/* ------------->>> Panel Admin      <<<------------- */
/* ################################################## */
#admin-panel ul {
	list-style-type: none;
}

#admin-panel li {
	font-size: 0.9em;
	padding: 0px 20px;
	background: #FFF url(../images/arrow_right.png) no-repeat 0px 3px;
}

#admin-panel table {
	background-color: #FFF;
	margin: 10px 0px;
}

#admin-panel thead {
	border: 2px solid #000;
}

/* ################################################## */
/* ------------->>> Panel Rename     <<<------------- */
/* ################################################## */
#rename-panel fieldset {
	border: 0px solid #DDD;
	padding: 5px 10px;
}

#rename-panel input {
	margin: 2px 15px;
	padding: 6px;
	width: 100px;
}

#rename-panel input.button, #knoffice-panel input.button {
	border: 1px solid #DEDEDE;
	cursor: pointer;
	margin: 14px 0px;
}

#rename-panel input.button:hover, #knoffice-panel input.button:hover {
	background-color: #E6EFC2;
	border: 1px solid #C6D880;
	color: #529214;
}

#rename-panel input.field {
	background-color: #F1F6FA;
	border: 1px solid #96BBD9;
	margin: 2px 15px;
	width: 100px;
}

#rename-panel label, #KnowWEObjectTypeBrowser label {
	color: #5DA4B6;
	display: block;
	font: bold 0.8em/1.4em Arial;
	margin: 0px 15px;
	width: 150px;
}

#rename-panel legend, #KnowWEObjectTypeBrowser legend {
	font-weight: bold;
	color: #5DA4B6;
}

/* ################################################### */
/* --------- styling of the search knoffice panel ---- */
#knoffice-panel label {
	color: #5DA4B6;
	display: block;
	float: left;
	font: bold 1.0em/1.6em Arial;
	margin: 5px 15px;
	width: 150px;
}

#knoffice-panel input.button {
	margin: 2px 15px;
	padding: 6px;
}

.xls {
	background: #FFF url(../images/xls.png) no-repeat right 0px;
}

.txt {
	background: #FFF url(../images/txt.png) no-repeat right 0px;
}

.xml {
	background: #FFF url(../images/xml.png) no-repeat right 0px;
}

.css {
	background: #FFF url(../images/css.png) no-repeat right 0px;
}

.img {
	background: #FFF url(../images/img.png) no-repeat right 0px;
}

/* ################################################### */
/* --------- styling of the search result table ------ */
#rename-panel table, #rename-panel th, #renameResult td, #KnowWEObjectTypeBrowser table, #KnowWEObjectTypeBrowser th, #KnowWEObjectTypeBrowser td {
	border: 1px solid #777;
}

#rename-panel table col.match, #KnowWEObjectTypeBrowser table col.match {
	width: 250px;
}

#rename-panel table col.section {
	width: 50px;
}

#rename-panel table col.replace {
	width: 50px;
}

#rename-panel table col.preview, #KnowWEObjectTypeBrowser table col.preview {
	width: 200px;
}

#rename-panel th, #rename-panel tfoot, #KnowWEObjectTypeBrowser th {
	background: #DDD;
	text-align: center;
	font-weight: bold;
}

#rename-panel tbody, #KnowWEObjectTypeBrowser tbody {
	background: #F1F6FA;
}

#rename-panel .check {
	background: #FFF no-repeat left center;
	border: 0px;
	width: 30px;
}

#rename-panel .check-select {
	background-image: url(../images/checkmark-all.png);
}

#rename-panel .check-deselect {
	background-image: url(../images/checkmark-none.png);
}

/* ################################################### */
/* ------- styling of the further settings panel ----- */
#rename-panel img {
	vertical-align: bottom;
}

/* ################################################## */
/* ------------->>> Panel HTML Dialog <<<------------ */
/* ################################################## */

/* ########################################################## */
/* --------------general styling issues---------------------- */

.dialogstyle {
	border: none;
}

.dialogstyle label {
	margin: 0px;
	white-space: normal;
}

.dialogstyle h3 {
	background-color: #f5f5f5;
	color: #000;
	cursor: pointer;
	font-size: 1.4em;
	margin: 0 0 0 0;
	padding: 5px 0 5px 10px;
}

.dialogstyle h4 {
	padding: 5px 0 5px 30px;
	/*background-color: #37435B;*/
}

.extend-htmlpanel-down {
	background: #FFF url(../images/arrow_down.png) no-repeat 10px 5px;
}

.extend-htmlpanel-right {
	background: #FFF url(../images/arrow_right.png) no-repeat 10px 5px;
}

.extend-htmlpanel-down-s {
	background: #FFF url(../images/arrow_down_s.png) no-repeat 20px 5px;
}

.extend-htmlpanel-right-s {
	background: #FFF url(../images/arrow_right_s.png) no-repeat 20px 5px;
}

/* ########################################################## */
/* --------------display as dialog widget / background------------ */

.dialogstyle .top, .dialogstyle .bottom {
	display: block;
	background: transparent;
	font-size: 1px;
}

.dialogstyle .b1, .dialogstyle .b2, .dialogstyle .b3, .dialogstyle .b4,
.dialogstyle .b1b, .dialogstyle .b2b, .dialogstyle .b3b, .dialogstyle .b4b {
	display: block;
	overflow: hidden;
}

.dialogstyle .b1, .dialogstyle .b2, .dialogstyle .b3,
.dialogstyle .b1b, .dialogstyle .b2b, .dialogstyle .b3b {
	height: 1px;
}

.dialogstyle .b1 {
	margin: 0 5px;
	background: #ccc;
}

.dialogstyle .b2 {
	background: #fff;
	border-left: 1px solid #ccc;
	border-right: 1px solid #eee;
}

.dialogstyle .b3 {
	background: #fff;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ddd;
}

.dialogstyle .b4 {
	background: #fff;
	border-left: 1px solid #ccc;
	border-right: 1px solid #aaa;
}

.dialogstyle .b4b {
	background: #fff;
	border-left: 1px solid #eee;
	border-right: 1px solid #000;
}

.dialogstyle .b3b {
	background: #fff;
	border-left: 1px solid #ddd;
	border-right: 1px solid #000;
}

.dialogstyle .b2b {
	background: #fff;
	border-left: 1px solid #aaa;
	border-right: 1px solid #000;
}

.dialogstyle .b1b {
	margin: 0 5px;
	background: #000;
}

.dialogstyle .b2, .dialogstyle .b2b {
	margin: 0 3px;
	border-width: 0 2px;
}

.dialogstyle .b3, .dialogstyle .b3b {
	margin: 0 2px;
}

.dialogstyle .b4, .dialogstyle .b4b {
	height: 2px;
	margin: 0 1px;
}

.dialogstyle .boxcontent {
	display: block;
	background: #fff;
	border-left: 1px solid #ccc;
	border-right: 1px solid #000;
}

.dialogstyle a:hover {
	color: #123456;
	text-decoration: none;
}

/* ######################################################### */
/* --------------dialog table styling ---------------------- */

.dialogstyle .trEven {
	/* Hintergrund Zeilen Gerade */
	background-color: #F7F7F7;
	color: #000;
	border-bottom: 1px solid #E8E8E8;
	width: 100%;
	height: 20px;
}

.dialogstyle .trOdd {
	/* Hintergrund Zeilen Ungerade */
	background-color: #FAFAFA;
	color: #000;
	border-bottom: 1px solid #E8E8E8;
	width: 100%;
	height: 20px;
}

.dialogstyle .first {
	border-top: 1px solid #E8E8E8;
}

.dialogstyle .labelcellEven {
	display: block;
	font-weight: bold;
	width: 250px;
	margin: 0px 0px 0px 35px;
}

.dialogstyle .labelcellOdd {
	display: block;
	font-weight: bold;
	width: 250px;
	margin: 0px 0px 0px 35px;
}

.dialogstyle .trf {
	/* Folgefragen */
	background-color: #F0F0F0;
	border-bottom: 1px solid #E8E8E8;
	width: 100%;
	height: 20px;
}

.dialogstyle .labelcellFollow {
	display: block;
	font-weight: bold;
	width: 200px;
	color: #A4A4A4;
}

.dialogstyle .fieldcellFollow {
	width: 100%;
	color: #A4A4A4;
}

.dialogstyle .fieldcell {
	width: 100%;
}

.dialogstyle .fieldcell input {
	background-color: #D7E5F2;
	border: 1px solid #96BBD9;
	width: 100px;
	margin: 0px 5px 0px 0px;
}

.dialogstyle .fieldcell input[type='button'] {
	width: 40px;
	height: 20px;
}

.dialogstyle .fieldcellFollow input {
	background-color: #D7E5F2;
	border: 1px solid #96BBD9;
	width: 100px;
	margin: 0px 5px 0px 0px;
}

.dialogstyle .fieldcellFollow input[type='button'] {
	width: 40px;
	height: 20px;
}

/* ################################################## */
/* --------------answer styling ------------------- */
.dialogstyle .answer-set {
	border: 2px solid red;
}

.dialogstyle .answerTextActive {
	color: #FFF;
	background-color: #96BBD9;
}

.dialogstyle .answerText:hover, .dialogstyle .answerTextActive:hover {
	color: #000;
	background-color: #FFCC33;
}

/* ################################################## */
/* ------------->>> Popups            <<<------------ */
/* ################################################## */
#popup-findings {
	border: 1px solid #96BBD9;
	margin: 10px;
}

#popup-findings h3 {
	background-color: #96BBD9;
	font-size: 1.8em;
	letter-spacing: 0px;
	line-height: 1.1em;
	color: #FFF;
	padding-left: 10px;
	margin: 0px;
}

#popup-findings table {
	margin: 5px;
}

#popup-xcle > * {
	font: 0.9em/1.4em "Arial", "sans-serif";
	margin: 0px;
	padding: 0px;
}

#popup-xcle .emphasized {
	color: #D60000;
}

#popup-xcle table {
	border: 1px solid #839CBD;
	border-collapse: collapse;
	margin: 10px;
	width: 90%;
}

#popup-xcle table.emphasized {
	border: 1px solid #D60000;
	width: 90%;
	margin: 10px;
}

#popup-xcle td {
	border: 1px solid #839CBD;
	padding: 5px 10px;
}

#popup-xcle th {
	text-align: left;
	background-color: #96BBD9;
	color: #FFF;
	padding-left: 5px;
}

/* ################################################## */
/* ------->>> KnowledgeBasesGenerator  <<<------- --- */
/* ################################################## */
#KnowledgeBasesGenerator label {
	width: 120px;
	margin: 0px 50px;
}

#KnowledgeBasesGenerator input {
	margin: 2px 15px;
	padding: 6px;
	width: 100px;
}

#KnowledgeBasesGenerator input.button {
	border: 1px solid #DEDEDE;
	cursor: pointer;
	margin: 2px 0px;
}

#KnowledgeBasesGenerator input.button:hover {
	background-color: #E6EFC2;
	border: 1px solid #C6D880;
	color: #529214;
}

#KnowledgeBasesGenerator input.field {
	background-color: #F1F6FA;
	border: 1px solid #96BBD9;
	margin: 2px 15px;
	width: 100px;
}

a.action.dialog {
	border-bottom: medium none;
	margin-left: 4px;
}

a.action.dialog {
	background: #F9F9F9 none repeat scroll 0%;
	border: 1px solid #DDDDDD;
	line-height: normal;
	padding: 0.25em 0.5em;
	text-decoration: none;
	white-space: nowrap;
}

/* ##################################### */
/* ------->>> Ajax Loading  <<<----------*/
/* ##################################### */

.asynchronRenderer {
	display: inline-block;
}

.asynchronRenderer .asynchronNormal {
	font-size: 2.5em;
	overflow: hidden;
	color: grey;
}

span.asynchronSmall {
	color: grey;
}

span.ajaxLoader {
	position: relative;
	min-height: 16px;
	padding-left: 20px;
	background-repeat: no-repeat;
	background-position: left;
	background-image: url(../images/ajax-loader16.gif)
}

/* ################################################## */
/* ------->>> KnowWEObjectTypeActivator  <<<----------*/
/* ################################################## */
#KnowWEObjectTypeActivator label {
	width: 120px;
	margin: 0px 50px;
}

#KnowWEObjectTypeActivator input {
	margin: 2px 15px;
	padding: 6px;
	width: 100px;
}

#KnowWEObjectTypeActivator input.button {
	border: 1px solid #DEDEDE;
	cursor: pointer;
	margin: 2px 0px;
}

#KnowWEObjectTypeActivator input.button:hover {
	background-color: #E6EFC2;
	border: 1px solid #C6D880;
	color: #529214;
}

/* ################################################## */
/* ------->>> KnowWEObjectTypeBrowser  <<<------- --- */
/* ################################################## */
#KnowWEObjectTypeBrowser label {
	width: 120px;
	margin: 0px 50px;
}

#KnowWEObjectTypeBrowser table col.section {
	width: 300px;
}

#KnowWEObjectTypeBrowser input {
	margin: 2px 15px;
	padding: 6px;
	width: 100px;
}

#KnowWEObjectTypeBrowser input.button {
	border: 1px solid #DEDEDE;
	cursor: pointer;
	margin: 2px 0px;
}

#KnowWEObjectTypeBrowser input.button:hover {
	background-color: #E6EFC2;
	border: 1px solid #C6D880;
	color: #529214;
}

/* ################################################## */
/* ------->>> CodeCompletion  <<<-------------------- */
/* ################################################## */
.codeCompletion {
	border-style: solid;
	border-width: 1px;
	padding: 3px;
	background-color: #CCCCCC;
}

.codeCompletion option {
	border-style: solid;
	padding: 3px;
	background-color: #FFFFFF;
	border-width: 1px
}

#overDiv {
	font-size: 120%;
}

/* ################################################## */
/* ------------->>> Panel Testsuite     <<<------------- */
/* ################################################## */
#testsuite-panel fieldset {
	border: 0px solid #DDD;
	padding: 5px 10px;
}

#testsuite-panel input {
	margin: 2px 15px;
	padding: 6px;
	width: 100px;
}

#testsuite-panel select {
	background-color: #F1F6FA;
	border: 1px solid #96BBD9;
	margin: 2px 15px;
	padding: 6px;
}

#testsuite-panel input.button {
	border: 1px solid #DEDEDE;
	cursor: pointer;
	margin: 14px 0px;
}

#testsuite-panel input.button:hover {
	background-color: #E6EFC2;
	border: 1px solid #C6D880;
	color: #529214;
}

#testsuite-panel label {
	color: #5DA4B6;
	display: block;
	font: bold 0.8em/1.4em Arial;
	margin: 0px 15px;
	width: 150px;
}

#testsuite-panel legend {
	font-weight: bold;
	color: #5DA4B6;
}

#testsuite-panel .fail {
	float: left;
	padding: 10px;
	background-color: #FCC;
	border: 1px solid;
}

#testsuite-panel .passed {
	float: left;
	padding: 10px;
	background-color: #CFC;
	border: 1px solid;
}

#testsuite-panel table {
	border: 1px solid #D2D2D2;
	margin-left: 22px;
}

#testsuite-panel td {
	border: 1px solid #D2D2D2;

}

#testsuite-panel td.centered {
	border: 1px solid #D2D2D2;
	text-align: center;
}

#testsuite-panel a {
	color: #000000;
	text-decoration: none;
}

#testsuite-panel a:hover {
	color: #000000;
	text-decoration: none;
}

#testsuite-panel a:active {
	color: #000000;
	text-decoration: none;
}

#testsuite-panel a:selected {
	color: #000000;
	text-decoration: none;
}

.qImageHover:hover {
	border: 1px solid #777;
}

/* ################################################## */
/* ------->>> TemplateTaghandler  <<<------- --- */
/* ################################################## */
#TemplateTagHandler label {
	width: 120px;
	margin: 0px 50px;
}

#TemplateTagHandler input {
	margin: 2px 15px;
	padding: 6px;
	width: 100px;
}

#TemplateTagHandler input.button {
	border: 1px solid #DEDEDE;
	cursor: pointer;
	margin: 2px 0px;
}

#TemplateTagHandler input.button:hover {
	background-color: #E6EFC2;
	border: 1px solid #C6D880;
	color: #529214;
}

#TemplateTagHandler input.field {
	background-color: #F1F6FA;
	border: 1px solid #96BBD9;
	margin: 2px 15px;
	width: 100px;
}

/* ################################################## */
/* -------------- logger settings     --------------- */
/* ################################################## */
#KNOWWE-logger-main {
	font: normal 10px Tahoma, Verdana, Arial;
	position: absolute;
	top: 2px;
	left: 10px;
	width: 30%;
}

#KNOWWE-logger-count, #KNOWWE-logger-clear {

}

#KNOWWE-logger-header {
	background-color: rgb(255, 255, 255);
	padding: 5px;
}

#KNOWWE-logger-display {
	overflow: auto;
	height: 100px;
}

#KNOWWE-logger-display dl, #KNOWWE-logger-display dd {
	background-color: rgb(255, 255, 255);
}

.log-info-bg {
	background-color: rgb(255, 204, 51);
}

.log-info-font {
	color: rgb(255, 204, 51);
}

.log-error-bg {
	background-color: rgb(255, 61, 61);
}

.log-error-font {
	color: rgb(255, 61, 61);
}

/* ################################################## */
/* -------------- overlay settings    --------------- */
/* ################################################## */
#o-lay {
	border: 1px solid rgb(0, 0, 0);
	background-color: rgb(255, 255, 255);
}

#o-lay-wrapper {
	border: 1px solid rgb(104, 104, 104);
	margin: 5px;
}

#o-lay-title {
	font: bold 0.8em/1.4em Arial, Verdana;
	text-align: center;
	vertical-align: middle;
	background-color: rgb(150, 187, 217);
	color: rgb(0, 0, 0);
	padding: 5px;
}

#o-lay-body {
	margin: 5px;
	font: normal 1em Verdana;
}

.questionsheet-layer {
	color: rgb(0, 0, 0);
	padding: 0.2em;
	margin: 5px 0 5px 2px;
}

#KNOWWE-ajax-loader {
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 2000;
}

/* ################################################## */
/* -------------- Annotation styling  --------------- */
/* ################################################## */

.semLink {
	color: #003366;
	cursor: pointer;
	text-decoration: none;
}

.semLink:hover {
	text-decoration: underline;
}

/* ################################################## */
/* -------------- Flowchart           --------------- */
/* ################################################## */

div.collapsible-questiontree {
	background: none repeat scroll 0 0 #F9F9F9;
	border: 1px solid #DDDDDD;
	margin: 1em 2.5%;
	padding: 0.5em;
	position: relative;
}

div.collapsible-questiontree ul .pointer {
	background: rgb(255, 255, 255) url('../images/arrow_right_s.png') no-repeat left bottom;
	padding-left: 12px;
}

#collapsible-questiontree-info {
	background-color: rgb(255, 255, 255);
	border: 1px solid #DDDDDD;
	padding: 10px;
	clear: both;
	float: right;
	width: 300px;
}

/* ################################################## */
/* ----------Image Question TagHandler--------------- */
/* ################################################## */
.qImageHover:hover {
	border: 1px solid #777;
}

.answerRegion {
	position: absolute;
}

.answerSet {
	border: 1px solid #777;
}

/* ################################################## */
/* ------------------ Highlightjs ------------------- */
/* ################################################## */

/*
Intellij Idea-like styling (c) Vasily Polovnyov <vast@whiteants.net>
*/

.hljs {
	display: block;
	overflow-x: auto;
	padding: 0.5em;
	color: #000;
	background: transparent;
	-webkit-text-size-adjust: none;
}

.hljs-subst,
.hljs-title,
.json .hljs-value {
	font-weight: normal;
	color: #000;
}

.hljs-comment,
.diff .hljs-header {
	color: #808080;
	font-style: italic;
}

.hljs-annotation,
.hljs-decorator,
.hljs-preprocessor,
.hljs-pragma,
.hljs-doctype,
.hljs-pi,
.hljs-chunk,
.hljs-shebang,
.apache .hljs-cbracket,
.hljs-prompt,
.http .hljs-title {
	color: #808000;
}

.hljs-tag,
.hljs-pi {
	background: #efefef;
}

.hljs-tag .hljs-title,
.hljs-id,
.hljs-attr_selector,
.hljs-pseudo,
.hljs-literal,
.hljs-keyword,
.hljs-hexcolor,
.css .hljs-function,
.ini .hljs-title,
.css .hljs-class,
.hljs-list .hljs-keyword,
.nginx .hljs-title,
.tex .hljs-command,
.hljs-request,
.hljs-status {
	font-weight: bold;
	color: #000080;
}

.hljs-attribute,
.hljs-rule .hljs-keyword,
.hljs-number,
.hljs-date,
.hljs-regexp,
.tex .hljs-special {
	font-weight: bold;
	color: #0000ff;
}

.hljs-number,
.hljs-regexp {
	font-weight: normal;
}

.hljs-string,
.hljs-value,
.hljs-filter .hljs-argument,
.css .hljs-function .hljs-params,
.apache .hljs-tag {
	color: #008000;
	font-weight: bold;
}

.hljs-symbol,
.ruby .hljs-symbol .hljs-string,
.hljs-char,
.tex .hljs-formula {
	color: #000;
	background: #d0eded;
	font-style: italic;
}

.hljs-doctag {
	text-decoration: underline;
}

.hljs-variable,
.hljs-envvar,
.apache .hljs-sqbracket,
.nginx .hljs-built_in,
.hljs-name {
	color: #660e7a;
}

.hljs-addition {
	background: #baeeba;
}

.hljs-deletion {
	background: #ffc8bd;
}

.diff .hljs-change {
	background: #bccff9;
}

.modal {
	background-color: var(--bg-color-primary-shade);
	color: var(--text-color-primary);
}