html, body { height: 100%; }
#page { min-height: 100%; }

#pageelements { margin-left: 0px; margin-right: 0px; padding-bottom: 0px; transition: 1s; }
#pageelements .singleelement, footer .singleelement {  margin-bottom: 30px; }

.singleelement .extragap { margin: 10px;

   color: #ffffff;

   overflow: hidden;
   position: relative;
   background-color: #09a223;
   padding: 20px 40px 40px 40px;
   z-index: 1;

   -webkit-transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
	transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
	-o-transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
	transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
	transition:background .3s, border .3s, border-radius .3s, box-shadow .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s

  }


.singleelement .extragap.first { margin-left: 10px;}
.singleelement .extragap.last { margin-right: 10px;}

.singleelement .extragap:hover { color: #0e0e0e; }
.singleelement .extragap:hover .icon { color: #09a223; }
.singleelement .extragap:hover .iconbg { color: #09a223; }

.singleelement .extragap:before {
     content: '';

   height: 3px;
   width: 100%;
   left: 0;
   bottom: 0;
   position: absolute;
   background-color: #ebf1f1;

   z-index: -2;
   -webkit-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -khtml-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -moz-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -ms-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -o-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
}

.singleelement .extragap:hover:before {
  height: 100%;
}

.singleelement .extragap2 { margin: 0px;

   color: #0e0e0e;
   margin-left: 10px; margin-right:10px; margin-bottom: 30px;
   /*overflow: hidden;*/
   position: relative;
   background-color: #f9f9f9;
   padding: 32px 30px 47px 45px;
   z-index: 1;

   -webkit-transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
	transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
	-o-transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
	transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
	transition:background .3s, border .3s, border-radius .3s, box-shadow .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;

  }

  .singleelement .extragap2.white {
     color: #000;

     background-color: #fff;

     -webkit-transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
  	transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
  	-o-transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
  	transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
  	transition:background .3s, border .3s, border-radius .3s, box-shadow .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;

    }

    .singleelement .extragap2.green {
       color: #fff;

       background-color: #09a223;

       -webkit-transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
     transition: background .3s, border .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;
     -o-transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
     transition: background .3s, border .3s, border-radius .3s, box-shadow .3s;
     transition:background .3s, border .3s, border-radius .3s, box-shadow .3s, -webkit-border-radius .3s, -webkit-box-shadow .3s;

      }

.singleelement .imagegap { margin: 10px; margin-bottom: 0px; }
.singleelement .extragap2.first { margin-left: 10px;}
.singleelement .extragap2.last { margin-right: 10px;}

.wow:hover .extragap2 { color: #0e0e0e; }
.wow:hover .extragap2 .title { color: #09a223; }

.singleelement .extragap2:before {
     content: '';

   height: 3px;
   width: 100%;
   left: 0;
   bottom: 0;
   position: absolute;
   background-color: #f1f1f1;
   z-index: -2;
   -webkit-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -khtml-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -moz-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -ms-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -o-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
}

.singleelement .extragap2.white:before {
     content: '';

   height: 3px;
   width: 100%;
   left: 0;
   bottom: 0;
   position: absolute;
   background-color: #fff;
   border: 1px solid #fff;
   z-index: -2;
   -webkit-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -khtml-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -moz-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -ms-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -o-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
}

.singleelement .extragap2.green:before {
     content: '';

   height: 3px;
   width: 100%;
   left: 0;
   bottom: 0;
   position: absolute;
   background-color: #09a223;
   border: 1px solid #09a223;
   z-index: -2;
   -webkit-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -khtml-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -moz-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -ms-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   -o-transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
   transition: 0.3s cubic-bezier(0.24, 0.74, 0.58, 1);
}

.singleelement .extragap2:hover:before {
  height: 100%;
}

.singleelement .icon { font-size: 30px; color: #fff; /* color: #09a223; */ }

.singleelement .iconbg {
   position: absolute;
   top: -11px;
   right: -11px;
   line-height: 1;
   font-size: 67px;
   color: #fff;
}

.singleelement .title {
   font-size: 26px;
   line-height: 36px;

   font-family: 'Poppins', sans-serif; font-weight: 700;
}

.singleelement .title20 {
   font-size: 20px;
   line-height: 24px;
   margin-bottom: 25px;
   font-family: 'Poppins', sans-serif; font-weight: 700;
}

.singleelement .title48 {
   font-size: 48px;
   line-height: 1.05556;
   letter-spacing: -0.01em;
   font-family: 'Poppins', sans-serif; font-weight: 700;
}


.singleelement .subtitle {
   font-size: 16px;
   font-weight: 700;
   line-height: 32px;
   color: #09a223; margin-bottom: 4px;
}


.singleelement .title.light, .singlemicroelement .title.light, .singleelement .subtitle.light, .singlemicroelement .subtitle.light { font-weight: 400; }
.singleelement .title.small, .singlemicroelement .title.small, .singleelement .subtitle.small, .singlemicroelement .subtitle.small { font-size: 14px; line-height: 20px; }
.singleelement .title.dark, .singlemicroelement .title.dark, .singleelement .subtitle.dark, .singlemicroelement .subtitle.dark { color: #000; }


.singleelement .description { line-height: 1.625; font-family: 'Roboto', sans-serif; font-size:16px; }
.singleelement .description14, .singlemicroelement .description14 { line-height: 24px; font-family: 'Roboto', sans-serif; font-size:14px; color: #666; }
.singleelement .description48 { padding-left: 20px; line-height: 1.625; font-family: 'Roboto', sans-serif; font-size:16px; }
.singleelement .description.bold, .singlemicroelement .description.bold { font-weight: bold; }


.description.description14 a { color: #666; } .description.description14 a:hover { color: #09a223; }


.singleelement.elementwhite { /* margin: 10px; */ margin-top: 0px; padding-top:0px; padding-bottom: 0px; }
.singleelement.elementwhite .row { /*background: #fff;*/ color: #000;  /* padding: 10px; */ }

.singleelement .dotshape { /* max-width: 50px; */ text-align: right; }
.singleelement .dot-shape { width: 39px; height: 39px; position: absolute; top: 35px; left: 40px; }
.singleelement .dot-shape i {
  height: 9px;
  width: 9px;
  background-color: #000;
  position: absolute;
  top: 0;
  left: 0;
}
.singleelement .dot-shape i:nth-child(2) {
  background-color: #09a223 !important;
  left: 15px;
}
.singleelement .dot-shape i:nth-child(3) {
  left: 30px;
}
.singleelement .dot-shape i:nth-child(4) {
  top: 15px;
  left: 14px;
}
.singleelement .dot-shape i:nth-child(5) {
  top: 15px;
  left: 30px;
}
.singleelement .dot-shape i:nth-child(6) {
  background-color: #09a223 !important;
  top: 29px;
  left: 30px;
}

.singleelement .dataimage { width: 100%; height: auto; }
.singleelement .dataimage.imageorig { width: auto; max-width: 100%; max-height: 100%; }


.singleelement .extragap2 .readmore { display: none; visibility: hidden }

.singleelement .extragap2 .readmore a {

  position: absolute; bottom: -15px;
  width: 50%;  text-align: center;
  background-color: #09a223;
  height: 40px;
  font-size: 14px; line-height: 40px;
  color: #fff;
  font-weight: 500;
  border-radius: 4px;
  left: 0;
  right: 0;
  margin: auto;

}


.wow:hover .extragap2 .readmore {
   display: block ;visibility: visible; animation-name: fadeIn; animation-duration: 0.5s;

}

.wow .imagegap, .wow .imagegap0 { overflow: hidden;  }

.wow .imagegap IMG, .wow .imagegap0 IMG {
   transition: all 0.2s ease-out;
    -webkit-transform: scale(1);
     -khtml-transform: scale(1);
     -moz-transform: scale(1);
     -ms-transform: scale(1);
     -o-transform: scale(1);
     transform: scale(1);

}
.wow .imagegap:hover IMG , .wow .imagegap0:hover IMG {
   transition: all 0.2s ease-in;
    -webkit-transform: scale(1);
     -khtml-transform: scale(1);
     -moz-transform: scale(1);
     -ms-transform: scale(1);
     -o-transform: scale(1);
     transform: scale(1);

}

.wow .imagegap.scale:hover IMG , .wow .imagegap0.scale:hover IMG {
   transition: all 0.2s ease-in;
    -webkit-transform: scale(1.15);
     -khtml-transform: scale(1.15);
     -moz-transform: scale(1.15);
     -ms-transform: scale(1.15);
     -o-transform: scale(1.15);
     transform: scale(1.15);

}

#pageelements .singleelement .title, #pageelements .singleelement .subtitle, #pageelements .singleelement .description { display:block;  }
footer .singleelement .title, foooter .singleelement .subtitle, footer .singleelement .description { display:block;  }
#pageelements .singleelement .description.small { font-size: 12px; color: #666; margin-top: 4px; margin-bottom: 4px; } .elementtool { display:none; }
footer .singleelement .description.small { font-size: 12px; color: #666; margin-top: 4px; margin-bottom: 4px; } .elementtool { display:none; }

.title48.dark, .title48 A { color: #0e0e0e; } .title48 A:hover { color: #89c709; }
.title20.green, .title20.green A { color: #4caf50; } .title20.green A:hover { color: #89c709; }

IMG .spointer { cursor: pointer; }

#pageelements ol, footer ol { list-style:none; margin:0; padding:0; }
#pageelements li, footer li { padding:0; margin:0; }

.imagewrapper { margin-bottom: 10px; }
.imagewrapper .imagegap0 { position:relative; }
.imgoverlay { width: 65%; background: #fff; position:relative; bottom:0px; margin-top: -30px; margin-left: auto; margin-right: auto; text-align: center;
   -webkit-border-radius: 10px 10px 10px 10px;
   -khtml-border-radius: 10px 10px 10px 10px;
   -moz-border-radius: 10px 10px 10px 10px;
   -ms-border-radius: 10px 10px 10px 10px;
   -o-border-radius: 10px 10px 10px 10px;
   border-radius: 10px 10px 10px 10px;
   } .imgoverlay:hover { background: #fff; }

.imgoverlaytext { color: #222; padding:5px; font-size: 18px; font-weight: bold; }


.pagelinkicon { position: absolute; padding-left: 10px; margin-top: -24px; width: 30px; font-size: 16px; line-height: 20px; color: #09a223 }
.pagelink { padding-left:35px; font-weight: bold; font-size: 16px; line-height: 18px; color: #222; }
.pagelink A { color: #222; } .pagelink A:hover { color: #09a223; }


#pageelements .singlemicroelement .description.datatablecell { display: table-cell; }
footer .singlemicroelement .description.datatablecell { display: table-cell; }

.cell30 { width: 34px; text-align: center; font-size:16px; line-height: 24px; color: #09a223; vertical-align: top; }
.cell { text-align: left; color: #000; vertical-align: top; line-height: 30px; }
.cell30.light { width: 34px; text-align: center; font-size:14px; line-height: 24px; color: #09a223; vertical-align: top; }
.description.bold { font-weight: bold; }



.singlemicroelement .nav-tabs.green { margin-bottom: 0px; }
.singlemicroelement .tab-pane { border: 0px;}
.singlemicroelement .nav.green .nav-link { background-color: #ebf1f1; border: 1px solid #e4e4e4; color: #000; margin-right: 5px; font-size: 17px; line-height:30px; align-items: center; padding: 10px 30px; }
.singlemicroelement .nav.green .nav-link i { font-size:20px; margin-right: 10px; }
.singlemicroelement .nav.green .nav-link.active { background-color: #09a223; border: 1px solid #09a223; color: #fff; }

.singlemicroelement ul.nav-tabs.green li.nav-item:first-child a.nav-link {

   -webkit-border-radius: 3px 0 0 3px;
   -khtml-border-radius: 3px 0 0 3px;
   -moz-border-radius: 3px 0 0 3px;
   -ms-border-radius: 3px 0 0 3px;
   -o-border-radius: 3px 0 0 3px;
   border-radius: 3px 0 0 3px;

 }

 .singlemicroelement ul.nav-tabs.green li.nav-item:last-child a.nav-link {

    -webkit-border-radius: 0 3px 3px 0;
    -khtml-border-radius: 0 3px 3px 0;
    -moz-border-radius: 0 3px 3px 0;
    -ms-border-radius: 0 3px 3px 0;
    -o-border-radius: 0 3px 3px 0;
    border-radius: 0 3px 3px 0;

  }

  .shadowbottom {
  	-webkit-box-shadow: 0 8px 6px -6px #bbb;
  	   -moz-box-shadow: 0 8px 6px -6px #bbb;
  	        box-shadow: 0 8px 6px -6px #bbb;
  }

  .bottomcorner {

     -webkit-border-radius: 0 30px 30px 0;
     -khtml-border-radius: 0 3px 3px 0;
     -moz-border-radius: 0 3px 3px 0;
     -ms-border-radius: 0 3px 3px 0;
     -o-border-radius: 0 3px 3px 0;
     border-radius: 0 0 20px 20px;


 }



.greybox {
   display:block; min-height: 100px; border: 1px solid #ccc; background: #ddd;
   -webkit-border-radius: 20px 0px 20px 0;
   -khtml-border-radius: 20px 0px 20px 0;
   -moz-border-radius: 20px 0px 20px 0;
   -ms-border-radius: 20px 0px 20px 0;
   -o-border-radius: 20px 0px 20px 0;
   border-radius: 20px 0px 20px 0;
}
.greybox .microcontainer { margin: 20px; }

.datatable tr td { vertical-align: top; }

footer { padding: 30px; background-image: url(/media/ccd7c4db-a2e7-40e2-83ed-03dbc549de0d.jpg); background-repeat: no-repeat; background-size: cover; background-position: bottom center; border-top: 1px solid #aaa; /* border-bottom: 60px solid #333; */ }
footer .singleelement, footer .singleelement.elementwhite { max-width: 1140px; margin:30px auto;  }



.sidebutton { width: 100%; display: block; vertical-align: middle; text-align: center; background: #f2f2f2; margin-bottom: 5px; cursor: pointer;

   -webkit-border-radius: 20px 0px 20px 0;
   -khtml-border-radius: 20px 0px 20px 0;
   -moz-border-radius: 20px 0px 20px 0;
   -ms-border-radius: 20px 0px 20px 0;
   -o-border-radius: 20px 0px 20px 0;
   border-radius: 20px 0px 0px 20px;
}
.sidebutton i { font-size: 30px; line-height: 70px; color: #959595; } .sidebutton i:hover { color: #09a223; }

.history_container { position: relative; display:block; padding-top: 40px;}

.history_container ol.history li.history_item .oddeven .history_data h3 { font-size: 20px; line-height: 26px; font-family: 'Poppins', sans-serif; font-weight: 700;  }
.history_container ol.history li.history_item .oddeven .history_data span { font-size: 14px; line-height: 14px; font-family: 'Poppins', sans-serif;  }

ol.history { list-style: none; padding: 0px; margin: 0px;   }
ol.history:before { content: ''; height: 100%; width: 50%; left: 0; bottom: 0; position: absolute; border-right: 1px dashed #09a223; z-index: 0; }

ol.history li.history_item { min-height: 80px; }
ol.history li.history_item .oddeven { position: relative; width: 95%; margin: 0 auto; margin-top: -30px; padding: 0px; }
ol.history li.history_item .oddeven:before { content: ''; width: 20px; height: 20px; top: 5px; left:50%; margin-left: -10px; position: absolute; background: #09a223; -webkit-border-radius: 20px; -khtml-border-radius: 20px; -moz-border-radius: 20px; -ms-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; z-index: 1; }

ol.history li.history_item .oddeven .history_data { position: relative; width: 50%; left: 50%; padding-left: 12%; padding-right:0%; text-align:left;   }
ol.history li.history_item .oddeven .history_data .elementtool {  right: 0;   }
ol.history li.history_item .oddeven .history_data:before { content: ''; position: absolute; width: 20%; left:0; top: 15px; border-top: 1px dashed #09a223; z-index: 1; }

ol.history li.history_item:nth-child(even) .oddeven .history_data { position: relative; width: 50%; left: 0; padding-left: 0%; padding-right: 12%; text-align:right;  }
ol.history li.history_item:nth-child(even) .oddeven .history_data .elementtool { right: 100%;   }
ol.history li.history_item:nth-child(even) .oddeven .history_data:before { content: ''; position: absolute; left:100%; margin-left: -20%; width: 20%;  right: 0; top: 15px; border-top: 1px dashed #09a223; z-index: 1; }

.datatext a, .datatextarea a { color: #222; }
.datatext a:hover, .datatextarea a:hover { color: #09a223; }
.datatext.subtitle a, .datatextarea.subtitle a { color: #09a223; }

.imgoverlay a { display: block; color: #222; }
.imgoverlay a:hover { display: block; color: #09a223; }

.rotate90 { transform: rotate(180deg); writing-mode: vertical-lr; text-transform: uppercase; font-size: 34px; font-weight: bold; color: #fff; font-family: 'Poppins', sans-serif;
   /* text-shadow: 3px 0px 7px rgba(0,0,0,0.41); */ padding: 5px; padding-top: 85px; padding-bottom: 30px; vertical-align: top; margin: 10px !important;

   background: #ffffff; /* Old browsers */
   background: -moz-linear-gradient(top,  #ffffff 8%, #78ac2d 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top,  #ffffff 8%,#78ac2d 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom,  #ffffff 8%,#78ac2d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#78ac2d',GradientType=0 ); /* IE6-9 */


}

.rotate90 a { color: #fff;  }
.rotate90 a:hover { color: #fff; }
.rotate90:hover {
   background: -moz-linear-gradient(top,  #ffffff 8%, #09a223 100%); /* FF3.6-15 */
   background: -webkit-linear-gradient(top,  #ffffff 8%,#09a223 100%); /* Chrome10-25,Safari5.1-6 */
   background: linear-gradient(to bottom,  #ffffff 8%,#09a223 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#09a223',GradientType=0 ); /* IE6-9 */
}

/* SUCHE NACH ARTIKELN */

.search {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.search-content {
  background-color: #fefefe;
  margin: 15% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.searchclose {
  color: #aaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.searchclose:hover,
.searchclose:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

#pageelements .fluid { margin-left: auto; margin-right: auto; }
#pageelements .fluid .row { max-width: 1200px; margin-left: auto; margin-right: auto; }
#pageelements .fluid.dark { background: #eee; }

.plblock { margin-left: auto; margin-right: auto; }
.plblock .row { max-width: 1200px; margin-left: auto; margin-right: auto; }

.plblock.dark { background: #eee; }
.plblock.black { background: #222; }

.nobackground {  max-height: 460px; overflow: hidden; }

/* #pageelements .singleelement:last-child { padding-bottom: 0px; margin-bottom: 0px; } */

video { width: 100%; height: auto; }
