/* Required height of parents of the Full Page Carousel for proper displaying carousel itself */
html,
body,
.view {
height: 100%; }

/* Farben */
 :root {
  --bg-color: rgb(0,82,134);
  --a-color: #005286;
  --btn-color: rgb(0,82,134);  /* dunkelblau */
  --hover-color: rgb(150,40,50);  /* rostrot */
  --dunkelblau: rgb(0,82,134); /* dunkelblau #005286 */ 
  --rost: #962832;
  --rostrgb: rgb(150,40,50);
  --bglight: rgb(235,235,235); /* #ebebeb */
}


.btn-toolbar{ display: flex !important; justify-content: space-between; margin-top:20px;}
.btn-default, .btn-primary { background-color: var(--btn-color) !important; color:#FFF !important;
box-shadow: 0 2px 2px 0 rgba(0,0,0,.16),0 3px 4px 0 rgba(0,0,0,.12);border-radius: 0.0rem; margin:10px 0 0 0;}
.btn:hover {background-color: var(--hover-color);}
.btn.btn-link, .btn.btn-link:hover {background-color: transparent !important;color:var(--btn-color) !important; }
a, .card-footer a { color: var(--dunkelblau); text-decoration:none; font-weight:bold; }
a:hover { color: var(--hover-color); }
section { margin-bottom:30px; }
section.white-text { margin-bottom:0px;  }
section .col-md-6.rechts { padding-top:6px;  }
table.table th { padding-top: .4rem; padding-bottom: .4rem; }
table.table th.balkensoft {background-color: var(--bglight); }
.bg-rost { background-color: var(--rost); }
.bg-dunkelblau { background-color: var(--dunkelblau); }
div.text-count-wrapper {font-size:12px; color:red; position:absolute; right:34px; bottom:39px;}
.blue-gradient-rgba {
    background-color: var(--dunkelblau) !important;
    background: var(--dunkelblau) !important;
}
.authorcopy { position:absolute;bottom:2px;right:5px;color:#222;font-size:10px;background:rgba(255,255,255,0.7);}
.closeme { margin-top:20px; cursor:pointer; }
.closeme:after {
font-family: "Font Awesome 5 Free";
  content: '\f077';
  color: var(--dunkelblau);
  font-weight: bold;
  float: right;
  margin-left: 5px;
}


.btn-rounded { border-radius: 10em; }
.btn-big { padding: 1rem 3rem; font-size: 1.3rem; font-weight:500; }
.col-md-6.mb-4 .view { height:auto;}
p.datum { text-transform:uppercase; color:#888; letter-spacing:1px; margin-bottom:0.6rem;}
h4.klein { font-size:1.2rem; color:#888; }
#aktionen { flex-grow: 1; }

section.aktion img { margin:10px 0 20px 0; max-width:100%; }
   
#page-content {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

.antwort {
    background-color: #EBEBEB;
    padding: 20px 18px;
    margin-bottom: 20px;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    box-shadow: none;
    border-radius: 0;
}

#page-content .content { flex: 1 0 auto; }
.bglight { background-color: var(--bglight); }


/* Full Page Carousel itself*/
.carousel {
height: 100%; }
.carousel .carousel-inner {
height: 100%; }
.carousel .carousel-inner .carousel-item,
.carousel .carousel-inner .active {
height: 100%; }
.flex-center ul { width:60%; margin:50%;
    text-align: center;
}
body#article-1 .flex-center ul.sliderhome {
    width: 60%;
    margin-left: 90%;
    text-align: left;
}
ul.sliderhome h1.slide_title {
background-color: var(--hover-color);
color:#FFF; font-size:3rem; line-height:3.0rem;padding:4px;
}
ul.sliderhome p.slide_comment {
background-color: #FFF;
color:#888; font-size:1.4rem; line-height:1.6rem;padding:4px;
}
ul.sliderhome .btn, ul.sliderhome .btn-default {
float:right;
}

.carousel .caption { font-size:1.2rem;line-height:1.5rem; }
.carousel .bigtitle { font-size:2.0rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; }






/* Navbar animation */
.navbar {
background-color: rgba(0, 0, 0, 0.2); }

.top-nav-collapse {
background-color: var(--bg-color); }

.dropdown-menu { width:20rem; }
.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 10rem;
    padding: .5rem 0;
    margin: .125rem 0 0;
        margin-top: 0.125rem;
    font-size: 1rem;
    color: #212529;
    text-align: left;
    list-style: none;
    background-color: #fff;
    background-clip: padding-box;
    border: 0px solid rgba(0,0,0,.15);
    border-radius: .0rem;
}
.nav-item { margin: 0 0.6rem; }
.dropdown-menu .nav-item { margin: 0 0rem; }
.navbar.navbar-light .navbar-nav .nav-item.active > .nav-link {
    background-color: #FFF; color:#962832;
}
.nav-item a {
font-size: 17px;
font-weight: 500;
line-height: 17px;
}
.dropdown-menu .nav-item a {
font-size: 16px;
font-weight: 300;
line-height: 16px;
}
.navbar.navbar-light .navbar-nav .nav-item.active > .nav-link,
.navbar.navbar-light .navbar-nav .nav-item .nav-link:hover {
    background-color: none;
}
.navbar.navbar-light .navbar-nav .dropdown-menu .nav-item.active > .nav-link,
.navbar.navbar-light .navbar-nav .dropdown-menu .nav-item .nav-link:hover,
.navbar.navbar-light .navbar-nav > .nav-link:hover {
    background-color: rgba(0,0,0,.2);
}

a.nav-link.active {
    font-weight: 500;
}

/* Adding color to the Navbar on mobile */
@media only screen and (max-width: 768px) {
.navbar {
background-color: var(--bg-color); } }

/* Footer color for sake of consistency with Navbar */
.page-footer {
background-color: var(--bg-color); }



/* BASICS */

html, body {
font-family: 'Fira Sans', sans-serif !important;
font-weight:300;
}
.container { max-width: 1140px; }
#headernav .container,
.page-footer .container { max-width: 1180px; }
ul { list-style:none; }
.acc_panel ul, #editDocument ul { list-style:square outside; }


/* header */

header #logo {margin-left: 20px;}
header .navbar-expand-lg .navbar-nav { flex-direction: none; }

.site-name-wrapper {margin-top: -13px; display:inline;}
.site-name-wrapper span { font-size:1.0rem; line-height:24px; color:#888; }
.site-name-wrapper a {font-size: 1.4rem; font-weight: 700; margin-bottom:0; color: rgb(0,82,134) !important; }
.site-name-wrapper a:hover { color: rgb(0,82,134) !important; }
.site-name-wrapper a.site-slogan {font-size: 1.0rem; font-weight: 400;font-style: italic;color: rgb(77,77,77) !important;}

.primary-text, header, header a { color: var(--a-color) !important;}
#headernav ul.list-group li, footer ul.list-group li { padding: 0 8px; }



#site-logo {
float: left;
display: block;
position: relative;
max-height:60px;
}



/* ########################### STEPFORM ########################### */


body#article-17 button.btn-primary,
body#article-25 button.btn-primary,
body#article-21 button.btn-primary,
body#article-42 button.btn-primary,
body#article-43 button.btn-primary,
body#article-22 button#yform-stepform04-field-16-e_mail_jetzt_abschicken_und_bestaetigungslink_erhalten,
body#article-44 button#yform-stepform04-field-16-e_mail_jetzt_abschicken_und_bestaetigungslink_erhalten,
body#article-22 button#yform-stepform04-field-18-e_mail_jetzt_abschicken_und_bestaetigungslink_erhalten { background-color: var(--hover-color) !important; color:#FFF !important; }

a#js-btn-prev.btn-primarym,
button#yform-stepform04-field-16-zurueck.btn,
button#yform-stepform04-field-18-zurueck.btn { background-color: var(--btn-color) !important; color:#FFF !important; }
section.aktion img { margin:10px 0 20px 0; max-width:100%; }

#stepform04 .form-group { width:98%; margin-right:2%; float:left; }
#yform-stepform04-plz.form-group { width:33%; margin-right:2%; float:left; }
#yform-stepform04-ort.form-group { width:63%; margin-right:2%; float:left; }
#yform-stepform04-abs_mail.form-group { width:98%; margin-right:2%; float:none; margin-bottom:20px; }

#yform-stepform04-createdate { display:none; }

/* ########################### POSTKARTENFORM ########################### */

/* Postkarte */

#postkartenform #pkback * { border:none; }
#postkartenform input { background:transparent; }
#pkfront { 
display:block;
width:620px;
height:310px; 
}
#pkback { 
background: #fbfbfb url("../../media/postkarte_dinlang.svg"); 
background-size: 100%;
background-repeat: no-repeat;
display:block;
width:620px;
height:310px;
font-size: 13px;
line-height:18px;
}
#pkback .absender span { font-size:13px; line-height:15px; }
.nolabels { padding-left:14px;padding-right:25px;padding-top:156px; }
.nolabelsrt { padding-left:40px;padding-top:40px;padding-right:25px;padding-top:25px; }
#pkback .nolabelsrt p { margin-bottom:0rem !important; }
#pkback .nolabels p { font-size: 1rem; line-height: 2.0; }
#pkback p.pktext { padding-top:6px;padding-bottom:6px; line-height: 1.4;}
#pkback p.abs { line-height: 1.4; }
.nolabels .control-label,
.nolabelsrt .control-label { display:none; }


.row.display-flex {
  display: flex;
  flex-wrap: wrap;
}
.row.display-flex > [class*='col-'] {
  flex-grow: 1;
}


#postkartenform .col-lg-3 img { max-width:100%; }
#postkartenform .form-control { padding: .375rem .75rem; }
#postkartenform #pkback .nolabels .form-control { padding: .275rem .25rem; height: calc(1.5em + .3rem + 2px);}
#postkartenform .form-group { width:95%; margin-right:5%; float:left; }
#stepformular03 #postkartenform .form-group { margin-bottom:1px;margin-top:10px; }
#stepformular03 #postkartenform .nolabels .form-group { margin-bottom:1px;margin-top:0px; }
#postkartenform .col-lg-4 .container { padding-left:45px; }


#stepformular03 #yform-postkartenform-mdb_vorname.form-group { width:30%; margin-right:1%; float:left; }
#stepformular03 #yform-postkartenform-mdb_nachname.form-group { width:69%; margin-right:0%; float:left; }
#stepformular03 #yform-postkartenform-mdb_plz.form-group { width:25%; margin-right:1%; float:left; }
#stepformular03 #yform-postkartenform-mdb_ort.form-group { width:74%; margin-right:0%; float:left; }
#stepformular03 #yform-postkartenform-field-3 { height:180px; width:305px; background:transparent;font-size: 13px;line-height:18px; padding-left:0;border:1px solid #888; }


#stepformular04 .form-group { width:48%; margin-right:2%; float:left; }
#stepformular04 #yform-postkartenform-plz.form-group { width:13%; margin-right:2%; float:left; }
#stepformular04 #yform-postkartenform-ort.form-group { width:33%; margin-right:2%; float:left; }
#stepformular04 #yform-postkartenform-abs_mail.form-group { width:98%; margin-right:2%; margin-bottom:20px; }

#stepformular05 #yform-postkartenform-mdb_vorname.form-group { width:30%; margin-right:1%; float:left; }
#stepformular05 #yform-postkartenform-mdb_nachname.form-group { width:69%; margin-right:0%; float:left; }
#stepformular05 #yform-postkartenform-mdb_plz.form-group { width:25%; margin-right:1%; float:left; }
#stepformular05 #yform-postkartenform-mdb_ort.form-group { width:74%; margin-right:0%; float:left; }
#stepformular05 #yform-postkartenform-field-3 { height:150px; background:transparent;font-size: 13px; padding-left:0;}
#stepformular05 #yform-postkartenform-postkartentext .form-control { font-size:13px; padding:0 0px; background:transparent; }


.btn-primary[type=submit]:hover, .btn[type=submit]:hover { background-color: var(--hover-color) !important; color:#FFF !important; }



#yform-postkartenform-accept { margin-bottom:20px; margin-left:24px; }


#stepform01 button.btn-primary[type="submit"] { margin-top:20px; margin-right:1%; }

#yform-postkartenform-field-1-zurueck.btn[type=submit],
#yform-postkartenform-field-15-zurueck.btn[type=submit],
#yform-postkartenform-field-17-zurueck.btn[type=submit],
#yform-postkartenform-field-16-zurueck.btn[type=submit],
#yform-postkartenform-field-11-zurueck.btn[type=submit],
#yform-postkartenform-field-9-zurueck.btn[type=submit],
#yform-postkartenform-field-10-zurueck.btn[type=submit],
#yform-postkartenform-field-13-zurueck.btn[type=submit],
#yform-postkartenform-field-14-zurueck.btn[type=submit],
#yform-postkartenform-field-8-zurueck.btn[type=submit],
#yform-postkartenform-field-18-zurueck.btn[type=submit],
#yform-postkartenform-field-20-zurueck[type=submit],
#yform-stepform04-field-12-zurueck.btn[type=submit] { 
background-color: var(--btn-color) !important; color:#FFF !important; }


/* Flip Card */

.flip-card, .flip-card-inner, .flip-card-front, .flip-card-back {
margin-left:0; margin-right:0;padding-left:0; padding-right:0;
}

.flip-card {
background-color: transparent;
width:620px;
height:310px;
margin-bottom:30px;
border: 1px solid #f1f1f1;
perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
position: relative;
width: 100%;
height: 100%;
text-align: left;
transition: transform 0.8s;
transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
position: absolute;
width: 100%;
height: 100%;
padding-left:0px; padding-right:0px;
-webkit-backface-visibility: hidden; /* Safari */
backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
padding-left:15px;
}

/* Style the back side */
.flip-card-back {
transform: rotateY(180deg);
}
.flip-card-back img {
max-width:100%;
}

/* Accordion */



.acc_button {
  background-color: rgba(238,238,238,.30);
  color: #444;
  cursor: pointer;
  padding: 16px 16px 6px 16px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 14px;
  transition: 0.4s;
}
.acc_button h4 { font-size: 1.3rem; padding:9px 8px; }

.gestreift .acc_button, 
.gestreift2 .acc_button { background-color: rgba(238,238,238,.30); }

.acc_button:hover {
  background-color: #ccc;
}

.acc_button:after {
font-family: "Font Awesome 5 Free";
  content: '\f06e';
  color: var(--dunkelblau);
  font-weight: bold;
  float: right;
  margin-left: 5px;
  margin-top:-36px;
}

.acc_button.active:after {
  content: "\f077";
}

.acc_panel {
  padding: 0 18px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

/* streifen, beginnt mit ersten accordion-button */
.acc_button.gestreift {
  background-color: rgba(238,238,238,.90) !important;
}





.accordion > .card .card-header { margin-bottom: -1px; }
.accordion > .card-header:first-child { border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0; }
.accordion > .card-header {padding: .75rem 1.25rem;margin-bottom: 0;background-color: rgba(0,0,0,.03);border-bottom: 1px solid rgba(0,0,0,.125);}

.btn-link, .btn-link:active, .btn-link:focus, .btn-link:hover {
    color: #000;
    background-color: transparent;
    box-shadow: none;
    text-decoration: none;
}
.accordion > .card .card-header .btn {
display:flex; width:100%;
    box-shadow: none;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    padding: .2rem 1rem;
    font-size: 1rem;
}
.accordion > .card .card-header .btn i {right:0; float: right !important;}
.accordion > .card .card-body  { padding:10px;}
.card .card-body .btn {float:right;}
#editDocument { padding:10px; }
.btn-action { position:absolute; right:-14px; margin-top:-40px;}

h1.headline { font-size:2rem;font-weight:500;}
section.aktion p { font-size:1.3rem;font-weight:300;}
h2.headline { font-size:1.8rem;font-weight:500;}
.seitentitel { font-size:1.8rem;font-weight:500; text-align:center; margin-bottom:30px; }
h1 { font-size:1.6rem;font-weight:300;}
h2.title { font-size:1.3rem;font-weight:500;}


.farbig { color: var(--bg-color);}
.author { font-size:0.9rem; }
.clearleft { display:block;width:100%;clear:left;  }
.cardcolor { background-color: var(--bg-color);}


/* Slider */

.rgba-black-light, .rgba-black-light::after {
    background-color: rgba(0,0,0,.8);
}


/* Cards */

.card {
    background-color: #fff;
    padding: 20px 18px;
    margin-bottom: 20px;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    box-shadow:none;
    border-radius:0;
}
.accordion .card { padding: 20px 0px; }
.card-body { padding-top:0px; }
.card-footer {
    padding: .75rem 1.25rem;
    font-size: 24px;
    background-color: var(--bglight);
    border-top: 1px solid rgba(0,0,0,.125);
    margin: 20px -18px -20px;
    text-align:center;
}

.card-footer:last-child {
    border-radius: 0 0 0 0;
}

.card.mbild figure, .cardcolor .view {
    margin: -20px -18px 20px;
}


.card.mbild figure img {
    width: 100%;
    height: auto;
}

.card-title, .card-title a {
font: 400 24px/1.2em "Fira Sans",sans-serif;
color:#FFF;
margin: 0.5em 0;
}

.card.rost {
    background-color: rgba(150,40,50, 1.0);
    color: #fff;
}
.card.blau {
    background-color: rgba(0,82,134,1.0);
    color: #fff;
}

.card.cardcolor {
    background-color: var(--dunkelblau);
    color: #fff;
}
.card.cardcolor > .card-body,
.card.card.cardcolor .card-body .card-text {
    color: #fff;
}
.card.cardcolor > .card-body hr {
border-top: 1px solid var(--bglight);
}


.card.obild .card-title {
    font: 500 36px "Special Elite",monospace;
    margin: 0 0 0.25em;
}
.col-lg-3 .card.obild .card-title {
    font: 500 26px "Special Elite",monospace;
    margin: 0 0 0.25em;
}
.col-lg-3 .card.obild .btn { float:right;}

.card.cardcolor .btn, .card.cardcolor .btn-default {
background-color: var(--bglight) !important;
color: var(--dunkelblau)!important;
}
.card img,
.card .img-goheight { max-width:100% !important; }



/* navbar */

.navbar.scrolling-navbar { border-bottom: 26px solid var(--dunkelblau);height:120px; }
body#article-1 .navbar.scrolling-navbar { 
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 1030; }
.navbar-brand {font-size: 1.5rem;line-height:1.4rem;}
.navbar-collapse { justify-content: center; background-color:#FFF; padding-bottom:20px;border-bottom: 1px solid grey; }
.dropdown-menu { padding:0; }


/* Buttons und Formular */

.btn-circle {
width: 30px;
height: 30px;
padding: 6px 0px;
border-radius: 15px;
text-align: center;
font-size: 12px;
line-height: 1.42857;
}
.btn-circle.btn-xl {
width: 50px;
height: 50px;
padding: 10px 16px;
border-radius: 25px;
font-size: 24px;
line-height: 1.33;
background-color: var(--btn-color);
}
.multisteps-form__panel {
    position: relative;
    width: 100%;
    height: auto;
    opacity: 1;
    visibility: visible;
    margin-bottom:40px;
}
.multisteps-form__progress-btn.js-active { color: var(--dunkelblau); }
a.multisteps-form__progress-btn { text-align:center; }
.mdbname { color: var(--dunkelblau);font-size:1.2rem; }
button { margin-left:30px;}
 #editDocument[contenteditable="true"] {
      background-color: #f5f5f5;
      padding: 30px;
    }
 #editDocument {
      border:1px solid #ebebeb;
    }
.card-body .buttonzeile { display:inline-block;clear:left;width:100%;height:34px; margin-top:20px;}
.card-body .buttonzeile .btn-sm { margin:10px;}
.card-body .buttonzeile .btn {margin: 0 .375rem;}







.row.bildmini { justify-content:space-between; margin-bottom:4px; }
div.bildmini img { float:right; }
#fillbuttons img { max-width:100%; }
div.bildmini p { max-width:300px; float:left; }
div.bildmini p.textv { margin:0; font-size:12px; }
div.bildmini p.textv strong { font-size:14px; color:red; }

#postkartenform .fillbutton { 
display:block;
font-size: .81rem;
padding: 0.5rem; 
height:auto; 
margin:6px 0;
border:1px solid #EEEEEE;
cursor:pointer;
background-color:#fff9de;
}
#postkartenform .fillbutton p { margin-bottom:0px; }
#fillbuttons p { margin-top:10px; }








/* Multisteps */

.multisteps-form__panel { display:inline-block;}
.multisteps-form__panel .btn { float:right;}
.btn-toolbar .btn  { background-color: var(--hover-color); color:#FFF !important; }
.btn-toolbar a.js-btn-prev.btn,
button#yform-stepform04-field-19-zurueck { background-color: var(--btn-color) !important; color:#FFF !important; }
.arrow-steps {padding-right:40px; margin-bottom:30px;}


.arrow-steps .step {
	font-size: 16px;
	text-align: left;
	color: #962832;
	cursor: default;
	padding: 33px 10px 10px 40px;
	height:90px;
	min-width: 7%;
	float: left;
	position: relative;
	background-color: #ebebeb;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none; 
  transition: background-color 0.2s ease;
}

.arrow-steps .step.current {
    background-color: #005286;
    color: #FFF;
    font-weight: bold;
}
.arrow-steps .step.current a { color: #FFF; }


.arrow-steps .step.two, .arrow-steps .step.three,
.arrow-steps .step.four, .arrow-steps .step.five {
	padding: 33px 10px 10px 60px;
	}

.arrow-steps .step:after,
.arrow-steps .step:before {
	content: " ";
	position: absolute;
	top: 0;
	right: -43px;
	width: 0;
	height: 0;
	border-top: 46px solid transparent;
	border-bottom: 44px solid transparent;
	border-left: 44px solid #ebebeb;	
	z-index: 2;
  transition: border-color 0.2s ease;
}

.arrow-steps .step:before {
	right: auto;
	left: 0;
	border-left: 44px solid #fff;	
	z-index: 0;
}

.arrow-steps .step:first-child:before {
	border: none;
}

.arrow-steps .step a {
	position: relative;
}

.arrow-steps .step a:before {
	opacity: 0;
	content: "✔";
	position: absolute;
	top: -12px;
	right: -30px;
	font-size:1.5em; color:green;
}

.arrow-steps .step.done a:before {
	opacity: 1;
	-webkit-transition: opacity 0.3s ease 0.5s;
	-moz-transition: opacity 0.3s ease 0.5s;
	-ms-transition: opacity 0.3s ease 0.5s;
	transition: opacity 0.3s ease 0.5s;
}

.arrow-steps .step.current:after {
	border-left: 44px solid #005286;	
}



/* Social Buttons */

section.socials {
  margin-top:30px;
}
section #services {
  text-align: left; margin-top:30px;
  transform: translatez(0);
}
ul#services { margin-left:0; padding-left:0px; }
section #services h2 {
color:#FFF;
padding-top:10px;
}
section #services li {
  width: 40px;
  height: 40px;
  display: inline-block;
  margin: 0px 15px 0 0;
  list-style: none;
}
section #services li div {
  width: 40px;
  height: 40px;
  color: #FFF;
  font-size: 1.8em;
  text-align: center;
  line-height: 42px;
background-color: var(--dunkelblau);
  transition: all 0.5s ease;
}
section #services li a {
  color: #FFF;
}
section #services li div:hover {
  transform: rotate(360deg);
  border-radius: 40px;
}
section #services li span {
  width: 40px;
  height: 40px;
  display: block;
  padding: 12px 0px 10px 0;
  color: #fff;
  text-transform: uppercase;
  font-size: 0.8em;
  text-align: center;
display:none;
}


/* footer */

#footer-logo a#logo, #footer-logo p { display:inline-block; margin-right:20px;}
footer .container div { padding-left:10px; padding-right:10px; }
footer #logo > img {height: auto;max-width: 120px;}
footer ul.list-group { float:left; margin-top:20px; margin-right:10px; }


/* STYLING */


.bgred { background-color:red !important; }
.bgblu { background-color: var(--btn-color) !important; }


/* ################### RESPONSIVE ################# */






/* *******************************************************
Custom, iPhone Retina
******************************************************** */

@media only screen and (min-width : 320px) {  
/* ----- */

body#article-1 .flex-center ul.sliderhome {
    width: 100%;
    margin-left: 0%;
    text-align: left;
}
.flex-center ul {
    width: 100%;
    margin: 0%;
    text-align: center;
}
.navbar.scrolling-navbar { border-bottom: 16px solid var(--dunkelblau);height:80px; }
#logo {
float: left;
margin-top: -3px;
margin-right: 10px;
display: block;
position: relative;
-ms-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-webkit-transform: rotate(-7deg);
-o-transform: rotate(-7deg);
transform: rotate(-7deg);
z-index: 5;
}
#logo > img {height: auto;max-width: 90px;}
.btn-big { padding: 0.8rem 2.5rem; font-size: 1.1rem; font-weight:500; }
h4.klein { font-size:1.1rem; color:#888; }
ul.sliderhome p.slide_title {
background-color: var(--hover-color);
color:#FFF; font-size:2rem; line-height:2.0rem;padding:4px;
}
ul.sliderhome p.slide_comment {
background-color: #FFF;
color:#888; font-size:1.1rem; line-height:1.6rem;padding:4px;
}
.carousel .caption { font-size:1.2rem;line-height:1.5rem; }
.carousel .bigtitle { font-size:1.4rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; }
h2.headline { font-size:1.6rem;font-weight:500;}
.seitentitel { font-size:1.6rem;font-weight:300; text-align:center; margin-bottom:30px; }
h1 { font-size:1.5rem;font-weight:300;}
h2.title { font-size:1.1rem;font-weight:500;}
.site-name-wrapper {display: none;}
.acc_panel { padding: 0 0px; }


div.text-count-wrapper {font-size:12px; color:red; position:absolute; left:40%; bottom:39px;}
section.postkartenfill, #stepformular05 #rex-yform { padding-left:15px;padding-right:15px; }
#stepformular05 .col-sm-7 { width:55%; }
#postkartenform .col-lg-4 .container { padding-left: 25px;padding-top:25px; }
#stepformular04 #yform-postkartenform-adresse.form-group { width:98%; margin-right:2%; float:none; margin-bottom:20px; }
#stepformular04 #yform-postkartenform-plz.form-group { width:33%; margin-right:2%; float:left; }
#stepformular04 #yform-postkartenform-ort.form-group { width:63%; margin-right:2%; float:left; }


/* ----- */
}


/* *******************************************************
Extra Small Devices, Phones
******************************************************** */

@media only screen and (min-width : 480px) {
/* ----- */
.card.col { min-width:20rem; }
.navbar.scrolling-navbar { border-bottom: 26px solid var(--dunkelblau);height:120px; }
.navbar .navbar-toggler { position:absolute; top:30px;right:30px; }
#logo {margin-top: -10px;}
#logo > img {height: auto;max-width: 140px;}
.navbar-brand {float: left;display: block;max-width:20%;}
.site-name-wrapper {display: block;max-width:80%;}
div.text-count-wrapper {font-size:12px; color:red; position:absolute; left:auto; right:34px; bottom:39px;}


/* ----- */
}

@media only screen and (min-width : 578px) {
/* ----- */
#stepform04 .form-group { width:48%; margin-right:2%; float:left; }
#yform-stepform04-plz.form-group { width:13%; margin-right:2%; float:left; }
#yform-stepform04-ort.form-group { width:33%; margin-right:2%; float:left; }
#yform-stepform04-abs_mail.form-group { width:98%; margin-right:2%; float:none; margin-bottom:20px; }

/* ----- */
}


/* *******************************************************
Medium Devices, Desktops - 
--- ab hier Menu normal
******************************************************** */

@media only screen and (min-width : 992px) {
/* ----- */

body#article-1 .flex-center ul.sliderhome {
    width: 60%;
    margin-left: 90%;
    text-align: left;
}
.flex-center ul {
    width: 60%;
    margin: 50%;
    text-align: center;
}

.btn-big { padding: 1rem 3rem; font-size: 1.3rem; font-weight:500; }
h4.klein { font-size:1.2rem; color:#888; }
ul.sliderhome h1.slide_title {
background-color: var(--hover-color);
color:#FFF; font-size:3rem; line-height:3.0rem;padding:4px;
margin-bottom: .5rem;
font-weight: 500;
line-height: 1.2;
}
ul.sliderhome p.slide_comment {
background-color: #FFF;
color:#888; font-size:1.4rem; line-height:1.6rem;padding:4px;
}
.carousel .caption { font-size:1.2rem;line-height:1.5rem; }
.carousel .bigtitle { font-size:2.0rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; }
.acc_button {
  background-color: #eee;
  color: #444;
  cursor: pointer;
  padding: 16px 16px 6px 16px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 14px;
  transition: 0.4s;
}
h2.headline { font-size:1.8rem;font-weight:500;}
.seitentitel { font-size:1.8rem;font-weight:500; text-align:center; margin-bottom:30px; }
h1 { font-size:1.6rem;font-weight:300;}
h2.title { font-size:1.3rem;font-weight:500;}
.navbar-collapse { justify-content: center; background-color:#FFF; padding-bottom:20px;border-bottom: 0px solid grey; }
.acc_panel { padding: 0 18px; }

.arrow-steps .step.two, .arrow-steps .step.three,.arrow-steps .step.four,.arrow-steps .step.five {
padding: 33px 10px 10px 60px;}
.arrow-steps {display: flex !important; }
.arrow-steps .step {
    padding: 33px 10px 10px 40px;
    height: 90px;
    }


div.text-count-wrapper {font-size:12px; color:red; position:absolute; right:34px; bottom:39px;}
section.postkartenfill, #stepformular05 #rex-yform { padding-left:0px;padding-right:0px; }
#stepformular05 .col-sm-7 { width:100%; }
#postkartenform .col-lg-4 .container { padding-left: 45px;padding-top:10px; }
#stepformular04 #yform-postkartenform-adresse.form-group { width:48%; margin-right:2%; float:left; margin-bottom:20px; }
#stepformular04 #yform-postkartenform-plz.form-group { width:13%; margin-right:2%; float:left; }
#stepformular04 #yform-postkartenform-ort.form-group { width:33%; margin-right:2%; float:left; }


/* ----- */
}









@media (max-width: 767px) {
.social-buttons .btn {
padding: 8px 15px;
margin: 1px;
}
.navbar .dropdown-menu {
    position: relative !important;
    margin-top: 0; width:95%;
    text-align:right;
}

.arrow-steps .step.two, .arrow-steps .step.three, .arrow-steps .step.four, .arrow-steps .step.five {
padding: 5px 16px 5px 16px;}
.arrow-steps .step { padding: 5px 16px; height: 30px; }
.arrow-steps .step::after, .arrow-steps .step::before {
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;}
.arrow-steps .step::before { border-left: 0px solid #fff; }
.arrow-steps .step::after, .arrow-steps .step::before {right: -10px;border-left: 10px solid #ebebeb;}
.arrow-steps .step.done span::before { opacity: 0; }
.arrow-steps .step.current::after {border-left: 10px solid #005286;}

}