/*@charset "utf-8";*/
/* CSS Document für die Styles für die KDSF-Module */
.h2-20{width:100%; max-width:800px; background-color:#4ca0a5; color:#ffffff; margin:1em auto; text-align:center}
.btn-v20-back{font-size:0.9rem !important; margin:-1em 0 0.5em 0 !important; vertical-align:center}
.h2-v20-link{font-style:italic; color:#004d61; text-decoration:underline}

main ul{ padding:0; margin: 0.5em 0 0em 1em; font-size:inherit; list-style-type:square;}
main ul li{ margin-bottom:0em;}

/************************************* 
 Basisdaten
*************************************/
/* Startseite */
.basisdatenGridKasten{background-color:#006d83; color:#ffffff; border-radius:0.25em; margin-bottom:0.5em; height:7.5em}
.basisdatenGridKasten-kontrastvoll{background-color:#000000; color:#ffffff; border-radius:0.25em; margin-bottom:0.5em; height:7.5em}
.myBasisdatenKasten{display:flex; position:relative; align-items:center; vertical-align:middle; width:100%; margin: 0em auto; height:4em; line-height:1.5}
.myBasisdatenKasten > span, .myBasisdatenButtonsKasten > span{display:inline-block; text-align:center; width:100%}
/* Iconbuttons */
.iconhuelle{display:inline-block; width:66px; margin:0 6px}
.iconbutton {width:66px; height:39px; perspective:1500}
.iconbutton:hover .turnaround { transform: rotateY(180deg); /* Beim Mouse-Over wird die Szene umgedreht */}
.iconbutton .front-baum { background: url(../img/icons/baum_button.png) 0 0 no-repeat; background-color:#006d83; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton .front-detail { background: url(../img/icons/details_button.png) 0 0 no-repeat; background-color:#006d83; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton .front-baum-kontrastvoll { background: url(../img/icons/baum_button.png) 0 0 no-repeat; background-color:#000000; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton .front-detail-kontrastvoll { background: url(../img/icons/details_button.png) 0 0 no-repeat; background-color:#000000; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton .back { background-color:#f07d00; color:white; line-height:37px; border:1px solid #f07d00; border-radius:0.25em}
.iconbutton .back-kontrastvoll { background-color:#000000; color:white; line-height:37px; border:1px solid #ffffff; border-radius:0.25em}
.turnaround { transition: 0.8s; transform-style: preserve-3d; position: relative; height: 100%;}
.front-baum, .front-detail, .back, .front-baum-kontrastvoll, .front-detail-kontrastvoll, .back-kontrastvoll {backface-visibility: hidden; position: absolute; width: 100%; height: 100%;}
.front-baum, .front-detail, .front-baum-kontrastvoll, .front-detail-kontrastvoll{ z-index: 2; }
.back {	transform: rotateY(180deg); z-index: 1; color:white; text-align:center}
.back-kontrastvoll {transform: rotateY(180deg); z-index: 1; color:white; text-align:center}
.back-h2 {font-size:.6em}
/* Iconbuttons small*/
.iconhuelle-small{display:inline-block; width:50px; margin:0 3px; cursor:pointer} /* width:54px */
.iconbutton-small {width:50px; height:39px; perspective:1500} /* width:54px */
.iconbutton-small:hover .turnaround-small { transform: rotateY(180deg); /* Beim Mouse-Over wird die Szene umgedreht */}
.iconbutton-small .front-baum-small { background: url(../img/icons/baum_button_small.png) 0 0 no-repeat; background-color:#006d83; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton-small .front-detail-small { background: url(../img/icons/details_button_small.png) 0 0 no-repeat; background-color:#006d83; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton-small .front-excel-small { background: url(../img/icons/excel_button_small.png) 0 0 no-repeat; background-color:#006d83; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton-small .back-small { background-color:#f07d00; color:white; line-height:37px; font-size:0.85em; border:1px solid #f07d00; border-radius:0.25em}
.turnaround-small { transition: 0.8s; transform-style: preserve-3d; position: relative; height: 100%;}
.front-baum-small, .front-detail-small, .front-excel-small, .back-small {backface-visibility: hidden; position: absolute; width: 100%; height: 100%;}
.front-baum-small, .front-detail-small, .front-excel-small { z-index: 2; }
.back-small {transform: rotateY(180deg); z-index: 1; color:white; text-align:center}
.back-small-h2 {font-size:.5em}
/* Iconbuttons very-small*/
.iconhuelle-very-small{display:inline-block; width:52px; cursor:pointer; vertical-align:top; margin-top:5px} /* width:54px */
.iconbutton-very-small {width:52px; height:31px; perspective:1500} /* width:54px */
.iconbutton-very-small:hover .turnaround-very-small { transform: rotateY(180deg); /* Beim Mouse-Over wird die Szene umgedreht */}
.iconbutton-very-small .front-baum-very-small { background: url(../img/icons/baum_button_very_small.png) 0 0 no-repeat; background-color:#006d83; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton-very-small .front-detail-very-small { background: url(../img/icons/details_button_very_small.png) 0 0 no-repeat; background-color:#006d83; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton-very-small .front-excel-very-small { background: url(../img/icons/excel_button_very_small.png) 0 0 no-repeat; background-color:#006d83; border:1px solid #ffffff; border-radius:0.25em}
.iconbutton-very-small .back-very-small { background-color:#f07d00; color:white; line-height:29px; border:1px solid #f07d00; border-radius:0.25em}
.turnaround-very-small { transition: 0.8s; transform-style: preserve-3d; position: relative; height: 100%;}
.front-baum-very-small, .front-detail-very-small, .front-excel-very-small, .back-very-small {backface-visibility: hidden; position: absolute; width: 100%; height: 100%;}
.front-baum-very-small, .front-detail-very-small, .front-excel-very-small { z-index: 2; }
.back-very-small {transform: rotateY(180deg); z-index: 1; color:white; text-align:center}
.back-very-small-h2 {font-size:.5em}

/* Basisdaten in Detaildarstellung */
.grausection{margin-bottom:1em; padding:1em; border-radius:0.5em; background-color:#f0f0f0; color:#333333; border:1px solid #f0f0f0}
.grausection-kontrastvoll{margin-bottom:1em; padding:1em; border-radius:0.5em; background-color:#ffffff; color:#000000; border:1px solid #000000}
/*.bd-section{background-color:#006d83; margin-bottom:0.25em; padding:1em; color:#ffffff; border-radius:0.15em} */
.bd-section{background-color:#006d83; margin-bottom:0.3em; padding:1em; color:#ffffff; border-radius:0.15em}
.bd-section a{color:#ffffff}
.bd-section-kontrastvoll{background-color:#000000; margin-bottom:0.25em; padding:1em; color:#ffffff; border-radius:0.15em}
.bd-section-kontrastvoll a{color:#ffffff}
.bd-untersection{background-color:#b4dbc9; margin:0.3em 0 0.3em 0; padding:1em; color:#006d83 !important; border:1px solid #b4dbc9; border-radius:0.15em}
.bd-untersection a{color:#006d83}
.bd-unter-untersection{background-color:#c6d5d8; margin:0.3em 0 0.3em 0; padding:1em; color:#006d83 !important; border:1px solid #c6d5d8; border-radius:0.15em}
.bd-unter-untersection a{color:#006d83}
.bd-untersection-kontrastvoll, .bd-unter-untersection-kontrastvoll{background-color:#000000; margin:0.3em 0 0.3em 0; padding:1em; color:#ffffff !important; border:1px solid #ffffff; border-radius:0.15em}
.bd-untersection-kontrastvoll a, .bd-unter-untersection-kontrastvoll a{color:#ffffff}

.bd-div-untereigenschaft{margin-top:0.65em; padding-top:0.65em; border-top:1px dotted #006d83}
.bd-div-untereigenschaft-kontrastvoll{margin-top:0.65em; padding-top:0.65em; border-top:1px dotted #ffffff}
.bd-details-zusatz{border:1px solid #006d83}
.bd-details-zusatz-kontrastvoll{border:1px solid #ffffff}
.bd-div{margin-top:0.65em; padding-top:0.65em; border-top:1px dotted #FFFFFF}
.bd-label{display:inline-block; vertical-align:top; width:9em;} /* padding-left:1.25em} */
.bd-text{display:inline-block; vertical-align:top}
.bd-text a{text-decoration:underline};
.bd-text-orange{background-color:#ee9636; border:1px solid #f07d00; padding-left:2px}
.bd-text-orange a{color:#ffffff}
.bd-text-orange-kontrastvoll{background-color:#ffffff; border:1px solid #ffffff; border-bottom:1px solid #000000; padding-left:2px; color:#000000}
.bd-text-orange-kontrastvoll a{color:#000000 !important}
.bd-text-petrol{background-color:#1f8296; border:1px solid #006d83; padding-left:2px}
.bd-text-petrol-kontrastvoll{background-color:#ffffff; border:1px solid #ffffff; border-bottom:1px solid #000000; padding-left:2px; color:#000000}

.link-petrol-extern:hover{background-color:transparent !important}

/* Formatierung für die Summaries in den Detaildarstellungen */
.element-details summary.ober-element, .unter-element-details summary.unter-element, .unter-unterelement-details summary.unter-unterelement, .unterunter-unterelement-details summary.unterunter-unterelement {position: relative; cursor:pointer; font-weight:bold; vertical-align:top; margin-bottom:0}
.element-details summary.ober-element::marker, .unter-element-details summary.unter-element::marker, .unter-unterelement-details summary.unter-unterelement::marker, .unterunter-unterelement-details summary.unterunter-unterelement::marker {color:transparent; font-size:0px}
.element-details summary.ober-element::after, .unter-element-details summary.unter-element::after, .unter-unterelement-details summary.unter-unterelement::after, .unterunter-unterelement-details summary.unterunter-unterelement::after {
   content:  "+"; 
   position: absolute;
   font-weight: bold;
   right: 0.5em;
   transition: all 0.5s;
} 
.element-details details[open] summary.ober-element::after, .unter-element-details details[open] summary.unter-element::after, .unter-unterelement-details details[open] summary.unter-unterelement::after, .unterunter-unterelement-details details[open] summary.unterunter-unterelement::after { transform: rotate(45deg);}

/*************************************
 Module
*************************************/
.themenKasten{display:flex; position:relative; align-items:center; background-color:#006d83; color:#ffffff; width:99%; min-height:6em; cursor:pointer; margin: 0em auto 0.75em auto; transition: transform .2s; border-radius:0.25em; z-index:2; background-position:3px 3px; background-repeat:no-repeat; background-size:30px 30px; cursor:default}
.themenKasten > span {display:inline-block; text-align:center; width:100%; position:absolute} /*inherit}*/
.themenKasten a:hover{background-color:#f07d00; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; }
.themenKasten-kontrastvoll{display:flex; position:relative; align-items:center; background-color:#000000; color:#ffffff; width:99%; min-height:6em; cursor:pointer; margin: 0em auto 0.75em auto; transition: transform .2s; border-radius:0.25em; z-index:2; background-position:3px 3px; background-repeat:no-repeat; background-size:30px 30px; cursor:default}
.themenKasten-kontrastvoll > span {display:inline-block; text-align:center; width:100%; position:absolute; color:#ffffff} /*inherit}*/
.themenKasten-kontrastvoll a{color:#ffffff !important}
.themenKasten-kontrastvoll a:hover{background-color:#ffffff; color:#000000 !important; transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; }

/* Module in Detaildarstellung */
.md-section-zentral{background-color:#f07d00; margin-bottom:0.25em; padding:1em; color:#ffffff; border-radius:0.15em}
.md-section-zentral a{color:#ffffff}
.md-section-zentral-kontrastvoll{background-color:#000000; margin-bottom:0.25em; padding:1em; color:#ffffff; border-radius:0.15em}
.md-section-zentral-kontrastvoll a{color:#ffffff}
.md-label{display:inline-block; vertical-align:top; width:7em}

/***********************************
 Formatierungen für die Sichten
***********************************/ 
.sichtenauswahl_table{width:100%; border-collapse:separate; border-spacing:0.35em; font-size:14px; font-size:0.875rem; font-size:87%; }
.sichtenauswahl_farbe{width:1em; border-radius:0.25em}
.sichtenauswahl_text{padding:1em 2em; text-align:center; background-color:#006d83; color:#ffffff; cursor:pointer; border-radius:0.25em; margin-bottom:0.3em}
.sichtenauswahl_text-kontrastvoll{padding:1em 2em; text-align:center; background-color:#000000; color:#ffffff; cursor:pointer; border:1px solid #000000; border-radius:0.25em; margin-bottom:0.3em}
.sichtenauswahl_text:hover{background-color: #f07d00;}
.sichtenauswahl_text-kontrastvoll:hover{background-color:#ffffff; color:#000000}

.sichtenauswahl{width:100%; display:inline-block; font-size:14px; font-size:0.875rem; font-size:87%; line-height:1.7; padding:1em 2em; text-align:center; background-color:#006d83; color:#ffffff; cursor:pointer; border-radius:0.25em; margin-bottom:0.3em}
.sichtenauswahl:hover{background-color: #f07d00;}
.sichtenauswahl-kontrastvoll{width:100%; display:inline-block; font-size:14px; font-size:0.875rem; font-size:87%; line-height:1.7; padding:1em 2em; text-align:center; background-color:#000000; color:#ffffff; border:1px solid #000000; cursor:pointer; border-radius:0.25em; margin-bottom:0.3em}
.sichtenauswahl-kontrastvoll:hover{background-color:#ffffff; color:#000000}

.sichtdetail-maindiv{width:100%; 14px; font-size:0.875rem; font-size:87.5%; line-height:2; text-align:left}
.sichtdetail-maindiv div {padding:0.2em 0; border-top:1px dotted #333333}
.sichtdetail-label{display:inline-block; width:11.5em; vertical-align:top}
.sichtdetail-text{display:inline-block; width:90%; max-width:49em; vertical-align:top}
.abgleiche-details > summary{list-style-type:none; margin:0; padding:0; cursor:pointer;}
.abgleiche-details > summary:after{display:inline-block; font-family: 'Genericons'; content: '\f431'; margin:0; padding-left:3px}
.abgleiche-details[open] > summary:after {content: '\f432'}

/***********************************
 Diagrammformatierungen
***********************************/
.objekt-caption{list-style-type:none; font-weight:bold; margin:0;}
.objekt-caption::before{font-family: 'Genericons'; content: '\f431 '; vertical-align:top}
.objekt-caption > span{display:inline-block; width:90%; margin-left:0.3rem}
/*.objekt-caption-ohne{display:inline-block; width:95%; margin-left:0.3rem; font-family:Verdana, Geneva, sans-serif; font-weight:bold}*/
.daten-details[open] > .objekt-caption::before {font-family: 'Genericons'; content: '\f432 '}

.details-format > summary{list-style-type:none; margin:0; padding:0; cursor:pointer}
.details-format > summary:after{display:inline-block; font-family: 'Genericons'; content: '\f431'; margin:0; padding-left:3px}
.details-format[open] > summary:after {content: '\f432'}
.content-format{display:inline-block; width:100%; margin:0; padding:0; hyphens:auto}
.content-format a{color:#ffffff; text-decoration:underline}
/* für den Elementtext mit nachfolgendem Text mit Pfeil (bei Modulen im aufklappbaren Elementbereich) */
.element-details > summary{list-style-type:none; font-weight:bold; margin:0; cursor:pointer}
.element-details > summary:before{display:inline-block; font-family: 'Genericons'; content: '\f431 '; vertical-align:top}
.element-details[open] > summary:before {font-family: 'Genericons'; content: '\f432 '}
.summary-text{display:inline-block; font-family:Verdana, Geneva, sans-serif; font-weight:bold; padding-left:0.25rem; width:95%;}
/* für Details innerhalb der Elementdarstellungen */
.details-format-punkt > summary{list-style-type:none; margin:0; padding:0; cursor:pointer}
.details-format-punkt > summary:before{display:inline-block; content: '\2022 '; vertical-align:top}
.details-format-punkt > summary:after{display:inline-block; font-family: 'Genericons'; content: '\f431'; margin:0; padding-left:3px}
.details-format-punkt[open] > summary:after {content: '\f432'}

/***********************************
 Misc
***********************************/
.link-lupe{text-decoration:none !important; line-height:16px}
.link-lupe:after{display:inline-block; font-size:16px; font-family: 'Genericons'; content: '\f402'; margin:0; padding:0; padding-left:3px;}
.weiss{color:#ffffff !important}
.linie-dotted-weiss{border-bottom:1px dotted #ffffff}
.linie-dotted-anthrazit{border-bottom:1px dotted #666666}
.linie-dotted-weiss-kontrastvoll, .linie-dotted-anthrazit-kontrastvoll{border-bottom:1px dotted #000000}

.zweig-untercaption{position:absolute; z-index:105; margin-left:-4em; margin-top: -2.1em; color:#333333; border:1px solid #f07d00; padding:0.2em 0.4em; font-size:0.9em; background-color: #FFFFFF}
.zweig-untercaption-kontrastvoll{position:absolute; z-index:105; margin-left:-8em; margin-top: -2.1em; color:#000000; border:1px solid #000000; padding:0.2em 0.4em; font-size:0.9em; background-color: #FFFFFF}
.elementverlinkung{display:inline-block; width:100%}
.elementverlinkung:before{content: '\2738 '; padding-right:0.2em}
.pfeilchen, .pfeilchen-kontrastvoll, .pfeilchen-petrol{font-family:Verdana, Geneva, sans-serif; font-weight:normal}
.pfeilchen:before { display:inline-block; font-family: 'Genericons'; content: "\f429"; color:#f07d00; margin-left:0.5em; vertical-align:top !important}
.pfeilchen-kontrastvoll:before { display:inline-block; font-family: 'Genericons'; content: "\f429"; color:#000000; margin-left:0.5em; vertical-align:top !important}
.pfeilchen-petrol:before {content: "\f429 "; color:#006d83;}
.pfeilchen-hinten{font-family:Verdana, Geneva, sans-serif; font-weight:normal; display:inline-block; width:90%}
.pfeilchen-details{font-family:Verdana, Geneva, sans-serif; font-weight:normal; text-transform:none}
.pfeilchen-details:before {display:inline-block; font-family: 'Genericons'; content: "\f429"; color:#f07d00; margin-left:0.25em}
.pfeilchen-details-kontrastvoll{font-family:Verdana, Geneva, sans-serif; font-weight:normal; text-transform:none}
.pfeilchen-details-kontrastvoll:before {display:inline-block; font-family: 'Genericons'; content: "\f429"; color:#ffffff; margin-left:0.25em}
.link-shortliste-closed{cursor:pointer}
.link-shortliste-closed:after{display:inline-block; font-family: 'Genericons'; content: '\f431'; margin:0; padding-left:3px}
.link-shortliste-opened{cursor:pointer}
.link-shortliste-opened:after{display:inline-block; font-family: 'Genericons'; content: '\f432'; margin:0; padding-left:3px}

/************************************
 Einrückungen und Listen
************************************/ 
.eingerueckt0-9{padding-left:0.9em}
.eingerueckt1{padding-left:1em}
.eingerueckt1-25{padding-left:1.25em}
.eingerueckt1-5{padding-left:1.5em}
.eingerueckt2{padding-left:2em}
.eingerueckt3{padding-left:3em}
.hinten-77{width:77%}
.hinten-80{width:80%}
.hinten-82{width:82%}
.hinten-85{width:85%}
.hinten-90{width:90%}
.hinten-95{width:95%}
.hinten-99{width:99%}
.hinten-100{width:100%}

.listenform-vorn-vollkreis{display:inline-block; vertical-align:top;}
.listenform-vorn-vollkreis:before{content: '\2022 '}
.listenform-hinten-vollkreis{display:inline-block; font-family:Verdana, Geneva, sans-serif; font-weight:normal}
.listenform-vorn-halbkreis{display:inline-block; vertical-align:top;}
.listenform-vorn-halbkreis::before{content: '\26AC '}
.listenform-hinten-halbkreis{display:inline-block; font-family:Verdana, Geneva, sans-serif; font-weight:normal}

.abstand-03{margin-bottom:0.3em}

/**************************************
 Kram
**************************************/
h2:before{ width: 0rem; height: 0rem; margin: 0rem; border-left:none; }
.h2-schmuck:before{
	display: inline-block;
	content: "";
	width: 0.5em;
	height: 0.5em;
	margin: 0;
	margin-right:-0.25em;
	border-left: 0.5em solid #006d83;
	border-radius:0.5em 0 0 0;
}
.datenhaltungs-objekt{background-color:#9fc755; color:#ffffff !important}
.datenhaltungs-text{color:#ffffff !important}
.klappenlink {text-decoration:underline; padding-left:1.5em; cursor:pointer}
.symbol:after{display:inline-block; font-family: 'Genericons'; content: ' \f431'; margin:0; padding-left:5px; font-weight:bold}
.btn-disabled{background-color:#CCCCCC !important; border:1px solid #CCCCCC !important}
.btn-disabled:hover{color:#ffffff !important}

@media screen and (max-width:850px){
	.sichtdetail-label{width:100%;}
	.sichtdetail-text{width:99%; max-width:99% !important}
	.basisdatenGridKasten{background-color:#006d83; color:#ffffff; border-radius:0.25em; margin-bottom:0.5em; height:6em}
	.myBasisdatenKasten{height:2.5em}
	.bd-label{width:100%}
	.bd-text{width:100%; padding-left:2.25em}
}