/*!
 * Checkmk (https://checkmk.com)
 * @link https://checkmk.com
 * @copyright Copyright (c) 2022 Tribe29 GmbH. (https://www.tribe29.com)
 *
 * Addons for nagscreen and overlay for main page. Merge to primary CSS when sufficiently tested.
 */

/* define a scroll margin */

main content {
	scroll-padding-top: 5.5rem;
}

#nagolddocsouter {
	position: fixed;
	right: 20px;
	top: 90px;
	z-index: 100;
	width: 280px;
}

#nagolddocsinner {
	position: relative;
	padding: 1rem;
	padding-bottom: 0rem;
	font-family: helvetica, tahoma;
	border: 2px solid red;	
	margin:0 auto;
	/* -webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px; */
	background: white;
	box-shadow: 5px 5px 10px 6px rgba(0,0,0,0.30);
}

#nagolddocsinner:before {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: 68px;
	top: -17px;
	border-left: 14px solid transparent;
	border-right: 14px solid transparent;
	border-bottom: 17px solid red;
}

#nagolddocsinner:after {
	content: ' ';
	position: absolute;
	width: 0;
	height: 0;
	left: 71px;
	top: -14px;
	border-left: 11px solid transparent;
	border-right: 11px solid transparent;
	border-bottom: 14px solid white;
}

#nagolddocsinner p.right {
	text-align: right;
}

#glossary_overlay {
	display: none;
	position: fixed;
	top: 10px;
	left: 10px;
	border: 1px solid lightgray;
	z-index: 1100;
	background-color: white;
	width: 40%;
	padding: 4px;
	box-shadow: 0 3px 6px rgba(29,29,27,.2);
}

#toctitle {
	text-transform: none;
}

/* Find external links and glossary links: */

main div.sectionbody a[href^="http"] {
	background: transparent url(../../assets/images/external_links.svg) center right no-repeat;
	background-size: 14px;
    padding-right: 16px;
}

main div.sectionbody a[href*="glossar.html"] {
	background: transparent url(../../assets/images/info.svg) center right no-repeat;
	background-size: 14px;
    padding-right: 16px;
}

/* remove upper case for h3 */

.main-nav h3 {
	text-transform: none;
}

/* Admonitions can be used to highlight important text blocks */

div.admonitionblock {
	margin-bottom: 1rem;
}

div.admonitionblock table {
    width: 100%;
    border-spacing: 0;
    border-collapse: separate;
    border-style: solid;
    border-width: .15rem;
    border-color: lightgray;
    border-radius: .35rem;
}

div.admonitionblock table tr td {
    margin: 0px;
}

div.admonitionblock table tr td.icon {
    padding: 4px;
    width: 40px;
    vertical-align: top;
}

div.admonitionblock table tr td.content {
    padding: 6px;
}

/* Collapsibles */

div.hiddenelements {
	display: none;
}

div.exampleblock.collapsible [hidden] {
    display: block!important;
}

div.exampleblock.collapsible {
	border-style: solid;
    border-width: .075rem;
    border-color: lightgray;
    border-radius: .35rem;
	padding: 0.5rem;
	margin-bottom: 0.5rem;
}

div.exampleblock.collapsible > div.content {
	display: block;
	width: 100%;
    border-style: solid;
    border-width: 0rem;
    border-color: lightgray;
    border-radius: .35rem;
	padding: 0.5rem;
	padding-bottom: 0rem;
	/* margin-bottom: 1rem; */
	overflow: hidden;
	/* transform: scaleY(0);
	transition: transform 0.3s ease-out; */
}

div.exampleblock.collapsible > div.content.collapsed {
	/* display: none; */
	/* height: 0px; */
}

div.exampleblock.collapsible > div.title { 
	display: block;
	font-weight: 600;
	/* margin-bottom: 0.75rem; */
	font-size: 1rem;
    cursor: pointer;
	scroll-margin: 85px;
}

div.exampleblock.collapsible > div.title:hover {
	/* text-decoration: underline; */
	/* text-decoration-color: #15d1a0; */
	/* text-decoration-thickness: .125rem; */
	/* text-underline-offset: .25rem; */
	/* background-color: #edf0f2; */
}

div.exampleblock.collapsible > div.expanded { 
	/* margin-bottom: 1rem; */
}

div.exampleblock.collapsible > div.title::before {
  content: ' ';
  display: inline-block;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 5px solid currentColor;
  vertical-align: middle;
  margin-right: .7rem;
  transform: translateY(-4px);
  transition: transform 0.3s ease-out;
}

div.exampleblock.collapsible > div.expanded::before {
  transform: rotate(90deg) translateX(-3px);
  transition: transform 0.3s ease-out;
}

table.tablecollapsible {
	position: relative;
}

table.tablecollapsible > tfoot > tr.expanderhack > td {
	border-bottom-width: 0;
	border-left-width: 0;
	border-right-width: 0;
}

/* Remove from normal flow for collapsed table */

table.tablecollapsible > tfoot > tr.expanderhack > td > div.expander {
	visibility: visible;
	cursor: pointer;
}

table.tablecollapsible > tfoot > tr.expanderhack.collapsed > td > div.expander {
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 1001;
	width: 101%;
	background: linear-gradient(transparent, 10%, white);
	padding-top: 3rem;
	padding-bottom: 0.25rem;
	margin-left: -0.5%;
	margin-right: -0.5%;
}

table.tablecollapsible > tfoot > tr.expanderhack > td > div.expander > span {
	display: flex;
	align-items: center;
	text-align: center;
	font-weight: 600;
}

table.tablecollapsible > tfoot > tr.expanderhack > td > div.expander > span:hover {
	text-decoration: underline;
	text-decoration-color: #15d1a0;
	text-decoration-thickness: .125rem;
	text-underline-offset: .25rem;
	background-color: #edf0f2;
}

table.tablecollapsible > tfoot > tr.expanderhack > td > div.expander > span.hidden {
	display: none;
}

table.tablecollapsible > tfoot > tr.expanderhack > td > div.expander > span::before,
table.tablecollapsible > tfoot > tr.expanderhack > td > div.expander > span::after {
	content: '';
	flex: 1;
	border-bottom: 2px solid #d1d7e2;
}

table.tablecollapsible > tfoot > tr.expanderhack > td > div.expander > span:not(:empty)::before {
	margin-right: .25rem;
}

table.tablecollapsible > tfoot > tr.expanderhack > td > div.expander > span:not(:empty)::after {
	margin-left: .25em;
}

/* Add to normal flow for expanded table */

table.tablecollapsible > tfoot > tr.expanderhack.expanded {
	visibility: visible;
}

table.tablecollapsible > tfoot > tr.expanderhack.expanded > td > div.expander.expanded {
	display: block;
	position: static;
}

table.tablecollapsible div.expandinfo {
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 1001;
	width: 100%;
	height: 1rem;
	border: 3px solid red;
}

table.tablecollapsible tr {
	transition: transform 0.3s ease-out;
	visibility: visible;
}

table.tablecollapsible tr.collapsed {
	visibility: collapse;
}

/* Lightboxes */

img.openslightbox {
	cursor: zoom-in;
}

div.lboverlay {
	display: flex;
	flex-flow: column;
	align-items: center;
	justify-content: flex-end;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgb(241 241 241 / 80%);
	backdrop-filter: blur(0.5rem);
	z-index: 1200;
	transform: scale(1) translate(100%, 0);
	transition: transform 0.2s ease-out;
}

div.lboverlay div.lbimg img {
	cursor: zoom-out;
}

div.lboverlay div.lbmoveback {
	position: fixed;
	top: 47%;
	left: 0;
	/* width: 15%;
	height: 60%;
	cursor: w-resize; */
	z-index: 1500;
	cursor: pointer;
	font-size: 4rem;
	text-shadow: -0.3rem 0rem 0.2rem white;
}

div.lboverlay div.lbmoveforward {
	position: fixed;
	top: 47%;
	right: 0;
	/* width: 15%;
	height: 60%;
	cursor: e-resize; */
	z-index: 1500;
	cursor: pointer;
	font-size: 4rem;
	/* color: rgb(80 80 80); */
	text-shadow: 0.3rem 0rem 0.2rem white;
}

div.lboverlay div.lbclose {
	position: fixed;
	top: 0;
	right: 0;
	/* width: 15%;
	height: 60%;
	cursor: e-resize; */
	z-index: 1502;
	cursor: pointer;
	font-size: 3rem;
	/* color: rgb(80 80 80); */
	text-shadow: 0.3rem 0rem 0.2rem lightgray;
}

div.lboverlayshow {
	transform: scale(1) translate(0, 0);
	transition: transform 0.2s ease-out;
}

div.lboverlay .lbstretcher {
	flex: 1 0 auto;
	border-style: solid;
	border-width: 0px;
	border-color: red;
	min-height: 0;
}

div.lboverlay .lbimg {
	flex: 0 1 auto;
	border-style: solid;
	border-width: 0px;
	border-color: green;
	min-height: 0;
	width: 100%;
	padding: 1rem;
	text-align: center;
}

div.lboverlay div.lbbreadcrumb {
	flex: 1 0 auto;
	border-style: solid;
	border-width: 0px;
	border-color: red;
	max-width: 840px;
	margin: 0.5rem;
}

div.lboverlay div.lbbreadcrumb .lbheader {
	font-weight: 600;
	font-style: italic;
}

div.lboverlay div.lbbreadcrumb .lbscrolllink {
	text-decoration: underline;
	text-decoration-color: #15d1a0;
	text-decoration-thickness: .125rem;
	text-underline-offset: .25rem;
	cursor: pointer;
}

div.lboverlay div.lbbreadcrumb .lbscrolllink:hover {
	background-color: #edf0f2;
	cursor: pointer;
}

div.lboverlay div.lbcaption {
	flex: 0 0 auto;
	border-style: solid;
	border-width: 0px;
	border-color: red;
	max-width: 840px;
	margin: 0.5rem;
}

div.lboverlay img {
	object-fit: contain;
	transition: transform 0.2s ease-out;
}

div.lboverlay img.stretchimg {
	width: 100%;
	height: 100%;
	object-fit: contain;
	transition: transform 0.2s ease-out;
}


/* Tab groups */

div.dlist {
	scroll-margin: 70px;
}

/* Do not show the dt per default */

div.exampleblock.tabs [hidden] {
    display: block!important;
}

div.exampleblock.tabs div.dlist dl dt.hdlist1 {
	display: none;
}

div.exampleblock.tabs div.dlist dl dt.hdlist1.showme {
	display: inline-block;
}

div.tabgroup {
	display: flex;
	flex-flow: row;
}

div.tabgroup.dontshow {
	display: none;
}

div.tabgroup div.tab {
	flex: 0 0 auto;
}

div.tabgroup div.tab, div.exampleblock.tabs div.dlist dl dt.hdlist1.showme {
	border-style: solid;
    border-width: 1px;
    border-color: lightgray;
    border-radius: 5px;
	border-bottom-left-radius: 0rem;
	border-bottom-right-radius: 0rem;
	padding: 0.5rem;
	margin-bottom: -1px;
	border-bottom-width: 0;
	color: #61707C;
	
	/* Text formatting inspired by current h4 settings */
    font-family: Bio Sans, sans-serif;
    font-weight: 600;
    line-height: 1.2;
	font-size: 1.125rem;
}

div.tabgroup div.tab.active, div.exampleblock.tabs div.dlist dl dt.hdlist1.showme {
	color: #000000;
	background-color: rgb(255 255 255 / 1.0);
	margin-bottom: -2px;
}

div.tabgroup div.tab:hover, div.exampleblock.tabs div.dlist dl dt.hdlist1.showme:hover {
	/* text-decoration: underline; */
	/* text-decoration-color: #15d1a0; */
	/* text-decoration-thickness: .125rem; */
	/* text-underline-offset: .25rem; */
	background-color: #edf0f2;
	cursor: pointer;
}

div.tabgroup div.tab.active:hover, div.exampleblock.tabs div.dlist dl dt.hdlist1.showme:hover {
	text-decoration: none;
	background-color: #ffffff;
}

div.dlist > dl > dd > div.openblock > div.content {
	border-style: none;
	padding: 0.5rem;
}

/* make sure this padding does not trickle down */

div.exampleblock div.dlist dd {
	border-style: solid;
    border-width: .09rem;
    border-color: lightgray;
    border-radius: 0rem;
	display: block;
}

div.exampleblock div.dlist dd[hidden] {
	border-width: 0rem;
	margin-top: 0rem;
	margin-bottom: 0rem;
}


/* div.exampleblock div.dlist dd.invisible {
	display: none;
} */

/* Allow pseudo h4 within tab groups */

div.exampleblock div.dlist dd div.openblock .h4 {
	font-family: Bio Sans, sans-serif;
    font-weight: 600;
    line-height: 1.2;
}

div.exampleblock div.dlist dd div.openblock .h5 {
	font-family: Bio Sans, sans-serif;
    font-weight: 600;
    line-height: 1.2;
}

/* Allow lists with short entries to display in multiple columns */ 

div.ulist.multicol, div.olist.multicol {
	columns: 3;
}

/* Make sure we get absolute positioned things right */

div.listingblock.copybutton div.content {
	position: relative;
}

/* Add padding to make sure the copy button does not cover anything */

div.listingblock.copybutton > div.content > pre {
	padding-right: 3.3rem;
}

/* Hover and feedback */

div.listingblock.copybutton div.hoverbox,
div.listingblock.copybutton div.feedbackbox,
div.listingblock.copybutton div.errorbox {
	display: block;
	position: absolute;
	top: -2.25rem;
	right: 0;
	z-index: 120;
	color: black;
	background-color: rgba(240, 240, 240, 1);
	font-size: 0.8rem;
	padding: 0.3rem;
	border: 1px solid gray;
	border-radius: .35rem;
	opacity: 1;
	transition: opacity 0.3s ease-in-out;
}

/* only change z-index in case more than one box is shown accidentally at the same time */

div.listingblock.copybutton div.feedbackbox {
	z-index: 122;
}
div.listingblock.copybutton div.errorbox {
	z-index: 123;
}

/* do not show per default */

div.listingblock.copybutton div.hoverbox.noshow,
div.listingblock.copybutton div.feedbackbox.noshow,
div.listingblock.copybutton div.errorbox.noshow {
	display: none;
}

/* start the fade-in */

div.listingblock.copybutton div.feedbackbox.start,
div.listingblock.copybutton div.hoverbox.start, 
div.listingblock.copybutton div.errorbox.start {
	display: block;
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

div.listingblock.copybutton pre code {
	float: left;
}

div.listingblock.copybutton div.cpbuttonbox {
	display: block;
	position: absolute;
	top: 0.25rem;
	right: 0;
	z-index: 120;
	/* border: 1px solid red; */
	width: 2rem;
	height: 1.75rem;
	font-size: 1.25rem;
	padding: 0;
	cursor: pointer;
	color: white;
	background: #272822;	/* same as pygments monokai background */

}

div.listingblock.copybutton div.content .symbolcont {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 121;
	/* display: none; */
	/* float: right; */
	/* border: 1px solid darkgrey; */
	border-radius: .35rem;
	width: 1.75rem;
	height: 1.75rem;
	padding: 0.25rem;
	/* background-color: yellow; */
	/* background-image:url(/assets/images/adwaita_check.svg); */
	background-size: contain;
	background-repeat: no-repeat;
}

div.listingblock.copybutton div.content .confirmcont,
div.listingblock.copybutton div.content .errorcont {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	inset-block-start: 0;
	z-index: 122;
	/* display: none; */
	float: right;
	border: 0.05rem solid green;
	border-radius: .35rem;
	width: 1.75rem;
	height: 1.75rem;
	padding: 0.182rem;
	background-color: green;
	/* background-image:url(/assets/images/adwaita_check.svg); */
	background-size: contain;
	background-repeat: no-repeat;

	/* Transition analogous to that of feedbackbox - same time, same behavior */
	opacity: 1;
	transition: opacity 0.3s ease-in-out;
}

div.listingblock.copybutton div.content .errorcont {
	z-index: 123;
	background-color: red;
	border: 0.05rem solid red;
}

div.listingblock.copybutton div.content .confirmcont.noshow,
div.listingblock.copybutton div.content .errorcont.noshow {
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

div.listingblock.copybutton div.content .confirmcont.start,
div.listingblock.copybutton div.content .errorcont.start {
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

/* div.listingblock.copybutton div.content .confirmcont img,
div.listingblock.copybutton div.content .symbolcont img {
	height: 1.25rem;
	width: 1.25rem;
} */

div.listingblock.copybutton div.content.cpinprogress .confirmcont,
div.listingblock.copybutton div.content.cpinprogress .errorcont {
	transition: opacity 0.2s ease-in-out;
	opacity: 1;
}

div.listingblock.copybutton div.content {
	/* transform: scaleX(1); */
	transition: transform 3.0s ease-out;
}

div.listingblock.copybutton div.content.cpinprogress {
	/* transform: scaleX(-1); */
	transition: transform 3.0s ease-out;
}

div.listingblock.copybutton div.content.cpinprogress pre > code {
	/* font-weight: bold; */
	/* color: white; */
}

div.listingblock.copybutton div.content > pre > code > span.being-copied,
div.listingblock.copybutton div.content > pre > code > span.being-copied > span {
	/* color: white; */
	transition: background-color 0.2s linear;
	background-color: rgba(131, 128, 255, 1);
	color: #ffffff;
	/* background: linear-gradient(
        90deg,
        rgba(255, 0, 0, 1) 0%,
        rgba(255, 154, 0, 1) 10%,
        rgba(208, 222, 33, 1) 20%,
        rgba(79, 220, 74, 1) 30%,
        rgba(63, 218, 216, 1) 40%,
        rgba(47, 201, 226, 1) 50%,
        rgba(28, 127, 238, 1) 60%,
        rgba(95, 21, 242, 1) 70%,
        rgba(186, 12, 248, 1) 80%,
        rgba(251, 7, 217, 1) 90%,
        rgba(255, 0, 0, 1) 100%
    ); */
}

div.listingblock.copybutton div.content > pre > code > span,
div.listingblock.copybutton div.content > pre > code > span > span {
	transition: opacity 3s ease-in-out;
}

div.listingblock.copybutton div.content > pre > code > span.has-been-copied,
div.listingblock.copybutton div.content > pre > code > span.has-been-copied > span {
	transition: background-color 0.2s linear;
	/* background-color: rgba(131, 128, 255, 0); */
	/* background-color: #272822; */
	/* color: #ffffff; */
	/* background: linear-gradient(
        90deg,
        rgba(255, 0, 0, 0) 0%,
        rgba(255, 154, 0, 0) 10%,
        rgba(208, 222, 33, 0) 20%,
        rgba(79, 220, 74, 0) 30%,
        rgba(63, 218, 216, 0) 40%,
        rgba(47, 201, 226, 0) 50%,
        rgba(28, 127, 238, 0) 60%,
        rgba(95, 21, 242, 0) 70%,
        rgba(186, 12, 248, 0) 80%,
        rgba(251, 7, 217, 0) 90%,
        rgba(255, 0, 0, 0) 100%
    ); */
}

div.listingblock.copybutton div.content.cpinprogress > pre > code > span.is-ignored,
div.listingblock.copybutton div.content.cpinprogress > pre > code > span.is-ignored > span {
	/* transition: opacity 0.2s ease-in-out; */
	/* color: rgb(39, 40, 34); */
	/* opacity: 0.7; */
}

/* @keyframes toGreenButton {
	from {
		background-color: rgb(39, 40, 34);
	}
	to {
		background-color: green;
	}
}

@keyframes toCopyButton {
	from {
		background-color: green;
	}
	to {
		background-color: rgb(39, 40, 34);
	}
} */

div.listingblock.copybutton div.content > pre > div.symbolcont {
	/* animation-name: toCopyButton;
	animation-duration: 10.0s; */
}

/* div.listingblock.copybutton div.content.cpinprogress > pre > div.symbolcont {
	animation-name: toGreenButton;
	animation-duration: 0.1s;
} */

/* Colors for tips */

div.admonitionblock.tip table {
    border-color: lightgray;
}

div.admonitionblock.tip table tr td.icon {
    background-color: lightgray;
}

/* Colors for important hints */

div.admonitionblock.important table {
    border-color: #ffef11;
}

div.admonitionblock.important table tr td.icon {
    background-color: #ffef11;
}

/* Keyboard macros */

kbd {
	border: 0.1rem solid lightgray;
	box-shadow: 0.05rem 0.05rem 0.1rem gray;
	border-radius: 0.25rem;
	padding: 0.1rem;
	padding-left: 0.2rem;
	padding-right: 0.2rem;
	margin: 0.1rem;
}

kbd.keyseq {
	border: none;
	box-shadow: none;
	padding: 0;
	margin: 0;
}

/* TUI screenshots taken with VTE to HTML export */

div.tuiscreen {
    width:100%;
}

div.tuiscreen div.tuicenter, div.tcolscreen div.tcolcenter {
    display: flex;
    justify-content: center;
    align-items: center;
}

div.tuiscreen div.tuicenter pre {
    background-color:#12488B;
    padding:1em;
    padding-left:0.5em;
}

div.tcolscreen div.tcolcenter pre {
    padding:1em;
    padding-left:0.5em;
}

/* Three column layout and overlay for new landing page */

.morelink { text-align: right; }
.outercols {
	/* clear: both; */
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	margin-bottom: 30px;
}
.outercols .col {
	/* float: left;
	width: 33%;
	margin-left: 0px;
	margin-right: 0px; */
	flex: 33.3%;
	padding-left: 0px;
	padding-right: 40px;
}
/* .outercols:after {
	content: "";
	display: table;
	clear: both;
} */
.innercols {
	display: flex;
}
.innercols .col  {
	flex: 50%; 
}

.lbox img {
	float: right;
}
.lbox {
	clear: both;
}
img.ytpreview { width: 100%; }

/* Consistent hover */

div.main-nav__content h3:hover {
	color: #15d1a0;
}

div.main-nav__content h3 div.ulist  ul {
	transition-property: display;
	transition-duration: 1s;
}

#topicopaque {
	position: absolute; top: 0px; left: 0px; 
	height: 100%;
	width: 100%;
	background-color:rgba(255,255,255,0.90); 
	z-index: 129;
	display: none;
}

#topicshadow {
	position: relative;
	margin: 50px;
	margin-top: 30px;
	background-color: whitesmoke;
	box-shadow: 5px 5px 10px 6px rgba(0,0,0,0.15);
	padding: 20px;
}

div.ytpreview {
	padding: 0px;
	position: relative;
	float: right;
}

div.ytwrapper {
	max-width: 480px;
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	margin-bottom: 20px;
}

div.ytvideo {
	position: relative;
	padding-bottom: 56.25%; /* - 16:9 aspect ratio (most common) */
	/* padding-bottom: 62.5%; - 16:10 aspect ratio */
	/* padding-bottom: 75%; - 4:3 aspect ratio */
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}

div.ytvideo iframe,
div.ytvideo object,
div.ytvideo embed {
	border: 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* Modifications for featured topic on start page */

#ytbox {
	position: relative;
	cursor: pointer;
}

.ytbanderole {
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	background-color:rgba(0,0,0,0.50); 
	padding: 4px;
	color: white;
}

#morebutton {
	border-radius: 4px;
	background-color: #15d1a0;
	color: white;
	padding: 4px;
}

#morebutton:hover, #morebutton:visited, #morebutton:active, 
div.closeonly a:hover, div.closeonly a:visited, div.closeonly a:active, div.closeonly a:link
{
	border-radius: 4px;
	background-color: #15d1a0;
	color: white;
	padding: 4px;
}

p.buttonright {
	text-align: right;
}

/* For highlighted spans, all elements that look like pygments tokens need black color */
 span.hll [class^="tok-"] {
	color: black;
}

/* When navigating in the search, highlight unified */

div.search-modal__results.modal-body {
	padding: 0rem;
}

div.search-modal__results.modal-body div.search-modal__results__result {
	padding: 1rem;
	margin-bottom: 0rem;
	margin: 0rem;
}

/* Search got a breadcrumb */

div.header-top__search__results__breadcrumb {
	font-size: 80%;
	font-style: italic;
}

/* Treat the hint on all results and search help as the elements above */

a.header-top__search__results__more {
	border-bottom: 1px solid #d1d7e2;
}

a.header-top__botbox__first {
	display: block;
	text-align: center;
	font-weight: 700;
	margin: 1.75rem;
	margin-bottom: 1.25rem;
}

a.header-top__botbox__button {
	display: block;
	text-align: center;
	/* font-weight: 700; */
	margin: 1.75rem;
	margin-bottom: 2.5rem;
	margin-top: 1.25rem;
}

a.header-top__botbox__button span {
	color: white;
	background: linear-gradient(270deg, #6966E5 0%, #8380FF 100%);
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 4px;
	/* background-image: url(/assets/images/ask_checkmk_ai.svg);
	background-repeat: no-repeat; */
	padding: 0.75rem 1.5rem;
}

a.header-top__botbox__button span img {
	display: inline-block;
	vertical-align: top;
	height: 1.25rem;
	width: 1.25rem;
	margin-right: 0.6rem;
}

/* Footer showing last commit */

hr.lastmodruler {
	height: 0.15rem;
	background-color: lightgray;
	border: none;
}

div.lastmodbox {
	text-align: left;
	font-style: italic;
	margin-bottom: 1.25rem;
	font-size: 0.95rem;
}

/* TUI screen color definitions */

span.tui-back-black {
	background-color: #1d1d1b;
}

span.tui-back-grey, span.tui-back-light-grey {
	background-color: #6c757d;
}

span.tui-back-light-grey {
	background-color: #D0CFCC;
}

span.tui-back-blue {
	background-color: #0086ff;
}

span.tui-back-deep-blue {
	background-color: #12488B;
}

span.tui-back-blue, span.tui-back-deep-purple {
	background-color: #171421;
}

span span.tui-foreground-black {
	color: #1d1d1b;
}

span span.tui-foreground-grey, span span.tui-foreground-mid-grey {
	color: #6c757d;
}

span span.tui-foreground-white {
	color: #ffffff;
}

span span.tui-foreground-orange {
	color: #ffa042;
}

span span.tui-foreground-golden {
	color: #E9AD0C;
}

span span.tui-foreground-red {
	color: #ff3232;
}

span span.tui-foreground-soft-red {
	color: #F66151;
}

span span.tui-foreground-error-red {
	color: #C01C28;
}

span span.tui-foreground-blue {
	color: #0086ff;
}

span span.tui-foreground-link-blue {
	color: #2A7BDE;
}

span span.tui-foreground-cyan, span span.tui-foreground-light-cyan {
	color: #2aa1b3;
}

span span.tui-foreground-deep-purple {
	color: #171421;
}

/* Fixes for presentation of code snippets */

div.paragraph code:not(.hljs), div.paragraph kbd, div.paragraph pre, div.paragraph samp, td p.tableblock code:not(.hljs), li p code:not(.hljs), table thead tr th code:not(.hljs) {
	font-size: 1.0rem;
	/* line-height: 1.5rem; */
}

.darkblue {
	color: #2760aa;
}

div.tuiscreen pre {
	/* line-height: 1.0rem; */
	line-height: 120%;
}


h4 code:not(.hljs), h4 pre, .h4 code:not(.hljs), .h4 pre, div.sect2 h4 span code:not(.hljs) {
	font-size: 1.125rem;
}

h3 code:not(.hljs), h3 pre, .h3 code:not(.hljs), .h3 pre, div.sect2 h3 span code:not(.hljs) {
	font-size: 1.25rem;
}

h2 code:not(.hljs), h2 pre, .h2 code:not(.hljs), .h2 pre, div.sect1 h2 span code:not(.hljs) {
	font-size: 1.5rem;
}

#toc a code:not(.hljs), #toc a pre {
	font-size: 0.875rem;
}

/* Media specific stuff goes here */

@media only screen and (max-width: 1420px) {
	
}

@media only screen and (max-width: 1200px) {
	/* fine adjustments for the new landing page */
	#topicshadow {
		margin: 15px;
		margin-top: 15px;
		padding: 8px;
	}
	img.ytpreview { 
		width: 90%;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	h3, h4 {
		margin-top: 15px;
	}
}

@media only screen and (max-width: 992px) {
	#nagolddocsinner:before {
		content: ' ';
		position: absolute;
		width: 0;
		height: 0;
		left: 148px;
		top: -17px;
	}
	#nagolddocsinner:after {
		content: ' ';
		position: absolute;
		width: 0;
		height: 0;
		left: 151px;
		top: -14px;
	}
	/* fine adjustments for the new landing page */
	#nagolddocsinner:before {
		content: ' ';
		position: absolute;
		width: 0;
		height: 0;
		left: 148px;
		top: -17px;
	}
	#nagolddocsinner:after {
		content: ' ';
		position: absolute;
		width: 0;
		height: 0;
		left: 151px;
		top: -14px;
	}
	/*  columns for featured topics are stacked */
	.outercols {
		flex-wrap: nowrap;
		flex-direction: column;
	}
	.outercols .col {
		width: 100%;
	}
	.innercols {
		flex-wrap: nowrap;
		flex-direction: column;
	}
	.innercols .col  {
		width: 100%; 
	}
	#topicshadow {
		margin: 3px;
		margin-top: 0px;
		padding: 4px;
	}
	img.ytpreview { 
		width: 80%;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}
	h3, h4 {
		margin-top: 15px;
	}
}

@media only screen and (max-width: 768px) {
	
}

@media only screen and (max-width: 576px) {
   
}

/* min-width is only used for centering on landing page */
@media only screen and (min-width: 1650px) and (min-height: 980px) {
	#topicopaque {
		position: absolute; top: 0px; left: 0px; 
	}
	#topicshadow {
		margin: 50px;
		margin-top: 0px;
		position: absolute; top: 50%;
		transform: translate(0%, -50%);
	}
}

/* only conference banner */

div.footer_banner {
	position: fixed;
	bottom: 0px;
	left: 0px;
	z-index: 9999;
	width: 100%;
	background-color: rgb(30, 38, 46);
	padding: 12px 80px;
	min-height: 56px;
}

div.footer_banner_content {
	flex-direction: row;
	align-items: center;
	display: flex;
	justify-content: center;
	/* max-width: 1320px; */
}

div.footer_banner_content div.footer_banner_content_center {
	padding: 0 9%;
}

div.footer_banner_content div.footer_banner_content_center p {
	color: #fff;
	/* font-weight: 300; */
	text-align: center;
	font-size: 1.25rem;
}

div.footer_banner_content div.footer_banner_content_left {
	margin-bottom: 0;
	width: 240px;
	min-width: 240px;
}

div.footer_banner_content div.footer_banner_content_left img {
	width: 100%;
	height: auto;
	vertical-align: middle;
	box-sizing: border-box;
}

div.footer_banner_content div.footer_banner_content_right a:link,
div.footer_banner_content div.footer_banner_content_right a:active,
div.footer_banner_content div.footer_banner_content_right a:hover,
div.footer_banner_content div.footer_banner_content_right a:visited {
	font-size: 1.25rem;
	font-weight: 600;
	padding: 0.375rem 0.75rem ;
	line-height: 1.5;
	display: inline-block;
	white-space: nowrap;
	background-color: #15d1a0;
	color: white;
	border-radius: 3px;
	
}

div.footer_banner_content div.footer_banner_content_right a:hover {
	background-color: #38d8ae;
}

div.footer_banner_content div.footer_banner_content_right a:active {
	color: black;
}

div.footer_banner_close {
	position: absolute;
	top: 8px;
	right: 8px;
}
div.footer_banner_close button {
	background-color: transparent;
	background-image: url(/assets/images/banner_close.svg);
	background-position: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	border: none;
	box-shadow: none;
	height: 32px;
	outline: none;
	width: 32px;
}

a#conference_skyscraper {
	display: block;
	opacity: 1;
	transform: scale(1, 1);
	transition: transform 0.7s ease-in-out;
}

a#conference_skyscraper.invisible {
	display: block;
	transform: scale(1, 0);
	transition: transform 0.7s ease-in-out;
}

div.editioninfobox a.changeuserguide:link, div.editioninfobox a.changeuserguide:hover, div.editioninfobox a.changeuserguide:visited {
	text-decoration: underline;
	text-decoration-color: #15d1a0;
	text-decoration-thickness: .125rem;
	text-underline-offset: .25rem;
}

/* enhance printing */

@media print {
	body {
		font-family: Baskerville, serif;
	}
	
	div.header-top {
		display: none;
	}
	
	div.dropdown__related {
		display: none;
	}
	
	div.exampleblock.collapsible [hidden] {
		display: block!important;
	}
	
	div.collapsed [hidden] {
		display: block!important;
	}
	
	div.hiddenelements {
		display: block;
		width: 80%;
		border: 1mm solid red;
		border-radius: 5mm;
		break-after: page;
		margin: auto;
		margin-top: 8cm;
		padding: 1cm;
		vertical-align: middle;
	}
	
	div.hiddenelements.zero {
		display: none;
	}
	
	div.cpbuttonbox, div.hoverbox, div.feedbackbox, div.errorbox, div.symbolcont, div.errorcont, div.confirmcont {
		display: none;
		transform: scale(0);
	}
	
	div.footer_banner {
		display: none;
	}
}