/* *********** netzdesign-berlin.de */

/* *******Allgemeine Angaben****  */
*{
padding:0;
margin:0;

}
body {
	height: 59.3em;
	width: 59.3em;
	margin:0px;
	padding:0px;
	background-color: #FFFFFF;
	font-size:100.01%;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	
	
}

html{
	margin:0px;
	padding:0px;

}


/* entfernung der abstande zw div   */
* {
	margin:0px;
	padding:0px;
}


#text h2{ font-size:12px; text-align:center;}

/* ************id`s************ */

/* kopf mit logo */
#header {
	height: 9.25em;
	width: 45.5em;
	background-repeat:repeat-y;
	display:block;
	margin-top:0em;
	z-index:6;
	background-image: url(../img/header.gif);
	background-repeat:no-repeat;
	background-position: 0em;
	

}

#header h1 {
	position:relative;
	top:7.5em;
	left:4em;
	z-index: 115;
	overflow: hidden;
	width: 20em;
	font-size: small;
	height: 2em;

}
/* mittlere box */
#middel{
	background-repeat: repeat-y;
	min-height: 35em;
	height:auto;
	width: 45.5em;
	z-index:5;
	
	background-image: url(../img/middel.gif);
pading-bottom:2em;

}

/* unterere box */
#footer{
	height:4.81em;
	width:45.5em;
	display:block;
	z-index:10;
	background-image: url(../img/footer.gif);
	padding-top:1em;
	background-repeat: no-repeat;
	
}
 


#middel, #header , #footer
{
	margin-right:auto;
	margin-left:auto;

}




 
#wrapper {
	
	width: 59.31em;

	margin: 0px;
	padding: 2em 0px ;

	height:auto;
}


/* *********navigation**********  */ 
#navi {
	padding-left: 0.625em;
	margin-left: 1.5em;
	
}


ul {
	background-image: url(img/ul_farbe.gif);
	background-repeat: repeat;
	
}

#navi li{
	margin-left:1.7em;
	color:#FF0000;
	display:block;
	

	width: 6em;
	float: left;
	list-style-type: none;
	padding-bottom:1em;
	

}

/* ***********textrahmen******** */

#text{
	width:23em;
}
#text{
display:block;
margin-left:2.6em;
	margin-bottom:1.5em;
	text-align:justify;
	padding:0.3em; 
	
	
	
}

#texterror{
width:25em;
margin-left:3em;
	margin-bottom:1.5em;
	text-align:left;
	padding:0.3em;
	
}
#text, #text2 {

	font-size: small;

	display:block;
	min-height: 20em;
	height:auto;
	float:left;

}

#text2{

		width:22em;
		margin-left:5em;
			text-align:justify;
		margin-top:1em;
}

#text_rechts{

	font-size: small;
		text-align:justify;
	width:22em;
	min-height:14em;
	height:auto;
	margin-top:1.5em;
	margin-right:2em;
	float:right;
	padding:0.5em;
	

}

.clear{
clear:both;
}

/* flash animation */

.flash{


	display:block;

	margin-left:2em;
	margin-bottom:1.5em;
	

	float:left;
}



/* *******bilderrahmen******* */
 #bild1 , #bild2 , #bild3 , #bild4 {
	margin-top:1em;
	margin-right:4em;
	height:25em;
	width:14em;
	float:right;

	
} 



/* **********bilderzuweisung********* */


/*  home */
 #bild1 {

   height:10em;
	background-image: url(../img/kabel.jpg);
	background-repeat:no-repeat;
	
	margin-right:	4em;
	margin-top:-0.5em;
	
}

/*  portfolio */
 #bild2 {

	background-image: url(../img/objectiv.jpg);
	background-repeat:no-repeat;	

	
}

/* contact */
 #bild4 {


	background-image: url(../img/tastatur.jpg);
	background-repeat:no-repeat;	
	height:10em;
	margin-top:1em;

	
}

#text, #text h2, #text2 h2{
font-size:small;
}
/* Überschriften im bereich bild */
 #bild1 h1 , #bild2 h1 , #bild3 h1 ,#bild4 h1  {
	font-size:8pt;
	display:block;
	margin-top:15.5em;
	padding-right:0.5em;
	color:red;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	
}
/* nicht sichtbarer text */
.noview {
	font-family: Arial, Helvetica, sans-serif;
	position:absolute;
	top:-1000px;
	left:-1000px;
	overflow:hidden;
}

/* Formularformatierung */

form{
	float:left;
	padding-left:1.5em;
	margin-left:2em;
	width:14em;
	font-size:small;

}
fieldset{
	height:25em;
	width:26em;
	border:#CC6600 thin solid;
	display:block;
	margin-top:0.5em;
	background-color:#FFFFFF;
	padding-bottom:0.5em;
	padding-left:0.4em;

}

#daten{
	width:22em;
	height:13em;
	float:right;
	
	margin-top:1em;

}

#kenntnisse{
	width:22em;
	height:30em;
	margin-top:2em;
	margin-right:1em;
	padding-left:2.8em;
	float:right;
	text-align:left;
	font-size:small;
	border-left:dotted #999999 thin;
}

form br{
	clear:both;

}

legend{
	font-size:small;
	font-style:italic;
	background-color:#D8D8D8;


} 

 .formtext{
	margin-right:1.4em;
	display:block;
	float:right;
	margin-bottom:1em;

}

label{
	
	margin-bottom:0.5em;
		
	text-align:right;
	float:left;
}


fieldset.button {
	height: 3em;
	width:21em;
	
}

/* formatierung von input und select */

input , select{
	margin-left:1em;
	margin-top:0.5em;
	text-align:center;
	width:12em;

}

textarea:focus , input:focus{
	background-color:#FFFFCC;
}

.button ,.submit{
	padding-top:0.5em;
	margin:5px 0px 0px 0px ;
	display:block;
	width:8em;
	border:2px solid;
	border-color:#F2F2F2 #c0c0c0 #c0c0c0 #f2f2f2;
}

.radio{
	float:left;
	width: 2em;
	margin-right:1em;

}

/* Formatierng der portfolio */

.screenrahmen{

	display:block;
	width:90%;
	height:8em;

	margin-left:2em;
	margin-top:0.5em;



}
.screenrahmen img{
	border:#CCCCCC solid 3px;
	margin-top:0.2em;

}
.screentext ,.screenshot{
	padding-left:0.5em;
	margin-bottom:0.5em;
	

}
.screenshot{
	float:left;
	margin-left:0.5em;
	width:29.9%;
	float:left;
	height:8em;

	
	
}

.screentext h1{
	font-size:medium;
}
.screentext{
	width:60.5%;
	height:8em;
	font-size:smaller;
	display:block;
	border:#CC6600 dotted 1px;
	float:right;
	margin-right:1em;
	padding:0.8em;
	font-weight:500;
	text-align:left;
}

#name{
	margin-left:-0.51em;
}

/* pseudolinks */

#text2 a:link, #text a:link ,div#text_rechts a:link, .screentext a:link{
	color:#CC0000;
	text-decoration:none;
}
#text2 a:visited,#text a:visited ,div#text_rechts a:visited, .screentext a:visited{
	color:#663333;
	font-weight:bold;
	text-decoration:none;
}

#text2 a:hover,#text a:hover , div#text_rechts a:hover, .screentext a:hover{

	color:#003399;
	font-weight:800;
}

#text2 a:focus,text a:focus , div#text_rechts a:focus, .screentext a:focus{

	color:#003399;
	font-weight:800;
}