@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%;
    }
}

/*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*/
#nav li {
    display:inline-block;
    float: right;
    margin-right: 1px;
	text-align: right;
}

/*style Menuelinks*/
#nav 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);

}

#nav 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);


}

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

}


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


#parallax {
  
  background-image: url("jalousie.jpg");
  height: 7400px;
	width: 150vw;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}

#uebermich {
width: 100vw;
height: 55vh;
	overflow: hidden;

}

.portfolio {
width: 100vw;
height: 6600px;
	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{
	padding-left: 0;
	position:absolute;
	width: 1000px;
	padding-top: 100px;
	font-family: "Montserrat-Light";
	display:flex;
		flex-direction: column;
		left: 50%;
		margin-left: -500px;
}

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

@media (min-width: 0px) and (max-width: 849px){
	
	.text{
		padding-left:0;
	position:absolute;
	width: 400px;
	font-family: "Montserrat-Light";
		display:flex;
		flex-direction: column;
		left: 50%;
		margin-left: -200px;
}
	
	.portfolio {
width: 100vw;
height: 11000px;
	background-color: rgba(250,250,250,1.00);
	background-position: center; 
position: relative;
z-index:6;	
}
	
	#parallax {
  
  background-image: url("jalousie.jpg");
  height: 11800px;
	width: 150vw;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
}

@media (min-width: 850px) and (max-width: 1250px){
	
		.text{
		padding-left:0;
	position:absolute;
	width: 800px;
	font-family: "Montserrat-Light";
		display:flex;
		flex-direction: column;
		left: 50%;
		margin-left: -400px;
}
	
	.portfolio {
width: 100vw;
height: 7200px;
	background-color: rgba(250,250,250,1.00);
	background-position: center; 
position: relative;
z-index:6;	
}
	
	#parallax {
  
  background-image: url("jalousie.jpg");
  height: 8000px;
	width: 100vw;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
}
