@charset "UTF-8";
body {
	background: #333;
	margin: 15;
	padding: 0;
	color: #000;
	font-family: Calibri, sans-serif;
	font-size: 110%;
	line-height: 1.4;
}

/* ~~ Element-/Tag-Selektoren ~~ */
ul, ol, dl { /* Aufgrund von Abweichungen zwischen verschiedenen Browsern empfiehlt es sich, die Auffüllung und den Rand in Listen auf 0 einzustellen. Zu Konsistenzzwecken können Sie die gewünschten Werte entweder hier oder in den enthaltenen Listenelementen (LI, DT, DD) eingeben. Beachten Sie, dass die hier eingegebenen Werte hierarchisch auf die .nav-Liste angewendet werden, sofern Sie keinen spezifischeren Selektor festlegen. */
	padding: 3;
	margin: 0;
}

h1, h2, h3, h4, h5, h6, p {
    margin:0;
    padding:0 15px;
}
   
h1 {
   	font-family: Calibri, sans-serif;
	color: #063;
	margin:0;
    padding:0 15px;
}

a img { /* Dieser Selektor entfernt den standardmäßigen blauen Rahmen, der in einigen Browsern um ein Bild angezeigt wird, wenn es von einem Hyperlink umschlossen ist. */
	border: none;
	color: #bababa;
}

/* ~~ Die Reihenfolge der Stildefinitionen für die Hyperlinks der Site, einschließlich der Gruppe der Selektoren zum Erzeugen des Hover-Effekts, muss erhalten bleiben. ~~ */
 a, a:link, a:visited, a:active,
 td a, td a:link, td a:visited, td a:active {
  color: #006633;
  text-decoration: underline;
 }
 
 a:visited,
 td a:visited {
  color: #063;
  text-decoration: underline;
 }
 
 a:hover, a:focus,
 td a:hover, td a:focus {
  color: #faba00;
  text-decoration: underline;
 }

/* ~~ Dieser Container mit fester Breite umschließt die anderen div-Tags. ~~ */
.container {
	width: 1000px;
	background: #FFF;
	margin: 0 auto; /* Der mit der Breite gekoppelte automatische Wert an den Seiten zentriert das Layout. */
}

/* ~~ Für die Kopfzeile wird keine Breite angegeben. Sie erstreckt sich über die gesamte Breite des Layouts. Sie enthält einen Bild-Platzhalter, der durch Ihr eigenes, mit Hyperlink versehenes Logo ersetzt werden sollte. ~~ */
.header {
	width:1000px;
	background: #fff;
}

/* ~~ Dies sind die Layoutinformationen. ~~ 

1) Eine Auffüllung wird nur oben und/oder unten im div-Tag positioniert. Die Elemente innerhalb dieses div-Tags verfügen über eine seitliche Auffüllung. Dadurch müssen Sie keine Box-Modell-Berechnungen durchführen. Zu beachten: Wenn Sie dem div-Tag eine seitliche Auffüllung oder einen Rahmen hinzufügen, werden diese zu der festgelegten Breite addiert und ergeben die *gesamte* Breite. Sie können auch die Auffüllung für das Element im div-Tag entfernen und ein zweites div-Tag ohne Breite und mit der gewünschten Auffüllung im ersten div-Tag einfügen.*/

   .main_nav {
    position:relative;
    width:1000px;
    height:30px;
    margin:10px 0;
    padding:0;
    background:#fff;
   }
   
   #main_nav{
    width:1000px;
    height:30px;
    line-height:30px;
   }
   
   #main_nav, #main_nav ul {
    margin:0 0 0 1px;
    padding:0;
    list-style:none; 
   }
   
   #main_nav a {
    display:block;
    padding:0 8px;
    text-decoration:none;
    font-size:0.9em;
    color:#58585a;
    outline:none;
   }
   
   #main_nav li {
    float:left;
    margin:1px;
    text-align:center;
    background:#fff;
   }
   
   #main_nav li a:hover {
    color:#006633;
    background:#006633;
   }
   
.content {
	width:1000px;
	padding: 10px 0;
}

/* ~~ Fußzeile ~~ */
   .footer {
    clear:both;
    width:1000px;
    height:35px;
    line-height:35px;
    font-size:0.8em;
    color:#fff;
    background:#063;
   }
   
   .footer a, .footer a:link, .footer a:active, .footer a:visited {
    color:#ababab;
    text-decoration: none;
   }
   
   .footer a:hover {
    color:#FF8700;
   }

/* ~~ Verschiedene float/clear-Klassen ~~ */
.fltrt {  /* Mit dieser Klasse können Sie ein Element auf der Seite nach rechts fließen lassen. Das fließende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* Mit dieser Klasse können Sie ein Element auf der Seite nach links fließen lassen. Das fließende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* Diese Klasse kann in einem <br />-Tag oder leeren div-Tag als letztes Element nach dem letzten fließenden div-Tag (im #container) platziert werden, wenn #footer entfernt oder aus dem #container herausgenommen wird. */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}
.h1 {
	font-size: 12px;
}
.container .content h1 {
	font-size: 30px;
}

.kontakt {
  position:relative;
  float:left;
  width:1000px;
  height:220px; /* die Höhe entspricht der Höhe des Bildes + dem margin aus .kontakt_bild */
  margin:0 0 40px 0;
}
 
.kontakt_text, kontakt_bild {
  float:left;
  width:490px;
  margin:0;
  padding:0;
}
 
.kontakt_text2 {
  float:left;
  width:890px;
  margin:0;
  padding:0;
}

.kontakt_bild {
  float:right;
  margin:20px 0 0 0;
}
 
.impressum_2_impressum, .impressum_2_gestaltung {
  width:1000px;
}
  
   .BigBags {
    position:relative;
    float:left;
    width:1000px;
    height:311px;
    margin:0 0 40px 0;
    padding:0 30px 30px 30px;
   }
  
   .Bewerbung {
    position:relative;
    float:left;
    width:1000px;
    height:560px;
    margin:0 0 40px 0;
    padding:0 30px 30px 30px;
   }   

   .textebene {
    float:left;
    width:300px;
    height:291px;
    margin:0;
    padding:0px;
   }

   .textebene2 {
    float:right;
    width:560px;
    height:550px;
    margin-right:20px;
    padding:0px;
   }   

  .bildebene {
   float:right;
   width:606px;
   height:311px;
   margin:0;
   padding:0;
  }
 
  .bildebene2 {
   float:left;
   width:390px;
   height:550px;
   margin-left:0px;
   padding:0;
  }

 .main_nav {
  position:relative;
  float:left;
  width:1000px;
  margin:10px 0;
  padding:0;
  font: 78%/1.4 Calibri, sans-serif;
 }
 
 #main_nav{
  width:1000px;
  height:30px;
  line-height:30px;
 }

 #main_nav, #main_nav ul {
  margin:0;
  padding:0;
  list-style:none;
  z-index:10;
 }

 #main_nav a {
  display:block;
  padding:0 14px;
  text-decoration:none;
  font-size:1.0em;
  color:#58585a;
  outline:none;
 }
 
 #main_nav li {
  float:left;
  margin:1px;
  color:#58585a;
  background:#fff;
 }

 #main_nav li a:hover {
  text-decoration:none;
  font-size:1.0em;
  color:#fff;
  background:#006633;
 }

.cms-content {
	float:right;
	width:300px;
	margin:20px 20px 20px 0;
	padding:20;
	border-color: #063;
	border-style:solid;
	border-width:thin;
	padding:10px;
}
.highlight {
	font-size: 120%;
	font-style: italic;
	font-weight: bold;
	color: #C00;
}

#box-image {
display: block;
    margin-left: auto;
    margin-right: auto
}

.floatRight {
float:right;
margin:10px 10px 10px 10px;
width:300px;
height:580px;
padding-box:30px;
background:#fee7a5;
}

.floatLeft {
float:left;
margin:0 10px 0 10px;
width:650px;
}

.button {
      background-color: #006633;
      border: none;
	border-radius: 20px;
	display: inline-block;
      color: white;
      padding: 20px 32px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 20px;
	font-weight:bolder;
      margin: 8px 8px;
      cursor: pointer;
      }


.button2 {
      background-color: #006633;
      border: none;
	border-radius: 20px;
	display: inline-block;
      color: white;
      padding: 20px 32px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 20px;
	font-weight:bolder;
      margin: 8px 8px;
      }