:root {

--iphonemenuicons:rgba(180,207,95,1);

--normalschrift:rgba(8, 8, 7, 1);

}



body {

width:100vw;

}



body, div, a, li, ul, textarea, input, p {

font-family: Roboto-Thin;

color: var(--normalschrift);

font-weight: normal;

}



.copy {

font-family: Roboto;

font-size: 5vw;

color: var(--normalschrift);

padding: 0.5vw 0px 1vw 0px;

margin-left: 35vw;

}



#middlebox {

position: relative;

}



#linksseitenleiste {

display: none;

}



#footer {

margin: calc(5vw + 2em) auto 0px auto;

padding: 3vw 3vw 4vw 3vw;

max-width: 88vw;

position: relative;

background-color: rgba(114,170,20,1);

border-top: solid 2vw rgba(247,211,63,1);

border-bottom: solid 2vw rgba(247,211,63,1);

}



#logform {

display: none;

}



#footertext {

display: flex;

flex-direction: column;

position: relative;

padding-right: initial;

}



#spalte1 {

position: absolute;

width: 37%;

background-image: url('../kleinbilder/logodef_footer.svg');

height: 120%;

background-repeat: no-repeat;

background-position: 0% 10%;

top: -5%;

margin-left: -1%;

}



#spalte2, #spalte3 {

margin-top: initial;

z-index: 1000;

}



#spalte2 {

width: 60%;

position: relative;

left: 42.5%;

text-align: right;

height: 1.5em;

top: 0.5em;

}



#spalte3 {

width: 80%;

position: relative;

left: 21.1%;

display: flex;

flex-direction: column-reverse;

align-items: flex-end;

top: 1.5vw;

}

.inlinemiticon {
display: flex !important;
align-items: center;
}

.footerspalte p, .footerspalte a, .footerspalte li, .footerspalte h1, .footerspalte h2, .footerspalte h3, .footerspalte h4, .footerspalte h5, .footerspalte h6{ 

color:rgba(255,255,255,1);

font-size: 5.5vw;

}



.footerspalte div p, .footerspalte div p a {

margin: 0px;

padding: 0px;

font-family: Roboto-Light !important;

font-size: 5.5vw;

}



#titelname {

    display: none;

}





#telefon a {

white-space: nowrap;

}



#adrmail {

margin-right: -1vw;

}


#datenschutz {
display: block !important;
position: absolute;
top: -5.3em;
}

.datenschutz p, .datenschutz a {
color: rgba(247,211,63,1);
font-size:0.8em;
}

.datenschutz img {
height:2em;
}

#mainbox{

width:100vw;

position:absolute;

left: 0vw;

}



h1{

font-size:8vw;

}



h2{

font-weight:normal;

font-size:7vw;

font-family:Roboto-Light;

}



h3{

}



.hinterlegt h3{

font-family: Roboto-Light !important;

color:rgba(124, 124, 111, 1) !important;

}



h4{

font-family: Roboto-Light !important;

color: var(--h1farbe);

font-weight: normal !important;

}







p{

}



ul{

}



li{

}



a{

}



.listenbutton{

display:inline;

}





#iphonebox{

display:inline;

position:fixed;

top: 26vw;

height:calc(var(--apphoehe) - 28vw);

left:0vw;

width:100vw;

overflow-y: scroll;

z-index: 0;

-webkit-overflow-scrolling:touch;

overflow-x:hidden;

}



.servicenaviblock {

width: 16vw;

left: 80%;

position: absolute;

top: 20vw;

display: flex;

flex-direction: column;

height: 34vw;

justify-content: space-between;

z-index: 2;

}



.servicenaviitem.serviceelement {

height: 16vw;

width: 16vw;

}



.serviceicon {

width: 100%;

height: 100%;

display: flex;

border-radius: 50%;

}



.serviceicon svg {

display: block;

width: 100%;

margin: auto;

}



#listenbildli{

-webkit-transform: scale(1,1);

-ms-transform: scale(1,1);

-moz-transform: scale(1,1);

-o-transform: scale(1,1);

transform: scale(1,1);

position: relative;

height: 100%;

width: 100%;

top: 0px;

}



#hamburger {

position: absolute;

top: 4vw;

left: 81.5vw;

width: 13.5vw;

height: 13vw;

}

	

.listenstrichli{

position: absolute;

border-radius:1vw;

width: 100%;

height: 14%;

background-color: rgba(255, 189, 82, 1);

}

	

#listenstrichli1{

top:0px;

}

#listenstrichli2{

top:44%;

}

#listenstrichli3{

top:88%;

}



.obergerotiert {

-webkit-transform: rotate(45deg) translate(5.5vw,2.5vw) scale(1,1);

-moz-transform: rotate(45deg) translate(5.5vw,2.5vw) scale(1,1);

-ms-transform: rotate(45deg) translate(5.5vw,2.5vw) scale(1,1);

-o-transform: rotate(45deg) translate(5.5vw,2.5vw) scale(1,1);

transform: rotate(45deg) translate(5.5vw,2.5vw) scale(1,1);

}

	

.untergerotiert {

-webkit-transform: rotate(-45deg) translate(5.5vw,-2.5vw) scale(1,1);

-moz-transform: rotate(-45deg) translate(5.5vw,-2.5vw) scale(1,1);

-ms-transform: rotate(-45deg) translate(5.5vw,-2.5vw) scale(1,1);

-o-transform: rotate(-45deg) translate(5.5vw,-2.5vw) scale(1,1);

transform: rotate(-45deg) translate(5.5vw,-2.5vw) scale(1,1);

}

	

.geunrotiert{

	-webkit-transform:rotate(0deg) translateY(0vh) scale(1,1);

	-moz-transform:rotate(0deg) translateY(0vh) scale(1,1);

	-ms-transform:rotate(0deg) translateY(0vh) scale(1,1);

	-O-transform:rotate(05deg) translateY(0vh) scale(1,1);

	transform:rotate(0deg) translateY(0vh) scale(1,1);

	}







#menu{

position:fixed;

-webkit-transform: scale(1,0);

-ms-transform: scale(1,0);

-moz-transform: scale(1,0);

-o-transform: scale(1,0);

transform: scale(1,0);

-webkit-user-select: none;

top: 26vw;

transform-origin:top;

width: 100vw;

background-color: rgba(164,196,28,1);

height: calc(100% - 26vw);

overflow-x: hidden;

overflow-y: scroll;

-webkit-overflow-scrolling: touch;

display:flex;

align-items:var(--flexalign);

left:0px;

}



#menukasten{

margin: 0px 0px 0px 0px;

transform-origin-x: center;

transform-origin-y: top;

width: 100%;

position: relative;

display:block;

margin-top:0px;

padding-bottom: 5vh;

}



.navicontainer1{



}



.navicontainers {

top: 0vw;

width: 100%;

position: relative;

font-size: 4vw;

font-weight: bold;

word-wrap: break-word;

overflow-wrap: break-word;

}





.navicontainers .hauptitem{

position: relative;

clear: both;

margin-left:2vw;

}



.hauptitem{

z-index:1000;

}





.hauptitem a, .aktiv .hauptitem a{

position: absolute;

top: 4vw;

left: 20vw;

font-size: 6.5vw;

color: rgba(255,255,255,1);

}



.mitunternavi {

left: 26vw !important;

}



.plusoffen .mitunternavi {

top: 2.5vw !important;

}



.aktiv .hauptitem a, .aktiv.popup{

color: rgba(11,130,36,1);

}



/*.aktiv .hauptitem a::after, .aktiv.popup::after, .aktiv.popup:after {

content: "";

display: block;

width: 100%;

height: 0.5vw;

background-color: var(--h2farbe);

border-radius: 0.1vw;

margin-top: 0.2em;

margin-left: 0px;

}



.aktiv.popup::after, .aktiv.popup:after {

position:absolute;

width:40%;

}*/



.iconfarbe {

fill: none;

stroke: rgba(164,196,28,1);

}



.aktiv .iconfarbe{

fill: none;

stroke: rgba(255,255,255,0.5);

}



.untericonfarbe {

fill: rgba(164,196,28,1);

}



.icon.untermenu.aktiv .untericonfarbe{

fill: rgba(255,255,255,0.5);

}



.icon{

border-radius: 30%;

display: flex;

width: 14vw;

height: 14vw;

position: relative;

margin-top: 2vw;

left: 2vw;

padding: 0.4vw;

border: solid 0.4vw rgba(121,140.74,1) !important;

background-color: rgba(255,255,255,1);

}



.icon.untermenu.aktiv, .hauptitem .icon.aktiv{

border: solid 0.4vw rgba(121,155,16,9.1);

background-color: rgba(189,211,55,9.1);

}



/*.icon.untermenu{

background-color: var(--aktivemenuicons);

width: 10vw;

height: 10vw;

margin-top:1vw !important

}*/



/*.hauptitem .icon.aktiv, .icon.aktiv {

background-color:var(--graumenuicons) ;

}*/



.navicontainer1 .hauptitem .icon{

margin-top:1vw !important;

}



#headertitel1icon{

display:none;

}



.farbig{

fill:rgba(255,255,255,1);

}



.hingergrundig{

fill:rgba(44,131,197,1);

}



.iconimg{

width: 100%;

max-width: 100%;

max-height: 100%;

}



.pluszeichen {

position: absolute;

top: 3vw;

left: 17vw;

font-weight: bold;

width: 10vw;

height: 10vw;

transform: rotate(-90deg);

}



.pluszeichenfarbe{

fill: rgba(255, 255, 255, 1);

}



.aktiv .pluszeichenfarbe{

fill:rgba(189,211,55,9.1);

stroke:rgba(121,155,16,9.1);

stroke-width:4;

}



.geoeffnet {

transform: rotate(90deg);

left: 16vw;

top: 3vw;

}



.popups {

background-color: initial;

position: relative;

left: 18vw;

transform-origin: top;

clear: both;

margin-top: -5vw;

z-index: 1000;

margin-bottom: -4vw;

}



.popups a {

position: relative;

float: right;

width: 80vw;

margin-top: -17vw;

left: 0px;

margin-right: -17vw;

}



.popup{

position: relative;

display: block;

left: 0px;

top: 5.3vw;

margin-bottom: 2vw;

font-size: 6.5vw;

font-weight: normal;

color: rgba(255,255,255,1);

transform-origin:left;

font-family: Roboto-Light;

}



.transform{

transition: -webkit-transform 0.5s;

transition: -ms-transform 0.5s;

transition: -moz-transform 0.5s;

transition: -o-transform 0.5s;

transition: transform 0.5s;

}



.medaillephone {

display: block;

position: sticky;

width: 20vw;

height: 20vw;

top: calc(var(--apphoehe) - 46vw);

right: 2vw;

}



.medaillepc{

display:none;

}



#header{

position:fixed;

height: 26vw;

width:100vw;

top:0px;

z-index:2;

}



#header::after {

content: "";
display: block;
height: 1vw;
width: 100%;
position: relative;
top: 100%;
left: 0px;
background-color: rgba(247,211,63,1);

}



#logo {

position: absolute;

height: 30vw;

width: 33vw;

left: 24.25vw;

top: 2vw;

overflow: hidden;

z-index:2;

}



.logobild{

width: 100%;

position: absolute;

top: 0px;

left: 0px;

}





#hauptbild, .keinbild, .bildbutton{

display:none;

}



.headersticky{

position: -webkit-sticky;

position: sticky;

top: calc(87vw - 100vh);

}



.headerrelativ{

position: relative;

top: 0vw;

}



#headerbild {

height: calc(var(--apphoehe) - 45vw - var(--headertitelhoehe));

width: 100vw;

left: 0vw;

z-index: 200;

background-color: rgba(255,255,255,1);

position: relative;

top: 0px;

}



#headerbild.typunterseite{

height: initial;

position: relative;

top: 0px;

}



#headerbildbox {

display: flex;
justify-content: center;
position: relative;
width: 100%;
height: 100%;
left: 0px;
overflow: hidden;

}



.unterbannertext #headerbildbox {

display: flex;

justify-content: center;

position: relative;

width: 94vw;

height: calc(100vh - 88vw);

left: 0px;

overflow: hidden;

z-index: 200;

}



.headerbildbild {

width: 160%;

margin-left: -2%;

object-fit: cover;

}



.verschieben {

margin-left: 23vw;

}



.schmetterling {

margin-left: -5vw;

}



.kurshandbild{

margin-left: 50vw;

margin-top: -30vw;

}



#headerbildbanner{

display:none;

}



#headerbildbanneriphone {

position: sticky;
background-color: rgba(247,211,63,1);
width: 100%;
bottom: 0px;
padding-top: 0px;
padding-right: 3vw;
padding-bottom: 0px;
padding-left: 3vw;
font-weight: 500;
left: 0px;
font-family: Roboto-Light;
color: white;
font-size: 4.5vw;
top: 0px;
z-index: 3;

}



.typunterseite #headerbildbanneriphone{

display:none;

}



#welcheseite {

z-index:220;

}



.zurueckgehen{

position: -webkit-sticky;

position: sticky;

top: 9.6vw;

}



.toptitellink a {

position: absolute;

background-color: rgba(180,207,95,1);

width: 88vw;

bottom: 0px;

padding-top: 0px;

padding-right: 3vw;

padding-bottom: 0px;

padding-left: 3vw;

font-weight: 800;

left: 3vw;

font-family: Roboto-Thin;

color: white;

font-size: 8vw;

}



.headertitel1 {

margin: 0px;

}



.bannertext h1, .bannertext h1 a{

font-weight: normal;

color: rgba(255,255,255,1);

font-size:8vw;

padding: 0px;

margin: auto auto;

font-style: italic;

}



.trennlinie{

width: 65%;

height: 1px;

background-color: rgba(247,105,55,1);

border: none 0px;

}



.hauptbildbanner {

display: flex;

width: 94vw;

position: relative;

margin: 0vw auto;

align-items: center;

flex-direction: column;

}



#titellinks {

display: flex;

flex-direction: column;

align-items: center;

}



#headertitelmiticonblock {

display: flex;

flex-direction: column-reverse;

align-items: center;

}



#headertitel2icon{

border-radius: 50%;

display: flex;

width: 24vw;

height: 24vw;

position: relative;

padding: 0.4vw;

border: solid 0.6vw rgba(121,140,74,1);

left:initial;

}



.curriculuminhalt #headertitel2icon svg {

width: 92%;

position: relative;

top: -0.8vw;

left:0.2vw;

}



.ruckfuhrunginhalt #headertitel2icon svg,.lenormandkarteninhalt #headertitel2icon svg{

width:90%;

}



.ruckfuhrunginhalt #headertitel2icon svg {

top: 0.9vw;

position: relative;

}





.hauptbildbanner .linksspaltig{

width:100%;

text-align:center;

}



.hauptkasten {

position: relative;

width: 25vw;

height: 23.25vw;

}



/*.hauptbildbanner.bannertext h1, .hauptbildbanner.bannertext h1 a{

font-weight: normal;

color: rgba(44,131,197,1);

font-size: 8.6vw;

font-style: normal;

}*/



.hauptheadertitel {

font-size: 7vw;

color: var(--h2farbe);

z-index: 1;

font-family: Roboto-Light !important;

max-width: 100%;

text-align: center;

}







.hauptuntertitel::after {

content: "";

display: block;

width: 60%;

height: 0.3vw;

background-color: rgba(25,171,52,1);

border-radius: 0.1vw;

margin-top: 0.3em;

margin-left: 20%;

}



/*.typ2 .hauptuntertitel.pclayout::after {

display:none;

}*/



/*.typ2 .hauptuntertitel.pclayout{

text-align: left;

font-size: 7vw;

color: var(--h2farbe);

z-index: 1;

font-family: Roboto-Light !important;

font-weight: 800 !important;

max-width: 95%;

margin: 4vw auto 1vw auto;

}*/



/*.typ2 .zurueckgehen {

display: block;

}*/



/*.typ2 #headerbildbanneriphone {

display: flex;

position: relative;

background-color: initial;

padding: 15vw 0px 0px 0px;

max-width: 78%;

align-items: center;

}*/



/*.typ2 #headertitel1icon {

display: flex;

width: 11vw;

height: 11vw;

background-color: var(--graumenuicons);

border-radius: 50%;

position: relative;

padding: 1.5vw;

margin-left: 2vw;

}*/



/*.typ2 #headertitel1icon svg {

display: inline-block;

width: 100%;

height: 100%;

flex-shrink: 0;

}*/



/*.typ2 .hauptbildbanner {

margin: 8vw auto 0px auto;

}*/



/*.typ2 .hauptheadertitel {

display: none;

}*/



/*.typ2 .headertitel1 {

font-family: Roboto-Light;

color: var(--h1farbe);

font-weight: 800;

font-size: 10vw;

position: relative;

margin: 0px auto 0px auto;

display: inline-block;

padding: 0px;

}*/



/*.typ2 .headertitel1::after {

content: "";

display: block;

width: 100%;

height: 0.3vw;

background-color: var(--h2farbe);

border-radius: 0.1vw;

margin-top: 0.3em;

margin-left: 0px;

}*/



/*.typ2 #headerbildbox {

position: relative;

width: 95%;

margin: auto;

display: flex;

height: 65vw;

transform: rotate(-2.5deg);

border: var(--h3farbe) solid 0.3vw;

}*/



/*.typ2 #headerbildbild {

width: 100%;

position: initial;

object-fit: cover;

margin-left: initial;

height: initial;

}*/



/*.typ2 .textbox {

width: 90vw;

margin: 0px 6vw;

font-size: 6vw;

font-weight: lighter;

}*/



/*.typ2 .textboxtext h3 {

margin: 1vw 0px;

font-size: 6vw;

font-family: Roboto-Medium;

color: var(--grauschrift);

font-weight: 100;

line-height: 1.2em;

}*/



/*.typ2 .textbild{

width: 94vw;

margin-left: -3vw;

}*/



/*.typ2 .textkasten{

margin-left: -3vw;

}*/



#sprachen{

position: absolute;

left: 80vw;

top: 25vw;

}



.sprachbutton{

float: left;

margin-right: 3vw;

}



.textbox {

width: 94vw;

margin:auto;

font-size: 5.6vw;

font-weight: lighter;

position:relative

}



.textboxtext{

width: 92vw;

font-size: 5.6vw;

margin:auto;

}



textboxtext h1, #google h1, .hauptuntertitel{

font-size: 8vw;

text-align: center;

}



li.userinput, .textboxtext li {

margin: 3vw 0px;

}



/*.textboxtext h1::after, #google h1::after {

content: "";

display: block;

width: 65%;

height: 1px;

background-color: rgba(247,105,55,1);

border: none 0px;

margin: 3vw auto;

}*/



.textboxtext a {

color: rgba(230, 202, 1, 1);

font-family: Roboto-Light;

}



.textboxtext h2 {

text-align: center;

font-size: 7vw;

font-family: Roboto-Light;

color: var(--h2farbe);

text-align: center;

}



.textboxtext h3{

margin:1em 0px;

font-size: 5.6vw;

font-family: Roboto-Thin;

color: rgba(41,111,37,1);

text-align: center;

}



.textboxtext h4 {

font-family: Roboto-Light;

color: var(--h1farbe);

font-size: 5.6vw;

text-align: center;

}



.ersteseiteoberbox {

display: flex;

width: 96%;

position: relative;

align-items: center;

flex-direction:column;

margin:0px auto;

}



p.leadtext {

display: block;

margin: 4vw auto 0px auto;

font-family: Roboto-LightItalic;

color: var(--leadtextfarbe);

}



.leadtext::before {

content: "«";

}



.leadtext::after {

content: "»";

}



.textbild {

width: 94vw;

margin-left: -1vw;

}



.textboxtext img{

width:100%;

}



.rundbild {

border-radius: 50%;

width: 70vw !important;

height: 70Vw;

flex-shrink: 0;

border: var(--aktivemenuicons) solid 2vw;

margin:auto;

}



.bildlegende {

font-weight: lighter;

font-style: italic;

font-size: 4vw;

margin: -1vw 0px 1vw 01vw;

max-width: 92vw;

}



.textkasten{

width:84vw;

padding:4vw;

border-radius:initial;

margin:3vw 0px;

}



.hinterlegt {

border: rgba(252,209,27,1) solid 0.5vw;

background-color: rgba(255,251,235,1);

}



.hinterlegt p, hinterlegt h2, .hinterlegt h3, .hinterlegt h4, .hinterlegt h5, .hinterlegt h6, .hinterlegt li, .hinterlegt div {

color: var(--normalschrift);

}



#textboxinhalt2kontakt{

position:relative;



}



#kontaktbody, #berstaetigungstext{

position:relative;

padding-top:8vw;

}



.formularfelder{

margin: 0px 0px 0px 0px;

font-family: Roboto-Thin;

font-weight: normal;

font-size: 6vw;

color: rgba(246,178,7,1);

width: 97%%;

padding: 0px 1vw;

border: rgba(4,143,89,1) solid 1px;

}



#bitteausfuellen {

font-size: 6vw;

color: var(--h2farbe);

margin:2vw;

}



.inputvortext {

font-family: Roboto-Thin;

font-weight: normal;

margin: 0px 0px 0px 0px;

font-size: 6vw;

color: rgba(4,143,89,1);

}





.formularinputs{

display: flex;

flex-direction: column;

align-items: flex-start;

font-family: Roboto-Thin;

font-weight: normal;

font-size: 6vw;

color: rgba(246,178,7,1);

margin: 0px 0px 2vw 2vw;

width: 93%;

position: relative;

}



.formularinputs input, .formularinputs textarea {

font-family: Roboto-Light;

font-weight: normal;

font-size: 6vw;

color: rgba(246,178,7,1);

text-align: left;

display: block;

border: rgba(4,143,89,1) solid 1px;

padding: 2vw 1vw;

width:100%;

}



.formularinputs input::-webkit-input-placeholder, .formularinputs textarea::-webkit-input-placeholder{

color:rgba(235,177,9,1);

}



.formularinputs input::-moz-placeholder, .formularinputs textarea::-moz-placeholder, .formularinputs input:-ms-input-placeholder, .formularinputs textarea:-ms-input-placeholder{

color:rgba(235,177,9,1);

}



.formularinputs input::placeholder, .formularinputs textarea::placeholder{

color:rgba(235,177,9,1);

}



.formularinputs input.error, .formularinputs textarea.error {

color:var(--h2farbe);

}



.formularinputs input:focus, .formularinputs textarea:focus{

 border-width:2px;

}





h2.kontakth2{

color:var(--h1farbe);

font-size:7vw;

}



#kontaktaufnahme .kontakth2 {

margin: -6vw 0px 3vw 0px;

}



#kontaktaufnahme .kontakth2::after, #kontaktaufnahme .kontakth2:after{

content:":";

}



#erwuenscht {

color: rgba(4,143,89,1);

}



.kontaktbutton {

color: white;

font-family: Roboto-Light;

font-size: 6vw;

font-weight: 600;

cursor: pointer;

background-color: rgba(114,170,20,1);

text-align: center;

margin: 1vw 0px 6vw 2vw;

padding: 1vw 4vw;

display: block;

}



#google{

width: 94vw;

height: 100vw;

position: relative;

display: flex;

flex-direction: column;

margin: 4vh auto 2vh auto;

}



#google iframe{

width:100%;

height:100%;

}



#google .kontakth2 {

margin-bottom: 4vw;

}







.hinterlegt > *,.hinterlegt li{

color: var(--normalschrift);

}





#seitentitel{

position:relative;

left: 3vw;

max-width:96vw;

}



.titellink, #seitentitel h1{

font-size: 8vw;

font-weight: normal;

color: #877717;

}





.navicontainers{



}



.navibackground{



}



.adresstext{

font-size: 5vw;

font-weight: normal;

}



.copyright{

font-size: 5vw;

font-weight: normal;

}



.adresstext h2{

margin:0px;

padding:0px;

font-weight: bold;

}



.widgetblock {

display: flex;

width: 100%;

flex-wrap: wrap;

justify-content: center;

}



.widget {

width: 85%;

border: var(--raemlifaarbe) solid 0.5vw;

margin: 0px auto 9vw auto;

display: flex;

padding: 3vw 1vw 1vw 1vw;

cursor: pointer;

flex-direction: column;

}





.widgettitel {

padding: 1vw 0px;

margin: 5vw 0px 0px 0px;

text-align: center;

color: var(--kastenfarbe);

font-family: Roboto-Light;

font-size: 9vw;

}



.widgettitel::after, .widgettitel:after{

content: "";

display: block;

height: 0.5vw;

border: none 0px;

width: 30%;

left: 35%;

position: relative;

background-color: rgba(154,188,12,1);

margin: 2vw 0px;

}



.widgetbildkasten {

position: relative;

width: 91%;

margin: 4vw auto 0px auto;

display: flex;

height: 50vw;

transform: rotate(-7deg);

}



.widgetbild {

width: 100%;

position: relative;

object-fit: cover;

}



.querbox {

display: flex;

align-items: flex-end;

justify-content: space-between;

width: 85%;

padding: 2%;

}



.teiltext{

width: 80%;

font-family: Roboto-Thin;

font-size: 5.6vw;

color: var(--normalschrift);

flex-shrink: 0;

}



.mehrbutton::after{

content:"...";

}



.teiltext.lang{

display:none;

}



.mehrbuttondiv {

position: relative;

right: 5%;

bottom: -1.5vw;

padding: 1vw;

flex-shrink: 0;

width: 40%;

}



.mehrbutton {

display: block;

position: relative;

background-color: rgba(114,170,20,1);

width: 80%;

font-size: 6vw;

padding: 0px 2vw;

color: white;

font-family: Roboto-Light;

}



.offen{

-webkit-transform: scale(1,1);

-ms-transform: scale(1,1);

-moz-transform: scale(1,1);

-o-transform: scale(1,1);

transform: scale(1,1);

}



.zu{

-webkit-transform: scale(1,0);

-ms-transform: scale(1,0);

-moz-transform: scale(1,0);

-o-transform: scale(1,0);

transform: scale(1,0);

max-height:10vw;

overflow:hidden;

}



#logintable{

display:none;

}





#loginerscheinbutton{

display:none;

}



.unterseitentext .textboxalle{

display:none;

}



/*calltoaction*/
#CTA {
position: absolute;
width: 100%;
height: 2em;
bottom: 1.6em;
display:flex;
justify-content:space-around;
align-items:center;
}

.ctabutton{
position: relative;
display: inline-flex;
height: 1em;
padding: 0.7em;
width: 41%;
background-color: rgba(252,142,6,0.68);
border-radius: 0.5em;
border: 0.05em solid rgba(355,255,255,1);
justify-content: center;
align-items:center;
}

.ctabuttontext {
font-size: 5vw;
color: rgba(255,255,255,1);
font-weight: bolder;
text-wrap: nowrap;
white-space:nowrap;
}

.gelbdurchscheinend{
background-color: rgba(252,142,6,0.68);
}

.gruendurchscheinend{
background-color: rgba(139,160,19,0.73);
}

/*////////////////////////////////////////////////////////////*/



:root {

--vouha:calc(var(--apphoehe) / 100);

--querversatz:calc(var(--vouha) * 28);

}



@media only screen and (orientation : landscape){ 





#header {

position: fixed;

height: var(--querversatz);

width: 100vw;

top: 0px;

z-index:3;

}



#header::after {

content: "";

display: block;

height: 1vw;

width: 94%;

position: absolute;

top: var(--querversatz);

left: 3%;

background-color: rgba(247,211,63,1);

}



#logo {

position: absolute;

height: calc(var(--querversatz) + (8 * var(--vouha)));

width: calc(var(--querversatz) + (8 * var(--vouha)));

left: calc(100vw -);

top: 2vw;

overflow: hidden;

z-index: 100;

left: 3%;

}



textboxtext h1, .hauptuntertitel {

font-size: calc(13 * var(--vouha));

text-align: center;



}



.hauptuntertitel{

margin-top: calc(2 * var(--vouha));

}



.hauptheadertitel, h2, .textbox h2{

font-size: calc(12 * var(--vouha));

}



#hamburger {

position: absolute;

top: 4vw;

left: 88vw;

width: 12vh;

height: 12vh;

}



#iphonebox {

display: inline;

position: fixed;

top: var(--querversatz);

height: calc(var(--apphoehe) - var(--querversatz));

left: 0vw;

width: 100vw;

overflow-y: scroll;

z-index: 0;

-webkit-overflow-scrolling: touch;

overflow-x: hidden;

}



#headerbild {

height: calc(var(--apphoehe) - (2 * var(--querversatz)) - var(--headertitelhoehe) + (10 * var(--vouha)));

width: 100vw;

left: 0vw;

z-index: 200;

background-color: rgba(255,255,255,1);

position: relative;

top: 0px;

}



.headersticky{

position: -webkit-sticky;

position: sticky;

top: var(--querversatz);

}



.zurueckgehen {

position: -webkit-sticky;

position: sticky;

top: 10vh;

}



#headerbildbanneriphone {

position: sticky;

background-color: rgba(247,211,63,1);

width: 88vw;

bottom: 0px;

padding-top: 0px;

padding-right: 3vw;

padding-bottom: 0px;

padding-left: 3vw;

font-weight: 500;

left: 3vw;

font-family: Roboto-Light;

color: white;

font-size: calc(10 * var(--vouha));

top: 0px;

z-index: 3;

}



.headertitel1{

font-size: calc(10 * var(--vouha)) !important;

}



.toptitellink a {

position: absolute;

background-color: rgba(180,207,95,1);

width: 88vw;

bottom: 0px;

padding-top: 0px;

padding-right: 3vw;

padding-bottom: 0px;

padding-left: 3vw;

font-weight: 800;

left: 3vw;

font-family: Roboto-Thin;

color: white;

font-size: 8vh;

}



.servicenaviblock {

width: 16vh;

left: 87%;

position: relative;

top: 24vh;

display: flex;

flex-direction: column-reverse;

height: 32vh;

justify-content: space-between;

}



.servicenaviitem.serviceelement {

height: 14vh;

width: 14vh;

}



.obergerotiert {

-webkit-transform: rotate(45deg) translate(5vh,2.5vh) scale(1.5,1);

-moz-transform: rotate(45deg) translate(5vh,2.5vh) scale(1.5,1);

-ms-transform: rotate(45deg) translate(5vh,2.5vh) scale(1.5,1);

-o-transform: rotate(45deg) translate(5vh,2.5vh) scale(1.5,1);

transform: rotate(45deg) translate(5vh,2.5vh) scale(1.5,1);

}

	

.untergerotiert {

-webkit-transform: rotate(-45deg) translate(5vh,-2.5vh) scale(1.5,1);

-moz-transform: rotate(-45deg) translate(5vh,-2.5vh) scale(1.5,1);

-ms-transform: rotate(-45deg) translate(5vh,-2.5vh) scale(1.5,1);

-o-transform: rotate(-45deg) translate(5vh,-2.5vh) scale(1.5,1);

transform: rotate(-45deg) translate(5vh,-2.5vh) scale(1.5,1);

}



#menu {

position: fixed;

-webkit-transform: scale(1,0);

-ms-transform: scale(1,0);

-moz-transform: scale(1,0);

-o-transform: scale(1,0);

transform: scale(1,0);

-webkit-user-select: none;

top: 0px;

transform-origin: top;

width: 100vw;

height: calc(100%);

background-color: rgba(164,196,28,1);

overflow-x: hidden;

overflow-y: scroll;

-webkit-overflow-scrolling: touch;

display: flex;

align-items: var(--flexalign);

left: 0px;

}



#menukasten{

transform-origin: top;

}



.menuoffen #logo{

display:none;

}



#header.menuoffen{

width:20vw;

left:80vw;

}



#header.menuoffen::after {

height: 0px;

}



.menuoffen #hamburger{

left:8vw;

}



.medaillephone {

position: sticky;

width: 24vh;

height: 24vh;

top: calc(var(--apphoehe) - 26vh);

right: 2vh;

}



.icon{

width: 12vh;

height: 12vh;

}



.hauptitem .icon {

background-color: white;

border-radius: 30%;

display: flex;

position: relative;

max-width: 12vw;

overflow: hidden;

}



.hauptitem a, .aktiv .hauptitem a {

position: absolute;

top: 2vw;

left: 24vh;

font-size: 6.5vh;

color: var(--blaumenuschrift);

font-weight: lighter;

}



.aktiv .hauptitem a, .aktiv.popup {

color: rgba(11,130,36,1);

}



.icon.untermenu{

left: -5vh;

}



.mitunternavi {

left: 25vh !important;

}



.pluszeichen {

position: absolute;

top: 1vh;

left: 34vw;

font-weight: bold;

width: 12vh;

height: 12vh;

transform: rotate(-90deg);

}



.geoeffnet {

transform: rotate(90deg);

left: 30vw;

top:2vh;

}



.popups {

background-color: initial;

position:absolute;

left: 39vw;

transform-origin: top;

clear: both;

top: calc(0px - var(--popupversatz));

z-index: 1000;

padding: 1vh 0px 1vh calc(10 * var(--vouha));

}





.popups a {

position: relative;

width: 35vw;

margin-top: -16vh;

left: 13vh;

}



.popup {

position: relative;

display: block;

left: 0px;

top: 5.3vh;

margin-bottom: 2vw;

font-size: 6.5vh;

font-weight: normal;

color: var(--blaumenuschrift);

transform-origin: left;

font-family: Roboto-Light;

}



.hauptitem {

max-width: 30%;

}



.hauptitem .icon.aktiv, .icon.aktiv {

background-color: var(--graumenuicons);

}



.textboxtext p, .textboxtext a, .textboxtext li, .textboxtext span, .textboxtext strong, .textboxtext b{

font-size: calc(10 * var(--vouha));

}



.bildlegende, .bildlegende p{

font-size: calc(6 * var(--vouha)) !important;

}

#datenschutz {

top: -7.3em;
left: 5vw;
}

.datenschutz img{
height:3em;
}

.copy {

font-family: Roboto;

font-size: calc(8 * var(--vouha));

color: var(--normalschrift);

padding: 0.5vw 0px 1vw 0px;

margin-left: calc(100vw - (105 * var(--vouha)));

}



}