@media (max-width: 1200px){



html {
	font-size: 1.0em; /* Browserstandard: 16px */
	height: 100%;
	scroll-behavior: smooth;
}





.wrapper{
width: 100%;
padding:0% 3%;
margin: 0 auto;
background:none;
overflow:hidden;
margin-bottom:1%;
margin-top:2%;
}



.wrapper-headline{
width: 100%;
padding:0% 3%;
height: 75px;
margin: 0 auto;
margin-top:-2.3%;
margin-bottom:-1.3%;

}


.wrapper-headline h1{
font-size:1.5em;
}

.wrapper-02{
width: 96%;
margin:0 3% 24px 2%;
padding:1%;

background:#E8E8E8;
overflow:hidden;


}	


.wrapper-02-1{
width: 96%;
margin:0 3% 2px 2%;
padding:1%;

background:#E8E8E8;
overflow:hidden;


}	



	
.wrapper-03{
width: 100%;
padding:0% 3%;
margin: 0 auto;
background: black;
overflow: hidden;
}


.wrapper-intro{
width: 94%;
margin:0 3% 20px 3%;
padding:2%1%;
}


/*h2 Headlines*/
h2 {
font-weight: 700;
font-size: 1.4em;
line-height:1.375em;
padding:0 0 4% 0;
}


/*h3 HL index und Projekte/Mouseover*/
h3 {
	font-weight: 300;
	font-size:1.9em;
line-height:1.25em;
	
	padding:0 0 0 0;

	
	}
	
	
h5{
font-size:0.9em;
line-height:1.375em;
}



	/*p Fließtexte*/
p {
font-weight: 300;
font-size:0.9em;
line-height:1.375em;
color:black;

	}
	
	p a{
line-height: 1.375em;
}

/*blockquote*/	

blockquote{
text-align:left;
width:100%;
}

blockquote a{
display:block;

font-family: niveau-grotesk, helvetica, sans-serif;
font-weight: 300;
font-style: normal;
text-decoration:none;

font-size:1.1em;
line-height:1.4em;
color: #696969;

opacity: 0.7;
transition: 4s 1;
}






ul{
width:94%;
background:none;
margin: 0 auto;
position: fixed;
margin-right: 3%;
height:5%;


}


	
	
/*Header*/	
	header{
	height: 80px;
	background-color:white;
	width:100%;
	z-index: 99;
	position:fixed;
	top:0;
	display:block;
	
	

	}
	
	header h1 a {color: black;
	position: fixed;
	margin-left: 0%;
	margin-top: 0%;
	text-decoration: none;
	z-index: 1;}

	
	
	
	
	
/*sprache*/		
	
#language{
position:fixed;
	top:100px;
	right:0;
width:35px;
height:80px;
background-color: #E8E8E8;
z-index: 1;
padding:5px 10px 10px 5px;


}	

#language h5{

color:red;
font-weight:700;

}


#language h5 a{
text-decoration: none;
color:#696969;


}
	
	
#language a:hover{
color:red;

}

.gb{
color:#696969;

}	





	
	#index{
	display: block; 
	}
	
	
	#index-mobile{
	display: none; 
	}
	





	
	/*Main*/
	
	
	
#main{
background: white;
width: 100%;
margin:0% 20%;
margin: 0 auto;
margin-top:100px;
}
	
	



	
.main-index{
display: block; 
	background-position:none;
	  background-size: none; 
   width: 100%;
   	
	
}


.main-index h3{
display:block;
color:white;
font-weight:700;
font-size:3em;
line-height:125%;
position:fixed;
bottom:25%;
left:3%;
z-index: 1;


}




	/*Content-Grid*/	


/*Texte: einspaltig*/	
.content-text{
display:block;
width:32%;
height:100%;
float:left;
overflow:auto;
padding: 0% 1% 1%px 0%;


}




/*texte projekte*/	
.projekte .content-text{
padding: 0% 0 1% 1%;
}

#projekt-intro h2{
font-size:1.1em;
line-height:1.4em;

color:#6B6A6A;
font-weight: 300;


}



/*einspaltig Verteilerseite Kontext*/	


.img-overview-00 a{
  cursor: url(../img/dot.png), cell;
color:white;
width:32%;
float:left;
background: url("../images/V_K_Relikte.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}
.img-overview-01 a{
   cursor: url(../img/dot.png), cell;
color:white;
width:32%;
float:left;
background: url("../images/V_K_Natur.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}






.img-overview-02 a{
  cursor: url(../img/dot.png), cell;
color:white;
width:32%;
float:left;
background: url("../images/V_K_Stadt.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;

}



.img-overview-03 a{
  cursor: url(../img/dot.png), cell;
color:white;
width:32%;
float:left;
background: url("../images/V_K_Mensch.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}



.img-overview-04 a{
  cursor: url(../img/dot.png), cell;
width:32%;
float:left;
background: url("../images/V_K_Ausstellung.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;

}


.img-overview-04-kontext-architektur a{
  cursor: url(../img/dot.png), cell;
width:32%;
float:left;
background: url("../images/V_K_Architektur.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;

}
	
	





/*zweispaltig Verteilerseite Form*/	




.img-overview-form-01 a{
  cursor: url(../img/dot.png), cell;
width:66%;
float:left;
background: url("../images/V_F_geometrisch_organisch.jpg") no-repeat; 
background-size: cover;
background-position: center;
margin-left: 2%;
margin-bottom: 2%;
height:220px;
filter: brightness(100%);
}






.img-overview-form-02 a{
  cursor: url(../img/dot.png), cell;
width:66%;
float:left;
background: url("../images/V_F_Kontrast_Verschmelzung.jpg") no-repeat; 
background-size: cover;
background-position: center;
margin-left: 2%;
margin-bottom: 2%;
height:220px;
filter: brightness(100%);


}



.img-overview-form-03 a{
  cursor: url(../img/dot.png), cell;
width:66%;
float:left;
background: url("../images/V_F_Konstruiert_Freihand.jpg") no-repeat;
background-size: cover;
background-position: center;
margin-left: 2%;
margin-bottom: 2%;
height:220px;
filter: brightness(100%);



}



	
	


/* Verteilerseite Form Geometrisch/Organisch*/	
.img-overview-05 a{
   cursor: url(../img/dot.png), cell;
color:white;
width:32%;
float:left;
background: url("../images/F_geometrisch.jpg") no-repeat;
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}






.img-overview-06 a{
  cursor: url(../img/dot.png), cell;
color:white;
width:32%;
float:left;
background: url("../images/F_Organisch.jpg") no-repeat; 
background-size: 100%;

margin-left: 2%;
margin-bottom: 1%;
height:350px;
filter: none;

}






/*Verteilerseite Material*/	


.img-overview-material-01 a{
  cursor: url(../img/dot.png), cell;
color:white;
width:32%;
float:left;
background: url("../images/V_M_Elemente.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;



}






.img-overview-material-02 a{
  cursor: url(../img/dot.png), cell;
color:white;
width:32%;
float:left;
background: url("../images/V_M_Stahl.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;



}







.img-overview-material-03 a{
  cursor: url(../img/dot.png), cell;
color:#696969;
width:32%;
float:left;
background: url("../images/V_M_Gold.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}




.img-overview-material-04 a{
  cursor: url(../img/dot.png), cell;
color:#696969;
width:32%;
float:left;
background: url("../images/V_M_Lehre.jpg") no-repeat; 
background-size: cover;
margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}





/*Verteilerseite Zeichen*/	


.img-overview-zeichen-01 a{
  cursor: url(../img/dot.png), cell;
color:black;
width:32%;
float:left;
background: url("../images/V_Z_Ornament.jpg") no-repeat; 
background-size: cover;

margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}





.img-overview-zeichen-02 a{
  cursor: url(../img/dot.png), cell;
color:black;
width:32%;
float:left;
background: url("../images/V_Z_Spuren.jpg") no-repeat; 
background-size: cover;

margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}








.img-overview-zeichen-03 a{
  cursor: url(../img/dot.png), cell;
color:black;
width:32%;
float:left;
background: url("../images/V_Z_Bedeutungstraeger.jpg") no-repeat; 
background-size: cover;

margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}

.img-overview-zeichen-03 h3 a{
line-height:115%;
padding:1.5% 1% 2% 2%;
}



.img-overview-zeichen-04 a{
  cursor: url(../img/dot.png), cell;
color:black;
width:32%;
float:left;
background: url("../images/V_Z_Lehre.jpg") no-repeat; 
background-size: cover;

margin-left: 2%;
margin-bottom: 2%;
height:320px;
filter: none;


}

























		/*zweispaltige bilder*/	

	
.images-02{
width:66%;
float:left;
margin-left: 2%;
margin-bottom: 0%;
padding:1%;
	
	}
	
	
	
.img-index{
display:block;
margin-top:80px;
margin-bottom:0px;
overflow:hidden;




}	

.img-index img:hover{
cursor:none;
}

	

/* ishow container */
.slideshow-container-2 {
display:none;
  position: center;
   background-size: cover; 
    bottom:0;
  margin: 0 0% 0px 0%;
  cursor:none !important;
 
}

.slideshow-container-2 img{
object-fit: contain;

	}
	
	

/* Next & previous buttons */
.next {

   cursor: url(../img/arrow-right.png), cell;  
  position: absolute;
  top: 0%;
  width: 50%;
  height:90%;

  
}

.prev {

cursor: url(../img/arrow-left.png), cell;
  position: absolute;
  top: 0%;
  width: 50%;
  height:90%;
  margin-top: 0px;
  padding: 0px;
  color: red;
  font-weight: bold;
  font-size: 1.375rem;
  /*transition: 0.6s ease;*/
  border-radius: 0 3px 3px 0;
  text-decoration:none;
  
}














/* Position the "next button" to the right */
.next {

  right: 0;
  border-radius: 3px 0 0 3px;
  
}



	
	/*projekttrennlinie*/		
	
	
	
	
	
		/*nach oben button*/	


#myBtn{
display:none;
position:fixed;
bottom:100px;
right:-0.2%;
background-color: none;
border:none;
 outline: none;
color:red;


}




	
	/*Footer*/		
	
footer{
background: black;
position:relative;
bottom: 0 !important;
width:100%;
height:100px;
padding:1% 3%;
margin-top:-1%;

}


	














.address-01{
width: 34%;
display:inline-block;
margin:0 0% 0 0;
}

.datenschutz{
float: right;
}





}