/**
 * Default-Werte
 */
* {
    margin: 0;
    padding: 0;
}

/* Alternatives Box-Modell
   (width = width und nicht width = width+padding+margin+border)
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } */

img {
    border: 0;
}

/**
 * Allgemeine Einstellungen
 */
html,
body {
    height:         100%; /* WICHTIG!!! STRECKT ANZEIGENBEREICH AUF 100% */
    min-width: 560px;
}

body {
    background: #ffffff;

    font-size: 12pt;
    font-family: arial, helvetica, sans-serif;
}

div,
h1,
h2,
h3,
h4,
h5,
p,
ul,
li,
table,
form,
pre,
fieldset,
hr {
    margin:  0;
    padding: 0;
}


/**
 * Spezielle Definitionen
 */
.block, .block_small {
    display: block;
}

.font_weight_normal {
    font-weight: normal;
}

.font_weight_bold {
    font-weight: bold;
}

.font_style_normal {
    font-style: normal;
}

.font_style_italic {
    font-style: italic;
}

.text_align_left {
    text-align: left;
}

.text_align_right {
    text-align: right;
}

.text_align_center {
    text-align: center;
}

.text_align_center * {
    margin-left:  auto;
    margin-right: auto;
}

.float_capsule {
    overflow: auto;
}

.float_left {
    width: auto;
    float: left;
}

.float_right {
    width: auto;
    float: right;
}

.border {
    border:        solid 1px #000000;
    margin-top:    0.5em;
    margin-bottom: 0.5em;
    padding:       0.5em;
}

.alert {
    color: blue;
}

.error {
    color:       red;
    font-weight: bold;
}

/* Übergreifende Eigenschaften */
h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
p {
}

ol {
    padding-left: 2.5em;
}

ul {
    padding-left: 1.5em;
}

a.link_list,
a.link_text {
}

a.link_list:hover,
a.link_text:hover,
a.link_list:active,
a.link_text:active {
}

form {
}

form .float_capsule {
}

input, select, textarea {
    background-color: #ffc;
    border:  solid 1px #999;
    margin:  0 0 10px 0;
    padding: .4em .6em;
    width: 300px;
    height: auto;

    font-size: 1em;
    line-height: 1em;
    letter-spacing: .1em;
    color: #333;
}
@media all and (max-width: 350px) {
    input, select, textarea {
        width: 200px;
    }
}

textarea {
    height: 100px;
}

input[type="text"],
input[type="email"],
input[type="password"],
textarea {
    -moz-border-radius:    0.4em;
    -webkit-border-radius: 0.4em;
    -o-border-radius:      0.4em;
    border-radius:         0.4em;
}

input[type="checkbox"] {
    margin: .05em 0 0 0;
    padding: 0;
    -moz-border-radius:    0.2em;
    -webkit-border-radius: 0.2em;
    -o-border-radius:      0.2em;
    border-radius:         0.2em;
    width: auto;
    height: auto;
}

input[type="radio"] {
}

input[type="file"] {
}

input[type="submit"],
input.button,
button.button,
a.button {
    width: auto;

    font-weight: bold;
    color: #fff;

    background: #ccc;
    background-image: -webkit-linear-gradient(#ccc, #999);
    background-image: -moz-linear-gradient(#ccc, #999);
    background-image: -o-linear-gradient(#ccc, #999);
    background-image: linear-gradient(#ccc, #999);

    -moz-border-radius:    0.4em;
    -webkit-border-radius: 0.4em;
    -o-border-radius:      0.4em;
    border-radius:         0.4em;
}

input[type="submit"]:hover,
input.button:hover,
button.button:hover,
a.button:hover {
    color: #fff;

    cursor: pointer;
    text-decoration: none;

    background: #aaa;
    background-image: -webkit-linear-gradient(#aaa, #777);
    background-image: -moz-linear-gradient(#aaa, #777);
    background-image: -o-linear-gradient(#aaa, #777);
    background-image: linear-gradient(#aaa, #777);
}

input[type="submit"]:active,
input.button:active,
button.button:active,
a.button:active {
    border:  solid 1px #555;

    color: #ccc;

    cursor: pointer;
    text-decoration: none;

    background: #999;
    background-image: -webkit-linear-gradient(#999, #555);
    background-image: -moz-linear-gradient(#999, #555);
    background-image: -o-linear-gradient(#999, #555);
    background-image: linear-gradient(#999, #555);
}


/* Placeholder definieren */
::-webkit-input-placeholder { color:#999; }
::-moz-placeholder { color:#999; } /* firefox 19+ */
:-moz-placeholder { color:#999; }

.error::-webkit-input-placeholder { color:#f00; }
.error::-moz-placeholder { color:#f00; } /* firefox 19+ */
.error:-moz-placeholder { color:#f00; }

/* http://css-tricks.com/snippets/css/style-placeholder-text/
 * Kommentar von Jeremy Benaim
 * in iOS wird der Placeholder bei focus nicht ausgeblendet
 * Nach meiner Erfahrung auch unter Ubuntu/Firefox */
:focus::-webkit-input-placeholder { color: transparent; }
:focus::-moz-placeholder { color: transparent; }
:focus:-moz-placeholder { color: transparent; }

.picture_text {
    padding: 0.5em;
    font-size: 0.85em;
    line-height: 1.1em;
    font-weight: inherit;
    font-style: inherit;
    text-align: inherit;
}


/* Klassen kombinieren *
.textarea.p
                {
                height: 200px;
                }
.label.image
                {
                width: 100px;
                }
.textarea.image
                {
                width:200px;
                height:50px;
                }

/**
 * Gerüst
 */
div.wrapper {
    margin: 0 auto;
    padding: 0;
}

div.backend {
    padding: 2px 0;

    background-color: #fff;
    background-image: -webkit-linear-gradient(#fff, #999);
    background-image: -moz-linear-gradient(#fff, #999);
    background-image: -o-linear-gradient(#fff, #999);
    background-image: linear-gradient(#fff, #999);
}

div.backend div.wrapper {
    margin: 0 auto;
    font-size: 12px;
    line-height: 20px;
    font-weight: normal;
}

div.backend div.wrapper > ul {
    width: auto;
    float: right;
}

div.head {
    margin: 0 10px 0 10px;
    padding: 0 10px 10px 10px;
    background-color: #fff;
    background-image: -webkit-linear-gradient(#fff, #ccc);
    background-image: -moz-linear-gradient(#fff, #ccc);
    background-image: -o-linear-gradient(#fff, #ccc);
    background-image: linear-gradient(#fff, #ccc);

    -moz-border-top-left-radius:    4px;
    -webkit-border-top-left-radius: 4px;
    -o-border-top-left-radius:      4px;
    border-top-left-radius:         4px;
    -moz-border-top-right-radius:    4px;
    -webkit-border-top-right-radius: 4px;
    -o-border-top-right-radius:      4px;
    border-top-right-radius:         4px;
    
    overflow: auto;
}
div.head div.wrapper {
    max-width: 1400px;
}
div.partner {
    width: 100%;
    height: 42px;
    margin: 0 50px 10px 0;
    text-align: right;
}
div.partner-text {
    height: 32px;
    margin: 5px 10px 5px 0;
    padding: 7px 160px 0 0;
    line-height: 32px;
    text-align: right;
    color: #ed1c24;
    font-weight: bold;
    letter-spacing: .5px;
}
div.partner .partner-links {
    margin: 5px 50px 5px 0;
    height: 32px;
    float:right;
}

div.head div.wrapper div.logo {
    margin: 0 5px 0 20px;
    padding: 0;
    width: auto;
    height: 150px;
    float:left;
}

div.head div.wrapper div.logo img {
    display:block;
    height: 130px;
}

div.head div.wrapper div.language {
    margin: 25px 0 0 10px;
    padding: 0;
    width: 30px;
    float: right;
}

@media all and (max-width: 500px) {
    div.head div.wrapper div#menu {
        margin: 0 45px 0 0;
        padding: 0;
    }
}
@media all and (min-width: 501px) {
    div.head div.wrapper div#menu {
        margin: 0 45px 0 300px;
        padding: 0;
    }
}

div.content {
    margin: 0 auto 10px auto;
    max-width: 1100px;
    
    overflow: auto;
}

@media all and (min-width: 601px) {
    div.content div.wrapper {
        padding: 20px;
    }
}

div.content div.wrapper {
    max-width: 1100px;
    overflow: auto;
}

@media all and (max-width: 1140px) {
    div.content {
        margin: 0 10px 10px 10px;

        overflow: auto;
    }

    div.content div.wrapper {
        -moz-border-radius:    4px;
        -webkit-border-radius: 4px;
        -o-border-radius:      4px;
        border-radius:         4px;
    }
}

.content_text_wrapper {
    overflow: hidden;
}

.content_text {
    padding: 20px 40px;
    
    font-size: 1em;
    line-height: 1.5em;
    letter-spacing: .1em;
    font-weight: normal;
    color: #ffffff;
}

@media all and (min-width: 601px) {
    .content_text {
        max-width: 480px;
    }
}
@media all and (max-width: 600px) {
    .content_text {
        width: auto;
    }
}

.content_text {
    -moz-border-radius:    0.4em;
    -webkit-border-radius: 0.4em;
    -o-border-radius:      0.4em;
    border-radius:         0.4em;
}

@media all and (min-width: 601px) {
    #stern {
        padding: 0;
        margin: 0;
        text-align: center;
        width: 315px;
        float: right;
        height: 317px;
        background: url('/files/stern.png') no-repeat center;
        
        -webkit-transform: rotate(8deg);
        -moz-transform: rotate(8deg);
        -o-transform: rotate(8deg);
        transform: rotate(8deg);
    }
    
    #stern p.stern1 {
        padding-top: 70px;
        font-size: 28px;
        line-height: 1.2em;
        letter-spacing: 0;
        font-weight: bold;
        text-transform: uppercase;
    }

    #stern p.stern2 {
        padding-top: 110px;
        font-size: 28px;
        line-height: 1.2em;
        letter-spacing: 0;
        font-weight: bold;
        text-transform: uppercase;
    }

    #stern p.stern3 {
        padding-top: 90px;
        font-size: 28px;
        line-height: 1.2em;
        letter-spacing: 0;
        font-weight: bold;
        text-transform: uppercase;
    }

}

@media all and (max-width: 600px) {
    #stern {
        padding: 10px 40px;
        margin: 0 0 10px 0;
        text-align: center;
        min-height: 20px;
        background: #5fce47;
        -moz-border-radius:    0.4em;
        -webkit-border-radius: 0.4em;
        -o-border-radius:      0.4em;
        border-radius:         0.4em;
    }

    #stern p {
        font-size: 28px;
        line-height: 1.2em;
        letter-spacing: 0;
        font-weight: bold;
        text-transform: uppercase;
    }
}

#stern p a {
    text-decoration: none;
    color: #ffffff;
}

#stern p a:active, #stern p a:hover, #stern p a:focus {
    color: #eeee66;
}

.content_text .content_item {
    padding: 20px 0;
    max-width: 480px;
}

.content_text h1.content_item {
    padding: 20px 0;
    margin-bottom: 10px;
    width: 450px;

    font-size: 2em;
    line-height: 1.2em;
    font-weight: normal;
    border-bottom: 1px solid #fff;
    position: relative;
}
@media all and (max-width: 500px) {
    .content_text h1.content_item {
        width: 100%;
    }
}

.content_text h1.content_item:before {
    position: absolute;
    bottom: -23px;
    left: 25px;
}


.content_text a {
    text-decoration: underline;
    color: inherit;
}

.content_text a:active, .content_text a:hover, .content_text a:focus {
    color: #eeee66;
}

/*
div.content div.wrapper div.content_text {
    margin: 0 2em;
    padding: 2em;
    width: 50%;
    
    border-radius: .4em;
}


/**
 * Spezielle CSS-Klassen aus Modulen
 *
.contact form {}
.contact form input[type="text"],
.contact form input[type="email"],
.contact form textarea {
    width: 20em;
    max-width: 20em;
}

.contact form textarea {
    height: 10em;
}
*/

.block_contact {
    width: 150px;
}

div.bottomField {
    margin: 0 10px 10px 10px;
    padding: 20px 20px 30px 20px;
    
    overflow: auto;

    background-color: #666;
    background-image: -webkit-linear-gradient(#666, #333);
    background-image: -moz-linear-gradient(#666, #333);
    background-image: -o-linear-gradient(#666, #333);
    background-image: linear-gradient(#666, #333);

    -moz-border-radius:    4px;
    -webkit-border-radius: 4px;
    -o-border-radius:      4px;
    border-radius:         4px;
    
    font-size: .8em;
    line-height: 1.2em;
    color: #aaa;
}
div.bottomField div.wrapper {
    max-width: 1400px;
}
div.bottomField h1 {
    font-size: 1.1em;
    line-height: 1.5em;
    font-weight: bold;
    margin-bottom: 10px;
    color: #ddd;
}

@media all and (min-width: 501px) {
    div.bottomField div.address {
        padding-right: 20px;
        width:auto;
        float: right;
    }
}
@media all and (max-width: 500px) {
    div.bottomField div.address {
        margin-bottom: 10px;
    }
}
div.bottomField div.address h1 {
    /*    text-align: right; */
}

div.bottomField div.address address {
    padding-left: 30px;
    padding-right: 20px;
    
    color: #aaa;
    font-style: normal;
}

@media all and (min-width: 801px) {
    div.bottomField div.sitemap {
        padding-left: 20px;
    }
}
div.bottomField div.sitemap ul {
    list-style-type: none;
    padding-left: 30px;
    width: auto;
}
@media all and (min-width: 801px) {
    div.bottomField div.sitemap_menu > ul > li {
        margin-right: 50px;
        width: auto;
        float: left;
    }

}
div.bottomField a,
div.bottomField div.sitemap_menu ul li a {
    color: inherit;
    text-decoration: none;
}

div.bottomField a:hover,
div.bottomField a:active, 
div.bottomField div.sitemap_menu ul li a:hover,
div.bottomField div.sitemap_menu ul li a:active {
    color: #ccc;
    text-decoration: underline;
}

div.bottomField div.sitemap_menu ul li span {
    color: #000;
}

div.bottomField div.sitemap_menu ul li.menu_active_page > span {
    color: #eee;
    text-decoration: underline;
}


div.image,

div.debug,

div.date,

div.language,
div.language a,
div.language span,
div.language a img,
div.language span img,

form.login,
input.login_username,
input.login_password,
input.login_submit {
}

form.stand_alone_login,
input.stand_alone_login_username,
input.stand_alone_login_password,
input.stand_alone_login_submit {
}
    
/* Die Menüs werden allein in den dafür vorgesehenen css-Dateien
 * definiert */


/**
 * Klassen, die im Backend angegeben werden
 */
@media all and (min-width: 601px) {
    .intro_text {
        width: 480px;
    }
}
.intro_text {
    text-align: center;
    font-family: Palatino Linotype, Book Antiqua, Palatino, serif;
    font-size: 2.6em;
    line-height: 1.4em;
    letter-spacing: 0;
    font-style: italic;
}

table.bbcode_table td {
    padding: 2px 5px;
}

@media all and (max-width: 401px) {
    .content_item.float_left,
    .content_item.float_right {
        float: none;
    }
}

div.container {
    width: 500px;
    height: 700px;
}