/* www.katrinsuess.com */ 

html, body{ 
 margin:0; 
 padding:0; 
 text-align:center; 
 background-color: #FFF;
 font-family: Verdana, sans-serif;
 
	
	/* font-size: 100.01%; legt die Standradgröße aller Schriften und Boxen fest, 
	und bietet mit dieser Einstellung die Möglichkeit auch im IE6 und Firefox 
	skalierbare HTML-Elemente zu erzeugen.Um später Pixelgrößen auszurechnen 
	benutzt man die Regel "Pixel:16=em" also z.B. "780:16=48.75em" um eine skalierbare 
	Box für ein auf 800x600 optimiertes Layout zu erzeugen oder 12:16=0.75em für 
	eine Schriftgröße von 12px */
	
	font-size: 100.01%;
	letter-spacing: 0.1em;
} 

p {
	font-size: 12px;
	margin: 0;
	padding: 0;
}

h1 {
	font-size: 14px;
	font-weight: bold;
	margin: 0 0 20px 0;
}

#header{
 position:relative; 
 top: 0;
 left: 0;
 width:100%;
 padding: 0 0 5px 0;
 border-bottom: #ececec 1px solid;
} 

#header_s {
 position:relative; 
 top: 0;
 left: 0;
 width:830px;
 padding: 70px 0 20px 0;
} 
 
#leftcol_lines {
 width:305px;
 height: 490px; 
 float:left; 
 padding-top: 40px;
 background-image: url(../images/design/linienmuster_linkes_quadrat.gif);
 background-repeat: no-repeat;
 }
 
 #leftcol {
 width:305px;
 height: 490px; 
 float:left; 
 padding-top: 40px;
 }
 
 #leftcol_essay {
 width:200px;
 height: 1%; 
 float:left; 
 padding-top: 40px;
 }
  
#centercol {
 float: left;
 margin-left: 147px;
 width:433px; 
 padding: 43px 5px 20px 0;
 text-align: left;
 color: #646464;
 line-height: 20px;
 }
 
 #center_imprint {
 	width: 427px;
	height: 417px;
	padding: 5px 0 0 10px;
   background-image: url(../images/imprint.jpg);
}

#center_imprint a {
	text-decoration: none;
	color: #646464;
}
 
 #center_contact {
 	width: 427px;
	height: 152px;
	padding: 270px 0 0 10px;
   background-image: url(../images/contact_bg.jpg);
}
 
.RightColEssay {
 float: left;
 width:433px; 
 height: 200px;
 margin-left: 252px;
 padding: 43px 5px 20px 0;
 text-align: left;
 color: #646464;
 line-height: 20px;
 }
 
.RightColEssay a {
	color: #646464;
	text-decoration: none;
} 

.RightColEssay a:hover {
	color: Orange;
} 
 
.RightContentEssay {
 float: left;
 width:433px; 
 padding: 0 0 20px 12px;
 text-align: justify;
 color: #646464;
 line-height: 20px;
 } 
 
.LeftContentEssay {
	float: left;
	width: 445px;
	height: 100px;
	padding-top: 7px;
} 
 
 #centercol_essay {
 float: left;
 width:890px; 
 padding: 20px 0 30px 0;
 text-align: justify;
 color: #646464;
 line-height: 20px;
 }

#LeftColStart {
 float: left;
 width:425px;
 height: 457px; 
 padding: 43px 20px 30px 0;
 text-align: justify;
 color: #646464;
 line-height: 20px;
 }
 
#RightColStartR {
 float: left;
 width:430px; 
 height: 457px; 
 height: 422px;
 margin: 49px 0 30px 15px;
 }
 
 #RightColStartO {
 float: left;
 width:430px; 
 height: 422px;
 margin: 49px 0 30px 15px;
 }
 
 #centercolStart {
 text-align: justify;
 color: #646464;
 line-height: 20px;
 padding: 143px 0 147px 0;
 height: 240px;
 }
 
 #centercolVitae {
 float: left;
 margin-left:10px;
 width:575px; 
 padding: 43px 0px 20px 0;
 text-align: left;
 color: #646464;
 line-height: 20px;
 }
 
 #centercolPub {
 float: left;
 margin-left:10px;
 width:575px; 
 padding: 43px 0px 20px 0;
 text-align: left;
 color: #646464;
 line-height: 20px;
 }
 
 #centercolExhibit {
 float: left;
 margin-left:10px;
 width:575px; 
 padding: 43px 0px 20px 0;
 text-align: right;
 color: #646464;
 line-height: 20px;
 }
 
.VitaeLeft {
	float: left;
	position: relative;
	width: 104px;
	padding-right: 43px;
	text-align: right;
}

.VitaeRight {
	float: left;
	width: 428px;
	text-align: left;
}

.VitaeRight a {
	color: #646464;
	text-decoration: none;
}

.VitaeRight a:hover {
	color: #646464;
	text-decoration: underline;
}

.VitaSpacer {
	float: left;
	width: 100%;
	height: 20px;
}

.VitaSpacerBorder {
	float: left;
	width: 100%;
	height: 40px;
}
 
#centerstart {
 width:850px; 
 padding: 50px 0 75px 0;
 text-align: left;
 color: #646464;
 }
 
#footer {
 position: relative;
 height:22px; 
 width: 100%;
 clear:both;
 border-top: #ececec 1px solid;
 font-size: 12px;
 padding-top: 3px;
 } 
 
 #footerstart {
 position: relative;
 height:18px; 
 width: 805px;
 clear:both;
 border-top: #ececec 1px solid;
 font-size: 14px;
 padding-bottom: 7px;
 } 
 
/* Kontakt Formular */

#contact {
 width:585px; 
 height: 330px;
 float:right; 
 padding: 65px 40px 0 0;
 color: #FFFFFF;
 } 


#name, #email, #frage, #fon, #cap {
	background-color: #F0F0F0;
	border: #808080 1px solid;
	font-family: Verdana, sans-serif;
	font-size: 12px;
	padding: 3px 5px 3px 5px;
	margin-bottom: 5px;
}

#name, #email, #fon {
	width: 250px;
}

#frage {
	width: 480px;
	height: 140px;
}

.rot {
	color: #940425;
}

.mailbutton {
	margin-top: 10px;
}
	
.sponsorlink {
	font-size: 10px;
	color: #696969;
	margin-left: 260px;
	text-decoration: none;
}	

a.sponsorlink {
	height: auto;
}
a.sponsorlink:hover {
	color: #FFFFFF;
}

/* Ende Kontakt Formular */

#container { 
 width:890px; 
 text-align:left;  
 margin-top: 30px;
 margin-left:auto; 
 margin-right:auto;
 position: relative;
 background-color: #FFF;
 padding: 0;
} 

#container_s { 
 width:850px; 
 text-align:left;  
 margin-top: 30px;
 margin-left:auto; 
 margin-right:auto;
 position: relative;
 background-color: #FFF;
 padding: 0;
} 

#gallery {
	position: absolute;
   top: 80px;
   left: 310px;
	width: 580px;
	height: 465px;
	overflow: hidden;
	z-index: 100;
}

.name {
	font-size: 24px;
	background-color: #FFF;
	color: #bcbdbd;
	margin:0;
	border: none;
	text-decoration: none;
}

.name a,
.name a:hover {
	color: #bcbdbd;
	text-decoration: none;
}

.name2 {
	font-size: 24px;
	background-color: #FFF;
	color: #7f8081;
	margin:0;
	border: none;
	text-decoration: none;
}

.name2 a,
.name2 a:hover {
	text-decoration: none;
	color: #7f8081;
}

.weiter {
	float: right;
	font-size: 24px;
	margin:10px 0 0 0;
	border: none;
}

.weiter a {
	color: #bcbdbd;
	text-decoration: none;
}

.weiter a:hover {
	color: #6b6b6b;
}

.title {
	position: absolute;
	top: 0;
	left: 670px;
	display: block;
	width: 220px;
	font-size: 24px;
	background-color: #FFF;
	color: #bcbdbd;
	border: none;
	text-align: right;
}

/* navigation */
#nav {
	width: 100%;
	margin: 0;
	display:block;
}

#nav ul, #nav li, #nav ul li a {
	height:1%;
	margin:0px;
	padding:0px;
	list-style: none;
}

/*Legt die Fontgröße der ersten Navigationebene fest*/
#nav ul li {
	font-size: 12px;
	margin 0;
}


/*Hier wird nun das aussehen der Links in der ersten Ebene (wird auf alle Unterebenen vererbt) festgelegt*/

#nav ul li a {
	display:block;
	color: #bcbdbd;
	padding: 3px 0 20px 0;
	border-bottom: transparent 1px solid;
	text-decoration: none;
}

/*Dies ändert die Mouseover-Farbe (Hintergrund und Linkfarbe*/
#nav ul li a:hover {
	color: #6b6b6b;
	text-decoration:none;
}

#nav ul li#current strong,
#nav ul li#current a,
#nav ul li#current a:focus,
#nav ul li#current a:hover,
#nav ul li#current a:active {
	color: #6b6b6b;
}

.impress {
	float: left;
	display: block;
	width: 150px;
	color: #666;
	height:12px; 
}

.impress a {
	text-decoration: none;
	color: #b1afaf;
}

.impress a:hover {
	color: #666;
}

#social {
	position: absolute;
	top: -38px;
	left: 0px;
	width: 200px;
}

#social2 {
	position: absolute;
	top: -58px;
	left: 0px;
	width: 200px;
}

#fbk {
	position: absolute;
	top: -1px;
	left: 25px;
	border: none;
}

#fbk2 {
	position: absolute;
	top: 47px;
	left: 710px;
	width: 120px;
	z-index: 1;
}

.like {
	position: relative;
	top: -20px;
	left: 100px;
}

#fbk3 {
	position: absolute;
	top: 525px;
	left: 50px;
	width: 80px;
	z-index: 99;
}

#share {
	position: absolute;
	top: -4px;
	left: 25px;
	border: none;
}

.copyright {
	float: right;
	display: block;
	width: 150px;
	color: #b1afaf;
	height:12px; 
	text-align: right;
}

.language {
	float: left;
	display: block;
	width: 200px;
	color: #b1afaf;
	font-size: 12px;
}

.language a {
	text-decoration: none;
	color: #b1afaf;
}

.language a:hover {
	color: #666;
}
.grau {
	color: #cbc9c9;
}

.essay_img {
	padding: 7px 0 0 0;
}

.EssaySpacer1 {
	float: left;
	height: 30px;
	width: 100%;
	padding: 20px 0 20px 0;
	text-align: right;
}

.EssaySpacer1 a {
	color: #bbb;
	font-size: 30px;
	text-decoration: none;
}

.EssaySpacer1 a:hover {
	color: Orange;
}

.EssaySpacer2 {
	float: left;
	height: 50px;
	width: 100%;
	padding: 20px 0 10px 0;
	border-top: #ececec 1px solid;
}

.hartung {
	position: absolute;
	top: 370px;
}

.top {
	position: absolute;
	top: 0;
}

.ContentEssays {
	width: 100%;
	height: 1%;
	float: left;
}

.EssayTopSpacer {
	float: left;
	width: 100%;
	height: 60px;
}

.KatZitat {
	float: left;
	width: 408px;
	height: 396px;
	text-align: justify;
	background-color: #c2c1bf;
	color: #fff;
	padding: 10px 10px 5px 10px;
}

.KatZitatEN {
	float: left;
	width: 388px;
	height: 394px;
	text-align: justify;
	background-color: #c2c1bf;
	color: #fff;
	padding: 12px 20px 5px 20px;
}

.KatZitat2 {
	float: left;
	width: 408px;
	height: 170px;
	text-align: justify;
	background-color: #c2c1bf;
	color: #fff;
	padding: 10px 10px 5px 10px;
}

.KatZitat2EN {
	float: left;
	width: 388px;
	height: 168px;
	text-align: justify;
	background-color: #c2c1bf;
	color: #fff;
	padding: 12px 20px 5px 20px;
}

.BioBildLi {
	position: absolute;
	top: 0;
	left: -315px;
}

.EssayLink {
	display: inline-block;
	height:19px;
	border-bottom: 1px solid;
}

.translate {
	color: Fuchsia;
}

.addthis_button {
	float: right;
	margin: -27px 0 0 0;
}

#links {
	visibility: hidden;
}	

#slideshow1 {
	width:428px;
	height:526px; 
	background-color:#EEEEEE; 
	margin-bottom: 4px;
}

#slideshow2 {
	width:428px;
	height:526px; 
	background-color:#EEEEEE; 
	margin-bottom: 4px;
}

.social3 {
	float: left;
	margin: 14px 0 0 454px;
}

.title_pan {
	float: right;
	display: block;
	font-size: 10px;
	color: #bcbdbd;
}
.fbk4 {
	position: relative;
	top: -19px;
	left: 25px;
}