body {
    font-family: "Open Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    color: #333;
    word-wrap: break-word;
}

.padding-md-device {
    padding-left: 10px !important;
    padding-right: 10px !important;    
}

@media (min-width: 768px) {
    .padding-md-device {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

.small {
    font-size: 80%;
}

a, a:hover {
    color: #333;
}

h1 {
    margin-bottom: 1rem;
}

@media print {
    .container {
        max-width: none;
    }
}

.header-main {
    height: 73px;
    padding: 10px 0;
    background-color: #f6f6f6;
}

.header-main .home-text .home {
    font-size: 18px;
    font-weight: 700;
    padding-bottom: 3px;
}

.header-main .home-text .home a {
    color: #333;
    text-decoration: none;    
    padding: 3px 0;
}

.header-main .home-text .home a:hover,
.header-main .home-text .home a:active,
.header-main .home-text .home a:focus {    
    color: #fff;
    background: #333;
}

.header-main .home-text .small {
    font-size: 80%;
}

.main-content-bg-image,
.main-content {    
    /* Fixed Header Menu */
    margin-top: 73px;
    /* Fixed Header Menu */
}

@-webkit-keyframes fadeinout {
  0%   { opacity:1; }
  50%  { opacity:0.75; }
  100% { opacity:1; }
}

@keyframes fadeinout {
  0%   { opacity:1; }
  50%  { opacity:0.75; }
  100% { opacity:1; }
}

.main-content-bg-image {      
    display: flex;
    align-items: center;
    justify-content: end;      
    background-image: url(/img/header-mobile.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    height: 500px;    
    -webkit-animation: fadeinout 12s infinite;
    animation: fadeinout 12s infinite;
}

@media (min-width: 992px) {
    .main-content-bg-image { 
        background-image: url(/img/header.jpg);
        height: 800px;
    }
}

.main-content {    
    padding: 30px 0;    
}

@media print {
    .main-content {  
        margin-top: 0;
        padding: 10px 0;
    }
}

.home-content {    
    text-transform: uppercase;
    color: #fff;    
}

@media print {
    .home-content { 
        color: #333;
    }
}

.home-content h1 {
    font-size: 50px;
    margin-bottom: 0;
    font-weight: 700;
}

@media (min-width: 992px) {
    .home-content h1 {
        font-size: 70px;
    }
}

.txtblock-wrapper figure {
    display: table;
    max-width: 100%;
    word-break: break-word;
    width: auto !important;
    margin: 0;
}

.txtblock-wrapper figure figcaption {
    display: table-caption;
    max-width: inherit;
    caption-side: bottom;
    word-wrap: break-word;
    padding: 5px;
    min-height: 29px;
    border: 1px solid #ccc;
    background-color: #fff;
    font-size: .7rem;
    font-weight: 400;
}

.figure-wrapper {
    margin-bottom: 20px;
}

.figure-wrapper.unten {    
    margin-top:20px;
}

.figure-wrapper.mobile {    
    max-width: 250px;
}

@media (min-width: 992px) { 
.figure-wrapper.mobile {    
    max-width: none;
    }
}

@media (min-width: 992px) {    
    .figure-wrapper.rechts {    
        float: right;
        margin-left: 20px;
    }
}

@media (min-width: 1px) {
    .navbar-wrapper {
        display: flex;
        align-items: center;
        justify-content: end;
    }
}

.navbar {
    padding: 0;
    display: inline-block;
    background-color: #eeeeef;
}

@media (min-width: 992px) {
    .navbar {
        background-color: transparent;
	}
}

.navbar .menu-wrapper {
	padding: 20px;
}

@media (min-width: 992px) {
    .navbar .menu-wrapper {
        padding: 0;
    }
}

.offcanvas-active .navbar-toggler-wrapper {
    display: none;
}

.navbar-toggler-wrapper {
    display: inline-block;
    float: right;
}

.navbar-toggler-wrapper .toggler {
    background: transparent;
    padding: 0;
}

.navbar-toggler-wrapper .toggler .fa-bars {
    font-size: 1.75rem;
    color: #333;
}

button.toggler {
    border: none;
    
}

.navbar-nav > li > a {
    color: #333;
    text-transform: uppercase;
    font-weight: 700;
    text-decoration: none;
    display: block;
    padding: 10px;
}

.navbar-nav > li > a:hover, 
.navbar-nav > li > a:active, 
.navbar-nav > li > a:focus, 
.navbar-nav > li > a.active {
    color: #fff;
    background: #333;
}

@media (min-width: 992px) {
	.navbar-nav > li > a {
		padding: 3px 5px;
        margin: 0 20px 0 0;
	}
	  
    .navbar-nav > li > a .fa {
        font-size: 20px;
    }
}

/* Mobile Offcanvas Start */
@media (max-width: 991.98px) {
	body.offcanvas-active {
		 overflow: hidden;
		 padding-right: 0px;
	}
}

.mobile-offcanvas .offcanvas-header {
	display: none;
	padding: 0;
}

@media (max-width: 991.98px) {
    .mobile-offcanvas {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        visibility: hidden;
        z-index: 1045;
        display: block;
        width: 90%;
        outline: 0;
        max-height: 100%;
        transform: translate(-100%, 0);
        overflow-y: auto;
        overflow-x: hidden;
        transition: transform 0.3s ease-in-out;
	}
    .mobile-offcanvas.show {
        top: 0;
        visibility: visible;
        transform: none;
}
    .mobile-offcanvas .offcanvas-header {
        display: block;
        padding-bottom: 10px;
}
    .mobile-offcanvas .offcanvas-header .btn-close-menu {
        color: #333;
        padding: 0;
        cursor: pointer;
        background: none;
        border:none;
}
    .mobile-offcanvas .container, .mobile-offcanvas .container-fluid {
        display: block;
}
    .mobile-screen-darken {
        height: 100%;
        width: 0%;
        z-index: 30;
        position: fixed;
        top: 0;
        right: 0;
        opacity: 0;
        visibility: hidden;
        background-color: #333;
        opacity: 0.9 !important;
        transition: opacity 0.2s linear, visibility 0.2s, width 2s ease-in;
}
    .mobile-screen-darken.active {
        z-index: 999;
        transition: opacity 0.3s ease, width 0s;
        opacity: 1;
        width: 100%;
        visibility: visible;
}
}
/* Mobile Offcanvas End */

footer {
    background-color: #f6f6f6;
    padding: 20px 0;
}
