/*  responsive  1% = 18.62px
* HTML5 Boilerplate
*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
/* carthago-media*/
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
/* grid */
*, *:after, *:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
[class*='col-'] {
    float: left;
    /* padding-right: 20px;  column-space */
}



html,
input,
select,
textarea {
color: #3c3c3b;
}

html,
body {
font-size: 100%;
line-height: 1.4;
font-family: 'Open Sans','Open Sans Condensed', Helvetica, sans-serif;
height: 101%;
margin: 0;
padding: 0;
    /*background-color: #eaeaea;*/
    background: url("img/papier_hint_hell.jpg") repeat center; ;
    color: #3c3c3b;
}

::-moz-selection {
background: #b3d4fc;
text-shadow: none;
}

::selection {
background: #b3d4fc;
text-shadow: none;
}

/*
* A better looking default horizontal rule
*/

hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}

/*
* Remove the gap between images and the bottom of their containers: h5bp.com/i/440
*/

img {
vertical-align: middle;
}

/*
* Remove default fieldset styles.
*/

fieldset {
border: 0;
margin: 0;
padding: 0;
}

/*
* Allow only vertical resizing of textareas.
*/

textarea {
resize: vertical;
}

/* ==========================================================================
Chrome Frame prompt
========================================================================== */

.chromeframe {
margin: 0.2em 0;
background: #ccc;
color: #000;
padding: 0.2em 0;
}

/* ==========================================================================
Author's custom styles
========================================================================== */
h1 {
font-size: 275%;
font-weight: 400;
float: left;
/*width: auto;*/
margin: 0 0 0 4%;
line-height: 1em;
font-family: "Open Sans", Helvetica, sans-serif;
    color: #173a73;
}
h2 {
font-size: 180%;
font-weight: 400;
float: left;
/*width: 780px;*/
margin: 5px 0 0 4%;
line-height: 36px;
font-family: "Open Sans", Helvetica, sans-serif;
    color: #173a73;
    clear: both;
}
h3 {
font-size: 130%;
font-weight: 600;
float: left;
width: 100%;
margin: 5px 0 0 4%;;
line-height: 24px;
font-family: "Open Sans", Helvetica, sans-serif;
    color: #173a73;
}
h4 {
font-size: 110%;
font-weight: 700;
width:780px;
margin: 0px 0 0 0px;
line-height: 24px;
font-family: "Open Sans", Helvetica, sans-serif;
    color: #173a73;
}
h5 {
position: relative;
font-size: 13px;
font-weight: 700;
width: 90%;
margin: 0;
padding: 0 2% 5px 0;
line-height: 18px;
font-family: "Open Sans", Helvetica, sans-serif;
    color: #173a73;
text-transform: uppercase;
height: auto;
}
h6 {
font-size: 105%;
font-weight: 600;
width:780px;
margin: 6px 0 0 0px;
line-height: 18px;
font-family: "Open Sans", Helvetica, sans-serif;
color: #152e5e;
}
a { text-decoration: none; outline: none; }
a:link { color: #173a73; outline: none; }
a:visited { color: #173a73; outline: none; }
a:hover, a:focus { color: #1d53ae; outline: none; }
a:active { color: #1d53ae; outline: none; }
button {
background-color: #152e5e;
border: none;
margin: 0;
padding: 0;
}
p {
    margin: 0;
}
.wrapper {
    max-width: 1140px;
/*background-color: #ffffff;*/
margin: 0 auto;
height: auto;
}
.header {
position: relative;
width: 100%;
background-color: #173a73;
margin: 0 auto;
padding: 0 0 0 0;
color: #ffffff;
height: 58px;
}
#header_inhalt {
max-width: 1140px;
height: 58px;
margin: 0 auto;
}
#header_kontakt {
    float: right;
    height: 65px;
    width: 252px;
    margin: 5px 0 0;
}
.kontakt_zeile {
    float: left;
    width: 270px;
    clear: both;
}
.pict {
    float: left;
    width: 40px;
}
.kontakt_zeile p {
     float: left;
}
#logo {
    float: left;
    position: relative;
}
#logo img {
    margin-top: 17px;
    width: 230px;
    height: auto;
}
.content {
    clear: both;
    display: inherit;
    height: auto;
}
#nav {
position: relative;
min-width: 100%;
float: left;
z-index: 100;
    margin: -12px 0 0;
padding: 1px 30px  5px;
    background-color: #ffffff;
    height: 100px;
    overflow: hidden;
}
#nav ul {
padding: 0;
margin: 0;
}
#nav li, #nav a {
color: #3c3c3b;
}
#nav li:hover, #nav a:hover {
color: #1d53ae !important;
outline: none;
}
#nav li:focus, #nav li:active, #nav a:focus, #nav a:active {
color: #1d53ae;
outline: none;
}
.navi,
.navi_sub,
.navi_sub_akt {
float: left;
width: auto;
padding: 14px 1.2%;
display: inline;
list-style-type: none;
font-weight: 600;
font-size: 90%;
text-transform: uppercase;
color: #3c3c3b;
line-height: 17px;
z-index: 11;
border-bottom: 1px solid #3c3c3b;
margin: 0;
background-color: #ffffff;
}
.navi_akt {
border-bottom: 1px solid #3c3c3b;
}
.navi:hover,
.navi_akt:hover,
.navi_akt,
.navi_akt_sub,
.navi_sub:hover {
float: left;
width: auto;
padding: 14px 1.2%;
list-style-type: none;
font-weight: 600;
font-size: 90%;
text-transform: uppercase;
color: #1d53ae !important;
line-height: 17px;
margin: 0;
background-color: #ffffff;
}
.navi:hover .punkt,
.navi_akt:hover .punkt,
.navi_akt .punkt,
.navi_akt_sub .punkt,
.sub:hover .punkt {
    opacity: 1;
    filter:alpha(opacity=100);
}
.sub .punkt {
    opacity: 0;
    filter:alpha(opacity=0);
}
.navi_akt_sub ,
.navi_sub:hover,
.navi_akt_sub:hover,
.navi_sub_akt {
border-bottom: 1px solid #ffffff;
}
.navi_akt li,
.navi_akt a,
.navi_akt_sub a {
color: #1d53ae !important;
}
.submenu {
position: absolute;
display: none;
    background-color: #ffffff;
}
/*.navi_akt_sub .submenu,*/
.navi_akt:hover .submenu,
.navi_akt_sub .submenu,
.navi_sub:hover .submenu,
.navi_akt_sub:hover .submenu,
.navi_sub_akt .submenu {
/*float: left;*/
width: 99%;
display: inline;
margin: 0;
}
.sub,
.sub_akt {
float: left;
width: auto;
margin: 0 0px 0 0;
padding: 4px 1.2%;
display: inline;
list-style-type: none;
font-weight: 600;
font-size: 90%;
text-transform: uppercase;
letter-spacing: 0.05em;
    background-color: #ffffff;
}
.navi_akt:hover .submenu,
.navi_akt_sub .submenu,
.navi_sub:hover .submenu,
.navi_akt_sub:hover .submenu,
.navi_sub_akt .submenu {
position: absolute;
top: 46px;
left: 30px;
/*background-color: #ffffff;*/
z-index: 10;
padding: 10px 0 0 0 !important;
}

.navi_sub_akt .submenu {
    position: absolute;
    top: 46px;
    left: 30px;
    /*background-color: #ffffff;*/
    z-index: 9;
    padding: 10px 0 0 0 !important;
}
.navi_akt:hover .submenu,
.navi_sub:hover .submenu {
    z-index: 12;
}
.navi_akt:hover .sub a,
.navi_akt_sub .sub a {
color: #3c3c3b !important;
}
.navi_sub_akt .sub_akt a {
color: #173a73 !important;
}
.punkt {
    color: #173a73;
    display: block !important;
    font-size: 180%;
    line-height: 25px;
    margin: -27px 1px 0 0;
    opacity: 0;
    text-align: center !important;
    width: auto;
}
.navi:hover .punkt {
    opacity: 1;
    filter:alpha(opacity=100);
}
.menu-link {
    display: none;
}
#text_bildbereich {
width: 100%;
/*height: auto;*/
position: relative;
background-color: #ffffff;
margin: 0 0 10px 0;
padding: 0 0 30px 0;
z-index: 7;
    border-bottom: 10px double #f5f4f3;
    clear: both;
    overflow: auto;
    -webkit-box-shadow: 0 3px 6px -3px rgba(0, 0, 0, 0.50);
    -moz-box-shadow: 0 3px 6px -3px rgba(0, 0, 0, 0.50);
    box-shadow: 0 3px 6px -3px rgba(0, 0, 0, 0.50);
}
#text_bildbereich p {
max-width: 100%;
font-size: 90%;
line-height: 1.65em;
    /*clear: both;*/
    padding: 0 2% 7px 4%;
}
#text_bildbereich .bold {
    font-weight: 700;
    /*color: #173a73;*/
}
#text_bildbereich ul {
max-width: 100%;
line-height: 1.65em;
font-weight: 400;
z-index: 8;
list-style-image: url("img/pfeil_re.png");
    display: flex;
}
.bilder_reihe {
   float: left;
   width: 100%;
    display: -webkit-flex;
    display: flex;
    margin: 30px 0 0px 0;
    border-bottom: 10px double #f5f4f3;
    /*-webkit-box-shadow: 0 11px 11px -3px rgba(0, 0, 0, 0.50);
    -moz-box-shadow: 0 11px 11px -3px rgba(0, 0, 0, 0.50);
    box-shadow: 0 11px 11px -3px rgba(0, 0, 0, 0.50);*/
    /*overflow: hidden;*/
}
.bild_text {
    float: left;
    width: 100%;
   /* display: -webkit-flex;
    display: flex;*/
    margin: 30px 0 0px;
}
.bild_drittel {
    float: left;
    width: 33%;
    max-width: 375px;
    max-height: 325px;
    margin: 0 2%;
    border: 10px solid #f5f4f3;
    /*-webkit-box-shadow: 6px 8px 11px -3px rgba(0, 0, 0, 0.50);
    -moz-box-shadow: 6px 8px 11px -3px rgba(0, 0, 0, 0.50);
    box-shadow: 6px 8px 11px -3px rgba(0, 0, 0, 0.50);*/
    overflow: hidden;
}
.bild_drittel img {
    width: 100%;
}
/*.text_zweidrittel {
    float: left;
    width: auto;
    margin: 0px 0 0 0px;
   !* -webkit-flex-basis: 60%;
    flex-basis: 60%;*!
}*/
.bilder_reihe img {
    float: left;
    width: 100%;
    -webkit-flex-basis: 33.33%;
    flex-basis: 33.33%;
}
.reihe_home {
    float: left;
    width: 100%;
    display: -webkit-flex;
    display: flex;
    margin: 0px 0 0px 0;
    /*!*border-bottom: 2px solid #173a73;*!
    -webkit-box-shadow: 0 11px 11px -3px rgba(0, 0, 0, 0.50);
    -moz-box-shadow: 0 11px 11px -3px rgba(0, 0, 0, 0.50);
    box-shadow: 0 11px 11px -3px rgba(0, 0, 0, 0.50);*/
}
.bilder_home {
    max-height: 340px;
    overflow: hidden;
}
.bilder_home img {
    float: left;
    width: 100%;
    -webkit-flex-basis: 33.33%;
    flex-basis: 33.33%;
}
.textbereich {
    margin: 50px 0 0 0;
}
.text {
    position: relative;
    float: left;
    margin: 20px 0;
}
.text_home {
    float: left;
    max-width: 31.3%;
    -webkit-flex-basis: 33.33%;
    flex-basis: 33.33%;
    margin: 5px 1%;
}
#impressum_zeile {
    font-size: 70%;
    float: right;
    margin: 5px 0 10px;
}

/* ==========================================================================
desktop
========================================================================== */

@media screen and (max-width: 1136px){
    .navi,
    .navi_akt,
    .navi_sub,
    .navi_akt_sub {
        font-size: 80% !important;
}
#impressum_zeile {
    margin-right: 4%;
}
}
/* ==========================================================================
laptop
==========================================================================  */
@media only screen and (min-width: 700px) and (max-width: 1020px) {
    .navi,
    .navi_akt,
    .navi_sub,
    .navi_akt_sub {
        font-size: 70%;
    }
    h1 {
        font-size: 230%;
    }
}
/* ==========================================================================

==========================================================================  */
@media only screen and (min-width: 30px) and (max-width: 960px) {
    h1 {
        font-size: 200%;
    }
    .bilder_reihe {
        float: left;
        width: 100%;
        display: -webkit-flex;
        display: flex;
        margin: 30px 0 0px 0;
        /*border-bottom: 2px solid #173a73;*/
        -webkit-box-shadow: none;
        -moz-box-shadow:none;
        box-shadow: none;
        border-bottom: none;
    }
    .text_home {
        float: left;
        max-width: 36%;
        -webkit-flex-basis: 36%;
        flex-basis: 36%;
        margin: 0px 2.2% 20px;
        font-size: 90%;
    }
}

/* ==========================================================================
tablet portrait
========================================================================== */
@media only screen and (min-width : 30em) and (max-width: 900px) {
h1 {
font-size: 200%;
}
    #header_kontakt {
        width: auto;
    }
    .kontakt_zeile {
        width: auto;
    }
    .kontakt_zeile p {
    display: none;
}
.menu-link {
display: inline;
float: left;
min-width: 33px;
height: 33px;
padding: 0;
margin: 12px 0 0 5%;
position: relative;
z-index: 500;
}
.menu-link a {
border: none;
}
.menu-link a:hover {
color: #1d53ae !important;
}
.menu-link a:active {
color: #1d53ae !important;
}
#nav {
height: .01rem;
overflow: hidden;
padding-top: 0;
background-color: #ffffff;
    margin: -11px 0 0 0;
    z-index: 0;
    position: absolute;
}
#nav .punkt {
    display: none !important;
}
#menu-open:target #nav {
clear: both;
max-width: auto;
float: left;
z-index: 200;
padding: 0 !important;
margin: 0 0 0 0;
height: auto;
background: none;
position: absolute;
    overflow: visible;
}
#nav,
#menu-open:target #nav {
transition: .3s;
}
a.open { display: block;}
a.close { display: none;}
#menu-open:target a.open { display: none;}
#menu-open:target a.close { display: block;}

#nav ul {
float: left;
margin: 10px 0;
padding: 0;
font-size: 90%;
width: 180px;
}
#nav li, #nav a {
color: #152e5e;
}
#nav li {
padding: 8px 0 8px 1.2em;
}
#nav li:hover, #nav a:hover {
color: #1d53ae !important;
outline: none;
}
#nav li:focus, #nav li:active, #nav a:focus, #nav a:active {
color: #1d53ae;
outline: none;
}
.navi,
.navi_sub {
float: none;
display: block;
list-style-type: none;
font-weight: 600;
text-transform: uppercase;
color: #152e5e !important;
line-height: 15px;
z-index: 11;
border-bottom: 1px solid #cccccc;
margin: 0;
text-align: left;
background-color: #ffffff;
}
.navi:hover,
.navi_akt,
.navi_akt_sub,
.navi_sub:hover {
float: none;
display: block;
list-style-type: none;
font-weight: 600;
text-transform: uppercase;
color: #1d53ae !important;
line-height: 15px;
border-bottom: 1px solid #ffffff;
margin: 0;
text-align: left;
background-color: #f1f4f5;
}
.navi_sub:hover,
.navi_akt_sub {
display: block;
background-image: url("../img/menu_arr.png");
background-repeat: no-repeat;
background-position: right;
}
.navi_akt li, .navi_akt a {
color: #1d53ae !important;
}
.submenu {
position: absolute;
display: none;
top: 0;
left: 180px;
background-color: #ffffff;
z-index: 10;
padding: 0 0 0 0 !important;
    margin: 0 !important;
/*border-bottom: 1px solid #d5dbe3;*/
}
#nav ul li ul li {
padding: 8px 1% 8px 3% !important;
border-bottom: 1px solid #cccccc;
}

    /*.navi_akt_sub .submenu {
        position: absolute;
        top: 0;
        left: 180px;
        background-color: #ffffff;
        z-index: 10;
        padding: 0;
        border-left: 1px solid #1d53ae;
    }*/
    .navi_akt:hover .submenu,
    .navi_akt_sub .submenu,
    .navi_sub:hover .submenu,
    .navi_akt_sub:hover .submenu,
    .navi_sub_akt .submenu {
        position: absolute;
        top: 0;
        left: 180px;
        /*background-color: #ffffff;*/
        z-index: 10;
        /*padding: 10px 0 0 0 !important;*/
        border-left: 1px solid #1d53ae;
    }
.sub,
.sub_akt {
float: left;
width: 170px;
height: auto;
margin: 0 0px 0 0;
/*padding: 0 1%;*/
display: block;
list-style-type: none;
font-weight: 400;
font-size: 12px;
text-transform: uppercase;
letter-spacing: 0.05em;

}

/*.navi_sub:hover .submenu {
display: none;
}*/
.navi_sub_akt .submenu {
position: absolute;
top: 0px;
left: 180px;
background-color: #ffffff;
z-index: 10;
padding: 0;
/*border-left: 2px solid #1d53ae;*/
}
.navi_akt_sub .sub a {
color: #152e5e !important;
max-width: 175px;
}
.navi_akt_sub .sub_akt a {
color: #1d53ae !important;
}
#textbereich {
width: 100%;
padding-top: 50px;
font-size: 95%;
}
#text_bildbereich p,
#textbereich p {
max-width: 100%;
/*padding: 1px 2.5%;*/
display: block;
z-index: 95;
line-height: 1.5em;
}
#text_bildbereich {
width: 100%;
margin-top: -6px;
}
#text_bildbereich ul {
max-width: 100%;
line-height: 1.5em;
font-weight: 400;
z-index: 99;
list-style-image: url("../img/list_img.gif");
}
    .bilder_reihe {
        float: left;
        width: 100%;
        display: -webkit-flex;
        display: flex;
        margin: 30px 0 0px 0;
        /*border-bottom: 2px solid #173a73;*/
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
    }
    .bilder_reihe img {
        float: left;
        width: 100%;
        -webkit-flex-basis: 33.33%;
        flex-basis: 33.33%;
    }
    .text_home {
        float: left;
        max-width: 50%;
        -webkit-flex-basis: 70%;
        flex-basis: 70%;
        margin: 0px 2.2% 20px;
        font-size: 90%;
    }
}

/* ==========================================================================
tablet portrait + landscape
==========================================================================  */
@media only screen and (min-width: 30px) and (max-width: 568px) {
    p {
        font-size: 0.7em;
    }
    .reihe_home,
    .bilder_reihe {
        float: left;
        width: 100%;
        display: block;
        margin: 0px 0 0px 0;
        clear: both;
        padding: 0 1%;
    }
    .bilder_home,
    .bild {
        max-height: 295px;
        overflow: hidden;
        -webkit-flex-basis: 100%;
        flex-basis: 100%;
    }
    .bild_drittel {
        width: 94%;
        margin: 0 2% 20px;
        max-width: 94%;
    }
    .text_home {
        float: left;
        max-width: 100%;
        -webkit-flex-basis: 100%;
        flex-basis: 100%;
        margin: 10px 2.2% 10px;
        font-size: 90%;
    }
    .bilder_reihe {
        display: block;
    }
}
/* ==========================================================================
Smartphones (portrait and landscape)
========================================================================== */
@media only screen and (max-width : 30em) {
    h1 {
        font-size: 180%;
    }
    h2 {
        font-size: 160%;
    }
    #header_kontakt {
        width: auto;
    }
    .kontakt_zeile {
        width: auto;
    }
    .kontakt_zeile p {
        display: none;
    }
    .menu-link {
        display: inline;
        float: left;
        min-width: 33px;
        height: 33px;
        padding: 0;
        margin: 12px 0 0 5%;
        position: relative;
        z-index: 500;
    }
    .bilder_reihe {
        float: left;
        width: 100%;
        display: block;
        margin: 20px 0 20px 0;
        border-bottom: none;
        /*-webkit-box-shadow: 0 12px 12px -3px rgba(0, 0, 0, 0.61);*/
        /*-moz-box-shadow: 0 12px 12px -3px rgba(0, 0, 0, 0.61);*/
        /*box-shadow: 0 12px 12px -3px rgba(0, 0, 0, 0.61);*/
    }
    .bilder_reihe img,
    .bilder_home img {
        float: left;
        width: 100%;
        padding: 0 5%;
        /*-webkit-flex-basis: 33.33%;*/
        /*flex-basis: 33.33%;*/
    }
    #nav {
        height: .01rem;
        overflow: hidden;
        padding-top: 0;
        background-color: #ffffff;
        margin: -11px 0 0 0;
        z-index: 0;
        position: absolute;
    }
    #nav .punkt {
        display: none !important;
    }
    #menu-open:target #nav {
        clear: both;
        max-width: auto;
        float: left;
        z-index: 200;
        padding: 0 !important;
        margin: 0 0 0 0;
        height: auto;
        background: none;
        position: absolute;
        overflow: visible;
    }
    #nav,
    #menu-open:target #nav {
        transition: .3s;
    }
    a.open { display: block;}
    a.close { display: none;}
    #menu-open:target a.open { display: none;}
    #menu-open:target a.close { display: block;}

    #nav ul {
        float: left;
        margin: 10px 0;
        padding: 0;
        font-size: 90%;
        width: 180px;
    }
    #nav li, #nav a {
        color: #152e5e;
    }
    #nav li {
        padding: 8px 0 8px 1.2em;
    }
    #nav li:hover, #nav a:hover {
        color: #1d53ae !important;
        outline: none;
    }
    #nav li:focus, #nav li:active, #nav a:focus, #nav a:active {
        color: #1d53ae;
        outline: none;
    }
    .navi,
    .navi_sub {
        float: none;
        display: block;
        list-style-type: none;
        font-weight: 600;
        text-transform: uppercase;
        color: #152e5e !important;
        line-height: 15px;
        z-index: 11;
        border-bottom: 1px solid #cccccc;
        margin: 0;
        text-align: left;
        background-color: #ffffff;
    }
    .navi:hover,
    .navi_akt,
    .navi_akt_sub,
    .navi_sub:hover {
        float: none;
        display: block;
        list-style-type: none;
        font-weight: 600;
        text-transform: uppercase;
        color: #1d53ae !important;
        line-height: 15px;
        border-bottom: 1px solid #ffffff;
        margin: 0;
        text-align: left;
        background-color: #f1f4f5;
    }
    .navi_sub:hover,
    .navi_akt_sub {
        display: block;
        background-image: url("../img/menu_arr.png");
        background-repeat: no-repeat;
        background-position: right;
    }
    .navi_akt li, .navi_akt a {
        color: #1d53ae !important;
    }
    .submenu {
        position: absolute;
        display: none;
        top: 0;
        left: 180px;
        background-color: #ffffff;
        z-index: 10;
        padding: 0 0 0 0 !important;
        margin: 0 !important;
        /*border-bottom: 1px solid #d5dbe3;*/
    }
    #nav ul li ul li {
        padding: 8px 1% 8px 3% !important;
        border-bottom: 1px solid #cccccc;
    }

    /*.navi_akt_sub .submenu {
        position: absolute;
        top: 0;
        left: 180px;
        background-color: #ffffff;
        z-index: 10;
        padding: 0;
        border-left: 1px solid #1d53ae;
    }*/
    .navi_akt:hover .submenu,
    .navi_akt_sub .submenu,
    .navi_sub:hover .submenu,
    .navi_akt_sub:hover .submenu,
    .navi_sub_akt .submenu {
        position: absolute;
        top: 0;
        left: 180px;
        /*background-color: #ffffff;*/
        z-index: 10;
        /*padding: 10px 0 0 0 !important;*/
        border-left: 1px solid #1d53ae;
    }
    .sub,
    .sub_akt {
        float: left;
        width: 170px;
        height: auto;
        margin: 0 0px 0 0;
        /*padding: 0 1%;*/
        display: block;
        list-style-type: none;
        font-weight: 400;
        font-size: 12px;
        text-transform: uppercase;
        letter-spacing: 0.05em;

    }

    /*.navi_sub:hover .submenu {
    display: none;
    }*/
    .navi_sub_akt .submenu {
        position: absolute;
        top: 0px;
        left: 180px;
        background-color: #ffffff;
        z-index: 10;
        padding: 0;
        /*border-left: 2px solid #1d53ae;*/
    }
    .navi_akt_sub .sub a {
        color: #152e5e !important;
        max-width: 175px;
    }
    .navi_akt_sub .sub_akt a {
        color: #1d53ae !important;
    }

#textbereich {
width: 100%;
padding-top: 60px;
font-size: 90%;
}
#textbereich p,
#text_bildbereich p {
max-width: 100%;
padding: 1px 4%;
z-index: 95;
line-height: 1.5em;
}
#text_bildbereich {
margin-top: -7px;
}
#text_bildbereich ul {
line-height: 1.5em;

}
.bild_breit {
margin: 0 0 10px 0;
border: 8px solid #f1f4f5;
}

.bild_halb {
max-width: 42%;
border: 8px solid #f1f4f5;
margin: 0 2% 10px 0;
}

.zitat {
font-size: 98%;
font-style: italic;
font-weight: 400;
line-height: 20px;
color: #152e5e;
}
}
/* ==========================================================================
Smartphones (portrait)
========================================================================== */
@media only screen and (max-width : 20em) {
  #logo {
      display: none;
  }
}
/* ==========================================================================
Smartphones (VS)
========================================================================== */
@media only screen and (max-width : 16em) {

}
/* ==========================================================================
Helper classes
========================================================================== */

/*
* Image replacement
*/

.ir {
background-color: transparent;
border: 0;
overflow: hidden;
/* IE 6/7 fallback */
*text-indent: -9999px;
}

.ir:before {
content: "";
display: block;
width: 0;
height: 150%;
}

/*
* Hide from both screenreaders and browsers: h5bp.com/u
*/

.hidden {
display: none !important;
visibility: hidden;
}

/*
* Hide only visually, but have it available for screenreaders: h5bp.com/v
*/

.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}

/*
* Extends the .visuallyhidden class to allow the element to be focusable
* when navigated to via the keyboard: h5bp.com/p
*/

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}

/*
* Hide visually and from screenreaders, but maintain layout
*/

.invisible {
visibility: hidden;
}

/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
*    `contenteditable` attribute is included anywhere else in the document.
*    Otherwise it causes space to appear at the top and bottom of elements
*    that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
*    `:before` to contain the top-margins of child elements.
*/

.clearfix:before,
.clearfix:after {
content: " "; /* 1 */
display: table; /* 2 */
}

.clearfix:after {
clear: both;
}

/*
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/

.clearfix {
*zoom: 1;
}

/* ==========================================================================
EXAMPLE Media Queries for Responsive Design.
These examples override the primary ('mobile first') styles.
Modify as content requires.
========================================================================== */

/*@media only screen and (min-width: 35em) {
Style adjustments for viewports that meet the condition
}*/

@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
/* Style adjustments for high resolution devices */
}

/* ==========================================================================
Print styles.
Inlined to avoid required HTTP connection: h5bp.com/r
========================================================================== */

@media print {
* {
background: transparent !important;
color: #000 !important; /* Black prints faster: h5bp.com/s */
box-shadow: none !important;
text-shadow: none !important;
}

a,
a:visited {
text-decoration: underline;
}

a[href]:after {
content: " (" attr(href) ")";
}

abbr[title]:after {
content: " (" attr(title) ")";
}

/*
* Don't show links for images, or javascript/internal links
*/

.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: "";
}

pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid;
}

thead {
display: table-header-group; /* h5bp.com/t */
}

tr,
img {
page-break-inside: avoid;
}

img {
max-width: 100% !important;
}

@page {
margin: 0.5cm;
}

p,
h2,
h3 {
orphans: 3;
widows: 3;
}

h2,
h3 {
page-break-after: avoid;
}
}