@charset "UTF-8";
/* CSS Document */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}

body { 
 background: white;
}

	@font-face {
   font-family:'Suranna';	
   src: url("../Fonts/Suranna/Suranna-Regular.ttf") format('truetype');
   
}
	
		@font-face {
   font-family:'Montserrat-Light';
   src: url("../Fonts/Montserrat/Montserrat-Light.ttf") format("truetype");
   font-weight: normal;	
   font-style: normal;
   
}

/*Responsive*/
@media screen and (max-width: 1554px){
	

    /*Breite*/
    oll li, li a {
        width: 100%;
    }
	

	
}


@media (min-width: 1250px) and (max-width: 2500px){

#klein{
		visibility: hidden;
	}
}
/*menü*/
#menue {
	background: white;
	overflow: hidden;
	position: fixed;
	width: 100vw;
	height: 50px;
	margin-top: 0px;
	z-index: 10;
}



/*Liststyle entfernen*/
ol {
    list-style-type:none;
    margin:0;
    padding:0;
	heigth: 400px;
	margin-left:1000px;
    	margin: 0px auto;
	float: right;
	
}
/*horizontale Ansicht*/
li {
    display:inline-block;
    float: right;
    margin-right: 1px;
	text-align: right;
}

/*style Menuelinks*/
li a {

    display:block;
    min-width:120px;
    height: 50px;
    text-align: center;
    line-height: 50px;
    font-family: "Montserrat-Light";
    color:#000000;
    text-decoration: none;
	z-index: 40;
transition: width 2s;
}

/*effect_hover*/

a {
  color:#000000;
  text-decoration: none;
  position: relative;
transform: translate(-3px,-3px);

}

li a:after {
  content: ''; /* content ist leer... */
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  border-bottom: 2px solid #000000;
  transition: 0.6s;
  transform: scaleX(0);


}

li a:hover:after {
  width: 100%;
  transform: scaleX(1);

}

#titel{
	height: 150px;
	z-index: 10;
	margin-top:3%;
}



#uebermich {

width: 100vw;
height: 65vh;
	overflow: hidden;

}

.portfolio {
width: 100vw;
height: 1200px;
	background-color: rgba(250,250,250,1.00);
	background-size: 90vw;
	background-position: center; 
position: relative;
z-index:6;	
}
img {
	position: absolute;
	margin-left: 5%;
	margin-top: 5vh;
	height: 20vh;
	
}

/*text, linie*/

#text {
	overflow: hidden;
	position: absolute;
	font-size: 1.5em;
	color: white;
	height: 40px;
	width: 1200px;
	text-align: justify;
	margin-left: 10vw;
	border-left: solid 2px white;
	margin-top: 45vh;
	padding-left: 20px;
	font-family: "Montserrat-Light";
z-index: 5;
	
}



	
#headline1 {
	 
	color: white; 
	font-family:"Suranna";
	font-size: 300%; 
	position: absolute;
	padding-left:10%;
	margin-top: 13vh;
}


#parallax {
  
  background-image: url("Bilder/posterneu2.jpg");
  height: 2100px;
	width: 100vw;
  
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}


#weiteres-inhalt{
	width: 1300px;
    height: auto;
	margin-top: 13%;
	margin-left:0;
	left: 50%;
	display:flex;
		margin-left: -650px;
}


.zurueck {
	position: absolute;
	font-size: 1.5em;
	color: black;
	text-align: left;
	margin-left: 5vw;
	margin-top: 1950px;
	font-family: "Montserrat-Light";
	
}



@media (min-width: 0px) and (max-width: 849px){
	
	#uebermich {

width: 100vw;
height: 500px;
	overflow: hidden;

}
	
	
#titel{
	z-index: 10;
	margin-top:0%;
	height: 20%;
}
	#klein{
		
		width:400px;
		height:auto;
		margin-top: 20%;
		left: 50%;
	display:flex;
		margin-left: -200px;
	}
	
	
	#weiteres-inhalt{
		visibility:hidden;
	}
	
	
	.portfolio {
width: 100vw;
height: 1100px;
	background-color: rgba(250,250,250,1.00);
	background-size: 90vw;
	background-position: center; 
position: relative;
z-index:6;	
}
img {
	position: absolute;
	margin-left: 5%;
	margin-top: 5vh;
	height: 20vh;
	
}

	img#titel{
		height: 20vw;
		margin-top: 3%;
	}
	
	#headline1 {
	 
	color: white; 
	font-family:"Suranna";
	font-size: 220%; 
	position: absolute;
	padding-left:5%;
	margin-top: 8vh;
}
	#text {
	overflow: hidden;
	position: absolute;
	font-size: 1.3em;
	color: #EEEEEE;
	height: auto;
	width: 80vw;
	text-align: left;
	margin-left: 5%;
	border-left: solid 2px white;
	margin-top: 30vh;
	padding-left: 20px;
	font-family: "Montserrat-Light";
z-index: 5;
	
}
	
	

	
	#parallax {
  
  background-image: url("Bilder/posterneu2.jpg");
  height: 1900px;
	width: 100vw;
 
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
		overflow: hidden;
}


	.zurueck {
	position: absolute;
	font-size: 1.5em;
	color: black;
	text-align: left;
	margin-left: 5vw;
	margin-top: 1750px;
	font-family: "Montserrat-Light";
}
	
	
}

@media (min-width: 850px) and (max-width: 1250px){
	
	#klein{
		visibility: hidden;
	}
	
		#parallax {
  
  background-image: url("Bilder/posterneu2.jpg");
  height: 1500px;
	width: 1250px;
 
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
	
	
	
	#titel{
		height: 100px;
	z-index: 10;
}
	
	.zurueck {
	position: absolute;
	font-size: 1.5em;
	color: black;
	text-align: left;
	margin-left: 5vw;
	margin-top: 1400px;
	font-family: "Montserrat-Light";
}
	
	#text {
	overflow: hidden;
	position: absolute;
	font-size: 1.5em;
	color: #EEEEEE;
	height: 60px;
	width: 550px;
	text-align: justify;
	margin-left: 5vw;
	border-left: solid 2px white;
	margin-top: 40vh;
	padding-left: 20px;
	font-family: "Montserrat-Light";
z-index: 5;
		text-align: left;
	
}



	
#headline1 {
	 
	color: white; 
	font-family:"Suranna";
	font-size: 280%; 
	width: 880px;
	position: absolute;
	padding-left:5vw;
	margin-top: 10vh;
}
	
	#weiteres-inhalt{
	width: 800px;
		height: auto;
	margin-top: 10%;
	margin-left: -400px;
	left: 50%;
	display:flex;
	
}
	
	.portfolio {
width: 100vw;
height: 700px;
	background-color: rgba(250,250,250,1.00);
	background-size: 90vw;
	background-position: center; 
position: relative;
z-index:6;	
}
	
}