/* content.css */
@import url('https://fonts.googleapis.com/css?family=Oswald:300,400,500,600,700|Roboto:300,400,500,700');



body { font-family: 'Roboto', sans-serif;  }

h1,h2,h3,h4,h5 { font-family: 'Oswald', sans-serif; }
/* Trenner */

hr {border-top: 0px solid #eee;}


/* Storelocator */

@media (min-width: 200px) {
    
    .storelocator-container {/* display: flex; *//* width: 100%; */margin-left: 50px;margin-right: calc(8vw);}
    .w100 { width: 100%; }
    
    
    .store-resultlist-header {
        margin-left: 1em;
    font-size: 1.2em;
    margin-top: .5em;
    border-bottom: 1px solid black;
    }
    
    .store-result-list-item {
        width: 100%;
        border: 1px solid #fff;
        color: black;
        text-align: left;
        padding-left: 1em;
        display: inline-block;
  vertical-align: top;
  overflow: hidden;
  border: solid #fff 1px;
  outline: none;
    }
    
    .store-result-list-item  select {
         padding: 4px;
  margin: -5px -20px -5px -5px;
    }
    
    .hideoverflow {
  display: inline-block;
  vertical-align: top;
  overflow: hidden;
  border: solid #DCDFE3 1px
}

.hideoverflow select {
  padding: 4px;
  margin: -5px -20px -5px -5px;
}


    .storelocator-optional {font-size: 1em;background: white;color: #333;padding-left: 1em;margin-top: 12px;margin-left: 35px;}
    .store-result-list     {/* border-top: 4px solid #99cc11; *//* border-bottom: 4px solid #99cc11; */font-size: 1em;background: white;color: #333;padding-left: 1em;margin-top: 12px;margin-left: 35px;}
    
    .storelocator-text-container {width: 60%;display: inline-flex;}
    .storelocator-button-container {width: 30%;display: inline-flex;float: right;}
    
    .storelocator-input-text {
        background: #fff;
        border: 1px solid #aaa;
        border-radius: 4px;
        color: #99cc11;
        padding: 2px;
        padding-left: 1em;
        padding-right: 2em;
        margin-right: 1em;
        width: 100%;
        outline: none;
    }

    input[type="text"].storelocator-input-text::-webkit-input-placeholder {
  color: #999;
}

    .storelocator-input-button {
     background: #fff;
     border-top-color: #ccc;
     border-bottom-color: #ccc;
     border-left-color: #ccc;
     border-right-color: #aaa;
     border-radius: 4px;
     color: #99cc11;
     padding: 2px;
     padding-left: 1em;
     padding-right: 1em;
     width: 100%;
     float:right;
     outline: none;
    }
    
    
}


/* Filialfinder */

#map {
        height: 600px;
}
  /* The location pointed to by the popup tip. */
      .popup-tip-anchor {
        height: 0;
        position: absolute;
        /* The max width of the info window. */
        width: 200px;
      }
      /* The bubble is anchored above the tip. */
      .popup-bubble-anchor {
        position: absolute;
        width: 100%;
        bottom: /* TIP_HEIGHT= */ 8px;
        left: 0;
      }
      /* Draw the tip. */
      .popup-bubble-anchor::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        /* Center the tip horizontally. */
        transform: translate(-50%, 0);
        /* The tip is a https://css-tricks.com/snippets/css/css-triangle/ */
        width: 0;
        height: 0;
        /* The tip is 8px high, and 12px wide. */
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: /* TIP_HEIGHT= */ 8px solid white;
      }
      /* The popup bubble itself. */
      .popup-bubble-content {
        position: absolute;
        top: 0;
        left: 0;
        transform: translate(-50%, -100%);
        /* Style the info window. */
        background-color: white;
        padding: 5px;
        border-radius: 5px;
        font-family: sans-serif;
        overflow-y: auto;
        max-height: 60px;
        box-shadow: 0px 2px 10px 1px rgba(0,0,0,0.5);
      }
      






@media (min-width: 992px) {
    .section  { margin-bottom: 0; padding-bottom: 0; margin-top: 0; padding-top: 0;} 
    
    
}
@media (min-width: 1200px) {
    .section  { margin-bottom: 0; padding-bottom: 0;margin-top: 0; padding-top: 0;} 
    
}


@media (min-width: 992px) {

    body, .htmlarea-content-body {
    font-family: "Roboto", sans-serif;
    font-size: 16px;
    /*line-height: 1.25;*/
    color: #333;
    background-color: #fff;
}

h1 { font-weight: 600;}
h2 { font-weight: 600;}



    .section-spiruli .container {
        width: 100%;
        padding-left: 0; padding-right: 0;
    }

    
    .bg-grey { background: #eee; }
    .bg-white { background: #fff; }
    
    .frame-boxleft {
        /*border: 1px solid red;*/
        height: 100%;
        /* vertical-align: bottom; */
        /* width: calc(1140px / 2); */
        float: left;
        /* padding-left: calc( (100vw - 1140px) / 2 ); */
    }
    
    .frame-boxright {
        /*border: 1px solid orange;*/
        height: 100%;
        /* vertical-align: bottom; */
        /* width: calc(1140px / 2); */
        float: left;
        /* padding-left: calc( (100vw - 1140px) / 2 ); */
    }
    .frame {
        padding-top: 0em;
    padding-bottom: 0em;
    }
    

    
    .textboxleft-container {
        display: flex;
    }
    
    .textboxleft-border {
        /*border: 2px solid red;*/
        background: url('/fileadmin/templates/spiruli1/img/border-left-green.png');
        background-size: 200px 1.5em;
        background-repeat: no-repeat;
        background-position-y: .5em;
        /* background-position-x: calc( 0px  ); */
        width: calc( (100vw - 1140px) / 2 );
        /* max-width: calc( 100vw - 1140px / 2); */
    }
    
    .textboxleft-content {
        /*border: 1px solid blue;*/
        width: calc( 1140px / 2 );
        padding-left: 2em;
        padding-right: 2em;
        height: 100%;
    }
    
    
    
     .textboxright-container {
        display: flex;
    }
    
    
     .textboxright-border {
        /*border: 2px solid red;*/
        background: url('/fileadmin/templates/spiruli1/img/border-right-green.png');
        background-size: 2000px 1.5em;
        background-repeat: no-repeat;
        /* background-position-y: 0em; */
        /* background-position-x: calc( 0px  ); */
        width: calc( (100vw - 1140px) / 2 );
        /* max-width: calc( 100vw - 1140px / 2); */
    }
    
    .textboxright-content {
        /*border: 1px solid blue;*/
        width: calc( 1140px / 2 );
        padding-left: 2em;
        padding-right: 2em;
        height: 100%;
    }
    

    
    .row {display: flex;border: 0px solid red;}
    
    .frame-well {
        border: 0px solid orange;
    }


}







@media ( min-width: 1300px) {
.textboxleft-content {
        /*border: 1px solid blue;*/
        font-size: 18px;
    }
    .textboxright-content {
        /*border: 1px solid blue;*/
       font-size: 18px;
    }
}


@media ( min-width: 1600px) {
.textboxleft-content {
        /*border: 1px solid blue;*/
        font-size: 18px;
    }
    .textboxright-content {
        /*border: 1px solid blue;*/
       font-size: 18px;
    }
}

@media ( min-width: 1800px) {
.textboxleft-content {
        /*border: 1px solid blue;*/
        font-size: 18px;
    }
    .textboxright-content {
        /*border: 1px solid blue;*/
       font-size: 18px;
    }
}





@media (min-width: 992px) {
    
    body {
        scroll-behavior: smooth;
    }
   

    /* Parallax Scrolling */
    .frame-parallax1 {
        /*margin: 0;*/
        padding-top: 0em;
        padding-bottom: 0em;
        /*margin-top:400px;*/
        /*opacity: 1;*/
        /*transform: scale(0.85);*/
        transition: all 700ms;
    }
     .frame-boxleft {
        transition: all 500ms;
    }
    .frame-boxright {
        transition: all 900ms;
    }
    .textboxleft-border {
        transition: all 400ms;
    }
    .textboxright-border {
        transition: all 700ms;
    }
     .textboxleft-content {
        transition: all 500ms;
    }
    .textboxright-content {
        transition: all 700ms;
    }
    .spiruli-content-col-2 {
        transition: all 700ms;
    }
    
    
    
    
    
     .headerrow1 {
        transition: all 600ms;
    }
    
    
    .parallax1-container {
        border: 0px solid red;transition: all 700ms;
        /*position: absolute;*/
    }
    .parallax1-image {
        border: 0px solid blue;transition: all 700ms;
        width: 100%;
        position: relative;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
    }
    
    
    
    
}



/* Rezept Slider */


@media (min-width:200px) and (max-width: 768px){
    
    
    /* Rezeote Slider kein Hintergrund in Mobiler Version*/
    .bg-grey { background: white; }
    
    .rezept-slider .slick-slide  p {
        
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .rezept-slider .slick-slide  h2 {
        
        padding-left: 20px;
        padding-right: 20px;
    }


    .rezept-slider .frame { background: #fff; border: 0px solid red; margin-top: 0px; padding-top: 0; }
    .rezept-slider .frame { background: #fff; border: 0px solid red; margin-top: 0px; padding-bottom: 0; }
    

    .rezept-slider .slick-slide .row { background: #fff; border: 0px solid red; }

    .rezept-slider .frame-boxleft h2 { margin-top: .5em;}
    .rezept-slider .frame-boxleft h2 { border: 0px solid red;  padding-left: 10px; }
    .rezept-slider .frame-boxleft p { border: 0px solid red;   padding-left: 10px; }
    .rezept-slider .frame-boxleft .table-responsive  {border: 0px solid red;   padding-left: 0; }
    .rezept-slider .frame-boxleft .table-responsive p { border: 0px solid red;   padding-left: 0px; }

    .rezept-slider .frame-boxright h2 { margin-top: .5em;}
    .rezept-slider .frame-boxright h2 { border: 0px solid red;  padding-left: 10px; margin-right: 0;  }
    .rezept-slider .frame-boxright p { border: 0px solid red;   padding-left: 10px; margin-right: 0;  }
    .rezept-slider .frame-boxright .table-responsive  {border: 0px solid red;   padding-left: 0px; }
    .rezept-slider .frame-boxright .table-responsive p { border: 0px solid red;   padding-left: 0px; }

.rezept-slider img { width: 100%; margin: 0; border: 0px solid red;}


  
}




@media (min-width:992px){
    
    .rezept-slider .slick-slide  p {
        font-size: 14px;
        padding-left: 32px;
        padding-right: 32px; 
    }
    
    .rezept-slider .slick-slide  h2 {
        font-size: 18px;
        padding-left: 32px;
        padding-right: 32px;
    }


    .rezept-slider .frame { background: #eee; border: 0px solid red; margin-top: 0px; padding-top: 0; }
    .rezept-slider .frame {background: #eee;border: 0px solid red;margin-top: 0px;padding-bottom: 0;/* padding: 20px; *//* margin-left: 32px; *//* margin-right: -32px; */}

    .rezept-slider .slick-slide .row { background: #eee; border: 0px solid red; }

    .rezept-slider .frame-boxleft h2 { margin-top: 2em;}
    .rezept-slider .frame-boxleft h2 {/* border: 0px solid red; */margin-left: 20px;/* padding-left: calc( (100vw - 1140px) / 2 ); */}
    .rezept-slider .frame-boxleft p { border: 0px solid red;   margin-left: 20px; }
    .rezept-slider .frame-boxleft .table-responsive  {border: 0px solid red;padding-left: calc( (100vw - 1140px) / 2 );padding-left: 32px;}
    .rezept-slider .frame-boxleft .table-responsive p { border: 0px solid red;   padding-left: 0px; }

    .rezept-slider .frame-boxright h2 { margin-top: 2em;}
    .rezept-slider .frame-boxright h2 { border: 0px solid red;  padding-left: 64px; margin-right: calc( (100vw - 1140px) / 2 );  }
    .rezept-slider .frame-boxright p { border: 0px solid red;   padding-left: 64px; margin-right: calc( (100vw - 1140px) / 2 );  }
    .rezept-slider .frame-boxright .table-responsive  {border: 0px solid red;   padding-left: 64px; }
    .rezept-slider .frame-boxright .table-responsive p { border: 0px solid red;   padding-left: 0px; }

    .rezept-slider { background: #eee; margin: 0px; padding: 0px;}
    
    .col-xs-1 .rezept-slider, .col-sm-1 .rezept-slider, .col-md-1 .rezept-slider, .col-lg-1 .rezept-slider, .col-xs-2 .rezept-slider, .col-sm-2 .rezept-slider, .col-md-2 .rezept-slider, .col-lg-2 .rezept-slider, .col-xs-3 .rezept-slider, .col-sm-3 .rezept-slider, .col-md-3 .rezept-slider, .col-lg-3 .rezept-slider, .col-xs-4 .rezept-slider, .col-sm-4 .rezept-slider, .col-md-4 .rezept-slider, .col-lg-4 .rezept-slider, .col-xs-5 .rezept-slider, .col-sm-5 .rezept-slider, .col-md-5 .rezept-slider, .col-lg-5 .rezept-slider, .col-xs-6 .rezept-slider, .col-sm-6 .rezept-slider, .col-md-6 .rezept-slider, .col-lg-6 .rezept-slider, .col-xs-7 .rezept-slider, .col-sm-7 .rezept-slider, .col-md-7 .rezept-slider, .col-lg-7 .rezept-slider, .col-xs-8 .rezept-slider, .col-sm-8 .rezept-slider, .col-md-8 .rezept-slider, .col-lg-8 .rezept-slider, .col-xs-9 .rezept-slider, .col-sm-9 .rezept-slider, .col-md-9 .rezept-slider, .col-lg-9 .rezept-slider, .col-xs-10 .rezept-slider, .col-sm-10 .rezept-slider, .col-md-10 .rezept-slider, .col-lg-10 .rezept-slider, .col-xs-11 .rezept-slider, .col-sm-11 .rezept-slider, .col-md-11 .rezept-slider, .col-lg-11 .rezept-slider, .col-xs-12 .rezept-slider, .col-sm-12 .rezept-slider, .col-md-12 .rezept-slider, .col-lg-12 .rezept-slider {
    position: relative;
    min-height: 1px;
    padding-left: 0px;
    padding-right: 0px;
    border: 0px solid red;
    
}

    .col-lg-12 .rezept-slider { border: 0px solid red; padding: 0; margin: 0;margin-left: 0; margin-right: 0;}

.slick-dots {
    bottom: 0px;
}
.slick-dotted.slick-slider {
    margin-bottom: 0px;
}

  
}

/* Anpassungen für Rezepte */
@media (min-width: 992px) { 
.rezept-slider .frame-boxleft .col-xs-12  { }
.rezept-slider .frame-boxleft .col-xs-12 p {/* padding-right: 32px; *//* font-size: 14px; *//* line-height: 1.4em; *//* padding-left: 42px; */}
.rezept-slider .frame-boxleft .col-xs-12 h2 {color: #4D8130;/* padding-left: 42px; */}
.rezept-slider .frame-boxright .col-xs-12  { }
.rezept-slider .frame-boxright .col-xs-12 p {padding-right: 32px;font-size: 16px;line-height: 1.4em;max-width: calc(50vw - 10px);width: calc(50vw - 10px);}
.rezept-slider .frame-boxright .col-xs-12 h2 {color: #4D8130;max-width: calc( 50vw - 40px);width: calc(50vw - 20px);/* border: 1px solid red; */}

}





@media (min-width:1200px){
    
    .rezept-slider .slick-slide  p {
        font-size: 18x;
        padding-left: 32px;
        padding-right: 32px; 
    }
    
    .rezept-slider .slick-slide  h2 {
        font-size: 24px;
        padding-left: 32px;
        padding-right: 32px;
    }


    .rezept-slider .frame { background: #eee; border: 0px solid red; margin-top: 0px; padding-top: 0; }
    .rezept-slider .frame { background: #eee; border: 0px solid red; margin-top: 0px; padding-bottom: 0; }

    .rezept-slider .slick-slide .row { background: #eee; border: 0px solid red; }

    .rezept-slider .frame-boxleft h2 { margin-top: 2em;}
    .rezept-slider .frame-boxleft h2 { border: 0px solid red;  padding-left: calc( (100vw - 1140px) / 2 ); }
    .rezept-slider .frame-boxleft p {border: 0px solid red;padding-left: calc( (100vw - 1140px) / 2 );font-size: 16px;}
    .rezept-slider .frame-boxleft .table-responsive  {border: 0px solid red;   padding-left: calc( (100vw - 1140px) / 2 ); }
    .rezept-slider .frame-boxleft .table-responsive p { border: 0px solid red;   padding-left: 0px; }

    .rezept-slider .frame-boxright h2 { margin-top: 2em;}
    .rezept-slider .frame-boxright h2 { border: 0px solid red;  padding-left: 64px; margin-right: calc( (100vw - 1140px) / 2 );  }
    .rezept-slider .frame-boxright p { border: 0px solid red;   padding-left: 64px; margin-right: calc( (100vw - 1140px) / 2 );  }
    .rezept-slider .frame-boxright .table-responsive  {border: 0px solid red;   padding-left: 64px; }
    .rezept-slider .frame-boxright .table-responsive p { border: 0px solid red;   padding-left: 0px; }

    .rezept-slider { background: #eee; margin: 0px; padding: 0px;}
    
    .col-xs-1 .rezept-slider, .col-sm-1 .rezept-slider, .col-md-1 .rezept-slider, .col-lg-1 .rezept-slider, .col-xs-2 .rezept-slider, .col-sm-2 .rezept-slider, .col-md-2 .rezept-slider, .col-lg-2 .rezept-slider, .col-xs-3 .rezept-slider, .col-sm-3 .rezept-slider, .col-md-3 .rezept-slider, .col-lg-3 .rezept-slider, .col-xs-4 .rezept-slider, .col-sm-4 .rezept-slider, .col-md-4 .rezept-slider, .col-lg-4 .rezept-slider, .col-xs-5 .rezept-slider, .col-sm-5 .rezept-slider, .col-md-5 .rezept-slider, .col-lg-5 .rezept-slider, .col-xs-6 .rezept-slider, .col-sm-6 .rezept-slider, .col-md-6 .rezept-slider, .col-lg-6 .rezept-slider, .col-xs-7 .rezept-slider, .col-sm-7 .rezept-slider, .col-md-7 .rezept-slider, .col-lg-7 .rezept-slider, .col-xs-8 .rezept-slider, .col-sm-8 .rezept-slider, .col-md-8 .rezept-slider, .col-lg-8 .rezept-slider, .col-xs-9 .rezept-slider, .col-sm-9 .rezept-slider, .col-md-9 .rezept-slider, .col-lg-9 .rezept-slider, .col-xs-10 .rezept-slider, .col-sm-10 .rezept-slider, .col-md-10 .rezept-slider, .col-lg-10 .rezept-slider, .col-xs-11 .rezept-slider, .col-sm-11 .rezept-slider, .col-md-11 .rezept-slider, .col-lg-11 .rezept-slider, .col-xs-12 .rezept-slider, .col-sm-12 .rezept-slider, .col-md-12 .rezept-slider, .col-lg-12 .rezept-slider {
    position: relative;
    min-height: 1px;
    padding-left: 0px;
    padding-right: 0px;
    border: 0px solid red;
    
}

    .col-lg-12 .rezept-slider { border: 0px solid red; padding: 0; margin: 0;margin-left: 0; margin-right: 0;}

.slick-dots {
    bottom: 0px;
}
.slick-dotted.slick-slider {
    margin-bottom: 0px;
}

  
}

/* Anpassungen für Rezepte */
@media (max-width: 1200px) { 
.rezept-slider .frame-boxleft .col-xs-12  { }
.rezept-slider .frame-boxleft .col-xs-12 p {padding-right: 64px;font-size: 16px;line-height: 1.4em; }
.rezept-slider .frame-boxleft .col-xs-12 h2 { color: #4D8130;}
.rezept-slider .frame-boxright .col-xs-12  { }
.rezept-slider .frame-boxright .col-xs-12 p {padding-right: 64px;font-size: 16px;line-height: 1.4em; }
.rezept-slider .frame-boxright .col-xs-12 h2 { color: #4D8130;}

}



/* Bilder in der mobilen Ansicht */

@media (max-width: 767px) {
    
    .parallax1-container img {
        text-align: center;
        width:100%;
        
    }
    
}





/* BILDBALKEN MIT TEXT MITTIG ZITATE BARKEN */

@media (min-width: 200px) { 
    .section-spiruli .carousel .item {height: auto;}  
}
@media (min-width: 768px) { 
    .section-spiruli .carousel .item {height: 20em;}  
}


@media (min-width: 1200px) { 
    .section-spiruli .carousel .item { max-height: 400px; }  
}



@media (min-width:768px) and (max-width:992px) {
/*
    .frame-boxleft p { padding-left: 20px; padding-right: 40px; }
    .frame-boxleft h1 { padding-left: 20px; padding-right: 40px; }
    .frame-boxleft h2 { padding-left: 20px; padding-right: 40px; }
    .frame-boxleft h3 { padding-left: 20px; padding-right: 40px; }
    .frame-boxleft h4 { padding-left: 20px; padding-right: 40px; }
    .frame-boxleft h5 { padding-left: 20px; padding-right: 40px; }
    */


}


@media (min-width:992px) and (max-width:1000px) {

   .rezept-slider  .frame-boxleft p { padding-left: 20px; padding-right: 40px; }
  .rezept-slider   .frame-boxleft h1 { padding-left: 20px; padding-right: 40px; }
   .rezept-slider  .frame-boxleft h2 { padding-left: 20px; padding-right: 40px; }
  .rezept-slider   .frame-boxleft h3 { padding-left: 20px; padding-right: 40px; }
   .rezept-slider  .frame-boxleft h4 { padding-left: 20px; padding-right: 40px; }
   .rezept-slider  .frame-boxleft h5 { padding-left: 20px; padding-right: 40px; }
   
}


/* Seite 2 */


/* Text rechts mit grünem Balken Motiv */

@media (min-width: 200px) { }

@media (min-width: 768px) { }

/* Content im Frame vertikal zentrieren */

@media (min-width: 768px) {

  .frame-vcenterinner { }
  .frame-vcenterinner  {border: 0px solid red; display: flex; align-items:center; }
  .frame-vcenterinner .frame { margin-top: unset; margin-bottom: unset; border: 0px solid red; }

}








@media (min-width: 992px) { 

    .frame-text1 {font-weight: 300;}
    .frame-text1 h1 {     font-size: 4em; font-weight: 300;  }
    .frame-text1 h2 {     font-size: 3em;  font-weight: 300; }
    .frame-text1 h3 {     font-size: 2em;   }
    .frame-text1 h4 {font-size: 1.3em;font-weight: 400;}
    .frame-text1 h5 {font-size: 1.2em;font-weight: 400;}
    .frame-text1 p {     font-size: 1em;  font-weight: 400; }
    .frame-text1 a {     font-size: 1em; font-weight: 400;  }
    
    .frame-text1 h1,h2,h3,h4,h5 { margin-bottom: 8px;}

    .frame-text1-rand-rechts p { max-width: calc( 50vw - 8vw - 8vw); border: 0px solid green; margin: 0 0 18.5px;}
    .frame-text1-rand-links p  { max-width: calc( 50vw - 8vw - 8vw); border: 0px solid green; margin: 0 0 18px;}

    /* Trenner Stängel Stengel einrücken */
    .frame-text1  h1 { padding-left: 50px;}
    .frame-text1  h2 { padding-left: 50px;}
    .frame-text1  h3 { padding-left: 50px;}
    .frame-text1  h4 { padding-left: 50px;}
    .frame-text1  h5 { padding-left: 50px;}
    .frame-text1  p { padding-left: 50px;}
    
    .frame-text1 .gallery-item { border: 0px dotted green; }
}    



/* Seite 3 Bilder rechts */

/* frame-text2 ohne versciebung */

@media (min-width: 200px) { }

@media (min-width: 768px) { }

@media (min-width: 992px) { 

    .frame-text2 {        font-weight: 300;  margin-left: 60px;  }
    .frame-text2 h1 {     font-size: 4em; font-weight: 300;  }
    .frame-text2 h2 {     font-size: 3em;  font-weight: 300; }
    .frame-text2 h3 {     font-size: 2em;   }
    .frame-text2 h4 {font-size: 1.3em;font-weight: 400;}
    .frame-text2 h5 {font-size: 1.2em;font-weight: 400;}
    .frame-text2 p {     font-size: 1em;  font-weight: 400; }
    .frame-text2 a {     font-size: 1em; font-weight: 400;  }
    
    .frame-text2 h1,h2,h3,h4,h5 { margin-bottom: 8px;}

    .frame-text2-rand-rechts p { max-width: calc( 50vw - 8vw - 8vw); border: 0px solid green; margin: 0 0 8px;}
    .frame-text2-rand-links p  { max-width: calc( 50vw - 8vw - 8vw); border: 0px solid green; margin: 0 0 8px;}
    .frame-text2-rand-rechts img { max-width: calc( 50vw - 8vw - 8vw); border: 0px solid green; margin: 0 0 8px;}
    .frame-text2-rand-links  img  { max-width: calc( 50vw - 8vw - 8vw); border: 0px solid green; margin: 0 0 8px;}

    /* Trenner Stängel Stengel einrücken */
    .frame-text2  h1 { }
    .frame-text2  h2 { }
    .frame-text2  h3 { }
    .frame-text2  h4 { }
    .frame-text2  h5 { }
    .frame-text2  p { }
    
    .frame-text1 .gallery-item { border: 0px dotted green; }
}    




@media (min-width:992px) {
    .frame-bild-rechts { margin-left: 20px;}
     .rand-links-seite-3   {padding-left: calc(8vw);margin-right: 40px;}
    .rand-rechts-seite-3  { padding-right: calc(8vw); }
    
    .frame-bild-rechts-rand { padding-right: calc(8vw); }
}
@media (min-width:1200px) {
    .frame-bild-rechts { margin-left: 20px;}
     .rand-links-seite-3   {padding-left: calc(8vw);margin-right: 40px;}
    .rand-rechts-seite-3  { padding-right: calc(8vw); }
    
    .frame-bild-rechts-rand { padding-right: calc(16vw); }
}



/* Knöpfe */
.btn-danger {
    font-family: 'Oswald', sans-serif;
    text-align: center;
    font-size: 1em; padding-left: 2em; padding-right: 2em;
}

.btn-danger { background-color: #e81108; border-bottom: 1px solid#333; color: white;  }




/* Content in einer Box mitig zentrieren */
.row .frame-center-items {
    
    align-items: center;
    
}






/* Mobile Darstellung */

@media (max-width:768px) { 
     .frame img { width: 100%; }
     h1 {font-size: 2.0em;}
     h2 {font-size: 1.5em;}
     h3 {font-size: 1.5em;}
}


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

.frame {
    padding-top: 0em;
    padding-bottom: 0em;
    margin: 20px;
    /* margin-top:  0px; */
    }
   

    .btn-info { width: 100%;}
    .btn-default { width: 100%;}


}




/* Abstände mobile Version */

@media (min-width:200px) and (max-width: 768px) {
    .frame-space-before-extra-large {
    margin: 0em;
    border: 0px solid red;
    margin-top: -20px;
}
hr { display: none;}
    
}


/* Content vertikal zentirieren */

.vcenter { 
  align-items: center; 
  border: 0px solid red;
  margin-top:auto;
  margin-bottom: auto;
  }

  


.valign:after {
    display: inline-block;
    height: 100%;
    width: 0;
    vertical-align: middle;
    content: '';
}
.valign > .valigned {
    display: inline-block;
    vertical-align: middle;
    text-align: left;
}



@media (min-width: 768px) {
    
    .frame-entwicklung { border: 0px solid red; }
    .frame-entwicklung-bild { border: 0px solid green; }
    .frame-entwicklung-text { border: 0px solid blue; }
    .frame-entwicklung-text {font-weight: 300;/* margin: 40px; */}
    .frame-entwicklung-text h1 {     font-size: 4em; font-weight: 300;  }
    .frame-entwicklung-text h2 {     font-size: 3em;  font-weight: 300; }
    .frame-entwicklung-text h3 {     font-size: 2em;   }
    .frame-entwicklung-text h4 {font-size: 1.3em;font-weight: 400;}
    .frame-entwicklung-text h5 {font-size: 1.2em;font-weight: 400;}
    .frame-entwicklung-text p {     font-size: 1em;  font-weight: 400; }
    .frame-entwicklung-text a {     font-size: 1em; font-weight: 400;  }
    
    .frame-entwicklung-text h1,h2,h3,h4,h5 { margin-bottom: 8px;}

    .frame-entwicklung-text-rand-rechts p { max-width: calc( 50vw - 8vw - 8vw); border: 0px solid green; margin: 0 0 8px;}
    .frame-entwicklung-text-rand-links p  { max-width: calc( 50vw - 8vw - 8vw); border: 0px solid green; margin: 0 0 8px;}

    /* Trenner Stängel Stengel einrücken */
    .frame-entwicklung-text  h1 { }
    .frame-entwicklung-text  h2 { }
    .frame-entwicklung-text  h3 { }
    .frame-entwicklung-text  h4 { }
    .frame-entwicklung-text  h5 { }
    .frame-entwicklung-text  p { }
    
    
    .frame-entwicklung-linie-rechts {
        border-right: 3px solid #4e8134;
    }

    .frame-entwicklung-bild { padding: 50px;}
    .frame-entwicklung-text { padding: 50px;}


    .frame-entwicklung-punkt-links {  }
    .frame-entwicklung-punkt-rechts {  }


.frame-entwicklung-punkt-links h4::before {
  /*
  font-size: 80px;
  content: "•"; color: #4e8134;
  display: inline-block; width: 66px;
  margin-left: -66px; 
  margin-top: -40px;
  position: absolute;
  z-index: 1003;
  background: url('/fileadmin/templates/spiruli1/img/frame-entwicklung-bullet.png') no-repeat left top;
  background-size: 40px 40px;
  */
  }

  .frame-entwicklung-punkt-links h4::before {
  
  font-size: 80px;
  content: "•"; color: transparent;
  display: inline-block; width: 66px;
  margin-left: -72px; 
  margin-top: -8px;
  position: absolute;
  background: url('/fileadmin/templates/spiruli1/img/frame-entwicklung-bullet.png') no-repeat left top;
  background-size: 40px 40px;
  
  }

  

  
  .frame-entwicklung-punkt-rechts h4::after {
  font-size: 80px;
  content: "•"; color: #4e8134;
  content: "•"; color: transparent;
  display: inline-block; width: 66px;
  margin-left: 32px; 
  margin-top: -8px;
  position: absolute;
    /* als Image */
  background: url('/fileadmin/templates/spiruli1/img/frame-entwicklung-bullet.png') no-repeat left top;
  background-size: 40px 40px;
  
  
  }


}


@media (min-width: 1400px) {
  body { font-size: large; }
}




/* Seite FAQ  */



/* 2019-01-13  Dropdown für FAQ Spiruli */

.faq-container .panel-heading {background-color: white;color: black;}
.faq-container  .panel-default > .panel-heading {
    border-color: transparent;
    border-top: 2px solid #94c11c;
    /* border-bottom-color: transparent; */
    background: url('/fileadmin/templates/spiruli1/img/faq-arrow-1.jpg');
    background-repeat: no-repeat;
    background-size: 60px;
   
    
}


.faq-container .panel-body { background: white; color: black; }
.faq-container .panel-title {padding-left: 64px;border: 0px solid red;margin-right: 0px;display: flex;font-weight: 400;padding: 10px;padding-left: 64px;margin-left:  0px;padding: 0px;margin: -15px;}
.faq-container .panel-title > a, .panel-title > small, .panel-title > .small, .panel-title > small > a, .panel-title > .small > a {
    /* color: inherit; */
    /* width: 100%; */
    /* background: url('/fileadmin/templates/spiruli11/img/faq-arrow-1.jpg'); */
    /* background-position: left; */
    /* background-repeat: no-repeat; */
    /* background-size: 35px; */
    border:  0px solid blue;
    width: 100%;
    margin: 0px;
    padding: 20px;
    padding-left: 80px;
}

.faq-container .panel-default {
    border-color: transparent;
}

.faq-container .panel-default > .panel-heading + .panel-collapse > .panel-body {
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    border-right-color: transparent;
}


.faq-container .panel-title > a, .panel-title > small, .panel-title > .small, .panel-title > small > a, .panel-title > .small > a {
    font-weight: 100;
}

.faq-container .panel-body { margin-left: 64px; }



/* content tablet */


@media (max-width: 992px) {
.row { padding-left: 0px; padding-right: 0px;}
.row .frame { padding-left: 40px; padding-right: 40px;}
.container {width: 100%;}
.row figure > img, .row figure a > img {    width: auto; }
}
@media (max-width: 768px) {
.row { padding-left: 0px; padding-right: 0px;}
.row .frame { padding-left: 20px; padding-right: 20px;}
.container {width: 100%;}
.row figure > img, .row figure a > img {    width: 100%;    }
.frame-icons1 .row img { width: 50vw; }

}


@media (max-width: 480px) {
.row { padding-left: 0px; padding-right: 0px;}
.row .frame { padding-left: 10px; padding-right: 10px;}
.container {width: 100%;}
.row figure > img, .row figure a > img {    width: auto;    }
}


.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    
    min-height: 0px;
    background: transparent;
   
}


.scroll-top { z-index: 100999; }