/* Haupt-Seitenformatierung - Orginal-Template
   created by http://freehtml5templates.com und
   nach eigenen Anforderungen modifiziert */



html, * {

  margin: 0; 
padding: 0;

}



/* Rednering der HTML5-Elemente als Block - wurde
   hier nicht verwendet */
/*
header, footer, section, aside, nav, article {

  display: block;

}


*/

body {
  line-height: 1.2;
  background: #3270C8;

  font-family: Arial, Helvetica, sans-serif;
  color: #666666;
  font-size: 13px;

  line-height: 17px;

}



/* Layout-Formatierung - eine dynamische Anpassung für die
   Größenangaben (je nach verwendetem Zugriff) wird später
   erstellt ... */



#wrapper {

  width: auto;

  margin: 0 auto;
  margin-bottom: 0px;
  margin-top: 0px;
  background-color: #FFFFFF;
  font-family: Arial, Helvetica, sans-serif;
  color: #666666;
  font-size: 13px;
  line-height: 17px;
}



nav {
  width: auto;
  height: 50px;
  margin: 0 auto;

  background: #AAAAAA;
}



header {
  width: auto;
  height: 200px;
  margin: 0 auto;

  background: #fff url(../pic/png/HPHead.png) repeat left top;

}



#main {

  width: auto;
  margin: 0 auto;
  background-color: #FFFFFF;

  overflow: hidden;

  font-size: 13px;
  line-height: 17px;
}






#content {

  float: left;
  width: auto;

  font-size: 13px;
  line-height: 17px;
}



footer {

  width: auto;

  margin: 0 auto;

  clear: both;

}



/* Eigenschaften von Standardelementen für alle
   Seiten festlegen ... */



h1, h2, h3, h4 {
  font-weight: bold;

  clear: both;

  color: #333333;

}

h5 {
  font-size: 8px;
  clear: both;

  color: #EEEEEE;

}


#main h5 {
  font-size: 8px;
  clear: both;

  color: #EEEEEE;

}


h6 {
  font-size: 1px;
  clear: both;

  color: #FFFFFF;

  margin: 0px 0px -16px 0px;
}


#main h6 {
  clear: both;

  color: #FFFFFF;

}




a:link, a:visited, a:active {

  color: #398CCE;
  text-decoration: none;

}



a:hover {

  color: #398CCE;
  text-decoration: underline;
}



p {

  margin-bottom: 18px;

}



li {

  padding-left: 0px;

}



/* Eigenschaften von Formularelementen für alle
   Seiten festlegen ... */

fieldset {
  background-color: #FFFFFF;
  border: 1px solid #BBBBBB;
}

form {
  background-color: #FFFFFF;
  font-family: Arial, Helvetica, sans-serif;
  color: #666666;
  font-size: 13px;
  line-height: 17px;
}


label {
  font-family: Arial, Helvetica, sans-serif;
  color: #666666;
  font-size: 13px;
  width: 200px;
  display: block;
  float: left;
}

select:focus, input:focus, textarea:focus {
  background-color: #FFFEEE;
}

/* Elemente für die Navigation auf der Seite - wobei
   ich hier nur den Tag-Namen verwendet habe ... */



nav .menu {

  font-size: 14px; 
font-weight: bold;

}



nav .menu ul {
  margin: 0;
  padding: 10px 0 0 20px;
  list-style: none;
  line-height: normal;
}

nav .menu li {
  display: block;
  float: left;
}

nav .menu a {
  display: block;
  width: 100px;
  border: 1px solid #FFFFFF;
  text-align: center;
  margin-right: 5px;
  padding: 5px 7px;
  text-decoration: none;

  color: #99EEFF;

}

nav .menu a:hover {

  display: block;
  width: 100px;
  color: #3250C8;
  border: 1px solid #FF0000;
  margin-right: 5px;
  padding: 5px 7px;
  text-decoration: none;

  background-color: #EEEEEE;

}



/* Die im Kopfbereich der Seiten verwendeten
   Navigationsbuttons ... */

#startmenue li {
  display: inline;
}

#startmenue a {
  display: inline-block;
  width: 100px;
  background-color: #EEEEEE;
  border: 1px solid #EEEEEE;
  text-align: center;
  margin-right: 5px;
  margin-top: 10px;
  padding: 5px 7px;
  color: #666666;
  font-size: 19px;
  text-decoration: none;
}

#startmenue a:hover {
  display: inline-block;
  width: 100px;
  background-color: #CCCCCC;
  border: 1px solid #EEEEEE;
  text-align: center;
  margin-right: 5px;
  padding: 5px 7px;
  color: #666666;
  text-decoration: none;
}



/* Eigenschaften des Kopfbereichs der Seite
   festlegen */

header h1 {
  margin: 0;
  padding: 0 0 0 25px;
  line-height: normal;
}

header h1 {
  float: left;
  padding-top: 20px; 
}

header h1 a:link, header h1 a:visited {
  text-decoration: none;
  color: #666666;
}



header h1 a:hover {

  text-decoration: underline;

}

header p {

  width: 500px;
  padding: 60px 0 0 30px;
  font-style: italic; 
font-size: 14px;
  color: #333333;
}



/* Eigenschaften der Article-Tags festlegen - inklusive
   Spalten- und Textbild-Formatierung */



article {

  padding: 10px 30px 5px 30px;

}



#contentbottom {

  background-color: #FFFFFF;

}



.article_columns {

  text-align: justify;
  -moz-column-count: 2;
  -moz-column-gap: 1.5em;
  -webkit-column-count: 2;
  -webkit-column-gap: 1.5em;
}


.article_columns p {

  padding-right: 10px;

}



article img {
  
border: none;

}



#content h1, h2, h3, h4, h5 {

  color: #333333; 
margin: 0 0 10px 0;

}





.alignleft, img.alignleft {

  display: inline;

  float: left;

  margin-right: 24px;

  margin-top: 4px;

}



.alignright, img.alignright {

  display: inline;

  float: right;

  margin-left: 24px;

  margin-top: 4px;

}



.aligncenter, img.aligncenter {

  clear: both;

  display: block;

  margin-left: auto;

  margin-right: auto;

}



img.alignleft, img.alignright, img.aligncenter {

  margin-bottom: 12px;

}



/* Formatierung der Bilder und Bildunterschriften
   für Aufrufe und Infos */



.benefits {
  background-color: #FFFFFF;
  display: inline-block;
  vertical-align: top;
  width: 415px;
  text-align: center;
  margin-left: 35px;
  padding: .2em;

}




.benefits .thumbnail {

  border: none;

  width: 415px;
}


.headerthumbs {
  border: none;
  width: 280px;
}

.textthumbs {
  border: none;
  width: 110px;
}



.benefits .caption {
  display: block;
  font-size: 16px;
  line-height: 33px;
}



.benefits p {

  text-align: justify;

  font-size: 13px;

}

/* Formatierung des Fußzeilenbereiches für
   die Seiten */



aside h3 {
  font-size: 18px;

}



aside ul {

  list-style: none;

  margin-bottom: 20px;

  margin-top: -15px;

}



aside li a {
  color: #AAAAAA;

  text-decoration: none;
}




aside li a:hover {

  text-decoration: none;

}



#footer-area {

  background: #AAAAAA;
  color: #666666;

  font-size: 90%;

  padding-top: 18px;
  padding-left: 20px;
  overflow: hidden;

}



.footer-segment {

  float: left;

  margin-right: 20px;

  margin-left: 20px;

  width: 190px;

}



footer aside h4 {

  color: #EEEEEE;

  font-size: 16px;

  line-height: 1.5em;

}


footer a:link, footer a:visited {

  color: #21529C;
  text-decoration: none;
}

footer a:hover {

  color: #21529C;
  text-decoration: underline;
}

footer p {
  margin-top: 15px;

  color: #666666;
}