@charset "UTF-8";
/* CSS Document */

@font-face {
  font-family: "LaPaloma-Regular";
src: url("/fonts/Lapaloma/LaPaloma-Regular.ttf"),url("/fonts/Lapaloma/lapaloma-regular-webfont.eot"),url("/fonts/Lapaloma/lapaloma-regular-webfont.woff"),url("/fonts/Lapaloma/lapaloma-regular-webfont.woff2"), url("/fonts/Lapaloma/LaPaloma-Regular.otf");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Marvel-Regular";
src: url("/fonts/Marvel-Regular.ttf"),
	url("/fonts/Marvel-Regular.eot"),url("/fonts/Marvel-Regular.svg"),url("/fonts/Marvel-Regular.woff"),url("/fonts/Marvel-Regular.woff2"),url("/fonts/Marvel-Regular.otf");
  font-weight: normal;
  font-style: normal;
}




html, body {
  /*html and body take up full screen*/
  padding: 0;
  margin: 0;
  width: 100%;
	font-size: 100%;
	 font-family: 'Marvel-Regular';
  /*Fixes menu bar overflow issue*/
  overflow-x: hidden;
}


#main {
padding: 0;
}

h1 {
  font-size: 6rem;
   font-family: 'Marvel-Regular';
  color:  #d6c61b;
  text-decoration: none;
  margin: 0;
  text-align: center;
}


/*Styling for the h2 heading*/
h2 {
  font-size: 20px;
   font-family: 'Marvel-Regular';
  color:  #d6c61b;
  text-decoration: none;
  margin: 0;
  text-align: center;
}

/* Styling affecting all links*/
a {
      font-size: 2vw;
  text-decoration: none;
  color: inherit;
}


li{
	    padding-right: 5%;
}



.container{padding-left: 0px; padding-right: 0px;}

/* Navigation */


.navbar{
	    padding: 0 0;
}

.navbar-nav{
	margin-left: auto;
	margin-right: auto;
	width: 80%;
	    padding-left: 2%;
}

.nav {
padding-top: 1%;
  color: #000;
	text-transform: uppercase;
 font-family: 'Marvel-Regular';
  height: auto;
  background-color: #fff;
  padding-bottom: 1%;
  z-index: 1000;
  width: 100%;
	max-width: 100%;
}

	.mobil{
		width: 80%;
		display: none;
	}

.sticky {
  position: fixed;
	top: 0px;
	padding-left: 0px;
  width: 100%;
  height: auto;
}


.icons {
    margin-bottom: 1%;
	padding-left: 7%;}


.iconItem2{
background-image: url(/images/phone-solid.svg);
    background-position: center;
	background-color: #000;
  background-size: 24px;
    background-repeat: no-repeat;
    border: 1px solid;
    border-radius: 100px;
   width: 40px;
    height: 40px;
    padding: 10px;
    margin-right: 40px;
    margin-top: 9%;
	
	transform: scaleX(-1);
}
.iconItem1{
background-image: url(/images/envelope-regular.svg);
    background-position: center;
	background-color: #000;
    background-size: 24px;
    background-repeat: no-repeat;
    border: 1px solid;
    border-radius: 100px;
    width: 40px;
    height: 40px;
    padding: 10px;
    margin-right: 40px;
    margin-top: 9%;
}


.navItem {
  margin: 0;
  width:auto;
  height: auto;
font-size: 2vw;
  display: inline-block;
  box-sizing: border-box;
  -webkit-transition: font-size 0.4s, border-top 0.4s, background-color 0.4s, width 0.4s, height 0.4s, border-bottom 0.4s;
  transition: font-size 0.4s, border-top 0.4s, background-color 0.4s, width 0.4s, height 0.4s, border-bottom 0.4s;
}


.nav-link:hover {
  width:auto;
  height: auto;
  border-top: white 4px solid;
  cursor: pointer;
}





/* Main*/


.head{
	height: auto;
	width: auto;
	background-color: #fff;
		    padding-top: 1%;
    padding-bottom: 1%;
}


.brandTag {
     left: 30%;
	top: 10%;
    padding-bottom: 5%;
    position: relative;
    color: #d5aa8b;
    font-size: 2vw;
	text-align: left;
}

.brand {

  left: 0px;
	top: 15%;
	  font-size: 4.5vw;
   padding-bottom: 5%;
    padding-top: 1%;
    position: relative;
	text-align: center;
 font-family: 'LaPaloma-Regular';
  color: #d5aa8b;
}


.header {
  background: url("/images/Headerbild.png");
	background-position: 0px -100px;
	background-size: cover;
	background-repeat: no-repeat;
  width: 100%;
  height: 1050px;
  position: relative;
  text-align: center;
  color: white;
 font-family: 'Marvel-Regular';
}


.claim {
    width: 45%;
    height: auto;
position: absolute;
	top: 35%;
	left: 6%;
    font-family: 'LaPaloma-Regular';
	  color: #000;
}


.claim h3{    
	font-size: 3vw;
    line-height: 6vw;
	  text-align: center;
}

.begin {
	margin-bottom: 12%;
    padding-top: 5%;
    height: 650px;
}

.begin h4{
	font-size: 3vw;
	  color: #d5aa8b;
	float: left;
	width: 51%;
	vertical-align: middle;
	
}

.begin .baby{
	float: right;
	width: 45%;
}



.vita{
	background-color: rgba(234, 239, 242, 0.5);
	position: relative;
		display: flex;
	    padding-bottom: 10%;
}



.vita h2 {
	font-size: 5vw;
    font-family: 'LaPaloma-Regular';
	color: #000;
	text-align: left;
}


.imp{
	background-color: rgba(234, 239, 242, 0.5);
	position: relative;
		display: flex;
	    padding-bottom: 10%;
	padding-left: 20px;
	padding-right: 20px;
	height: auto;
}



.imp h2 {
	font-size: 4vw;
    font-family: 'LaPaloma-Regular';
	color: #000;
	text-align: left;
	margin-top: 10%;
}


.colText{
	padding-top: 5%;
	font-size: 2vw;
}

ul {
	list-style: none;
	padding-left: 0px;
}

li {
	    padding-right: 5%;
    padding-bottom: 2%;
}


.imgvita{
	background-image: url("/images/Weiterbildung.png");
		background-size: cover;
	background-repeat: no-repeat;
  width: 100%;
	    height: 70%;
    margin-top: 20%;
}


.together{
		background-image: url("/images/Geburten_insgesamt.png");
		background-size: contain;
	background-repeat: no-repeat;
    height: 45%;
    position: relative;
    bottom: 30%;
    left: 35%;
}

.boy{
		background-image: url("/images/Geburten_Jungs.png");
		background-size: contain;
	background-repeat: no-repeat;
    height: 55%;
	position: relative;
    top: 30%;
    left: 30%;

}

.girl{
		background-image: url("/images/Geburten_girls.png");
		background-size: contain;
	background-repeat: no-repeat;
    height: 55%;
position: relative;
top: 5%;
    left: 0%;
}

.row{
	display: flex;
}

.leistungen {
	position: relative;
	display: flex;
	padding-bottom: 10%;
}
.leistungen h2 {
	font-size: 5vw;
	font-family: 'LaPaloma-Regular';
	color: #000;
	text-align: left;
	padding-bottom: 5%;
}

.weiterb{
	padding-bottom: 10%;
}

.weiterb h5{
		font-size: 2.5vw;
	font-weight: bold;
    line-height: 6vw;
	
}

.schwan{
		margin-bottom: 5%;
    padding-top: 5%;
    height: 100%;
	
}

.imglinks{
	float: left;
	width: 45%;
}

.schwan p{
		float: right;
		font-size: 2vw;
	width: 50%;
}




.geburt{
		position: relative;
		display: flex;
	    padding-bottom: 10%;
}


.geburt h2 {
	font-size: 5vw;
    font-family: 'LaPaloma-Regular';
	color: #000;
	text-align: left;
}

.geburt h5{
		font-size: 2.5vw;
	font-weight: bold;
    line-height: 6vw;
	
}


.schwan .colText{
		float: left;
	width: 60%;
	    padding-top: 0px;
}

.Holder {
	float: right;
	width: 40%;
}

.Holder img{
	width: 100%;
}


.woche{
		background-color: rgba(234, 239, 242, 0.5);
	position: relative;
	    padding-bottom: 6%;
}



.woche h2 {
	font-size: 5vw;
    font-family: 'LaPaloma-Regular';
	color: #000;
	text-align: left;
}

.imgHolder {
	float: left;
}

.imgHolder img{
	width: 100%;
	margin-top: 5%;
}


.imgHold {
	    float: right;
    position: relative;
    bottom: 600px;
    left: 20%;
}

.imgHold img{
	width: 80%;
}


#empfehlungen{
	    height: 2150px;
    margin-bottom: 8%;
}

#empfehlungen h2 {
	font-size: 5vw;
    font-family: 'LaPaloma-Regular';
	color: #000;
	text-align: left;
}


#empfehlungen .container{
	    position: relative;
    bottom: 400px;
}




.kontakt{
	background-color: rgba(234, 239, 242, 0.5);
	position: relative;
		display: flex;
	    padding-bottom: 3%;
}

.kontakt h2 {
	font-size: 5vw;
    font-family: 'LaPaloma-Regular';
	color: #000;
	text-align: left;
}



/*Footer */

.footer{
	    width: 40%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
	    padding-top: 60px;
    padding-bottom: 60px;
}

.footer div{
	display: inline;
	padding: 40px;
	color: #bbbbbb;
}

.kontbild{width: 90%}

@media screen and (max-width:2000px){
	
	.header {
	background-position: 0px -80px;
	height: 850px;}	
	
	
#empfehlungen {
	height: 1950px;}	
	
.begin {
	margin-bottom: 0%;
	height: 650px;}	
	
.imgHold {
    float: right;
    position: relative;
    bottom: 500px;
	left: 20%;}
}


@media screen and (max-width:1600px){
	
	
	#empfehlungen {
	height: 1650px;}
	
.header {
	background-position: 0px -80px;
	height: 850px;}	
	
.begin {
		margin-bottom: 0%;
	height: 550px;}	
	
.imgHold {
    float: right;
    position: relative;
    bottom: 400px;
	left: 25%;}
	
	
.footer{
	width: 50%;}	
}



@media screen and (max-width:1200px){
	
	
.header {
	background-position: 0px -60px;
	height: 650px;}	
	
.begin {
		margin-bottom: 0%;
	height: 450px;}	
	
.imgHold {
    float: right;
    position: relative;
     bottom: 300px;
    left: 30%;}
	
	
		#empfehlungen {
	height: 1250px;}
	
	#empfehlungen .container {
    bottom: 300px;
}
	
.footer{
	width: 50%;}	
}



@media screen and (max-width:992px){

	
.header {
	background-position: 0px -50px;
	height: 550px;}	
	
.begin {
		margin-bottom: 0%;
	height: 400px;}	
	
.imgHold {
    float: right;
    position: relative;
     bottom: 250px;
    left: 30%;}
	
	
		#empfehlungen {
	height: 1050px;}
	
	#empfehlungen .container {
    bottom: 250px;
}
	
.footer{
	width: 60%;}	
}



@media screen and (max-width:991px){
	
		 .nav    {background-color: transparent;
			 padding-top: 2%;  }
	
	.icons{
		    position: relative;
    left: 83%;
		    padding-left: 0%;
	}
	

	.iconItem1{

    background-size: 30px;
    width: 60px;
    height: 60px;
}

	
	.iconItem2{

    background-size: 30px;
    width: 60px;
    height: 60px;
}
	
.row{
	display: flex;
	flex-wrap: wrap-reverse;
}	
	
.colText {
    font-size: 3vw;
}	
	

.weiterb h5 {
    font-size: 3vw;
    font-weight: bold;
    line-height: 6vw;
}	
	
.woche{
	display: flex;
	flex-wrap: wrap;
}	
		
	
.header {
	background-position: 0px -50px;
	height:550px;}	
	
.begin {
		margin-bottom: 0%;
	    padding-top: 7%;
	height: 400px;}	
	
	.vita {
		padding-bottom: 5%;}
	
.imgvita {
    background-image: url(/images/Weiterbildung.png);
    background-size: contain;
    background-repeat: no-repeat;
	position: relative;
    width: 100%;
    height: 300px;
	margin-top: 2%;}
	
	.together {
    height: 55%;
    bottom: 15%;
    left: 45%;
}
	
.boy {
    height: 65%;
    bottom: 45%;
		top:inherit;
    left: 75%;
}	
	
	
.girl {
    height: 65%;
    bottom: 75%;
	top:inherit;
    left: 55%;
}
	
	
	.imgHolder img {
		width: 45%;}
	
	.schwan {
    margin-bottom: 0%; 
    padding-top: 10%;
		    height: 100%;}
	
.schwan p {
    float:inherit; 
    font-size: 3vw;
  width: inherit; 
}
	
	.schwan .colText{
		    width: 100%;
	}	
	.imglinks {
		padding-right: 2%;}
	
	.geburt h5 {
		font-size: 3vw;}
	
.Holder {
    float: right;
     width: 45%;
    right: 10%;
	position: relative;}
	
.imgHold {
    float: right;
    position: relative;
     bottom: 250px;
    left: 30%;}
	
	
		#empfehlungen {
	height: 1250px;}
	
	#empfehlungen .container {
    bottom: 250px;
}
.kontakt .row{flex-wrap:wrap;}
	
	.kontbild {
    width: 120%;
    position: relative;
		bottom: 10%;}

	
.footer{
	width: 60%;}	



a {font-size: 3vw;}
}



@media screen and (max-width:600px){
	.weiterb h5 {
		font-size: 4vw;}
	
	.schwan p {
    float:inherit; 
		font-size: 3.5vw;}
	
		.colText {
    font-size: 3.5vw;}	
	
a {font-size: 3vw;}
	
	.begin {
		margin-bottom: 0%;
	    padding-top: 7%;
	height: 500px;}	
}


@media screen and (min-width:320px){	
	
	 .nav {
    display: flex;
  }

	.navbar-toggler{padding-left: 3%;}
	
	.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #111;
  overflow-x: hidden;
  transition: 0.5s;
  padding-top: 60px;
		
}

.sidenav .navItem  {
  padding: 8px 8px 8px 32px;
  text-decoration: none;
  font-size: 4vw;
  color: #fff;
  display: block;
  transition: 0.3s;
}

	
	
.sidenav a:hover {
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 5vw;
  margin-left: 50px;
	color: #fff;
}

#main {
  transition: margin-left .5s;
  padding: 0px;
}


}