.config.ui.form .inline.field > label:first-child {
  width: 20rem;
}
.config.ui.form .second {
  width: 15rem !important;
  display: inline-block;
}
.config.ui.form .ui.dropdown {
  width: 15rem !important;
  display: inline-block;
}

.ui.modal.assign-items-to-dest-modal > .content {
  height: 70vh;
  overflow: hidden;
  padding: 0;
}
.ui.modal.assign-items-to-dest-modal > .content > .ui.grid {
  height: 100%;
  width: auto;
  margin: 0;
}
.ui.modal.assign-items-to-dest-modal > .content > .ui.grid > .two.wide.column {
  text-align: center;
}

assign-items-to-dest > .content {
  height: 100%;
}
assign-items-to-dest > .content > .ui.grid {
  height: 100%;
  width: auto;
}
assign-items-to-dest > .content > .ui.grid > .two.wide.column {
  text-align: center;
}

.marking-config-reason .text {
  max-width: 95% !important;
}

multi-select-list {
  display: flex;
  height: 100%;
  flex-direction: column;
}
multi-select-list .ui.bottom.attached.segment {
  flex-grow: 1;
  overflow: hidden;
  overflow-y: scroll;
}

ui-coding-panel .ui.menu {
  position: relative;
}
ui-coding-panel .ui.menu.disabled key,
ui-coding-panel .ui.menu.readonly key {
  display: none;
}
ui-coding-panel key.ui.basic.label {
  background: #FFF !important;
  border: 1px solid rgba(0, 0, 0, 0.2);
  color: rgba(0, 0, 0, 0.5) !important;
  text-transform: uppercase;
}
ui-coding-panel .item.active key.ui.label {
  visibility: visible;
}
ui-coding-panel .ui.menu.disabled .ui.header,
ui-coding-panel .ui.menu.disabled .ui.button,
ui-coding-panel .ui.menu.disabled key.ui.label {
  opacity: 0.5 !important;
}

ui-coding-score-confirmation {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none !important;
  z-index: 2000;
}
ui-coding-score-confirmation .ui.segment {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-shadow: 0px 0px 10px #000000;
}
ui-coding-score-confirmation .ui.segment.hidden {
  display: none !important;
}
ui-coding-score-confirmation .ui.circular.segment {
  min-width: 150px;
  min-height: 150px;
  box-shadow: 0px 0px 10px #000000;
}
ui-coding-score-confirmation .value {
  line-height: 6.5rem;
}

ui-coding-score.active ui-coding-score-correction .ui.message {
  background: #ffffff;
}
ui-coding-score-correction {
  padding: 0 !important;
  margin: 0 !important;
}
ui-coding-score-correction .ui.message {
  margin: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 0;
  box-shadow: none;
}
ui-coding-score-correction .list li {
  margin-left: 0 !important;
}
ui-coding-score-correction .list li::before {
  display: none !important;
}

/*******************************
         Site Settings
*******************************/
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
    Border Radius
--------------------*/
/* See Power-user section below
   for explanation of @px variables
*/
/*-------------------
    Brand Colors
--------------------*/
/*--------------
  Page Heading
---------------*/
/*--------------
   Form Input
---------------*/
/* This adjusts the default form input across all elements */
/* Input Text Color */
/* Line Height Default For Inputs in Browser (Descenders are 17px at 14px base em) */
/*-------------------
    Focused Input
--------------------*/
/* Used on inputs, textarea etc */
/* Used on dropdowns, other larger blocks */
/*-------------------
        Sizes
--------------------*/
/*
  Sizes are all expressed in terms of 14px/em (default em)
  This ensures these "ratios" remain constant despite changes in EM
*/
/*-------------------
        Page
--------------------*/
/*-------------------
      Paragraph
--------------------*/
/*-------------------
       Links
--------------------*/
/*-------------------
    Scroll Bars
--------------------*/
/* Inverted */
/*-------------------
  Highlighted Text
--------------------*/
/*-------------------
       Loader
--------------------*/
/*-------------------
        Grid
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*---  Light Colors  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Headers ---*/
/*--- Colored Text ---*/
/*--- Colored Border ---*/
/*-------------------
     Alpha Colors
--------------------*/
/*-------------------
       Accents
--------------------*/
/* Differentiating Neutrals */
/* Differentiating Layers */
/*******************************
           Power-User
*******************************/
/*-------------------
    Emotive Colors
--------------------*/
/* Positive */
/* Negative */
/* Info */
/* Warning */
/*-------------------
        Paths
--------------------*/
/* For source only. Modified in gulp for dist */
/*-------------------
       Em Sizes
--------------------*/
/*
  This rounds @size values to the closest pixel then expresses that value in (r)em.
  This ensures all size values round to exact pixels
*/
/* em */
/* rem */
/*-------------------
       Icons
--------------------*/
/* Maximum Glyph Width of Icon */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
    Derived Values
--------------------*/
/* Loaders Position Offset */
/* Rendered Scrollbar Width */
/* Maximum Single Character Glyph Width, aka Capital "W" */
/* Used to match floats with text */
/* Header Spacing */
/* Minimum Mobile Width */
/* Positive / Negative Dupes */
/* Responsive */
/*-------------------
  Exact Pixel Values
--------------------*/
/*
  These are used to specify exact pixel values in em
  for things like borders that remain constantly
  sized as emSize adjusts

  Since there are many more sizes than names for sizes,
  these are named by their original pixel values.

*/
/* Columns */
/*******************************
             States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Shadows  ---*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Focus
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Active
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
ui-coding-panel .ui.menu.readonly ui-coding-score-value,
ui-coding-panel .ui.menu.disabled ui-coding-score-value {
  pointer-events: none;
}
ui-coding-score-value {
  display: inline-block;
}
ui-coding-score-value > .ui.button {
  background: #FFFFFF;
  box-shadow: inset 0px 0px 0px 1px rgba(0, 0, 0, 0.15);
  position: relative;
  overflow: hidden;
  transition: all 0.5s;
  min-width: 2rem;
  height: 2rem;
  margin: 0.2rem;
  text-transform: uppercase;
}
ui-coding-score-value > .ui.button.disabled {
  opacity: 1 !important;
  pointer-events: none !important;
  box-shadow: inset 0px 0px 0px 1px rgba(27, 28, 29, 0.3) !important;
  color: rgba(27, 28, 29, 0.3);
}
ui-coding-score-value > .ui.button > input[type="radio"] {
  position: absolute;
  cursor: pointer;
  opacity: 0 !important;
}
ui-coding-score-value > .ui.button.initial {
  background: rgba(0, 0, 0, 0.15);
}
ui-coding-score-value > .ui.button.focused,
ui-coding-score-value > .ui.button:hover {
  color: #A333C8;
  background: #ecd3f4 !important;
  box-shadow: inset 0px 0px 0px 1px #A333C8;
}
ui-coding-score-value > .ui.button.focused.selected {
  background: #82299f !important;
  box-shadow: inset 0px 0px 0px 1px #A333C8, 0px 0px 1px 2px #ffffff;
}
ui-coding-score-value > .ui.button.selected {
  color: #FFFFFF;
  background: #A333C8 !important;
}
ui-coding-score-value > .ui.button.correct {
  color: #FFFFFF;
  background: #21BA45;
}
ui-coding-score-value > .ui.button.correct:hover {
  color: #21BA45;
  background: rgba(33, 186, 69, 0.2) !important;
  box-shadow: inset 0px 0px 0px 1px #21BA45, 0px 0px 1px 2px #ffffff;
}
ui-coding-score-value > .ui.button.correct:not(.selected):hover {
  box-shadow: inset 0px 0px 0px 1px #21BA45;
  color: #21BA45;
  background: rgba(255, 255, 255, 0.08);
}

ui-coding-score .header {
  margin-right: 2rem !important;
}
ui-coding-score key.ui.label {
  padding: 0.5rem !important;
  visibility: hidden;
}
ui-coding-score key.ui.label.top.right.attached {
  top: 0.7rem;
  border-top-right-radius: 0;
  border-top-left-radius: 4px;
  border-right: none;
}

/*!
 * # Semantic UI 0.0.8 - Calendar
 * http://github.com/semantic-org/semantic-ui/
 *
 *
 * Released under the MIT license
 * http://opensource.org/licenses/MIT
 *
 */.ui.calendar .ui.popup{max-width:none;padding:0;border:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.ui.calendar .calendar:focus{outline:0}.ui.calendar .ui.popup .ui.grid{display:block;white-space:nowrap}.ui.calendar .ui.popup .ui.grid>.column{width:auto}.ui.calendar .ui.table.minute,.ui.calendar .ui.table.month,.ui.calendar .ui.table.year{min-width:15em}.ui.calendar .ui.table.day{min-width:18em}.ui.calendar .ui.table.hour{min-width:20em}.ui.calendar .ui.table tr td,.ui.calendar .ui.table tr th{padding:.5em;white-space:nowrap}.ui.calendar .ui.table tr th{border-left:none}.ui.calendar .ui.table tr th .icon{margin:0}.ui.calendar .ui.table tr:first-child th{position:relative;padding-left:0;padding-right:0}.ui.calendar .ui.table.day tr:first-child th{border:none}.ui.calendar .ui.table.day tr:nth-child(2) th{padding-top:.2em;padding-bottom:.3em}.ui.calendar .ui.table tr td{padding-left:.1em;padding-right:.1em}.ui.calendar .ui.table tr .link{cursor:pointer}.ui.calendar .ui.table tr .prev.link{width:14.28571429%;position:absolute;left:0}.ui.calendar .ui.table tr .next.link{width:14.28571429%;position:absolute;right:0}.ui.calendar .ui.table tr .disabled{pointer-events:none;color:rgba(40,40,40,.3)}.ui.calendar .ui.table tr td.today{font-weight:700}.ui.calendar .ui.table tr td.range{background:rgba(0,0,0,.05);color:rgba(0,0,0,.95);box-shadow:none}.ui.calendar .ui.table.inverted tr td.range{background:rgba(255,255,255,.08);color:#fff;box-shadow:none}.ui.calendar .calendar.active .ui.table tbody tr td.focus,.ui.calendar .calendar.active .ui.table.inverted tbody tr td.focus,.ui.calendar .calendar:focus .ui.table tbody tr td.focus,.ui.calendar .calendar:focus .ui.table.inverted tbody tr td.focus{box-shadow:inset 0 0 0 1px #85B7D9}
.ui.calendar .ui.input.readonly .icon {
  pointer-events: none;
}
.ui.calendar .ui.input.readonly .icon.remove {
  display: none;
}
.ui.calendar .ui.icon.input > i.icon.remove {
  margin-right: 2rem;
  opacity: 0.2;
}
.ui.calendar .ui.icon.input > i.icons {
  cursor: default;
  position: absolute;
  line-height: 1;
  text-align: center;
  top: 0px;
  right: 0px;
  margin: 0em;
  height: 100%;
  width: 2.67142857em;
  opacity: 0.5;
  border-radius: 0 0.28571429rem 0.28571429rem 0;
  transition: opacity 0.3s ease;
}
.ui.calendar .ui.icon.input > i.icons > i.icon {
  margin-top: 0.8rem;
}
.ui.calendar .ui.icon.input > i.icons > i.icon.corner {
  top: 0.8rem;
  right: 0.7rem;
}
.ui.calendar .ui.icon.input > i.icons > i.icon.corner::before {
  font-size: 0.8rem !important;
}


/*******************************
         Site Settings
*******************************/
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
    Border Radius
--------------------*/
/* See Power-user section below
   for explanation of @px variables
*/
/*-------------------
    Brand Colors
--------------------*/
/*--------------
  Page Heading
---------------*/
/*--------------
   Form Input
---------------*/
/* This adjusts the default form input across all elements */
/* Input Text Color */
/* Line Height Default For Inputs in Browser (Descenders are 17px at 14px base em) */
/*-------------------
    Focused Input
--------------------*/
/* Used on inputs, textarea etc */
/* Used on dropdowns, other larger blocks */
/*-------------------
        Sizes
--------------------*/
/*
  Sizes are all expressed in terms of 14px/em (default em)
  This ensures these "ratios" remain constant despite changes in EM
*/
/*-------------------
        Page
--------------------*/
/*-------------------
      Paragraph
--------------------*/
/*-------------------
       Links
--------------------*/
/*-------------------
    Scroll Bars
--------------------*/
/* Inverted */
/*-------------------
  Highlighted Text
--------------------*/
/*-------------------
       Loader
--------------------*/
/*-------------------
        Grid
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*---  Light Colors  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Headers ---*/
/*--- Colored Text ---*/
/*--- Colored Border ---*/
/*-------------------
     Alpha Colors
--------------------*/
/*-------------------
       Accents
--------------------*/
/* Differentiating Neutrals */
/* Differentiating Layers */
/*******************************
           Power-User
*******************************/
/*-------------------
    Emotive Colors
--------------------*/
/* Positive */
/* Negative */
/* Info */
/* Warning */
/*-------------------
        Paths
--------------------*/
/* For source only. Modified in gulp for dist */
/*-------------------
       Em Sizes
--------------------*/
/*
  This rounds @size values to the closest pixel then expresses that value in (r)em.
  This ensures all size values round to exact pixels
*/
/* em */
/* rem */
/*-------------------
       Icons
--------------------*/
/* Maximum Glyph Width of Icon */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
    Derived Values
--------------------*/
/* Loaders Position Offset */
/* Rendered Scrollbar Width */
/* Maximum Single Character Glyph Width, aka Capital "W" */
/* Used to match floats with text */
/* Header Spacing */
/* Minimum Mobile Width */
/* Positive / Negative Dupes */
/* Responsive */
/*-------------------
  Exact Pixel Values
--------------------*/
/*
  These are used to specify exact pixel values in em
  for things like borders that remain constantly
  sized as emSize adjusts

  Since there are many more sizes than names for sizes,
  these are named by their original pixel values.

*/
/* Columns */
/*******************************
             States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Shadows  ---*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Focus
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Active
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*******************************
            Dropdown
*******************************/
/*-------------------
       Element
--------------------*/
/*-------------------
       Content
--------------------*/
/* Icon */
/* Current Text */
/* Menu */
/* Text */
/* Menu Item */
/* Sub Menu */
/* Menu Header */
/* Menu Divider */
/* Menu Input */
/* Menu Image */
/* Item Sub-Element */
/* Sub-Menu Dropdown Icon */
/* Description */
/* Message */
/* Floated Content */
/*-------------------
        Types
--------------------*/
/*------------
   Selection
--------------*/
/* <select> */
/* Responsive */
/* Derived */
/* 1px / em size */
/* Hover */
/* Focus */
/* Visible */
/* Visible Hover */
/*--------------
     Search
--------------*/
/* Search Selection */
/* Inline */
/*--------------
    Multiple
--------------*/
/* Split Actual Padding Between Child and Parent (allows for label spacing) */
/* Child Elements */
/* Dropdown Icon */
/* Selection Label */
/*-------------------
       States
--------------------*/
/* Hovered */
/* Default Text */
/* Loading */
/* Active Menu Item */
/* Selected */
/* Error */
/* Clearable */
/*-------------------
      Variations
--------------------*/
/* Scrolling */
/* 0px / em size */
/* Upward */
/* Flyout Direction */
/* Left */
/* Simple */
/* Floating */
/* Pointing */
/* Pointing Upward */
.ui.dropdown .remove.icon {
  float: right;
  margin-left: 0.5rem;
  opacity: 0.2;
}
.ui.dropdown.multiple .remove.icon {
  margin-top: 0.55rem;
}
.ui.dropdown.loading {
  pointer-events: none;
}
.ui.dropdown.loading .remove.icon {
  visibility: hidden;
}
.ui.dropdown .menu > .item.active {
  background: rgba(0, 0, 0, 0.03);
  color: rgba(0, 0, 0, 0.95);
}
.ui.dropdown .menu .header em::before,
.ui.dropdown .menu .header em::after {
  content: "\"";
}
.ui.upward.selection.dropdown .menu > .menu {
  border-top-width: 0 !important;
}
.ui.dropdown > .text mark {
  color: inherit;
  font-weight: inherit;
  background: inherit;
}
.ui.dropdown.readonly {
  pointer-events: none;
}
.ui.dropdown .menu {
  max-height: 25em !important;
}
.ui.dropdown .menu > .ui.input:first-child {
  width: auto !important;
}
.ui.dropdown .menu .scrolling.menu {
  max-height: 16em !important;
}
.ui.dropdown.loading > .dropdown.icon {
  top: 0.9em;
}
.ui.selection.dropdown > .text .text,
.ui.selection.dropdown .menu .item .text {
  float: none !important;
}
.ui.selection.dropdown > .text .text.no-description,
.ui.selection.dropdown .menu .item .text.no-description {
  max-width: 100%;
}

.ui.category.selection.dropdown .menu {
  overflow: visible !important;
  max-height: none;
}
.ui.category.selection.dropdown .menu .header {
  text-overflow: ellipsis;
  overflow: hidden;
  pointer-events: none;
}
.ui.category.selection.dropdown .menu > .item .menu {
  border-top-width: 1px !important;
}
.ui.category.selection.dropdown.upward .menu > .item .menu {
  border-bottom-width: 1px !important;
}
.ui.selection.dropdown > .text {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ui.selection.dropdown > .text .text,
.ui.selection.dropdown .menu .item .text {
  max-width: calc(100% - 5em);
  display: block;
  float: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ui.category.selection.dropdown .menu .item .text {
  float: none;
}
.ui.category.selection.dropdown .menu .menu {
  overflow: hidden !important;
  overflow-y: auto !important;
  max-height: 30vh;
  width: initial !important;
  max-width: 500px !important;
}
.ui.category.selection.dropdown .menu .menu > .item {
  border-top: 0;
  border-bottom: 0;
  white-space: nowrap;
  width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
}
.ui.category.selection.dropdown > .text .icon {
  margin: 0;
}
.ui.category.selection.dropdown > .menu {
  max-height: none !important;
}

.ui.report {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}
.ui.report .wrapper {
  margin-top: 1rem;
  position: relative;
  flex-grow: 1;
}
.ui.report .ui.dimmer {
  z-index: 1 !important;
}
.ui.report .ui.dimmer .ui.header {
  opacity: 0.5;
  pointer-events: none;
}
.ui.report report-data .ui.table {
  margin: 0;
}
.ui.report .pusher {
  height: 5rem;
}

.cs-report-delete-modal div.ui.checkbox > label {
  color: red;
}

dashboard .ui.grid > .sixteen.wide.column {
  min-height: 20rem;
}

td > .ui.progress:last-child {
  margin-bottom: 0;
}

.ui.table.mmd tr:nth-child(odd) td:nth-child(1),
.ui.table.mmd tr:nth-child(odd) td:nth-child(2),
.ui.table.mmd tr:nth-child(odd) td:nth-child(3),
.ui.table.mmd tr:nth-child(odd) th:nth-child(1),
.ui.table.mmd tr:nth-child(odd) th:nth-child(2),
.ui.table.mmd tr:nth-child(odd) th:nth-child(3) {
  background: #f1f1f1 !important;
  background-size: calc(100% - 5px) calc(100% - 5px) !important;
}
.ui.table.mmd tr:nth-child(even) td:nth-child(1),
.ui.table.mmd tr:nth-child(even) td:nth-child(2),
.ui.table.mmd tr:nth-child(even) td:nth-child(3) {
  background: #fafafa !important;
  background-size: calc(100% - 5px) calc(100% - 5px) !important;
}
.ui.table.mmd td.positive {
  background-color: #ddf4e4 !important;
}
.ui.table.mmd tr:hover td.positive {
  background-color: #b3eac4 !important;
}
.ui.table.mmd td.warning {
  background-color: #ffedd1 !important;
}
.ui.table.mmd tr:hover td.warning {
  background-color: #ffe9c7 !important;
}
.ui.table.mmd tr:hover td:first-child {
  border-left: 2px solid #83adca;
}
.ui.table.mmd tr:hover td {
  border-top: 2px solid #83adca;
  border-bottom: 2px solid #83adca;
}
.ui.table.mmd tr:hover td:last-child {
  border-right: 2px solid #83adca;
}

.ui.table.mmd tr:nth-child(odd) td:nth-child(1),
.ui.table.mmd tr:nth-child(odd) td:nth-child(2),
.ui.table.mmd tr:nth-child(odd) td:nth-child(3),
.ui.table.mmd tr:nth-child(odd) th:nth-child(1),
.ui.table.mmd tr:nth-child(odd) th:nth-child(2),
.ui.table.mmd tr:nth-child(odd) th:nth-child(3) {
  background: #f1f1f1 !important;
  background-size: calc(100% - 5px) calc(100% - 5px) !important;
}
.ui.table.mmd tr:nth-child(even) td:nth-child(1),
.ui.table.mmd tr:nth-child(even) td:nth-child(2),
.ui.table.mmd tr:nth-child(even) td:nth-child(3) {
  background: #fafafa !important;
  background-size: calc(100% - 5px) calc(100% - 5px) !important;
}
.ui.table.mmd td.positive {
  background-color: #ddf4e4 !important;
}
.ui.table.mmd tr:hover td.positive {
  background-color: #b3eac4 !important;
}
.ui.table.mmd td.warning {
  background-color: #ffedd1 !important;
}
.ui.table.mmd tr:hover td.warning {
  background-color: #ffe9c7 !important;
}
.ui.table.mmd tr:hover td:first-child {
  border-left: 2px solid #83adca;
}
.ui.table.mmd tr:hover td {
  border-top: 2px solid #83adca;
  border-bottom: 2px solid #83adca;
}
.ui.table.mmd tr:hover td:last-child {
  border-right: 2px solid #83adca;
}

.productivity-report {
  width: 100%;
  overflow-x: auto;
  display: block;
}
#markers_productivity tbody tr:last-child,
#teams_productivity tbody tr:last-child {
  background: #b7d1e2 !important;
}
#markers_productivity tbody tr:last-child td:first-child,
#teams_productivity tbody tr:last-child td:first-child {
  font-weight: bold;
}

.ui.table.mmd tr:nth-child(odd) td:nth-child(1),
.ui.table.mmd tr:nth-child(odd) td:nth-child(2),
.ui.table.mmd tr:nth-child(odd) td:nth-child(3),
.ui.table.mmd tr:nth-child(odd) th:nth-child(1),
.ui.table.mmd tr:nth-child(odd) th:nth-child(2),
.ui.table.mmd tr:nth-child(odd) th:nth-child(3) {
  background: #f1f1f1 !important;
  background-size: calc(100% - 5px) calc(100% - 5px) !important;
}
.ui.table.mmd tr:nth-child(even) td:nth-child(1),
.ui.table.mmd tr:nth-child(even) td:nth-child(2),
.ui.table.mmd tr:nth-child(even) td:nth-child(3) {
  background: #fafafa !important;
  background-size: calc(100% - 5px) calc(100% - 5px) !important;
}
.ui.table.mmd td.positive {
  background-color: #ddf4e4 !important;
}
.ui.table.mmd tr:hover td.positive {
  background-color: #b3eac4 !important;
}
.ui.table.mmd td.warning {
  background-color: #ffedd1 !important;
}
.ui.table.mmd tr:hover td.warning {
  background-color: #ffe9c7 !important;
}
.ui.table.mmd tr:hover td:first-child {
  border-left: 2px solid #83adca;
}
.ui.table.mmd tr:hover td {
  border-top: 2px solid #83adca;
  border-bottom: 2px solid #83adca;
}
.ui.table.mmd tr:hover td:last-child {
  border-right: 2px solid #83adca;
}

score-distribution-report-chart {
  display: block;
}
score-distribution-report .data .ui.grid {
  margin: 0;
  padding: 0;
}
score-distribution-report .data .ui.grid .column:first-child {
  padding: 0 1rem 0 0;
}
score-distribution-report .data .ui.grid .column:last-child {
  padding: 0 0 0 1rem;
}
#score_distribution_by_team_table tbody tr:last-child {
  background: #b7d1e2 !important;
}
#score_distribution_by_marker_table tbody tr:last-child {
  background: #b7d1e2 !important;
}
#score_distribution_by_marker_table tbody tr:last-child td:first-child {
  text-align: left;
}
#score_distribution_by_marker_table tbody tr:last-child td {
  text-align: right;
}
#score_distribution_grouped_by_marker_table tbody tr:last-child {
  background: #b7d1e2 !important;
}
#score_distribution_grouped_by_marker_table tbody tr:last-child td:first-child {
  text-align: left;
}
#score_distribution_grouped_by_marker_table tbody tr:last-child td {
  text-align: right;
}
.score-distribution-div.twelve.wide.column,
.score-distribution-div.sixteen.wide.column {
  width: 100%;
  overflow-x: auto;
  display: block;
}

.sfr-report .sfr_comment {
  width: 170px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sfr-report .sfr_comment:hover {
  word-wrap: break-word;
}

.sfr-result-modal .forward-btn {
  margin-right: 5px !important;
}
.sfr-result-modal .ui.comments.sfr {
  margin-bottom: 0.5em;
}
.sfr-result-modal .ui.comments.sfr .comment {
  margin-top: 0em;
  padding-top: 0em;
}
.sfr-result-modal .ui.comments.sfr .comment > .content {
  margin-left: 1em;
  padding: 0em 0.5em 0em 1.5em;
}

#spotcheck-statistics-area span.truncate {
  white-space: nowrap;
  display: inline-block;
  width: 76%;
  overflow: hidden;
  text-overflow: ellipsis;
}
#spotcheck-statistics-area .ui.secondary.vertical.menu > .item {
  height: 2.7em;
}
#spotcheck-statistics-area .ui.secondary.vertical.menu {
  width: 100%;
}
#spotcheck-statistics-area #user-result-spotcheck-statistics th.date.time {
  min-width: 160px;
}
#spotcheck-statistics-area #user-result-spotcheck-statistics table tr td {
  white-space: nowrap;
}
#spotcheck-statistics-area #user-result-spotcheck-statistics .ui.table th.rotated > div > span,
#spotcheck-statistics-area #user-result-spotcheck-statistics .ui.celled.table th.rotated > div > span {
  width: 150px;
  bottom: 55px;
  right: -45px;
}
#spotcheck-statistics-area #user-result-spotcheck-statistics .ui.table th.rotated > div > span.first,
#spotcheck-statistics-area #user-result-spotcheck-statistics .ui.celled.table th.rotated > div > span.first {
  overflow: hidden;
  text-overflow: ellipsis;
}
#spotcheck-statistics-area #user-result-spotcheck-statistics .ui.table th.rotated > div > span.second,
#spotcheck-statistics-area #user-result-spotcheck-statistics .ui.celled.table th.rotated > div > span.second {
  bottom: 160px;
}
#spotcheck-statistics-area .data .ui.grid {
  margin: 0;
  padding: 0;
}
#spotcheck-statistics-area .data .ui.grid .column:first-child {
  padding: 0 1rem 0 0;
}
#spotcheck-statistics-area .data .ui.grid .column:nth-child(2) {
  padding: 0 0 0 1rem;
}
html.rtl #spotcheck-statistics-area .ui.table thead tr:first-child > th:nth-last-child(2):not(.rotated) {
  border-left: 1px solid rgba(34, 36, 38, 0.1);
}
html.rtl #spotcheck-statistics-area .ui.table th.rotated > div > span.first,
html.rtl #spotcheck-statistics-area .ui.celled.table th.rotated > div > span.first {
  overflow: hidden;
  text-overflow: ellipsis;
  bottom: 60px;
}
html.rtl #spotcheck-statistics-area .ui.table th.rotated > div > span.second,
html.rtl #spotcheck-statistics-area .ui.celled.table th.rotated > div > span.second {
  bottom: 47.5px;
}

#user-management .text_value {
  width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
}
#user-management .text_value:hover {
  word-wrap: break-word;
}
#user-management button > i.icon {
  margin: initial;
}
#user-management .no_data_message {
  text-align: center;
  font-size: 1.2em;
  font-weight: bold;
}
#user-management .has_changed {
  background-color: #21BA45 !important;
  color: #FFF !important;
  text-shadow: none !important;
  background-image: none !important;
}
#user-management .dropdown.locale {
  min-width: 6em;
}
#user-management .dropdown.role {
  min-width: 9em;
}
#upload-users-modal div.actions > span.left {
  float: left;
  margin-top: 8px;
}
#assign-users-modal {
  min-height: 480px;
  overflow: hidden;
  width: auto;
  max-width: 1000px;
}
#assign-users-modal > .header {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#assign-users-modal > .content {
  overflow: hidden;
}
#assign-users-modal > .content > .ui.grid {
  height: 100%;
}
#assign-users-modal > .content > .ui.grid > .column .bottom.segment {
  height: 82%;
  overflow-y: auto;
}
#team-management table div.truncate {
  max-width: 200px;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.admin_controller > .ui.container > .ui.grid > .left.column {
  min-width: 160px;
}
body.admin_controller > table {
  table-layout: fixed;
}
body.admin_controller table .ui.buttons {
  display: flex;
}

.allocation .ui.secondary.fluid.menu .item.header:first-child,
.allocation .ui.secondary.fluid.menu form.item {
  margin-left: 0;
  padding-left: 0;
}
.allocation .ui.secondary.fluid.menu .right.menu .item:last-child {
  margin-right: 0;
  padding-right: 0;
}
.allocation .very.compact.table th.one.wider {
  width: 9.5%;
}
.allocation .very.compact.table th.nowrap {
  white-space: nowrap;
}
.bulk-allocation .ui.main.container {
  flex-grow: 1;
  overflow: hidden;
}
.bulk-allocation .ui.main.container > .content {
  display: flex;
  flex-direction: row;
}
.bulk-allocation .ui.main.container .content > .ui.grid {
  flex: 1;
  overflow: hidden;
}
.bulk-allocation .ui.main.container .content > .ui.grid > .column {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - 13rem);
}
.bulk-allocation .ui.main.container .content > .ui.grid > .column .bottom.segment {
  flex-grow: 1;
  overflow-y: scroll;
  margin-bottom: 0;
  height: calc(100vh - 13rem);
}
.bulk-allocation .ui.main.container .bottom.segment .ui.list {
  margin-top: 0;
  margin-bottom: 1rem;
}
.bulk-allocation .ui.main.container .bottom.segment .ui.list .ui.button,
.bulk-allocation .ui.main.container .bottom.segment .ui.list .ui.button:disabled {
  transition: all 0.5s;
  opacity: 0;
}
.bulk-allocation .ui.main.container .bottom.segment .ui.list .item:hover .ui.button {
  opacity: 1;
}
.bulk-allocation .ui.main.container .fitted.column {
  width: 100% !important;
}
.bulk-allocation .ui.main.container .ui.bottom.inverted.menu .ui.checkbox label {
  color: inherit;
}

/*******************************
         Site Settings
*******************************/
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
    Border Radius
--------------------*/
/* See Power-user section below
   for explanation of @px variables
*/
/*-------------------
    Brand Colors
--------------------*/
/*--------------
  Page Heading
---------------*/
/*--------------
   Form Input
---------------*/
/* This adjusts the default form input across all elements */
/* Input Text Color */
/* Line Height Default For Inputs in Browser (Descenders are 17px at 14px base em) */
/*-------------------
    Focused Input
--------------------*/
/* Used on inputs, textarea etc */
/* Used on dropdowns, other larger blocks */
/*-------------------
        Sizes
--------------------*/
/*
  Sizes are all expressed in terms of 14px/em (default em)
  This ensures these "ratios" remain constant despite changes in EM
*/
/*-------------------
        Page
--------------------*/
/*-------------------
      Paragraph
--------------------*/
/*-------------------
       Links
--------------------*/
/*-------------------
    Scroll Bars
--------------------*/
/* Inverted */
/*-------------------
  Highlighted Text
--------------------*/
/*-------------------
       Loader
--------------------*/
/*-------------------
        Grid
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*---  Light Colors  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Headers ---*/
/*--- Colored Text ---*/
/*--- Colored Border ---*/
/*-------------------
     Alpha Colors
--------------------*/
/*-------------------
       Accents
--------------------*/
/* Differentiating Neutrals */
/* Differentiating Layers */
/*******************************
           Power-User
*******************************/
/*-------------------
    Emotive Colors
--------------------*/
/* Positive */
/* Negative */
/* Info */
/* Warning */
/*-------------------
        Paths
--------------------*/
/* For source only. Modified in gulp for dist */
/*-------------------
       Em Sizes
--------------------*/
/*
  This rounds @size values to the closest pixel then expresses that value in (r)em.
  This ensures all size values round to exact pixels
*/
/* em */
/* rem */
/*-------------------
       Icons
--------------------*/
/* Maximum Glyph Width of Icon */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
    Derived Values
--------------------*/
/* Loaders Position Offset */
/* Rendered Scrollbar Width */
/* Maximum Single Character Glyph Width, aka Capital "W" */
/* Used to match floats with text */
/* Header Spacing */
/* Minimum Mobile Width */
/* Positive / Negative Dupes */
/* Responsive */
/*-------------------
  Exact Pixel Values
--------------------*/
/*
  These are used to specify exact pixel values in em
  for things like borders that remain constantly
  sized as emSize adjusts

  Since there are many more sizes than names for sizes,
  these are named by their original pixel values.

*/
/* Columns */
/*******************************
             States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Shadows  ---*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Focus
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Active
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
body {
  display: flex;
  flex-direction: column;
  height: auto;
  min-height: 100%;
  overflow-x: auto !important;
}
body > .ui.container {
  flex-grow: 1;
}
body > .ui.container > .ui.grid {
  position: relative;
}
body > .ui.container > .ui.grid > .left.column {
  min-width: 300px;
}
body > .ui.container > .ui.grid > .content.column {
  flex-grow: 1;
}
body > .ui.container > .ui.grid > .right.column {
  min-width: 300px;
}
body > .ui.menu {
  flex-shrink: 0;
  border-radius: 0;
  margin: 0;
}
.ui.container > .ui.grid .content .ui.dimmer {
  z-index: auto;
}
.ui.container > .ui.grid .content > .stretched.row,
.ui.container > .ui.grid .content > .stretched.row .column {
  flex-grow: 1;
}
.ui.bottom.fixed.menu + *,
table-actions + * {
  margin-bottom: 4rem !important;
}
.ui.bottom.fixed.menu .disabled.item {
  pointer-events: none;
  opacity: 0.5;
}
.ui.bottom.fixed.menu .ui.checkbox label {
  color: inherit;
}
.ui.bottom.fixed.menu .center.menu .item::before {
  display: none;
}
.ui.main.menu {
  background-image: url('/images/login_background.png');
  background-position: center center;
  background-size: cover;
}
.ui.main.menu .header.item img {
  margin-right: 1rem;
}
.ui.inverted.menu .item.active-menu {
  background: rgba(255, 255, 255, 0.15) none repeat scroll 0% 0%;
}
span.highlight,
mark {
  font-weight: bold;
  background: #e4c6fc;
}
.ui.grid {
  width: 100%;
}
.ui.grid > .row {
  margin: 0;
}
.ui.table th[ng-click],
.ui.table tr[ng-click] th,
.ui.table tr[ng-click] td,
.ui.table td[ng-click],
.ui.segment[ng-click],
.ui.checkbox label {
  cursor: pointer;
}
.ui.icon.button .icon:only-child {
  margin: 0;
}
.ui.readonly .remove.icon.link,
.ui.disabled .remove.icon.link {
  pointer-events: none;
  display: none;
}
.ui.icon.label > .icon {
  margin: 0;
}
.ui.form .inline.fields > label:first-child {
  min-width: 8rem;
}
.ui.hidden.divider {
  display: block !important;
}
.ui.table tr.disabled {
  pointer-events: none !important;
}
.ui.table tbody td.selectable {
  color: #4183c4;
  text-decoration: underline;
}
.ui.table th.checkbox,
.ui.table td.checkbox {
  width: 3.5rem;
}
.ui.table th.rotated,
.ui.celled.table th.rotated {
  height: 140px;
  min-width: 40px;
  max-width: 40px;
  vertical-align: bottom;
  padding: 0;
  border-left: none;
}
.ui.table th.rotated > div,
.ui.celled.table th.rotated > div {
  position: relative;
  top: 0px;
  left: 70px;
  height: 100%;
  transform: skew(-45deg, 0deg);
  border-left: 1px solid rgba(34, 36, 38, 0.15);
}
.ui.table th.rotated > div > span,
.ui.celled.table th.rotated > div > span {
  transform: skew(45deg, 0deg) rotate(315deg);
  position: absolute;
  bottom: 30px;
  right: -20px;
  /*Because it looked good, but there is probably a mathematical link here as well*/
  display: inline-block;
  width: 85px;
  /* 80 / cos(45) - 40 cos (45) = 85 where 80 is the height of the cell, 40 the width of the cell and 45 the transform angle*/
  text-align: left;
  white-space: nowrap;
}
.ui.table th.rotated:nth-last-child(2) > div,
.ui.celled.table th.rotated:nth-last-child(2) > div,
.ui.table th.rotated.last > div,
.ui.celled.table th.rotated.last > div {
  border-right: 1px solid rgba(34, 36, 38, 0.15);
}
.ui.table th.rotated + th,
.ui.celled.table th.rotated + th {
  border-left: none;
}
.ui.dropdown .menu > .divider {
  display: block;
}
.ui.secondary.menu.pagination {
  margin: 0;
  padding: 1.5rem 1rem;
  display: flex;
  border-top: 1px solid rgba(34, 36, 38, 0.15);
}
.ui.secondary.menu.pagination .item {
  margin: 0;
  padding: 0;
}
.ui.secondary.menu.pagination.bottom.fixed {
  box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
  background: #FFFFFF;
}
.ui.pagination.labeled.input {
  margin-top: 0;
  margin-bottom: 0;
}
.ui.pagination.labeled.input input,
.ui.pagination.labeled.input .ui.label {
  text-align: center;
  width: 5em;
}
.content-pusher {
  height: 6rem;
}
table.ui.fixed.striped.compact.table > tfoot th {
  overflow: visible;
}
div.selection.items.per.page {
  min-width: 60px;
  margin-bottom: 0;
}
div.selection.items.per.page.active.visible {
  z-index: 1024;
}
table .clickable:hover {
  box-shadow: 0px 0px 5px 0px #2185D0;
}
.exportable {
  margin-bottom: 50px !important;
}
.ui.main.container {
  display: flex;
  flex-direction: column;
  padding-top: 3.8rem;
}
.ui.main.container[ng-cloak] + .ui.active.dimmer[ng-cloak] {
  display: block !important;
}
.ui.main.container + .ui.active.dimmer {
  display: none !important;
}
.ui.main.container > .ui.grid {
  margin: 0;
  flex-grow: 1;
}
.ui.main.container > .ui.header {
  padding: 1rem;
  margin: 0;
}
.modal-content-pusher {
  height: 67px;
}
.ui.form .ui.text.menu {
  margin-top: 0;
  margin-bottom: 0;
}
.ui.form .ui.text.menu .item {
  padding-top: 0;
  padding-bottom: 0;
}
.export-success {
  background-color: #74c874 !important;
}
#upload-button {
  margin-top: 10px;
  margin-left: auto;
  display: block;
}
.napp-item-section {
  margin: 10px;
}
.item-name {
  border-bottom: 1px solid #c7c1c1;
}
.answer-response {
  padding: 10px;
}
.response-question {
  border-bottom: black 1px solid;
  margin-top: 30px;
  font-size: small;
}
.response-text {
  background-color: #f7f7f7;
  margin: 10px;
  color: black;
}
.response-text > p {
  padding: 10px;
}
.food-web-answer {
  padding: 10px;
  border: 1px solid black;
  background-color: white;
}
.food-web-key {
  padding: 20px;
  border: 1px black solid;
  background-color: lightgrey;
}
.grid-border {
  border: 1px solid black;
  margin-bottom: 10px !important;
}
.answer-margin {
  margin: 20px;
}
.valid-bottom {
  position: fixed;
  bottom: 20px;
  width: 100%;
}
.flag-bottom {
  bottom: 150px;
}
.list-height {
  max-height: 400px;
}
.auditTrail {
  padding: 10px;
}
.auditTrail-Item {
  border-bottom: 2px solid #afabab;
  padding: 3px;
}
.square-green {
  width: 10px;
  height: 10px;
  background: green;
  display: inline-block;
}
.square-purple {
  width: 10px;
  height: 10px;
  background: purple;
  display: inline-block;
}
.square-grey {
  width: 10px;
  height: 10px;
  background: grey;
  display: inline-block;
}
.go-button {
  margin-left: 5px;
  background-color: #6ad46a;
  border-radius: 20px;
  color: white;
}
.go-button:hover {
  background-color: #5eef5e;
}
.number-label {
  background-color: #757272 !important;
  color: #e2e2e2 !important;
}
.delete-buttons {
  display: none;
  z-index: 1;
  font-size: initial;
  position: absolute;
}
.delete-button {
  border-left: solid 1px lightgrey !important;
  border-top-left-radius: 0px !important;
}
.delete-booklet {
  color: #9dff7f;
}
.delete-response {
  color: #ff9c0a;
}
.delete-all {
  color: red;
}
.button-dropdown {
  position: relative;
  display: inline-block;
}
.button-dropdown:hover .delete-buttons {
  display: block;
}

/*!
 * Bootstrap v3.3.6 (http://getbootstrap.com)
 * Copyright 2011-2015 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

.ui.modal.add-item > .content {
  height: 70vh;
}
.ui.modal.add-item .assign-criteria {
  height: 28em;
}
.ui.form.edit-item textarea {
  height: 8em;
}
.ui.form.edit-item .ui.small.header.field em {
  word-wrap: break-word;
}
.treemenu {
  float: left;
  width: 100%;
  max-height: 100%;
  overflow: auto;
  margin-bottom: 50px;
}
.treemenu .ui.styled.accordion,
.treemenu .ui.styled.accordion .accordion {
  background: inherit;
  box-shadow: none;
  padding: 0;
  margin: 0;
}
.treemenu .ui.styled.accordion .accordion .title,
.treemenu .ui.styled.accordion .accordion .accordion .title,
.treemenu .ui.styled.accordion .title,
.treemenu .ui.styled.accordion .accordion .title {
  border-top: none;
  padding: 0.35em 0;
  margin: 0;
  color: rgba(0, 0, 0, 0.8);
}
.treemenu .ui.styled.accordion .accordion .title span,
.treemenu .ui.styled.accordion .accordion .accordion .title span,
.treemenu .ui.styled.accordion .title span,
.treemenu .ui.styled.accordion .accordion .title span {
  font-weight: 400;
}
.treemenu .ui.styled.accordion .accordion .title span.selected,
.treemenu .ui.styled.accordion .accordion .accordion .title span.selected,
.treemenu .ui.styled.accordion .title span.selected,
.treemenu .ui.styled.accordion .accordion .title span.selected {
  font-weight: 700;
}
.treemenu .ui.styled.accordion .content,
.treemenu .ui.styled.accordion .accordion .content {
  margin-left: 0.8rem;
  padding: 0;
}
.treemenu .ui.styled.accordion .accordion .content,
.treemenu .ui.styled.accordion .accordion .accordion .content {
  margin-left: 1.6rem;
  padding: 0;
}
.treemenu .ui.styled.accordion .accordion .content a.selected,
.treemenu .ui.styled.accordion .accordion .accordion .content a.selected {
  font-weight: bold;
}
.treemenu .truncate {
  width: 100%;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.config-left-menu {
  border-right: 1px solid #d4d4d5;
}
.config-left-menu .search {
  width: 100%;
}
.config-left-menu .content-padding {
  height: 15px;
}
.config-menu.row {
  margin-left: 15px !important;
}
.config-container.row .sticky {
  z-index: 0 !important;
}
.config-container.row .pusher {
  height: 100px;
}
.ui.dropdown.readonly {
  pointer-events: none;
}
.ui.fixed.table.items-table td.edit-item-column {
  overflow: visible;
}


.error_message {
  color: white;
  font-size: 1.3em;
}
a.home.button {
  margin-top: 53px;
}

/**
 * Flexbox utilities
 */
.flex-shrink {
  flex-shrink: 1 !important;
  flex-grow: 0 !important;
}

i.icon.team:before {
  content: "\F0C0";
}
i.icon.supervisor:before {
  content: "\F21B";
}
i.icon.leadmarker:before {
  content: "\F19D";
}
i.icon.item:before {
  content: "\F02B";
}
i.icon.items:before,
i.icon.subject:before {
  content: "\F02C";
}
i.icon.spotcheck:before {
  content: "\F140";
}
i.icon.shuffle:before {
  content: "\F074";
}
i.icon.booklet:before {
  content: "\F02D";
}
i.icon.cuts:before {
  content: "\F145";
}

body.fullscreen {
  background-color: #DADADA;
}
body.fullscreen > .grid {
  flex-grow: 1;
  margin: 0;
}
body.fullscreen .image {
  margin-top: -100px;
}
body.fullscreen .column {
  max-width: 450px;
}
body.fullscreen.login,
body.fullscreen.errors {
  background: #000 url('/images/login_background.png') no-repeat;
  background-size: cover;
}

/*******************************
         Site Settings
*******************************/
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
    Border Radius
--------------------*/
/* See Power-user section below
   for explanation of @px variables
*/
/*-------------------
    Brand Colors
--------------------*/
/*--------------
  Page Heading
---------------*/
/*--------------
   Form Input
---------------*/
/* This adjusts the default form input across all elements */
/* Input Text Color */
/* Line Height Default For Inputs in Browser (Descenders are 17px at 14px base em) */
/*-------------------
    Focused Input
--------------------*/
/* Used on inputs, textarea etc */
/* Used on dropdowns, other larger blocks */
/*-------------------
        Sizes
--------------------*/
/*
  Sizes are all expressed in terms of 14px/em (default em)
  This ensures these "ratios" remain constant despite changes in EM
*/
/*-------------------
        Page
--------------------*/
/*-------------------
      Paragraph
--------------------*/
/*-------------------
       Links
--------------------*/
/*-------------------
    Scroll Bars
--------------------*/
/* Inverted */
/*-------------------
  Highlighted Text
--------------------*/
/*-------------------
       Loader
--------------------*/
/*-------------------
        Grid
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*---  Light Colors  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Headers ---*/
/*--- Colored Text ---*/
/*--- Colored Border ---*/
/*-------------------
     Alpha Colors
--------------------*/
/*-------------------
       Accents
--------------------*/
/* Differentiating Neutrals */
/* Differentiating Layers */
/*******************************
           Power-User
*******************************/
/*-------------------
    Emotive Colors
--------------------*/
/* Positive */
/* Negative */
/* Info */
/* Warning */
/*-------------------
        Paths
--------------------*/
/* For source only. Modified in gulp for dist */
/*-------------------
       Em Sizes
--------------------*/
/*
  This rounds @size values to the closest pixel then expresses that value in (r)em.
  This ensures all size values round to exact pixels
*/
/* em */
/* rem */
/*-------------------
       Icons
--------------------*/
/* Maximum Glyph Width of Icon */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
    Derived Values
--------------------*/
/* Loaders Position Offset */
/* Rendered Scrollbar Width */
/* Maximum Single Character Glyph Width, aka Capital "W" */
/* Used to match floats with text */
/* Header Spacing */
/* Minimum Mobile Width */
/* Positive / Negative Dupes */
/* Responsive */
/*-------------------
  Exact Pixel Values
--------------------*/
/*
  These are used to specify exact pixel values in em
  for things like borders that remain constantly
  sized as emSize adjusts

  Since there are many more sizes than names for sizes,
  these are named by their original pixel values.

*/
/* Columns */
/*******************************
             States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Shadows  ---*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Focus
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Active
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
.marking-area .ui.item.menu .item:first-child {
  justify-content: left;
}
.marking-area .ui.item.menu .item:last-child {
  justify-content: right;
}
.marking-area .marking.menu .inactive {
  opacity: 0.5 !important;
}
.marking-area .marking.menu .item {
  transition: all 0.5s;
  width: 100%;
}
.marking-area .marking.menu .criterion .menu > .item {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.marking-area .marking.menu .criterion.item .dimmer {
  z-index: 1;
}
.marking-area .marking.menu label.ui.button {
  position: relative;
  overflow: hidden;
  transition: all 0.5s;
  width: 2rem;
  height: 2rem;
  margin: 0.2rem;
}
.marking-area .marking.menu label.ui.button > input[type="radio"] {
  position: absolute;
  cursor: pointer;
  opacity: 0;
}
.marking-area .marking.menu label.ui.button.focused,
.marking-area .marking.menu label.ui.button:hover {
  box-shadow: 0 0 0 1px #A333C8 inset;
}
.marking-area .marking.menu .criterion .header .label {
  visibility: hidden;
}
.marking-area .marking.menu .criterion.active .header .label {
  visibility: visible;
}
.marking-area .marking.menu .keypressed.label {
  visibility: hidden;
  padding: 0.75em 1em;
}
.marking-area .marking.menu .criterion.active .keypressed.label.in {
  visibility: visible;
}
.marking.menu.sticky {
  margin-bottom: 100px;
  z-index: 0;
}
#score-highlight {
  visibility: hidden;
  position: fixed;
  height: 170px;
  width: 170px;
  top: 50%;
  left: 50%;
  margin-top: -85px;
  margin-left: -85px;
}
#score-highlight .ui.segment.in {
  visibility: visible;
}
#score-highlight .ui.segment {
  display: block;
  height: 100%;
  box-shadow: 0 4px 8px 0 rgba(34, 36, 38, 0.48), 0 4px 20px 0 rgba(34, 36, 38, 0.6);
}
#score-highlight .ui.statistic .value {
  line-height: 8rem;
}
.ui.checkbox.purple {
  background-color: #9724BE;
}
.ui.checkbox.purple label {
  color: #FFF;
  text-shadow: none;
}
.ui.checkbox.grey {
  background-color: #767676;
}
.ui.checkbox.grey label {
  color: #FFF;
  text-shadow: none;
}
.ui.checkbox.green {
  background-color: green;
}
.ui.checkbox.green label {
  color: #FFF;
  text-shadow: none;
}
.iframe-delivery {
  height: 800px;
}
.iframe-delivery iframe {
  height: 100%;
  width: 100%;
}
.ui.image.response {
  filter: contrast(2);
}
.view-response {
  height: 100vh;
  width: 100vw;
  overflow: hidden;
}
.view-response .content-pusher {
  display: none;
}
.view-response .ui.sticky {
  position: unset !important;
  z-index: unset !important;
}
.view-response .main.fixed.menu {
  position: unset;
  top: unset;
  left: unset;
  right: unset;
  bottom: unset;
}
.view-response .ui.main.container {
  padding: 0;
  height: calc(100vh - 3.8rem);
  overflow: hidden;
}
.view-response .ui.main.container > .ui.grid {
  overflow: hidden;
  height: 100%;
}
.view-response .ui.grid .right.column {
  height: calc(100% - 50px);
  overflow-y: scroll;
  padding: 0;
  background-color: #FAFAFA;
}
.view-response .ui.grid .content.column {
  overflow-y: scroll;
  height: calc(100% - 50px);
}
.ui.fullscreen.modal {
  height: calc(100vh - 2rem);
  width: 100vw;
  padding: 0;
  margin: 0;
}
.modals.dimmer .ui.fullscreen.modal {
  margin: 0 !important;
}
.ui.modal .modal-content-pusher,
.ui.modal .content-pusher {
  display: none !important;
  height: 50px;
}
.ui.modal .content.marking.marking-area {
  height: calc(100% - 50px - 1rem);
  max-height: unset;
  overflow: hidden;
  padding: 0 0 calc(50px) 0;
}
.ui.modal .content.marking.marking-area .ui.grid {
  padding: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden;
}
.ui.modal .content.marking.marking-area .ui.grid > .column {
  overflow: hidden;
  overflow-y: scroll;
  height: 100%;
}
.ui.modal .content.marking.marking-area .ui.grid > .four.wide.column {
  padding: 0;
}
.ui.modal .content.marking.marking-area .ui.grid > .four.wide.column .coding-panel {
  border: 0 none;
  padding: 5px;
}

#top-nav .right.menu .item.impersonate {
  background-color: olive;
}

/**
 * Custom CSS for notifications
 * @original /public/components/angular-ui-notification/dist/angular-ui-notification.css
 */
/*******************************
         Site Settings
*******************************/
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
    Border Radius
--------------------*/
/* See Power-user section below
   for explanation of @px variables
*/
/*-------------------
    Brand Colors
--------------------*/
/*--------------
  Page Heading
---------------*/
/*--------------
   Form Input
---------------*/
/* This adjusts the default form input across all elements */
/* Input Text Color */
/* Line Height Default For Inputs in Browser (Descenders are 17px at 14px base em) */
/*-------------------
    Focused Input
--------------------*/
/* Used on inputs, textarea etc */
/* Used on dropdowns, other larger blocks */
/*-------------------
        Sizes
--------------------*/
/*
  Sizes are all expressed in terms of 14px/em (default em)
  This ensures these "ratios" remain constant despite changes in EM
*/
/*-------------------
        Page
--------------------*/
/*-------------------
      Paragraph
--------------------*/
/*-------------------
       Links
--------------------*/
/*-------------------
    Scroll Bars
--------------------*/
/* Inverted */
/*-------------------
  Highlighted Text
--------------------*/
/*-------------------
       Loader
--------------------*/
/*-------------------
        Grid
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*---  Light Colors  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Headers ---*/
/*--- Colored Text ---*/
/*--- Colored Border ---*/
/*-------------------
     Alpha Colors
--------------------*/
/*-------------------
       Accents
--------------------*/
/* Differentiating Neutrals */
/* Differentiating Layers */
/*******************************
           Power-User
*******************************/
/*-------------------
    Emotive Colors
--------------------*/
/* Positive */
/* Negative */
/* Info */
/* Warning */
/*-------------------
        Paths
--------------------*/
/* For source only. Modified in gulp for dist */
/*-------------------
       Em Sizes
--------------------*/
/*
  This rounds @size values to the closest pixel then expresses that value in (r)em.
  This ensures all size values round to exact pixels
*/
/* em */
/* rem */
/*-------------------
       Icons
--------------------*/
/* Maximum Glyph Width of Icon */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
    Derived Values
--------------------*/
/* Loaders Position Offset */
/* Rendered Scrollbar Width */
/* Maximum Single Character Glyph Width, aka Capital "W" */
/* Used to match floats with text */
/* Header Spacing */
/* Minimum Mobile Width */
/* Positive / Negative Dupes */
/* Responsive */
/*-------------------
  Exact Pixel Values
--------------------*/
/*
  These are used to specify exact pixel values in em
  for things like borders that remain constantly
  sized as emSize adjusts

  Since there are many more sizes than names for sizes,
  these are named by their original pixel values.

*/
/* Columns */
/*******************************
             States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Shadows  ---*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Focus
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Active
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
.ui.notification {
  position: fixed !important;
  z-index: 9999;
  width: 300px;
  transition: all ease 0.5s;
  box-shadow: 0px 2px 4px 0px rgba(34, 36, 38, 0.12), 0px 2px 10px 0px rgba(34, 36, 38, 0.15);
  opacity: 0.9 !important;
  top: -100%;
  right: -100%;
}
.ui.notification .ui.message {
  padding: 0;
  border: 0;
  margin: 0;
  background: transparent;
  box-shadow: none;
}
.ui.notification.clickable {
  cursor: pointer;
}
.ui.notification.clickable:hover {
  opacity: 1 !important;
}
.ui.notification.killed {
  transition: opacity ease 1s;
  opacity: 0 !important;
}
.ui.notification.success {
  border-top: 2px solid #21BA45;
}
.ui.notification.info {
  border-top: 2px solid #2185D0;
}
.ui.notification.warning {
  border-top: 2px solid #F2711C;
}
.ui.notification.error {
  border-top: 2px solid #DB2828;
}

section.content-header {
  padding: 0;
}
.no-result {
  text-align: center;
  padding: 30px 0;
  font-size: 1.3em;
}
.item .field {
  margin-left: 10px;
}
table#allocation-report-by-team,
table#allocation-report-by-item {
  background-color: #ffffff;
  margin-top: -1px;
}
table#allocation-report-by-team tbody tr td,
table#allocation-report-by-item tbody tr td {
  border-left: solid 1px lightgrey;
}
table#allocation-report-by-team tbody tr:last-child td,
table#allocation-report-by-item tbody tr:last-child td,
table#allocation-report-by-team tbody tr:first-child td:first-child,
table#allocation-report-by-item tbody tr:first-child td:first-child {
  border-bottom: solid 1px lightgrey;
}
table#allocation-report-by-team tbody tr:first-child td:first-child,
table#allocation-report-by-item tbody tr:first-child td:first-child {
  border-left: none;
}
table#allocation-report-by-team th:first-child,
table#allocation-report-by-item th:first-child {
  width: 235px;
}
table#allocation-report-by-team th.item-column,
table#allocation-report-by-item th.item-column,
table#allocation-report-by-team th.team-column,
table#allocation-report-by-item th.team-column {
  min-width: 250px;
}
#report-allocation-shuffle-modal .content {
  overflow-y: scroll;
  height: 400px;
}
table.shuffle-table-container {
  border: none !important;
}
table.shuffle-table-container .placeholder-row {
  height: 40px;
}
table.shuffle-table-container .zero-not-picked {
  color: #bbbbbb;
}
table.shuffle-table-container .absent-marker {
  color: #ff911d !important;
}
table.shuffle-table-container table.shuffle-to-container div.variation {
  color: #31ce00;
  text-align: center;
}
table.shuffle-table-container table.shuffle-to-container div.variation.decrease {
  color: red;
}
table.shuffle-table-container table.shuffle-to-container input.est-after {
  border: 1px solid rgba(34, 36, 38, 0) !important;
  font-weight: bold;
  font-size: 1.1em;
  height: 30px;
  padding-bottom: 8px;
}
.shuffle-note-message {
  color: red;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 15px;
}
.circle.circle-border {
  text-shadow: 0 0 2px #000;
}

.zig0 {
  background-color: #ddf4e4;
}
.zig1 {
  background-color: #f2d8d4;
}
.zig2 {
  background-color: #fbd0d0;
}
.zig3 {
  background-color: #ffb0b0;
}

.percentage-discrepancy-report table td:first-child {
  border-left: 1px solid rgba(34, 36, 38, 0.15) !important;
}
.percentage-discrepancy-report .per-item {
  padding: 0px !important;
  border-left: 0px !important;
}
.percentage-discrepancy-report .per-item table {
  border: 0px !important;
}

#score_distribution_left,
#score_distribution_right {
  margin: 1em 0;
}

/*******************************
         Site Settings
*******************************/
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
    Border Radius
--------------------*/
/* See Power-user section below
   for explanation of @px variables
*/
/*-------------------
    Brand Colors
--------------------*/
/*--------------
  Page Heading
---------------*/
/*--------------
   Form Input
---------------*/
/* This adjusts the default form input across all elements */
/* Input Text Color */
/* Line Height Default For Inputs in Browser (Descenders are 17px at 14px base em) */
/*-------------------
    Focused Input
--------------------*/
/* Used on inputs, textarea etc */
/* Used on dropdowns, other larger blocks */
/*-------------------
        Sizes
--------------------*/
/*
  Sizes are all expressed in terms of 14px/em (default em)
  This ensures these "ratios" remain constant despite changes in EM
*/
/*-------------------
        Page
--------------------*/
/*-------------------
      Paragraph
--------------------*/
/*-------------------
       Links
--------------------*/
/*-------------------
    Scroll Bars
--------------------*/
/* Inverted */
/*-------------------
  Highlighted Text
--------------------*/
/*-------------------
       Loader
--------------------*/
/*-------------------
        Grid
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*---  Light Colors  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Headers ---*/
/*--- Colored Text ---*/
/*--- Colored Border ---*/
/*-------------------
     Alpha Colors
--------------------*/
/*-------------------
       Accents
--------------------*/
/* Differentiating Neutrals */
/* Differentiating Layers */
/*******************************
           Power-User
*******************************/
/*-------------------
    Emotive Colors
--------------------*/
/* Positive */
/* Negative */
/* Info */
/* Warning */
/*-------------------
        Paths
--------------------*/
/* For source only. Modified in gulp for dist */
/*-------------------
       Em Sizes
--------------------*/
/*
  This rounds @size values to the closest pixel then expresses that value in (r)em.
  This ensures all size values round to exact pixels
*/
/* em */
/* rem */
/*-------------------
       Icons
--------------------*/
/* Maximum Glyph Width of Icon */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
    Derived Values
--------------------*/
/* Loaders Position Offset */
/* Rendered Scrollbar Width */
/* Maximum Single Character Glyph Width, aka Capital "W" */
/* Used to match floats with text */
/* Header Spacing */
/* Minimum Mobile Width */
/* Positive / Negative Dupes */
/* Responsive */
/*-------------------
  Exact Pixel Values
--------------------*/
/*
  These are used to specify exact pixel values in em
  for things like borders that remain constantly
  sized as emSize adjusts

  Since there are many more sizes than names for sizes,
  these are named by their original pixel values.

*/
/* Columns */
/*******************************
             States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Shadows  ---*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Focus
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Active
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
html.rtl {
  direction: rtl;
}
html.rtl .ui.accordion .accordion .title .dropdown.icon:before,
html.rtl .ui.accordion .title .dropdown.icon:before {
  content: '\F0D9';
}
html.rtl .ui.accordion .accordion .active.title .dropdown.icon,
html.rtl .ui.accordion .active.title .dropdown.icon,
html.rtl .ui.accordion.menu .item .active.title > .dropdown.icon {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}
html.rtl i.icon.chevron.right:before {
  content: "\F053";
}
html.rtl .pull-right {
  float: left !important;
}
html.rtl .ui.menu .item > i.dropdown.icon {
  margin: 0 0.5em 0 0;
}
html.rtl .ui.menu .item > i.icon {
  margin: 0 0 0 0.35714286em;
}
html.rtl .ui.menu .ui.dropdown .menu > .item {
  text-align: right;
}
html.rtl .ui.main.menu .header.item img {
  margin-left: 1rem;
}
html.rtl .ui.dropdown {
  text-align: right;
}
html.rtl .ui.dropdown .menu > .item {
  text-align: right;
}
html.rtl .ui.celled.table tbody tr td,
html.rtl .ui.table th.rotated > div,
html.rtl .ui.celled.table th.rotated > div {
  border-right: 1px solid rgba(34, 36, 38, 0.15);
}
html.rtl .ui.table th.rotated > div > span,
html.rtl .ui.celled.table th.rotated > div > span {
  bottom: 40px;
}

/*******************************
         Site Settings
*******************************/
/*-------------------
       Fonts
--------------------*/
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
    Border Radius
--------------------*/
/* See Power-user section below
   for explanation of @px variables
*/
/*-------------------
    Brand Colors
--------------------*/
/*--------------
  Page Heading
---------------*/
/*--------------
   Form Input
---------------*/
/* This adjusts the default form input across all elements */
/* Input Text Color */
/* Line Height Default For Inputs in Browser (Descenders are 17px at 14px base em) */
/*-------------------
    Focused Input
--------------------*/
/* Used on inputs, textarea etc */
/* Used on dropdowns, other larger blocks */
/*-------------------
        Sizes
--------------------*/
/*
  Sizes are all expressed in terms of 14px/em (default em)
  This ensures these "ratios" remain constant despite changes in EM
*/
/*-------------------
        Page
--------------------*/
/*-------------------
      Paragraph
--------------------*/
/*-------------------
       Links
--------------------*/
/*-------------------
    Scroll Bars
--------------------*/
/* Inverted */
/*-------------------
  Highlighted Text
--------------------*/
/*-------------------
       Loader
--------------------*/
/*-------------------
        Grid
--------------------*/
/*-------------------
     Transitions
--------------------*/
/*-------------------
     Breakpoints
--------------------*/
/*-------------------
      Site Colors
--------------------*/
/*---  Colors  ---*/
/*---  Light Colors  ---*/
/*---   Neutrals  ---*/
/*--- Colored Backgrounds ---*/
/*--- Colored Headers ---*/
/*--- Colored Text ---*/
/*--- Colored Border ---*/
/*-------------------
     Alpha Colors
--------------------*/
/*-------------------
       Accents
--------------------*/
/* Differentiating Neutrals */
/* Differentiating Layers */
/*******************************
           Power-User
*******************************/
/*-------------------
    Emotive Colors
--------------------*/
/* Positive */
/* Negative */
/* Info */
/* Warning */
/*-------------------
        Paths
--------------------*/
/* For source only. Modified in gulp for dist */
/*-------------------
       Em Sizes
--------------------*/
/*
  This rounds @size values to the closest pixel then expresses that value in (r)em.
  This ensures all size values round to exact pixels
*/
/* em */
/* rem */
/*-------------------
       Icons
--------------------*/
/* Maximum Glyph Width of Icon */
/*-------------------
     Neutral Text
--------------------*/
/*-------------------
     Brand Colors
--------------------*/
/*-------------------
      Borders
--------------------*/
/*-------------------
    Derived Values
--------------------*/
/* Loaders Position Offset */
/* Rendered Scrollbar Width */
/* Maximum Single Character Glyph Width, aka Capital "W" */
/* Used to match floats with text */
/* Header Spacing */
/* Minimum Mobile Width */
/* Positive / Negative Dupes */
/* Responsive */
/*-------------------
  Exact Pixel Values
--------------------*/
/*
  These are used to specify exact pixel values in em
  for things like borders that remain constantly
  sized as emSize adjusts

  Since there are many more sizes than names for sizes,
  these are named by their original pixel values.

*/
/* Columns */
/*******************************
             States
*******************************/
/*-------------------
      Disabled
--------------------*/
/*-------------------
        Hover
--------------------*/
/*---  Shadows  ---*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Focus
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
    Down (:active)
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
/*-------------------
        Active
--------------------*/
/*---  Colors  ---*/
/*---  Emotive  ---*/
/*---  Brand   ---*/
/*---  Dark Tones  ---*/
/*---  Light Tones  ---*/
#spotcheck-filter-area .ui[class*="left icon"].input .search {
  padding-left: 2.5em !important;
  padding-right: 2.5em !important;
}
#spotcheck-filter-area .ui[class*="left icon"].input .icon {
  z-index: 20;
}
#user-result-spotcheck-statistics th.date.time {
  min-width: 160px;
}
#user-result-spotcheck-statistics table tr td {
  white-space: nowrap;
}
#user-result-spotcheck-statistics .ui.table th.rotated > div > span,
#user-result-spotcheck-statistics .ui.celled.table th.rotated > div > span {
  width: 150px;
  bottom: 55px;
  right: -45px;
}
#user-result-spotcheck-statistics .ui.table th.rotated > div > span.first,
#user-result-spotcheck-statistics .ui.celled.table th.rotated > div > span.first {
  overflow: hidden;
  text-overflow: ellipsis;
}
#user-result-spotcheck-statistics .ui.table th.rotated > div > span.second,
#user-result-spotcheck-statistics .ui.celled.table th.rotated > div > span.second {
  bottom: 160px;
}
.ui.vertical.tabular.menu .item span.wide.truncate {
  white-space: nowrap;
  display: inline-block;
  width: 80%;
  overflow: hidden;
  text-overflow: ellipsis;
}
html.rtl #spotcheck-statistics-area .ui.table thead tr:first-child > th:nth-last-child(2):not(.rotated) {
  border-left: 1px solid rgba(34, 36, 38, 0.1);
}
html.rtl #spotcheck-statistics-area .ui.table th.rotated > div > span.first,
html.rtl #spotcheck-statistics-area .ui.celled.table th.rotated > div > span.first {
  overflow: hidden;
  text-overflow: ellipsis;
  bottom: 60px;
}
html.rtl #spotcheck-statistics-area .ui.table th.rotated > div > span.second,
html.rtl #spotcheck-statistics-area .ui.celled.table th.rotated > div > span.second {
  bottom: 47.5px;
}