div.kachel.active i.fas.fa-circle {
    color: #54b848;
margin-left: 5px;
	display:inline-block!important;
    font-size: xx-small;
}

div.kachel {
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-clip: padding-box;
  position: relative;
  overflow: hidden;
  border-style: solid;
    border-width: 10px;
  border-color: transparent;
}

div.kachel, div.kachel:hover {
    transition: box-shadow .2s,box-shadow .2s;
}
div.kachel:hover, div.kachel:active{
background-origin: border-box;  
}

div.kachel>h2{
	font-size: 25px;
    position: absolute;
    bottom: 0;
    left:0;
    color: white;
    text-align: center;
    min-width: max-content;
    padding: 3px 8px;
    margin-bottom: 0;
    box-shadow: none;
    background-color: #005daa;
}

div.imgAndText{
   background-image: -webkit-linear-gradient(top, #ccc, #fff);
}
div.imgAndText img{
  height:100px;
}
div.imgAndText p{
	display:none;
}

.kachel.quad::before {
    content: "";
    display: block;
    padding-top: 100%;
}

div.kachel.noQuad{
	height: 15rem;
}

.kachel.-large.quad {
  height: 210px;
    max-height: 550px;
}
.kachel.-small.quad {
    height:210px;
    max-height: 275px;
}

div.kachel i.fas.fa-circle{
	display:none !important;
}



@media (min-width: 768px){
  	div.kachel.-large.noQuad{
  		height: 25rem;
	}
	div.kachel.-small.noQuad{
    	height: 20rem;
	}

  .kachel.-large.quad{
    height: 35rem;
  }
  div.kachel.-small.quad{
      height: 25rem;
  }


  	div.imgAndText p{
      	display:block;
      	position: absolute;
      	left: 15px;
      	right: 15px;
      	max-height:35%;
      	bottom: 0;
      	color: white;
      	word-break: break-all;
  }
}

@media (min-width: 992px){
  div.kachel.-large.noQuad{
  height: 48rem;
	}
	div.kachel.-small.noQuad{
    	height: 24rem;
	}

  div.kachel.-large.quad{
    height: 500px;
  }
    div.kachel.-small.quad{
      height: 250px;
  }
}