root { 
    display: block;
}

body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.9em;
    overflow-y: scroll;
}

a {
    color: #0142bc;
}

hr {
    border: 2px solid #555;
}

h1 {
    font-size:1.2em;
}

#seitenbereich {
  margin: 0 auto;    /* Zentrierung mitte */
  width: 1000px;
  background-color: #eee;
  border: 1px solid #fff;
}

#navi {
  border: 1px solid #abc;
  background-color: #def;
}

#inhalte {
  margin: 1em 1em 1em 1em;
}


.flex-container {
  display: flex;
  flex-direction: row;
  margin: 8px 2px 0 12px;
}

.flex-container > div {
  background-color: #d4d4d4;
  width: 220px;
  padding: 4px;
  text-align: left;
}

div.studentVal {
    margin: 0 0 0 18px;
}

div.progress {
    border: 1px solid #469;
    height: 15px;
    overflow: hidden;
    background-color: #f8f8ff;
}

div.progress div.bar1a {
    float: left;
    background-color: #072;
    height: 100%;
    border-right: 1px solid #469;
}

    div.progress div.bar1b {
    float: left;
    background-color: #072;
    height: 100%;
    border-right: 3px solid #000;
}

    div.progress div.bar2 {
    float: left;
    background-color: #f00;
    height: 100%;
    border-right: 3px solid #000;
}

    div.progress div.bar3 {
    float: left;
    background-color: #0f0;
    height: 100%;
    border-right: 1px solid #469;
}

div.formElementFrame { 
    margin:0.5em;
    margin-top:0.8em;
    display: table;
    border-collapse:collapse;
    border: 1px solid #88a;

}
div.row { 
    display:table-row; 
}
div.cell1, div.cell2 { 
    width: 15em;
    display:table-cell;
    padding:0.5em;
    background-color: #d5d5d5;
}
div.cell2 { 
    background-color: #e5e5e5;
}