@charset "utf-8";

body {
	color: black;
	background-color: #DDDDDD;
	font-family: Arial,sans-serif;
  font-stretch: semi-expanded;
  margin: 0;
  }
#wrapperjob
{
max-width: 800px;
background-color: white;
padding: 0 4% 0 4%;
z-index:1;
width:92%;
margin: auto;/*damit sind die drei Spalten als Block mittig*/
}

#anzeigentext{
font-size: 14px;
line-height: 140%;
margin-top:0px;
width:90%;
}
#bluebox{
background-color:#005097; 
color:white; 
width:110%; 
padding:5px; 
font-size:18px;}

#anzeigenpunkt{
font-size: 14px;
font-weight:bold;
}

#keinefreieStelle{
border:1px solid grey;}
#keinefreieStelle h2{
margin:5% auto 5% auto;
width:60%;
font-size:20px;
line-height: 140%;
font-style:bold;}
#keinefreieStelle p{
font-size:20px;
line-height: 140%;
width:60%;
margin:5% auto 5% auto;}


embed{width:100%;
height:800px;}

ol{
font-size: 14px;
line-height: 140%;
margin-top:0px;
list-style-type:square;
}

p {font-size: 14px;
  line-height: 140%;
  color:black;
  margin-top:-5px;
  }
.eingerueckt{
margin-left:20%;} 

#direkt{
margin-left:-19px; 
text-transform: uppercase; 
letter-spacing: 2px; 
color:#666666;} 
 
.minus7 {
  margin-top:-7px;
  }
#wrapperStellen{
margin:auto;
width:70%}

#Feldgrau{
background-color:#DDDDDD;}

#Feldgrau, #Feldweiss{
padding: 0.01px;
-webkit-padding-before: 1px;
-webkit-padding-end: 1px;
-webkit-padding-after: 1px;
-webkit-padding-start: 1px;
}

h3, h5{
padding-left:10px;}

#header {
max-width: 1244px;
background-repeat:no-repeat;
background-position: left;
margin: auto;
}

#wrapper
{
max-width: 1244px;
z-index:1;
width:100%;
margin: auto;/*damit sind die drei Spalten als Block mittig*/
}

#wrappertop
{
max-width: 1244px;
margin: auto;/*damit sind die drei Spalten als Block mittig*/
z-index:1;
}

#logo
{
width: 28%;
padding-right: 2%;
z-index:1;
}



#button{
    position: absolute;
    right:0; 
    z-index: 100;   
    }
    
#facebookmobile{
display:none;}    
    
    
/* NEU */
/* ----------------------------------------------------------------------------- *
 *                      Beispiel Multi-Level-Menü im Basis-Layout                *
 * ----------------------------------------------------------------------------- */
/* Clearing von nav, nav.ul, .main mit .clearfix statt mit overflow:hidden;
 * sonst wird die zweite menüebene abgeschnitten! */
/*.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: block;
}

html[xmlns] .clearfix {
    display: block;
}*/


#navi{
list-style: none;
float: left;
margin-right: 2%; /*entscheidet über den Abstand zum Text 
in der zweiten Spalte*/
font-family: Arial,sans-serif;
font-size: 110%;
font-weight: bold;
width: 27.5%;  /*dadurch läuft der mittlere Kasten nicht über die Navigation*/
}
#navi ul{
margin:0;/*somit ist die Schrift ganz links*/
padding:0;/*somit ist die Schrift ganz links*/
background-color: #005097;/*6699cc;/*die ul fängt ganz links an, die "li" erst weiter innen!!! Deshalb ist das die Farbe für den Balken ul Menüebene 1 links
vor der Schrift*/
width: 100%;/* damit das Untermenü so breit ist wie das Hauptmenü*/
padding-left:2%;/*linke Spalte von Menü und Untermenü*/
/*margin-top:-1%; habe ich weggelassen, dann ist U2 direkt bündig oben 
mit U1   */
margin-bottom:2%;
}

li ul, li ul{
display: none;
font-size: 86%; 
}


#navi li{
list-style: none;
}
/*ul li a:visited{
background-color: #cccccc;
} */




#navi ul a:link, #navi ul a:visited{
display: block; /*zeigt den navi-Balken auf gesamter Spaltenbreite
1. Menüebene links*/
background-color: #005097;
color: white;/*Schriftfarbe für Menüebene 1*/
padding: 2.7% 0% 2.7% 2%; /*wichtige Werte!! nicht verändern!! 
1. Wert (2,7%) entscheidet über Abstand nach oben
3. Wert (2,7%) entscheidet über Abstand nach unten
4. Wert innerer Abstand nach links*/
}



#navi ul li {
    position: relative; /*dadurch werden alle Elemente untereinander angeordnet von li und ul*/
     
} 

 
#navi li:hover > ul{
display:block;  /*damit wird die Unterliste beim Drüberfahren weider sichtbar*/
/*box-shadow: 6px 6px 1px 2px rgba(20,20,20,50);/* li o u re (rot...)*/
margin-left: 100%;/* damit bleibt es nach rechts versetzt*/
top:0; /*dadurch ist die 2. Menüebene oben bündig mit der 1. Menüebene*/
/*hier kein position:relative, sonst ist unter Menüpunkt der ersten Ebene eine leere Fläche, so groß, wie Menüebene 2*/
position: absolute;
background-color:#005097;/*bezieht sich nur auf den linken Balken der
Unternavigation vor der ganzen ul*/
}


#navi ul > li > ul{
float:left;
position: absolute;} /*!!!!!!!!!!!!!!!!!!!!!!!!Neuestes!!!!!!!!!!!!!!!!!!!!!!!!!*/



#navi li:visited > ul{
display:block;  /*damit wird die Unterliste beim Drüberfahren weider sichtbar*/
box-shadow: 6px 6px 1px 2px rgba(20,20,20,50);/* li o u re (rot...)*/
width:90%;
position: relative;
} 

#navi li:active > ul >li{
display:block;  /*damit wird die Unterliste beim Drüberfahren weider sichtbar*/
/*box-shadow: 6px 6px 1px 2px rgba(20,20,20,50);/* li o u re (rot...)*/

position: relative;
}  

.menu, .backtotop {												
display:none;
}




/* Layout und Positionierung der 2. Menüebene */








#aufbau:hover{z-index:10;
            max-width:80%;
             position:absolute;
             background-position:bottom;
             }



/*einfach nur div:a hover und schon
             erscheint beim Drüberfahren des img das größere background-image.
             Problem ist aber, ich will verschiedene hover-Bilder?
             Lösung ist, das "div" näher zu definieren, mit #col1.
             Nächstes Problem ist, dass das hover-Bild nicht im Vordergrund,
             sondern im Hintergrund erscheint   ->  Lösung dafür hab ich nicht.
             Aber daraus erwuchs die Idee, das kleine Quadrat als Ausschnitt
             für das große Bild zu nehmen, das noch dem Drüberfahren nach dem
             hover-Befehl erscheint. Kleines Bild 227 px, großes Bild 800 pixel.
             Max-width: 800px*/

hr {color:#777777; 2px; }


.clearfix{overflow: hidden;}



#wrappertop linksbox, #wrappertop linksboxno
{
width: 28%;
float: left;
padding-right: 2%;
margin:0;
font-family: Arial,sans-serif;
font-stretch: semi-expanded;
}

#downsize
{margin-top:104px;}
#onsite
{margin-top:20px;
}
#down73
{margin-top:73px;}


#rechtsbox
{
width: 31%;
float: left;
font-stretch: semi-expanded;
}
#maincontent
{width: 70%;
float:left;
display: block;
}

#content
{width: 32%;
padding-right:2%;
float: left;
font-stretch: semi-expanded;
}
#content38
{width: 38%;
padding-right: 2%;
float: left;
font-stretch: semi-expanded;
}

#maincontent
{width: 70%;
float:left;
display: block;
}

#maincontentueberschrift
{width: 100%;
float:left;
display: block;
}

#mittig
{width: 46%;
padding-right: 3%;
float: left;
font-stretch: semi-expanded;
margin-top:-2%;
}
#mittig2
{width: 56%;
float: left;
font-stretch: semi-expanded;
margin-top:-2%;
}
#mittigPV
{width: 40%;
float: left;
font-stretch: semi-expanded;
margin-top:-2%;
}
#aussen
{width: 48%;
float: left;
font-stretch: semi-expanded;
margin-top:-2%;
}
#aussenPV
{width: 58%;
float: left;
font-stretch: semi-expanded;
margin-top:-3%;
padding-left:2%;
}

#wrapperbottom {
max-width: 1244px;
margin: auto;/*damit sind die Spalten als Block mittig*/
position: relative;
width: 100%;
clear:both;
bottom: 0px;
font-weight:normal;
font-family: Arial,sans-serif;
font-size: 80%;
line-height:140%;
font-stretch: semi-expanded;
}

#one{
width: 32%;
float: left;
padding-right: 1%;
font-stretch:normal;
}
#two{
width: 32%;
float: left;
padding-right: 1%;
font-weight:leighter;
}
#three{
width: 32%;
float: left;
padding-right: 1%;
font-weight:leighter;
}




ul a{color: #cccccc;
font-weight:normal;}
ul a:link {
	text-decoration: none;
  font-weight:normal;
	color: black;
}
ul a:visited 
{text-decoration: none; 
color: #cccc;
font-weight:normal; 
}
ul a:hover {
	text-decoration: none; 
	color: #005097;
  font-weight:bold;
}
ul a:active {text-decoration: none;
	text-decoration: none; color: #FFFFFF; 
  font-weight:normal;
}

.abstand {margin-top:-1%;}

#footer {
max-width: 1244px;
position: relative;
width: 100%;
clear:both;
bottom: 0px;
text-align:center;
word-spacing:2em;
margin: auto;
}


	

  
  
  
  
#soziales{margin-right:5%;}  
   
.Stil5 {color: black; font-size: 14px; line-height:1.4em; font-variant:normal;}
.Stil1, .freieStellen {color: #444444; font-size:30px; font-style:bold; }
.Stil8 {color: #005097;}
a:link {
	text-decoration: none;
	color: black;
	font-weight:bold;
  font-variant:normal; 
}
a:visited {text-decoration: none;
	text-decoration: bold; color: black; 
}
a:hover {
	text-decoration: none; 
	color: #005097;
	font-weight: bold;
}
a:active {text-decoration: none;
	text-decoration: none; color: black; 
}
img { border: 0; margin-top: 1.4%; }
a img {margin-top: 1.4%;}








<!--[if lte IE 8]>
input {margin-left:4%;}
<![endif]-->

</style>