/* CSS Document by werbelust */

@font-face {
   font-family: 'Vegur ExtraLight';
   src: url('../font/Vegur-EL_0500.eot');
}
 
/* dann für alle anderen Browser */
@font-face {
   font-family: 'Vegur ExtraLight';
   src: url('../font/Vegur-EL_0500.otf') format('opentype');
}

* {
	margin:0;
	padding:0;
}

html, body {
	height:100%;
}

a {
	font-family:Vegur ExtraLight;
	color:#666;
	text-decoration:none;
}
a:hover {
	text-decoration:underline;
}

body {
	background-color:#f7f0e2;
	text-align:center; /* horizontal centering for IE Win quirks */
	font-family:Arial, Helvetica, sans-serif;
}

#spacer { 
	width:1px;
	height:50%;
	background-color:#FFF;
	margin-bottom:-310px; /* half of container's height */
	float:left;
	z-index:0;
}

#acontainer-top {
	margin:0 auto;
	position:relative; /* puts container in front of distance */
	text-align:left;
	height:200px;
	width:100%;
	float:right;
	z-index:2;
}

#acontainer-middle {
	margin:0 auto;
	position:relative; /* puts container in front of distance */
	text-align:left;
	height:220px;
	width:100%;
	float:right;
	z-index:2;
	background-color:#FFF;
}

#acontainer-bottom {
	margin:0 auto;
	position:relative; /* puts container in front of distance */
	text-align:left;
	height:18px;
	width:100%;
	float:right;
	z-index:2;
	font-family:Vegur ExtraLight;
}

#container-top {
	margin:0 auto;
	position:relative; /* puts container in front of distance */
	text-align:left;
	top:1px;
	height:200px;
	width:900px;
	clear:left;
	z-index:3;
}
#container-middle {
	margin:0 auto;
	position:relative; /* puts container in front of distance */
	text-align:left;
	height:220px;
	width:900px;
	clear:left;
	z-index:3;
}

#container-bottom {
	margin:0 auto;
	position:relative; /* puts container in front of distance */
	text-align:left;
	bottom:0px;
	height:20px;
	width:900px;
	clear:left;
	z-index:3;
	color:#87888a;
}

#content {
	position:absolute;
	height:180px;
	width:640px;
	top:15px;
	padding-top:10px;
	padding-left:10px;
	padding-right:55px;
	text-align:justify;
	font-size:14px;
	color:#999;
	line-height:20px;
	font-family:Verdana, Geneva, sans-serif;
}
#content a {
	color:#999;
	text-decoration:none;
	font-family:Verdana, Geneva, sans-serif;
}
#content a:hover {
	color:#666;
	text-decoration:none;
}
#content h1 {
	font-weight:bold;
	font-size:14px;
	height:25px;
}
#content h2 {
	font-weight:bold;
	font-size:14px;
}

#image {
	position:absolute;
	height:220px;
	width:220px;
	top:0px;
	right:0px;
	border:0;
}


#project {
	height:105px;
	width:215px;
	background-color:#4E4E4E;
	position:relative;
	float:left;
	font-size:22px;
	line-height:25px;
	letter-spacing:3px;
	color:#D0D0D0;
	padding: 115px 0px 0px 5px;
}
#sprache {
	height:95px;
	width:215px;
	background-color:#f49e00;
	position:relative;
	float:left;
	font-size:22px;
	color:#FFF;
	letter-spacing:3px;
	padding: 125px 0px 0px 5px;
}
#design {
	height:95px;
	width:215px;
	background-color:#A30718;
	position:relative;
	float:left;
	font-size:22px;
	color:#FFF;
	letter-spacing:3px;
	padding: 125px 0px 0px 5px;
}
#web {
	height:95px;
	width:215px;
	background-color:#2a6a6d;
	position:relative;
	float:left;
	font-size:22px;
	color:#FFF;
	letter-spacing:3px;
	padding: 125px 0px 0px 5px;
}
#project1 {
	width:215px;
	position:relative;
	float:left;
	padding: 8px 0px 0px 5px; 
}
#sprache1 {
	width:215px;
	position:relative;
	float:left;
	padding: 8px 0px 0px 5px;
}
#design1 {
	width:215px;
	position:relative;
	float:left;
	padding: 8px 0px 0px 5px;
}
#web1 {
	width:215px;
	position:relative;
	float:left;
	padding: 8px 0px 0px 5px;
}
 
/*Navigationsleiste*/

.menuTop { 
  background-color:#f7f0e2\9;/*style for IE*/
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3)\9;/*style for IE*/
  padding-bottom:5px\9;/*style for IE*/  
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  display:block; 
  position:absolute;
  left:5px;
  bottom:20px;
  text-transform:uppercase;
  list-style-type:none;
}

.menuTop a {
  background-image:url(../img/link.gif);
  background-position:left;
  background-repeat:no-repeat;
  padding-left:30px;
  padding-top:4px;
  margin:0;
  font-size:28px;
  line-height:35px;
  letter-spacing:2px;
}
.menuTop a:hover {
	text-decoration:none;
}


.menuTop-active-project a {
	color:#4E4E4E;
	background-image:url(../img/project-active.gif);
}
.menuTop-project a:hover {
	color:#4E4E4E;
	background-image:url(../img/project-active.gif);
}
 
.menuTop-active-sprache a {
	color:#f49e00;
	background-image:url(../img/sprache-active.gif);
}
.menuTop-sprache a:hover {
	color:#f49e00;
	background-image:url(../img/sprache-active.gif);
}

.menuTop-active-design a {
	color:#A30718;
	background-image:url(../img/design-active.gif);
}
.menuTop-design a:hover {
	color:#A30718;
	background-image:url(../img/design-active.gif);
}

.menuTop-active-web a {
	color:#2a6a6d;
	background-image:url(../img/web-active.gif);
}
.menuTop-web a:hover {
	color:#2a6a6d;
	background-image:url(../img/web-active.gif);
}


/*SUBNAVIGATION*/
.subnavi li {
	display: inline;
	list-style-type: none;
	border-right: 1px solid #CCC;
	font-size: 16px;
	padding-left: 8px;
	padding-right: 8px;
	
}
.subnavi-project a:hover {
	color:#4E4E4E;	
}
.subnavi-active-project a {
	color:#4E4E4E;
	font-weight:bold;
}
.subnavi-sprache a:hover {
	color:#f49e00;	
}
.subnavi-active-sprache a {
	color:#f49e00;
	font-weight:bold;
}
.subnavi-design a:hover {
	color:#A30718;	
}
.subnavi-active-design a {
	color:#A30718;	
	font-weight:bold;
}
.subnavi-web a:hover {
	color:#2a6a6d;	
}
.subnavi-active-web a {
	color:#2a6a6d;
	font-weight:bold;
}

.name-project {
	position:absolute;
	bottom:5px;
	left:150px;
}
.name-project h2 {
	font-size:24px;
	color:#4E4E4E;
	font-family:Vegur ExtraLight;	
}
.name-sprache {
	position:absolute;
	bottom:5px;
	left:150px;	
}
.name-sprache h2 {
	font-size:24px;
	color:#f49e00;
	font-family:Vegur ExtraLight;	
}
.name-design {
	position:absolute;
	bottom:5px;
	left:150px;	
}
.name-design h2 {
	font-size:24px;
	color:#A30718;
	font-family:Vegur ExtraLight;	
}
.name-web {
	position:absolute;
	bottom:5px;
	left:150px;	
}
.name-web h2 {
	font-size:24px;
	color:#2a6a6d;
	font-family:Vegur ExtraLight;	
}

#topNavi  {
	margin:0 auto;
	text-align:right;
	z-index:2;
	width:100%;
	top:5px;
	position:absolute;
	padding-left: 8px;
	padding-right: 8px;
	text-align:right;
	width:850px;
	font-size:10px;
	color:#999;
	right:0px;
}

.lust-barbara {
	position:absolute;
	left:220px;
	font-size:24px;	
}

.lust-ursula {
	position:absolute;
	left:480px;
	font-size:24px;
}