@import url(https://fonts.googleapis.com/css?family=IBM+Plex+Sans);
.link-button {
  background: #A3A3A3;
  color: #FFFFFF;
  display: inline-block;
  line-height: 16px;
  white-space: nowrap;
  padding: 10px;
  vertical-align: baseline;
}
.link-button .icon {
  margin-right: 5px;
}
.link-button:hover {
  background: #CBCBCB;
}
.link-button.active {
  background: #6F6F6F;
}
.post-button {
  display: inline-block;
}
input[type=submit],
input[type=button] {
  background: #A3A3A3;
  color: #FFFFFF;
  border: 0 none;
  padding: 10px;
}
input[type=submit]:hover,
input[type=button]:hover {
  background: #CBCBCB;
  cursor: pointer;
}
input[type=text],
input[type=search],
input[type=email],
input[type=number],
input[type=password],
input[type=date],
input[type=tel],
input[type=numeric],
textarea,
select {
  background: #FFFFFF;
  color: #333333;
  padding: 5px;
  border: 1px solid #333333;
  outline: none;
  width: 200px;
  box-sizing: border-box;
}
input[type=text]:focus,
input[type=search]:focus,
input[type=email]:focus,
input[type=number]:focus,
input[type=password]:focus,
input[type=date]:focus,
input[type=tel]:focus,
input[type=numeric]:focus,
textarea:focus,
select:focus {
  outline: solid 1px #5C9AE6;
}
.data-table {
  border-spacing: 0px;
  border-collapse: collapse;
  margin: 20px 0px;
}
.data-table tr td {
  margin: 0px;
  padding: 5px;
  border: 1px solid #A3A3A3;
}
.data-table tr td .icon {
  margin-right: 5px;
}
.data-table thead {
  color: #FFFFFF;
  background: #009B3A;
  font-weight: normal;
}
.data-table thead tr th {
  margin: 0px;
  padding: 5px 10px;
}
.data-table tbody tr:nth-child(even) {
  background: #EFEFEF;
}
.data-table tbody tr:nth-child(odd) {
  background: #FFFFFF;
}
.data-table tbody tr.row-red {
  background: #CC525C;
  color: #FFFFFF;
}
.data-table tbody tr.row-red a {
  color: #CBCBCB;
}
.data-table tbody tr.row-green {
  background: #009B3A;
  color: #FFFFFF;
}
.data-table tbody tr.row-green a {
  color: #CBCBCB;
}
.data-table tbody tr.row-blue-light {
  background: #5C9AE6;
  color: #FFFFFF;
}
.data-table tbody tr.row-blue-light a {
  color: #CBCBCB;
}
.data-table tbody tr td.td-control {
  padding: 0px;
  background: #6F6F6F;
  border: none;
}
.data-table tbody tr td.td-control .link-button {
  background: #6F6F6F;
  color: #FFFFFF;
}
.data-table tbody tr td.td-control .link-button:hover {
  background: #A3A3A3;
}
.data-table tbody tr td .input-cell {
  margin: -4px;
  border: none;
  background: transparent;
}
.data-table tbody tr td.multi-row-td {
  padding: 0;
}
.data-table tbody tr td.multi-row-td > :first-child {
  border-bottom: 1px solid #A3A3A3;
}
.data-table tbody tr td .space-between-nowrap-cell {
  display: flex;
  white-space: nowrap;
  justify-content: space-between;
  padding: 5px;
}
.data-table tbody tr td.cell-red,
.data-table tbody tr td .cell-red {
  background-color: #CC525C;
  text-decoration: none;
}
.data-table tbody tr td.cell-red a,
.data-table tbody tr td .cell-red a {
  color: #FFFFFF;
}
.data-table tbody tr td.cell-yellow,
.data-table tbody tr td .cell-yellow {
  background-color: #FFCC00;
  text-decoration: none;
}
.data-table tbody tr td.cell-yellow a,
.data-table tbody tr td .cell-yellow a {
  color: #FFFFFF;
}
.data-table tbody tr td.cell-green,
.data-table tbody tr td .cell-green {
  background-color: #009B3A;
  text-decoration: none;
}
.data-table tbody tr td.cell-green a,
.data-table tbody tr td .cell-green a {
  color: #FFFFFF;
}
.data-table tbody tr td.cell-blue-light,
.data-table tbody tr td .cell-blue-light {
  background-color: #5C9AE6;
  text-decoration: none;
}
.data-table tbody tr td.cell-blue-light a,
.data-table tbody tr td .cell-blue-light a {
  color: #FFFFFF;
}
.form-table .form-left {
  padding-top: 8px;
  vertical-align: top;
  text-align: right;
  width: 150px;
}
.form-table .form-right {
  max-width: 800px;
}
.form-table .form-label {
  font-weight: bold;
}
.form-table .form-description {
  margin: 0px;
  font-style: italic;
  font-size: 10px;
}
.form-table .form-error {
  margin: 0px;
  font-weight: bold;
  color: red;
}
header {
  margin: 0px;
}
header #top-bar {
  background: #009B3A;
  color: #FFFFFF;
}
header #top-bar .top-bar-item {
  display: inline-block;
  height: 35px;
  vertical-align: middle;
  margin: 0 0 0 10px;
}
header #top-bar .top-bar-item h1 {
  font-size: 24px;
  margin: 0;
  padding: 0;
}
header #top-bar .top-bar-item h1 span {
  font-size: 75%;
}
header #top-bar .top-bar-item * {
  height: 100%;
}
header #top-bar .user-center {
  float: right;
}
header #top-bar .link-button,
header #top-bar input[type=submit],
header #top-bar input[type=button] {
  background: #214332;
}
header #top-bar .link-button:hover,
header #top-bar input[type=submit]:hover,
header #top-bar input[type=button]:hover {
  background: #009B3A;
}
header #navigation {
  background: #EFEFEF;
  border-bottom: solid 1px #A3A3A3;
  text-align: left;
  margin: 0;
  padding: 0 20px;
}
header #navigation .link-button {
  background: transparent;
  color: #333333;
  font-weight: bold;
  padding: 12px;
  border-bottom: solid 2px transparent;
}
header #navigation .link-button:hover {
  border-bottom: solid 2px #A3A3A3;
}
header #navigation .link-button.active {
  border-bottom: solid 2px #009B3A;
}
.pagination {
  background: #6F6F6F;
  display: inline-block;
}
.pagination a,
.pagination span {
  display: inline-block;
  color: #FFFFFF;
  padding: 10px;
}
.pagination a:hover {
  background: #A3A3A3;
}
.pagination a.active {
  background: #009B3A;
}
.pagination .pagination-search {
  display: inline-block;
  height: 100%;
  margin-right: 5px;
}
.groups,
.groups_selected {
  background: #FFFFFF;
  color: #333333;
  padding: 5px;
  border: 1px solid #333333;
  outline: none;
  width: 200px;
  box-sizing: border-box;
  max-height: 200px;
  min-height: 200px;
  overflow-y: auto;
}
.groups>div:hover,
.groups_selected>div:hover {
  cursor: pointer;
  background: #5C9AE6;
}
.group_selection_wrapper {
  display: flex;
}
.file-upload {
  max-width: 40em;
}
.file-upload .upload-area {
  height: 15em;
  background-color: #c2d6c9;
  border: dashed 2px #3d5c48;
  display: flex;
  justify-content: center;
  align-items: center;
}
.file-upload .file_input {
  display: none;
}
.file-list {
  display: none;
}
.file-list .upload-file {
  border-bottom: solid 1px #DEDEDE;
  padding-bottom: 1em;
}
.file-list .upload-file .upload-link {
  color: black;
}
.file-list .upload-file .upload-link .upload-wrapper {
  display: flex;
}
.file-list .upload-file .upload-link .upload-wrapper .column-wrapper {
  width: 100%;
}
.file-list .upload-file .upload-link .upload-wrapper .column-wrapper .information-wrapper {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.file-list .upload-file .upload-link .upload-wrapper .column-wrapper .progress-bar-wrapper {
  margin-top: 1em;
}
.file-list .upload-file .upload-link .upload-wrapper .column-wrapper .progress-bar-wrapper .progress-bar {
  width: 100%;
  background-color: #DEDEDE;
  height: 4px;
}
.file-list .upload-file .upload-link .upload-wrapper .column-wrapper .progress-bar-wrapper .progress-bar .progress-status {
  background-color: #009B3A;
  height: 100%;
  width: 0;
}
.file-list .upload-file .upload-link .upload-wrapper .end-status {
  display: flex;
  align-items: center;
  margin-left: 1em;
  width: 24px;
}
.file-list .upload-file .upload-link .upload-wrapper .end-status .success {
  color: green;
}
.file-list .upload-file .upload-link .upload-wrapper .end-status .error {
  color: red;
}
.file-list .upload-file .upload-link .error-message {
  color: red;
}
.page-start ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
.page-start li.link-button {
  list-style: none;
  margin: 0.5em 0.5em;
  background-color: #6F6F6F;
  float: left;
  width: 12em;
}
.page-start li.link-button:hover {
  background-color: #A3A3A3;
}
.page-start li.link-button a {
  display: block;
  color: #FFFFFF;
  text-align: center;
  text-decoration: none;
  font-size: 16px;
}
* {
  font-family: 'IBM Plex Sans', sans-serif;
  font-size: 12px;
}
html,
body {
  margin: 0px;
  padding: 0px;
  color: #333333;
}
#page {
  margin: 0px;
}
a {
  text-decoration: none;
  color: #009B3A;
}
#content,
footer {
  margin: 20px;
}
#content .page_title,
footer .page_title {
  font-size: 32px;
  margin: 10px 0;
  border-bottom: solid 1px #EFEFEF;
}
#content h2,
footer h2 {
  font-size: 20px;
  margin: 20px 0 10px;
}
footer {
  border-top: solid 1px #EFEFEF;
}
.clear {
  clear: both;
}
.json_plain {
  width: 600px;
  height: 500px;
}
.login-error {
  padding: 5px;
  background: #CC525C;
  color: #FFFFFF;
}
.center {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
}
.box {
  border: 1px solid #A3A3A3;
  padding: 1.5em;
}
.box h1 {
  font-size: 21px;
}
.box p,
.box span {
  font-size: 16px;
}
