.filterCardContainer {
  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-column-gap: 15px;
  grid-template-rows: repeat(1, auto); // row relationships
  grid-template-columns: repeat(5, minmax(0, 1fr)) auto; // column relationship
  grid-template-areas:
    "filterDepartment . . . . filterButtons"
}

// @media screen and (max-width:1024px) {
//   .woassays {
//     font-size: 1vw;
//   }
// }

.filterDepartment {
  grid-area: filterDepartment;
}

.filterButtons {
  grid-area: filterButtons;
  margin-left: auto;
}

// .filterBtn {
//    font-size: 1vw; //scales buttons caption depended from the current view port resolution
// }

.card {
  padding: 10px;
  margin: 2px 2px 0px 2px;
}

.filterBtn {
  margin-left: 2px;
  margin-right: 2px;
  margin-right: 1px;
  margin-top: 6px;
  width: 90px;
}

// .filterButtons .filterBtn {
//   width: unset;
// }
