html, body {
    height:  100%;
    margin:  0;
    padding: 0;
}

body {
    background-color: #E0E0FF;
    font-family:      Arial,Verdana,Helvetica,sans serif;
    font-size:        100%;
    line-height:      1em;
    color:            #000080;
}

#container {
    max-width: 1200px;
    margin:    0 auto;
}

/**
 * Allgemeine Einstellungen
 */
a:link {
    text-decoration: underline;
    color:           #222222;
}

a:visited {
    text-decoration: underline;
    color:           #222222;
}

a:hover {
    text-decoration: none;
    color:           #FF0000;
}

a:active {
    text-decoration: none;
    color:           #FF0000;
}

header {
    background-color: #E0E0FF;
    margin:           0 0 .6em 0;
}

header h1 {
    margin:           0;
    padding:          1em .5em .35em 0;
    text-align:       right;
    font-family:      times new roman, serif;
    font-size:        1.8em;
    line-height:      1em;
    letter-spacing:   .16em;
    color:            #DDD;
    font-weight:      normal;
    font-variant:     small-caps;
    background-color: #444466;
    background-image: -webkit-linear-gradient(#48486f, #444466);
    background-image: -moz-linear-gradient(#48486f, #444466);
    background-image: -o-linear-gradient(#48486f, #444466);
    background-image: linear-gradient(#48486f, #444466);
}

header h1 i {
    font-family:  trebuchet ms, times new roman, serif;
    font-size:    .7em;
    font-style:   normal;
    font-variant: normal;
    font-weight:  normal;
}

header h2 {
    margin:           0;
    padding:          .5em .7em .5em 0;
    text-align:       right;
    font-family:      times new roman, serif;
    font-size:        1.4em;
    line-height:      1em;
    letter-spacing:   .05em;
    color:            #DDD;
    font-weight:      normal;
    font-variant:     small-caps;
    background-color: #555588;
}

nav {
    display:    block;
    width:      220px;
    float:      left;
    text-align: left;
    margin:     0;
    padding:    0;
}

nav #logo, nav #nav {
    display: none;
    width:   220px;
}

section {
    clear: right;
}
section .main-image {
    display: none;
}
section .main {
    min-height:          550px;
    margin:              0 1em 0 0;
    padding:             0 0 6em 1.8em;
    background-color:    #E0E0FF;
    background-image:    url('/grafiken/bg-logo.png');
    background-position: top center;
    background-repeat:   no-repeat;
}

section .main h1 {
    min-height:     4em;
    margin:         0 0 .6em 0;
    padding:        .6em .5em .6em 0;
    text-align:     right;
    font-family:    times new roman, serif;
    font-size:      2.2em;
    line-height:    1.6em;
    letter-spacing: .1em;
    color:          #666699;
    font-weight:    normal;
    border-right:   1px solid #666699;
}

section .main h1 small {
    display:     inline-block;
    padding-top: 2em;
    font-size:   .6em;
    line-height: 1.6em;
    color:       #666666;
}

section .main h2 {
    margin:         .65em .45em .45em 0;
    padding:        .45em .5em .5em 0;
    font-family:    times new roman, serif;
    font-size:      1.3em;
    line-height:    1.6em;
    letter-spacing: .07em;
    color:          #333366;
    font-weight:    normal;
}

section .main h3 {
    margin:         .65em .45em .45em 0;
    padding:        .45em .5em .12em 0;
    font-family:    Arial,Verdana,Helvetica,sans serif;
    font-size:      1.1em;
    line-height:    1.6em;
    color:          #333333;
    font-weight:    normal;
}

section .main p {
    margin:      0 .45em 0 0;
    padding:     .2em .5em .2em .1em;
    font-family: Arial,Verdana,Helvetica,sans serif;
    font-size:   1em;
    line-height: 1.6em;
    color:       #444444;
}

section .main ul {
    list-style-type: disc;
    margin:          0 2em 1em 1.3em;
    padding:         0;
}

section .main ul li {
    margin:      0;
    padding:     .2em .5em .2em .1em;
    font-family: Arial,Verdana,Helvetica,sans serif;
    font-size:   1em;
    line-height: 1.6em;
    color:       #444444;
}

footer {
	position:         fixed;
	bottom:           0;
    width:            100%;
    max-width:        1200px;
    margin:           0 auto;
	background-color: #E0E0FF;
}

footer address {
    margin:      .5em auto;
    padding:     .5em 0;
    text-align:  center;
    font-family: Arial,Verdana,Helvetica,sans serif;
    font-size:   .9em;
    line-height: 1.6em;
    color:       #999999;
    font-style:  normal;
    border-top:  1px solid #8888CC;
}

footer address a:link {
    text-decoration: none;
    color:           #666699;
}

footer address a:visited {
    text-decoration: none;
    color:           #666699;
}

footer address a:hover {
    text-decoration: none;
    color:           #000033;
}

footer address a:active {
    text-decoration: none;
    color:           #666699;
}

@media (max-width: 799px) {
    nav #nav {
        position:         absolute;
        background-color: #E0E0FF;
        padding:          0 1em;
    }
}

@media (min-width: 800px) {
    header {
        width: calc(100% - 240px);
        float: right;
    }

    section .main {
        margin:           0 0 0 240px;
       	background-image: url('/grafiken/bg.png');
    }

    section .main h1 {
        min-height: 4em;
        margin:     0 .5em .6em 0;
        padding:    .6em .5em .6em 0;
   }

    nav #logo, nav #nav {
        display: block;
    }

    nav #logo {
        padding-left: 2.5em;
    }
}

@media (min-width: 1060px) {
    section .main-image {
        display:        block;
    	width:          250px;
    	margin:         0;
    	padding:        0;
    	float:          right;
    	text-align:     left;
    	vertical-align: top;
    }

    section .main {
    	margin: 0 250px 0 240px;
    }
}