.DepartmentComponent {
  padding: 0 0 0; // no extra padding -> padding is calculated in the child comp
  margin: 0; // see above
  overflow: hidden; // overflow hidden => all "to big" child components are hidden
  display: grid; // we define a grid
  width: 100%; // 100 % view width (hardware screen)
  height: 100%; // 100% view height
  grid-template-rows: minmax(0, 1fr) auto; // row relationships
  grid-template-columns: minmax(0, 1fr); // column relationship
  grid-template-areas: 'list''details';
  grid-column-gap: 5px;
  grid-row-gap: 5px;
}

.DepartmentListComponent {
  grid-area: list;
}

.DepartmentDetailsComponent {
  grid-area: details;
  z-index: 10;
}