* {
	padding:0;
	margin:0;
}
#load{
	visibility:hidden;
	display: none;}
/*body {
	background-image: url('img/background.jpg');
	background-repeat: no-repeat;
	color:black;
	background-position: center top;
}
*/


body {
background: url('img/background.jpg') fixed;
webkit-background-size: cover;
moz-background-size: cover;
o-background-size: cover;
background-size: cover;
}

#all {
	margin: auto;
	width: 960px;
}
#grau {
	float: left;
	background-color: #aaaaaa;
	margin: 20px 0;
	width:960px;
}
#herzlichwillkommen {
	font-family: 'Rouge Script', cursive;
	font-size: 60px;
	text-align: center;
	margin: 50px 0 0 0;
}
/*Startseite*/
/*Navigation*/
#kopf {
	background-image:url(img/Navigation_purple.PNG);
	background-repeat:no-repeat;
	background-position:right bottom;
	width: 960px;
	margin: 30px auto;
	margin-top:70px;
	height:220px;
}
#logo {
	float:left;
}
#navizwei {
	float:left;
	font-family: 'Graduate', cursive;
	position: right bottom;
}
#navizwei ul {
	margin:37px 0 0 80px;
	padding:0;
	list-style-type:none;
}
#navizwei li {
	float:left;
	padding-right:10px;
}
#navizwei a {
	text-decoration:none;
	color: black;
	font-size:15.5px;
	padding: 10px;
}
#navizwei a:hover {
	opacity: 0.7;
	background-color:#9d5b7d;
	padding: 10px;
}
/*Oberster Block -> Fotografie*/
#containertop {
	background-repeat:no-repeat;
	width:897px;
	margin:30px auto;
	text-decoration: none;
}
#containertop img:hover {
	opacity:0.6;
}
#containertop li {
	list-style-type:none;
}
#bar4 {
	z-index:2;
	background-color:black;
	width:150px;
	height: 35px;
	margin: 130px 0 0 697px;
	padding: 10px 0 0 50px;
	position: absolute;
}
#bar4 a {
	text-decoration: none;
	color: white;
	font-family: 'Graduate', cursive;
	font-size: 18px;
}
/*Linker Kasten -> Studium*/
#containerdownleft {
	float:left;
	width:375px;
	height: 324px;
	margin: 30px;
}
#bar3 {
	z-index:2;
	font-family: 'Graduate', cursive;
	font-size: 18px;
	background-color:black;
	color: white;
	width:150px;
	height: 35px;
	margin: 180px 0 0 175px;
	padding: 10px 0 0 50px;
	position: absolute;
}
#study a {
	background-image:url(img/study_g.jpg);
	z-index:1;
	background-repeat: no-repeat;
	width: 375px;
	height:323px;
	position: absolute;
}
#study a:hover {
	background-image:url(img/study.jpg);
}
/*Rechter Kasten -> About me*/
#containerdownright {
	float:left;
	width:484px;
	height: 324px;
	margin: 30px 30px 30px 0;
}
#aboutme a {
	background-image: url(img/about_me_g.jpg);
	background-repeat:no-repeat;
	width: 492px;
	height: 322px;
	position:absolute;
	z-index:1;
}
#aboutme a:hover {
	background-image:url(img/about_me.jpg);
}
#bar2 {
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size: 18px;
	background-color:black;
	color: white;
	width:150px;
	height: 35px;
	float:left;
	padding: 10px 0 0 50px;
	position:absolute;
	margin-top: 250px;
}
#bar3 a:hover, #bar2 a:hover, #bar4 a:hover {
	color:#9d5b7d;
}
/*Unterseiten Disclaimer/Datenschutz/Impressum*/
#impressum, #disclaimer, #datenschutz {
	font-family: 'Alegreya Sans', sans-serif;
	text-align: justify;
	margin: 30px 0 0 0;
	color:black;
	font-size:16px;
	line-height: 23px;
}
#disclaimer a {
	text-decoration:none;
	color: black;
	font-size:15.5px;
}
#impressumtop {
	
	font-family: Arial Arial, Helvetica, sans-serif;
	font-size:12px;
	width: auto;
	height:30px;
	
}
#blackbar {
	background-color: #aaaaaa;
	width: auto;
	height:40px;

	}
#impressumtop ul {
	list-style-type:none;
}
#impressumtop li {
	padding: 13px 20px;
	float:right;
}
#impressumtop a, #containerdown a {
	text-decoration:none;
	color: white;
}
#datenschutz a, #disclaimer a {
	text-decoration: none;
	color:#9d5b7d;
}
#hintergrundgrafik	{
	text-decoration: none;
	color:#9d5b7d
}
#fotomarginoben, #galleria {
	margin: 30px;
}
/*Unterseite Ueber mich*/
#abouttext {
	text-align: justify;
	float: left;
	width: 400px;
	font-family: 'Alegreya Sans', sans-serif;
	text-align: justify;
	font-size:16px;
	line-height: 23px;
	
	margin: 30px 30px 0 30px;
	
}
#about img {
	margin:0 30px 0 0;
	float: left;
	
}
/*Copyright*/
#produced {
	font-family: 'Alegreya Sans', sans-serif;
	font-size:13px;
	margin:10px 0 0 0;
	text-align:center;
}
/*Unterseite Studium*/


/*Praktikum links*/
#links {
	float: left;
	width: 435px;
	height: auto;
	margin: 30px;
}
#prak a {
	position: absolute;
	z-index: 1;
	background-image:url(img/Studium/praktikum_g.jpg);
	width: 435px;
	height: 270px;
}
#prak a:hover {
	background-image: url(img/Studium/praktikum.jpg);
}
#praktikum a {
	margin: 130px 0 0 240px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#praktikum a:hover {
	color: #9d5b7d;
}
/*Fotografie rechts*/
#rechts {
	float: left;
	width: 435px;
	height: 270px;
	margin: 30px 30px 30px 0;
}
#fot a {
	position: absolute;
	z-index: 1;
	background-image: url(img/Studium/fotografie_g.jpg);
	width: 435px;
	height: 270px;
}
#fot a:hover {
	background-image: url(img/Studium/fotografie.jpg);
}
#fotografie a {
	margin: 200px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#fotografie a:hover {
	color: #9d5b7d;
}
/*Projektstudium links unten*/
#links1 {
	float: left;
	width: 435px;
	height: auto;
	margin: 0 30px 30px 30px;
}
#proj a {
	position: absolute;
	z-index: 1;
	background-image:url(img/Studium/projektstudium_g.jpg);
	width: 435px;
	height: 270px;
}
#proj a:hover {
	background-image: url(img/Studium/projektstudium.jpg);
}
#projektstudium a {
	margin: 190px 0 0 239px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#projektstudium a:hover {
	color: #9d5b7d;
}
/* Auslandssemester unten rechts*/
#rechts1 {
	float: left;
	width: 435px;
	height: 270px;
	margin: 0 30px 30px 0;
}
#as a {
	position: absolute;
	z-index: 1;
	background-image:url(img/Studium/auslandssemester_g.jpg);
	width: 435px;
	height: 270px;
}
#as a:hover {
	background-image: url(img/Studium/auslandssemester.jpg);
}
#auslandssemester a {
	margin: 50px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#auslandssemester a:hover {
	color: #9d5b7d;
}
/*Typografie links unten unten*/
#links2 {
	float: left;
	width: 435px;
	height: 270px;
	margin: 0 30px 30px 30px;
}
#typo a {
	position: absolute;
	z-index: 1;
	background-image:url(img/Studium/typografie_g.jpg);
	width: 435px;
	height: 270px;
}
#typo a:hover {
	background-image: url(img/Studium/typografie.jpg);
}
#typografie a {
	margin: 150px 0 0 288px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#typografie a:hover {
	color: #9d5b7d;
}
#avvideo {
	margin: 0 30px 30px 30px;
}
/* thesis unten unten rechts*/
#rechts2 {
	float: left;
	width: 435px;
	height: 270px;
	margin: 0 30px 30px 0;
}
#th a {
	position: absolute;
	z-index: 1;
	background-image:url(img/Studium/thesis_g.jpg);
	width: 435px;
	height: 270px;
}
#th a:hover {
	background-image: url(img/Studium/thesis.jpg);
}
#thesis a {
	margin: 50px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#thesis a:hover {
	color: #9d5b7d;
}

/*Unterseite Praktikum*/
/*Webseitenlayouts links*/
#web a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/praktikum/webseitenlayouts/layouts_g.jpg);
	width: 435px;
	height: 270px;
}
#web a:hover {
	background-image: url(semester/praktikum/webseitenlayouts/layouts.jpg);
}
#layout a {
	margin: 120px 0 0 220px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#layout a:hover {
	color: #9d5b7d;
}
/*Corporate Design rechts*/
#corp a {
	position: absolute;
	z-index: 1;
	background-image: url(semester/praktikum/corporate_design/corporate_g.jpg);
	width: 435px;
	height: 270px;
}
#corp a:hover {
	background-image: url(semester/praktikum/corporate_design/corporate.jpg);
}
#corporate a {
	margin: 200px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#corporate a:hover {
	color: #9d5b7d;
}
/*Unterseite Fotografie*/
/*Bewerbungsbild links*/
#bew a {
	position: absolute;
	z-index: 1;
	background-image:url(img/Studium/fotografie_g.jpg);
	width: 435px;
	height: 270px;
}
#bew a:hover {
	background-image: url(img/Studium/fotografie.jpg);
}
#bewerbung a {
	margin: 100px 0 0 233px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#bewerbung a:hover {
	color: #9d5b7d;
}
/*Portrait rechts*/
#port a {
	position: absolute;
	z-index: 1;
	background-image: url(semester/fotografie/portrait/portrait_g.jpg);
	width: 435px;
	height: 270px;
}
#port a:hover {
	background-image: url(semester/fotografie/portrait/portrait.jpg);
}
#portrait a {
	margin: 300px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#portrait a:hover {
	color: #9d5b7d;
}
/*Mehrpersonenportrait links unten*/
#mehr a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/fotografie/mehrpersonenportrait/mehrpersonenportrait_g.jpg);
	width: 435px;
	height: 270px;
}
#mehr a:hover {
	background-image:url(semester/fotografie/mehrpersonenportrait/mehrpersonenportrait.jpg);
}
#mehrpersonen a {
	margin: 79px 0 0 255px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#mehrpersonen a:hover {
	color: #9d5b7d;
}
/* Landschaft unten rechts*/
#la a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/fotografie/landschaft/landschaft_g.jpg);
	width: 435px;
	height: 270px;
}
#la a:hover {
	background-image: url(semester/fotografie/landschaft/landschaft.jpg);
}
#landschaft a {
	margin: 170px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#landschaft a:hover {
	color: #9d5b7d;
}
/*Reportage und Still links unten unten*/
#rep a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/fotografie/reportage_still/reportage_g.jpg);
	width: 435px;
	height: 270px;
}
#rep a:hover {
	background-image: url(semester/fotografie/reportage_still/reportage.jpg);
}
#reportage a {
	margin: 80px 0 0 298px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#reportage a:hover {
	color: #9d5b7d;
}
#avvideo {
	margin: 0 30px 30px 30px;
}
/* compositing und feature unten unten rechts*/
#com a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/fotografie/compositing_feature/feature_g.jpg);
	width: 435px;
	height: 270px;
}
#com a:hover {
	background-image: url(semester/fotografie/compositing_feature/feature.jpg);
}
#composi a {
	margin: 150px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#composi a:hover {
	color: #9d5b7d;
}
/*Medienkonzeption*/
/* Textformatierung*/
#formatierung {
	font-family: 'Alegreya Sans', sans-serif;
	text-align:center;
	color:black;
	font-size:16px;
	line-height: 23px;
	margin: 20px 30px 0 30px;
}
#formatierungjustify {
	font-family: 'Alegreya Sans', sans-serif;
	text-align: justify;
	color:black;
	font-size:16px;
	line-height: 23px;
	margin: 20px 30px 0 30px;
}
/*blinkenpaint*/
#blinkenpaint {
	float: left;
	width: 435px;
	height: auto;
	margin:   0 30px 30px 30px;
}
#blinken a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/medienkonzeption/blinkenpaint/blinkenpaint_g.jpg);
	width: 435px;
	height: 270px;
}
#blinken a:hover {
	background-image:url(semester/medienkonzeption/blinkenpaint/blinkenpaint.jpg);
}
#paint a {
	margin: 205px 0 0 257px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#paint a:hover {
	color: #9d5b7d;
}
#blinki img {
	width: 375px;
	height: 388px;
	margin: 30px 292.5px;
}
#blinki a{
	font-family: 'Alegreya Sans', sans-serif;
	text-align:center;
	font-size:16px;
	line-height: 23px;
	margin: 20px 30px 0 350px;
	color: #9d5b7d;
    text-decoration: none;

	}
/*Selbstportrait*/
#selbstportrait {
	float: left;
	width: 435px;
	height: 270px;
	margin: 0 30px 30px 0;
}
#selbst a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/medienkonzeption/selbstportrait/selbstportrait_g.jpg);
	width: 435px;
	height: 270px;
}
#selbst a:hover {
	background-image:url(semester/medienkonzeption/selbstportrait/selbstportrait.jpg);
}
#portrait a {
	margin: 120px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#portrait a:hover {
	color: #9d5b7d;
}
#portrait img {
	margin: 30px;
}
/*Slitscan*/
#slitscan {
	float: left;
	width: 435px;
	height: auto;
	margin:   0 30px 30px 30px;
}
#slit a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/medienkonzeption/slitscan/slitscan_g.jpg);
	width: 435px;
	height: 270px;
}
#slit a:hover {
	background-image:url(semester/medienkonzeption/slitscan/slitscan.jpg);
}
#scan a {
	margin: 205px 0 0 301px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#scan a:hover {
	color: #9d5b7d;
}
/*Kurzfilm*/
#kurzfilm {
	float: left;
	width: 435px;
	height: 270px;
	margin: 0 30px 30px 0;
}
#kurz a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/medienkonzeption/kurzfilm/kurzfilm_g.jpg);
	width: 435px;
	height: 270px;
}
#kurz a:hover {
	background-image:url(semester/medienkonzeption/kurzfilm/kurzfilm.jpg);
}
#film a {
	margin: 120px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#film a:hover {
	color: #9d5b7d;
}
#film img {
	margin: 30px;
}
/*Videodialoge*/
#videodialoge {
	float: left;
	width: 435px;
	height: auto;
	margin:   0 30px 30px 30px;
}
#video a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/medienkonzeption/videodialoge/videodialoge_g.jpg);
	width: 435px;
	height: 270px;
}
#video a:hover {
	background-image:url(semester/medienkonzeption/videodialoge/videodialoge.jpg);
}
#dialoge a {
	margin: 205px 0 0 263px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#dialoge a:hover {
	color: #9d5b7d;
}
/*Splitscreen */
#splitscreen{
	float: left;
	width: 435px;
	height: 270px;
	margin: 30px ;
}
#split a {
	position: absolute;
	z-index: 1;
	background-image: url(semester/medienkonzeption/splitscreen/slitscan_g.jpg);
	width: 435px;
	height: 270px;
}
#split a:hover {
	background-image: url(semester/medienkonzeption/splitscreen/slitscan.jpg);
}
#screen a {
	margin: 120px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#screen a:hover {
	color: #9d5b7d;
}
#screen img {
	margin: 30px;
}
#splitscreenvideo, slitscanvideo{
	margin: 30px;
	}
#grau p{
	font-family: 'Alegreya Sans', sans-serif;
	text-align:left;
	margin: 0 30px 0 30px;
	color:black;
	font-size:16px;
	line-height: 23px;
}

/* Bachelorarbeit*/

#thesistext {
	float: left;
	width: 510px;
	font-family: 'Alegreya Sans', sans-serif;
	font-size:16px;
	line-height: 23px;
	text-align:justify;
	margin:30px;
}
#thesisbild {
	margin:  150px 30px 0 30px ;
	float: left;
	}





/*Programmieren*/
/*Abstraktes Bild*/
#abstrakt {
	float: left;
	width: 435px;
	height: auto;
	margin:   0 30px 30px 30px;
}
#ab a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/Programmieren/abstraktes_bild/abstraktes_bild_g.jpg);
	width: 435px;
	height: 270px;
}
#ab a:hover {
	background-image:url(semester/Programmieren/abstraktes_bild/abstraktes_bild.jpg);
}
#abild a {
	margin: 160px 0 0 233px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#abild a:hover {
	color: #9d5b7d;
}
/*Interaktives Bild*/
#interaktiv {
	float: left;
	width: 435px;
	height: 270px;
	margin: 0 30px 30px 0;
}
#inter a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/Programmieren/interaktives_bild/interaktives_bild_g.jpg);
	width: 435px;
	height: 270px;
}
#inter a:hover {
	background-image:url(semester/Programmieren/interaktives_bild/interaktives_bild.jpg);
}
#aktiv a {
	margin: 90px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#aktiv a:hover {
	color: #9d5b7d;
}
/*Skipiste*/
#skipiste {
	float: left;
	width: 435px;
	height: auto;
	margin: 0 30px 30px 30px;
}
#ski a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/Programmieren/skipiste/skipiste_g.jpg);
	width: 435px;
	height: 270px;
}
#ski a:hover {
	background-image:url(semester/Programmieren/skipiste/skipiste.jpg);
}
#piste a {
	margin: 115px 0 0 307px;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#piste a:hover {
	color: #9d5b7d;
}
/*Catch the fruits*/
#catch {
	float: left;
	width: 435px;
	height: 270px;
	margin: 0 30px 30px 0;
}
#the a {
	position: absolute;
	z-index: 1;
	background-image:url(semester/Programmieren/Frucht_fangen/catch_the_fruits_g.jpg);
	width: 435px;
	height: 270px;
}
#the a:hover {
	background-image: url(semester/Programmieren/Frucht_fangen/catch_the_fruits.jpg);
}
#fruits a {
	margin: 140px 0 0 0;
	position: absolute;
	z-index: 2;
	font-family: 'Graduate', cursive;
	font-size:15.5px;
	background-color: black;
	padding: 10px 20px;
	text-decoration: none;
	color: white;
}
#fruits a:hover {
	color: #9d5b7d;
}
/*Aufgaben programmmieren*/
/*Abstraktes Bild*/
#zufallsbild1_container {
	width: 800px;
	margin: 30px auto;
}
#content p {
	font-family: 'Alegreya Sans', sans-serif;
	text-align:left;
	margin: 30px;
	color:black;
	font-size:16px;
	line-height: 23px;
}
#content a {
	text-decoration:none;
	color: black;
}
#content a:hover {
	color: #9d5b7d;
}
/*interaktives Bild*/
#Aufgabe_7_container {
	width: 800px;
	margin: 30px auto;
}
/*Skipiste*/
#skipiste_container {
	width: 800px;
	margin: 30px auto;
}