/*Grundlage*/

*{
	font-family: 'Source Sans Pro', sans-serif;
	font-size:16px;
	margin:0;
	padding:0;
}
body{
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-ms-flex-flow: row wrap;
	    flex-flow: row wrap;
	-ms-flex-line-pack: center;
	    align-content: center;
	margin: 0 auto;
	min-height:100vh;
	background: -webkit-linear-gradient(45deg, #b7e6ec, #91cdd5);
	background: linear-gradient(45deg, #b7e6ec, #91cdd5);
	background-attachment:fixed;
}
header{
	-webkit-box-flex: 1;
	    -ms-flex: 1 100%;
	        flex: 1 100%;
}
section{
	-webkit-box-flex: 1;
	    -ms-flex: 1 100%;
	        flex: 1 100%;
	padding:2em;
	margin:0 auto;
	max-width:600px;
}
.logo{
	background-image:url("../img/logo.png");
    background-size: contain;
    background-repeat: no-repeat;
	background-position:center center;
	margin:0 auto;
	margin-top:8em;
	width:20em;
	height:10em;
}
h1{
	text-align:center;
	font-family: 'Oswald', sans-serif;
	text-transform:uppercase;
	letter-spacing:5px;
	font-weight:300;
	font-size:1.2em;
	margin:2em 0;
}
h2{
	text-align:center;
	font-family: 'Oswald', sans-serif;
	font-weight:300;
	font-size:1em;
	margin:-2em 0 3em 0;
}
h3{
	font-family: 'Oswald', sans-serif;
	text-transform:uppercase;
	letter-spacing:5px;
	font-weight:300;
	font-size:1.2em;
}
h4{
	font-family: 'Oswald', sans-serif;
	font-weight:300;
	font-size:1em;
	margin-bottom:1em;
}
p{
	margin-bottom:0.7em;
	color:#000;
}
p span{
	font-weight:700;
}
hr{
	width:3em;
	margin:2em auto;
	border:1px solid #000;
}
a{
	font-size:1em;
	color:#000;
	text-decoration:none;
}
a:hover{
	color:#dd0056;
}
a:active{
	color:#000;
}

/*Navigation*/
nav{
	text-align:center;
	-webkit-box-flex: 1;
	    -ms-flex: 1 100%;
	        flex: 1 100%;
	position:fixed;
	top:0;
	width:100%;
}
nav ul{
	display:block;
}
nav ul li{
	list-style-type: none;
	display: inline-block;
	margin:0;
	font-size:1.5em;
}
nav ul li a{
	color:#fff;
	font-family: 'Oswald', sans-serif;
	text-transform:uppercase;
	letter-spacing:5px;
	font-weight:300;
	padding:30px 20px;
	display: block;
}

#mobilnav{
		display:none;
}

#curent{color:#432559;}



#menuToggle{
  display: block;
  position: fixed;
  top: 15px;
  left: 50%;
  margin-left: -25px;
  z-index: 9999;
  display: none;

}




@media only screen and (max-width: 900px) {

#screennav{
	display:none;
}

footer{
	display:none;
}

#menuToggle{
	display: block;
}

	
}



#menu {
    position: absolute;
    width: 100%;
    margin: 0;
    padding: 60px 0 25px 0;
    background: #f4b4c2;
    top:0;
    left: 0;
    text-align: center;
    display: none;
    
    /*
    -webkit-font-smoothing: antialiased;
    -webkit-transform-origin: 0% 0%;
            transform-origin: 0% 0%;
    -webkit-transform: translate(0, -100%);
            transform: translate(0, -100%);
    -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    
    transition: -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), -webkit-transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    
    */}

#menu.pressed{
  
  /*
  -webkit-transform: none;
          transform: none;
   */       
  display: block;
}

#menu li {
    display: block;
    font-size: 1.8em;
    padding: 0;
    margin: 0;
}

#menu li a{
    padding: 10px 20px;
    display: block;
    margin: 0;
    cursor: pointer;
    
	color:#fff;
	font-family: 'Oswald', sans-serif;
	text-transform:uppercase;
	letter-spacing:5px;
	font-weight:300;
}






.hamburger {
  cursor: pointer;
  display: block;
  position: absolute;
  top: 40px;
  right: 10%;
  width: 40px;
  height: 30px;
}
.line {
  display: block;
  width: 100%;
  height: 5px;
  background-color: #fff;
  position: absolute;
  transition: all 0.3s;
  border-radius: 10px;
}
.line:nth-child(2) {
  top: 12px;
}
.line:nth-child(3) {
  bottom: 0;
}

.hamburger.checked .line:nth-child(2) {
  opacity: 0;
}
.hamburger.checked .line:nth-child(1) {
  top: 50%;
  transform: rotate(45deg);
}
.hamburger.checked .line:nth-child(3) {
  top: 50%;
  transform: rotate(-45deg);
}
.hidden {
  display: none;
}




/*Startseite*/
.start{
	background-image:url("../img/background.jpg");
    background-size: cover;
	background-position:center center;
    background-repeat: no-repeat;
	background-attachment:fixed;
}
.start .logo{
	height:16em;
}
.start h1{color:#fff;text-shadow: 1px 1px #432559;}

/*About*/

/*Jobs*/
.jobs{
	background-image:url("../img/jobs_bg.jpg");
    background-size: cover;
	background-position:center center;
    background-repeat: no-repeat;
	background-attachment:fixed;
}
.jobs h1, h3{
	color:#dd0056;
	font-weight:300;
	text-align:left;
}
.jobs h2, h4{
	color:#432559;
	text-align:left;
}
.jobs p span{color:#432559;}

.button{
	margin:1em auto;
	display:-webkit-inline-box;
	display:-ms-inline-flexbox;
	display:inline-flex;
	padding:0.5em;
	border:1px solid #000;
}
.button:hover{
	border-color:#dd0056;
}
/*Datenschutz*/
.datenschutz{
	background:#f2f1f0;
	color:#fff;
}
.datenschutz h1{
	color:#000;
}
.datenschutz li{
	color:#000;
	margin-left:3em;
}
.datenschutz h3{
	margin-top:2em;
}
.datenschutz #screennav {
	background:#f2f1f0;
	z-index:9999;
}
.datenschutz #screennav li a{
	color:#dd0056;
}
.datenschutz #menuToggle .line{
	background-color:#dd0056;
}

/*Kontakt*/
.kontakt section p{text-align:center;}
.kontakt{
	background: -webkit-linear-gradient(45deg, #5f357d, #432559);
	background: linear-gradient(45deg, #5f357d, #432559);
	background-attachment:fixed;
}
.kontakt nav ul li #curent{color:#96d3e2;}
.kontakt section p{color:#fff;}
.kontakt section a{color:#fff;}
.kontakt section h1{color:#fff;}
.kontakt hr{border-color:#fff;}
.kontakt nav{border-bottom-color:#dd0056;}

footer{
	position:fixed;
	bottom:0;
	padding:1em;
}
footer a{
	font-size:0.7em;
	text-transform:uppercase;
	letter-spacing:2px;
}



/*IE11 Browser-Schleife*/

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
	nav{
		position:relative!important;
	}
	section{
		margin:2m!important;
	}
	footer{
		position:relative!important;
		-webkit-box-flex:1;
		    -ms-flex:1 100%;
		        flex:1 100%;
		text-align:center;
	}
}