 @charset "UTF-8";
/* Link Verhalten */
a:active, a:focus {outline: none;} /* klappt aber irgendwie nicht  */
/* neu 2021 z.B. für Galerie */
.achtzighoch{
height:80vh;
}
.maxhachtzig{
max-height:80vh;
}
.minusvollhoch{
top:-100%;
}
/** navi in footnavi ***/
a.footnavi , a.footnavi_akt{
font-size:120%;
line-height:2em;
}
/*regenbogentex*/
.rainbow-text {

 animation-duration: 3.115s;
}

.klbild{
width:155%;height:auto;margin-top:-5%;margin-left:-10%;
}
.rainbow-text {
 background: linear-gradient(53.13deg,#FFD33D 0,#FB8532 16.02%,#EA4A5A 28.06%,#8A63D2 56.92%,#2188FF 72.93%,#34D058 84%,#FFD33D 100%);
 background-size: auto;
 background-clip: border-box;
 background-clip: text;
 display: inline-block;
 color: transparent;
 text-fill-color: transparent;
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 animation: shine 6.28s alternate infinite;
 animation-duration: 6.28s;
 background-size: 300%;
}

@keyframes shine {
 0% {
  background-position:200% left;
  filter: hue-rotate(0);
 }
 62.8% {
  background-position:100% center;
  filter: hue-rotate(180);
 }
 100% {
  background-position:200% right;
  filter: hue-rotate(360);
 }
}
/* verschiedene transparente boxen */
 div#overlaybg{position:absolute;top:0;left:0;width:100%;height:100%;margin:0;background-image: url('../grafiken/bg_overlay.png');z-index:3;}
.overHG1{z-index:5;} .clear{clear:both;}
.blacktrans{background-image:url('../grafiken/blackhg.png');}
.blacktransV{background-image:url('../grafiken/blackhg-verlauf.png');background-repeat: repeat-y;}
.whitetrans{background-image:url('../grafiken/whitehg.png');background-repeat: repeat-y;}
.overlayHG{background-image: url('../grafiken/bg_overlay.png');}
.overlayHG_bl{background-image: url('../grafiken/bg_overlay_black.png');}
.redtrans1{background-image: url('../grafiken/redhg90.png');}
/* unterschiedlich breite Zeilen, Boxen */
.stdzeile{width:100%;height:auto;} .smzeile1{width:90%;height:auto;} .smzeile2{width:80%;height:auto;}
/* unterschiedliche floatboxen */
.fl_general{float:left;}
/* bei benötigten vertikalen Abständen Abstandshalter oben oder unten einfügen - bei allen pur Boxen kein Rahmen und padding! */
.halbeboxpur{width:50%;margin:0;}
.drittelboxpur{width:33.25%;margin:0;}
.zweidrittelboxpur{width:66%;margin:0;}
.viertelboxpur{width:25%;margin:0;}
.dreiviertelboxpur{width:75%;margin:0;}
/* etwas schmaler, für Platz von Rahmen etc. */
.halbebox{width:46%;}
.drittelbox{width:31%;}
.zweidrittelbox{width:61%;}
.viertelbox{width:23%;}
.dreiviertelbox{width:70%;}
/* unterschiedlicher vertikaler Abstand */
.vonobennull{margin-top: 0;}  .vonobensoft{margin-top: 0.5em;} .vonobenmittel{margin-top: 1em;} .vonobenmehr{margin-top: 1.5em;}
.vonobenmehrplus1{margin-top: 2em;}
.vonuntennull{margin-bottom: 0;}  .vonuntensoft{margin-bottom: 0.5em;} .vonuntenmittel{margin-bottom: 1em;} .vonuntenmehr{margin-bottom: 1.5em;}
/* unterschiedlicher horizontaler Abstand */
.vonlinks1{margin-left: 1%;} .vonlinks2{margin-left: 2%;} .vonlinks3{margin-left: 3%;} .vonlinks5{margin-left: 5%;} .vonlinks10{margin-left: 10%;}
.vonlinksFL{margin-left: 0.5%;}
.vonrechts1{margin-right: 1%;} .vonrechts2{margin-right: 2%;} .vonrechts3{margin-right: 3%;} .vonrechts5{margin-right: 5%;}
.vonrechts10{margin-right: 10%;}
.vonrechtsFL{margin-right: 0.5%;}

/* Füllbox(en) vertikal */
.fuellerVm{width:100%;height:1em;}

/* unterschiedliche Farben*/
.weiss{color:#ffffff;} .schwarz{color:#000000;} .rot{color:#ff0000;} .darkred{color:#8b0000;} .mrablau{color:#0082ca;} .fullgreen{color:#008000;}

/* unterschiedliche Hintergrundfarben*/
.hgweiss{background-color:#ffffff;} .hgschwarz{background-color:#000000;} .hgmrablau{background-color:#0082ca;}

/* unterschiedliche Hintergrund Füllungen Verläufe... */
.schwarzverlauf{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0e0d0c+37,827e70+100 */
background: rgb(14,13,12); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(14,13,12,1) 37%, rgba(130,126,112,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(14,13,12,1) 37%,rgba(130,126,112,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(14,13,12,1) 37%,rgba(130,126,112,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0e0d0c', endColorstr='#827e70',GradientType=0 ); /* IE6-9 */
}
.goldverlaufvert{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f6e6b4+0,ed9017+100;Yellow+3D+%231 */
background: rgb(246,230,180); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(246,230,180,1) 0%, rgba(237,144,23,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(246,230,180,1) 0%,rgba(237,144,23,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(246,230,180,1) 0%,rgba(237,144,23,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6e6b4', endColorstr='#ed9017',GradientType=0 ); /* IE6-9 */
}
.blaustreiftotrans{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1e5799+0,7db9e8+100&1+0,0+100;Blue+to+Transparent */
background: linear-gradient(to right,  rgba(30,87,153,1) 0%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}
.pinkstreifenhori{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e93cec+0,fb83fa+100 */
background: linear-gradient(to right,  #e93cec 0%,#fb83fa 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.pinkhori{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fb83fa+0,e93cec+100;Pink+3D+%232 */
background: linear-gradient(to bottom,  #fb83fa 0%,#e93cec 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}
.gruenstreifhori{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0d672b+91,17cb41+100&0.86+30,0+98,0+100 */
background: linear-gradient(to right,  rgba(13,103,43,0.86) 30%,rgba(13,103,43,0.09) 91%,rgba(21,181,60,0) 98%,rgba(23,203,65,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

}

.wgweisstrans{
background:url('../grafiken/weissvierteltrans.png');
}
/* cursor styles*/
.hand{cursor:pointer;}
.greif{cursor: grab;}
/* Navigation */
.mainlinks{text-decoration:none;} .wechselMblau:hover{color:#0082ca;} .wechselrot:hover{color:#ff0000;} .unterstrich:hover{text-decoration:underline;} .wechselweiss:hover{color:#fff;}
.wechselgelb:hover{color:yellow;}
/* Link zum schliessen mit unterschiedlichem Hintergrund */
.schliesserred:hover{
	background:#ff0000; color:#fff;
	}
.schliesserweissrot:hover{
	background:#fff; color:#ff0000;
	}

/* unterschiedliche Schriftgrößen und Grad */
.ftnormal{font-size:100%;} .ftsmaller1{font-size:90%;} .ftsmaller2{font-size:80%;} .ftsmaller3{font-size:70%;}
.ftlarger1{font-size:110%;} .ftlarger2{font-size:120%;} .ftlarger3{font-size:130%;} .ftlarger4{font-size:140%;} .ftlarger5{font-size:150%;}
.ftfat{font-weight:bold;} .ftthin{font-weight:lighter;}

/* unterschiedliche Schriftgrößen und Grad für Überschriften */
h1, h2, h3, h4, h5{margin:0;}
.hd_line_ft_1{font-size:200%;} .hd_line_ft_2{font-size:160%;} .hd_line_ft_3{font-size:120%;}
.hd_line_absttopmehr{margin-top:2em;} .hd_line_absttopmittel{margin-top:1.5em;}

/*  Schriftarten von google einbinden */
/*.poiret{font-family: 'Poiret One', cursive;letter-spacing:2px;} */
.roboto{font-family: 'Roboto Condensed', sans-serif;}
.ubuntu{font-family: 'Ubuntu', sans-serif;}
.cookie{font-family: 'Cookie', cursive;}
.josiS{font-family: 'Josefin Slab', serif;}


/* unterschiedlicher Textstyle */
.kursiv{font-style:italic;}

/* unterschiedliche Ausrichtungen */
.center{text-align:center;} .linkerrand{text-align:left;} .rechterrand{text-align:right;} .blocksatz{text-align:justify;}
/* unterschiedliche Zeilenhöhen */
.zeilehoch3{line-height:250%;} .zeilehoch2{line-height:220%;}  .zeilehoch1{line-height:190%;}
/* Ecken abrunden */
.ganzrundsmall{border-radius:.5em;} .ganzrundmedium{border-radius:1em;}
/* eingerahmte Boxen */
.borderboxblau{border:solid #0082ca 1px;} .borderboxgold{border:solid #b8860b 1px;} .borderboxred{border:solid #ff0000 1px;} .borderboxtrans{border:solid transparent 1px;}
/* paddingboxen */
.pd05{padding:0.5em;}
.ganzoben{z-index:100;}
/* Text mit Schatten   -   gefunden auf: https://css3gen.com/text-shadow/ */
.txtsmallshadow{text-shadow: 4px 4px 2px rgba(150, 150, 150, 1);}
/* Mail Formulare 1. Textfelder, 2. Textareas, 3. buttons submit... */
.txtvoll{width:100%;} .txtzweidrittel{width:70%;} .txthalb{width:50%;}
.txtarH1{height:5em;} .txtarH2{height: 20rem;} .txtarHX{height: 35rem;}
.txtar_autoscroll{overflow:auto;}
/* LISTEN */
.listeohne{list-style-type:none;margin:0px;padding:0px;} .listeohne li{list-style-type:none;margin:0px;padding:0px;}
.circle {list-style-type: circle;}
.square {list-style-type: square;}
.upper-roman {list-style-type: upper-roman;}
.lower-alpha {list-style-type: lower-alpha;}
.listeaussen{list-style-position:outside;} .listeinnen{list-style-position:inside;}