.vcoverlay.expert {
  padding: 0 30px 20px;
  min-height: 190px;
  min-width: 60%;
}
@media only screen and (max-width: 980px) {
  .vcoverlay.expert {
    min-width: 70%;
  }
}
@supports (-webkit-overflow-scrolling: touch) {
  .vcoverlay.expert {
    /* CSS specific to iOS devices */
  }
  .vcoverlay.expert.safari_only {
    padding-bottom: 80px;
  }
  .vcoverlay.expert.safari_only_big {
    padding-bottom: 120px;
  }
  .vcoverlay.expert.toolbar-hidden {
    padding-bottom: 0;
  }
}
.vcoverlay.expert select {
  width: 100%;
}
.vcoverlay.expert #layers-select,
.vcoverlay.expert #layers-filter {
  width: 100%;
  font-size: 18px;
}
.vcoverlay.expert .vcoverlay-sticky-header {
  padding: 20px 0;
}
.vcoverlay.expert .sort-icon {
  margin-right: 15px;
  font-size: 20px;
}
.vcoverlay.expert .close {
  right: 0px;
}
.vcoverlay--ontop {
  z-index: 11122;
}
.vcoverlay--ontop h1 {
  width: 80%;
}
.vcoverlayBackground {
  position: fixed;
  left: 0;
  top: 0;
  width: 100vW;
  height: 100vH;
  background: rgba(255, 255, 255, 0.5);
  z-index: 11119;
}
.vcoverlayBackground.ontop {
  z-index: 11121;
}
.vcoverlay.nopadding .vcoverlay-sticky-header {
  padding: 0;
}
.vcoverlay.nopadding .close {
  top: 0;
}
.expert .direction,
.expert .build-type,
.expert .signature-request-type {
  display: flex;
  justify-content: space-evenly;
  padding: 0 0 20px;
}
.expert .layer {
  border-bottom: 1px solid #ccc;
  padding: 10px 0;
  margin: 5px 0;
  cursor: grab;
}
.expert .product {
  margin: 5px 0;
  cursor: grab;
}
.expert .productlist,
.expert .add-product {
  margin-left: 25px;
  padding-left: 0;
}
.expert .build-name__input {
  width: 100%;
  padding: 3px 0;
  margin: 5px 0 0 ;
}
.expert .filter-build {
  width: 100%;
  padding: 3px 0;
}
.expert .build-info,
.expert .signature-request__info {
  display: flex;
  gap: 10px;
  align-items: center;
}
.expert .signature-request__block,
.expert .signature-detail__block {
  display: flex;
  flex-direction: column;
}
.expert .signature-request__block .fas,
.expert .signature-detail__block .fas {
  margin: 0 5px 0 0;
}
.expert .build-list,
.expert .signature-request-list {
  display: flex;
  justify-content: space-evenly;
  align-items: flex-start;
  flex-direction: column;
  margin: 10px 0 20px;
}
.expert .build-list .build,
.expert .signature-request-list .build,
.expert .build-list .signature-request,
.expert .signature-request-list .signature-request {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px;
  width: 100%;
  box-sizing: border-box;
  cursor: pointer;
}
.expert .build-list .build--read,
.expert .signature-request-list .build--read,
.expert .build-list .signature-request--read,
.expert .signature-request-list .signature-request--read {
  opacity: 50%;
}
.expert .build-list .build:nth-child(even),
.expert .signature-request-list .build:nth-child(even),
.expert .build-list .signature-request:nth-child(even),
.expert .signature-request-list .signature-request:nth-child(even) {
  background-color: #ececec;
}
.expert .build-list .build:hover,
.expert .signature-request-list .build:hover,
.expert .build-list .signature-request:hover,
.expert .signature-request-list .signature-request:hover {
  background-color: #ccc;
}
.expert .build-list .build .load-build__name,
.expert .signature-request-list .build .load-build__name,
.expert .build-list .signature-request .load-build__name,
.expert .signature-request-list .signature-request .load-build__name {
  margin: 0 20px 0 0;
}
.expert .build-list .build .btn,
.expert .signature-request-list .build .btn,
.expert .build-list .signature-request .btn,
.expert .signature-request-list .signature-request .btn {
  margin: 0 0 0 30px;
}
.expert .comment-display {
  float: right;
  max-width: 25%;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.expert .comment-display .create-comment {
  padding-right: 0;
}
.expert .comment-display .expert-comment {
  font-size: 14px;
  color: #aaa;
  word-break: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.expert .comment-container {
  display: none;
  padding: 10px 0;
  margin: 5px 0;
}
.expert .comment-container .comment-container--indent {
  margin-left: 25px;
}
.expert .comment-container .comment-header {
  margin-bottom: 5px;
}
.expert .comment-container .comment-select {
  margin-bottom: 10px;
}
.expert .name {
  margin-right: 10px;
}
.expert.flex-container {
  display: flex;
}
.expert.flex--direction-column {
  flex-direction: column;
}
.expert.flex--half-width {
  box-sizing: border-box;
  width: 50%;
}
.expert.flex--margin-left {
  margin-left: 5px;
}
.expert .text-editor-button-row {
  padding-left: 20px;
  padding-top: 10px;
}
.expert .text-editor-button-row:after {
  content: "";
  display: table;
  clear: both;
}
.expert.btn {
  position: relative;
  font-family: "Nuber-Bold", "Lato", Helvetica, Arial, sans-serif;
  font-size: 16px;
  background-color: #5b86a3;
  color: #fff;
  padding: 10px 20px;
  border: none;
  transition-duration: 0.3s;
  width: 100%;
  cursor: pointer;
}
.expert.btn:hover {
  filter: brightness(80%);
  transition-duration: 0.3s;
}
.expert.btn.disabled {
  background-color: #aaa;
}
.expert.btn.btn--center {
  width: auto;
  margin: 10px auto;
  display: block;
}
.expert.btn.btn--left {
  width: auto;
  float: left;
  display: block;
}
.expert.btn.btn--right {
  width: auto;
  float: right;
  display: block;
}
.expert.btn.btn--uppercase {
  text-transform: uppercase;
}
.expert.btn.btn--width-auto {
  width: auto;
}
.expert.btn.btn--margin-left {
  margin-left: 5px;
}
.expert.btn.btn--margin-right {
  margin-right: 5px;
}
.expert.btn.btn--margin-top {
  margin-top: 5px;
}
.expert.btn.btn--margin-bottom {
  margin-bottom: 5px;
}
.expert.btn .btn__text {
  transition: all 0.2s;
}
.expert.btn.btn--loading .btn__text {
  visibility: hidden;
  opacity: 0;
}
.expert.btn.btn--loading::after {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  border: 4px solid transparent;
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: button-loading-spinner 1s ease infinite;
}
@keyframes button-loading-spinner {
  from {
    transform: rotate(0turn);
  }
  to {
    transform: rotate(1turn);
  }
}
.icon-button {
  margin: 5px 0;
  background-color: white;
  border: 0px;
  color: #5b86a3;
  cursor: pointer;
  font-size: 12px;
}
.icon-button i {
  margin-right: 5px;
}
.icon-button.icon-button--background-fill i {
  line-height: 25px;
  background: #5b86a3;
  color: #ffffff;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  padding: 0;
  font-size: 8px;
}
.icon-button.icon-button--center {
  margin: 0 auto;
  display: block;
}
.icon-button.btn--left {
  width: auto;
  float: left;
  display: block;
  margin-top: 11px;
}
.icon-button.btn--right {
  width: auto;
  float: right;
  display: block;
  margin-top: 11px;
  margin-right: 15px;
}
.comment-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: end;
  margin: 0 0 10px;
}
.comment-wrapper .expert.comment-input {
  width: auto;
  font-size: 17px;
}
.comment-wrapper .remove-comment {
  font-size: 15px;
}
.menu-overlay {
  display: none;
  width: 100%;
  height: 100%;
  background: rgba(240, 248, 255, 0.5);
  position: absolute;
  top: 0;
  z-index: 1200;
}
@media (max-width: 495px) {
  .menu-overlay {
    position: fixed;
    height: 100vH;
    width: 100vW;
    z-index: 1220;
  }
}
.menu-overlay .project-settings {
  position: relative;
  display: block;
  background: #fff;
  margin: 0 auto;
  width: 60%;
  max-height: 100%;
  box-sizing: border-box;
  padding: 20px;
  top: 0%;
  -webkit-box-shadow: 0 5px 5px 0 rgba(125, 125, 125, 0.5);
  box-shadow: 0px 5px 5px 0px rgba(125, 125, 125, 0.5);
  z-index: 100;
  overflow-y: auto;
}
@media (max-width: 768px) {
  .menu-overlay .project-settings {
    width: 100%;
  }
}
@media only screen and (max-height: 770px) {
  .menu-overlay .project-settings {
    height: 80%;
    overflow-y: auto;
  }
}
.menu-overlay .project-settings .close-menu {
  cursor: pointer;
  float: right;
}
.menu-overlay .project-settings .project-settings-container .flex-container {
  display: flex;
  justify-content: space-between;
}
.menu-overlay .project-settings .project-settings-container .flex-container .flex-half-width {
  width: 48%;
}
.menu-overlay .project-settings .project-settings-container h3 {
  font-weight: bold;
  padding: 0 0 10px 0;
}
.menu-overlay .project-settings .project-settings-container p {
  font-size: 15px;
  padding: 0 0 5px 0;
}
.menu-overlay .project-settings .project-settings-container input {
  width: 100%;
  box-sizing: border-box;
  margin-bottom: 10px;
}
.menu-overlay .project-settings .project-settings-container .project-settings-header {
  margin-bottom: 10px;
}
.menu-overlay .project-settings .project-settings-container textarea {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  margin-bottom: 10px;
  font-size: 11px;
  border-color: lightgray;
}
.menu-overlay .project-settings .pdf-comment-select {
  width: 100%;
  margin-bottom: 10px;
}
.menu-overlay .project-settings .add-pdf-comment {
  margin-bottom: 20px;
}
.menu-overlay .project-settings .save-settings-button {
  display: block;
  margin: 10px auto;
  width: 25%;
  padding: 7px 5px;
  box-sizing: border-box;
  border: 1px solid #5b86a3;
  font-size: 13px;
  color: #fff;
  text-transform: uppercase;
  background: #5b86a3;
}
@media (max-width: 495px) {
  .menu-overlay .project-settings .save-settings-button {
    width: 100%;
  }
}
@media (max-width: 768px) {
  .menu-overlay .project-settings .save-settings-button {
    width: 100%;
  }
}
.multipdf-build-name {
  text-align: center;
  margin: 10px 0;
  font-size: 20px;
}
.ql-container {
  font-size: 18px !important;
}
.ql-editor {
  min-height: 100px;
}
.sortable-ghost {
  visibility: hidden;
}
.a4c_info {
  display: flex;
  justify-content: flex-start;
  margin: 20px 0 0;
  padding: 10px;
  border: 1px solid #5b86a3;
}
.a4c_info i {
  padding: 0 20px 0 0;
}
.a4c_ticketid {
  font-size: 13px;
}
.add-private-comment-overlay input,
.add-pdf-comment-overlay input {
  width: calc(100% - 10px);
  font: inherit;
  font-size: 15px;
}
.add-private-comment-overlay input[type=radio],
.add-pdf-comment-overlay input[type=radio] {
  width: auto;
}
.add-private-comment-overlay textarea,
.add-pdf-comment-overlay textarea {
  margin: 0;
  max-width: unset;
  width: 100%;
  box-sizing: border-box;
}
.add-private-comment-overlay .hl,
.add-pdf-comment-overlay .hl {
  margin: 10px 0 5px 0;
  display: inline-block;
}
.add-private-comment-overlay .btn,
.add-pdf-comment-overlay .btn {
  position: relative;
  font-family: "Nuber-Bold", "Lato", Helvetica, Arial, sans-serif;
  font-size: 16px;
  background-color: #5b86a3;
  color: #fff;
  padding: 10px 20px;
  border: none;
  transition-duration: 0.3s;
  cursor: pointer;
  margin: 10px;
}
.add-private-comment-overlay .btn:hover,
.add-pdf-comment-overlay .btn:hover {
  filter: brightness(80%);
  transition-duration: 0.3s;
}
.add-private-comment-overlay .btn.cancel,
.add-pdf-comment-overlay .btn.cancel {
  background-color: #aaa;
}
.add-private-comment-overlay .private-comment-save-for-list-container,
.add-pdf-comment-overlay .private-comment-save-for-list-container {
  margin: 10px 0;
}
.add-private-comment-overlay .private-comment-delete-list-container > div,
.add-pdf-comment-overlay .private-comment-delete-list-container > div,
.add-private-comment-overlay .pdf-comment-delete-list-container > div,
.add-pdf-comment-overlay .pdf-comment-delete-list-container > div {
  font-size: 12px;
  padding: 5px;
  cursor: pointer;
}
.add-private-comment-overlay .private-comment-delete-list-container > div i,
.add-pdf-comment-overlay .private-comment-delete-list-container > div i,
.add-private-comment-overlay .pdf-comment-delete-list-container > div i,
.add-pdf-comment-overlay .pdf-comment-delete-list-container > div i {
  margin-right: 5px;
}
#add-layer-controls {
  margin: 0;
  height: 50px;
  width: 100%;
}
#add-layer-controls input#layer-filter {
  margin-top: 10px;
  padding: 10px;
  font-size: 18px;
  width: calc(100% - 20px);
  border-width: 1px;
  float: left;
}
#add-layer-results li.hidden {
  display: none;
}
#add-layer-results {
  margin: 0;
  margin-top: 15px;
}
#add-layer-results .result-wrapper {
  cursor: pointer;
}
#add-layer-results li {
  width: 100%;
  height: 48px;
  margin: 2px 0px;
  padding: 10px 0;
  border-top: 1px solid lightgrey;
  display: flex;
  align-items: center;
  word-break: break-word;
}
@media only screen and (max-width: 599px) {
  #add-layer-results li {
    height: 45px;
    font-size: 16px;
  }
}
#add-layer-results li * {
  display: inline-block;
  vertical-align: middle;
}
#add-layer-results li p {
  left: 100px;
}
#add-layer-results li .layer-image-wrapper {
  margin: auto 15px;
  height: 40px;
  width: 40px;
}
#add-layer-results li .layer-image-wrapper img {
  margin: 0;
  max-height: 70px;
  max-width: 40px;
  object-fit: contain;
}
.a4c-connection {
  font-size: 14px;
  margin-right: 10px;
}
.status-indicator {
  margin-right: 5px;
}
.status-indicator .status {
  background: #76935a;
  border-radius: 50%;
  width: 20px;
  height: 20px;
}
.signature__form {
  min-width: 400px;
  padding: 3px;
}
.signature__form--has-signature {
  border: solid 5px #76935a;
  min-width: unset;
}
.signature__container {
  position: relative;
  height: 200px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background: grey;
}
.signature__file {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
  opacity: 0;
}
.signature__uploadhint {
  z-index: 2;
}
.signature__uploadhint--hidden {
  display: none;
}
.signature__icon {
  position: absolute;
  font-size: 64px;
  display: none;
  color: #76935a;
  z-index: 2;
}
.signature__icon--show {
  display: block;
}
.vcoverlay .signature__message {
  padding: 0;
  margin: 10px 0;
  z-index: 1;
}
.signature__image {
  height: 100%;
  width: auto;
  z-index: 2;
}
.received-signature {
  cursor: pointer;
}
.vcoverlay .signature-detail__textarea {
  margin: 20px 0;
  max-width: unset;
  box-sizing: border-box;
}
.signature-detail__comment {
  margin: 20px 0;
}
.signature-detail__status {
  margin: 0 0 20px;
}
.signature-detail__project-name {
  margin: 20px 0 0;
}
.request-status {
  display: flex;
  align-items: center;
  margin: 0 0 20px;
}
.request-status .status {
  margin: 0 0 0 10px;
  display: inline-block;
  border-radius: 50%;
  width: 15px;
  height: 15px;
}
.request-status .status-ok {
  background: #76935a;
}
.request-status .status-warning {
  background: #b64343;
}