body {
  position: relative;
  margin: 0;
  font-size: 18px;
  line-height: normal;
  font-family: "OpenSans", sans-serif;
  color: #333;
  /*background: #f6f6f6;*/
}

p.intro { padding: 1em 0 0 1em; }

/*size limit*/
.infograph { max-width: 1760px; } 

.infograph ul.items {
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
  
  justify-content: center;
}

.infograph ul.items li.item {
  list-style: none;
  flex: 0 0 24%;
  
  /*max-width:300px;*/
  /*border: 1px solid green;*/
  
  margin: 2%;
  /* overflow: hidden; */
  min-width: 300px;
  
}
.container {
    padding:0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 1px 1px rgba(97, 108, 121, 0.1), 0 4px 9px 0 rgba(97, 108, 121, 0.3);
}
img {
    width: 100%;
    /*max-width: 100%;*/
    /*border: 1px solid #efefef;*/
}

.imgholder {
    position: relative;
}
.infoicon {
    width: 40px;
    height: 40px;
    position: absolute;
    left:0;
    bottom:0;
    cursor: pointer;
	border-top: 1px solid white;
	border-right: 1px solid white;
}
.infoicon:hover {
	filter: brightness(120%);
}

.infotext {
    background: #efefef;
}

.infotext p {
    padding: 1em;
    /*font-size: 1.2em;*/
    margin-bottom: 0!important;
}
.infotext ul {
	padding-bottom: 1em;
}
.infotext ul li {
	padding: 0.2em 1em;
}

.col5 li { flex-basis: 16% !important; }
.col4 li { flex-basis: 20% !important; }
.col3 li { flex-basis: 28% !important; }
.col2 li { flex-basis: 46% !important; }
.col1 li{ flex-basis: 100% !important; }

/*DARK*/
body.dark-theme {
	color: #fff !important;
    background: #151515;
}
body.dark-theme .infotext {
    background: #292929;
}
body.dyslexic-font *{
  font-family: "OmoType";
}

/*ikona*/
.infoicon {
	background-size: contain;
	background-repeat: no-repeat;
	background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg id='infoicon' data-name='infoicon' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 385.38 385.38'%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; %7D .cls-2 %7B fill: %232a9cff; %7D %3C/style%3E%3C/defs%3E%3Crect class='cls-2' width='385.38' height='385.38' /%3E%3Crect class='cls-1' x='172.81' y='170.29' width='44' height='118'/%3E%3Ccircle class='cls-1' cx='194.11' cy='109.5' r='30.34'/%3E%3C/svg%3E");
}