/* ===================================
Stylesheet zur Formatierung am Bildschirm
Datei: bildschirm.css 
Datum: 2010-07-03
=================================== */
@media screen {

/* ======================================
   1. Allgemeine Styles
   ====================================== */

body {
	background-color: #f0ddbf;
	color: #844c95;
	font-family:"Gill Sans", Arial, Verdana, Helvetica, sans-serif;
}
/* Bildlaufleiste im Firefox immer zeigen */
html { height: 101%; }

h1 {
	padding: 0; 
	margin: 0; 
}
/* Hyperlinks */
a { text-decoration: none; outline: none;} 
a:link {
	color: #844C95;
} 
a:visited {
	color: #844C95;
}
a:hover, 
a:focus {

}
a:active {
	color: #844C95;
	background-color: #F0DDBF;
}
/* Rahmen um verlinkte Bilder entfernen */
a img {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

/* Allgemeine Klassen und IDs */
#logo-vft {
	padding: 0px;
	margin-left: 40px;
	margin-bottom: 60px;
}

/* ==================================== 
   2. Styles für die  Layoutbereiche 
   ==================================== */

#rahmen {
	background: #f0ddbf;
	color: black;
	width: 990px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;
}

#kopfbereich {
	background: #f0ddbf;
	color: black;
	padding-top: 20px;
	padding-bottom: 10px;
	padding-left: 20px;
	padding-right: 60px;
}
#kopfbereich h1 {
	display: none;
}

#praxis{
	float: left;
	width: 810px;
	text-align: right;
	color: #844C95;
	margin-right: 10px;
	padding-top: 5px;
	padding-right: 20px;
	padding-bottom: 5px;
	padding-left: 5px;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #844C95;
	font-size: 18px;
	font-weight: normal;
}

#dahlen{
	color: #844C95;
	float: left;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	padding-left: 10px;
	font-size: 18px;
}
#position {
	text-align: right;
	color: #844C95;
	padding-top: 5px;
	padding-right: 20px;
	padding-bottom: 5px;
	padding-left: 5px;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #844C95;
	font-size: 48px;
	font-style: italic;
	font-weight: normal;
	margin-right: 153px;
}
#bild-elke-wittwer{
	border:3px solid #844c95;
	float:left;
	margin-right: 20px;
}
#bild-kopfbereich{
	float:left;
	border: 3px solid #844c95;
}

/*=================================
   3. Formatierung der Navigation
=================================*/
#navigationsbereich {
	float: left;
	width: 330px;
}
#navigationsbereich ul {
	padding-left: 0px;
}
#navigationsbereich li {
	list-style-type: none;
	font-size: 28px;
	font-style: italic;
	display: block;
	font-weight: normal;
	margin-top: 10px;
	margin-bottom: 10px;
	text-indent: 5px;
}
#navigationsbereich a {
	font-weight: normal;
	text-decoration: none;
	color: #844c95;
	display: block;
	margin: 0px;
	padding-right: 10px;
	padding-left: 10px;
}
#startseite #navigation01,
#person #navigation02,
#leistungen #navigation03,
#seminare #navigation04,
#seminarbeschreibung #navigation04,
#kontakt #navigation05  {
	border-left-width: 2px;
	border-left-style: solid;
	border-left-color: #844C95;
}

#startseite #navigation02 a:hover,
#startseite #navigation03 a:hover,
#startseite #navigation04 a:hover,
#startseite #navigation05 a:hover{
	border-left-width:2px;
	border-left-style:solid;
	border-left-color:#844c95;
	padding-left: 0px;
	text-indent: 13px;
}
#person #navigation01 a:hover,
#person #navigation03 a:hover,
#person #navigation04 a:hover,
#person #navigation05 a:hover{
	border-left-width:2px;
	border-left-style:solid;
	border-left-color:#844c95;
	padding-left: 0px;
	text-indent: 13px;
}
#leistungen #navigation01 a:hover,
#leistungen #navigation02 a:hover,
#leistungen #navigation04 a:hover,
#leistungen #navigation05 a:hover{
	border-left-width:2px;
	border-left-style:solid;
	border-left-color:#844c95;
	padding-left: 0px;
	text-indent: 13px;
}
#seminare #navigation01 a:hover,
#seminare #navigation02 a:hover,
#seminare #navigation03 a:hover,
#seminare #navigation05 a:hover{
	border-left-width:2px;
	border-left-style:solid;
	border-left-color:#844c95;
	padding-left: 0px;
	text-indent: 13px;
}
#seminarbeschreibung #navigation01 a:hover,
#seminarbeschreibung #navigation02 a:hover,
#seminarbeschreibung #navigation03 a:hover,
#seminarbeschreibung #navigation05 a:hover{
	border-left-width:2px;
	border-left-style:solid;
	border-left-color:#844c95;
	padding-left: 0px;
	text-indent: 13px;
}
#kontakt #navigation01 a:hover,
#kontakt #navigation02 a:hover,
#kontakt #navigation03 a:hover,
#kontakt #navigation04 a:hover{
	border-left-width:2px;
	border-left-style:solid;
	border-left-color:#844c95;
	padding-left: 0px;
	text-indent: 13px;
}

/* ==============================================
   05 Patches für IE5.x und 6
   ============================================== */
/* IE 5.x und 6: hasLayout für Hyperlinks */ 
* html #navigationsbereich ul, 
* html #navigationsbereich a, 
* html #navigationsbereich strong {
   height: 1%;  /* oder 1px oder irgendeinen anderen Wert */ 
}
/* Für IE 5.x (für IE 6 stört es nicht) */
* html #navigationsbereich li {
   float: left; 
   width: 100%; 
}
/*=================================================
   6. Textbereich formatieren
==================================================*/

#textbereich {
	background-color:#f0ddbf;
	padding-top: 20px;
	color: #844C95;
	margin-right: 153px;
	text-align: right;
}

#textbereich ul {
	color: #375a2f;
	text-align: right;
	margin-right: 15px;
}
#textbereich li {
	list-style-type: circle;
}
#textbereich p {
	padding-right: 20px;
	font-size: 14px;
}
#leistungen #textbereich p {
	padding-right: 20px;
	font-size: 24px;
	color: #375a2f;
}
#leistungen #textbereich .preis{
	font-size: 16px;
	color: #375a2f;
	margin-top: -20px;
}
#seminarbeschreibung #textbereich .preis {
	font-size: 14px;
	font-style:italic;
	color: #375a2f;
	margin-top: -20px;
}

#seminarbeschreibung #textbereich .seminarinhalt {
	font-size: 18px;
	font-style:italic;
	color: #375a2f;
}
#kontakt #textbereich .imp-16-g {
	font-size: 16px;
	font-style: italic;
	color: #375a2f;
}
#kontakt #textbereich .imp-16-r {
	font-size: 16px;
	font-style: italic;
	color: #844C95;
}
#kontakt #textbereich .imp-18-g {
	font-size: 18px;
	font-style: italic;
	color: #375a2f;
}
#kontakt #textbereich .imp-18-r {
	font-size: 18px;
	font-style: italic;
	color: #844C95;
}
#kontakt #textbereich .imp-24-g {
	font-size: 24px;
	font-style: italic;
	color: #375a2f;
}

/*   Ueberschriften in den Textbereichen   */
#textbereich h2 {
      padding-top: 0; 
   }
#textbereich h3 {
	float: right;
	border-right-width: 3px;
	border-right-style: solid;
	border-right-color: #844C95;
	color: #844C95;
	font-size: 48px;
	padding: 5px;
	display: block;
	margin: 5px;
	font-style: italic;
	font-weight: normal;
}
#textbereich h4 {
	color: #844C95;
	font-size: 36px;
	font-weight: normal;
	font-style: italic;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #844C95;
	text-align: right;
	padding-right: 15px;
	margin-top: 35px;
	margin-bottom: -5px;
}
#textbereich h5 {
	color: #844C95;
	font-size: 24px;
	font-weight: normal;
	font-style: italic;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #844C95;
	text-align: right;
	padding-right: 15px;
	margin-top: 35px;
	margin-bottom: -5px;
}
#textbereich h6 {
	color: #844C95;
	font-size: 18px;
	font-weight: normal;
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #844C95;
	text-align: right;
	padding-right: 15px;
	margin-top: 30px;
	margin-bottom: -20px;
}
#textbereich h5 span{font-size:18px;}
/*grosse Button werden wie Ueberschriften behandelt*/
.button-seminare {
	border-right-width: 2px;
	border-right-style: solid;
	border-right-color: #844C95;
	padding-right: 15px;
	margin-top: 35px;
	margin-bottom: -5px;
}

/* Verweise in den Textbereichen*/

#textbereich a {
	color: #844C95;
	font-style: italic;
	letter-spacing: 1px;
   }
#textbereich a:hover,
#textbereich a:focus {
	color: #575757;
	letter-spacing: 1px;
	font-style: italic;
   }
#textbereich hr {
	color: #D5D5D5;
	margin-top: 5px;
	margin-bottom: 10px;
	margin-right: 5px;
	margin-left: 5px;
}

/*================================
   7. Fussbereich und Zitate
=================================*/

#fussbereich {
	background-color: #f0ddbf;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 5px;
	padding-left: 20px;
	clear: both;
}

/*=================================
   Zitate und Sprueche
==================================*/

#startseitenspruch {
	font-size: 24px;
	font-style: italic;
	letter-spacing: 3px;
	padding-top: 20px;
	padding-right: 30px;
	color: #844C95;
	margin-top: 100px;
	border: 2px solid #844c95;
	padding-bottom: 20px;
	padding-left: 20px;
	float: left;
	margin-right: 100px;
}
#personspruch {
	font-size: 18px;
	font-style: italic;
	letter-spacing: 1px;
	padding-top: 20px;
	padding-right: 30px;
	float: left;
	color: #844C95;
	border: 2px solid #844c95;
	padding-bottom: 20px;
	padding-left: 20px;
	text-align: right;
	margin-top: 20px;
	margin-left: 105px;
}
#leistungenspruch {
	font-size: 26px;
	font-style: italic;
	letter-spacing: 2px;
	padding-top: 20px;
	padding-right: 30px;
	float: left;
	color: #844C95;
	border: 2px solid #844c95;
	padding-bottom: 20px;
	padding-left: 20px;
	text-align: right;
	margin-top: 30px;
	margin-left: -10px;
	margin-right: 50px;
}
#seminarespruch  {
	font-size: 24px;
	font-style: italic;
	letter-spacing: 1px;
	float: left;
	color: #844C95;
	border: 2px solid #844c95;
	margin-left: 130px;
	padding: 20px;
}
#kontaktspruch {
	font-size: 24px;
	font-style: italic;
	letter-spacing: 1px;
	color: #844C95;
	border: 2px solid #844c95;
	width: 770px;
	text-align: right;
	padding: 20px;
	margin-top: 0px;
}
#seminarbeschreibungsspruch {
	font-size: 18px;
	font-style: italic;
	letter-spacing: 1px;
	padding-top: 20px;
	padding-right: 30px;
	float: left;
	color: #844C95;
	border: 2px solid #844c95;
	padding-bottom: 20px;
	padding-left: 20px;
	width: 700px;
	margin-top: 90px;
}

#bild-fussbereich{
	float: right;
}

/* ==================================== 
   8. Sonstige Styles 
   ==================================== */

/* Das Kontaktformular */
form {
   background-color: #eee;
   width: 370px; /* Breite des Formulars */ 
   padding: 20px; 
   border: 1px solid #8c8c8c;
}
/* Beschriftung auf eigener Zeile */
label { 
   display: block; 
   cursor: pointer; 
} 
input#absender, 
textarea { 
   width: 300px;
   border: 1px solid #8c8c8c;
   margin-bottom: 1em;
}
textarea { 
   height: 7em; 
}
input#absender:focus, 
textarea:focus {
   background-color: #d9d9d9; 
}

/*========================================
   9. Text nach Bild 
=========================================*/
.bildlinks {
	float: left;
	padding: 3px;
	margin-right: 10px;
}

/*============================================
   10. Termingestaltung der Seminare und Workshops
=============================================*/

#seminare #rahmen #textbereich .info {
	float: right;
	margin-right: 10px;
}
#seminare #rahmen #textbereich .anmeldung {
	float: right;
	margin-right: 10px;
}
#seminare #rahmen #textbereich .datum {
	float: right;
	margin-right: 10px;
	width: 105px;
}
#seminare #rahmen #textbereich .beschreibung {
	float: right;
	width: 380px;
}
#seminare #rahmen #textbereich .geschlossen {
	margin-right: 15px;
	padding-bottom: 5px;
	font-size: 14px;
}
#seminare #rahmen #textbereich .offen {
	margin-right: 15px;
	padding-bottom: 5px;
	font-size: 14px;
	color: #375a2f;
}

/* ==================================
   ENDE DES STYLESHEETS 
   =============================== */   

} /* Ende @media screen - nicht löschen! */
