body {
	font-family: 'Lato', sans-serif;
	font-weight: 300;
}
.container {/*inhalte*/
	max-width: 900px;
	padding-left: 150px;
}
h1 {/*überschrift Katja Duftner*/
	font-size: 3em;
	font-weight: 300;
	margin-top: 70px;
}
h1 a {/*home link(Katja Duftner)*/
	text-decoration: none;
	color: #000000;
}
/*Navigation Anfang*/
li ul {/*unordered list in einer li (dropdown)*/
	display: none;
	position: absolute;
	top: 5px;
	left: 460px;
}
.projekte li {/*li im dropdown*/
	font-size: 0.8em;
	display: block;
}

#kunst:hover ul {/*wenn hover über kunst ul sichtbar*/
	display: block;
	list-style-type: none;
}
nav a, nav li {/*links und listenelemente der navigation*/
	font-style: italic;
	text-decoration: none;
	list-style-type: none;
	color: #000000;
	opacity: 0.8;
	display: inline;
	font-size: 1.2em;
	padding-right: 15px;
	font-weight: 300;
}
nav a:hover {/*alle links der navigation*/
	color: #000000;
	opacity: 1.0;
	font-weight: 400;
}
nav {
	margin-top: -65px;
	padding-left: 300px;
}

/*Navigation Ende*/
img {/*alle Bilder*/
	padding-top: 25px;
}
.slide img {/*höhe der Bilder in den Slides*/
	height: 500px;
}
.texte {/*impressum & kontakt (texte)*/
	padding-top: 25px;       /* ACHTUNG: GEÄNDERT! VORHER 25px ...............*/
	max-width: 80%;
}
#bilderreihe img {/*bilder auf kunst startseite*/
	width: 200px;
	height: auto;
	padding-right: 10px;
}
#bilderreihemobil img{/*bilderreihe bei kunst für mobile Geräte*/
	width: 200px;
	height: auto;
	padding-right: 10px;
	
}
#bilderreihemobil{/*falls kein mobiles gerät: versteckt, weiter unten wieder eingeblendet*/
	visibility:hidden;
	position:absolute;
	left:auto;
	top:345px;
	max-width:500px;
}
table {/*vita texte*/
	padding-top: 25px;
	max-width: 80%;
}
th, h2 {/*überschriften (table und texte)*/
	padding-bottom: 00px;       /* ACHTUNG: GEÄNDERT! VORHER 20px ...............*/
	font-weight: 400;
	font-size: 1.2em;
	font-weight: 400;
}
td, th {/*Table inhalt*/
	text-align: left;
	min-width: 120px;
}
@media screen and (max-height: 900px) {/*Startseite slider Größe je nach Höhe geregelt*/

	#slides {/*grösse des sliders selbst*/
		max-width: 700px;
		max-height: 700px;
	}
}
@media screen and (max-width: 1024px) {/*layout für tablets*/
	.container {/*container wird kleiner, weniger rand*/
		max-width: 80%;
		padding-left: 0;
		margin: 0 auto;
	}
	nav {/*position der navigation geändert -> unter Titel*/
		margin-top: -25px;
		margin-left: -40px;
		padding-left: 0px;
	}
	nav a, li {/*navigation jetzt im block angezeigt*/
		display: block;
		margin-bottom: -15px;
	}
	.projekte li {/*weniger abstand zwischen den navigationspunkten*/
		margin: 15px;
	}
	li ul {/*unordered list in einer li (dropdown)*/
		position: relative;
		top: 0;
		left: 0;
	}
	.slide img {/*damit bild im slide nicht abgeschnitten wird*/
		max-width:100%;
		height:auto;
	}
	#bilderreihe{/*abschnitt kunst: alte Bilderreihe wird ausgeblendet*/
		visibility:hidden;
	}
	#bilderreihemobil{/*neue bilderreihe wird eingeblendet*/
		visibility:visible;
		max-width:500px;
	}
	#slides{
		min-height:900px;
	}
}
@media screen and (max-width: 480px) {/*Für mobile Geräte, Handys*/
	.container {/*Rand wird noch kleiner*/
		max-width: 90%;
		padding-left: 0px;
		margin: 0 auto;
	}
	h1 {
		margin-top: 35px;/*Abstand der Überschrift zum oberen Rand verkleinert*/
	}
	td, th {/*abstand der tabelle im Vita geändert*/
		min-width: 90px;
	}
	#bilderreihemobil{/*position der mobilen bilderreihe angepasst*/
		visibility:visible;
		max-width:500px;
		top:310px;
	}

}