* { margin: 0; padding: 0 }

html, body { width: 100%; height: 100%; font-size: 16px; line-height: 22px; font-family: 'PT Sans'; color: #333333; background-color: #001A28 }

@font-face {
font-family: Oswald;
src: url(/v1/style/font/oswald-v49-latin-regular.eot);
src: url(/v1/style/font/oswald-v49-latin-regular.svg);
src: url(/v1/style/font/oswald-v49-latin-regular.ttf);
src: url(/v1/style/font/oswald-v49-latin-regular.woff);
src: url(/v1/style/font/oswald-v49-latin-regular.woff2);
}

@font-face {
font-family: PT Sans;
src: url(/v1/style/font/pt-sans-v17-latin-regular.eot);
src: url(/v1/style/font/pt-sans-v17-latin-regular.svg);
src: url(/v1/style/font/pt-sans-v17-latin-regular.ttf);
src: url(/v1/style/font/pt-sans-v17-latin-regular.woff);
src: url(/v1/style/font/pt-sans-v17-latin-regular.woff2);
}

h1, h2 { font-family: Oswald }
h1 { font-size: 2em; line-height: 1.5em; color: #000000; margin-bottom: .5em }
h2 { font-size: 1.2em; font-weight: normal }

a { text-decoration: underline; color: #00555A; outline: none }
a img { border: none }

ul { margin-left: 1em; margin-bottom: 1.2em }
ul.nospace { margin-top: -1.2em }
ul li { list-style-image: url( '../img/bulletpoint.png' ) }
ul.white li { list-style-image: url( '../img/bulletpointw.png' ); color: #FFFFFF }
ul.padding li { padding-bottom: .5em }

.fontwhite { color: #FFFFFF !important }
.fontdarkblue { color: #001A28 !important }

p { padding-bottom: 1.2em }
p:last-child { padding-bottom: 0 }

img { vertical-align: top }

.textcenter { text-align: center }

.wrapper { min-width: 1100px; width: 100% }
.wrapper > .inner { position: relative; z-index: 2 }
.wrapper > .inner > .content { width: 1100px; margin: 0 auto }
.wrapper.darkblue,
.wrapper > .inner.darkblue { background-color: #001A28; color: #FFFFFF }
.wrapper > .inner.none { color: #001A28 }

.box { width: 100%; padding: 1em 0 }
.box > .column { vertical-align: top; display: inline-block; margin-left: -4px; padding: 0 1em; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box }
.box > .column.one { width: 100% }
.box > .column.two { width: 50% }
.box > .column.three { width: 40% }

a.logo { position: absolute; display: inline-block; width: 130px; right: 0; top: 20px; background-color: #FFFFFF; padding: 0 1em .5em; -webkit-box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.75); -moz-box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.75); box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.75) }
a.logo img { width: 100% }

nav, section { display: block }
nav#menuLevelOne { background-color: #FFFFFF; position: fixed; top: 0; left: 0; right: 0; z-index: 9999; -webkit-box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.75); -moz-box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.75); box-shadow: 0px 10px 10px -6px rgba(0,0,0,0.75) }
nav#menuLevelOne > .inner { position: relative; width: 1100px;margin: 0 auto }
nav#menuLevelOne ul { padding: 2em 0 0; margin: 0 }
nav#menuLevelOne ul li { display: inline-block; list-style: none }
nav#menuLevelOne ul li a { display: block; color: #666666; border-bottom: 5px solid #FFFFFF; text-decoration: none; font: .85em/1em Oswald; text-transform: uppercase; padding: 0 .4em 1.2em; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box }
nav#menuLevelOne ul li a.current { color: #001A28; border-bottom: 5px solid #001A28 }
nav#menuLevelOne ul li a:hover { color: #333333; border-bottom: 5px solid #666666 }

section { position: relative; overflow: hidden; width: 100%; min-height: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-top: 5% }
section#impressum, section#privacy { min-height: auto; padding: 0 }
section > .sectionimage { position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; z-index: 1 }
section > .sectionimage > img { height: auto; width: 100%; min-height: 100% }

section#home > .sectionimage > img { width: 120%; min-height: inherit }
section#home > .inner { position: absolute; bottom: 0; width: 100%; padding-bottom: 5.2em }
#contactData { z-index: 3; padding: .8em 0; font-size: .8em; background-color: #111111; display: block; text-align: center; color: #FFFFFF; position: absolute; bottom: 0; left: 0; right: 0; widthh: 100% }
#contactData > #dateCounter { font-size: .7em }

section#transaktionsmanagement .inner { position: absolute; bottom: 8%; text-align: center; width: 100% }
section#transaktionsmanagement .inner .box { margin: 0 auto; width: 28%; padding: 0 }
section#transaktionsmanagement .inner .box .column { padding: 0; margin-left: -1.8em }
section#transaktionsmanagement .inner .box .column h1 { padding-bottom: 15%; margin-left: -.4em }

section#projektmanagement { padding-top: 16% }

section#projektentwicklung .column { background-color: #96B2C7 }

.footer { padding: 1em 0; background-color: #111111; color: #FFFFFF }

@media only screen and ( max-width: 1100px ) {
  h1 { font-size: 1.5em }
  
  .wrapper,
  .wrapper > .inner > .content { width: 100%; min-width: 100% }

  .box > .column { width: 100% !important; margin: 0 !important; background-color: transparent !important }
  
  nav#menuLevelOne { position: relative }
  nav#menuLevelOne > .inner { width: 100%; margin: 0 }
  nav#menuLevelOne ul { width: 60% }
  nav#menuLevelOne ul li a { border-bottom: none }
  nav#menuLevelOne ul li a.current { border-bottom: none }
  nav#menuLevelOne ul li a:hover { border-bottom: none }

  a.logo { bottom: 0; top: 0 }
  a.logo img { position: relative; margin-top: -25px; top: 50% }
  
  section { padding-top: 0; min-height: auto }
  section > .sectionimage { position: relative; top: 0 !important }
  section > .sectionimage > img { min-height: 100%; min-width: auto; max-width: 100% }

  section#home > .sectionimage > img { max-width: 100%; min-height: inherit }
  section#home > .inner { position: relative; padding-bottom: 0 }
  #contactData { position: relative }

  section#referenzen h1 { color: #001A28 !important }
  section#referenzen ul.white li { list-style-image: url( '../img/bulletpoint.png' ); color: #001A28 }
  
  section#transaktionsmanagement .inner { position: relative; bottom: 0; text-align: left }
  section#transaktionsmanagement .inner .box { margin: 0; width: 100%; padding: 1em 0 }
  section#transaktionsmanagement .inner .box .column { padding: 0 1em; margin-left: 0 }
  section#transaktionsmanagement .inner .box .column h1 { padding-bottom: 0; margin-left: 0 }
  
  section#projektmanagement { padding-top: 0; color: #001A28 !important }
  section#projektmanagement h1,
  section#projektmanagement p { color: #001A28 !important }
  
  section#projektentwicklung h1,
  section#projektentwicklung p { color: #001A28 !important }
}

@media only screen and ( max-height: 850px ) {
  section#home { padding-top: 0; min-height: auto }
  section#home > .sectionimage { position: relative; top: 0 !important }
  section#home > .sectionimage > img { max-width: 100%; padding-top: 0; min-height: auto }
  section#home > .inner { position: relative; padding-bottom: 0 }
  #contactData { position: relative }

  section > .sectionimage { top: 0 !important }
  section > .sectionimage > img { min-height: 100%; min-width: auto; max-width: 100% }
}

@media only screen and ( max-width: 500px ) {
  nav#menuLevelOne ul li { display: block }
  a.logo { width: 70px }
}