/*===========================================
	INFO

	AUTHOR
	---------------------------------
	BPS Bildungsportal Sachsen GmbH
	Dresdner Str. 76, D-09130 Chemnitz

	COLORS
	---------------------------------
	blue-MAIN			#0D4EA8;
	blue-dark			#012A5B;
	blue-light			#5A9AE5;
	blue-lighter		#DCE7EF;

	orange-MAIN			#F2A55F;
	orange-dark			#BA5D08;
	orange-red          #BF4019;
	orange-light		#F4D3BA;
	orange-lighter		#F9EBE1;

	grey-MAIN			#444444;


=============================================*/

@import url(variables.css);

/************************************
		FONTS
************************************/

/* ICONS */
@font-face {
	font-family: 'icomoon';
	src:url('fonts/icomoon.eot');
	src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'),
		url('fonts/icomoon.woff') format('woff'),
		url('fonts/icomoon.ttf') format('truetype'),
		url('fonts/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

/************************************
	 RESET
************************************/
html,body {
	/*height: 100%;*/
	font-family: Arial, sans-serif;
	font-size: 95%;
	line-height: 130%;
	color: #444;
}

/* jQUERY RESET */
.ui-widget {
	font-family: Arial, sans-serif;
	font-size: 1em;
}
.ui-widget.ui-widget-content {color: #444;}
.ui-widget-header {background: none transparent; border-width: 0 0 1px 0; border-radius: 0;}
.ui-widget-header .ui-dialog-title {font-weight: bold;}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {font-family: Arial, sans-serif;}
.ui-button:focus {outline: none;}
.ui-autocomplete, .ui-autocomplete-input {margin: 0; background: #fff; border: 1px solid #ccc; font-size: .9em; color: #000;}
input.ui-autocomplete-input {min-height: 1.5em;}

.ui-spinner-button {z-index: 1;}
.ui-spinner-input {margin: 0; padding: 2px 5px; background: #fff; border: 1px solid #ccc;}
.ui-datepicker {background: #fff; border: 1px solid #aaa; box-shadow: 1px 1px 5px 0 #aaa;}

.ui-tabs .ui-tabs-panel {padding: 1em 0;}
.tabbedpane.ui-tabs {border: 0;}

.context-menu {
	width: 450px;
	max-width: max-content;
}
.context-menu .ui-widget-content {
    padding: 3px;
    border-radius: 3px;
    border-color: #ccc;
/*    box-shadow: 2px 2px 7px #ddd; */
}
.context-menu .ui-menu .ui-menu-item-wrapper {padding: 7px 1.5em 6px .5em;}
.context-menu .ui-state-active {background: none #e8eff7; border-color: transparent; box-shadow: 0 0 2px #0a6aa1;}

/************************************
		FONTICONS
************************************/
.fonticon {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* icomoon - don´t change, these lines will be updated */
.icon-user-lock:before {
	content: "\eafd";
}
.icon-gears:before {
	content: "\eb60";
}
.icon-globe:before {
	content: "\ec96";
}
.icon-radio-checked:before {
	content: "\ee71";
}
.icon-radio-unchecked:before {
	content: "\ee73";
}
.icon-user-globe:before {
	content: "\e91e";
}
.icon-search:before {
	content: "\eb36";
}
.icon-cube:before {
	content: "\ec1b";
}
.icon-upload-file:before {
	content: "\ec8c";
}
.icon-link2:before {
	content: "\ec9d";
}
.icon-unlink2:before {
	content: "\ec9e";
}
.icon-warning:before {
	content: "\ed50";
}
.icon-move:before {
	content: "\ed76";
}
.icon-new-tab:before {
	content: "\eec9";
}
.icon-chemistry:before {
	content: "\e91d";
}
.icon-drawing:before {
	content: "\e91c";
}
.icon-graphmatch:before {
	content: "\e91b";
}
.icon-toggle:before {
	content: "\e92d";
}
.icon-dnd:before {
	content: "\ec5c";
}
.icon-download:before {
	content: "\edf0";
}
.icon-transmission:before {
	content: "\ee46";
}
.icon-item-add:before {
	content: "\e91a";
}
.icon-programming:before {
	content: "\e919";
}
.icon-pdf:before {
	content: "\e903";
}
.icon-section:before {
	content: "\e904";
}
.icon-section-add:before {
	content: "\e905";
}
.icon-upload:before {
	content: "\e906";
}
.icon-hottext:before {
	content: "\e907";
}
.icon-hotspot:before {
	content: "\e908";
}
.icon-extended-text:before {
	content: "\e909";
}
.icon-matrix:before {
	content: "\e90a";
}
.icon-match:before {
	content: "\e90b";
}
.icon-order:before {
	content: "\e90c";
}
.icon-mc:before {
	content: "\e90d";
}
.icon-sc:before {
	content: "\e90e";
}
.icon-inline-choice:before {
	content: "\e910";
}
.icon-test:before {
	content: "\e911";
}
.icon-survey:before {
	content: "\e912";
}
.icon-textentry:before {
	content: "\e913";
}
.icon-numeric:before {
	content: "\e914";
}
.icon-calc:before {
	content: "\e915";
}
.icon-formula:before {
	content: "\e916";
}
.icon-regex:before {
	content: "\e917";
}
.icon-item:before {
	content: "\e918";
}
.icon-sort:before {
	content: "\e900";
}
.icon-sort-asc:before {
	content: "\e901";
}
.icon-sort-desc:before {
	content: "\e902";
}
.icon-edit:before {
	content: "\e90f";
}
.icon-file-plus:before {
	content: "\e9a2";
}
.icon-file-minus:before {
	content: "\e9a4";
}
.icon-file-audio:before {
	content: "\e9b1";
}
.icon-file-stats:before {
	content: "\e9bf";
}
.icon-copy:before {
	content: "\e9c7";
}
.icon-folder-plus:before {
	content: "\e9d4";
}
.icon-folder-minus:before {
	content: "\e9d6";
}
.icon-folder-remove:before {
	content: "\e9da";
}
.icon-folder:before {
	content: "\e9e7";
}
.icon-folder-open:before {
	content: "\e9e8";
}
.icon-clock:before {
	content: "\ea4f";
}
.icon-user:before {
	content: "\eb08";
}
.icon-group:before {
	content: "\eb0c";
}
.icon-lock:before {
	content: "\eb51";
}
.icon-gear:before {
	content: "\eb5f";
}
.icon-delete:before {
	content: "\ebfd";
}
.icon-code:before {
	content: "\ec69";
}
.icon-menu:before {
	content: "\ec6d";
}
.icon-publish:before {
	content: "\ec77";
}
.icon-link:before {
	content: "\ec99";
}
.icon-eye:before {
	content: "\ecae";
}
.icon-star-empty:before {
	content: "\ece3";
}
.icon-star-half:before {
	content: "\ece4";
}
.icon-star-full:before {
	content: "\ece5";
}
.icon-broken:before {
	content: "\eceb";
}
.icon-stack-check:before {
	content: "\ed43";
}
.icon-question:before {
	content: "\ed55";
}
.icon-plus-circle:before {
	content: "\ed5f";
}
.icon-minus-circle:before {
	content: "\ed60";
}
.icon-info:before {
	content: "\ed63";
}
.icon-cancel-circle:before {
	content: "\ed66";
}
.icon-exit:before {
	content: "\ed77";
}
.icon-audio:before {
	content: "\ed90";
}
.icon-refresh:before {
	content: "\edaa";
}
.icon-arrow-right:before {
	content: "\edc8";
}
.icon-arrow-down:before {
	content: "\edc9";
}
.icon-arrow-left:before {
	content: "\edca";
}
.icon-circle-up:before {
	content: "\ede7";
}
.icon-circle-down:before {
	content: "\ede9";
}
.icon-circle-right:before {
	content: "\edee";
}
.icon-checkmark-circle:before {
	content: "\ee76";
}
.icon-sigma:before {
	content: "\eea2";
}
.icon-export:before {
	content: "\eec8";
}
.icon-file-excel:before {
	content: "\ef41";
}

/* custom colors */
.icon-highlight:before,
.icon-warning:before {color: var(--accent-theme-color-50);}
.icon-light:before {color: var(--main-theme-gray-50);}
.icon-success:before {color: var(--success-color-50);}
.icon-danger:before {color: var(--error-color-70);}

/* custom behavior */
.btn .icon-link2:hover:before {
    content: "\ec9e";
}
.btn .icon-unlink2:hover:before {
    content: "\ec9d";
}

/************************************
		GENERAL
************************************/

/***************** MEDIA *****************/
img {border: none;}

/***************** TEXT *****************/
h1, h2, h3, h4 {font-weight: bold;}
h1 {margin: 5px 0 15px 0; font-size: 1.6em;}
h2 {margin: 5px 0 15px 0; font-size: 1.25em;}
h3 {margin: 5px 0 10px 0; font-size: 1.1em;}
h4 {margin: 5px 0; font-size: 1em;}

a, .ui-widget-content a {color: #0D4EA8; text-decoration: none;}
a:hover, a:focus, a:active {color: #012A5B; text-decoration: underline;}
a:hover span {text-decoration: underline;} /*fix for span elements with display: inline-block*/
a:hover .fonticon {text-decoration: none;} /*fix weird line under icons*/
a.important {font-weight: bold;}
a.disabled-link {color: #444; font-style: italic; text-decoration: none;}

p {margin: 5px 0;}
code {display: block; margin: .5em 0; padding: .5em 0 .5em 1.5em; background: #e5e5e5;}

#container {height: 100%;}

:focus {
	outline: 1px solid #B8D2E8;
}

.text-warning {color: #BF4019 !important;}
.text-code {font-family: "Courier New", monospace;}

/************************************
		BADGES
************************************/
.badge-secondary {background-color: #444;}

/************************************
		LISTS
************************************/
ul {padding-left: 2em;}

.list-unstyled {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* DEFINITION LIST */
dt {font-weight: bold;}
dt, dd {line-height: 1.42857143;}
.dl-horizontal dt {
    float: left;
    width: 140px;
    clear: left;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dl-horizontal dd {margin-left: 140px;}

/************************************
		TABLES
************************************/
table {
	width: 100%;
	margin: 20px 0;
	border-collapse: collapse;
	border-spacing: 0;
}
caption {position: fixed; left: -10000px; top: -5000px;}
tr {height: 35px;}
th, td {text-align: left; padding: 0 .5em;}

thead {height: 35px; border-bottom: 1px solid #AAAAAA;}
tfoot {border-top: 15px solid transparent; font-weight: bold;}

table.small tr {height: auto;}
.table-choose {text-align: center;}
.table-choose input {vertical-align: top;}
.table-title {width: 20em;}
.table-icon {
    position: relative;
    width: 40px;
    text-align: center;
}
.table-icon div {position: relative;}
.form-container .table-icon span {display: inline;}

td.table-icon {
    font-size: 1.5em;
	text-align: left;
}

.table-tr:hover {
    background-color: #EEEEEE;
}
.tr-highlight {background: #DCE7EF;}
.tr-highlight:hover {background: #afc8da;}

tr.ui-sortable-handle,
tr.ui-sortable-handle .dnd-action {cursor: move;}
tr.ui-sortable-placeholder {background-color: #f5f5f5; border: 2px dashed #ddd; visibility: visible !important;}
tr.ui-sortable-helper {padding: .4em; border: 2px dashed #0D4EA8;}

/* NEW TABLE PANEL */
.table-panel thead {border: none;}
.table-panel thead .table-header {padding: .5em; background-color: #eee;}

.table-header td {
    padding: 5px;
    line-height: 1.428571429;
    vertical-align: top;
}

.table-panel th {
	padding: 0 .5rem;
    text-align: left;
    border-bottom: 2px solid #ddd;
}

.table-header-right .dropdown-menu {min-width: 200px;}
.table-header-right .dropdown-menu .form-group[role="menuitemcheckbox"] {margin-bottom: .5rem;}

.headers th[data-header="actions"] {width: 100px;}

.table-panel tbody>tr:hover {background-color: #eee;}
.table-panel tbody>tr:nth-child(odd) {background-color: #f5f5f5;}
.table-panel tbody td {
	padding: 0 .5rem;
    border-top: 1px solid #ddd;
    vertical-align: middle;
}

.table-sort {white-space: nowrap; cursor: move;}

.table-sort button {
	border: none;
	background-color: transparent;
}
.table-sort .fonticon:before {content: "\e900";}
.table-sort.asc .fonticon:before {content: "\e901";}
.table-sort.desc .fonticon:before {content: "\e902";}

.table-footer {
    min-height: 35px;
    line-height: 30px;
    border-top: 4px solid #eee;
    border-bottom: 1px solid #e5e5e5;
}

.table-footer > div {
    display: flex;
    justify-content: space-between;
}

.table-footer small {
    float: left;
    display: inline-block;
    padding-right: .5em;
}

.table-footer .form-control {
    display: inline;
    width: auto;
    height: 30px !important;
    line-height: 30px;
}


/* PAGER */
.pager {text-align: center;}
.pagination {
	display: inline-block;
	padding-left: 0;
	margin: 0;
	vertical-align: middle;
}
.pagination>li {display: inline;}
.pagination>li>a, .pagination>li>span {
	position: relative;
	float: left;
	padding: 0 .5em;
	text-decoration: none;
	border-radius: 3px;
	line-height: 21px;
}
.pagination>li>a[disabled] {color: var(--main-theme-gray-50);}

.pager-showall {font-size: .8em}

/************************************
		FORMS
************************************/
.form-element, .form-container {margin: 10px 0;}
.form-element label, .form-element input, .form-element span, .form-container label, .form-container input, .form-container span {vertical-align: middle;}

.feedback-condition label, .feedback-condition input, .feedback-condition span, .feedback-condition label, .feedback-condition .input, .feedback-condition span {
	vertical-align: top;
}
.form-container label.multilinelabel-top{vertical-align: top;}
.form-part {margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px dashed #aaa;}
.form-header {font-weight: bold;}
fieldset {margin-bottom: 20px; padding: 0; border: none;}
legend, .legend {position:relative; margin-bottom: 1.5em; margin-top: 0; padding: 5px 0 5px 15px; background: #DCE7EF; border-radius: 5px 5px 0 0; font-size: 1em;}
.legend-neutral {margin: 0; padding: 1em 0 .5em 0; background-color: transparent; font-weight: bold;}
label {margin-bottom: 0;} /* bootstrap reset, remove later */
label, .label, .form-element span, .form-container span {display: inline-block;}
label:empty {display: inline;}
.form-container {font-size: 13px;}
.form-container label, .form-container .label {float: left; width: 12%; margin-right: 20px; padding-top: .5em; text-align: right;}
.label-item-type {padding-top: .5em;}
.form-container a {padding-top: .3em; display: inline-block;} /* remove this hack when using bootstrap */
.form-inner {display: inline-block; width: 75%; vertical-align: top;}
.form-inner>div {margin-bottom: 3px;}
.form-inner .table-panel {margin-top: -6px;}
.form-inner label {float: none; width: auto; margin-right: 0; text-align: left;}
dl.form-inner {margin-top: .3em;}
.form-selection {font-size: 0.9em; margin-bottom: 20px;}
.form-info {margin: .2em 0 1em 0; color: #575757; font-size: 0.9em; line-height: 1.3em;}
.form-warning {margin: 0.5em 0; font-size: .9em; line-height: 1.3em;}
.separator {margin-bottom: 20px;}
.form-container .mandatory {position: absolute; margin-top: 0;}
.mandatory:after {content: "*"; color: #BA5D08;}

.form-container:after {display: block; content: ' '; clear: both;}
.form-shift {margin-left: calc(17% + 20px);}
.legend {display: block; font-size: 1em; font-weight: bold;}

.form-scrollbar-invisible {
	scrollbar-width: none;
}

.form-scrollbar-invisible option {
	text-wrap: wrap;
}

.ui-dialog .form-container label {width: 17%;}
.ui-dialog .form-inner label {width: auto;}

/* IE7 */
*+html label,
*+html .label,
*+html .form-inner {float: left;}
*+html .form-inner label,
*+html label + .form-inner {float: none;}
*+html .form-container {min-height: 45px;}
*+html .form-container:after {clear: both;}

input, select, textarea, .chosen-container-single .chosen-single, .button {
	height: 30px;
	font-family: Arial, sans-serif;
	border: 1px solid #ccc;
	border-radius: 2px;
}
.form-check-input {height: auto; margin-top: .2rem;} /*only temp. delete the height on inputs when use bootstrap later */
select {min-width: 100px; background-color: var(--neutral-white)}

select[multiple] {
	height: auto;
}
.ui-widget select[multiple] {font-size: 0.9em;}
input {margin-left: 0; padding: 2px;}
input[type=text], input[type=password] {width: 250px;}
.ui-spinner input[type=text] {width: auto;}

input[type=file] {height: auto; margin: 0;}
input[type=radio], input[type=checkbox] {margin-right: .3em; border: none;}
.time-field>div {display: inline-block;}
.time-field .form-inner {width: auto;}
textarea {min-width: 70%; min-height: 150px; vertical-align: top;}

.form-inner input[type=radio], .form-inner input[type=checkbox] {height: inherit;}

.form-buttons {display: inline-flex; align-items: center;}
.form-buttons-move .btn {display: block;}

/********************** BOOTSTRAP FORM **********************/
.form-control-plaintext {font-size: 1em;}

/********************** CHOSEN FORM **********************/
.chosen-container-single .chosen-single {
	background: none;
	box-shadow: none;
	line-height: 30px;
	color: var(--neutral-black);
}

.chosen-container-single .chosen-single div b,
.chosen-container-active.chosen-with-drop .chosen-single div b {
	background-position-y: 4px;
}

.chosen-container a, .chosen-container .chosen-results li.active-result {
	cursor: default
}

.chosen-container .chosen-drop {
	border: 1px solid var(--main-theme-gray-80);
}

.chosen-container-single .chosen-drop {
	border-radius: 0;
}

.chosen-container .chosen-results {
	margin: 0;
	padding: 0;
}

.chosen-container .chosen-results li.highlighted {
	background-image: none;
}

.chosen-container-active.chosen-with-drop .chosen-single {
	background-image: none;
	outline: 1px solid #B8D2E8;
	border: 1px solid #ccc;
}

.chosen-container-single .chosen-single span {
	text-decoration: none;
}

/********************** VALIDATION **********************/
/*.form-control.is-invalid {padding-right: inherit;}*/
select.form-control.is-invalid {background-position: right calc(1em) center;}

/********************** BUTTONS **********************/
/* new bootstrap stuff */
.btn-xs {
	padding: .3rem .4rem;
	line-height: 1.2;
	font-size: .9em !important;
}

.btn-light {background-color: #fff; border: 1px solid var(--main-theme-gray-40);}
.btn-light.disabled, .btn-light:disabled {color: #999; border-color: #ddd;}
/*.btn-light:hover, .btn-light:active {background-color: #eee; border-color: #c8c8c8;}*/ /* not good because of hover of disabled buttons */
.btn-light.focus, .btn-light:focus {box-shadow: none;}
.btn-light:focus-visible {outline: 2px solid var(--main-theme-gray-40); outline-offset: .2rem}

.btn-secondary, .btn-secondary.focus, .btn-secondary:focus {background-color: #444; border-color: #444;}
.btn-secondary.focus, .btn-secondary:focus {box-shadow: none;}
.btn-secondary:focus-visible {outline: 2px solid #444; outline-offset: .15rem}

.btn-secondary:hover {background-color: var(--main-theme-gray-60); border-color: var(--main-theme-gray-60);}

/* btn-primary not used!*/
.btn-primary {background-color: #F2A55F; border-color: #F2A55F; color: #000;}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {background-color: #444; border-color: #444;}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show>.btn-primary.dropdown-toggle {background-color: #F2A55F; border-color: #F2A55F;}

.btn-success {background-color: var(--success-color-50); border-color: var(--success-color-50);}
.btn-success:hover, .btn-success:focus, .btn-success:active {background-color: var(--success-color-70); border-color: var(--success-color-70);}

.btn.disabled, .btn:disabled {cursor: not-allowed;}
.btn[aria-disabled="true"] {
	background-color: #ddd;
	border-color: #aaa;
	color: #555;
	cursor: not-allowed;
}

.only {padding: 0; background: transparent;}
.only:hover, .only:focus, .only:active {color: var(--accent-theme-color-40);}
.btn.only.disabled, .btn.only:disabled {opacity: .35;}
a.only,
a.btn-light {color: #222;}

.table-action .only {font-size: 1.3em; line-height: 1;}

.dropdown-item.active, .dropdown-item:active {background-color: #444;}

/* old stuff*/
.button, .btn-icon {
	display: inline-block;
	padding: 0 10px;
	background: none no-repeat 2px 2px #eee;
	border: 1px solid #ccc;
	border-radius: 3px;
	cursor: pointer;
	color: #323232;
	line-height: 25px;
}
.button {height: 22px; line-height: 22px; cursor: default;}
.btn-icon {height: 30px; padding: 5px 10px; background-color: #fff; line-height: initial; vertical-align: middle;}
.btn-icon:hover, .btn-icon:focus {background-color: #eee; border-color: #c8c8c8; text-decoration: none;}
.btn-icon span {vertical-align: middle;}

div.mce-foot .mce-primary  {background: none #0D4EA8; border-color: #0D4EA8; color: #fff; font-size: 1em;}
div.mce-foot .mce-primary button:hover, div.mce-foot .mce-primary button:focus {background: none #012A5B; border-color: #012A5B;}
button.small {padding: 0 5px; line-height: 20px; font-size: 0.9em;}
button.form-button, .form-link {margin-left: 22.5%;}
.form-link {display: block;}
.form-container button.form-button-all {width: 2em; margin: 0; vertical-align: top;}
.form-container button.form-button-all .ui-button-text {padding: .15em 0;}

.button-center {display: block; margin: .5em auto;}

/***************** CUSTOM SELECT *****************/
.filter-item-types {margin-top: 0.5em !important;}
.filter-item-types>label {display: block; margin-bottom: .5em;}
.SumoSelect {
	max-width: 320px;
	width: 100%;
}
.SumoSelect .select-all.partial>span i, .SumoSelect .select-all.selected>span i, .SumoSelect>.optWrapper.multiple>.options li.opt.selected span i {background-color: #0D4EA8;}
.SumoSelect>.CaptionCont>span.placeholder {font-style: normal; color: #444;}
.SumoSelect>.optWrapper.multiple>.options li ul li.opt {padding-left: 35px;}

/***************** Waiting JS *****************/
.waitjs {
	display:    none;
	position:   fixed;
	z-index:    1000001;
	top:        0;
	left:       0;
	height:     100%;
	width:      100%;
    animation:  show 0.4s;
	background: rgba( 255, 255, 255, .8 ) url(../img/loading.gif) 50% 50% no-repeat;
}

@keyframes show {
    0% {opacity: 0;}
    75% {opacity: 0;}
    100% {opacity: 1;}
}

body.loading {
    overflow: hidden;
}

body.loading .waitjs {
    display: block;
}

/***************** TINY EDITOR *****************/
.tinymce-container {
	display: inline-block;
    width: 85%;
}

.form-part .tinymce-container {
	width: auto;
}

.interaction .tinymce-container,
.textEntry .tinymce-container {
    width: 100%;
}

table.mceLayout {
	width: 100% !important;
	border-radius: 3px;
}

.tox .tox-statusbar .tox-statusbar__branding a {
	color: #ccc;
	text-transform: initial;
}

.formula-tabview:focus {
	box-shadow: none;
	outline: none
}


.tiny-formula {
	width: 100%;
	display: block;
}

.tiny-formula .math-field {
	box-sizing: border-box;
	width: 100%;
	border-radius: 5px;
	padding: 4px;
	border: var(--ui-border, 1px solid rgba(0, 0, 0, .2));
	margin-bottom: 0.5em;
}

.tiny-formula textarea {
	box-sizing: border-box;
	width: 100%;
	border-radius: 5px;
	padding: 4px;
	border: var(--ui-border, 1px solid rgba(0, 0, 0, .2));
	margin-bottom: 0.5em;
}

/*
.tox-icon svg {
	transform: scale(0.8);
}
 */

.tox-checkbox .tox-checkbox__label {
	font-size: .85em;
}

.tox .tox-menubar + .tox-toolbar-overlord {
	border-top: 1px solid #ccc !important;
}

/* x3DOM dialog */
.X3DomInput {max-width: 90%;}
.X3DomPreview {margin-top: .5rem; padding: .5em;}

/***************** POWERTIP *****************/
#powerTip {
	position: absolute;
	display: none;
	min-width: 500px;
	padding: 10px;
	cursor: default;
	background-color: #fff;
	background-color: rgba(255, 255, 255, 0.9);
	color: #444;
	box-shadow: 1px 1px 5px 0 #aaa;
	border-radius: 6px;
	white-space: nowrap;
	z-index: 1001;
}
#powerTip:before {
	content: "";
	position: absolute;
}
#powerTip.n:before, #powerTip.s:before {
	border-right: 5px solid transparent;
	border-left: 5px solid transparent;
	left: 50%;
	margin-left: -5px;
}
#powerTip.e:before, #powerTip.w:before {
	border-bottom: 5px solid transparent;
	border-top: 5px solid transparent;
	margin-top: -5px;
	top: 50%;
}
#powerTip.n:before {
	border-top: 10px solid #ddd;
	bottom: -10px;
}
#powerTip.e:before {
	border-right: 10px solid #fff;
	left: -10px;
}
#powerTip.s:before {
	border-bottom: 10px solid #ddd;
	top: -10px;
}
#powerTip.w:before {
	border-left: 10px solid #ddd;
	right: -10px;
}
#powerTip.ne:before, #powerTip.se:before {
	border-right: 10px solid transparent;
	border-left: 0;
	left: 10px;
}
#powerTip.nw:before, #powerTip.sw:before {
	border-left: 10px solid transparent;
	border-right: 0;
	right: 10px;
}
#powerTip.ne:before, #powerTip.nw:before {
	border-top: 10px solid #ddd;
	bottom: -10px;
}
#powerTip.se:before, #powerTip.sw:before {
	border-bottom: 10px solid #ddd;
	top: -10px;
}
#powerTip.nw-alt:before, #powerTip.ne-alt:before,
#powerTip.sw-alt:before, #powerTip.se-alt:before {
	border-top: 10px solid #ddd;
	bottom: -10px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	left: 10px;
}
#powerTip.ne-alt:before {
	left: auto;
	right: 10px;
}
#powerTip.sw-alt:before, #powerTip.se-alt:before {
	border-top: none;
	border-bottom: 10px solid #ddd;
	bottom: auto;
	top: -10px;
}
#powerTip.se-alt:before {
	left: auto;
	right: 10px;
}

#powerTip .meta-category {background-color: rgba(220, 231, 239, 0.9); font-weight: bold;}
#powerTip tr td:first-child {padding-right: 1em;}
#powerTip a {float: right;}
#powerTip ins {display: none;}

/* LICENCE TOOLTIP */
.licence-tooltip {max-width: 500px; white-space: normal !important; background-color: #fff !important;}

/**************
	MISC
**************/
.clearfloat {
	clear: both;
	height: 0;
	overflow: hidden;
}

.hidden {
	left: -10000px;
	position: fixed;
	top: -5000px;
}
.notyetimpl {display: none !important;}
.disabled {color: #999;}


/**************
	LABELS
**************/
.beta {background: url(../img/beta-label.png) no-repeat right 0;}
.tabbedpane .beta,
.content-preview .beta,
.tabbedpane li .new {
	display: inline-block;
	position: absolute;
	top: -5px;
	right: -18px;
	width: 40px;
	height: 20px;
	z-index: 100;
}
h2 .beta {display: inline-block; padding-right: 2.2em; line-height: 1.5em;}
legend .beta {right: initial !important; top: 3px !important; margin-left: 7px;}
.new {
	display: inline-block;
	position: absolute;
	top: 1.4em;
	right: 1.8em;
	padding: .3em;
	background-color: #BA5D08;
	border-radius: 3px;
	color: #fff;
	font-size: 1.2em;
	text-transform: uppercase;
}
.tabbedpane li .new {
	width: auto;
	height: auto;
	top: -1.3em;
	right: -1em;
	padding: 0.3em 0.3em 0;
	font-size: .8em;
}
h2 .new {
	position: relative;
	top: -.8em;
	right: 0;
	padding: .15em;
	font-size: .8em;
	font-weight: normal;
}

.form-info .new {
	position: relative;
	top: 0;
	right: 0;
	padding: .1em .3em;
	font-size: 1em;
}
.form-inner label .new {
	position: relative;
	top: 0;
	right: 0;
	font-size: 1em;
	padding: 0.1em 0.3em 0;
}

.pro-version {position: absolute; top: 5px; right: 5px;}
h2 .pro-version {position: relative; top: -9px; font-size: .7em;}

/****************************
	ALERTS
****************************/
.alert {padding: .5em .7em; font-size: .95em; border: none;}
.alert li:not(:last-child) {margin-bottom: .5rem;}
.alert-main {margin: 0 10px 15px 10px;}

.alert-link {text-decoration: underline; font-weight: normal;}
.alert-info {background-color: var(--2nd-theme-color-10); color: var(--main-theme-color-60);}
.alert-info .alert-link {color: var(--main-theme-color-80);}
.alert-light {background-color: var(--neutral-white); border: 2px solid var(--main-theme-gray-40); color: var(--main-theme-gray-60);}
.alert-warning {background-color: var(--accent-theme-color-10); color: var(--accent-theme-color-60);}
.alert-warning .alert-link {color: var(--accent-theme-color-80);}
.alert-success {background-color: var(--success-color-5); color: var(--success-color-70);}
.alert-success .alert-link {color: var(--success-color-70);}
.alert-danger,
.feedbackPanel .error {background-color: var(--error-color-70); color: var(--neutral-white);}
.alert-danger .alert-link, .alert-danger .btn {color: var(--neutral-white);}
input.error, select.error, .is-invalid, input.alert-danger, select.alert-danger {border: 1px solid var(--error-color-70); background-color: var(--error-color-10); color: var(--error-color-70);}
.feedbackPanel .error {display: inline-block; padding: .5em .7em .3em .7em; font-size: .9em; border-radius: .25rem;}

ul.feedbackPanel {margin: 0; padding: 0;}

/**************
	BOXES
**************/
.box {position: relative; margin: 1.5em 0; padding: 10px; background: #F5F6F7; border: 2px solid #0D4EA8; border-radius: 3px;}
.box .box {border: 1px solid #aaa;}
.box textarea {width: 100%;}

.box-close {position: absolute; right: 1em; top: 1em;}

/**************
	TOOLTIPS
**************/
.tooltip-content {
	display: none;
	width: 250px;
	padding: 5px;
	background: #fff;
	border: 1px solid #222;
	border-radius: 3px;
	box-shadow: 1px 1px 3px #aaa;
	color: #444;
	text-align: left;
	white-space: normal;
	z-index: 101;
	}
.show-tooltip:hover .tooltip-content, .show-tooltip:focus .tooltip-content {position: absolute; top: 25px; right: 3px; display: inline-block; }

h2 .pro-version .tooltip-content {
	left: 3px;
}

.tooltipMaxima {
	width: 250px;
	padding: 5px;
	background: #F9EBE1;
	border: 1px solid #F2A55F;
	border-radius: 3px;
	box-shadow: 1px 1px 3px 0 #aaa;
	font-weight: normal;
	font-size: .8em;
	line-height: 1.3em;
	color: #222;
	z-index: 100;
}

/* HELP */
.help-tooltip {
	display: inline-block;
	position: relative;
}
.box .help-tooltip, legend .help-tooltip {position: absolute; right: 1em;}
.box .help-tooltip {top: 15px; right: 35px;}
legend .help-tooltip {top: .3em;}

/*FORMULA / MAXIMA*/
.tooltipMaxima {position: absolute; top: 2em; left: 23%; width: auto; padding: 10px;}
.tooltipMaxima>a {
	position: absolute;
	right: 3px;
	display: block;
	height: 1em;
	width: 1em;
	margin-top: 2px;
	background: url(../img/icons/close_tooltip.png) no-repeat 0 0 transparent;
	}
.tooltipMaxima>a {
	right: 0;
	top: 0;
	display: inline-block;
}

/**************
	DIALOG
**************/
.ui-dialog {padding-bottom: 16px; background-color: #fff; border: 1px solid #aaa;}
.ui-dialog-titlebar {background-color: #444; color: #fff; border: none;}
.dialog-button-area {text-align: center; float: none !important;}

.content-preview {position: relative; margin-top: 15px; padding: 10px; background-color: #eee; overflow: hidden;}
.content-preview > strong {padding-top: 10px;}
.content-preview .meta-category {font-weight: bold; font-size: 0.9em; background-color: #ddd; border-bottom: 5px solid #eee; line-height: 1.5em;}
.content-preview td {vertical-align: top;}
.content-preview tr td:first-child {width: 30%;}

.createContents {margin: 10px 0 15px 0;}
.createContents .form-info {width: 500px; margin-left: 0;}

/********* IMAGE UPLOAD *********/
#container.imagedialog {width: 100%; overflow-y: scroll;}
.previewcontainer.custom-aspect img {max-width: 100%;}
.previewcontainer.keep-aspect img {max-width: 100%; height: auto;}
.imageURL {width: 100%; height: auto; min-height: auto;}
.imagecontainer {display: inline-block; margin: 0 15px 20px 0;}
.imagecontainer a {display: block;}
.thumbselimage {padding: 2px;}
.thumbselimage:hover, .thumbselimage:focus, .thumbselimage:active {outline: 2px solid #F4D3BA;}
.thumbselimage.selected, .thumbselimage.selected:hover, .thumbselimage.selected:focus {outline: 2px solid #F2A55F;}

/********* IMPORT **********/
.importdialog {margin-top: 25px;}
.ui-dialog .repo-quickaccess {min-height: 200px; border-right: none;}
.ui-dialog .repo-quickaccess .tree-repo {width: inherit; min-height: 150px;}
.importdialog fieldset {margin-bottom: 0;}

/********* NEW ITEM **********/
.ui-dialog .content-left .form-container label {width: 25%; vertical-align: top;}
.content-left input[type=text] {width: auto;}
.item-preview img {max-width: 100%; margin: 10px 0; padding: 2px; border: 1px solid #aaa; border-radius: 5px;}

/********* COPY / MOVE **********/
.move-progress {margin-top: 2em;}

/********* TINY DIALOG **********/
div.mce-container.mce-floatpanel,
.mce-container-body.mce-abs-layout {border-radius: 5px;}
.tiny-dialog h1 {
	margin: 0;
	padding: .6em 0 .4em .6em;
	border-bottom: 1px solid #EEE;
	font-size: 1.3em;
	}
.tiny-dialog-head button {
	position: absolute;
	right: .2em;
	top: .3em;
	background-color: transparent;
	border: none;
	font-size: 1.6em;
	font-weight: bold;
	color: #ccc;
	text-shadow: 0 1px 0 white;
	}
.tiny-dialog-head button:hover, .tiny-dialog-head button:focus, .tiny-dialog-head button:active {color: #aaa;}
.tiny-dialog-content {padding: 1rem;}
.tiny-dialog-foot {padding: 1rem; border-top: 1px solid #ddd; box-shadow: inset 0 1px 0 #fff;}

.math-buffer, .math-preview {min-height: 100px; margin-bottom: 1.5em; background-color: #DCE7EF; border-radius: 3px;}
.mce-btn {border-radius:3px;}

/**************
	ICONS
**************/
.icon {
	display: inline-block;
	height: 15px;
	width: 15px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-color: transparent;
    border: none;
	border-radius: 0;
	}
.icon:hover, .icon:focus, .icon:active {background-position: 0 -15px; background-color: transparent;}

.big {
	height: 20px;
	width: 20px;
	}
.big:hover, .big:focus, .big:active {background-position: 0 -20px;}

.icon-button {display: inline-block; height: 15px; width: 15px; margin-right: 4px; vertical-align: middle;}
button:hover .icon-button, button:focus .icon-button, button:active .icon-button {background-position: 0 -15px;}

.opened, .closed {display: inline-block; width: 0; height: 0;border-style: solid;}
.opened {border-width: 7px 5px 0 5px; border-color: #0d4ea8 transparent transparent transparent;}
.closed {border-width: 5px 0 5px 7px; border-color: transparent transparent transparent #0d4ea8;}

/* licences */
.licence-icon {display: inline-block; width: 44px; height: 22px; vertical-align: middle;}
.icon-cc-by {background-image: url(../img/icons/licence/cc-by.png);}
.icon-cc-by-sa {width: 66px; background-image: url(../img/icons/licence/cc-by-sa.png);}
.icon-cc-by-nd {width: 66px; background-image: url(../img/icons/licence/cc-by-nd.png);}
.icon-cc-by-nc {width: 66px; background-image: url(../img/icons/licence/cc-by-nc.png);}
.icon-cc-by-nc-sa {width: 88px; background-image: url(../img/icons/licence/cc-by-nc-sa.png);}
.icon-cc-by-nc-nd {width: 88px; background-image: url(../img/icons/licence/cc-by-nc-nd.png);}
.icon-cc-0 {background-image: url(../img/icons/licence/cc-0.png);}

/* Ratings */
.own-rating {position:relative; padding: .5em; background-color: #eee;}
.edit-review-buttons {position: absolute; right: 3px; top: 7px;}
.ratings-average-container, .ratings-container {margin-bottom: 2em;}

/* References */
.references-container {margin-bottom: 2em;}

/**************
	HEADER
**************/
.header {display: flex; align-items: center; justify-content: space-between; height: 45px; background: #eee; border-bottom: 1px solid #aaa;}
.onyx-logo {display: block; height: 45px; width: 150px; background: url(../img/onyx-logo.png) 10px 4px no-repeat; font-weight: normal;}

.header-functions {display: flex; align-items: center; margin-right: 1em;}
.header-functions .btn:not(:first-child) {margin-left: .3em;}

/**************
	NAV
**************/
.nav-container {
	display: flex;
	margin-bottom: 10px;
 	padding: .4em 10px;
 	background-color: #444;
 	border-bottom: 4px solid #F2A55F;
 	border-radius: 0 0 3px 3px;
	}

.mainnav {margin-right: 40px;}

.subnav {}
.subnav .nav-item {margin-right: 15px;}

.nav-container .nav-item {
	position: relative;
	margin-right: 5px;
}

.nav-container .nav-link {
	padding: .2rem .7rem;
	color: #fff;
    border-color: transparent;
}
.dynamic-tab .nav-link {border-color: #aaa;}

.nav-container .nav-link:hover, .nav-container .nav-link:focus, .nav-container .nav-link:active,
.nav-container .nav-link.active {background-color: #fff; border-color: #fff; color: #444;}

.nav-container .nav-link.active:after {
	position: absolute;
	top: 23px;
	left: 45%;
	content: '';
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-top: 10px solid #fff;
}

.nav-close {
	position: absolute;
	top: -6px;
	right: -11px;
	color: #fff;
	}
.nav-close:hover, .nav-close:focus {color: #F2A55F; text-decoration: none;}

.skip-link {
    position: absolute;
    top: -1000em;
    left: -1000em;
    height: 1px;
    width: 1px;
}
.skip-link:focus, .skip-link:active {
    top: 0;
    left: 0;
    height: auto;
    width: auto;
    background: #fff;
    z-index: 1;
}

/**************
	MENU
**************/
.nav-menu {min-height: 300px;}
.nav-menu > ul {padding: 10px; border: 1px solid #AAA; border-radius: 5px;}
.nav-menu li {padding-left: 20px;}
.nav-menu a {color: #444;}
.nav-menu a.active {background-color: #DCE7EF; font-weight: bold;}

/**************
	BREADCRUMB
**************/
.breadcrumb {margin-bottom: 0; padding: 0 0 0 .5em; background-color: transparent;}
.breadcrumb-search {margin: .7em 0 -1em 0;}

/**************
	FOOTER
**************/
.pagefooter {height: 37px; padding: 10px; background-color: #eee; font-size: 0.9em;}
.pagefooter li {float: left; margin-right: 30px;}

.version {float: right; color: #575757;}

/**************
	CONTENT
**************/
/*.fluid-container {margin-right: auto; margin-left: auto; padding-left: 15px; padding-right: 15px;}*/
.content {position: relative; min-height: 680px; height: auto; margin-bottom: 30px;}

.ui-resizable-handle {border-left: 1px dashed #aaa;}
.ui-resizable-handle:hover {border-left: 2px dashed #5A9AE5;}
.ui-dialog .ui-resizable-handle,.ui-dialog .ui-resizable-handle:hover {border: none;}

/******************* TREE *******************/
.tree-options {display: flex; flex-wrap: wrap; width: 100%; margin-bottom: 15px;}
.tree-button {flex-grow: 1; margin: 2px;}

.jstree.jstree-default a {height: 22px; font-size: 0.9em; color: #000;}
.jstree.jstree-default a:hover, .jstree.jstree-default a:focus, .jstree.jstree-default a:active {text-decoration: underline; box-shadow: none;}
.jstree.jstree-default .jstree-clicked,
.jstree.jstree-default .jstree-clicked.jstree-hovered {
	background-color: #DCE7EF;
	font-weight: bold;
	box-shadow: none;
	}
.jstree.jstree-default .jstree-hovered {
	background-color: transparent;
	color: #07479B;
	}

.save {float: right;}

.jstree.jstree-default .jstree-icon.fonticon {background-image: none; font-size: 16px;}

.gutter-horizontal {
    min-height: 500px;
    border-right: 3px solid #eee;
}

.gutter-horizontal:hover {
    cursor: ew-resize;
}

/* context menu */
ul.vakata-context {background: #fff; border-radius: 3px; border-color: #ccc; box-shadow: 2px 2px 7px #ddd;}
ul.vakata-context li > a,
ul.vakata-context li > a > i:empty {line-height: 2.2em;}
ul.vakata-context li > a .vakata-contextmenu-sep {height: 2em; border: 0;}
ul.vakata-context li > a > i:empty {width: 0;}
ul.vakata-context .vakata-context-separator > a, ul.vakata-context .vakata-context-separator > a:hover {margin: 0;}
ul.vakata-context li > a > i {height: 2em;}

/******************* TABS *******************/
.tabs-nav {height: 32px; margin-bottom: .5em; padding: .2em .2em 0; border-bottom: 1px solid #aaa;}
.tabs-nav li {
	position: relative;
	float: left;
	top: 0;
	margin: 1px .2em 0 0;
	padding: 0;
	border: 1px solid #d3d3d3;
	border-bottom: 0;
	border-radius: 3px 3px 0 0;
	background-color: #e6e6e6;
	white-space: nowrap;
}
.tabs-nav li:hover {border-color: #999; background-color: #dadada;}
.tabs-nav li.selected {margin-bottom: -1px; padding-bottom: 1px; border-color: #aaa; background-color: #fff;}
.tabs-nav a {display: inline-block; padding: 0.25em 0.7em; color: #555; cursor: pointer;}
.tabs-nav li.selected a {padding: 0.28em 0.7em; color: #000;}
.tabs-nav a:hover, .tabs-nav a:focus, .tabs-nav a:active {text-decoration: none;}
.tabs-nav li.selected a:hover, .tabs-nav li.selected a:focus, .tabs-nav li.selected a:active {cursor: default;}

.tabbedpane-content {position: relative;}

/******************* WELCOME *******************/
.start-main {border-right: 1px dashed #aaa;}

.portlet {min-height: 110px; margin: 15px; padding: 20px; background-color: #eee; border-radius: 5px;}
.portlet.participate {margin-left: 0;}
.start-help {background-color: #DCE7EF;}
.start-help h2 {color: #0D4EA8;}

.start-additional article {margin-bottom: 35px;}
.start-additional h2 {margin-bottom: 0;}

/* LOGIN */
.login {width: 85%;}
.login label {display: block; font-size: 0.9em;}
.login input {width: 98%; margin-bottom: 8px;}

/* REGISTER */
.register form {margin: 40px 0;}
.register label {width: 170px; margin-right: 10px; text-align: right;}
.register input[type=checkbox] + label {width: auto;}
.register a {font-size: 0.9em;}
.register .alert {margin-top: 20px; padding: 10px;}

/* DISCLAIMER */
.disclaimer h2 {margin-top: 25px;}


/******************* HELP *******************/
.help-nav .folder-open > a {background-color: #DCE7EF;}

.help-heading {margin: 2em 0 .5em 0; padding: .3em .5em; background-color: #DCE7EF; border-radius: 5px 5px 0 0;}
.help-content h4 {margin: 3em 0 1em 0; border-bottom: 1px solid #aaa;}
.help-content p a {text-decoration: underline;}
.help-content ol, .help-content ul {margin: 0; padding-left: 25px;}
.help-content table, .help-content p {width: 72%;}
.help-content table p, .help-content .portlet p, .help-content .help-quickinfo p, .help-content .help-quickinfo table {width: auto;}
.help-content tbody {border: none;}
.help-content th, .help-content td {padding: 5px; border: 1px solid #aaa; vertical-align: top;}
.help-content .type-icon {display: inline-block; height: 2em; width: auto; padding-left: 25px; background-repeat: no-repeat;}

.help-quickinfo {float: left; width: 60%; margin: 1em 2% 1em 0;}
.help-additional {margin-top: 20px; padding-top: 10px; border-top: 1px dashed #aaa;}
.help-additional ul {padding-left: 0;}
.help-additional li {width: 70%; margin: 10px 0; padding-left: 10px; line-height: 30px; background: #eee;}
.help-content .help-additional li {list-style-type: none;}
.help-screen {max-width: 72%; margin: .5em 0 1em 0; box-shadow: 1px 1px 4px 1px #aaa; border: 1px solid #8DA5C4; border-radius: 3px;}
table .help-screen {max-width: 100%;}
.help-screen.right {float: left;}
.help-media {width: 25%;}
.help-icon {width: auto; vertical-align: middle;}
.help-content .icon {padding-left: 25px;}

.help-quickstart {float: left; width: 40%; margin-right: 30px;}
.help-quickstart .portlet {width: 90%; min-height: auto;}
.help-content .portlet h3 {margin-top: 5px;}

.help-up {
	display: block;
	height: 1em;
	width: 1.5em;
	position: fixed;
	right: 0;
	bottom: 3em;
	padding: 5px;
	background: url(../img/help/up.png) no-repeat center center #F2A55F;
	border-radius: 3px 0 0 3px;
	color: #fff;
	box-shadow: 0 0 4px 0 #aaa;
	opacity: .7;
	}
.help-up:hover, .help-up:focus {color: #fff; opacity: 1;}

/******************* REPO *******************/
.repo-structure {
	min-height: 600px;
	overflow: hidden;
	padding-top: .3rem;
}

.repo-structure-filter {
	position: relative;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.repo-structure .tree-repo {display: inline-block; width: 100%; margin-top: .5em; padding: 10px; border: 1px solid #AAA; border-radius: 5px;}
.tree-repo .tree-content {overflow: hidden;}
.tree-repo .tree-content .icon {min-height: 15px; height: auto; min-width: 15px; width: auto; padding-left: 5px;}
.tree-repo .tree-content .icon:hover, .tree-repo .tree-content .icon:focus, .tree-repo .tree-content .icon:active {background-position: 0 0;}
.tree-repo .selected {background-color: #DCE7EF;}

.repo-info {display: flex; align-items: center;}

.repo-options {min-height: 1px;}
.repo-options li {float: left;}
.adapt-table {margin-bottom: 10px;}
.repo-options button {margin-right: 15px;}
.search {position: absolute; right: 0; top: -3px; margin-right: 1em; margin-bottom: 10px; z-index: 1;}
.search a {font-size: 0.9em;}
.repo-search-filter-box, .repo-menu-box, .adapt-table-box {
	position: absolute;
    top: 36px;
	width: 16em;
	padding: .5em;
	font-size: .85em;
	background-color: #fff;
	border: 1px solid #ccc;
	border-radius: 3px;
	box-shadow: 1px 1px 3px 0 #aaa;
	z-index: 10;
}
.repo-menu-box {
	width: auto;
	top: 33px;
	right: 0;
}
.adapt-table-box {right: 0; top: 10px;}
.repo-search-filter-box .form-element, .repo-menu-box .form-element, .tree-repo .form-element, .adapt-table-box .form-element {margin: 0;}
.tree-repo .search-own, .repo-search-filter-box .search-own {margin-top: .4em; padding-top: .4em; border-top: 1px solid #ccc;}

.repo-table {position: relative;}
.repo-table .table-choose {width: 30px;}
.adapt-table {
	position: absolute;
  	right: 0;
  	top: -29px;
}
.table-action {width: 25px;}
.table-action .big.icon {vertical-align: top;}

.choose-all {
    margin: 10px 0 0 8px;
}

.repo-table .link {
    position: absolute;
    margin-left: -0.5em;
}

.table-options {
    margin-left: 8px;
}

.table-options li {
    float: left;
}

.table-options button {
    margin-right: 15px;
}

.ref-icon-container {
    height: 40px;
}

.ref-icon {
    position: absolute;
    top: -5px;
    left: -6px;
    font-size: 13px;
}

.repo-title-container {
    padding-top: 0.5em;
    padding-bottom: 0.5em;
}

.repo-title-headline {
	font-weight: bold;
}

.thumbnail {
    width: 160px;
    height: 100px;
    padding: 4px 0 4px 0;
}

/* advanced search */
.free-search {
    margin: .5em 0 1em 0;
}

.ui-dialog .free-search {
    margin-top: 0;
}

.advanced-search {
    width: 100%;
    padding: 0 15px;
}

.search-category .btn-block {
    background-color: #eee;
    text-align: left;
}

/* pagechooser */
.table-pagechooser {
    position: relative;
    font-size: 0.9em;
    color: #575757;
    text-align: center;
}
.table-pagechooser .first, .table-pagechooser .last {display: none;}
.table-pagechooser em {display: inline-block; padding: 0 .2em; font-style: normal;}
.table-pagechooser .goto em {padding: 0 .2em; background-color: #ddd; color: #000; font-weight: bold; border-radius: 3px;}
.table-pagechooser-all {text-align: center;}
.table-nav-label {position: absolute; right: 0;}

/* sort columns */
.wicket_orderNone a {padding-right: 10px; background: url(../img/icons/table-order.png) no-repeat right center;}
.wicket_orderUp a {padding-right: 10px; background: url(../img/icons/table-order-up.png) no-repeat right center;}
.wicket_orderDown a {padding-right: 10px; background: url(../img/icons/table-order-down.png) no-repeat right center;}

/* folder statistics */
.folder-statistics-title {float: left; width: 60px;}
.folder-statistics-content {float: left; margin: 5px 0 0 50px;}
.folder-statistics ul {margin-top: .5em; margin-bottom: 2em;}
.folder-statistics li {min-height: 25px;}
.folder-statistics li .type-icon,
.folder-statistics li .icon,
.folder-statistics-users .icon {vertical-align: middle;}
.folder-statistics-show-types,
.folder-statistics-show-authors {display: block; margin: .3em 0 .2em 25px; font-size: .9em;}
.folder-statistics-show-authors,
.folder-statistics-authors {
	margin-left: 17px;
}

.folder-statistics-types {
	margin-left: 25px;
}

.folder-statistics-users {
	margin-top: .5em;
}

/******************* TEST EDIT *******************/
.repo-quickaccess {
	min-height: 500px;
	padding: 0;
	overflow: hidden;
}

.repo-quickaccess .tree-repo,
.repo-quickaccess .search-results {
	padding: 0 .5em;
	background-color: #F4F4F4;
	border: 1px solid #aaa;
	border-radius: 3px;
	box-shadow: inset 1px 1px 3px 0 #ccc;
	max-height: 800px;
	overflow-x: clip;
	overflow-y: scroll;
	scroll-behavior: smooth;
}

.repo-quickaccess .jstree-container {
	max-height: 800px;
	overflow-x: clip;
	overflow-y: scroll;
	scroll-behavior: smooth;
}

.repo-quickaccess .search-results > ul {
	padding: 10px 0;
	border-bottom: 1px solid #aaa;
}

.repo-quickaccess .search-results li.form-element {
	margin: 0;
}

.repo-quickaccess .search-results li.form-element input {
	height: 25px;
}

.repo-quickaccess .icon {
	vertical-align: middle;
}

.repo-quickaccess .tree-content {
	overflow: hidden;
}

.repo-quickaccess .jstree-default .jstree-icon.jstree-themeicon-custom {
	width: 20px;
	background-size: 15px;
	background-position: 3px 4px;
}

.repo-quickaccess .search {
	position: relative;
}


.test-structure {min-height: 500px;}
.test-structure .tooltip {float: right; margin: 5px 0 0 0;}
.tree-test .treecontainer {overflow: hidden;}

.more-options {
	display: none;
	padding: 2px;
	background-color: #fff;
	border-radius: 5px;
	box-shadow: 1px 1px 5px -1px #AAA;
	}
.more-options * {display: inline-block; width: 96%;}
.more-options a {padding-left: 5px;}
.more-options li:hover a {background-color: #DCE7EF; color: #333;}
.more-options li.disabled:hover a {color: #aaa;}

.onyx-test .test-edit {padding-right: 0;}
.onyx-test h1,
.onyx-item h1 {margin-bottom: 0;}
.test-edit {position: relative;}
.test-options {display: flex; align-items: center; justify-content: space-between; margin-bottom: 2em;}
.test-options-left {flex-basis: 100%;}
.test-options-right {position: relative; flex-shrink: 0; display: flex;}

.test-fav {margin-right: .5em;}
.test-version {position: absolute; width: max-content; top: 19px; right: 0;}
.test-status {position: relative; margin-right: .5em;}
.test-status .btn {overflow: visible;}
.test-status .btn .badge {position: absolute; right: -5px; top: -5px;}

/******************* TEST OPTIONS *******************/
.layoutLabel {padding-top: .5em;}
.tools .uploadLabel {width: 12%; margin-right: 20px; padding-top: .7em; text-align: right;}
.tools span.label {padding-top: 0;}
.upload-files li {display: flex; align-items: flex-start; gap: .5rem;}
.upload-files li a {display: flex; gap: .5em; align-items: baseline;}
.upload-files li a .text-secondary {flex-shrink: 0;}

	/******************* REFERENCES *******************/
h1.link, h1.link:hover {
	display: inline-block;
	padding-right: .6em;
	background-position: right 0;
	background-repeat: no-repeat;
}
.correction-dialog ul {
	margin: 1em 0;
	padding-left: 2em;
	list-style-type: disc;
}

/******************* METADATA *******************/
.show-all {position: absolute; right: 0; top: 2em; margin-top: 1em;}
.ui-tabs .show-all {right: .5em; top: 2.8em;}
.ui-tabs .show-all+.tabbedpane {margin-top: 1em;}

.metadata-container .form-inner input {width: 300px;}
.metadata-container .form-inner select {min-width: 305px;}
.metadata-container .form-inner .number-field {width: 6em;}
.metadata-container .additional img {float: left; margin-right: .5em;}

/******************* RIGHTS *******************/
.rights-form .form-container {margin-bottom: 25px;}
.rights-form .form-shift {margin-left: calc(17% + 20px);}

/******************* STATISTIC *******************/
.statistic-load {margin-bottom: 1em;}

/******************* ITEM EDIT *******************/
.onyx-item .test-edit {flex: 0 0 100%; max-width: 100%; padding: 0;}

/******************* PREVIEW *******************/
.iframe-preview {min-height: 800px;}

/******************* files *******************/
.file-list {margin: 1rem 0;}
.file {margin: .3rem 0;}
.file .btn {margin-left: .5rem;}

/******************* INTERACTIONS *******************/
.button-box .btn {margin-top: 1.5em; border-style: dashed; border-width: 2px; text-align: left; font-size: 1em; color: #575757;}
.button-box .btn:hover, .button-box .btn:focus {background-color: #eee; border-color: #5A9AE5; color: #444;}

.interaction textarea {width: 95%; font-size: 0.9em;}
.interaction td {vertical-align: middle;}

.table-actions {width: 20px; margin: 0.5rem 0;}
.table-actions .fonticon {font-size: 16px;}
td.separator {padding-left: 10px; border-left: 1px solid #aaa;}

.edit-ids-th,
.edit-ids-td {width: 50px;}
input.edit-ids-input {width: 80px;}
.match-td-right-side {border-right: 1px solid #AAAAAA;}
.match-td-bottom {border-bottom: 1px solid #AAAAAA;}

/* ORDER */
.table-order {width: 80px; text-align: center;}
.table-order span {font-weight: bold;}
.table-order select {
	width: initial;
}

/* MATCH */
.match-connection {
	width: 50px;
	text-align: center;
}

.match .button-box {
	margin-bottom: 5px;
}

.match-answer {
	display: inline-block;
	position: relative;
	width: 100%;
	padding-top: 1em;
}

.match select {
	min-width: 4.5em;
}

.match .table-actions {
	padding-right: 1.2em;
}

.interaction .match-answer-symbol {
	vertical-align: top;
	padding-top: 1em;
}

.match-answer-symbol div {
	padding: 0.4em;
	background: #DCE7EF;
	border-radius: 3px 0 0 3px;
	text-align: center;
}

.match-single .match-answer .tinymce-container {
	width: 25vw;
    display: initial;
}

.match-assessment, .order {
	width: auto;
	border-collapse: separate;
	border-spacing: 5px;
}

.match-assessment .source,
.match-assessment .target,
.distraktor,
.order .source {
	height: 50px;
	min-width: 100px;
	padding: 5px;
	text-align: center;
	vertical-align: middle;
	background: #fff;
	border: 1px dashed #aaa;
}

.match .function-symbols {
	position: absolute;
	top: 0;
}

.match tr .edit-ids-th:not(:first-child),
.match tr .edit-ids-td:not(:first-child) {
	padding: 0 .7em;
}

.match .button-box .btn {margin-top:0;}

    /* MATRIX */
.matrix {width: auto;}
.matrix tr {height: auto;}
.matrix th {padding-bottom: 10px;}
.matrix th, .matrix td {min-width: inherit;}
.matrix thead .button-box .btn {min-height: 100px; padding: 0;}
.matrix tbody .button-box .btn {text-align: center;}

.matrix-answer {display: inline-block; position: relative;}
.matrix-answer .tinymce-container {width: 250px; float: left;}
.matrix-answer .mceIframeContainer {vertical-align: top;}

.matrix .function-symbols {position: absolute; top: auto; right: auto; z-index: 1;}
.matrix .match-td-right-side {padding: 0 .7em;}
.matrix .match-td-right-side+.matrix-answer {padding-left: .7em;}
.matrix .match-td-right-side.button-box {padding-bottom: .7em;}
.matrix tbody .match-td-right-side {padding: .5em 1.3em 0 1.3em;}

.matrix td .form-container {display: inline-block; vertical-align: middle;}
.matrix td .form-inner {margin-bottom: 0;}

.matrix-assessment td {min-width: 130px;}
.matrix-assessment .table-tr td:not(:first-child) {white-space: nowrap;}
.matrix-assessment .fonticon {display: inline-block; width: 16px;}
.matrix-assessment .number-field {width: 5em; margin-right: 15px;}

/* TEXT ENTRY */
.gap-placeholder {width: 100%; height: 600px;}

.textentry tbody {border-bottom: 1px solid #ccc;}
.textentry tbody * {vertical-align: middle;}
.textentry tbody th {width: 150px;}

.textentryDisabled {display: inline-block; width: 70%; min-height: 6em; padding: .5em; background-color: #e5e5e5; border: 1px solid #aaa; border-radius: 3px;}
.textentryDisabled img {vertical-align: middle;}

.gap-id {
  position: absolute;
  right: 5px;
  bottom: 0;
  font-weight: bold;
}

.gap-separator {border-top: 1px solid #ccc;}
.gap-separator th, .gap-separator td {padding-top: .3em;}

/* NUMERIC */
.numeric-solution .number-field {width: 6em;}

.tolerance-option {position: relative;}
.tolerance-option .tolerance-solution-container {position: absolute; top: .2em; left: 13em;}
.tolerance-option .number-field {width: 6em;}
.tolerance-solution {display: inline-block; margin: 0 .5em; color: #0D4EA8; font-weight: bold;}

/* TEXTBOX / INLINE CHOICE */
.inline-choice-answer input {width: 100%;}
.interaction.inline-choice+hr {margin: 2rem 0; border-top: 1px dashed #aaa;}

/* CALCULATION */
.variable-editor-value {margin-left: 15%;}
.variable-editor select {min-width: inherit;}
.expert-mode {float: right;}
.calculation-container > .expert-mode {position: absolute; right: 2.5em; top: 1.15em;}
.box-close+.expert-mode {margin: 3px 30px 0 0;}

.variable-img-container {position: relative; margin-bottom: 2em; padding-bottom: 1em; border-bottom: 1px solid #AAAAAA;}

.variable-img-container .form-inner {margin-left: 2em;}
.variable-img-container .form-inner img {float: left; max-width: 200px; margin-right: 2em;}
.variable-img-container button.variable-img-delete {margin: 10px;}
.variable-img-form {float: left;}
.variable-img-form .form-container label {width: 105px;}
.variable-img-form .form-container .form-inner {width: inherit; margin-left: 0;}
.variable-img-form .form-container button {margin-left: 10px;}

.variable-img-delete {position: absolute; right: 0; top: 0;}
table.variables td {padding-right:5px;}
table.variables .table-action .icon-circle-up,
table.variables .table-action .icon-circle-down {font-size: 14px;}
table.variables .table-action .only:nth-child(2) {margin-top: -6px;}
table.variables th:empty {width: 1px;}

/* dynamic images */
.graph-form strong {display: block;}
.graph-form .label {width: 10%; text-align: left;}
.graph-form-add {margin-bottom: 2em;}

/* FORMULA */
.formula-solution {position: relative;}
.formula-solution .expert-mode {margin-top: -10px;}

/* HOTSPOT */
.hotspot-upload {margin: 10px 5px; padding: 2px 9px; background-color: #f6f6f6; border: 1px solid #ccc; border-radius: 3px;}
.hotspot-editor {display: inline-block; position: relative; min-height: 250px; margin: 10px 5px;}
.hotspot-editor img {border: 1px solid #ccc;}
.new-hotspots {display: inline-block; width: 20%; margin: 10px 5px 0 5px; padding: 2px 10px 10px; border: 1px solid #ccc; border-radius: 3px; vertical-align: top;}
.new-hotspots .button-box {margin-bottom: 5px;}

.hotspot-spot {position: absolute; background-color: #EACACA; border: 2px solid #8E0000; cursor: move; opacity: 0.8}
.hotspot-spot.correct {border: 2px solid #157565; background-color: #E1F4E2;}
.hotspot-spot.circle {border-radius: 100px;}
.hotspot-spot.ellipse {border-radius: 100%;}
.hotspot-spot-id {display: inline-block; width: 100%; height: 100%; text-align: center; color: #444;}
.hotspot-spot .ui-resizable-handle {border: none;}

.hotspot-table tbody tr {height: 45px;}
.hotspot-table input[type=number] {width: 70px; margin-right: .7em;}
.hotspot-table-shape .custom-select {width: auto;}

/* GRAPHIC MATCH */
.graphic-match-container {display: flex; flex-wrap: wrap;}
.graphic-match-container .hotspot-editor {margin-right: 1em;}
.graphic-match-container .new-hotspots {width: auto; margin-left: 0; padding: 0; border: none;}

/*.graphic-match-container .hotspot-table {width: auto;}*/

.graphic-match-container .edit-ids-td,
.interaction.match.graphic .edit-ids-td {
	padding-right: 1em;
}

.interaction.match.graphic .custom-select {
	max-width: 8em;
}

/* PROGRAMMING */
.ace_editor {
	border: 1px solid #dee2e6;
}

.ace-tm .ace_print-margin {
    background-color: transparent !important;
}

.tiny-dialog-content .ace_editor {flex: 0 0 95%; margin: .5rem 0; resize: vertical;}
.tiny-dialog-content .tiny-jsx-help-container {display: flex; gap: .5rem;}

	/* DRAWING */
.geoapplet {
    margin: 1em 0;
}

.GeoGebraFrame .toolbarMow .headerMow .content {
    min-height: auto;
}

.GeoGebraFrame .toolbarMow .toolbarMowPanel .mowSubmenuScrollPanel .penSubMenu .mowSubMenuContent {
	margin-left: 40px;
}

/* CHEMISTRY */
table.chemistry tr.highlighted {
	background: rgb(221, 221, 221);
}

table.chemistry tbody th {
	width: 150px;
}

table.interaction.chemistry {width: auto;}

/******************* FEEDBACK *******************/
.feedback-condition li.feedbackPanelERROR {
	position: absolute;
}

.feedback-condition .feedbackPanel .error {
    position: absolute;
}
.feedback-condition select {width: 200px;}
.feedback-condition .condition-operator {min-width: inherit; width: 50px;}

/******************* ERROR PAGE *******************/
.error-page {
	margin-top: 35px;
}

.error-page .alert {
	padding: 20px;
}

.error-page .form-container label {
	vertical-align: top;
}

/******************* CONTACT USER *******************/
.contact-info-container {display: flex; margin: 1em 0;}

.contact-img {max-width: 160px; width: 100%; margin-right: 2em;}
.contact-img img {
    width: 100%;
    height: auto;
    margin-bottom: .5em;
}
.contact-placeholder {height: 130px; width: 100%; background: url(../img/icons/user-profile.png) no-repeat center center #ddd;}

.contact-container .dialog-button-area {text-align: left;}
.contact-container .form-container label {    width: auto;
    text-align: left;
    display: block;
    font-weight: bold;}
.contact-container .form-inner,
.contact-container .form-inner input,
.contact-container .form-inner textarea {width: 100%;}
.contact-container .form-inner input[type=checkbox] {width: auto;}

/******************* LICENCE VIEW *******************/
.licence-header {position: relative;}
.licence-header-func {position: absolute; top: 5px; right: 5px;}

.licence-selected {padding: .3em .3em 0 .3em; background-color: #DCE7EF;}

/*****************************
	GUI Demo
******************************/
.guidemo-page {margin: 4rem auto;}

/****************************************
		MEDIA QUERIES
****************************************/
@media screen and (min-width: 1400px) {
	button.form-button, .form-link {margin-left: 22%;}
}

@media screen and (max-width: 1000px) {
	.content {min-height: initial;}
	.onyx-test .gutter-horizontal {display: none !important;}
	.repo-quickaccess {border-right: 1px solid #aaa;}
	.repo-quickaccess, .test-structure {max-width: 50% !important; min-height: initial; flex-basis: 50% !important; padding-right: 0;}
	.test-edit {max-width: 100% !important; flex-basis: 100% !important; padding-left: 0;}
}

@media screen and (max-width: 730px) {
	.repo-structure,
	.repo-content {width: 100% !important; max-width: 100% !important; flex-basis: 100% !important; min-height: 100px; height: initial !important;}
    .repo-structure-filter {flex-direction: column;}
	.gutter-horizontal {display: none !important;}
}