/* css zu abau_mitglieder */

/* footerCSS  */
footer{
  background-color:#6e6e6e;
  line-height: 25px;
}
footer > div{
  max-width:1302px;
  width:100% !important;
  margin:0 auto;
  display:flex;
  flex-wrap:wrap;
}
footer > div a:not(.footer_kontakt){
  text-decoration: none;

}
footer > div > div.dottedLines:first-of-type{padding-left: 10px;}
footer > div > div.dottedLines{vertical-align: top;}
footer > div > div.dottedLines:not(:last-of-type){
  width: 23%;
  margin-right:2%;
  border-right: 1px dotted #b1b1b1
}

@media screen and (max-width: 768px) {
footer > div > div.dottedLines{
  width: 48% !important;
padding: 5px;
border-right:0px solid transparent !important;
}

}
/* --- --- */
/* GlobalCSS  */
/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */
/* --------------------------- Variablen --------------------------- */
/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */
:root {
	/* Farben */
	/* Je höher die Nummer desto heller die Farbe */
	--green: #005541;
	
	--red: #E30513;
	--red2: #FF2D16;
	--red3: #FFF0F0; 
	
	--black: #000000;
	--black2: #1E1E1E;
	
	--gray: #AFB0B3;
	--gray2: #707070;
	--gray3: #888888;
	--gray4: #D3D3D3;
	--gray5: #DDDDDD;
	--gray6: #EBEDF2;
	--gray7: #EEEEEE;
	
	--white: #FFFFFF;
	
	
	
	/* Schriften */	
	--light: 'DIN-Light', sans-serif, Arial;
	--regular: 'DIN-Regular', sans-serif, Arial;
	--bold: 'DIN-Bold', sans-serif, Arial;
	
	--regular2: 'Anton-Regular', sans-serif, Arial;
	--opensans: 'OpenSans', sans-serif, Arial;
	--opensansbold: 'OpenSans-Bold', sans-serif, Arial;
	
	--roboto: 'Roboto', sans-serif, Arial;
	
	
	
	/* Abstände */
	--abstand_6: 0.4rem;
	--abstand_9: 0.7rem;
	--abstand_18: 1.4rem;
	--abstand_27: 2.1rem;
	--abstand_36: 2.8rem;
    --abstand_54: 4.2rem;
	--abstand_72: 5.6rem;
}




/* --------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------- */
/* --------------------------- Schriftarten Import --------------------------- */
/* --------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------- */
/* DIN */
@font-face{
	font-family: "DIN-Light";
	src: url("/fonts/din/din-light.woff2") format("woff2"),
	url("/fonts/din/din-light.woff") format("woff");
	font-display: fallback;
}

@font-face{
	font-family: "DIN-Regular";
	src: url("/fonts/din/din-regular.woff2") format("woff2"),
	url("/fonts/din/din-regular.woff") format("woff");
	font-display: fallback;
}

@font-face{
	font-family: "DIN-Bold";
	src: url("/fonts/din/din-bold.woff2") format("woff2"),
	url("/fonts/din/din-bold.woff") format("woff");
	font-display: fallback;
}

/* Impact Neu */
@font-face{
	font-family: "Anton-Regular";
	src: url("/fonts/anton/Anton-Regular.ttf");
	font-display: fallback;
}

/* Open Sans */
@font-face{
	font-family: "OpenSans";
	src: url("/fonts/OpenSans/OpenSans-Regular-webfont.woff") format("woff"),
	url("/fonts/OpenSans/OpenSans-Regular-webfont.ttf") format("ttf");
	font-display: fallback;
}
@font-face{
	font-family: "OpenSans-Bold";
	src: url("/fonts/OpenSans/OpenSans-Bold-webfont.woff") format("woff"),
	url("/fonts/OpenSans/OpenSans-Bold-webfont.ttf") format("ttf");
	font-display: fallback;
}

/* Roboto */
@font-face{
	font-family: "Roboto";
	src: url("/fonts/roboto/RobotoSlab-Light.woff");
	font-display: fallback;
}



/* ------------------------------------------------------------- */
/* ------------------------------------------------------------- */
/* -------------------- Schriftformatierung -------------------- */
/* ------------------------------------------------------------- */
/* ------------------------------------------------------------- */

body {
	font-family: var(--regular);
	font-size: 17px;
	hyphens: auto;
}

h1, h2, h3, h4 {margin-top: 0;}
h1 {font-size: 206%;} /* 35px zu 17px*/
h1.large {font-size:412%;} /* 70px zu 17px */
h2 {font-size:153%;} /* 26px zu 17px */
h3 {font-size:124%;} /* 21px zu 17px */
/*h1.banner_unter_menue {bottom: -12px !important;}*/

b, strong, h1, h2, h3, h4 {
	font-family: var(--bold);
	font-weight: normal;
}

.source, .source * {
	font-family: var(--regular);
}

.impact, .impact *, .buttonPfeil, .buttonPfeilWeiss {
	font-family: var(--regular2) !important;
	line-height: 127%;
}

.openSans, .openSans * {
	font-family: var(--opensans);
}

.openSansBold, .openSansBold * {
	font-family: var(--opensansbold);
}

.roboto {
	font-family: var(--roboto);
}

h1.roboto, h2.roboto, h3.roboto, h4.roboto {
	font-weight: bold;
}

.normal {
	font-weight: normal;
	font-family: var(--regular) !important;
}

.light {
	font-weight: lighter;
}

.bold {
	font-family: var(--bold);
	font-weight: normal;
}


.italic {font-style: italic;}

.underline {text-decoration: underline;}
.uppercase {text-transform: uppercase;}
.lowercase {text-transform: lowercase;}

.big {
	font-size: 130% !important;
}

.zahl {
	font-size: 320%;
	font-weight: lighter;
	font-family: var(--light);
}

.datum {
	font-size: 69%;
} /* 9px zu 17px */

.menutop, .small, .breadcrumb {
	font-size: 76%;
	font-weight: lighter;
	font-family: var(--light);
} /* 13px zu 17px */ 

.menu {font-size: 85%; font-weight: lighter; font-family: var(--light);} /* 14px zu 17px */
.submenu {font-size: 76%; font-weight: lighter; font-family: var(--light);} /* 13px zu 17px */


@media (max-width: 1024px) {
	body {font-size: 16px;}
	h1.large {font-size:331%;} /* 53px zu 16px */

	.zahl {
		font-size: 240%;
	}
}

@media (max-width: 600px) {
	body {font-size: 15px; }
	.big { font-size: 120%; }
}



/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ------------------------------ Inputs ------------------------------ */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */

input:not([type="checkbox"], [type="radio"], [type="button"], [type="submit"], .inputNoFormat),
textarea,
select {
	font-family: inherit;
	font-size: 80%;
	width: 300px;
	max-width: 100%;
	outline: none;
}



input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], .inputNoFormat),
textarea,
select {
	height: 30px;
	padding: 0 5px;
	border: 1px solid var(--gray);
	background-color: var(--white);
	transition: border-color 200ms ease-in-out;
	border-radius: 4px;
}

input[type="color"] {
	padding: 0;
}

input[type="file"] {
	padding: 0;
	width: unset;
	height: unset;
	padding: 5px;
}

/*
input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [readonly], .inputNoFormat):hover,
input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [readonly], .inputNoFormat):active,
input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [readonly], .inputNoFormat):focus,
textarea:hover,
textarea:active,
textarea:focus,
select:hover,
select:active,
select:focus {
	border-color: var(--red);
}
*/

input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [readonly], .inputNoFormat):invalid,
textarea:invalid,
select:invalid {
	background-color: var(--red3);
	border-color: var(--red);
}

input:not([type="checkbox"], [type="radio"], [type="range"], [type="button"], [type="submit"], [readonly], .inputNoFormat):invalid:placeholder-shown,
textarea:invalid:placeholder-shown,
select:invalid:placeholder-shown {
    background-color: var(--white);
}


input[readonly], textarea[readonly] {
	background-color: var(--gray7);
	color: var(--gray6);
}

textarea {
	height: 150px;
	width: 400px;
	scrollbar-width: thin;
	padding: 5px;
}


input[type="radio"], input[type="checkbox"] {
	filter: grayscale(100%) sepia(23%) saturate(34) hue-rotate(310deg) contrast(250%);
}




/* --------------------------------------------------------------------- */
/* --------------------------------------------------------------------- */
/* ------------------------------ Buttons ------------------------------ */
/* --------------------------------------------------------------------- */
/* --------------------------------------------------------------------- */
input[type="checkbox"], input[type="radio"],
input[type="submit"], input[type="button"],
button,
label,
select {
	cursor: pointer;
}

input[type="button"]:not(.buttonNoFormat, .sucheInklButtonBtn), input[type="submit"]:not(.buttonNoFormat, .sucheInklButtonBtn), button:not(.buttonNoFormat, .sucheInklButtonBtn), .button, .buttonWide, .buttonPfeil, .buttonPfeilWeiss {
	font-family: inherit;
	font-size: inherit;
	height: 38px;
	max-width: 100%;
	padding: 0 30px;
	/* transition: background-color 200ms ease-in-out, color 200ms ease-in-out, border-color 200ms ease-in-out; */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	overflow: hidden;
	outline: none;
}

input[type="button"]:not(.buttonNoFormat, .sucheInklButtonBtn), input[type="submit"]:not(.buttonNoFormat, .sucheInklButtonBtn, .buttonPfeil, .buttonPfeilWeiss), button:not(.buttonNoFormat, .sucheInklButtonBtn, .buttonPfeil, .buttonPfeilWeiss), .button, .buttonWide {
	border-radius: 0;
}

.buttonWide {
	width: 300px;
}

input[type="button"]:not(.buttonNoFormat, .sucheInklButtonBtn), input[type="submit"]:not(.buttonNoFormat, .sucheInklButtonBtn), button:not(.buttonNoFormat, .sucheInklButtonBtn), .button, .buttonWide, .buttonPfeil, .buttonPfeilWeiss {
	background-color: var(--red);
	color: var(--white);
	border: 1px solid transparent;
}

.buttonPfeilWeiss {
    background-color: var(--white);
	color: var(--red);
	border: 1px solid transparent;
}


.buttonPfeil, .buttonPfeilWeiss {
	background-repeat: no-repeat;
	background-size: 65px 35px;
	background-position-x: 3px;
	background-position-y: center;
	padding: 8px 30px 8px 100px !important;
	padding-left: 100px !important;
    border-radius: 3px;
}

.buttonPfeil {
	background-image: url('/bilder/abau/pfeile_weiss.svg');
}

.buttonPfeilWeiss {
	background-image: url('/bilder/abau/pfeile_rot.svg');
}



input[type="button"]:not(.buttonNoFormat, .sucheInklButtonBtn):hover, input[type="submit"]:not(.buttonNoFormat, .sucheInklButtonBtn):hover, button:not(.buttonNoFormat, .sucheInklButtonBtn):hover, .button:hover, .buttonWide:hover, .buttonPfeil:hover, .pfeileweiss:hover,
input[type="button"]:not(.buttonNoFormat, .sucheInklButtonBtn):active, input[type="submit"]:not(.buttonNoFormat, .sucheInklButtonBtn):active, button:not(.buttonNoFormat, .sucheInklButtonBtn):active, .button:active, .buttonWide:active, .buttonPfeil:active, .pfeileweiss:active {
	color: var(--gray6);
    text-decoration: none;
}

.buttonPfeilWeiss:hover,
.buttonPfeilWeiss:active {
    color: var(--red2);
    text-decoration: none;
}




/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ------------------------------ Farben ------------------------------ */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
body {
	background-color: var(--gray2);
	color: var(--black2);
}

a {
	color: var(--red);
	text-decoration: none;
}
a:hover {
	color: var(--red2);
	text-decoration: underline;
}

::selection {
    background-color: var(--red);
    color: var(--white);
}

.weiss, .weiss * {color: var(--white);} .bg_weiss {background-color: var(--white);} 
.rot, .rot * {color: var(--red);} .bg_rot {background-color: var(--red);} 
.hellrot, .hellrot * {color: var(--red2);} .bg_hellrot {background-color: var(--red2);} 
.schwarz, .schwarz * {color: var(--black);} .bg_schwarz {background-color: var(--black);} 
.grau, .grau * {color: var(--gray);} .bg_grau {background-color: var(--gray) !important;} 
.dunkelgrau, .dunkelgrau * {color: var(--gray2);} .bg_dunkelgrau {background-color: var(--gray2);} 
.hellgrau, .hellgrau * {color: var(--gray6);} .bg_hellgrau {background-color: var(--gray6);} 

a.rot:hover {color: var(--gray2);}

a.dunkelgrau:hover {color: var(--red) !important;}




/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ------------------------------ Border ------------------------------ */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
.border_rot {border: 1px solid var(--red);}
.border_hellrot {border: 1px solid var(--red2);}
.border_schwarz {border: 1px solid var(--black2);}
.border_dunkelgrau {border: 1px solid var(--gray2);}
.border_grau {border: 1px solid var(--gray);}
.border_grau_l {border-left: 1px solid var(--gray);}
.border_hellgrau {border: 1px solid var(--gray6);}
.border_weiss {border: 1px solid var(--white);}

.shadow {
	box-shadow: -1px 1px 12px 0px rgb(0 0 0 / 50%); /* 10px 0px 25px -15px rgba(0,0,0,.3); */
}

.border_just_bottom {
	border-top: 0;
	border-left:0;
	border-right:0;
}

.border_just_left {
	border-top: 0;
	border-bottom: 0;
	border-right: 0;
} 

.border_just_top {
	border-bottom: 0;
	border-left: 0;
	border-right: 0;
}

.border_just_right {
	border-top: 0;
	border-left: 0;
	border-bottom: 0;
}



a, a.rot {color: var(--red); text-decoration: none}
a.weiss {color: var(--white); text-decoration: none}
a.grau {color: var(--gray2); text-decoration: none}
a.underline {text-decoration: underline !important;}
a:hover, a.weiss:hover { color: var(--red2); text-decoration: underline;}
a.rot:hover {color: var(--gray2);}


.dottedBorderBottom {border-bottom: 1px dotted var(--gray3);}
.dottedBorderTop {border-top: 1px dotted var(--gray3);}



/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ----------------------------- Breiten ------------------------------ */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
.wide, .col14, .col24, .col34, .col44,
.col13, .col23, .col33, .col15, .col25, .col35, .col45, .col12  {
	display: inline-block;
	vertical-align: top;
}

.col44, .col33, .wide {width: 100%;}
.col14 {width: 25%;}
.col15 {width: 20%;}
.col13 {width: 33.33%;}
.col25 {width: 40%;}
.col24, .col12 {width: 50%;}
.col35 {width: 60%;}
.col45 {width: 80%;}
.col23 {width: 66.66%;}
.col34 {width: 75%;}


/* ---------- Flex ---------- */
#main > .bigIncludeTo {
	display: flex;
	flex-wrap: wrap;
}

.col12flexAb, .col13flexAb, .col13flexAb36, .col14flexAb, .col13flexAb9, .col14flexAb36  {
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
}

.col12flexAb {
	row-gap: 28px;
	column-gap: 28px;
}

.col13flexAb {
	row-gap: 48px;
	column-gap: 48px;
}

.col13flexAb36 {
    gap: var(--abstand_36)
}

.col13flexAb9 {
	row-gap: 20px;
	column-gap: 20px;
}

.col14flexAb {
	row-gap: 20px;
	column-gap: 20px;
}

.col14flexAb36 {
	row-gap: 40px;
	column-gap: 40px;
}


.col12flexAb > * {
    width: calc(50% - 14px);
}

.col13flexAb > * {
    width: calc(33.33% - 32px);
}

.col13flexAb36 > * {
    width: calc(33.33% - var(--abstand_36) * 2 / 3);
}

.col13flexAb9 > * {
    width: calc(33.33% - 13.33px);
}

.col14flexAb > * {
    width: calc(25% - 15px);
}

.col14flexAb36 > * {
    width: calc(25% - 30px);
}



@media screen and (max-width: 1240px) {
	.col14flexAb > * {width: calc(33.33% - 13.33px);}
	.col14flexAb36 > * {width: calc(33.33% - 26.66px);}
	.col13flexAb > * {width: calc(50% - 24px);}
}
@media (max-width: 1024px) {
	.col25, .col35 {width: 50%;} 
	.col15 {width: 25%}
	.col45 {width: 75%}
	
	.col14flexAb > * {width: calc(50% - 10px);}
	.col14flexAb36 > * {width: calc(50% - 20px);}

    .col13flexAb36 > * {
        width: calc(50% - var(--abstand_36) / 2);
    }
}
@media (max-width: 768px) {
	.col24, .col23, .col34, .col12, .col12flexAb > *, .col13flexAb > * {width: 100%;}
	.col14, .col13 {width: 50%;}
	.col13flexAb9 > * {width: calc(50% - 10px);}
}
@media (max-width: 600px) {
	.col14, .col13, .col15, .col25, .col35, .col45, .col14flexAb > *, .col13flexAb9 > *, .col14flexAb36 > *, .col13flexAb36 > * {
        width: 100%;
    }
}





/* --------------------------------------------------------------------- */
/* --------------------------------------------------------------------- */
/* ----------------------------- Abstaende ----------------------------- */
/* --------------------------------------------------------------------- */
/* --------------------------------------------------------------------- */
.contentWrapper {
	padding-left: var(--abstand_54);
	padding-right: var(--abstand_54);
}

.contentWrapper2, #main > .bigIncludeTo {
	/* padding-left: calc(var(--abstand_72) + var(--abstand_36));
	padding-right: 4.9rem; */
    padding-left: calc(var(--abstand_36) * 3);
    padding-right: calc(var(--abstand_36) * 3);
}


.vp0 {padding-top: 0px; padding-bottom: 0px;}
.tp0 {padding-top: 0px; } .bp0 {padding-bottom: 0px;}
.vm0 {margin-top: 0px; margin-bottom: 0px;}
.tm0 {margin-top: 0px; } .bm0 {margin-bottom: 0px;}

.hp0 {padding-left: 0px; padding-right: 0px;}
.lp0 {padding-left: 0px; } .rp0 {padding-right: 0px;}
.hm0 {margin-left: 0px; margin-right: 0px;}
.lm0 {margin-left: 0px; } .rm0 {margin-right: 0px;}


.hp6 {padding-left: var(--abstand_6); padding-right: var(--abstand_6);}
.lp6 {padding-left: var(--abstand_6); } .rp6 {padding-right: var(--abstand_6);}
.hm6 {margin-left: var(--abstand_6); margin-right: var(--abstand_6);}
.lm6 {margin-left: var(--abstand_6); } .rm6 {margin-right: var(--abstand_6);}

.vp6 {padding-top: var(--abstand_6); padding-bottom: var(--abstand_6);}
.tp6 {padding-top: var(--abstand_6); } .bp6 {padding-bottom: var(--abstand_6);}
.vm6 {margin-top: var(--abstand_6); margin-bottom: var(--abstand_6);}
.tm6 {margin-top: var(--abstand_6); } .bm6 {margin-bottom: var(--abstand_6);}


.hp9 {padding-left: var(--abstand_9); padding-right: var(--abstand_9);}
.lp9 {padding-left: var(--abstand_9); } .rp9 {padding-right: var(--abstand_9);}
.hm9 {margin-left: var(--abstand_9); margin-right: var(--abstand_9);}
.lm9 {margin-left: var(--abstand_9); } .rm9 {margin-right: var(--abstand_9);}

.vp9 {padding-top: var(--abstand_9); padding-bottom: var(--abstand_9);}
.tp9 {padding-top: var(--abstand_9); } .bp9 {padding-bottom: var(--abstand_9);}
.vm9 {margin-top: var(--abstand_9); margin-bottom: var(--abstand_9);}
.tm9 {margin-top: var(--abstand_9); } .bm9 {margin-bottom: var(--abstand_9);}


.hp18 {padding-left: var(--abstand_18); padding-right: var(--abstand_18);}
.lp18 {padding-left: var(--abstand_18); } .rp18 {padding-right: var(--abstand_18);}
.hm18 {margin-left: var(--abstand_18); margin-right: var(--abstand_18);}
.lm18 {margin-left: var(--abstand_18); } .rm18 {margin-right: var(--abstand_18);}

.vp18 {padding-top: var(--abstand_18); padding-bottom: var(--abstand_18);}
.tp18 {padding-top: var(--abstand_18); } .bp18 {padding-bottom: var(--abstand_18);}
.vm18 {margin-top: var(--abstand_18); margin-bottom: var(--abstand_18);}
.tm18 {margin-top: var(--abstand_18); } .bm18 {margin-bottom: var(--abstand_18);}


.hp27 {padding-left: var(--abstand_27); padding-right: var(--abstand_27);}
.lp27 {padding-left: var(--abstand_27); } .rp27 {padding-right: var(--abstand_27);}
.hm27 {margin-left: var(--abstand_27); margin-right: var(--abstand_27);}
.lm27 {margin-left: var(--abstand_27); } .rm27 {margin-right: var(--abstand_27);}

.vp27 {padding-top: var(--abstand_27); padding-bottom: var(--abstand_27);}
.tp27 {padding-top: var(--abstand_27); } .bp27 {padding-bottom: var(--abstand_27);}
.vm27 {margin-top: var(--abstand_27); margin-bottom: var(--abstand_27);}
.tm27 {margin-top: var(--abstand_27); } .bm27 {margin-bottom: var(--abstand_27);}


.hp36 {padding-left: var(--abstand_36); padding-right: var(--abstand_36);}
.lp36 {padding-left: var(--abstand_36); } .rp36 {padding-right: var(--abstand_36);}
.hm36 {margin-left: var(--abstand_36); margin-right: var(--abstand_36);}
.lm36 {margin-left: var(--abstand_36); } .rm36 {margin-right: var(--abstand_36);}

.vp36 {padding-top: var(--abstand_36); padding-bottom: var(--abstand_36);}
.tp36 {padding-top: var(--abstand_36); } .bp36 {padding-bottom: var(--abstand_36);}
.vm36 {margin-top: var(--abstand_36); margin-bottom: var(--abstand_36);}
.tm36 {margin-top: var(--abstand_36); } .bm36 {margin-bottom: var(--abstand_36);}


.hp54 {padding-left: var(--abstand_54); padding-right: var(--abstand_54);}
.lp54 {padding-left: var(--abstand_54); } .rp54 {padding-right: var(--abstand_54);}
.hm54 {margin-left: var(--abstand_54); margin-right: var(--abstand_54);}
.lm54 {margin-left: var(--abstand_54); } .rm54 {margin-right: var(--abstand_54);}

.vp54 {padding-top: var(--abstand_54); padding-bottom: var(--abstand_54);}
.tp54 {padding-top: var(--abstand_54); } .bp54 {padding-bottom: var(--abstand_54);}
.vm54 {margin-top: var(--abstand_54); margin-bottom: var(--abstand_54);}
.tm54 {margin-top: var(--abstand_54); } .bm54 {margin-bottom: var(--abstand_54);}


.hp72 {padding-left: var(--abstand_72); padding-right: var(--abstand_72);}
.lp72 {padding-left: var(--abstand_72); } .rp72 {padding-right: var(--abstand_72);}
.hm72 {margin-left: var(--abstand_72); margin-right: var(--abstand_72);}
.lm72 {margin-left: var(--abstand_72); } .rm72 {margin-right: var(--abstand_72);}

.vp72 {padding-top: var(--abstand_72); padding-bottom: var(--abstand_72);}
.tp72 {padding-top: var(--abstand_72); } .bp72 {padding-bottom: var(--abstand_72);}
.vm72 {margin-top: var(--abstand_72); margin-bottom: var(--abstand_72);}
.tm72 {margin-top: var(--abstand_72); } .bm72 {margin-bottom: var(--abstand_72);}


.wide1.hm9, .col14.hm9 {width: calc(24.9% - var(--abstand_18));}
.col13.hm9, .col13-2-1.hm9 {width: calc(33% - var(--abstand_18));}
.col13.hm9.button {width: calc(33% - 1.8rem);}
.wide2.hm9, .col24.hm9 {width: calc(49.9% - var(--abstand_18));}
.col23.hm9 {width: calc(66% - var(--abstand_18));}
.wide3.hm9, .col34.hm9 {width: calc(74.9% - var(--abstand_18));}
.col44.hm36, .col33.hm36, .wide4.hm36,
.col44.hm36-18, .col33.hm36-18, .wide4.hm36-18,
.col44.hm36-18-0, .col33.hm36-18-0, .wide4.hm36-18-0 { width: calc(100% - var(--abstand_72));}

.hm36-18-0, .hm36-18 {margin-left: var(--abstand_36); margin-right: var(--abstand_36);} 
.hp36-18-0, .hp36-18 {padding-left: var(--abstand_36); padding-right: var(--abstand_36);} 
.lp36-18-0, .lp36-18 {padding-left: var(--abstand_36);} 
.rp36-18-0, .rp36-18 {padding-right: var(--abstand_36);} 
.lm36-18-0, .lm36-18 {margin-right: var(--abstand_36);} 
.rm36-18-0, .rm36-18 {margin-right: var(--abstand_36);} 

.wide85 {width: 85%;}

.show360 {display: none !important;}


@media (max-width: 1024px) {
	.contentWrapper {
		padding-left: var(--abstand_36);
		padding-right: var(--abstand_36);
	}

	.contentWrapper2, #main > .bigIncludeTo {
		padding-left: var(--abstand_36);
		padding-right: var(--abstand_36);
	}
	
	
	.tvp0 {padding-top: 0px; padding-bottom: 0px;}
	.ttp0 {padding-top: 0px; } .tbp0 {padding-bottom: 0px;}
	.tvm0 {margin-top: 0px; margin-bottom: 0px;}
	.ttm0 {margin-top: 0px; } .tbm0 {margin-bottom: 0px;}

	.thp0 {padding-left: 0px; padding-right: 0px;}
	.tlp0 {padding-left: 0px; } .trp0 {padding-right: 0px;}
	.thm0 {margin-left: 0px; margin-right: 0px;}
	.tlm0 {margin-left: 0px; } .trm0 {margin-right: 0px;}
	
	.thp6 {padding-left: var(--abstand_6); padding-right: var(--abstand_6);}
	.tlp6 {padding-left: var(--abstand_6); } .trp6 {padding-right: var(--abstand_6);}
	.thm6 {margin-left: var(--abstand_6); margin-right: var(--abstand_6);}
	.tlm6 {margin-left: 0var(--abstand_6); } .trm6 {margin-right: var(--abstand_6);}

	.tvp6 {padding-top: var(--abstand_6); padding-bottom: var(--abstand_6);}
	.ttp6 {padding-top: var(--abstand_6); } .tbp6 {padding-bottom: var(--abstand_6);}
	.tvm6 {margin-top: var(--abstand_6); margin-bottom: var(--abstand_6);}
	.ttm6 {margin-top: var(--abstand_6); } .tbm6 {margin-bottom: var(--abstand_6);}


	.thp9 {padding-left: var(--abstand_9); padding-right: var(--abstand_9);}
	.tlp9 {padding-left: var(--abstand_9); } .trp9 {padding-right: var(--abstand_9);}
	.thm9 {margin-left: var(--abstand_9); margin-right: var(--abstand_9);}
	.tlm9 {margin-left: var(--abstand_9); } .trm9 {margin-right: var(--abstand_9);}

	.tvp9 {padding-top: var(--abstand_9); padding-bottom: var(--abstand_9);}
	.ttp9 {padding-top: var(--abstand_9); } .tbp9 {padding-bottom: var(--abstand_9);}
	.tvm9 {margin-top: var(--abstand_9); margin-bottom: var(--abstand_9);}
	.ttm9 {margin-top: var(--abstand_9); } .tbm9 {margin-bottom: var(--abstand_9);}
	
	.thp18 {padding-left: var(--abstand_18); padding-right: var(--abstand_18);}
	.tlp18 {padding-left: var(--abstand_18); } .trp18 {padding-right: var(--abstand_18);}
	.thm18 {margin-left: var(--abstand_18); margin-right: var(--abstand_18);}
	.tlm18 {margin-left: var(--abstand_18); } .trm18 {margin-right: var(--abstand_18);}

	.tvp18 {padding-top: var(--abstand_18); padding-bottom: var(--abstand_18);}
	.ttp18 {padding-top: var(--abstand_18); } .tbp18 {padding-bottom: var(--abstand_18);}
	.tvm18 {margin-top: var(--abstand_18); margin-bottom: var(--abstand_18);}
	.ttm18 {margin-top: var(--abstand_18); } .tbm18 {margin-bottom: var(--abstand_18);}


	.thp27 {padding-left: var(--abstand_27); padding-right: var(--abstand_27);}
	.tlp27 {padding-left: var(--abstand_27); } .trp27 {padding-right: var(--abstand_27);}
	.thm27 {margin-left: var(--abstand_27); margin-right: var(--abstand_27);}
	.tlm27 {margin-left: var(--abstand_27); } .trm27 {margin-right: var(--abstand_27);}

	.tvp27 {padding-top: var(--abstand_27); padding-bottom: var(--abstand_27);}
	.ttp27 {padding-top: var(--abstand_27); } .tbp27 {padding-bottom: var(--abstand_27);}
	.tvm27 {margin-top: var(--abstand_27); margin-bottom: var(--abstand_27);}
	.ttm27 {margin-top: var(--abstand_27); } .tbm27 {margin-bottom: var(--abstand_27);}


	.thp36 {padding-left: var(--abstand_36); padding-right: var(--abstand_36);}
	.tlp36 {padding-left: var(--abstand_36); } .trp36 {padding-right: var(--abstand_36);}
	.thm36 {margin-left: var(--abstand_36); margin-right: var(--abstand_36);}
	.tlm36 {margin-left: var(--abstand_36); } .trm36 {margin-right: var(--abstand_36);}

	.tvp36 {padding-top: var(--abstand_36); padding-bottom: var(--abstand_36);}
	.ttp36 {padding-top: var(--abstand_36); } .tbp36 {padding-bottom: var(--abstand_36);}
	.tvm36 {margin-top: var(--abstand_36); margin-bottom: var(--abstand_36);}
	.ttm36 {margin-top: var(--abstand_36); } .tbm36 {margin-bottom: var(--abstand_36);}
	
	.thp42 {padding-left: 4.2rem; padding-right: 4.2rem;}
	
	
	
	.thp54 {padding-left: 4.2rem; padding-right: 4.2rem;}
	
	.tlp72 {padding-left: var(--abstand_72); } .trp72 {padding-right: var(--abstand_72);}
}

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

@media (max-width: 600px) {
	.contentWrapper {
		padding-left: var(--abstand_18);
		padding-right: var(--abstand_18);
	}

	.contentWrapper2, #main > .bigIncludeTo {
		padding-left: var(--abstand_18);
		padding-right: var(--abstand_18);
	}
	
	
	.mbm9 {margin-bottom: var(--abstand_9);}
	.mtm9 {margin-top: var(--abstand_9);}
	
	.mhp18 {padding-left: var(--abstand_18); padding-right: var(--abstand_18);}
	.mbm18 {margin-bottom: var(--abstand_18);}
	
	.mhp9 {padding-left: var(--abstand_9); padding-right: var(--abstand_9);}
	
	.mhm18 {margin-left: var(--abstand_18); margin-right: var(--abstand_18);}
	.mhp18 {padding-left: var(--abstand_18); padding-right: var(--abstand_18);}
	.mvm18 {margin-top: var(--abstand_18); margin-bottom: var(--abstand_18);}
	.mlp18 {padding-left: var(--abstand_18);}
	
	.mhp0 {padding-left: 0rem; padding-right: 0rem;}
	.mlp0 {padding-left: 0rem; } .mrp0 {padding-right: 0rem;}
	.mhm0 {margin-left: 0rem; margin-right: 0rem;}
	.mlm0 {margin-left: 0rem; } .mrm0 {margin-right: 0rem;}

	.mvp0 {padding-top: 0rem; padding-bottom: 0rem;}
	.mtp0 {padding-top: 0rem; } .mbp0 {padding-bottom: 0rem;}
	.mvm0 {margin-top: 0rem; margin-bottom: 0rem;}
	.mtm0 {margin-top: 0rem; } .mbm0 {margin-bottom: 0rem;}
}




/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */
/* ---------------------------- Allgemein ----------------------------- */
/* -------------------------------------------------------------------- */
/* -------------------------------------------------------------------- */

* {
	box-sizing: border-box;
	scroll-behavior: smooth;
}

body {margin:0px;}

#main {
	max-width: 1440px;
	margin-left: auto;
	margin-right: auto;
	background-color: var(--white);
}

img, video {
	max-width: 100%;
	max-height: 100%;
}

noindex {
	display: block;
}



.dib {display: inline-block;}
.block {display: block;}
.none, .radio_none, .hide {display: none !important;}
.oScroll {overflow: scroll;}
.oHide {overflow: hidden;}
.oVisible {overflow: visible;}
.hr {text-align:right}
.hl {text-align:left}
.hc {text-align:center}
.vt {vertical-align:top}
.vb {vertical-align:bottom}
.vm {vertical-align:middle}
.float_left {float:left;}
.float_right {float:right;}
.float_clear {float:none;}
.inher {color: inherit;}
.noHover:hover {text-decoration: none;}


/* ------------- Position ------------- */

.relative {position:relative;}
.absolute {position:absolute;}
.positionRechts {position:absolute; top: 0px; bottom: 0px; right: 0px; }
.positionLinks {position:absolute; top: 0px; bottom: 0px; left: 0px; }
.positionRechtsUnten {position:absolute; bottom: 0px; right: 0px; } 
.positionLinksUnten {position:absolute; bottom: 0px; left: 0px; } 
.positionUnten {position:absolute; bottom: 0px;  } 


/* ------------- Platzhalter ------------- */

.platzhalter300 {height: 300px;}
.platzhalter600 {height: 600px;}

/* ------------- Flex ------------- */

.flex, .inlineFlex {
	flex-wrap: wrap;
	justify-content: left;
}

.flex {
	display: flex;
}

.inlineFlex {
	display: inline-flex;
}

.flexHl {justify-content: left;}
.flexHr {justify-content: right;}
.flexHc {justify-content: center;}

.flexVt {align-items: start;}
.flexVb {align-items: end;}
.flexVc {align-items: center;}


.flexNoWrap {flex-wrap: nowrap;}
.flexRow {flex-direction: row;}
.flexCol {flex-direction: column;}


.noTextHide[data-textlength="0"], .noTextHide[data-textlength="1"], .noPicHide[src=""] {
	display: none;
}


.show1240, .show900, .show600, .show768 {display: none;}

@media (max-width: 1440px) {
	.hide1440 {display: none !important;}
}
@media (max-width: 1240px) {
	.hide1240 {display: none !important;}
	.col13-2-1 {width: 49%;} 
	.show1240 {display: inline-block !important;}
}
@media (max-width: 1024px) {
	.hide1024 {display: none !important;}
}
@media (max-width: 900px) {
	.hide900 {display: none !important;}
	.show900 {display: inline-block !important;}
}
@media (max-width: 768px) {
	.hide768 {display: none !important;}
	.show768 {display: inline-block !important;}
}
@media screen and (max-width: 600px) {
	.hide600 {display: none !important;}
	.show600 {display: inline-block !important;}
}





/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */
/* ---------------------------- Module ----------------------------- */
/* ----------------------------------------------------------------- */
/* ----------------------------------------------------------------- */

/* ------------- Liste Arrow 1 ------------- */
ul.list_arrow {
	list-style: none;
	/*padding-left: 20px;*/
	padding-left: 0; /* Timon 231121*/
}
ul.list_arrow > li {
	padding-left: 20px;
	position: relative;
}
ul.list_arrow > li::before {
	content: "»";
	color: var(--red);
	position: absolute;
	left: 0;
}





/* ------------------------------------- */
/* ---------- Kontaktformular ---------- */
/* ------------------------------------- */
.formularColL, .formularColR, .formularCaptchaWrapper > div > * {
	display: inline-block;
	vertical-align: top;
}

.formularColL, .formularColR {margin-bottom: 14px;}
.formularColL {width: 200px;}
.formularColR {width: calc(100% - 200px);}
.formularCaptchaWrapper > div > aside {margin-right: 14px;}

.kontakt_feld {width: 315px !important;}
#kontakt_plz {width: 100px !important;}

@media screen and (max-width: 600px) {
	.formularColL, .formularColR {width: 100%;}
	.formularColL {margin-bottom: 0;}
	
	.kontakt_feld {width: 100% !important;}
}





/* ------------------------------------------ */
/* ------------- a-Tag Dropdown ------------- */
/* ------------------------------------------ */
/*BEGIN BEISPIEL HTML CODE*/
/*<div class="dropdown">
	<style>
		.dropdown > label:not([data-link="./{%session.TemplateName%}"]){display:none;}
		.dropdown > div > a[href="./{%session.TemplateName%}"]{background-color:var(--gray5);}
	</style>
	<label for="chk_dropdown" data-link="./epis_erfassen">Lieferanten</label>
	<label for="chk_dropdown" data-link="./epis_gruppenzuordnung">Zuordnung</label>
	<label for="chk_dropdown" data-link="./epis_kataloge">Kataloge</label>
	<label for="chk_dropdown" data-link="./epis_konditionen">Konditionen</label>
	<label for="chk_dropdown" data-link="./epis_region">Region</label>
	<div>
		<a href="./epis_erfassen">Lieferanten</a>
		<a href="./epis_gruppenzuordnung">Zuordnung</a>
		<a href="./epis_kataloge">Kataloge</a>
		<a href="./epis_konditionen">Konditionen</a>
		<a href="./epis_region">Region</a>
	</div>
</div>*/
/*END BEISPIEL HTML CODE*/

#chk_dropdown {display: none;}
.dropdown{
	border:1px solid var(--gray);
	border-radius: 4px;
	position: relative;
}
.dropdown > label::after {
	content:'';
	display:inline-block;
	position: absolute;
	right: 10px;
	top:50%;
	transform: translateY(-50%);
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left:10px solid var(--red);
	transition: 100ms transform ease-in-out;
}
.dropdown > label {
	width: 100%;
	padding: 5px 40px 5px 15px;
	display:inline-block;
	font-size: 1.5rem;
}
.dropdown > div {
	position: absolute;
	width: 100%;
	background-color: var(--white);
	top: calc(100% + 1px);
	left: 0;
	box-shadow: 1px 1px 10px -4px var(--black);
	display:none;
	border-radius: 4px;
	z-index: 1;
}
.dropdown > div > a {
  display: inline-block;
  width: 100%;
  padding: 5px 10px;
  font-size: 1.5rem;
}
.dropdown a:hover {background-color: var(--gray7);}

#chk_dropdown:checked ~ .dropdown > label::after{transform: translateY(-50%) rotateZ(90deg);}
#chk_dropdown:checked ~ .dropdown > div{display:block;}
#chk_dropdown:checked ~ #lbl_dropdown_Layer{position: fixed;inset: 0; cursor: auto;}




.bildNachhaltigkeit img{max-width: 100%;}

/* ------------------------------------------------ */
/* ------ moveOverBoxWrapper------- */
/* ------------------------------------------------ */

label.moveOverBox_label {
width: 10px;
height: 10px; /*9px*/
background-color: var(--gray); /* border-right: 1px solid var(--gray2); border-bottom: 1px solid var(--gray2); */
display: inline-block;
margin: 1rem;
margin-bottom: 0.3rem;
}
label.moveOverBox_label:hover {
background-color: var(--red2);
}
article.moveOverSlider {
opacity: 0%;
transition: opacity 0.4s;
position: absolute;
display: block;
top: 0px;
min-height: 24rem;
}
article.moveOverSlider#moveOverBoxSlider01 {
position:inherit; /* der erste nicht absolute */
}

input[type="radio"]#moveOverBox_radio01:checked ~ aside #moveOverBoxSlider01,
input[type="radio"]#moveOverBox_radio02:checked ~ aside #moveOverBoxSlider02,
input[type="radio"]#moveOverBox_radio03:checked ~ aside #moveOverBoxSlider03,
input[type="radio"]#moveOverBox_radio04:checked ~ aside #moveOverBoxSlider04,
input[type="radio"]#moveOverBox_radio05:checked ~ aside #moveOverBoxSlider05,
input[type="radio"]#moveOverBox_radio06:checked ~ aside #moveOverBoxSlider06
{opacity: 100%; transition: opacity 0.4s;}

input[type="radio"]#moveOverBox_radio01:checked ~ nav #moveOverBox_label01,
input[type="radio"]#moveOverBox_radio02:checked ~ nav #moveOverBox_label02,
input[type="radio"]#moveOverBox_radio03:checked ~ nav #moveOverBox_label03,
input[type="radio"]#moveOverBox_radio04:checked ~ nav #moveOverBox_label04,
input[type="radio"]#moveOverBox_radio05:checked ~ nav #moveOverBox_label05,
input[type="radio"]#moveOverBox_radio06:checked ~ nav #moveOverBox_label06
{background-color: var(--red);}

.moveOverSlider .pfeile_transparent_gross {
width: 200px;
height: 120px;
margin-top: -10px;
}

.pfeile_transparent_gross { 
	display: inline-block;
	background: url("/bilder/abau/pfeile_grau_transparent.svg");
	background-size: auto; 
	width: 168px; 
	height: 80px; 
	background-size: contain; 	
	background-repeat: no-repeat;
	margin-right: 7px;
}
input[type="submit"]#ianm_submit {
position:absolute;
bottom: 4rem;
background:url('pic/abau/input_bg_pfeile.gif');
background-size: cover;
background-repeat: no-repeat;
color: var(--white);
font-family: var(--regular2);
font-weight:normal;
height: 34px;
font-size:110%
}

input[type="submit"]#ianm_submit:hover {
color: var(--gray6);
}
#ianm_submit {
border: 0px;
padding-left: 20px;
border-radius: 3px;
min-width: 13rem;
}

.moveOverBanner {
	position: relative; 
	margin-top: -20%;
}

#moveOverBoxWrapper {
margin-top: 4rem;
}
@media screen and (max-width: 1100px) {
.moveOverBanner > aside > article h1 {
font-size: 240%;
}
}
@media screen and (max-width: 1024px) {
#moveOverBoxWrapper {
margin-top: -2rem;
}
}
@media screen and (max-width: 60px) {
#moveOverBoxWrapper {
margin-top: -4rem;
}
}
/* oh210726 Ergänzung für Bildwechsel bei Anmeldung */
center#anmeldungNachOben {
margin-top: -14rem;
}
#anmeldungBoxDetails center#anmeldungNachOben div img {
width: 75px;
height: 75px;
margin-bottom: 3rem;
}
#anmeldungBoxDetails > div.bg_streifen_schmal {
padding-top: 9rem !important;
}


/* end Modul moveOverBoxWrapper */



/* ------------------------------------------------ */
/* ---------- News Responsive Image Grid ---------- */
/* ------------------------------------------------ */
.news_row { display: flex; flex-wrap: wrap; padding: 0 4px; }
.news_column { flex: 33.3%; max-width: 33.3%; padding: 0 4px; }
.news_column img { margin-top: 8px; vertical-align: middle; width: 100%; }
@media (max-width: 1440px) {
	.news_column { flex: 50%; max-width: 50%; }
}
@media (max-width: 600px) {
	.news_column { flex: 100%; max-width: 100%; }
}





/* -------------------------------------------------------------- */
/* -------------------- Suche mit Suchbutton -------------------- */
/* -------------------------------------------------------------- */
.sucheInklButtonWrapper {
	width: 100%;
	max-width: 250px;
	display: inline-flex;
	flex-wrap: wrap;
}

.sucheInklButtonTb {
	width: calc(100% - 30px) !important;
	border-radius: 4px 0 0 4px !important;
	border-right: none !important;
	min-width: unset !important;
}

.sucheInklButtonBtn {
	width: 30px;
	aspect-ratio: 1;
	border-radius: 0 4px 4px 0;
	padding: 0 !important;
	background-image: url('/bilder/abau/suchicon_weiss.svg');
	background-size: 75%;
	background-repeat: no-repeat;
	background-position: center;
	outline: none;
	cursor: pointer;
	background-color: var(--red);
	border: none;
}



/* -------------------------------------------------- */
/* -------------------- Streifen -------------------- */
/* -------------------------------------------------- */
.bg_streifen {
	background-image: linear-gradient(-45deg, rgba(175, 176, 179, 0.3) 25%, transparent 25%, transparent 50%, rgba(175, 176, 179, 0.3) 50%, rgba(175, 176, 179, 0.3) 75%, transparent 75%, transparent);
	background-size: 13px 13px;
}

.bg_streifen_schmal {
	background-image: linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
	background-size: 12px 12px;
}

.hyphen {
	-webkit-hyphens: auto;
	-moz-hyphens: auto; 
	-ms-hyphens: auto; 
	hyphens: auto;     
	/* chrome kann nur: overflow-wrap: break-word; word-wrap: break-word; hyphenate-limit-chars: 10 4 4; */
}



/* ---------------------------------------------------- */
/* -------------------- Pfeile Rot -------------------- */
/* ---------------------------------------------------- */
.pfeile_rot {
    display: inline-block;
    vertical-align: top;
    background: url('/bilder/abau/pfeile_rot.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left top;
    width: 84px;
    height: 40px;
}





/* ----------------------------------------- */
/* ---------- HIGH CONTRAST MODE  ---------- */
/* ----------------------------------------- */

#accessability:checked ~ #main #mainMenue li:before{display: none;}
#accessability:checked ~ #main #mainMenue li:after{display: none;}
#accessability:checked ~ #main{
  --red: #000;
}
#accessability:checked ~ #main .bannerHomeNavLbl{
  --gray: #fff;
  border: 1px solid #000;
}
#accessability:checked ~ #main .funtionaereFunktionaer{
    border:1px solid #000;
}



/* ----------------------------------------- */
/* ---------- ___________________ ---------- */
/* ----------------------------------------- */




@media (max-width: 1440px) {
	
}
@media (max-width: 1240px) {
	
}
@media (max-width: 1024px) {
	
}
@media (max-width: 768px) {
	
}
@media (max-width: 600px) {
	
}
/* --- --- */
/* leafletCSS */
/* required styles - 2022 lt. Kompass von https://unpkg.com/leaflet@1.8.0/dist/leaflet.css*/

.preventError { color: red; }
.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-container,
.leaflet-pane > svg,
.leaflet-pane > canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
	position: absolute;
	left: 0;
	top: 0;
	}
.leaflet-container {
	overflow: hidden;
	}
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow {
	-webkit-user-select: none;
	   -moz-user-select: none;
	        user-select: none;
	  -webkit-user-drag: none;
	}
/* Prevents IE11 from highlighting tiles in blue */
.leaflet-tile::selection {
	background: transparent;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
	image-rendering: -webkit-optimize-contrast;
	}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
	width: 1600px;
	height: 1600px;
	-webkit-transform-origin: 0 0;
	}
.leaflet-marker-icon,
.leaflet-marker-shadow {
	display: block;
	}
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg {
	max-width: none !important;
	max-height: none !important;
	}
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-shadow-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer,
.leaflet-container .leaflet-tile {
	max-width: none !important;
	max-height: none !important;
	width: auto;
	padding: 0;
	}

.leaflet-container.leaflet-touch-zoom {
	-ms-touch-action: pan-x pan-y;
	touch-action: pan-x pan-y;
	}
.leaflet-container.leaflet-touch-drag {
	-ms-touch-action: pinch-zoom;
	/* Fallback for FF which doesn't support pinch-zoom */
	touch-action: none;
	touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-zoom {
	-ms-touch-action: none;
	touch-action: none;
}
.leaflet-container {
	-webkit-tap-highlight-color: transparent;
}
.leaflet-container a {
	-webkit-tap-highlight-color: rgba(51, 181, 229, 0.4);
	text-decoration: none;
}
.leaflet-tile {
	filter: inherit;
	visibility: hidden;
	}
.leaflet-tile-loaded {
	visibility: inherit;
	}
.leaflet-zoom-box {
	width: 0;
	height: 0;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;
	z-index: 800;
	}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
	-moz-user-select: none;
	}

/*.leaflet-pane         { z-index: 400; }*/

.leaflet-tile-pane    { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane  { z-index: 500; }
.leaflet-marker-pane  { z-index: 600; }
.leaflet-tooltip-pane   { z-index: 650; }
.leaflet-popup-pane   { z-index: 700; }

.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg    { z-index: 200; }

.leaflet-vml-shape {
	width: 1px;
	height: 1px;
	}
.lvml {
	behavior: url(#default#VML);
	display: inline-block;
	position: absolute;
	}


/* control positioning */

.leaflet-control {
	position: relative;
	/*z-index: 800;*/
	z-index: 1; /* 230829 Timon */
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}
.leaflet-top,
.leaflet-bottom {
	position: absolute;
	/*z-index: 1000;*/
	pointer-events: none;
	}
.leaflet-top {
	top: 0;
	}
.leaflet-right {
	right: 0;
	}
.leaflet-bottom {
	bottom: 0;
	}
.leaflet-left {
	left: 0;
	}
.leaflet-control {
	float: left;
	clear: both;
	}
.leaflet-right .leaflet-control {
	float: right;
	}
.leaflet-top .leaflet-control {
	margin-top: 10px;
	}
.leaflet-bottom .leaflet-control {
	margin-bottom: 10px;
	}
.leaflet-left .leaflet-control {
	margin-left: 10px;
	}
.leaflet-right .leaflet-control {
	margin-right: 10px;
	}


/* zoom and fade animations */

.leaflet-fade-anim .leaflet-popup {
	opacity: 0;
	-webkit-transition: opacity 0.2s linear;
	   -moz-transition: opacity 0.2s linear;
	        transition: opacity 0.2s linear;
	}
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
	opacity: 1;
	}
.leaflet-zoom-animated {
	-webkit-transform-origin: 0 0;
	    -ms-transform-origin: 0 0;
	        transform-origin: 0 0;
	}
svg.leaflet-zoom-animated {
	will-change: transform;
}

.leaflet-zoom-anim .leaflet-zoom-animated {
	-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
	   -moz-transition:    -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
	}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile {
	-webkit-transition: none;
	   -moz-transition: none;
	        transition: none;
	}

.leaflet-zoom-anim .leaflet-zoom-hide {
	visibility: hidden;
	}


/* cursors */

.leaflet-interactive {
	cursor: pointer;
	}
.leaflet-grab {
	cursor: -webkit-grab;
	cursor:    -moz-grab;
	cursor:         grab;
	}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
	cursor: crosshair;
	}
.leaflet-popup-pane,
.leaflet-control {
	cursor: auto;
	}
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
	cursor: move;
	cursor: -webkit-grabbing;
	cursor:    -moz-grabbing;
	cursor:         grabbing;
	}

/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
	pointer-events: none;
	}

.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive,
svg.leaflet-image-layer.leaflet-interactive path {
	pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
	pointer-events: auto;
	}

/* visual tweaks */

.leaflet-container {
	background: #ddd;
	outline-offset: 1px;
	}
.leaflet-container a {
	color: #0078A8;
	}
.leaflet-zoom-box {
	border: 2px dotted #38f;
	background: rgba(255,255,255,0.5);
	}


/* general typography */
.leaflet-container {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-size: 0.75rem;
	line-height: 1.5;
	}


/* general toolbar styles */

.leaflet-bar {
	box-shadow: 0 1px 5px rgba(0,0,0,0.65);
	border-radius: 4px;
	}
.leaflet-bar a {
	background-color: #fff;
	border-bottom: 1px solid #ccc;
	width: 26px;
	height: 26px;
	line-height: 26px;
	display: block;
	text-align: center;
	text-decoration: none;
	color: black;
	}
.leaflet-bar a,
.leaflet-control-layers-toggle {
	background-position: 50% 50%;
	background-repeat: no-repeat;
	display: block;
	}
.leaflet-bar a:hover,
.leaflet-bar a:focus {
	background-color: #f4f4f4;
	}
.leaflet-bar a:first-child {
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	}
.leaflet-bar a:last-child {
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom: none;
	}
.leaflet-bar a.leaflet-disabled {
	cursor: default;
	background-color: #f4f4f4;
	color: #bbb;
	}

.leaflet-touch .leaflet-bar a {
	width: 30px;
	height: 30px;
	line-height: 30px;
	}
.leaflet-touch .leaflet-bar a:first-child {
	border-top-left-radius: 2px;
	border-top-right-radius: 2px;
	}
.leaflet-touch .leaflet-bar a:last-child {
	border-bottom-left-radius: 2px;
	border-bottom-right-radius: 2px;
	}

/* zoom control */

.leaflet-control-zoom-in,
.leaflet-control-zoom-out {
	font: bold 18px 'Lucida Console', Monaco, monospace;
	text-indent: 1px;
	}

.leaflet-touch .leaflet-control-zoom-in, .leaflet-touch .leaflet-control-zoom-out  {
	font-size: 22px;
	}


/* layers control */

.leaflet-control-layers {
	box-shadow: 0 1px 5px rgba(0,0,0,0.4);
	background: #fff;
	border-radius: 5px;
	}
.leaflet-control-layers-toggle {
	background-image: url(images/layers.png);
	width: 36px;
	height: 36px;
	}
.leaflet-retina .leaflet-control-layers-toggle {
	background-image: url(images/layers-2x.png);
	background-size: 26px 26px;
	}
.leaflet-touch .leaflet-control-layers-toggle {
	width: 44px;
	height: 44px;
	}
.leaflet-control-layers .leaflet-control-layers-list,
.leaflet-control-layers-expanded .leaflet-control-layers-toggle {
	display: none;
	}
.leaflet-control-layers-expanded .leaflet-control-layers-list {
	display: block;
	position: relative;
	}
.leaflet-control-layers-expanded {
	padding: 6px 10px 6px 6px;
	color: #333;
	background: #fff;
	}
.leaflet-control-layers-scrollbar {
	overflow-y: scroll;
	overflow-x: hidden;
	padding-right: 5px;
	}
.leaflet-control-layers-selector {
	margin-top: 2px;
	position: relative;
	top: 1px;
	}
.leaflet-control-layers label {
	display: block;
	font-size: 13px;
	font-size: 1.08333em;
	}
.leaflet-control-layers-separator {
	height: 0;
	border-top: 1px solid #ddd;
	margin: 5px -10px 5px -6px;
	}

/* Default icon URLs */
.leaflet-default-icon-path { /* used only in path-guessing heuristic, see L.Icon.Default */
	background-image: url(images/marker-icon.png);
	}


/* attribution and scale controls */

.leaflet-container .leaflet-control-attribution {
	background: #fff;
	background: rgba(255, 255, 255, 0.8);
	margin: 0;
	}
.leaflet-control-attribution,
.leaflet-control-scale-line {
	padding: 0 5px;
	color: #333;
	line-height: 1.4;
	}
.leaflet-control-attribution a {
	text-decoration: none;
	}
.leaflet-control-attribution a:hover,
.leaflet-control-attribution a:focus {
	text-decoration: underline;
	}
.leaflet-control-attribution svg {
	display: inline !important;
	}
.leaflet-left .leaflet-control-scale {
	margin-left: 5px;
	}
.leaflet-bottom .leaflet-control-scale {
	margin-bottom: 5px;
	}
.leaflet-control-scale-line {
	border: 2px solid #777;
	border-top: none;
	line-height: 1.1;
	padding: 2px 5px 1px;
	white-space: nowrap;
	overflow: hidden;
	-moz-box-sizing: border-box;
	     box-sizing: border-box;

	background: #fff;
	background: rgba(255, 255, 255, 0.5);
	}
.leaflet-control-scale-line:not(:first-child) {
	border-top: 2px solid #777;
	border-bottom: none;
	margin-top: -2px;
	}
.leaflet-control-scale-line:not(:first-child):not(:last-child) {
	border-bottom: 2px solid #777;
	}

.leaflet-touch .leaflet-control-attribution,
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	box-shadow: none;
	}
.leaflet-touch .leaflet-control-layers,
.leaflet-touch .leaflet-bar {
	border: 2px solid rgba(0,0,0,0.2);
	background-clip: padding-box;
	}


/* popup */

.leaflet-popup {
	position: absolute;
	text-align: center;
	margin-bottom: 20px;
	}
.leaflet-popup-content-wrapper {
	padding: 1px;
	text-align: left;
	border-radius: 12px;
	}
.leaflet-popup-content {
	margin: 13px 24px 13px 20px;
	line-height: 1.3;
	font-size: 13px;
	font-size: 1.08333em;
	min-height: 1px;
	}
.leaflet-popup-content p {
	margin: 17px 0;
	margin: 1.3em 0;
	}
.leaflet-popup-tip-container {
	width: 40px;
	height: 20px;
	position: absolute;
	left: 50%;
	margin-top: -1px;
	margin-left: -20px;
	overflow: hidden;
	pointer-events: none;
	}
.leaflet-popup-tip {
	width: 17px;
	height: 17px;
	padding: 1px;

	margin: -10px auto 0;
	pointer-events: auto;

	-webkit-transform: rotate(45deg);
	   -moz-transform: rotate(45deg);
	    -ms-transform: rotate(45deg);
	        transform: rotate(45deg);
	}
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
	background: white;
	color: #333;
	box-shadow: 0 3px 14px rgba(0,0,0,0.4);
	}
.leaflet-container a.leaflet-popup-close-button {
	position: absolute;
	top: 0;
	right: 0;
	border: none;
	text-align: center;
	width: 24px;
	height: 24px;
	font: 16px/24px Tahoma, Verdana, sans-serif;
	color: #757575;
	text-decoration: none;
	background: transparent;
	}
.leaflet-container a.leaflet-popup-close-button:hover,
.leaflet-container a.leaflet-popup-close-button:focus {
	color: #585858;
	}
.leaflet-popup-scrolled {
	overflow: auto;
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	}

.leaflet-oldie .leaflet-popup-content-wrapper {
	-ms-zoom: 1;
	}
.leaflet-oldie .leaflet-popup-tip {
	width: 24px;
	margin: 0 auto;

	-ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678)";
	filter: progid:DXImageTransform.Microsoft.Matrix(M11=0.70710678, M12=0.70710678, M21=-0.70710678, M22=0.70710678);
	}

.leaflet-oldie .leaflet-control-zoom,
.leaflet-oldie .leaflet-control-layers,
.leaflet-oldie .leaflet-popup-content-wrapper,
.leaflet-oldie .leaflet-popup-tip {
	border: 1px solid #999;
	}


/* div icon */

.leaflet-div-icon {
	background: #fff;
	border: 1px solid #666;
	}


/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
	position: absolute;
	padding: 6px;
	background-color: #fff;
	border: 1px solid #fff;
	border-radius: 3px;
	color: #222;
	white-space: nowrap;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	pointer-events: none;
	box-shadow: 0 1px 3px rgba(0,0,0,0.4);
	}
.leaflet-tooltip.leaflet-interactive {
	cursor: pointer;
	pointer-events: auto;
	}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	position: absolute;
	pointer-events: none;
	border: 6px solid transparent;
	background: transparent;
	content: "";
	}

/* Directions */

.leaflet-tooltip-bottom {
	margin-top: 6px;
}
.leaflet-tooltip-top {
	margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
	left: 50%;
	margin-left: -6px;
	}
.leaflet-tooltip-top:before {
	bottom: 0;
	margin-bottom: -12px;
	border-top-color: #fff;
	}
.leaflet-tooltip-bottom:before {
	top: 0;
	margin-top: -12px;
	margin-left: -6px;
	border-bottom-color: #fff;
	}
.leaflet-tooltip-left {
	margin-left: -6px;
}
.leaflet-tooltip-right {
	margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
	top: 50%;
	margin-top: -6px;
	}
.leaflet-tooltip-left:before {
	right: 0;
	margin-right: -12px;
	border-left-color: #fff;
	}
.leaflet-tooltip-right:before {
	left: 0;
	margin-left: -12px;
	border-right-color: #fff;
	}

/* Printing */
	
@media print {
	/* Prevent printers from removing background-images of controls. */
	.leaflet-control {
		-webkit-print-color-adjust: exact;
		color-adjust: exact;
		}
	}

	
/*
Copyright (c) 2014, Per Liedman (per@liedman.net) Turn instruction icons Copyright (c) 2014, Mapbox (mapbox.com)

Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice
and this permission notice appear in all copies.

THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS.
IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE,
DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
*/
.leaflet-routing-container, .leaflet-routing-error {
    width: 320px;
    background-color: white;
    padding-top: 4px;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.leaflet-control-container .leaflet-routing-container-hide {
    width: 32px;
    height: 32px;
}

.leaflet-routing-container h2 {
    font-size: 14px;
}

.leaflet-routing-container h3 {
    font-size: 12px;
    font-weight: normal;
}

.leaflet-routing-collapsible .leaflet-routing-geocoders {
    margin-top: 20px;
}

.leaflet-routing-alt, .leaflet-routing-geocoders, .leaflet-routing-error {
    padding: 6px;
    margin-top: 2px;
    margin-bottom: 6px;
    border-bottom: 1px solid #ccc;
    max-height: 320px;
    overflow-y: auto;
    transition: all 0.2s ease;
}

.leaflet-control-container .leaflet-routing-container-hide .leaflet-routing-alt, 
.leaflet-control-container .leaflet-routing-container-hide .leaflet-routing-geocoders {
    display: none;
}

.leaflet-bar .leaflet-routing-alt:last-child {
    border-bottom: none;
}

.leaflet-routing-alt-minimized {
    color: #888;
    max-height: 64px;
    overflow: hidden;
    cursor: pointer;
}

.leaflet-routing-alt table {
    border-collapse: collapse;
}

.leaflet-routing-alt tr:hover {
    background-color: #eee;
    cursor: pointer;
}

.leaflet-routing-alt::-webkit-scrollbar {
    width: 8px;
}

.leaflet-routing-alt::-webkit-scrollbar-track {
    border-radius: 2px;
    background-color: #eee;
}

.leaflet-routing-alt::-webkit-scrollbar-thumb {
    border-radius: 2px;
    background-color: #888;
}

.leaflet-routing-icon {
    background-image: url('https://www.inndata.at/pic/eurobaumaps/leaflet-routing-icons.png');
    -webkit-background-size: 240px 20px;
    background-size: 240px 20px;
    background-repeat: no-repeat;
    margin: 0;
    content: '';
    display: inline-block;
    vertical-align: top;
    width: 20px;
    height: 20px;
}

.leaflet-routing-icon-continue         { background-position: 0 0; }
.leaflet-routing-icon-sharp-right      { background-position: -20px 0; }
.leaflet-routing-icon-turn-right       { background-position: -40px 0; }
.leaflet-routing-icon-bear-right       { background-position: -60px 0; }
.leaflet-routing-icon-u-turn           { background-position: -80px 0; }
.leaflet-routing-icon-sharp-left       { background-position: -100px 0; }
.leaflet-routing-icon-turn-left        { background-position: -120px 0; }
.leaflet-routing-icon-bear-left        { background-position: -140px 0; }
.leaflet-routing-icon-depart           { background-position: -160px 0; }
.leaflet-routing-icon-enter-roundabout { background-position: -180px 0; }
.leaflet-routing-icon-arrive           { background-position: -200px 0; }
.leaflet-routing-icon-via              { background-position: -220px 0; }

.leaflet-routing-geocoders div {
    padding: 4px 0px 4px 0px;
}

.leaflet-routing-geocoders input {
    width: 303px;
    width: calc(100% - 4px);
    line-height: 1.67;
    border: 1px solid #ccc;
}

.leaflet-routing-geocoders button {
    font: bold 18px 'Lucida Console', Monaco, monospace;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: white;
    margin: 0;
    margin-right: 3px;
    float: right;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.leaflet-routing-add-waypoint:after {
    content: '+';
}

.leaflet-routing-reverse-waypoints:after {
    font-weight: normal;
    content: '\21c5';
}

.leaflet-routing-geocoders button:hover {
    background-color: #eee;
}

.leaflet-routing-geocoders input,.leaflet-routing-remove-waypoint,.leaflet-routing-geocoder {
    position: relative;
}

.leaflet-routing-geocoder-result {
    font: 12px/1.5 "Helvetica Neue", Arial, Helvetica, sans-serif;
    position: absolute;
    max-height: 0;
    overflow: hidden;
    transition: all 0.5s ease;
    z-index: 1000; /* Arbitrary, but try to be above "most" things. */
}

.leaflet-routing-geocoder-result table {
    width: 100%;
    border: 1px solid #ccc;
    border-radius: 0 0 4px 4px;
    background-color: white;
    cursor: pointer;
}

.leaflet-routing-geocoder-result-open {
    max-height: 800px;
}

.leaflet-routing-geocoder-selected, .leaflet-routing-geocoder-result tr:hover {
    background-color: #eee;
}

.leaflet-routing-geocoder-no-results {
    font-style: italic;
    color: #888;
}

.leaflet-routing-remove-waypoint {
    background-color: transparent;
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
}

.leaflet-routing-remove-waypoint:after {
    position: absolute;
    display: block;
    width: 15px;
    height: 1px;
    z-index: 1;
    right: 1px;
    top: 4px;
    bottom: 0;
    margin: auto;
    padding: 2px;
    font-size: 18px;
    font-weight: bold;
    content: "\00d7";
    text-align: center;
    cursor: pointer;
    color: #ccc;
    background: white;
    padding-bottom: 16px;
    margin-top: -16px;
    padding-right: 4px;
    line-height: 1;
}

.leaflet-routing-remove-waypoint:hover {
    color: black;
}

.leaflet-routing-instruction-distance {
    width: 48px;
}

.leaflet-routing-collapse-btn {
    position: absolute;
    top: 0;
    right: 0;
    font-size: 24px;
    color: #000000;
    font-weight: bold;
	background-color: white;
	cursor: pointer;
	width: 20px;
}

.leaflet-routing-collapse-btn:after {
    content: '\00d7';
}

.leaflet-routing-container-hide .leaflet-routing-collapse-btn {
    position: relative;
    left: 2px;
    top: -10px;
    display: block;
    width: 26px;
    height: 23px;
	background-color: transparent;
	font-weight: 1;
}

.leaflet-routing-container-hide .leaflet-routing-collapse-btn:after {
    content: none;
}

.leaflet-top .leaflet-routing-container.leaflet-routing-container-hide {
    margin-top: 10px !important;
}
.leaflet-right .leaflet-routing-container.leaflet-routing-container-hide {
    margin-right: 10px !important;
}
.leaflet-bottom .leaflet-routing-container.leaflet-routing-container-hide {
    margin-bottom: 10px !important;
}
.leaflet-left .leaflet-routing-container.leaflet-routing-container-hide {
    margin-left: 10px !important;
}

@media only screen and (max-width: 640px) {
    .leaflet-routing-container {
        margin: 0 !important;
        padding: 0 !important;
        width: 100%;
        height: 100%;
    }
}

/* custom styles by Inndata*/
#input-box {
	position: absolute;
	top: 0;
	/*z-index: 1000;*/
	width: 60%;
	margin-left: 70px;
	margin-top: 11px;
}

.input-btn {
	background-color: #fff;
	cursor: pointer;
	padding: 5px;
	height: 31px;
	border: 1px solid #ccc;

}

.input-btn:hover {
	background-color: #f4f4f4;
}

#loc-input {
	padding: 4px;
	box-sizing: border-box;
	height: 31px;
	background-color: #fff;
	border: 1px solid #ccc;
}

#map {
	height: 500px;
	width: 100%;
}

#map h2, #map h3 {
	font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
}

#close-btn {
	display: none;
}

.leaflet-routing-container {
	max-width: 280px;
}

.osrm-info-icon {
	cursor: pointer;
}

#osrm-info-text {
	display: none;
	margin: 0;
	padding: 0 5px;
	position: absolute;
	background-color: rgba(255, 255, 255, .8);
	bottom: 0;
	right: 0;
	z-index: 1000;
	font-size: 13px;
}

#osrm-info-text a {
	color: #0078A8;
	text-decoration: none;
}

#osrm-info-text a:hover {
	text-decoration: underline;
}

#input-box.multi-sel-box {
	position: unset;
	width: 100%;
	margin-left: 0px;
}

@media only screen and (max-width: 770px) {
	#start-btn {
		display: block;
	}
	
	#input-box > * {
		width: 120px;
	}
	
	#input-box {
		margin-left: 50px;
	}
}

@media only screen and (max-width: 640px) {
	.leaflet-routing-container-hide .leaflet-routing-collapse-btn {
		top: -6px !important;
	}
}
/* end leafletCSS */
/* --- --- */
/* MainHeaderCSS  */
/* ------------------------------------------------------------- */
/* -------------------- 102 - MainHeaderCSS -------------------- */
/* ------------------------------------------------------------- */
#mainHeader{
	position: relative;
	z-index: 1;
}

.headerWrapper {
	padding-left: var(--abstand_36);
	padding-right: 4.9rem;
}

@media (max-width: 1024px) {
    .headerWrapper {
        padding-right: 3.5rem;
    }
}

@media (max-width: 600px) {
	.headerWrapper {
        padding-left: var(--abstand_18);
        padding-right: var(--abstand_18);
    }
}

/* -------------------- Header Top -------------------- */
.menueTopLinkContainer {
	padding: 0 10px;
	border-right: 1px solid var(--gray2);
}

.menueTopLinkContainer:last-of-type {
	border-right: none;
}

.menueTopLinkContainer a:hover {
    text-decoration: none;
}

.menueTopLinkContainer a:hover span {
    color: var(--red2);
}


.headerObenL {
	width: 450px;
}

.headerObenR {
	width: calc(100% - 450px);
	padding-left: var(--abstand_18);
}

.headerLogoMobil {
	display: none;
}


.oesterreichText {
	text-align: right;
}

@media (min-width: 1025px) {
	.oesterreichText {
		margin-top: -20px;
	}
}

@media (max-width: 1024px) {
	.headerObenL {
		width: 40%;
	}

	.headerObenR {
		width: 60%;
	}

	.headerObenSucheWrapper {
		padding-right: var(--abstand_36);
	}

	.headerObenSucheWrapper .sucheInklButtonWrapper {
		margin-bottom: var(--abstand_9);
	}
}

@media (max-width: 600px) {
	.headerLogoDesktop {
		display: none;
	}

	.headerLogoMobil {
		display: block;
	}
}


/* -------------------- Suche -------------------- */
.headerObenSucheWrapper {
    position: relative;
}

.headerObenSucheWrapper .sucheInklButtonWrapper {
	margin-bottom: var(--abstand_18);
    position: relative;
    z-index: 1;
}

#ergebnisseSucheAjax {
    display: none;
    width: 100%;
    min-height: 200px;
    max-height: 400px;
    padding: var(--abstand_18);
    position: absolute;
    top: 35px;
    right: 0;
    background-color: var(--white);
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    z-index: 1;
    overflow-y: auto;
    scrollbar-width: thin;
    text-align: left;
}

.ergebnisSucheBeitrag {
    margin-bottom: var(--abstand_18);
}

.ergebnisSucheAjaxHeadline {
    margin-bottom: var(--abstand_9);
}

#lblSucheAjaxArea {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}

#chkSucheAjax:checked ~ #lblSucheAjaxArea {
    display: block;
}

#chkSucheAjax:not(:checked) ~ #ergebnisseSucheAjax {
    display: none !important;
}

@media (max-width: 600px) {
    #ergebnisseSucheAjax {
        width: calc(100vw - var(--abstand_18) * 2);
    }
}




/* -------------------- Main Menue -------------------- */
#mainMenueWrapper {
	display: block;
}


#mainMenue_mobile_chk,
#mainMenue_kb_hide_menu {
	display: none;
}


#mainMenue,
#mainMenue ul {
	list-style: none;
}

#mainMenue a {
	text-decoration: none;
}

#mainMenue > li > a {
	text-transform: uppercase;
	font-size: 14px;
}


/* ----- Desktop Ansicht -----*/
@media (min-width: 1025px) {
	#mainMenue_kb_show_menu {
		display: none;
	}

	#mainMenue {
		display: flex;
	}
	
	#mainMenue > li {
		width: calc(100% / 5);
		text-align: center;
		position: relative;
	}
	
	#mainMenue > li:last-of-type::before,
	#mainMenue > li:hover::after,
	#mainMenue > li:hover::before {
		content: '';
		top: 0;
		height: 1px; width: 0px;
		position: absolute;
	}
	
	#mainMenue > li:last-of-type:hover::before,
	#mainMenue > li:last-of-type::before,
	#mainMenue > li:hover::before {
		border-left: 15px solid var(--black);
	}
	
	#mainMenue > li:last-of-type:hover::before,
	#mainMenue > li:hover::before {
		border-bottom: 39px solid var(--gray2);
	}

	#mainMenue > li:last-of-type::before,
	#mainMenue > li:hover::before {
		left: -7.5px;
	}
	
	#mainMenue > li:nth-last-of-type(2):hover::after,
	#mainMenue > li:hover::after {
		border-right: 15px solid var(--black);
		border-top: 39px solid var(--gray2);
	}

	#mainMenue > li:hover::after {
		right: -7.5px;
	}

	#mainMenue > li:first-of-type:hover::before {
		border: 0;
	}

	#mainMenue > li:hover {
		background-color: var(--gray2);
	}

	#mainMenue li:hover > ul {
		display: inline-block;
	}

	#mainMenue > li > a {
		color: var(--white);
		font-weight: bold;
		display: block;
		padding: 10px 0;
	}

	#mainMenue ul {
		list-style: none;
		background-color: rgba(240,240,240,0.9);
		padding: 15px 0 9px 0;
		width: calc(100% + 50px);
		display: none;
		position: absolute;
		left: -9px;
		top: 40px;
		text-align: left;
	}

	#mainMenue > li li {
		padding: 0 5px;
		position: relative;
	}

	#mainMenue > li:first-of-type > ul {
		left: 0;
	}

	#mainMenue > li li:hover > a {
		background-color: rgba(255,255,255,0.6);
	}

	#mainMenue > li > ul > li a {
		color: black;
		font-weight: bold;
		font-size: smaller;
		display: block;
		padding: 7px 10px;
	}
  
	#mainMenue > li > ul > li > ul {
		padding: 9px 0;
		bottom: -9px;
		width: 290px;
		left: 100%;
		top: unset;
	}



	#mainMenue > li:last-of-type:hover::after {
		border: 0;
	}
	
	#mainMenue > li:nth-last-of-type(2):hover::after {
		border-right-color: var(--red);
		border-top-color: var(--gray2);
		z-index: 1;
	}
	
	#mainMenue > li:last-of-type::before {
		border-bottom: 39px solid var(--red);
	}
	
	#mainMenue > li:last-of-type {
		background-color: var(--red);
	}
	
	#mainMenue > li:last-of-type:hover {
		background-color: var(--gray2);
	}
	
	#mainMenue > li:last-of-type::before {
		left: -7.5px;
	}
}



/* ----- Mobil Ansicht -----*/
@media (max-width: 1024px) {
	#mainMenue {
		right: 0;
		position: absolute;
		background-color: var(--gray6);
		width: 400px;
		max-width: 100%;
		padding: 10px 10px 10px 2.8rem;
		display: block;
		top: 149px;
	}
	
	#mainMenue > li > ul > li {
		position: relative;
	}
	
	#mainMenue > li > ul > li > ul {
		list-style: none;
		padding-left: 15px;
		display: none;
	}
	
	#mainMenue > li > ul > li a,
	#mainMenue > li > a {
		color: black;
		display: block;
		font-weight: bold;
	}
	
	#mainMenue .isnode > div::before,
	#mainMenue .isnode > div::after {
		content: '';
		background-color: var(--gray2);
		display: inline-block;
		position: absolute;
	}
	
	#mainMenue .isnode > div {
		position: absolute;
		width: 20px;
		height: 20px;
		right: 33px;
		top: 13px;
		cursor: pointer;
	}
	
	#mainMenue > li > ul > .isnode > div {
		width: 15px;
		height: 15px;
		right: 35px;
		top: 7px;
	}
	
	#mainMenue > li > ul > .isnode > div::before {
		width: 3px;
		height: 100%;
		right: 6px;
	}

	#mainMenue > li > ul > .isnode > div::after {
		width: 100%;
		height: 3px;
		top: 6px;
	}

	#mainMenue > .isnode > div::before {
		width: 4px;
		height: 100%;
		right: 8px;
	}

	#mainMenue > .isnode > div::after {
		width: 100%;
		height: 4px;
		top: 8px;
	}
	
	#mainMenue .openleaf > ul {
		display: inline-block !important;
	}
	
	#mainMenue .openleaf > div::before {
		display: none;
	}
	
	#mainMenue > li > ul > li a {
		font-size: smaller;
		padding: 5px 10px;
	}
	
	#mainMenue > li > ul {
		padding: 5px 0px 5px 5px;
		display: none;
		width: 100%;
	}
	
	#mainMenue > li > a {
		padding: 10px 5px 10px 0px;
		width: 80%;
	}
	

	#mainMenue_kb_show_menu,
	#mainMenue_kb_show_menu::before,
	#mainMenue_kb_show_menu::after {
		display: block;
		width: 35px;
	}
	
	#mainMenue_kb_show_menu::after,
	#mainMenue_kb_show_menu::before {
		content: '';
		height: 15px;
		position: absolute;
		right: 0px;
	}
	
	#mainMenue_kb_show_menu::after {
		border-bottom: 5px solid var(--gray2);
	}

	#mainMenue_kb_show_menu::before {
		border-top: 5px solid var(--gray2);top: -10px;
	}
	
	#mainMenue_kb_show_menu {
		height: 5px;
		position: absolute;
		right: 3.5rem;
		top: 43px;
		background-color: var(--white);
		margin: 9px 0!important;
	}
	
	
	#mainMenue_mobile_chk:checked ~ #mainMenue_kb_show_menu {
		border: none;
	}
	
	#mainMenue_mobile_chk:checked ~ #mainMenue {
		display: none;
	}
	
	#mainMenue_mobile_chk:checked ~ #mainMenue_kb_show_menu::before,
	#mainMenue_mobile_chk:checked ~ #mainMenue_kb_show_menu::after,
	#mainMenue_kb_show_menu,
	#mainMenue_kb_show_menu::before,
	#mainMenue_kb_show_menu::after {
		transition: 0.3s;
	}
	
	#mainMenue_mobile_chk:checked ~ #mainMenue_kb_show_menu {
		background-color: var(--gray2);
	}
	
	#mainMenue_kb_show_menu::before {
		transform: rotate(45deg);
		top: -2px;
		right: 5px;
	}
	
	#mainMenue_kb_show_menu::after {
		transform: rotate(-45deg);
		top: -13px;
		right: 5px;
	}
	
	#mainMenue_mobile_chk:checked ~ #mainMenue_kb_show_menu::before {
		transform: rotate(0deg);
		top: -10px;right: 0;
	}
	
	#mainMenue_mobile_chk:checked ~ #mainMenue_kb_show_menu::after {
		transform: rotate(0deg);
		top: -5px;
		right: 0;
	}
	
	#mainMenue > li {
		position: relative;
	}
	
	#mainMenue > li > ul > li a:hover,
	#mainMenue > li > a:hover {
		color: var(--red);
	}
}




@media (max-width: 600px) {
	#mainMenue_kb_show_menu {
		right: var(--abstand_18);
	}
	
	#mainMenue {
		top: 153px;
	}
}
/* --- --- */
#backtotop {
	display: none;
	position: fixed;
	z-index: 1;
	bottom: 14px;
	right: 25%;
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-bottom: 37px solid rgba(255, 45, 22, 0.54);
	border-top: none;
	background-color: transparent;
	outline: none;
	padding: 0;
}
/* --- --- */
/* ----------------------------------------------------------------------- */
/* -------------------- 162 - BannerGrauMitBreadcrumb -------------------- */
/* ----------------------------------------------------------------------- */
.bannerUnterMenueOhneBildStreifen {
	position: relative;
	height: 250px;
}

.bannerUnterMenueOhneBildHeadline {
	position: absolute;
	bottom: -15px;
}

@media (max-width: 1024px) {
	.bannerUnterMenueOhneBildHeadline {
		bottom: -12px;
	}
}

@media (max-width: 600px) {
	.bannerUnterMenueOhneBildHeadline {
		bottom: -10px;
	}
}




.breadcrumpWrapper {
	font-size: 80%;
}

#breadcrumpLink_1 {
	color: inherit;
}

#breadcrumpLink_2 {
	color: var(--gray2);
}

.breadcrumpLink:hover {
	text-decoration: none;
	color: var(--red) !important;
}
/* --- --- */
/* --------------------------------------------------------------------- */
/* -------------------- 3001 - MitgliederUebersicht -------------------- */
/* --------------------------------------------------------------------- */
.mitgliederUebersichtAlphabetWrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
}

.mitgliederUebersichtAlphabetWrapper > a {
	width: calc(100% / 7);
}

.mitgliederUebersichtAlphabetWrapper[data-route1="0"][data-route2=""] > a:nth-of-type(1),
.mitgliederUebersichtAlphabetWrapper[data-route1="1"][data-route2=""] > a:nth-of-type(2),
.mitgliederUebersichtAlphabetWrapper[data-route1="2"][data-route2=""] > a:nth-of-type(3),
.mitgliederUebersichtAlphabetWrapper[data-route1="3"][data-route2=""] > a:nth-of-type(4),
.mitgliederUebersichtAlphabetWrapper[data-route1="4"][data-route2=""] > a:nth-of-type(5),
.mitgliederUebersichtAlphabetWrapper[data-route1="5"][data-route2=""] > a:nth-of-type(6),
.mitgliederUebersichtAlphabetWrapper[data-route1="6"][data-route2=""] > a:nth-of-type(7) {
	text-decoration: underline;
}



.mitgliederUebersichtMitglied {
	display: flex;
	flex-wrap: wrap;
	justify-content: left;
	padding: var(--abstand_18) 0;
	border-bottom: 1px solid var(--gray);
}

.mitgliederUebersichtMitglied:last-of-type {
	border-bottom: none;
}

.mitgliederUebersichtLogo {
	width: 200px;
}

.mitgliederUebersichtText {
	width: calc(100% - 200px - 150px);
	padding: 0 var(--abstand_72);
}

.mitgliederUebersichtMehr {
	width: 150px;
	display: flex;
	justify-content: right;
	align-items: end;
}


@media (max-width: 1024px) {
	.mitgliederUebersichtLogo {
		
	}

	.mitgliederUebersichtText {
		width: calc(100% - 200px);
		padding-left: var(--abstand_36);
		padding-right: 0;
		margin-bottom: var(--abstand_18);
	}

	.mitgliederUebersichtMehr {
		width: 100%;
	}
}

@media (max-width: 768px) {
	.mitgliederUebersichtText {
		padding-left: var(--abstand_18);
	}
}

@media (max-width: 600px) {
	.mitgliederUebersichtLogo, .mitgliederUebersichtText {
		width: 100%;
	}

	.mitgliederUebersichtLogo {
		margin-bottom: var(--abstand_18);
	}

	.mitgliederUebersichtText {
		padding-left: 0;
	}

	.mitgliederUebersichtMehr {
		justify-content: left;
	}

	.mitgliederLink {
    	display: block;
   		padding-left: 0;
  	}
}
/* --- --- */
/* --------------------------------------------------------------- */
/* -------------------- 301 - MitgliederKarte -------------------- */
/* --------------------------------------------------------------- */
#karteMitglieder {
	max-width: 800px;
	height: 500px;
}
/* --- --- */