/* ALLGEMEIN */
@font-face {
  font-family:  'Open Sans';
  src: url('../fonts/OpenSans-Regular.ttf');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family:  'Open Sans';
  src: url('../fonts/OpenSans-Light.ttf');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family:  'Open Sans';
  src: url('../fonts/OpenSans-SemiBold.ttf');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family:  'Open Sans';
  src: url('../fonts/OpenSans-Bold.ttf');
  font-weight: 700;
  font-style: normal;
}


body {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    //background: #ccccff;
    color: #555;
}

div {box-sizing: border-box;}
a:link {text-decoration: none; color: white;}

#wrapper {
    width:100%;
    margin: 0 auto;
}

.blueBG {background: #008694; color: #fff;}
.greyBG {background: #ccc; }
.whiteBG {background: #fff;}

/* HEADER */

div.header_top {height: 50px; background: #ffffff; width: 100%;}
.header_top a {background: #666666; color:#ccccff; text-decoration: none; padding:5px; float:right;}

header {
    width: 100%;
    background:#ffffff;
    height: 290px;
}

#logo h1 { text-indent: -999em; display: none;}
#logo img {
    width: 100%;
    height:auto;
    max-width: 600px;
}

nav#headerNav  {margin-top: 1em; float: right;}
nav#headerNav  ul {list-style:none; padding: 0; }
nav#headerNav  ul li { padding:0; margin: 0; display:inline-block; text-align: center;}
nav#headerNav  ul li a {color:#008694; font-size: 25px; font-weight: 600; text-decoration: none; display: block; padding: 110px 10px 0 10px; margin-right: 15px; border-radius: 4px;}
nav#headerNav  ul li a:hover { color: #fff; background-color: #008694;}
nav#headerNav  ul li a img {display: block; margin: 0 auto; margin-bottom: 20px;}
a#navKontakt, a#navPraxis, a#navTeam, a#navLeistungen { box-sizing: border-box; width: 110px;}
a#navKontakt { background: url(../img/nav_kontakt.png) no-repeat top center; }
a#navPraxis {background: url(../img/nav_praxis.png) no-repeat top center;}
a#navTeam {background: url(../img/nav_team.png) no-repeat top center;}
a#navLeistungen {background: url(../img/nav_leistungen.png) no-repeat top center;}
a#navKontakt:hover { background: url(../img/nav_kontaktwhite.png) no-repeat top center; }
a#navPraxis:hover {background: url(../img/nav_praxiswhite.png) no-repeat top center;}
a#navTeam:hover {background: url(../img/nav_teamwhite.png) no-repeat top center;}
a#navLeistungen:hover {background: url(../img/nav_leistungenwhite.png) no-repeat top center;}
span.navLink { padding: 0.4em;}
#navButton {display: none;}


/* CONTENT */
section#introPic {
    width:100%;
    height:auto;
    position: relative;
}

section#introPic img {
    width:100%;
    height:auto;
    display: block;
}

#overlayBig {width: auto; position: absolute; bottom:10%; left:5%}
#overlayBig h2 {margin: 0;  padding:1em;}
#overlayBig h2.h2top {background: #008694; color:#fff; }
#overlayBig h2.h2bottom {background: white; color: #008694;}
#overlaySmall {background: #fff; color: #008694; padding: 5px; width: 100%; position: absolute; bottom: 0; opacity: 0.8; text-align: center;}

#overlayUrlaub-wrapper {
  background-color: #008694;
  /*border-bottom: 80px solid #fff;*/
}

#overlayUrlaub {
  background-color: #008694;
  color: #fff;
  right: 0;
  left: 0;
  margin: 0 auto;
  bottom: 10%;
  padding: 10px 20px;
  line-height: 25px;
  max-width: 530px;
}

.text-doc {
  float: left;
  padding-right: 40px;
}

.text-doc-wrapper {
  overflow: hidden;
}

table#sprechzeiten {width:100%;}

section#team, section#leistungen, section#impressum {padding: 15px; padding-left: 23px;}

@media (max-width: 1200px){
div.section.group.jamedascript .span_1_of_2 {
    width: 98%;
}
}

/* Button Termin buchen */
.btn-termin-head {
  width: 200px;
  height: 40px;
  line-height: 40px;
  background-color: #008694;
  text-align: center;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  margin: 0 auto;
  font-size: 15px;
}

.btn-termin-head-wrapper {
  max-width: 1400px;
  position: relative;
  margin: 0 auto;
  height: 30px;
  display: none;
}

.btn-termin-head a {
  color: #fff;
  text-decoration: none;
  font-weight: 400;
}

.btn-termin-head a:hover {
  text-decoration: underline;
}

.datenschutz li li {
  list-style-type: circle;
  margin-bottom: 10px;
}

@media (max-width: 780px){
  .btn-termin-head {
    height: 30px;
    line-height: 30px;
  }

  .btn-termin-head-wrapper {
    display: block;
  }
}

.btn-termin {
  background-color: #ffffff;
  width: 220px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  margin: 0 auto;
  margin-top: 25px;
  margin-bottom: 25px;
  opacity: 0;
}

.btn-termin a {
  color: #008694;
  text-decoration: none;
  font-weight: 400;
}

.btn-termin a:hover {
  text-decoration: underline;
}

/* FOOTER */

footer ul {list-style: none;}
footer ul a { color: white;}


a#topLink {
    position: fixed;
    bottom: 0;
    right: 2%;
    width: 50px;
    height: 50px;
    background-color: #008694;
}

@media (min-width: 1400px){
    header {width: 1399px; margin: 0 auto;}
}