/* Fullscreen-Knopf ist immer sichtbar. Das ist wichtig, um sich aus einem IFrame zu befreien. */
.fullscreen-button.hidden{
  display: block !important;	
}

/* Das Startlogo skaliert nicht richtig mit der Breite. */
div.centered-box-content{
	width: 100%;
    height:auto;
}
div.centered-box-content img{
	width: 100%;
	max-width: 400px;
}

/* Mit MP 2.23.0 hat das Legendenfenster einen Bug. Der CSS-Selektor auf ID und Klasse überschreibt den Wert.
   Die Fenster werden über CSS+Style verschoben - "!important" in den CSS-Regeln macht das Fenster unverschiebbar.
 */
div#legend.legend {
	left: calc(100% - 650px);
}
div#legend.legend-mobile{
	left: 0px ;
}

/*Die Bilder in den GFI-Popups sind zu groß eingestellt*/
.gfi-theme-images-image{
	max-width:200px
}

/*TODO: Berlin Style Anpassungen - aufräumen/besser kommentieren*/


/*schwarze buttons */
#masterportal-container button.control-icon {
    background-color: black;
    color: #fff;
    pointer-events: all;
    cursor: pointer;
    border: 0;
}

/*button hover berlin-rot*/
#masterportal-container .control-icon:hover {
    background-color: #e40422;
}

/*button active auf berlin-rot */
#masterportal-container .control-icon:active {
    background-color: #e40422;
}

/*lokalisieren-icon/button bei aktivierung rot */
#masterportal-container .orientationButtons>.toggleButtonPressed {
    background-color: #e40422;
}

/*button-fokus schwarz */
#masterportal-container .control-icon:focus {
    background-color: black;
    outline: 1px solid white;
}

/*koordinatenanzeige hintergrund schwarz*/
#masterportal-container .mouse-position {
    display: flex;
    flex-direction: row;
    background-color: black;
    color: #fff;
    font-size: 11px;
    line-height: 24px;
    min-height: 24px;
    transition: 1s ease-out;
    transform: translateZ(0);
}

/*hauptmenü dunkelgrau hover */
#root .tabable:hover, ul#tree .tabable:hover, ul#legend-menu .tabable:hover, .portal-title .tabable:hover {
    opacity: 1;
    background-color: #424242;
    color: #fff;
    cursor: pointer;
}


/* aktiver menüpunkt dunkelgrau */
.dropdown-menu>.active>a.nav-link {
    background-color: #424242;
    color: #fff;
}

/*aktives hauptmenü gehovert in schwarz */
#root .tabable:hover.btn-select, #root .tabable:hover:active, #root .tabable:hover.active, #root .tabable:hover:checked, #root .tabable:hover::selection, #root .tabable:hover.show, #root .tabable:hover[aria-expanded=true], ul#tree .tabable:hover.btn-select, ul#tree .tabable:hover:active, ul#tree .tabable:hover.active, ul#tree .tabable:hover:checked, ul#tree .tabable:hover::selection, ul#tree .tabable:hover.show, ul#tree .tabable:hover[aria-expanded=true], ul#legend-menu .tabable:hover.btn-select, ul#legend-menu .tabable:hover:active, ul#legend-menu .tabable:hover.active, ul#legend-menu .tabable:hover:checked, ul#legend-menu .tabable:hover::selection, ul#legend-menu .tabable:hover.show, ul#legend-menu .tabable:hover[aria-expanded=true], .portal-title .tabable:hover.btn-select, .portal-title .tabable:hover:active, .portal-title .tabable:hover.active, .portal-title .tabable:hover:checked, .portal-title .tabable:hover::selection, .portal-title .tabable:hover.show, .portal-title .tabable:hover[aria-expanded=true] {
    background-color: black;
    border-radius: .25rem;
}

/*kartenausschnitt vorwärts/rückwärts mit weißem icon und grauem hintergrund (deaktiviert)*/
#masterportal-container .control-icon:disabled {
    background-color: #999999;
	cursor: not-allowed !important;
    color: white;
    cursor: default;
}

/*suchknopf rot */
.btn-search:hover {
    background-color: #e40422;
    color: #fff;
}

/*suchumrandung rot */
input#searchInput.form-control:focus {
    border-color: #e40422;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(89 2 13 / 60%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(89 2 13 / 60%);
}
/*suchergebnis hover */
.dropdown-menu-search li:hover {
    cursor: pointer;
    opacity: 1;
    background-color: #E40422;
	color:white;
}

/*alle resultate schwarz*/
.results {
    background-color: black;
    font-size: 12px;
    text-align: right;
    padding: 6px;
    border-top-width: 2px;
    color: #fff;
}
/*hover rot*/
li.results:hover {
    opacity: 1;
    background-color: #E40422;
	color:white;
}
/*selektierte sucherkebnisse rot */
#searchInputUL .selected {
    background: #E40422;
    color: #fff;
}

/*legende schließen knopf hover rot */
#masterportal-container #legend .legend-title .close-legend:hover {
    opacity: 1;
    background-color: #E40422;
    color: #fff;
    cursor: pointer;
}

/*allgemeiner fenster-button-hover rot */
#masterportal-container .win-heading .heading-element>span:hover:not(.win-icon) {
    opacity: 1;
    background-color: #e40422;
    color: #fff;
    cursor: pointer;
}

/*minimierte Fenster schwarz */
#masterportal-container .tool-window-vue.is-minified .win-heading {
    background-color: black;
    border-bottom: none;
    overflow: hidden;
}
/*knöpfe in fenster/schlatflächen schwarz*/
.btn-primary {
    color: #fff;
    background-color: black;
    border-color: black;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.15),0 1px 1px rgba(0,0,0,.075);
}
/*knöpfe in fenster/schlatflächen hover-rot*/
.btn-primary:hover {
    color: #fff;
    background-color: #e40422;
    border-color: white;
}
/*bootstrap-icon hover*/
#masterportal-container #modal-1-container .bootstrap-icon:hover {
    opacity: 1;
    background-color: #E40422;
    color: #fff;
    cursor: pointer;
}

/*transparenz-button schwarz/weiß hover */
ul#tree .layer-settings .bootstrap-icon:hover {
	background-color: white;
	color: black;
    font-size: 15px;
    padding: 0px;
}

/*Info und Legende schließen button hover rot */
#masterportal-container .tool-window-heading .heading-element .bootstrap-icon:hover {
    opacity: 1;
    background-color: #E40422;
    color: #fff;
    cursor: pointer;
}

/*infofenster header hover auf weiß/schwarz */
#masterportal-container .tool-window-heading .heading-element>h2:hover:not(.win-icon) {
    opacity: 1;
    background-color: white;
    color: black;
    cursor: pointer;
}
#masterportal-container .tool-window-heading .heading-element>h2:hover:not(.win-icon).btn-select, #masterportal-container .tool-window-heading .heading-element>h2:hover:not(.win-icon):active, #masterportal-container .tool-window-heading .heading-element>h2:hover:not(.win-icon).active, #masterportal-container .tool-window-heading .heading-element>h2:hover:not(.win-icon):checked, #masterportal-container .tool-window-heading .heading-element>h2:hover:not(.win-icon)::selection, #masterportal-container .tool-window-heading .heading-element>h2:hover:not(.win-icon).show, #masterportal-container .tool-window-heading .heading-element>h2:hover:not(.win-icon)[aria-expanded=true] {
    background-color: white;
    border-radius: .25rem;
    color: black;
}

/*ausgewählte karten schwarz und unterstrichen und mit leicht grauem hintergrund */
ul#tree .checked {
    color: black;
    text-decoration: underline;
}


/*datei-import dateiablage schwarz */
#masterportal-container .drop-area-fake {
    background-color: #fff;
    border-radius: 12px;
    border: 2px dashed black;
    padding: 24px;
    transition: background .25s,border-color .25s;
}
#masterportal-container .drop-area-fake p.caption {
    margin: 0;
    text-align: center;
    transition: color .35s;
    font-family: "MasterPortalFont Bold","Arial Narrow",Arial,sans-serif;
    font-size: 16px;
    color: black;
}
#masterportal-container .upload-button-wrapper {
    color: #fff;
    background-color: black;
    display: block;
    text-align: center;
    padding: 8px 12px;
    cursor: pointer;
    margin: 12px 0 0 0;
    font-size: 14px;
}
#masterportal-container .upload-button-wrapper:hover {
    opacity: 1;
    background-color: #e40422;
    color: #fff;
    cursor: pointer;
}

/*slide-show knöpfe schwarz statt blau */
.slider-handle {
    background-color: #0478b2;
    background-image: -moz-linear-gradient(top, #0480BE, #036fa5);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0480BE), to(#036fa5));
    background-image: -webkit-linear-gradient(top, #0480BE, #036fa5);
    background-image: -o-linear-gradient(top, #0480BE, #036fa5);
    background-image: linear-gradient(to bottom, black, black);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0480BE', endColorstr='#036fa5',GradientType=0);
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    position: absolute;
    top: 0;
    width: 20px;
    height: 20px;
    background-color: black;
    border: 0px solid transparent;
}
.slider-tick.in-selection {
    background-color: #e40422;
    background-image: -moz-linear-gradient(top, #52c5ff, #3abcfd);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#52c5ff), to(#3abcfd));
    background-image: -webkit-linear-gradient(top, #52c5ff, #3abcfd);
    background-image: -o-linear-gradient(top, #52c5ff, #3abcfd);
    background-image: linear-gradient(to bottom, #999999, #999999);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#52c5ff', endColorstr='#3abcfd',GradientType=0);
    opacity: 1;
}

/*GFI-Footer schaltflächen-größe 12 px*/
.gfi-footer {
    color: #424242;
    font-size: 12px;
}
/* disabled-pager farbe weiß */
.gfi-footer .disabled {
    cursor: not-allowed;
    background-color: #fff;
    color: white;
}
.gfi-footer .pager:hover {
    background-color: white;
    padding: 6px;
    cursor: pointer;
    width: 50%;
    margin: 0;
    text-align: center;
    list-style: none;
}
.gfi-footer .disabled:hover {
    cursor: not-allowed;
    background-color: #fff;
    color: white;
}

/*gfi-fenster schließen-button rot:hover*/
#masterportal-container button.close:hover {
	opacity: 1;
	background-color: #e40422;
	color: #fff;
	cursor: pointer;
}
/*gfi-fenstertitel abkürzen */
#masterportal-container .gfi-header h5 {
    font-size: 13px;
    font-family: "MasterPortalFont Bold","Arial Narrow",Arial,sans-serif;
    line-height: 17px;
    color: #424242;
    padding-top: 10px;
    padding-left: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
	max-width: calc(100% - 20px);
}
/*beim hover wieder komplett zeigen*/
#masterportal-container .gfi-header h5:hover{
    overflow: visible; 
    white-space: normal;
	height:auto;
}

/*gfi-fenster vergrößern*/
#masterportal-container .gfi-content {
    max-height: 50vh;
    width: 100%;
}

/*inhaltsbaum: nicht verfügbare kartenlayer (aufgrund von maßstab) - hintergrund rosa, schrift kursiv */
.list-group-item.disabled, .list-group-item:disabled {
	color: #6c757d;
	pointer-events: none;
	background-color: #FCE5E8;
	font-style: italic;
}
/*inhaltsbaum-menü verbreitert */
ul#tree {
    border: none;
    font-family: "MasterPortalFont Bold","Arial Narrow",Arial,sans-serif;
    padding: 0;
    min-width: 448px;
}
/*inhaltsbaum lange layernamen kürzen */
ul#tree ul .title {
    padding: 4px 0 0 5px;
    font-size: 12px;
    cursor: pointer;
    max-width: 300px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
/*bei hover wieder lang*/
ul#tree ul .title:hover {
    overflow: visible; 
    white-space: normal;
	height:auto;
}
/*Ordner in leichtem hellgrau, um sie von den layern (weiß) im inhaltsbaum zu unterscheiden - gerade bei den einrückungen macht das layer/ordner unterscheidbarer */
ul#tree .themen-folder {
    font-weight: 400;
    background: #f8f9fa;
}

/*hilfe-button hover rot */
.btn-search-question > .bootstrap-icon:hover {
	background-color: #e40422;
	color: #fff;
}
/*hilfe TOC-Buttons hover rot */
#masterportal-container .table-of-contents > a:hover, #masterportal-container .table-of-contents a:focus {
	background-color: #e40422;
	color: #fff;
	cursor: pointer;
}


/* link-farben/hover setzen im footer */
#masterportal-container #portal-footer a:hover {
    opacity: 1;
    background-color: #e40422;
    color: #fff !important;
    cursor: pointer;
}

/*link-farben auf gestaltungsblau auf blau*/
a {
    color: #324FA3;
    text-decoration: none;
}
a:hover {
    color: #324FA3;
	text-decoration: underline;
	
}
.nav-link {
    display: block;
    padding: .9375rem 1rem;
    color: #324FA3;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
}
.nav-link:hover, .nav-link:focus {
    color: #324FA3;
	text-decoration: underline;
}

/*koordinaten-hint auf schwarz*/
#masterportal-container .hint {
    margin: 5px 0 25px;
    text-align: center;
    color: black;
    transition: color .35s;
}

/*zeichnen-tool buttons schwarz*/
.btn-primary:disabled, .btn-primary.disabled {
    color: #fff;
    background-color: black;
    border-color: black;
}
/*opacity auf 1, damit der button auch schwarz erscheint */
.btn:disabled, .btn.disabled, fieldset:disabled .btn {
    pointer-events: none;
    opacity: 1;
    box-shadow: none;
}
/*zeichnen-button hover schwarz*/
.btn-secondary:hover {
    color: white;
    background-color: black;
    border-color: black;
}
/*legendenfenster mit drop-shadow und rahmen wie das informationsfenster und andere "floating-fenster" */
#masterportal-container #legend .legend-window {
    position: absolute;
    min-width: 200px;
    max-width: 600px;
    margin: 10px 10px 30px 10px;
    background-color: #fff;
    z-index: 9999;
    border: 1px solid #e3e3e3;
    box-shadow: 8px 8px 12px rgba(0,0,0,.176);
}
/*print-button active-state schwarz*/
.btn-check:checked+.btn-primary, .btn-check:active+.btn-primary, .btn-primary:active, .btn-primary.active, .show>.btn-primary.dropdown-toggle {
    color: #fff;
    background-color: black;
    border-color: white;
}
.btn-check:focus + .btn-primary, .btn-primary:focus {
    color: #fff;
    background-color: black;
    border-color: black;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.15),0 1px 1px rgba(0,0,0,.075),0 0 0 .25rem rgba(38,79,122,.5);
}
/* Übersichskarte Bounding-Box overlay*/
#overviewmap-wrapper .ol-overviewmap .ol-overviewmap-box {
    border: 2px solid #e40422;
}
/*portal-Titel Hintergrundtab ohne dunkelgraues hover */
.portal-title .tabable:hover {
	opacity: 1;
	background-color: white;
	color: #000;
	cursor: pointer;
}
/*portal-Titel verkleinert und mittig platziert*/
#masterportal-container .portal-title a h1 {
	color: #333;
	/* margin-left: 5px; */
	font-size: 22px;
	font-family: "MasterPortalFont","Arial Narrow",Arial,sans-serif;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: inline-block;
	vertical-align: middle;
	margin-top: 8px;
}
/*titel(layer) im infofenster beim Hover wieder ganz anzeigen*/
#masterportal-container .subtitle:hover {
	overflow: visible; 
    white-space: normal;
}
/*Ebenen, die nicht angezeigt werden können (Maßstab) werden rosa hinterlegt und die Schrift kursiv*/
ul#tree .dropdown-item.disabled, ul#tree .dropdown-item:disabled {
    background-color: #ffe8ea;
    font-style: italic;
}
/*hover-Text "in dieser Zoomstufe nicht" wird wieder angezeigt - pointer-Events */
.dropdown-item.disabled, .dropdown-item:disabled {
	color: var(--bs-dropdown-link-disabled-color);
	pointer-events: auto;
	background-color: transparent;
}
/*Suchergebnis-Mousehover statt rot in hellgrau, damit es mit der schwarzen Schrift besser lesbar ist */
.dropdown-menu-search li:hover {
    cursor: pointer;
    background-color: lightgrey;
    color:black;
    opacity: 1;
}
.dropdown-menu-search .list-group-item-theme {
	font-style: normal;
	padding-left: 10px;
}

/*Downloadlinks ausblenden*/
li.nav-item[value="LayerInfoDataDownload"]{
	display:none;
}