html, body {
font-family: 'Fira Sans', sans-serif !important;
font-weight:300;
    width: 100%;
    height: 100%;
}
article {
    min-height: 100%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

main { flex-grow: 1; position:relative; }
.container { max-width: 1280px;  }
footer .col-md-7 {
    -ms-flex: 0 0 55%;
    flex: 0 0 55%;
    max-width: 55%;
}
footer .col-md-5 {
    -ms-flex: 0 0 45%;
    flex: 0 0 45%;
    max-width: 45%;
    padding-bottom:30px;
}



body { background: #ebebeb;  }
body#home { background: #310404; }
header #headernav .container-fluid { max-width:1280px; min-height:75px;}



main.mainvideo {margin-top: 120px;}
#videoDecker {
  position: fixed;
  top: 94px;
  color: #f1f1f1;
  width: 100%;
  padding: 20px;
}
.videowrapper { position:relative; max-width:1324px; margin-left:auto;margin-right:auto;  }
.videowrapper23 { position:relative; max-width:100%; margin-left:auto;margin-right:auto; height:60vH; }


#videobody {
display:block; width:100%; height:auto; padding:0;
background: #310404 url(../images/red_texture.jpg) repeat top left;
font-family: 'BebasNeueRegular';
}
main.mainvideo {margin-top: 0px;}
body#home #zudenbuttons { top: 30px; }


body#home .left { padding-left:30px; }
body#home .right { padding-left:0; }
body#home .right p.buttons { position:absolute; top:70%; right:70px; }
body#home .left p.buttons { margin-top:1rem; }
.primary-text, header, header a { color: #df9111 !important;}
.btn-primary {color: #fff;background-color: #df9111 !important;}
.btn-primary:hover { background-color: #7283a7 !important; }
.btn-primary, .btn-primary:hover {  border-color: #df9111; }
#toggle-button { border-radius:0; }

body#home .infoblock { position:absolute; display:block; clear:left; margin:0 auto;border-radius: 20px;}
body#home .infoblock h2 { margin:1em; color:#df9111;font-weight:bold; }
body#home .infoblock a {  display:block; width:250px; height:250px; background-color: rgba(255,255,255,0.7); color:#005286; font-size:30px; line-height:24px; border:2px solid #005286; cursor:pointer;border-radius: 50%; padding-top:70px; }
body#home .infoblock a span { font-size:18px;line-height:24px; }
header h1, header h1 a { color: rgb(0,82,134) !important; }

body#home .page-footer.mt-4 { margin-top:-10px !important; }
#homeVideo{
  position: relative;
  right: 0;
 top: 0;
  max-width: 100%;
  height: auto;
}






.flex-grow { flex: 1; }
.col-md-3.left { padding-right:40px; padding-left:30px;}
.col-md-2.right { padding-right:30px; }
.h2, h2 { font-size: 1.5rem; }

header a:hover { color: #f6b182 !important;}
.btn-omv { color: #fff;background-color: #d83b0a;border-color: #d83b0a; }
.btn-omv:hover { color: #FFF;background-color: #df9111;border-color: #df9111; }
.btn.btn-lg { padding: 0.8rem 2.0rem;font-size: 1.1rem;}
.btn.btn-lg em { font-style:normal; font-size:14px;}
body#home .left .btn.btn-lg { width:300px;}
.btn { font-weight: 700; margin: 1.0rem 0.375rem; border-radius:.3rem; width:auto; }
.btn-primary:not([disabled]):not(.disabled):active { background-color: #005286 !important;border-color:#005286 !important} 
.allebilder .btn { font-weight: 700; margin: 1.0rem 0.375rem; border-radius:.3rem; width:auto; }
.right .btn { font-weight: 700; margin: 0.8rem 0.375rem; border-radius:.3rem; width:150px; }
.right .btn.btn-lg { padding: 0.8rem 1.0rem;font-size: 1.1rem; }
.navbar {font-weight: 400;}
a { color: #df9111; }
a:hover { color: #7283a7; }

ul.list-group { list-style: none; }
ul.list-group li { padding:0 8px; }

.mdb-color.lighten-2 {
    background-color: #4d4d4d !important;
}


.modal-content {
  background-size: cover;
  background-image: url('../../media/modal-background.jpg');
}

img.imoff { position:relative; left:-50px; width:70%;max-width:300px;}
.blupper { position:absolute;right:0;top:60px; width:23%; max-width:350px; z-index:4; }
body#article-6 .blupper { position:absolute;right:0;top:60px; width:23%; max-width:400px; z-index:4; }
body#home #zudenbuttons  { position:absolute; right:0px; width:58px; z-index:5; }
body#home #zudenbuttons #zudenbildern20  { position:relative;margin-top:-16px; z-index:3; }
body#home #zudenbuttons #zudenbildern21  { position:relative;margin-top:-16px; z-index:4; }
body#home #zudenbuttons #zudenbildern22  { position:relative;margin-top:0px; z-index:5; }

body#home #zudenbuttons #zudenbildern  { position:relative; top:0; z-index:7; }


.left h1, .left h2 { color: rgba(255,255,255,1.0); }
.left h1 { position:relative; font-weight:700; top:0px; color: rgba(255,255,255,1.0); }
.left h1 span { font-size:70%; color: rgba(255,255,255,0.8); font-style:italic;}

.gallery .row .col-md-1 {
    -ms-flex: 0 0 4.1666665%;
    flex: 0 0 4.1666665%;
    max-width: 4.1666665%;
padding-right: 0px;
padding-left: 0px;
}
figure { margin: 0 0 0 0; }
img { max-width:100%; height:auto; }
#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:30px;max-width:300px; }
footer ul.list-group.socials li,
footer ul.list-group.socials li a { float:left !important; }



/* header */
#upformular { margin-top:30px;}
#upformular .form-group { width:48%; margin-right:2%; float:left; }
#yform-upformular-anrede.form-group { width:14%; }
#yform-upformular-vorname.form-group { width:40%; }
#yform-upformular-name.form-group { width:40%; }
#yform-upformular-plz.form-group { width:25%; }
#yform-upformular-email.form-group { width:71%; }
#yform-upformular-bildbeschreibung.form-group { width:98%; }
#yform-upformular-copyright.form-group { width:98%; }
#yform-upformular-createdate { display:none; }

form#plzsuche{ position:relative;display:block;width:250px;}
form#plzsuche { width:180px; margin-top: 100px; margin-left:30px; margin-right:30px; }
form#plzsuche .form-group, form#plzsuche label, form#plzsuche input { width:180px; }
form i { color:#df9111; }

/* header */
.navbar.scrolling-navbar { border-bottom: 26px solid #005286; }

#site-title {
display:block;
    max-height:60px;
    width:auto;
}


header #logo {margin-left: 20px;}
.navbar-nav .nav-item { padding:0 10px; }
#logo {
float: left;
margin-top: -5px;
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: 140px;}
#logo2 { margin-left:160px; }
.navbar-brand {font-size: 1.5rem;line-height:1.4rem;}
.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;}
.navbar-collapse { justify-content: center; }
button.navbar-toggler { display:none; }

/* ende header */


body#article-9 .row .col-md-1 {    
-ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
    padding-right: 5px;
    padding-left: 5px;
    border:1px solid grey;
    }
body#article-9 .btn.btn-sm {
    padding:0.3rem 0.5rem;
    float:right;
}
body#article-9 .btn.btn-sm {
    margin:0;
}
body#article-9__item {
    border:2px solid #7283a7;
}


#zahlen { width:180px; margin-top: 50px; margin-left:30px; margin-right:30px; }
#zahlen p { font-size: 1.1rem; line-height:1.2rem;}
.allebilder { width:60%; text-align:center; display:block;padding:20px; }
.allebilder .btn { margin:0 20px;}



.iwcc-background {background: transparent !important;}
.iwcc-wrapper {
background: #EFEFEF !important;
max-width: 40em !important;
max-height: 60vh !important;
border: 1px solid rgba(0,0,0,.2);
border-radius: .3rem;
box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
}
.iwcc-wrapper-inner {padding: 1.5em !important;}
.iwcc-cookiegroups {padding-top: 0.5em !important;}
.iwcc-sitelinks {text-align: left !important;}
.iwcc-sitelinks a {width:auto;}
.iwcc-save-selection {background: #FFF !important;}
.iwcc-save-selection:hover { background: #999 !important; }
.iwcc-accept-all {color: #fff !important;}
.iwccfooterbox { clear:left; position:absolute;bottom:10px;}
p.winner { padding-top:90px;padding-right:90px; }
p.winner img { max-width:180px; }







/* Button Startseite */
#actionbutton { 
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -51%);
z-index:2010;
}

.a-btn{
width:200px;
height:200px;
-webkit-border-radius:50%;
-moz-border-radius:50%;
border-radius:50%;
display:block;
margin:20px;
float:left;
text-align:center;
background:#f0ad4e;

-webkit-box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  0px 0px 1px 8px rgba(188, 188, 188, 0.4), 0px 0px 0px 9px #fff;
-moz-box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  0px 0px 1px 8px rgba(188, 188, 188, 0.4), 0px 0px 0px 9px #fff;
box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  0px 0px 1px 8px rgba(188, 188, 188, 0.4), 0px 0px 0px 9px #fff;
-webkit-transition:all 0.3s linear;
-moz-transition:all 0.3s linear;
-o-transition:all 0.3s linear;
transition:all 0.3s linear;
}
.a-btn span{
font-size:30px;
font-weight:700;
text-align:center;
color:#fff;
text-shadow:0px 1px 1px #A03F16;
font-family: 'Fira Sans', sans-serif !important;
-webkit-transition:all 0.3s linear;
-moz-transition:all 0.3s linear;
-o-transition:all 0.3s linear;
transition:all 0.3s linear;
}


.a-btn span{
display:table-cell;
width:180px;
height:180px;
padding:10px;
vertical-align:middle;
}
.a-btn span:nth-child(1){
opacity:0;
}
.a-btn span:nth-child(2){
position:absolute;
top:58px;
left:30px;
}
.a-btn span:nth-child(3){
position:absolute;
top:58px;
left:30px;
opacity:0;
}

.a-btn span:nth-child(1){
background:transparent;
opacity:0.2;
}
.a-btn:hover{
background:rgba(170, 77, 27, 0.6);
-webkit-box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  1px 4px 5px 8px rgba(188, 188, 188, 0.6), 0px 0px 0px 9px #fff;
-moz-box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  1px 4px 5px 8px rgba(188, 188, 188, 0.6), 0px 0px 0px 9px #fff;
box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  1px 4px 5px 8px rgba(188, 188, 188, 0.6), 0px 0px 0px 9px #fff;
}
.a-btn:hover span:nth-child(3){
opacity:1;
}
.a-btn:hover span:nth-child(2){
opacity: 0; 
-webkit-transform: scale(0);
-moz-transform: scale(0);
transform: scale(0);
}
.a-btn:hover span:nth-child(1){
-webkit-animation:rotate 1s linear;
-moz-animation:rotate 1s linear;
animation:rotate 1s linear;
}
.a-btn:active{
-webkit-box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  0px -1px 0px 8px rgba(188, 188, 188, 0.3), 0px 0px 0px 10px #fff;
-moz-box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  0px -1px 0px 8px rgba(188, 188, 188, 0.3), 0px 0px 0px 10px #fff;
box-shadow:0px 0px 5px 0px rgba(246, 212, 163, 0.5) inset, 0px -1px 5px 4px rgba(170, 77, 27, 0.2) inset, 0px 0px 0px 7px #fff,  0px -1px 0px 8px rgba(188, 188, 188, 0.3), 0px 0px 0px 10px #fff;
}
.a-btn:active span:nth-child(2){
color:rgba(170, 77, 27, 0.8);
text-shadow:0px 1px 1px rgba(255, 255, 255, 0.6);
}
@keyframes rotate{
0% { transform: scale(1) rotate(0);}
50% { transform: scale(0.5) rotate(180deg);}
100% { transform: scale(1) rotate(360deg);}
}
@-webkit-keyframes rotate{
0% { -webkit-transform: scale(1) rotate(0);}
50% { -webkit-transform: scale(0.5) rotate(180deg);}
100% { -webkit-transform: scale(1) rotate(360deg);}
}
@-moz-keyframes rotate{
0% { -moz-transform: scale(1) rotate(0);}
50% { -moz-transform: scale(0.5) rotate(180deg);}
100% { -moz-transform: scale(1) rotate(360deg);}
}











/* *******************************************************
Medium devices and Small devices (768px und weniger)
******************************************************** */

@media (min-width: 1200px) { 
body#article-6 .blupper { position:absolute;right:0;top:60px; width:auto; max-width:456px; z-index:4; }
}



/*  Large devices (desktops, less than 1200px)   */
@media (max-width: 1199.98px) { 


.gallery .row .col-md-1 {
    -ms-flex: 0 0 7.142857%;
    flex: 0 0 7.142857%;
    max-width: 7.142857%;
    padding-right: 0px;
    padding-left: 0px;
}
button.navbar-toggler { display:block; }
ul.navbar-nav { width:auto; display:block;margin:4px 16px 10px;}
ul.navbar-nav .nav-link { padding: 0 1rem;}
.sozials {margin-right:20px; }
footer ul.list-group {margin-top: 0px;}
.navbar-expand-lg > .container-fluid { padding-right:15px;}
body#home li.nav-item a.nav-link {white-space: nowrap !important;}
}



/*  Medium devices (tablets, less than 992px)   */

@media (max-width: 991.98px) { 


.gallery .row .col-md-1 {
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
    padding-right: 0px;
    padding-left: 0px;
}

footer ul.list-group {margin-top: 20px;}
.left h1 span { font-size:70%; padding-left:30%;}
body#home .d-flex.right p.buttons {padding:20px 0; }
body#home .left p.buttons .btn {float:left; }
body#article-6 .blupper { position:absolute;right:0;top:50px; width:auto; max-width:250px; z-index:4; }

 }




/*  medium devices (landscape phones, less than 768px)  */

@media (max-width: 591px) { 

.navbar { padding: .5rem 0.5rem; }
#upformular .form-group { width:80%; margin-right:10%; margin-left:10%; float:none; }
a#logo.py-3 {padding-bottom: 0rem!important;}

.site-name-wrapper { margin-top: 0px; }
.site-name-wrapper a {font-size: 1.1rem; font-weight: 700; margin-bottom:0; color: rgb(0,82,134) !important;}
.site-name-wrapper a.site-slogan {font-size: 0.8rem; font-weight: 400;font-style: italic;color: rgb(77,77,77) !important;}

#site-title {
    float: left;
    display: block;
    position: relative;
    max-height: 60px;
    padding-left: 15px;
    max-width:70%;
}
img.imoff {
    position: relative;
    left: -50px;
    width: 50%;
    margin-bottom: 0px;
}
#logo { display:block; width:90px; margin-right: 0px; }
#logo > img {
    height: auto;
    max-width: 100px;
    padding-top:6px;
}
.site-name-wrapper { margin-left: 0px; }
header #logo { margin-left: 0px; }


.gallery .row .col-md-1 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
    padding-right: 0px;
    padding-left: 0px;
}
footer #logo > img {
    height: auto;
    max-width: 100px;
}

footer ul.impressum { min-width: 50%; padding-bottom:20px; }
footer .iwccfooterbox { display:block; clear:left; position:relative;bottom:0px;margin-bottom:10px;}
body#home .left { padding-left:30px; max-width:86%;}
body#home .col-md-7 { position:relative; text-align:center;}
body#home .d-flex.right p.buttons {position:relative; margin-left:25px; }
body#home .infoblock {flex: 1;display: flex;justify-content: center;}
body#home .infoblock a.btn { margin:0; }
footer .col-md-7 { flex: 0 0 100%;max-width: 100%;width:100%;z-index:1200; }
#footer-logo a#logo, #footer-logo p { margin-right: 0px; }
#footer-logo a#logo {display:none; }
body#home .right { width:100%; }
#logo2 {display:none;}
 }
 
 
 
 
/*  Small devices (portrait phones, less than 359px)  */

@media (max-width: 359px) { 

.fixed-top { position: sticky; }
#logo > img {
padding-top:10px;
    height: auto;
    max-width: 80px;
    padding-bottom:40px;
}

.site-name-wrapper a {font-size: 0.9rem; 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: 0.7rem; font-weight: 400;font-style: italic;color: rgb(77,77,77) !important;}

.pt-5, .mt-5 { padding-top: 0 !important; margin-top: 0 !important; }
img.imoff {
    position: relative;
    left: -50px;
    width: 53%;
    margin-bottom: 0px;
}

.left h1 { font-size:2.2rem; top:-30px; }
.left h1 span { line-height:2rem;padding-left:35%; }
.h2, h2 { font-size: 1.39rem; }
.navbar .navbar-toggler { position:absolute; top:20px; right:20px; }
.navbar .socials { padding-top:10px; padding-left:0px; }
.gallery .row .col-md-1 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    padding-right: 0px;
    padding-left: 0px;
}
body#home .container-fluid {overflow:hidden;}

 }










/*  neu Ostern 2022  */


body#home #zudenbuttons #ausdemjahr  { position:relative;left:0px;width:44px; }



@media (max-width: 767px) { 

body#home .col-md-3.left { width:25%; }
body#home .col-md-3.right { width:25%; }
body#home .col-md-6.homecenter { width:40%; }
.blupper { position:absolute;right:0;top:60px; max-width:350px; z-index:4; }
body#home .right p.buttons {position: absolute;top: 60%;right: 0px;}
body#home p.winner { padding-top:40px;padding-right:40px; }
#actionbutton .a-btn {width:140px;height:140px;}
#actionbutton .a-btn span {font-size:20px;width:130px;height:130px;}
#actionbutton .a-btn span:nth-child(2) {top: 44px; left: 24px;}
#actionbutton .a-btn span:nth-child(3) {top: 44px; left: 24px;}



body#article-6 .blupper { width:100%;position:absolute;right:0;top:30px; width:auto; max-width:260px; z-index:-1; }
body#article-6 #zudenbuttons { position:absolute;top: 210px;right:0px;width: 40px;z-index:2; }

body#article-6 #inhalt { padding-top:140px; }
#videoDecker .col-md-3.left h1 { font-size:1.5em; }
#videoDecker .col-md-3.left .winner img,
#videoDecker .blupper, 
#videoDecker .right .btn { max-width:140px; width:140px;}
body#home #zudenbuttons {width: 40px;}
#videoDecker .col-md-3.left {padding-left: 15px;}
#videoDecker .right .btn.btn-lg { padding: 0.5rem 0.5rem;} 

}



@media (max-width: 560px) { 

body#home .col-md-3.left { width:20%; margin-top:10%; }
body#home .col-md-3.left h1 { font-size:25px; }
body#home .col-md-3.right { width:25%; }
body#home .col-md-6.homecenter { width:40%; }
body#home .right p.buttons {position: absolute;top: 60%;right: 0px;}
body#home p.winner { padding-top:40px;padding-right:0px; }
.blupper { position:absolute;right:0;top:25px; max-width:220px; width:220px; z-index:4; }
}


@media (max-width: 413px) { 
body#home main.mainvideo { overflow:hidden; }
body#home nav.fixed-top { position:relative; }
body#home #videoDecker { position:absolute; top:0px; }
body#home .blupper { right:0;top:0px; max-width:100px; width:100px; z-index:4; }
body#home #videoDecker #zudenbuttons { display:block; }
body#home .col-md-3.left { margin-top: -70px; }
body#home #videoDecker .col-md-3.left .winner img {max-width: 60px;width: 60px;}
body#home #videoDecker .right .btn { display:none; }


.blupper { position:absolute;right:0;top:25px; max-width:220px; width:220px; z-index:4; }

body#home #actionbutton {display:block; }


}




@media (min-width: 576px) { 
#videobody {width:100%; height:60vH;}
main.mainvideo {margin-top: 60px;}
body#home #zudenbuttons { top: 40px; }
body#home #zudenbuttons #ausdemjahr  { position:relative;left:13px;width:44px; }
 }


@media (min-width: 768px) { 
#videobody {width:100%; height:60vH;}
main.mainvideo {margin-top: 60px;}
body#home #zudenbuttons { top: 100px; }
 }


@media (min-width: 992px) { 
#videobody {width:100%; height:60vH;}
main.mainvideo {margin-top: 0px;}

}


@media (min-width: 1200px) { 
#videobody {width:100%; height:80vH;} 
main.mainvideo {margin-top: 0px;}
}