.hub-pivot .filters .board-settings {
  float: left;
  padding: 0px;
}

.hub-pivot .filters .board-settings.menu-bar > .menu-item {
  margin-top: 6px;
  margin-right: 5px;
}

.hub-pivot .filters .board-settings.menu-bar .menu-item {
  cursor: pointer;
}

.hub-pivot .filters .board-settings.menu-bar .menu-item.hover {
  outline: none;
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
}

.hub-pivot .filters .board-settings.menu-bar .menu-item:focus {
  outline: 1px dashed rgba( 0, 0, 0 ,  1 ) !important;
  outline: 1px dashed rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

.hub-pivot .filters .board-settings.menu-bar .menu-item .text {
  padding: 0;
  text-decoration: none;
  outline: none;
}

.common-settings-container .bowtie-ellipsis {
  margin-right: 10px;
  vertical-align: top;
}

/* Tab Strip Control - Tab Content Container */
.tabstrip-content-container .header {
  font-weight: bold;
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
  margin-bottom: 5px;
  padding-top: 12px;
}

.tabstrip-content-container .message-container {
  margin-bottom: 10px;
}

.tabstrip-content-container .subheader {
  margin-bottom: 10px;
}

.tabstrip-content-container .input-container {
  margin-top: 10px;
  padding: 0;
}

.tabstrip-content-container input[type='text'] {
  background: rgba( 255, 255, 255 ,  1 );
  background: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  outline: none;
}

.tabstrip-content-container .error-input .combo,
.tabstrip-content-container .error-input .combo > div.wrap > input {
  background: rgba( 249, 235, 235 ,  1 );
  background: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
}

.tabstrip-content-container input[type='checkbox'] {
  vertical-align: -2px;
  margin: 0;
}

.tabstrip-content-container .input-wrap {
  margin-left: 10px;
  display: inline-block;
}

.tabstrip-content-container .disabled-input-wrap {
  display: inline-block;
}

.tabstrip-content-container textarea {
  white-space: pre-line;
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  margin-top: 10px;
  font-size: 12px;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  height: 115px;
  width: 100%;
  resize: none;
  overflow: auto;
}

.tabstrip-control-container .additional-fields-section .bowtie-status-error {
  font-size: 10px;
  margin-bottom: 4px;
}

.cardfields-settings-tabstrip .tabstrip-collection-container .tabstrip .bowtie-status-error {
  margin-top: 12px;
}

.tabstrip-collection-container .tabstrip .bowtie-status-error {
  font-size: 12px;
}

/* Board Settings Control */
.column-settings-container .sections-area-container {
  overflow-y: visible !important;
  /* Override .common-settings-container .sections-area-container */
}

.swimlane-settings-container .sections-area-container {
  overflow-y: visible !important;
  /* Override .common-settings-container .sections-area-container */
}

.swimlane-settings-control-overlay, .column-settings-control-overlay {
  opacity: 0.8;
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.column-message-container {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.column-state-label {
  vertical-align: top;
  padding-top: 7px;
}

.column-state-value {
  display: inline-block;
  width: 150px;
}

.tab-collection .bowtie-status-error {
  float: left;
  font-size: 10px;
  margin-right: 5px;
}

.tab-collection .compact-rule-container .rule-summary .bowtie-status-error {
  margin-top: 9px;
}

.tab-collection .bowtie-status-warning {
  float: left;
}

.column-settings-container .tabstrip-content-container .input-wrap .wip-limit-input {
  width: 42px;
}

.column-settings-container .tabstrip-content-container .section-checkbox .split-column-label {
  display: inline-block;
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
  /* Override modal dialog label styling */
  margin-top: 0;
  /* Override modal dialog label styling */
}

.field-settings-container .sections-area-container {
  margin-top: 10px;
}

.cardfields-settings-tabstrip .header-gripper {
  display: none !important;
}

.cardfields-settings-tabstrip .work-item-icon {
  float: left;
  margin-left: 10px;
  margin-top: 12px;
}

.cardfields-settings-tabstrip .work-item-icon .work-item-type-icon {
  margin-right: 0px;
}

.cardfields-settings-tabstrip .tabstrip-collection .tabstrip .header {
  overflow: visible;
  text-overflow: clip;
  width: auto !important;
  /* overwrite the common horizontal tab width 88px */
  margin-right: 20px;
}

/*  add field control  */
.add-control {
  box-sizing: border-box;
  display: inline-block;
  height: 28px;
  width: auto;
  white-space: nowrap;
  margin: 8px 0;
  padding: 4px 12px 0 6px;
  border: solid 1px transparent;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  cursor: pointer;
}

.add-control-icon {
  display: inline-block;
  white-space: no-wrap;
}

.add-control:hover {
  border:  solid 1px;
  border-color: rgba( 199, 224, 244 ,  1 );
  border-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 );
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.add-control.disable:hover {
  border-color: transparent;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  cursor: default;
}

.add-control .control-text {
  display: inline-block;
  font-size: 14px;
  line-height: 18px;
  font-color: rgba(0, 0, 0, .9);
  font-color: var(--text-primary-color,rgba(0, 0, 0, .9));
  margin: 0 0 0 2px;
}

.column-settings-container .add-control .control-text {
  padding-left: 2px;
}

.swimlane-settings-container .add-control .control-text {
  padding-left: 2px;
}

i.bowtie-math-plus {
  font-size: 16px;
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
  vertical-align: bottom;
  overflow: visible;
}

i.bowtie-math-multiply {
  font-size: 16px;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-bottom: 26px;
  cursor: pointer;
}

.tag-delete-section i.bowtie-math-multiply {
  margin-bottom: 2px;
}

i.bowtie-math-plus-gray {
  color: rgba( 200, 200, 200 ,  1 );
  color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.column-settings-container .tabstrip-content-container,
.cardfields-settings-tabstrip .tabstrip-content-container {
  min-height: 100px;
}

/* BEGIN TODO: Should be removed or corrected once the fields tab UI is corrected */
.cardfields-settings-tabstrip .gripper {
  width: 12px;
  height: 32px;
  overflow: hidden;
}

.cardfields-settings-tabstrip .gripper:before {
  position: relative;
  content: url("../../_content/icon-gripperDefault.png");
  left: 0;
  top: 0;
}

.cardfields-settings-tabstrip .additionalfield-content-area:hover .gripper {
  width: 12px;
  height: 32px;
  overflow: hidden;
}

.cardfields-settings-tabstrip .additionalfield-content-area:hover .gripper:before {
  position: relative;
  content: url("../../_content/icon-gripperDefault.png");
  left: 0;
  top: 0;
}

.cardfields-settings-tabstrip .additionalfield-content-area .gripper:hover {
  width: 12px;
  height: 32px;
  overflow: hidden;
}

.cardfields-settings-tabstrip .additionalfield-content-area .gripper:hover:before {
  position: relative;
  content: url("../../_content/icon-gripperHover.png");
  left: 0;
  top: 0;
}

.tabstrip-control-container.horizontal .tabstrip-collection .tabstrip:focus, .tabstrip-control-container.horizontal .tabstrip-collection .tabstrip.active:focus, .tabstrip-control-container.vertical .tabstrip-collection .tabstrip:focus, .tabstrip-control-container.vertical .tabstrip-collection .tabstrip.active:focus {
  /* Set the focus in IE */
  border:  1px solid;
  border-color: rgba( 0, 0, 0 ,  1 );
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
  outline: 1px dashed rgba( 0, 0, 0 ,  1 ) !important;
  outline: 1px dashed rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

.cardfields-settings-tabstrip {
  /* vertical alignment of core fields checkboxes */
}

.cardfields-settings-tabstrip .tabstrip-control-container.horizontal .tabstrip-collection-container .tabstrip {
  width: auto;
}

.cardfields-settings-tabstrip .comboarea {
  width: calc(100% - 45px);
  display: inline-block;
}

.cardfields-settings-tabstrip .control-message-area {
  display: inline-block;
  vertical-align: 4px;
}

.cardfields-settings-tabstrip .field-format-selector {
  margin-left: 21px;
  vertical-align: 1px;
}

.cardfields-settings-tabstrip .core-fields-checkbox input[type='checkbox'] {
  vertical-align: -3px;
  margin: 0;
}

.cardfields-settings-tabstrip .core-fields-checkbox label,
.cardfields-settings-tabstrip .show-additional-fields label {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  margin-left: 22px;
  margin-top: -17px;
  padding-top: 0;
}

.cardfields-settings-tabstrip .core-fields-checkbox span {
  margin-left: 5px;
}

.cardfields-settings-tabstrip .tabstrip-content-container .show-additional-fields .section-checkbox {
  padding-top: 5px;
  margin-bottom: 0;
}

.cardfields-settings-tabstrip .tabstrip-content-container .section-header-description.core-field-section-description {
  margin-bottom: 15px;
}

.cardfields-settings-tabstrip .tabstrip-content-container .core-fields-checkbox {
  margin-top: 8px;
  height: 20px;
}

.cardfields-settings-tabstrip .error-message {
  display: inline-block;
}

.cardfields-settings-tabstrip .gripper {
  display: inline-block;
  cursor: pointer;
  vertical-align: -1px;
  margin-top: 1px;
}

.cardfields-settings-tabstrip .additional-field {
  max-width: 385px;
  /* 18px (gripper) + 340px (combo) + 16px (delete icon) + 11px (buffer width) */
}

.cardfields-settings-tabstrip .additional-field .additionalfield-content-area {
  display: inline-block;
  height: 40px;
  width: 100%;
  white-space: nowrap;
}

.cardfields-settings-tabstrip .additionalfield-content-area .gripper {
  visibility: hidden;
  margin-right: 6px;
}

.cardfields-settings-tabstrip .additionalfield-content-area .comboarea {
  margin-top: 4px;
}

.cardfields-settings-tabstrip .additionalfield-content-area .bowtie-edit-remove {
  opacity: 0;
}

.cardfields-settings-tabstrip .additionalfield-content-area:hover {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.cardfields-settings-tabstrip .additionalfield-content-area:hover .gripper {
  visibility: visible;
  margin-right: 6px;
  margin-bottom: 2px;
}

.cardfields-settings-tabstrip .field-format-selector .comboarea {
  width: 95%;
  display: inline-block;
  vertical-align: middle;
  font-weight: normal;
  margin-top: 5px;
}

.cardfields-settings-tabstrip .additionalfield-content-area:hover .bowtie-edit-remove,
.cardfields-settings-tabstrip .additionalfield-content-area .bowtie-edit-remove.inFocus {
  opacity: 1;
  margin-bottom: 25px;
}

/*END TODO*/
.embedded {
  /* This is a copy of the full-screen style. */
}

.embedded .hub-content {
  top: 2px !important;
}

.agile-board .board-tile .board-tile-content .board-tile-annotations .child-tests-summary,
.board-tile.ui-draggable-dragging .board-tile-content .board-tile-annotations .child-tests-summary {
  display: flex;
  flex-direction: row;
  align-items: center;
  cursor: pointer;
  padding: 4px 4px 4px 2px;
  margin: 0px 8px 8px 6px;
  border: 1px solid transparent;
}

.agile-board .board-tile .board-tile-content .board-tile-annotations .child-tests-summary:hover,
.board-tile.ui-draggable-dragging .board-tile-content .board-tile-annotations .child-tests-summary:hover {
  border:  1px solid;
  border-color: rgba( 199, 224, 244 ,  1 );
  border-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 );
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.agile-board .board-tile .board-tile-content .board-tile-annotations .child-tests-summary:active,
.board-tile.ui-draggable-dragging .board-tile-content .board-tile-annotations .child-tests-summary:active {
  border:  1px solid;
  border-color: rgba( 199, 224, 244 ,  1 );
  border-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 );
  background-color: rgba( 43, 136, 216 ,  1 );
  background-color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
}

.agile-board .board-tile .board-tile-content .board-tile-annotations .selected.child-tests-summary,
.board-tile.ui-draggable-dragging .board-tile-content .board-tile-annotations .selected.child-tests-summary {
  border:  1px solid;
  border-color: rgba( 199, 224, 244 ,  1 );
  border-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 );
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
}

.agile-board .board-tile .board-tile-content .board-tile-annotations .child-tests-summary .test-icon .bowtie-test-fill,
.board-tile.ui-draggable-dragging .board-tile-content .board-tile-annotations .child-tests-summary .test-icon .bowtie-test-fill, .annotation-icon .bowtie-test-fill {
  font-size: 15px;
}

.board-content-details .test-list div.separator {
  height: 1px;
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  margin-left: 10px;
  margin-right: 10px;
}

.board-content-details .test-list-container {
  max-height: 260px;
  overflow-y: auto;
  overflow-x: hidden;
  width: 100%;
  padding-bottom: 4px;
}

/********************************
    Inline Tests
*********************************/
.test {
  position: relative;
}

.test .test-point-context-menu {
  position: absolute;
  top: 0;
  right: 0;
  visibility: hidden;
}

.test .test-point-context-menu .bowtie-ellipsis {
  visibility: hidden;
  height: 24px;
  width: 24px;
  margin: 0;
  padding-top: 5px;
}

.test .test-point-context-menu .bowtie-ellipsis.tabbed-focus {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
  visibility: visible;
}

.test .multi-line-ellipsis {
  position: absolute;
  bottom: -1px;
  right: 1px;
}

.test textarea:focus + .multi-line-ellipsis {
  display: none;
}

.test .bowtie-ellipsis {
  height: 24px;
  width: 24px;
  visibility: hidden;
  margin: 0;
}

.test:hover .bowtie-ellipsis {
  visibility: visible;
  cursor: pointer;
}

.test .test-point-context-menu:focus .bowtie-ellipsis {
  visibility: visible;
}

.test .bowtie-math-minus-circle,
.inlinetest-menu-item .bowtie-math-minus-circle {
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.test .bowtie-dot {
  color: rgba(0, 120, 212, 1);
  color: var(--communication-background,rgba(0, 120, 212, 1));
}

/* TODO: Refactor the direct hex code to variable, we'll do when we move Test Hub to bowtie icon'*/
.test .bowtie-status-pause {
  color: rgba( 43, 136, 216 ,  1 );
  color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
}

.test .bowtie-status-run {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.menu-item .bowtie-media-play-fill {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.menu-item .bowtie-play-resume-fill {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.test .bowtie-ellipsis.tabbed-focus {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
  border:  1px solid;
  border-color: rgba( 199, 224, 244 ,  1 );
  border-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 );
  visibility: visible;
}

.agile-board .board-tile .board-tile-content .board-tile-annotations .child-tests-summary .test-icon,
.board-tile.ui-draggable-dragging .board-tile-content .board-tile-annotations .child-tests-summary .test-icon {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-right: 5px;
}

.agile-board .board-tile .board-tile-content .board-tile-annotations .child-tests-summary .test-icon .status-badge,
.board-tile.ui-draggable-dragging .board-tile-content .board-tile-annotations .child-tests-summary .test-icon .status-badge {
  height: 1em;
  width: 1em;
  font-size: 14px;
  margin-right: 1px;
  margin-left: -6px;
  margin-bottom: -4px;
  z-index: 2;
}

.board-content-details .test-list {
  width: 100%;
  min-height: 50px;
  position: relative;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
}

.board-content-details .test-list .add-test-container {
  cursor: pointer;
  padding: 4px 5px 4px 12px;
  margin: 4px 0px 4px 0px;
  display: inline-block;
}

.board-content-details .add-test-container .icon-add-thin {
  margin-bottom: 2px;
  position: relative;
}

.board-content-details .test-list .test,
.test.ui-sortable-helper {
  max-height: 40px;
  overflow: hidden;
  margin-top: 1px;
  padding-top: 2px;
  cursor: pointer;
}

.test.ui-sortable-helper {
  margin: 0px;
  /* bottom margin should be 0 otherwise moving a test to the bottom of page will move page up by margin */
}

.test.tabbed-focus {
  border: none !important;
}

.board-content-details .test-list .test.ui-sortable-placeholder {
  height: 15px;
}

.board-content-details .test-list .test.ui-sortable-placeholder.hide-placeholder {
  display: none;
}

.board-content-details .test-list .test .test-state {
  margin-left: -3px;
  margin-top: -2px;
}

.board-content-details .test-list .test .test-state.bowtie-icon {
  font-size: 11px;
  padding: 0 3px;
}

.board-content-details .test-list .test .test-title-container,
.test.ui-sortable-helper .test-title-container,
.cloned-draggable-item .test-title-container {
  vertical-align: top;
  margin: 3px 0 0 0;
  top: -4px;
  display: inline-block;
  max-width: calc(100% - 57px);
  max-width: -moz-calc(100% - 57px);
  max-width: -webkit-calc(100% - 57px);
  width: 100%;
  position: relative;
  overflow: hidden;
  border: 1px solid transparent;
}

.board-content-details .test-list .test.original-point {
  display: block !important;
  /* JQuery sortable hides the item using inline style. Hence !important */
  opacity: 0;
  height: 15px;
}

.board-content-details .test-list .test .test-title-container.show-error {
  max-width: calc(100% - 71px);
  /* Add width of 14px for the error-message-icon */
  max-width: -moz-calc(100% - 71px);
  max-width: -webkit-calc(100% - 71px);
  width: 100%;
}

/* Gripper for the test */
.test-list-container .test .gripper {
  visibility: hidden;
}

.test.ui-sortable-helper .test-title-container .title.completed {
  text-decoration: line-through;
}

.test-list-container .test-title-container .title {
  max-height: 2.7em;
}

.test-list-container .test:hover .gripper,
.test-list-container.ui-sortable .test-sortable-placeholder .gripper {
  visibility: visible;
}

.test-list-container .test .gripper, .test.ui-sortable-helper .gripper, .cloned-draggable-item .gripper {
  width: 12px;
  height: 18px;
  float: left;
  overflow: hidden;
  overflow: hidden;
}

.test-list-container .test .gripper:before, .test.ui-sortable-helper .gripper:before, .cloned-draggable-item .gripper:before {
  position: relative;
  content: url("../../_content/icon-gripper-sprite.png");
  left: 0;
  top: 0;
}

.test-list-container .test:hover .gripper {
  width: 12px;
  height: 18px;
  overflow: hidden;
}

.test-list-container .test:hover .gripper:before {
  position: relative;
  content: url("../../_content/icon-gripper-sprite.png");
  left: 0;
  top: 0;
}

.test-list-container .test .gripper:hover {
  width: 12px;
  height: 18px;
  overflow: hidden;
}

.test-list-container .test .gripper:hover:before {
  position: relative;
  content: url("../../_content/icon-gripper-sprite.png");
  left: -12px;
  top: 0;
}

/* Multiline ellipse on test's title */
.test-list-container .test-title-container .title .clickable-title {
  overflow: hidden;
  line-height: 1.25;
  position: relative;
  padding-right: 1em;
  word-wrap: break-word;
  -ms-word-wrap: break-word;
  -ms-word-break: break-word;
  padding: 0px 2px 2px 2px;
  margin-right: 5px;
  top: 1px;
  left: 1px;
}

.test-list-container .test-title-container .title .clickable-title:focus {
  text-decoration: underline;
  outline: none;
}

.test-list-container .test-title-container .title .clickable-title:hover {
  cursor: pointer;
  text-decoration: underline;
}

.test-list-container .test-title-container .title .test-ellipsis {
  position: absolute;
  bottom: 1px;
  right: 1px;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
}

.board-content-details .test-list .test:hover,
.board-content-details .test-list .test:hover input[type='checkbox'],
.board-content-details .test-list .test:hover .clickable-title:after,
.board-content-details .test-list-container .test:hover .test-title-container .title .clickable-title:before,
.board-content-details .test-list-container .test:hover .test-title-container .title .test-ellipsis {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.test-list-container .test-title-container .title.completed {
  text-decoration: line-through;
}

.test-list-container .edit-mode-borders:hover {
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.board-content-details .test-list .test .title .error-title {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.board-tile-annotations .child-tests-summary .bowtie-status-success,
.board-tile-annotations .child-tests-summary .bowtie-status-failure {
  position: absolute;
  font-size: 15px;
  bottom: 0px;
}

.test-list-container .edit-mode-borders {
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.test-list-container .title .editableTitleContent.invalid {
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
}

.test-list-container .title .editableTitleContent {
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  width: 100%;
  height: 2.7em;
  outline: none;
  margin: 0;
  line-height: 1.25;
  padding: 0 1px 1px 1px;
  overflow: hidden;
  resize: none;
}

.test-list-container .test-title-container .clickable-title:hover {
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.test-title-container .title .clickable-title {
  white-space: pre-wrap;
  word-wrap: break-word;
  -ms-word-wrap: break-word;
  -ms-word-break: break-word;
  display: block;
}

.agile-board .board-tile .board-tile-content .child-tests-summary .attachment-summary-text,
.board-tile.ui-draggable-dragging .board-tile-content .child-tests-summary .attachment-summary-text {
  vertical-align: middle;
}

.agile-board .board-tile .board-tile-content .child-tests-summary .error-message-icon.show,
.board-tile.ui-draggable-dragging .board-tile-content .child-tests-summary .error-message-icon.show {
  display: inline-block;
}

.hidden-draggable-item {
  visibility: hidden !important;
}

.agile-board .board-tile .board-tile-content .child-tests-summary .error-message-icon,
.board-tile.ui-draggable-dragging .board-tile-content .child-tests-summary .error-message-icon {
  display: none;
}

.bowtie-stack {
  position: relative;
  vertical-align: middle;
  width: 1em;
  height: 1em;
  font-size: 14px;
  line-height: 1em;
  display: block;
}

.bowtie-stack .bowtie-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  text-align: center;
}

.noFillColor {
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
}

.white {
  color: rgba(255, 255, 255, 1);
  color: var(--background-color,rgba(255, 255, 255, 1));
}

.success {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.fail {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.test-list-header .navigate-to-suite-container {
  display: inline-block;
  cursor: pointer;
}

.test-list-header .navigate-to-suite-container .bowtie-arrow-open {
  padding-left: 4px;
}

.test-list-header .add-test-separator {
  cursor: default;
  width: 1px;
  background-color: rgba( 200, 200, 200 ,  1 );
  background-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  height: 11px;
  border-left: 1px solid transparent;
  display: inline-block;
}

.configuration-dialog .ui-dialog-titlebar {
  margin: 0px;
}

.ui-dialog.configuration-dialog .ui-dialog-content {
  height: 100%;
  padding: 0px;
  margin: 0px;
}

.configuration-dialog .ui-dialog-buttonpane {
  margin: 0px;
}

.configuration-dialog .cardfields-settings-tabstrip .core-fields-checkbox input[type='checkbox'] {
  height: auto;
}

.tab-collection {
  height: 100%;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.tab-collection .bowtie-status-error {
  float: left;
  font-size: 10px;
  margin-right: 2px;
}

.tab-collection .bowtie-status-warning {
  float: left;
}

.tab-collection .tab-collection-container {
  height: 100%;
  position: relative;
  clear: both;
}

.tab-collection .message-area {
  margin-bottom: 5px;
  margin-left: 0px;
  margin-right: 0px;
  margin-top: 0px;
  width: 100%;
}

.tab-collection .control-message-area {
  padding: 3px 0px 0px 0px;
}

.tab-collection .error-message {
  font: normal 12px Segoe UI;
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.tab-collection .warning-message {
  font: normal 12px Segoe UI;
  color: rgba( 0, 0, 0 ,  1 );
  color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
  padding-left: 18px;
}

.tab-collection .info-message {
  font: normal 12px Segoe UI;
}

.tab-collection .tabs-titles-container {
  border-right:  1px solid;
  border-right-color: rgba( 234, 234, 234 ,  1 );
  border-right-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  float: left;
  height: 100%;
  overflow: hidden;
  padding: 0px 0px 20px 0px;
}

.tab-collection .tabs-titles {
  list-style-type: none;
  padding: 0px;
  margin-top: 10px;
  width: 160px;
  margin: 0px;
}

.tab-collection .tabs-titles li {
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  list-style-type: none;
  padding-left: 16px;
  text-overflow: ellipsis;
  overflow: hidden;
}

.tab-collection .tabs-titles li.tab-title {
  cursor: pointer;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  box-shadow: inset -3px 0 0 0 rgba( 234, 234, 234 ,  1 );
  box-shadow: inset -3px 0 0 0 rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  height: 31px;
  line-height: 200%;
}

.tab-collection .tabs-titles li.tab-title:hover {
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
}

.tab-collection .tabs-titles li.tab-title:focus {
  border: 1px solid;
  outline: 1px dashed rgba( 0, 0, 0 ,  1 ) !important;
  outline: 1px dashed rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

.tab-collection .tabs-titles li.current {
  font-weight: bolder;
  box-shadow: inset -3px 0 0 0 rgba( 16, 110, 190 ,  1 );
  box-shadow: inset -3px 0 0 0 rgba( var(--palette-primary-shade-10,16, 110, 190) ,  1 );
  color: rgba( 0, 90, 158 ,  1 );
  color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
}

.tab-collection .tabs-titles li.group-title {
  padding-top: 20px;
  color: rgba( 0, 90, 158 ,  1 );
  color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
  font-size: 16px;
  padding-bottom: 6px;
  white-space: nowrap;
}

.tab-collection .tabs-titles li.invalid {
  /*border-left: 2px solid red;*/
}

.tab-collection .tabs-titles li.isDirty .tab-title-text {
  font-weight: bolder;
}

.tab-collection .tabs-titles li.isDirty .tab-title-text::after {
  content: " *";
}

.tab-collection .tabs-titles li.isSaving {
  /*border-left: 2px solid gray;*/
}

.tab-collection .tabs-titles li.tab-title .tab-title-text {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-right: 15px;
}

.tab-collection .tabs-contents-container {
  height: 100%;
  padding: 0px;
  margin: 0px;
  padding: 0px 24px 20px 0px;
}

.tab-collection .tab-content-container {
  padding: 0px;
  margin: 0px;
  display: none;
  height: 100%;
  overflow: hidden;
}

.tab-collection .tab-content {
  padding: 0px;
  margin: 0px;
  height: 100%;
  position: relative;
}

.tab-collection .tab-content-main {
  padding: 0px;
}

.tab-collection .tab-content-apply-panel {
  background-color: accent3-light;
  padding: 2px 20px 2px 20px;
  border-bottom:  1px solid;
  border-bottom-color: rgba( 200, 200, 200 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  height: 28px;
  display: none;
}

.tab-collection .tab-content-apply-btn {
  background-color: accent3-light;
  border-radius: 5px;
  width: 150px;
  padding: 2px 20px 2px 20px;
  text-align: center;
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  float: right;
  cursor: pointer;
}

.tab-collection .tab-control-overlay {
  opacity: 0.8;
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.tab-collection .tabs-titles li.tab-title .bowtie-status-error {
  float: right;
  font-size: 10px;
  margin-right: 5px;
  margin-top: 4px;
}

.tab-collection .settings-message-area {
  min-height: 22px;
  padding: 5px 0 5px 18px;
}

.tab-collection .settings-message-area .error-message {
  font: normal 12px Segoe UI;
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
  margin-right: 10px;
  margin-left: 20px;
}

/* Tab Strip Control */
.tabstrip-control {
  width: 100%;
}

/* Tab Strip Control - Tab Collection Container */
.tabstrip-control-container {
  height: 100%;
  position: relative;
}

.tabstrip-control-container.vertical .tabstrip-collection-container {
  display: inline;
  float: left;
  overflow: hidden;
  width: 155px;
}

.tabstrip-control-container.vertical .tabstrip-collection .tabstrip.active {
  border-right-color: rgba( 255, 255, 255 ,  1 );
  border-right-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.tabstrip-collection {
  margin: 0px;
  padding: 0px;
  width: 100%;
}

/* Tab Strip Control - horizontal align */
.horizontal .tabstrip-content-container {
  overflow-y: auto;
}

.tabstrip-control-container.horizontal .tabstrip-collection-container {
  display: block;
  float: none;
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
  height: 100%;
}

.tabstrip-control-container.horizontal .tabstrip-collection-container .tabstrip {
  float: none;
  width: 127px;
  display: inline-block;
  margin: 0px;
  vertical-align: top;
  /* Need this to address weird spacing issue with inline-block: http://stackoverflow.com/questions/20845649/weird-space-after-inline-block-not-between */
}

.tabstrip-control-container.horizontal .tabstrip-collection .tabstrip {
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.tabstrip-control-container.horizontal .tabstrip-collection .tabstrip.active {
  border-bottom-color: rgba( 255, 255, 255 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.tabstrip-control-container.horizontal .tabstrip-content-container {
  width: 100%;
  margin: 0px;
  margin-top: -1px;
}

/* Common Config Arrow Scrollbar */
.tabstrip-control-container.vertical .tabstrip-collection-container .arrow-scroll-button.vertical {
  height: 15px;
  width: 155px;
}

/* Tab Strip Control - Tab Collection Container Menu item */
.menu-item .tabstrip-menu-item {
  padding: 4px !important;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
  border:  1px solid;
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.tabstrip-collection .tabstrip {
  cursor: default;
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
  display: block;
  margin-bottom: 5px;
  list-style-type: none;
  min-height: 40px;
  width: 100%;
  /* use 100% so the tabs width will change when parent has a scrollbar */
}

.tabstrip-collection .tabstrip:last-of-type {
  margin-bottom: 0px;
}

.tabstrip-collection .tabstrip.active {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border-right:  2px solid;
  border-right-color: rgba( 248, 248, 248 ,  1 );
  border-right-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
  color: rgba( 0, 90, 158 ,  1 );
  color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
}

.tabstrip-collection .icon-ellipsis {
  visibility: hidden;
}

.tabstrip-collection .tabstrip .header {
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline;
  padding-top: 12px;
  padding-left: 5px;
  padding-bottom: 12px;
  margin: 0px;
  float: left;
  white-space: nowrap;
  font-weight: normal;
  /* Begin disable user selection */
  -webkit-touch-callout: none;
  /* Disable Android and iOS callouts*/
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -ms-user-select: none;
  /* IE 10+ */
  -khtml-user-select: none;
  /* KHTML browsers (e.g. Konqueror) */
  -moz-user-select: none;
  /* Firefox all */
  -o-user-select: none;
  user-select: none;
  /* Likely future */
  /* End disable user selection*/
}

.tabstrip-collection .tabstrip.active .header {
  font-weight: bold;
}

.tabstrip-control-container.horizontal .tabstrip-collection .tabstrip .header {
  width: 87px;
}

.tabstrip-control-container.vertical .tabstrip-collection .tabstrip .header {
  width: 110px;
}

/* Tab Strip Control - sortable */
.tabstrip-collection.ui-sortable .tabstrip {
  cursor: pointer;
}

.tabstrip-collection.ui-sortable.disabled .tabstrip {
  cursor: default;
}

.tabstrip-sortable-helper {
  color: rgba( 0, 90, 158 ,  1 );
  color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
  border:  1px solid;
  border-color: rgba( 0, 90, 158 ,  1 ) !important;
  border-color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 ) !important;
}

.tabstrip-collection.ui-sortable:not(.disabled) .tabstrip:hover {
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
  color: rgba( 0, 90, 158 ,  1 );
  color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
}

.tabstrip-collection.ui-sortable .tabstrip .icon-ellipsis {
  float: right;
  visibility: hidden;
  display: inline;
  height: 13px;
  width: 21px;
}

.tabstrip-collection.ui-sortable .tabstrip.active .icon-ellipsis {
  visibility: visible;
  color: rgba( 222, 236, 249 ,  1 );
  color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
}

.tabstrip-collection.ui-sortable.disabled .tabstrip:not(.active) .icon-ellipsis {
  visibility: hidden;
}

.tabstrip-collection.ui-sortable:not(.disabled) .tabstrip:hover .icon-ellipsis {
  visibility: visible;
}

.tabstrip-collection.ui-sortable .tabstrip .header-gripper {
  float: left;
  margin-left: 3px;
  margin-top: 3px;
  visibility: hidden;
}

.tabstrip-collection.ui-sortable .tabstrip.active .header-gripper:hover {
  opacity: 1.0;
}

.tabstrip-collection.ui-sortable .tabstrip .header-gripper {
  width: 12px;
  height: 33px;
  overflow: hidden;
}

.tabstrip-collection.ui-sortable .tabstrip .header-gripper:before {
  position: relative;
  content: url("../../_content/icon-gripperDefault.png");
  left: 0;
  top: 0;
}

.tabstrip-collection.ui-sortable .tabstrip .header-gripper:hover {
  width: 12px;
  height: 33px;
  overflow: hidden;
}

.tabstrip-collection.ui-sortable .tabstrip .header-gripper:hover:before {
  position: relative;
  content: url("../../_content/icon-gripperHover.png");
  left: 0;
  top: 0;
}

.tabstrip-collection.ui-sortable .tabstrip.active .header-gripper {
  width: 12px;
  height: 33px;
  opacity: 0.5;
  overflow: hidden;
}

.tabstrip-collection.ui-sortable .tabstrip.active .header-gripper:before {
  position: relative;
  content: url("../../_content/icon-gripperHover.png");
  left: 0;
  top: 0;
}

.tabstrip-collection.ui-sortable:not(.disabled) .tabstrip:hover .header-gripper {
  visibility: visible;
}

.tabstrip-collection.ui-sortable .tabstrip.active .header-gripper {
  visibility: visible;
}

.tabstrip-collection.ui-sortable.disable .tabstrip.active .header-gripper {
  visibility: hidden;
}

.tabstrip-content-container {
  width: calc(100% - 154px);
  height: 250px;
  margin-left: 154px;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  padding: 0 20px 30px 20px;
}

.tabstrip-error-icon {
  float: right !important;
  margin-bottom: 9px !important;
  margin-right: 6px !important;
}

/* Arrow Scrollbar */
.arrow-scroll-button {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  user-select: none;
  position: absolute;
  cursor: pointer;
}

.arrow-scroll-button:hover {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.arrow-scroll-button.pressed {
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  border:  1px solid;
  border-color: rgba( 199, 224, 244 ,  1 );
  border-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 );
}

.arrow-scroll-button.vertical {
  height: 15px;
  line-height: 15px;
  /* set to height to keep characters from expanding the height - only happens in Firefox */
  width: 160px;
}

.arrow-scroll-button.prev.vertical {
  top: 0px;
  /* position arrow on the top */
}

.arrow-scroll-button.next.vertical {
  bottom: 0px;
  /* position arrow on the bottom */
}

/* Place the arrow icon on top of the scroll button area */
.arrow-scroll-button.prev.vertical::before {
  content: "\25b2";
  /* arrow up */
  padding-left: 75px;
  position: absolute;
  top: -2px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.arrow-scroll-button.next.vertical::before {
  content: "\25bc";
  /* arrow down */
  padding-left: 75px;
  position: absolute;
  top: -2px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.arrow-scroll-button.horizontal {
  height: 42px;
  width: 18px;
}

.arrow-scroll-button.prev.horizontal {
  top: 0px;
  /* position arrow on the top left */
  left: 0px;
}

.arrow-scroll-button.next.horizontal {
  top: 0px;
  /* position arrow on the top right */
  right: 0px;
  padding-left: 0px;
}

.arrow-scroll-button.prev.horizontal::before {
  content: "\25c0";
  /* arrow left */
  padding-left: 0px;
  position: absolute;
  top: 28%;
  left: 2px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.arrow-scroll-button.next.horizontal::before {
  content: "\25b6";
  /* arrow right */
  padding-left: 0px;
  position: absolute;
  top: 28%;
  left: 0px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

/** Automatically converted from ColorPicker.css **/
.color-picker-palette {
  display: inline-block;
  /*Give the palette the size of its content*/
  background-color: white;
  box-shadow: rgba( 218, 218, 218 ,  1 ) 0 0 5px;
  box-shadow: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 ) 0 0 5px;
  border-radius: 2px;
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  padding: 2px;
  list-style: none;
  /*Remove default bullet to all list item of this list*/
  cursor: pointer;
  margin: 0;
  /*Require to be close to the combo when openned*/
  position: fixed;
  /*This is required to be able to use the offset of the document to position the color picker palette*/
  z-index: 100;
  outline: none;
  /*By specs*/
}

/*
    We are floating, thus not having any body. We need to specify after the floating container a way
    to get back it's whole horizontal and vertical space. This is a way to do it.
*/
.color-picker-palette:after {
  content: "";
  display: table;
  clear: both;
}

.color-picker-palette-single-color {
  float: left;
  height: 20px;
  width: 20px;
  /*This need to be synchronized with ColorPaletteView constants*/
  margin: 1px;
  /*This need to be synchronized with ColorPaletteView constants*/
}

.color-picker-palette-single-color:hover {
  transform: scale(1.2);
}

/*
    Stop the floating to go on next line
*/
.color-picker-palette-single-color-last {
  clear: left;
}

/*
    Border between selected that is available only when not hover
*/
.color-picker-palette-single-color-selected {
  border: 1px solid rgba(0, 120, 212, 1);
  border: 1px solid var(--communication-background,rgba(0, 120, 212, 1));
}

/**
    Hide the border when hovering. Since we are using scaling up, the border wasn't pretty.
*/
.color-picker-palette-single-color-selected-inner:hover,
.color-picker-palette-single-color.color-picker-palette-single-color-selected:hover {
  border: none;
}

.color-picker-palette-single-color-selected-inner {
  height: 18px;
  /*2 pixel less than .color-picker-palette-single-color */
  width: 18px;
  /*2 pixel less than .color-picker-palette-single-color */
  border: 1px solid white;
}

.color-picker-palette-single-color-border {
  border:  1px solid;
  border-color: rgba( 218, 218, 218 ,  1 );
  border-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
}

/**
    We do not set the width and height in the CSS because we want it to be
    customizable in the TypeScript control
*/
.color-picker-combo {
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  cursor: pointer;
}

.disabled .color-picker-combo {
  cursor: default;
}

/*The arrow down to open the combo*/
.color-picker-combo .bowtie-chevron-down-light {
  height: 100%;
  width: 30px;
  margin-top: 0;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  float: right;
}

.disabled .color-picker-combo .bowtie-triangle-down {
  background: rgba( 244, 244, 244 ,  1 );
  background: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.disabled .color-picker-combo .bowtie-triangle-down::before {
  opacity: 0.5;
}

.tabs-contents-container .tab-content-container .tab-content-main {
  height: 100%;
}

.tabs-contents-container .tab-content-container .tab-content-main .common-message-area {
  height: 37px;
  overflow: auto;
  padding: 5px 0px 0px 20px;
}

.tabs-contents-container .tab-content-container .tab-content-main .common-settings-container {
  height: 100%;
  width: auto;
  overflow: auto;
  padding-left: 15px;
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
}

.tabs-contents-container .tab-content-container .tab-content-main .common-message-area.visible + .common-settings-container {
  height: calc(100% - 37px);
}

/* Common Settings Container */
.common-settings-container .common-message-area {
  padding-top: 5px;
}

.common-settings-container .common-message-area error-message {
  margin-top: 0px !important;
}

.common-settings-container .main-header {
  font-size: 16px;
  font-weight: 300;
}

.common-settings-container h1.main-header {
  margin: 0;
}

.common-settings-container .main-description {
  padding-top: 12px;
}

.common-settings-container .section-header {
  font-weight: 600;
  padding-top: 12px;
  font-size: 13px;
}

.common-settings-container .section-header.master-detail-content-topmost {
  padding-top: 14px;
}

.common-settings-container .section-description {
  padding-top: 0px;
}

.common-settings-container .sections-area-container {
  overflow-y: auto;
}

.common-settings-container .section-checkbox {
  font-weight: 600;
  margin-bottom: 5px;
  padding-top: 12px;
  font-size: 13px;
}

.common-settings-container .section-checkbox-description {
  padding-top: 0px;
  margin-left: 21px;
}

.common-settings-container .label {
  font-size: 12px;
  font-weight: 400;
  display: inline-block;
}

.common-settings-container select {
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.common-settings-container .error-input {
  border:  1px solid;
  border-color: rgba( 218, 10, 0 ,  1 );
  border-color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
  background: rgba( 249, 235, 235 ,  1 );
  background: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
}

.common-settings-container .team-settings .teamsettings-radiolist input,
.common-settings-container .team-settings .teamsettings-checkbox input,
.common-settings-container .card-reordering .card-reordering-radiolist input {
  vertical-align: -2px;
}

.common-settings-container .team-settings .teamsettings-radiolist input[type=radio] {
  float: none;
}

.common-settings-container .team-settings .teamsettings-radiolist .bugs-behavior-info {
  margin-left: 4px;
}

.common-settings-container .board-badge-preview .badge-copy-container {
  font-size: 13px;
  align-self: flex-end;
  cursor: pointer;
  padding: 8px 7px 7px 7px;
}

.common-settings-container .board-badge-preview .badge-copy-container:hover {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.common-settings-container .board-badge-preview .badge-copy-container:active {
  background-color: rgba( 218, 218, 218 ,  1 );
  background-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
}

.common-settings-container .board-badge-preview .badge-text-wrapper {
  display: flex;
}

.common-settings-container .board-badge-preview .badge-text-wrapper .badge-text-field-container {
  flex: 1 100%;
}

.common-settings-container .board-badge-preview label {
  margin-top: 15px;
}

.common-settings-container .board-badge-preview .badge-settings-note {
  margin-top: 15px;
}

.common-settings-container .team-settings .teamsettings-radiolist label,
.common-settings-container .team-settings .teamsettings-checkbox label,
.common-settings-container .card-reordering .card-reordering-radiolist label,
.common-settings-container .badge-enabled-setting label,
.common-settings-container .board-badge-mode-radio-list label {
  padding-left: 2px;
  font-weight: 400;
  display: inline;
  color: rgba( 51, 51, 51 ,  1 ) !important;
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 ) !important;
}

.common-settings-container .card-reordering-radiolist .card-reordering-image {
  padding-left: 26px;
  padding-top: 5px;
  padding-bottom: 10px;
  cursor: pointer;
}

.common-settings-container .message-area-control.warning-message {
  border: none;
  background: none;
  padding: 3px 0px 10px 0px;
  font-size: 14px;
}

.common-settings-container .message-area-control .message-header {
  padding-left: 20px;
}

.common-settings-container .teamsettings-radiolist,
.common-settings-container .card-reordering-radiolist,
.common-settings-container .badge-enabled-setting,
.common-settings-container .board-badge-mode-radio-list {
  padding-left: 9px;
}

.common-settings-container .comboarea {
  max-width: 340px;
}

.team-settings .teamsettings-checkbox,
.team-settings .teamsettings-radiolist,
.common-settings-container .card-reordering-radiolist,
.common-settings-container .badge-enabled-setting,
.common-settings-container .board-badge-mode-radio-list {
  padding-top: 12px;
}

.team-settings .teamsettings-checkbox.teamsettings-backlogs-checkbox li {
  margin-bottom: 4px;
}

.team-settings .teamsettings-checkbox.teamsettings-backlogs-checkbox li label {
  display: inline-block;
}

.team-settings .teamsettings-checkbox.teamsettings-backlogs-checkbox li label div {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.team-settings .teamsettings-checkbox.teamsettings-backlogs-checkbox li .bowtie-backlog.backlog-level {
  margin-right: 5px;
}

.team-settings .teamsettings-backlogs-checkbox input {
  height: 13px;
}

.team-setting-inline-div {
  display: inline;
}

.team-settings.test-settings .test-settings-option {
  position: relative;
  margin-bottom: 6px;
}

.team-settings.test-settings .test-plan-selection {
  padding-top: 5px;
}

.team-settings.test-settings .test-plan-selection input {
  width: 60%;
  margin-left: 38px;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 2px;
  border:  1px;
  border-color: rgba( 234, 234, 234 ,  1 ) solid;
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 ) solid;
}

.team-settings.test-settings .test-plan-selection input:disabled {
  color: rgba( 234, 234, 234 ,  1 );
  color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.team-settings.test-settings .test-plan-selection .browse-test-plans {
  width: 20px;
  min-width: 20px;
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  border-radius: 2px;
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
  height: 20px;
  padding: 0;
}

.team-settings.test-settings .test-plan-selection .browse-test-plans:hover, .team-settings.test-settings .test-plan-selection .browse-test-plans:focus {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
}

.team-settings.test-settings .test-plan-selection .browse-test-plans:disabled {
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.team-settings.test-settings .outcome-settings-container {
  margin: 10px 0 10px 10px;
}

.team-settings.test-settings .outcome-settings-container input {
  margin-right: 14px;
}

.team-settings.test-settings .outcome-settings-container label {
  display: inline-block;
}

.team-settings.test-settings .info-icon {
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
}

/***************************
    Common Mixin
****************************/
/***************************
    Common Style
****************************/
.gutter-banner {
  text-align: center;
  padding: 0;
  margin-top: 144px;
  position: absolute;
  width: 100%;
  z-index: 0;
}

.gutter-banner-container {
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  background: rgba( 255, 255, 255 ,  1 );
  background: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  margin: 0 auto;
  text-align: center;
  margin: 0px 50px;
  padding: 40px;
  /* Prevent children from overlapping the container */
  min-width: 400px;
}

.gutter-banner-container > div {
  display: inline-block;
  text-align: center;
  padding: 0px 20px;
  vertical-align: middle;
}

div.gutter-banner-text {
  text-align: left;
}

.gutter-banner-text h2 {
  font-weight: lighter;
  font-size: 2em;
}

.image.image-vso-cloud {
  background: url("../../_content/vso-cloud.png") no-repeat;
  background-size: 100%;
  width: 300px;
  height: 110px;
}

.gutter-banner .image.image-vso-cloud {
  margin-top: 20px;
}

/***** Begin WorkItem Tracking styles *****/
.bowtie-tooltipped {
  position: relative;
}

.bowtie-tooltipped:after {
  position: absolute;
  z-index: 1000000;
  display: none;
  padding: 5px 8px;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: break-word;
  white-space: pre;
  pointer-events: none;
  content: attr(aria-label);
  border-radius: 0px;
  -webkit-font-smoothing: subpixel-antialiased;
  -moz-osx-font-smoothing: auto;
  background-color: rgba( 51, 51, 51 ,  0.95 );
  background-color: rgba( var(--palette-neutral-80,51, 51, 51) ,  0.95 );
  color: rgba( 255, 255, 255 ,  1 );
  color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.bowtie-tooltipped:before {
  position: absolute;
  z-index: 1000001;
  display: none;
  width: 0;
  height: 0;
  color: rgba( 51, 51, 51 ,  0.95 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  0.95 );
  pointer-events: none;
  content: "";
  border: 5px solid transparent;
}

.bowtie-tooltipped:hover:before, .bowtie-tooltipped:hover:after, .bowtie-tooltipped:active:before, .bowtie-tooltipped:active:after, .bowtie-tooltipped:focus:before, .bowtie-tooltipped:focus:after {
  display: inline-block;
  text-decoration: none;
  -webkit-animation: fadeIn 0.3s ease-in-out;
  animation: fadeIn 0.3s ease-in-out;
}

.bowtie-tooltipped.bowtie-tooltipped-errortip:before {
  border-bottom-color: rgba( 168, 0, 0 ,  1 );
  border-bottom-color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.bowtie-tooltipped.bowtie-tooltipped-errortip:after {
  background-color: rgba( 168, 0, 0 ,  1 );
  background-color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.bowtie-tooltipped.bowtie-tooltipped-transient:hover:before, .bowtie-tooltipped.bowtie-tooltipped-transient:hover:after, .bowtie-tooltipped.bowtie-tooltipped-transient:active:before, .bowtie-tooltipped.bowtie-tooltipped-transient:active:after, .bowtie-tooltipped.bowtie-tooltipped-transient:focus:before, .bowtie-tooltipped.bowtie-tooltipped-transient:focus:after {
  -webkit-animation: fadeinout 3s linear forwards;
  animation: fadeinout 3s linear forwards;
}

.bowtie-tooltipped-always-showing:before, .bowtie-tooltipped-always-showing:after {
  display: inline-block;
  text-decoration: none;
  -webkit-animation: fadeIn 0.3s ease-in-out;
  animation: fadeIn 0.3s ease-in-out;
}

.bowtie-tooltipped-always-showing::after {
  display: table-cell;
  -webkit-animation: fadeIn 0.3s ease-in-out;
  animation: fadeIn 0.3s ease-in-out;
}

.bowtie-tooltipped-multiline:hover:after, .bowtie-tooltipped-multiline:active:after, .bowtie-tooltipped-multiline:focus:after {
  display: table-cell;
  -webkit-animation: fadeIn 0.3s ease-in-out;
  animation: fadeIn 0.3s ease-in-out;
}

.bowtie-tooltipped-multiline:after {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  max-width: 250px;
  word-break: break-word;
  word-wrap: normal;
  white-space: pre-line;
  border-collapse: separate;
}

.bowtie-tooltipped-multiline.bowtie-tooltipped-sticky:after {
  display: table-cell;
}

.bowtie-tooltipped-multiline.bowtie-tooltipped-s:after, .bowtie-tooltipped-multiline.bowtie-tooltipped-n:after {
  right: auto;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}

.bowtie-tooltipped-multiline.bowtie-tooltipped-w:after, .bowtie-tooltipped-multiline.bowtie-tooltipped-e:after {
  right: 100%;
}

.bowtie-tooltipped-s:after,
.bowtie-tooltipped-se:after,
.bowtie-tooltipped-sw:after {
  top: 100%;
  right: 50%;
  margin-top: 5px;
}

.bowtie-tooltipped-s:before,
.bowtie-tooltipped-se:before,
.bowtie-tooltipped-sw:before {
  top: auto;
  right: 50%;
  bottom: -5px;
  margin-right: -5px;
  border-bottom-color: rgba( 51, 51, 51 ,  0.95 );
  border-bottom-color: rgba( var(--palette-neutral-80,51, 51, 51) ,  0.95 );
}

.bowtie-tooltipped-n:after,
.bowtie-tooltipped-ne:after,
.bowtie-tooltipped-nw:after {
  right: 50%;
  bottom: 100%;
  margin-bottom: 5px;
}

.bowtie-tooltipped-n:before,
.bowtie-tooltipped-ne:before,
.bowtie-tooltipped-nw:before {
  top: -5px;
  right: 50%;
  bottom: auto;
  margin-right: -5px;
  border-top-color: rgba( 51, 51, 51 ,  0.95 );
  border-top-color: rgba( var(--palette-neutral-80,51, 51, 51) ,  0.95 );
}

.bowtie-tooltipped-s:after,
.bowtie-tooltipped-n:after {
  -webkit-transform: translateX(50%);
  transform: translateX(50%);
}

.bowtie-tooltipped-w:after {
  right: 100%;
  bottom: 50%;
  margin-right: 5px;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
}

.bowtie-tooltipped-w:before {
  top: 50%;
  bottom: 50%;
  left: -5px;
  margin-top: -5px;
  border-left-color: rgba( 51, 51, 51 ,  0.95 );
  border-left-color: rgba( var(--palette-neutral-80,51, 51, 51) ,  0.95 );
}

.bowtie-tooltipped-e:after {
  bottom: 50%;
  left: 100%;
  margin-left: 5px;
  -webkit-transform: translateY(50%);
  transform: translateY(50%);
}

.bowtie-tooltipped-e:before {
  top: 50%;
  right: -5px;
  bottom: 50%;
  margin-top: -5px;
  border-right-color: rgba( 51, 51, 51 ,  0.95 );
  border-right-color: rgba( var(--palette-neutral-80,51, 51, 51) ,  0.95 );
}

.bowtie-tooltipped-ne:after {
  right: auto;
  left: 50%;
  margin-left: -15px;
}

.bowtie-tooltipped-nw:after {
  margin-right: -15px;
}

.bowtie-tooltipped-se:after {
  right: auto;
  left: 50%;
  margin-left: -15px;
}

.bowtie-tooltipped-sw:after {
  margin-right: -15px;
}

@media screen and (min-width: 0\0) {
  .bowtie-tooltipped-multiline:after {
    width: 250px;
  }
}

.bowtie-tooltipped-sticky:before,
.bowtie-tooltipped-sticky:after {
  display: inline-block;
}

/* CSS animation */
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
    transform: scale(0.6);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes fadeinout {
  0%, 100% {
    opacity: 0;
  }
  10%, 50%, 90% {
    opacity: 1;
  }
}

@keyframes fadeinout {
  0%, 100% {
    opacity: 0;
  }
  10%, 50%, 90% {
    opacity: 1;
  }
}

.grid-cell .tfs-tags {
  /* remove text-indent from grid-cell (originally 2px)*/
  text-indent: 0px;
  line-height: normal;
  margin-bottom: 0px;
}

.grid-cell .tags-items-container {
  overflow: visible;
  /* overflow hidden causes clipping of tag borders inside grid rows. */
}

.grid-cell .tags-items-container ul > li {
  margin-right: 1px;
}

div.tfs-tags {
  margin-bottom: 6px;
  line-height: 24px;
}

div.tags-label-container {
  display: block;
  float: left;
  padding-left: 4px;
  padding-right: 10px;
  font-size: 11px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

div.tags-items-container {
  overflow: hidden;
}

.tags-items-container ul {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
}

.tags-items-container ul > li {
  display: inline-block;
  margin-right: 5px;
  padding: 0px;
  outline: none;
}

.tag-item-delete-experience {
  white-space: nowrap;
  overflow: hidden;
}

.tag-box {
  padding: 2px 6px;
  font-size: 12px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.tag-delete {
  padding: 2px 3px;
  font-size: 12px;
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.tag-delete .icon {
  vertical-align: top;
  margin-top: 4px;
}

.grid-row.invalid-workitem-row .tag-box {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.tag-item:hover .tag-box-selectable,
.tag-item:hover .tag-box-selectable .bowtie-math-plus-light,
.tag-box-selectable.pressed {
  cursor: pointer;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
  /* The default "Selected" font-weight of bold makes the tags in the filter jump around when hovering over them.
        It uses the !important flag so this must come after the Selected() call*/
  font-weight: normal !important;
}

.tags-input {
  overflow: hidden;
  width: 150px;
  margin: 0px;
  outline: none;
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.tags-input::-ms-clear {
  display: none;
}

.tags-filter-dropdown-input {
  z-index: 9000 !important;
  /* set important to override jquery inline z-index style */
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.tags-add-button {
  white-space: nowrap;
  overflow: hidden;
}

.tags-add-button .tag-box-selectable,
.tags-add-button .tag-box-selectable .bowtie-math-plus-light {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

/* Tag Filter Control */
.tfs-tags-filter {
  overflow: auto;
  width: 100%;
  line-height: 35px;
  height: 42px;
}

.tfs-tags-filter .tfs-tags {
  line-height: inherit;
}

.tfs-tags.tag-filter-available-tags {
  text-align: right;
  white-space: nowrap;
}

.tfs-tags.tag-filter-applied-tags {
  margin-right: 50px;
  display: block;
  float: left;
}

.tfs-tags-filter .tag-item-count {
  padding-left: 5px;
  font-size: 10px;
}

.tfs-tags-filter .tag-filter-control-label {
  display: block;
  float: left;
  padding-left: 4px;
  padding-right: 10px;
  font-size: 11px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.tfs-tags-filter .tag-filter-control-show-all {
  margin-right: 5px;
  list-style: none;
  outline: none;
}

.tfs-tags-filter .tag-filter-control-show-all-container {
  margin: 0px;
  padding: 0px;
  display: inline-block;
  float: left;
}

.tags-autocomplete-menu {
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  max-height: 139px;
  /* show only five elements in the autocomplete, then show scroll */
  overflow-y: auto;
  overflow-x: hidden;
  white-space: nowrap;
  padding: inherit;
  z-index: 9000 !important;
  /* set important to override jquery inline z-index style */
  max-width: 296px;
  box-sizing: content-box;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.tags-autocomplete-menu .ui-menu-item a {
  padding-top: 5px;
  padding-bottom: 5px;
  color: rgba( 0, 0, 0 ,  1 );
  color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.tags-autocomplete-menu .menu-item-header {
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
  padding-left: 5px;
  font-size: 12px;
}

.tags-autocomplete-menu .tag-suggestions-separator {
  float: left;
  width: 100%;
  clear: left;
  border: 0px;
}

.tags-autocomplete-menu .tag-suggestions-separator .separator {
  height: 1px;
  background-color: rgba( 200, 200, 200 ,  1 );
  background-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  border-top: 1px solid transparent;
  cursor: default;
}

.tags-autocomplete-menu .ui-menu-item a.ui-state-active {
  font-weight: normal;
  margin: 0;
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
}

.tag-container {
  outline: none;
  padding-top: 2px;
  padding-bottom: 2px;
  border:  1px solid;
  border-color: rgba( 255, 255, 255 ,  1 );
  border-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  user-select: none;
  /* Likely future */
}

.tag-delete,
.tag-container-selectable {
  cursor: pointer;
}

.tag-box {
  cursor: default;
}

.tag-delete:hover {
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
}

.tag-item:focus .tag-box-selectable,
.tag-item:focus .tag-box-selectable .bowtie-math-plus-light,
.tag-item:focus .tag-box-delete-experience,
.tag-box-delete-experience:focus {
  cursor: pointer;
  color: rgba( 255, 255, 255 ,  1 );
  color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  background-color: rgba(0, 120, 212, 1);
  background-color: var(--communication-background,rgba(0, 120, 212, 1));
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
  /* The default "Selected" font-weight of bold makes the tags in the filter jump around when hovering over them.
        It uses the !important flag so this must come after the Selected() call*/
  font-weight: normal !important;
}

.tag-item:focus .tag-box-selectable:hover,
.tag-item:focus .tag-delete:hover,
.tag-delete:focus:hover {
  background-color: rgba( 0, 90, 158 ,  1 );
  background-color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
}

.workitem-state-circle {
  border-radius: 50%;
  border-width: 1px;
  border-style: solid;
  margin-top: 5px;
  margin-right: 5px;
  float: left;
  width: 8px !important;
  height: 8px !important;
  transition: background-color linear .2s;
}

.workitem-state-value {
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  width: calc(100% - 13px);
}

/** Automatically converted from Experience.css **/
.work-items-right-pane {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}

.work-items-view {
  width: 100%;
  height: 100%;
}

.work-items-view.work-item-editor-view .hub-title {
  padding: 0;
}

.work-items-view.new-work-items-view.work-item-editor-view .hub-title {
  margin: 0;
  z-index: 10;
}

.work-items-view.new-work-items-view.work-item-editor-view .hub-progress {
  top: 0;
}

.full-screen-mode .hub-view.explorer.work-items-view.new-work-items-view.triage-view .hub-progress {
  top: 36px;
}

.work-items-view.work-item-editor-view .hub-pivot {
  display: none;
}

.work-items-view.work-item-editor-view .hub-pivot-content {
  top: 0px;
}

.work-items-view.work-item-editor-view.new-work-items-view .hub-pivot-content {
  background: none;
}

.work-items-view.work-item-editor-view.new-work-items-view .hub-pivot-content .work-items-right-pane {
  padding-top: 27px;
}

.work-items-view .right-hub-content {
  display: none;
  /* hide initially */
}

.work-items-view.query-editor-view .work-items-pane-filter,
.work-items-view.query-charts-view .work-items-pane-filter,
.work-items-view.contributed-tab-view .work-items-pane-filter {
  display: none;
}

.work-items-pane-filter.pivot-filter.dropdown span.anchor {
  cursor: pointer;
  padding-left: 5px;
  padding-right: 5px;
}

.vss-focus-visible .work-items-pane-filter.pivot-filter.dropdown span.anchor:focus {
  outline: 1px solid rgba( 0, 0, 0 ,  1 );
  outline: 1px solid rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

@media screen and (-ms-high-contrast: active) {
  .vss-focus-visible .work-items-pane-filter.pivot-filter.dropdown span.anchor:focus {
    outline: 1px dashed windowtext !important;
  }
}

.work-items-pane-filter.pivot-filter.dropdown.active {
  border: 1px solid transparent;
}

.work-items-view.error-view .hub-title {
  display: none;
}

.work-items-view.error-view .hub-pivot {
  display: none;
}

.work-items-view.error-view .right-hub-content {
  top: 0;
}

.work-items-view.error-view .hub-pivot-content {
  top: 0;
}

/*************************
    Full screen menuitem
**************************/
ul.wit-full-screen-menubar {
  display: inline-block;
  padding-top: 6px;
}

/*
    Workitem form
*/
.full-screen-mode .work-item-editor-view .right-hub-content {
  top: 45px !important;
}

.full-screen-mode .work-items-view.new-work-items-view.work-item-editor-view .right-hub-content {
  top: 0 !important;
  padding-top: 28px;
}

.hub-view.explorer.work-items-view.new-work-items-view.work-item-editor-view .right-hub-content {
  top: 0;
  padding-top: 28px;
}

/* 
    Message area styling  
*/
.work-items-view-message-area.message-area-control {
  height: 34px;
}

.work-items-view-message-area.message-area-control span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.work-items-view-message-area.message-area-control.visible ~ .hub-title {
  top: 34px;
}

.work-items-view-message-area.message-area-control.visible ~ .hub-progress {
  top: 34px;
}

.work-items-view-message-area.message-area-control.visible ~ .right-hub-content {
  top: 79px;
}

.hub-view.explorer.work-items-view.new-work-items-view.work-item-editor-view .work-items-view-message-area.message-area-control.visible ~ .right-hub-content {
  top: 34px;
}

.full-screen-mode .work-items-view.new-work-items-view.work-item-editor-view .work-items-view-message-area.message-area-control.visible ~ .right-hub-content {
  top: 34px !important;
}

.ui-dialog .ui-dialog-titlebar-close .ui-icon.ui-icon-closethick {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-image: none !important;
  text-indent: 0px;
  background-position: 0 !important;
}

.ui-dialog .ui-dialog-titlebar-close .ui-icon.ui-icon-closethick::before {
  content: "\E9FA";
}

.query-editor .content .clauses .icon.icon-add-thin {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background: none !important;
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.query-editor .content .clauses .icon.icon-add-thin::before {
  content: "\E970";
}

.query-editor .content .clauses .add-remove .add-new-clause-container, .bulkedit-controls-container .clauses .add-remove .add-new-clause-container {
  margin-left: -4px;
  padding: 0 4px;
}

.query-editor .content .clauses .add-remove .add-new-clause-container:hover, .bulkedit-controls-container .clauses .add-remove .add-new-clause-container:hover {
  background: rgba( 222, 236, 249 ,  1 );
  background: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
}

.query-editor .content .clauses .add-remove .add-new-clause-container .add-row-link, .bulkedit-controls-container .clauses .add-remove .add-new-clause-container .add-row-link {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
}

/*************************
    Whats New Experience
**************************/
.newfeature-bubble-visualizeyourwork-image {
  background: url("../../_content/gfx-kanban.svg") center no-repeat;
  background-size: contain;
  width: 391px;
  height: 390px;
}

.newfeature-bubble-trackchanges-image {
  background: url("../../_content/gfx-connected.svg") center no-repeat;
  background-size: contain;
  width: 391px;
  height: 390px;
}

.newfeature-bubble-customizeworkitems-image {
  background: url("../../_content/gfx-custom.svg") center no-repeat;
  background-size: contain;
  width: 391px;
  height: 390px;
}

/** Automatically converted from _index.css **/
/***** Begin WorkItem Tracking Controls Area *****/
/** Automatically converted from _index.css **/
/***** Begin WorkItem Tracking Controls Area: Charts *****/
/** Automatically converted from QueryCharts.css **/
.query-charts-view > .chart-hosts-list {
  position: absolute;
  top: 38px;
  bottom: 0;
  overflow: auto;
  width: 100%;
}

.query-charts-view .query-chart-toolbar .bowtie-icon.bowtie-math-plus {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.query-charts-info-bar .charts-title {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 500px;
  padding-right: 10px;
}

.ui-dialog .ui-dialog-content.advertisement-dialog {
  overflow: hidden;
}

.advertisement-dialog IFrame,
.advertisement-dialog div {
  width: 100%;
  height: 100%;
  border: 0px;
}

/***** End WorkItem Tracking Controls Area: Bulk Edit *****/
/** Automatically converted from _index.css **/
/***** Begin WorkItem Tracking Controls Area: Query *****/
/** Automatically converted from QueryResultsGrid.css **/
.query-result-grid.grid {
  border: 0;
}

.query-result-grid .grid-header {
  z-index: 8;
}

.query-result-grid.grid.has-grid-message-area .grid-header {
  top: 2.4em;
}

.query-result-grid.grid.has-grid-message-area .grid-canvas {
  top: 4.6em;
}

.query-result-grid.has-grid-message-area .message-area-control {
  margin: 0px 12px;
}

.dirty-workitem-row {
  font-weight: bold;
}

.grid-row.invalid-workitem-row {
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.grid-cell .work-item-type-icon, .grid-cell .error-icon {
  margin-left: 5px;
}

.grid-row:hover a.work-item-title-link,
.grid-row-selected a.work-item-title-link {
  color: rgba( 0, 90, 158 ,  1 );
  color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
}

.grid-row:hover a.work-item-title-link:link, .grid-row:hover a.work-item-title-link:visited,
.grid-row-selected a.work-item-title-link:link,
.grid-row-selected a.work-item-title-link:visited {
  color: rgba( 0, 90, 158 ,  1 );
  color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
}

.grid-row:hover a.work-item-title-link.disabled,
.grid-row-selected a.work-item-title-link.disabled {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  pointer-events: none;
}

.grid-row:hover a.work-item-title-link.disabled:link, .grid-row:hover a.work-item-title-link.disabled:visited,
.grid-row-selected a.work-item-title-link.disabled:link,
.grid-row-selected a.work-item-title-link.disabled:visited {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.invalid-workitem-row:not(.grid-row-selected):not(:hover) a.work-item-title-link {
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.invalid-workitem-row:not(.grid-row-selected):not(:hover) a.work-item-title-link:link, .invalid-workitem-row:not(.grid-row-selected):not(:hover) a.work-item-title-link:visited {
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.invalid-workitem-row.grid-gutter-row {
  padding-top: 3px;
  padding-left: 6px;
  font-size: 14px;
}

.invalid-workitem-row.grid-gutter-row:before {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\EA02";
  font-weight: normal;
  font-style: normal;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-right: 5px;
}

.description-popup-content-container.popup-content-control {
  min-width: 200px;
  word-wrap: break-word;
  max-width: 400px;
  max-height: 300px;
  width: auto;
  /* This is to override the base control css */
}

.description-popup-content-container.popup-content-control .popup-content-container {
  background-color: rgba( 251, 242, 236 ,  1 );
  background-color: rgba( var(--palette-accent3-light,251, 242, 236) ,  1 );
  box-shadow: 5px 5px 5px -2px rgba( 166, 166, 166 ,  1 );
  box-shadow: 5px 5px 5px -2px rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  padding: 5px 10px;
}

.popup-content-control.rich-content-tooltip.description-popup-content-container .popup-tag::after {
  border-bottom-color: rgba( 251, 242, 236 ,  1 );
  border-bottom-color: rgba( var(--palette-accent3-light,251, 242, 236) ,  1 );
}

.description-popup-content-container .description-content {
  overflow-y: auto;
  overflow-x: hidden;
  min-width: 200px;
  max-width: 400px;
  max-height: 300px;
  padding: 0 10px 0 15px;
}

.query-result-grid .grid-cell .tags-items-container ul > li {
  margin-right: 3px;
}

.hub-view.explorer .right-hub-content.below-1-message {
  top: 83px;
}

.hub-view.explorer .right-hub-content.below-2-messages {
  top: 130px;
}

/** Automatically converted from TriageView.css **/
.triage-view {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.triage-view .hub-pivot .pivot-view {
  margin-left: 10px;
}

.triage-view .hub-pivot .pivot-view li:first-child a {
  padding-left: 10px;
}

.triage-view .work-item-form-container {
  height: 100%;
}

.triage-view > .content {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.triage-view .splitter.vertical > .rightPane {
  margin-top: 4px;
}

.triage-view .hub-no-content-gutter {
  padding-left: 0;
}

.triage-view .right-hub-content .splitter.horizontal .hub-no-content-gutter {
  border-top:  1px solid;
  border-top-color: rgba( 218, 218, 218 ,  1 );
  border-top-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
}

.triage-view .toolbar.query-result-grid-toolbar {
  margin-right: 16px;
  margin-left: 12px;
}

.triage-view .toolbar.query-result-grid-toolbar .menu-bar {
  white-space: inherit;
}

.triage-view .work-item-list {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: auto;
  height: auto;
  top: 44px;
  border-bottom: 0 !important;
}

.triage-view .work-item-list.with-filter-bar {
  top: 89px;
}

.triage-view .work-item-form ~ .control-loading-overlay,
.triage-view ~ .work-item-form ~ .control-loading-overlay {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  opacity: 1;
  filter: alpha(Opacity=100);
  z-index: 10000;
}

.menu-item.toggle-filter-bar {
  margin-right: 24px;
}

.toolbar.filter-bar {
  display: none;
  border-top: none;
  height: auto;
}

.toolbar.filter-bar ul {
  margin-top: 5px;
  margin-bottom: 0px;
}

/* Used to move the search button to the right side of the page */
.text-filter-button {
  float: right;
  margin-right: 7px !important;
  /* Overrides the menu-bar margin so the search button when hovered is not against the edge of screen */
}

.text-filter-image {
  float: right;
  width: 16px;
  height: 16px;
  position: absolute;
  right: 4px;
  top: 2px;
  cursor: pointer;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item, .backlog-header .menu-bar .text-filter-box.menu-item {
  cursor: initial;
  float: right;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item.hover, .backlog-header .menu-bar .text-filter-box.menu-item.hover {
  background-color: transparent;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .icon, .query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text, .backlog-header .menu-bar .text-filter-box.menu-item .icon, .backlog-header .menu-bar .text-filter-box.menu-item .text {
  display: none;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box {
  position: relative;
  cursor: text;
  float: right;
  width: 146px;
  height: 20px;
  outline: 0px;
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  border: 1px solid transparent;
  /* FireFox 19+ */
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box ::-webkit-input-placeholder, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box ::-webkit-input-placeholder {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box ::-moz-placeholder, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box ::-moz-placeholder {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  opacity: 1;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box input:-ms-placeholder, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box input:-ms-placeholder {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box ::-ms-input-placeholder, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box ::-ms-input-placeholder {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box :-ms-input-placeholder, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box :-ms-input-placeholder {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box .watermark, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box .watermark {
  font-style: inherit;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box .base-filter-box, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box .base-filter-box {
  border: 0px;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box input, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box input {
  padding: 3px 3px 4px 3px;
  margin-top: 0px;
  border-style: none;
  outline: 0px;
  /* Prevents the outline from showing when typing in the field */
  width: 144px;
  height: 18px;
  font-size: 11px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  background-color: transparent;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box input::-ms-clear, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box input::-ms-clear {
  display: none;
  /* Prevents IE10 x (clear) icon from showing up as to not confuse users */
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box .text-filter-image.bowtie-icon, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box .text-filter-image.bowtie-icon {
  right: 2px;
  top: 1px;
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box.active, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box.active {
  border-color: rgba( 244, 244, 244 ,  1 );
  border-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  border:  1px solid;
  border-color: rgba( 244, 244, 244 ,  1 );
  border-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.query-result-grid-toolbar .menu-bar .text-filter-container.menu-item .text-filter-box.active input, .backlog-header .menu-bar .text-filter-box.menu-item .text-filter-box.active input {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

/** Automatically converted from QueryEditor.css **/
.query-options {
  display: flex;
  flex-direction: row;
  align-items: center;
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  height: 35px;
  overflow: hidden;
  margin-right: 6px;
  margin-left: 10px;
}

.query-options .query-type {
  flex: 1;
  display: flex;
  align-items: center;
}

.query-options .query-type .query-type-label {
  flex: 0 0 auto;
  margin-left: 10px;
  margin-right: 2px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.query-options .query-type .pivot-filter.dropdown {
  padding: 0px;
  flex: 1 1 auto;
  display: flex;
}

.query-options .query-type .pivot-filter.dropdown.active {
  border: 1px solid transparent;
  border-bottom: 0;
}

.query-options .query-type .pivot-filter.dropdown > span {
  margin: 0;
}

.query-options .query-type .pivot-filter.dropdown span.anchor {
  border: 1px solid transparent;
  padding: 4px;
}

.query-options .query-type .pivot-filter.dropdown span.anchor:hover, .query-options .query-type .pivot-filter.dropdown span.anchor:focus {
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  outline: none;
  border: 1px solid rgba(0, 0, 0, .55);
  border: 1px solid var(--text-secondary-color,rgba(0, 0, 0, .55));
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
}

.query-options .query-type .pivot-filter.dropdown span.anchor.selected {
  max-width: 20em;
}

.query-options .query-type .pivot-filter.dropdown .menu.sub-menu > .menu-item {
  border: 1px solid transparent;
}

.query-options .query-type .pivot-filter.dropdown .menu.sub-menu > .menu-item.hover, .query-options .query-type .pivot-filter.dropdown .menu.sub-menu > .menu-item.focus {
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
}

.query-options .query-type .pivot-filter.dropdown .menu.sub-menu > .menu-item > span.text {
  margin-left: 1px;
}

.query-options .query-across-project-selector {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  padding-left: 4px;
}

.query-options .query-across-project-selector .query-across-project-label {
  flex: 1 0 auto;
  margin-right: 0.5em;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.query-options .query-across-project-selector .query-across-project-checkbox {
  margin-top: 7px;
  margin-left: 2px;
}

/* Setting right margin of the drop down for query type on the icon
   so that it matches the drop down menu */
.query-type .icon {
  margin-right: 7px;
}

.query-type .query-type-text {
  margin-right: 3px;
  margin-top: 1px;
}

.icon.query-type-flat {
  overflow: hidden;
}

.icon.query-type-flat:before {
  position: relative;
  content: url("../../_content/tfs-icons.png");
  left: -4976px;
  top: -16px;
}

.icon.query-type-link {
  overflow: hidden;
}

.icon.query-type-link:before {
  position: relative;
  content: url("../../_content/tfs-icons.png");
  left: -5040px;
  top: -16px;
}

.icon.query-type-tree {
  overflow: hidden;
}

.icon.query-type-tree:before {
  position: relative;
  content: url("../../_content/tfs-icons.png");
  left: -5104px;
  top: -16px;
}

.query-editor {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.query-editor .leftPane {
  outline: none;
}

.query-editor .leftPane .filters .header {
  display: table-row;
}

.query-editor .bowtie-status-run, .query-editor .bowtie-math-plus {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.query-editor .toolbar {
  margin-right: 6px;
}

.query-editor .toolbar.query-result-grid-toolbar {
  border-top: none;
}

.query-editor .content.splitter,
.query-editor .content {
  position: absolute;
  top: 0;
  bottom: 0;
  height: auto;
}

.query-editor .filters {
  padding-left: 20px;
  height: calc(100% - 35px - 38px);
  overflow: auto;
  margin-right: 5px;
}

.query-editor .filters fieldset {
  margin-top: 5px;
  margin-bottom: 5px;
}

.query-editor .filters fieldset > legend {
  font-weight: normal;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  padding-bottom: 5px;
  padding-left: 0px;
}

.query-editor .filters fieldset .combo.invalid {
  border:  1px solid;
  border-color: rgba( 168, 0, 0 ,  1 );
  border-color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.query-editor .filters fieldset .combo.invalid:not(.focus) .wrap {
  margin-left: 0px;
}

.query-editor .filters fieldset .combo.invalid:not(.focus) .wrap:after {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\EA02";
  font-weight: normal;
  font-style: normal;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-left: 5px;
}

.query-editor .filters fieldset .combo.invalid:not(.focus) input {
  width: calc(100% - 38px);
}

.query-editor .filters fieldset .clauses .logical {
  width: 100px;
  min-width: 100px;
}

.query-editor .filters fieldset .clauses .field {
  width: 400px;
  min-width: 400px;
}

.query-editor .filters fieldset .clauses .operator {
  width: 200px;
  min-width: 200px;
}

.query-editor .filters fieldset .clauses .value {
  min-width: 250px;
}

.query-editor .filters > .link, .query-editor .filters > .tree {
  width: 100%;
}

.query-editor .filters > .link > .query-mode, .query-editor .filters > .tree > .query-mode {
  float: left;
  margin-left: 15px;
  width: 300px;
}

.query-editor .filters > .link > .query-mode select, .query-editor .filters > .tree > .query-mode select {
  display: block;
}

.query-editor .filters > .link > div.link-types, .query-editor .filters > .tree > div.link-types {
  float: left;
  margin-left: 15px;
  display: block;
  width: 200px;
}

.query-editor .filters > .link > div.link-types select, .query-editor .filters > .tree > div.link-types select {
  display: block;
}

.query-editor .filters > .link > div.link-types > .checkbox-list.link-types, .query-editor .filters > .tree > div.link-types > .checkbox-list.link-types {
  width: 250px;
}

.query-editor .filters > .link > fieldset, .query-editor .filters > .tree > fieldset {
  clear: both;
}

.query-editor .has-grid-message-area .grid-header {
  top: 2.4em;
}

.query-editor .grid.has-header.has-grid-message-area .grid-canvas {
  top: 4.6em;
}

.query-editor .has-grid-message-area .message-area-control {
  margin: 0px 12px;
}

.query-editor .filters > .tree > fieldset {
  clear: both;
}

.query-editor .work-item-list {
  position: absolute;
  width: 100%;
  top: 52px;
  bottom: 0;
  border-top: 0 !important;
  border-bottom: 0 !important;
}

.field-filter-iteration-control .fields-filter-classification-picker-container, .field-filter-area-control .fields-filter-classification-picker-container {
  height: 24px;
}

.field-filter-iteration-control .team-picker, .field-filter-area-control .team-picker {
  margin-bottom: 3px;
}

.query-editor .toolbar.work-item-list-toolbar {
  border-bottom:  1px solid;
  border-bottom-color: rgba( 200, 200, 200 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.query-editor .value .identity-picker-search-box .identity-picker-resolved:focus {
  background-color: transparent;
}

.query-editor .value .identity-picker-search-box .identity-picker-resolved.identity-picker-resolved-single-search .identity-picker-resolved-close {
  display: none;
  /* this is a temporary hack till EA team gives us a better solution to hide the close icon */
}

.query-editor .value .field-filter-value-control.identity-picker-container {
  height: 1.7em;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border:  1px solid;
  border-color: rgba( 218, 218, 218 ,  1 );
  border-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
  padding: 0 8px;
  width: 100%;
  padding: 0;
}

.query-editor .value .field-filter-value-control.identity-picker-container:hover {
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container:active {
  border-color: rgba(0, 120, 212, 1);
  border-color: var(--communication-background,rgba(0, 120, 212, 1));
}

.query-editor .value .field-filter-value-control.identity-picker-container:focus, .query-editor .value .field-filter-value-control.identity-picker-container.focus {
  border-color: rgba(0, 120, 212, 1);
  border-color: var(--communication-background,rgba(0, 120, 212, 1));
}

.query-editor .value .field-filter-value-control.identity-picker-container ~ label {
  margin-top: 24px;
}

.query-editor .value .field-filter-value-control.identity-picker-container.invalid, .query-editor .value .field-filter-value-control.identity-picker-container:invalid {
  background: rgba( 249, 235, 235 ,  1 );
  background: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  border-color: rgba( 218, 10, 0 ,  1 );
  border-color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container.invalid:active, .query-editor .value .field-filter-value-control.identity-picker-container:invalid:active {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container.invalid:focus, .query-editor .value .field-filter-value-control.identity-picker-container.invalid.focus, .query-editor .value .field-filter-value-control.identity-picker-container:invalid:focus, .query-editor .value .field-filter-value-control.identity-picker-container:invalid.focus {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container.required {
  border: 2px solid #9abad4;
  background: rgba( 239, 246, 252 ,  1 );
  background: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container.required:active {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container.required:focus {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container:disabled, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:hover, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:focus, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:active {
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  height: 32px;
  background: rgba( 234, 234, 234 ,  1 );
  background: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container:disabled.read-only, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:hover.read-only, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:focus.read-only, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:active.read-only {
  color: rgba( 102, 102, 102 ,  1 );
  color: rgba( var(--palette-neutral-60,102, 102, 102) ,  1 );
  border-color: rgba( 218, 218, 218 ,  1 );
  border-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container:disabled::selection, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:hover::selection, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:focus::selection, .query-editor .value .field-filter-value-control.identity-picker-container:disabled:active::selection {
  background-color: rgba( 43, 136, 216 ,  1 );
  background-color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
  color: rgba( 255, 255, 255 ,  1 );
  color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container::selection {
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
}

.query-editor .value .field-filter-value-control.identity-picker-container.multi-select {
  overflow-y: auto;
  max-height: 90px;
}

.query-editor .value .field-filter-value-control.identity-picker-container .identity-picker-search-box input.identity-picker-input[type=text] {
  min-width: 150px;
}

/** Automatically converted from QueryFolderExplorer.css **/
.query-folder-explorer {
  overflow: hidden;
}

.query-folder-explorer .toolbar {
  /* Left toolbar on work item page require to override some attributes */
  border-top: 1px solid transparent;
  margin-right: 0px;
  margin-left: 17px;
  padding-left: 9px;
  height: 39px;
}

.query-folder-explorer > .query-folder-tree {
  position: absolute;
  top: 39px;
  left: 0;
  right: 0;
  bottom: 0px;
  overflow: auto;
}

.query-folder-explorer .dirty-query .node-content:after {
  content: " * ";
}

.query-folder-tree {
  border: 1px solid transparent;
  border-right-width: 0px;
}

.query-folder-tree .folder.empty {
  display: none;
}

.query-folder-tree .folder.top-separator {
  padding-top: 4px;
  border-top:  1px solid;
  border-top-color: rgba( 234, 234, 234 ,  1 );
  border-top-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.query-folder-tree .node > a.node-link .node-content {
  padding-right: 5px;
}

.query-folder-tree .node .fav-star {
  position: absolute;
  top: 4px;
  right: 6px;
  height: 16px;
  width: 16px;
  display: none;
}

.query-folder-tree .node-content .icon-pin {
  position: absolute;
  top: 4px;
  right: 6px;
  height: 16px;
  width: 16px;
  cursor: pointer;
}

.query-folder-tree.tree-view > ul.tree-children li.ui-draggable,
.query-folder-tree.tree-view > ul.tree-children li.ui-droppable {
  /*
     * For query explorer tree, touch action is a scrolling action in both direction and drag drop feature is disabled for touch screens
     */
  touch-action: manipulation;
  -ms-touch-action: manipulation;
}

.query-folder-tree.tree-view .bowtie-status-run {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.query-folder-explorer .bowtie-math-plus {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.query-folder-tree .node.focus > a.node-link .fav-star {
  display: block;
  overflow: hidden;
}

.query-folder-tree .node.focus > a.node-link .fav-star:before {
  position: relative;
  content: url("../../_content/tfs-icons.png");
  left: -2224px;
  top: -16px;
}

.query-folder-tree .node.focus > a.node-link .fav-star:hover {
  overflow: hidden;
}

.query-folder-tree .node.focus > a.node-link .fav-star:hover:before {
  position: relative;
  content: url("../../_content/tfs-icons.png");
  left: -2192px;
  top: -16px;
}

.query-folder-tree .node.focus.starred > a.node-link .fav-star {
  display: block;
  overflow: hidden;
}

.query-folder-tree .node.focus.starred > a.node-link .fav-star:before {
  position: relative;
  content: url("../../_content/tfs-icons.png");
  left: -2192px;
  top: -16px;
}

.query-folder-tree .node.focus.starred > a.node-link .fav-star:hover {
  overflow: hidden;
}

.query-folder-tree .node.focus.starred > a.node-link .fav-star:hover:before {
  position: relative;
  content: url("../../_content/tfs-icons.png");
  left: -2224px;
  top: -16px;
}

.query-rename-new-folder-dialog {
  overflow: hidden !important;
}

.query-rename-new-folder-dialog .input-text {
  width: 100%;
  margin-bottom: 10px;
}

.query-rename-new-folder-dialog .validation-summary.invalid {
  margin-top: 10px;
}

.query-rename-new-folder-dialog .message-area-control {
  margin-top: 10px;
}

.query-rename-new-folder-dialog .error {
  margin-top: 10px;
  color: rgba( 249, 235, 235 ,  1 );
  color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  background-color: rgba( 251, 242, 236 ,  1 );
  background-color: rgba( var(--palette-accent3-light,251, 242, 236) ,  1 );
  padding: 4px;
  overflow: hidden;
  width: 100%;
}

.ui-dialog:not(.ui-dialog-legacy) .query-rename-new-folder-dialog + .ui-dialog-buttonpane {
  margin-top: 10px;
}

/** Automatically converted from ColumnOptions.css **/
.column-options-host {
  position: relative;
}

.column-options {
  height: calc(100% - 15px);
}

.column-options .error-message {
  height: 20px;
}

.column-options .error-message .error-text {
  display: inline;
  vertical-align: bottom;
}

.column-options .views {
  width: 100%;
  border-bottom:  1px solid;
  border-bottom-color: rgba( 200, 200, 200 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.column-options .views .pivot-view {
  margin-left: 0px;
}

.column-options .views .pivot-view li {
  z-index: 1;
}

.column-options.no-sort .sort-columns-view {
  display: none;
}

.column-options > .filters {
  position: relative;
  top: 5px;
}

.column-options > .filters p {
  margin: 0;
  margin-top: 10px;
}

.column-options label {
  margin-bottom: 3px;
}

.column-options > .columns {
  position: relative;
  top: 15px;
  height: calc(100% - 150px);
}

.simple > .column-options > .columns {
  top: 0px;
  height: calc(100% - 10px);
}

.column-options .content {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.column-options .content > .available {
  position: absolute;
  left: 0;
  right: 50%;
  top: 0;
  bottom: 0;
}

.column-options .content > .selected {
  position: absolute;
  left: 50%;
  right: 0;
  top: 0;
  bottom: 0;
}

.column-options .content .list-container {
  position: absolute;
  left: 0;
  top: 23px;
  right: 4em;
  bottom: 0;
  min-height: 120px;
}

.column-options .content .buttons {
  position: absolute;
  right: 0;
  width: 4em;
  top: 23px;
  bottom: 0;
  text-align: center;
}

.column-options select {
  width: 100%;
  height: 100%;
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

/* 
 * Chrome and FF do not let you change the css of the select/option element
 * so this will have no effect there but we want to fix it for Edge
 */
.column-options select option:checked {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
}

.column-options button {
  padding: 1px;
  width: 24px;
  height: 24px;
  margin-bottom: 2px;
}

.column-options .ui-button-text {
  padding: 2px 0 0 0 !important;
}

.column-options .width {
  width: 3em;
}

.column-options .width.disabled {
  cursor: default;
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.column-options .width-container {
  overflow: hidden;
  word-break: break-all;
  padding-left: 2px;
}

.column-options .width-container > label {
  white-space: pre-wrap;
}

/** Automatically converted from QueryCombo.css **/
.combo-drop-popup .folder span {
  font-weight: bold;
}

.query-result-grid-info {
  display: flex;
  flex-direction: column;
}

.query-result-grid-info .error-message-container {
  display: flex;
}

.query-result-grid-info .error-message-container .messages {
  width: 100%;
}

.query-result-grid-info .error-message-container .messages a {
  padding: 0;
}

.query-result-grid-info .query-result-info-bar {
  display: flex;
  align-items: baseline;
}

.query-result-grid-info .query-result-info-bar.no-title {
  display: none;
}

.query-result-grid-info .query-result-info-bar .query-title {
  flex: 0 1 auto;
  text-overflow: ellipsis;
  overflow: hidden;
}

.query-result-grid-info .query-result-info-bar .query-description {
  flex: 0 0 auto;
  align-self: flex-start;
  cursor: pointer;
}

.query-result-grid-info .query-result-info-bar .query-status {
  flex: 1 0 auto;
  display: flex;
  justify-content: flex-end;
  margin-left: 10px;
  font-size: 16px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.productbacklog-grid-results .shimmer {
  animation-duration: 4s;
  animation-timing-function: ease-in-out;
  animation-direction: normal;
  animation-iteration-count: infinite;
  background: linear-gradient(to right, rgba( 244, 244, 244 ,  1 ) 0%, rgba( 234, 234, 234 ,  1 ) 50%, rgba( 244, 244, 244 ,  1 ) 100%) 0px 0px/90% 100% no-repeat rgba( 244, 244, 244 ,  1 );
  background: linear-gradient(to right, rgba( var(--palette-neutral-4,244, 244, 244) ,  1 ) 0%, rgba( var(--palette-neutral-8,234, 234, 234) ,  1 ) 50%, rgba( var(--palette-neutral-4,244, 244, 244) ,  1 ) 100%) 0px 0px/90% 100% no-repeat rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  transition: opacity 200ms ease 0s;
}

@keyframes shimmer-wide {
  0% {
    background-position: -500px;
  }
  100% {
    background-position: 500px;
  }
}

.productbacklog-grid-results .shimmer-line {
  animation-name: shimmer-wide;
  border-radius: 0.5em;
  display: flex;
}

.productbacklog-grid-results .progress-bar-container {
  display: flex;
  flex-direction: row;
  height: 100%;
}

.productbacklog-grid-results .progress-bar-container .progress-bar-background {
  flex-grow: 1;
  margin-right: 5px;
  background-color: rgba( 200, 200, 200 ,  1 );
  background-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.productbacklog-grid-results .progress-bar-container .progress-bar-background .progress-bar {
  height: 100%;
}

.productbacklog-grid-results .progress-bar-container .progress-bar-background .progress-bar.in-progress {
  background-color: rgba(0, 120, 212, 1);
  background-color: var(--communication-background,rgba(0, 120, 212, 1));
}

.productbacklog-grid-results .progress-bar-container .progress-bar-background .progress-bar.completed {
  background-color: rgba( 16, 124, 16 ,  1 );
  background-color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.productbacklog-grid-results .progress-bar-container .progress-percentage-text {
  flex-basis: 30px;
}

/***** End WorkItem Tracking Controls Area: Query *****/
/** Automatically converted from _index.css **/
/***** Begin WorkItem Tracking Controls Area: WorkItem *****/
/** Automatically converted from Common.css **/
.workitemcontrol-label {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  display: block;
}

.label-text-control {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  display: inline;
}

.wit-font-size-small {
  font-size: 80%;
}

.wit-font-size-normal {
  font-size: 100%;
}

.wit-font-size-large {
  font-size: 150%;
  margin-bottom: 6px;
}

.wit-font-size-xlarge {
  font-size: 200%;
  margin-bottom: 8px;
}

.wit-font-size-xxlarge {
  font-size: 300%;
  margin-bottom: 12px;
}

.create-copy-of-work-item-dialog .create-copy-title {
  -webkit-margin-before: 0px;
  word-wrap: break-word;
}

.create-copy-of-work-item-dialog .include-input-container {
  margin: 5px 0px;
}

.create-copy-of-work-item-dialog .include-input-container input, .create-copy-of-work-item-dialog .include-input-container label {
  vertical-align: top;
}

.create-copy-of-work-item-dialog .include-input-container label {
  display: inline;
}

.custom-follow-dialog {
  padding: 5px;
}

.custom-follow-dialog .bolt-radio-button-group-container .bolt-radio-button-group .custom-checkbox {
  margin-left: 20px;
  margin-top: 5px;
}

.custom-follow-dialog .bolt-radio-button-group-container .bolt-radio-button-group .custom-radio-label {
  font-weight: bold;
}

.custom-follow-dialog .bolt-radio-button-group-container .bolt-radio-button-group .custom-radio-label-description {
  padding-top: 0px;
  margin: 5px 0px 10px 29px;
}

/** Automatically converted from Layout.css **/
.new-work-item-view {
  outline: none;
}

.old-work-item-view {
  margin-right: 10px;
}

table.witform-layout {
  width: 100%;
  table-layout: fixed;
}

.witform-layout .group > td > table.content, .witform-layout .group > td > fieldset > table.content {
  width: 100%;
}

.witform-layout .grid-group-container span.tfs-collapsible-text p {
  display: inline;
}

.witform-layout .grid-group-container span.tfs-collapsible-text p.form-group-subtitle {
  padding-left: 5px;
  padding-right: 5px;
  font-size: 14px;
}

/* this is to make sub header same color when hover over */
.witform-layout .grid-group-container .wit-form-group-header:not(.focus) span.tfs-collapsible-text p.form-group-subtitle {
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.witform-layout .column > table.content {
  width: 100%;
}

.witform-layout .tab-page > table.content {
  width: 100%;
}

.witform-layout .control > td.label-cell {
  width: 1%;
  white-space: nowrap;
  overflow: hidden;
}

.witform-layout .control > td.label-cell.left-label {
  padding-right: 6px;
}

.witform-layout .control > td.control-cell {
  min-width: 60px;
}

/*
  The following styles ensure the identity picker
  correctly changes its size based on the XML form font sizes
*/
.witform-layout .wit-font-size-large > .mru-identity-picker {
  height: 26px;
}

.witform-layout .wit-font-size-large .mru-identity-picker .img-container {
  padding-top: 4px;
}

.witform-layout .wit-font-size-xlarge > .mru-identity-picker {
  height: 34px;
}

.witform-layout .wit-font-size-xlarge .mru-identity-picker .img-container {
  padding-top: 8px;
}

.witform-layout .wit-font-size-xxlarge > .mru-identity-picker {
  height: 50px;
}

.witform-layout .wit-font-size-xxlarge .mru-identity-picker .img-container {
  padding-top: 16px;
}

.witform-layout .work-item-form-coreContent-controls-container input {
  font-size: 12px;
}

.witform-layout .work-item-form-tags {
  max-height: 85px;
  overflow-y: auto;
  float: left;
}

.witform-layout .work-item-form-tags .tags-items-container ul > li {
  float: left;
}

.witform-layout .work-item-form-tags .tags-items-container .bowtie-icon {
  font-size: 12px;
}

.witform-layout .work-item-form-tabs {
  margin-right: 17px;
  bottom: 0;
  margin-left: auto;
}

.witform-layout .work-item-form-tabs > ul {
  padding: 0;
  margin: 2px 0px 0px 0px;
  border-left:  2px solid;
  border-left-color: rgba( 234, 234, 234 ,  1 );
  border-left-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  border-top:  1px solid;
  border-top-color: rgba( 234, 234, 234 ,  1 );
  border-top-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.witform-layout .work-item-form-tab {
  display: inline-block;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  margin-left: -1px;
  font-size: 12px;
  margin-bottom: -1px;
  padding-top: 6px;
  padding-bottom: 6px;
  cursor: pointer;
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  border-right:  1px solid;
  border-right-color: rgba( 234, 234, 234 ,  1 );
  border-right-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  height: 32px;
  outline: none;
  overflow: hidden;
  vertical-align: top;
  padding: 6px 10px;
  margin-right: 1px;
}

.witform-layout .work-item-form-tab.icon-tab {
  padding: 6px 3px;
}

.witform-layout .work-item-form-tabs-toolbar {
  border-right:  1px solid;
  border-right-color: rgba( 234, 234, 234 ,  1 );
  border-right-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.witform-layout .work-item-form-tab:hover {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.witform-layout .work-item-form-tab:focus {
  background-color: rgba( 199, 224, 244 ,  1 );
  background-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 );
}

.witform-layout .selected-tab.work-item-form-tab:focus {
  outline: 1px solid rgba(0, 120, 212, 1);
  outline: 1px solid var(--communication-background,rgba(0, 120, 212, 1));
  outline-offset: -1px;
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
}

.witform-layout .selected-tab.work-item-form-tab:focus:first {
  padding-left: 21px;
}

.witform-layout .selected-tab.work-item-form-tab:focus.icon-tab {
  padding-left: 3px;
}

.witform-layout .selected-tab.work-item-form-tab:hover,
.witform-layout .selected-tab.work-item-form-tab:focus {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.new-work-item-view .witform-layout .control .workitemlabel.label-control {
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.new-work-item-view .witform-layout .workitemcontrol .combo.invalid {
  background-color: transparent;
}

.new-work-item-view .witform-layout .workitemcontrol .combo.invalid > div.wrap {
  background-color: transparent;
}

.new-work-item-view .witform-layout .workitemcontrol .combo.invalid > div.wrap input {
  background-color: transparent;
}

.new-work-item-view .witform-layout .workitemcontrol .read-only-field-icon + .workitem-classification-picker.tree-picker-container.readonly {
  margin-left: 15px;
  width: calc(100% - 18px);
}

.new-work-item-view .witform-layout .workitemcontrol .read-only-field-icon + .workitem-classification-picker.tree-picker-container.readonly .tree-picker-input, .new-work-item-view .witform-layout .workitemcontrol .read-only-field-icon + .workitem-classification-picker.tree-picker-container.readonly .treepicker-item-title-input {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container {
  height: 25px;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container.readonly .tree-picker-input, .new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container.readonly .treepicker-item-title-input {
  cursor: default;
  background: none;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-label {
  display: none;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container:not(.readonly) .tree-picker-combo:focus, .new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container:not(.readonly) .tree-picker-combo.tree-picker-combo--editing {
  border: 1px solid rgba(0, 120, 212, 1);
  border: 1px solid var(--communication-background,rgba(0, 120, 212, 1));
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container:not(.readonly) .tree-picker-combo:hover:not(.tree-picker-combo--editing) {
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container.invalid .tree-picker-combo {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo {
  border: 1px solid transparent;
  background: transparent;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo .tree-picker-content {
  padding: 0 0 1px 2px;
  height: 22px;
  font-size: 14px;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo .tree-picker-content .treepicker-item {
  line-height: 1.5em;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo:focus, .new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo.tree-picker-combo--editing, .new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo:hover {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo:focus .tree-picker-dropdown-button, .new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo.tree-picker-combo--editing .tree-picker-dropdown-button, .new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo:hover .tree-picker-dropdown-button {
  visibility: visible;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo .tree-picker-dropdown-button {
  visibility: hidden;
  height: 22px;
  width: 22px;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo .tree-picker-dropdown-button i {
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
}

.new-work-item-view .witform-layout .workitemcontrol .workitem-classification-picker.tree-picker-container .tree-picker-combo .tree-picker-dropdown-button:hover {
  background: none;
}

.new-work-item-view .witform-layout .work-item-form-tab span.page-button {
  text-decoration: none;
  height: 18px;
  max-width: 300px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.witform-layout .work-item-form-tab span.icon {
  height: 16px;
  margin: 0 0 0 12px;
}

.witform-layout .work-item-form-tab span.icon-tab {
  margin-right: 12px;
}

.witform-layout .work-item-form-tab a.link-count,
.witform-layout .work-item-form-tab a.attachment-count {
  text-decoration: none;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.witform-layout .work-item-form-tab.selected-tab a.link-count,
.witform-layout .work-item-form-tab.selected-tab a.attachment-count {
  color: rgba(0, 120, 212, 1);
  color: var(--communication-background,rgba(0, 120, 212, 1));
}

.witform-layout .work-item-form-tab.selected-tab {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border-bottom:  1px solid;
  border-bottom-color: rgba( 255, 255, 255 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.witform-layout .work-item-form-tab.selected-tab span,
.witform-layout .work-item-form-tab.selected-tab a {
  color: rgba(0, 120, 212, 1);
  color: var(--communication-background,rgba(0, 120, 212, 1));
  text-decoration: none;
}

@media screen and (-ms-high-contrast: active) {
  .selected-tab {
    background-color: Highlight !important;
    border-color: Highlight !important;
    -ms-high-contrast-adjust: none;
  }
  .selected-tab span, .selected-tab a {
    color: HighlightText !important;
  }
}

.witform-layout .work-item-form-tabs-toolbar {
  display: inline-block;
  margin-bottom: -4px;
  margin-left: -1px;
  height: 32px;
  overflow: hidden;
}

.witform-layout .work-item-form-tabs-toolbar ul.menu-bar {
  display: inline-block;
  list-style-type: none;
  list-style: none;
  margin-top: 0;
}

.witform-layout .work-item-form-tabs-toolbar ul.menu-bar .menu-item {
  height: 30px;
  padding-top: 7px;
}

.witform-layout .combo > div.wrap.disabled {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.witform-layout .work-item-form-main-core .combo > div.wrap.disabled {
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
}

.work-item-form-main .combo input,
.work-item-form-main .mru-identity-picker input {
  font-size: 14px;
}

.work-item-form-main .work-item-form-title .combo > div.wrap {
  height: 1.7em;
}

.work-item-form-main .work-item-form-title .combo input {
  font-size: 18px;
}

.work-item-form-main .work-item-form-title .read-only-icon-span {
  margin-top: 9px;
}

.work-item-form-main .work-item-form-title .read-only-field-icon + .combo.readonly {
  margin-left: 15px;
  width: calc(100% - 18px);
}

.work-item-form-main .mru-identity-picker div.img-container {
  padding-top: 2px;
}

/* Used to hide a control on the work item form.  This ensures
 * that the horizontal space the control takes up does not go away
 * when the control is collapsed.  Only the vertical space goes away.
 */
.control.collapsed > td > * {
  height: 0px;
  overflow: hidden;
}

.control.collapsed > td {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
}

.work-item-form-main-header {
  border-left: 10px solid transparent;
  flex: 0 0 auto;
}

.work-item-form-main span.caption {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.work-item-form-main .info-text {
  white-space: nowrap;
}

.work-item-form-main-captionheader {
  font-family: "Segoe UI", "-apple-system", BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight: 300;
  font-size: 14px;
  width: 100%;
  white-space: nowrap;
  padding-bottom: 5px;
  padding-left: 10px;
}

.work-item-form-main .invalid .info-text {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.work-item-form-main {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.work-item-form-main a:not(.ms-Button) {
  text-decoration: none;
  cursor: pointer;
}

.work-item-form-main a:not(.ms-Button):hover {
  text-decoration: underline;
}

.work-item-form-main a:not(.ms-Button), .work-item-form-main a:not(.ms-Button):hover, .work-item-form-main a:not(.ms-Button):visited, .work-item-form-main a:not(.ms-Button):active {
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
}

.work-item-form-main .drop-target-container {
  pointer-events: none;
}

.work-item-form-main .label-text-control {
  white-space: normal;
}

.work-item-form-main .combo,
.work-item-form-main .mru-identity-picker,
.work-item-form.work-item-form-main .identity-picker-container {
  border: 1px solid transparent;
  height: 2.0em;
}

.work-item-form-main .combo input,
.work-item-form-main .mru-identity-picker input {
  text-overflow: ellipsis;
}

.work-item-form .work-item-view .identity-picker-container .identity-picker-search-box .identity-picker-resolved.identity-picker-resolved-single-search .identity-picker-resolved-close {
  display: none !important;
  /* this is a hack to hide the close icon in identity picker. !important is needed because the icon is displayed from javascript in runtime */
}

.work-item-form .identity-picker-container .identity-picker-search-box .identity-picker-search-drop-icon {
  visibility: visible;
}

.work-item-form.work-item-form-main .combo .drop,
.work-item-form.work-item-form-main .mru-identity-picker .drop,
.work-item-form.work-item-form-main .identity-picker-container .identity-picker-search-box .identity-picker-search-drop-icon {
  visibility: hidden;
}

.work-item-form .identity-picker-container .identity-picker-search-box .identity-picker-resolved:focus {
  background-color: transparent;
}

.work-item-form-main .combo.drop .wrap,
.work-item-form-main .mru-identity-picker.drop .wrap {
  right: 0;
}

.work-item-form-main .work-item-control.identity-picker-container {
  padding: 0;
  margin-bottom: 2px;
  padding-top: 1px;
  padding-left: 3px;
}

.work-item-form-main .work-item-control.identity-picker-container:not(.readonly) {
  margin-left: 1px;
  width: calc(100% - 4px);
}

.work-item-form-main .work-item-control.identity-picker-container.readonly .identity-picker-search-box.readonly {
  width: calc(100% - 17px);
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.work-item-form-main .work-item-control .read-only-field-icon {
  padding-right: 2px;
  float: left;
  cursor: default;
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.work-item-form-main span.read-only-icon-span {
  margin-left: 0px;
  margin-top: 4px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-size: 13px;
}

.work-item-form-main .work-item-control.identity-picker-container .identity-picker-resolved {
  font-size: 14px;
  line-height: 18px;
  width: 100% !important;
  /* override the width calculated via javascript for the control */
}

.work-item-form-main .work-item-control.identity-picker-container.readonly .identity-picker-resolved {
  width: calc(100% - 21px) !important;
}

.work-item-form-main .work-item-control.identity-picker-container .read-only-field-icon .read-only-icon-span {
  margin-top: 2px;
  margin-left: 0px;
}

.work-item-form-main .work-item-form-main-core .work-item-control.identity-picker-container {
  padding-left: 0px;
}

.work-item-form-main .work-item-form-headerContent .work-item-control.identity-picker-container {
  padding-left: 0px;
}

.work-item-form-main .work-item-form-headerContent .work-item-control.identity-picker-container .read-only-field-icon .read-only-icon-span {
  margin-left: -1px;
}

.work-item-form-main .work-item-control.identity-picker-container .identity-picker-input {
  font-size: 14px;
  line-height: 18px;
  height: 20px;
  background-color: transparent;
}

.work-item-form.work-item-form-main .identity-picker-container .identity-picker-resolved img {
  height: 18px;
  width: 18px;
}

.old-work-item-view .identity-picker-container.invalid {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.work-item-form-main .combo:hover:not(.readonly), .work-item-form-main .mru-identity-picker:hover:not(.readonly), .work-item-form-main .identity-picker-container:hover:not(.readonly) {
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.work-item-form-main .combo.focus:not(.readonly), .work-item-form-main .combo:focus:not(.readonly), .work-item-form-main .mru-identity-picker.focus:not(.readonly), .work-item-form-main .mru-identity-picker:focus:not(.readonly), .work-item-form-main .identity-picker-container.focus:not(.readonly), .work-item-form-main .identity-picker-container:focus:not(.readonly) {
  border: 1px solid rgba(0, 120, 212, 1);
  border: 1px solid var(--communication-background,rgba(0, 120, 212, 1));
}

.work-item-form-main .combo.focus, .work-item-form-main .combo:focus, .work-item-form-main .mru-identity-picker.focus, .work-item-form-main .mru-identity-picker:focus, .work-item-form-main .identity-picker-container.focus, .work-item-form-main .identity-picker-container:focus {
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
}

.work-item-form-main .work-item-control.chromeBorder .combo, .work-item-form-main .work-item-control.chromeBorder.identity-picker-container:not(.readonly) {
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.work-item-form-main .work-item-control.chromeBorder .combo.focus:not(.readonly), .work-item-form-main .work-item-control.chromeBorder .combo:focus:not(.readonly), .work-item-form-main .work-item-control.chromeBorder.identity-picker-container:not(.readonly).focus:not(.readonly), .work-item-form-main .work-item-control.chromeBorder.identity-picker-container:not(.readonly):focus:not(.readonly) {
  border: 1px solid rgba(0, 120, 212, 1);
  border: 1px solid var(--communication-background,rgba(0, 120, 212, 1));
}

.work-item-form-main .work-item-control.chromeBorder .combo .identity-picker-resolved, .work-item-form-main .work-item-control.chromeBorder.identity-picker-container:not(.readonly) .identity-picker-resolved {
  height: 21px;
}

.work-item-form-main .work-item-control.chromeBorder .identity-picker-search-box.readonly {
  height: 21px !important;
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.work-item-form-main .work-item-control:not(.chromeBorder) .combo.readonly.focus,
.work-item-form-main .work-item-control:not(.chromeBorder) .combo.readonly:focus,
.work-item-form-main .work-item-control:not(.chromeBorder) .combo.readonly:hover,
.work-item-form-main .work-item-control:not(.chromeBorder) .mru-identity-picker.readonly.focus,
.work-item-form-main .work-item-control:not(.chromeBorder) .mru-identity-picker.readonly:focus,
.work-item-form-main .work-item-control:not(.chromeBorder) .mru-identity-picker.readonly:hover,
.work-item-form-main .work-item-control:not(.chromeBorder) .identity-picker-contianer.readonly.focus,
.work-item-form-main .work-item-control:not(.chromeBorder) .identity-picker-container.readonly.hover,
.work-item-form-main .work-item-control:not(.chromeBorder) .identity-picker-search-box.readonly.focus,
.work-item-form-main .work-item-control:not(.chromeBorder) .identity-picker-search-box.readonly:hover {
  border-color: transparent;
}

.work-item-form.work-item-form-main .combo.focus .drop,
.work-item-form.work-item-form-main .combo:focus .drop,
.work-item-form.work-item-form-main .combo:hover .drop,
.work-item-form.work-item-form-main .work-item-control.chromeBorder .combo .drop,
.work-item-form.work-item-form-main .mru-identity-picker.focus .drop,
.work-item-form.work-item-form-main .mru-identity-picker:focus .drop,
.work-item-form.work-item-form-main .mru-identity-picker:hover .drop,
.work-item-form.work-item-form-main .identity-picker-container.focus:not(.readonly) .identity-picker-search-box .identity-picker-search-drop-icon,
.work-item-form.work-item-form-main .identity-picker-container:not(.readonly):hover .identity-picker-search-box .identity-picker-search-drop-icon,
.work-item-form.work-item-form-main .work-item-control.chromeBorder .identity-picker-container .identity-picker-search-box .identity-picker-search-drop-icon {
  visibility: visible;
}

.work-item-form-main .combo.drop.focus .wrap,
.work-item-form-main .combo.drop:focus .wrap,
.work-item-form-main .combo.drop:hover .wrap,
.work-item-form-main .mru-identity-picker.drop.focus .wrap,
.work-item-form-main .mru-identity-picker.drop:focus .wrap,
.work-item-form-main .mru-identity-picker.drop:hover .wrap {
  right: 20px;
}

.work-item-form-headerContent {
  padding-left: 10px;
  width: 100%;
}

.work-item-control {
  display: inline-block;
  padding-bottom: 5px;
}

.work-item-control .plaintextcontrol {
  outline: none;
}

.work-item-control input[type="checkbox"] {
  margin-left: 0;
  margin-bottom: 6px;
}

.work-item-control .toggle-control label {
  padding: 0px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .label-control {
  display: none;
}

.work-item-form-main .identity-picker-readonly .identity-picker-resolved-name {
  color: inherit;
}

.work-item-form-main .identity-picker-readonly .identity-picker-watermark-name {
  color: inherit;
}

.label-control {
  padding-bottom: 1px;
  padding-right: 6px;
  padding-left: 4px;
}

.work-item-form-withblock-floatright {
  display: inline-block;
  min-width: 14%;
  float: right;
  text-align: right;
}

.work-item-form-id {
  font-size: 18px;
  padding-right: 10px;
  float: left;
  line-height: 1.8em;
}

.work-item-form-title {
  font-size: 18px;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  padding-right: 10px;
  width: auto;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

.work-item-form-title combo {
  height: 32px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .copy-workitem-title-container {
  position: absolute;
  top: 1px;
  right: 11px;
  width: 34px;
  height: 34px;
  padding-top: 7px;
  border: 2px solid transparent;
  outline: none;
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .work-item-form-title.copy-hover ~ .copy-workitem-title-container,
.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .work-item-form-title.copy-focus ~ .copy-workitem-title-container {
  background-color: rgba( 200, 200, 200 ,  1 );
  background-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .copy-workitem-title-container.focus,
.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .copy-workitem-title-container.hover {
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .copy-workitem-title-container.copy-enabled {
  cursor: pointer;
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .copy-workitem-title-container span {
  display: none;
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .work-item-form-title input::-ms-clear {
  display: none;
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .work-item-form-title.copy-hover .combo:not(.invalid) {
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .work-item-form-title.copy-focus .combo:not(.invalid) {
  border: 1px solid rgba(0, 120, 212, 1);
  border: 1px solid var(--communication-background,rgba(0, 120, 212, 1));
}

.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .work-item-form-title.copy-hover .combo input,
.work-item-form-main .work-item-form-main-header .work-item-form-headerContent .work-item-form-title.copy-focus .combo input {
  padding-right: 40px;
}

.work-item-form-main .form-body .control .work-item-control.state-coloring-enabled .state-circle,
.work-item-form-main .work-item-form-main-core .work-item-form-coreContent .work-item-form-state .state-circle,
.wit-state-transition-graph .transition-and-state-container .state-container .state .state-circle,
.work-item-form-main .workitem-history-control .state-circle {
  border-radius: 50%;
  border-width: 1px;
  border-style: solid;
  width: 11px;
  height: 11px;
  margin-top: 7px;
  float: left;
  position: relative;
}

.work-item-form-main .form-body .control .work-item-control.state-coloring-enabled .state-circle {
  margin-top: 7px;
}

.work-item-form-main .form-body .control .work-item-control.state-coloring-enabled .combo {
  margin-left: 15px;
  width: calc(100% - 18px);
}

.work-item-form-main .form-body .control .work-item-control.state-coloring-enabled .combo.readonly {
  margin-left: 30px !important;
  width: calc(100% - 33px) !important;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent .read-only-field-icon + .combo.readonly {
  margin-left: 15px;
  width: auto;
}

.work-item-form-main .workitemcontrol .read-only-field-icon + .combo.readonly input.disabled {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.work-item-form-main .workitemcontrol .combo.readonly input.disabled {
  color: inherit;
}

.work-item-form .read-only-field-icon + .combo.input-text-box.date-time.text.readonly {
  margin-left: 15px;
  width: auto;
}

.work-item-form-main .work-item-form-coreContent .state-coloring-enabled .combo {
  margin-left: 15px;
  width: auto;
}

.work-item-form-main .work-item-form-coreContent .state-coloring-enabled .combo.readonly {
  margin-left: 30px;
}

.work-item-form-main .work-item-form-coreContent .state-coloring-enabled .state-circle {
  margin-left: 1px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container .work-item-form-assignedTo {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  width: 302px;
  /* Account for 2px border so that dropdown aligns with combo */
  max-width: 50%;
  float: left;
  min-width: 120px;
}

.work-item-form-changedby {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  vertical-align: bottom;
  display: block;
  text-align: right;
  font-size: 12px;
}

.work-item-form-changedby .freshness-indicator {
  padding-right: 17px;
}

.work-item-form-changedby {
  padding-bottom: 5px;
}

.work-item-form-changedby input {
  text-align: right;
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  text-overflow: ellipsis;
}

.work-item-form-changedby .combo,
.work-item-form-changedby .combo:hover {
  border: none;
}

.work-item-form-label {
  display: inline-block;
  padding-bottom: 8px;
  padding-right: 6px;
}

.work-item-form-main-core {
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
  border-width: 1px 0px;
  border-style: solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  padding-top: 8px;
}

.work-item-form-coreContent {
  padding-left: 18px;
  padding-top: 0;
}

.work-item-form-coreContent-header {
  padding-top: 16px;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-row1 {
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-row2 {
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container {
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  -webkit-box-flex: 0 1 690px;
  -webkit-flex: 0 1 690px;
  flex: 0 1 690px;
  margin-right: auto;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .workitemcontrol {
  width: calc(100% - 70px);
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .workitemlabel.label-control {
  width: 70px;
  display: inline-block;
  line-height: 13px;
  vertical-align: middle;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .work-item-form-coreContent-stateContainer, .work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .work-item-form-coreContent-reasonContainer {
  display: block;
  -webkit-box-flex: 1 0 180px;
  -webkit-flex: 1 0 180px;
  flex: 1 0 180px;
  max-width: 250px;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .work-item-form-coreContent-areaPathContainer, .work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .work-item-form-coreContent-iterationPathContainer {
  -webkit-box-flex: 1 1 80%;
  -webkit-flex: 1 1 80%;
  flex: 1 1 80%;
  display: block;
  overflow: hidden;
}

.work-item-form-main .work-item-form-main-core.core-left-column-more-space .work-item-form-coreContent-controls-container {
  /* Add 40px for the temporary work around the layout issue with customized fields
     * replacing the reason field. This is temporary. We will replace with proper flexbox implementation
     * in the future
     */
}

.work-item-form-main .work-item-form-main-core.core-left-column-more-space .work-item-form-coreContent-controls-container .work-item-form-coreContent-stateContainer, .work-item-form-main .work-item-form-main-core.core-left-column-more-space .work-item-form-coreContent-controls-container .work-item-form-coreContent-reasonContainer {
  max-width: 290px;
  -webkit-box-flex: 1 0 220px;
  -webkit-flex: 1 0 220px;
  flex: 1 0 220px;
}

.work-item-form-main .work-item-form-main-core.core-left-column-more-space .work-item-form-coreContent-controls-container .work-item-form-coreContent-stateContainer .workitemlabel.label-control, .work-item-form-main .work-item-form-main-core.core-left-column-more-space .work-item-form-coreContent-controls-container .work-item-form-coreContent-reasonContainer .workitemlabel.label-control {
  width: 110px;
}

.work-item-form-main .work-item-form-main-core.core-left-column-more-space .work-item-form-coreContent-controls-container .work-item-form-coreContent-stateContainer .workitemcontrol, .work-item-form-main .work-item-form-main-core.core-left-column-more-space .work-item-form-coreContent-controls-container .work-item-form-coreContent-reasonContainer .workitemcontrol {
  width: calc(100% - 110px);
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container > div {
  display: inline-block;
  margin-right: 10px;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .work-item-form-state,
.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .work-item-form-reason,
.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container .work-item-form-areaIteration {
  margin-left: -3px;
  vertical-align: middle;
  font-size: 12px;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-controls-container input {
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
}

.work-item-form-coreContent .combo {
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
}

.work-item-view .witform-layout .work-item-form-coreContent .combo:not(.readonly).invalid, .work-item-view .witform-layout .work-item-form-coreContent .combo:not(.readonly).focus, .work-item-view .witform-layout .work-item-form-coreContent .combo:not(.readonly):focus, .work-item-view .witform-layout .work-item-form-coreContent .combo:not(.readonly):hover,
.work-item-view .witform-layout .work-item-form-coreContent .combo:not(.readonly):hover input,
.work-item-view .witform-layout .work-item-form-coreContent .combo:not(.readonly) input:focus {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.work-item-form .control .read-only-field-icon + .combo.input-text-box.list.text.readonly {
  margin-left: 15px;
  width: calc(100% - 18px);
}

.work-item-form-coreContent .work-item-form-tags {
  padding-top: 6px;
  padding-bottom: 0;
}

.work-item-form-coreContent .work-item-form-tags > .tfs-tags {
  margin-bottom: 0;
}

.work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container {
  float: left;
  min-height: 35px;
  white-space: nowrap;
  flex: 1 1 auto;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container {
  flex: 0 0 auto;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container,
.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-lastUpdatedContainer {
  overflow: hidden;
  display: block;
  white-space: nowrap;
  margin-left: auto;
}

.work-item-form-main .work-item-form-main-core .work-item-form-coreContent-lastUpdatedWrapper {
  margin-top: 4px;
}

.hub-title > .toolbar.workitem-tool-bar.workitem-header-toolbar,
.work-item-form.work-item-form-main .toolbar {
  float: right;
  width: auto;
  border: none;
  margin-top: 0px;
  margin-right: 8px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar {
  margin: 0px 8px 0px 0px;
  padding: 0;
  height: auto;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu.sub-menu > .menu-item {
  margin: 0;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar:focus {
  outline: none;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar .menu-item {
  border: 1px solid transparent;
  padding: 5px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar .menu-item.focus:not(.disabled):not(:hover) {
  border:  1px solid;
  border-color: rgba( 0, 0, 0 ,  1 );
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar .menu-item.pressed:not(.drop-down-save):not(.drop-down-chevron) {
  border:  1px solid;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar .menu-item.hover > span.icon, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar .menu-item.hover > span.bowtie-icon {
  text-decoration: none;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar .menu-item.menu-item-separator {
  padding: 1px 3px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar .menu-item.save-work-item-menu-item {
  padding-left: 12px;
  padding-right: 12px;
  padding-top: 2px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .menu-bar .menu-item.disabled {
  text-decoration: line-through;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item {
  height: 28px;
  margin: 0px;
  background-color: rgba(0, 120, 212, 1);
  background-color: var(--communication-background,rgba(0, 120, 212, 1));
  color: rgba(255, 255, 255, 1);
  color: var(--text-on-communication-background,rgba(255, 255, 255, 1));
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item:not(.disabled):hover, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item:not(.disabled):hover, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item:not(.disabled).focus, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item:not(.disabled).focus {
  background-color: rgba( 16, 110, 190 ,  1 );
  background-color: rgba( var(--palette-primary-shade-10,16, 110, 190) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item:not(.disabled).focus, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item:not(.disabled).focus {
  border:  1px solid;
  border-color: rgba( 0, 0, 0 ,  1 );
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .disabled.drop-down-save.menu-item, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .disabled.drop-down-chevron.menu-item {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .disabled.focus.drop-down-save.menu-item, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .disabled.focus.drop-down-chevron.menu-item {
  border:  1px solid;
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  outline: none;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .disabled.drop-down-save.menu-item .bowtie-white, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .disabled.drop-down-chevron.menu-item .bowtie-white {
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item .bowtie-white, .work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item .bowtie-white {
  color: rgba(255, 255, 255, 1);
  color: var(--text-on-communication-background,rgba(255, 255, 255, 1));
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item {
  border: none;
  padding: 5px 8px 3px 9px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item.focus {
  padding: 4px 8px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item.save-only {
  padding: 5px 8px 3px;
  margin-right: 2.5px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-save.menu-item.save-only.focus {
  padding: 4px 8px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item {
  width: 22px;
  border: none;
  border-left:  1px solid;
  border-left-color: rgba( 0, 90, 158 ,  1 );
  border-left-color: rgba( var(--palette-primary-shade-20,0, 90, 158) ,  1 );
  padding: 4px;
  margin-right: 2.5px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item.disabled {
  border-left:  1px solid;
  border-left-color: rgba( 234, 234, 234 ,  1 );
  border-left-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item ul {
  min-width: 131px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item li.save-work-item-menu-item {
  color: rgba( 0, 0, 0 ,  1 );
  color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
  padding: 2px 12px 3px 7px !important;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item.focus {
  padding: 3px 4px 3px 3px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-toolbar-container .toolbar .drop-down-chevron.menu-item:not(.disabled).focus {
  border:  1px solid;
  border-color: rgba( 0, 0, 0 ,  1 );
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.work-item-form-main .clearfix {
  clear: both;
}

.toolbar .menu-bar .menu-item.try-new-form .icon + .text, .workitemcontrol .menu-bar .menu-item.try-new-form .icon + .text {
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
  margin-left: 1px;
}

.toolbar .menu-bar .try-new-form span.preview {
  padding-left: 2px;
  font-size: 5px;
  vertical-align: text-top;
}

.toolbar .menu-bar .menu-item.try-new-form.hover span.text {
  text-decoration: underline;
}

.toolbar .menu-bar .menu-item.try-new-form.hover {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.toolbar .menu-bar .menu-item.try-new-form .newform {
  display: inline-block;
  margin-bottom: -2px;
}

/* Only target the old work item form, new form doesn't contain tab-group */
.tab-group .extension-container {
  height: 600px;
}

.external-content-host {
  height: 100%;
}

.work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container .discussion-adornment-container {
  float: left;
  margin: 0px 5px;
  width: auto;
  height: 31px;
}

.work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container .discussion-adornment-container .discussion-adornment-control {
  cursor: pointer;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  font-size: 14px;
  padding: 2px 0px;
  outline: none;
  border: 1px solid transparent;
  width: auto;
}

.work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container .discussion-adornment-container .discussion-adornment-control:focus, .work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container .discussion-adornment-container .discussion-adornment-control:hover {
  text-decoration: underline;
}

.work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container .discussion-adornment-container .discussion-adornment-control:focus {
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
  border:  1px solid;
  border-color: rgba( 102, 102, 102 ,  1 );
  border-color: rgba( var(--palette-neutral-60,102, 102, 102) ,  1 );
}

.work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container .discussion-adornment-container .discussion-adornment-control .text {
  margin-left: 2px;
  margin-right: 10px;
  vertical-align: top;
}

.work-item-form-main .work-item-form-main-header .work-item-form-header-controls-container .discussion-adornment-container .discussion-adornment-control .bowtie-icon {
  margin: 0px 5px;
  color: rgba( 43, 136, 216 ,  1 );
  color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
}

.work-item-form .menu-bar .menu-item.follow-item-menu-item {
  width: 95px;
  text-align: center;
  margin-right: 0px;
}

.work-item-form .menu-bar .menu-item.follow-item-menu-item.focus:not(.disabled):not(:hover) {
  padding: 4px;
  border:  1px solid;
  border-color: rgba( 0, 0, 0 ,  1 );
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.work-item-form .menu-bar .menu-item.follow-item-menu-item .text {
  height: 16px;
  line-height: 16px;
}

.work-item-form .menu-bar .menu-item.follow-item-menu-item-gray {
  width: 95px;
  text-align: center;
  margin-right: 0px;
}

.work-item-form .menu-bar .menu-item.follow-item-menu-item-gray.focus:not(.disabled):not(:hover) {
  padding: 4px;
  border:  1px solid;
  border-color: rgba( 0, 0, 0 ,  1 );
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
}

.work-item-form .menu-bar .menu-item.follow-item-menu-item-gray:not(.hover) {
  background-color: rgba( 239, 239, 239 ,  1 );
  background-color: rgba( var(--palette-neutral-6,239, 239, 239) ,  1 );
}

.work-item-form .menu-bar .menu-item.follow-item-menu-item-gray .text {
  height: 16px;
  line-height: 16px;
}

.work-item-form .menu-bar .menu-item.custom-follow-item-menu-item {
  margin-left: 0;
  border-left:  1px solid;
  border-left-color: rgba( 166, 166, 166 ,  1 ) !important;
  border-left-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 ) !important;
}

.work-item-form .menu-bar .menu-item.custom-follow-item-menu-item:not(.hover) {
  background-color: rgba( 239, 239, 239 ,  1 );
  background-color: rgba( var(--palette-neutral-6,239, 239, 239) ,  1 );
}

.work-item-form .menu-bar .menu-item.custom-follow-item-menu-item.focus:not(.disabled):not(:hover) {
  border:  1px solid;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

img.follows-hotspot-image {
  width: 100%;
}

.work-item-form-notification {
  background-color: rgba(0, 120, 212, 1);
  background-color: var(--communication-background,rgba(0, 120, 212, 1));
  padding: 12px 15px 12px 7px;
  min-width: 200px;
  word-wrap: break-word;
  max-width: 400px;
  max-height: 300px;
  width: auto;
  float: left;
  font-size: 12px;
  color: rgba( 255, 255, 255 ,  1 );
  color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  margin-top: 6px;
  position: absolute;
  z-index: 9999;
  cursor: default;
}

.work-item-form-notification .close-action {
  cursor: pointer;
  font-size: 8px;
  color: rgba( 255, 255, 255 ,  1 );
  color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  position: absolute;
  right: 3px;
  top: 0;
}

.work-item-form-notification .bowtie-watch-eye {
  float: left;
  padding-right: 20px;
}

.work-item-form .try-new-form .bowtie-navigate-forward-disc {
  color: rgba(0, 90, 158, 1) !important;
  color: var(--communication-foreground,rgba(0, 90, 158, 1)) !important;
}

.work-item-form-main .invalid .workitemlabel.label-control,
.new-work-items-view .invalid .workitemlabel.label-control,
.new-workitem-dialog .invalid .workitemlabel.label-control {
  display: flex;
}

.work-item-form-main .invalid .workitemlabel.label-control:after,
.new-work-items-view .invalid .workitemlabel.label-control:after,
.new-workitem-dialog .invalid .workitemlabel.label-control:after {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\EA02";
  font-weight: normal;
  font-style: normal;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-left: 5px;
  font-size: 14px;
}

.work-item-form-main .wit-form-group-header .invalid:after,
.new-work-items-view .wit-form-group-header .invalid:after,
.new-workitem-dialog .wit-form-group-header .invalid:after {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\EA02";
  font-weight: normal;
  font-style: normal;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-left: 5px;
  font-size: 14px;
  position: absolute;
  top: 8px;
}

.work-item-form-main .invalid .info-text-wrapper .info-text:before,
.new-work-items-view .invalid .info-text-wrapper .info-text:before,
.new-workitem-dialog .invalid .info-text-wrapper .info-text:before {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\EA02";
  font-weight: normal;
  font-style: normal;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-right: 5px;
  font-size: 14px;
  font-size: 14px;
}

.work-item-form-main .work-item-form-tab.invalid:after,
.new-work-items-view .work-item-form-tab.invalid:after,
.new-workitem-dialog .work-item-form-tab.invalid:after {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\EA02";
  font-weight: normal;
  font-style: normal;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-left: 5px;
  font-size: 14px;
}

.workitem-classification-picker-dropdown.tree-picker-dropdown {
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  -moz-box-shadow: none !important;
}

.workitem-classification-picker-dropdown.tree-picker-dropdown .tree-list-item {
  height: 24px;
  padding: 0px 6px;
}

.workitem-classification-picker-dropdown.tree-picker-dropdown .tree-list-item.tree-list-group-divider {
  height: 6px;
}

.workitem-classification-picker-dropdown.tree-picker-dropdown .tree-list-item .treepicker-item {
  font-size: 12px;
  line-height: 1.5em;
}

/** Automatically converted from FormGrid.css **/
.form-body {
  width: 100%;
  -webkit-box-flex: 1 1 auto;
  -webkit-flex: 1 1 auto;
  flex: 1 1 auto;
  overflow: auto;
  position: relative;
}

.form-grid {
  position: absolute;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  top: 0;
  bottom: 0;
  left: 0;
  padding-right: 13px;
  outline: none;
}

.form-grid .control {
  padding-left: 1px;
  padding-bottom: 1px;
}

.form-grid .control-extension-container {
  padding-left: 1px;
  padding-bottom: 10px;
}

.form-grid .form-section, .form-grid .bottom-section {
  display: inline-block;
  min-width: 240px;
  float: left;
}

.form-grid .form-section.wide-section {
  min-width: 480px;
}

.form-grid .form-section.last-section {
  float: none;
}

.form-grid .bottom-section.wide-section {
  min-width: 480px;
}

.form-grid .wrapping-container {
  display: inline-block;
  min-width: 240px;
  float: right;
}

.form-grid .work-item-control {
  width: 100%;
  padding-bottom: 2px;
  padding-left: 4px;
}

.form-grid .work-item-control.new-classification-control {
  padding-left: 0;
}

.form-grid .work-item-control.new-classification-control .read-only-field-icon {
  margin-left: 4px;
}

.form-grid .section-container {
  width: 100%;
}

.form-grid .page-extension-container {
  width: 100%;
  height: 100%;
}

/* Start In-Place maximize mode CSS*/
/* Maximize the grid-group */
.workitem-form-grid-maximized-mode .form-grid .grid-group.maximized-grid-group {
  position: absolute;
  right: 10px;
  left: 10px;
  top: 0px;
  bottom: 10px;
  display: block;
  height: auto;
  padding: 0px;
}

/* Put the horizontal line below the header */
.workitem-form-grid-maximized-mode .work-item-form-main-header {
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

/* Hide all grid-groups*/
.workitem-form-grid-maximized-mode .form-grid .grid-group {
  display: none;
}

/* Hide the core section*/
.workitem-form-grid-maximized-mode .work-item-form-main-core {
  display: none;
}

/* Hide the transition graph and tab on history control when maximized*/
.workitem-form-grid-maximized-mode .wit-state-transition-graph-unpinned-container,
.workitem-form-grid-maximized-mode .wit-logcontrol-tabs {
  display: none;
}

.maximized-grid-group .workitemcontrol > div:not(.discussion-control) .richeditor-container,
.maximized-grid-group .webpagecontrol {
  position: absolute;
  bottom: 0px;
  top: 0px;
  right: 0px;
  left: 0px;
  height: auto !important;
}

.maximized-grid-group .discussion-control .richeditor-container {
  position: absolute;
  bottom: 0px;
  top: 0px;
  right: 0px;
  left: 0px;
  height: auto;
}

/* End In-Place maximize mode CSS*/
.form-grid .grid-group .workitem-group-maximize,
.form-grid .grid-group .workitem-group-restore {
  border: none;
  background-color: transparent;
  margin: 0;
  padding: 0;
  height: auto;
  width: auto;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  text-align: initial;
  border-radius: 0;
  position: relative;
  float: right;
  width: 18px;
  text-align: center;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  top: 3px;
  line-height: 1.1em;
  padding-left: 5px;
  padding-right: 18px;
  padding-bottom: 1px;
}

.form-grid .grid-group .workitem-group-maximize::-moz-focus-inner,
.form-grid .grid-group .workitem-group-restore::-moz-focus-inner {
  border: none;
}

.form-grid .grid-group .workitem-group-maximize:hover,
.form-grid .grid-group .workitem-group-restore:hover {
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
}

.form-grid .grid-group .workitem-group-maximize .icon,
.form-grid .grid-group .workitem-group-restore .icon {
  vertical-align: super;
  margin-top: 2px;
}

.form-grid .grid-group {
  padding: 5px 5px 0 14px;
}

.form-grid .ui-tabs-panel {
  /* .ui-tabs-panel is old work item form */
}

.form-grid .ui-tabs-panel .tfs-collapsible-collapse {
  margin-top: 0px;
}

.form-grid .ui-tabs-panel .tfs-collapsible-content {
  padding: 2px 2px 2px 20px;
}

.form-grid .tfs-collapsible-content {
  padding: 0;
}

.form-grid .grid-group .tfs-collapsible-collapse.bowtie-icon,
.form-grid .grid-group .workitem-group-maximize .bowtie-icon {
  display: none;
}

.form-grid .grid-group.collapsed .tfs-collapsible-collapse.bowtie-icon,
.form-grid .grid-group.collapsed .workitem-group-maximize .bowtie-icon, .form-grid .grid-group.focus .tfs-collapsible-collapse.bowtie-icon,
.form-grid .grid-group.focus .workitem-group-maximize .bowtie-icon, .form-grid .grid-group:hover .tfs-collapsible-collapse.bowtie-icon,
.form-grid .grid-group:hover .workitem-group-maximize .bowtie-icon, .form-grid .grid-group:focus .tfs-collapsible-collapse.bowtie-icon,
.form-grid .grid-group:focus .workitem-group-maximize .bowtie-icon {
  display: inline-block;
}

.form-grid .tfs-collapsible-header {
  border: none;
  padding: 5.8px 1px;
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  margin-bottom: 5px;
  margin-left: 4px;
  font-size: 16px;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  font-weight: 600;
  -moz-user-select: -moz-none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.form-grid .tfs-collapsible-header.focus {
  border: none;
  background-color: transparent;
  border-bottom:  1px solid;
  border-bottom-color: rgba( 199, 224, 244 ,  1 );
  border-bottom-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 );
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
}

.form-grid .tfs-collapsible-header .tfs-collapsible-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  display: block;
}

.form-grid .tfs-collapsible-header .tfs-collapsible-collapse {
  float: right;
  margin-top: 7px;
}

.form-grid .tfs-collapsible-header.wit-form-group-header {
  display: flex;
  height: 36px;
}

.form-grid .tfs-collapsible-header.wit-form-group-header .tfs-collapsible-text {
  flex: 1;
  width: 100%;
  outline: none;
}

.form-grid .tfs-collapsible-header.wit-form-group-header .workitem-group-maximize,
.form-grid .tfs-collapsible-header.wit-form-group-header .tfs-collapsible-collapse {
  float: none;
}

.form-grid .workitemlogcontrol .tfs-collapsible-collapse {
  float: none;
  margin-top: 0px;
}

.form-grid .workitemlogcontrol .tfs-collapsible-content {
  padding: 2px 2px 2px 20px;
}

.form-grid .workitemlogcontrol .tfs-collapsible-header {
  border: none;
  margin: 0;
  font-size: inherit;
  color: inherit;
}

.form-grid .workitemlogcontrol .tfs-collapsible-header.focus {
  background-color: none;
  border: none;
}

.form-grid .work-item-control .toolbar {
  float: left;
}

.form-grid .combo,
.form-grid .mru-identity-picker {
  margin-left: -4px;
  -webkit-margin-start: -3px;
}

.form-grid .combo:hover {
  margin-left: -4px;
  -webkit-margin-start: -3px;
}

.form-grid .group-extension-container {
  height: 100%;
  overflow: hidden;
}

.form-grid > .external-content-host .external-content-iframe {
  display: block;
}

/* Hide no artifacts message by default */
.wiform-related-artifacts-header .no-artifacts-message-container {
  display: none;
}

/* Show, if there are not artifacts */
.wiform-related-artifacts-header .no-artifacts.no-artifacts-message-container {
  display: block;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

/* Error container */
.wiform-related-artifacts-header .ra-no-error-container {
  display: none;
}

.wiform-related-artifacts-header .ra-error-container {
  display: inline-block;
}

.wiform-related-artifacts-header .ra-error-text {
  display: inline-block;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  vertical-align: middle;
}

.wiform-related-artifacts-header .ra-error-icon {
  display: inline-block;
  padding-right: 20px;
  vertical-align: middle;
}

.plaintextcontrol {
  width: 100%;
  resize: none;
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

textarea.plaintextcontrol[readonly] {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.work-item-view.new-work-item-view .richeditor-editarea {
  padding-right: 0.5px;
}

.work-item-control .zero-data-read-only-label {
  font-size: 14px;
}

.work-item-control.html-editor-container {
  overflow: hidden;
}

.longtext-preview-container {
  position: relative;
}

.longtext-preview-container .longtext-container {
  height: 60px;
  width: calc(100% - 29px);
  display: inline-block;
  color: rgba(0, 0, 0, 0.9);
  color: var(--component-htmlEditor-foreground-color,rgba(0, 0, 0, 0.9));
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--component-htmlEditor-background-color,rgba(255, 255, 255, 1));
}

.longtext-preview-container .longtext-container.invalid {
  border:  1px solid;
  border-color: rgba( 168, 0, 0 ,  1 );
  border-color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.longtext-preview-container .longtext-container pre {
  font-family: inherit;
  margin: 0px;
  height: 60px;
  overflow: hidden;
  white-space: pre-wrap;
  word-wrap: break-word;
}

.longtext-preview-container .chevron {
  border: none;
  background-color: transparent;
  margin: 0;
  padding: 0;
  height: auto;
  width: auto;
  box-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  text-align: initial;
  border-radius: 0;
  float: right;
  height: 14px;
  width: 14px;
  margin-top: 23px;
  color: rgba( 102, 102, 102 ,  1 );
  color: rgba( var(--palette-neutral-60,102, 102, 102) ,  1 );
}

.longtext-preview-container .overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 29px;
  bottom: 0;
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 60%, white 90%, white 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 60%, white 90%, white 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 60%, white 90%, white 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.longtext-preview-container .watermark-text {
  font-style: italic;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

/** Automatically converted from HistoryControl.css **/
.workitemlogcontrol {
  width: 100%;
  margin: 0;
  border: 0;
  min-height: 300px;
}

.workitemlogcontrol .ui-tabs-nav {
  font-size: 11px;
  text-transform: uppercase;
}

/* We need to reset here for case where <a>'s href is strippped. We do not want this
   to look like a real link. However, global styles will make it look like a link so we
    reset here and then only apply to <a>'s that have hrefs.  See bug 823626  */
.workitemlogcontrol A {
  text-decoration: none;
  color: rgba( 0, 0, 0 ,  1 );
  color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
  cursor: default;
}

.workitemlogcontrol A[href] {
  color: rgba(0, 120, 212, 1);
  color: var(--communication-background,rgba(0, 120, 212, 1));
  text-decoration: none;
  cursor: pointer;
}

.workitemlogcontrol A[href]:hover {
  color: rgba(0, 120, 212, 1);
  color: var(--communication-background,rgba(0, 120, 212, 1));
  text-decoration: none;
  cursor: pointer;
}

.workitemlogcontrol .show-more-container {
  padding-bottom: 8px;
  padding-top: 8px;
  padding-left: 5px;
}

.workitemlogcontrol A.show-more-link {
  cursor: pointer;
  /* Override ".workitemlogcontrol A" */
  color: rgba(0, 120, 212, 1);
  color: var(--communication-background,rgba(0, 120, 212, 1));
}

.workitemlogcontrol A.show-more-link:hover {
  /* Override ".workitemlogcontrol A" */
  text-decoration: underline;
}

.workitemlogcontrol .show-more-span {
  color: rgba( 102, 102, 102 ,  1 );
  color: rgba( var(--palette-neutral-60,102, 102, 102) ,  1 );
  margin-left: 4px;
}

.workitemlogcontrol .control-loading-overlay {
  position: absolute;
  top: 0px;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  padding-top: 30px;
  filter: alpha(opacity=85);
  opacity: 0.85;
  z-index: 10000;
}

.workitemlogcontrol .control-loading-overlay .status-indicator td {
  vertical-align: top;
}

.workitemlogcontrol .readonly-content-container {
  position: relative;
}

.details-host {
  overflow: auto;
}

.discussion-host {
  overflow: auto;
}

.discussion-host .message-list {
  list-style-type: none;
  margin-left: 0;
  padding: 0;
  margin-bottom: 0;
}

.discussion-host .message-row {
  position: relative;
  list-style-type: none;
  padding: 0 0 5px 0;
  min-height: 40px;
  clear: both;
}

.discussion-host .message-section {
  margin: 0 0 0 50px;
}

.discussion-host .message-sender {
  position: absolute;
  left: 0;
  top: 0;
  width: 40px;
  height: 32px;
  margin: 0 0 0 2px;
}

.discussion-host .message-sendername {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.discussion-host .message-date {
  font-size: 85%;
  font-style: italic;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.discussion-host .message-content p:only-child {
  margin-top: 0;
  margin-bottom: 0;
}

.discussion-host .identity-picture {
  width: 32px;
  height: 32px;
}

.details-host .action-hover {
  /* background-color: $white; */
}

.details-host .action-expand {
  /* background-color: $neutral-8; */
}

.details-host > .item {
  margin-bottom: 0.2em;
}

.details-host .identity-picture {
  width: 24px;
  height: 24px;
  margin-right: 5px;
}

.details-host .action-headerperson {
  padding-right: 5px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.details-host .action-headeritemhilite {
  font-weight: bold;
}

.details-host .action-headeritem {
  font-style: italic;
}

.details-host .action-headerdate {
  padding-left: 10px;
  font-style: italic;
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.details-host .message {
  padding: 5px;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  border: 1px solid transparent;
  /* todo: remove */
  margin: 2px 0 2px 0;
}

.details-host .container {
  padding: 2px;
}

.details-host .detail-list {
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  table-layout: fixed;
  border-collapse: collapse;
  /* width: 100%; */
}

.details-host .detail-list TD {
  overflow: auto;
  padding: 4px;
  padding-right: 10px;
  border-right:  1px solid;
  border-right-color: rgba( 255, 255, 255 ,  1 );
  border-right-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border-left:  1px solid;
  border-left-color: rgba( 255, 255, 255 ,  1 );
  border-left-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  color: rgba( 0, 0, 0 ,  1 );
  color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
  /* override the styling for deleted row*/
}

/* Header row styling for work item history revision table */
.details-host .field-table .detail-list tr:first-child TD {
  background: rgba( 222, 236, 249 ,  1 );
  background: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  font-weight: bold;
  border-top:  1px solid;
  border-top-color: rgba( 244, 244, 244 ,  1 );
  border-top-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

/* Style for 'Old Value' column in work item field table of work item history  */
.details-host .field-table .detail-list tr:not(:first-child) TD:nth-child(3) {
  font-style: italic;
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.details-host .detail-list tr.link-attachment-deleted {
  text-decoration: line-through;
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.details-host .links-and-attachment-table .detail-list td {
  border-top:  1px solid;
  border-top-color: rgba( 234, 234, 234 ,  1 );
  border-top-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.workitemcontrol .workitem-history-control {
  display: flex;
}

.workitemcontrol .workitem-history-control .history-revision-list {
  width: 40%;
  min-height: 120px;
  min-width: 15%;
  overflow: auto;
}

.workitemcontrol .workitem-history-control .history-revision-list.single-column {
  width: 100%;
  -webkit-overflow-scrolling: touch;
  overflow: visible;
}

.workitemcontrol .workitem-history-control .history-revision-list.single-column .history-item-list {
  border: none;
}

.workitemcontrol .workitem-history-control .history-revision-list.single-column .history-item-list .history-item-summary:hover {
  background-color: unset;
}

.workitemcontrol .workitem-history-control .history-revision-list.single-column .history-item-summary-icon {
  margin-left: 15px;
}

.workitemcontrol .workitem-history-control .history-revision-list.single-column .history-item-summary-details {
  left: 60px;
  right: 15px;
}

.workitemcontrol .workitem-history-control .history-revision-list .show-more {
  margin-left: 10px;
  margin-top: 12px;
}

.workitemcontrol .workitem-history-control .history-revision-list .show-more .show-more-count {
  margin-left: 4px;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list {
  border-left:  1px solid;
  border-left-color: rgba( 234, 234, 234 ,  1 );
  border-left-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-group {
  height: 40px;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-group .header {
  display: block;
  background-color: rgba( 248, 248, 248 ,  1 );
  background-color: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
  border-width: 1px 0px;
  border-style: solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  padding: 10px 8px;
  cursor: default;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-group .header-selected {
  background-color: rgba(150, 175, 200, 0.5);
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-group span {
  line-height: initial;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary:hover {
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-selected {
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary {
  height: 57px;
  position: relative;
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  cursor: default;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-icon {
  float: left;
  margin-top: 10px;
  margin-bottom: 10px;
  margin-left: 10px;
  margin-right: 8px;
  height: 36px;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-icon .history-identity-icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details {
  position: absolute;
  left: 55px;
  top: 10px;
  right: 10px;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-item-summary-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  height: 20px;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-item-summary-row .history-tooltiphost-container {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-item-summary-row.right {
  justify-content: right;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-item-summary-text {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  font-size: 14px;
  max-width: 100%;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-item-comment-text {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-size: 12px;
  max-width: 100%;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-status-icons-container {
  align-self: flex-end;
  height: 23px;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-status-icons-container .bowtie-icon {
  margin-left: 5px;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-status-icons-container .state-circle {
  display: inline-block;
  float: none;
  margin-left: 5px;
  margin-top: 0px;
  margin-right: 1px;
  vertical-align: middle;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list .history-item-summary .history-item-summary-details .history-item-summary-date {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-size: 12px;
  align-self: flex-end;
  white-space: nowrap;
  height: 20px;
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list.focused .history-item-summary.history-item-selected {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.workitemcontrol .workitem-history-control .history-revision-list .history-item-list.focused .history-item-summary:hover {
  background-color: rgba( 239, 246, 252 ,  1 );
  background-color: rgba( var(--palette-primary-tint-40,239, 246, 252) ,  1 );
}

.workitemcontrol .workitem-history-control #history-splitter {
  margin-left: 1px;
  margin-right: 2px;
  width: 1px;
  border-right:  1px solid;
  border-right-color: rgba( 200, 200, 200 ,  1 );
  border-right-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.workitemcontrol .workitem-history-control * {
  outline: none;
}

.is-focusVisible .workitem-history-control img.history-focus-outline:focus,
.is-focusVisible .workitem-history-control span.history-focus-outline:focus {
  outline: 1px solid rgba( 102, 102, 102 ,  1 ) !important;
  outline: 1px solid rgba( var(--palette-neutral-60,102, 102, 102) ,  1 ) !important;
}

.is-focusVisible .workitem-history-control .history-details-panel *:focus {
  position: relative;
}

.is-focusVisible .workitem-history-control .history-details-panel *:focus::after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  border:  1px solid;
  border-color: rgba( 102, 102, 102 ,  1 );
  border-color: rgba( var(--palette-neutral-60,102, 102, 102) ,  1 );
}

.fullscreen-container .history-details-panel,
.workitemcontrol .workitem-history-control .history-details-panel {
  width: calc(60% - 5px);
  overflow-y: auto;
  overflow-x: auto;
  min-height: 120px;
  min-width: calc(15% - 5px);
  /* 5px for width of the splitter */
}

.fullscreen-container .history-details-panel.single-column,
.workitemcontrol .workitem-history-control .history-details-panel.single-column {
  width: 100%;
  height: 100%;
  float: none;
  min-width: unset;
  margin-top: 6px;
  -webkit-overflow-scrolling: touch;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header {
  padding-top: 4px;
  outline: none;
  width: 100%;
  display: inline-block;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container {
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  padding-left: 10px;
  padding-bottom: 10px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-left,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-left {
  float: left;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-left .history-image-icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-left .history-image-icon {
  width: 36px;
  height: 36px;
  cursor: pointer;
  border-radius: 50%;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-left .history-image-icon.not-clickable,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-left .history-image-icon.not-clickable {
  cursor: default;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right {
  margin-left: 44px;
  max-height: 36px;
  padding-right: 10px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-summary-text,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-summary-text {
  position: relative;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  font-size: 14px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-top: 4px;
  bottom: 5px;
  display: inline-block;
  max-width: 100%;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-summary-text .state-circle,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-summary-text .state-circle {
  float: none;
  display: inline-block;
  margin-right: 3px;
  margin-top: 0px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-summary-revision,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-summary-revision {
  float: right;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  font-size: 14px;
  display: inline-block;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container {
  display: inline-block;
  width: 100%;
  position: relative;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-date,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-date {
  float: right;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-size: 12px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-changed-by, .fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-authorized-by,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-changed-by,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-authorized-by {
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 360px;
  white-space: nowrap;
  margin-top: -2px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-changed-by.clickable, .fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-authorized-by.clickable,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-changed-by.clickable,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-authorized-by.clickable {
  cursor: pointer;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name {
  float: left;
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: -2px;
  white-space: nowrap;
  position: absolute;
  left: 0px;
  right: 0px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-via-text, .fullscreen-container .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-end,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-via-text,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-viewer-header .history-item-viewer-header-container .history-item-viewer-right .history-item-viewer-right-container .history-item-name-end {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail {
  display: block;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 20px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links {
  white-space: nowrap;
  font-size: 14px;
  margin-bottom: 20px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .links-title,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .links-title {
  font-size: 16px;
  font-weight: 600;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link {
  margin-top: 9px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-display-name,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-display-name {
  display: inline-block;
  margin-left: 3px;
  vertical-align: middle;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .icon.prefix-icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .icon.prefix-icon {
  margin-right: 3px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-text, .fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-text,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status {
  margin-left: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(100% - 120px);
  white-space: normal;
  display: inline-block;
  vertical-align: middle;
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-text a, .fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status a,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-text a,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status a {
  color: rgba( 16, 110, 190 ,  1 );
  color: rgba( var(--palette-primary-shade-10,16, 110, 190) ,  1 );
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status {
  margin-left: 5px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status.link-status-pending,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status.link-status-pending {
  background-color: rgba( 16, 124, 16 ,  1 );
  background-color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status.link-status-failed,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-status.link-status-failed {
  background-color: rgba( 249, 235, 235 ,  1 );
  background-color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-text .remote-link-text,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link .link-text .remote-link-text {
  padding: 0 10px 0 3px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link-add .link-text,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link-add .link-text {
  background-color: rgba( 223, 246, 221 ,  1 );
  background-color: rgba( var(--palette-accent2-light,223, 246, 221) ,  1 );
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-links .link-delete .link-text,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-links .link-delete .link-text {
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  text-decoration: line-through;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container {
  margin-bottom: 25px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .new-comment,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .new-comment {
  padding-bottom: 5px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .comment-arrow,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .comment-arrow {
  display: inline-block;
  vertical-align: middle;
  border-top:  29px solid;
  border-top-color: rgba( 244, 244, 244 ,  1 );
  border-top-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  border-left: 29px solid rgba(255, 255, 255, 1);
  border-left: 29px solid var(--background-color,rgba(255, 255, 255, 1));
}

@media screen and (-ms-high-contrast: active) {
  .fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .comment-arrow,
  .workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .comment-arrow {
    display: none;
  }
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment {
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  max-width: calc(100% - 39px);
  /*comment-arrow width + margin-right */
  padding-left: 14px;
  padding-right: 14px;
  padding-top: 21px;
  padding-bottom: 21px;
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  font-size: 14px;
  display: inline-block;
  border-radius: 5px;
  margin-right: 10px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  word-wrap: break-word;
  font-size: 14px;
  width: 100%;
  word-wrap: break-word;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment > *:first-child:not(.bolt-table),
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment > *:first-child:not(.bolt-table) {
  margin-top: 0px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment > *:last-child:not(.bolt-table),
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment > *:last-child:not(.bolt-table) {
  margin-bottom: 0px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table),
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table) {
  margin-top: 10px;
  margin-bottom: 10px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table).metadata-yaml-table,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table).metadata-yaml-table {
  font-size: 12px;
  line-height: 1;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table) th,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table) th {
  border-style: solid;
  border-width: thin;
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  padding: 8px 10px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table) td,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table) td {
  border-style: solid;
  border-width: thin;
  border-color: rgba( 166, 166, 166 ,  1 );
  border-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  padding: 8px 10px;
  min-width: 50px;
  max-width: 1000px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table) tr:nth-child(even),
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment table:not(.bolt-table) tr:nth-child(even) {
  background: rgba( 248, 248, 248 ,  1 );
  background: rgba( var(--palette-neutral-2,248, 248, 248) ,  1 );
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment code,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment code {
  font-family: Menlo, Consolas, Courier New, monospace;
  font-size: 12px;
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  padding: 2px 4px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment pre,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment pre {
  white-space: pre;
  word-wrap: normal;
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  padding: 15px;
  overflow-x: auto;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment pre code,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment pre code {
  padding: 0px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment blockquote,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment blockquote {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  border-left:  solid;
  border-left-color: rgba( 166, 166, 166 ,  1 ) 3px;
  border-left-color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 ) 3px;
  padding-left: 15px;
  margin-left: 0px;
  margin-top: 12px;
  margin-bottom: 12px;
  padding-bottom: 1px;
  padding-top: 1px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment blockquote > p,
.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment blockquote ol,
.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment blockquote ul,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment blockquote > p,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment blockquote ol,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment blockquote ul {
  margin: 4px 0;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment img,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment img {
  max-width: 100%;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment ul,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment ul {
  padding-left: 20px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment ul li.task-list-item,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment ul li.task-list-item {
  list-style-type: none;
  margin-left: -20px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment ol,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment ol {
  padding-left: 25px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment li,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment li {
  list-style: inherit;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment li.task-list-item,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment li.task-list-item {
  min-height: 18px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .task-list input.task-list-item-checkbox,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .task-list input.task-list-item-checkbox {
  vertical-align: middle;
  margin: 4px;
  float: none;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h1,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h1 {
  font-family: "Segoe UI", "-apple-system", BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 28px;
  font-weight: 300;
  border: none;
  margin: 14px 0;
  line-height: 1.2;
  margin-top: 28px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h1 .bowtie-icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h1 .bowtie-icon {
  font-size: unset;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h1:first-child,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h1:first-child {
  margin-top: 0;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h2,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h2 {
  font-family: "Segoe UI", "-apple-system", BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 21px;
  font-weight: normal;
  border: none;
  margin: 14px 0;
  line-height: 1.2;
  margin-top: 28px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h2 .bowtie-icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h2 .bowtie-icon {
  font-size: unset;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h3,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h3 {
  font-family: "Segoe UI", "-apple-system", BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 17px;
  font-weight: 600;
  border: none;
  margin: 14px 0;
  line-height: 1.2;
  margin-top: 28px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h3 .bowtie-icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h3 .bowtie-icon {
  font-size: unset;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h4,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h4 {
  font-family: "Segoe UI", "-apple-system", BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 15px;
  font-weight: 600;
  border: none;
  margin: 14px 0;
  line-height: 1.2;
  margin-top: 28px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h4 .bowtie-icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h4 .bowtie-icon {
  font-size: unset;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h5,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h5 {
  font-family: "Segoe UI", "-apple-system", BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 14px;
  font-weight: 600;
  border: none;
  margin: 14px 0;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h5 .bowtie-icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h5 .bowtie-icon {
  font-size: unset;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h6,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h6 {
  font-family: "Segoe UI", "-apple-system", BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 12px;
  font-weight: 600;
  border: none;
  margin: 14px 0;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h6 .bowtie-icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment h6 .bowtie-icon {
  font-size: unset;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container {
  border: 1px solid rgba(0, 0, 0, 0.08);
  border: 1px solid var(--palette-black-alpha-8,rgba(0, 0, 0, 0.08));
  border-radius: 4px;
  display: inline-block;
  padding: 10px 16px 10px 0px;
  margin-bottom: 14px;
  min-width: 250px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container .toc-container-header,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container .toc-container-header {
  font-weight: 600;
  margin: 0px 16px 5px 16px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container ul,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container ul {
  list-style: none;
  margin: 0px;
  padding-left: 16px;
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container li::before,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container li::before {
  content: "\2022 ";
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container a,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment .toc-container a {
  margin-left: 5px;
  display: inline-block;
  vertical-align: top;
  width: auto;
  max-width: 400px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment:empty,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment .history-item-comment:empty {
  display: none;
}

@media screen and (-ms-high-contrast: active) {
  .fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment,
  .workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment {
    border: 1px solid rgba(0, 0, 0, .9);
  }
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment:empty,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container .history-comment:empty {
  display: none;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-comment-container:empty,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-comment-container:empty {
  display: none;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields {
  font-size: 14px;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  margin-bottom: 20px;
  white-space: nowrap;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields .field-name,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields .field-name {
  display: inline-block;
  padding-right: 10px;
  white-space: normal;
  vertical-align: top;
  padding-top: 4px;
  padding-bottom: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields .field-values,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields .field-values {
  display: inline-block;
  white-space: normal;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields .field-values .field-old-value,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields .field-values .field-old-value {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-size: 14px;
  text-decoration: line-through;
  display: inline-block;
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
  margin-right: 5px;
  margin-bottom: 5px;
  word-wrap: break-word;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields .field-values .field-new-value,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields .field-values .field-new-value {
  background-color: rgba( 223, 246, 221 ,  1 );
  background-color: rgba( var(--palette-accent2-light,223, 246, 221) ,  1 );
  font-size: 14px;
  display: inline-block;
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
  margin-right: 5px;
  margin-bottom: 5px;
  word-wrap: break-word;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields .field-values .icon,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields .field-values .icon {
  background-color: rgba( 223, 246, 221 ,  1 );
  background-color: rgba( var(--palette-accent2-light,223, 246, 221) ,  1 );
  width: 27px;
  height: 27px;
  padding-top: 6px;
  position: relative;
  bottom: 2px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields .field-old-value:empty, .fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields .field-new-value:empty,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields .field-old-value:empty,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields .field-new-value:empty {
  padding: 0;
  margin: 0;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .fields:empty,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .fields:empty {
  display: none;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .html-fields,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .html-fields {
  margin-right: 10px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field {
  margin-bottom: 25px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-name,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-name {
  font-size: 16px;
  font-weight: 600;
  display: inline-block;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-new-value-container,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-new-value-container {
  background-color: rgba( 223, 246, 221 ,  1 );
  background-color: rgba( var(--palette-accent2-light,223, 246, 221) ,  1 );
  padding: 10px;
  margin-bottom: 10px;
  display: inline-block;
  max-width: 100%;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-new-value-container .html-field-new-value,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-new-value-container .html-field-new-value {
  word-wrap: break-word;
  display: inline-block;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: auto;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-old-value-container,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-old-value-container {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  padding: 10px;
  margin-bottom: 10px;
  display: inline-block;
  max-width: 100%;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-old-value-container .html-field-old-value,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field .html-field-old-value-container .html-field-old-value {
  text-decoration: line-through !important;
  word-wrap: break-word;
  display: inline-block;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: auto;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field td,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .html-fields .html-field td {
  vertical-align: top;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field {
  margin-bottom: 25px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field .plaintext-field-name,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field .plaintext-field-name {
  font-size: 16px;
  font-weight: 600;
  display: inline-block;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field .plaintext-field-new-value,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field .plaintext-field-new-value {
  margin-right: 10px;
  word-wrap: break-word;
  background-color: rgba( 223, 246, 221 ,  1 );
  background-color: rgba( var(--palette-accent2-light,223, 246, 221) ,  1 );
  padding: 5px;
  margin: 0;
  display: inline-block;
  max-width: 100%;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field .plaintext-field-old-value,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field .plaintext-field-old-value {
  text-decoration: line-through !important;
  word-wrap: break-word;
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  padding: 5px;
  margin: 0;
  display: inline-block;
  max-width: 100%;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field pre,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field pre {
  font-family: inherit;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field td,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .plaintext-fields .plaintext-field td {
  vertical-align: top;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments {
  margin-bottom: 20px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment-title,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment-title {
  font-size: 16px;
  font-weight: 600;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment {
  margin-top: 9px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .icon-attach,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .icon-attach {
  margin-right: 5px;
  vertical-align: middle;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .attachment-text,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .attachment-text {
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: calc(100% - 120px);
  white-space: normal;
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
  display: inline-block;
  vertical-align: middle;
  font-size: 14px;
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .attachment-add,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .attachment-add {
  color: rgba( 16, 110, 190 ,  1 );
  color: rgba( var(--palette-primary-shade-10,16, 110, 190) ,  1 );
  background-color: rgba( 223, 246, 221 ,  1 );
  background-color: rgba( var(--palette-accent2-light,223, 246, 221) ,  1 );
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .attachment-delete,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .attachment-delete {
  color: rgba( 16, 110, 190 ,  1 );
  color: rgba( var(--palette-primary-shade-10,16, 110, 190) ,  1 );
  text-decoration: line-through;
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .add-attachment-comment,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .add-attachment-comment {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
}

.fullscreen-container .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .delete-attachment-comment,
.workitemcontrol .workitem-history-control .history-details-panel .history-item-viewer .history-item-detail .history-attachments .attachment .delete-attachment-comment {
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  text-decoration: line-through;
}

.fullscreen-container .bowtie-icon.bowtie-comment-outline,
.workitemcontrol .workitem-history-control .bowtie-icon.bowtie-comment-outline {
  color: rgba( 43, 136, 216 ,  1 );
  color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
}

.fullscreen-container .visually-hidden,
.workitemcontrol .workitem-history-control .visually-hidden {
  position: absolute !important;
  clip: rect(0 0 0 0);
}

.fullscreen-container .history-section,
.workitemcontrol .workitem-history-control .history-section {
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
  border-bottom:  1px solid;
  border-bottom-color: rgba( 234, 234, 234 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  margin-bottom: 5px;
  padding-bottom: 3px;
}

.workitem-history-control-container {
  position: relative;
}

.workitem-history-control-container .control-loading-overlay {
  position: absolute;
  top: 0px;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  padding-top: 30px;
  filter: alpha(opacity=85);
  opacity: 0.85;
  z-index: 10000;
}

.workitem-history-control-container .control-loading-overlay .status-indicator td {
  vertical-align: top;
}

.work-item-history-image-scale {
  max-width: 100%;
  height: auto;
}

.workitemcontrol .history-loading {
  margin-top: 20px;
}

.form-dark-theme .history-item-comment,
.form-dark-theme .history-item-comment *[style]:not(a):not(pre),
.form-dark-theme .html-field-new-value,
.form-dark-theme .html-field-new-value *[style]:not(a):not(pre),
.form-dark-theme .html-field-old-value,
.form-dark-theme .html-field-old-value *[style]:not(a):not(pre) {
  background-color: inherit !important;
  color: inherit !important;
}

.form-dark-theme .history-item-comment pre,
.form-dark-theme .html-field-new-value pre,
.form-dark-theme .html-field-old-value pre {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

/** Automatically converted from WebPageControl.css **/
.webpagecontrol {
  width: 100%;
  height: 600px;
  overflow: hidden;
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.webpagecontrol > iframe {
  width: 100%;
  height: 100%;
  overflow: auto;
}

/** Automatically converted from AttachmentsControl.css **/
.attachmentscontrol {
  width: 100%;
  border:  1px solid;
  border-color: rgba( 234, 234, 234 ,  1 );
  border-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.attachment-dialog {
  width: 100%;
  overflow: hidden;
}

.attachment-dialog > .label {
  display: block;
}

.attachment-dialog .comment.textbox, .attachment-dialog .file {
  width: 100%;
}

.workitemcontrol.work-item-control .attachment-icon {
  margin-right: 6px;
  height: 16px;
  width: 16px;
}

.upload-indicator {
  background: url("../../_content/spinner.gif");
  margin-right: 6px;
  display: inline-block;
}

.workitemcontrol .attachment-grid .grid-row.grid-row-normal.placeholder {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.workitemcontrol .attachment-grid .grid-row.grid-row-normal.placeholder .placeholder-name {
  color: gray;
  vertical-align: text-top;
}

.work-item-control .attachment-text {
  font-size: 12px;
  padding-bottom: 7px;
  padding-top: 7px;
}

/** Automatically converted from LinksControl.css **/
.link-dialog p {
  margin-top: 2px;
}

.link-dialog label.inline-label {
  display: inline-block;
  margin-right: 10px;
  white-space: nowrap;
  overflow: visible;
}

.link-dialog .link-type-error-message, .link-dialog .work-item-type-error-message {
  display: flex;
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.link-dialog .link-type-error-message .error-text, .link-dialog .work-item-type-error-message .error-text {
  padding-left: 4px;
}

.link-dialog .link-type-error-message .info-text, .link-dialog .work-item-type-error-message .info-text {
  color: rgba( 166, 166, 166 ,  1 );
  color: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
}

.link-dialog .same-type-message-bar-container {
  padding: 2px 0px;
}

.link-dialog .same-type-message-bar-container .same-type-message-bar {
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  font-size: 14px;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  background: rgba( 244, 244, 244 ,  1 );
  background: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  padding: 10px;
}

.link-dialog .same-type-message-bar-container .same-type-message-bar .input-message-icon {
  -webkit-box-flex: 0 0 auto;
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  padding-top: 2px;
}

.link-dialog .same-type-message-bar-container .same-type-message-bar .input-message {
  -webkit-box-flex: 1 1 0%;
  -webkit-flex: 1 1 0%;
  flex: 1 1 0%;
  /* Chrome fix - Chrome incorrectly sets a min-height/width it will not go lower than
     * See: https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored
     * CodePen with bug: https://codepen.io/philipwalton/pen/MYbrrr
     * CodePen with min-width: https://codepen.io/anon/pen/VrKGWa
     */
  min-height: 0;
  min-width: 0;
  margin: 0px 5px;
}

.link-dialog .same-type-message-bar-container .same-type-message-bar .dismiss-message-button {
  -webkit-box-flex: 0 0 auto;
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  padding-top: 2px;
  cursor: pointer;
}

.link-dialog .work-item-type-error-message {
  margin-top: 15px;
}

.link-dialog .link-types-container {
  margin-top: 10px;
}

.link-dialog .link-type-combobox-label {
  font-size: 14px;
}

.target-icon {
  color: rgba( 0, 69, 120 ,  1 );
  color: rgba( var(--palette-primary-shade-30,0, 69, 120) ,  1 );
  font-size: 16px;
  padding-top: 15px;
  padding-right: 5px;
}

.section-title {
  display: inline-flex;
}

.link-dialog-form-container {
  width: 100%;
  overflow: hidden;
}

.link-dialog-form-container td {
  vertical-align: top;
}

.link-dialog-workitem-description {
  width: 100%;
  height: 40px;
  margin: 0;
  overflow: auto;
  padding: 5px 0 0 20px;
  list-style-position: inside;
}

.link-dialog-workitem-description li {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.link-dialog-width-100 {
  width: 100%;
}

.link-dialog-title-combobox {
  margin-top: 3px;
}

.pull-request-description {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pull-request-description-container {
  width: 100%;
  height: 29px;
  margin: 0;
  padding: 6px 0 11px 2px;
}

.link-dialog-form .fetching {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-style: italic;
}

.link-dialog-form .notfound {
  background-color: rgba( 249, 235, 235 ,  1 );
  background-color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  font-style: italic;
}

.link-dialog-form .selflink {
  background-color: rgba( 249, 235, 235 ,  1 );
  background-color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  font-style: italic;
}

.link-dialog-form .filtered {
  background-color: rgba( 249, 235, 235 ,  1 );
  background-color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  font-style: italic;
}

.link-dialog-form .duplicate {
  background-color: rgba( 249, 235, 235 ,  1 );
  background-color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  font-style: italic;
}

.link-dialog-form .message {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
  font-style: italic;
}

.link-dialog-form .test-result {
  margin-top: 1em;
}

/* Link dialog visualization styles */
.link-visualization {
  position: relative;
  overflow: hidden;
  width: 300px;
  height: 110px;
  background: url("../../_content/Work/linking.png") no-repeat;
  margin: 10px auto 0 auto;
}

.link-visualization.invalid {
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  filter: alpha(opacity=65);
  opacity: 0.65;
}

.link-visualization > .text {
  position: absolute;
  overflow: hidden;
  width: 115px;
  height: 35px;
  font-size: 10px;
  color: rgba(255, 255, 255, 1);
  color: var(--background-color,rgba(255, 255, 255, 1));
  border: 1px solid transparent;
  text-align: center;
}

.link-visualization.tree > .text-forward {
  left: 92px;
  top: 65px;
}

.link-visualization.tree > .text-reverse {
  left: 92px;
  top: 3px;
}

.link-visualization.tree.image-singlesrc-singletgt {
  background-position: 50% 3px;
}

.link-visualization.tree.image-singlesrc-multipletgt {
  background-position: 50% -1752px;
}

.link-visualization.tree.image-singletgt-singlesrc {
  background-position: 50% -213px;
}

.link-visualization.tree.image-singletgt-multiplesrc {
  background-position: 50% -452px;
}

.link-visualization.network > .text-forward {
  left: 165px;
  top: 36px;
}

.link-visualization.network > .text-reverse {
  left: 18px;
  top: 36px;
}

.link-visualization.network.image-singletgt-singlesrc {
  background-position: 50% -774px;
}

.link-visualization.network.image-singletgt-multiplesrc {
  background-position: 50% -616px;
}

.link-visualization.network.image-multipletgt-singlesrc {
  background-position: 50% -2074px;
}

.link-visualization.network.image-multipletgt-multiplesrc {
  background-position: 50% -1850px;
}

.link-visualization.dependency > .text-forward {
  left: 165px;
  top: 36px;
}

.link-visualization.dependency > .text-reverse {
  left: 18px;
  top: 36px;
}

.link-visualization.dependency.image-singlesrc-singletgt {
  background-position: 50% -1418px;
}

.link-visualization.dependency.image-multiplesrc-singletgt {
  background-position: 50% -1260px;
}

.link-visualization.dependency.image-singletgt-singlesrc {
  background-position: 50% -1109px;
}

.link-visualization.dependency.image-singletgt-multiplesrc {
  background-position: 50% -951px;
}

.link-visualization.dependency.image-singlesrc-multipletgt {
  background-position: 50% -2718px;
}

.link-visualization.dependency.image-multiplesrc-multipletgt {
  background-position: 50% -2560px;
}

.link-visualization.dependency.image-multipletgt-singlesrc {
  background-position: 50% -2409px;
}

.link-visualization.dependency.image-multipletgt-multiplesrc {
  background-position: 50% -2251px;
}

.link-dialog .link-dialog-description {
  padding-top: 5px !important;
  margin: 0px;
}

.link-dialog .dialog-linkform-label {
  margin-top: 14px !important;
}

.link-dialog .link-dialog-form .changeset-container .changeset-id-cell, .link-dialog .link-dialog-form .changeset-container .artifact-id-cell {
  height: 32px;
}

.link-dialog .link-dialog-form .link-to-container .link-to.textbox {
  height: 32px;
  margin-right: 10px;
}

.link-dialog .link-dialog-form .witIds-browse-container,
.link-dialog .link-dialog-form .changeset-browse-container,
.link-dialog .link-dialog-form .artifact-browse-container {
  width: 1%;
  vertical-align: bottom;
}

.link-dialog .link-dialog-form .witIds-browse-container .ids-find,
.link-dialog .link-dialog-form .witIds-browse-container .changeset-browse-button,
.link-dialog .link-dialog-form .witIds-browse-container .artifact-browse-button,
.link-dialog .link-dialog-form .changeset-browse-container .ids-find,
.link-dialog .link-dialog-form .changeset-browse-container .changeset-browse-button,
.link-dialog .link-dialog-form .changeset-browse-container .artifact-browse-button,
.link-dialog .link-dialog-form .artifact-browse-container .ids-find,
.link-dialog .link-dialog-form .artifact-browse-container .changeset-browse-button,
.link-dialog .link-dialog-form .artifact-browse-container .artifact-browse-button {
  height: 32px;
  margin-left: 10px;
}

.link-dialog .link-dialog-form .contributed-link-form-container {
  width: 100%;
  vertical-align: bottom;
}

.link-dialog .link-dialog-form .work-item-link-container .witIds-browse-container .ids-find {
  min-width: 40px;
}

.link-dialog .link-dialog-form .input-message-bar-container {
  padding: 2px 0px;
}

.link-dialog .link-dialog-form .input-message-bar-container .input-message-bar {
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  font-size: 14px;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
  background: rgba( 244, 244, 244 ,  1 );
  background: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  padding: 10px;
}

.link-dialog .link-dialog-form .input-message-bar-container .input-message-bar .input-message-icon {
  -webkit-box-flex: 0 0 auto;
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  padding-top: 2px;
}

.link-dialog .link-dialog-form .input-message-bar-container .input-message-bar .input-message {
  -webkit-box-flex: 1 1 0%;
  -webkit-flex: 1 1 0%;
  flex: 1 1 0%;
  /* Chrome fix - Chrome incorrectly sets a min-height/width it will not go lower than
     * See: https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored
     * CodePen with bug: https://codepen.io/philipwalton/pen/MYbrrr
     * CodePen with min-width: https://codepen.io/anon/pen/VrKGWa
     */
  min-height: 0;
  min-width: 0;
  margin: 0px 5px;
}

.link-dialog .link-dialog-form .input-message-bar-container .input-message-bar .dismiss-message-button {
  -webkit-box-flex: 0 0 auto;
  -webkit-flex: 0 0 auto;
  flex: 0 0 auto;
  display: -webkit-box;
  -webkit-flex-direction: row;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  padding-top: 2px;
  cursor: pointer;
}

.lswiv-wi-container, .lswiv-nonexisting-wi-container {
  display: inline-flex;
  padding-top: 5px;
  max-width: 100%;
}

.lswiv-wi-container > div, .lswiv-nonexisting-wi-container > div {
  max-width: 100%;
}

.lswiv-nonexisting-wi-container {
  padding-top: 10px;
  margin-bottom: 10px;
}

.lswiv-main-container-summary {
  padding: 5px 0px;
}

.lswiv-you-are-here-icon, .lswiv-you-are-here-icon-no-top-padding, .lswiv-you-are-here-icon-summary {
  color: rgba( 0, 69, 120 ,  1 );
  color: rgba( var(--palette-primary-shade-30,0, 69, 120) ,  1 );
  font-size: 16px;
  padding-top: 4px;
  vertical-align: top;
  float: left;
}

.lswiv-you-are-here-icon-no-top-padding {
  padding-top: 0px;
}

.lswiv-you-are-here-icon-summary {
  padding-top: 6px;
}

.ltv-image {
  position: relative;
  overflow: hidden;
  width: 120px;
  height: 130px;
  margin: 0 auto 0 auto;
}

.ltv-image-column {
  width: 120px;
}

.ltv-container {
  padding: 5px 0px 0px 0px;
}

.ltv-table-only-image {
  left: 40%;
  margin-right: -40%;
  position: relative;
}

.ltv-empty-row {
  height: 74px;
}

.ltv-empty-row-edge-ie-one-wi {
  height: 62px;
}

.ltv-row-links-top {
  padding-top: 3px;
}

.ltv-wi-artifacts-container {
  display: inline-flex;
  padding-top: 5px;
  margin-bottom: 5px;
  width: 410px !important;
  max-height: 138px;
}

.ltv-wi-artifacts-container-overflow {
  overflow: auto;
}

.ltv-wi-artifacts-container > div {
  width: 100%;
  max-width: 100%;
}

/** Automatically converted from WorkItemPicker.css **/
/* Work Item Picker Styles */
.work-item-find {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.work-item-find > .filter-container {
  position: relative;
  left: 0;
  top: 0;
  right: 0;
  overflow: hidden;
  flex: none;
}

.tfs-treenode-text.finder-query {
  color: rgba(0, 120, 212, 1);
  color: var(--communication-background,rgba(0, 120, 212, 1));
}

.work-item-find > .filter-container table {
  width: 100%;
}

.work-item-find .project-cell,
.work-item-find .query-cell,
.work-item-find .ids-cell,
.work-item-find .title-cell,
.work-item-find .type-cell {
  width: 100%;
  padding-left: 15px;
}

.work-item-find .query-button,
.work-item-find .id,
.work-item-find .title {
  vertical-align: bottom;
}

.work-item-find .ids,
.work-item-find .title-contains,
.work-item-find .type {
  width: 100%;
  height: 1.7em;
}

.work-item-find .find {
  float: right;
}

.work-item-find .names {
  width: 1%;
  white-space: nowrap;
  overflow: hidden;
  padding-bottom: 3px;
  vertical-align: bottom;
}

.work-item-find .and-type {
  padding-left: 24px;
}

.work-item-find > .status-container {
  padding: 2px;
  height: 2em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: none;
}

.work-item-find > .status-container.error {
  color: rgba( 249, 235, 235 ,  1 );
  color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  font-size: 12px;
}

.work-item-find > .list-container {
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  overflow: hidden;
  flex: 1 0 120px;
}

.work-item-find > .result-status-container {
  padding: 2px;
  left: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  flex: none;
}

.work-item-find > .list-container .query-result-grid {
  width: 100%;
  height: 100%;
}

.work-item-find > .buttons-container {
  margin-top: 5px;
  width: 100%;
  flex: none;
}

.work-item-find > .buttons-container .reset {
  float: right;
}

.work-item-find > .buttons-container .hide {
  display: none;
}

.work-item-find .blur-query-method-box {
  -khtml-opacity: 0.5;
  filter: alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}

.work-item-find .filter-type-container {
  margin-top: 14px !important;
}

.work-item-find .radio-filter-container {
  margin-bottom: 5px;
  height: 37px;
  width: 100%;
}

.work-item-find .radio-filter-container .radio-input {
  float: left;
  margin-top: 8px;
}

.work-item-find .radio-filter-container .radio-label {
  float: left;
  margin-top: 6px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: calc(30% - 30px);
}

.work-item-find .radio-filter-container .filter-input {
  float: right;
  width: 70%;
}

.work-item-find .query-filter-container {
  margin-bottom: 0px;
}

.work-item-find .title-and-type-filter-container {
  width: 100%;
}

.work-item-find .title-and-type-filter-container .type-container .type-label {
  margin-left: 30px;
}

.work-item-find .work-item-find-button {
  float: right;
}

/* End of Work Item Picker Styles */
/** Automatically converted from Editor.css **/
.work-item-form {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.work-item-view {
  outline: none;
  overflow: auto;
  position: absolute;
  top: 88px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  padding-top: 12px;
  margin-left: 20px;
  font-size: 12px;
  /* z-index: 1; */
  /* TODO: Check */
}

.work-item-view.new-work-item-view .witform-layout,
.work-item-view.new-work-item-view .witform-layout-scrollable-frame,
.work-item-view.new-work-item-view .witform-layout-content-container {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}

.work-item-view.new-work-item-view .witform-layout-scrollable-frame {
  overflow-x: auto;
  overflow-y: hidden;
}

.work-item-view.new-work-item-view .witform-layout-content-container {
  min-width: 510px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-flex-direction: column;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}

@media only screen and (max-width: 600px) {
  .work-item-view.new-work-item-view .witform-layout-content-container {
    flex-direction: row;
    flex-wrap: wrap;
    align-content: stretch;
  }
}

.work-item-form.no-info-bar .work-item-view {
  top: 39px;
}

.hub-view.explorer.work-items-view.new-work-items-view.work-item-editor-view .right-hub-content .work-item-form.work-item-form-main .work-item-view.new-work-item-view {
  top: 0;
}

.work-item-form.work-item-form-main .work-item-view.new-work-item-view {
  top: 27px;
  padding-top: 0;
  margin-left: 0;
}

.work-item-form.no-info-bar .toolbar {
  /* We don't want a border separating the toolbar and the "Type of Query" filter in Query Editor page */
  margin-top: 0;
}

.work-item-form.no-toolbar.no-info-bar .work-item-view {
  top: 0px;
}

.work-item-view legend {
  text-transform: uppercase;
  font-size: 11px;
  color: rgba( 0, 0, 0 ,  1 );
  color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
  font-weight: bold;
  line-height: 22px;
}

.workitem-dialog.ui-dialog {
  background: rgba( 255, 255, 255 ,  1 );
  background: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  overflow: visible;
}

.workitem-dialog.new-workitem-dialog.ui-dialog.invisible {
  /* we dont use display: none, as that gets overridden by dialog as soon as it opens up */
  visibility: hidden;
}

.workitem-dialog.ui-dialog.full-screen {
  width: 100% !important;
  height: 100% !important;
  top: 0 !important;
  left: 0 !important;
  border: 0px !important;
}

.workitem-dialog.ui-dialog.full-screen .ui-dialog-content {
  width: 100% !important;
  height: 100% !important;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar .full-screen-button {
  position: absolute;
  right: 29px;
  top: 0px;
  padding: 5px;
  height: 27px;
  cursor: pointer;
  outline: none;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar .full-screen-button:not(:hover):not(:focus) {
  padding: 6px;
}

.move-item-dialog .form-section,
.change-type-dialog .form-section {
  margin: 24px 0 8px;
}

@media screen\0 {
  .workitem-dialog.ui-dialog .ui-dialog-titlebar .full-screen-button {
    position: absolute;
    right: 29px;
    top: -1px;
    padding: 5px;
    height: 27px;
    cursor: pointer;
    outline: none;
  }
  .workitem-dialog.ui-dialog .ui-dialog-titlebar .full-screen-button:not(:hover):not(:focus) {
    padding: 6px;
  }
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar .full-screen-button:focus, .workitem-dialog.ui-dialog .ui-dialog-titlebar .full-screen-button:hover,
.workitem-dialog.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close:focus,
.workitem-dialog.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close:hover {
  border: 1px solid rgba(0, 0, 0, .55);
  border: 1px solid var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.workitem-dialog.ui-dialog .control-busy-overlay {
  position: absolute;
  top: 38px;
  left: 0;
  bottom: 51px;
  right: 0;
  background: rgba( 166, 166, 166 ,  1 );
  background: rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  opacity: 0.3;
  filter: Alpha(Opacity=30);
  z-index: 10000;
}

.workitem-dialog.ui-dialog .work-item-form.work-item-form-main ~ .control-busy-overlay {
  top: 0;
  bottom: 0;
}

.triage-view .control-busy-overlay {
  top: 36px;
}

.triage-view .work-item-form.work-item-form-main ~ .control-busy-overlay {
  top: 0;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar {
  position: absolute;
  border: 0;
  padding-top: 2px;
  padding-bottom: 2px;
  top: 0;
  height: 10px;
  width: 100%;
  z-index: 2002;
  background: transparent;
}

.new-workitem-dialog.workitem-dialog.ui-dialog .ui-dialog-titlebar {
  height: 12px;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close {
  background-color: transparent;
  padding-top: 8px;
  z-index: 2002;
  height: 27px;
  top: 0px;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close .ui-icon.ui-icon-closethick {
  left: 6px;
  top: 6px;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close:hover .ui-icon.ui-icon-closethick, .workitem-dialog.ui-dialog .ui-dialog-titlebar .ui-dialog-titlebar-close:focus .ui-icon.ui-icon-closethick {
  left: 5px;
  top: 5px;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar-progress-container {
  margin: 35px 0 0 0;
}

.new-workitem-dialog.ui-dialog .ui-dialog-titlebar-progress-container {
  margin: 0;
}

/* Hide the bottom dialog buttons for the modal dialog on the new form */
.new-workitem-dialog.ui-dialog .ui-dialog-buttonpane {
  visibility: hidden;
}

.new-workitem-dialog.ui-dialog .ui-dialog-buttonset {
  display: none;
}

.workitem-dialog.ui-dialog .ui-dialog-content {
  margin: 0;
  padding: 0;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar .ui-dialog-title {
  display: none;
}

.workitem-dialog.ui-dialog .ui-dialog-titlebar {
  padding: 0;
}

.workitem-dialog .toolbar {
  z-index: 2002;
}

.work-item-view .ui-tabs .ui-tabs-panel {
  padding: 0;
}

.work-item-form .richeditor-toolbar-maximize,
.richeditor-toolbar-restore {
  position: absolute;
  right: 0;
}

.workitem-control-maximized-container .workitem-info-bar {
  padding-left: 10px;
  border-bottom:  1px solid;
  border-bottom-color: rgba( 200, 200, 200 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.workitem-control-maximized-container .workitem-info-bar.workitem-header-bar {
  border-left-width: 0px;
}

.workitem-control-maximized-mode.full-screen-mode .header-section {
  display: none;
}

.workitem-control-maximized-mode .main-container .content-section {
  visibility: hidden;
  /* display: none will cause resize issues while hidden */
}

.workitem-control-maximized-container {
  padding-left: 10px;
  padding-right: 10px;
}

.witform-layout .workitem-control-maximized-container {
  position: absolute;
  top: 73px;
  right: 0;
  bottom: 40px;
  left: 0;
  padding-top: 10px;
  border-top:  1px solid;
  border-top-color: rgba( 234, 234, 234 ,  1 );
  border-top-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.workitem-control-maximized-mode .richeditor-container {
  position: absolute;
  top: 140px;
  bottom: 10px;
  left: 10px;
  right: 10px;
  height: auto !important;
}

.workitem-control-maximized-mode.full-screen-mode .richeditor-container {
  top: 50px;
}

.workitem-control-maximized-hidden-dialog {
  visibility: hidden;
}

.workitem-control-maximized-dialog .ui-dialog-titlebar {
  position: absolute;
  border: 0;
  padding-top: 2px;
  padding-bottom: 2px;
  top: 0;
  height: 10px;
  width: 100%;
  z-index: 2002;
  background: transparent;
}

.workitem-control-maximized-dialog .ui-dialog-title {
  display: none;
}

.workitem-control-maximized-dialog .ui-dialog-titlebar-close {
  display: none;
}

.workitem-control-maximized-dialog .workitemcontrol-maximized .richeditor-container {
  position: absolute;
  top: 50px;
  bottom: 10px;
  left: 10px;
  right: 10px;
  height: auto !important;
}

.workitem-control-maximized-dialog .witform-maximized-container .workitemcontrol-maximized .richeditor-container {
  top: 50px;
}

.workitem-control-maximized-dialog .workitem-control-maximized-container {
  padding-left: 0px;
}

.workitem-control-maximized-dialog .workitem-control-maximized-container .workitem-info-bar {
  padding-left: 0px;
}

.workitemcontrol .richeditor-navigator {
  right: 25px;
}

.workitemcontrol-maximized .richeditor-navigator {
  right: 25px;
}

.toolbar.workitem-header-toolbar {
  height: auto;
}

.toolbar.workitem-header-toolbar .menu-bar > .menu-item {
  padding: 2px 5px 5px 5px;
  margin: 2px 2.5px 2px 2.5px !important;
}

.toolbar.workitem-header-toolbar .menu-bar > .menu-item.focus.disabled {
  padding: 1px 4px 4px 4px;
}

/** Automatically converted from InfoBar.css **/
.workitem-info-bar {
  font-family: "Segoe UI", "-apple-system", BlinkMacSystemFont, Roboto, "Helvetica Neue", Helvetica, Ubuntu, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight: 300;
  font-size: 18px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  width: 100%;
  position: relative;
  white-space: nowrap;
  padding-right: 20px;
  padding-top: 12px;
  padding-bottom: 12px;
}

.work-item-form .workitem-info-bar {
  padding-left: 20px;
}

.workitem-dialog .workitem-info-bar {
  border: 0;
}

.workitem-info-bar span.caption {
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.workitem-info-bar span.triage-details {
  float: right;
  font-size: 16px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.workitem-info-bar span.triage-details.loading {
  height: 16px;
  width: 16px;
  background: url("../../_content/saving-icon.gif");
}

.workitem-info-bar div.info-text-wrapper {
  display: flex;
}

.workitem-info-bar .info-text {
  white-space: nowrap;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.workitem-info-bar.invalid .info-text {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.error-work-item-download {
  position: relative;
  height: 30px;
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
  border-bottom:  1px solid;
  border-bottom-color: rgba( 218, 218, 218 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
  padding-left: 20px;
  padding-top: 6px;
}

.workitem-info-bar.workitem-header-bar {
  border-left-style: solid;
  border-left-width: 10px;
  border-left-color: rgba( 255, 255, 255 ,  1 );
  border-left-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  font-size: 14px;
  padding: 4px 0px 5px 10px;
  height: 28px;
  line-height: 1.3em;
  width: auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
}

.workitem-info-bar.workitem-header-bar .work-item-type-icon {
  font-size: 12px;
}

.workitem-info-bar.workitem-header-bar .triage-details {
  line-height: 1.2em;
}

.workitem-info-bar.workitem-header-bar span.caption {
  padding-right: 5px;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
}

.workitem-info-bar.workitem-header-bar span.bowtie-icon.bowtie-status-error {
  font-size: 12px;
}

.legacy-shim .workitem-info-bar.workitem-header-bar a,
.workitem-dialog .workitem-info-bar.workitem-header-bar a {
  padding-right: 5px;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 12px;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
}

.legacy-shim .workitem-info-bar.workitem-header-bar a:hover,
.legacy-shim .workitem-info-bar.workitem-header-bar a:focus,
.workitem-dialog .workitem-info-bar.workitem-header-bar a:hover,
.workitem-dialog .workitem-info-bar.workitem-header-bar a:focus {
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
  text-decoration: underline;
  outline: none;
  border:  1px dashed;
  border-color: rgba( 0, 0, 0 ,  1 ) !important;
  border-color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
  font-weight: bold !important;
}

/** Automatically converted from StateTransitionGraph.css **/
.wit-state-transition-graph {
  width: 100%;
  height: 105px;
  z-index: 0;
  position: relative;
}

.transition-and-state-container-main {
  width: 100%;
  height: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}

.wit-state-transition-graph .status-indicator {
  margin-top: 0px;
}

.wit-state-transition-graph-unpinned-container {
  position: relative;
}

.wit-state-transition-graph-unpinned-container .control-loading-overlay {
  position: absolute;
  top: 0px;
  left: 0;
  bottom: 0;
  right: 0;
  background-color: rgba(255, 255, 255, 1);
  background-color: var(--background-color,rgba(255, 255, 255, 1));
  padding-top: 0px;
  filter: alpha(opacity=85);
  opacity: 0.85;
  z-index: 10000;
}

.transition-and-state-pin-container .icon {
  position: absolute;
  right: 0px;
  margin-top: 4px;
  z-index: 1;
}

.pinned + .wit-logcontrol-tabs {
  padding-top: 10px;
}

.transition-and-state-pin-container {
  position: absolute;
  width: 100%;
}

.transition-container, .state-container {
  float: left;
  height: 75px;
  text-align: center;
  padding: 4px;
  position: relative;
}

.wit-state-transition-graph-icon-pin-hover,
.wit-state-transition-graph-icon-unpin-hover {
  background-color: rgba( 199, 224, 244 ,  1 ) !important;
  background-color: rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 ) !important;
  cursor: pointer;
}

.transition-container {
  margin-right: 9px;
  color: rgba(0, 0, 0, .55);
  color: var(--text-secondary-color,rgba(0, 0, 0, .55));
}

.transition-container .transition-change-info-owner {
  display: inline-block;
}

.state-container {
  position: relative;
}

.state {
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  padding: 10px;
  position: relative;
  top: 50%;
  margin-top: -17.5px;
}

.transition-and-state-container.show-more .state {
  background-color: white;
  border: 2px dashed rgba(0, 0, 0, .55);
  border: 2px dashed var(--text-secondary-color,rgba(0, 0, 0, .55));
  cursor: pointer;
}

.transition-and-state-container.show-more .state a,
.transition-and-state-container.show-more .state a:hover {
  color: rgba(0, 120, 212, 1);
  color: var(--communication-background,rgba(0, 120, 212, 1));
}

.transition-and-state-container .state-container .state .state-circle {
  margin-top: 3px !important;
  margin-right: 6px !important;
}

.transition-and-state-container.show-more .arrow-tail {
  width: 10px;
}

.transition-arrow {
  height: 20px;
  position: relative;
  top: 50%;
  margin-top: -10px;
}

.arrow-head {
  position: absolute;
  margin-left: 100%;
  width: 10px;
  height: 20px;
  overflow: hidden;
}

.arrow-head:after {
  content: '';
  display: block;
  transform: rotate(45deg);
  border:  10px solid;
  border-color: rgba( 43, 136, 216 ,  1 );
  border-color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
  left: -14px;
  position: absolute;
  z-index: 1;
}

.arrow-tail {
  border:  4px solid;
  border-color: rgba( 43, 136, 216 ,  1 );
  border-color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
  width: 100%;
  margin-top: -4px;
  float: left;
  position: relative;
  top: 50%;
}

.transition-change-info {
  position: relative;
}

.transition-reason {
  position: relative;
  bottom: 17px;
}

.off-screen {
  position: absolute;
  left: -5000px;
}

.recycle-bin {
  position: absolute;
  bottom: 0px;
  height: 40px;
  width: 100%;
  border-top:  1px solid;
  border-top-color: rgba( 234, 234, 234 ,  1 );
  border-top-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.recycle-bin-base-dialog-content .delete-warning-message,
.recycle-bin-base-dialog-content .restore-warning-message,
.recycle-bin-base-dialog-content .destroy-warning-message {
  padding-left: 10px;
}

.recycle-bin-base-dialog-content .bowtie-status-warning {
  font-size: 32px;
  line-height: normal;
}

.recycle-bin a {
  cursor: pointer;
  height: 100%;
  display: block;
}

.recycle-bin:hover {
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
}

.recycle-bin .content {
  display: inline-block;
  margin-top: 12px;
}

.recycle-bin.dragHover {
  background-color: rgba( 223, 246, 221 ,  1 );
  background-color: rgba( var(--palette-accent2-light,223, 246, 221) ,  1 );
}

.recycle-bin-icon {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-top: 4px;
  font-size: 24px;
  float: left;
  margin: 8px 5px 8px 20px;
}

.recycle-bin-icon::before {
  content: "\EA48";
}

.form-grid .work-item-control.work-item-discussion-control {
  padding-bottom: 12px;
}

.form-grid .work-item-control.work-item-discussion-control .error {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.maximized-grid-group .work-item-discussion-control .richeditor-container {
  position: relative;
}

/** Automatically converted from WorkItemsAsArtifactsControl.css **/
.info-icon {
  min-height: 16px !important;
  min-width: 16px !important;
  height: 16px !important;
  vertical-align: middle !important;
  text-align: center !important;
  background-color: transparent !important;
  border: 0px !important;
  padding: 0px !important;
  color: rgba(0, 90, 158, 1) !important;
  color: var(--communication-foreground,rgba(0, 90, 158, 1)) !important;
}

.info-icon .ms-Button-icon {
  height: 16px !important;
  line-height: 16px !important;
}

p.work-items-count-summary {
  padding: 0px 5px;
  margin: 0px;
}

.work-items-callout {
  width: 470px;
}

/***** End WorkItem Tracking Controls Area: WorkItem *****/
/** Automatically converted from _index.css **/
/***** Begin WorkItem Tracking Controls Area: Fields *****/
.multi-field-edit .clauses .operator {
  width: 35px;
}

.multi-field-edit .clauses .operator .multifieldedit-operator-control {
  border: 0;
  background: none;
}

.multi-field-edit .clauses .operator .multifieldedit-operator-control .wrap {
  background: none;
}

.multi-field-edit .clauses .operator .multifieldedit-operator-control .wrap input {
  width: calc(100% - 20px);
  display: block;
  margin: 0 auto;
}

.multi-field-edit .clauses .field {
  width: 35%;
}

.multi-field-edit .clauses .value .field-filter-value-control .combo, .multi-field-edit .clauses .value .field-filter-value-control .identity-picker-search-box, .multi-field-edit .clauses .value .field-filter-value-control .tree-picker-combo {
  border:  1px solid;
  border-color: rgba( 218, 218, 218 ,  1 );
  border-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
}

.multi-field-edit .clauses .value .field-filter-value-control .identity-picker-search-box {
  height: 1.7em !important;
}

/***** End WorkItem Tracking Controls Area: Fields *****/
/***** End WorkItem Tracking Controls Area *****/
/** Automatically converted from _index.css **/
/***** Begin WorkItem Tracking Dialogs Area *****/
/** Automatically converted from _index.css **/
/***** Begin WorkItem Tracking Controls Area: Bulk Edit *****/
.bulkedit-dialog .fields-panel {
  position: absolute;
  top: 0;
  bottom: 180px;
  left: 0;
  right: 0;
  overflow: auto;
  padding-left: 4px;
}

.bulkedit-dialog .history-panel {
  position: absolute;
  bottom: 0;
  height: 170px;
  left: 0;
  right: 0;
}

.bulkedit-dialog .bulkedit-controls-container {
  position: relative;
  height: 100%;
}

.bulkedit-dialog .bulkedit-controls-container .bowtie-icon.bowtie-math-plus {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.bulkedit-dialog .bulkedit-controls-container .combo.invalid {
  border:  1px solid;
  border-color: rgba( 168, 0, 0 ,  1 );
  border-color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
}

.bulkedit-dialog .bulkedit-controls-container .combo.invalid:not(.focus) .wrap {
  margin-left: 0px;
}

.bulkedit-dialog .bulkedit-controls-container .combo.invalid:not(.focus) .wrap:after {
  font-family: "Bowtie";
  font-size: 14px;
  speak: none;
  display: inline-block;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  text-align: center;
  text-decoration: none;
  line-height: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\EA02";
  font-weight: normal;
  font-style: normal;
  color: rgba( 168, 0, 0 ,  1 );
  color: rgba( var(--palette-accent1-dark,168, 0, 0) ,  1 );
  margin-left: 5px;
}

.bulkedit-dialog .bulkedit-controls-container .combo.invalid input {
  width: calc(100% - 38px);
}

/***** End WorkItem Tracking Controls Area: Bulk Edit *****/
/***** End WorkItem Tracking Dialogs Area *****/
/***** End WorkItem Tracking styles *****/
/***************************************************************
    CSS for Agile Boards
***************************************************************/
/***************************
     Kanban Board 
****************************/
.agile-board {
  position: relative;
  overflow: hidden;
  padding-top: 0px;
  /* aligns with .agile-board .horizontal > .agile-header-container */
  padding-left: 15px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  /* Override outline of focused item if high-contrast mode is enabled. */
  /* Horizontal Layout */
}

.agile-board *:focus {
  outline: 1px dashed rgba( 0, 0, 0 ,  1 ) !important;
  outline: 1px dashed rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

.agile-board.loading {
  display: block;
  /* This rule makes the loading spinner position in the center of the board consistently across all 4 major browsers. */
}

.agile-board .agile-board-message-area {
  margin: 0 20px 4px 20px;
}

.agile-board .member.board-column-header {
  font-weight: normal;
  font-size: 14px;
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
  word-wrap: break-word;
  line-height: 18px;
}

.agile-board .hidden-header {
  display: none;
}

.agile-board .member-header {
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
  background-color: rgba( 222, 236, 249 ,  1 );
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  cursor: pointer;
  padding-left: 7px;
  height: 27px;
  border-bottom:  3px solid;
  border-bottom-color: rgba( 255, 255, 255 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.agile-board .member-header.default {
  background-color: rgba( 234, 234, 234 ,  1 );
  background-color: rgba( var(--palette-neutral-8,234, 234, 234) ,  1 );
}

.agile-board .member-header.agileDragTargetHoverColor {
  background-color: rgba( 218, 218, 218 ,  1 ) !important;
  background-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 ) !important;
}

.agile-board .member-header > .bowtie-icon.bowtie-chevron-up,
.agile-board .member-header > .bowtie-icon.bowtie-chevron-down {
  font-size: 18px;
  vertical-align: top;
  line-height: 24px;
}

.agile-board .bowtie-icon.bowtie-status-info-outline {
  font-size: 12px;
  margin-left: 4px;
  padding-right: 1px;
  padding-left: 1px;
  color: rgba( 43, 136, 216 ,  1 );
  color: rgba( var(--palette-primary-tint-10,43, 136, 216) ,  1 );
}

.agile-board .cell .member-border-line {
  position: absolute;
  top: 0;
  height: 2px;
  background: rgba( 200, 200, 200 ,  1 );
  background: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  width: 100%;
}

.agile-board .cell:not(.split).content:not(.collapsed) > .member-border-line {
  margin-left: -10px;
}

.agile-board .transparent-board-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 2;
}

.agile-board .horizontal {
  /* Horizontal table */
}

.agile-board .horizontal > .not-scrollable {
  overflow: hidden;
}

.agile-board .horizontal > .scrollable {
  overflow-x: auto;
  overflow-y: auto;
}

.agile-board .horizontal > .agile-content-container {
  position: absolute;
  /* Making position absolute to bring scroll bar */
  bottom: 0;
  left: 0;
  right: 0;
  padding-left: 10px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.agile-board .horizontal > .agile-content-container:focus {
  outline: none;
}

.agile-board .horizontal > .agile-header-container {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  /* padding-top: 0px of agile-board */
  padding-left: 10px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.agile-board .horizontal .split > .agile-content-container,
.agile-board .horizontal .split > .agile-header-container {
  position: static;
  padding-left: 0;
}

.agile-board .horizontal .horizontal-table {
  display: table;
  table-layout: fixed;
  height: 100%;
  width: 100%;
}

.agile-board .horizontal .horizontal-table .header-container .cell.collapsed div,
.agile-board .horizontal .horizontal-table .content-container .cell.collapsed div:not(.member-border-line) {
  display: none !important;
}

.agile-board .horizontal .horizontal-table .member {
  width: auto;
}

.agile-board .horizontal .horizontal-table .member.board-column-header {
  padding: 4px 0 0 3px;
  position: relative;
  float: left;
}

.agile-board .horizontal .horizontal-table .split-column .member.board-column-header {
  font-size: 12px;
  line-height: normal;
}

.agile-board .horizontal .horizontal-table .member.header.exceed {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

.agile-board .horizontal .horizontal-table .member.header .separator {
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
}

.agile-board .horizontal .horizontal-table .cell.split-column:not(.member-content) {
  padding: 4px 0 0 6px;
}

.agile-board .horizontal .horizontal-table .cell .member-header-edit {
  padding: 0;
}

.agile-board .horizontal .horizontal-table > .row {
  display: table-row;
}

.agile-board .horizontal .horizontal-table > .row.board-column-header {
  height: 1px;
  /* To force the header to fit to contents. TODO: Review this to see whether we can do this another way. */
}

.agile-board .horizontal .horizontal-table > .row.content {
  overflow-y: auto;
  /* setup vertical scrolling for content */
  background-color: rgba( 244, 244, 244 ,  1 );
  background-color: rgba( var(--palette-neutral-4,244, 244, 244) ,  1 );
}

.agile-board .horizontal .horizontal-table > .row.content > .cell.split {
  padding: 0;
}

.agile-board .horizontal .horizontal-table > .row > .cell {
  display: table-cell;
  vertical-align: top;
  border-right:  4px solid;
  border-right-color: rgba( 255, 255, 255 ,  1 );
  border-right-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  padding: 0 10px 4px 10px;
}

.agile-board .horizontal .horizontal-table > .row > .cell.ui-droppable {
  padding-bottom: 10px;
  /* Override the .cell padding above for the droppable members, to give 10px padding bottom */
}

.agile-board .horizontal .horizontal-table > .row > .cell.collapsed {
  text-align: center;
  padding: 0 0 0 0 !important;
  width: 40px !important;
  height: 26px !important;
  cursor: pointer;
}

.agile-board .horizontal .horizontal-table > .row > .cell.collapsed > .label {
  font-weight: normal;
  font-size: 14px;
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
  -webkit-transform: rotate(90deg) translateX(27px);
  transform: rotate(90deg) translateX(27px);
  -ms-transform: rotate(90deg) translateX(27px);
  line-height: 14px;
  white-space: nowrap;
}

.agile-board .horizontal .horizontal-table > .row > .cell.collapsed.agileDragTargetHoverColor {
  background-color: rgba( 218, 218, 218 ,  1 ) !important;
  background-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 ) !important;
}

.agile-board .horizontal .horizontal-table > .row > .cell:not(.collapsed) > .label {
  display: none !important;
}

.agile-board .horizontal .horizontal-table > .row > .cell.split-column:first-of-type {
  border-right:  1px dashed;
  border-right-color: rgba( 200, 200, 200 ,  1 );
  border-right-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
}

.agile-board .horizontal .horizontal-table > .row > .cell.split-column:last-child {
  border-right-style: none;
}

.agile-board .horizontal .horizontal-table > .row > .cell > .bowtie-chevron-right {
  margin: 6px auto auto auto;
  cursor: pointer;
  font-size: 1.6em;
}

.agile-board .horizontal .horizontal-table > .row > .cell > .bowtie-chevron-left {
  margin-top: 6px;
  cursor: pointer;
  float: right;
  font-size: 1.6em;
}

/*************************
    Add New Item
**************************/
.agile-board {
  /* Keep this consistent with taskboard*/
}

.agile-board .add-card-container {
  display: inline-block;
  width: 100%;
}

.agile-board .board-add-card {
  position: absolute;
  margin-top: 10px;
  padding-right: 5px;
  height: 26px;
  max-width: 130px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.agile-board .board-add-card .text {
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
}

.agile-board .board-add-card .bowtie-math-plus-box-light,
.agile-board .board-add-card .bowtie-math-plus-box-light.enabled {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
  font-size: 2.16em;
  line-height: 12px;
}

.agile-board .bowtie-math-plus {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

/*************************
    Limit Control
**************************/
.agile-board .boards-controls-limit {
  border: solid 1px transparent;
  float: right;
}

.agile-board .boards-controls-limit .current {
  font-size: 18px;
}

.agile-board .boards-controls-limit .limit {
  font-size: 12px;
}

.agile-board .boards-controls-limit .separator {
  font-size: 14px;
}

.agile-board .boards-controls-limit.match .current {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.agile-board .boards-controls-limit.under .current {
  color: rgba( 16, 124, 16 ,  1 );
  color: rgba( var(--palette-accent2-dark,16, 124, 16) ,  1 );
}

.agile-board .boards-controls-limit.exceed .current {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
}

/********************************
    Definition of Done popup
*********************************/
.board-popup.description-popup-content-container.popup-content-control {
  min-width: 200px;
  word-wrap: break-word;
  max-width: 400px;
  max-height: 300px;
  width: auto;
  /* This is to override the base control css */
}

.board-popup.description-popup-content-container.popup-content-control .popup-content-container {
  background-color: rgba( 251, 242, 236 ,  1 );
  background-color: rgba( var(--palette-accent3-light,251, 242, 236) ,  1 );
  box-shadow: 5px 5px 5px -2px rgba( 166, 166, 166 ,  1 );
  box-shadow: 5px 5px 5px -2px rgba( var(--palette-neutral-30,166, 166, 166) ,  1 );
  padding: 0px;
  /*Scroll bar need to be next to the container = having spaces between scroll and parent container.*/
  border: none;
}

.board-popup.description-popup-content-container.popup-content-control .dod-popup-tag {
  height: 12px;
  width: 20px;
  position: fixed;
  overflow: hidden;
}

.board-popup.description-popup-content-container.popup-content-control .dod-popup-tag:before {
  position: relative;
  content: url("../../_content/popup-tag-yellow.png");
  left: 0;
  top: 0;
}

.board-popup.description-popup-content-container .description-content {
  overflow-y: auto;
  overflow-x: hidden;
  min-width: 200px;
  max-width: 400px;
  max-height: 300px;
  padding: 15px 30px 1px 30px;
  outline-width: 0px;
  /* Don't show blue border around tooltip is focused*/
}

.board-popup.description-popup-content-container .description-content .rendered-markdown p {
  white-space: pre-wrap;
  /* Support plain text newlines (singe newline) in DOD markdown view */
  /* Markdown newlines (two newlines) are supported regardless */
}

.board-popup.description-popup-content-container .description-content > pre {
  word-break: break-word;
  word-wrap: break-word;
  white-space: pre-wrap;
  color: rgba( 0, 0, 0 ,  1 );
  color: rgba( var(--palette-neutral-100,0, 0, 0) ,  1 );
  font-size: 12px;
  margin: 0;
  font-family: Segoe UI;
}

/********************************
    Incoming Column Filter
*********************************/
.agile-board .search-input-container {
  float: right;
  height: 26px;
  margin: 10px 0px 0px 0px;
  width: 100%;
}

.agile-board .search-input-container .text-filter-input {
  height: 26px;
  width: 100%;
  padding: 1px 18px 1px 3px;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border:  solid 1px;
  border-color: rgba( 218, 218, 218 ,  1 );
  border-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
  outline: none;
}

.agile-board .search-input-container .text-filter-image {
  top: 15px;
  right: 15px;
}

.agile-board .search-input-container .search-icon-container.hover {
  background-color: rgba( 255, 255, 255 ,  1 ) !important;
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 ) !important;
}

/* for base filter box control */
.base-filter-box.active .text-filter-input {
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border:  1px solid;
  border-color: rgba( 218, 218, 218 ,  1 );
  border-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
}

.base-filter-box input::-ms-clear {
  display: none;
  /* Prevents IE11 x (clear) icon from showing up as to not confuse users */
}

.base-filter-box .search-icon-container {
  width: 24px;
  height: 24px;
  text-align: center;
  padding: 3px;
  float: right;
  outline: none;
  cursor: pointer;
}

/********************************
    Board Level Filter
*********************************/
.hub-pivot .filters .agile-board-search-container {
  float: left;
  padding-top: 3px;
  margin-right: 5px;
  margin-top: 1px;
  width: 146px;
}

.hub-pivot .filters .agile-board-search-container .text-filter-input {
  width: 146px;
  height: 26px;
  padding-right: 18px;
  padding-left: 3px;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  border:  solid 1px;
  border-color: rgba( 218, 218, 218 ,  1 );
  border-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
  outline: 1px dashed rgba( 0, 0, 0 ,  1 ) !important;
  outline: 1px dashed rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

.hub-pivot .filters .agile-board-search-container .text-filter-image {
  position: relative;
  top: -20px;
}

.hub-pivot .filters .agile-board-search-container .search-icon-container {
  margin-top: 2px;
}

.hub-pivot .filters .agile-board-search-container .search-icon-container.hover {
  background-color: rgba( 222, 236, 249 ,  1 ) !important;
  background-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 ) !important;
  outline: 1px solid rgba( 199, 224, 244 ,  1 ) !important;
  outline: 1px solid rgba( var(--palette-primary-tint-20,199, 224, 244) ,  1 ) !important;
}

.hub-pivot .filters .agile-board-search-container .search-icon-container:focus {
  outline: 1px dashed rgba( 0, 0, 0 ,  1 ) !important;
  outline: 1px dashed rgba( var(--palette-neutral-100,0, 0, 0) ,  1 ) !important;
}

.hub-pivot .filters .agile-board-pivot-contributions {
  float: left;
}

/********************************
    Swimlanes
*********************************/
.agile-board .swimlane-header-icon {
  float: left;
}

.agile-board .swimlane-header-detail-count > span:first-child {
  font-weight: bold;
}

.agile-board .swimlane-header-detail-count > span:last-child {
  padding-left: 5px;
}

.agile-board .member-header .swimlane-member-header {
  display: inline-block;
}

.agile-board .member-header.swimlane-collapsed {
  height: 24px;
  border-bottom: none;
  overflow: hidden;
}

.agile-board .swimlanes {
  padding: 0 0 0 0 !important;
  height: 100%;
}

.agile-board .swimlanes > .member-vertical {
  border-bottom:  3px solid;
  border-bottom-color: rgba( 255, 255, 255 ,  1 );
  border-bottom-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
}

.agile-board .swimlane.horizontal.swimlane-collapsed {
  display: none !important;
}

.agile-board .swimlane.horizontal > .agile-header-container,
.agile-board .swimlane.horizontal > .agile-content-container {
  position: static;
  padding-left: 0;
}

.agile-board .swimlane.horizontal > .agile-content-container .horizontal-table > .row > .cell {
  border-left: none;
  height: 100%;
}

.agile-board .swimlane.horizontal > .agile-content-container .horizontal-table > .row > .cell:last-child {
  border-right: none;
}

.agile-board .swimlane-collapsed .swimlane-header-detail-count:not(.hidden-header) {
  display: inline-block !important;
  padding-left: 10px;
  font-size: 12px;
  max-width: 160px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/********************************
   Click to Edit
*********************************/
.agile-board .member-header-content.editable {
  cursor: pointer;
}

.agile-board .member-header-content-input {
  padding-right: 18px;
  outline-color: rgba( 222, 236, 249 ,  1 );
  outline-color: rgba( var(--palette-primary-tint-30,222, 236, 249) ,  1 );
  width: 100%;
}

.agile-board .member-header-content-input::-ms-clear {
  display: none;
}

.agile-board .swimlane-header-title {
  display: inline-block;
  font-size: 14px;
  padding-left: 2px;
  padding-top: 2px;
  padding-right: 20px;
  color: rgba( 51, 51, 51 ,  1 );
  color: rgba( var(--palette-neutral-80,51, 51, 51) ,  1 );
  max-width: 250px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.agile-board .swimlane-header-title::after {
  content: '';
  display: block;
}

.agile-board .swimlane-header-detail-count {
  display: none;
}

.agile-board .member-header-content-input {
  border:  solid 1px;
  border-color: rgba( 249, 235, 235 ,  1 );
  border-color: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
  width: 100%;
}

.agile-board .click-to-edit .member-header-edit.member.header.member-header-error .member-header-content-input {
  border:  1px solid;
  border-color: rgba( 218, 10, 0 ,  1 );
  border-color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
  background: rgba( 249, 235, 235 ,  1 );
  background: rgba( var(--palette-accent1-light,249, 235, 235) ,  1 );
}

.agile-board .click-to-edit.horizontal .member-header-content-input {
  padding-left: 10px;
  min-height: 26px;
}

.agile-board .click-to-edit.horizontal .member-header-edit.member.header {
  left: -10px;
  position: relative;
}

.agile-board .click-to-edit.vertical {
  height: 24px;
}

.agile-board .click-to-edit.vertical .member-header-edit.member.header {
  padding-top: 2px;
}

.agile-board .click-to-edit.vertical .member-header-content-input {
  height: 20px;
  width: 250px;
}

.agile-board .member-header-edit.member.header {
  width: 100%;
  height: 100%;
}

/********************************
    Error Message Bubble
*********************************/
.agile-board-error-message-bubble {
  position: absolute;
  padding: 2px 10px 2px 5px;
  background-color: rgba( 255, 255, 255 ,  1 );
  background-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 );
  margin: 1em 0;
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
  z-index: 1000;
  border:  1px solid;
  border-color: rgba( 218, 10, 0 ,  1 );
  border-color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
  word-wrap: break-word;
}

.agile-board-error-message-bubble::before {
  top: -8px;
  bottom: auto;
  content: "";
  position: absolute;
  left: 20px;
  border-width: 0 8px 8px;
  border-color: rgba( 218, 10, 0 ,  1 ) transparent;
  border-color: rgba( var(--palette-accent1,218, 10, 0) ,  1 ) transparent;
  border-style: solid;
  display: block;
  width: 0;
}

.agile-board-error-message-bubble::after {
  content: "";
  position: absolute;
  top: -7px;
  left: 21px;
  border-width: 0 7px 7.5px;
  border-color: rgba( 255, 255, 255 ,  1 ) transparent;
  border-color: rgba( var(--palette-neutral-0,255, 255, 255) ,  1 ) transparent;
  border-style: solid;
  display: block;
  width: 0;
}

.agile-board-error-message-text {
  margin-left: 20px;
}

.agile-board-error-message {
  color: rgba( 218, 10, 0 ,  1 );
  color: rgba( var(--palette-accent1,218, 10, 0) ,  1 );
  display: inline-block;
}

/* Paging styles */
.agile-board .page-items-container {
  padding-bottom: 8px;
  padding-top: 8px;
  padding-left: 5px;
}

.agile-board .no-result-message {
  padding-top: 8px;
  padding-left: 5px;
}

/***************************
    General Bowtie Icon
****************************/
.boards-backlog-view .agile-board .bowtie-icon.bowtie-math-multiply, .board-container .agile-board .bowtie-icon.bowtie-math-multiply {
  display: inline-block;
  width: 16px;
  height: 16px;
  position: absolute;
  right: 4px;
  top: 4px;
  cursor: pointer;
  font-size: 10px;
}

/***************************
    Markdown for Definition of Done
****************************/
.description-content .rendered-markdown, .description-content .rendered-markdown * {
  font-size: 12px;
  line-height: 150%;
  /* fallback fonts have not been confirmed */
  font-family: 'Segoe UI', Tahoma, Helvetica, Sans-Serif;
  color: rgba(0, 0, 0, .9);
  color: var(--text-primary-color,rgba(0, 0, 0, .9));
}

.description-content .rendered-markdown .bowtie-navigate-external {
  visibility: hidden;
}

.description-content .rendered-markdown h1,
.description-content .rendered-markdown h2,
.description-content .rendered-markdown h3,
.description-content .rendered-markdown h4,
.description-content .rendered-markdown h5,
.description-content .rendered-markdown h6 {
  font-weight: normal;
  margin: 0 0 8px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  border-bottom: none;
  font-weight: 600;
  font-family: 'Segoe UI Light', 'Segoe UI', Tahoma, Helvetica, Sans-Serif;
}

.description-content .rendered-markdown h1 {
  font-size: 26px;
}

.description-content .rendered-markdown h2 {
  font-size: 20px;
}

.description-content .rendered-markdown h3 {
  font-size: 18px;
}

.description-content .rendered-markdown h4 {
  font-size: 16px;
}

.description-content .rendered-markdown h5 {
  font-size: 14px;
}

.description-content .rendered-markdown h6 {
  font-size: 12px;
}

.description-content .rendered-markdown a {
  color: rgba(0, 90, 158, 1);
  color: var(--communication-foreground,rgba(0, 90, 158, 1));
  text-decoration: none;
  cursor: pointer;
}

.description-content .rendered-markdown p {
  margin: 0 0 16px;
  word-wrap: break-word;
}

.description-content .rendered-markdown ul,
.description-content .rendered-markdown ol {
  margin: 0 0 19px;
  padding: 0 0 0 19px;
}

.description-content .rendered-markdown ul li {
  line-height: 1.2em;
  list-style: circle;
}

.description-content .rendered-markdown ol li {
  line-height: 1.2em;
  list-style: decimal;
}

.description-content .rendered-markdown hr {
  display: block;
  border: none;
  height: 1px;
  background: rgba( 200, 200, 200 ,  1 );
  background: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  margin: 5px auto;
  width: 100%;
  border-bottom: none;
}

.description-content .rendered-markdown pre {
  overflow: auto;
  border:  1px solid;
  border-color: rgba( 200, 200, 200 ,  1 );
  border-color: rgba( var(--palette-neutral-20,200, 200, 200) ,  1 );
  padding: 10px;
}

.description-content .rendered-markdown code,
.description-content .rendered-markdown kbd,
.description-content .rendered-markdown pre,
.description-content .rendered-markdown samp {
  font-family: monospace, monospace;
  font-size: 12px;
}

.description-content .rendered-markdown table {
  width: 100%;
  max-width: 100%;
  margin-bottom: 21px;
  border-collapse: collapse;
  border-spacing: 0;
}

.description-content .rendered-markdown th,
.description-content .rendered-markdown td {
  border:  1px solid;
  border-color: rgba( 218, 218, 218 ,  1 );
  border-color: rgba( var(--palette-neutral-10,218, 218, 218) ,  1 );
  padding: 5px;
}

.board-content-view .vss-HubBreadcrumb--item > button {
  margin-left: 2px;
}