.ui.modal > .header {
  text-align: center;
  background-color: #214F6D;
  color: #fff;
}

.registration-popup-content {
  width: 100%;
  padding: 1.5rem 5%;
  line-height: 1.4;
  background-color: #5782A0;
  display: flex;
  overflow: initial;
  flex-direction: column;
  justify-content: space-between;
}

.ui.modal > .actions {
  background-color: whitesmoke;
}

.top-controls {
  height: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.selected-employees-list {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.list-item {
  margin-bottom: .5em;
}

.large-control {
  width: 20em;
}

.control {
  width: 10em;
}

.controls-table tr td,
.registration-for-employees {
  padding: .5em 1em;
}

.controls-table > tr {
  height: 4em;
}

.button-extend,
.controls-table tr td .ui.selection.dropdown,
.controls-table tr td > .dropdown-control {
    border: #C4E3D5 2px solid;
    border-radius: .5em;
    padding: .55em 1em;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

button.button-extend:focus,
button.button-extend>i.icon:hover,
.controls-table tr td>.dropdown-control:focus,
.border.focused,
.controls-table tr td .ui.selection.dropdown.border.focused,
.ui.input > input:focus,
.controls-table tr td > .dropdown-control:focus,
.controls-table tr td .ui.selection.dropdown:focus {
  border-color: #ffdf05;
}

.registration-popup-content .registration-for-employees input[type="button"] {
  margin-top: .5em;
}

.bottom-controls {
  display: flex;
  align-items: center;
  padding-right: 2em;
  margin-left: 1em;
  margin-top: .5em;
}

.bottom-controls > div.ui.input {
  width: 100%;
}

.bottom-controls input.description {
  margin-left: 1.3em;
}

.ui.modal.new-registration {
  bottom: auto;
  overflow: initial;
}

.extra-width {
  width: 100%;
}

.button-extend {
  margin-left: 0.3em;
  background: none;
  border: none;
  padding: 0.5em;
}