.btn {
  justify-content: center;
  height: 50px;
  border: none;
  align-items: center;
  padding: 0px 20px;
  flex-shrink: 0;
  cursor: pointer;
  font-weight: 700;
  text-decoration: none;
  font-size: 16px;
  border-radius: 5px;
  display: flex;
  background: var(--c-backdrop);
  color: var(--c-text);
}

.btn:hover {
  background: var(--c-backdrop-emp);
}

.btn.btn-lg {
  padding: 20px 30px;
  height: 50px;
}

.btn.btn-sm {
  font-size: 14px;
  height: 35px;
}

.btn.btn-xs {
  line-height: 100%;
  max-width: 90px;
  justify-content: center;
  height: 35px;
  text-transform: uppercase;
  align-items: center;
  cursor: pointer;
  font-weight: 700;
  font-size: 12px;
  border-radius: 3px;
  display: flex;
  background: var(--c-backdrop);
  color: var(--c-text);
}

.btn.btn-xs:hover {
  background: var(--c-backdrop-emp);
}

.btn.btn.btn-darker {
  background: var(--c-backdrop) !important;
}

.btn.btn.btn-darker:hover {
  background: var(--c-backdrop-emp) !important;
}

.btn.btn-float {
  max-width: 100% !important;
  width: auto;
  display: inline-flex;
}

.btn.btn-signup {
  background: #e66a69;
  color: #fff;
}

.btn.btn-nav {
  background: #fbe3dd;
  color: #fb5e48;
}

@media (max-width: 576px) {

  .btn.btn-nav {
    border-radius: 50%;
    width: 25px;
    height: 25px;
    font-size: 12px;
    padding: 10px;
  }

}

.btn.btn-inverse {
  background: var(--c-bg) !important;
}

.btn.btn-inverse:hover {
  background: var(--c-backdrop) !important;
}

.btn.btn-backdrop {
  background: var(--c-backdrop) !important;
}

.btn.btn-backdrop:hover {
  background: var(--c-backdrop-emp) !important;
}

.btn.btn-primary {
  background: var(--c-bg-hl);
}

.btn.btn-primary:hover {
  background: var(--c-bg-hl-emp);
}

.btn.btn-primary:disabled {
  background: var(--c-backdrop-less);
  cursor: not-allowed;
}

.btn.btn-accent {
  background: var(--c-bg-accent) !important;
  color: rgba(255, 255, 255, 0.85) !important;
}

.btn.btn-accent:hover {
  background: var(--c-bg-hl-emp);
}

.btn.btn-accent:disabled {
  background: var(--c-backdrop-less);
  cursor: not-allowed;
}

.btn.btn-success {
  background: #2dc08d;
  color: #fff;
}

.btn.btn-success:hover {
  background: #26a378;
}

.btn.btn-success:disabled {
  background: #3fd29f;
  opacity: .8;
  cursor: default;
}

.btn.btn-purple {
  background: hsla(264.3243, 100%, 23.72549%, 1.0);
  color: #fff;
}

.btn.btn-text {
  background: inherit !important;
  color: var(--c-text);
}

.btn.btn-text:hover {
  background: inherit !important;
  color: var(--c-emp);
}

.btn.btn-form {
  width: 100%;
}

.btn.btn-inline {
  width: auto !important;
  display: inline-flex;
}

.btn.btn-pill {
  border-radius: 30px;
}

.btn.btn-round {
  border-radius: 50%;
  height: 35px;
  width: 35px;
  padding: 0;
  overflow: hidden;
  display: flex;
  font-size: 12px;
}

.btn.btn-danger {
  background: #fb5e48;
  color: #fff;
}

.btn.btn-danger:hover {
  background: hsla(7.374302, 95.721924%, 58.333332%, 1.0);
}

.btn.btn-danger:disabled {
  background: hsla(7.374302, 95.721924%, 68.333336%, 1.0);
}

.btn.btn-danger-text {
  background: inherit;
  color: #fb5e48;
}

.btn.btn-more, .btn.btn-less {
  background: var(--c-bg-hl);
  padding: 10px;
  color: var(--c-text);
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 700;
}

.btn.btn-more:hover, .btn.btn-less:hover {
  color: var(--c-emp);
}

.btn.btn-secondary {
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.btn.btn-secondary:hover {
  background: var(--c-bg-hl-emp);
}

.btn.btn-secondary:disabled {
  background: var(--c-bg-hl-less);
  opacity: .8;
  cursor: default;
}

.btn.btn-gray {
  background: #EDEEEE;
  color: #314252;
}

.btn-accent-xs {
  height: 25px;
  border: none;
  padding: 5px 10px;
  cursor: pointer;
  font-size: 12px;
  border-radius: 2px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-emp);
}

.form {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  width: 100%;
}

.form.form--inline {
  background: var(--c-bg-hl);
  padding: 20px 20px 0 20px;
  border-radius: 3px;
  flex-shrink: 0;
}

.form-info-box {
  padding: 20px;
  background: var(--c-bg-hl);
  width: 100%;
  border-radius: 5px;
}

.form-title {
  font-weight: 700;
  color: var(--c-text);
  line-height: 140%;
}

.form-lead {
  color: var(--c-text);
  line-height: 140%;
}

input[type=number] {
  -moz-appearance: textfield;
}

.input {
  width: 100%;
  font-family: Inter,
    -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,
    Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
  height: 45px;
  -webkit-appearance: none;
  border: 2px solid var(--c-bg-hl);
  padding: 10px;
  font-size: 14px;
  border-radius: 5px;
  box-sizing: border-box;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.input::-webkit-inner-spin-button, .input::-webkit-outer-spin-button {
  -webkit-appearance: none;
}

.input.input--appearance-default {
  moz-appearance: initial;
  -webkit-appearance: initial;
}

.input.input--appearance-default::-webkit-inner-spin-button, .input.input--appearance-default::-webkit-outer-spin-button {
  -webkit-appearance: inner-spin-button;
}

.input:focus {
  border-color: var(--c-bg-hl-emp);
}

.input.input--textarea {
  height: auto;
}

.input.input--select {
  -webkit-appearance: none;
}

.input.input--inline {
  height: 25px;
  background: var(--c-bg);
  font-size: 12px;
  padding: 5px;
  border: 1px solid var(--c-bg-hl);
  border-radius: 3px;
}

.input.input--inline:focus {
  border-color: var(--c-bg-hl-emp);
}

.input.input--inline.input--select {
  padding: 0 5px;
}

.input.input--inline.input--textarea {
  height: auto;
}

.input.input--trix {
  height: 28px;
  padding: 2px 10px;
}

.input.input--inverse {
  background: var(--c-bg);
}

.input::placeholder, .input::-moz-placeholder, .input:-ms-input-placeholder, .input::-webkit-input-placeholder {
  color: var(--c-text);
  opacity: 1;
}

.input.input--disabled {
  background: var(--c-bg-hl);
  color: #7F90A0;
}

.input.input--wrapped {
  border: none;
}

.select-wrapper {
  position: relative;
}

.select-wrapper:after {
  width: 0;
  right: 5px;
  border-left: 5px solid transparent;
  top: 50%;
  height: 0;
  border-right: 5px solid transparent;
  position: absolute;
  margin-top: -2px;
  border-top: 5px solid var(--c-text);
  content: " ";
}

::placeholder {
  color: var(--c-text);
  opacity: 0.5;
}

.input-wrapper {
  display: flex;
  height: 100%;
  align-items: center;
  background: var(--c-bg-hl);
  border: 2px solid var(--c-bg-hl);
  border-radius: 5px;
}

.input-icon {
  padding: 0 10px;
  color: #7F90A0;
}

.input-icon:hover {
  color: #314252;
}

.label {
  display: flex;
  width: 100%;
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: 700;
}

.label.label--inline {
  color: var(--c-text);
}

.error {
  display: flex;
  width: 100%;
  font-size: 12px;
  font-weight: 700;
  color: red;
}

.help-text {
  font-size: 12px;
  color: var(--c-text);
}

.form-link {
  color: var(--c-emp);
}

.form-link.form-link--muted {
  color: #5E7182;
}

.form-group {
  width: 100%;
  margin-bottom: 20px;
}

.form-group.form-group--inline {
  display: flex;
  align-items: center;
}

.form-group.form-group--grid {
  display: grid;
  grid-template-columns: 16px 1fr;
  grid-column-gap: 20px;
}

.form-group.form-group--grid .error, .form-group.form-group--grid .help-text {
  grid-column-start: 2;
}

.contact-opportunity-form {
  display: grid;
  grid-template-columns: 70px 1fr 90px;
  grid-gap: 10px;
}

.icon-label {
  color: var(--c-bg-hl-emper);
  width: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.label-sm {
  margin-right: 10px;
  padding: 5px 10px;
  cursor: pointer;
  font-weight: 700;
  font-size: 12px;
  border-radius: 2px;
  display: inline-flex;
  background: var(--c-bg-hl);
  color: var(--c-emp);
}

.label-sm:last-child {
  margin-right: 0;
}

.label-sm:hover {
  background: var(--c-bg-hl-emp);
}

.form-buttons {
  width: 100%;
}

.form-errors {
  width: 100%;
  background: #ffabab;
  padding: 20px 40px;
  border-radius: 5px;
  margin: 0;
  margin-bottom: 20px;
}

.form-errors.form-errors--xs {
  padding: 10px 20px;
  margin-bottom: 5px;
  font-size: 12px;
}

.form-errors__error {
  color: hsla(0, 59.813084%, 38.039215%, 1.0);
  margin-bottom: 5px;
}

.form-errors__error:last-child {
  margin-bottom: 0;
}

.form-success {
  width: 100%;
  background: #86e4b7;
  color: #41987a;
  font-weight: 500;
  padding: 20px;
  border-radius: 5px;
  margin: 0;
  margin-bottom: 20px;
}

.demo-form-container {
  width: 100%;
  background: var(--c-bg-hl);
  border-radius: 5px;
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.demo-form {
  display: grid;
  grid-template-columns: 1fr 100px;
  grid-column-gap: 10px;
  max-width: 600px;
  width: 100%;
}

@media (max-width: 768px) {

  .demo-form {
    grid-template-columns: 1fr;
  }

}

.demo-form-text {
  height: 45px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 10px;
  color: var(--c-emp);
  font-weight: 500;
}

@media (max-width: 768px) {

  .demo-form-text {
    margin-bottom: 10px;
  }

}

.demo-form-input {
  height: 45px;
  background: var(--c-bg);
}

@media (max-width: 768px) {

  .demo-form-input {
    margin-bottom: 10px;
  }

}

.demo-form-btn {
  height: 45px;
  background: var(--c-bg) !important;
}

trix-editor {
  min-height: 10em !important;
  border: 2px solid var(--c-bg-hl) !important;
  background: var(--c-bg-hl) !important;
}

.trix-button-group {
  background: var(--c-bg-hl) !important;
  border-radius: 5px !important;
  overflow: hidden;
}

.trix-button, .trix-button-group {
  border: 1px solid var(--c-bg-hl) !important;
}

.trix-active {
  background: var(--c-bg-hl-emper) !important;
  border: 1px solid var(--c-bg-hl-emper) !important;
}

.trix-button-group--file-tools, .trix-button--icon-code {
  display: none !important;
}

.trix--inverse trix-editor {
  background: var(--c-bg) !important;
}

.trix--inverse .trix-button-group {
  background: var(--c-bg) !important;
}

.trix--inverse .trix-button {
  border: none !important;
}

.trix--inverse .trix-active {
  background: var(--c-bg-hl-emper) !important;
  border: none !important;
}

trix-editor:empty:not(:focus)::before {
  color: var(--c-text);
  opacity: 0.5;
}

.shortcut-label {
  border-bottom: 3px solid var(--c-bg-hl-emp);
  line-height: 100%;
  justify-content: center;
  font-family: Menlo, Monaco, Roboto Mono, Cascadia Mono, Oxygen Mono, Ubuntu Monospace, Source Code Pro, Fira Mono, Fira Code, Droid Sans Mono, Segoe UI Mono, monospace;
  align-items: center;
  padding: 5px;
  border-radius: 3px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-secondary);
}

.shortcut-label.shortcut-helper--btn {
  background: var(--c-backdrop);
}

.shortcuts-table {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 10px;
}

.flatpickr-calendar.open {
  z-index: 2147483647 !important;
}

.contact-form {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  width: 100%;
  max-width: 500px;
}

.contact-form-buttons {
  width: 100%;
  padding-bottom: 10px;
  max-width: 650px;
  border-right: 1px solid var(--c-bg-hl-emp);
  position: fixed;
  border-top: 1px solid var(--c-bg-hl-emp);
  border-radius: 0px 5px 0px 0px;
  display: flex;
  bottom: 0;
  background: var(--c-bg-hl);
  padding-top: 10px;
  left: 250px;
}

.contact-form-buttons.contact-form-buttons.contact-form-buttons--collapsed-nav {
  left: 50px;
}

@media (max-width: 992px) {

  .contact-form-buttons {
    left: 0px !important;
    padding-left: 0;
    max-width: 630px;
    border-radius: 0;
  }

}

.contact-form-buttons-inner {
  max-width: 630px;
  padding-left: 20px;
}

@media (max-width: 992px) {

  .contact-form-buttons-inner {
    max-width: 620px;
    padding-left: 10px;
    padding-right: 10px;
    flex-flow: column;
    gap: 10px;
  }

}

.contact-form-spacer {
  margin-bottom: 60px;
}

@media (max-width: 992px) {

  .contact-form-spacer {
    margin-bottom: 120px;
  }

}

.contact-detail {
  width: 100%;
  height: 100vh;
  display: flex;
  overflow: hidden;
}

@media (max-width: 992px) {

  .contact-detail {
    padding-top: 49px;
  }

}

@media (max-width: 992px) {

  .contact-detail {
    flex-flow: column;
    height: 100%;
    max-height: none;
  }

}

.contact-detail-content {
  background: var(--c-bg-hl);
  height: 100%;
  flex: 1;
  z-index: 1;
}

.contact-detail-info {
  flex-flow: column;
  width: 40%;
  padding-bottom: 0px !important;
  height: 100%;
  margin: 0 auto;
  overflow-y: auto;
  padding: 40px;
  flex-shrink: 0;
  position: relative;
  display: flex;
  background: var(--c-bg);
}

@media (max-width: 1600px) {

  .contact-detail-info {
    width: 45%;
  }

}

@media (max-width: 1200px) {

  .contact-detail-info {
    width: 50%;
  }

}

@media (max-width: 992px) {

  .contact-detail-info {
    padding: 10px;
    width: 100%;
    padding-top: 40px;
    padding-bottom: 40px;
  }

}

@media (max-width: 768px) {

  .contact-detail-info {
    width: 100%;
    padding: 20px;
    padding-top: 40px;
    padding-bottom: 40px;
  }

}

.contact-actions-container {
  position: fixed;
  top: 10px;
  left: calc(40% - 35px);
  z-index: 99999;
  display: flex;
  justify-content: flex-end;
  width: 162px;
}

@media (max-width: 1600px) {

  .contact-actions-container {
    left: calc(45% - 47px);
  }

}

@media (max-width: 1200px) {

  .contact-actions-container {
    left: calc(50% - 60px);
  }

}

@media (max-width: 992px) {

  .contact-actions-container {
    left: calc(100% - 170px);
    top: 60px;
  }

}

.contact-actions-container.contact-actions-container--with-collapsed-sidenav {
  left: calc(40% - 160px) !important;
}

@media (max-width: 1600px) {

  .contact-actions-container.contact-actions-container--with-collapsed-sidenav {
    left: calc(45% - 160px) !important;
  }

}

@media (max-width: 1200px) {

  .contact-actions-container.contact-actions-container--with-collapsed-sidenav {
    left: calc(50% - 160px) !important;
  }

}

@media (max-width: 992px) {

  .contact-actions-container.contact-actions-container--with-collapsed-sidenav {
    left: calc(100% - 170px) !important;
    top: 60px;
  }

}

.contact-save {
  line-height: 100%;
  justify-content: center;
  align-items: center;
  padding: 10px;
  cursor: pointer;
  font-weight: 500;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
}

.contact-save:hover {
  background: var(--c-bg-hl-emp);
}

.contact-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 5px;
  background: var(--c-bg-hl);
  border-radius: 5px;
  padding: 5px;
}

.contact-actions__action {
  font-size: 14px;
  padding: 5px;
  border-radius: 5px;
  cursor: pointer;
}

.contact-actions__action:hover {
  background: var(--c-bg-hl-emp);
}

.contact-actions__action.contact-actions__action--warning:hover {
  color: #fabc60;
}

.contact-actions__action.contact-actions__action--success:hover {
  color: #2dc08d;
}

.contact-actions__action.contact-actions__action--danger:hover {
  color: #fb5e48;
}

.contact-archived-label {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 12px;
  background: var(--c-bg-hl);
  border-radius: 0px 0px 5px 0px;
  padding: 5px;
}

.contact-created-container {
  display: flex;
  position: sticky;
  top: 100%;
}

.contact-created-label {
  font-size: 12px;
  background: var(--c-bg-hl);
  border-radius: 0px 5px 0px 0px;
  margin-left: -40px;
  width: auto;
  padding: 5px;
}

@media (max-width: 992px) {

  .contact-created-label {
    margin-left: -10px;
  }

}

@media (max-width: 768px) {

  .contact-created-label {
    margin-left: -20px;
  }

}

.contact-save-btn {
  width: 100% !important;
  max-width: 100% !important;
  height: 50px !important;
}

.contact-head {
  display: flex;
  flex-shrink: 0;
  width: 100%;
  flex-flow: column;
}

.contact-title {
  display: flex;
  align-items: center;
}

.contact-title-info {
  padding-left: 20px;
  width: 100%;
}

.contact-name {
  font-size: 16px;
  font-weight: 500;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  width: 100%;
  align-items: center;
  color: var(--c-emp);
  text-decoration: none;
}

@media (max-width: 1200px) {

  .contact-name {
    font-size: 14px;
  }

}

.contact-edit {
  margin-left: 10px;
  font-size: 14px;
  color: var(--c-text);
  cursor: pointer;
}

.contact-edit:hover {
  color: #7b6737;
}

.contact-status {
  color: #7b6737;
  font-size: 12px;
  font-weight: 500;
  text-transform: capitalize;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}

.contact-status-archive {
  display: flex;
  font-size: 14px;
  color: #7b6737;
  font-weight: 500;
  padding-bottom: 10px;
}

.contact-status-archive-btn {
  cursor: pointer;
}

.contact-tags {
  display: flex;
  align-items: center;
}

.contact-tag {
  margin-right: 5px;
  padding: 5px 10px;
  margin-bottom: 5px;
  cursor: pointer;
  font-weight: 500;
  font-size: 12px;
  border-radius: 2px;
  display: inline-flex;
  background: var(--c-bg-hl);
  color: var(--c-emp);
}

.contact-tag.contact-tag--sm {
  line-height: 100%;
  text-transform: uppercase;
  padding: 4px 4px;
  cursor: pointer;
  font-weight: 700;
  font-size: 9px;
  border-radius: 2px;
  transition: opacity .1s ease-out;
  background: var(--c-bg-hl);
  color: var(--c-text);
  opacity: 0.7;
}

.contact-tag.contact-tag--sm:hover {
  opacity: 1;
}

.contact-tag.contact-tag--muted {
  opacity: 0.5;
}

.contact-tag__new {
  width: 25px;
  justify-content: center;
  height: 25px;
  align-items: center;
  margin-bottom: 5px;
  cursor: pointer;
  margin-left: 5px;
  font-size: 12px;
  border-radius: 50%;
  display: inline-flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
  opacity: 0.5;
}

.contact-tag__new:hover {
  background: var(--c-bg-hl-emp);
  opacity: 1;
}

.contact-info {
  display: grid;
  grid-template-columns: 20px 75px auto;
  grid-gap: 10px;
  width: 100%;
}

.info-label {
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  color: var(--c-text);
  display: flex;
  align-items: center;
}

.info-icon {
  color: var(--c-secondary);
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.info-text {
  color: var(--c-text);
  font-size: 12px;
  font-weight: 500;
}

.contact-detail-content {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: space-between;
}

.contact-content-head {
  width: 100%;
  padding: 20px 20px 10px 20px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
  color: var(--c-text);
  line-height: 200%;
  flex-shrink: 0;
}

.filter-pill {
  line-height: 200%;
  border: none;
  padding: 0 10px;
  cursor: pointer;
  font-weight: 500;
  margin-left: 5px;
  font-size: 14px;
  border-radius: 5px;
  background: inherit;
  color: var(--c-text);
}

.filter-pill.filter-pill--active {
  background: var(--c-bg);
  color: var(--c-emp);
}

.contact-content-refresh {
  justify-content: center;
  border: none;
  align-items: center;
  padding: 0 5px;
  cursor: pointer;
  margin-left: auto;
  font-size: inherit;
  display: flex;
  background: inherit;
  color: inherit;
}

.contact-content-refresh.contact-content-refresh--disabled {
  opacity: 0.5;
}

.contact-link {
  color: var(--c-emp);
  text-decoration: underline;
  cursor: pointer;
}

.contact-tasks {
  display: flex;
  flex-shrink: 0;
  width: 100%;
  flex-flow: column;
  padding-bottom: 20px;
}

.contact-task {
  display: grid;
  grid-template-columns: 20px 1fr 20px 20px;
  grid-column-gap: 10px;
  width: 100%;
  margin-bottom: 10px;
}

.contact-task:hover .contact-task-nav {
  color: var(--c-emp);
}

.contact-task-create {
  font-size: 12px;
  display: flex;
  justify-content: flex-end;
  padding-right: 3px;
  cursor: pointer;
}

.contact-task-info {
  display: flex;
  flex-flow: column;
  flex: 1;
  font-size: 14px;
  color: var(--c-emp);
  justify-content: center;
}

.contact-task-title {
  font-weight: 500;
}

.contact-task-title.contact-task-title--done {
  text-decoration: line-through;
}

.contact-task-date {
  color: var(--c-bg-hl-empest);
  font-size: 12px;
}

.contact-task-status {
  color: #fff !important;
  font-size: 16px;
  cursor: pointer;
  display: flex;
  align-items: flex-start;
}

.contact-task-nav {
  color: var(--c-text);
  cursor: pointer;
  font-size: 12px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  padding-top: 4px;
}

.contact-task-nav:hover {
  color: var(--c-emp);
}

.contact-task-user {
  justify-content: flex-end;
  align-items: flex-start;
  display: flex;
}

.contact-tasks-empty, .contact-info-empty, .contact-opportunities-empty {
  display: flex;
  flex-flow: column;
  font-size: 12px;
  color: var(--c-text);
}

.related-contacts__header {
  display: grid;
  grid-template-columns: 20px 1fr 65.8px;
  grid-gap: 10px;
  margin-bottom: 10px;
  margin-right: 3px;
}

.related-contact {
  display: grid;
  grid-template-columns: 20px 1fr 13px;
  grid-gap: 10px;
  font-size: 12px;
  color: #7b6737;
  margin-bottom: 10px;
}

.related-contact:last-child {
  margin-bottom: 0;
}

.related-contact-col {
  display: flex;
  align-items: center;
}

.related-contact-col.related-contact-col--link {
  justify-content: flex-end;
  color: var(--c-text);
}

.related-contact-col.related-contact-col--link:hover {
  color: var(--c-emp);
}

.related-contact-link {
  text-decoration: none;
  color: var(--c-emp);
}

.related-contact-label {
  justify-content: center;
  text-transform: uppercase;
  align-items: center;
  padding: 2px 5px;
  font-weight: 700;
  margin-left: 10px;
  font-size: 10px;
  border-radius: 2px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.contact-feed {
  display: flex;
  flex-flow: column;
  width: 100%;
  flex: 1;
  padding: 10px 20px;
  overflow: auto;
}

.contact-feed-dummy {
  float: left;
  clear: both;
  visibility: hidden;
}

.contact-feed-item {
  margin-bottom: 20px;
}

.contact-feed-note, .contact-feed-message {
  display: flex;
  flex-shrink: 0;
}

.contact-feed-item-avatar {
  display: flex;
  flex-shrink: 0;
  align-items: flex-end;
  justify-content: center;
  margin-right: 10px;
  padding-bottom: 5px;
}

.contact-feed-item-author {
  font-size: 12px;
  font-weight: 500;
  margin-bottom: 10px;
  color: var(--c-text);
}

.contact-feed-item-content {
  flex: 1;
}

.contact-feed-item-message, .contact-feed-item-note {
  padding: 20px;
  font-size: 14px;
  border-radius: 5px 5px 5px 0px;
  margin-bottom: 10px;
  word-break: break-word;
}

.contact-feed-item-message {
  background: var(--c-bg);
  color: var(--c-text);
}

.contact-feed-item-message.contact-feed-item-message--pending {
  background: var(--c-bg);
  color: var(--c-text);
}

.contact-feed-item-message.contact-feed-item-message--pending {
  background: hsla(211.8, 86.206894%, 87.254906%, 1.0);
  color: hsla(202.41759, 40.444443%, 34.117645%, 1.0);
}

.contact-feed-item-message.contact-feed-item-message-failed {
  background: hsla(0, 100%, 93.52941%, 1.0);
  color: hsla(0, 59.813084%, 58.039215%, 1.0);
}

.contact-feed-item-message-subject {
  font-weight: 700;
  margin-bottom: 10px;
}

.contact-feed-item-message-body {
  font-weight: 400;
  line-height: 160%;
}

.contact-feed-item-message-body.contact-feed-item-message-body--html {
  line-height: 140%;
}

.contact-feed-item-note {
  background: #fff6bb;
  color: #50491a;
  line-height: 160%;
  white-space: pre-wrap;
}

.contact-feed-item-note.contact-feed-item-note--call {
  background: #c0d8cd;
  color: hsla(159.31035, 40.092167%, 22.549019%, 1.0);
}

.contact-feed-item-note.contact-feed-item-note--dm {
  background: #dad1de;
  color: hsla(268.125, 27.350428%, 34.117645%, 1.0);
}

.contact-feed-item-footer {
  color: var(--c-text);
  font-size: 12px;
  font-weight: 400;
  display: flex;
  align-items: center;
}

.contact-feed-btn {
  color: var(--c-text);
  font-size: 14px;
  opacity: 0.5;
  cursor: pointer;
}

.contact-feed-btn:hover {
  opacity: 1;
}

.contact-feed-item-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--c-text);
  opacity: .3;
  padding: 10px;
  cursor: pointer;
}

.contact-feed-item-nav:hover {
  opacity: 1;
}

.contact-feed-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  flex: 1;
  width: 100%;
  color: var(--c-bg-hl-emp);
}

.contact-feed-empty-icon {
  font-size: 100px;
}

.contact-feed-empty-title {
  color: var(--c-emp);
  font-weight: 500;
}

.contact-feed-empty-text {
  color: var(--c-text);
  font-weight: 400;
  text-align: center;
  max-width: 600px;
  line-height: 140%;
}

.composer {
  display: flex;
  width: 100%;
  flex-flow: column;
  padding: 20px;
  flex-shrink: 0;
}

@media (max-width: 768px) {

  .composer {
    padding: 10px;
  }

}

.composer-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--c-bg);
  padding: 10px;
  border-radius: 5px;
}

.composer-input {
  border: none;
  min-height: 37px;
  margin-right: 10px;
  font-size: 14px;
  color: var(--c-text);
  background: inherit;
}

.intro {

}

.intro-overlay {
  right: 0;
  top: 0;
  justify-content: center;
  align-items: center;
  position: fixed;
  z-index: 999999;
  display: flex;
  bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  left: 0;
}

.intro-modal {
  width: 100%;
  max-width: 600px;
  position: absolute;
  margin-top: -10vh;
  z-index: 2147483647;
  overflow: hidden;
  border-radius: 5px;
  transition: all .2s ease-in;
  background: #fff;
}

@media (max-width: 576px) {

  .intro-modal {
    border-radius: 0;
    min-height: 100vh;
    margin-top: 0;
  }

}

.intro-modal-content {
  color: #111F2C;
  line-height: 150%;
}

.intro-modal-header {
  padding: 50px 30px 50px 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  text-align: center;
}

.intro-modal-avatar {
  border-radius: 50%;
  max-width: 100px;
  box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3);
}

.intro-modal-title {
  background: #fff;
  color: #111F2C;
  padding: 5px 10px;
  transform: rotate(-8deg);
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
  font-weight: 700;
}

.intro-modal-text {
  color: #314252;
  padding: 30px 30px;
}

.intro-modal-footer {
  padding: 0 30px 30px 30px;
}

.bg-vertical-lines {
  background-image: repeating-linear-gradient(to right, currentColor, currentColor 1px, transparent 1px, transparent);
  background-size: 25px 25px;
  background-color: #FACB0E;
  background-attachment: fixed;
  color: #FDE482;
}

.subscribe-banner {
  flex-flow: column;
  line-height: 140%;
  justify-content: center;
  align-items: center;
  padding: 20px 10px;
  text-align: center;
  margin-bottom: 10px;
  font-weight: 400;
  font-size: 14px;
  display: flex;
  color: var(--c-text);
}

.subscribe-banner__link {
  color: var(--c-white);
  font-weight: 500;
  background: var(--c-blue);
  border-radius: 15px;
  margin-top: 7px;
  padding: 5px 10px;
  text-decoration: none;
  display: inline-flex;
}

.sign-up {
  width: 100%;
}

.sign-up-form {
  display: flex;
  width: 100%;
}

.flashes {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 2147483646;
}

.flash {
  padding: 20px;
  background: #314252;
  color: #fff;
  border-radius: 5px;
  margin-bottom: 10px;
}

.flash:last-child {
  margin-bottom: 0px;
}

.flash.flash--success {
  background: #2dc08d;
}

.flash.flash--danger {
  background: #fb5e48;
}

.flash-link {
  color: #fff;
  text-decoration: none;
  font-weight: 700;
}

.get-started {
  flex-flow: column;
  padding-bottom: 80px;
  justify-content: center;
  align-items: center;
  margin-bottom: 80px;
  padding-right: 20px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-accent);
  padding-left: 20px;
  padding-top: 80px;
}

.get-started-title {
  font-size: 32px;
  color: var(--c-title-accent);
  line-height: 140%;
  margin-top: 0px;
  margin-bottom: 20px;
  text-align: center;
}

.get-started-lead {
  font-size: 22px;
  color: var(--c-text-accent);
  line-height: 160%;
  max-width: 800px;
  text-align: center;
  margin-bottom: 40px;
}

.get-started-btns {
  max-width: 300px;
  width: 100%;
  margin-bottom: 20px;
}

.btn.btn--get-started {
  color: #fff;
  background: #e66a69;
  padding: 20px 40px;
  height: auto;
  font-weight: 700;
  font-size: 22px;
  border-bottom: 5px solid hsl(0.4, 63.8%, 56.7%);
}

.btn.btn--get-started:hover {
  background: hsla(0.3243243, 100%, 61.72549%, 1.0);
}

.get-started-notice {
  color: #5E7182;
  text-align: center;
}

.features {
  display: grid;
  align-items: center;
  justify-content: center;
  margin-bottom: 80px;
}

.feature-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 40px;
}

@media (max-width: 992px) {

  .feature-row {
    grid-template-columns: 1fr;
    grid-gap-rows: 40px;
    grid-gap-columns: 0;
  }

}

.feature {
  display: flex;
  flex-flow: column;
}

@media (max-width: 992px) {

  .feature {
    margin-bottom: 20px;
  }

}

.feature-head {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: 32px;
  font-weight: 700;
  color: var(--c-emper);
  margin-bottom: 20px;
  line-height: 130%;
}

.feature-icon {
  width: 50px;
  justify-content: center;
  height: 50px;
  align-items: center;
  flex-shrink: 0;
  margin-bottom: 20px;
  font-size: 22px;
  border-radius: 50%;
  display: flex;
  background: #314252;
  color: hsla(209.09091, 25.19084%, 5.6862745%, 1.0);
}

.feature-icon.feature-icon-red {
  background: #ffabab;
  color: #d45454;
}

.feature-icon.feature-icon-green {
  background: #86e4b7;
  color: #41987a;
}

.feature-icon.feature-icon-blue {
  background: #93c2f7;
  color: #437c9e;
}

.feature-icon.feature-icon-peach {
  background: #ffd6c2;
  color: #ff8b6a;
}

.feature-icon.feature-icon-yellow {
  background: hsla(35.844154, 93.902435%, 82.84314%, 1.0);
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0);
}

.feature-icon.feature-icon-mint {
  background: #c4e1dc;
  color: #284643;
}

.feature-icon.feature-icon-primary {
  background: hsla(209.09091, 25.19084%, 75.68627%, 1.0);
  color: hsla(209.09091, 25.19084%, 30.686274%, 1.0);
}

.feature-icon.feature-icon-pink {
  background: hsla(337.11865, 100%, 86.86275%, 1.0);
  color: hsla(337.11865, 100%, 71.86275%, 1.0);
}

.feature-text {
  color: var(--c-text);
  font-size: 22px;
  line-height: 150%;
}

.features-more {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
}

.features-more-title {
  font-size: 32px;
  line-height: 140%;
  margin-top: 0px;
  margin-bottom: 20px;
  text-align: center;
}

.features-more-lead {
  font-size: 22px;
  line-height: 160%;
  color: #314252;
  max-width: 900px;
  text-align: center;
  margin-bottom: 60px;
}

.features-box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-column-gap: 2px;
  grid-row-gap: 2px;
}

@media (max-width: 768px) {

  .features-box {
    grid-template-columns: repeat(1, 1fr);
  }

}

.features-box-title {
  font-size: 16px;
}

.features-box__item {
  background: #fff;
  padding: 60px;
}

.features-box__item .feature-icon {
  padding-top: 2px;
}

.features-box__item-text {
  color: #314252;
  font-size: 16px;
  line-height: 140%;
}

.feature-text-red {
  color: #d45353;
}

.feature-text-green {
  color: #41987a;
}

.feature-text-blue {
  color: #437c9e;
}

.feature-text-peach {
  color: #ff8b6a;
}

.feature-text-yellow {
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0);
}

.feature-text-mint {
  color: #284643;
}

.feature-text-primary {
  color: hsla(209.09091, 25.19084%, 30.686274%, 1.0);
}

.feature-text-pink {
  color: hsla(337.11865, 100%, 71.86275%, 1.0);
}

.spotlights__title {
  display: flex;
  flex-flow: column;
  align-items: center;
}

.spotlights {
  display: flex;
  flex-flow: column;
}

.spotlight {
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.spotlight.spotlight--reverse {
  flex-flow: row-reverse;
}

@media (max-width: 992px) {

  .spotlight.spotlight--reverse {
    flex-flow: column;
  }

}

@media (max-width: 992px) {

  .spotlight {
    flex-flow: column;
  }

}

.spotlight-left, .spotlight-right {
  flex: 1 1 0;
  padding: 40px;
}

@media (max-width: 992px) {

  .spotlight-left, .spotlight-right {
    padding: 40px 20px !important;
  }

}

.spotlight-left {
  padding-left: 0px;
  padding-right: 50px;
}

.spotlight-right {
  padding-right: 0px;
  padding-left: 50px;
}

.spotlight-img {
  border: 1px solid #ece5d4;
  max-width: 100%;
  border-radius: 5px;
}

@media (max-width: 992px) {

  .spotlight-img {
    width: 400px;
  }

}

.spotlight-img.spotlight-img-contact {
  border: none;
  border-right: 1px solid #ece5d4;
}

.spotlight-title {
  font-size: 32px;
  font-weight: 700;
  line-height: 140%;
  color: var(--c-emper);
}

@media (max-width: 992px) {

  .spotlight-title {
    margin-top: -60px;
  }

}

.spotlight-line {
  height: 3px;
  width: 100px;
  margin: 20px 0;
  background: red;
}

.spotlight-text {
  font-size: 16px;
  line-height: 140%;
  color: var(--c-emp);
  margin-bottom: 20px;
}

@media (max-width: 992px) {

  .spotlight-text {
    max-width: 600px;
  }

}

.spotlight-checks {
  display: flex;
  flex-wrap: wrap;
  line-height: 200%;
}

.spotlight-check {
  display: flex;
  color: var(--c-text);
  margin-right: 20px;
  align-items: center;
}

.spotlight-check-icon {
  margin-right: 10px;
  color: #7ebecb;
}

.StripeElement {
  height: 46px;
  border-radius: 5px;
  border: 2px solid #DADCDE;
  padding: 12px 12px;
}

.StripeElement.StripeElement--focus {
  border: 2px solid #A3AFBA;
}

.splash {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  padding-top: 40px;
  padding-bottom: 60px;
}

.splash-title {
  margin-bottom: 40px;
  margin-top: 0;
  color: var(--c-emper);
  font-size: 96px;
  line-height: 110%;
  font-weight: 900;
  text-align: center;
  max-width: 1200px;
}

@media (max-width: 576px) {

  .splash-title {
    font-size: 54px;
    line-height: 120%;
  }

}

.splash-lead {
  font-size: 32px;
  color: var(--c-emp);
  max-width: 1200px;
  line-height: 160%;
  text-align: center;
  margin-bottom: 30px;
}

.splash-emoji {
  line-height: 160%;
  margin-bottom: -2px;
}

.splash-img-container {
  border-radius: 5px;
  width: 100%;
  overflow: hidden;
}

.splash-img-top-bar {
  height: 40px;
  background: var(--c-bg-hl);
  display: flex;
  align-items: center;
  padding-left: 10px;
}

.splash-img-bar-btn {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: var(--c-bg-hl);
  margin-right: 7px;
}

.splash-img {
  width: 100%;
  border: 1px solid var(--c-bg-hl);
}

.splash-btns {
  margin-bottom: 60px;
}

.btn.btn--splash {
  line-height: 140%;
  justify-content: center;
  height: auto;
  align-items: center;
  padding: 20px 60px;
  text-align: center;
  font-weight: 700;
  font-size: 22px;
  border-radius: 50px;
  display: flex;
  background: #2dc08d;
  color: var(--c-title-accent);
}

.btn.btn--splash:hover {
  background: hsla(159.18367, 62.02532%, 36.47059%, 1.0);
}

.faq {
  width: 100%;
  max-width: 1080px;
  margin: 0 auto;
}

.faq-section {
  display: flex;
  flex-flow: column;
  margin-bottom: 20px;
  background: var(--c-bg-hl);
  padding: 40px;
  border-radius: 5px;
}

.faq-question {
  font-weight: 700;
  color: var(--c-emp);
  line-height: 160%;
  font-size: 32px;
}

.faq-answer {
  font-weight: 400;
  margin-top: 10px;
  color: var(--c-text);
  line-height: 160%;
  font-size: 22px;
}

.faq-docs {
  background: var(--c-bg-hl);
  padding: 10px 40px;
  border-radius: 5px;
  color: var(--c-text);
}

.api-docs {
  max-width: 600px;
  width: 100%;
  margin: 0 auto;
}

.api-section {
  display: flex;
  flex-flow: column;
  margin-bottom: 20px;
}

.api-title {
  font-weight: 500;
  color: #111F2C;
  line-height: 140%;
  font-size: 16px;
  margin-bottom: 10px;
}

.api-text {
  font-weight: 400;
  color: #314252;
  line-height: 140%;
  font-size: 16px;
}

.api-sample {
  background: #efe9db;
  padding: 10px;
  overflow-x: auto;
}

.api-line {
  line-height: 180%;
}

.api-generate {
  cursor: pointer;
  font-weight: 700;
  color: #314252;
}

.lp {
  padding: 50px 0;
}

.lp__splash {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  padding-top: 40px;
  padding-bottom: 60px;
}

.lp__splash__label {
  display: flex;
  color: var(--c-bg-hl-emper);
  font-size: 16px;
  text-transform: uppercase;
  font-weight: 500;
  align-items: center;
  justify-content: center;
  margin-bottom: 40px;
}

.lp__splash__label__icon {
  font-size: 14px;
}

.lp__splash__title {
  margin-bottom: 20px;
  margin-top: 0;
  color: var(--c-emper);
  font-weight: 900;
  text-align: center;
}

@media (max-width: 576px) {

  .lp__splash__title {
    font-size: 54px;
  }

}

.lp__splash__lead {
  font-size: 32px;
  color: var(--c-emp);
  line-height: 160%;
  text-align: center;
  margin-bottom: 20px;
}

.lp__splash__img-container {
  border-radius: 5px;
  width: 100%;
  overflow: hidden;
}

.lp__splash__img-top-bar {
  height: 40px;
  background: #efe9db;
  display: flex;
  align-items: center;
  padding-left: 10px;
}

.lp__splash__img-bar-btn {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: #7b6737;
  margin-right: 7px;
}

.lp__splash__img {
  width: 100%;
  border: 1px solid #ece5d4;
  border-top: none;
  margin-top: -1px;
}

.lp__splash__btns {
  margin-bottom: 40px;
}

.lp__btn.btn--splash {
  color: #fff;
  background: #314252;
  padding: 20px 40px;
  height: auto;
  font-weight: 700;
  font-size: 22px;
  border-bottom: 5px solid hsla(209.09091, 25.19084%, 20.686274%, 1.0);
}

.lp__emoji {
  line-height: 160%;
  margin-bottom: -2px;
}

.lp__benefits {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
}

@media (max-width: 992px) {

  .lp__benefits {
    grid-template-columns: repeat(auto-fit,minmax(340px,1fr));
  }

}

.lp__benefit {
  display: flex;
  flex-flow: column;
  padding: 40px;
  border-radius: 5px;
  font-size: 22px;
  line-height: 140%;
}

.lp__benefit.lp__benefit--1 {
  background: #fde2e2;
  color: #e67c7c;
}

.lp__benefit.lp__benefit--2 {
  background: #aacfcf;
  color: #508282;
}

.lp__benefit.lp__benefit--3 {
  background: #fcf7bb;
  color: #a27e37;
}

.lp__benefit.lp__benefit--4 {
  background: #e1ccec;
  color: #886aaa;
}

.lp__benefit__top {
  display: flex;
  margin-bottom: 20px;
  align-items: center;
}

.lp__benefit__icon {
  width: 40px;
}

.lp__benefit__title {
  font-size: 22px;
  font-weight: 700;
  line-height: 140%;
  margin-bottom: 0;
  margin-top: 0;
}

.lp__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  padding-top: 60px;
  padding-bottom: 60px;
}

.lp__cta__logo {
  width: 100px;
  justify-content: center;
  height: 100px;
  align-items: center;
  padding: 20px;
  margin-bottom: 50px;
  font-size: 32px;
  border-radius: 10px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-bg-hl-empest);
}

.lp__cta__title {
  font-size: 80px;
  font-weight: 900;
  line-height: 120%;
  margin-top: 0px;
  margin-bottom: 20px;
  text-align: center;
  color: var(--c-emper);
}

@media (max-width: 576px) {

  .lp__cta__title {
    font-size: 54px;
  }

}

.lp__cta__lead {
  font-size: 32px;
  line-height: 160%;
  color: var(--c-emp);
  text-align: center;
  margin-bottom: 40px;
}

.testimonials {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
  grid-gap: 20px;
  justify-content: center;
  align-content: center;
  max-width: 1680px;
  width: 100%;
}

@media (max-width: 1600px) {

  .testimonials {
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
  }

}

@media (max-width: 576px) {

  .testimonials {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  }

}

.testimonials.testimonials--dark .testimonial {
  background: var(--c-bg-hl-emp);
  color: var(--c-emp);
}

.testimonial {
  background: var(--c-bg-hl);
  color: var(--c-emp);
  border-radius: 5px;
  padding: 60px;
}

@media (max-width: 576px) {

  .testimonial {
    padding: 20px;
  }

}

mark {
  background-color: #fddb30;
  padding: 0 5px;
}

.testimonial__quote {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 30px;
  line-height: 160%;
  display: flex;
}

.testimonial__author {
  display: flex;
  align-items: center;
  color: var(--c-text);
}

.testimonial__author__avatar {
  display: flex;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  align-items: center;
  color: var(--c-text);
}

.iavatar-placeholder {
  width: 25px;
  justify-content: center;
  height: 25px;
  text-transform: uppercase;
  align-items: center;
  flex-shrink: 0;
  position: relative;
  font-weight: 700;
  overflow: hidden;
  font-size: 9px;
  border-radius: 50%;
  display: flex;
  background: var(--c-bg-hl-emp);
  color: #fff;
}

.testimonial__qs, .testimonial__qe {
  font-size: 22px;
  line-height: 160%;
}

.testimonial__qs {
  margin-right: 2px;
}

.testimonial__qe {
  margin-left: 2px;
}

.testimonial__author__image {
  margin-right: 20px;
  filter: grayscale(40%);
}

.testimonial__author__name {
  font-style: italic;
  opacity: 0.8;
}

.manifesto {
  width: 100%;
}

.manifesto__title {
  color: var(--c-emper);
  font-weight: 900;
  text-align: center;
  line-height: 110%;
}

@media (max-width: 768px) {

  .manifesto__title {
    font-size: 56px !important;
  }

}

.manifesto__content {
  display: grid;
  grid-template-columns: 2fr 5fr;
  direction: rtl;
  grid-gap: 50px;
  color: var(--c-emp);
}

@media (max-width: 768px) {

  .manifesto__content {
    grid-template-columns: 1fr;
  }

}

.manifesto__text {
  font-size: 22px;
  line-height: 180%;
  margin-bottom: 30px;
  direction: ltr;
}

.manifesto__sign {
  font-size: 22px;
  font-weight: 400;
  font-style: italic;
  direction: ltr;
  display: flex;
  align-items: center;
}

.manifesto__avatar {
  height: 380px;
  width: 280px;
  background-position: center;
  background-size: cover;
  border-radius: 5px;
  margin: 0 auto;
}

@media (max-width: 768px) {

  .manifesto__avatar {
    display: none;
  }

}

.manifesto__avatar.manifesto__avatar--sign {
  height: 50px;
  width: 50px;
  margin: 0;
  display: none;
  border-radius: 50%;
}

@media (max-width: 768px) {

  .manifesto__avatar.manifesto__avatar--sign {
    display: flex;
  }

}

.ph-notice {
  position: fixed;
  right: 20px;
  bottom: 20px;
  background: rgb(236, 83, 87);
  color: rgba(255, 255, 255, 0.8);
  border-radius: 5px;
  padding: 20px;
  line-height: 100%;
}

.ph-notice__link {
  color: #fff;
  text-decoration: none;
}

.customer-logos {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
}

.customer-logos__title {
  font-size: 22px;
  color: var(--c-secondary);
  margin-bottom: 40px;
  text-align: center;
  line-height: 160%;
}

.customer-logos__logos {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  flex-wrap: wrap;
  gap: 60px;
  row-gap: 30px;
}

.customer-logos__logo {
  height: 40px;
}

.screenshot {
  max-width: 100%;
  width: 100%;
  border: 2px solid var(--c-bg-hl);
  border-radius: 5px;
  position: relative;
}

.screenshot-img {
  width: 100%;
  margin-bottom: -4.5px;
  overflow: hidden;
}

.screenshot-bar {
  height: 40px;
  background: var(--c-bg-hl);
  display: flex;
  align-items: center;
  padding-left: 10px;
}

.screenshot-bar-btn {
  height: 10px;
  width: 10px;
  border-radius: 50%;
  background: var(--c-bg-hl);
  margin-right: 7px;
}

.screenshot-prev {
  position: absolute;
  top: 50%;
  left: -50px;
  font-size: 32px;
}

.screenshot-next {
  position: absolute;
  top: 50%;
  right: -50px;
  font-size: 32px;
}

.screenshot-next, .screenshot-prev {
  color: var(--c-bg-hl-emp);
  cursor: pointer;
}

.screenshot-next:hover, .screenshot-prev:hover {
  color: var(--c-bg-hl-emper);
}

@media (max-width: 1200px) {

  .screenshot-next, .screenshot-prev {
    display: none !important;
  }

}

html {
  box-sizing: border-box;
  height: 100%;
  overflow-y: scroll;
}

* {
  box-sizing: inherit;
}

*:focus {
  outline: none !important;
}

*::-webkit-scrollbar {
  background-color: var(--c-bg-hl);
}

*::-webkit-scrollbar-thumb {
  background-color: var(--c-bg-hl-emp);
}

p {
  padding: 0;
  margin: 0;
}

body {
  background: #f7f4ed;
  font-family: Inter,
    -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,
    Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;
  font-feature-settings: 'ss08' on, 'ss07' on, 'tnum' on, 'calt' on, 'zero' on;
  color: #111F2C;
  margin: 0;
  height: 100%;
  transition: all .2s ease;
}

body.theme--dark {
  --c-text-accent: #b4b8bb;
  --c-bg-accent-hl: #04252f;
  --c-bg-hl-empest: #28768c;
  --c-backdrop-less: hsla(192.85715, 87.5%, 14.411765%, 1.0);
  --c-backdrop-emp: hsla(192.85715, 87.5%, 6.4117646%, 1.0);
  --c-emp: #93a1a1;
  --c-bg: #002b36;
  --c-blue: #268bd2;
  --c-bg-hl-emp: hsla(192.20338, 80.821915%, 16.313726%, 1.0);
  --c-magenta: #d33682;
  --c-text: #91a5ad;
  --c-white: #fff;
  --c-bg-hl: #073642;
  --c-bg-accent: #042129;
  --c-bg-hl-less: hsla(192.20338, 80.821915%, 9.313725%, 1.0);
  --c-bg-light: #0e4452;
  --c-bg-hl-emper: hsla(192.20338, 80.821915%, 21.313726%, 1.0);
  --c-title-accent: #fff;
  --c-secondary: #93a1a1;
  --c-emper: #fff;
  --c-backdrop: #03242d;
  --c-bg-accent-less: #06242d;
  --c-base: #839496;
  --c-bg-content: #092f3a;
  background: var(--c-bg);
  color: var(--c-text);
  --c-muted: #204d5a;
}

body.theme--light {
  --c-text-accent: #b4b8bb;
  --c-bg-accent-hl: #273542;
  --c-bg-hl-empest: #ab9d7e;
  --c-backdrop-less: hsla(46.363636, 23.913044%, 86.960785%, 1.0);
  --c-backdrop-emp: #cac5b5;
  --c-emp: #2b3c42;
  --c-bg: #f7f4ed;
  --c-blue: #268bd2;
  --c-bg-hl-emp: #e4decc;
  --c-magenta: #d33682;
  --c-text: #384e56;
  --c-white: #fff;
  --c-bg-hl: #efe9db;
  --c-bg-accent: #314252;
  --c-bg-hl-less: hsla(45.6, 42.372883%, 90.43137%, 1.0);
  --c-bg-light: #f7f4ed;
  --c-bg-hl-emper: #d4c7a9;
  --c-title-accent: #fff;
  --c-secondary: #93a1a1;
  --c-emper: #0a0f10;
  --c-backdrop: #dcd7c6;
  --c-bg-accent-less: #1C2C3C;
  --c-base: #839496;
  --c-bg-content: #fff;
  background: var(--c-bg);
  color: var(--c-text);
  --c-muted: #c2bdaa;
}

.container {
  width: 100%;
  max-width: 1360px;
  padding: 20px;
  margin: 0 auto;
  display: flex;
  flex-flow: column;
}

.container.container--center {
  align-items: center;
}

.container.container--app {
  padding: 20px 30px 30px 30px;
  max-width: 1600px;
  margin: 0 0;
}

@media (max-width: 992px) {

  .container.container--app {
    padding: 70px 10px 20px 10px;
  }

}

.container.container--app-form {
  align-items: center;
  max-width: 500px;
  padding-top: 80px;
}

.container.container--wide {
  max-width: 1600px;
}

.container.container--fixed-height {
  height: 100vh;
  overflow-y: hidden;
}

@media (max-width: 576px) {

  .container.container--fixed-height {
    height: 100%;
  }

}

.container.container--auto-width {
  width: auto;
  max-width: none;
}

.container.container--nopad {
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-bottom: 0 !important;
}

.navbar {
  height: 70px;
  width: 100%;
  z-index: 9999;
  display: flex;
  background: var(--c-bg);
  align-items: center;
  padding: 0 60px;
}

@media (max-width: 1200px) {

  .navbar {
    padding: 0 20px;
  }

}

.navbar-content {
  display: flex;
  align-items: center;
  width: 100%;
  justify-content: space-between;
}

.navbar-brand {
  font-size: 32px;
  color: #2dc08d;
  margin-right: 20px;
}

.navbar-links {
  display: flex;
  align-items: center;
  justify-content: center;
}

.navbar-link {
  color: var(--c-emp);
  text-decoration: none;
  font-weight: 500;
  line-height: 140%;
  margin-right: 40px;
  font-size: 14px;
  cursor: pointer;
}

.navbar-link:hover, .navbar-link.navbar-link--active {
  color: var(--c-emper);
}

.navbar-link:last-child {
  margin-right: 0px;
}

@media (max-width: 992px) {

  .navbar-link {
    margin-right: 20px;
  }

}

@media (max-width: 576px) {

  .navbar-link {
    margin: 0 10px;
  }

}

.navbar-toggle {
  width: 64px;
  justify-content: space-between;
  margin-right: 40px;
  padding: 3px 4px;
  position: relative;
  font-size: 12px;
  border-radius: 20px;
  display: flex;
  background: var(--c-bg-hl);
}

.navbar-toggle.navbar-toggle--app {
  margin-left: 25px;
  margin-top: 20px;
  background: var(--c-bg-hl-emp);
  border-radius: 5px;
  padding: 5px 5px;
}

.navbar-toggle.navbar-toggle--app.navbar-toggle--app--collapsed {
  margin-left: 10px;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 0px;
}

.navbar-toggle.navbar-toggle--app .navbar-toggle__btn {
  border-radius: 5px;
}

.navbar-toggle__btn {
  width: 25px;
  justify-content: center;
  height: 25px;
  align-items: center;
  padding: 5px;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  transition: all .2s ease;
}

.navbar-toggle__btn.navbar-toggle__btn--active {
  background: var(--c-bg-hl-emper);
}

.navbar-toggle__hint {
  position: absolute;
  left: -5px;
  top: -5px;
  color: var(--c-bg-hl-emper);
}

.navbar__footer {
  display: flex;
  justify-content: space-between;
  margin-right: 20px;
}

.navbar__footer.navbar__footer--collapsed {
  flex-flow: column-reverse;
  margin-right: 0px;
}

.navbar__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
  color: var(--c-bg-hl-emper);
  cursor: pointer;
}

.navbar__btn:hover {
  color: var(--c-bg-hl-empest);
}

.topnav-container {
  width: 100%;
  max-width: 100vw;
  top: 0;
  justify-content: space-between;
  height: 50px;
  align-items: center;
  padding: 0 10px;
  position: fixed;
  z-index: 999999;
  display: flex;
  background: var(--c-bg-hl);
  left: 0;
}

.topnav {
  width: 100%;
  height: 100%;
  display: flex;
  z-index: 999999;
  background: var(--c-bg-hl);
  align-items: center;
  justify-content: space-between;
}

.topnav__btn {
  font-size: 22px;
  cursor: pointer;
  z-index: 999999;
  position: relative;
}

.topnav__content-container {
  flex-flow: column;
  width: 100%;
  top: 0;
  justify-content: space-between;
  height: 100%;
  position: fixed;
  display: flex;
  bottom: 0;
  transition: all .2s ease;
  background: var(--c-bg-hl);
  max-height: 100vh;
  left: -100%;
}

.topnav__content-container.topnav__content-container--visible {
  transform: translateX(100%);
}

.topnav__content {
  flex-flow: column;
  width: 100%;
  justify-content: space-between;
  padding: 70px 10px 0 10px;
  min-height: 100vh;
  overflow: auto;
  display: flex;
  background: var(--c-bg-hl);
  max-height: 100vh;
}

.topnav__link {
  font-size: 22px;
  font-weight: 900;
  padding: 5px 0;
  color: var(--c-emp);
  text-decoration: none;
  display: flex;
  cursor: pointer;
}

.topnav__section-title {
  color: var(--c-text);
  font-weight: 700;
  font-size: 22px;
}

.topnav__icon {
  width: 40px;
  height: 40px;
  color: var(--c-text);
  flex-shrink: 0;
}

.topnav__text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.topnav__btn-link {
  line-height: 100%;
  justify-content: center;
  align-items: center;
  padding: 20px 10px;
  text-align: center;
  font-weight: 900;
  text-decoration: none;
  font-size: 22px;
  border-radius: 5px;
  display: flex;
  background: #314252;
  color: #fff;
}

.mobile-navbar__btn {
  font-size: 22px;
  cursor: pointer;
  z-index: 9999;
}

.mobile-navbar__content {
  width: 100%;
  top: 0;
  height: 100%;
  padding: 40px 10px;
  position: fixed;
  z-index: 99;
  bottom: 0;
  transition: all .2s ease;
  background: var(--c-bg);
  left: -100%;
}

.mobile-navbar__content.mobile-navbar__content--visible {
  transform: translateX(100%);
}

.mobile-navbar__link {
  font-size: 32px;
  font-weight: 900;
  padding: 15px 10px;
  color: var(--c-emper);
}

.mobile-navbar__btn-link {
  line-height: 100%;
  justify-content: center;
  align-items: center;
  padding: 20px 10px;
  text-align: center;
  font-weight: 900;
  text-decoration: none;
  font-size: 32px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl-emp);
  color: var(--c-emper);
}

.app-layout {
  display: flex;
  margin-left: 250px;
}

@media (max-width: 992px) {

  .app-layout {
    margin-left: 0 !important;
  }

}

.app-layout.app-layout--collapsed-sidenav {
  margin-left: 50px;
}

.back-to-site {
  top: 20px;
  padding: 10px 20px;
  position: absolute;
  text-decoration: none;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
  left: 20px;
}

.back-to-site:hover {
  background: var(--c-bg-hl-emp);
  color: var(--c-emp);
}

.sidenav {
  flex-flow: column;
  width: 250px;
  height: 100vh;
  flex-shrink: 0;
  border-right: 1px solid var(--c-backdrop);
  position: fixed;
  z-index: 9999;
  display: flex;
  background: var(--c-bg-hl);
  left: 0;
}

.sidenav.sidenav--hidden {
  display: none !important;
}

.sidenav.sidenav--collapsed {
  width: 50px;
}

.sidenav-top {
  margin: 10px;
  text-transform: capitalize;
  align-items: center;
  padding: 10px 20px;
  margin-bottom: 0;
  font-weight: 500;
  text-decoration: none;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl-emp);
  color: var(--c-emp);
}

.sidenav-top.sidenav-top--collapsed {
  padding: 5px;
  width: 30px;
  height: 30px;
}

.sidenav-logo {
  font-size: 22px;
  margin-right: 20px;
  display: flex;
  justify-content: center;
}

.sidenav-sections {
  display: flex;
  flex: 1;
  flex-flow: column;
  justify-content: space-between;
  padding: 10px 0;
  overflow: auto;
}

.sidenav-section-title {
  color: var(--c-text);
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  padding: 10px 20px;
}

.sidenav-link {
  line-height: 200%;
  margin: 2px 10px;
  align-items: center;
  padding: 0 20px;
  position: relative;
  cursor: pointer;
  text-decoration: none;
  overflow: hidden;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  color: var(--c-text);
}

.sidenav-link:hover, .sidenav-link.sidenav-link--active {
  background: var(--c-bg-hl-emp);
}

.sidenav-link:hover .sidenav-icon, .sidenav-link.sidenav-link--active .sidenav-icon {
  opacity: 1;
}

.sidenav-link.sidenav-link--collapsed {
  padding: 5px;
  background: var(--c-bg-hl-emp);
  width: 30px;
  height: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 5px;
}

.sidenav-link.sidenav-link--collapsed .sidenav-icon {
  margin-right: 0px;
  width: auto;
}

.sidenav-link.sidenav-link--demo {
  background: #86e4b7;
  color: #41987a;
}

.sidenav-link.sidenav-link--demo .sidenav-icon {
  color: #41987a;
  opacity: 1;
}

.sidenav-link.sidenav-link--demo .sidenav-right-icon {
  color: #41987a;
  opacity: 0.5;
}

.sidenav-icon {
  margin-right: 10px;
  color: var(--c-text);
  width: 20px;
  opacity: .5;
  cursor: pointer;
}

.sidenav-text {
  width: 130px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--c-text);
  cursor: pointer;
}

.sidenav-text:first-letter {
  text-transform: uppercase;
}

.sidenav-right-icon {
  position: absolute;
  right: 10px;
  color: var(--c-bg-hl-emper);
}

.sidenav-right-icon:hover, .sidenav-right-icon.sidenav-link--active {
  color: var(--c-bg-hl-empest);
}

.sidenav-divider {
  height: 2px;
  width: 75%;
  margin: 0 auto;
  background: #e7deca;
  margin-top: 5px;
  margin-bottom: 5px;
}

.footer {
  display: grid;
  align-items: flex-start;
  justify-content: space-between;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-column-gap: 40px;
  grid-row-gap: 50px;
  color: var(--c-text);
  padding: 60px;
}

@media (max-width: 992px) {

  .footer {
    flex-flow: column-reverse;
    align-items: flex-start;
  }

}

@media (max-width: 1200px) {

  .footer {
    padding: 60px 20px;
  }

}

.footer-brand-text {
  color: var(--c-emp);
  font-weight: 500;
}

.footer-links {
  display: flex;
  margin-bottom: 10px;
  flex-flow: column;
}

.footer-links.footer-links--inline {
  flex-flow: row;
}

.footer-link {
  margin-right: 10px;
  color: var(--c-emp);
  text-decoration: none;
  font-weight: 500;
  margin-bottom: 10px;
}

.footer-link:hover {
  color: var(--c-emper);
}

.footer-link:last-child {
  margin-right: 0px;
}

.footer-text {
  margin-bottom: 10px;
  line-height: 140%;
}

@media (max-width: 576px) {

  .footer-right {
    margin-bottom: 20px;
  }

}

.back-btn {
  width: 50px;
  right: 10px;
  top: 10px;
  justify-content: center;
  height: 50px;
  border: none;
  align-items: center;
  position: absolute;
  cursor: pointer;
  font-size: 16px;
  border-radius: 50%;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.back-btn:hover {
  background: var(--c-bg-hl-emp);
}

@media (max-width: 992px) {

  .back-btn {
    top: 60px;
  }

}

.empty-state {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  text-align: center;
}

.empty-state.empty-state--top {
  justify-content: flex-start;
}

.empty-state__icon {
  font-size: 72px;
  color: var(--c-backdrop);
  margin-bottom: 20px;
}

.empty-state__title {
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 10px;
}

.empty-state__text {
  font-size: 16px;
  margin-bottom: 20px;
  line-height: 140%;
  color: var(--c-text);
}

.spinner-page {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
}

.spinner {
  border-top-color: var(--c-backdrop-emp);
  width: 14px;
  border-width: 2px;
  height: 14px;
  vertical-align: middle;
  border-right-color: transparent;
  border-style: solid;
  animation: spinner 400ms linear infinite;
  border-bottom-color: transparent;
  border-left-color: var(--c-backdrop-emp);
  border-radius: 50%;
  display: inline-block;
  opacity: .3;
}

.spinner.spinner--accent {
  border-top-color: var(--c-backdrop-emp);
  border-left-color: var(--c-backdrop-emp);
}

.spinner.spinner--page {
  border-top-color: var(--c-backdrop-emp);
  border-left-color: var(--c-backdrop-emp);
  width: 32px;
  height: 32px;
  border-width: 3px;
}

.spinner.spinner--takeover {
  border-top-color: var(--c-backdrop-emp);
  border-left-color: var(--c-backdrop-emp);
  width: 32px;
  height: 32px;
  margin-bottom: 100px;
}

@keyframes spinner {

  from {
    transform: rotate(0deg);
  }
  
  to {
    transform: rotate(360deg);
  }

}

.spinner-takeover {
  width: 100vw;
  top: 0;
  justify-content: center;
  height: 100vh;
  align-items: center;
  position: fixed;
  z-index: 9999;
  display: flex;
  background: rgba(247, 244, 237, 0.8);
  left: 0;
}

.avatar {
  width: 20px;
  justify-content: center;
  height: 20px;
  align-items: center;
  flex-shrink: 0;
  font-weight: 700;
  font-size: 9px;
  border-radius: 50%;
  display: flex;
  transition: opacity .5s ease;
  background: var(--c-bg);
  color: #fff;
}

.avatar.avatar--lg {
  font-size: 32px;
  height: 100px;
  width: 100px;
  background: var(--c-bg-hl);
}

.avatar.avatar--lg .iavatar {
  background: var(--c-bg-hl);
}

.avatar.avatar--muted {
  opacity: 0.2;
}

.iavatar-placeholder {
  width: 20px;
  justify-content: center;
  height: 20px;
  text-transform: uppercase;
  align-items: center;
  flex-shrink: 0;
  position: relative;
  font-weight: 700;
  overflow: hidden;
  font-size: 9px;
  border-radius: 50%;
  display: flex;
  background: var(--c-bg-hl-emp);
  color: #fff;
}

.iavatar-placeholder.iavatar-placeholder--lg {
  font-size: 32px;
  height: 100px;
  width: 100px;
}

.iavatar-placeholder.iavatar-placeholder--md {
  font-size: 12px;
  height: 25px;
  width: 25px;
}

.iavatar {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background: var(--c-bg-hl-emp);
}

.favicon {
  width: 16px;
  height: 16px;
}

.business-avatar {
  width: 20px;
  justify-content: center;
  height: 20px;
  align-items: center;
  padding: 5px;
  font-size: 10px;
  border-radius: 50%;
  display: flex;
  background: #ffd6c2;
  color: #ff8b6a;
}

.settings {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  padding-top: 20px;
}

@media (max-width: 992px) {

  .settings {
    padding-top: 0;
  }

}

@media (max-width: 768px) {

  .settings {
    flex-flow: column;
  }

}

.settings-nav {
  width: 200px;
  display: flex;
  flex-flow: column;
  padding-top: 10px;
}

@media (max-width: 768px) {

  .settings-nav {
    margin-bottom: 20px;
  }

}

.settings-content {
  flex: 1;
  width: 100%;
  flex-shrink: 0;
  display: flex;
  flex-flow: column;
}

.settings-nav-header {
  color: var(--c-text);
  font-weight: 700;
  text-transform: uppercase;
  font-size: 12px;
  letter-spacing: 1px;
}

.settings-nav-link {
  color: var(--c-text);
  text-decoration: none;
  font-weight: 500;
  font-size: 14px;
}

.settings-nav-list {
  list-style-type: none;
  padding: 0;
}

.settings-nav-item {
  margin-bottom: 10px;
}

.settings-nav-item:hover .settings-nav-icon {
  opacity: 1;
}

.settings-nav-icon {
  width: 30px;
  display: inline-block;
  opacity: .5;
}

.company-pipelines {
  display: flex;
  flex-flow: column;
}

.sl-item {
  justify-content: space-between;
  height: 40px;
  align-items: center;
  padding: 10px 15px;
  font-weight: 700;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  flex: 1;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.sl-item.sl-item--disabled {
  opacity: 0.5;
}

.sl-item__count {
  color: var(--c-secondary);
  font-style: italic;
  font-weight: 400;
}

.sl-item__nav {
  display: flex;
}

.sl-item__btn {
  justify-content: center;
  margin: 0;
  margin-right: 10px;
  border: none;
  align-items: center;
  padding: 0;
  cursor: pointer;
  font-size: 12px;
  display: flex;
  background: inherit;
  color: var(--c-text);
  opacity: 0.5;
}

.sl-item__btn:last-child {
  margin-right: 0;
}

.sl-item__btn.sl-item__btn--danger {
  color: #fb5e48;
}

.sl-item__btn.sl-item__btn--success {
  color: #2dc08d;
}

.sl-item__btn.sl-item__btn--disabled {
  opacity: 0.3 !important;
  cursor: not-allowed;
}

.sl-item__btn.sl-item__btn--static {
  cursor: inherit;
  opacity: 0.7 !important;
}

.sl-item__btn:hover {
  opacity: 1;
}

.requires-manager {
  background: var(--c-bg-hl);
  max-width: 600px;
  padding: 20px;
  border-radius: 5px;
  color: var(--c-text);
}

@media (max-width: 1200px) {

  .lg-down_flex-flow-column {
    flex-flow: column !important;
  }

}

@media (max-width: 1200px) {

  .lg-down_no-margin-r {
    margin-right: 0 !important;
  }

}

@media (max-width: 1200px) {

  .lg-down_no-margin-l {
    margin-left: 0 !important;
  }

}

@media (max-width: 1200px) {

  .lg-down_margin-b {
    margin-bottom: 10px !important;
  }

}

@media (max-width: 1200px) {

  .lg-down_margin-b-4x {
    margin-bottom: 40px !important;
  }

}

@media (max-width: 1200px) {

  .lg-down_font-size-l {
    font-size: 22px !important;
  }

}

@media (max-width: 1200px) {

  .lg-down_no-after::after {
    display: none !important;
  }

}

.u-margin-b-half {
  margin-bottom: 5px;
}

.u-margin-b {
  margin-bottom: 10px !important;
}

.u-margin-b-2x {
  margin-bottom: 20px !important;
}

.u-margin-b-3x {
  margin-bottom: 30px !important;
}

.u-margin-b-4x {
  margin-bottom: 40px !important;
}

.u-margin-b-5x {
  margin-bottom: 50px !important;
}

.u-margin-b-6x {
  margin-bottom: 60px !important;
}

.u-margin-b-8x {
  margin-bottom: 80px !important;
}

.u-margin-r-tiny {
  margin-right: 2px;
}

.u-margin-r-half {
  margin-right: 5px;
}

.u-margin-r {
  margin-right: 10px !important;
}

.u-margin-r-2x {
  margin-right: 20px !important;
}

.u-margin-l {
  margin-left: 10px;
}

.u-margin-l-half {
  margin-left: 5px;
}

.u-margin-l-2x {
  margin-left: 20px;
}

.u-margin-t-xs {
  margin-top: 3px !important;
}

.u-margin-t-half {
  margin-top: 5px !important;
}

.u-margin-t {
  margin-top: 10px !important;
}

.u-margin-t-2x {
  margin-top: 20px !important;
}

.u-margin-t-3x {
  margin-top: 30px !important;
}

.u-margin-t-4x {
  margin-top: 40px !important;
}

.u-margin-t-5x {
  margin-top: 50px !important;
}

.u-margin-t-6x {
  margin-top: 60px !important;
}

.u-margin-t-8x {
  margin-top: 80px !important;
}

.u-margin-t- {
  margin-top: -10px!important;
}

.u-margin-t--2x {
  margin-top: -20px!important;
}

.u-margin-auto {
  margin: auto;
}

.u-no-margin {
  margin: 0px !important;
}

.u-no-margin-t {
  margin-top: 0px !important;
}

.u-no-h-margin {
  margin-left: 0px !important;
  margin-right: 0px !important;
}

.u-no-padding {
  padding: 0px !important;
}

.u-padding {
  padding: 10px !important;
}

.u-padding-half {
  padding: 5px !important;
}

.u-padding-v {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.u-padding-v-2x {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.u-padding-v-half {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.u-padding-b {
  padding-bottom: 10px !important;
}

.u-padding-2x {
  padding: 20px !important;
}

.u-padding-3x {
  padding: 30px !important;
}

.u-padding-4x {
  padding: 40px !important;
}

.u-padding-l {
  padding-left: 10px !important;
}

.u-padding-l-half {
  padding-left: 5px !important;
}

.u-padding-l-2x {
  padding-left: 20px !important;
}

.u-padding-l-3x {
  padding-left: 30px !important;
}

.u-padding-l-4x {
  padding-left: 40px !important;
}

.u-padding-b-2x {
  padding-bottom: 20px !important;
}

.u-padding-b-5x {
  padding-bottom: 50px !important;
}

.u-padding-h-7 {
  padding-left: 7px !important;
  padding-right: 7px !important;
}

.u-padding-h {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.u-padding-h-half {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.u-padding-h-2x {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.u-padding-h-3x {
  padding-left: 30px !important;
  padding-right: 30px !important;
}

.u-padding-h-4x {
  padding-left: 40px !important;
  padding-right: 40px !important;
}

.u-no-right-padding {
  padding-right: 0px !important;
}

.u-break-word {
  word-break: break-word !important;
}

.u-height-viewport {
  height: 100vh !important;
}

.u-height-100 {
  height: 100% !important;
}

.u-width-auto {
  width: auto !important;
}

.u-width-xs {
  width: 200px !important;
}

.u-width-s {
  width: 300px !important;
}

.u-max-width-50 {
  max-width: 50px !important;
}

.u-max-width-75 {
  max-width: 75px !important;
}

.u-max-width-100 {
  max-width: 100px !important;
}

.u-max-width-200 {
  max-width: 200px !important;
}

.u-max-width-250 {
  max-width: 250px !important;
}

.u-max-width-100p {
  max-width: 100% !important;
}

.u-max-width-xl {
  max-width: 1200px;
}

.u-max-width-l {
  max-width: 800px;
}

.u-max-width-m {
  max-width: 600px !important;
}

.u-max-width-640 {
  max-width: 640px !important;
}

.u-max-width-s {
  max-width: 400px;
}

.u-max-width-xs {
  max-width: 200px !important;
}

.u-min-width-50 {
  min-width: 50% !important;
}

.u-width-100 {
  width: 100% !important;
}

.u-width-70 {
  width: 70px !important;
}

.u-width-100px {
  width: 100px !important;
}

.u-width-60 {
  width: 60px !important;
}

.u-width-m {
  width: 800px !important;
}

.u-width-l {
  width: 900px !important;
}

.u-overflow-hidden {
  overflow: hidden !important;
}

.u-overflow-unset {
  overflow: unset !important;
}

.u-resize-none {
  resize: none !important;
}

.u-invisible {
  visibility: hidden;
}

.u-hidden {
  display: none !important;
}

@media (max-width: 992px) {

  .u-hide-md-down {
    display: none !important;
  }

}

@media (max-width: 1200px) {

  .u-hide-lg-down {
    display: none !important;
  }

}

@media (max-width: 1600px) {

  .u-hide-xl-down {
    display: none !important;
  }

}

.u-display-block {
  display: block !important;
}

.u-no-padding {
  padding: 0px !important;
}

.u-no-border {
  border: none !important;
}

.u-center {
  text-align: center !important;
}

.u-left {
  text-align: left !important;
}

.u-align-self-start {
  align-self: flex-start !important;
}

.u-align-self-end {
  align-self: flex-end !important;
}

.u-flex {
  display: flex;
}

.u-inline-flex {
  display: inline-flex !important;
}

.u-link {
  text-decoration: none;
  color: var(--c-emp);
  font-weight: 500;
  cursor: pointer;
}

.u-link.u-link--decorated {
  text-decoration: underline;
}

.u-margin-0-auto {
  margin: 0 auto !important;
}

.u-flex-1 {
  flex: 1;
}

.u-flex-shrink-0 {
  flex-shrink: 0 !important;
}

.u-flex-wrap {
  flex-wrap: wrap !important;
}

.u-gap-space {
  gap: 10px !important;
}

.u-gap-half {
  gap: 5px !important;
}

.u-gap {
  gap: 10px !important;
}

.u-gap-2x {
  gap: 20px !important;
}

.u-align-center {
  align-items: center;
}

.u-align-end {
  align-items: end;
}

.u-align-self-start {
  align-self: flex-start !important;
}

.u-align-start {
  align-items: flex-start !important;
}

.u-align-self-start {
  align-self: flex-start !important;
}

.u-align-self-end {
  align-self: flex-end !important;
}

.u-justify-center {
  justify-content: center !important;
}

.u-justify-start {
  justify-content: start !important;
}

.u-justify-space-between {
  justify-content: space-between !important;
}

.u-justify-end {
  justify-content: flex-end;
}

.u-flex-flow-column {
  flex-flow: column;
}

@media (max-width: 576px) {

  .u-flex-flow-column-xs {
    flex-flow: column;
  }

}

@media (max-width: 576px) {

  .u-align-start-xs {
    align-items: flex-start !important;
  }

}

@media (max-width: 576px) {

  .u-height-auto-xs {
    height: auto !important;
  }

}

@media (max-width: 576px) {

  .u-margin-b-xs {
    margin-bottom: 10px !important;
  }

}

@media (max-width: 576px) {

  .u-margin-b-2x-xs {
    margin-bottom: 20px !important;
  }

}

.u-flex-flow-row-reverse {
  flex-flow: row-reverse !important;
}

.u-pre-wrap {
  white-space: pre-wrap !important;
}

.u-capitalize {
  text-transform: capitalize;
}

.u-capitalize-first:first-letter {
  text-transform: capitalize !important;
}

.u-bg {
  background: var(--c-bg) !important;
}

.u-bg-dark {
  background: #efe9db !important;
}

.u-bg-light-accent {
  background: #e7deca !important;
}

.u-bg-white {
  background: #fff !important;
}

.u-bg-input {
  background: var(--c-bg-hl) !important;
}

.u-bg-blue {
  background: var(--c-blue) !important;
}

.u-bg-hl {
  background: var(--c-bg-hl);
}

.u-bg-success {
  background: #2dc08d !important;
}

.u-bg-hl-emp {
  background: var(--c-bg-hl-emp);
}

.u-bg-hl-emper {
  background: var(--c-bg-hl-emper) !important;
}

.u-bg-hover-hl-emper:hover {
  background: var(--c-bg-hl-emper) !important;
}

.u-bg-hover-hl:hover {
  background: var(--c-bg-hl) !important;
}

.u-bg-focus-hl:focus {
  background: var(--c-bg-hl) !important;
}

.u-bg-hover-hl-emp:hover {
  background: var(--c-bg-hl-emp) !important;
}

.u-bg-hover-backdrop:hover {
  background: var(--c-backdrop) !important;
}

.u-text-hover-yellow:hover {
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0) !important;
}

.u-bg-hl-empest {
  background: var(--c-bg-hl-empest) !important;
}

.u-color-input {
  color: var(--c-text) !important;
}

.u-border-input {
  border: 2px solid var(--c-bg-hl) !important;
}

.u-border-bottom-bg-hl {
  border-bottom: 1px solid var(--c-bg-hl) !important;
}

.u-rounded {
  border-radius: 5px !important;
}

.u-rounded-top {
  border-radius: 5px 5px 0 0 !important;
}

.u-rounded-b {
  border-radius: 0 0 5px 5px !important;
}

.u-round {
  border-radius: 50% !important;
}

.u-spaced {
  padding: 10px;
}

.u-spaced-1-2 {
  padding: 10px 20px;
}

.u-cursor-pointer {
  cursor: pointer !important;
}

.u-cursor-grab {
  cursor: grab !important;
}

.u-cursor-not-allowed {
  cursor: not-allowed !important;
}

.u-cursor-default {
  cursor: auto !important;
}

.u-float-right {
  float: right !important;
}

.u-float-left {
  float: left !important;
}

.u-lowercase {
  text-transform: lowercase !important;
}

.u-uppercase {
  text-transform: uppercase !important;
}

.u-capitalize {
  text-transform: capitalize !important;
}

.u-no-decoration {
  text-decoration: none !important;
}

.u-decoration {
  text-decoration: underline !important;
}

.u-line-through {
  text-decoration: line-through !important;
}

.u-mute {
  color: #5E7182 !important;
}

.u-inline-list {
  display: flex;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.u-inline-list li {
  display: inline-block;
}

.u-inline-list li a::after {
  display: inline-block;
  content: '·';
  padding: 0px 10px;
  color: #000;
}

.u-inline-list li:last-child a::after {
  display: none;
}

.u-amount, .u-monospace {
  font-family: Menlo, Monaco, Roboto Mono, Cascadia Mono, Oxygen Mono, Ubuntu Monospace, Source Code Pro, Fira Mono, Fira Code, Droid Sans Mono, Segoe UI Mono, monospace;
}

.app-title {
  text-align: left;
  font-size: 22px;
  display: flex;
  align-items: center;
  margin: 0;
}

.app-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 50px;
  overflow: hidden;
}

.page-title {
  text-align: center;
  color: var(--c-emper);
  font-size: 32px;
}

.page-title-xl {
  text-align: center;
  font-size: 78px;
  margin: 40px 0 20px 0;
  font-weight: 900;
  color: var(--c-emper);
}

.page-title-xxl {
  text-align: center;
  font-size: 78px !important;
  margin: 40px 0 20px 0;
  font-weight: 900;
  color: var(--c-emper);
}

@media (max-width: 576px) {

  .page-title-xxl {
    font-size: 56px !important;
  }

}

.page-lead {
  font-size: 22px;
  text-align: center;
  line-height: 160%;
}

.app-lead {
  margin: 0;
  line-height: 160%;
}

.app-lead.app-lead--light {
  color: var(--c-text);
}

.fade-in {
  animation-name: fade-in;
  animation-duration: .4s;
  animation-timing-function: ease-out;
}

@keyframes fade-in {

  from {
    opacity: 0;
  }
  
  to {
    opacity: 1;
  }

}

.img-responsive {
  overflow: hidden;
  max-width: 100%;
}

.fa-spin {
  animation-duration: .7s;
}

.u-color-bg {
  color: var(--c-bg) !important;
}

.u-color-bg-hl {
  color: var(--c-bg-hl) !important;
}

.u-color-bg-hl-emp {
  color: var(--c-bg-hl-emp) !important;
}

.u-color-bg-hl-emper {
  color: var(--c-bg-hl-emper) !important;
}

.u-color-text {
  color: var(--c-text) !important;
}

.u-color-secondary {
  color: var(--c-secondary) !important;
}

.u-color-muted {
  color: var(--c-muted) !important;
}

.u-color-emp {
  color: var(--c-bg-hl-emper) !important;
}

.u-color-emper {
  color: var(--c-emper) !important;
}

.u-color-backdrop {
  color: var(--c-backdrop) !important;
}

.u-color-purple {
  color: rgba(131, 71, 138, 1);
}

.u-color-purple-alt {
  color: #9571f7 !important;
}

.u-color-white {
  color: #fff !important;
}

.u-color-danger {
  color: #fb5e48 !important;
}

.u-color-hover-success:hover {
  color: #2dc08d !important;
}

.u-color-hover-danger:hover {
  color: #ff8b6a !important;
}

.u-color-hover-text:hover {
  color: var(--c-text) !important;
}

.u-color-success {
  color: #2dc08d !important;
}

.u-bg-green-light {
  background: #86e4b7 !important;
}

.u-color-green-darker {
  color: hsla(159.31035, 40.092167%, 27.549019%, 1.0) !important;
}

.u-color-brand {
  color: #2dc08d;
}

.u-color-primary {
  color: var(--c-text);
}

.u-color-emp {
  color: var(--c-bg-hl-emp);
}

.u-color-accent {
  color: var(--c-bg-hl-emper) !important;
}

.u-color-light-accent {
  color: var(--c-bg-hl-emp);
}

.u-color-yellow {
  color: #fabc60 !important;
}

.u-color-blue {
  color: #0075f6 !important;
}

.u-color-silver {
  color: #7ebecb !important;
}

.u-color-peach {
  color: #ff8b6a;
}

.u-color-peach-dark {
  color: #ff8b6a !important;
}

.u-bg-peach-light {
  background: #ffd6c2 !important;
}

.u-color-blue-dark {
  color: #437c9e !important;
}

.u-bg-blue-light {
  background: #93c2f7 !important;
}

.u-color-blue-light {
  color: #93c2f7 !important;
}

.u-color-purple-dark {
  color: hsla(209.09091, 25.19084%, 20.686274%, 1.0) !important;
}

.u-bg-purple-light {
  background: hsla(209.09091, 25.19084%, 35.686275%, 1.0) !important;
}

.u-color-purple-light {
  color: hsla(209.09091, 25.19084%, 35.686275%, 1.0) !important;
}

.u-color-yellow-dark {
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0) !important;
}

.u-bg-yellow-light {
  background: hsla(35.844154, 93.902435%, 82.84314%, 1.0) !important;
}

.u-color-pink-dark {
  color: hsla(337.11865, 100%, 71.86275%, 1.0) !important;
}

.u-bg-pink-light {
  background: hsla(337.11865, 100%, 86.86275%, 1.0) !important;
}

.u-color-pink {
  color: hsla(337.11865, 100%, 71.86275%, 1.0) !important;
}

.u-color-pink-2 {
  color: #fb7ead !important;
}

.u-color-brown {
  color: #57321a !important;
}

.u-color-green {
  color: #59d99f !important;
}

.u-color-blue-600 {
  color: #5E7182 !important;
}

.u-color-blue-700 {
  color: #314252;
}

.u-color-blue-800 {
  color: #1C2C3C;
}

.u-color-blue-900 {
  color: #111F2C;
}

.u-bg-danger {
  background: #fb5e48 !important;
}

.u-bg-brand {
  background: #2dc08d !important;
}

.u-bg-yellow {
  background: #fabc60 !important;
}

.u-bg-red-light {
  background: #ffabab !important;
}

.u-bg-red-dark {
  background: #d45454 !important;
}

.u-bg-blue-light {
  background: #93c2f7 !important;
}

.u-bg-blue-dark {
  background: #437c9e !important;
}

.u-bg-peach-light {
  background: #ffd6c2 !important;
}

.u-color-peach-light {
  color: #ffd6c2 !important;
}

.u-bg-peach-dark {
  background: #ff8b6a !important;
}

.u-bg-green-light {
  background: #86e4b7 !important;
}

.u-color-green-light {
  color: #86e4b7 !important;
}

.u-bg-green-dark {
  background: #41987a !important;
}

.u-bg-primary {
  background: #314252 !important;
}

.u-opacity-50 {
  opacity: 50% !important;
}

.u-opacity-70 {
  opacity: 70% !important;
}

.u-opacity-75 {
  opacity: 70% !important;
}

.u-opacity-80 {
  opacity: 70% !important;
}

.u-opacity-60-100 {
  opacity: 60% !important;
}

.u-opacity-60-100:hover {
  opacity: 100% !important;
}

.u-emoji {
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 100%;
}

.u-underline {
  text-decoration: underline !important;
}

.u-font-weight-base {
  font-weight: 400 !important;
}

.u-font-weight-medium {
  font-weight: 500 !important;
}

.u-font-weight-bold {
  font-weight: 700 !important;
}

.u-font-weight-black {
  font-weight: 900 !important;
}

.u-font-style-italic {
  font-style: italic;
}

.u-font-size-xxs {
  font-size: 10px !important;
}

.u-font-size-xs {
  font-size: 12px !important;
}

.u-font-size-s {
  font-size: 14px !important;
}

.u-font-size-m {
  font-size: 16px !important;
}

.u-font-size-l {
  font-size: 22px !important;
}

.u-font-size-xl {
  font-size: 32px !important;
}

.u-page-title-s {
  font-size: 72px !important;
}

@media (max-width: 992px) {

  .u-page-title-s {
    font-size: 48px !important;
  }

}

.u-page-title {
  font-size: 96px !important;
}

@media (max-width: 992px) {

  .u-page-title {
    font-size: 62px !important;
  }

}

.u-page-title-l {
  font-size: 96px !important;
}

.u-font-size-xxl {
  font-size: 78px !important;
}

@media (max-width: 576px) {

  .u-font-size-xxl.u-font-size-xxl-resp {
    font-size: 32px !important;
  }

}

.u-line-height-100 {
  line-height: 100% !important;
}

.u-line-height-xs {
  line-height: 110% !important;
}

.u-line-height-s {
  line-height: 120% !important;
}

.u-line-height-m {
  line-height: 140%;
}

.u-line-height-l {
  line-height: 160%;
}

.u-italic {
  font-style: italic !important;
}

.u-bold {
  font-weight: 700 !important;
}

.u-list {
  list-style-position: inside !important;
  padding-left: 0px;
}

.u-position-relative {
  position: relative !important;
}

@media (min-width: 1200px) {

  .u-truncate-text--contact-name {
    display: inline-block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    width: 200px !important;
  }

}

@media (max-width: 576px) {

  .u-truncate-text--contact-name {
    display: inline-block !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
    width: 200px !important;
  }

}

.u-truncate-text {
  display: inline-block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  width: 200px !important;
}

.u-truncate-text.u-truncate-text--m {
  width: 250px !important;
}

.u-truncate-text.u-truncate-text--l {
  width: 300px !important;
}

.u-truncate-text.u-truncate-text--xl {
  width: 560px !important;
}

@media (max-width: 768px) {

  .u-truncate-text.u-truncate-text--xl {
    width: 300px !important;
  }

}

.u-truncate-text.u-truncate-text--100 {
  width: 100px !important;
}

.u-truncate-text.u-truncate-text--150 {
  width: 150px !important;
}

.u-truncate-text.u-truncate-text--template {
  width: 300px !important;
}

.u-truncate-text.u-truncate-text--contact {
  width: 300px !important;
}

@media (max-width: 1200px) {

  .u-truncate-text.u-truncate-text--contact {
    width: 250px !important;
  }

}

@media (max-width: 576px) {

  .u-truncate-text.u-truncate-text--contact {
    width: 300px !important;
  }

}

.u-truncate-text.u-truncate-text--pipeline {
  width: 250px !important;
}

@media (max-width: 1600px) {

  .u-truncate-text.u-truncate-text--pipeline {
    width: 200px !important;
  }

}

@media (max-width: 1200px) {

  .u-truncate-text.u-truncate-text--pipeline {
    width: 120px !important;
  }

}

@media (max-width: 992px) {

  .u-truncate-text.u-truncate-text--pipeline {
    width: 200px !important;
  }

}

@media (max-width: 768px) {

  .u-truncate-text.u-truncate-text--pipeline {
    width: 250px !important;
  }

}

.u-truncate-text.u-truncated-text--mobile {
  width: 100% !important;
}

@media (max-width: 576px) {

  .u-truncate-text.u-truncated-text--mobile {
    width: 280px !important;
  }

}

.u-curved-underline {
  position: relative;
  overflow: hidden;
}

.u-curved-underline:after {
  width: 100%;
  border-width: 2px;
  top: 37px;
  border-color: #2dc08d transparent transparent transparent;
  height: 7px;
  border-style: solid;
  position: absolute;
  content: "";
  border-radius: 50% 50% 0% 0%;
  bottom: 10px;
  left: 0px;
}

.icon {
  margin-bottom: -2px;
  line-height: 160%;
}

.user-list {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.user-item {
  margin-bottom: 10px;
  display: flex;
}

.user-item:last-child {
  margin-bottom: 0;
}

.user-list-title {
  font-size: 12px;
  text-transform: uppercase;
  margin-bottom: 20px;
}

.user-item-avatar {
  margin-right: 10px;
}

.user-item-name {
  margin-right: 10px;
  font-weight: 500;
}

.user-item-email {
  margin-right: 10px;
}

.user-item-control {
  color: var(--c-text);
  opacity: .5;
  cursor: pointer;
}

.user-item-control:hover {
  opacity: 1;
}

.tasks {
  display: flex;
  flex-flow: column;
}

.tasks-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 800px;
}

.filters.filters--tasks {
  display: grid;
  grid-template-columns: 1fr 160px auto;
  grid-gap: 10px;
}

@media (max-width: 576px) {

  .filters.filters--tasks {
    grid-template-columns: 1fr;
  }

}

.task-group__header {
  border-bottom: 1px solid var(--c-bg-hl);
  padding-bottom: 10px;
}

.task {
  flex-flow: column;
  width: 100%;
  max-width: 800px;
  padding: 10px 20px;
  margin-bottom: 5px;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  transition: background 0.1s ease-out;
  padding-left: 7px;
}

.task:hover {
  background: var(--c-bg-hl);
}

.task.task--done {
  opacity: 0.5;
}

.task.task--done .task-description {
  text-decoration: line-through;
}

.task.task--compact {
  padding: 5px;
}

.task.task--compact:hover {
  background: var(--c-bg);
}

.task.task--compact .u-truncate-text--xl {
  max-width: 300px !important;
}

@media (max-width: 576px) {

  .task.task--compact .u-truncate-text--xl {
    max-width: 200px !important;
  }

}

.task.task--compact.task--editing {
  background: var(--c-bg);
  padding-top: 20px;
  padding-bottom: 20px;
}

.task.task--editing {
  padding-top: 30px;
  padding-bottom: 30px;
  background: var(--c-bg-hl);
}

.task .task__edit {
  display: none;
}

.task:hover .task__edit {
  display: flex;
}

.task__row {
  display: flex;
}

.task__row.task__row--indent {
  padding-left: 39px;
  margin-top: 5px;
}

.task__col {
  display: flex;
  align-items: center;
}

.task__contact {
  display: flex;
  align-items: center;
  color: var(--c-text);
  text-decoration: none;
  font-weight: 400;
}

.show-more-tasks {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 30px;
  margin-bottom: 30px;
}

.datepicker-wrapper {
  display: flex;
  align-items: center;
  background: var(--c-bg-hl);
  border: 2px solid var(--c-bg-hl);
  border-radius: 5px;
  color: #7F90A0;
  height: 45px;
}

.datepicker-wrapper.datepicker-wrapper--range {
  align-items: center;
  justify-content: center;
  display: flex;
  flex: 1;
  width: 100%;
}

.datepicker-wrapper.datepicker-wrapper--range .flatpickr-input {
  width: 100%;
}

.datepicker-wrapper .input {
  border: none !important;
}

.datepicker-wrapper.datepicker-wrapper--inline {
  background: var(--c-bg);
  color: var(--c-text);
  border: 1px solid var(--c-bg);
  border-radius: 3px;
  height: 25px;
}

.datepicker-wrapper.datepicker-wrapper--inline .datepicker-clear {
  color: var(--c-text);
}

.datepicker {
  background: transparent;
  border: none;
  height: 100% !important;
}

.datepicker:focus {
  border: none;
}

.datepicker-clear {
  margin-right: 10px;
  font-size: 12px;
  cursor: pointer;
}

@keyframes shake {

  from, to {
    transform: translate3d(0, 0, 0);
  }
  
10%, 30%, 50%, 70%, 90% {
    transform: translate3d(-10px, 0, 0);
  }
  
20%, 40%, 60%, 80% {
    transform: translate3d(10px, 0, 0);
  }

}

.shake {
  animation-name: shake;
  animation-duration: .7s;
  animation-timing-function: ease-out;
}

@keyframes punch {

0% {
    transform: scale(1);
  }
  
100% {
    transform: scale(1.1);
  }

}

.punch {
  animation-name: punch;
  animation-duration: 0.1s;
  animation-timing-function: ease-in-out;
}

@keyframes hide {

0% {
    transform: scale(1);
    opacity: 1;
  }
  
20% {
    transform: translateX(0px) scale(0.7);
    opacity: 0.7;
  }
  
100% {
    transform: translateX(-2000px) scale(0.7);
    opacity: 0.7;
  }

}

.hide {
  animation-name: hide;
  animation-duration: 0.4s;
  animation-timing-function: ease-in-out;
}

@keyframes pulse {

0% {
    opacity: 1;
  }
  
50% {
    opacity: 0.5;
  }
  
100% {
    opacity: 1;
  }

}

.pulse {
  animation-name: pulse;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

@media (max-width: 576px) {

  .hidden-xs-down {
    display: none !important;
  }

}

@media (max-width: 768px) {

  .hidden-sm-down {
    display: none !important;
  }

}

@media (max-width: 992px) {

  .hidden-md-down {
    display: none !important;
  }

}

@media (max-width: 1200px) {

  .hidden-lg-down {
    display: none !important;
  }

}

@media (max-width: 1600px) {

  .hidden-xl-down {
    display: none !important;
  }

}

@media (min-width: 577px) {

  .hidden-xs-up {
    display: none !important;
  }

}

@media (min-width: 769px) {

  .hidden-sm-up {
    display: none !important;
  }

}

@media (min-width: 993px) {

  .hidden-md-up {
    display: none !important;
  }

}

@media (min-width: 1201px) {

  .hidden-lg-up {
    display: none !important;
  }

}

@media (min-width: 768px) and (max-width: 1200px) {

  .visible-desktop-mobile {
    display: none !important;
  }

}

.dashboard-widgets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(510px, 1fr));
  grid-gap: 20px;
}

@media (max-width: 576px) {

  .dashboard-widgets {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  }

}

.dashboard-widget__dismiss {
  width: 30px;
  right: -10px;
  top: -10px;
  justify-content: center;
  height: 30px;
  align-items: center;
  position: absolute;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  background: var(--c-bg-hl);
}

.dashboard-widget {
  display: flex;
  position: relative;
  flex-flow: column;
  justify-content: space-between;
  background: var(--c-bg-content);
  padding: 30px;
  border-radius: 5px;
}

.dashboard-widget.dashboard-widget--fixed-height {
  max-height: 314px;
}

.dashboard-widget.dashboard-widget--fixed {
  position: fixed;
  bottom: 20px;
  right: 30px;
  left: auto;
  width: 100%;
  max-width: 400px;
  height: auto;
  z-index: 9999;
}

@media (min-width: 1880px) {

  .dashboard-widget.dashboard-widget--fixed {
    right: auto;
    left: 1420px;
  }

}

@media (max-width: 576px) {

  .dashboard-widget.dashboard-widget--fixed {
    max-width: 320px;
  }

}

.dashboard-widget.dashboard-widget--accent {
  background: var(--c-bg-hl-emp);
}

.dashboard-widget.dashboard-widget--party {
  background: #9146ff;
  overflow: visible;
}

.dashboard-widget.dashboard-widget--party .dashboard-widget-title-text {
  color: #fff;
}

.dashboard-widget.dashboard-widget--party .dashboard-widget-title-icon {
  background: hsla(264.3243, 100%, 43.72549%, 1.0);
}

.dashboard-widget.dashboard-widget--party .dashboard-widget__dismiss {
  background: hsla(264.3243, 100%, 43.72549%, 1.0);
  color: hsla(264.3243, 100%, 93.72549%, 1.0);
}

.dashboard-widget-title {
  margin-bottom: 30px;
  display: flex;
  align-items: center;
}

.dashboard-widget-title-icon {
  width: 30px;
  justify-content: center;
  height: 30px;
  margin-right: 10px;
  align-items: center;
  font-size: 14px;
  border-radius: 50%;
  display: flex;
  background: hsla(159.18367, 62.02532%, 56.47059%, 1.0);
  color: hsla(159.18367, 62.02532%, 36.47059%, 1.0);
}

.dashboard-widget-title-icon.dashboard-widget-title-icon--peach {
  color: #ff8b6a;
  background: #ffd6c2;
}

.dashboard-widget-title-icon.dashboard-widget-title-icon--silver {
  color: hsla(190.12987, 42.541435%, 54.509804%, 1.0);
  background: hsla(190.12987, 42.541435%, 74.5098%, 1.0);
}

.dashboard-widget-title-icon.dashboard-widget-title-icon--yellow {
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0);
  background: hsla(35.844154, 93.902435%, 77.84314%, 1.0);
}

.dashboard-widget-title-icon.dashboard-widget-title-icon--primary {
  color: hsla(209.09091, 25.19084%, 15.686275%, 1.0);
  background: hsla(209.09091, 25.19084%, 85.68627%, 1.0);
}

.dashboard-widget-title-icon.dashboard-widget-title-icon--purple {
  color: hsla(264.3243, 100%, 93.72549%, 1.0);
  background: hsla(264.3243, 100%, 53.72549%, 1.0);
}

.dashboard-widget-title-text {
  color: var(--c-text);
  font-weight: 700;
  font-size: 16px;
}

.dashboard-widget-text {
  color: var(--c-text);
  line-height: 150%;
}

.dashboard-pipeline {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 30px;
  margin-bottom: 20px;
}

@media (max-width: 576px) {

  .dashboard-pipeline {
    grid-template-columns: 1fr;
  }

}

.dashboard-badge {
  font-size: 10px;
  background: #ffd6c2;
  color: #ff8b6a;
  padding: 5px 10px;
  border-radius: 15px;
}

.tasks-widget {
  display: flex;
  flex-flow: column;
  flex: 1;
  margin-bottom: 10px;
}

.tasks-widget-item {
  display: grid;
  grid-template-columns: 40px 1fr 115px;
  margin-bottom: 10px;
  text-decoration: none;
  line-height: 140%;
  color: inherit;
}

.contacts-widget {
  flex: 1;
  margin-bottom: 20px;
}

.contacts-widget-item {
  display: grid;
  grid-template-columns: 40px 1fr;
  margin-bottom: 10px;
  text-decoration: none;
  color: inherit;
}

.dashboard-title {
  height: 100%;
}

.activity-log-wrapper {
  display: flex;
  width: 100%;
  justify-content: end;
  overflow: hidden;
}

.activity-log-wrapper:before {
  content: '';
  width: 200px;
  height: 140px;
  position: absolute;
  left: 0;
  top: 60px;
  bottom: 0;
  background: linear-gradient(270deg, transparent 5px,var(--c-bg-content));
}

.activity-log-wrapper.activity-log-wrapper--sm {
  overflow: auto;
  position: relative;
}

.activity-log-wrapper.activity-log-wrapper--sm:before {
  content: '';
  width: 200px;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  background: linear-gradient(270deg, transparent 10px,var(--c-bg-content));
}

.activity-log {
  display: grid;
  grid-auto-flow: column;
  grid-template-columns: repeat(50, 15.9px);
  grid-template-rows: repeat(6, 15.9px);
  grid-gap: 2px;
}

.activity-log::-webkit-scrollbar {
  display: none;
}

.activity-log.activity-log--sm {
  grid-template-columns: repeat(10, 41.9px);
  grid-template-rows: repeat(3, 41.9px);
  grid-gap: 7px;
}

.activity-item {
  border-radius: 50%;
}

.activity-item:hover {
  border: 2px solid var(--c-bg-hl-emp);
}

.info-box {
  background: hsla(211.8, 86.206894%, 94.254906%, 1.0);
  color: #437c9e;
  padding: 20px;
  display: flex;
  flex-flow: column;
  font-size: 12px;
  line-height: 140%;
}

.info-box-head {
  display: flex;
  margin-bottom: 10px;
}

.info-box-icon {
  margin-right: 10px;
}

.info-box-title {
  font-weight: 700;
}

.contacts {
  width: 100%;
  display: flex;
  flex-flow: column;
  margin-bottom: 30px;
}

.contacts-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.count-label {
  font-family: Menlo, Monaco, Roboto Mono, Cascadia Mono, Oxygen Mono, Ubuntu Monospace, Source Code Pro, Fira Mono, Fira Code, Droid Sans Mono, Segoe UI Mono, monospace;
  height: 26px;
  border: none;
  align-items: center;
  padding: 5px;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-emp);
}

.count-label.count-label--xs {
  font-size: 12px;
}

.export-btn__text {
  display: flex;
}

@media (max-width: 1600px) {

  .export-btn__text {
    display: none;
  }

}

@media (max-width: 1200px) {

  .export-btn__text {
    display: flex;
  }

}

.filters {
  display: grid;
  grid-template-columns: 1fr 175px 175px 175px auto;
  grid-gap: 10px;
  margin-bottom: 20px;
}

@media (max-width: 1600px) {

  .filters {
    grid-template-columns: 2fr 140px 175px 170px auto;
  }

}

@media (max-width: 1200px) {

  .filters {
    grid-template-columns: repeat(auto-fit, minmax(250px, 2fr));
  }

}

@media (max-width: 768px) {

  .filters {
    grid-template-columns: repeat(auto-fill, 100%);
  }

}

.search-bar {
  justify-content: space-between;
  height: 50px;
  align-items: center;
  padding-right: 20px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-emp);
  padding-left: 20px;
}

.search-input {
  height: 100%;
  width: 100%;
  background: transparent;
  color: inherit;
  border: none;
  font-size: 14px;
}

.dropdown-item.tag-filter__tag {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-flow: column;
  font-size: 12px;
}

.dropdown-item.tag-filter__tag.tag-filter__tag--active {
  background: var(--c-bg-hl-emp);
}

.tag-filter__tag-text {
  text-transform: capitalize;
  font-weight: 500;
  margin-bottom: 5px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  width: 100%;
}

.tag-filter__tag-count {
  opacity: 0.7;
}

.toggle-filter {
  justify-content: flex-start;
  height: 50px;
  align-items: center;
  padding: 10px 20px;
  cursor: pointer;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.dropdown-select {
  justify-content: space-between;
  height: 50px;
  align-items: center;
  padding: 20px;
  position: relative;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.dropdown-select.dropdown-select--inline {
  background: inherit;
  padding: 0px;
  height: 100%;
  width: 100%;
  justify-content: center;
}

.dropdown-select.dropdown-select--inline.dropdown-select--inline-detail {
  justify-content: flex-start;
  min-height: 10px;
  padding-bottom: 10px;
  max-width: 140px;
}

.dropdown-select-label {
  display: flex;
}

.dropdown-select-label--inline-detail {
  height: 20px;
}

.dropdown-select-count-label {
  height: 20px;
  align-items: center;
  font-size: 12px;
  padding-right: 5px;
  border-radius: 5px;
  display: flex;
  background: var(--c-backdrop);
  color: var(--c-text);
  padding-left: 5px;
}

.clear-dropdown-select-icon {
  font-size: 18px;
  margin-left: 4px;
}

.dropdown {
  flex-flow: column;
  width: 100%;
  top: 25px;
  justify-content: flex-end;
  padding: 0px;
  visibility: hidden;
  position: absolute;
  z-index: 999999;
  overflow: hidden;
  border-radius: 0px 0px 5px 5px;
  display: none;
  transition: all 0.5 ease;
  background: inherit;
  padding-top: 10px;
  opacity: 0;
  left: 0;
}

.dropdown.dropdown--inline {
  border: 1px solid var(--c-bg-hl-emp);
  padding-top: 0px;
  background: var(--c-bg-hl);
  top: 35px;
  border-radius: 5px;
}

@media (max-width: 768px) {

  .dropdown.dropdown--inline {
    top: 25px;
  }

}

.dropdown.dropdown--inline.dropdown--inline-detail {
  top: 10px;
}

.dropdown-inner {
  max-height: 330px;
  overflow: auto;
  position: relative;
}

@media (min-width: 992px) {

  .dropdown-select:hover .dropdown, .dropdown-select:focus-within .dropdown, .dropdown-select:focus .dropdown {
    visibility: visible;
    display: flex;
    opacity: 1;
  }

}

.dropdown-select-btn {
  display: none;
}

.dropdown-select-btn-label {
  display: flex;
  justify-content: space-between;
  width: 100%;
}

@media (max-width: 992px) {

  .dropdown-select-btn:checked ~ .dropdown {
    visibility: visible;
    display: flex;
    opacity: 1;
  }

}

.dropdown-item {
  list-style: none;
  cursor: pointer;
  width: 100%;
  padding: 10px;
  display: flex;
  align-items: center;
}

.dropdown-item.dropdown-item--active {
  background: var(--c-bg-hl-emp);
}

.dropdown-item.dropdown-item--inline {
  justify-content: flex-start;
  font-size: 12px;
  font-weight: 500;
  text-transform: capitalize;
}

.dropdown-item.dropdown-item--inline:hover {
  background: var(--c-bg-hl-emp);
}

.dropdown-item:hover {
  background: var(--c-bg-hl-emp);
}

.dropdown-item:last-child {
  margin-bottom: 0px;
}

.dropdown-item.dropdown-item--empty {
  display: flex;
  flex-flow: column;
  cursor: auto;
  opacity: 0.7;
}

.contacts-head {
  font-weight: 700;
  color: var(--c-text);
  background: var(--c-bg);
}

.contacts-row {
  width: 100%;
  height: 65px;
  position: relative;
  grid-gap: 10px;
  margin-bottom: 10px;
  border-radius: 5px;
  display: grid;
  grid-template-columns: 30px 30px 1fr 140px 1fr 1fr 91px 91px 120px 77px;
  background: var(--c-bg-content);
  color: var(--c-text);
}

@media (max-width: 1600px) {

  .contacts-row {
    grid-template-columns: 30px 30px 1fr 1fr 91px 91px 120px 77px;
  }

}

@media (max-width: 1200px) {

  .contacts-row {
    grid-template-columns: 30px 2fr 120px 77px;
  }

}

@media (max-width: 992px) {

  .contacts-row {
    grid-template-columns: 30px 2fr 120px 77px;
  }

}

@media (max-width: 768px) {

  .contacts-row {
    grid-template-columns: 30px 2fr 120px 77px;
  }

}

@media (max-width: 576px) {

  .contacts-row {
    grid-template-columns: 30px 1fr 120px;
  }

}

.contacts-row.contacts-row--head {
  background: var(--c-bg);
  color: var(--c-text);
  font-weight: 700;
}

.contacts-row.contacts-row--nudged {
  background: var(--c-bg);
}

.contacts-row.contacts-row--nudged .avatar {
  border: 2px solid var(--c-secondary);
}

.contacts-type {
  width: 16px;
  top: -5px;
  justify-content: center;
  height: 16px;
  align-items: center;
  position: absolute;
  overflow: hidden;
  font-size: 8px;
  border-radius: 50%;
  display: flex;
  background: hsla(190.12987, 42.541435%, 79.5098%, 1.0);
  color: hsla(190.12987, 42.541435%, 54.509804%, 1.0);
  left: -5px;
}

.contacts-type.contacts-type--details {
  background: hsla(190.12987, 42.541435%, 79.5098%, 1.0);
  color: hsla(190.12987, 42.541435%, 54.509804%, 1.0);
}

.contacts-type.contacts-type--tags {
  background: #ffabab;
  color: #d45454;
}

.contacts-type.contacts-type--notes {
  background: hsla(35.844154, 93.902435%, 82.84314%, 1.0);
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0);
}

.contacts-type.contacts-type--tasks {
  background: #ffd6c2;
  color: #ff8b6a;
}

.contacts-type.contacts-type--attributes {
  background: #c4e1dc;
  color: #284643;
}

.contacts-type.contacts-type--messages {
  background: hsla(337.11865, 100%, 86.86275%, 1.0);
  color: hsla(337.11865, 100%, 71.86275%, 1.0);
}

.contacts__company {
  line-height: 100%;
  width: 200px !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  font-weight: 400;
  overflow: hidden !important;
  font-size: 12px;
  display: block !important;
  opacity: 0.7;
}

.contacts-col {
  text-align: left;
  padding: 20px;
  font-size: 14px;
  line-height: 140%;
  display: flex;
  align-items: center;
  overflow: hidden;
  position: relative;
}

.contacts-col.contacts-col--dd {
  overflow: visible;
}

@media (max-width: 768px) {

  .contacts-col {
    padding: 10px;
  }

}

.contacts-col.contacts-col--center {
  justify-content: center;
}

.contacts-col.contacts-col--head {
  cursor: pointer;
}

.contacts-col__tags {
  margin-top: 7px;
}

.contacts-controls {
  display: flex;
  margin-left: 40px;
}

.contacts-controls__control {
  margin-right: 10px;
  cursor: pointer;
  opacity: 0.7;
  font-size: 19px;
}

.contacts-controls__control:hover {
  opacity: 1.0;
}

.contacts-controls__control.contacts-controls__control--active {
  color: #ff8b6a;
}

.contacts-truncate-text {
  display: inline-block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap;
  width: 150px !important;
}

@media (max-width: 1200px) {

  .contacts-truncate-text {
    width: 100px !important;
  }

}

@media (max-width: 992px) {

  .contacts-truncate-text {
    width: 80px !important;
  }

}

@media (max-width: 768px) {

  .contacts-truncate-text {
    width: 50px !important;
  }

}

@media (max-width: 576px) {

  .contacts-truncate-text {
    width: 110px !important;
  }

}

.contacts-truncate-text.contacts-truncate-text--l {
  width: 300px !important;
}

@media (max-width: 1200px) {

  .contacts-truncate-text.contacts-truncate-text--l {
    width: 200px !important;
  }

}

@media (max-width: 992px) {

  .contacts-truncate-text.contacts-truncate-text--l {
    width: 160px !important;
  }

}

@media (max-width: 768px) {

  .contacts-truncate-text.contacts-truncate-text--l {
    width: 100px !important;
  }

}

.contacts-select {
  font-size: 20px;
  color: var(--c-bg-hl);
  cursor: pointer;
}

.contacts-select.contacts-select--active {
  color: var(--c-bg-hl-emper);
}

.contacts-quick-add-btn {
  width: 50px;
  right: 20px;
  justify-content: center;
  height: 50px;
  border: none;
  align-items: center;
  position: fixed;
  cursor: pointer;
  font-size: 20px;
  background-color: var(--c-bg-hl);
  border-radius: 50%;
  display: flex;
  bottom: 20px;
  color: var(--c-bg-hl-empest);
}

.contacts-quick-add-btn:hover {
  background-color: var(--c-bg-hl-emp);
}

.table-link {
  line-height: normal;
  vertical-align: center;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 500;
  text-decoration: none;
  overflow: hidden;
  display: table-cell;
  color: var(--c-emp);
}

.table-truncate {
  display: table-cell;
  line-height: normal;
  vertical-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  flex: 1;
  padding-top: 40px;
  padding-bottom: 40px;
}

.table-empty-icon {
  font-size: 100px;
  color: var(--c-backdrop);
}

.table-empty-title {
  color: var(--c-emp);
  font-weight: 500;
}

.table-empty-text {
  color: var(--c-text);
  max-width: 400px;
  text-align: center;
  line-height: 140%;
}

.importer-form {
  margin-bottom: 20px;
}

.importer-table-wrapper {
  display: inline-flex;
  flex-flow: column;
  max-width: 100%;
}

.importer-table {
  overflow: auto;
  display: inline-flex;
  flex-flow: column;
  padding: 10px 0;
  margin-bottom: 20px;
}

.importer-buttons {
  display: flex;
  justify-content: space-between;
}

.importer-row, .importer-head {
  margin-bottom: 5px;
  display: flex;
  width: 100%;
  font-weight: 400;
}

.importer-col, .importer-head-col {
  width: 180px;
  display: flex;
  flex-flow: column;
  background: var(--c-bg-content);
  flex-shrink: 0;
  padding: 10px;
  font-size: 14px;
}

.importer-col:first-child, .importer-head-col:first-child {
  border-radius: 5px 0px 0px 5px;
}

.importer-col:last-child, .importer-head-col:last-child {
  border-radius: 0px 5px 5px 0px;
}

.importer-head-col {
  justify-content: space-between;
}

.importer-original-title {
  font-style: italic;
  color: #5E7182;
}

.importer-assigned-title {
  font-weight: 700;
  color: var(--c-emper);
  text-transform: capitalize;
  margin-bottom: 10px;
  height: 30px;
  display: flex;
  align-items: center;
}

.importer-assigned-title.importer-assigned-title--skip {
  color: #fb5e48;
  text-transform: none;
}

.importer-edit-btn {
  margin-bottom: 5px;
  cursor: pointer;
  display: flex;
  margin-right: 5px;
  font-weight: 700;
}

.importer-select {
  display: flex;
  text-transform: capitalize;
  margin-bottom: 10px;
  height: 30px;
}

.importer-controls {
  display: flex;
  flex-flow: column;
}

.importer-help-text {
  font-size: 16px;
  margin-bottom: 10px;
  line-height: 140%;
}

.importer-input {
  display: none;
}

.importer-input-label {
  display: inline-flex;
}

.analytics-widgets {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  grid-gap: 20px;
  margin-bottom: 20px;
}

@media (max-width: 576px) {

  .analytics-widgets {
    grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
  }

}

.analytics-widgets:last-child {
  margin-bottom: 40px;
}

.analytics-widgets.analytics-widgets--l {
  grid-template-columns: repeat(auto-fit, minmax(600px, 1fr));
}

@media (max-width: 576px) {

  .analytics-widgets.analytics-widgets--l {
    grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
  }

}

.analytics-widget {
  height: 300px;
  display: flex;
  flex-flow: column;
  position: relative;
  background: var(--c-bg-content);
  border-radius: 5px;
  padding: 20px 30px;
}

.analytics-widget.analytics-widget--stats {
  display: flex;
  flex-flow: column;
  justify-content: space-between;
  height: 300px;
  padding: 20px 30px;
}

@media (max-width: 768px) {

  .analytics-widget.analytics-widget--stats {
    height: 370px;
  }

}

@media (max-width: 576px) {

  .analytics-widget.analytics-widget--stats {
    height: 320px;
  }

}

.analytics-widget-title {
  font-size: 14px;
  margin-bottom: 0px;
  margin-top: 0px;
  line-height: 140%;
  flex: 1;
  color: var(--c-emp);
}

.analytics-widget-title:first-letter {
  text-transform: capitalize;
}

.analytics-widget-header {
  display: flex;
  align-items: space-between;
  margin-bottom: 10px;
  color: var(--c-text);
}

.analytics-label {
  line-height: 160%;
  margin: 0;
  padding: 10px 20px;
  margin-bottom: 20px;
  font-size: 14px;
  border-radius: 5px;
  display: inline-flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.chart-wrapper {
  position: relative;
  width: 100%;
  flex: 1;
  align-items: center;
  justify-content: center;
  display: flex;
}

.stats-change {
  display: flex;
}

.analytics-widget-digits {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--c-emper);
}

.trend-chart-svg {
  overflow: visible;
}

.a2-section {
  display: flex;
  flex-flow: column;
  margin-bottom: 50px;
}

.a2-section__header {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 20px;
  display: flex;
}

.a2-section__header__content {
  background: var(--c-bg-hl);
  padding: 20px;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 56px;
}

.a2-section__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(440px, 1fr));
  grid-gap: 30px;
}

@media (max-width: 576px) {

  .a2-section__grid {
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  }

}

.a2-section__grid.a2-section__grid--sm {
  grid-template-columns: repeat(auto-fit, minmax(370px, 1fr));
  grid-gap: 30px;
}

.a2-section__grid.a2-section__grid--sm .a2-section__chart {
  height: 300px;
}

.a2-section__grid__item.a2-section__grid__item--lg {
  grid-column: span 1;
}

.a2-section__chart {
  padding: 30px;
  border-radius: 5px;
  background: var(--c-bg-content);
  display: flex;
  flex-flow: column;
}

.a2-section__chart__title {
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  width: 100%;
}

.a2-section__chart__title-icon {
  width: 35px;
  justify-content: center;
  height: 35px;
  margin-right: 10px;
  align-items: center;
  font-size: 16px;
  border-radius: 50%;
  display: flex;
  background: hsla(159.18367, 62.02532%, 56.47059%, 1.0);
  color: hsla(159.18367, 62.02532%, 36.47059%, 1.0);
}

.a2-section__chart__title-icon.a2-section__chart__title-icon--peach {
  color: #ff8b6a;
  background: #ffd6c2;
}

.a2-section__chart__title-icon.a2-section__chart__title-icon--silver {
  color: hsla(190.12987, 42.541435%, 54.509804%, 1.0);
  background: hsla(190.12987, 42.541435%, 74.5098%, 1.0);
}

.a2-section__chart__title-icon.a2-section__chart__title-icon--yellow {
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0);
  background: hsla(35.844154, 93.902435%, 77.84314%, 1.0);
}

.a2-section__chart__title-icon.a2-section__chart__title-icon--primary {
  color: hsla(209.09091, 25.19084%, 15.686275%, 1.0);
  background: hsla(209.09091, 25.19084%, 85.68627%, 1.0);
}

.a2-section__chart__title-icon.a2-section__chart__title-icon--purple {
  color: hsla(264.3243, 100%, 93.72549%, 1.0);
  background: hsla(264.3243, 100%, 53.72549%, 1.0);
}

.a2-section__chart__title-text {
  color: var(--c-text);
  font-weight: 700;
  font-size: 16px;
}

.a2-section__chart__content {
  height: 100%;
  display: flex;
  flex-flow: column;
  justify-content: center;
  margin-bottom: 30px;
}

.lc__label {
  font-size: 12px;
  fill: var(--c-bg-hl-emper);
  opacity: 100%;
}

.lc__gline {
  stroke: var(--c-bg-hl-emp);
}

.opportunities {
  overflow: auto;
  flex: 1;
  max-height: 100%;
}

.stages {
  display: flex;
  max-height: 100%;
  height: 100%;
  overflow-y: hidden;
}

.stage {
  flex-flow: column;
  width: 280px;
  height: 100%;
  margin-right: 20px;
  padding: 10px;
  flex-shrink: 0;
  min-height: 600px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
  max-height: 100%;
}

.stage:last-child {
  margin-right: 0;
}

.stage-head {
  flex-flow: column;
  justify-content: space-between;
  margin: -10px -10px 10px -10px;
  text-transform: capitalize;
  align-items: flex-start;
  padding: 10px;
  font-weight: 500;
  border-radius: 5px 5px 0 0;
  display: flex;
  background: var(--c-bg-hl-emp);
  color: var(--c-text);
}

.stage-head-section {
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 10px;
}

.stage-head-section__title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  margin-right: 10px;
  flex: 1;
}

.stage-values {
  display: flex;
  width: 100%;
  flex-flow: column;
  align-items: flex-start;
  font-size: 12px;
  text-transform: uppercase;
  color: var(--c-secondary);
}

.stage-value {
  color: var(--c-secondary);
}

.stage-count {
  background: var(--c-backdrop);
  color: var(--c-emp);
  padding: 2px 5px;
  font-size: 12px;
  border-radius: 2px;
}

.stage-divider {
  width: 100%;
  border-top: 1px solid var(--c-secondary);
  opacity: 0.2;
  margin-bottom: 5px;
  margin-top: 5px;
}

.stage-empty {
  color: var(--c-text);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  flex-flow: column;
}

.stage-spacer {
  height: 90px;
}

.add-stage-btn {
  width: 100%;
  justify-content: center;
  text-transform: uppercase;
  align-items: center;
  padding: 10px;
  cursor: pointer;
  font-weight: 700;
  text-decoration: none;
  font-size: 12px;
  display: flex;
  background: var(--c-bg-hl-less);
  color: var(--c-text);
}

.opportunity {
  flex-flow: column;
  height: 90px;
  padding: 15px;
  position: relative;
  margin-bottom: 5px;
  cursor: grab;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-light);
  padding-left: 25px;
}

.opportunity.opportunity--lost {
  opacity: 0.5;
}

.opportunity-draggable {
  position: absolute;
  top: 33px;
  left: 5px;
  color: var(--c-bg-hl-emper);
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.opportunity-top {
  display: flex;
  align-items: center;
  flex: 1;
  color: var(--c-text);
  font-weight: 500;
}

.opportunity-name {
  text-decoration: none;
  color: var(--c-emp);
  width: 210px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.opportunity-company {
  white-space: nowrap;
  margin-top: 2px;
  text-overflow: ellipsis;
  font-weight: 400;
  text-decoration: none;
  overflow: hidden;
  font-size: 12px;
  color: var(--c-text);
  opacity: 0.6;
}

.opportunity-action {
  color: var(--c-bg-hl-emper);
  transition: all .2s ease;
  cursor: pointer;
}

.opportunity-action.opportunity-action--success:hover {
  color: #2dc08d;
}

.opportunity-action:hover {
  color: #fb5e48;
}

.opportunity-footer {
  display: flex;
  font-size: 12px;
  justify-content: space-between;
}

.opportunity-footer-item {
  display: flex;
}

.opportunity-label {
  justify-content: center;
  text-transform: uppercase;
  align-items: center;
  padding: 2px 5px;
  font-weight: 700;
  font-size: 10px;
  border-radius: 2px;
  display: flex;
  background: var(--c-bg-hl-emp);
  color: var(--c-text);
}

.opportunity-label.opportunity-label--interested {
  background: #437c9e;
  color: #fff;
}

.opportunity-label.opportunity-label--demo {
  background: #ff8b6a;
  color: #fff;
}

.opportunity-label.opportunity-label--proposal {
  background: #fb5e48;
  color: #fff;
}

.opportunity-label.opportunity-label--deal {
  background: #2dc08d;
  color: #fff;
}

.filters.filters--opportunities {
  display: grid;
  grid-template-columns: 2fr 120px 175px auto auto;
  grid-gap: 10px;
}

@media (max-width: 1200px) {

  .filters.filters--opportunities {
    grid-template-columns: 2fr 120px 175px auto;
  }

}

@media (max-width: 576px) {

  .filters.filters--opportunities {
    grid-template-columns: 1fr;
  }

}

.pipeline-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
}

.pipeline-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 400px;
}

@media (max-width: 768px) {

  .pipeline-name {
    max-width: 300px;
  }

}

@media (max-width: 576px) {

  .pipeline-name {
    max-width: 200px;
  }

}

.pipeline-edit-btn {
  font-size: 12px;
  color: var(--c-text);
  text-decoration: none;
  margin-right: 10px;
}

.pipeline-edit-btn:hover {
  color: var(--c-emp);
}

.contact-opportunities {
  display: flex;
  flex-shrink: 0;
  width: 100%;
  flex-flow: column;
  padding-bottom: 20px;
}

.contact-opportunity {
  display: grid;
  grid-template-columns: 20px 1fr 45px;
  grid-gap: 20px;
  background: var(--c-bg-hl);
  border-radius: 5px;
  margin-bottom: 10px;
  padding: 10px;
  align-items: center;
}

.contact-opportunity.contact-opportunity--muted {
  opacity: 0.5;
}

.contact-opportunity-title {
  font-weight: 500;
  margin-bottom: 2px;
  color: var(--c-emp);
  width: 320px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (max-width: 1600px) {

  .contact-opportunity-title {
    width: 160px;
  }

}

@media (max-width: 1200px) {

  .contact-opportunity-title {
    width: 100px;
  }

}

@media (max-width: 992px) {

  .contact-opportunity-title {
    width: 200px;
  }

}

@media (max-width: 768px) {

  .contact-opportunity-title {
    width: 220px;
  }

}

@media (max-width: 576px) {

  .contact-opportunity-title {
    width: 200px;
  }

}

.contact-opportunity-new {
  font-size: 12px;
  display: flex;
  justify-content: flex-end;
  padding-right: 3px;
  cursor: pointer;
}

.contact-opportunity {
  font-size: 12px;
  color: var(--c-emp);
  background: var(--c-bg-hl);
  padding: 10px;
  border-radius: 5px;
}

.contact-opportunity-value {
  display: flex;
  align-items: center;
}

.contact-opportunity-nav {
  color: var(--c-bg-hl-emper);
  cursor: pointer;
  font-size: 12px;
  padding-right: 5px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.contact-opportunity-nav .contact-opportunity-nav__btn:hover {
  color: var(--c-bg-hl-empest);
}

.contact-opportunity-nav .contact-opportunity-nav__btn.contact-opportunity-nav__btn--success:hover {
  color: #2dc08d;
}

.contact-opportunity-nav .contact-opportunity-nav__btn.contact-opportunity-nav__btn--danger:hover {
  color: #fb5e48;
}

.contact-opportunity-nav .contact-opportunity-nav__btn.contact-opportunity-nav__btn--warning:hover {
  color: #fabc60;
}

.contact-opportunity-status {
  opacity: 0.7;
  display: flex;
  align-items: center;
  margin-left: 5px;
}

.contact-opportunities__header {
  display: grid;
  grid-template-columns: 20px 1fr 65.8px;
  grid-gap: 10px;
  margin-bottom: 10px;
}

.bar-chart {
  display: grid;
  grid-auto-columns: minmax(0, 1fr);
  grid-auto-flow: column;
  grid-gap: 10px;
  height: 169px;
  align-items: flex-end;
}

.bar-chart-bar-container {
  display: flex;
  height: 200px;
  flex-flow: column;
  justify-content: flex-end;
  overflow: hidden;
}

.bar-chart-bar-container:nth-child(1n) .bar-chart__label {
  border-color: #437c9e;
}

.bar-chart-bar-container:nth-child(1n) .bar-chart__bar {
  background: #437c9e;
}

.bar-chart-bar-container:nth-child(2n) .bar-chart__label {
  border-color: #ff8b6a;
}

.bar-chart-bar-container:nth-child(2n) .bar-chart__bar {
  background: #ff8b6a;
}

.bar-chart-bar-container:nth-child(3n) .bar-chart__label {
  border-color: #fb5e48;
}

.bar-chart-bar-container:nth-child(3n) .bar-chart__bar {
  background: #fb5e48;
}

.bar-chart-bar-container:nth-child(4n) .bar-chart__label {
  border-color: #2dc08d;
}

.bar-chart-bar-container:nth-child(4n) .bar-chart__bar {
  background: #2dc08d;
}

.bar-chart__label {
  border-left: 4px solid;
  padding-left: 10px;
  margin-bottom: 20px;
  color: var(--c-emp);
  font-weight: 700;
}

@media (max-width: 576px) {

  .bar-chart__label {
    max-width: 90px;
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    height: 50px;
  }

}

.bar-chart__label-text {
  font-size: 12px;
  text-transform: uppercase;
  font-weight: 700;
  color: var(--c-text);
  max-width: 100px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.bar-chart__bar {
  width: 100%;
  border-radius: 5px 5px 0px 0px;
  background: #7b6737;
}

.stacked-bars {
  display: flex;
  height: 100px;
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
}

.stacked-bars__bar {
  background: #437c9e;
}

.stacked-bars__bar:nth-child(1n) {
  background: #437c9e;
}

.stacked-bars__bar:nth-child(2n) {
  background: #ff8b6a;
}

.stacked-bars__bar:nth-child(3n) {
  background: #fb5e48;
}

.stacked-bars__bar:nth-child(4n) {
  background: #2dc08d;
}

.stacked-bars__bar.stacked-bars__bar--alt:nth-child(1n) {
  background: #003f5c;
}

.stacked-bars__bar.stacked-bars__bar--alt:nth-child(2n) {
  background: #58508d;
}

.stacked-bars__bar.stacked-bars__bar--alt:nth-child(3n) {
  background: #ff6361;
}

.stacked-bars__bar.stacked-bars__bar--alt:nth-child(4n) {
  background: #ffa600;
}

.stacked-bars-labels {
  display: flex;
  margin-bottom: 30px;
  flex-wrap: wrap;
}

.stacked-bars__label {
  flex-flow: column;
  min-width: 100px;
  border-left: 4px solid;
  margin-right: 20px;
  margin-bottom: 10px;
  font-weight: 700;
  font-size: 12px;
  display: flex;
  padding-left: 10px;
}

.stacked-bars__label:nth-child(1n) {
  border-color: #437c9e;
}

.stacked-bars__label:nth-child(2n) {
  border-color: #ff8b6a;
}

.stacked-bars__label:nth-child(3n) {
  border-color: #fb5e48;
}

.stacked-bars__label:nth-child(4n) {
  border-color: #2dc08d;
}

.stacked-bars__label.stacked-bars__label--alt:nth-child(1n) {
  border-color: #003f5c;
}

.stacked-bars__label.stacked-bars__label--alt:nth-child(2n) {
  border-color: #58508d;
}

.stacked-bars__label.stacked-bars__label--alt:nth-child(3n) {
  border-color: #ff6361;
}

.stacked-bars__label.stacked-bars__label--alt:nth-child(4n) {
  border-color: #ffa600;
}

.stacked-bars__label-text {
  text-transform: uppercase;
  color: var(--c-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 80px;
  margin-right: 10px;
}

.stacked-bars__label-value {
  color: var(--c-emp);
}

.admin-users {
  display: flex;
  flex-flow: column;
  font-size: 14px;
}

.admin-users__user {
  display: grid;
  grid-template-columns: 50px 50px 1fr 1fr 100px 120px 120px 100px;
  margin-bottom: 10px;
  background: var(--c-bg-hl);
  padding: 20px;
  border-radius: 5px;
  color: var(--c-text);
  align-items: center;
}

@media (max-width: 1200px) {

  .admin-users__user {
    grid-template-columns: auto;
  }

}

.admin-demos {
  display: flex;
  flex-flow: column;
  font-size: 14px;
}

admin-demos__demo {
  display: grid;
  grid-template-columns: 40px 3fr auto;
  margin-bottom: 10px;
  background: #fff;
  padding: 20px;
  border-radius: 5px;
  color: #111F2C;
  align-items: center;
}

.stages-dnd {
  display: flex;
  flex-flow: column;
}

.stage-dnd {
  justify-content: space-between;
  height: 50px;
  padding: 10px 10px 10px 10px;
  margin-bottom: 10px;
  cursor: grab;
  border-radius: 2px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.stage-dnd:last-child {
  margin-bottom: 0;
}

.stage-dnd.stage-dnd--deal {
  background: #2dc08d;
  color: #fff;
  cursor: not-allowed;
}

.stage-dnd.stage-dnd--deal .stage-dnd-icon {
  color: #fff;
  opacity: 0.5;
}

.stage-dnd.stage-dnd--deal .stage-dnd-edit {
  color: #fff;
  opacity: 0.5;
}

.stage-dnd.stage-dnd--deal .stage-dnd-edit:hover {
  opacity: 1;
}

.stage-dnd-section {
  display: flex;
  align-items: center;
  justify-content: center;
}

.stage-dnd-icon {
  color: var(--c-bg-hl-emper);
  margin-right: 20px;
  width: 10px;
}

.stage-dnd-name {
  text-transform: capitalize;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
}

.stage-dnd-name-icon {
  width: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
}

.stage-dnd-delete {
  color: #fb5e48;
  opacity: 0.5;
  margin-right: 10px;
}

.stage-dnd-btn {
  font-size: 14px;
  cursor: pointer;
}

.stage-dnd-btn:hover {
  opacity: 1;
}

.stage-dnd-edit {
  color: var(--c-bg-hl-emper);
}

.stage-dnd-edit:hover {
  color: var(--c-bg-hl-empest);
}

.stage-dnd-dropzone {
  height: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.stage-dnd-dropzone.stage-dnd-dropzone--active {
  background: var(--c-bg-hl-less);
  border-radius: 2px;
  height: 50px;
}

.searchable-select {
  position: relative;
  height: 45px;
}

.searchable-select__input {
  height: 100%;
}

.searchable-select__options {
  flex-flow: column;
  width: 100%;
  margin: 0;
  border: 2px solid var(--c-bg-hl);
  align-items: center;
  padding: 0;
  position: absolute;
  margin-top: -4px;
  border-top: none;
  list-style-type: none;
  z-index: 99;
  overflow: auto;
  border-radius: 0 0 5px 5px;
  display: none;
  background: var(--c-bg-hl);
  max-height: 200px;
}

.searchable-select__options.searchable-select__options--active {
  display: flex;
}

.searchable-select__option {
  background: var(--c-bg-hl);
  padding: 10px;
  display: flex;
  width: 100%;
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
}

.searchable-select__option:hover {
  background: var(--c-bg-hl-emp);
}

.searchable-select__option.searchable-select__option--selected {
  background: var(--c-bg-hl-emper);
}

.searchable-select__option.searchable-select__option--rich {
  display: ;
}

.pretty-select {
  position: relative;
  height: 45px;
  background: var(--c-bg-hl);
  border-radius: 5px;
}

.pretty-select.pretty-select--inline {
  color: var(--c-bg-hl);
  height: 25px;
}

.pretty-select__input {
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--c-text);
  font-size: 14px;
}

.pretty-select__input.pretty-select__input--present {
  color: var(--c-text);
}

.pretty-select__value {
  padding: 0 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pretty-select__options {
  flex-flow: column;
  width: 100%;
  margin: 0;
  border: 2px solid var(--c-bg-hl);
  align-items: center;
  padding: 0;
  position: absolute;
  margin-top: -4px;
  border-top: none;
  list-style-type: none;
  z-index: 9999;
  overflow: auto;
  border-radius: 0 0 5px 5px;
  display: none;
  background: var(--c-bg-hl);
  max-height: 200px;
}

.pretty-select__options.pretty-select__options--active {
  display: flex;
}

.pretty-select__options.pretty-select__options--inline {
  border: 1px solid var(--c-bg-hl);
  border-top: none;
  margin-top: -2px;
}

.pretty-select__control {
  font-size: 12px;
  color: #7F90A0;
  padding: 0 10px;
  cursor: pointer;
}

.pretty-select__control:hover {
  color: var(--c-emp);
}

.pretty-select__control.pretty-select__control--inline {
  color: var(--c-text);
  padding: 0 5px;
}

.pretty-select__control.pretty-select__control--inline:hover {
  color: var(--c-emp);
}

.pretty-select__option {
  display: flex;
  align-items: center;
  font-size: 12px;
  padding: 10px;
  width: 100%;
  cursor: pointer;
}

.pretty-select__option.pretty-select__option--selected {
  background: var(--c-bg-hl-emper);
}

.pretty-select__option:hover {
  background: var(--c-bg-hl-emp);
}

.pretty-select__option.pretty-select__option--inline {
  color: #7b6737;
  height: 25px;
}

.pretty-select__option.pretty-select__option--inline:hover {
  background: var(--c-bg-hl-emp);
}

.pretty-select__option.pretty-select__option--inline.pretty-select__option--selected {
  background: var(--c-bg-hl-emper);
}

.onboarding-checklist {
  padding: 0;
  list-style-type: none;
  margin: 0;
}

.onboarding-party-btn {

}

.onboarding-checklist-minimized {
  width: 50px;
  right: 10px;
  justify-content: center;
  height: 50px;
  align-items: center;
  position: fixed;
  z-index: 99;
  cursor: pointer;
  border-radius: 50%;
  display: flex;
  bottom: 10px;
  background: var(--c-bg-hl);
}

.onboarding-checklist-minimized.onboarding-checklist-minimized--alt {
  background: var(--c-bg-hl-emp);
  bottom: 90px;
}

.onboarding-checklist__item {
  margin-bottom: 5px;
  display: flex;
  align-items: center;
}

.onboarding-checklist__item:last-child {
  margin-bottom: 0;
}

.onboarding-checklist__item.onboarding-checklist__item--party .onboarding-checklist__item__icon.onboarding-checklist__item__icon--completed {
  color: rgba(255, 255, 255, 0.7);
}

.onboarding-checklist__item.onboarding-checklist__item--party .onboarding-checklist__item__text.onboarding-checklist__item__text--completed {
  color: rgba(255, 255, 255, 1);
}

.onboarding-checklist__item__icon {
  color: var(--c-bg-hl);
  font-size: 22px;
  margin-right: 10px;
  cursor: not-allowed;
}

.onboarding-checklist__item__icon.onboarding-checklist__item__icon--completed {
  color: #2dc08d;
}

.onboarding-checklist__item__text {
  color: var(--c-text);
  font-weight: 500;
}

.onboarding-checklist__item__text.onboarding-checklist__item__text--completed {
  color: var(--c-text);
}

.tags-input-wrapper {
  width: 100%;
  overflow: hidden;
}

.tags-input {
  border: 2px solid var(--c-bg-hl);
  align-items: center;
  padding: 10px 10px 5px 10px;
  flex-wrap: wrap;
  min-height: 45px;
  overflow: hidden;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.tags-input.tags-input--inline {
  border: 1px solid var(--c-bg-hl);
  border-radius: 3px;
  min-height: 25px;
  padding: 5px 5px 0 5px;
  font-size: 12px;
}

.tags-input.tags-input--inline .tags-input__tag {
  display: inline-flex;
  flex-shrink: 0;
  margin-right: 5px;
  background: var(--c-bg);
  color: var(--c-text);
  padding: 3px 5px;
  font-size: 12px;
}

.tags-input.tags-input--inline .tags-input__tag__control {
  color: var(--c-emp);
}

.tags-input.tags-input--inline .tags-input__draft {
  height: 18px;
  font-size: 12px;
  margin-bottom: 3px;
  flex: 1;
}

.tags-input__tags {
  display: flex;
  flex-wrap: wrap;
}

.tags-input__tag {
  line-height: 100%;
  justify-content: center;
  margin-right: 5px;
  align-items: center;
  padding: 5px 10px;
  flex-shrink: 0;
  margin-bottom: 5px;
  font-weight: 500;
  border-radius: 3px;
  display: inline-flex;
  background: var(--c-bg);
  color: var(--c-text);
}

.tags-input__tag__text {
  margin-right: 5px;
}

.tags-input__tag__control {
  cursor: pointer;
  color: var(--c-emp);
}

.tags-input__draft {
  margin: 0;
  border: none;
  padding: 0;
  flex-shrink: 0;
  margin-bottom: 5px;
  font-size: 14px;
  display: inline-flex;
  flex: 1;
  background: inherit;
  color: var(--c-text);
}

.tags-input__draft::placeholder, .tags-input__draft::-moz-placeholder, .tags-input__draft:-ms-input-placeholder, .tags-input__draft::-webkit-input-placeholder {
  color: #7F90A0;
  opacity: 1;
}

.tags-input__suggestions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 10px 0;
  min-height: 45px;
  margin-top: -10px;
}

.tags-input__suggestions__item {
  line-height: 100%;
  justify-content: center;
  margin-right: 10px;
  align-items: center;
  padding: 10px 12px;
  margin-top: 10px;
  cursor: pointer;
  font-weight: 500;
  font-size: 12px;
  border-radius: 5px;
  display: flex;
  transition: all .2s ease;
  background: var(--c-bg-hl);
  color: var(--c-emp);
}

.tags-input__suggestions__item:last-child {
  margin-right: 0;
}

.tags-input__suggestions__item:hover {
  background: var(--c-bg-hl-emp);
}

.tags-input__suggestions__item:hover .tags-input__suggestions__item__icon {
  opacity: 1;
}

.tags-input__suggestions__item.tags-input__suggestions__item--more {
  color: var(--c-emp);
}

.tags-input__suggestions__item__text {
  margin-right: 5px;
}

.tags-input__suggestions__item__count {
  margin-right: 5px;
  opacity: 0.5;
}

.tags-input__suggestions__item__icon {
  opacity: 0.7;
  transition: all .2s ease;
}

.tags-input-wrapper.tags-input-wrapper--inline .tags-input__suggestions__item {
  background: var(--c-bg-hl);
  cursor: pointer;
}

.tags-input-wrapper.tags-input-wrapper--inline .tags-input__suggestions__item:last-child {
  margin-right: 0;
}

.tags-input-wrapper.tags-input-wrapper--inline .tags-input__suggestions__item:hover {
  background: var(--c-bg-hl-emp);
}

.tags-input-wrapper.tags-input-wrapper--inline .tags-input__suggestions__item__text {
  margin-right: 5px;
}

.tags-input-wrapper.tags-input-wrapper--inline .tags-input__suggestions__item__count {
  margin-right: 5px;
  opacity: 0.5;
}

.et-layout {
  display: flex;
  padding: 10px;
  height: 101%;
}

.et-content {
  display: flex;
  width: 100%;
  overflow: auto;
  padding-bottom: 20px;
  scrollbar-width: none;
}

.et-content.et-content--empty {
  padding: 40px;
  padding-top: 10%;
}

.et-content::-webkit-scrollbar {
  display: none !important;
}

.et-sb-container {
  max-width: 380px;
  width: 100%;
  margin-right: 20px;
  position: relative;
}

@media (max-width: 1200px) {

  .et-sb-container {
    max-width: 100%;
    margin-right: 0;
  }

}

.et-sb-container:before {
  content: '';
  width: 103%;
  height: 140px;
  position: absolute;
  left: -10px;
  bottom: -40px;
  pointer-events: none;
  background: linear-gradient(180deg, transparent 5px,var(--c-bg-hl));
}

@media (max-width: 1200px) {

  .et-sb-container:before {
    display: none;
  }

}

.et-sb {
  border-right: 1px solid var(--c-bg-hl);
  padding: 10px;
  padding-top: 0;
  height: 100%;
  display: flex;
  flex-flow: column;
  width: 100%;
}

@media (max-width: 1200px) {

  .et-sb {
    border-right: none;
    padding: 0;
  }

}

.et-sb__header {
  margin-bottom: 20px;
  padding-bottom: 20px;
  padding-left: 10px;
  border-bottom: 1px solid var(--c-bg-hl);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.et-sb__header__title {
  font-weight: 700;
  font-size: 22px;
  display: flex;
  text-decoration: none;
  color: var(--c-text);
}

.et-sb__items {
  overflow: auto;
  display: flex;
  flex: 1;
  flex-flow: column;
  height: 100%;
}

.et-sb__items::-webkit-scrollbar {
  display: none !important;
}

.et-sb__item {
  padding: 10px;
  min-height: 113px;
  display: flex;
  flex-flow: column;
  text-decoration: none;
  color: var(--c-text);
  border: 1px solid transparent;
  border-bottom: 1px solid var(--c-bg-hl);
}

.et-sb__item:last-child {
  border-bottom: none;
}

.et-sb__item.et-sb__item--active {
  background: var(--c-bg-hl);
  border-radius: 5px;
  border: 1px solid transparent;
}

.et-sb__item.et-sb__item--active .et-sb__item__label {
  background: var(--c-bg-hl-emp);
  color: var(--c-bg-hl-empest);
}

.et-sb__item.et-sb__item--active .et-sb__item__label.et-sb__item__label--secondary {
  background: inherit;
}

.et-sb__item:has(+ .et-sb__item.et-sb__item--active) {
  border-bottom: 1px solid transparent;
}

.et-sb__item__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 30px;
}

.et-sb__item__label {
  text-transform: capitalize;
  padding: 5px;
  margin-bottom: 10px;
  cursor: pointer;
  font-weight: 500;
  font-size: 12px;
  border-radius: 5px;
  background: var(--c-bg-hl);
  color: var(--c-bg-hl-emper);
  opacity: 0.8;
}

.et-sb__item__label:hover {
  opacity: 1.0;
}

.et-sb__item__label.et-sb__item__label--secondary {
  background: inherit;
}

.et-sb__item__name {
  font-weight: 700;
  color: var(--c-text);
  text-decoration: none;
  flex: 1;
  padding-bottom: 10px;
}

.et-sb__item__subject {
  font-weight: 500;
  padding-bottom: 5px;
  text-decoration: none;
  color: var(--c-text);
}

.et-sb__item__body {
  font-size: 14px;
  color: var(--c-secondary);
  text-decoration: none;
  display: flex;
  flex: 1;
  align-items: center;
}

.et-back {
  text-decoration: none;
  color: var(--c-text);
  margin-bottom: 20px;
  background: var(--c-bg-hl);
  display: inline-flex;
  width: 30px;
}

.et-divider {
  border-bottom: 1px solid var(--c-bg-hl);
  margin-top: 20px;
  margin-bottom: 20px;
}

.automation-rows {

}

.automation-row {
  display: grid;
  grid-template-columns: 3fr 2fr 2fr 2fr 2fr 2fr 90px;
  grid-gap: 5px;
  background: var(--c-bg-content);
  padding: 20px;
  align-items: center;
  margin-bottom: 10px;
  border-radius: 5px;
}

.automation-row.automation-row--header {
  background: inherit;
}

@media (max-width: 576px) {

  .automation-row {
    grid-template-columns: 2fr 1fr 90px;
  }

}

.automation-col {
  overflow: hidden;
  display: flex;
  align-items: center;
}

.automation-col.automation-col--header {
  font-weight: 700;
  color: var(--c-text);
  font-size: 14px;
}

.automation-col.automation-col--center {
  justify-content: center;
}

.automation-pill {
  background: #ffd6c2;
  color: #ff8b6a;
  border-radius: 5px;
  padding: 5px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
}

@media (max-width: 1200px) {

  .automation-pill {
    width: 40px;
    height: 40px;
    padding: 0;
  }

}

.automation-pill.automation-pill--red {
  background: #ffabab;
  color: #d45454;
}

.automation-pill.automation-pill--green {
  background: #86e4b7;
  color: #41987a;
}

.automation-pill.automation-pill--blue {
  background: #93c2f7;
  color: #437c9e;
}

.automation-pill.automation-pill--purple {
  background: #e1ccec;
  color: #886aaa;
}

.automation-action {
  opacity: 0.8;
  cursor: pointer;
  color: var(--c-bg-hl-empest);
}

.automation-action:hover {
  opacity: 1;
}

.automation-action:last-child {
  margin-right: 0;
}

.step-info {
  display: flex;
  justify-content: space-between;
}

.step-info-icon {
  margin-right: 10px;
}

.step-info-icon.step-info-icon--wait {
  color: #f4a8a8;
}

.step-info-icon.step-info-icon--archive {
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0);
}

.step-info-icon.step-info-icon--status {
  color: hsla(190.12987, 42.541435%, 54.509804%, 1.0);
}

.step-info-icon.step-info-icon--email {
  color: #98d2af;
}

.step-info-text {
  color: var(--c-text);
  line-height: 160%;
}

.step-mover {
  position: absolute;
  right: -35px;
  top: 5px;
  bottom: 0px;
}

.step-move {
  color: var(--c-bg-hl-emp);
  font-size: 20px;
  cursor: pointer;
}

.step-move:hover {
  color: var(--c-bg-hl-emper);
}

.step-group {
  background: var(--c-bg-hl);
  padding: 20px;
  border-radius: 5px;
  margin-bottom: 10px;
  position: relative;
}

.step-group.step-group--wait {
  border-top: 7px solid #f4a8a8;
}

.step-group.step-group--archive {
  border-top: 7px solid hsla(35.844154, 93.902435%, 82.84314%, 1.0);
}

.step-group.step-group--other {
  border-top: 7px solid hsla(190.12987, 42.541435%, 79.5098%, 1.0);
}

.step-group.step-group--email {
  border-top: 7px solid #98d2af;
}

.automations-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  margin-top: 100px;
  text-align: center;
}

.automations-empty__icon {
  font-size: 72px;
  color: var(--c-backdrop);
  margin-bottom: 20px;
}

.automations-empty__title {
  font-size: 16px;
  font-weight: 700;
  margin-bottom: 10px;
}

.automations-empty__text {
  font-size: 16px;
  margin-bottom: 20px;
  line-height: 140%;
  color: var(--c-text);
}

.automation__edit {
  font-size: 12px;
  text-decoration: none;
  margin-right: 10px;
  cursor: pointer;
}

.automation__edit:hover {
  color: var(--c-emper);
}

.automation__edit.automation__edit--danger:hover {
  color: #fb5e48;
}

.automation__edit.automation__edit--warning:hover {
  color: #fabc60;
}

.automation__edit.automation__edit--success:hover {
  color: #2dc08d;
}

.automation-info {
  color: #5E7182;
}

.automation-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: 20px;
}

.automation-stat {
  background: var(--c-bg-content);
  border-radius: 5px;
  display: flex;
  flex-flow: column;
  justify-content: center;
  padding: 30px 30px 40px 30px;
}

.automation-stat__head {
  display: flex;
  align-items: center;
}

.automation-stat__icon {
  width: 30px;
  justify-content: center;
  height: 30px;
  margin-right: 20px;
  align-items: center;
  font-size: 12px;
  border-radius: 50%;
  display: flex;
  background: #86e4b7;
  color: #41987a;
}

.automation-stat__icon.automation-stat__icon--completed {
  color: #437c9e;
  background: #93c2f7;
}

.automation-stat__icon.automation-stat__icon--replied {
  color: #886aaa;
  background: #e1ccec;
}

.automation-stat__icon.automation-stat__icon--cancelled {
  color: #ff8b6a;
  background: #ffd6c2;
}

.automation-stat__icon.automation-stat__icon--failed {
  color: #d45454;
  background: #ffabab;
}

.automation-stat__title {
  font-weight: 700;
}

.automation-stat__text {
  line-height: 160%;
  font-size: 14px;
}

.automation-stat__digit {
  font-weight: 700;
  font-size: 22px;
}

.automation-label {
  line-height: 160%;
  margin: 0;
  padding: 10px 20px;
  margin-bottom: 20px;
  font-weight: 500;
  font-size: 14px;
  border-radius: 5px;
  display: inline-flex;
  background: var(--c-bg-hl);
}

.automation-contacts {
  min-height: 340px;
}

.automation-contacts__row {
  display: grid;
  grid-template-columns: 3fr 2fr 2fr 2fr 2fr 2fr 2fr 40px;
  grid-gap: 10px;
  background: var(--c-bg-content);
  margin-bottom: 10px;
  padding: 10px;
  border-radius: 5px;
  font-size: 14px;
}

@media (max-width: 1200px) {

  .automation-contacts__row {
    grid-template-columns: 3fr 1fr 2fr 2fr;
  }

}

@media (max-width: 576px) {

  .automation-contacts__row {
    grid-template-columns: 3fr 1.5fr 2fr;
  }

}

.automation-contacts__row.automation-contacts__row--header {
  font-weight: 700;
  color: var(--c-emp);
  background: inherit;
}

.automation-contacts__row div {
  display: flex;
  align-items: center;
  overflow: hidden;
}

.automation-contact__name {
  display: grid;
  grid-template-columns: 20px 1fr;
  grid-gap: 20px;
  align-items: center;
}

.automation-contact__status {
  text-transform: capitalize;
  font-weight: 500;
}

.automation-contact__status.automation-contact__status--active {
  color: var(--c-emp);
}

.automation-contact__status.automation-contact__status--completed {
  color: var(--c-bg-hl-emper);
}

.automation-contact__status.automation-contact__status--replied {
  color: #886aaa;
}

.automation-contact__status.automation-contact__status--cancelled {
  color: #ff8b6a;
}

.automation-contact__status.automation-contact__status--failed {
  color: #d45454;
}

.automation-performance {
  padding: 30px 20px;
  border-radius: 5px;
  background: var(--c-bg-content);
  margin-bottom: 40px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
}

@media (max-width: 576px) {

  .automation-performance {
    grid-template-columns: 1fr;
  }

}

.automation-performance__stat {
  display: flex;
  flex-flow: column;
  align-items: center;
  justify-content: center;
  border-right: 2px solid var(--c-bg-hl);
}

.automation-performance__stat:last-child {
  border-right: none;
}

@media (max-width: 576px) {

  .automation-performance__stat {
    border-right: none;
    margin-bottom: 20px;
  }

}

.automation-performance__stat__digit {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 10px;
}

.automation__contact-filters {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) 140px 160px;
  grid-gap: 10px;
}

@media (max-width: 1600px) {

  .automation__contact-filters {
    grid-template-columns: minmax(220px, 1fr) 140px 160px;
  }

}

@media (max-width: 768px) {

  .automation__contact-filters {
    grid-template-columns: 1fr;
  }

}

.contact-automations {
  margin-bottom: 20px;
}

.contact-automations__header {
  display: grid;
  grid-template-columns: 20px 1fr 65.8px;
  grid-gap: 10px;
  margin-bottom: 10px;
  margin-right: 3px;
}

.contact-automation {
  display: grid;
  grid-template-columns: 30px 1fr 20px;
  grid-gap: 20px;
  background: var(--c-bg-hl);
  border-radius: 5px;
  margin-bottom: 10px;
  padding: 10px;
}

.contact-automation.contact-automation--muted {
  opacity: 0.5;
}

.contact-automation__status {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.contact-automation__notice {
  width: 15px;
  right: -6px;
  top: -3px;
  justify-content: center;
  height: 15px;
  align-items: center;
  padding: 2px;
  position: absolute;
  font-size: 8px;
  border-radius: 50%;
  display: flex;
  background: hsla(35.844154, 93.902435%, 82.84314%, 1.0);
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0);
}

.contact-automation__status-icon {
  display: flex;
  width: 30px;
  height: 30px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 12px;
}

.contact-automation__status-icon.contact-automation__status-icon--active {
  background: #86e4b7;
  color: #41987a;
}

.contact-automation__status-icon.contact-automation__status-icon--completed {
  background: #93c2f7;
  color: #437c9e;
}

.contact-automation__status-icon.contact-automation__status-icon--replied {
  background: #e1ccec;
  color: #886aaa;
}

.contact-automation__status-icon.contact-automation__status-icon--cancelled {
  background: #ffd6c2;
  color: #ff8b6a;
}

.contact-automation__status-icon.contact-automation__status-icon--failed {
  background: #ffabab;
  color: #d45454;
}

.contact-automation__info {
  display: flex;
  justify-content: center;
  flex-flow: column;
  font-size: 12px;
}

.contact-automation__name {
  font-weight: 500;
  color: var(--c-emp);
  margin-bottom: 2px;
}

.contact-automation__progress {
  color: var(--c-text);
}

.contact-automation__actions {
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-automation__cancel {
  color: #fb5e48;
  cursor: pointer;
  opacity: 0.6;
}

.contact-automation__cancel:hover {
  opacity: 1;
}

.contact-automation__replied {
  color: #2dc08d;
  cursor: pointer;
  opacity: 0.6;
}

.contact-automation__replied:hover {
  opacity: 1;
}

.contact-automation__btn {
  max-width: 215px;
  justify-content: center;
  height: 35px;
  text-transform: uppercase;
  align-items: center;
  padding: 0 !important;
  cursor: pointer;
  font-weight: 700;
  overflow: hidden;
  font-size: 12px;
  border-radius: 3px;
  display: flex;
  background: var(--c-backdrop) !important;
  color: var(--c-text) !important;
}

.contact-automation__btn.contact-automation__btn--lg {
  max-width: 176px;
  width: 176px !important;
  height: auto;
  text-transform: none;
  font-size: inherit;
}

.contact-automation__btn.contact-automation__btn--lg .contact-automation__btn__left {
  background: var(--c-bg-hl);
  padding-left: 20px;
  padding-right: 20px;
}

.contact-automation__btn.contact-automation__btn--lg .contact-automation__btn__left:hover {
  background: var(--c-bg-hl-emp) !important;
}

.contact-automation__btn.contact-automation__btn--lg .contact-automation__btn__right {
  background: var(--c-bg-hl-emp);
  padding-right: 20px;
  padding-left: 20px;
}

.contact-automation__btn.contact-automation__btn--lg .contact-automation__btn__right:hover {
  background: var(--c-bg-hl-emper) !important;
}

.contact-automation__btn__content {
  display: flex;
  height: 100%;
  flex: 1;
  align-items: center;
  justify-content: space-between;
}

.contact-automation__btn__left {
  display: flex;
  padding-right: 10px;
  padding-left: 10px;
  height: 100%;
  flex: 1;
  align-items: center;
}

.contact-automation__btn__left:hover {
  background: var(--c-backdrop-emp) !important;
}

.contact-automation__btn__right {
  display: flex;
  background: var(--c-bg-hl-emp);
  height: 100%;
  align-items: center;
  padding-right: 10px;
  padding-left: 10px;
}

.contact-automation__btn__right:hover {
  background: var(--c-backdrop-emp) !important;
}

.contact-attributes__row {
  display: grid;
  grid-template-columns: 20px 1fr 3fr;
  grid-gap: 10px;
  width: 100%;
  margin-bottom: 10px;
}

.contact-attributes__input-nav {
  color: #e7deca;
  cursor: pointer;
  font-size: 12px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.contact-attributes__input-nav:hover {
  color: #7b6737;
}

.contact-attributes__title {
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  color: var(--c-text);
  display: flex;
  align-items: center;
}

.contact-attributes__icon {
  color: var(--c-secondary);
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-attributes__label {
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  color: var(--c-text);
  display: flex;
  align-items: center;
}

.contact-attributes__text {
  color: var(--c-text);
  font-size: 12px;
  font-weight: 500;
}

.contact-attributes__text a {
  color: var(--c-text);
}

.contact-attributes__action {
  margin-left: 10px;
  font-size: 14px;
  color: var(--c-emp);
  cursor: pointer;
}

.contact-attributes__action:hover {
  color: var(--c-emper);
}

.bulk-actions {
  right: 0;
  justify-content: space-between;
  height: 60px;
  align-items: center;
  padding: 10px 30px;
  position: fixed;
  z-index: 9999;
  font-weight: 500;
  display: flex;
  bottom: 0;
  transition: all .2s ease-out;
  flex: 1;
  background: var(--c-bg-accent-less);
  color: #fff;
  left: 250px;
}

.bulk-actions.bulk-actions--collapsed-nav {
  left: 50px;
}

.bulk-actions.bulk-actions--hidden {
  transform: translateY(60px);
}

.bulk-actions__section {
  display: flex;
  align-items: center;
  justify-content: center;
}

.bulk-actions__hl {
  color: #fff;
}

.bulk-actions__muted {
  color: #fff;
  opacity: 0.5;
}

.bulk-actions__btn {
  background: var(--c-bg-accent);
  padding: 10px;
  border-radius: 5px;
  color: rgba(255, 255, 255, 0.85);
  cursor: pointer;
  display: flex;
  margin-right: 20px;
}

.bulk-actions__btn:last-child {
  margin-right: 0;
}

.bulk-actions__btn.bulk-actions__btn--disabled {
  opacity: 0.5;
}

.bulk-actions__btn.bulk-actions__btn--disabled:hover .bulk-actions__btn__icon {
  color: rgba(255, 255, 255, 0.425) !important;
}

.bulk-actions__btn:hover .bulk-actions__btn__icon--danger {
  color: #fb5e48;
}

.bulk-actions__btn:hover .bulk-actions__btn__icon--warning {
  color: hsla(35.844154, 93.902435%, 52.843136%, 1.0);
}

.bulk-actions__btn:hover .bulk-actions__btn__icon--info {
  color: #437c9e;
}

.bulk-actions__btn:hover .bulk-actions__btn__icon--peach {
  color: #ff8b6a;
}

.bulk-actions__btn:hover .bulk-actions__btn__icon--success {
  color: #2dc08d;
}

@media (max-width: 1600px) {

  .bulk-actions__btn {
    font-size: 12px;
    margin-right: 10px;
  }

}

.bulk-actions__btn__icon {
  color: #7F90A0;
  transition: color .2s ease;
}

.modals-drop {
  width: 100%;
  top: 0;
  justify-content: flex-start;
  height: 100%;
  align-items: flex-start;
  position: fixed;
  z-index: 2147483646;
  display: flex;
  background: hsla(210, 36%, 17%, 0.6);
  left: 0;
}

.modals {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal {
  flex-flow: column;
  width: 100%;
  max-width: 600px;
  justify-content: center;
  align-items: center;
  padding: 30px;
  position: relative;
  margin-top: 40px;
  min-height: 400px;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg);
}

.modal.modal--wide {
  max-width: 800px;
}

.modal.modal--nopad {
  padding: 0;
  overflow: hidden;
}

.modal.modal--tight {
  min-height: 0px;
}

.modal__close {
  width: 41px;
  right: 20px;
  top: 20px;
  justify-content: center;
  height: 41px;
  align-items: center;
  position: absolute;
  cursor: pointer;
  font-size: 16px;
  border-radius: 50%;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
  padding-top: 2px;
}

.modal__close:hover {
  background: var(--c-bg-hl-emp);
}

.cm-cards {
  display: flex;
  flex-flow: column;
  width: 100%;
}

.cm-card {
  display: flex;
  position: relative;
  flex-flow: column;
  width: 100%;
  background: var(--c-bg-hl);
  padding: 20px;
  border-radius: 5px;
  margin-bottom: 10px;
}

.cm-card:hover {
  background: var(--c-bg-hl-emp);
}

.cm-card__check {
  position: absolute;
  left: -10px;
  top: 0;
  bottom: 0;
  height: 22px;
  margin: auto;
  font-size: 22px;
  color: #2dc08d;
}

.cm-card__top {
  margin-bottom: 20px;
}

.cm-card__footer {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 10px;
}

.cm-card__info__label {
  text-transform: uppercase;
  font-size: 10px;
  font-weight: 700;
  margin-bottom: 5px;
}

.cm-card__info__text {
  text-transform: capitalize;
  font-size: 14px;
}

.popovers {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 2147483646;
  overflow: auto;
}

.popover {
  flex-flow: column;
  min-width: 220px;
  padding: 10px 10px;
  position: absolute;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  pointer-events: auto;
  background: var(--c-bg-hl);
}

.popover__title {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: var(--c-secondary);
}

.popover__pills {
  display: flex;
  margin-bottom: 10px;
  align-items: center;
  justify-content: center;
}

.popover__pill {
  display: flex;
  margin-right: 5px;
  font-size: 12px;
  background: var(--c-bg-hl-emp);
  padding: 5px 10px;
  border-radius: 20px;
  font-weight: 500;
  cursor: pointer;
}

.popover__pill:last-child {
  margin-right: 0;
}

.popover__pill:hover, .popover__pill.popover__pill--active {
  background: var(--c-bg-hl-emper);
}

.popover__triangle {
  left: 10px;
  top: -10px;
  font-size: 10px;
  position: absolute;
  color: var(--c-bg-hl);
}

.popover__content {

}

.popover__item {
  display: flex;
  cursor: pointer;
  padding: 10px 10px;
  border-radius: 5px;
  text-decoration: none;
  color: var(--c-text);
}

.popover__item:last-child {
  margin-bottom: 0px;
}

.popover__item:hover {
  background: var(--c-bg-hl-emp);
}

.popover__item.popover__item--disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.popover__item__icon {
  width: 30px;
}

.popover__item__text {
  font-weight: 500;
}

.flatpickr-calendar, flatpickr-calendar:before, flatpickr-calendar:after {
  background: var(--c-bg) !important;
}

.flatpickr-calendar, flatpickr-calendar:before, flatpickr-calendar:after {
  box-shadow: 1px 1px 2px var(--c-bg-hl-emper) !important;
  -webkit-box-shadow: 0px 2px 4px var(--c-backdrop) !important;
}

.popover__content .flatpickr-calendar, .popover__content flatpickr-calendar:before, .popover__content flatpickr-calendar:after {
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}

.flatpickr-day {
  color: var(--c-text) !important;
}

.flatpickr-current-month {
  color: var(--c-emp) !important;
}

.flatpickr-weekday {
  color: var(--c-emp) !important;
}

.flatpickr-next-month, .flatpickr-prev-month {
  color: var(--c-emp) !important;
  fill: var(--c-emp) !important;
}

.flatpickr-next-month:hover, .flatpickr-prev-month:hover {
  color: var(--c-emp) !important;
  fill: var(--c-emp) !important;
}

.flatpickr-next-month:hover {
  color: var(--c-emp) !important;
  fill: var(--c-emp) !important;
}

.flatpickr-day.selected {
  background: var(--c-bg-hl-emper) !important;
  border-color: var(--c-bg-hl-emper) !important;
}

.flatpickr-day:hover {
  background: var(--c-bg-hl) !important;
  border-color: var(--c-bg-hl) !important;
}

.flatpickr-day.today {
  border-color: #ff8b6a !important;
}

.flatpickr-day.inRange {
  background: var(--c-bg-hl-emp) !important;
  border-color: var(--c-bg-hl-emp) !important;
  box-shadow: var(--c-bg-hl-emp) 5px 0px 0px !important;
}

.flatpickr-day.startRange {
  background: var(--c-bg-hl-emp) !important;
  border-color: var(--c-bg-hl-emp) !important;
  box-shadow: var(--c-bg-hl-emp) 5px 0px 0px !important;
}

.flatpickr-day.endRange {
  background: var(--c-bg-hl-emp) !important;
  border-color: var(--c-bg-hl-emp) !important;
  box-shadow: var(--c-bg-hl-emp) 5px 0px 0px !important;
}

.ae-layout {
  display: flex;
  padding: 10px;
  height: 101%;
}

@media (max-width: 1200px) {

  .ae-layout {
    flex-flow: column;
    overflow-y: auto;
  }

}

.ae-layout::-webkit-scrollbar {
  display: none !important;
}

.ae-sb-container {
  max-width: 480px;
  width: 100%;
  margin-right: 20px;
  position: relative;
  overflow-y: auto;
  border-right: 1px solid var(--c-bg-hl);
}

@media (max-width: 1200px) {

  .ae-sb-container {
    max-width: 100%;
    margin-right: 0;
    overflow: visible;
  }

}

.ae-sb-container::-webkit-scrollbar {
  display: none !important;
}

.ae-sb {
  padding: 10px;
  padding-top: 0;
  height: 100%;
  display: flex;
  flex-flow: column;
  width: 100%;
}

@media (max-width: 1200px) {

  .ae-sb {
    border-right: none;
    padding: 0;
  }

}

.ae-sb__label {
  background: var(--c-bg-hl);
  color: var(--c-bg-hl-empest);
  font-size: 12px;
  font-weight: 500;
  text-transform: capitalize;
  display: flex;
  border-radius: 5px;
  padding: 5px;
}

.ae-sb__header {
  margin-bottom: 20px;
  padding-bottom: 20px;
  padding-left: 10px;
  border-bottom: 1px solid var(--c-bg-hl);
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.ae-sb__header__title {
  font-weight: 700;
  font-size: 22px;
  display: flex;
  text-decoration: none;
  color: var(--c-text);
}

.ae-sb__steps {
  padding-top: 20px;
  border-top: 1px solid var(--c-bg-hl);
}

.ae-sb__new-step {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 10px;
  border-radius: 5px;
  margin-bottom: 20px;
}

@media (max-width: 1200px) {

  .ae-sb__new-step {
    grid-template-columns: 1fr;
  }

}

.ae-sb__new-step__btn {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  padding: 10px 5px;
  cursor: pointer;
  font-weight: 500;
  border-radius: 5px;
  display: flex;
  background: var(--c-bg-hl);
}

.ae-sb__new-step__btn:hover {
  background: var(--c-bg-hl-emp);
}

.ae-sb__new-step__btn:hover .ae-sb__new-step__btn__icon {
  color: var(--c-bg-hl-empest);
}

.ae-sb__new-step__btn:hover .ae-sb__new-step__btn__label {
  color: var(--c-emp);
}

.ae-sb__new-step__btn.ae-sb__new-step__btn--disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.ae-sb__new-step__btn.ae-sb__new-step__btn--disabled:hover {
  background: var(--c-bg-hl);
}

.ae-sb__new-step__btn.ae-sb__new-step__btn--disabled:hover .ae-sb__new-step__btn__icon {
  color: var(--c-bg-hl-emper);
}

.ae-sb__new-step__btn__icon {
  margin-bottom: 7px;
  color: var(--c-bg-hl-emper);
  font-size: 16px;
}

.ae-sb__new-step__btn__label {
  font-size: 12px;
  color: var(--c-text);
}

.ae-step-container {
  display: grid;
  grid-gap: 10px;
  grid-template-columns: 1fr auto;
}

.ae-step-container.ae-step-container--init {
  grid-gap: 0px;
}

.ae-step__label {
  background: var(--c-bg-hl-emp);
  color: var(--c-bg-hl-empest);
  font-size: 12px;
  font-weight: 500;
  text-transform: capitalize;
  display: flex;
  border-radius: 5px;
  padding: 5px;
}

.ae-step {
  display: flex;
  align-items: center;
  background: var(--c-bg-hl);
  padding: 10px;
  border-radius: 5px;
  margin-bottom: 10px;
}

@media (max-width: 576px) {

  .ae-step {
    font-size: 12px;
  }

}

.ae-step.ae-step--wait {
  border-left: 5px solid #f4a8a8;
}

.ae-step.ae-step--archive {
  border-left: 5px solid hsla(35.844154, 93.902435%, 82.84314%, 1.0);
}

.ae-step.ae-step--other {
  border-left: 5px solid hsla(190.12987, 42.541435%, 79.5098%, 1.0);
}

.ae-step.ae-step--email {
  border-left: 5px solid #98d2af;
}

.ae-step__icon {
  width: 40px;
  justify-content: center;
  height: 40px;
  margin-right: 10px;
  align-items: center;
  border-radius: 50%;
  display: flex;
  background: var(--c-bg-hl-emp);
  color: var(--c-text);
  opacity: 75%;
}

.ae-step__text {
  font-weight: 500;
  display: flex;
  align-items: center;
  flex: 1;
}

.ae-step__mover {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  padding-bottom: 10px;
}

.ae-step__mover__move {
  color: var(--c-bg-hl-emp);
  font-size: 20px;
  cursor: pointer;
}

.ae-step__mover__move:hover {
  color: var(--c-bg-hl-emper);
}

.ae-step__controls {
  color: var(--c-bg-hl-emper);
  display: flex;
}

.ae-step__controls div {
  cursor: pointer;
}

.ae-step__controls div:hover {
  color: var(--c-bg-hl-empest);
}

.ae-ef {
  width: 100%;
  overflow-y: auto;
  padding-bottom: 20px;
}

@media (max-width: 1600px) {

  .ae-ef {
    width: 50%;
  }

}

@media (max-width: 1200px) {

  .ae-ef {
    width: 100%;
    overflow: visible;
  }

}

.ae-ef::-webkit-scrollbar {
  display: none !important;
}

.template-preview {
  display: flex;
  flex-flow: column;
  width: 100%;
}

.template-preview__subject, .template-preview__body {
  background: var(--c-bg-hl);
  padding: 15px;
  border-radius: 5px;
  color: var(--c-text);
  opacity: 0.7;
}

.template-preview__body {
  max-height: 300px;
  overflow-y: auto;
}

.ae-ef__templates {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid var(--c-bg-hl);
  padding-bottom: 20px;
  margin-bottom: 20px;
}

.dnd {
  justify-content: space-between;
  height: 50px;
  padding: 10px 10px 10px 10px;
  margin-bottom: 10px;
  cursor: grab;
  border-radius: 2px;
  display: flex;
  background: var(--c-bg-hl);
  color: var(--c-text);
}

.dnd:last-child {
  margin-bottom: 0;
}

.dnd.dnd--deal {
  background: #2dc08d;
  color: #fff;
  cursor: not-allowed;
}

.dnd.dnd--deal .dnd-icon {
  color: #fff;
  opacity: 0.5;
}

.dnd.dnd--deal .dnd-edit {
  color: #fff;
  opacity: 0.5;
}

.dnd.dnd--deal .dnd-edit:hover {
  opacity: 1;
}

.dnd-section {
  display: flex;
  align-items: center;
  justify-content: center;
}

.dnd-icon {
  color: var(--c-bg-hl-emper);
  margin-right: 20px;
  width: 10px;
}

.dnd-name {
  text-transform: capitalize;
  font-weight: 500;
  display: flex;
  align-items: center;
  justify-content: center;
}

.dnd-name-icon {
  width: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 10px;
}

.dnd-delete {
  color: #fb5e48;
  opacity: 0.5;
  margin-right: 10px;
}

.dnd-btn {
  font-size: 14px;
  cursor: pointer;
}

.dnd-btn:hover {
  opacity: 1;
}

.dnd-edit {
  color: var(--c-bg-hl-emper);
}

.dnd-edit:hover {
  color: var(--c-bg-hl-empest);
}

.dnd-dropzone {
  height: 5px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.dnd-dropzone.dnd-dropzone--active {
  background: var(--c-bg-hl-less);
  border-radius: 2px;
  height: 50px;
}

.timezone-change {
  flex-flow: column;
  line-height: 140%;
  width: 100%;
  right: 0;
  max-width: 400px;
  justify-content: center;
  margin: 0 auto;
  align-items: center;
  padding: 10px;
  text-align: center;
  position: fixed;
  z-index: 9999;
  min-height: 90px;
  font-size: 14px;
  border-radius: 5px;
  display: flex;
  bottom: 10px;
  background: var(--c-bg-hl);
  color: var(--c-text);
  left: 0;
}

.contact-uploads__header {
  display: grid;
  grid-template-columns: 20px 1fr 65.8px;
  grid-gap: 10px;
  margin-bottom: 10px;
  margin-right: 3px;
}

.contact-uploads__list {
  display: flex;
  flex-flow: column;
}

.contact-uploads__item {
  display: grid;
  grid-template-columns: 25px 1fr auto;
  grid-gap: 10px;
  align-items: center;
  font-size: 12px;
  margin-bottom: 10px;
}

.contact-uploads__item:last-child {
  margin-bottom: 0;
}

.contact-uploads__icon {
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--c-bg-hl);
  border-radius: 50%;
}

.contact-uploads__action {
  color: var(--c-text);
  cursor: pointer;
}

.contact-upload__form {
  display: flex;
  padding: 10px 15px;
  background: var(--c-bg-hl);
  border-radius: 5px;
  flex-flow: column;
  margin-bottom: 20px;
}