/* allgemeine Variablen */
:root {
    --main-font: Arial, sans-serif;
    --bbk-color: #0061a2;
}

/* linie unter navbar */
div.navbar-header {
    border-bottom: 1px solid #e5e5e5;
}

.mainContentFrame{
	width: 100% !important;
}

/** Footer **/
#footer-de, #footer-en{
    display: none;
    align-items: center;
}

#footer-de, #footer-en {
    gap: 0.8em;                    /* Abstand zwischen den Links */
}

#footer-de a:last-child {
    margin-left: auto;           /* Schiebt den letzten Link ganz nach rechts */
}

#footer-en a:last-child {
    margin-left: auto;           /* Schiebt den letzten Link ganz nach rechts */
}

.bbk-link{
    font-size: smaller;
}

.bbk-inner-link, .bbk-email{
    color: var(--bbk-color);
}


/*header */
#right-Wrapper{
    display: flex;
    align-items: center;
    gap: 0.1em;
}

#login-env-info{
    text-align: left;
}

#login-info-text{
    text-align: right;
}

/* END *header*/

.bbk-page{
    display: flex;
    justify-content: center;
    flex-direction: row;
}

/* shortest width */
.bbk-page{
    margin-top: 1em;
}

.right-page-class{
    width: 94%;
    padding-right: 20px;
}

.big-hedgehog{
    width: 52px;
    height: 52px;
    padding-right: 8px;
}

/* Überschriften im Bkk-Stil*/
.bbk-header-text{
    font-family: var(--main-font);
    font-size: small;
}

/*Standard-Text*/

.bbk-text{
    font-family: var(--main-font);
    font-size: small;
    padding-left: 10px;
    text-align: justify;
}


.bbk-text-bold{
    font-family: var(--main-font);
    text-align: justify;
    font-weight: bold;
}

.bbk-text-align-left{
    font-family: var(--main-font);
    text-align: left;
}


/* Bkk-Design vertikale Linie vor zwei Zeilen-Überschrift */
.rectangle-two-lines{
    width: 10px;
    height: 32px;
    padding-top: 3px;
    padding-right: 0px;

}

.rectangle-two-small-lines{
    width: 10px;
    height: 32px;
    padding-top: 3px;
    padding-right: 0px;
}

.bbk-header-text-thin-small{
    font-size: small;
    padding-left: 10px;
    margin-bottom: 10px;
}

.bbk-header-text-bold-small{
    font-size: small;
    font-weight: bold;
    padding-left: 10px;
    margin-bottom: 10px;
}

/* Bkk-Design vertikale Linie vor einer Ein-Zeilen-Überschrift */
.rectangle-one-line{
    width: 10px;
    height: 14px;
    padding-top: 3px;
    padding-right: 0px;
}

/* Überschrift Archiv lang */
.title-long{
    display:none;
}

/* Überschrift Archiv kurz */
.title-short{
    display: inline-block;
}

.title-medium{
    display: none;
}

/* Bestände BEGIN */

/*** Tabelle 3 Spalten Bestände ***/
.bbk-table-text{
	font-family: var(--main-font);
    font-size: small;
    text-align: left;
}

.bbk-subtitle{
	font-weight: bold;
	margin-bottom:12px;
}

.bbk-3-column-table, .bbk-2-column-table {  
	display: flex;  
	flex-direction: column;  
	border: 1px solid lightgray;  
	overflow: hidden;  
	margin-left: 10px;
	margin-bottom: 2.5em;
}  

.bbk-three-elements-text-block {  
  display: grid;  
  grid-template-columns: minmax(0, 6ch) 1fr minmax(0, 8ch);  
  align-items: stretch; /* Alle Zeilen gleich hoch */  
}  

.bbk-two-elements-text-block{
	display: grid;  
	grid-template-columns: 1fr minmax(0, 8ch);  
	align-items: stretch; /* Alle Zeilen gleich hoch */  
}

.bbk-two-elements-text-block-v2{
	display: grid;  
	grid-template-columns: 1fr minmax(0, 13ch);  
	align-items: stretch; /* Alle Zeilen gleich hoch */  
}
  
.bbk-three-elements-text-block > div, 
.bbk-two-elements-text-block > div,
.bbk-two-elements-text-block-v2 > div {  
  border-right: 1px solid lightgray;  
  border-bottom: 1px solid lightgray;  
  padding: 0.5em 0.75em;  
  box-sizing: border-box;
  min-height: 2em;
  display: flex;
  align-items: start;
}  
 
 /* Erste Spalte: max. 5 Zeichen */  
.bbk-text-first-column {  
  max-width: 6ch;  
  width: 6ch;  
  /*overflow: hidden;  
  text-overflow: ellipsis;  
  white-space: nowrap;*/
  white-space: normal;  
  word-break: break-word;  
}  

/* Mittlere Spalte: nimmt den Rest, Text darf umbrechen */  
.bbk-text-second-column {  
  min-width: 0;  
  white-space: normal;  
  word-break: break-word;  
}  
  
/* Dritte Spalte: max. 8 Zeichen */  
.bbk-text-third-column {  
  max-width: 8ch;  
  width: 8ch;  
  overflow: hidden;  
  text-overflow: ellipsis;  
  white-space: nowrap;  
  text-align: right; /* Optional: rechtsbündig */  
}  

/* Dritte Spalte: max. 10 Zeichen */  
.bbk-text-third-column-v2 {  
  max-width: 13ch;  
  width: 13ch;  
  overflow: hidden;  
  text-overflow: ellipsis;  
  white-space: nowrap;  
  text-align: right; /* Optional: rechtsbündig */  
}  

 #date-inventory, #date-inventory-e{
	 margin-bottom: 3em;
 }

/* ENDE Bestände */



@media (min-width: 500px){
    /*header*/
    #actaProWebImage{
        height: 33px;
        margin-top: 8px;
        margin-left: 8px;
    }

    #BBk-Logo-Image{
        height: 61px;
    }

    #eterna_logo_small{
        height: 40px;
    }

    #right-Wrapper{
        gap: 0.3em;
        /*margin-right: 18px;*/
    }

    #login-info-Wrapper{
        /*justify-content: flex-end;*/
        padding-top: 2px;
        display: flex;
        flex-direction: column;
    }
}

@media (min-width: 410px){
    /* Überschrift Archiv lang */
    .title-long{
        display: none;
    }

    /* Überschrift Archiv kurz */
    .title-short{
        display: none;
    }

    .title-medium{
        display: inline-block;
    }

}

@media (min-width: 750px){

    .bbk-link{
        font-size: small;
    }

    #footer-de, #footer-en {
        gap: 3em;                    /* Abstand zwischen den Links */
    }

    .title-long{
        display: inline-block;
    }

    .title-short{
        display: none;
    }

    .title-medium{
        display: none;
    }

    /* Überschriften im Bkk-Stil*/
    .bbk-header-text{
        font-size: x-large;
    }

    .bbk-text{
        font-size: medium;
        padding-left: 18px;
    }
	
	.bbk-3-column-table, .bbk-2-column-table {  
		margin-left: 18px;
	}  
	
	.bbk-table-text{
		font-size: medium;
	}

    .bbk-text-origin{
        font-size: medium;
    }

    /* Bkk-Design vertikale Linie vor zwei Zeilen-Überschrift */
    .rectangle-two-lines{
        width: 18px;
        height: 60px;
        padding-top: 7px;
        padding-right: 0px;

    }

    /* Bkk-Design vertikale Linie vor zwei Zeilen-Überschrift */
    .rectangle-one-line{
        width: 18px;
        height: 26px;
        padding-top: 8px;
        padding-right: 0px;

    }

    .bbk-page{
        margin-top: 2em;
    }

    .right-page-class{
        padding-top: 0.3em;
    }

    .big-hedgehog{
        width: 80px;
        height: 80px;
        margin-right: 20px;
    }

    /* Spalten Bestände */
    .bbk-two-elements-text-block{
        font-size: medium;
    }

    .bbk-comment{
        font-size: small;
    }

    /*header*/
    #actaProWebImage{
        height: 33px;
        margin-top: 4px;
        /*margin-left: 8px;*/
    }

    #BBk-Logo-Image{
        height: 61px;
    }

    #eterna_logo_small{
        height: 40px;
    }

    #right-Wrapper{
        gap: 0.2em;
        /*margin-right: 18px;*/
    }

    #login-info-Wrapper{
        /*justify-content: flex-end;*/
        padding-top: 2px;
        display: flex;
        flex-direction: column;
    }
}

@media (min-width: 980px){


    .title-long{
        display: inline-block;
    }

    .title-short{
        display: none;
    }

    .title-medium{
        display: none;
    }

    .bbk-page{
        margin-top: 4em;
    }

    .right-page-class{
        padding-top: 0.8em;
    }

    .big-hedgehog{
        width: 100px;
        height: 100px;
        margin-right: 24px;
    }

    /*header*/
    #actaProWebImage{
        height: 33px;
        margin-top: 8px;
        margin-left: 10px;
    }

    #BBk-Logo-Image{
        height: 61px;
    }

    #eterna_logo_small{
        height: 40px;
    }

    #right-Wrapper{
        gap: 0.2em;
        margin-right: 18px;
    }

    #login-info-Wrapper{
        /*justify-content: flex-end;*/
        padding-top: 2px;
        display: flex;
        flex-direction: column;
    }


}

@media (min-width: 1170px){

    .title-long{
        display: inline-block;
    }

    .title-short{
        display: none;
    }

    .title-medium{
        display: none;
    }


    .bbk-link{
        font-size: medium;
    }

    /* Überschriften im Bkk-Stil*/
    .bbk-header-text{
        font-size: x-large;
    }

    .right-page-class{
        width: 100%;
        padding-top: 2.2em;
    }

    .big-hedgehog{
        width: 172px;
        height: 172px;
        margin-right: 28px;
    }

    /*header*/
    #actaProWebImage{
        height: 38px;
        margin-top: 10px;
        /*margin-left: 10px;*/
    }

    #BBk-Logo-Image{
        height: 66px;
    }

    #eterna_logo_small{
        height: 50px;
		padding-bottom: 1px;
    }

}

/* ENDE Desktopgröße */



/* Teil der Überschrift: dünn (erster Teil) */
.bbk-header-text-thin{
    font-family: var(--main-font);
}

/* Teil der Überschrift: fett (einziger oder zweiter Teil */
.bbk-header-text-bold{
    font-family: var(--main-font);
    font-weight: bold;
    margin-bottom: 1em;
}

/* Abstand zwischen Standardtext als Paragraphen */
.bbk-paragraph{
    margin-bottom: 1em;
}

/*Anordnung für Balken und daneben Überschrift */
.bbk-headers{
    display: flex;
    gap: 0px;
}

/*ungeordnete Liste */
.bbk-unordered-list{
    list-style-type: disc;
    padding-left: 4em;
}

.end-section{
    margin-bottom: 1.3em;
}

.subsection{
    margin-top: 2em;
}

/*spezielle Werte Bestände */

#bbk-header-inventory-text-1-2, #bbk-header-inventory-text-1-2-e{
    margin-bottom: 0.5em;
}


/*spezielle Werte FAQs */
#faqs2, #faqs2-e{
    margin-top: 4em;
    margin-bottom: 4em;
}

/*spezielle Werte Route */
.address-wrapper {
    display: flex;
    align-items: top;
    margin-top: 1em;
}

.address-element-1 {
    margin-right: 6em; /* Großer Abstand zu .zwei */
}

.address-element-2 {
    margin-right: 2em; /* Kleiner Abstand zu .drei */
}

.bbk-address-image-wrapper{
    text-align: center;
}

.address-image{
    display: none; /* beim Verwenden eines Images mit dem Namen anfahrt-archiv-bbk.jpg, diese Zeile entfernen */
    width: 40%;
    height: auto;
    border: solid 1px lightgray;
    margin-top: 2em;
    margin-bottom: 3em;
}