/*
 * Web Fonts from fontspring.com
 *
 * All OpenType features and all extended glyphs have been removed.
 * Fully installable fonts can be purchased at http://www.fontspring.com
 *
 * The fonts included in this stylesheet are subject to the End User License you purchased
 * from Fontspring. The fonts are protected under domestic and international trademark and 
 * copyright law. You are prohibited from modifying, reverse engineering, duplicating, or
 * distributing this font software.
 *
 * (c) 2010-2011 Fontspring
 *
 *
 *
 *
 * The fonts included are copyrighted by the vendor listed below.
 *
 * Vendor:      exljbris
 * License URL: http://www.fontspring.com/fflicense/exljbris
 *
 *
 */
@font-face {
    font-family: 'CallunaSansRegular';
    src: url('font/CallunaSansRegular-webfont.eot');
    src: url('font/CallunaSansRegular-webfont.eot?iefix') format('eot'),
         url('font/CallunaSansRegular-webfont.woff') format('woff'),
         url('font/CallunaSansRegular-webfont.ttf') format('truetype'),
         url('font/CallunaSansRegular-webfont.svg#webfontLzsipiJl') format('svg');
    font-weight: normal;
    font-style: normal;

}

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on June 19, 2011 01:00:33 PM America/New_York */
@font-face {
    font-family: 'DustismoRegular';
    src: url('font/dustismo-webfont.eot');
    src: url('font/dustismo-webfont.eot?#iefix') format('embedded-opentype'),
         url('font/dustismo-webfont.woff') format('woff'),
         url('font/dustismo-webfont.ttf') format('truetype'),
         url('font/dustismo-webfont.svg#DustismoRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}


body {
	background-color: #252525;
	color:white;
	padding:0;
	margin:0;
}

div, body, ul{
	margin:0;
	padding:0;
}

#head {
	width:100%;
	height:255px;
}

#logo, #nav, #nav2, #nav3
{
	position:absolute;
	z-index: 3;
}
#nav
{
	margin-top:150px;
}

#nav2, #nav3
{
	margin-top:151px;
}

#logo {
	left:50%;
	margin-left: -500px;
}
img{
	border:none;
}

#nav {
	height:83px;
	width:800px;
	float:left;
	left: 50%;
	margin-left: -485px;
	z-index:10
}
#nav2 {
	height:83px;
	z-index:9;
	width:100%;
	Background-repeat:repeat-x;
	background-image: url("../img/menleiste_milchgl.png");
}

#nav3 {
	height:83px;
	z-index:8;
	width:100%;
	Background-repeat:repeat-x;
	background-image: url("../img/menleiste_dark.png");
}
#nav li{
	list-style-type: none;
	display:block;
	float:left;
	height:83px;
	
	background-repeat:no-repeat;
}

#nav li.home{
	width: 138px;
	background-image: url("../img/menu/home.png");
	background-position: 0px -166px;
}
#nav li.home:hover{
	background-position: 0px -83px;
}
#nav li.active
{
	background-position: 0px 0px !important;
}
#nav li.active:hover
{
	background-position: 0px 0px !important;
}

#nav li.projekte{
	width: 162px;
	background-image: url("../img/menu/projekte.png");
	background-position: 0px -166px;
}
#nav li.projekte:hover{
	background-position: 0px -83px;
}

#nav li.profil{
	width:118px;
	background-image: url("../img/menu/profil.png");
	background-position: 0px -166px;
}
#nav li:active{
	background-position: 0px 0px !important;
}
#nav li.profil:hover{
	background-position: 0px -83px;
}
#nav li.leistungen{
	width:208px;
	background-image: url("../img/menu/leistungen.png");
	background-position: 0px -166px;
}
#nav li.leistungen:hover{
	background-position: 0px -83px;
}
#nav li.kontakt{
	width:158px;
	background-image: url("../img/menu/kontakt.png");
	background-position: 0px -166px;
}
#nav li.kontakt:hover{
	background-position: 0px -83px;
}

#nav li a{
	height:83px;
	width:100%;
	display:block;
}

a {
	text-decoration: none;
}

#content {
	width: 960px;
	position:absolute;
	left:50%;
	margin-left: -480px;
	font-family: CallunaSansRegular, Arial;
	/*border: 1px solid orange;*/
	font-size: 1em;
	z-index:2;
}
#content h1 {
	font-weight:normal;
	font-family: DustismoRegular, Arial;
	margin: 0;
	font-size: 2em;
}

#content h2 {
	font-weight:normal;
	font-family: DustismoRegular, Arial;
	margin: 0;
}

img.border{
	border-radius: 3px;
	float:right; 
	padding: 3px; 
	background-color:grey;
}
.trennlinie{
	background-image: url("../img/trennlinie.png");
	background-repeat:no-repeat;
	display:block;
	width:458px;
	height:1px;
	padding: 10px 0px;
	background-position: left center;
}
#after_content{
	margin-bottom: 10px;
	width: 160px;
	color:grey;
	position:fixed;
	left:50%;
	z-index:5;
	margin-left: 320px;
	bottom:0px;
	text-align:right;
}
#content a, #after_content a {
	color: grey;
	text-decoration:underline;
}

#content a:hover, #after_content a:hover {
	text-decoration:none;
}

#after_content{
	padding: 5px;
	border-radius: 3px;
	background-color:#252525;
	opacity: 0.9;
}

#content a.imglink{
	text-decoration:none;
}

/*--- Formular ---*/
.form{
	width: 260px;
}
.form span.first{
	width: 140px;
	float:left;
}
form span.last{
	float:right;
	width:120px;
}
.error{
	background-color:#ff6e6e;
}
#loadingbar{
	display:none;
	position:absolute;
	left:50%;
	margin-left: -16px;
	top:50%;
	margin-top: -16px;
	width: 32px;
	height:32px;
	z-index: 999;
	background-image: url("../img/ajax-loader.gif");
	background-repeat:no-repeat;
}
/* Contao */

/* - - - Artikelliste - - - */

.artikellist h2 {
	font-weight:normal;
	font-family: DustismoRegular, Arial;
	margin: 0;
	font-size: 1.7em;
}
.artikellist .artikelhead h2 {
	font-weight:normal;
	font-family: DustismoRegular, Arial;
	margin: 0;
	font-size: 0.9em;
}
.artikellist h3 {
	font-weight:normal;
	font-family: DustismoRegular, Arial;
	margin: 0;
	font-size: 1.7em;
}
.artikellist {
	width: 650px;
	padding:20px 0;
}
.artikellist .left{
	float:left;
}
.artikellist .right{
	float:right;
}
.artikellist h2{
	display:inline-block;
	margin-right: 20px;
}
.artikellist .artikelinfo{
	padding: 0 20px;
	height: 15px;
	clear:both;
}

/* - - - Artikel - - - */

.artikel h3 {
	font-weight:normal;
	font-family: DustismoRegular, Arial;
	margin: 0;
	font-size: 1.7em;
}
.artikel .artikelhead h1 {
	font-family: DustismoRegular, Arial !important;
	font-size: 0.9em !important;
}
.artikel h2 {
	font-weight:normal;
	font-family: DustismoRegular, Arial;
	margin: 0;
	font-size: 1.7em;
}
.artikel {
	width: 650px;
	padding:20px 0;
}
.artikel .left{
	float:left;
}
.artikel .right{
	float:right;
}
.artikel h2{
	display:inline-block;
	margin-right: 20px;
}
.artikel .artikelinfo{
	padding: 0 20px;
	height: 15px;
	clear:both;
}
.artikelinfo a{
	color: white !important;
	text-decoration:none !important;
}
.artikelinfo a:hover{
	text-decoration:underline !important;
}
#background_2{
	position:fixed;
	width:1000px;
	opacity: 0.1;
	left:50%;
	margin-left:-500px;
	margin-top: 200px;
	height:100%;
	z-index:1;
}

.validcss{
	border:0;
	width:88px;
	height:31px;
}
.me {
	width: 250px;
}
ul.tutorial{
	margin-left:20px;
}