
:root{
	--base-color: #b30b35;
	--second-color: #00437F;
	--grey-color: #656565;
	--base-font-family: Arial;
	--menulevel2-color: #F19698;
	--footer-font-color: #545454;
	--black-color: #000000;

	--mobile-body-padding: 1rem;
	
	--fs-400: 12px;
	--fs-500: 12pt;
	--fs-600: 14pt;
	--fs-800: 16pt;
	--fs-900: 24pt;
}

html{
	overflow-x: hidden;
}

body {
	overflow: hidden;
	margin: 0;
	padding: 0;
	font: var(--fs-400) var(--base-font-family) !important;
}

#footerOwner {
	margin: 4px auto;
	width: 1047px;
	text-align: center;
	font-size: 16px;
	font-family: Arial;
    --footer-font-color: #000000;
	font-style: normal;
	background-color: transparent;
	line-height: 1.55;
}


a.headlineOne{
	font-size: 26pt;
	font-weight: bold;
}

a.headlineThree {
    font-size: 20pt;
	font-weight: normal;
	color: var(--second-color);
}

a.fließtext{
	font-size: --fs-500;
	color: var(--grey-color);
}

/*---------------------------------AdminSection----------------------*/
.inner_content.buchmodul .editButton{
	position: absolute;
	z-index: 1;
	top: 6.5rem;
	left: 30rem;
}

.menu1  .menuEditButton+li{
	position: absolute;
	margin: 0 0 0 -3rem;
    	
}

.menu1 li.liMenuEditButton {
    background-color: transparent !important;
    position: absolute;
    border: none !important;
    margin: -44px 0 0 618px;
    z-index: inherit;
    color: white;
}

.menu2 li.liMenuEditButton, .menu2 ul>div.menuEditButton {
    background-color: transparent !important;
    position: absolute;
    border: none !important;
    margin: -50px 0 0 0;
    z-index: inherit;
    color: white;
}

.contentRight .tooltip {
position: absolute;
    z-index: inherit;
    margin: 0 0 0px 0px;
    width: auto;
}

.tooltip{
	position: absolute;
	z-index: inherit;
	margin: 52px 0 0px -60px;
    width: min-content;
}

/*---------------------------------Edit Icon----------------------*/
.edit_icon
{
	width: 25px;
	height: 25px;
	border: 0;	
	padding-left: 5px;
}

.edit_icon:hover{
	cursor: pointer;
}

/*---------------------------------Container----------------------*/
.container {
	display: flex;
    flex-direction: column;
	-webkit-user-select: text;
	-moz-user-select: text;
	-ms-user-select: text;
	user-select: text;
	width: 1047px;
	height: 688px;
	box-shadow: 10px 10px 10px #ccc;
	padding: 20px 0px 0 0;
    margin: auto;
}

/*---------------------------------Header----------------------*/
.stickyHeader {
	position: sticky;
	top: 0;
	z-index: 1;
}
	
.header_logo {
	display: inline-block;
}

.header_logo img {
	width: 150px;
	vertical-align: middle;
}


input#hamburg {
	display:none
}

.mobile {
	display: none;
}
.desktop {
	height: 42px
}
.menu.desktop {
	width: 80%;
	float: right;
	}

.menu1 ul{
	list-style-type: none;
}

.menu1 ul li{
	background-color: var(--second-color);
	display: table-cell;
	width: 10%;
	text-align: center;
	border-right: 2px white solid;
	height: 42px;
}

.menuLevel1 {
	list-style: none;
	margin: 0;
	z-index: 10;
	height: 42px;
}

.menuLevel1>li>button,
.menuLevel2>li>button {
	background: none;
	border: none;
	text-align: left;
	padding: 0;
	width: 100%;
	height: 100%;
}

/**** menulevel 1 ****/
.menuLevel1>li{
	display: inline-block;
	vertical-align: top;
	text-align: left;
	position: relative;
}

.menuLevel1 li a::after {
	margin: 0 5px;
}

.menuLevel1 li:last-child a::after {
	content: none;
}

.menuLevel1>li:hover > ul{
	visibility: visible;
	opacity: 1;
	transition-delay: 0s;
}

.menuLevel1>li.editButton_menu{
	position: absolute;
	left: -20px;
}

.menuLevel1>li.editButton_menu > a{
	border-left: 0px;
	padding: 0px;
}

.menuLevel1 li a {
	text-decoration: none;
	color: #B8DDE1;
	display: block;
	font: 13px var(--base-font-family);
	font-weight: bold;
    margin: 0 0 6px 11px;

}

.menuLevel1 li a:hover {
	color: var(--base-color);
}

.menuLevel1>li>a {
	margin: 10px 0px;
	font-size: 1.5rem;
    font-weight: 500;
    box-sizing: border-box;
    width: 100%;
	
}

.menuLevel1>li:first-of-type>a {
	border-left: none;
}

.menuLevel1>li>a:LINK {
	text-decoration: none;
}

.menuLevel1>li>a:hover:before,
.menuLevel1>li .current a:before {
  	opacity: 1;
  	width: 100%;
}
.menuLevel1>li>a:hover:after,
.menuLevel1>li .current a:after {
  	max-width: 100%;
}

.menuLevel1>li.selected>button>a, .menuLevel1>li.hasSelectedDescendant>button>a{
	color: white;
}

.menuLevel1>li.selected, .menuLevel1>li.hasSelectedDescendant{    
	background-color: var(--base-color);
	
}

#container li.editButton_menu > a::after{
	display: none;
}

.contentRight {
	width: 741px;
	margin: 0 0 0 54px;
	display: flex;
	flex-direction: column;
	
}

.menu2 {
	background-color: var(--base-color);
	width: 206px;
	margin-top: 1px;
	padding: 25px 0 0 0;
	overflow-y: auto;
}

.menuLevel2 {
	list-style-type: none;
    padding-inline-start: 0;
}

.menuLevel2 li {
	padding: 5px 0;
	line-height: 1;
}

.menuLevel2 a {
	display: block;
    border-bottom: 1px white solid;
    text-decoration: none !important;
	color: var(--menulevel2-color);
    font-size: 13px;
    font-weight: 500;
    line-height: 1;
    width: 90%;
    margin: auto;
}



/*------Content-------*/
.contentwrap {
	width: 80%;
}

.content{
	width: 100%;
	min-height: 1%;
	flex:1;
	display: flex;
	flex-direction: row;
}

#aktuellButton{
	position: absolute;
	margin: 40px 0 0 595px;
	z-index: 2;
}

.bannerImageWrapper{
    position: relative;
	width: 1047px;
	height: 137px;
}

.bannerImage{
    display: flex;
    align-items: center;
}

#formatImage {
    max-width: 100%;	
	margin-bottom: -8px;
}

#mainimage{
	padding: 10%;
	max-height: 80%;
}

.bannerTextWrapper{
    position: absolute;
	margin: 0 12em;
}

.bannerText{
	color: white;
	font-size: 3rem;
	font-weight: 400;
	display: inline;
    margin-left: 5rem;
}

.stickyHeader{
	position:sticky;
	top:0;
	margin-top: 2px;
}

.suchleiste_wrapper {
    background-color: var(--second-color);
}

.suchleiste{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 5em;
	height: 65px;
	color: white;
}
#suchText {
    color: white;
    font-size: 24px;
    font-family: var(--base-font-family);
    text-align: center;
    line-height: normal;
}
.suchleiste a {
		font-size: 1.3em;
}
#suchContainer{
    background-color: var(--second-color);
    width: 206px;
    height: 87px;
    float: left;
    margin-right: 2px;
    margin-bottom: 2px;
    padding: 7px 0 0 0;
}
.suchfeld{
	display: flex;
	flex-direction: row;
	justify-content: space-evenly;
	padding: 5px 0;
	flex-wrap: wrap;
}

#searchField{
	border: solid 1px darkgray;
	border: none;
	float: left;
	width: 185px;
	align-items: center;
	height: 20px;
}
#searchField::part(input-field){
	background-color: white !important;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border: none;
	border-radius: 0px !important;
	height: 24px;
	vertical-align: -webkit-baseline-middle !important;
}

#searchField vaadin-button{
	background: none;
}
#searchField vaadin-button img{
	width: 20px;
	margin-top: 3px;
}

.warenkorbButtonWrapper {
	margin-left: 260px;
    height: 38px;
    display: flex;
    justify-content: flex-end;
}

.seitenTitel{
    margin-left: 260px;
	height: 16px;
	display: flex;
	flex-direction: column-reverse;
} 
.seitenTitel h2{
	color: var(--base-color) !important;
	font-weight: bold !important;
	font-size: 14px !important;
	margin: 0 !important;

}
  
.shopVerwaltung{
	display: flex;
    flex-direction: row;
	font-weight: 400;
}

.shopVerwaltungPunkt {
    padding: 12px 46px 0px 0px;
	display: flex;
	flex-direction: row;
    align-items: center;
}

.shopVerwaltungPunkt:hover{
	color: var(--base-color);
	cursor: pointer;
}

.shopVerwaltung > div:first-child::after {
    content: "|";
    margin: 0 5px;
}

.shopIcon{
	width: 27px;
    height: 20px;
	background-color: lightgrey;
}

.shopVerwaltungPunkt .shopIcon {
    background: transparent;
    filter: invert(1);
	height: 17px;
    width: 20px;
    padding: 4px;
}

.shopVerwaltungPunkt .warenkorbButton {
	padding: 0 !important;
}

.shopIconBackground {
	    background-color: var(--second-color);
}

a#warenkorbTag {
    color: var(--second-color);
    font-size: 13px;
    font-weight: bold;
    margin: 0 1rem 0 0;
}

.anzahlArtikelDiv {
    height: 15px;
    display: none;
    width: 15px;
    position: absolute;
    margin: 0 0px 23px 6rem;
    background-color: var(--second-color);
    border-radius: 50%;
    z-index: 2;
    /* margin-left: 18px; */
    border: 1px solid var(--base-color);
    text-align: center;
    color: #ffffff;
}


.warenkorbButtonBackground{
	background-color: var(--second-color);
}

.warenkorb vaadin-grid-cell-content .header {
	font-size: 16px;
} 
  

.inner_content{
	display: flex;
	flex-direction: row;
	flex: 1;
	border-bottom: 2px var(--base-color) solid;
	border-top: 2px var(--base-color) solid;
	overflow: hidden;
	width: 100%;
	max-height: 410px;
}

.veranstaltungstitel{
	display: flex;
	flex-direction: column;
}


/*-----------------------------------------Article------------------------------------------------------------*/

.articleModul{
	width:100%;
	display: flex;
	flex-direction: row-reverse;
}
.articelTextWrapper {
	width: 40%;
	border-right: 2px solid #aaaaaa;
	overflow: auto;
}
.articelTextWrapper p:last-child{
	margin-bottom: 10px
}
.articelImageWrapper{
	width: 60%;
	margin-top: 0;
}

.articleImage{
	height: 100%;
}
.articelTextWrapper h1, .articelTextWrapper h2 {
	margin-block-start: 1rem !important;
}
.articelTextWrapper p{
	line-height: 130%;
	margin-bottom: 0em;
	margin-right: 3px;
	color:  black;
	overflow: auto;
	margin-top: 1em;
}


/*-------------------------------------Buchshop---------------------------------------------------*/

.headlineTwo {	
	font-size: 22pt;
	font-weight: normal;
	color: var(--base-color);
	line-height: 1;
}

.buchListe vaadin-vertical-layout {
	padding: 0 !important;
	max-height: 408px;
}

.buch {
	display: flex;
	flex-wrap: wrap;
}


.buch .responsiveWrapper {
	display: none;
}

.button_load_more{
	font-family: Arial;
	font-size: 12px;
	background-color: var(--second-color);
	color: var(--lumo-base-color);
}


.buchListe{
	height: 99%;
	width: 40%;
	border-right: 2px solid #aaaaaa;
}

.buchListe .buch{
	width: 100%;
	border-bottom: 2px solid var(--base-color) !important;
	font-size: --fs-400;
}

vaadin-icon{
	max-height: 24px;
	max-width: 22px;
}

.buch:last-of-type {
	border-bottom: none;
}

.buch_cover {
	grid-area: cover;
	width: 80px;
}

.buchListe .buch_cover{
    padding: 15px 0 15px 0;
}

.buch_cover > img{
	width: 100%;

}


.read_more {
	max-height: fit-content !important;
}


.titel_div .layout {
	font-weight: 700;
}

.buchLeftDetails {
	display: flex;		
	flex-direction: column;		
	justify-content: space-between;
}

.buch  .buttons {
	display: flex !important;
	align-self: flex-start;
}

.buch_details_wrapper{
	display: flex;
	flex-direction: column;
	width: 180px;
	grid-area: beschreibung;
}

.buch label[slot="label"]{
	display: none;
}

.buch_details_wrapper label {
	padding: 0 0px 0.3rem 0;
}

.produktdetails_div {
	display: none !important;
}

.produktdetails_div .headlineTwo {
	display: none;
}

.buch_details_wrapper {
	display: flex;
	flex-direction: row;
	margin-block: 0; /*-.3rem*/
}

.einzelAnsichtBuch .buch_details_wrapper {
	margin-block: 0;
}

.einzelAnsichtBuch .buch_details_wrapper {
	padding: 0;
}


.buchListe .buch_details_wrapper{
	display: block;
	padding: 15px 0 5px 15px;
	font-family: Arial;
	color: #464646
}

.buchListe .buch_details_wrapper div{
	padding-bottom : 0.45em;
}

.buchListe .preis_div{
	width: fit-content;
}

.buchListe .preis_div::after{
	content: "€";
	margin: 0 0 0 2px;
}




/*-----------------------------------------Einzelansicht---------------------------------*/

.einzelAnsichtBuch {
	width: 60%;
	overflow-x: auto;
	color: var(--black-color);
}

.einzelAnsichtBuch .buch{
	width: 100%;
}

.einzelAnsichtBuchButton {
	background: var(--base-color) !important;
	color: white !important;
	border: none !important;
	text-align: center !important;
	cursor: pointer !important;
	padding: 5px !important;
	margin-left: 5px;
	min-width: 1px;
	width: 29px;
	height: 28px !important;
	border-radius: 100% !important;
	box-shadow: inset 3px 2px 3px #ffffff !important;
}

.einzelAnsichtBuch .buch_cover img{
	padding: 15px 0 0 10px;
	width: 110px 
}

.buch_details_wrapper{
	max width: 300px;
}

.einzelAnsichtBuchButton:hover {
	background: var(--base-color);
}

.einzelAnsichtBuch .buch_cover_wrapper {
	width: 130px;
	height: 177px;
	padding: 15px 10px;
}

.einzelAnsichtBuch .buch_details_wrapper{
	display: block;
	width: 100%;
	padding-left: 10px;
    
}

.einzelAnsichtBuch .text_div  {
	margin-top: 2em;
	margin-bottom: 2rem;
	padding-right: 5px;
}

.einzelAnsichtBuch div  {
	line-height: 1.3;
}

.einzelAnsichtBuch .isbn_div{ 
	grid-area: 4;
	font-weight: bold;
}

.einzelAnsichtBuch ::before{
	margin-right: 2px;
}

.einzelAnsichtBuch .isbn_div::before{
	content: "ISBN: ";
	font-weight: bold;
}

.einzelAnsichtBuch .verlag_div::before{
	content: "Verlag: ";
}

.einzelAnsichtBuch .erschienen_div::before{
	content: "Erscheinungsdatum: ";
}

.einzelAnsichtBuch .altersangabe_div::before{
	content: "Alter: ";
}


.buchShopHeader{
	color: var(--base-color) !important;
}

.warenkorb .buchShopHeader, .adressauswahl .buchShopHeader {
	display: none;
}

.buchShopHeader2{
	color: var(--second-color) !important;
}
.buchShopText{
	color: var(--grey-color) !important;
}
vaadin-vertical-layout{
	overflow: auto
}


.buchShopButton:hover{
	background: var(--base-color) !important;
}

.buchShopTextfield::part(input-field){
	background-color: white !important;
	border-radius: 0px !important;
	border: 1px solid var(--second-color) !important;
	height: 27px !important;
	vertical-align: -webkit-baseline-middle !important;
}

.buchShopComboBox::part(input-field){
	background-color: white !important;
    border-radius: 0px !important;
    border: 1px solid var(--second-color) !important;
    height: 27px !important;
    vertical-align: -webkit-baseline-middle !important;
}

.buchShopCheckbox > input ~ label:before{
	border-radius: 0px !important;
    border: 1px solid var(--base-color) !important;
}




.mehrButtonResponsive{
	display: none;
}

.warenkorbButton {
	background: var(--base-color) !important;
	color: white !important;
	border: none !important;
	text-align: center !important;
	cursor: pointer !important;
	padding: 5px !important;
	width: 28px;
	height: 28px !important;
	border-radius: 100% !important;
	box-shadow: inset 3px 2px 3px #ffffff !important;
}
 .buch .warenkorbButton{
	 min-width: 1px;
	 margin-left:10px;
	}
.buch .warenkorbButton img{
	width: 16px;
	margin-left: 8px;
	margin-top: 5px;
	filter: invert(1);
}

.v-button.v-widget.warenkorbButton.v-button-warenkorbButton .v-button-wrap  .v-icon{
	-webkit-filter: invert(1);
	width: 80%;
}


.warenkorbButton .v-button-caption{
	display: none !important;
}

.warenkorbButton:hover {
	background: var(--base-color);
}

.warenkorbButtonIcon{
	width: 25px;
    vertical-align: middle;
    margin-right: 10px;
	
}

.rightAlign {
	text-align: right;	
}

.changeMengeButton {
	background: var(--base-color) !important;
	color: white !important;
	margin-inline: 2%;
	font-size: 0.75rem;
	height: 24px !important;
	border-radius: 100% !important;
}

.buch_info_1_layout,
.buch_info_2_layout,
.buch_details_layout {
    flex: 1 1 auto;
    width: 100%;
	line-height: 1.3;
}

.labelbox {
    flex: 0 0 35%;
	font-weight: normal;
}

.valuebox {
    flex: 0 0 65%;
}

/*-------------------------------------Warenkorb-------------------------------------------------*/
.warenkorb{
	width: 100%;
	padding: 20px 0 0 0;
}

.warenkorb .v-verticallayout .v-expand .v-slot:not(.v-slot-bestellpreisDivWarenkorb) {
	height: 30%;
}

.warenkorbGrid tbody {
	overflow: scroll;
	height: 270px;
}

.warenkorbGrid .titel {
    width: 40% !important; 
}

.warenkorbGrid .autor {
    width: 20% !important; 
}

.warenkorbGrid .einzelpreis {
	text-align: inherit;
    width: 20% !important; 
}

.warenkorbGrid .menge {
    width: 20% !important; 
}

.warenkorbGrid .gesamtpreis {
    display: none !important;  
}

.warenkorbGrid .isbn {
    display: none !important;  
}

.bestellpreisDivWarenkorb {
	margin-bottom: 0;
	position: relative;
}

.v-slot-bestellpreisDivWarenkorb {
	position: relative;
	top: 5%;
	height: 15% !important;
	
}

tr.v-grid-row.v-grid-row-has-data {
    width: 100% !important;
	background-color: transparent;
	
}

.maintheme .kasseGrid .v-grid-row,
.maintheme .warenkorbGrid .v-grid-row {
    width: 100% !important;
	background-color: transparent;
}

.maintheme .kasseGrid  .v-grid-row-stripe > td
.maintheme .warenkorbGrid  .v-grid-row-stripe > td {
	background-color: transparent;
}

.maintheme .kasseGrid td,
.maintheme .warenkorbGrid   td {
	background-color: transparent;
	font-size: --fs-400;
	font-family: arial;
}


.v-slot.v-slot-h1.v-slot-buchShopHeader {
	display: none !important;
	
}

.warenkorb .v-grid-horizontal-scrollbar-deco, .warenkorb .v-grid-scroller.v-grid-scroller-horizontal {
    display: none;
}

.warenkorb .v-grid-row > td {
	border-left: none !important;
    border-bottom: none !important;
}

.warenkorb  .v-grid-row:last-child > td{
    border-bottom: 1px solid black !important;
}

.warenkorb .v-grid .v-grid-header th.v-grid-cell {
	background: none !important;
    color: black !important;
	/**font-weight: 400;**/
	border-bottom: 1px solid black !important;
	border-left: none !important;
}

.warenkorb .v-grid-tablewrapper {
    border: none !important;
	width:100%;
}

.warenkorbMengeColumn {
	white-space: nowrap !important;
}


.warenkorbPostenMenge {	
	line-height: inherit;
}

.responsiveWarenkorbWrapper{
	display:none !important;
}

.warenkorbpostenStyle{
	border-bottom: 1px solid var(--second-color);
	width: 100%;
}
vaadin-grid-cell-content .changeMengeButton{
	min-width: 1px;
	width: 24px;
}
.warenkorb vaadin-grid-cell-content{
	border-bottom: 1px solid black;
	height: 36px;
}
vaadin-vertical-layout#vlLieferadr{display: contents;}
.buchShopButton{   
	background: var(--base-color) !important;
    color: white !important;
    border: none !important;
    text-align: center !important;
    line-height: 30px !important;
    cursor: pointer !important;
	border-radius: 0px !important;
}

/*--------------------------------------Kasse---------------------------------------------*/

.kasse {
	overflow-y: auto;
}

.zahlVersandArtWrapper {
	display: flex;
	padding-bottom: 2em;
}

.richtlinienLayout * {
	align-items: center;
}
.richtlinienLayout  {
	gap: 0.5em;
	padding-bottom: 2em !important;
}
.cssLayoutForButton  {
	padding-bottom: 1em !important;
}

.kasse_required_radioButtonGroup  {
	border-style: ridge;
	border-color: #b30b35;
	padding: 5px;
	margin-right: 10px;
}

.kasse_required_radioButtonGroup * {
	color: #b30b35;
}


.kasse_required_checkbox {
	border-style: ridge;
	border-color: #b30b35;
	padding: 5px;
	margin-bottom: 10px;
}

.kasse>.v-verticallayout{
	height: fit-content !important;
}

.kasseGrid .titel {
	width: 20% !important;
}

.kasseGrid .autor {
	width: 20% !important;
}

.kasseGrid .isbn,
.kasseGrid .download {
	display: none !important;
	text-align: inherit !important;
}

.kasseGrid .gesamtpreis,
.kasseGrid .einzelpreis {
	width: 20% !important;
	text-align: inherit !important;
}

.kasseGrid .menge {
	width: 20% !important;
}

.responsiveKasseWrapper {
	display: none !important;
}

.zahlVersandArtWrapper .v-captiontext {
	color: var(--second-color) !important;
}

/*-----------------------------------------Anmeldung------------------------------------*/

.anmeldungWrapper{
	display: flex !important;
	flex-flow: wrap;
}

.anmeldungWrapper .v-label-undef-w {
    white-space: normal !important;
}

.anmeldungShopRight.v-margin-left {
    padding-left: 0 !important;
}

/*----------------------------------------konto anlegen--------------------------------*/
shop-adresse-view vaadin-form-item {
	--vaadin-form-item-row-spacing : -12px;
}

shop-adresse-view vaadin-form-item:first-of-type {
	--vaadin-form-item-row-spacing : 0px;
}

.shopKundendatenWrapper {
	display: flex !important;
	flex-flow: wrap;
}

.shopKundendatenWrapper .v-label-undef-w {
    white-space: normal !important;
}

.shopKundendatenRight.v-margin-left {
    padding-left: 0 !important;
}

.shopAdresseWrapper  {
	display: flex !important;
	flex-flow: wrap;
}

.shopAdresseWrapper .v-label-undef-w {
    white-space: normal !important;
}

.shopLieferadresseWrapper {
    white-space: normal !important;
}

.v-slot-shopKundendatenWrapper{
	height: auto !important;
}


/*-------------------------Contact-------------------------------*/

.adressauswahl{
	width: 100%;
	overflow: hidden auto;
}

.adressauswahl>div>div{
padding:0 !important;
}

.v-textfield-buchShopTextfield, .buchShopComboBox  {
    height: 17px !important;
}

.v-caption-buchShopTextfield, .v-caption-buchShopComboBox  {
    height: 13px !important;
    font-size: --fs-400 !important;
}

.maintheme .adressauswahl .v-formlayout-captioncell {
    vertical-align: top;
    line-height: inherit;
}

/*----------------------------------------Contact---------------------------------*/

.contacts_div{
	width: 40%;
	overflow-x: hidden;
	overflow-y: auto;
	border-right: 2px solid #aaaaaa;
}

.contact_div{
    width: 100%;
}

.contact{
	max-width: 100%;
	display:flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
}
.contact p {
	line-height: normal;
}

.contact_separator{
	visibility: collapse;
	height: 2rem;
}

.contact_data{
	padding-top: 5%;
	margin: 0 0 0 1rem;
}

.contact_data p{
	margin-block-start: 0em;
	margin-block-end: 0em;
}


.contact_separator {
	width: 100%;
    border-top: 1px solid var(--second-color);
}

.contact_separator:last-Child {
	width: 0%;
}

.contact_vornameNachname{
	color: var(--second-color);
}

.contact_image_div > #mainimage {
	height: 121px;
}
.contact_text{
	display: none !important;
}


/*-------Links-------*/
.linksmodulNormal {
	display: flex;
    justify-content: flex-start;
}

.linksmodulResponsive {
	display: none;
}

.linkkategorie_wrapper{
	display: flex;
    flex-direction: column;
}

.link_text{
	margin-bottom: 3rem;
	min-height: .5rem;
}

.linkkategorie{
    display: flex;
    align-items: center;
    font-size: 1.25em;
    font-weight: 400;
    width: max-content;
}

.linkkategorie:hover {
	border-bottom: 2px solid var(--base-color);
	cursor: pointer;
}

.link_showdetails{
	display: none;
}

.categoryActive {
	border-bottom: 2px solid var(--base-color);
}

.links_wrapper{
	margin-left: 120px;
    flex: 1;
}

.link{
	border-bottom: 1px solid var(--second-color);
   	padding: 15px 0px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.link:first-of-type {
	padding-top: 0px;
}

.link:last-of-type {
	border: none;
}

.linkDetails{
	display: flex;
    flex-direction: column;
    margin-right: 100px;
    flex: 1;
}

.linkDetails p{
    margin-block-start: 0em;
}

.linkDetails > p > a{
	text-decoration: underline;
    color: var(--second-color);
    font-weight: 400;
}

.linkDetails > p > a:hover{
	font-weight: 500;
}

.link_image_div {
    align-self: center;
    max-width: 150px;
}

/*------Gallerie-------*/

.galerieModul{
	display: flex;
    flex-direction: column;
	width: 100%;
}

.galerieModul .editButton{
	position: absolute;
    margin: -2rem 0 0 -49rem;
    width: min-content;
    z-index: 1;
}

.gallerieWrapper{
	height: 80%;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.gallerie_mainimage{
	width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}

.gallerieWrapper #mainimage{
	padding: 0;
	max-height: 90%;
    max-width: 100%;
}


.gallerieWrapper #image{
	max-height: 90%;
    max-width: 100%;
}

.thumbbarWrapper{
	height: 20%
}

.thumbbar{
	height: 100%;
	list-style-type: none;
    display: flex;
    justify-content: flex-start;
    overflow-x: scroll;
    margin: auto;
    padding: 0;
}

.thumbbar li{
	margin: 0 4px 0 0;
}

.thumbbarImage{
	height: 100%;
	display: flex;
	justify-content: space-around;
}

.thumbnailimage{
	height: 100%;
}

/*------Buchmodul-------*/

.bildLayout {
	max-width: 100%;	
}

.coverimage {
	max-width: 7em;
}

.cellautor {
	width: 13em;
}

/*------agb-------*/


.agb .editButtonHeader{
	display: block;
    position: absolute;
    margin: -31px 0 0px -3rem;
    width: min-content;
	z-index: 1;
}

div#impressum_text {
    overflow-y: auto;
    height: -webkit-fill-available;
    width: 40%;
    border-right: 2px solid #aaaaaa;
	height: 100%;
}
div#agb_text{
	overflow-y: auto;
    height: -webkit-fill-available;
    width: 40%;
    border-right: 2px solid #aaaaaa;
	height: 100%;
}

/*------impressum-------*/
.impressum {
    width: 100%;
}

.impressum .editButtonHeader{
	display: block;
    position: absolute;
    margin: -31px 0 0px -3rem;
    width: min-content;
	z-index: 1;
}

/*-------Footer-------*/

.footer{
	display: flex;
	justify-content: space-around;
	padding: 0.6rem 0;
	background-color: white;
	z-index: 1;
}

.footer a{
	color: var(--footer-font-color);
}

.social_media_div{
	margin-left: 12em;
}

.social_media_div a img {
    margin-right: 25px;
    height: 24px;
}

.copyright_div a{
	text-decoration: none;
}

.boersenverein-foerderung {
	width: 30rem;
}

/******************************/
/* Responsive*/
/******************************/
@media only screen and (max-width: 1024px) {
	
	.suchleiste {
		font-size: .7rem;
	}

	.footer {
		padding-inline: 1rem;
	}
	
	@MEDIA only screen and (max-width: 900px){
		
		.header_logo {
			margin: 10px 10px;
			flex: 1;
		}
		
		label.hamburg { 
		   display: block; 
		   width: 75px; height: 50px; 
		   position: relative; 
		   border-radius: 4px; 
		}

		.line { 
		   position: absolute; 
		   left:10px;
		   height: 4px; width: 55px; 
		   background: var(--second-color); 
		   border-radius: 2px;
		   display: block; 
		   transition: 0.5s; 
		   transform-origin: center; 
		}

		.line:nth-child(1) { top: 12px; }
		.line:nth-child(2) { top: 24px; }
		.line:nth-child(3) { top: 36px; }

		#hamburg:checked + .hamburg .line:nth-child(1){
		   transform: translateY(12px) rotate(-45deg);
		}

		#hamburg:checked + .hamburg .line:nth-child(2){
		   opacity:0;
		}

		#hamburg:checked + .hamburg .line:nth-child(3){
		   transform: translateY(-12px) rotate(45deg);
		}
		
		#hamburg:checked ~ .mobile .menuLevel1 {
			display: flex;
			height: 40vh;
		}
		
		.mobile {
			display: flex;
			overflow-x: hidden;
			overflow-y: auto;
			width: 100%;
		}
		
		.desktop {
			display: none;
		}
				
		.menu1 {
			align-items: flex-end;
			padding: 0;
			flex-wrap: wrap;
			justify-content: space-around;
		}
		
		.menu2 {
			margin-left: 1em;
		}
		
		.menuLevel1 {
			display: none;
			flex-direction: column;
			position: relative;
			align-items: center;
			background: #e4e4e4;
			padding-inline-start: 0px;
			width: 100%;
		}
		
		.menuLevel1>li:hover > ul {
			display: block;
		}
		
		.menuLevel1>li {
			margin-left: 0px;
			width: 100%;
			text-align: center;
			border-bottom: 1px solid #d4d4d4;
		}
		.menuLevel1>li:last-child {
			border-bottom: none;
		}
		
		.menuLevel1>li.selected>a::after, .menuLevel1>li.hasSelectedDescendant>a::after {
			display: none;
		}
		
		.menuLevel1 li a::after {
			content: ''
		}
		
		.menuLevel1>li>a::before {
			display:none;
		}
		
		.menuLevel1>li:hover .submenu_level_1{
			position: inherit;
			visibility: visible;
			opacity: 1;	
			transition: none;
			text-align: center;
		}
		
		.submenu_level_1 > li{
			margin-bottom: 0px;
			border-color: #e4e4e4;
		}
		
		.suchleiste {
			margin: 0 1em;
		}
		
		.suchleiste > p {
			display: none;
		}
		
		.shopVerwaltungPunkt > a {
			display: none;
		}
		
		.dropdown > a {
			display: none;
		}
		
		.dropdown-content {
			right: 10%;
		}
		
		.inner_content{
			margin: 0 var(--mobile-body-padding);
		}
		
		.copyright_div {
			margin-right: 1em;
			margin-left: 1em;
		}
		
		.warenkorbWrapper {
			padding-left: 0 !important;
			padding-right: 0 !important;
		}
		
		.footer {
			text-align: center;
		}
	}
		
		@media only screen and (max-width: 768px) {
			
			#frontPage {
				height: 100%;
			}
			
			#frontPage .installation-image {
				width: 100vw;
			}
			
			.container {
				width: 100%;
				height: 100%;
			}
			
			/*Banner*/
			.bannerImageWrapper {
				width: 197%;
				margin-left: -16px;
			}
			
			/*Container Suche und Menü*/
			.stickyHeader {
				width: 100vw;
				display: grid;
				grid-template-areas: "left middle right";
				grid-template-columns: 25%;
			}
			
			#suchContainer {
				width: fit-content;
				height: min-content;
				margin: 0;
				padding-top: 4x;
				grid-area: middle;
				background-color: transparent;
			}
			
			#suchContainer .suchtext {
				display: none;
			}
			
			#suchText {
				display: none;
			}
			
			#searchField {
				border: 1px solid;
				height: 24px
			}
			
			.searchButtonWrapper {
				background-color: var(--base-color);
			}
			
			#searchButton {
				filter: invert(1);
				background-color: transparent;
				transform: rotate(90deg);
			}
			/*Suche Ende*/
			
			.warenkorbButtonWrapper {
				margin-left: 0;
				grid-area: right;
			}
			.shopVerwaltungPunkt {
			    padding: 12px 46px 0px 0px;
			    display: flex;
				flex-direction: row;
				align-items: center;
			}
			
			/* Menü*/
			.menu1 {
				width: fit-content;
				grid-area: left;
				width: 100%;
			}
			
			.menu1 .mobile {
				width: 400%;
			}
			
			.menu1 ul li {
				width: 100%;
				border-right: none;
				display: list-item;
				height: fit-content;
			}
			
			.menuLevel1 {
				height: fit-content;
				background: white;
			}
			
			.mobile .menuLevel2 {
				display: block;
				width: 100%;
			}
			
			.menuLevel1 > li {
				display: flex !important;
				align-items: center;
				justify-content: space-around;
				flex-direction: column;
			}
			
			.menuLevel2 li {
				padding: 5px;
			}
			
			.menu1 li.liMenuEditButton {
				margin: 0px -90vw 0vw 0px;
				color: black;
			}
			
			.menu2 {
				display: none;
			}
			
			/*Menü Ende*/
			
			.seitenTitel {
				width: max-content;
				max-width: calc(100vw - var(--mobile-body-padding));
				margin-left: var(--mobile-body-padding);
				margin-top: var(--mobile-body-padding);
			}
			
			.seitenTitel h2 {
				max-width: calc(100vw - var(--mobile-body-padding) * 2);
				overflow: hidden;
				text-overflow: ellipsis
			}
			
			a.headlineOne{
				font-size: var(--fs-900) !important;
			}

			a.headlineTwo {
				font-size: var(--fs-800) !important;
				color: var(--base-color);
			}

			a.headlineThree {
				font-size: var(--fs-600) !important;
				color: var(--second-color);
			}

			a.fließtext{
				font-size: var(--fs-500) !important;
				color: var(--grey-color);
			}
			
			.contentRight {
				margin: 0;
				width: 100%;
			}
			
			.inner_content {
				width: calc(100% - var(--mobile-body-padding) * 2);
			}
			
			/* Buchmodul*/
			
			#einzelAnsichtBuch {
				display: none;
			}
			
			.buchListe {
				border: none;
				width: 100%;
			}
			
			.buch_cover {
				grid-area: buchCover;
				width: 5rem;
			}

			

			.readMoreWrapper {
				display: none !important;
			}
			
			.read_more .readMoreWrapper {
				display: flex !important;
				flex-direction: column;
				overflow-y: auto;
				max-height: 30ch !important;
				padding-block: 1ch;
			}
			
			.buchListe .responsiveWrapper {
				display: block;
			}

			.buchListe .responsiveDetails {
				flex: 1;
			}

			.buch_details_wrapper {
				display: none;
			}
			
			.produktdetails_div {
				grid-area: details-label;
			}
			
			.buch_details_untertitel_div {
				grid-area: untertitel;
			}
			
			.buch_details_erschienen_div {
				grid-area: erschienen;
			}
			
			.buch_details_seiten_div {
				grid-area: seiten;
			}
			
			.buch_details_sprache_div {
				grid-area: sprache;
			}
			
			.buch_details_verlag_div {
				grid-area: verlag;
			}
			
			.read_more .text_div {
				display: inline-block !important;
				grid-area: text;
				margin-block-end: 1rem;
			}
			
			.buch_details_wrapper .v-csslayout .v-label {
				flex: 3;
			}
			
			.buch_details_text_div .v-caption {
				display: none;
			}
			
			.buch_info_2 {
				text-align: right;
				margin-bottom: 10px;
			}
			
			.buch_info * {
				overflow-wrap: anywhere;
				align-items: flex-start;
				font-family: Arial;
			}

			.responsiveWrapper .buch_details_wrapper .titel_div{
				font-size: var(--fs-800) !important;
				margin-bottom:0.25em;
				color: var(--base-color);
			}
			.responsiveWrapper .buch_details_wrapper .preis_div{
				font-size: var(--fs-800) !important;
				color: var(--base-color);
			}
						
			.buch .responsiveWrapper * {
				line-height: 1.2;
			}
					
			
			.buchListe .responsiveWrapper .buch_details_wrapper {
				display: block;
				width: fit-content;
				padding-top: 0;
			}	
			.buchListe .buch_details_wrapper {
				display: none;
			}
			.buchListe .buchLeftDetails .buttons {
				display: none !important;
			}
			
			.buttons {
				display: flex !important;
				align-self: flex-start;
				margin-top: 1em;
				padding:15px 0px 0px 15px;
			}
			

			.mehrButtonResponsive {
				display: inline-block !important;
				background-color: transparent !important;
			}
			

			.mehrButtonResponsive > .mehrButton{
				background-color: transparent !important;
				color: var(--second-color) !important;
				font-size: 13px;
				font-family: Arial;
				height: 27px !important;
				border-radius: 0 !important;
				line-height: normal !important;
				color: var(--second-color) !important;
				padding: 5px !important;
				border: 1px solid var(--base-color) !important;
				margin-bottom: 10px;
				margin-inline-end: 1rem;
				width: fit-content;
			}
			
			.warenkorbButtonBackground {
				background-color: white;
			}
			
			.warenkorbButton {
				width: fit-content;
				align-self: flex-start;
				border: 1px solid var(--base-color) !important;
				background-color: transparent !important;
				border-radius: 0 !important;
				color: var(--second-color) !important;
				height: 27px !important;
				font-size: 13px !important;
				font-family: Arial !important;
			}
			.responsiveWrapper .warenkorbButton img{
				display: none;
			}
			
			.warenkorbgrid, #warenkorbGridWrapper {
				display: none !important;
			 }
			
			.responsiveWarenkorbWrapper {
			   display: block !important;
			   
				padding-top: 0 !important;
			}
			.responsiveWarenkorbWrapper vaadin-form-layout {
				display: block !important;
				padding: 0 0 25px 0 !important;
			}
			
			.responsiveWarenkorbWrapper vaadin-form-item {
				--vaadin-form-item-row-spacing: -18px;
				--vaadin-form-: -18px;
			}
			
			
			.responsiveWarenkorbWrapper .warenkorbpostenStyle table,
			.responsiveWarenkorbWrapper .warenkorbpostenStyle table tbody	{			
				display: block;
				width: 100%;
				box-sizing: border-box;
				overflow: hidden;
				text-overflow: ellipsis;
			}
			
			.changeMengeButton {
				border-radius: 24px !important;
			}
			
			.bestellpreisDivWarenkorb {
				margin: 0;
			}
			
			.v-slot-bestellpreisDivWarenkorb {
				top: -.5em;
				height: 5% !important;
			}
			
			.buchShopHeader{
				margin-bottom: 0;
			}
			
			.v-slot-warenkorbGrid, 
			.warenkorbGrid{
				display: none !important;
			 }
						 
			.responsiveKasseWrapper {
			   display: block !important;
			}
			
			.responsiveKasseWrapper .v-formlayout-row * {
				padding-top: 0 !important;
			}
			
			.v-slot-bestellpreisDivKasse .v-align-right {
				text-align: left;
			}
			
			.kasseGrid{
				display: none !important;
			}
			
			.v-slot.v-slot-shopAdresseWrapper {
				height: fit-content !important;
			}
			
			.shopAdresseWrapper {
				height: 60%;
			}
			.einzelAnsichtBuch{
				display: none !important;
			}
			
			/* Ende Buchmodul */
			
			/* Kontakt */
			
			.contacts_div {
				 width: 100%;
				 border: none;
			}
			
			/* Ende Kontakt */
			
			/* Artikel */
			
			.articleModul {
				overflow-x: hidden;
				overflow-y: auto;
			}
			
			.articelTextWrapper {
				width: 100%;
				height: 100%;
				max-width: 100%;
				word-wrap: break-word;
				overflow-y: auto;
				min-height: 10em;
			}
			
			.articelImageWrapper {
				width: 100%;
				height: fit-content;
			}
			
			#mainimage {
				max-height: 100%;
				padding-bottom: 0;
			}
			
			/* Ende Artikel */
			
			
			/* Galerie */
			
			.thumbbarImage {
				height: 85%;
			}
			 
			 /* Ende Galerie */
			 
			 div#impressum_text {
				width: 100%;
				height: 100%;
			 }
			 
			.richtlinienLayout div.v-layout.v-horizontal.v-widget {
				white-space: normal;
			}
			
			.displayContent{
				display:block;
			}
			
			#footerOwner {
				width: auto;
			}
		
			@MEDIA only screen and (max-width: 642px) {
				
				.footer {
					display: block;
				}
				
				
				.links_wrapper {
					margin-left: 1rem;
				}
				
				.linksmodulNormal {
					display: none;
				}
				
				.linksmodulResponsive {
					display: block;
				}
				
				@MEDIA only screen and (max-width: 400px) {
					
					.buch_details_text_div .buch_details_layout {
						padding-inline-end: 1rem;
					}
					
					.warenkorbButton .v-button-wrap .v-button-caption {
						display: none !important;
					}
				}
				
				.articleModul{
					display: flex;
					flex-direction: column;
					gap: 2em;
					margin-top: 1em;
				}
				
				.menu1 {
					background-color: transparent;
				}
			}
		}
		
	}
}