/* cordova/bootstrap defaults */
* {
	-webkit-tap-highlight-color: rgba(0,0,0,0); /* make transparent link selection, adjust last value opacity 0 to 1.0 */
}

:root {
	--bg-color: #f2f2f2;
	/* match ios/android native color */
	--header-footer-color: #f2f2f2;
}

body {
	-webkit-touch-callout: none;				/* prevent callout to copy image, etc when tap to hold */
	-webkit-text-size-adjust: none;				/* prevent webkit from resizing text to fit */
	-webkit-user-select: text;					/* prevent copy paste, to allow, change 'none' to 'text' */
	height: 100vh;								/* do not override this value (e.g. 100%), because the height of document.scrollingElement is calculated wrong (required for scrolling elements into view) */
	padding: 0; /* default */
	padding: constant(safe-area-inset-top) constant(safe-area-inset-right) constant(safe-area-inset-bottom) constant(safe-area-inset-right); /* iOS11 */
	padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-right); /* iOS12+ */
}

.btn.focus,
.btn:focus {
	box-shadow: none !important;
}

.dropdown-item:focus,
.dropdown-item:hover {
	background: #eee;
}

dl, ol, ul {
	margin-bottom: 0.5rem;
	-moz-padding-inline-start: 25px;
	-webkit-padding-inline-start: 25px;
	padding-inline-start: 25px;
}
ol ol, ol ul, ul ol, ul ul {
	margin-bottom: 0.375rem;
}
/* 1, 4, 7 */
ul ul ul ul,
ul ul ul ul ul ul ul {
    list-style-type: disc;
}
/* 2, 5, 8 */
ul ul ul ul ul,
ul ul ul ul ul ul ul ul {
    list-style-type: circle;
}
/* 3, 6, 9 */
ul ul ul ul ul ul,
ul ul ul ul ul ul ul ul ul {
    list-style-type: square;
}
p {
	margin: 0.5rem 0;
}
table p {
	margin: 0;
}
.w-10 {
	width: 10% !important;
}
.w-15 {
	width: 15% !important;
}
.w-20 {
	width: 20% !important;
}
.lh-125 {
	line-height: 1.25;
}

h5,
.h5 {
	font-size: 1.1rem;
}

/* example: rheuma - grund_epi_rheuart */
h6:not(:first-of-type) {
	margin-top: 1.5rem;
}

/* remove the gap between table and horizontal scrollbar */
.table-responsive {
	margin-bottom: 1rem;
	/* disable scroll-bounce */
	overscroll-behavior: none;
}
.table-responsive .table {
	margin-bottom: 0;
}

/* TODO check if any non-grade table is affected by this (in any app) */
.table-responsive > .table-bordered.table-sm.col-lg-12.col-sm-12 tr.d-flex th:first-child {
	/* longest string is "Grad 3-4", see RCC check_mening.html */
	max-width: 85px;
	border-top: 0;
}
.table-responsive > .table-bordered.table-sm.col-lg-12.col-sm-12 tr.d-flex td:nth-child(2) {
	flex-grow: 1;
	max-width: 100%;
	border-top: 0;
}

.table-responsive > .table-bordered.table-sm.col-lg-12.col-sm-12 tr.d-flex:first-child th:first-child,
.table-responsive > .table-bordered.table-sm.col-lg-12.col-sm-12 tr.d-flex:first-child td:nth-child(2) {
	border-top: 1px solid #dee2e6;
}

/* example: uppergi - /nach_end */
.tooltip-inner {
	max-width: 300px;
}
.tooltip-blue {
	color: #3DA8F5;
}

/* to prevent highlighting specific elements, add class "no-flash" to the target element */
.scroll-target-highlight {
	background: #ffb;
}

.scroll-target-highlight.fadeout {
	background: transparent;
	transition: background-color 2s ease-in-out;
}


/** CONTAINER */

body {
	min-width: 320px;
}

.container {
	max-width: 1600px;
}

#content-wrapper {
	position: relative;
	display: flex;
	padding: 0;
}

.view-content {
	background: #fff;
	padding: 1rem;
}

/* highlight api sources on dev-pages */
body.dev-env #tools_literature li.api-item,
body.dev-env #more_literature li.api-item {
    background: #fe7;
	padding: 0.5rem;
}
body.dev-env #tools_literature li.api-item::before,
body.dev-env #more_literature li.api-item::before {
	font-weight: bolder;
	content: ' API';
	display: block;
	font-size: 12px;
}

/** DEFAULTS FOR CUSTOM CSS */

html,
body,
#content-loading-cover {
    background: var(--bg-color);
}
#header,
#footer-web {
	background: var(--header-footer-color);
}

body.web:not(.touch) .navLevel1 > ul > li a {
	transition: background 0.25s linear, color 0.25s linear;
}
.navLevel1 li a .menu-color {
	border-color: red;
}
.card-header,
#favorites li,
#nav-wrapper .navLevel1 > ul > li a .menu-color,
#nav-wrapper li.active a,
#nav-wrapper li.active a .menu-color,
body.web:not(.touch) .navLevel1 > ul > li a:hover,
body.web:not(.touch) .navLevel1 li a:hover .menu-color {
/*	background: red;*/
/*	color: #fff;*/
	transition: background 0.25s linear, color 0.25s linear;
}
.card-open > .card-header,
body.web:not(.touch) #favorites li:hover,
body.web:not(.touch).home a:hover .home-tile,
.card-header:hover {
	/*background: orange;*/
}

body.sideeffects .card-header {
	background: #8a8;
}

body.sideeffects .card-body .card-header {
	background: #88a;
}

body.sideeffects .card-body .card-body .card-header {
	background: #a88;
}

/* debug: highlight all API data */
.api-grade-tables,
.api-supportive-measures,
.api-sub-information,
.api-sub-measures {
/*	background: mistyrose;*/
/*	margin-top: 0.5rem;*/
/*	border: 5px solid red;*/
/*	box-shadow: 0 0 10px red;*/
}

.api-grade-title {
	font-weight: normal;
}

#nav-wrapper .navLevel2 > ul > li.active a .menu-color {
	/* replace 5px left border with padding to prevent white line inbetween */
	border: 0;
	padding-left: 15px;
}


/* CAVE icon */

li.icon-cave {
	margin-left: -1.5em;
	list-style-type: none;

}
li.icon-cave::before {
	content: "\f071";
    font-family: "Font Awesome 5 Free";
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    font-weight: 900;
    margin-right: 6px;
}


/** HELPER **/

.cursor-pointer {
	cursor: pointer;
}
.cursor-auto {
	cursor: auto;
}

/* shorter version of font-weight-bold */
.bold {
	font-weight: 700 !important;
}

/*used mostly on h5 or any other tag to add space*/
.space-top {
	margin-top: 1rem;
}
.no-wrap {
	white-space: nowrap;
}
.break-word {
	word-break: break-word;
}
.break-none {
	word-break: normal !important;
}
/* for extralong urls as linktext
   e.g. https://clinicaltrials.gov/ct2/show/NCT04034459
*/
.link-breakall {
    word-break: break-all !important;
    overflow-wrap: break-all !important;
}

/* ui.bootstrap fix cursor for missing href-attributes */
/*.nav, .pagination, .carousel, .card-title a { cursor: pointer; }*/

/* short links: completely non-breakable */
p.internal-link,
span.internal-link {
	white-space: nowrap;
}
/* long links: keep icon and first word together (with <span class="text-nowrap">icon+word</span>), everything else breakable */
/* See task#2005 */
a.internal-link {
	word-break: break-word;
}
.fas.black {
	color: #212529 !important; /* bootstrap 4 default */
}

.internal-link .fa-share,
.external-link .fa-share {
	color: #007bff;
}
.int-link::before,
.ext-link::before,
.fi-link::before {
	 display: inline;
	 font-style: normal;
	 font-variant: normal;
	 text-rendering: auto;
	 -webkit-font-smoothing: antialiased;
}
.int-link::before,
.ext-link::before,
.fi-link::before {
	font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f064";
    margin-right: 4px;
}
.int-link::before,
.ext-link::before,
.fi-link::before {
    color: #007bff;
}
.int-link.info-icon::before {
    display: none;
}
.int-link.info-icon a::after
{
    font-family: "Font Awesome 5 Free";
	line-height: 0;
	font-weight: 900;
	content: "\f05a";
	color: #212529;
	margin-left: 4px;
}

.int-link.info-icon a {
	color: #212529;
}
.int-link a:hover {
	text-decoration: none;
	border-bottom: 1px solid #0056b3;
}
.int-link.info-icon a:hover {
    text-decoration: none;
    border-bottom: 1px solid #212529;
}

.media {
    padding: 0.5rem;
    margin-bottom: 1rem;
}

.media.media-bg {
    background-color: #f2f2f2;
}

/* tables with grey background - make border darker */
.media.media-bg .table-bordered th,
.media.media-bg .table-bordered td {
	border-color: #bbb;
}

.media-additional {
	display: block; /* required to enable table-responsive scrolling in API mgmt */
	padding-top: 0;
}
.media-additional p {
	margin-top: 0;
}

/* prevent fas icon in modals */
body.modal-open .modal .internal-link::before,
body.modal-open .modal .external-link::before {
    display: none;
}
/* prevent fas icon in more views */
body.more .internal-link::before,
body.more .external-link::before {
    display: none;
}

.sub-link-black a {
	color: #212529;
}
.sub-link-black a:hover {
	text-decoration: none;
	border-bottom: 1px solid #212529;
}
.sub-link-black .fa-info-circle {
	color: #212529;
}
.sub-link-green,
.sub-link-green a {
	color: #3a0;
}
.sub-link-green a:hover {
	text-decoration: none;
	border-bottom: 1px solid #3a0;
}
.sub-link-green .fa-info-circle {
	color: #3a0;
}
.web-only,
.app-only,
.ios-only,
.android-only {
	display: none;
}
body.web .web-only,
body.ios .app-only,
body.ios .ios-only,
body.android .app-only,
body.android .android-only {
	display: inline-block;
}

body.web .web-only.app-badges {
	display: block;
}
body.web .web-only.app-badges-footer {
	display: none;
}

/* rcc diag_klass, tools karnofsky/ecog */
.lit-list th {
	text-align: right;
}
.lit-name {
	word-break: break-word;
}

/* add a size between bootstrap-default 0.75 and -sm 0.3 */
.table-sm td,
.table-sm th {
	padding: 0.45rem;
}

.col-xs-6 {
	position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}
@media (min-width: 500px) {
	.col-xs-6 {
	    -ms-flex: 0 0 50%;
	    flex: 0 0 50%;
	    max-width: 50%;
	}
}

.table-xs td,
.table-xs th {
	padding: 0.25rem;
}

.table-xs ul {
	-moz-padding-inline-start: 18px;
	-webkit-padding-inline-start: 18px;
	padding-inline-start: 18px;
}

.btn-group-xs > .btn, .btn-xs {
	padding: .25rem .4rem;
	font-size: .875rem;
	line-height: .5;
	border-radius: .2rem;
}

/* Plus/Minus Buttons
/* the default ios button bg color is white (=buttonface) */
.btn.fa-plus,
.btn.fa-minus {
	background: #d0d0d0;
	padding: 6px 10px;
	margin: 0 2px;
}
.btn.fa-plus:hover,
.btn.fa-minus:hover {
	background: #bbb;
}

ul li .btn.fa-plus,
ul li .btn.fa-minus {
	margin: 5px 2px;
}

/* mehr lesen/weniger lesen Buttons */
.btn-link {
    padding: 0;
    vertical-align: baseline;
}
.btn-link:focus {
    text-decoration: none;
}
.btn-link.fas {
    font-family: unset;
    font-weight: initial;
    line-height: inherit;
}
.more-open::before {
    content: "mehr";
}

.more-close::before {
    content: "weniger";
}
.more-open::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f078";
    margin-left: 3px;
}
.more-close::after {
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    content: "\f077";
    margin-left: 3px;
}

/** DROPDOWNS **/

.dropdown-toggle {
	white-space: normal;
}
.dropdown-menu {
	box-shadow: 3px 3px 10px -2px #333;
	max-height: 420px;
	overflow: auto;

}

/* remove ios blue active state color */
.dropdown-item {
	white-space: normal;
}
.dropdown-item.active, .dropdown-item:active {
	color: #16181b;
	text-decoration: none;
	background-color: #e6e6e6;
}


/** ACCORDIONS **/

html uib-accordion .card,
html uib-accordion .card-header {
	padding: 0;
	border: 0;
}
html.d1 uib-accordion .card,
html.d1 uib-accordion .card-header {
	border-radius: 0 !important; /* override bootstrap */
}

.card-body {
	padding: 0.75rem;
}
/* first accordion-group below a white content block */
.view-content + uib-accordion > div > .card,
/* every accordion-group except the first */
.card + .card {
	margin-top: 5px;
}

.card-header .card-title p {
	margin: 0;
}
.card-header a {
	display: block; /* for browser inspect highlight */
	text-decoration: none;
    outline: none; /* webkit shows an outline after removing ng-disabled from a-tag in custom_accordion_group.html */
}

.card-header > .card-title > .accordion-toggle > div > .chevron-state::before {
	content: "\f054"; /* chevron-right */
}

.card-open > .card-header > .card-title > .accordion-toggle > div > .chevron-state::before {
	content: "\f078"; /* chevron-down */
}

.card:last-child .card-body {
	/*padding: 0.75rem 0.75rem 0.5rem 0.75rem;*/
}
.card-body .card-body {
	padding: 0.75rem 0.5rem 0.5rem 0.5rem;
	/*padding: 0.75rem 0.5rem 0 0.5rem;*/
	/*margin-bottom: -5px;*/
}
/*.card .card:not(:last-child) .card-body {*/
	/*padding-bottom: 3px;*/ /* 0.5rem - 5px */
/*}*/
.card .card:last-child > .card-collapse > .card-body {
	padding-bottom: 0;
	/*padding-bottom: 5px;*/
}
.card:last-child .card:last-child > .card-collapse > .card-body {
	padding-bottom: 0;
}

h5.card-title {
	margin: 0;
}

.card-header .card-title div {
	color: #fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.5rem 0.75rem;
}



/** OTHER **/

#loader {
	position: fixed;
	display: none;
	width: 200px;
	left: 50%;
	margin-left: -100px;
	top: 250px;
	border-radius: 10px;
	opacity: 0.85;
	z-index: 1035; /* above header/footer, below modals */
	color: #fff;
	font-size: 17px;
	background: #000;
	text-align: center;
	font-weight: bold;
}

#loader img {
	margin: 1rem auto;
}

#loader-text {
	display: inline-block;
	width: 100%;
	margin-bottom: 1rem
}

#splashscreen {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 50px 0px 0px 0px;
	background: var(--bg-color);
	z-index: 1100; /* above everything, even modals (except lightbox on phone landscape) */
	text-align: center;
	height: 100%;
}

body #splashscreen {
	/*TODO comment out for live*/
/*	display: none;*/
}

#splashscreen .inner {
	display: inline-block;
	padding: 25px 10px;
	margin: 0 auto;
	color: #000;
	font-size: 16px;
	max-width: 1000px;
	position: relative;
	text-align: left;
	width: 100%;
}
@media (min-width: 576px) {
	#splashscreen .inner {
		padding: 25px 20px 25px 20px;
	}
}

.calc-h5 {
	margin-top: 20px;
	font-size: 15px;
	font-weight: bold;
}

/* Nebenwirkungen nach Substanzen - Checkbox */

.custom-cb-box {
	cursor: pointer;
}

.custom-cb {
	display: flex;
	align-items: center;
	justify-content: center;
	float: left;
	width: 22px;
	height: 22px;
	background: #eee;
	border: 1px solid #ccc;
	border-radius: 5px;
	margin-top: 1px;
}

.custom-cb-text {
	/*display: inline-block;*/
	margin-left: 5px;
	max-width: 90%;
}


/** MODALS **/

.modal-header {
	padding: 0.5rem 1rem;
}
h5.modal-title {
	line-height: 1.2;
}
.modal .close {
	font-size: 2.5rem;
	margin-top: -1.5rem;
}
.modal-lightbox .close {
	padding: 1rem 0.5rem;
	margin: -1.75rem -0.5rem -1rem auto;
}

.modal.modal-email .modal-dialog {
	position: absolute;
	top: 20px;
	width: 232px;
	left: 50%;
	margin-left: -116px;
	text-align: center;
}

.modal.modal-email .btn {
	width: 200px;
}

.modal.modal-email .btn:first-child {
	margin-bottom: 0px;
}

.modal.modal-bottom .modal-dialog {
	width: 100%;
	position: absolute;
	bottom: 0;
	margin: 1rem 2%;
	left: 48%;
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}

.modal-header,
.modal.modal-external-link .modal-title {
	display: flex;
	align-items: center;
}
.modal.modal-external-link .modal-title i.fas,
.modal.modal-news .modal-title i.fas,
.modal.modal-app-version .modal-title i.fas {
	/*float: left;*/
	color: #39c;
	/*font-size: 1.25em;*/
}
.modal.modal-external-link .modal-title span {
	margin-left: 10px;
}

.modal.modal-news .modal-title span {
	margin-left: 5px;
}

.modal.modal-sources .modal-body {
	/*padding-left: 0.5rem;*/
}

.modal.modal-sources ul,
.modal.modal-lightbox ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.modal.modal-sources li:not(:last-child) {
	margin-bottom: 5px;
}
.modal.modal-sources .lit-id,
.modal.modal-lightbox .source-list .lit-id {
	min-width: 40px;
	text-align: right;
	padding-right: 10px;
}

.modal-footer button,
.modal-footer a {
	min-width: 60px; /* gleiche Breite für Ja/Nein */
}

/** LIGHTBOX **/

.img-box {
	padding-left: 0px !important;
	margin: 1rem 0 1.5rem 0;
}

.img-box li {
	width: 55%;
	min-width: 200px;
	margin: 0 auto;
	position: relative;
	list-style-type: none;
}
.img-box li:first-child {
	cursor: pointer;
}

.img-box.fachinfo {
	margin: 0;
}

.img-box.fachinfo li {
	max-width: 250px;
}

.zoom-overlay {
	position: absolute;
	opacity: 0.85;
	top: 50%;
	left: 50%;
	width: 80px;
	height: 80px;
	line-height: 70px;
	font-size: 40px;
	text-align: center;
	margin-left: -40px;
	margin-top: -40px;
	color: #999;
	border: 5px solid #999;
	border-radius: 100%;
	background: #fff;
}

.zoom-overlay.small {
	width: 50px;
	height: 50px;
	line-height: 45px;
	font-size: 24px;
	margin-left: -25px;
	margin-top: -25px;
	border: 3px solid #999;
}

.zoom-overlay.white {
	opacity: 0.9;
	color: #fff;
}

#zoom-notice {
	display: none;
}

/*
 * this lets the image load at full size, which is important for zooming in webkit browsers
 * http://iscrolljs.com/#zoom
 * scrolls only inside the img container
 */
.modal-lightbox #scroller,
#inline-scroller {
	overflow: hidden;
	margin: 0px auto;
/*	box-shadow: 0px 0px 4px #999;*/
	position: relative;
	/*min-height: 180px;*/ /* has to be this low for phone-landscape mode */
	text-align: left;
}

#inline-scroller.loaded img {
	max-width: none;
}

body.scroller-focus {
	overflow: hidden;
}

body.scroller-focus #inline-scroller {
	box-shadow: 0px 0px 4px #000;
}

#lightbox-image {
	height: auto !important;
	max-width: 100%;
}
#scroller.loaded #lightbox-image {
	max-width: none;
}

.img-box .img-thumbnail {
	background: #fafafa;
	min-height: 250px;
	width: 100%;
	display: inline-block;
}

.img-box .img-thumbnail.loaded {
	min-height: 0;
	background: none;
}

.img-thumbnail.full {
	padding: 0;
	border: 0;
}

.sources-link {
	-webkit-font-smoothing: antialiased;
	display: inline-block;
	font-style: normal;
	font-variant: normal;
	text-rendering: auto;
	line-height: 1;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	cursor: pointer;
	position: relative;
	top: -3px;
}

/* AG 2023-11-02: increase clickable area */
.sources-link,
.fa-exclamation-circle.offlabel,
.fa-info-circle.offlabel {
	padding: 4px;
	top: -4px;
	left: -4px;
	/* padding + left */
	margin-right: -8px;
}

.sources-link.top0 {
	top: 0;
}
.sources-link::before {
	content: "\f069"; /*asterisk*/
}
h5 .sources-link,
.h5 .sources-link {
	font-size: 1rem;
}

.img-box li .sources-link {
	position: absolute;
	top: -15px;
	right: -6px;
	left: auto;
	font-size: 1.25rem;
}

.modal-lightbox .modal-body {
	padding: 0;
}

.lightbox-nav {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 9px;
/*	margin-bottom: 12px;*/
	text-align: center;
	border-bottom: 1px solid #ddd;
/*	background: #ddd;*/
	height: 50px;
/*	overflow: hidden;*/
}

.modal-lightbox .close,
.modal-lightbox .fav-btn,
.modal-lightbox .src-btn {
	line-height: 1;
	margin-left: 0;
	margin-right: 0;
}

.modal-lightbox .btn-print-tab {
	margin: auto;
}

body.mobile .lightbox-nav {
    z-index: 1; /* above #scroller */
	background-color: rgba(255, 255, 255, 0.75);
	border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
	padding: 0 4px 0 8px;
}

@media (min-width: 600px) {
	body.mobile .lightbox-nav {
		position: absolute;
		top: 0;
		right: 0;
		height: 40px;
	}
}

body.mobile.ios .modal-lightbox .close {
	margin-top: -1.3rem;
}
body.mobile.android .modal-lightbox .close {
	margin-top: -1rem;
}
body.mobile .modal-lightbox .fav-btn,
body.mobile .modal-lightbox .src-btn {
/*	margin-top: -1rem;*/
}
body.mobile .modal-lightbox .src-btn {
	margin-right: 2px;
}

#lightbox-icons {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	white-space: nowrap;
    z-index: 1; /* above #scroller */
}

#lightbox-icon-rotate,
#lightbox-icon-zoom {
	display: inline-block;
}
#lightbox-icon-rotate img,
#lightbox-icon-zoom img {
	height: 50px;
}
#lightbox-icon-zoom img {
	margin-left: -4px;
}
#lightbox-icon-rotate img {
	padding: 8px 0 8px 8px;
}

body.mobile #lightbox-icons {
	display: block
}

body.mobile.ios.has-notch.landscape #lightbox-icons {
    left: 50px;
}

body.mobile.ios.has-notch.landscape .lightbox-nav {
    right: 50px;
}

body.mobile .modal-lightbox .close,
body.mobile .lightbox-nav .fav-btn,
body.mobile .lightbox-nav .src-btn {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}
.lightbox-nav .fav-btn,
.lightbox-nav .src-btn {
	position: relative;
	/*background: #fff;*/
	padding: 1rem 0.5rem;
/*	margin: -0.9rem 0 -1rem auto;*/
/*	margin-top: -0.9rem;*/
	cursor: pointer;
}
.lightbox-nav .fav-btn .fas,
.lightbox-nav .src-btn .fas,
.lightbox-nav .close {
	opacity: 1;
	color: #777;
}
.lightbox-nav .fav-btn:hover .fas,
.lightbox-nav .src-btn:hover .fas,
.lightbox-nav .close:not(:disabled):not(.disabled):hover {
	opacity: 1;
	color: #444;
}
.lightbox-nav .fav-btn .fa-star {
	font-size: 19px;
}
.lightbox-nav .src-btn .fas {
	font-size: 22px;
}
.lightbox-nav .fav-btn .fa-plus,
.lightbox-nav .fav-btn .fa-minus {
	position: absolute;
	font-size: 12px;
	top: 10px;
	right: 1px;
}

.modal-lightbox .modal-dialog {
	max-width: 1140px;
/*    margin: 0 auto;*/
}

.modal-lightbox .modal-content {
	border-radius: 0;
	border: 0;
}

body:not(.web) .modal-lightbox .modal-dialog {
/*    margin: 0 auto;*/
}

.caption-sources,
.source-list {
	padding-top: 5px;
}
.caption-sources a{
	word-break: break-all;
}

.lightbox-caption {
	display: inline-block;
	padding-top: 5px;
}



/** MORE **/

#more-links {
	display: flex;
	flex-wrap: wrap;
}

#more-links a {
	border: none;
	width: 50%;
	height: 2.8em;
	margin-bottom: 5px;
	padding-top: 0.6em;
	color: #fff;
	text-align: center;
	border-radius: 0px;
	transition: background 0.2s linear !important;
	border-right: 2.5px solid var(--bg-color);
	background: #666;
	white-space: nowrap; /* for rcc expert/-videos btn */
}

#more-links a:hover {
	background: #333;
}

#more-links a:nth-child(2n) {
	border-right: none;
	border-left: 2.5px solid var(--bg-color);
}


/** NEWS **/
#news,
#news_feed {
	padding: 0.75rem;
}
#news_feed .dropdown .btn {
	padding-right: 0;
}
#news_feed .dropdown li {
	padding: 0 10px;
}
#news_feed .btn-reset-selection {
	position: absolute;
	top: 1px;
	right: 1px;
	color: #999;
	padding: 5px;
	cursor: pointer;
	font-size: 20px;
	background: #fff;
	bottom: 1px;
	border-radius: 2px;
}
#news_feed .btn-reset-selection:hover {
	color: #333;
	/*text-shadow: 2px 1px #000;*/
}
#news_feed .dropdown-menu label,
#news_feed .form-check-input {
	cursor: pointer;
	margin-bottom: 0;
}
#news_feed .news-filter {
	margin-top: -0.5rem;
}
#news_feed .news-filter .col {
	padding-left: 0.25rem;
	padding-right: 0.25rem;
}

.news-container {
	/*margin: 10px 0;*/
	padding: 15px 5px;
	padding: 0.75rem;
	/*margin: 0.5rem 0;*/
}
.newsfeed .news-container:nth-child(2):not(.new) {
	/*padding-top: 0;*/
	border-top: 0;
}

.news-container:not(:last-child) {
	/*border-bottom: 1px solid #ddd;*/
}
.news-container {
	border-top: 1px solid #ddd;
}

.news-container a {
	word-break: break-word;
}

.news-container.new {
	/*background: var(--bg-color);*/
}

.news-header {
	display: flex;
	font-size: 14px;
	color: #A3A3A3;
	margin-bottom: 5px;
	align-items: flex-start;
}

.news-header .date {
	/*padding-right: 5px;*/
	margin-right: 0.25rem;
}
/* different category-icons */
.news-header .icon-box {
	display: inline-block;
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	font-size: 14px;
	line-height: 14px;
	text-align: center;
	margin-left: 0.25rem;
	padding: 2px;
	border-radius: 100%;
}
.news-header .fas {
	/*background: #0b0;*/
	color: #fff;
	vertical-align: middle;
	margin-top: 1px;
}

.news-header .fa-chalkboard-teacher {
	font-size: 12px;
}

.news-header .indis {
	padding-left: 10px;
	text-align: right;
	flex-grow: 1;
}

.news-headline h5 {
	margin-top: 0px;
	margin-bottom: 2px;
}

.news-header .header-daily {
	min-width: 70px;
/*	color: #0b0;*/
	font-weight: bold;
	margin-left: 3px;
}

.news-content p {
	margin-bottom: 2px;
}

.icon-inbox {
	display: inline-block;
	float: right;
	position: relative;
}

.last-visit {
	text-align: right;
	color: #aaa;
	font-size: 12px;
}

/* news_daily combo */
.news-container {
	margin: 0.75rem 0;
	padding: 0.5rem;
}
.newsfeed .news-container:nth-child(2):not(.new) {
	border-top: 1px solid #ccc;
}
.news-type-2 {
	/*background: #ded;*/
}
.news-type-2.new {
	/*background: #dfd;*/
}
.news-link img {
	max-width: 100%;
}


/* SPONSOR/PARTNER LOGOS */

.ow-sponsor-logos-wrapper,
.ow-partner-logos-wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
/*    align-items: stretch;*/
}

/* only wrap if there are more logos than fit in one row */
/*
.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-3,
.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-4,
.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-5,
.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-6,
.ow-sponsor-logos-wrapper.logos-per-row-3.num-sponsors-4,
.ow-sponsor-logos-wrapper.logos-per-row-3.num-sponsors-5,
.ow-sponsor-logos-wrapper.logos-per-row-3.num-sponsors-6,
.ow-sponsor-logos-wrapper.logos-per-row-4.num-sponsors-5,
.ow-sponsor-logos-wrapper.logos-per-row-4.num-sponsors-6 {
    flex-wrap: wrap;
}

.ow-partner-logos-wrapper {
    flex-wrap: wrap;
}
*/

.ow-sponsor-logo,
.ow-partner-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	width: 100%;
	max-width: 48%;
	background: #fff;
	border-radius: 10px;
	margin: 1%;
}

.ow-sponsor-logo img,
.ow-partner-logo img {
	max-width: 100%;
	max-height: 100px;
}
#splashscreen  .ow-partner-logo img {
	max-height: 60px;
}

.ow-sponsor-logos-wrapper.logos-per-row-2 .ow-sponsor-logo {
	max-width: 48%;
}
.ow-sponsor-logos-wrapper.logos-per-row-3 .ow-sponsor-logo {
	max-width: 31.3333%;
}
.ow-sponsor-logos-wrapper.logos-per-row-4 .ow-sponsor-logo,
.ow-partner-logos-wrapper.num-partners-1 .ow-partner-logo,
.ow-partner-logos-wrapper.num-partners-2 .ow-partner-logo,
.ow-partner-logos-wrapper.num-partners-3 .ow-partner-logo,
.ow-partner-logos-wrapper.num-partners-4 .ow-partner-logo {
	max-width: 23%;
}
.ow-sponsor-logos-wrapper.logos-per-row-5 .ow-sponsor-logo,
.ow-partner-logos-wrapper.num-partners-5 .ow-partner-logo {
	max-width: 18%;
}
.ow-sponsor-logos-wrapper.logos-per-row-6 .ow-sponsor-logo,
.ow-partner-logos-wrapper.num-partners-6 .ow-partner-logo {
	max-width: 14.6666%;
}

.ow-sponsor-logos-wrapper.logos-per-row-1 {
	flex-direction: column;
	align-items: center;
}

.ow-sponsor-logos-wrapper.logos-per-row-1 .ow-sponsor-logo {
	max-width: 30%;
}

.ow-sponsor-logos-wrapper.logos-per-row-all {
	max-width: 100%;
}

@media (min-width: 500px) {
	/* force break after 2 elements, but use minimal width required (RCC) */
	.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-3 .ow-sponsor-logo,
	.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-4 .ow-sponsor-logo,
	.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-5 .ow-sponsor-logo,
	.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-6 .ow-sponsor-logo {
		max-width: 32%;
	}

	/* force break after 3 elements, but use minimal width required */
	.ow-sponsor-logos-wrapper.logos-per-row-3.num-partners-4 .ow-sponsor-logo,
	.ow-sponsor-logos-wrapper.logos-per-row-3.num-partners-5 .ow-sponsor-logo,
	.ow-sponsor-logos-wrapper.logos-per-row-3.num-partners-6 .ow-sponsor-logo {
		max-width: 24%;
	}
}

@media (min-width: 650px) {
	/* no break, reduce whitespace */
	.ow-sponsor-logos-wrapper.logos-per-row-1.num-sponsors-1 .ow-sponsor-logo,
	.ow-sponsor-logos-wrapper.logos-per-row-2.num-sponsors-2 .ow-sponsor-logo {
		max-width: 30%;
	}
}

@media (max-width: 649.98px) {
	.ow-sponsor-logos-wrapper.num-sponsors-5,
	.ow-partner-logos-wrapper.num-partners-5 {
		justify-content: center;
	}

	.ow-sponsor-logos-wrapper.num-sponsors-5 .ow-sponsor-logo,
	.ow-partner-logos-wrapper.num-partners-5 .ow-partner-logo,
	.ow-sponsor-logos-wrapper.num-sponsors-6 .ow-sponsor-logo,
	.ow-partner-logos-wrapper.num-partners-6 .ow-partner-logo {
		max-width: 31.3333%;
	}
}

@media (max-width: 499.98px) {
	html.d1 .ow-sponsor-logos-wrapper .ow-sponsor-logo,
	html.d1 .ow-partner-logos-wrapper .ow-partner-logo {
		max-width: 48% !important;
	}
}

/* to limit the height of all logo containers, set logosMaxHeight in data.js an constants_app.php */

.ow-sponsor-logos-wrapper.logos-max-height-95 .ow-sponsor-logo img {
	max-height: 95px;
}
.ow-sponsor-logos-wrapper.logos-max-height-90 .ow-sponsor-logo img {
	max-height: 90px;
}
.ow-sponsor-logos-wrapper.logos-max-height-85 .ow-sponsor-logo img {
	max-height: 85px;
}
.ow-sponsor-logos-wrapper.logos-max-height-80 .ow-sponsor-logo img {
	max-height: 80px;
}
.ow-sponsor-logos-wrapper.logos-max-height-75 .ow-sponsor-logo img {
	max-height: 75px;
}
.ow-sponsor-logos-wrapper.logos-max-height-70 .ow-sponsor-logo img {
	max-height: 70px;
}
.ow-sponsor-logos-wrapper.logos-max-height-65 .ow-sponsor-logo img {
	max-height: 65px;
}
.ow-sponsor-logos-wrapper.logos-max-height-60 .ow-sponsor-logo img {
	max-height: 60px;
}
.ow-sponsor-logos-wrapper.logos-max-height-55 .ow-sponsor-logo img {
	max-height: 55px;
}
.ow-sponsor-logos-wrapper.logos-max-height-50 .ow-sponsor-logo img {
	max-height: 50px;
}

/* to scale single logos inside of their container, set size in data.js and constants_app.php */

.ow-sponsor-logo img.logo-size-125 {
	transform: scale(1.25);
}
.ow-sponsor-logo img.logo-size-120 {
	transform: scale(1.20);
}
.ow-sponsor-logo img.logo-size-115 {
	transform: scale(1.15);
}
.ow-sponsor-logo img.logo-size-110 {
	transform: scale(1.10);
}
.ow-sponsor-logo img.logo-size-105 {
	transform: scale(1.05);
}
.ow-sponsor-logo img.logo-size-95 {
	transform: scale(0.95);
}
.ow-sponsor-logo img.logo-size-90 {
	transform: scale(0.90);
}
.ow-sponsor-logo img.logo-size-85 {
	transform: scale(0.85);
}
.ow-sponsor-logo img.logo-size-80 {
	transform: scale(0.80);
}
.ow-sponsor-logo img.logo-size-75 {
	transform: scale(0.75);
}
.ow-sponsor-logo img.logo-size-70 {
	transform: scale(0.70);
}
.ow-sponsor-logo img.logo-size-65 {
	transform: scale(0.65);
}
.ow-sponsor-logo img.logo-size-60 {
	transform: scale(0.60);
}
.ow-sponsor-logo img.logo-size-55 {
	transform: scale(0.55);
}
.ow-sponsor-logo img.logo-size-50 {
	transform: scale(0.50);
}



#more_partners .ow-partner-logos-wrapper,
#more_sponsors .ow-sponsor-logos-wrapper {
    flex-wrap: wrap;
}

#more_partners .ow-partner-logo {
	width: 33.3333%;
}

@media (max-width: 499.98px) {
	#more_partners .ow-partner-logo {
		width: 50%;
	}
}

#more_sponsors .ow-sponsor-logo {
	border: 1px solid #e6e6e6;
	max-width: 33.3333%;
}


/** DISCLAIMER **/

#btn-scroll-to-bottom {
	position: fixed !important;
	top: 86px;
	right: 10px;
	line-height: 2;
	cursor: pointer;
}

.disclaimer-btns {
	text-align: center;
}

.disclaimer-btns button {
	width: 40%;
	max-width: 200px;
	margin: 0 5px;
}

/*** LOGIN ***/

#sp-login {
	width: 100%;
	max-width: 450px;
	margin: 0px auto;
	background: #fff;
	border-radius: 10px;
	/*overflow: hidden;*/
	/*border: 1px solid #ccc;*/
}

#sp-login-header {
	height: 60px;
	border-bottom: 2px solid #eee;
	border: 0 !important;
/*	background-position: 50% 50% !important;*/
    background: #fff url(../img/logos/logo_onkowissen.png) no-repeat 50% 50%;
    background-size: auto 50px;
}

#sp-login form {
	max-width: 250px;
	margin: 0 auto;
}

.login-content {
/*	padding: 14px 10px 10px 10px;*/
	padding-top: 1rem;
	/*border-bottom: 1px solid #ccc;*/
}

.login-content .separator {
	font-size: 14px;
	text-align: center;
    width: 250px;
    margin: 0 auto;
    display: flex;
    gap: 1rem;
    align-items: center;
}

.login-content .separator hr {
    height: 1px;
    background: #CCCCCC;
    width: 100%;
    border: 0;
}

.login-content .separator p {
/*    font-size: 16px;*/
	line-height: 1;
    text-align: center;
    margin: 0.5em 0;
    color: #999999;
}

.remember-login {
	color: #666;
	font-size: 12px;
	line-height: 12px;
	margin-top: 15px;
}

.remember-login input {
	float: left;
	margin-right: 5px;
}

.remember-login label {
	font-weight: bold;
	cursor: pointer;
}

#sp-login .needLogin {
	margin: 0;
	text-align: left;
	padding: 10px;
	background-color: #eee;
}

#sp-name,
#sp-password {
	width: 100%;
	padding: 5px 6px 3px 6px;
	font-size: 13px;
	background: #fff;
	border: 0;
	border-bottom: 2px solid #ddd;
	outline: none;
}

#sp-name:hover,
#sp-password:hover {
	border-bottom: 2px solid #bbb;
}

#sp-submit,
#sp-register {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 35px;
	border-radius: 2rem;
	font-weight: 500;
	border: 1px solid #9c3;
	background: #9c3;
	color: #fff;
	margin: 8px auto 4px auto;
}
#sp-register {
	background: #2a70ac;
	border-color: #2a70ac;
}
#sp-submit:hover {
	background: #8b2;
}
#sp-register:hover {
	background: #1f6099;
}

/* hide arrow */
#sp-register::before {
	display: none !important;
}

#sp-login .form-group {
	margin-bottom: 8px;
}

.sp-links {
	width: 100%;
	margin: 4px auto;
	text-align: center;
}

.sp-links a {
	font-size: 11px;
	color: #666 !important;
	text-decoration: none;
}

#login-info {
	padding-bottom: 20px;
}

.ng-toast {
	margin-top: 100px;
}

.ng-toast__message .alert {
	box-shadow: 0px 0px 10px #333 !important;
}

@media (min-width: 375px) {
	.modal-login-warning .modal-dialog {
		max-width: 350px;
	}
	.modal-login-warning .modal-dialog {
	    max-width: 350px;
	    margin: 1.75rem auto;
	}
}


.modal-login-warning {
	color: #2a70ac;
}
.modal-login-warning img {
	max-width: 240px;
	max-height: 75px;
	margin-bottom: 10px;
}
.modal-login-warning h5 {
	margin-bottom: 1rem;
	font-size: 1.1rem;
}
.modal-login-warning .close {
	padding-top: 0;
}
.modal-login-warning span {
	display: inline-block;
	font-size: 14px;
	/*line-height: 14px;*/
}
.modal-login-warning a {
	max-width: 200px;
	border: 1px solid #2a70ac !important;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 1rem;
}
.modal-login-warning a.btn-primary,
.modal-login-warning a.btn-outline-primary:hover {
	background: #2a70ac !important;
}
.modal-login-warning a.btn-primary:hover {
	background: #1f6099 !important;
}
.modal-login-warning a.btn-outline-primary {
	color: #2a70ac;
}
.modal-login-warning a.btn-outline-primary:hover {
	color: #fff;
	/*border-color: #2a70ac;*/
}

/** Social Login Buttons **/

.gsi-material-button {
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
	-webkit-appearance: none;
/*	background-color: #f2f2f2;*/
	background-color: #fff;
	background-image: none;
	border: 1px solid #999;
	-webkit-border-radius: 2rem;
	border-radius: 2rem;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	color: #444;
	cursor: pointer;
	/*  font-family: 'Roboto', arial, sans-serif;*/
	font-size: 14px;
	height: 35px;
	letter-spacing: 0.25px;
	outline: none !important;
	overflow: hidden;
	padding: 0 12px;
	position: relative;
	text-align: center;
	-webkit-transition: background-color .218s, border-color .218s, box-shadow .218s;
	transition: background-color .218s, border-color .218s, box-shadow .218s;
	vertical-align: middle;
	white-space: nowrap;
	width: 100%;
	/* for BC */
	max-width: 270px;
	min-width: min-content;
	min-width: 200px;
}

.gsi-material-button .gsi-material-button-icon {
/*  height: 25px;*/
  margin-right: 8px;
/*  min-width: 25px;*/
  width: 18px;
  font-size: 1rem;
}

#btn-apple-login .gsi-material-button-icon {
	font-size: 1.4rem;
	line-height: 1;
}

.gsi-material-button .gsi-material-button-content-wrapper {
  -webkit-align-items: center;
  align-items: center;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  height: 100%;
  justify-content: center;
  position: relative;
  width: 100%;
}

.gsi-material-button .gsi-material-button-contents {
/*  -webkit-flex-grow: 1;*/
/*  flex-grow: 1;*/
/*  font-family: 'Roboto', arial, sans-serif;*/
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
}

.gsi-material-button .gsi-material-button-state {
  -webkit-transition: opacity .218s;
  transition: opacity .218s;
  bottom: 0;
  left: 0;
  opacity: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.gsi-material-button:disabled {
  cursor: default;
  background-color: #ffffff61;
}

.gsi-material-button:disabled .gsi-material-button-state {
  background-color: #1f1f1f1f;
}

.gsi-material-button:disabled .gsi-material-button-contents {
  opacity: 38%;
}

.gsi-material-button:disabled .gsi-material-button-icon {
  opacity: 38%;
}

.gsi-material-button:not(:disabled):active .gsi-material-button-state,
.gsi-material-button:not(:disabled):focus .gsi-material-button-state {
  background-color: #001d35;
  opacity: 12%;
}

/*.gsi-material-button:not(:disabled):hover {
  -webkit-box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15);
  box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15);
}*/

.gsi-material-button:not(:disabled):hover .gsi-material-button-state {
  background-color: #001d35;
  opacity: 8%;
}



/** NOTES & FAVORITES **/

#notes ul,
#favorites ul,
.med-search #search-result {
	padding: 0;
}

#notes li,
#favorites li {
	list-style-type: none;
	cursor: pointer;
	background: #999;
	color: #666;
	margin-bottom: 5px;
	border-left: 5px solid #999;
	/*transition: all 0.2s linear !important;*/
	transition: background 0.25s linear, color 0.25s linear;
}

#favorites li {
	display: flex;
	min-height: 40px;
	align-items: stretch;
	border: 0px;
	color: #fff;
}

#favorites li a {
	display: flex;
	align-items: center;
	width: 100%;
	padding: 5px 10px;
}

#favorites .fa-times {
	font-size: 1.7em;
}

#favorites p {
	color: #555;
	margin-left: 10px;
}

#favorites li .text {
	flex-grow: 1;
	margin: 0 5px 0 3px;
}

#notes li {
	padding: 7px;
}

#notes li.active {
	background: #ddd;
	color: #333;
	border-color: #337ab7;
	transition: all 0.2s linear !important;
}

#notes li:hover {
	background: #ccc;
	color: #000;
	border-color: #337ab7;
}

#favorites li:hover {
	background: #666;
	transition: background 0.25s linear, color 0.25s linear;
}

#notes li:nth-last-child(2) {
	margin-bottom: 10px;
}

#notes li b {
	float: left;
	margin-right: 10px;
}

#notes li .text {
	display: inline-block;
	max-width: 40%;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	vertical-align: middle;
}

#notes li .date {
	float: right;
	font-size: 12px;
	color: #666;
	margin-right: 3px;
	line-height: 24px;
}

#notes li .fas {
	margin-left: 10px;
	font-size: 24px;
}

#favorites li .fa-share {
	margin-left: 0px;
	margin-right: 5px;
	top: 5px;
	font-size: 16px;
}


#notes li .fa-times {
	color: #900;
	padding: 6px 10px;
	background: #fff;
	border-radius: 100%;
	width: 36px;
	height: 36px;
}

#notes li .fa-plus {
	color: #090;
	font-size: 18px;
}

#note-form {
	width: 67%;
	min-width: 300px;
	margin: 20px auto 0px auto;
}

#notes #note-title {
	width: 100%;
	margin-bottom: 3px;
}

#notes #note-text {
	width: 100%;
	height: 150px;
	margin: 0px auto;
}


/* Kacheln - Grade - nav-tabs */

.kachel ul.nav.nav-tabs {
	border: 0;
	margin-bottom: 1.5rem;
}

.kachel ul.nav.nav-tabs li {
	width: 22%;
	margin-left: 2%;
	margin-right: 2%;
	text-align: center;
}

.kachel ul.nav.nav-tabs li a {
	margin: 0;
	/*color: #555;*/ /* where? */
	color: #fff;
	border: none;
	padding: 0.5rem 0.25rem;
}

.kachel ul.nav.nav-tabs li:first-child {
	margin-left: 0;
}

.kachel ul.nav.nav-tabs li:last-child {
	margin-right: 0;
}

.tab-pane p {
	position: relative;
}
/* expanded content inside list */
/*.card-body > ul > ul,*/
/*
.card-body > ul ul,
.view-content:not(.filter-view) ul .show {
	display: inline-block;
	width: 100%;
	margin-bottom: 0.5rem;
}
*/

ul.collapse .show li:last-child,
ul.collapsing .show li:last-child {
	/*margin-bottom: 0.5rem !important;*/
}

/* make collapsible spans behave like divs to enable animation */
span.collapse:not(.keep-inline),
span.collapsing:not(.keep-inline),
span.collapse.in:not(.keep-inline) {
    display: block;
    /*height: auto;*/
}
/* reapply bootstrap default */
span.collapse:not(.show) {
	display: none;
}

/* remove transition (300ms) for spans (inline = no animation to wait for) */
span.collapse.keep-inline,
span.collapsing.keep-inline,
span.collapse.in.keep-inline,
/**
 * disable closing animations of first level accordions (dynamically included subviews)
 * by adding class "disable-closing-animation" to uib-accordion
 * see Mamma - subs_ziel.html
 */
.disable-closing-animation > div > div > .collapsing:not(.show),
div.ow-closing .collapsing:not(.show) {
    -webkit-transition: none !important;
	transition: none !important;
}

/*** Nebenwirkungen Tabellen ***/

table.table-nebensub td {
	width: 50%;
}

@media (min-width: 1200px) {
	table.table-nebensub {
		width: 67%;
	}
}





/** VIDEO */

video {
	width: 100%;
	border: 1px solid #bbb;
	margin-top: 10px;
}
.video-box {
	display: flex;
}
.video-box .left {
	float: left;
	width: 65%;
	align-self: center;
	padding-right: 5px;
}
.video-box .right {
	/*display: inline-block;*/
	width: 35%;
	/*float: none;*/
}
.video-preview {
	display: block;
	/* TODO check iOS; iOS failed - why was this disabled???*/
	position: relative;
}
.video-preview img {
	display: inline-block;
	max-width: 100%;
	border: 1px solid #666;
	border-radius: 10px;
}
.video-preview .fas {
	background: transparent;
	color: #fff;
	border-color: #fff;
	opacity: 1;
}
body.android .video-preview .fas::before {
	display: block;
	margin-top: -3px;
}
.modal-video .modal-dialog {
	max-width: 800px;
}
@media (max-width: 815.98px) {
	.modal-video .modal-dialog {
		margin: 0.5rem;
	}
}
.modal-video .video-box .left {
	width: 100%;
}
/* video preview image */
.maxw-500 {
	max-width: 500px;
}



/********** Tools **********/
/* rcc, cme_rcc, tcc **/

.tools-calc form,
.tools_model form {
	max-width: 300px;
	margin: 0 auto;
}
.tools-calc .input-group .input-group-text {
	justify-content: center;
    padding: 0.375rem 0;
}
.tools-calc .input-group-append.switch {
	width: 186px;
	margin-left: 1px;
}
.tools-calc .input-group .input-group-text:first-child,
.tools-calc .input-group-prepend.switch,
.tools-calc .input-group-append.switch-right {
	width: 114px;
	font-size: 13px;
}
.tools-calc .input-group-prepend.switch > .btn,
.tools-calc .input-group-append.switch > .btn,
.tools-calc .input-group-append.switch-right > .btn {
	width: 100%;
}
.tools-calc .input-group input[type=text] {
	text-align: right;
	font-size: 14px;
}
.tools-calc .btn.invisible,
.tools_model .btn.invisible {
	position: absolute;
}
.calc-result,
.calc-result2 {
	width: 300px;
	text-align: center;
	margin-top: 15px;
	font-size: 18px;
	color: #888;
}
.calc-result2 {
	margin-top: 5px;
	color: #888;
}
.calc-result-value {
	font-weight: bold;
	font-size: 20px;
	color: #000;
}
.tools-calc table {
	min-width: 300px;
	font-size: 13px;
	margin-top: 5px;
	border: 2px solid #ddd;
}
.tools-calc .formula-divider {
	margin: 2px;
	border-color: #000;
}
.tools-calc td > span,
.tools-calc-td > span {
	text-align: center;
	float: left;
}
.tools-calc table tr:not(:last-child) {
	border-bottom: 2px solid #ddd;
}
.tools-calc table th {
	text-align: center;
	font-size: 15px;
}
.tools-calc table td,
.tools-calc table th {
	padding: 8px;
}
.tools-calc table td:first-child {
	border-right: 2px solid #ddd;
}
.calc-internal-link {
	display: block;
	font-size: 12px;
	text-decoration: underline;
}
.calc-take-link {
	margin-top: 10px;
	display: block;
	text-align: center;
	text-decoration: underline;
	font-size: 12px;
}
.radic {
	float: left;
	font-size: 48px;
	line-height: 28px;
	font-weight: lighter;
}
.h-40 {
	height: 40px;
}
.fs-14 {
	font-size: 14px;
}
.ml-m7 {
	margin-left: -7px;
}
.ml-m7 span:first-child {
	border-top: 1px solid #000;
	padding: 2px 5px 0px 5px;
}



/* equations (io/bio_pd1, cme_io/mech_bio, nsclc/diag_molekular) */
.equation-box {
	font-style: italic;
	overflow-x: auto;
	white-space: nowrap;
	margin: 10px 0;
	text-align: center;
}
.equation-box-inner {
	float: left;
	border: 1px solid #ccc;
	padding: 10px;
}

.fraction {
	display: inline-block;
	vertical-align: middle;
	margin: 0 0.2em 0.4ex;
	text-align: center;
}

.fraction > span {
	display: block;
	padding-top: 0.15em;
}

.fraction span.fdn {
	border-top: thin solid black;
}

.fraction span.bar {
	display: none;
}

/* force visible scollbars on mobile (apply to scrollable container like .equation-box above) */

.force-scrollbar::-webkit-scrollbar {
    -webkit-appearance: none;
}

.force-scrollbar::-webkit-scrollbar:vertical {
    width: 12px;
}

.force-scrollbar::-webkit-scrollbar:horizontal {
    height: 12px;
}

.force-scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, .5);
    border-radius: 10px;
    border: 2px solid #eee;
}

.force-scrollbar::-webkit-scrollbar-track {
    /*border-radius: 10px;*/
    background-color: #eee;
}

.table.force-scrollbar {
    border: none;
    -webkit-overflow-scrolling: auto; /* only works on iOS12 and below */
}

.mobile-image-map-fix {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 9999;
}

/* horizontally scroll tables on phones */
.mw-450 {
	min-width: 450px;
}

.mw-700 {
	min-width: 700px;
}

/* image linking to acc, see uppergi - diag_oesoph.html */
.img-link-wrapper {
	background: #e2e2e2;
	text-align: center;
	position: relative;
	margin-bottom: 25px;
}
.img-link {
	position: relative;
	max-width: 600px;
	margin: 0 auto;
}
.img-link img {
	width: 100%;
	padding: 0;
	border: 0;
	border-radius: 0;
}
.img-link-wrapper span {
    position: absolute;
    bottom: -20px;
    left: 10px;
	top: initial;
    font-size: 1rem;
}
.img-link span {
	position: absolute;
	top: 5px;
	right: 5px;
	font-size: 1.25rem;
	z-index: 3;
}
.img-link:hover {
	background: #000;
}

#search-wrapper {
	position: fixed;
	z-index: 5;
	top: 0;
	left: 0;
	min-width: 285px;
/*	max-width: 500px;*/
/*	margin-left: -100px;*/
	white-space: nowrap;
	padding: 0.25rem 1rem;
}

#search-wrapper.open {
	background: #fff;
	box-shadow: 0 0 10px #444;
}

#search-value {
	display: inline-block;
	width: 200px;
	padding-right: 25px;
}

#search-result-header {
	display: none;
}

#search-results {
	display: none;
	max-height: 500px;
	overflow-y: auto;
	margin-bottom: 1rem;
	padding-bottom: 0.5rem;
	list-style-type: none;
	padding-left: 0;
}

#search-wrapper.open #search-results,
#search-wrapper.open #search-result-header {
	display: block;
}

#search-results a {
	white-space: normal;
}

#btn-search-reset {
	margin-left: -25px;
	opacity: 0.5;
	cursor: pointer;
}

#btn-search-reset:hover {
	cursor: pointer;
	opacity: 1;
}

#btn-search-toggle {
	display: none;
	cursor: pointer;
	position: absolute;
	top: 15px;
	right: 15px;
	font-size: 20px;
}

#search-wrapper.has-content #btn-search-toggle {
	display: inline-block;
}

body.search-enabled #header ul.row {
	padding-bottom: 15px;
}

#more_images table td:first-child {
	word-break: break-word;
}

#more_images table td:first-child div {
	position: relative;
	display: inline-block;
	cursor: pointer;
}

#more_images table td.img-size {
	min-width: 120px;
}
.more-images-img {
	max-width: 300px;
	max-height: 300px;
}