/* ######################################################################################################
** # "Yet Another Multicolum Layout" (c) by Dirk Jesse (http://www.yaml.de) #############################
** ######################################################################################################
**
**  YAML Version: 2.5.2
**  Dateiversion: 01.11.06
**  Datei       : base.css
**  Funktion    : Basis-Stylesheet
**
**  Don't make any changes in this file!
**  Any changes should be placed in basemod-files in css/modifications directory.
*/

@media all
{
/* ######################################################################################################
** ### main/base.css: Vorbereitende Maßnahmen | Reset ##################################################################
** ######################################################################################################
*/
        /* Hiermit werden die Randabstände und border aller HTML-Elemente auf Null gesetzt. Damit wird das
        ** Aussehen der Webseite in unterschiedlichen Browsern vereinheitlicht.
        */

        * { margin:0; padding: 0; }

        /* Das zurücksetzen der Innen- und Außenabstände verursacht zu kleine Selectboxen. Dies wird korrigiert */
        option {padding-left: 0.4em}

        /*
        ** Die nachfolgenden Angaben entstammen dem Artikel 'Useful Code Snippets' von Mike Foskett
        ** [http://www.websemantics.co.uk/tutorials/useful_css_snippets/]
        */

        /* Vertikalen Scrollbalken im Firefox erzwingen. Dies verhindert, dass zentrierte Layouts
        ** um 10 Pixel springen wenn der Seiteninhalt kleiner wird als die Höhe des Browserfensters. */
        html {
                height: 100%;
                scroll-behavior: smooth;
        }
        body {
                position: relative;
                min-height: 101%;
                color: #444; 
                font-size: 91.25%; 
                font-family: 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif;
                background-color: #F0EDE9;
                background-image: url(/assets/img/body_bg.png);
                background-repeat: repeat-x;
                background-position: left top;
                border-top-width: 4px;
                border-top-style: solid;
                border-top-color: #674A25;
                margin: 0px;
                padding: 0px;
                text-align: left;
        }

        fieldset, img { border:0; }

        /* Anpassung für Safari Browser. font-size:100% ist für den Safari in Formularen zu groß */
        select, input, textarea { font-size: 99% }

/* ######################################################################################################
** ### DIV-Container des Basislayouts ###################################################################
** ######################################################################################################
*/

        #header { position:relative }

        #topnav {
                position:absolute;
                top: 10px;
                left: 2em;
                color: #674A25;
                background: transparent;
                text-align: left; /* Erforderlich, damit im Opera 6 wirklich rechts plaziert ! */
        }

        #nav { clear:both; width: auto; }
        #main {  clear:both; width: auto; }


        #col1 {
                float: left;
                width: 200px; /* Standard-Wert, falls keine anderen Vorgaben gemacht werden */
        }

        #col2 {
                float:right;
                width: 200px; /* Standard-Wert, falls keine anderen Vorgaben gemacht werden */
        }

        #col3
        {
                width:auto;
                margin-left: 200px; /* Standard-Wert, falls keine anderen Vorgaben gemacht werden */
                margin-right: 200px; /* Standard-Wert, falls keine anderen Vorgaben gemacht werden */
        }

        #footer { clear:both; }        /* Backup für IE-Clearing */

        /* Der z-Index verhindert, dass im Falle des noch bestehenden IE-Bugs die Texte vor
        ** dem Spaltenhintergrund erscheinen. */
        #col1 {z-index: 3;}
        #col2 {z-index: 5;}
        #col3 {z-index: 1;}
        #col1_content {z-index: 4;}
        #col2_content {z-index: 6;}
        #col3_content {z-index: 2;}

        #col1_content, #col2_content, #col3_content { position:relative; }

/* ######################################################################################################
** ### Markupfreie CSS-Floatclearing-Lösungen ###########################################################
** ######################################################################################################
*/

        /* Clearfix-Methode zum Clearen der Float-Umgebungen */
         .clearfix:after {
                content: ".";
                display: block;
                height: 0;
                clear: both;
                visibility: hidden;
        }

        /* Diese Angabe benötigt der Safari-Browser zwingend !! */
        .clearfix { display: block; }

        /* Overflow-Methode zum Clearen der Float-Umgebungen */
        .floatbox { overflow:hidden; }

        /* IE-Clearing: Benötigt nur der Internet Explorer und über iehacks.css zugeschaltet */
        #ie_clearing { display: none }

/* ######################################################################################################
** ### IE-Clearing bis YAML V2.4 ########################################################################
** ######################################################################################################
**
** Die CSS-Definition des IE-Clearings, welches bis YAML 2.4 verwendet wurde, ist aus Gründen der
** Abwärtskompatibilität des Basis-Stylesheets weiterhin enthalten.
*/
        /* Clearen der 3 Inhaltsspalten mittels dieses speziellen hr-Tags */
        hr.clear_columns {
                clear: both;
                float: left;
                content: ".";
                display: block;
                height: 0;
                line-height: 0px;
                visibility: hidden;
                border: 0;
                padding: 0;
                margin: -1.1em 0 0 0; /* erforderlich damit kein Leerraum zwischen Spalten und Footer entsteht */
        }

/* ######################################################################################################
** ### Standard-Formatierungen für Listen & Zitate ######################################################
** ######################################################################################################
*/

        ul, ol, dl { margin: 0 0 1em 1em }
        li { margin-left: 1.5em; line-height: 1.5em; }
        li { list-style-type: square; }

        dt { font-weight: bold; }
        dd { margin: 0 0 1em 2em; }

        blockquote, cite { margin: 0 0 1em 1.5em; font-size: 0.93em; width: auto;}
        code { font-size: 1.25em; }

/* ######################################################################################################
** ### Subtemplates #####################################################################################
** ######################################################################################################
*/

        .subcolumns {
                width: 100%;
                padding: 0 1px 0 1px;
                margin: 0 -1px 0 -1px;
                overflow:hidden;
        }

        .c50l, .c25l, .c33l, .c38l, .c66l, .c75l, .c62l {float: left; overflow: hidden;}
        .c50r, .c25r, .c33r, .c38r, .c66r, .c75r, .c62r {float: right; overflow: hidden;}

        .c25l, .c25r { width: 24.999%; }
        .c33l, .c33r { width: 33.333%; }
        .c50l, .c50r { width: 49.999%; }
        .c66l, .c66r { width: 66.666%; }
        .c75l, .c75r { width: 74.999%; }
        .c38l, .c38r { width: 38.196%; } /* Goldener Schnitt */
        .c62l, .c62r { width: 61.803%; } /* Goldener Schnitt */

        .subc  { padding: 0 0.5em 0 0.5em; overflow: hidden; }
        .subcl { padding: 0 1em 0 0; overflow: hidden; }
        .subcr { padding: 0 0 0 1em; overflow: hidden; }
}


/* ######################################################################################################
** ### Skiplink-Navigation ##############################################################################
** ######################################################################################################
*/
@media all {
    .skip {
        position: absolute;
        left: -1000em;
        width: 20em;
    }
}

/* ######################################################################################################
** ### modifications/basemod.css ##################################################################
** ######################################################################################################
*/
@media all
{
/* Hier kann ein umlaufender Rand um die gesamte Webseite erzeugt werden */
#page {
        width: 875px;
        margin-top: 0px;
        margin-right: auto;
        margin-bottom: 0px;
        margin-left: auto;
        background-color: #F8F5F3;
        border-right-width: 2px;
        border-left-width: 2px;
        border-right-style: solid;
        border-left-style: solid;
        border-right-color: #D5CCC2;
        border-left-color: #D5CCC2;
}
#page_margins {
        min-width: 802px;
        max-width: 100em;
        margin:auto;
        background-image: url(/assets/img/page_margins_bg.png);
        background-repeat: repeat-x;
        background-position: left bottom;
}

/* Formatierung der Kopfbereiches */
#header {
        height: 155px;
        color: #674A25;
        background-image: url(/assets/img/head_bg.gif);
        background-repeat: no-repeat;
        background-position: left top;
}
#header #titel {
        position: relative;
        display: inline-block;
        height: 189px;
        width: 322px;
        font-size:208%;
        margin-top: 85px;
        margin-right: 0;
        margin-bottom: 0;
        margin-left: 0;
        background-image: url(/assets/img/erbe_auftrag_titel_2.png);
        background-repeat: no-repeat;
        background-position: left bottom;
}
#header #titel a {
        position: relative;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 899;
        background: transparent;
}
#header #titel a:hover {
        text-decoration: none;
}
#header #cover img {
        position: relative;
        z-index: 10;
        width: 133px;
        height: 187px; 
        margin: 10px 0 0 135px;
        border: 1px solid #674a25;
}
#header #subtitle,
#header #toggle {
        display: none;
}

/* Formatierung der Fußzeile */
#footer_margin {
        color: #D3B187;
        margin: 0;
        line-height: 2em;
        background-color: #674A25;
        border: 2px solid #362714;
        height: auto;
        padding-top: 0;
        padding-bottom: 0;
}
#footer {
        width: 875px;
        height: auto;
        margin-right: auto;
        margin-left: auto;
        text-align: left;
        padding: 20px 20px 10px 20px;
        background-color: #5E4322;
        box-sizing: border-box;
}
/* ######################################################################################################
** ### Formatierung der Inhaltsspalten ##################################################################
** ######################################################################################################
*/
#main { /*background: #fff;*/ padding: 1em 0; }

/* linke Spalte */
#col1 {
        width: 22.5%; }
#col1_content {
        margin-left: 1em;
        margin-right: 1em;
        color: #444;
        background:inherit;
}

/* Rechte Spalte */
#col2 {
        width: 280px;
}
#col2_content {
        margin-left: 1.6em;
        margin-right: 1em;
}

/* Mittlere Spalte */
#col3 {
        margin-left: 22.5%;
        margin-right: 320px;
        border-left: 0px dotted #ddd;
        border-right: 0px dotted #ddd;
        background-image: url(/assets/img/col3_bg_streifen.gif);
        background-repeat: repeat-y;
        background-position: right top;
}

#col3_content {
        margin-left: 2em;
        margin-right: 2em;
        padding-top: 135px;
}
}

/* ######################################################################################################
** ### modifications/basemod_2col_right_vlines.css ##################################################################
** ######################################################################################################
*/
@media screen
{
/* Rechte Spalte mit fester Breite von 250 Pixeln */
#col2 { width: 250px; }

/* Abschalten der linken Spalte */
#col1 { display:none; }
#col1_content { display:none; }
#col3 { margin-left:0px; border-left:0; }

/* Hintergrund für rechte Spalte */
#col3 { margin-right: 0; border-right: 250px #E8502E solid; }

/* Randabstände anpassen */
#main { padding: 0; }

} 

/* ######################################################################################################
** ### navigation/nav_vlist.css ##################################################################
** ######################################################################################################
*/
@media all
{
/* ######################################################################################################
** ### Vertikale Listennavigation #######################################################################
** ######################################################################################################
*/
	#submenu,
        .submenu-service {
	width: 100%;
	overflow: hidden;
	list-style-type: none;
	margin-top: 1.4em;
	margin-right: 0;
	margin-bottom: 1.5em;
	margin-left: 0;		
	}

        .submenu-service {
        display: none;
        }

	#submenu a,
        .submenu-service a { 
        display:block;
        text-decoration: none; 
        }

	#submenu li,
        .submenu-service li {
	float:left;
	width: 100%;
	margin:0;
	padding: 0;
        }

	#submenu li span,
        .submenu-service li span {
	display:block;
	width: 90%;
	padding: 3px 0px 3px 10%;
	color: #fff;
	font-weight: bold;
	background-image: url(/assets/img/ustrich2.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	}
	
	#submenu li a,
        .submenu-service li a { 
	width: 90%; 
	padding: 3px 0px 3px 10%; 
	color: #fff; 
	background-image: url(/assets/img/ustrich1.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	}

	#submenu li a:hover,
        .submenu-service li a:hover {
        background-color: #E8502E;
	color: #fff;
	font-weight: bold;
        text-decoration: none;
        }
	
	#submenu li ul { 
        list-style-type: none; margin:0; padding: 0; 
        }

	#submenu li ul li {
	float:left;
	width: 100%;
	margin:0;
	padding:0;
        }

	#submenu li ul li a {
	width: 80%;
	padding: 3px 0px 3px 20%;
	color: #fff;
	background-image: none;
	}

	#submenu li ul li a:hover { 
        color: #fff; font-weight: bold; 
        }
	
	/*#submenu li#title { 
		width: 90%; 
		padding: 3px 0px 3px 10%; 
		font-weight: bold; 
		color: #444; 
		background-color: #fff; 
		border-bottom: 4px #888 solid; 
	}*/
	
	#submenu li#active
        .submenu-service li#active-service {
	width: 90%;
	font-weight: bold;
	color: #fff;
	padding-top: 3px;
	padding-right: 0px;
	padding-bottom: 3px;
	padding-left: 6px;
	}
	
	#submenu li ul li#active {
	width: 80%;
	font-weight: bold;
	color: #fff;
	padding-top: 3px;
	padding-right: 0px;
	padding-bottom: 3px;
	padding-left: 6px;
	}
}

/* ######################################################################################################
** ### main/content.css ##################################################################
** ######################################################################################################
*/
@media all
{
/* ######################################################################################################
** # Standard-Vorgaben ##################################################################################
** ######################################################################################################
**

/* ### Überschriften, Fließtexte ###################################################################### */
h1,h2,h3,h4 { font-family: 'Trebuchet MS', Verdana, Helvetica, Arial, sans-serif; font-weight:normal;}

h1 {font-size: 1.6em; color: #E8502E; margin: 0 0 0.25em 0; padding-top: 1.5em; }
h2 {
        font-size: 1.4em;
        color: #E8502E;
        margin: 0 0 0.25em 0;
        padding-top: 1.5em;
        border-bottom-width: 2px;
        border-bottom-style: solid;
        border-bottom-color: #D5CCC2;
}
h3 {font-size: 1.2em; color: #E8502E; margin: 0 0 0.25em 0; padding-top: 1.5em; font-weight:bold; }
h4 {font-size: 1em; color: #674A25; margin: 0 0 0.30em 0; padding-top: 1em; font-weight:bold; border-bottom: 1px #D5CCC2 solid;}
h5 {font-size: 1em; color: #674A25; margin: 0 0 0.30em 0; font-style:italic; }
h6 {font-size: 1em; color: #674A25; margin: 0 0 0.30em 0; font-style:italic; }

p,ul,dd,dt, article div { line-height: 1.5em; }
p { line-height: 1.5em; margin: 0 0 1em 0; }

strong,b { font-weight: bold; }
em,i { font-style:italic; }

hr {
        color: #D5CCC2;
        background:transparent;
        margin: 0 0 0.5em 0;
        padding: 0 0 0.5em 0;
        border:0;
        border-bottom: 1px #D5CCC2 solid;
}

acronym, abbr {
        letter-spacing: .07em;
        border-bottom: 1px dashed #c00;
        cursor: help;
}

.alt0 {
        font-size: 0.9em;
}

/* ### Bildpositionierung ############################################################################ */

img.float_left { float: left; margin-right: 1em; margin-bottom: 0.15em; border:0; }
img.float_right { float: right; margin-left: 1em; margin-bottom: 0.15em; border:0; }
img.center { text-align:center; background: #fff; padding: 4px; border:1px #ddd solid; }
img.framed {
        padding:3px;
        border: 1px #ddd solid;
        background-color: #FFFFFF;
}

/* ### Auszeichnung lokaler und Externer Links ######################################################## */
a {color: #E8502E; text-decoration:none;}
a:hover {background-color: #F8F5F3; text-decoration:underline;}
a:focus {background-color: #F8F5F3; text-decoration:underline;}

#topnav a { color: #674A25; background:transparent; text-decoration:none; }
#topnav a:hover { text-decoration:underline; background-color: transparent;}
#topnav a:focus { text-decoration:underline; background-color: transparent;}

#footer h1 {
        font-size: 1.6em;
        color: #D3B187;
        padding-top: 1em;
        margin-top: 0;
        margin-right: 0;
        margin-bottom: 0.25em;
        margin-left: 0;
}
#footer h4 {
        color: #D3B187;
        line-height: normal;
        border-top-style: none;
        border-right-style: none;
        border-bottom-style: none;
        border-left-style: none;
        text-transform: uppercase;
}
#footer a {
        color: #E3DDD7;
        text-decoration: none;
}
#footer a:hover {
        text-decoration: underline;
        background-color: #5E4322;
}
#footer a:focus {
        text-decoration: underline;
        background-color: #5E4322;
}

#main a[href^="http:"]
{
        padding-left: 12px;
        background-image: url('/assets/img/icons/ext_link.gif');
        background-repeat: no-repeat;
        background-position: 0 0.45em;
}

/* ######################################################################################################
** ### Formulare #############################################################################
** ######################################################################################################
*/

form {overflow:hidden;}

input, textarea {
    width: auto;
        border: 1px #ccc solid;
    background: #fafafa;
        padding: 3px;
        color: #777;
}

input[type=text]:focus, textarea:focus {
        background: #f0f0f0;
        color: #333;
        border-color: #666;
}

/* ######################################################################################################
** ### Spezielle Formatanweisungen des YAML-Standard-Layouts ############################################
** ######################################################################################################
*/

/* ###  Textformatierungen ################################################################## */

/* Grundlagen */
.wichtig { background-color: #FCE9E4; border: 1px solid #F4B0A2; padding: 0.2em; margin-bottom: 0.5em; }
.hinweis { background-color: #E0DAD2; border: 1px solid #D5CCC2; padding: 0.2em; margin-bottom: 0.5em; }

blockquote {
        color: #444;
        padding: 1em 1em 0 1em;
        margin: 0 0 1em 1em;
        background-color: #F0EDE9;
        border-top-width: 1px;
        border-right-width: 1px;
        border-bottom-width: 1px;
        border-left-width: 8px;
        border-top-style: solid;
        border-right-style: solid;
        border-bottom-style: solid;
        border-left-style: solid;
        border-top-color: #D5CCC2;
        border-right-color: #D5CCC2;
        border-bottom-color: #D5CCC2;
        border-left-color: #D5CCC2;
}

/* Ungeordnete Listen ohne Listenpunkt */
ul.linklist { list-style-type: none; margin: 0 0 1em 0; }
ul.linklist li { margin: 0 0 1em 0; }

/* Browser-Kompatibilitätsliste */
ul.browsers { margin: 0  0 .4em 0; }

ul.browsers li {
        margin: 0;
        list-style-type: none;
        color: #444;
        padding: 0.1em 0.1em 0.2em 0.5em;
        font-weight: normal;
        text-align: left;
        border-bottom: 1px #fff solid;
        border-right: 1px #fff solid;
        background-color: #E0DAD2;
}

ul.browsers li img { vertical-align:bottom;
}

ul.browsers li.title {
        font-weight: bold;
        color: #FFFFFF;
        padding: 0.2em 0.2em 0.2em 0.5em;
        background-color: #88765E;
}
}
span.link {color: #E8502E;}

/* ######################################################################################################
** ### print/print.css ##################################################################
** ######################################################################################################
*/
@media print
{
body * {font-size: 12pt; font-family: "Times New Roman", Times, serif; }
blockquote { font-family: "Times New Roman", Times, serif; }

h1 {font-size: 16pt; font-weight:bold; color: #E8502E;  background:inherit;  margin:0.4em 0 0.5em 0; border-bottom: 1px #ccc solid;}
h2 {font-size: 14pt; font-weight:bold; color: #666; background: inherit;   margin:0.2em 0 0.5em 0; padding: 0.3em; }
h3 {font-size: 12pt; font-weight:bold; margin:0.4em 0 0.3em 0;}

/* Vermeidung von Seitenumbrüchen direkt nach einer Überschrift */
h1,h2,h3 { page-break-after:avoid; }

abbr[title]:after, acronym[title]:after { content: '(' attr(title) ')'; }

/* Sichtbare Auszeichnung der URLs von Links */
#col3 a[href^="http:"], #col3 a[href^="https:"], 
#col1 p a[href^="http:"], #col1 p a[href^="https:"],
#col2 p a[href^="http:"], #col2 p a[href^="https:"]
{
	padding-left: 0;
	background-image: none;
}

a[href]:after {
 content:" <URL: "attr(href)">";
 color:#444;
 background-color:inherit;
 font-style:italic;
} 

/* Umformatierung der Layoutboxen */
body {margin:0; padding: 0;}
#page_margins, #page {min-width: inherit; margin:0; padding: 0; border: 0; } 
#topnav {display: none;}

#header {
	display: none;
}
#header img {position:relative; top:0; left:0; padding:0; }
ul#submenu {display:none;}
#teaser { margin: 1em 0 0 0; padding: 0; border:0; }

#main {margin: 0; padding: 0;}

form {overflow:visible;}
.subcolumns {width: auto; margin: 0; padding: 0; overflow:visible;}
.c50l {float:none; width: auto; margin: 0; padding: 0; overflow:visible;}
.subcl {width: auto; margin: 0; padding: 0; overflow:visible;}

#col1 {display:none;}
#col1_content {display:none;}

#col2 {display:none;}
#col2_content {display:none;}

#col3 { margin:0; padding: 0; border:0; }
#col3_content {margin:0; padding: 0; border:0; }

#footer {display: none;}

}