@font-face { font-family: mitdabei; src: url(freesans_1zge.otf); }

html {
 font-family: mitdabei, time, sans-serif ;
 scroll-behavior: smooth;

  font-size-adjust: 0.58;
  line-height: 1.5;
  text-align: center;
 }

@media screen and (max-width: 690px)      /*    schmal    */
{  html {
 font-size: calc(10.5px + 2vw);
         } }

@media screen and (min-width: 690px)   /*        breit           */
{  html {
 font-size: calc(15.5px + 0.8vw);         /*    war:     calc(14px + 0.7vw);       */
         } }



/*   PROJEKT-EINSTELLUNGEN  */
/*   PROJEKT-FARBE, fuer Ueberschriften, Links... Braun: 84331f; Rotbraun: 7f0817 (alt); Orange f26601 Weinrot 7f0817 */

.projektfarbe {  color: #84331f; }


@font-face { font-family: mitdabei; src: url(freesans_1zge.otf); }

html {
 font-family: mitdabei, Times New Roman, time, sans-serif ;
  letter-spacing: 0.005em;
  word-spacing: 0.005em;
  scroll-behavior: smooth;
 }

@media screen and (max-width: 690px)      /*    schmal    */
{  html {
 font-size: calc(8px + 2vw);
         } }

@media screen and (min-width: 690px)   /*        breit           */
{  html {
 font-size: calc(14px + 0.8vw);         /*    war:     calc(14px + 0.7vw);       */
         } }




.absolute {
 position: absolute;
 }

.pointer {
	cursor: pointer;
}


.klappmenue {
	position: absolute; 
	z-index: 10;
	top: 1.2rem; 
	right: 1.5rem;
	display: inline-block;
}

.menueinhalt {
	display: none;
	right: -1.0rem;
	margin-top: -0.8rem;
	background-color: white;
	min-width: 10rem;
	box-shadow: 0rem 0.8rem 1.6rem 0rem rgba(0,0,0,0.2);
	z-index: 1;
	opacity: 0.97;
}

.menueinhalt a {                 /*    Parent-Child-Hierarchie    */
	color: black;
	padding: 0.9rem 0.9rem;
	font-size: 100%;
	text-align: left;
	text-decoration: none;
	display: block;
}

.menueinhalt a:hover {             /*    Parent-Child-Hierarchie    */
	background-color: #f1f1f1;
}

.klappmenue:hover .menueinhalt {          /*    Parent-Child-Hierarchie    */
  display: block;
}







body 
  {
  background: #EFEFEF; 
  border: 0px solid green;
  }
h1
  {
  padding: 1.0em 0.0vw 0.0rem 0.0vw;
  }
h2
  {
  padding: 0.0em 0.0vw 0.0rem 0.0vw;
  margin: 0.0em 0.0vw 0.0rem 0.0vw;
  border: 0px solid green;
  }
p
  {
  padding: 0.0rem 0.0vw 0.0rem 0.0vw;			/*      war:  0.0rem 0.6vw 0.0rem 0.6vw    */
  text-align: center;	
  border: 0px solid red; 
  }
.p_fliessend
  {
  padding: 0.0rem 0.8vw;
  text-align: justify;	
  border: 0px solid red; 
  }



			/*      LEUCHTSTIFT z.B. guen 66FF33, gelb FFFF33      */
			/*      STANDARD-BLAU  0033CC  */
a:link { color: #0033CC; text-decoration-color: #0033CC;  text-decoration-style: dotted;  transition: all .20s;}
a:visited { color: #0033CC; }
a:hover  { color: #66de4a; text-decoration-color: #022aa1; background-color: #FFFFFF; text-decoration: underline; }     /*   Standard-Blau: 0033CC und Weiss  */
a:active {color: #0033CC; text-decoration: underline; background-color: #FFFFFF; }

			/*      OHNE DEKORATION   class="text_fuss non_dec_link"        */
a.non_dec_link:link {color: #bbbbbb; text-decoration: none; }
a.non_dec_link:visited {color: #bbbbbb; text-decoration: none; }
a.non_dec_link:hover {color: #66de4a; text-decoration: underline; transition: all .10s;}
a.non_dec_link:active {color: #993300; text-decoration: underline; }

			/*    FUSSNOTEN, NICHT FLIESSEND (schmal/breit)   -------     */
.text_fuss {
  text-align: center;
  font-size: 85%;
}


.taste {
  font-size: 95%;
    text-align: center;
    text-decoration-line: none;
    text-shadow: inherit;					/*  gegen Button-Default   */
    white-space: nowrap;
  margin: 0.7% 0.0vw 0.5% 0.0vw;
  border: 1px solid #f26601;
    border-radius: 0.5em;
    padding: 0.5em 0.5em 0.55em 0.5em;
    box-shadow: 0.05rem 0.05rem #CCCCCC;
  background: transparent;				/*  gegen Button-Default   */
  opacity: 1.00 ;
  transition-duration: 0.15s;
            }
.taste:hover {
 cursor: pointer;
   color: #66de4a;
 font-size: 100%;
 margin: 0.4% 0.0vw 0.1% 0.0vw;
 border: 2px solid #66de4a;
 transition-duration: 0.15s;
            }












/*   TECHNIK SELTEN  */

.class_divider_aussen
  { 
  position: relative;
  box-shadow: 2px 0px 4px #DDDDDD, -2px 0px 2px #EEEEEE; 
  border: 1px solid #DDDDDD;
  padding: 2.5rem  0.5rem  0.5rem 0.5rem; 
  background: #FFFFFF;
  min-height: 90vh;
  max-width: 95vw;
/*     border: 1px solid green;     */ 
  }


  /* heisst: 0-Xpx  */ 
@media screen and (max-width: 500px)
  { 
  .class_divider_aussen { margin: -0.5rem -0.5rem 10vh -0.5rem; }   /* 9 Wšrter */ 
  }
  /* heisst: X+1px und mehr  */ 
@media screen and (min-width: 500px)
  { 
  .class_divider_aussen { margin: -0.5rem 0.5vw 10vh 0.5vw; color: black; }
  }
@media screen and (min-width: 600px)
  { 
  .class_divider_aussen { margin: -0.5rem 0.5vw 10vh 0.5vw; color: black; }    /* 10-11 Wšrter */ 
  }
@media screen and (min-width: 700px)
  { 
  .class_divider_aussen { margin: -0.5rem 3.5vw 10vh 3.5vw; color: black; }    /* 14 Wšrter */ 
  }
@media screen and (min-width: 900px)
  { 
  .class_divider_aussen { margin: -0.5rem 8vw 10vh 8vw; color: black; }
  }
@media screen and (min-width: 1000px)
  { 
  .class_divider_aussen { margin: -0.5rem 10vw 10vh 10vw; color: black; }
  }
@media screen and (min-width: 1300px)
  { 
  .class_divider_aussen { margin: -0.5rem 15vw 10vh 15vw; color: black; }
  }
@media screen and (min-width: 1500px)
  { 
  .class_divider_aussen { margin: -0.5rem 17vw 10vh 17vw; color: black;   }
  }
@media screen and (min-width: 1700px)
  { 
  .class_divider_aussen { margin: -0.5rem 19vw 10vh 19vw; color: black;   }
  }
@media screen and (min-width: 2000px)
  { 
  .class_divider_aussen { margin: -0.5rem 20vw 10vh 20vw; color: black;   }
  }
@media screen and (min-width: 2400px)
  { 
  .class_divider_aussen { margin: -0.5rem 22vw 10vh 22vw; color: black;   }
  }