body {
  background: #404040; 
  color:  #404040; 
  margin: 0;
  padding: 0; /* Abstand oben, d.h. wieviel Hintergrund oben erhalten bleibt */
  min-width: 640px; /* Bei weniger als 640px Breite soll ein Scrollbalken erscheinen. */
  font-size: 100.01%; /* umgeht den Font-Size-Bug im Safari, älteren Operas und IE */
  font-family: "Microsoft Sans Serif", "Trebuchet MS", Arial, arial, sans-serif ;
  /*font-weight:bolder;*/
  letter-spacing:1px;
  text-align: center; /*Zentrierung wegen IE */
}


/* Allgemeine Link-Eigenschaften */
a { text-decoration: underline; /*font-weight : bold;*/ color:#666666}
a:link {color: #666666} /*#F0E59E apricot*/
a:visited {	color:#666666}
a:active {color:#666666}
a:hover{color: #999999;}
/*a img {border: 3px solid #62ca20;}*/
a img {
border: 0 none;
}





.skip { /* Da ein wichtiger Screenreader das display: none; auch für sich versteht und nichts vorließt obwohl das hier sich vor allem an Blinde richtet, muss man es so lösen dass man diesen Link außerhalb des Sichtfeldes bringt. Somit wird er trotzdem vorgelesen. */
  position: absolute;
  margin-left: -999px;
  width: 990px;
}


h2, h3, h4 { font-weight: normal; }
h2 { 
  line-height: 0.8em;
  /* padding: 3.6em 0 1.2em 2%;  rutscht das ganze nach rechts */	
  padding: 3.6em 0 1.3em 0;	
  margin: 0;
  border-bottom: 1px solid #3A3C69;
  margin-bottom: 40px;
  color: #616387;
  font-size: 1.5em;
}

h3, h4, h5, h6
{font-size: 1.1em;
  color: #616387;
}






/* -- Layoutspezifisches -- */
#container { /* Ist dafür gedacht, dass die viele Formatierungen einfacher werden, und auch ein gemeinsamer Rand entstehen kann, der nicht ganz außen am Fenster ist. */

  text-align:left;  /*bezieht sich auf die Schrift generell, Inhalt usw */
  /*text-align: justify;*/
 /*border:1px solid #C0C0C0;*/
  font-size: 0.8em;
  /*font-size: 15px; */
  width: 750px; 
  margin: 0 auto; /* Zentrierung der Seite. */
  padding:0;
}



/* Logo */
#logo {
  background: url(../img/logo3.gif) 0 0 no-repeat white; 
  /*background: url(../img/bgheader5.gif) 0 0 no-repeat white; */
  /*height: 158px; */
  height: 158px;
  /*padding: 0 20px;*/
  /*padding-bottom:10px;*/
  text-align: right;
  line-height: 30px;
  overflow: hidden;  
  margin: 0; /* Manche Browser haben das schon voreingestellt aber nicht alle */

}


/*alternativ Farbe #808080*/
#bau {text-align: right; font-family:"Microsoft Sans Serif", "Trebuchet MS", Arial;font-size: 35px; color:#C0C0C0; font-weight:bolder;  padding-right:95px; padding-top:20px; }
#dipl {text-align: right; font-family:"Microsoft Sans Serif", "Trebuchet MS", Arial;;font-size: 15px; color:#C0C0C0; font-weight:bolder;letter-spacing:1px; line-height: 1px;  padding-right:96px; }

#bauprojekte
{
background: #C0C0C0;
font-family: "Microsoft Sans Serif", "Trebuchet MS", Arial;
/*font-size: 0.8em;*/
/*letter-spacing:1px;*/
font-size: 10px;
width: 110px;
/*border-left: 1px solid #3A3C69;*/
/*border-right: 1px solid #3A3C69;*/
padding: 40px 10px 10px 10px; /* Text zum Rahmen*/
margin: 0px 0 0 16px;
text align: justify;
}

#bauprojekte a {
  color:  #444444; 
  text-decoration: none;
}
#bauprojekte a:link, bauprojekte a:visited {
  color: #e6e6e6;
  text-decoration: none;
}

/*Rollovereffekt*/
#bauprojekte a:hover {
  color: #E6E6E6;
text-decoration: none;
}



/*Rollovereffekt*/
#bauprojekte a:hover {
  color: #E6E6E6;
text-decoration: none;
}





#containerbauprojekte
{
background: #e6e6e6;
}

#bauprojekte tr
{background: #C0C0C0;}

#block 
{
text-align: left;
position:relative;
      left: -40px;


}
#block li
{
list-style-type: none;

}
#block li a
{
color:  #616387; /* Hier ist das mit der Linkfarbe genau so, sie soll ... sein. */
  text-decoration: none;
}

#listeProjekte
{
text-align: left;
}
#listeProjekte li
{
/*list-style-type: none;*/
}
#listeProjekte li a
{
  color:  #616387; /* Hier ist das mit der Linkfarbe genau so, sie soll ... sein. */
  text-decoration: none;
}


/* - Menü - */
 

#menu ul { 
  /*background: #616387; */ 
  background: #808080; 
  padding: 5px 1%;
  text-align: right; 
  margin: 0; 
  color: #FFFFFF; 
  font-family:"Microsoft Sans Serif", "Trebuchet MS", Arial;
  font-size: 0.8em;
  letter-spacing:1px;
  /*border-bottom: 3 px solid red;*/
}

#menu li {
  display: inline; /* Damit die Menüpunkte nebeneinander und nicht untereinander erscheinen. */
  list-style-type: none; /* Die Bullets vor den Menüpunkten schalten wir ab. */
  border-left: 1px solid #C0C0C0; /* Ein optischer Trennungsstrich */
  padding: 0 10px 0 15px;
  font-weight: bold;
}
/* Die Menüpunkte haben zunächst die Farbe grau gleich wird der aktuelle Menüpunkt weiß gesetzt*/
#menu li a {
  color:  #C0C0C0; 
  text-decoration: none;
}
#menu li a:link, menu li a:visited {
  color:  #EEEEEE; 
  text-decoration: none;
}

/*Rollovereffekt*/
#menu li a:hover {
  /*background-color:  #369; */
  color:#E6E6E6;
text-decoration: none;
}





/* Der Menüpunkt der aktuellen Seite hat die Farbe weiß*/
#index  #menu #unternehmung a, 
#bodykontakt #menu #kontakt a, 
#bodyjobs #menu #jobs a, 
#bodyprojekte #containerbauprojekte #bauprojekte a, 
#bodyleistungen #menu #leistungen a, 
#bodyimpressum #menu #impressum a,
#bodylinks #menu #links a
{  color:  #FFFFFF; 
  text-decoration: none;}



#images {

  width: 50%; /* Je kleiner das Fenster desto kleiner soll auch die Breite der images werden, damit immer genügend Platz für den richtigen Inhalt bleibt. */
  min-width: 10em; /* Damit uns die images nicht zu sehr zusammengeschoben wird. */
  float: right; /* Damit erreichen wir dass der Inhalt links neben den images vorbeifließt und nicht erst unten drunter anfängt. */
  padding: 70px 1% 1em 1%;
  margin: 1em 1% 0 1%;
  border-left: 1px dotted #aaa; /* Hiermit trennen wir optisch die images vom eigentlichen Inhalt ab. */
  font-size: 0.9em; /* Die Schriftgröße setzen wir hier ein wenig herunter damit erkennbar wird dass das Informationen zweiter Rangordnung sind. */
}

.bild{
border-width: 4px; border-style: solid; border-color: silver;
}



/* - Der Hauptinhaltsteil - */
#main {
 /*background: #fff;*/
font-size: 0.9em;

background: url(../img/kran10.gif) left top no-repeat #E6E6E6;
width: 70%; /*je kleiner das Fenster desto kleiner solls werden*/
padding: 10px 3px 10px 16px;
margin: 0px 0px 0px 0px;
min-width: 10em;
float: right;
/*border-right:1px dotted #C0C0C0;*/
/*border-left:1px dotted #C0C0C0;*/
}

#main p
{
padding-right: 85px;
}

#editor      { white-space:pre; }
#footer {
  clear: both; 
  padding: 3px 20px;
  background:#616387;
  color: #C0C0C0;
  font-weight : bold;
  font-size: 0.8em;
 line-height: 1.5em;
}
#footer a {
  color:  #404040; 
  text-decoration: none;
}
#zurueck {  float: right;  background:#616387;	}
#copy{  text-align: left;  background:#616387;}


#footer2{
  clear: both; 
background: #616387;  
}



DIV.shadow {
  float: left;
   background-color: #bbb;
   /*background-color: #666;*/
   padding: 0;
   margin: 1.7em 1em;
   }

DIV.shadow IMG {
   display:block;
   /*border: 1px solid #666;*/
   border: 1px solid #bbb;
   position: relative;
   top: -3px;
   left: -3px;
   }


