@charset "utf-8";

@font-face {
    font-family: 'werkfam';
    src: url('font/werkfam.eot?8948027');
    src: url('font/werkfam.eot?8948027#iefix') format('embedded-opentype'),
    url('font/werkfam.woff?8948027') format('woff'),
    url('font/werkfam.ttf?8948027') format('truetype'),
    url('font/werkfam.svg?8948027#werkfam') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'fontello';
    src: url('../Fonts/fontello/fontello.eot');
    src: url('../Fonts/fontello/fontello.eot#iefix') format('embedded-opentype'),
    url('../Fonts/fontello/fontello.woff') format('woff'),
    url('../Fonts/fontello/fontello.woff2') format('woff1'),
    url('../Fonts/fontello/fontello.ttf') format('truetype'),
    url('../Fonts/fontello/fontello.svg#fontello') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PT Sans';
    src: url('../Fonts/PTSans/PTSans.eot');
    src: url('../Fonts/PTSans/PTSans.eot') format('embedded-opentype'),
    url('../Fonts/PTSans/PTSans400.woff') format('woff'),
    url('../Fonts/PTSans/PTSans400.woff2') format('woff2'),
    url('../Fonts/PTSans/PTSans400.ttf') format('truetype'),
    url('../Fonts/PTSans/PTSans.svg?#ptsans') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'PT Sans';
    src: url('../Fonts/PTSans/PTSans.eot');
    src: url('../Fonts/PTSans/PTSans.eot') format('embedded-opentype'),
    url('../Fonts/PTSans/PTSans400Italic.woff') format('woff'),
    url('../Fonts/PTSans/PTSans400Italic.woff2') format('woff2'),
    url('../Fonts/PTSans/PTSans400Italic.ttf') format('truetype'),
    url('../Fonts/PTSans/PTSans.svg?#ptsans') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'PT Sans';
    src: url('../Fonts/PTSans/PTSans.eot');
    src: url('../Fonts/PTSans/PTSans.eot') format('embedded-opentype'),
    url('../Fonts/PTSans/PTSans700.woff') format('woff'),
    url('../Fonts/PTSans/PTSans700.woff2') format('woff2'),
    url('../Fonts/PTSans/PTSans700.ttf') format('truetype'),
    url('../Fonts/PTSans/PTSans.svg?#ptsans') format('svg');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'PT Sans';
    src: url('../Fonts/PTSans/PTSans.eot');
    src: url('../Fonts/PTSans/PTSans.eot') format('embedded-opentype'),
    url('../Fonts/PTSans/PTSans700Italic.woff') format('woff'),
    url('../Fonts/PTSans/PTSans700Italic.woff2') format('woff2'),
    url('../Fonts/PTSans/PTSans700Italic.ttf') format('truetype'),
    url('../Fonts/PTSans/PTSans.svg?#ptsans') format('svg');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: 'FontAwesome';
    src: url('../Fonts/fontawesome/fontawesome-webfont.woff2') format('woff2'),
    url('../Fonts/fontawesome/fontawesome-webfont.woff') format('woff'),
    url('../Fonts/fontawesome/fontawesome-webfont.eot?#iefix') format("embedded-opentype"),
    url('../Fonts/fontawesome/fontawesome-webfont.ttf') format("truetype"),
    url('../Fonts/fontawesome/fontawesome-webfont.svg#fontawesomeregular') format("svg");
    font-weight: normal;
    font-style: normal;
}


[class^="icon-"]:before, [class*=" icon-"]:before {
    font-family: "werkfam";
    font-style: normal;
    font-weight: normal;
    speak: none;

    display: inline-block;
    text-decoration: inherit;
    width: 1em;
    margin-right: .2em;
    text-align: center;

    /* For safety - reset parent styles, that can break glyph codes*/
    font-variant: normal;
    text-transform: none;

}

.icon-menu:before { content: '\e800'; } /* '' */
.icon-nach_oben:before { content: '\e801'; } /* '' */
.icon-nach_unten:before { content: '\e802'; } /* '' */
.icon-right-fat:before { content: '\e803'; } /* '' */
.icon-left-open:before { content: '\e804'; } /* '' */
.icon-right-open:before { content: '\e805'; } /* '' */

* {
    padding: 0;
    margin: 0;
}

body {
    color: #333;
    font-family: 'PT Sans', sans-serif;
    font-size: 125%;
    overflow-x: hidden;
}

a {
    color: #f8b70a;
}

a span:after {
    content: '\00bb';
    padding-left: 3px;
}

.links a span:after,
.fancybox-outer a span:after {
    content: '';
}

li {
    list-style: none;
}

img {
    border: none;
    outline: none;
    vertical-align: middle;
    max-width: 100%;
    height: auto;
}

h1,h2 {
    color: #004d9e;
    text-transform: uppercase;
    font-size: 150%;
    font-weight: 700;
    letter-spacing: 1px;
    line-height: 35px;
    margin: 20px 0 5px 0;
}

h3 {
    font-size: 100%;
    font-weight: 400;
    text-transform: uppercase;
    margin-bottom: 0;
    line-height: 25px;
}

h4 {
    color: #004d9e;
    font-size: 110%;
}

h5 {
    color: #004d9e;
    font-size: 120%;
    margin-bottom: 6px;
}

#jumplabel {
    min-height: 0;
}


.container {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
    position: relative;
}

nav#mainnav .container {
    position: relative;
    z-index: 20;
}

header {
    background-color: #008ad1;
}

header div#metanav {
    float: right;
    position: relative;
    z-index: 1;
}

header div#metanav ul {
    float: left;
}

header div#metanav ul li {
    display: inline-block;
    padding: 12px 0;
}

header div#metanav ul li.facebook {
    padding-right: 5px;
}

header div#metanav ul li a {
    color: #fff;
    text-transform: uppercase;
    font-size: 65%;
    padding: 10px 10px;
}

header div#metanav ul li.facebook a,
header div#metanav ul li.twitter a,
header div#metanav ul li.linkedin a {
    font-size: 0;
    position: relative;
}

header div#metanav ul li.facebook a:before {
    content: '\f09a';
    font-family: 'fontello';
    font-size: 20px;
    position: absolute;
    top: -10px;
    left: 0;
}

header div#metanav ul li.twitter a:before {
    content: '\f099';
    font-family: 'fontello';
    font-size: 20px;
    position: absolute;
    top: -10px;
    left: 0;
}

header div#metanav ul li.linkedin a:before {
    content: '\f30c';
    font-family: 'fontello';
    font-size: 20px;
    position: absolute;
    top: -10px;
    left: 0;
}

header div#metanav .search-nav {
    margin-right: 134px;
}

header div#metanav form {
    float: left;
    margin: 18px 50px 0 10px;
    display: none;
}

header div#metanav form input {
    float: left;
    font-size: 70%;
    background-color: #fff;
    border: none;
    padding: 5px 2px;
    height: 11px;
    width: 100px;
    -webkit-box-shadow: inset 0px 14px 7px -9px rgba(204,204,204,1);
    -moz-box-shadow: inset 0px 14px 7px -9px rgba(204,204,204,1);
    box-shadow: inset 0px 14px 7px -9px rgba(204,204,204,1);
}

header form p {
    float: left;
    background-color: #f8b70a;
    line-height: 1em;
}

header form p a {
    padding: 0px 5px 0px 6px;
}

header form p a:before {
    color: #fff;
    content: '\e803';
    font-family: "werkfam";
    font-size: 65%;
}

header form input[type="submit"] {
    display: none;
}

header .logo {
    padding: 40px 0 110px 0;
    width: 25%;
    position: relative;
    z-index: 50;
}

header .logo img {
    width: 100%;
    height: auto;
}

header .navbutton {
    position: absolute;
    top: 20px;
    right: 15px;
    z-index: 10;
    cursor: pointer;
}

.material-icons:before {
    content: '\e800';
    font-family: 'werkfam';
    font-style: normal;
    font-size: 200%;
    color: #f8b70a;
    display: block;
}

nav#mainnav {
    background-color: transparent;
    margin-top: -85px;
    height: auto;
    position: absolute;
    box-shadow: none;
    -moz-transform: rotate(-4.8deg);
    -ms-transform: rotate(-4.8deg);
    -o-transform: rotate(-4.8deg);
    -webkit-transform: rotate(-4.8deg);
    transform: rotate(-4.8deg);
    z-index: 99;
}

nav#mainnav .leftside {
    display: none;
}

nav#mainnav ul {
    background-color: #f8b70a;
}

nav#mainnav ul li a {
    color: #000;
    letter-spacing: 2px;
    font-weight: 700;
    font-size: 118%;
    text-transform: uppercase;
    height: 40px;
    line-height: 40px;
}

nav#mainnav ul li.active a,
nav#mainnav ul li:focus a,
nav#mainnav ul li:hover a {
    color: #fff;
    background-color: #f8b70a;
}

nav#mainnav ul li a {
    position: relative;
}

nav#mainnav ul > li:focus > a:after,
nav#mainnav ul > li:hover > a:after {
    display: none;
    content: '';
    position: absolute;
    left: 50%;
    left: calc(50% - 14px);
    bottom: -12px;
    color: #f8b70a;
    width: 0;
    height: 0;
    border-top: 14px solid;
    border-left: 14px solid transparent;
    border-right: 14px solid transparent;
}

nav#mainnav a.visibleafter:after {
    display: inline-block!important;
}

nav#mainnav ul ul {
    display: none;
    padding-top: 20px;
    padding-left: 30px;
    background-color: transparent;
}

nav#mainnav ul ul li {
    color: #000;
    background-color: transparent;
    list-style-type: disc;
    float: none;
    line-height: 20px;
}

nav#mainnav ul li ul li a,
nav#mainnav ul li.active ul li a,
nav#mainnav ul li:focus ul li a,
nav#mainnav ul li:hover ul li a {
    text-transform: none;
    font-weight: 400;
    font-size: 90%;
    color: #000;
    background-color: transparent;
    text-transform: none;
    line-height: 28px;
    height: 28px;
    margin-left: -20px;
}

nav#mainnav ul li ul li.active a,
nav#mainnav ul li ul li:focus a,
nav#mainnav ul li ul li:hover a {
    font-weight: 700;
}

nav#mainnav .background {
    background-color: #fff;
    width: 110%;
    height: 0;
    margin-top: 25px;
    margin-left: -5%;
    -webkit-box-shadow: inset 0px 2px 36px -4px rgba(0,0,0,0.75);
    -moz-box-shadow: inset 0px 2px 36px -4px rgba(0,0,0,0.75);
    box-shadow: inset 0px 2px 36px -4px rgba(0,0,0,0.75);
    position: absolute;
    top: 0px;
}

.imagewrapper {
    margin-top: -160px;
    overflow-x: hidden;
    position: static;
    z-index: 9999;
}

.imagewrapper > img {
    width: 100%;
    height: auto;
}

.slider .slides {
    background-color: transparent;
}

ul.indicators {
    bottom: 20px;
}

.slider .indicators .indicator-item.active {
    background-color: #f8b70a;
}

.imagedescription {
    color: #fff;
    padding: 10px 0;
    background: rgba(0,138,209,0.8);
    letter-spacing: 2px;
    font-weight: 700;
    font-size: 70%;
    position: relative;
    -moz-transform: rotate(-4.8deg);
    -ms-transform: rotate(-4.8deg);
    -o-transform: rotate(-4.8deg);
    -webkit-transform: rotate(-4.8deg);
    transform: rotate(-4.8deg);
    -webkit-backface-visibility: hidden;
    filter: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><filter id="gaussian_blur"><feGaussianBlur in="SourceGraphic" stdDeviation="0" /></filter></defs></svg>#gaussian_blur');
    margin-top: -75px;
    margin-left: -20px;
    width: 110%;
}

.imagedescription > .container {
    padding-left: 35px;
}

.imagereference {
    color: #000;
    font-size: 80%;
    position: absolute;
    top: 20px;
    right: 10px;
}

.streifen {
    margin-top: -78px;
    position: relative;
    z-index: 10;
}

.streifen img {
    width: 100%;
    height: auto;
}

.institutions {
    overflow: hidden;
    margin-bottom: 30px;
    position: relative;
    z-index: 1;
}

.institutions > div {
    float: right;
}

.institutions .ubw img {
    width: 209px;
}
.institutions .handwerk img {
    width: 234px;
}

.content .row {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 20px;
    border-bottom: 1px solid #e2e2e2;
}

.content .row:empty {
    padding: 0;
    margin: 0;
    border: none;
}

.content .row .col.s4:first-child {
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 12px;
}

.content .row .col.s4:nth-child(2) {
    box-sizing: border-box;
    padding-left: 6px;
    padding-right: 6px;
}

.content .row .col.s4:last-child {
    padding-left: 12px;
    padding-right: 0;
}

.content .row .col.s6:first-child {
    padding-left: 0;
}

.content .row .col.s6:nth-child(2) {
    padding-right: 0;
}

.textpic {
    overflow: hidden;
    margin-bottom: 30px;
}

.textpic li {
    margin-left: 20px;
    list-style-type: disc;
    text-align: left;
}

.textpic li.prev,
.textpic li.next {
    list-style-type: none;
}

.textpic p {
    margin-bottom: 10px;
}

.textpic.gal {
    overflow: visible;
    position: relative;
}

.content .row .col.s4 .textpic img {
    width: 100%;
    height: auto;
}

.textpic.addressdata h3 {
    padding-top: 0;
}

.textpic.addressdata p {
    margin: 0;
}

.textpic.addressdata p strong {
    font-weight: 700;
}

.content .row:last-of-type {
    border: none;
}

.image {
    margin-bottom: 20px;
}

.image img {
    max-width: 100%;
    height: auto;
}

.image dd.description {
    font-size: 70%;
}

.img-top {
    float: left;
    margin-right: 10px;
}

.gallery {
    position: relative;
    overflow-y: hidden;
}

.gallery-wrapper {
    width: 10000px;
    position: relative;
    left: 0;
}

.gallery .image img {
    width: auto!important;
    max-width: none;
}

.gallery-skipbuttons {
    position: absolute;
    width: 100%;
}

.gallery-skipbuttons li {
    position: absolute;
}

.gallery-skipbuttons li.prev {
    top: -130px;
    left: -60px;
}

.gallery-skipbuttons li.next {
    top: -130px;
    right: -60px;
}

.gallery-skipbuttons li a {
    font-size: 0;
}

.gallery-skipbuttons li.prev a:before {
    content: '\e804';
    font-family: werkfam;
    font-size: 40px;
}

.gallery-skipbuttons li.next a:before {
    content: '\e805';
    font-family: werkfam;
    font-size: 40px;
}

section.accordeon ul.collapsible {
    box-shadow: none;
    border: none;
}

section.accordeon ul.collapsible li {
    margin-bottom: 20px;
}

section.accordeon .collapsible-header {
    border: none;
    line-height: normal;
    padding: 10px;
    background-color: #eaeaea;
    position: relative;
}

section.accordeon .collapsible-header dl {
    width: 90%;
    display: inline-block;
}

section.accordeon .collapsible-header dt,
section.accordeon .collapsible-body dt {
    font-size: 80%;
}

section.accordeon .collapsible-header span {
    position: absolute;
    right: 15px;
}

section.accordeon .collapsible-header span:before {
    content: '\e802';
    font-family: werkfam;
    font-size: 250%;
    color: #fbb900;
}

section.accordeon .collapsible-header.active {
    height: 0;
    min-height: 0;
    padding: 0;
}

section.accordeon .collapsible-header.active span {
    margin-top: 10px;
}

section.accordeon .collapsible-header.active span:before {
    content: '\e801';
}

section.accordeon .collapsible-header.active dl {
    display: none;
}

section.accordeon .collapsible-body {
    background-color: #eaeaea;
    padding: 10px;
    overflow: hidden;
}

section.accordeon .collapsible-body p {
    padding: 0;
}

.more {
    float: right;
    clear: both;
    background-color: #fbb900;
}

.more a {
    color: #fff;
    text-transform: uppercase;
    padding: 0 10px;
    display: block;
}

.more, .back {
    margin-top: 20px;
}

.back  {
    position: absolute;
    bottom: -15px;
}

section.accordeon .more {
    margin-right: 13px!important;
}

.links span {
    color: #fff;
    background-color: #f8b70a;
    padding: 0 10px;
    margin-left: 5px;
}

.separator hr {
    border: 1px solid #004d9e;
    margin: 20px 0;
}

/* search */
.tx-indexedsearch-res {
    overflow: hidden;
}

.tx-indexedsearch-searchbox {
    display: none;
}

.tx-indexedsearch-redMarkup {
    color: #008ad1;
}

.morelink {
    float: right;
    margin-bottom: 20px;
}

.morelink a {
    font-size: 0;
}

.morelink a:after {
    content: 'weiter \00bb';
    font-size: 18px;
}

.tx-indexedsearch-browsebox {
    display: table;
    margin: 0 auto;
}

.tx-indexedsearch-browsebox li {
    display: inline-block;
    padding-right: 10px;
}

.tx-indexedsearch-browsebox p,
.tx-indexedsearch-browsebox li a {
    font-size: 80%;
}


/* form definitions */
.no-margin-bottom {
    margin-bottom: 0!important;
}

.csc-mailform {
    width: 80%;
    overflow: hidden;
}

div.csc-mailform li label {
    float: left;
    width: 13em;
    margin-right: 1em;
    vertical-align: baseline;
}

.tx-bfactor-subscription form li,
.csc-mailform li {
    position: relative;
    overflow: hidden;
}

.tx-bfactor-subscription legend,
.tx-bfactor-subscription label,
.csc-mailform legend,
.csc-mailform label {
    font-size: 100%;
    float: left;
    width: 20%;
    color: #333;
    padding-top: 10px;
    position: relative;
}

.tx-bfactor-subscription legend,
.tx-bfactor-subscription label {
    width: 30%;
}

.tx-bfactor-subscription label.for-radio {
    padding-top: 0;
    padding-bottom: 10px;
}

.tx-bfactor-subscription li > span {
    font-style: italic;
}

.tx-bfactor-subscription li > span.hint {
    font-size: 80%;
    margin-top: 10px;
    margin-bottom: 30px;
    display: inline-block;
}

.tx-bfactor-subscription input[type="radio"] + label {
    width: 17%;
    padding-top: 0;
}
.tx-bfactor-subscription input[type="radio"] {
    display: none;
}

.csc-mailform label em {
    font-style: normal;
    display: inline;
}

.tx-bfactor-subscription label strong,
.csc-mailform label strong {
    color: #f00;
    font-size: 75%;
    position: absolute;
    left: 0;
    top: 35px;
    line-height: 17px;
}

.tx-bfactor-subscription .tx-srfreecap-image {
    float: left;
    margin-bottom: 10px;
}

.tx-srfreecap-cant-read {
    float: left;
    font-size: 0;
    padding-left: 20px;
}

.tx-srfreecap-cant-read a:before {
    content: '\f021';
    color: #333;
    font-family: 'FontAwesome';
    font-size: 40px;
    font-style: normal;
    display: inline-block;
    margin-top: 6px;
}

.tx-srfreecap-cant-read + input[type="image"] {
    float: left;
    background: none;
    width: 70px;
}

.tx-bfactor-subscription label.sjbr-freecap-captcha-response-label {
    padding-right: 10px;
}

.tx-bfactor-subscription label.sjbr-freecap-captcha-response-label strong {
    top: 125px;
}

.tx-bfactor-subscription label.for-radio strong {
    top: 22px;
}

.tx-bfactor-subscription input,
.tx-bfactor-subscription textarea,
.csc-mailform input,
.csc-mailform button,
.csc-mailform textarea {
    float: left;
    width: 70%;
    font-size: 100%;
    padding: 10px;
    margin-bottom: 24px;
    height: auto;
    border: none;
    background-color: #eaeaea;
    box-sizing: border-box;
}

.tx-bfactor-subscription input.valid,
.tx-bfactor-subscription input:hover,
.tx-bfactor-subscription input:focus,
.tx-bfactor-subscription textarea:hover,
.tx-bfactor-subscription textarea:focus,
.csc-mailform input.valid,
.csc-mailform input:hover,
.csc-mailform input:focus,
.csc-mailform textarea:hover,
.csc-mailform textarea:focus {
    border: none!important;
    box-shadow: none!important;
}

.csc-mailform fieldset {
    border: none;
    margin: 0 0 20px 0;
    padding: 0;
}

.csc-mailform fieldset ol {
    width: 70%;
    float: left;
}

.csc-mailform fieldset ol li {
    display: inline;
}

.csc-mailform fieldset ol li label {
    width: auto;
}

.tx-bfactor-subscription input[type="radio"],
.csc-mailform input[type="radio"]{
    position: static;
    visibility: visible;
    width: 20px;
    margin: 20px 5px 20px 30px;
    background-color: transparent;
    box-sizing: content-box;
    float: none;
}

.tx-bfactor-subscription input[type="checkbox"],
.csc-mailform input[type="checkbox"] {
    background-color: transparent;
}

.csc-mailform select {
    display: block;
    float: left;
    width: 70%;
    background-color: #eaeaea;
}

.csc-mailform button[type="submit"],
.csc-mailform input[type="submit"] {
    color: #fff;
    background-color: #f8b70a;
}

input[type="checkbox"] + p {
    cursor: pointer;
}

.tx-bfactor-subscription input[type="checkbox"],
.csc-mailform input[type="checkbox"] {
    position: static;
    visibility: visible;
    width: 30px;
}

.csc-mailform button[type="submit"]:hover,
.csc-mailform button[type="submit"]:focus,
.csc-mailform input[type="submit"]:hover,
.csc-mailform input[type="submit"]:focus {
    background-color: #f8c724;
}

.csc-mailform .csc-form-element-textblock {
    float: left;
    font-size: 70%;
}

.csc-mailform .csc-form-element-checkbox label {
    float: right;
    width: calc(70% - 40px);
    margin-right: 30%;
    padding-top: 0;
    margin-top: -5px;
    margin-bottom: 20px;
}

.csc-mailform .static-text {
    color: #999;
    font-size: 80%;
    margin-bottom: 20px;
}

.tx-bfactor-address {
    width: 80%;
}

.tx-bfactor-subscription select,
.tx-bfactor-address select {
    display: block;
    background-color: #eaeaea;
    width: 70%;
    margin-bottom: 20px;
}

.tx-bfactor-subscription select option:first-child,
.tx-bfactor-address select option:first-child {
    display: none;
}

.tx-bfactor-subscription input[type="submit"],
.tx-bfactor-address input[type="submit"] {
    color: #fff;
    background-color: #f8b70a;
    border: none;
    width: 70%;
    padding: 10px;
    margin-bottom: 30px;
}

.tx-bfactor-subscription input[type="submit"]:hover,
.tx-bfactor-subscription input[type="submit"]:focus,
.tx-bfactor-address input[type="submit"]:hover,
.tx-bfactor-address input[type="submit"]:focus {
    background-color: #f8c724;
}

.tx-bfactor-subscription input[type="submit"] {
    margin-top: 40px;
    margin-left: 30%;
}

.tx-bfactor-subscription form p,
.tx-bfactor-address p {
    margin-bottom: 40px;
    font-size: 90%;
}

.tx-bfactor-subscription form p span,
.tx-bfactor-address p span {
    color: #004d9e;
}

.tx-bfactor-subscription form p strong,
.tx-bfactor-address p strong {
    font-weight: 700;
}

.tx-bfactor-subscription form div {
    font-size: 80%;
}

.tx-bfactor-subscription input[type="checkbox"] {
    margin-top: 20px;
}

.tx-bfactor-subscription input[type="checkbox"] + p {
    margin-top: 14px;
}

.shop-nav-back {
    float: left;
}

.shop-nav-for {
    float: right;
}

/* Cookie Banner */
#CybotCookiebotDialogBody {
    max-width: 700px!important;
}

#CybotCookiebotDialogBody [type="checkbox"]+label:before {
    content: none;
}

/* Freecap */
.sjbr-captcha {
    display: flex;
    flex-flow: row;
    padding-bottom: 25px;
}
.sjbr-freecap-row1 {
    width: 25%;
}
.sjbr-freecap-row1 .sjbr-freecap-captcha-response-label {
    width: 100% !important;
}
.sjbr-freecap-row2 {
    display: flex;
    flex-flow: column;
}
.sjbr-freecap-col1 {
    order: 2;
}
.sjbr-freecap-col1 img {
    float: left;
}
.sjbr-freecap-col2 {
    order: 1;
}
.sjbr-freecap-col2 input#sjbr-freecap-captcha-response {
    width: 90%;
    margin-left: 18px;
}
.tx-srfreecap-cant-read {
    padding-left: 10px;
    padding-right: 10px;
    width: max-content;
}

footer {
    font-size: 60%;
    background-color: #eaeaea;
    background: url(../img/footerbild.png) no-repeat;
    background-size: cover;
    padding-top: 85px;
    overflow: hidden;
}

footer > div {
    float: right;
    margin-top: 45px;
    margin-right: 15px;
    -moz-transform: rotate(-4.8deg);
    -ms-transform: rotate(-4.8deg);
    -o-transform: rotate(-4.8deg);
    -webkit-transform: rotate(-4.8deg);
    transform: rotate(-4.8deg);
    -webkit-backface-visibility: hidden;
    filter: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><filter id="gaussian_blur"><feGaussianBlur in="SourceGraphic" stdDeviation="0" /></filter></defs></svg>#gaussian_blur');
}

footer p,
footer ul.footernav {
    float: left;
    text-transform: uppercase;
}

footer ul.footernav a {
    color: #333;
    padding: 0 0 0 20px;
}

footer ul.imagelinks {
    float: right;
    margin: 20px 15px 20px 0;
    clear: both;
}

footer ul.imagelinks li img {
    width: 60%;
    height: auto;
    float: right;
}

@media screen and (max-width: 370px) {

    .imagereference {
        top: 40px;
    }

    .imagedescription {
        font-size: 50%;
        margin-top: -70px;
    }

    .streifen {
        margin-top: -70px;
    }
}

@media screen and (min-width: 371px) and (max-width: 450px) {

    .imagedescription {
        margin-top: -75px;
    }
    .streifen {
        margin-top: -75px;
    }
}

@media screen and (max-width: 580px) {

    .indicators {
        display: none;
    }

    .institutions {
        margin-top: 10px;
    }

    .content .more {
        width: 100%;
    }

    .csc-mailform label strong {
        left: 40%!important;
    }

    footer > div {
        font-size: 85%;
    }
}

@media screen and (max-width: 768px) {

    header {
        margin-bottom: 56px;
    }

    #mainnav ul.right {
        margin-bottom: -35px;
    }

    nav#mainnav ul.right ul {
        padding-bottom: 74px;
    }

    .imagewrapper {overflow-x:visible;}

    .slider {
        height: 350px!important;
    }

    ul.slides {
        height: 330px!important;
    }

    .institutions {
        padding: 20px 15px;
    }

    .institutions > div {
        display: flex;
        margin-top: 30px;
    }

    .institutions a {
        width: 33%;
    }

    .institutions a img {
        width: 100% !important;
        height: auto;
    }

    .content .row {
        padding-bottom: 0;
        margin-bottom: 0;
        border: none;
    }

    .row .col.s4,
    .row .col.s6 {
        width: 100%;
        padding: 0!important;
        margin-bottom: 20px;
    }

    .textpic {
        margin-bottom: 0;
    }

    .textpic img {
        max-width: 332px;
        display: block;
        margin: 0 auto;
    }

    .accordeon, .textpic {
        text-align: center;
    }

    .more {
        width: 50%;
        float: none;
        padding-top: 8px!important;
        padding-bottom: 8px!important;
        margin-top: 20px!important;
        margin-bottom: 30px!important;
        margin-left: auto!important;
        margin-right: auto!important;
    }

    .back  {
        bottom: -30px;
    }

    .csc-mailform {
        width: 100%;
    }

    .tx-bfactor-subscription legend,
    .tx-bfactor-subscription label,
    .csc-mailform legend,
    .csc-mailform label {
        width: 100%;
        margin-bottom: 5px;
        text-align: left;
    }

    .tx-bfactor-subscription input[type="radio"] + label {
        width: 100%;
    }

    .csc-mailform label strong {
        left: 20%;
        top: 18px;
    }

    .tx-bfactor-subscription label strong {
        left: 40%;
        top: 18px;
    }

    .tx-bfactor-subscription input,
    .tx-bfactor-subscription select,
    .tx-bfactor-subscription fieldset ol li,
    .tx-bfactor-subscription textarea,
    .csc-mailform input,
    .csc-mailform select,
    .csc-mailform fieldset ol li,
    .csc-mailform textarea {
        width: 100%;
    }

    .csc-mailform fieldset ol li {
        display: block;
    }

    .tx-bfactor-address {
        width: 100%;
    }

    .tx-bfactor-subscription select,
    .tx-bfactor-subscription input[type="submit"],
    .tx-bfactor-address select,
    .tx-bfactor-address input[type="submit"] {
        width: 100%;
        margin-left: 0;
    }
    .sjbr-captcha {
        flex-flow: column;
    }
    .sjbr-freecap-row1 {
        width: 100%;
    }
    .sjbr-freecap-col2 input#sjbr-freecap-captcha-response {
        width: 100%;
        margin-left: 0;
    }
    .csc-form-element-submit button {
        width: 100%;
    }
}

@media screen and (min-width: 500px) {
    .imagedescription {
        margin-top: -75px;
    }

    .streifen {
        margin-top: -79px;
    }
}

@media screen and (min-width: 600px) {

    .imagewrapper > img {
        margin-top: -10px;
    }

    .imagedescription {
        margin-top: -75px;
    }

    .streifen {
        margin-top: -85px;
    }
}

@media screen and (min-width: 700px) {
    .imagedescription {
        margin-top: -76px;
    }

    .streifen {
        margin-top: -88px;
    }
}

@media screen and (min-width: 769px) {

    header .logo {
        width: 15%;
    }

    .imagewrapper > img {
        margin-top: -15px;
    }

    .imagedescription {
        margin-top: -114px;
    }

    .imagereference {
        top: 50px;
    }

    .slider ul.indicators {
        bottom: -40px;
    }

    .streifen {
        margin-top: -154px;
    }

    .institutions {
        padding: 15px;
    }

    .institutions > div {
        width: 80%;
        display: flex;
    }

    .institutions a {
        margin-left: 15px;
    }

    .institutions a img {
        width: 100%;
        height: auto;
    }

    .textpic dl.image dd {
        width: 60%;
    }

    .textpic dl.image dt {
        width: 35%;
    }

    .textpic dl.image.img-left dt {
        float: left;
        margin-right: 5%;
    }

    .textpic dl.image.img-left dd {
        float: right;
    }

    .textpic dl.image.img-right dt {
        float: right;
        margin-left: 5%;
    }

    .textpic dl.image.img-left dd {
        float: left;
    }

    .textpic dl.image dt img {
        width: 100%;
        height: auto;
    }

    .textpic.image-left + .links  {
        width: 60%;
        margin-left: 40%;
    }

    .textpic.image-right + .links  {
        width: 60%;
    }

    footer {
        padding-top: 50px;
    }
}

@media screen and (min-width: 993px) and (max-width: 1220px) {
    nav#mainnav {
        margin-top: -80px!important;
    }
}

@media screen and (max-width: 1220px) {

    header .container {
        position: relative;
    }

    header div#metanav  {
        background-color: #004568;
        width: 100%;
        float: none;
        position: relative;
    }

    header div#metanav ul {
        width: 100%;
        float: none;
        padding: 20px 20px 60px 20px;
        display: none;
    }

    header div#metanav .search-nav {
        display: none!important;
    }

    header div#metanav form {
        position: absolute;
        left: 50%;
        left: calc(50% - 63px);
        bottom: 40px;
        margin: 0;
        display: none;
    }

    header div#metanav ul.open,
    header div#metanav form.open {
        display: block;
    }

    header div#metanav ul li {
        display: block;
        text-align: center;
        padding: 0;
    }

    header div#metanav ul li a {
        display: block;
    }

    header div#metanav span {
        display: block;
        width: 100%;
        height: 30px;
        cursor: pointer;
        background: url('../img/schieber.png') no-repeat center;
    }

    header div#metanav ul li.facebook a:before,
    header div#metanav ul li.twitter a:before,
    header div#metanav ul li.linkedin a:before {
        position: relative;
    }

    nav#mainnav {
        position: relative;
        margin-top: -146px;
        z-index: 60;
    }

    #mainnav ul {
        width: 120%;
        margin-right: -8%;
        margin-bottom: -73px;
    }

    nav#mainnav ul.right ul {
        padding-bottom: 74px;
    }

    #mainnav ul.invisible {
        display: none;
    }

    #mainnav ul li {
        width: 100%;
        border-bottom: 2px solid #fff;
        background-color: transparent;
    }

    #mainnav ul li:last-child {
        border-bottom: none;
    }

    nav#mainnav ul ul {
        padding-top: 0;
        padding-bottom: 30px;
        margin-left: -10%;
    }

    nav#mainnav ul li.open ul{
        display: block;
    }

    nav#mainnav ul ul li {
        margin-left: -5%;
    }

    nav#mainnav ul ul li:first-child {
        border-top: 2px solid #fff;
    }

    nav#mainnav ul ul li a {
        padding-left: 70px;
    }
}

@media screen and (min-width: 769px) and (max-width: 992px) {
    header .logo {
        padding-bottom: 170px;
    }

    nav#mainnav {
        position: relative;
        margin-top: -120px;
    }

}

@media screen and (min-width: 900px) {
    .imagedescription {
        margin-top: -115px;
    }

    .streifen {
        margin-top: -155px;
    }

    .slider ul.indicators {
        bottom: -50px;
    }

}

@media screen and (min-width: 1221px) {

    header .logo img {
        margin-left: 0;
    }

    header .logo img {
        width: auto;
    }

    header .navbutton {
        display: none;
    }

    header div#metanav {
        display: block;
    }

    nav#mainnav ul li:hover ul {
        display: block;
    }

    nav#mainnav ul ul {
        position: absolute;
        -moz-transform: rotate(4.8deg);
        -ms-transform: rotate(4.8deg);
        -o-transform: rotate(4.8deg);
        -webkit-transform: rotate(4.8deg);
        transform: rotate(4.8deg);
        -webkit-backface-visibility: hidden;
        /*filter: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><filter id="gaussian_blur"><feGaussianBlur in="SourceGraphic" stdDeviation="0" /></filter></defs></svg>#gaussian_blur');*/
    }

    nav#mainnav ul li ul li a,
    nav#mainnav ul li.active ul li a,
    nav#mainnav ul li:focus ul li a,
    nav#mainnav ul li:hover ul li a {
        display: inline;
    }

    nav#mainnav .leftside {
        display: block;
        width: 50%;
        height: 40px;
        background-color: #f8b70a;
        position: absolute;
        top: 0;
        left: -20px;
        z-index: 10;
    }

    .imagewrapper {
        margin-top: -140px;
    }

    .imagewrapper > img {
        margin-top: 0;
    }

    .imagedescription {
        font-size: 150%;
        margin-top: -138px;
    }

    .imagereference {
        top: 70px;
    }

    .streifen {
        margin-top: -164px;
    }

    .institutions {
        margin-top: -30px;
    }

    .institutions > div {
        width: auto;
    }
    .institutions a img {
        width: auto;
    }

    .more {
        margin: 20px 14px 0 0!important;
    }

    .gallery {
        overflow-x: hidden;
    }

    footer > div {
        margin-top: 40px;
    }

    footer ul.imagelinks li img {
        width: 100%;
    }
}

@media screen and (min-width: 993px) and (max-width: 1100px) {
    .textpic.gal {
        width: 85%;
        margin-left: auto;
        margin-right: auto;
    }
}

@media screen and (min-width: 1100px) {
    .container {
        width: 1030px;
        padding-left: 0;
        padding-right: 0;
    }

    .imagedescription {
        margin-top: -123px;
    }

    .imagedescription > .container {
        padding-left: 0;
    }

    .streifen {
        margin-top: -167px;
    }

}

@media screen and (min-width: 1182px) and (max-width: 1220px) {
    .imagedescription {
        margin-top: -120px;
    }
}

@media screen and (min-width: 1221px) {
    .imagedescription {
        margin-top: -140px;
    }

    .streifen {
        margin-top: -171px;
    }

    .slider ul.indicators {
        bottom: -60px;
    }

}

@media screen and (min-width: 1300px) {
    .imagedescription {
        margin-top: -141px;
    }

    .streifen {
        margin-top: -174px;
    }

}

@media screen and (min-width: 1400px) {
    .imagedescription {
        margin-top: -142px;
    }

    .imagereference {
        top: 30px;
    }

    .streifen {
        margin-top: -179px;
    }
}

@media screen and (min-width: 1500px) {
    .imagedescription {
        margin-top: -141px;
    }

    .streifen {
        margin-top: -184px;
    }
}

@media screen and (min-width: 1600px) {
    .imagedescription {
        margin-top: -145px;
    }

    .streifen {
        margin-top: -189px;
    }
}

@media screen and (min-width: 1700px) {
    .imagedescription {
        margin-top: -152px;
    }

    .streifen {
        margin-top: -200px;
    }
}

@media screen and (min-width: 1800px) {
    .imagedescription {
        margin-top: -152px;
    }

    .streifen {
        margin-top: -204px;
    }
}

@media screen and (min-width: 1900px) {
    .imagedescription {
        margin-top: -154px;
    }

    .streifen {
        margin-top: -207px;
    }
}
