@charset "UTF-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Roboto+Slab:100,300,400');

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;    
	box-sizing: border-box;
	-moz-transform: translateX(0px);

}



body {
	margin: 0px;
	background-color: #1d1d1b;
}



.logo {
	width:55%;
	margin-top:70px;
	margin-left:5%;


}

a:link {
	color:#FFFFFF;
	text-decoration:none;
	}
	
a:hover{
	color:#c20c0c;
}

.wrapper1{
	min-height:1080px;
	width:100%;
	background-image: url(Material/Atelier_1920.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	background-attachment: fixed;
    background-position: center;
}

.wrapper{
	height:1080px;
	width:100%;
	background-image: url(Material/grau.jpg);

}


article{
	font-family: 'Roboto Slab', serif;
	font-weight:300;
	font-size:20px;
	color:#FFFFFF;
	margin-top:700px;
	padding-bottom:50px;
	width:50%;
	margin-left:5%;
}

.article1{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:24px;
	color:#FFFFFF;
	margin-top: 40px;
	margin-bottom:60px;
	margin-left:5%;
	margin-right:5%;

}

#impressum{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:24px;
	color:#FFFFFF;
	margin-top: 240px;
	margin-left:5%;
	margin-right:5%;

}

.section1{
	height:1080px;
}

.section{
	height:950px;
}

span{
	font-family: 'Roboto Slab', serif;
	font-weight:100;
}


.mySlider{
	position:absolute;
}

.article3{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:19px;
	color:#FFFFFF;
	margin-top: 250px;
	margin-left:5%;
	margin-right:15%;
}

/*#ganzerInhalt{
	background-color: #1d1d1b;
	width:3000px;
	
}*/

@media screen and (max-width:1366px) {
.clear {
	clear: both;
}
		
.section1{
	height:768px;
}	

.section{
	height:768px;
}

.rauf{
	margin-top:-150px;
}
	

.wrapper1 {
  width: 100%;
  min-height: 768px;
  background-image:url(Material/Atelier_1366.jpg);
  background-size:cover;
  background-repeat:no-repeat;
  overflow-x: hidden;
  overflow-y: scroll;
  perspective: 1px;
  perspective-origin: 0 0;
}

.parallax_child {
  transform-origin: 0 0;
  transform: translateZ(-2px) scale(3);
}

.parallax-container {
  transform-style: preserve-3d;
}

/*.wrapper1{
	min-height:768px;
	width:100%;
	background-image:url(Material/Atelier_1366.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	/* für parallax Effekt 
    background-attachment: static;
    background-position: center;
    
}
*/

.wrapper{
	height:768px;
	width:100%;
	background-image:url(Material/grau.jpg);
	background-repeat:repeat;
}

.logo {
	width:55%;
	margin-top:50px;
	margin-left:5%;

}


article{
	font-family: 'Roboto Slab', serif;
	font-weight:300;
	font-size:17px;
	color:#FFFFFF;
	margin-top:500px;
	padding-bottom:50px;
	width:50%;
	margin-left:5%;
	position: fixed;
}

.article1{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:18px;
	color:#FFFFFF;
	margin-top: 40px;
	margin-left:5%;
	margin-right:15%;


}

.article3{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:19px;
	color:#FFFFFF;
	margin-top: 250px;
	margin-left:5%;
	margin-right:15%;


}

#impressum{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:15px;
	color:#FFFFFF;
	margin-top: 440px;
	margin-left:5%;
	margin-right: 15%;
}


.article2{
	margin-top:540px;
	margin-left:5%;
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:19px;
	color:#FFFFFF;
	float:left;
}




}



@media screen and (max-width:768px) {
.clear {
	clear: both;
}
	
.section1{
		height:956px;
}	

.section{
		height:956px;
}	



.parallax_child {
  transform-origin: 0 0;
  transform: translateZ(-2px) scale(3);
}

.parallax-container {
  transform-style: preserve-3d;
}
	
.wrapper1{
	min-height:956px;
	width:100%;
	background-image:url(Material/Atelier_768.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	overflow-x: hidden;
    overflow-y: scroll;
    perspective: 1px;
    perspective-origin: 0 0;
}

.wrapper{
	height:956px;
	width:100%;
	background-image:url(Material/grau.jpg);
	background-repeat:repeat;
}

.logo {
	width:55%;
	margin-top:50px;
	margin-left:5%;
}

article{
	font-family: 'Roboto Slab', serif;
	font-weight:300;
	font-size:14px;
	color:#FFFFFF;
	margin-top:690px;
	padding-bottom:30px;
	width:50%;
	margin-left:5%;
}

.article1{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:21px;
	color:#FFFFFF;
	margin-top: 80px;
	margin-bottom:60px;
	margin-left:5%;
	margin-right:5%;
	
}

.article3{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:19px;
	color:#FFFFFF;
	margin-top: 30px;
	margin-left:5%;
	margin-right:15%;


}


#impressum{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:16px;
	color:#FFFFFF;
	margin-top: 680px;
	margin-left:5%;
	margin-right:5%;
}

.article2{
	margin-top:400px;
	margin-left:40px;
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:21px;
	color:#FFFFFF;
	float:left;
}

#button{
	margin-left:55%;
	z-index:2;
	
}

}

@media screen and (max-width:320px) {
.clear {
	clear: both;
}
	
.section1{
	height:480px;
}	

.section{
	height:480px;
}	

.wrapper1{
	min-height:480px;
	width:100%;
	background-image:url(Material/Atelier_320.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	overflow-x: hidden;
    overflow-y: scroll;
    perspective: 1px;
    perspective-origin: 0 0;
  -webkit-overflow-scrolling: touch;
}	

.wrapper{
	height:480px;
	width:100%;
	background-image:url(Material/grau.jpg);
	background-repeat:repeat;
}

.parallax_child {
  transform-origin: 0 0;
  transform: translateZ(-2px) scale(3);
  position: -webkit-sticky;
  top: 0px;
  transform: translate(-2px) scale(3);
}

.parallax-container {
  transform-style: preserve-3d;
  perspective: 1px;
}



.logo {
	width:55%;
	margin-top:50px;
	margin-left:5%;
}

article{
	font-family: 'Roboto Slab', serif;
	font-weight:300;
	font-size:14px;
	color:#FFFFFF;
	margin-top:700px;
	padding-bottom:50px;
	width:80%;
	margin-left:5%;
}

.article1{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:16px;
	color:#FFFFFF;
	margin-top: 80px;
	margin-bottom:60px;
	margin-left:5%;
	margin-right:5%;
}

#impressum{
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:16px;
	color:#FFFFFF;
	margin-top: 180px;
	margin-left:5%;
	margin-right:5%;
}

.article2{
	margin-top:15px;
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:21px;
	color:#FFFFFF;
	margin-left:5%;
	float:left;
	margin-top:100px;
}

.article3{
	margin-top:15px;
	font-family: 'Roboto Slab', serif;
	font-weight:400;
	font-size:21px;
	color:#FFFFFF;
	margin-left:5%;
	float:left;
	margin-top:100px;
}

#button{
	margin-left:55%;
	z-index:2;
	
}

}