
@viewport { width: device-width; initial-scale: 1.0; maximum-scale: 1.0; user-scalable: no } 
/* @viewport { width: device-width; } */

body {
	 background-color: white;
	 background-image: url("../pics/wallpaper8.jpg");
	 background-repeat: repeat;
	 background-attachment: fixed;
	 background-position: right bottom;
	 color: black; 	 	 
	 font-family: Verdana, Arial, Helvetica, sans-serif;
	 } 

	 
@media (orientation: portrait) 
{ 
body {
	 font-size: 40px; 
	 line-height: normal;	
	 max-width: 22em;
	 } 

div.menu{text-align: center; }
a:link.menu,a:visited.menu{font-weight:bold; font-size: 9vw; line-height: 130%; color:black;}
a:active.menu,a:hover.menu{color:red;}

div.menu_red{text-align: center; }
a:link.menu_red,a:visited.menu_red{font-weight:bold; font-size: 9vw; line-height: 130%; color:red;}
a:active.menu_red,a:hover.menu_red{color:blue;}
}

@media (orientation: landscape) 
{ 
body {
	 font-size: 50px;
	 line-height: normal;	 
	 max-width: 23em;
	 } 

div.menu{text-align:center; }
a:link.menu,a:visited.menu{font-weight:bold; font-size: .25em; line-height: normal; color:black;}
a:active.menu,a:hover.menu{color:red;}


div.menu_red{text-align: center; }
a:link.menu_red,a:visited.menu_red{font-weight:bold; font-size: 9vw; line-height: 130%; color:red;}
a:active.menu_red,a:hover.menu_red{color:blue;}
}

a:link { text-decoration: none; color: black; }
a:visited { text-decoration: none; color: black; }
a:hover { text-decoration: none; color: red; }
a:active { text-decoration: none; color: red; }

.left    { text-align: left; }
.right   { text-align: right; }
.center  { text-align: center; }
.justify { text-align: justify; }
.start   { text-align: start; }

br   {
	font-weight: normal;
	font-size: .4em;
    }


h1 {
	font-weight: normal;
	font-size: .5em;
	line-height: normal;
	color: red;
    }
	
h2 {
	font-weight: normal;
	font-size: .3em;
	line-height: normal;
    }

h3 {
	font-weight: normal;
	font-size: .3em;
	line-height: normal;
    }
	
text_050 {
	font-weight: normal;
	font-size: .5em;
	line-height: normal;
    }

text_040 {
	font-weight: normal;
	font-size: .4em;
	line-height: normal;
    }

text_035 {
	font-weight: normal;
	font-size: .35em;
	line-height: normal;
    }
	
text_030 {
	font-weight: normal;
	font-size: .3em;
	line-height: normal;
    }
	
text_025 {
	font-weight: normal;
	font-size: .25em;
	line-height: normal;
    }

	/* Band */
mn {
	 font-weight: bold;
	 font-size: 2vw;
	 line-height: normal;
     }

mb {
	 font-weight: normal;
	 font-size: 1.3vw;
	 line-height: normal;
   }
   
#flexContainerRowTop {
      display: flex;
      flex-direction: row;
	  align-items: flex-start;
	  justify-content: center;
}

#flexContainerRowBot {
      display: flex;
      flex-direction: row;
	  align-items: flex-end;
	  justify-content: center;
}

#flexContainerRow{
      display: flex;
      flex-direction: row;
	  align-items: center;
	  justify-content: center;
}

#flexContainerCol {
      display: flex;
      flex-direction: column;
}

/* Flexbox: Bilder und Text ohne Rand */
.fbox { padding: 1vw; background: none;}

/* Linkbox: Bilder ohne Rand */
.lbox { flex-basis: 50%; background: none;}

/* Textbox: Text mit Rand */
.tbox { flex-basis: 40%; padding: 1vw; background: none;}

/* Ampbox: Bilder und MP3-Player */
.abox { flex-basis: 30%; margin: 1vw; background: none;}

audio {width: 100%; bottom: 0;}
mtitle {
	font-weight: bold;
	font-size: .3em;
	color: black;
    }
	
/* Notebooks und PCs und Tablets und große Smartphones */
@media only screen and (min-width:800px)
{
}
/* Smartphones (Tablets wie Notebooks, siehe oben) */
@media only screen and (max-width:800px)
{
}
