

html, body {
      margin: 0;
      left: 0;
      height: 100%
}

.headerimage {
  width: 100%;
  height: 300px;
  max-height: 300px;
  background-color: #201E1A;
}

.headerimage-1 {
  background-image: url(../img/ic-header-startseite.jpg);
  background-position: 10% 0%;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.headerimage-2 {
  background-image: url(../img/ic-header-integrationscoaching.jpg);
  background-position: 10% 30%;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.headerimage-3 {
  background-image: url(../img/ic-header-taetigkeitsfelder.jpg);
  background-position: 10% 10%;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.headerimage-4 {
  background-image: url(../img/ic-header-ueber.jpg);
  background-position: 10% 0%;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.headerimage-5 {
  background-image: url(../img/ic-header-kompetenz.jpg);
  background-position: 10% 0%;
  background-repeat: no-repeat;
  background-size: 100% auto;
}

.headerimage-6 {
  background-image: url(../img/ic-header-kontakt.jpg);
  background-position: 10% 0%;
  background-repeat: no-repeat;
  background-size: 100% auto;
}


@media (max-width: 450px){
  .headerimage {
    max-height: 200px !important;
  }
  .headerimage-2 {
    background-size: 120% auto;
  }

  .headerimage-6 {
    background-size: 120% auto;
  }
}

@media (max-width: 768px){
  .headerimage {
    max-height: 260px;
  }
}

@media (min-width: 960px){
  .headerimage-5 {
    background-position: 10% 10%;
  }
  .headerimage-6 {
    background-position: 10% 20%;
  }
}

@media (min-width: 1280px){
  .headerimage-4 {
    background-position: 10% 10%;
  }
  .headerimage-5 {
    background-position: 10% 20%;
  }
}

@media (min-width: 1440px){
  .headerimage {
    min-height: 350px;
  }
}

@media (min-width: 1920px) {
  .headerimage {
    min-height: 450px !important;
  }

  .headerimage-1 {
    background-position: 10% 10%;
  }
}



/* ------- Logo  ------- */

.ic-logo > img {
    position: absolute;
    margin: auto;
    height: auto;
}

.ic-logo > img {
    top: 65px; left: 0; right:0;
    width: 300px;
}


@media (max-width: 450px) {
  .ic-logo > img {
    top: 65px; left: 0; right:0;
    width: 200px;
  }
}



@media (max-width: 768px) {
  .ic-logo > img {
    top: 60px; left: 0; right:0;
    width: 260px;
  }
}

@media only screen and (device-width: 768px) and (orientation:portrait) {
  /* For general iPad layouts */
  .ic-logo > img {
    top: 75px; left: 0; right:0;
    width: 300px;
  }
}


@media (min-width: 1440px) {
  .ic-logo > img {
    top: 95px; left: 0; right:0;
    width: 350px;
  }
}

@media (min-width: 1920px) {
  .ic-logo > img {
    top: 120px; left: 0; right:0;
    width: 450px !important;
  }
}





/* ------- End Logo  ------- */

/* ------- TYPO STYLES ------- */

p {
      font-family: 'Noto Serif', serif;
      font-weight: 400;
      color: #201E1A;
      font-size: 1.1em;
      line-height: 1.8em;
}

@media (min-width: 2000px) {
  p {
    font-size: 1.4em;
  }
}

.clearing {
  clear: both;
}

h1 { 
      font-family: 'Lato', sans-serif;
      font-weight: 300;
      font-size: 2.3em;
      text-align: center;
      color: #271914;
      text-transform: uppercase;
      margin-bottom: 25px;
}

h2 { 
      font-family: 'Lato', sans-serif;
      font-weight: 300;
      font-size: 1.6em;
      text-align: left;
      color: #271914;
      text-transform: uppercase;
      margin-bottom: 25px;
}

h3 { 
      font-family: 'Lato', sans-serif;
      font-weight: 700;
      font-size: 1.4em;
      text-align: left;
      color: #201E1A;
      text-transform: uppercase;
      margin-bottom: 25px;
}

.teaser-2-col-left > h2, .teaser-2-col-right > h2, .teaser-1-col > h2 {
  font-size: 1.5em;
  margin-bottom: 15px;
}

h4 { 
      font-family: 'Noto Serif', serif;
      font-weight: 600;
      font-size: 1.2em;
      text-align: left;
      color: #271914;
      text-transform: uppercase;
}

a, a:visited {
      color: #201E1A;
}

a > .btn {
  color: #BFD0D3;
}

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


ul {
  margin-top: 20px;
  margin-bottom: 25px;
}

li {
  list-style: square;
  font-family: 'Noto Serif', serif;
  font-weight: 300;
  color: #201E1A;
  font-size: 1.1em;
  line-height: 1.4em;
  margin-bottom: 7px;
}


ul .level {
  font-size: 1em !important;
  margin-top: 5px;
}

li ul li {
  font-size: 1em;
}

.no-padding {
  padding-left: 0;
  padding-right: 0;
}

.img-right {
  right: 0;
  float: right;
  margin-left: 20px;
  margin-bottom: 20px;
}

.img-portrait {
  width: 150px;
  margin-top: 7px;
}

.footer {
      font-family: 'Lato', sans-serif;
      font-weight: 300;
      color: #FFFFFF;
      font-size: 1.0 em;
      line-height: 1.7em;
}

.center {
      text-align: center;
}

.grey {
      background-color: #35312B;
}

.teal {
      background-color: #5d9eae;
}

p.light, h1.light, h2.light {
      color: #BFD0D3;
}

.language {
  color: #143F48;
  font-size: 0.9em;
  position: absolute;
  top: 25px;
  right: 25px;
}

.language a {
  color: #143F48;
}

/* ------- End of TYPO STYLES ------- */

/* ------- HEADER + FOOTER  ------- */


@media (min-width: 1024px) {
  .img-responsive {
    max-width: 100%;
  }

  .small-image {
    max-height: 400px;
    overflow: hidden;
  }
}

.ic-footer {
      padding: 25px 0;
      color: #23606d;
      text-align: center;
      font-size: 0.9em;
      
}

.ic-footer a:hover, .ic-footer a:visited {
  color: #23606d;
  text-decoration: underline !important;
}

/* ------- End of HEADER ------- */


/* ------- NAVIGATION ------- */

.navbar .navbar-nav {
  display: inline-block;
  float: none;
  vertical-align: top;
}

.navbar .navbar-collapse {
  text-align: center;
}


.navbar {
  position: relative;
  top: -45px;
  margin-bottom: 0;
  border: none;
  border-radius: 0;
  max-height: 0px;
  min-height: 0px !important;
  z-index: 998;
}

@media (max-width: 768px) {
  .navbar {
    top: 0px;
  }

  img{
    width: 200%;
    height: 200%;
  }
  }

.navbar-default {
    background: none;
    border-color: none;
    border: none;
}

.navbar-nav > li > a {
      padding-top: 10px;
      padding-bottom: 10px;
      font-family: 'Lato', sans-serif;
      font-weight: 400;
      font-size: 1.1em;
      text-align: center;
      text-transform: uppercase;
      color: rgba(255,255,255,1);
      text-decoration: none;
}

@media (max-width: 890px) {
  .navbar-nav > li > a {
    font-size: 1em;
  }
}

.nav > li > a {
    position: relative;
    display: block;
    padding: 15px 8px 5px 8px;
}

.navbar-default .navbar-nav > li > a:hover {
      color: #23606d;
} 


.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    color: #23606d;
    background-color: rgba(0,0,0,0);
}


.navbar-toggle {
    position: relative;
    float: right;
    padding: 14px 10px 12px 10px;
    margin-top: 0;
    margin-right: 15px;
    margin-bottom: 0px;
    background-color: transparent !important;
    background-image: none;
    border: none;
    border-radius: 0;
}

.navbar-toggle:hover {
    background-color: #1B4E5A !important;
}


.navbar-collapse {
    padding-right: 15px;
    padding-left: 15px;
    overflow-x: visible;
    -webkit-overflow-scrolling: touch;
    border-top: none;
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
    background-color: rgba(0,0,0,0.8);
}

.ic-navbar {
      position: absolute;
      width: 100%;
      max-height: 40px;
      background: none;
      z-index: 999;
      text-align: center;
      top: 260px;
}

.container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {
    margin-right: -15px;
    margin-left: -15px;
    background-color: rgba(0,0,0,0.8);
}

.ic-nav > li {
      float: left;
      display: block;
      position: relative;
}

.ic-nav > li {
      padding-right: 15px;
}

.ic-nav > li:last-child {
      padding-right: 0;
}

.ic-navigation, .ic-navigation:hover {
      font-family: 'Lato', sans-serif;
      font-weight: 300;
      font-size: 1em;
      text-align: center;
      text-transform: uppercase;
      color: rgba(255,255,255,1);
      text-decoration: none;
}


/* ------- End of NAVIGATION ------- */


/* ------- CONTENT STYLES ------- */

.ic-white {
  background-color: #FFFFFF;
  padding: 40px 0;
}

.ic-teal-1 {
      background-color: #82a6ae;
      padding: 40px 0;
}

.ic-teal-2 {
      background-color: #23606d;
      padding: 40px 0;
}

.ic-brown-1 {
      background-color: #2a211b;
      padding: 40px 0;
}

.btn-ic {
      background-color: rgba(35,35,35,1);
      border-radius: 0;
      border: 0;  
      font-family: 'Lato', sans-serif;
      font-weight: 300;
      font-size: 1em;
      text-align: center;
      text-transform: uppercase;
      padding: 10px 20px;
}

.btn:hover{
      color: #23606d;
}
.btn-ic:hover {
      background-color: rgba(35,35,35,0.8);
}

.teaser-2-col-left {
  position: relative;
  float: left;
  width: 45%;
  margin-right: 5%;
  padding: 15px 0 25px 0;
}

.teaser-2-col-right {
  float: right;
  padding: 15px 0 25px 0;
  width: 45%;
}

@media (max-width: 768px) {
  .teaser-2-col-left {
    width: 100%;
  }
  .teaser-2-col-right {
    width: 100%;
  }
}
.teaser-1-col {
  clear: both;
}


.container {
      margin-top: 25px;
      margin-bottom: 25px;
}


.alignright {
  position: relative;
  margin-right: 0;
}


.contact_box{
  width: auto;
  margin-top: 25px;
  padding: 15px 25px 5px 25px;
  background-color: #E0D8CD;
  
}

.contact_box > p {
  color: #2E2E2E;
}

.icon {
  color:#23606d; font-size:3.5em; text-align:right; position: relative; top: -10px; padding-left: 20px; float: right;
}

/* ------- End of CONTENT STYLES ------- */




/* Breakpoints */

@media (max-width: 768px) {
  .container {
    margin-top: 0px;
      margin-bottom: 0px;
  }
}

@media (max-width: 400px) {
            h1 {
                  font-size: 1.7em;
            }
      }

      @media (max-width: 320px) {
            h1 {
                  font-size: 1.5em;
            }
      }
