body {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  background-color: rgb(210, 235, 255);
  font-size: 16px;
}
img { border: 0px; } /* !!!! Bei Bildern '../' entfernen!! !!!! */

A:link { color: #34689a; text-decoration: underline; }
A:visited { color: #34689a; text-decoration: none; }
A:active  {color: #34689a; text-decoration: none; }
A:hover { color: #34689a; text-decoration: underline; }

.leinwand { margin-left: auto; margin-right: auto;}
.fett { font-weight: bold; }
.krsv { font-style:italic; }
.ustr { text-decoration: underline; }
.formeingabe { margin-bottom: 5px;}

/* Block varibale je nach Gerät! */
h1, h2, h3 { margin: 0px; font-weight: bold }

@media all and (min-width:320px) {
  /* 320 breit */
  h1 { font-size: 1.4em; }
  h2 { font-size: 1.1em; }
  h3 { font-size: 0.95em; }
  p, li, blockquote { font-size: 0.8em; }
  .leinwand { width: 320px; }
  .hwkbild { width: auto; height: auto; max-height:133px; max-width:104px; }
  .hwkname { font-size: 1.5em; }
  .spacer1 { height: 1.7em; }
  .slogan { font-size: 0.8em; margin-right: 12px; }
  .legende { width: 216px; height: 133px; }
  .menu { display: none; }
  .wegweiser { font-size: 90%; }
  .textspalte { width: 305px; } /* width: 100%;  */
  .ganzspalte { width: 305px; } /* width: 100%;  */
  .abbildung { width: auto; height: auto; max-width: 215px; }
  .geteilt { width: 72%; margin: 5px 0; display: none; }
  .mvi-kasten { width: 50%; }
  .felder { width: 34%; }
  textarea { width: 210px; max-width: 210px; height: 50px; }
}
@media all and (min-width:480px) {
  /* 480 breit */
  h1 { font-size: 1.6em; }
  h2 { font-size: 1.2em; }
  h3 { font-size: 1.0em; }
  p, li, blockquote { font-size: 0.9em; }
  .leinwand { width: 480px; }
  .hwkbild { width: auto; height: auto; max-height:133px; max-width:133px; }
  .hwkname { font-size: 1.4em; }
  .spacer1 { height: 1.4em; }
  .slogan { font-size: 1.1em; margin-right: 12px; }
  .legende { width: 375px; height: 133px; }
/*  .menu { display: block; } */
  .textspalte { width: 470px; }
  .ganzspalte { width: 470px; }
  .wegweiser { font-size: 90%; }
  .geteilt { width: 72%; margin: 8px 0; }
  .abbildung { width: auto; height: auto; max-width: 405px; }
  .mvi-kasten { width: 34%; }
  .felder { width: 54%; }
  textarea { width: 330px; max-width: 330px; height: 50px; }
}
@media screen and (min-width:900px) {
/* 900 breit */
  h1 { font-size: 1.8em; }
  h2 { font-size: 1.4em; }
  h3 { font-size: 1.2em; }
  p, li, blockquote { font-size: 0.9em; }
  .leinwand { width: 900px; }
  .hwkbild { width: 130px; height: auto; max-height:151px; max-width:133px; }
  .hwkname { font-size: 1.8em; }
  .spacer1 { height: 1.0em; }
  .slogan { text-shadow: rgb(0, 0, 0) 3px 3px 5px; text-align: right; color: silver; font-size: 1.2em; }
  .legende { width: 770px; height: 151px; }
  .menu { display: block; }
  .textspalte { width: 670px; } /* width: 100%;  */
  .ganzspalte { width: 890px; margin-left: 5px; } /* width: 100%;  */
  .wegweiser { font-size: 90%; }
  .geteilt { width: 15px; margin: 8px 0; }
  .infospalte { width: 195px; margin: 5px; }
  .mvi-kasten { width: 100%; }
   textarea { width: 470px; max-width: 470px; height: 50px; }
}

.leinwand { font-size: medium; color: black;  background-color: white; }
.kopffries { width: 100%; }
.hwkbild { float: left; }
.hwkname { font-weight: bolder; text-align: left; }
.slogan { margin-right: 12px; text-shadow: rgb(0, 0, 0) 3px 3px 5px; text-align: right; color: silver; font-weight: bold; }
.legende { background-image: url(https://www.gratistraining.com/bilder/wasserhorizont.png); background-size: initial; float: right; }

.menu { background-image: url(https://www.gratistraining.com/bilder/bp-menu.png); height: 22px; width: 100%; background-repeat: repeat-x; }
.navigation { display: block; }
.wegweiser { text-align: center; }
.klein { font-size: 0.8em; }
.kleiner { font-size: 0.75em; }
.texttafel { clear:both; background-color: white; text-align: left; }
.formeingabe { width: 450px; max-width: 450px;}
/* .textblatt { text-align: left; } */
.textspalte { padding: 5px; float: right; } /* width: 670px;  */
.abbildung { text-align: center; }
.geteilt { float: right; }
.infospalte { padding: 5px; font-size: 80%; background-color: #e8e8e8; float: left;}
.mvi-kasten { float: left; text-align: center; }

/* bis  hier ausgemustert 28.4.15 */

.werbekasten { padding: 5px; margin: 5px; background-color: rgb(232, 232, 232); font-size: 90%; float: right; }
.projekte { width: 100%; display: block; }
.eigenwerbung { padding: 5px; margin: 5px; font-size: 85%; text-align: left; display: block; }  /*-- !!!!! --*/
.hinweis { font-size: 0.9em; }
.kommentare {padding: 5px; margin: 5px; background-color: #fff0f5; font-size: 0.85em; color: #4B0082; clear: both; }
.spamverbot { padding: 5px; margin: 5px; height: auto; text-align:left; font-size: 80%; border: solid 1px; clear: both; }  /*-- !!!!! --*/

.kommForm { padding: 5px; margin: 5px; height: auto; font-size: 80%; }
.Eingabekasten { width: 100%; height:140px; border: 1px solid #336699; }
.feldnamen { width: 24%; float:left; margin-left: 5px; } /* valign:top;  */
.felder { float:left; }
.feld { line-height: 1.5; }
.textarea { width: 33px; height: 52px; }
.links { font-size: 0.8em; border-right: 1px solid; }

.typenschild {font-size:0.8em; text-align: center; }

/* .menu {
  A:link { color: white; text-decoration: underline; }
  A:visited { color: yellow; text-decoration: none; }
  A:active  {color: yellow; text-decoration: none; }
  A:hover { color: yellow; text-decoration: underline; }
} */