/* INFOBOX */
.infobox-container{
  display: flex;
  flex-direction: row;
   flex-wrap: wrap;
  gap: 9px;  
  width: 100%;
  font-family: Arial;
}
.infobox-item {
  font-size: .75rem; /* var(--ut-region-font-size, .875rem); */
  display: flex;
  min-height: 80px;
  min-width: 150px; /*old:250px*/
  border: 1px solid #cfcfcf;
  border-top: 3px solid #5998dc;
  -webkit-box-shadow: 2px 2px 7px 0px rgba(0,0,0,0.6); 
  box-shadow: 2px 2px 7px 0px rgba(0,0,0,0.6);
}
.infobox-avatar{
  display:flex;
  align-items: center;
  justify-content: center;
  padding: 0px 9px;
  background: #5998dc;
  color: #fff;
  font-size: 110%;
}
.infobox-body{
  padding: 4px 4px;
  background: #d0e7ff;
  width: 100%;
}
.infobox-row{
  display: flex;
  align-items: baseline;

}
.infobox-label{
  font-weight: bold;
  font-size: 85%;
  width: 90px;
  margin-right: 3px;
  text-transform: uppercase;
}
.infobox-label-md{
    width: 110px !important;
}

.infobox-label-lg {
    width: 130px !important;
}

.infobox-value{
  font-size: 100%;
  width: 120px; /*impongo di andare a capo*/
  margin-right: 3px;
}

.infobox-value-xs{
    width: 70px !important;
}

.infobox-value-sm{
    width: 90px !important;
}
.infobox-value-md{
    width: 140px !important;
}

.infobox-value-lg{
    width: 160px !important;
}

.infobox-onerow{
    width:auto;
    white-space: nowrap;
    min-width: 120px;   /*il minimo, ma permette poi di sforare*/
}

.infobox-onerow-dotted{
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}