﻿/**
 *	Layout. Anweisungen zu Breiten, Abständen und dem Verhalten
 *
 *	@project Vorlagengestalter Typolight Template
 *	@copyright	Copyright (c) 2009 by Leonid Lezner
 *	@link	http://www.leolezner.de
 *	@date	2009-02-18
 *	@lastmodified	2009-02-18
 *	@versoin 0.1
 */


/**
 *	Hauptcontainer
 *
 *	@section main container
 */

html {
	height: 102%;
}

/*	Der Inhalt der Seite ist in diesem Div	*/
#page {

}

#header_container, #header, #middle_container, #middle, #footer_container, #footer {

}

/*	Container für die ganze Seite, Breite hier einstellen	*/
.wrapper, #middle_container .auxwrapper {
	margin: 0 auto;
	width: 980px;
	padding: 0 10px 0 10px;
}

/*	Container für den Mittelbereich	*/
#middle_container .wrapper {
	padding: 0;
	width: 1000px;
}

/*	Kopfbereich	*/
#header {
	height: 95px;
}

/*	Mittelteil. ACHTUNG! Ebenfalls in vg_ie_hacks.css verändern	*/
#middle {
	min-height: 700px;
}

/*	Drei Bereiche im Mittelteil	*/
#left, #right, #main {
	float: left;
}


/*	Fusszeile	*/
#footer {
	padding-top: 30px;
	text-align: right !important;
}


/*	Div in der Fusszeile	*/
#footer .copyright {
	padding-right: 30px;
	padding-bottom: 1em;
}



/**
 *	Layouts
 *
 *	@section layouts
 *
 *	| M | = col1
 *	| L | M | = col12
 *	| L | M | R | = col123
 *	| M | R | = col23
 *
 */

/*	1 Spalte. Mitte	*/
.col2 #main {
	width: 100%;
}

/*	2 Spalten. Mitte	*/
.col12 #main {
	width: 80%;
}

/*	2 Spalten. Mitte	*/
.co23 #main {
	width: 75%;
}

/*	3 Spalten. Mitte	*/
.col123 #main {
	width: 55%;
}

/*	2 Spalten. Links	*/
.col12 #left {
	width: 20%;
}

/*	3 Spalten. Links	*/
.col123 #left {
	width: 20%;
}

/*	2 Spalten. Rechts	*/
.col23 #right {
	width: 25%;
}

/*	3 Spalten. Rechts	*/
.col123 #right {
	width: 25%;
}





/**
 *	Innenabstände
 *
 *	@section paddings
 *
 */

/*	Innenabstand für alle Spalten	*/
.col2 .inner, .col12 .inner, .col123 .inner, .col23 .inner {
	padding: 10px;
}



/*	Drei Bereiche im Mittelteil	*/
#main .inner {
	padding-left: 2em;
	padding-right: 2em;
}

#left .inner {
	padding-left: 1.5em;
	padding-right: 0;
}


.col12 #main .inner {
	padding-right: 30px;
}



/**
 *	Navigation
 *
 *	@section navigation
 *
 */


/*	Hauptmenu	*/
#mainmenu {
	float: left;
	/*margin-bottom: 110px;	*/
	width: 100%;
}

/*	Hauptmenu, Innencontainer	*/
#mainmenu .block {
	float: right;
	padding-right: 16px;
	height: 30px;
}

/*	Hauptmenu, Link	*/
#mainmenu .block li a {
	display: block;
	height: 30px;
	line-height: 30px;
	margin-right: 2px;
	padding: 0 0 0 12px;
}

/*	Hauptmenu, Link, Span	*/
#mainmenu .block li a span {
	display: block;
	padding: 0 12px 0 0;
}



/*	Vertikale Navigation. 	*/
.vnavigation {
	margin-top: 2.8em;
}

/*	Vertikale Navigation. Liste	*/
.vnavigation ul li, .vnavigation ul {
	margin: 0;
	padding: 0;
}

/*	Vertikale Navigation. Link. Normal	*/
.vnavigation ul li a {
	display: block;
	padding: 7px 3px 7px 16px;
}

/*	Vertikale Navigation. Link. Aktiv, Normal	*/
.vnavigation ul li.active a {

}

/*	Vertikale Navigation. Link. MouseOver	*/
.vnavigation ul li a:hover {

}

/*	Vertikale Navigation. Liste	des Untermenus. 2. Ebene	*/
.vnavigation ul.level_2 a {
	padding-left: 20px;
}

/*	Vertikale Navigation. Liste	des Untermenus. 3. Ebene	*/
.vnavigation ul.level_3 a {
	padding-left: 26px;
}



.vnavigation span {
	display: block;
}



/*	Menu über dem Header	*/
#topmenu a {
	display: block;
	height: 29px;
	line-height: 29px;
	padding-left: 16px;
}

/*	Menu über dem Header. Span	*/
#topmenu a span {
	display: block;
	padding-right: 16px;
}

#fader {
	clear: both;
	height: 100px;
	margin-bottom: 50px;
	text-align: right;
	padding: 10px 30px 0 30px;
	cursor: default;
}

#fader h2{
	display: inline;
}




/**
 *	Formulare
 *
 *	@section forms
 *
 */

/*	Form	*/
ol.form_elements {
	padding: 0 !important;
	margin: 0 !important;
}

/*	Listenelemente des Formulars	*/
ol.form_elements li {
	margin: 0 0 0.5em 0 !important;
	padding: 0 0 0.5em 0 !important;
}

/*	Liste mit Formelementen, Label	*/
ol.form_elements li label {
	float: left;
	padding-left: 3px;
	width: 14em;
}

/*	Liste mit Formelementen, nur der Button o.ä.	*/
ol.form_elements li .only_input {
	margin-left: 14em;
	padding-left: 4px;
	padding-top: 0.5em;
}

/*	Liste mit Formelementen, Textfeld und Textarea	*/
ol.form_elements li .text, ol.form_elements li .textarea, ol.form_elements li .captcha {
	padding: 2px;
}

/*	Liste mit Formelementen, Textfeld	*/
ol.form_elements li .text, ol.form_elements li .captcha  {
	width: 17em;
}

/*	Liste mit Formelementen, Button	*/
ol.form_elements li .submit {
	padding: 0.2em 1em;
}

/*	Liste mit Formelementen, Button	*/
ol.form_elements li label.mandatory {

}

/*	Container mit Fehlern	*/
#middle .vg_warnings {
	margin-bottom: 1em;
}

/*	Container mit einer Fehlerbeschreibung	*/
#middle .vg_warnings .error{
	color: #fb0000;
}





/**
 *	Listen
 *
 *	@section lists
 *
 */


/*	Liste	*/
#main ul {
	padding-bottom: 0.5em;
	margin: 0;
}

/*	Listenelement	*/
#middle #main li {
	margin: 0;
	padding-left: 1.5em;
}




/**
 *	Bilder
 *
 *	@section images
 *
 */

/*	Bilder	*/
#main img {

}



/**
 *	Typo
 *
 *	@section typo
 *
 */

/*	Seitenüberschrift mit dem Logo	*/
#header h1 {
	height: 100%;
	margin: 0;
	padding: 0;
	width: 40%;
}

/*	Link in der Seitenüberschrift	*/
#header h1 a {
	display: block;
	height: 100%;
}

h1 {
	margin-top: 0;
}


h5 {
	margin-bottom: 1em;
	margin-top: 1em;
}

.invisible {
	display:none;
}