body {
  counter-reset: block;
}

h2.nummer::before {
  counter-increment: block;
  content: "Block-Nr.: " counter(block) ": ";
}

.infobox{margin-bottom: 1em;}
.allgbox {margin: 0 auto;}

@media screen and (min-width:1501px) {
.infobox {padding: 2em;}
}
@media screen and (max-width:1500px) {
.infobox {padding: 2vw;}
}


@media screen and (max-width:1320px) {
.allgbox.breite1300 {margin: 0 -3%;}
}
@media screen and (max-width:1220px) {
.allgbox.breite1200 {margin: 0 -3%;}
}
@media screen and (max-width:1020px) {
.allgbox.breite1000 {margin: 0 -3%;}
}
@media screen and (max-width:920px) {
.allgbox.breite900 {margin: 0 -3%;}
}
@media screen and (max-width:820px) {
.allgbox.breite800 {margin: 0 -3%;}
}
@media screen and (max-width:720px) {
.allgbox.breite700 {margin: 0 -3%;}
}


.infoboxinner{height:100%;}

.infoboxinner .weiter {margin:auto;align-self: flex-end;margin-top:auto;margin-bottom:1em;}
.infoboxinner .weiter p{text-align:center;margin: 1.5em auto .6em auto;font-size:.75em;}
.infoboxinner .weiter p a{
    background: #349694;
    padding: 1em;
    border: 1px solid #308c8a;
    text-decoration: none;
    display: inline-block;
    margin-bottom: 1em;
    color: #fff;}
.infoboxinner .weiter p a:hover{
    padding: 1em;
    border: 1px solid #ffa547;
    text-decoration: none;
    background: #ffb25a;
    box-shadow: inset 0 -1em 4em #ff7900;
    color: #fff;}

.galerie {
    text-align: center;
    margin: 0 auto 3 auto;
}
h3.htg-schwarzh3 {
    background: #555;
    background: rgba(47,47,47,.8);
    position: absolute;
    bottom: 4px;
    left: 4px;
    right: 4px;
    color: #fff;
    display: block;
    padding: .5em .2em;}





.verweise .infoboxinner {position: relative;}



.infobox img {
    width: 100%;
    height: auto;
}
.ohne_schatten .infoboxtxt {
    padding: 1em 0 0 0;
}
.mit_schatten .infoboxtxt {
    padding: 1em;
}
.infobox .infoboxinner {
    position: relative;
    display: flex;
    flex-direction: column;
    background: rgb(255 255 255 / 79%);
    color: #000;
}
    
.infobox .infoboxinner.mit_schatten{box-shadow:0 0 1em rgb(0 0 0 / 18%);border: 1px solid #fff;}



@media screen and (min-width:1501px) {
.infobox .infoboxinner.mit_rahmen{padding:10px;border:1px solid #fff;}
}
@media screen and (max-width:1500px) {
.infobox .infoboxinner.mit_rahmen{padding:4px;padding: 0.7vw;border:1px solid #fff;}
}
.infobox .infoboxinner.mit_rahmen{background: rgb(255 255 255 / 53%);}
 
 
 

.infobox h3{line-height: 1.3em;margin:0;font-size: 1.2em;text-align:center;padding:.7em .4em .5em .4em;text-align: center;font-family:'Roboto Condensed',helvetica,arial,sans-serif;}

.infobox .infoboxtxt h3,.infobox .infoboxtxt h3{line-height: 1.3em;margin: .5em auto;}
.infobox .infoboxtxt h3{font-weight:400;}
.infobox .infoboxtxt p{line-height: 1.4em;margin:0 auto .5em auto;}
.infobox a:hover{text-decoration:none;}

.bgrcontent .infoboxtxt p.weiter {
    text-align: center;
    margin: 1em auto;
    vertical-align: bottom;
}


 /*
.ibox.boxli{float:left;margin-right: 4%;}
.ibox.boxre{float:right;margin-left: 4%;}
.ibox.boxmi{margin-right:auto;margin-left:auto;}




.verweise .ibox.fuenftel,
.verweise .ibox.viertel,
.verweise .ibox.drittel
   { position:relative;
    display:inline-block;
    box-sizing: border-box;vertical-align: top;
    }
 */
.infoboxen,.verweise,.galerie {margin-bottom:2em;}


/* ====================================  */
.infoboxen .infobox{
    position:relative;
    display:inline-block;
    display:-ms-flexbox;display:flex;
    box-sizing: border-box;
    }


@media screen and (min-width:1101px) {
.infobox.fuenftel{width:20%;height:auto;}
}
@media screen and (max-width:1100px) {
.infobox.fuenftel{width:33%;height:auto;}
}

@media screen and (min-width:901px) {
.infobox.viertel{width:25%;height:auto;}
}
@media screen and (max-width:900px) {
.infobox.viertel{width:50%;height:auto;}
}
@media screen and (min-width:651px) {
.infobox.drittel{width:33.3333%;height:auto;}
}
@media screen and (min-width:401px) and (max-width:650px) {
.infobox.drittel,.infobox.fuenftel{width:50%;height:auto;}
}

@media screen and (min-width:501px) {
.infobox.halb{width:50%;height:auto;}
}
@media screen and (max-width:500px) {
.infobox.halb{width:100%;height:auto;}
}
@media screen and (min-width:311px){
.infoboxen,.iconboxen{display:inline-block;display: -ms-flex;display: -webkit-flex;display: flex;flex-wrap: wrap;}
}

@media screen and (max-width:400px) {
.infobox.fuenftel{width:50%;height:auto;}
.infobox.drittel {
    max-width: 370px;
    height: auto;
    margin: 0 auto 1em auto;
}
}


@media screen and (min-width:311px) and (max-width:450px) {
.infobox.fuenftel{width:50%;height:auto;}
}

@media screen and (max-width:310px) {
.infobox.halb,.infobox.drittel,.infobox.viertel,.infobox.fuenftel{display:block;width:100%;height:auto;}
}

.infobox p.weiter a {
    padding: 1em;
    display: block;
    border: 1px solid #b1d2d1;
    background: #fff;color:#238b8b;
}
.infobox p.weiter a:hover,.infobox p.weiter a:active {
    border: 1px solid #238b8b;
    background: #238b8b;
    color: #fff;
}

/*
@media screen and (min-width:801px) and (max-width:1100px) {
.ibox {width: 30%;margin: 1.5em 3% 1.5em 0;}
.ibox:nth-child(3n+1){clear:both;}
}
@media screen and (min-width:601px) and (max-width:800px) {
.ibox {width:47%;margin: 1.5em 1.5%;}
.ibox:nth-child(2n+1){clear:both;}
}
@media screen and (min-width:601px) {
.ibox{float:left;}
}

@media screen and (max-width:450px) {
.ibox {width:100%;margin:0 0 1.5em 0;}
}
*/
@media screen and (min-width:451px) {
.gal{padding:.1em 1.5em;}
}



/* --------------------- iconboxen  -------------------*/
.imgpart.icon100 {
    max-width: 100px;
    height: auto;
    margin: 0 auto;
}













