body {
  margin: 0em auto;
  max-width: 65em;
  font-family: Arial, Helvetica, sans-serif;	
  display:-webkit-flex;
  display: flex;
 -webkit-flex-flow: row wrap;
 flex-flow: row wrap;
 background-image: url("symbol/hg1h.gif");
			}
table {
  margin-top: 5px;
 }
header {
 -webkit-flex: 1 100%;
 flex: 1 100%;
 background-image: url("symbol/hg-karogn.gif");
 border-color: #d5d5d5;
 } 
logopic {
  max-width: 450px;
  min-width: 340px;
  display: block;
 }
nav {
  padding: 3px;
  margin: 3px;
  -webkit-flex: 1 100%;
  flex: 1 100%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  font-weight: bold;
  line-height: 1.5em;
 } 
siteinfo {
  flex: 1 100%;
  padding: 5px;
  margin: 0;
  background-image: url("symbol/hg1h.gif");
  border: 3px outset #2baf00;
  }      
main {
  background: #ffffff;
  padding: 3px;
  margin: 3px;
  -webkit-flex: 5 1 0%;
  flex: 5 1 0%;
  min-width: 340px;
 }  
modellinfo {
  min-width: 340px;
  padding: 3px;
  margin: 3px;
  background: #F1F3F4;
  -webkit-flex: 2 1 0%;
  flex: 2 1 0%;
 }
linkfeld {
  min-width: 340px;
  padding: 10px;
  background: #ffffff;
  border-color: #8db243;
  -webkit-flex: 2 1 0%;
  flex: 2 1 0%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.9em;
  font-weight: bold;
  white-space:nowrap;
 }
bildfeld {
  min-width: 340px;
  max-width: 540px;
  padding: 3px;
  align-items: center;
  text-align: center;
  -webkit-flex: 2 1 0%;
 flex: 2 1 0%;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  font-weight: bold;
 }
beschreibung {
  min-width: 340px;
  padding: 3px;
  margin: 3px;
  text-align: justify;
 }
 bildgalerie {
  padding: 10px;
  margin: 3px;
  background: #444444;
  align-items: center;
  text-align: center;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  font-weight: bold;
  white-space:nowrap;
 } 
katalogfeld {
  min-width: 8.75em;
  max-width: 8.75em;
  height: auto;
  align-items: center;
  border: 1px;
  border-style: solid;
  background-color: #ffffff;
  padding: 6px;
  margin: 4px;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.85em;
}
katalogfeld > img {
  padding-bottom: 0px;
  padding-top: 8px;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 15px;
}
article {
  border-radius: 0px 0.5em 0.5em;
  border: 2px solid;
  padding: 6px;
  margin: 3px;
  background: #ffffee;
  border-color: #007000;
}
gruppe {
  white-space: nowrap;
}
footer {
  background: #84b584;
  padding: 3px;
  margin: 3px;
  -webkit-flex: 1 100%;
  flex: 1 100%;
 }      
      
a:link {
  text-decoration-color: currentcolor;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
  background-color: #ffff00;
}
a:active {
	text-decoration: none;
}
sg12 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  font-weight: bold;
} 
sg12gmark {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.8em;
  font-weight: bold;
  background-color: #FFCCCC;
}
sg13 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
  font-weight: bold;
} 
sg15 {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.5em;
  font-weight: bold;
} 
sg15green {
  font-family: Arial, Helvetica, sans-serif;
  color: #007000;  
  font-size: 1.5em;
  font-weight: bold; 
  font-style: italic;
}
sg15mark {
  font-family: Arial, Helvetica, sans-serif;
  color: #ffffff;
  background-color: #007000;
  font-size: 1.5em;
  font-weight: bold; 
  font-style: italic;
}
sywb {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
  font-weight: bold;
  color: #ffffff;
  background-color: #0000CC;
}
syws {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
  font-weight: bold;
  color: #ffffff;
  background-color: #000000;
}
sysg {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1em;
  font-weight: bold;
  color: #000000;
  background-color: #ffff33;
}

/* Clearfix-Hack zum Float-Beendigung */
.clearfix {
    clear: both;
    display: block;
}

/* Flexbox-Styles */	 
.flex-container {
  display: flex; 
  max-width: 40em; 
  border: thin black solid;
}
.flex-item {
  border: 0em; 
  margin: 0em; 
  padding:.3em;
}
.wrap {
 flex-wrap: wrap;
}
.nowrap {
white-space: nowrap;
}
p.flex-item {
  font-weight: bold;	
  width: auto;
}
/* Hintergrundfarben */
.mh0 {
  background-color: #80ee99;
}
.mn {
  background-color: #f7c899;
}
.m1zu {
  background-color: #afd1d8;
}
.detailbox {
  background-color: #ffffdd; 
  padding:.3em;
}
/* Textoptionen */
.left {
  text-align: left;
}
.center {
  text-align: center;
}
.za1k5 {
line-height: 1.5em;
}
.za2 {
line-height: 2em;
}
/* Rand und Abstand */
.rand1 {
  border: thin solid black;
}  
.rand2 {
  border: medium solid black;
}
.minh {
  padding-top: 0px; 
  padding-bottom; 0px;
}   
.abstand1 {
  margin-top: 0.5em; 
}
.abstand11 {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}