/*!
 * Start Bootstrap - Modern Business (https://startbootstrap.com/template/modern-business)
 * Copyright 2013-2020 Start Bootstrap
 * Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-logomodern-business-nav/blob/master/LICENSE)
 */
 
.animate-box {
  opacity: 0;
} 

body {
  padding-top: 56px;
  background: url('../images/slider/35989239_l_normal_none.jpg') no-repeat center right fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;  
}

.badge {
  text-decoration:none;
  font-size:0.8rem;
}

.breadcrumb {
  margin-top: 1.0rem;
}

nav {
  background:#427f0c;
  border-bottom:5px solid rgb(255 255 255 / 100%);
}

.btn-primary {
  background:#6cb42d;
  border:0;
  transition:all 1s ease-in-out;
}

.btn-primary:hover {
  background:#427f0c;
}

div.antrag {
  text-align:center;
  margin-bottom:2rem;
}

a.antrag {
  font-size: 1.5rem;
  padding:1rem 1rem 1.25rem 1rem;
}

#menu > li.nav-item > a {
  /* padding: 0 0 0 1.75rem; */
}

#menu > li.nav-item.active > a {
  color:#fff;.
}

#menu > li.nav-item.dropdown > ul > li > a {
  color:#000;
}

a {
  color:#000;
}

h1 {
  font-size:2.0rem;
  margin-bottom:1rem;
  line-height:1.25 !important;
}

h2 {
  font-size:1.75rem;
  margin-bottom:1rem;
}

.container.content {
  min-height: calc(100vH - 133px);
  position:relative;
}

.container.content.index {
  min-height: calc(100vH - 165px);
  margin-bottom:5rem !important;
}

.carousel-item {
  height: 65vh;
  min-height: 300px;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.img-fluid {
  width:100%;
}

img.border {
  border:5px solid #fff !important;
}

.imageTitle {
  font-size:1rem; 
  text-shadow:0.5px 0.5px #fff;;
  margin-top:-1rem;
  margin-left:0.25rem;
  display:block;
  font-style:italic;
  line-height:1.5em;
}

#lbCaption { opacity:0; }

.spendenvorlage {
  position:relative;
  padding-top:1rem;
}

.spendenvorlage a {
  display:block;
  text-align:center;
}

.spendenvorlage img {
  width:200px;
  /* margin:auto; */
}

/* ============= STARTSEITE ============== */
.logo {
  width:300px;
  max-width: 100%;
}

.slogan {
  position:relative;
  left:-1.75rem;
}

.slogan h1 {
  font-size:2rem;
  padding-left:1.75rem;
  line-height:3rem;
  text-shadow: 1px 1px 1px #fff;
}

.slogan h1::before {
  content:"...";  
  position:absolute;  
  left:0rem;
}

.content .text {
  background:rgba(255,255,255,0.5);
  padding:1.25rem 1.25rem 1rem 1.25rem;
  margin:0;
  margin-bottom: 4rem;
  border-radius:8px;
  border:1px solid #fff;
  position:relative;
}

.content .text ul {
  list-style: disc;
}

.content .text ul li {
  margin-bottom:1rem;
}

.content .text table {
  background:#fff;
  font-size:0.8rem;
}

.content .text table td {
  padding:0.5rem;
}

.masonry img {
  opacity:0;
  transition:all 0.5s ease-in-out;
}

.formular {
  background:rgba(255,255,255,0.5);
  padding:1rem;
  padding-top:2rem;
  padding-right: 0.25rem;
  margin: 0rem;
  margin-bottom:4rem;
  border-radius:8px;
  border:1px solid #fff;
}

/* ============= SLIDER Startseite ============== */
.slider {  
  display:none;
}

.slick-list {
}

.slick-slide,
.slick-slider .slick-track,
.slick-slider .slick-list
{
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);

  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
  transform: translateZ(0);

  -webkit-perspective: 1000;
  -moz-perspective: 1000;
  -ms-perspective: 1000;
  perspective: 1000;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;

-webkit-perspective: 2000px;
-webkit-backface-visibility: hidden;
-webkit-backface-visibility: hidden;

-webkit-transform-style: preserve-3d;

-webkit-perspective: 1000;
-webkit-backface-visibility: hidden;  


}

body {-webkit-transform:translate3d(0,0,0);}

.slick-track {
  height:100% !important;
}

.slick-slide {
}

.slider.start {
  max-height:700px !important;  
}

.slider.start .slick-slide {
  position:relative;
}

.slick-dots {
  position:absolute;
  right:0;
  font-size:0.7rem;
}

.slick-dots li {
  float:left;
}

.slick-dots .slick-active button {
  background:red;
}

.slider.start img {
  background:black;
}

.slider.start h5 {
  position:absolute;
  bottom:5em;
  left:0;
  right:0;
  text-align:center;
  color:#000;
}

.slider.start p {
  position:absolute;  
  bottom:3em;
  left:0;
  right:0;
  text-align:center;
  color:#fff;
}

.slider.blog .slick-slide,
.slider.blog .slick-track,
.slider.portfolio .slick-slide,
.slider.portfolio .slick-track {
  height:auto !important;
}

.slider .zoom {
  position:absolute;
  top:1.25rem;
  margin-left:1em;
  padding:1em;
  background: url(../images/zoom.svg) no-repeat;
-webkit-filter: drop-shadow( 1px 1px 1px rgba(255, 255, 255, 1));
  filter: drop-shadow( 1px 1px 1px rgba(255, 255, 255, 1));
  /* Similar syntax to box-shadow */  
}

.blog ul {
  list-style:disc;
}

.blog ul a {
  text-decoration:none;
}

.blogDetail {
  background:#fff;
  border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0
}

.blogDetail .prev a,
.blogDetail .next a,
.blogDetail .overview a {
  background:#427f0c;
  color:#fff;
  font-weight:bold;
  min-width:44px;
  min-height:44px;
  display:inline-block;
  text-align:center;
  line-height:44px;
  text-decoration:none;
}

.blogDetail .overview a {
   padding:0 1rem; 
}

/* ============= PORTFOLIO ============== */
.filter-button
{
    font-size: 18px;
    border: 1px solid #42B32F;
    border-radius: 5px;
    text-align: center;
    color: #42B32F;
    margin-bottom: 30px;

}

.filter-button:hover
{
    font-size: 18px;
    border: 1px solid #42B32F;
    border-radius: 5px;
    text-align: center;
    color: #ffffff;
    background-color: #42B32F;

}

.btn-default:active .filter-button:active
{
    background-color: #42B32F;
    color: white;
}

.gallery_product
{
    margin-bottom: 30px;    
}

.gallery_product img {
  width:100%;
}

@media (max-width: 575px) { 
  .portfolio {
    padding-left:0.33rem;
    padding-right:0.33rem;
  }
  
  .gallery_product
  {
      width:50%;
      margin-bottom:15px;
      padding-left:calc(var(--bs-gutter-x)/ 4);
      padding-right:calc(var(--bs-gutter-x)/ 4);
  }

}

.portfolio-item {
  margin-bottom: 30px;
}


/* ============= PORTFOLIO DETAIL ============== */



/* ============= KONTAKTFORMULAR ============== */
form div {
  margin-bottom:0.75em;
}

#confirmemail {
  display:none;
}

.error {
  border:1px solid red;
}

.datenschutz .error {
  border:0;
  text-decoration:underline;
  color:red;
  display: block;
  padding-left: 1.6rem;
}

footer {
  background:#427f0c;
  border-top:5px solid rgb(255 255 255 / 80%);
}

footer a {
  color:#fff;  
  padding:0 .5rem;
}

footer a:hover {
  color:#fff;
}

.navbar-brand {
  padding:0;
  /* margin:auto; */
  /* margin-bottom:0.25rem; */
  font-size: 0.75rem;
}


/* ============= MEDIA QUERIES ============== */
@media (min-width: 320px) { 
  .slider.blog,
  .slider.portfolio {
    height: 176px !important;
  }

  .slider.portfolio { 
    padding:0;
  }
    
}

@media (min-width: 375px) { 
.navbar-brand {
  font-size: 0.9rem;
}    

.logo {
  width:300px;
  max-width: 100%;
  margin:auto;
}  

  .breadcrumb {
      /* margin-top:2.75rem; */
    }
  .slider.blog,
  .slider.portfolio { 
    height:211px !important;
  }
}

@media (min-width: 425px) { 
.navbar-brand {
  font-size:1.05rem;
  padding:0;
  margin:unset;
  margin-bottom:0.0;
}      
  .breadcrumb {
      margin-top:0.75rem;
    }

.content .text table {
  background:#fff;
  font-size:1rem;
}

.content .text table td {
  padding:1rem;
}  
  .slider.blog,  
  .slider.portfolio,
  .slider.portfolio .slick-list {
    height: 337px !important;
  }
}

@media (min-width: 576px) { 
  .navbar-brand {
  font-size:1.25rem;
}    
  .slider.blog,
  .slider.portfolio,
  .slider.portfolio .slick-list  {
    height: 323px !important;
  }

  .content .text {
    padding:2rem 2rem 1rem 2rem;
  }  
}

@media (min-width: 768px) { 
  .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
         max-width:680px; 
  }  

  .slider.blog,
  .slider.blog .slick-list {
    height: 438px !important;
  }

  .slider.portfolio,
  .slider.portfolio .slick-list { 
    height:286px !important;
  }  

  .content .text {
    padding:1.5rem 2rem 1rem 2rem;
    margin:0;
    margin-bottom: 4rem;
  }  
  
}

@media (min-width: 992px) { 
  .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
         max-width:900px; 
  }  
  .spendenvorlage {
    position:absolute;
    top:0;
    right:0;  
    padding-top:1.5rem;
  }  

    .logo:not(.kontakt) {
    margin-left: 3rem;
  }  

  .spendenvorlage a {
    display:block;
    text-align:left;
    margin-left:3rem;
  }    

  .content .text {
    padding:1.5rem 2rem 1rem 2rem;
    margin:0;
    margin-bottom: 4rem;
  }  
  
  .slogan h1 {
    width:75%;
  }  
  
  .slider.blog,
  .slider.portfolio,
  .slider.portfolio .slick-list {
    height: 386px !important;
  }

  .content .text {
    left:-0.5rem;
  }

  div.antrag {
    text-align:left;
  }  
  
}

@media (min-width: 1200px) { 
  .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
         max-width:1040px; 
  }  
  .breadcrumb {
      margin-top:0.25rem;
    }  
  #menu > li.nav-item > a {
    padding: 0 0 0 2rem;
  }  
  .slider.start,
  .slider.start .slick-list,
  .slider.start .slick-track,
  .slider.start .slick-slide {
    max-height: 700px !important;
  } 

  .slider.blog,
  .slider.blog .slick-list,
  .slider.portfolio,
  .slider.portfolio .slick-list {
    height: 461px !important;
  }

  .content .text {
    left:0;
  } 
  
}

@media (min-width: 1400px) { 
  .container,.container-lg,.container-md,.container-sm,.container-xl,.container-xxl {
         max-width:1220px; 
  }
  
  .slider.start img {
    position:relative;
    transform:translateY(-10%);
  }

  .slider.blog,
  .slider.blog .slick-list,
  .slider.portfolio,
  .slider.portfolio .slick-list {
    height: 537px !important;
  }

  .slogan h1 {
    width:55%;
  }   
}

@media (min-width: 1600px) { 
  .slider.start img {
    transform:translateY(-20%);
  }
}