@import url("https://fonts.verwaltungsportal.de/import/?family=Roboto:300,400,500,600,700,3000i,400i,500i,600i,700i");
body {
    font-family: "Roboto", sans-serif;
    color: #4d4d4d;
    background: #ffffff;
    font-size: 1rem; /* 1rem = 16px */
    line-height: 1.5;
}

@media (min-width: 768px) {
    body {
        font-size: 1.125rem;
    }
}

a {
    color: #ae6319;
}

a:hover,
a:focus {
    color: #ae6319;
    text-decoration: underline;
}

b, strong {
    font-weight: 700;
}

/* ----------------------------------------------- logo ----------------------------------------------- */

#logo {
    display: inline-block;
    margin: 10px 0;
    -webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
}

#logo img {
    display: block;
}

.is-sticky #logo {
    width: 150px;
}

@media (max-width: 991px) {
    #logo img {
        max-width: 210px;
        width: 100%;
    }
}

/* ------------------------------------------- navigation ------------------------------------------- */

nav {
    background-color: #ffffff;
}

/* burgermenu for tablet */

@media (max-width: 991px) {
    #burgerButton {
        font-size: 0;
        border: none !important;
        display: block;
        height: 50px;
        width: 60px;
        border-radius: 2px;
        padding: 6px 8px;
        cursor: pointer;
        background-color: #ffffff;
        -webkit-box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.08);
        box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.08);
    }
    #burgerButtonInner2, #burgerButton:after, #burgerButtonInner {
        background-color: #0b3542;
        border-radius: 2px;
        position: absolute;
        width: 40px;
        height: 3px;
        left: 10px;
        -webkit-transition: transform 200ms linear, opacity 200ms linear;
        -moz-transition: transform 200ms linear, opacity 200ms linear;
        -ms-transition: transform 200ms linear, opacity 200ms linear;
        -o-transition: transform 200ms linear, opacity 200ms linear;
        transition: transform 200ms linear, opacity 200ms linear;
    }
    #burgerButton[aria-expanded="true"] #burgerButtonInner {
        -webkit-transform: rotate(-45deg) translate(-6px, 6px);
        transform: rotate(-45deg) translate(-6px, 6px);
    }
    #burgerButton[aria-expanded="true"] #burgerButtonInner2 {
        opacity: 0;
    }
    #burgerButton[aria-expanded="true"]:after {
        -webkit-transform: rotate(45deg) translate(-4px, -6px);
        transform: rotate(45deg) translate(-4px, -6px);
    }
    #burgerButtonInner {
        top: 16px;
    }
    #burgerButtonInner2 {
        top: 24px;
    }
    #burgerButton:after {
        top: 32px;
        content: "";
        display: block;
    }
    .navbar-nav {
        margin: 20px 0;
    }
    .navbar-collapse {
        top: 0;
        background: #ffffff;
        position: fixed;
        left: -100%;
        bottom: 0;
        z-index: 100;
        height: auto !important;
        -webkit-box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
        box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.5);
        opacity: 0;
        pointer-events: none;
        overflow-y: auto;
        -webkit-transition: left 300ms linear, opacity 300ms linear;
        -moz-transition: left 300ms linear, opacity 300ms linear;
        -ms-transition: left 300ms linear, opacity 300ms linear;
        -o-transition: left 300ms linear, opacity 300ms linear;
        transition: left 300ms linear, opacity 300ms linear;
    }
    .navbar-collapse[aria-expanded="true"],
    .navbar-collapse.in {
        left: 0;
        opacity: 1;
        pointer-events: auto;
    }
    .navbar-header {
        position: fixed;
        top: 15px;
        right: 15px;
        z-index: 101;
    }
    .navbar-toggle::before {
        content: "";
        opacity: 0;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: 0;
        z-index: -1;
        display: block;
        background-color: rgba(0, 0, 0, 0.5);
        -webkit-transition: width 300ms linear, opacity 300ms linear;
        -moz-transition: width 300ms linear, opacity 300ms linear;
        -ms-transition: width 300ms linear, opacity 300ms linear;
        -o-transition: width 300ms linear, opacity 300ms linear;
        transition: width 300ms linear, opacity 300ms linear;
    }
    .navbar-toggle[aria-expanded="true"]::before {
        opacity: 1;
        width: 90px;
    }
}

@media (min-width: 575px) and (max-width: 991px) {
    .navbar-collapse {
        width: 60%;
    }
    .navbar-collapse.collapse.in:after,
    .navbar-toggle[aria-expanded="true"]::before {
        width: 40%;
    }
}

/* menu desktop */

@media (min-width: 992px) {

    nav {
        padding-top: 30px;
    }

    .is-sticky nav {
        padding-top: 0;
        -webkit-transition: all 300ms ease;
-moz-transition: all 300ms ease;
-ms-transition: all 300ms ease;
-o-transition: all 300ms ease;
transition: all 300ms ease;
-webkit-box-shadow: 5px 4px 8px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 5px 4px 8px 0px rgba(0,0,0,0.15);
box-shadow: 5px 4px 8px 0px rgba(0,0,0,0.15);
    }

    .navbar, .navbar>div#myNavbar, .navbar>div#myNavbar>ul, .navbar>div#myNavbar>ul>li {
        height: 100% !important;
    }
    nav.horizontally .navbar-nav {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify !important;
        -ms-flex-pack: justify !important;
        justify-content: space-between !important;
        -webkit-box-align: center !important;
        -ms-flex-align: center !important;
        align-items: center !important;
    }
    nav.horizontally .navbar-nav>li {
        flex-grow: 1;
    }
    nav.horizontally .dropdown-menu {
        position: absolute;
        top: 100%;
        left: 0;
        z-index: 1000;
    }
    nav.horizontally .navbar-nav>li>.dropdown-menu>li>.dropdown-menu {
        position: absolute;
        left: 100%;
        top: 0;
    }
    nav.horizontally .navbar-nav>li, nav.horizontally .navbar-nav>li>.dropdown-menu>li {
        position: relative;
    }
    .navbar-default .navbar-nav li[class*="toplevel"] > ul,
    .navbar-default .navbar-nav li[class*="secondlevel"] > ul {
        display: block !important;
        pointer-events: none;
        opacity: 0;
        -webkit-transition: opacity 300ms linear;
        -moz-transition: opacity 300ms linear;
        -ms-transition: opacity 300ms linear;
        -o-transition: opacity 300ms linear;
        transition: opacity 300ms linear;
    }
    .navbar-default .open > .dropdown-menu,    
    .navbar-default .navbar-nav li[class*="toplevel"]:hover > ul,
    .navbar-default .navbar-nav li[class*="secondlevel"]:hover > ul,
    .navbar-default .navbar-nav li[class*="secondlevel"] > ul[style*="block"] {
        pointer-events: auto !important;
        opacity: 1 !important;
    }
    .navbar-default .navbar-nav li[class*="toplevel"]:focus-within > ul,
    .navbar-default .navbar-nav li[class*="secondlevel"]:focus-within > ul {
        pointer-events: auto !important;
        opacity: 1 !important;
    }
    .navbar-default .nav .open > .dropdown-menu {
        pointer-events: none !important;
        opacity: 0 !important;
    }
}

/* ---------------------------------------------- toplevel ---------------------------------------------- */

.navbar-default .navbar-nav>li>a {
    color: #0b3542;
    font-weight: 500;
    text-align: left;
    padding: 10px 15px;
    position: relative;
    font-size: 1rem;
    line-height: 1.2;
    text-decoration: none;
}

@media (max-width: 991px) {
    nav.horizontally .navbar-nav>li>a.dropdown-toggle {
        padding-right: 35px;
    }
}

@media (min-width: 992px) {
    .navbar-default .navbar-nav>li>a {
        padding: 20px 10px;
        display: flex;
        align-content: center;
        align-items: center;
        justify-content: center;
        text-align: center;
        height: 100%;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) and (min-width: 992px) {
    .navbar-default .navbar-nav>li>a {
        display: block;
    }
}

/* -------------------------------------------- toplevel-over ------------------------------------------- */

.navbar-nav > li:hover > a,
.navbar-nav > li > a:hover,
.navbar-nav > li > a:focus,
.navbar-nav > li.open > a,
.navbar-nav > li.open > a:hover,
.navbar-nav > li.open > a:focus,
.navbar-nav > li[class$="_over"] > a,
.navbar-nav > li[class$="_over"] > a:hover,
.navbar-nav > li[class$="_over"] > a:focus {
    color: #ae6319;
    background-color: transparent;
}

.navbar-nav > li:focus-within > a {
    color: #ae6319;
    background-color: transparent;
}

/* -------------------------------------- secondlevel + thirdlevel dropdown-box -------------------------------------- */

.navbar-default .navbar-nav>li>.dropdown-menu, .navbar-default .navbar-nav>li>.dropdown-menu>li>.dropdown-menu {
    padding: 10px 0;
    background-color: #ffffff;
    border-radius: 4px;
    -webkit-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.2);
}

@media (min-width: 992px) {
    .navbar-default .navbar-nav>li>.dropdown-menu {
        left: 0%;
        margin-top: 10px;
        -moz-transform: translate(0%, 0);
        -webkit-transform: translate(0%, 0);
        -o-transform: translate(0%, 0);
        -ms-transform: translate(0%, 0);
        transform: translate(0%, 0);
    }
    .navbar-default .navbar-nav>li>.dropdown-menu>li>.dropdown-menu {
        margin: -10px 0 0 10px;
    }
    .navbar-default .navbar-nav > li > .dropdown-menu::before {
        content: "";
        position: absolute;
        display: block;
        height: 10px;
        left: 0;
        right: 0;
        top: -10px;
    }
    .navbar-default .navbar-nav>li>.dropdown-menu>li>.dropdown-menu::before {
        content: "";
        position: absolute;
        display: block;
        width: 10px;
        top: 0;
        bottom: 0;
        left: -10px;
    }
}

/* --------------------------------------------- secondlevel + thirdlevel -------------------------------------------- */

.navbar-default .navbar-nav>li>.dropdown-menu>li>a, .navbar-default .navbar-nav>li>.dropdown-menu>li>.dropdown-menu>li>a {
    background-color: transparent;
    color: #4d4d4d;
    font-weight: 400;
    text-align: left;
    padding: 8px 30px;
    position: relative;
    font-size: 0.9375rem;
    line-height: 1.2;
    text-decoration: none;
}

@media(max-width:991px) {
    .navbar-default .navbar-nav>li>.dropdown-menu>li>a, .navbar-default .navbar-nav>li>.dropdown-menu>li>.dropdown-menu>li>a {
        text-align: left;
    }
    nav.horizontally .navbar-nav>li>.dropdown-menu>li>a.dropdown-toggle2 {
        padding-right: 35px;
    }
}


/* ------------------------------------------ secondlevel + thirdlevel over ------------------------------------------ */

.navbar-nav > li > .dropdown-menu > li:hover > a,
.navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-nav > li > .dropdown-menu > li > a:focus,
.navbar-nav > li > .dropdown-menu > li.open > a,
.navbar-nav > li > .dropdown-menu > li.open > a:hover,
.navbar-nav > li > .dropdown-menu > li.open > a:focus,
.navbar-nav > li > .dropdown-menu > li[class$="_over"] > a,
.navbar-nav > li > .dropdown-menu > li[class$="_over"] > a:hover,
.navbar-nav > li > .dropdown-menu > li[class$="_over"] > a:focus,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li > a:hover,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li > a:focus,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li.open > a,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li.open > a:hover,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li.open > a:focus,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li[class$="_over"] > a,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li[class$="_over"] > a:hover,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li[class$="_over"] > a:focus {
    color: #ae6319;
    background-color: transparent;
}

.navbar-nav > li > .dropdown-menu > li:focus-within > a,
.navbar-nav > li > .dropdown-menu > li > .dropdown-menu > li:focus-within > a {
    color: #ae6319;
    background-color: transparent;
}

/* ----------------------------------------------- contact Buttons ----------------------------------------------- */

.contactHover {
    display: block;
    position: relative;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: auto, 0 0;
}

@media (max-width: 991px) {
    .mail.contactHover {
        margin-top: 0px
    }

    .contactHover {
        max-width: 400px;
        margin: 10px auto;
        padding-top: 0px;
        background-position: center top;
    }
}

@media (min-width: 992px) {
    .contactIcons {
        margin-left: 30px;
    }

    .contactHover, .contactIcons {
        line-height: 0;
    }
    .contactHover {
        display: inline-block;
        padding: 4px;
        height: 40px;
        width: 40px;
        -webkit-transition: background-size 300ms linear;
        -moz-transition: background-size 300ms linear;
        -ms-transition: background-size 300ms linear;
        -o-transition: background-size 300ms linear;
        transition: background-size 300ms linear;
    }
    .contactHover+.contactHover {
        margin-left: 2px;
    }
}




@media (min-width: 992px) {
    .contactHover:hover,
    .contactHover:focus {
        background-size: auto, 100% 100%;
    }

    .contactHover.phone {
        background: url('../img/icon-telefon.png') center center no-repeat, #176071;
        border-radius: 50%;
    }
    
}

.contactOpen {
    z-index: 50;
    background: #0b3542;
    color: #ffffff;
    padding: 20px;
    margin-top: 0;
    line-height: 1.3;
    text-align: center;
    border-radius: 4px;
    font-size: 0.9375rem;
}

@media (max-width: 991px) {
    .contactOpen {
        margin-top: 10px;
    }
}

@media (min-width: 992px) {
    .contactOpen {
        border-radius: 4px;
        opacity: 0;
        pointer-events: none;
        position: absolute;
        top: 100%;
        right: -15px;
        width: 270px;
        -webkit-transition: opacity 300ms linear, margin-top 300ms linear;
        -moz-transition: opacity 300ms linear, margin-top 300ms linear;
        -ms-transition: opacity 300ms linear, margin-top 300ms linear;
        -o-transition: opacity 300ms linear, margin-top 300ms linear;
        transition: opacity 300ms linear, margin-top 300ms linear;
    }

    .contactOpen::after {
        content: "";
        position: absolute;
        top: -12px;
        right: 20px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 15px 12px 15px;
        border-color: transparent transparent #0b3542 transparent;
    }

    .contactOpen::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        height: 15px;
        top: -15px;
        display: block;
    }

    .contactHover:hover .contactOpen,
    .contactHover:focus .contactOpen {
        opacity: 1;
        pointer-events: auto;
        margin-top: 15px;
    }
}

.contactOpen a {
    color: #ffffff;
    text-decoration: none;
}


/* ----------------------------------------------- banner ----------------------------------------------- */

#slider {
    overflow: hidden;
    max-height: 300px;
    margin: 0 auto;
    position: relative;
    width: 100%;
}

#headerpic {
    position: relative;
}

.slider-mask {
    display: none;
}

#bannerOverlay {
    color: #0b3542;
    font-size: 1.625rem;
}

#headline {
    font-size: 3.375rem;
    color: #176071;
    font-weight: 500;
}

#bannerOverlay a {
    background: url(../img/mail.png) center left 12px no-repeat #ce751d;
    border-radius: 4px;
    padding: 10px 35px 10px 40px;
    color: #2e1a06;
    font-weight: 500;
    font-size: 0.9375rem;
    display: inline-block;
}

#bannerOverlay a:hover, #bannerOverlay a:focus {
    text-decoration: none;
}

@media (max-width: 991px) {
    #bannerOverlay {
        padding: 20px;
    }
}

@media (min-width: 992px) {

    #bannerOverlay {
        position: absolute;
        width: 100%;
        bottom: 10%;
        z-index: 20;
    }

   body.index .slider-mask {
        display: block;
        background: linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0.3) );
    }

    #slider {
        max-height: 700px;
    }

    body:not(.index) #slider {
        max-height: 500px;
    }

    #headerpic a.nivo-prevNav {
        left: 65px;
    }

    #headerpic a.nivo-nextNav {
        right: 65px;
    }
}

.slider-wrapper, #slider {
    height: 100%;
}



/* --------------------------------------------- tabs -------------------------------------------- */

#teaser {
    padding-top: 70px;
    padding-bottom: 70px;
    background-color: #ffffff;
}

.tab {
border-radius: 4px;
font-size: 1.125rem;
padding: 30px;
}

.tab1 {
    background-color: #176071;
    color: #ffffff;
}

#teaser .hrstyle,#teaser hr {
    margin-top: 15px;
    margin-bottom: 13px;
}

.tab1 .hrstyle,.tab1 hr {
 background-color: rgba(255,255,255,0.5);
}

.tab2 {
    -webkit-box-shadow: 5px 4px 8px 0px rgba(0,0,0,0.15);
-moz-box-shadow: 5px 4px 8px 0px rgba(0,0,0,0.15);
box-shadow: 5px 4px 8px 0px rgba(0,0,0,0.15);
}

.tab1 h1,.tab1 .h1,.tab1 .legacy_h1,
.tab1 h2,.tab1 .h2,.tab1 .legacy_h2,
.tab1 h3,.tab1 .h3,.tab1 .legacy_h3,
.tab1 h4,.tab1 .h4,.tab1 .legacy_h4,
.tab1 h6,.tab1 .h6,.tab1 .legacy_h6,
.tab1 h5,.tab1 .h5,.tab1 .legacy_h5 {
    color: #ffffff;
    margin-bottom: 5px;
}

.tab1 h1 em,
.tab1 h1 i,
.tab1 h1 span,
.tab1 h2 em,
.tab1 h2 i,
.tab1 h2 span,
.tab1 h3 em,
.tab1 h3 i,
.tab1 h3 span,
.tab1 h4 em,
.tab1 h4 i,
.tab1 h4 span,
.tab1 h5 em,
.tab1 h5 i,
.tab1 h5 span,
.tab1 h6 em,
.tab1 h6 i,
.tab1 h6 span {
    color: #ffffff;
    font-size: 60%;
    text-transform: uppercase;
    margin-top: 3px;
    display: block;
    font-style: normal;
}

.tab2 h1,.tab2 .h1,.tab2 .legacy_h1,
.tab2 h2,.tab2 .h2,.tab2 .legacy_h2,
.tab2 h3,.tab2 .h3,.tab2 .legacy_h3,
.tab2 h4,.tab2 .h4,.tab2 .legacy_h4,
.tab2 h6,.tab2 .h6,.tab2 .legacy_h6,
.tab2 h5,.tab2 .h5,.tab2 .legacy_h5 {
    margin-bottom: 5px;
}

.tab2 h1 em,
.tab2 h1 i,
.tab2 h1 span,
.tab2 h2 em,
.tab2 h2 i,
.tab2 h2 span,
.tab2 h3 em,
.tab2 h3 i,
.tab2 h3 span,
.tab2 h4 em,
.tab2 h4 i,
.tab2 h4 span,
.tab2 h5 em,
.tab2 h5 i,
.tab2 h5 span,
.tab2 h6 em,
.tab2 h6 i,
.tab2 h6 span {
    color: #4d4d4d;
    font-size: 60%;
    text-transform: uppercase;
    margin-top: 3px;
    font-style: normal;
    display: block;
}

.tab1 a {
    color: #ffffff;
}

.tab2 a {
    color: #4d4d4d;
}

@media (max-width: 991px) {
    .tab {
       margin-bottom: 25px;
    }
}

@media (min-width: 992px) {
    .tab {
        padding: 60px;
        min-height: 100%;
    }
}

/* ------------------------------------------------ content ----------------------------------------------- */

body:not(.index) main {
    text-align: left;
    min-height: 200px;
    padding-top: 30px;
    padding-bottom: 30px;
}


/* ------------------------------------------ h1 - h6, newslink ----------------------------------------- */

.h4link a:link, .h4link a:hover, .h4link a:focus, .h4link a:visited, H6, H5, H4, H3, H2, H1 {
    color: #176071;
    font-weight: 500;
    line-height: 1.2;
    font-family: "Roboto", sans-serif;
}

h1, .h1, .legacy_h1 {
    font-size: 1.8rem;
}

@media (min-width: 992px) {
    h1, .h1, .legacy_h1 {
        font-size: 2.5rem;
    }
}

h2, .h2, .legacy_h2 {
    font-size: 1.7rem;
}

@media (min-width: 992px) {
    h2, .h2, .legacy_h2 {
        font-size: 2.2rem;
    }
}

h3, .h3, .legacy_h3 {
    font-size: 1.6rem;
}

@media (min-width: 992px) {
    h3, .h3, .legacy_h3 {
        font-size: 2rem;
    }
}

h4, .h4, .h4link a:link, .h4link a:hover, .h4link a:focus, .h4link a:visited, .legacy_h4 {
    font-size: 1.5rem;
}

@media (min-width: 992px) {
    h4, .h4, .h4link a:link, .h4link a:hover, .h4link a:focus, .h4link a:visited, .legacy_h4 {
        font-size: 1.7rem;
    }
}

h5, .h5, .legacy_h5 {
    font-size: 1.4rem;
}

@media (min-width: 992px) {
    h5, .h5, .legacy_h5 {
        font-size: 1.5rem;
    }
}

h6, .h6, .legacy_h6 {
    font-size: 1.3rem;
}

#newslinks, #newsmandate {
    border: 1px solid #2d2d2d;
}

/* ----------------------------------------------- footer ----------------------------------------------- */


footer {
    background: #176071;
    color: #ffffff;
}

#footer {
    padding-top: 26px;
    padding-bottom: 26px;
}

@media (max-width: 991px) {
    #footer .row>.col-xs-12:not(:first-child)::before {
        background: #ffffff;
        content: " ";
        height: 1px;
        width: 100%;
        display: block;
        margin: 20px 0;
        opacity: 0.3;
    }
    #footer .row>.col-xs-12.hidden-xs~.col-xs-12::before, #footer .row>.col-xs-12.hidden-sm~.col-xs-12::before {
        display: none;
    }
}

#innerfooter ul {
    padding: 0;
}

#innerfooter li {
    display: inline-block;
}

#innerfooter a {
    color: #ffffff;
    text-decoration: none;
    display: inline-block;
    font-size: 1rem;
    border-radius: 2px;
    padding: 2px 4px;
}

#innerfooter a:hover,
#innerfooter a:focus {
    background: transparent;
}

#innerfooter li+li::before {
    content: '\2022';
    margin: 0 15px;
}

@media (min-width: 992px) {
    #innerfooter li+li::before {
        margin: 0 20px;
    }
}

/* --------------------------------------------- vernetzt -------------------------------------------- */

#vernetzt {
    text-align: right;
    font-size: 0.875rem;
    color: #ffffff;
    line-height: 1.4;
    margin: 0 auto;
    text-decoration: none;
}

@media (min-width: 768px) {
    #vernetzt {
        margin: 0;
    }
}

#vernetzt span {
    color: #ffffff;
}

#vernetzt span span {
    display: block;
}

#vernetzt img {
    margin-left: 10px;
}