/*  Lehre  */

.inactive {
    opacity: 0.1;  
}
div#infografik, 
div#infrastruktur {
    font-size: 80%;
    max-width: 900px;
	margin: 0 auto;
}
div#infrastruktur {
  margin-bottom:60px;
}
div#infografik a, 
div#infrastruktur a {
    color: #000;
    text-decoration: none;
}
div#infografik a:hover, 
div#infrastruktur a:hover, 
div#infografik a:focus, 
div#infrastruktur a:focus {
    color: #27827f;
    text-decoration: underline;
}
div#infografik, 
div#infrastruktur_cols {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;  
}
div#infografik img, 
div#infrastruktur img {
    width: 100%;
}
div#infografik .column {
    max-width: 150px;
    flex: 1 0 auto;
}
div#infografik .column.sp3 {
    max-width: 300px;
}
div#infografik .column.sp3 .textcol {
    max-width: 140px;
    float: left;
}
div#infografik .column .textcol {
    padding-right: 10px;
}
div#infografik .column .kasten {
    margin-right: 10px;
    background-color: #c9e4eb;
    padding: 10px;
    font-size: 12px;
    font-weight: bold;
    height: 75px;
    display: table-cell;
    vertical-align: middle;
    max-width: 120px;
    text-align: center;
}
div#infografik .column.sp3 .kasten {
    max-width: 270px;
    width: 270px;
}
div#infografik .column.sp2 .kasten {
    background-color: #a6d9e3;
}
div#infografik .column.sp3 .kasten {
    background-color: #7fcbd9;
}
div#infografik .column.sp4 .kasten {
    background-color: #49bdcf;
}
div#infografik .column.sp5 .kasten {
    background-color: #2aa3bd;
}
div#infrastruktur .heading {
    font-size: 16px;
    font-weight: bold;
    text-align: center;  
    padding: 10px;
}
div#infrastruktur_cols {
    background-color: #c7e6ed;
}
div#infrastruktur_cols .column {
    max-width: 215px;
    flex: 1 0 auto;  
    margin-right: 10px;
}