ul, li , body, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{
  margin: 0;
  padding: 0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

body {
  background: #ededed;
  margin: 0 auto 15px auto;
  font-family: "solid Edge ISO", Arial, sans-serif;
  font-size: 16px;
  position: relative;
  width: 960px;
}

#pagewrapper {
  width: 960px;
  margin: 0 auto;

}

#mainnav {
  background: #ededed;
  width: 960px;
  height: 60px;
  position: fixed;
  padding-top: 21px;
  z-index: 100;
}

#mainnav a {
  color: #f29838;
  font-size: 19px;
  text-decoration: none;
}

#mainnav a:hover,
#mainnav a:active,
#mainnav a.active {
  color: #2e3353;
}

.contentwrapper {
  background: #2e3353;
  border-radius: 9px;
  color: #ffffff;
  margin: 0 150px 1200px 0;
  min-height: 600px;
  position: relative;
  top: 81px;
  z-index: 10;
  width: 844px;
}

.middlecontent {
  margin: 0 auto 1200px auto;
  width: 480px;
  color: #2e3353;
}

.middlecontent a {
  color: #2e3353;
}

#x {
  float: right;
  right: -36px;
  top: 69px;
  position: absolute;
}

#company {
  float: right;
  margin: 31px 0 0;  
  background: #2e3353;
  padding: 9px;
  border-radius: 9px;
}

#company a span {
  font-size: 16px;
  font-style: normal;
}
#company a .white {

  letter-spacing: 2px;
}

#philosophie {
  height: 1150px;
}

#philosophie p {
  height: 280px;
}

#team {
  height: 900px;
}

#referenzen {
  width: 800px;
}

.white {
  color: #ffffff;
}

.orange {
  color: #f29838;
}

.content {
  padding: 15px;
}

h1 {
  color: #ffffff;
  font-size: 32px;
}

h2, h3 {
  color: #f29838;
}

a {
  text-decoration: none;
  color: #ffffff;
  font-style: italic;
}

a:hover {
  text-decoration: underline;
  color: #f29838;
}

a.emphasize {
  background: #2e3353;
}

a.emphasize:hover {
  background: #ffffff;
}

nav ul li {
  float: left;
  padding-right: 21px;
  margin: 0;
}

nav ul {
  list-style: none;
  padding: 30px 0 0 15px;
  margin: 0;
}


.kasten {
  width: 238px;
  text-align: left;
  float: left;
  padding-right: 2%;
  padding-left: 2%;
  border-left: 1px solid #ffffff;
  min-height: 500px;
  height: 90%;
}

.kasten2 {
  width: 476px;
  text-align: left;
  float: left;
  padding-right: 2%;
  padding-left: 6%;
  border-left: 1px solid #ffffff;
  min-height: 500px;
  height: 90%;
}

.kasten.first {
  border: none;
}

.dreierkasten {
  background: #2e3353;
  clear: both;
}

#angebote {
  position: relative;
  padding-bottom: 30px;
  height: 420px;
}
#front ul,
#angebote ul {
  list-style-image: url('img/x-small.png');
  list-style-position: outside;
  width: 630px;
  float: left;
  margin: 0 30px 30px 24px;
}

#front ul {
  margin-top: 30px;
}

#angebote:hover #erklaerungen {
  display: none;
}

#angebote h2, #angebote h3 {
  margin-top: 0;
  
}

.angebot {

  padding-bottom: 9px;
}
.angebot:hover {

}
.angebot:hover .erklaerung {
  display: block;
}

#front:hover .erklaerung {
  display: block;
  width: 350px;
}

.erklaerung {
  display: none;
  width: 430px;
  height: 415px;
  position: absolute;
  left: 370px;
  top: 0;
  text-align: left;
      transition: all .9s linear;
}
#erklaerungen {
  width: 430px;
  height: 415px;
  position: absolute;
  left: 370px;
  top: 0;
  text-align: left;
  display: block;
}

#teaser {
  float: left;
  width: 570px;
}



#front {
  float: right;
  width: 225px;
}

.img-border {
  border: 2px solid #ffffff;
}
.imgkasten {
  width: 99%;
}

.leistungen {
  display: block;
  position: absolute;
  bottom: 0;
  width: 430px;
  height: 200px;
}
.textblock {
  padding-left: 30px;
  width: 390px;
}

.kasten ul,
#referenzen ul {
  margin-left: 15px;
  text-align: left;
}