/* STATIC URL PATH */
/* VIIMA COLORS */
/* HYPE COLORS */
/* INDICATOR COLORS */
/* FONTS */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300 800;
  font-stretch: 75% 100%;
  font-display: swap;
  src: url(/static/fonts/OpenSans/OpenSans.woff2) format('woff2');
}
/* COMMON HELPERS */
/* CUSTOMER SPECIFIC COLORS */
body {
  margin: 0;
  position: absolute;
  width: 100%;
  height: 100%;
}
body.dashboard {
  /*
			Fix chrome css issue in dashboard that causes scrollbar to toggle rapidly
			when window height was just a bit larger that the body height
		*/
  overflow-y: scroll !important;
}
body.dashboard .material-tooltip {
  max-width: 400px;
  border-radius: 8px;
}
.native-scrolling,
.item-detail-view #content-wrapper {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
/* jquery-comments */
.jquery-comments .new {
  color: #ffffff !important;
}
.count-badge {
  display: inline-block;
  min-width: 18px;
  line-height: 18px;
  border-radius: 9px;
  padding: 0 6px;
  font-size: 12px;
  text-align: center;
  font-weight: bold;
  background: #1971c2;
  color: #ffffff;
}
.image {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  display: inline-block;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
}
.image.cover {
  background-size: cover;
}
.toast {
  opacity: 0.9 !important;
}
/* Baron scrolbar styles */
.baron {
  overflow: hidden;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  /* Bug fix in nested scrollbars, hiding one scrollbar caused both scrollbars to be hidden */
}
.baron .baron__track {
  z-index: 99;
}
.baron .baron__track .baron__bar {
  background: none;
  pointer-events: auto;
}
.baron .baron__track .baron__bar .handle {
  transition: opacity 0.25s ease-in-out;
  opacity: 0;
  background: #333;
  border-radius: 3px;
  position: absolute;
}
.baron .baron__track.vertical {
  top: 0;
  bottom: 0;
  right: 0;
  width: 11px;
}
.baron .baron__track.vertical .baron__bar {
  width: 100%;
}
.baron .baron__track.vertical .baron__bar .handle {
  width: 6px;
  top: 3px;
  bottom: 3px;
  right: 3px;
}
.baron .baron__track.horizontal {
  top: auto;
  left: 0;
  right: 0;
  bottom: 0;
  height: 16px;
}
.baron .baron__track.horizontal .baron__bar {
  height: 100%;
}
.baron .baron__track.horizontal .baron__bar .handle {
  height: 6px;
  left: 3px;
  right: 3px;
  bottom: 4px;
  /* Easier to grab when slightly more margin to the bottom */
}
.baron:hover .baron__bar .handle {
  opacity: 0.25;
}
.baron._scrollbar .baron__track {
  display: none;
}
.baron._scrollbar > .baron__track {
  display: block;
}
/* Dropdowns */
.dropdown.regular .image {
  float: left;
}
.dropdown.regular .name {
  padding-left: 1rem;
  line-height: 32px;
  height: 32px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.dropdown.regular .dropdown-toggle .fa {
  line-height: 32px;
  margin-left: 1rem;
  float: right;
  transform: none;
}
.dropdown.regular .dropdown-toggle[data-toggle] {
  cursor: pointer;
}
.dropdown.regular .dropdown-toggle:not([data-toggle]) .fa {
  display: none;
}
.dropdown.regular .dropdown-menu.center {
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
}
.dropdown-menu {
  border: 2px solid #d9dfe3;
  border-radius: 8px;
  text-align: left;
  margin-top: 0;
  padding: 0;
}
.dropdown-menu li a {
  cursor: pointer;
  vertical-align: middle;
  padding: 10px 20px;
}
.dropdown-menu li a:hover {
  background: #eee;
}
.dropdown-menu li.active a {
  color: #ffffff !important;
  background: {{customer.roadmap_highlight_color}} !important;
}
.dropdown-menu li:first-of-type.active a {
  border-radius: 6px 6px 0 0;
}
.dropdown-menu li:last-of-type.active a {
  border-radius: 0 0 6px 6px;
}
.dropdown-menu li.inactive a {
  color: #b0bec5;
  cursor: default;
}
.dropdown-menu li.inactive a:hover {
  background: none;
}
.dropdown-menu li.dropdown-header {
  padding-top: 1rem;
  padding-bottom: 0.5rem;
  color: #b0bec5;
  letter-spacing: 0.3px;
  font-weight: 500;
  text-transform: uppercase;
}
.dropdown-menu .items {
  max-height: 200px;
  padding: 1px 0px;
  /* In order to show the whole focus effect */
  list-style: none;
  overflow-y: auto;
}
.dropdown-menu .items li a {
  display: block;
  /* Copied from bootstrap */
  color: #31343e;
  text-decoration: none;
  padding: 5px 20px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
}
.dropdown-menu .items li a:hover {
  background: #f5f5f5;
}
.dropdown-menu .items li a > div {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.dropdown-menu .items li a .description {
  color: #b0bec5;
  font-size: 0.9em;
}
/* ============ */
.chevron {
  font-size: 12px;
  transform: translateY(-12%);
  -ms-transform: translateY(-12%);
  -o-transform: translateY(-12%);
  -webkit-transform: translateY(-12%);
  -moz-transform: translateY(-12%);
}
.control-icon {
  display: inline-block;
  color: #b0bec5;
  border-radius: 50%;
  font-size: 25px;
  height: 25px;
  width: 25px;
  text-align: center;
  position: relative;
  z-index: 999;
}
.control-icon:hover {
  cursor: pointer;
  color: #263238;
}
#onboarding-banner.main-ui #onboarding-banner-container {
  right: -285px;
  z-index: 999;
}
#onboarding-banner.main-ui #onboarding-banner-container.open {
  right: 0;
}
#onboarding-banner.main-ui #onboarding-banner-container .toggle-banner i {
  vertical-align: sub;
}
#onboarding-banner.main-ui #onboarding-banner-container a.support-link {
  color: #1971c2;
}
#onboarding-banner.main-ui #onboarding-banner-container .done-container .icon {
  margin-left: -12px;
}
/* Ensure that toggle sidebar button won't be positioned under the onborading banner on main UI */
#onboarding-banner:not(:empty) ~ #main-view-container #side-bar.closed .toggle-sidebar {
  top: 50px;
  transform: none;
  -ms-transform: none;
  -o-transform: none;
  -webkit-transform: none;
  -moz-transform: none;
}
/* DASHBOARD */
#dashboard {
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
  color: #263238;
  background: #f9fbfd;
  min-height: 100%;
  /* Clicking the label does not activate the input without this */
}
#dashboard .navigation {
  display: flex;
  justify-content: space-between;
  height: 72px;
}
#dashboard .page.organizations .header {
  text-align: center;
  font-size: 20px;
}
#dashboard .page.organizations .organization-list {
  max-width: 1200px;
  margin: auto;
}
#dashboard .page.organizations .organization-list .row {
  padding: 30px 0;
}
#dashboard .page.organizations .organization-list .row .col {
  padding: 0 30px;
}
#dashboard .page.organizations .organization-list .table-headers {
  font-weight: bold;
  padding: 0;
}
#dashboard .page.organizations .organization-list .organization-row {
  cursor: pointer;
  background: white;
  margin-bottom: 0;
  border: 1px solid #eee;
  border-bottom: none;
}
#dashboard .page.organizations .organization-list .organization-row:last-child {
  border-bottom: 1px solid #eee;
}
#dashboard .page.organizations .organization-list .organization-row:hover {
  background-color: #efefef;
}
#dashboard .page.organizations .organization-list .organization-row:hover a.open {
  opacity: 1 !important;
}
#dashboard .page.organizations .organization-list .organization-row .content {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#dashboard .page.organizations .organization-list .organization-row .content .description {
  color: #777;
  font-size: 0.9rem;
}
#dashboard .page.organizations .organization-list .organization-row .content a.open {
  opacity: 0;
  display: flex;
  align-items: center;
  margin-left: 20px;
  color: inherit;
  border: 1px solid #ccc;
  border-radius: 10px;
  padding: 5px 10px 5px 20px;
  white-space: nowrap;
}
#dashboard .page.organizations .organization-list .organization-row .content a.open i {
  margin-left: 10px;
  font-size: 16px;
}
#dashboard .page.organizations .organization-list .organization-row .content a.open:hover {
  background: #fff;
}
#dashboard .page.organizations .signup {
  text-align: center;
  margin-top: 100px;
  font-size: 1.2rem;
}
#dashboard .page.organizations .signup .cta {
  display: inline-block;
  margin-top: 20px;
  background-color: #1971c2;
  color: white;
  text-decoration: none;
  padding: 10px 50px;
  border-radius: 100px;
}
#dashboard input[type='text'] + label {
  pointer-events: none;
}
#dashboard input[type='text'] + label * {
  pointer-events: all;
}
#dashboard .header {
  margin: 10px 0;
  margin-top: 20px;
}
#dashboard .header .organization-title {
  padding-bottom: 30px;
  color: #31343e;
}
#dashboard .header .controls {
  margin: 0 -5px;
}
#dashboard .header .controls .control-element {
  margin-left: 5px !important;
  margin-right: 5px !important;
}
#dashboard .header .controls .control-element.select-wrapper {
  margin-right: 23px !important;
}
#dashboard .header .controls .search-container,
#dashboard .header .controls .select-wrapper {
  margin-bottom: 10px;
}
#dashboard .header .controls .search-container input,
#dashboard .header .controls .select-wrapper input {
  border: 1px solid #ddd;
  border-radius: 100px;
  background-color: white;
  margin: 0;
}
#dashboard .header .controls .search-container {
  display: inline-block;
  position: relative;
  width: 100%;
  max-width: 400px;
}
#dashboard .header .controls .search-container .icon-wrapper {
  display: flex;
  align-items: center;
  position: absolute;
  left: 10px;
  height: 100%;
}
#dashboard .header .controls .search-container .icon-wrapper .inline-loader {
  border: 2px solid #999;
  border-top: 2px solid rgba(0, 0, 0, 0);
  border-radius: 50%;
  width: 20px;
  height: 20px;
  animation: spin 0.7s linear infinite;
  margin-left: 2px;
}
#dashboard .header .controls .search-container .clear-button-container {
  display: flex;
  align-items: center;
  position: absolute;
  right: 10px;
  top: 0;
  height: 100%;
}
#dashboard .header .controls .search-container .clear-button-container .clear {
  cursor: pointer;
  user-select: none;
  display: none;
}
#dashboard .header .controls .search-container input {
  box-sizing: border-box;
  padding: 0 40px;
  box-shadow: none;
}
#dashboard .header .controls .search-container input:focus {
  border-color: #1971c2;
}
#dashboard .header .controls .select-wrapper {
  min-width: 200px;
  display: inline-block;
}
#dashboard .header .controls .select-wrapper input {
  padding: 0 0 0 15px;
  margin: 0;
}
#dashboard .header .controls .select-wrapper .caret {
  z-index: 1;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #ffffff 50%, #ffffff 100%);
  top: 7px;
  bottom: 7px;
  right: -16px;
  border-radius: 100px;
  width: 50px;
  padding-left: 30px;
  display: flex;
  align-items: center;
  pointer-events: none;
}
#dashboard .header .controls .select-wrapper ul li:not(.disabled) span {
  display: flex;
}
#dashboard .header .controls .select-wrapper ul li:first-child label {
  display: none;
}
#dashboard .header .controls .btn {
  display: inline-block;
  cursor: pointer;
  padding-left: 1.5rem;
  white-space: nowrap;
  margin-bottom: 10px;
}
#dashboard .header .controls .btn:not(:first-child) {
  margin-left: 10px;
}
#dashboard .header .controls .btn i {
  vertical-align: bottom;
  margin-right: 5px;
}
#dashboard .header .controls .btn#create-customer-group {
  font-size: 1rem;
  background: #b0bec5;
  color: #fff;
  font-weight: 600 !important;
}
#dashboard .header .controls .btn#create-customer-group:hover {
  background: #758d9a;
}
#dashboard #create-customer-group-modal .btn-delete,
#dashboard #archive-customer-modal .btn-delete {
  background-color: #f95a5a;
}
#dashboard #create-board-modal,
#dashboard #create-customer-group-modal,
#dashboard #archive-customer-modal,
#dashboard #hype-pairing-credentials-confirmation-modal {
  text-align: center;
  overflow-y: visible;
  max-height: 100% !important;
  max-width: 680px;
  border-radius: 24px;
  /* Materialize overrides */
}
#dashboard #create-board-modal .help-block,
#dashboard #create-customer-group-modal .help-block,
#dashboard #archive-customer-modal .help-block,
#dashboard #hype-pairing-credentials-confirmation-modal .help-block {
  float: left;
  margin-bottom: 10px;
}
#dashboard #create-board-modal h5,
#dashboard #create-customer-group-modal h5,
#dashboard #archive-customer-modal h5,
#dashboard #hype-pairing-credentials-confirmation-modal h5 {
  font-size: 18px;
  font-weight: bold;
}
#dashboard #create-board-modal .kb-info,
#dashboard #create-customer-group-modal .kb-info,
#dashboard #archive-customer-modal .kb-info,
#dashboard #hype-pairing-credentials-confirmation-modal .kb-info {
  margin: 20px 0;
  color: #b0bec5;
}
#dashboard #create-board-modal .kb-info i,
#dashboard #create-customer-group-modal .kb-info i,
#dashboard #archive-customer-modal .kb-info i,
#dashboard #hype-pairing-credentials-confirmation-modal .kb-info i {
  transform: translateY(2px);
}
#dashboard #create-board-modal .warning,
#dashboard #create-customer-group-modal .warning,
#dashboard #archive-customer-modal .warning,
#dashboard #hype-pairing-credentials-confirmation-modal .warning {
  color: #fc954f;
}
#dashboard #create-board-modal .warning .customer,
#dashboard #create-customer-group-modal .warning .customer,
#dashboard #archive-customer-modal .warning .customer,
#dashboard #hype-pairing-credentials-confirmation-modal .warning .customer {
  font-weight: bold;
}
#dashboard #create-board-modal .premium-upgrade-message,
#dashboard #create-customer-group-modal .premium-upgrade-message,
#dashboard #archive-customer-modal .premium-upgrade-message,
#dashboard #hype-pairing-credentials-confirmation-modal .premium-upgrade-message {
  text-align: center;
  margin: 40px auto;
  color: #aaa;
  font-size: 16px;
  max-width: 520px;
}
#dashboard #create-board-modal .premium-upgrade-message i,
#dashboard #create-customer-group-modal .premium-upgrade-message i,
#dashboard #archive-customer-modal .premium-upgrade-message i,
#dashboard #hype-pairing-credentials-confirmation-modal .premium-upgrade-message i {
  font-size: 50px;
  margin-bottom: 15px;
}
#dashboard #create-board-modal .premium-upgrade-message .modal-footer,
#dashboard #create-customer-group-modal .premium-upgrade-message .modal-footer,
#dashboard #archive-customer-modal .premium-upgrade-message .modal-footer,
#dashboard #hype-pairing-credentials-confirmation-modal .premium-upgrade-message .modal-footer {
  margin: 40px auto -10px auto;
}
#dashboard #create-board-modal .premium-upgrade-message .modal-footer .btn,
#dashboard #create-customer-group-modal .premium-upgrade-message .modal-footer .btn,
#dashboard #archive-customer-modal .premium-upgrade-message .modal-footer .btn,
#dashboard #hype-pairing-credentials-confirmation-modal .premium-upgrade-message .modal-footer .btn {
  float: none;
  margin: auto;
}
#dashboard #create-board-modal .row,
#dashboard #create-customer-group-modal .row,
#dashboard #archive-customer-modal .row,
#dashboard #hype-pairing-credentials-confirmation-modal .row {
  padding: 10px 0;
}
#dashboard #create-board-modal .row .col,
#dashboard #create-customer-group-modal .row .col,
#dashboard #archive-customer-modal .row .col,
#dashboard #hype-pairing-credentials-confirmation-modal .row .col {
  padding: 0;
}
#dashboard #create-board-modal .input-field label,
#dashboard #create-customer-group-modal .input-field label,
#dashboard #archive-customer-modal .input-field label,
#dashboard #hype-pairing-credentials-confirmation-modal .input-field label {
  left: 0;
  max-width: 100%;
}
#dashboard #create-board-modal .dropdown-content li.disabled,
#dashboard #create-customer-group-modal .dropdown-content li.disabled,
#dashboard #archive-customer-modal .dropdown-content li.disabled,
#dashboard #hype-pairing-credentials-confirmation-modal .dropdown-content li.disabled {
  /* Hide checkboxes from disabled options */
}
#dashboard #create-board-modal .dropdown-content li.disabled label,
#dashboard #create-customer-group-modal .dropdown-content li.disabled label,
#dashboard #archive-customer-modal .dropdown-content li.disabled label,
#dashboard #hype-pairing-credentials-confirmation-modal .dropdown-content li.disabled label {
  padding-left: 0;
}
#dashboard #create-board-modal .dropdown-content li.disabled label::before,
#dashboard #create-customer-group-modal .dropdown-content li.disabled label::before,
#dashboard #archive-customer-modal .dropdown-content li.disabled label::before,
#dashboard #hype-pairing-credentials-confirmation-modal .dropdown-content li.disabled label::before {
  display: none;
}
#dashboard #create-board-modal #create-board-form,
#dashboard #create-customer-group-modal #create-board-form,
#dashboard #archive-customer-modal #create-board-form,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form {
  margin-top: 0px;
  padding: 0;
}
#dashboard #create-board-modal #create-board-form .row,
#dashboard #create-customer-group-modal #create-board-form .row,
#dashboard #archive-customer-modal #create-board-form .row,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .row {
  max-width: 500px;
  margin-bottom: 0;
}
#dashboard #create-board-modal #create-board-form .row.compact,
#dashboard #create-customer-group-modal #create-board-form .row.compact,
#dashboard #archive-customer-modal #create-board-form .row.compact,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .row.compact {
  padding-top: 0;
}
#dashboard #create-board-modal #create-board-form .searchable-container.select2,
#dashboard #create-customer-group-modal #create-board-form .searchable-container.select2,
#dashboard #archive-customer-modal #create-board-form .searchable-container.select2,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .searchable-container.select2 {
  text-align: left;
}
#dashboard #create-board-modal #create-board-form .searchable-container.select2 label,
#dashboard #create-customer-group-modal #create-board-form .searchable-container.select2 label,
#dashboard #archive-customer-modal #create-board-form .searchable-container.select2 label,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .searchable-container.select2 label {
  position: inherit;
  top: inherit;
  left: inherit;
}
#dashboard #create-board-modal #create-board-form #method-selector,
#dashboard #create-customer-group-modal #create-board-form #method-selector,
#dashboard #archive-customer-modal #create-board-form #method-selector,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form #method-selector {
  padding-bottom: 35px;
  border-bottom: 1px solid #eee;
}
#dashboard #create-board-modal #create-board-form .radio-container,
#dashboard #create-customer-group-modal #create-board-form .radio-container,
#dashboard #archive-customer-modal #create-board-form .radio-container,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .radio-container {
  text-align: left;
  padding-left: 0;
}
#dashboard #create-board-modal #create-board-form .radio-container [type='radio']:not(:checked) + label,
#dashboard #create-customer-group-modal #create-board-form .radio-container [type='radio']:not(:checked) + label,
#dashboard #archive-customer-modal #create-board-form .radio-container [type='radio']:not(:checked) + label,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .radio-container [type='radio']:not(:checked) + label,
#dashboard #create-board-modal #create-board-form .radio-container [type='radio']:checked + label,
#dashboard #create-customer-group-modal #create-board-form .radio-container [type='radio']:checked + label,
#dashboard #archive-customer-modal #create-board-form .radio-container [type='radio']:checked + label,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .radio-container [type='radio']:checked + label {
  margin-left: -4px;
  color: #263238;
}
#dashboard #create-board-modal #create-board-form .radio-container [type='radio']:not(:checked) + label i,
#dashboard #create-customer-group-modal #create-board-form .radio-container [type='radio']:not(:checked) + label i,
#dashboard #archive-customer-modal #create-board-form .radio-container [type='radio']:not(:checked) + label i,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .radio-container [type='radio']:not(:checked) + label i,
#dashboard #create-board-modal #create-board-form .radio-container [type='radio']:checked + label i,
#dashboard #create-customer-group-modal #create-board-form .radio-container [type='radio']:checked + label i,
#dashboard #archive-customer-modal #create-board-form .radio-container [type='radio']:checked + label i,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .radio-container [type='radio']:checked + label i {
  color: #9e9e9e;
}
#dashboard #create-board-modal #create-board-form .radio-container [type='radio']:checked + label:after,
#dashboard #create-customer-group-modal #create-board-form .radio-container [type='radio']:checked + label:after,
#dashboard #archive-customer-modal #create-board-form .radio-container [type='radio']:checked + label:after,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .radio-container [type='radio']:checked + label:after {
  border: 2px solid #43a047;
  background-color: #43a047;
}
#dashboard #create-board-modal #create-board-form .radio-container label i,
#dashboard #create-customer-group-modal #create-board-form .radio-container label i,
#dashboard #archive-customer-modal #create-board-form .radio-container label i,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .radio-container label i {
  vertical-align: sub;
}
#dashboard #create-board-modal #create-board-form .checkbox-container,
#dashboard #create-customer-group-modal #create-board-form .checkbox-container,
#dashboard #archive-customer-modal #create-board-form .checkbox-container,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .checkbox-container {
  text-align: left;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li {
  min-height: 30px;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li img,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li img,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li img,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li img {
  border-radius: 40px;
  position: absolute;
  right: 0;
  object-fit: cover;
  top: 60%;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li > span,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li > span,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li > span,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li > span {
  padding: 0 1em;
  padding-right: 60px;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled),
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled),
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled),
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled) {
  position: relative;
  padding: 0;
  padding-top: 1em;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled) > span,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled) > span,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled) > span,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled) > span {
  color: #263238;
  font-size: 1em;
  font-weight: bold;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled):hover + li.disabled,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled):hover + li.disabled,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled):hover + li.disabled,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled):hover + li.disabled {
  background-color: #eee;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled).selected,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled).selected,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled).selected,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled).selected,
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled).selected + li.disabled,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled).selected + li.disabled,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled).selected + li.disabled,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled).selected + li.disabled {
  background-color: #e1e1e1;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled)::after,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled)::after,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled)::after,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li:not(.disabled)::after {
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  display: block;
  position: absolute;
  height: 7em;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li:nth-last-child(2)::after,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li:nth-last-child(2)::after,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li:nth-last-child(2)::after,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li:nth-last-child(2)::after {
  height: 5em;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li.disabled,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li.disabled,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li.disabled,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li.disabled {
  padding-bottom: 1em;
  line-height: 1em;
  pointer-events: none;
  max-height: 60px;
}
#dashboard #create-board-modal #create-board-form .additional-info ul.dropdown-content li.disabled > span,
#dashboard #create-customer-group-modal #create-board-form .additional-info ul.dropdown-content li.disabled > span,
#dashboard #archive-customer-modal #create-board-form .additional-info ul.dropdown-content li.disabled > span,
#dashboard #hype-pairing-credentials-confirmation-modal #create-board-form .additional-info ul.dropdown-content li.disabled > span {
  display: -webkit-box;
  max-width: 405px;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.9em;
}
#dashboard #create-board-modal #create-customer-group-form,
#dashboard #create-customer-group-modal #create-customer-group-form,
#dashboard #archive-customer-modal #create-customer-group-form,
#dashboard #hype-pairing-credentials-confirmation-modal #create-customer-group-form {
  /* Customer group headers */
}
#dashboard #create-board-modal #create-customer-group-form .row,
#dashboard #create-customer-group-modal #create-customer-group-form .row,
#dashboard #archive-customer-modal #create-customer-group-form .row,
#dashboard #hype-pairing-credentials-confirmation-modal #create-customer-group-form .row {
  max-width: 500px;
}
#dashboard #create-board-modal #create-customer-group-form .dropdown-content li.disabled:not(:first-child) span,
#dashboard #create-customer-group-modal #create-customer-group-form .dropdown-content li.disabled:not(:first-child) span,
#dashboard #archive-customer-modal #create-customer-group-form .dropdown-content li.disabled:not(:first-child) span,
#dashboard #hype-pairing-credentials-confirmation-modal #create-customer-group-form .dropdown-content li.disabled:not(:first-child) span {
  text-transform: uppercase;
  letter-spacing: 2px;
  font-size: 13px;
}
#dashboard #create-board-modal label i,
#dashboard #create-customer-group-modal label i,
#dashboard #archive-customer-modal label i,
#dashboard #hype-pairing-credentials-confirmation-modal label i {
  font-size: 1.2em;
  line-height: 1.2em;
  margin-left: 3px;
  cursor: pointer;
  vertical-align: bottom;
}
#dashboard #create-board-modal .btn-save,
#dashboard #create-customer-group-modal .btn-save,
#dashboard #archive-customer-modal .btn-save,
#dashboard #hype-pairing-credentials-confirmation-modal .btn-save {
  margin: 2rem;
  margin-left: 0.5rem;
  margin-right: 3rem;
}
#dashboard #create-board-modal .btn-delete,
#dashboard #create-customer-group-modal .btn-delete,
#dashboard #archive-customer-modal .btn-delete,
#dashboard #hype-pairing-credentials-confirmation-modal .btn-delete {
  margin: 2rem 0.5rem;
}
#dashboard #archive-customer-modal.modal,
#dashboard #hype-pairing-credentials-confirmation-modal {
  text-align: center;
}
#dashboard #archive-customer-modal.modal .modal-content,
#dashboard #hype-pairing-credentials-confirmation-modal .modal-content {
  max-width: 600px;
  margin: auto;
}
#dashboard #archive-customer-modal.modal .modal-content .modal-header h5,
#dashboard #hype-pairing-credentials-confirmation-modal .modal-content .modal-header h5 {
  font-size: 18px;
  font-weight: bold;
}
#dashboard #archive-customer-modal.modal .modal-content .modal-footer,
#dashboard #hype-pairing-credentials-confirmation-modal .modal-content .modal-footer {
  height: auto;
  margin: 30px auto 0px auto;
}
#dashboard #archive-customer-modal.modal .modal-content .modal-footer .btn,
#dashboard #hype-pairing-credentials-confirmation-modal .modal-content .modal-footer .btn {
  float: none;
  margin: 0.5rem;
}
#dashboard .btn {
  position: relative;
  background-color: #1971c2;
  height: 3rem;
  line-height: 3rem;
  box-shadow: none;
}
#dashboard .btn:hover {
  background-color: #1161b3;
}
#dashboard .btn.btn-danger {
  background-color: #f24545;
}
#dashboard .btn.btn-danger:hover {
  background-color: #f95a5a;
}
#dashboard .btn.btn-warning {
  background-color: #fc954f;
}
#dashboard .btn.btn-warning:hover {
  background-color: #fc8832;
}
#dashboard .file-field input[type='file'] {
  height: 100%;
}
#dashboard .btn.btn-save {
  background-color: #43a047;
}
#dashboard .btn.btn-save:hover {
  background-color: #2e7d32;
}
#dashboard .btn.btn-secondary {
  background-color: #aaa;
}
#dashboard .btn.btn-secondary:hover {
  background-color: #b0bec5;
}
#dashboard .no-boards-text,
#dashboard .ie-warning {
  text-align: center;
  margin-top: 8rem;
  font-size: 1.2rem;
  color: #b0bec5;
}
#dashboard .no-boards-text a:hover,
#dashboard .ie-warning a:hover {
  text-decoration: underline;
}
#dashboard nav {
  height: 72px;
  background-color: #1971c2;
  padding: 0 5%;
  box-shadow: none;
  overflow: hidden;
}
#dashboard nav .boards a:hover {
  color: #fff;
  opacity: 0.75;
  transition: opacity 0.25s ease-out;
}
#dashboard nav .logo {
  height: 40px;
}
#dashboard nav .dropdown {
  display: flex;
  align-items: center;
}
#dashboard nav .dropdown .element {
  display: flex;
  align-items: center;
  gap: 30px;
}
#dashboard nav .fa {
  font-size: 1.5rem;
  line-height: inherit;
}
#dashboard nav .profile-picture {
  border-radius: 50%;
  vertical-align: middle;
  display: inline-block;
  background-size: cover;
}
#dashboard nav .main,
#dashboard nav .right {
  display: flex;
  align-items: center;
}
#dashboard nav .main {
  gap: 20px;
}
#dashboard nav .right {
  gap: 30px;
}
#dashboard nav .right div > a {
  line-height: 72px !important;
}
#dashboard nav .right div > a:hover {
  color: #fff;
  opacity: 0.75;
  transition: opacity 0.25s ease-out;
}
#dashboard nav .right div > a i {
  line-height: inherit !important;
  height: inherit !important;
}
#dashboard nav ul li {
  transition: 0.3s all;
}
#dashboard nav ul li a {
  color: #fff;
  font-weight: 500;
  font-size: 1.05em;
}
#dashboard nav ul li a.dropdown-button {
  font-weight: 400;
  font-size: 1rem;
}
#dashboard nav ul li a:hover {
  color: #fff;
  background-color: #1971c2 !important;
}
#dashboard nav ul li a.logo-container {
  display: inline-flex;
  vertical-align: middle;
}
#dashboard nav ul li a:first-child {
  padding-left: 0;
}
#dashboard nav ul li.active {
  background-color: transparent;
}
#dashboard nav ul li.active a {
  color: #fff;
  font-weight: 700;
}
#dashboard nav ul li.active a:hover {
  color: #fff;
  opacity: 75%;
}
#dashboard nav .dropdown-content {
  top: 62px !important;
  border: 2px solid #d9dfe3;
  border-radius: 8px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 8px 0 rgba(0, 0, 0, 0.05);
  font-size: 12px;
  letter-spacing: 1.5px;
  padding: 8px 0;
}
#dashboard nav .dropdown-content li {
  padding: 4px 16px;
  background-color: transparent !important;
  min-height: 0px !important;
}
#dashboard nav .dropdown-content li a {
  color: #b0bec5;
  white-space: nowrap;
  padding: 0;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  min-height: 0;
  font-weight: 500;
  transition: 0.3s all;
}
#dashboard nav .dropdown-content li a:hover {
  background-color: #fff !important;
  color: #263238 !important;
}
#dashboard #get-started-modal,
#dashboard #upgrade-wizard-modal,
#dashboard #create-board-modal {
  width: 90% !important;
  height: 95% !important;
  top: 2.5% !important;
  max-height: 95%;
  min-height: 300px;
  border-radius: 8px;
  overflow: hidden;
  overflow-y: auto;
}
#dashboard #get-started-modal .modal-content,
#dashboard #upgrade-wizard-modal .modal-content,
#dashboard #create-board-modal .modal-content {
  padding-top: 10px;
  position: relative;
}
#dashboard #get-started-modal a:not(.btn),
#dashboard #upgrade-wizard-modal a:not(.btn),
#dashboard #create-board-modal a:not(.btn) {
  color: #1971c2;
}
#dashboard #get-started-modal a:not(.btn):hover,
#dashboard #upgrade-wizard-modal a:not(.btn):hover,
#dashboard #create-board-modal a:not(.btn):hover {
  color: #1161b3;
}
#dashboard #get-started-modal .controls,
#dashboard #upgrade-wizard-modal .controls,
#dashboard #create-board-modal .controls {
  margin-bottom: 1rem;
  display: inline-block;
  width: 100%;
}
#dashboard #get-started-modal .bottom-container,
#dashboard #upgrade-wizard-modal .bottom-container,
#dashboard #create-board-modal .bottom-container {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}
#dashboard #get-started-modal .bottom-container .support-link:hover,
#dashboard #upgrade-wizard-modal .bottom-container .support-link:hover,
#dashboard #create-board-modal .bottom-container .support-link:hover {
  text-decoration: underline;
}
@media screen and (max-width: 1024px) {
  #dashboard #get-started-modal .support-link,
  #dashboard #upgrade-wizard-modal .support-link,
  #dashboard #create-board-modal .support-link {
    display: none;
  }
}
#dashboard #get-started-modal .step1,
#dashboard #upgrade-wizard-modal .step1,
#dashboard #create-board-modal .step1,
#dashboard #get-started-modal .step2,
#dashboard #upgrade-wizard-modal .step2,
#dashboard #create-board-modal .step2,
#dashboard #get-started-modal .step3,
#dashboard #upgrade-wizard-modal .step3,
#dashboard #create-board-modal .step3,
#dashboard #get-started-modal .step4,
#dashboard #upgrade-wizard-modal .step4,
#dashboard #create-board-modal .step4 {
  text-align: center;
  width: 85%;
  margin: auto;
}
#dashboard #get-started-modal .step1 .action-container,
#dashboard #upgrade-wizard-modal .step1 .action-container,
#dashboard #create-board-modal .step1 .action-container,
#dashboard #get-started-modal .step2 .action-container,
#dashboard #upgrade-wizard-modal .step2 .action-container,
#dashboard #create-board-modal .step2 .action-container,
#dashboard #get-started-modal .step3 .action-container,
#dashboard #upgrade-wizard-modal .step3 .action-container,
#dashboard #create-board-modal .step3 .action-container,
#dashboard #get-started-modal .step4 .action-container,
#dashboard #upgrade-wizard-modal .step4 .action-container,
#dashboard #create-board-modal .step4 .action-container {
  margin-top: 3em;
}
#dashboard #get-started-modal .step1 .body-text,
#dashboard #upgrade-wizard-modal .step1 .body-text,
#dashboard #create-board-modal .step1 .body-text,
#dashboard #get-started-modal .step2 .body-text,
#dashboard #upgrade-wizard-modal .step2 .body-text,
#dashboard #create-board-modal .step2 .body-text,
#dashboard #get-started-modal .step3 .body-text,
#dashboard #upgrade-wizard-modal .step3 .body-text,
#dashboard #create-board-modal .step3 .body-text,
#dashboard #get-started-modal .step4 .body-text,
#dashboard #upgrade-wizard-modal .step4 .body-text,
#dashboard #create-board-modal .step4 .body-text {
  max-width: 600px;
  margin: 10px auto;
  font-size: 14px;
}
#dashboard #get-started-modal .step1 .section-header,
#dashboard #upgrade-wizard-modal .step1 .section-header,
#dashboard #create-board-modal .step1 .section-header,
#dashboard #get-started-modal .step2 .section-header,
#dashboard #upgrade-wizard-modal .step2 .section-header,
#dashboard #create-board-modal .step2 .section-header,
#dashboard #get-started-modal .step3 .section-header,
#dashboard #upgrade-wizard-modal .step3 .section-header,
#dashboard #create-board-modal .step3 .section-header,
#dashboard #get-started-modal .step4 .section-header,
#dashboard #upgrade-wizard-modal .step4 .section-header,
#dashboard #create-board-modal .step4 .section-header {
  font-size: 20px;
  font-weight: bold;
}
#dashboard #get-started-modal .step1 h5 i,
#dashboard #upgrade-wizard-modal .step1 h5 i,
#dashboard #create-board-modal .step1 h5 i,
#dashboard #get-started-modal .step2 h5 i,
#dashboard #upgrade-wizard-modal .step2 h5 i,
#dashboard #create-board-modal .step2 h5 i,
#dashboard #get-started-modal .step3 h5 i,
#dashboard #upgrade-wizard-modal .step3 h5 i,
#dashboard #create-board-modal .step3 h5 i,
#dashboard #get-started-modal .step4 h5 i,
#dashboard #upgrade-wizard-modal .step4 h5 i,
#dashboard #create-board-modal .step4 h5 i {
  cursor: pointer;
  vertical-align: middle;
  margin-left: 0.5rem;
  font-size: 26px;
  padding-bottom: 0.2rem;
  color: #aaa;
  transition: 0.3s all;
}
#dashboard #get-started-modal .step1 h5:hover i,
#dashboard #upgrade-wizard-modal .step1 h5:hover i,
#dashboard #create-board-modal .step1 h5:hover i,
#dashboard #get-started-modal .step2 h5:hover i,
#dashboard #upgrade-wizard-modal .step2 h5:hover i,
#dashboard #create-board-modal .step2 h5:hover i,
#dashboard #get-started-modal .step3 h5:hover i,
#dashboard #upgrade-wizard-modal .step3 h5:hover i,
#dashboard #create-board-modal .step3 h5:hover i,
#dashboard #get-started-modal .step4 h5:hover i,
#dashboard #upgrade-wizard-modal .step4 h5:hover i,
#dashboard #create-board-modal .step4 h5:hover i {
  color: #1971c2;
}
#dashboard #get-started-modal .step1 .logo.get-started,
#dashboard #upgrade-wizard-modal .step1 .logo.get-started,
#dashboard #create-board-modal .step1 .logo.get-started {
  margin-bottom: 25px;
  margin-top: 50px;
  max-width: 250px;
}
#dashboard #get-started-modal .step1 .body-text,
#dashboard #upgrade-wizard-modal .step1 .body-text,
#dashboard #create-board-modal .step1 .body-text {
  max-width: 500px;
}
#dashboard #get-started-modal .step2 .sub-header,
#dashboard #upgrade-wizard-modal .step2 .sub-header,
#dashboard #create-board-modal .step2 .sub-header {
  color: #777;
  margin-bottom: 30px;
}
#dashboard #get-started-modal .step2 .sub-header a:hover,
#dashboard #upgrade-wizard-modal .step2 .sub-header a:hover,
#dashboard #create-board-modal .step2 .sub-header a:hover {
  text-decoration: underline;
}
#dashboard #get-started-modal .step2 .use-case-container,
#dashboard #upgrade-wizard-modal .step2 .use-case-container,
#dashboard #create-board-modal .step2 .use-case-container {
  position: relative;
  padding: 0 10px;
  margin-top: 20px;
}
#dashboard #get-started-modal .step2 .card,
#dashboard #upgrade-wizard-modal .step2 .card,
#dashboard #create-board-modal .step2 .card {
  max-width: 225px;
  margin: 10px;
  padding-top: inherit;
  transition: 0.3s all;
  box-shadow: none;
  border-radius: 12px;
  border: 2px solid #d9dfe3;
}
#dashboard #get-started-modal .step2 .card .card-content,
#dashboard #upgrade-wizard-modal .step2 .card .card-content,
#dashboard #create-board-modal .step2 .card .card-content {
  height: 6rem;
  word-wrap: break-word;
  transition: 0.3s all;
}
#dashboard #get-started-modal .step2 .card:hover,
#dashboard #upgrade-wizard-modal .step2 .card:hover,
#dashboard #create-board-modal .step2 .card:hover {
  cursor: pointer;
  color: #1971c2;
}
#dashboard #get-started-modal .step2 .card:hover .plan-price,
#dashboard #upgrade-wizard-modal .step2 .card:hover .plan-price,
#dashboard #create-board-modal .step2 .card:hover .plan-price {
  color: #1971c2 !important;
}
#dashboard #get-started-modal .step2 .card.selected,
#dashboard #upgrade-wizard-modal .step2 .card.selected,
#dashboard #create-board-modal .step2 .card.selected {
  color: #1971c2;
  border: 2px solid #1971c2;
}
#dashboard #get-started-modal .step2 .card.selected i,
#dashboard #upgrade-wizard-modal .step2 .card.selected i,
#dashboard #create-board-modal .step2 .card.selected i {
  color: #1971c2;
}
#dashboard #get-started-modal .step2 .card.selected .plan-price,
#dashboard #upgrade-wizard-modal .step2 .card.selected .plan-price,
#dashboard #create-board-modal .step2 .card.selected .plan-price {
  color: #1971c2 !important;
}
@media screen and (max-width: 767px) {
  #dashboard #get-started-modal .step2 .use-case-container,
  #dashboard #upgrade-wizard-modal .step2 .use-case-container,
  #dashboard #create-board-modal .step2 .use-case-container {
    margin: 0;
  }
  #dashboard #get-started-modal .step2 .card,
  #dashboard #upgrade-wizard-modal .step2 .card,
  #dashboard #create-board-modal .step2 .card {
    width: 98%;
    margin: 10px 1%;
  }
}
#dashboard #get-started-modal .step .input-container .input-field,
#dashboard #upgrade-wizard-modal .step .input-container .input-field,
#dashboard #create-board-modal .step .input-container .input-field {
  margin: auto;
  float: none;
}
#dashboard #get-started-modal .step4 i,
#dashboard #upgrade-wizard-modal .step4 i,
#dashboard #create-board-modal .step4 i {
  font-size: 120px;
  margin-top: 100px;
  color: #aaa;
  margin-bottom: 2rem;
  margin-left: -1.3rem;
  transition: 0.7s all;
  transform: rotate(35deg);
}
#dashboard #get-started-modal .step4 i.trigger-animation,
#dashboard #upgrade-wizard-modal .step4 i.trigger-animation,
#dashboard #create-board-modal .step4 i.trigger-animation {
  transform: scale(1.3) rotate(0deg);
}
#dashboard #get-started-modal .step4 .body-text,
#dashboard #upgrade-wizard-modal .step4 .body-text,
#dashboard #create-board-modal .step4 .body-text {
  margin: 50px auto;
}
#dashboard #get-started-modal .step4 .action-container,
#dashboard #upgrade-wizard-modal .step4 .action-container,
#dashboard #create-board-modal .step4 .action-container {
  margin-top: 4em;
}
@media screen and (max-width: 520px) {
  #dashboard #get-started-modal .step4 .action-container a,
  #dashboard #upgrade-wizard-modal .step4 .action-container a,
  #dashboard #create-board-modal .step4 .action-container a {
    margin-bottom: 0.5rem;
  }
}
#dashboard #get-started-modal .bs-wizard,
#dashboard #upgrade-wizard-modal .bs-wizard,
#dashboard #create-board-modal .bs-wizard {
  padding-bottom: 40px;
  padding-top: 0;
  width: 75%;
  margin: auto;
}
#dashboard #get-started-modal .bs-wizard .bs-wizard-stepnum,
#dashboard #upgrade-wizard-modal .bs-wizard .bs-wizard-stepnum,
#dashboard #create-board-modal .bs-wizard .bs-wizard-stepnum {
  visibility: hidden;
}
#dashboard #get-started-modal .bs-wizard .progress-bar,
#dashboard #upgrade-wizard-modal .bs-wizard .progress-bar,
#dashboard #create-board-modal .bs-wizard .progress-bar {
  transition: none;
}
#dashboard #get-started-modal .bs-wizard,
#dashboard #upgrade-wizard-modal .bs-wizard,
#dashboard #create-board-modal .bs-wizard {
  border-bottom: solid 1px #e0e0e0;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step {
  padding: 0;
  position: relative;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step .bs-wizard-stepnum,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step .bs-wizard-stepnum,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step .bs-wizard-stepnum {
  color: #595959;
  font-size: 16px;
  margin-bottom: 5px;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step .bs-wizard-info,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step .bs-wizard-info,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step .bs-wizard-info {
  color: #b0bec5;
  font-size: 14px;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step.active .bs-wizard-info,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step.active .bs-wizard-info,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step.active .bs-wizard-info {
  font-weight: bold;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step > .bs-wizard-dot,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step > .bs-wizard-dot,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step > .bs-wizard-dot {
  position: absolute;
  width: 30px;
  height: 30px;
  display: block;
  background: #43a047;
  top: 45px;
  left: 50%;
  margin-top: -15px;
  margin-left: -15px;
  border-radius: 50%;
  padding: 3px;
  font-size: 25px;
  color: white;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step > .bs-wizard-dot:after,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step > .bs-wizard-dot:after,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {
  content: ' ';
  width: 14px;
  height: 14px;
  background: none;
  border-radius: 50px;
  position: absolute;
  top: 8px;
  left: 8px;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step > .progress,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step > .progress,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step > .progress {
  position: relative;
  border-radius: 0px;
  height: 8px;
  box-shadow: none;
  margin: 20px 0;
  background: #ddd;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step > .progress > .progress-bar,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step > .progress > .progress-bar,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step > .progress > .progress-bar {
  width: 0px;
  box-shadow: none;
  background: #bdddfb;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {
  width: 100%;
  background: #43a047;
  display: list-item;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step.complete .bs-wizard-info,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step.complete .bs-wizard-info,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step.complete .bs-wizard-info {
  cursor: pointer;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step.active > .progress > .progress-bar,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step.active > .progress > .progress-bar,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {
  width: 50%;
  background: #43a047;
  display: list-item;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {
  width: 0%;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {
  width: 100%;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {
  background-color: #ddd;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step.active > .bs-wizard-dot,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step.active > .bs-wizard-dot,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step.active > .bs-wizard-dot {
  background-color: #43a047;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step:first-child > .progress,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step:first-child > .progress,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step:first-child > .progress {
  left: 50%;
  width: 50%;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step:last-child > .progress,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step:last-child > .progress,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step:last-child > .progress {
  width: 50%;
}
#dashboard #get-started-modal .bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot,
#dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot,
#dashboard #create-board-modal .bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot {
  pointer-events: none;
}
#dashboard #get-started-modal .use-case-container {
  max-width: 1400px;
  max-height: 900px;
  overflow-y: auto;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  gap: 10px;
}
#dashboard #get-started-modal .use-case-container .card {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 22%;
  max-width: 250px;
  min-width: 200px;
}
#dashboard #get-started-modal .use-case-container .card .card-bg-overlay {
  position: absolute;
  top: 0;
  left: 0;
  border-radius: 10px;
  opacity: 0.7;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to bottom right, #1971c2, #263238);
  transition: 0.3s all;
}
#dashboard #get-started-modal .use-case-container .card .card-content {
  position: relative;
  width: 100%;
  color: #eee;
  font-size: 18px;
  text-align: left;
  padding: 20px 10px;
  transition: 0.3s all;
  padding-right: 30px;
}
#dashboard #get-started-modal .use-case-container .card .tag-container {
  position: absolute;
  bottom: 0px;
  left: 10px;
  max-height: 120px;
  overflow: hidden;
  padding: 10px;
  padding-right: 20px;
  width: 100%;
  text-align: left;
  color: #eee;
}
#dashboard #get-started-modal .use-case-container .card .tag-container .tag {
  border-radius: 30px !important;
  font-size: 9px !important;
  text-transform: uppercase;
  font-weight: bold !important;
  background: transparent;
  border-color: #eee;
  margin-bottom: 5px;
  margin-right: 0;
  cursor: inherit;
}
#dashboard #get-started-modal .use-case-container .card i.tooltipped {
  color: #eee;
  position: absolute;
  top: 20px;
  right: 5px;
  transition: 0.3s all;
}
#dashboard #get-started-modal .use-case-container .card:hover .card-bg-overlay {
  opacity: 0.4;
  background-image: linear-gradient(to bottom right, #1971c2, #263238);
}
#dashboard #get-started-modal .use-case-container .card:hover .card-content,
#dashboard #get-started-modal .use-case-container .card:hover i.tooltipped,
#dashboard #get-started-modal .use-case-container .card:hover .tag-container {
  color: white;
}
#dashboard #get-started-modal .use-case-container .card:hover .tag {
  border-color: white;
}
#dashboard #get-started-modal .use-case-container .card.selected {
  border: 2px solid #1971c2;
}
#dashboard #get-started-modal .use-case-container .card.selected .card-content,
#dashboard #get-started-modal .use-case-container .card.selected i.tooltipped {
  color: #1971c2;
}
#dashboard #get-started-modal .use-case-container .card.selected .card-content b,
#dashboard #get-started-modal .use-case-container .card.selected i.tooltipped b {
  color: #263238;
}
#dashboard #get-started-modal .use-case-container .card.selected .tag {
  background: #1971c2;
  border-color: #1971c2;
  color: white;
}
#dashboard #get-started-modal .use-case-container .card.selected .card-bg-overlay {
  opacity: 0.9;
  background-image: linear-gradient(to bottom right, white, #eee, #b0bec5);
}
#dashboard #upgrade-wizard-modal {
  overflow: auto;
}
#dashboard #upgrade-wizard-modal h5.section-header {
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: #777;
}
#dashboard #upgrade-wizard-modal .step1 h5.section-header {
  font-size: 16px;
  margin-top: 15px;
}
#dashboard #upgrade-wizard-modal .step1 .form-container {
  margin-top: 20px;
}
#dashboard #upgrade-wizard-modal .step1 form#organization-info-upgrade-wizard {
  margin: 20px 0;
  max-width: 480px;
  display: inline-block;
}
#dashboard #upgrade-wizard-modal .step2 h5.section-header {
  font-size: 16px;
  margin-top: 40px;
}
#dashboard #upgrade-wizard-modal .step2 #plan-selector {
  max-width: 1000px;
  margin-top: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}
#dashboard #upgrade-wizard-modal .step2 #plan-selector .card .card-content {
  padding: 20px;
  height: auto;
}
#dashboard #upgrade-wizard-modal .step2 #plan-selector .card .card-content .plan-title {
  font-size: 18px;
  padding-bottom: 10px;
}
#dashboard #upgrade-wizard-modal .step2 #plan-selector .card .card-content .plan-price {
  color: #b0bec5;
  transition: 0.3s color;
  font-weight: bold;
}
#dashboard #upgrade-wizard-modal .step2 #plan-selector .card .card-content .plan-detail {
  color: #b0bec5;
}
#dashboard #upgrade-wizard-modal .step2 #plan-selector .card .chip.discount {
  position: absolute;
  right: -20px;
  top: -28px;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  color: white;
  background: #aaa;
  padding: 10px 0;
  transition: 0.3s background;
  font-size: 0.9rem;
  font-weight: bold;
}
#dashboard #upgrade-wizard-modal .step2 #plan-selector .card.selected .chip.discount {
  background: #1971c2;
}
#dashboard #upgrade-wizard-modal .step2 .vat-notice {
  color: #fc954f;
  font-weight: bold;
}
#dashboard #upgrade-wizard-modal .step2 .plan-details-container {
  max-width: 600px;
  margin: 40px auto;
}
#dashboard #upgrade-wizard-modal .step2 .plan-details-container .license-count-container {
  margin-bottom: 30px;
}
#dashboard #upgrade-wizard-modal .step2 .plan-details-container .license-count-container .input-field {
  max-width: 150px;
  margin: 0 auto;
  float: none;
}
#dashboard #upgrade-wizard-modal .step2 .plan-details-container .price-estimate {
  margin-bottom: 15px;
  margin-top: 10px;
  color: #263238;
  font-weight: bold;
}
#dashboard #upgrade-wizard-modal .step2 .plan-details-container .price-estimate .monthly-estimate {
  font-weight: normal;
  color: #b0bec5;
}
#dashboard #upgrade-wizard-modal .step3#payment-step {
  max-width: 480px;
  margin: 20px auto;
}
#dashboard #upgrade-wizard-modal .step3#payment-step h5.section-header {
  margin-bottom: 80px;
  font-size: 15px;
}
#dashboard #upgrade-wizard-modal .step3#payment-step form#payment-info-form .input-field label {
  left: 0;
}
#dashboard #upgrade-wizard-modal .step3#payment-step form#payment-info-form .input-field label i.secure {
  vertical-align: sub;
  font-size: 1.5em;
  margin-right: 5px;
  margin-left: -2px;
}
#dashboard #upgrade-wizard-modal .step3#payment-step form#payment-info-form #card-element {
  border-bottom: 1px solid #ccc;
  padding: 15px 0;
}
#dashboard #upgrade-wizard-modal .step3#payment-step form#payment-info-form .action-container {
  margin-top: 2.5rem;
}
@media screen and (max-width: 420px) {
  #dashboard #get-started-modal .step1 .logo.get-started,
  #dashboard #upgrade-wizard-modal .step1 .logo.get-started {
    margin: 20px auto;
    margin-top: 40px;
  }
}
@media screen and (max-width: 650px) {
  #dashboard #get-started-modal .step2,
  #dashboard #upgrade-wizard-modal .step2 {
    width: 100%;
  }
  #dashboard #get-started-modal .step2 .card,
  #dashboard #upgrade-wizard-modal .step2 .card {
    width: 100%;
    max-width: inherit;
  }
}
@media screen and (max-width: 800px) {
  #dashboard #get-started-modal .bs-wizard > .bs-wizard-step .bs-wizard-info,
  #dashboard #upgrade-wizard-modal .bs-wizard > .bs-wizard-step .bs-wizard-info {
    display: none;
  }
}
@media screen and (max-width: 865px) {
  #dashboard #get-started-modal .step2 {
    width: 100%;
  }
  #dashboard #get-started-modal .step2 .use-case-container .card {
    margin: 0;
  }
  #dashboard #upgrade-wizard-modal .step2 {
    width: 100%;
  }
  #dashboard #upgrade-wizard-modal .step2 #plan-selector {
    flex-wrap: wrap;
  }
}
#dashboard .page {
  display: none;
  padding: 2rem 5%;
  margin: auto;
}
#dashboard .page .breadcrumb-container {
  margin-left: 0.75rem;
  font-weight: 500;
  color: #aaa;
}
#dashboard .page .breadcrumb-container a {
  color: #aaa;
}
#dashboard .page .breadcrumb-container a:hover {
  color: #263238;
}
#dashboard .page .breadcrumb-container i {
  vertical-align: middle;
}
#dashboard .page .dim-text {
  color: #b0bec5;
}
#dashboard .page .dim-text b {
  color: #263238;
}
#dashboard .page .header {
  margin-bottom: 30px;
}
#dashboard .page .header h4 {
  font-size: 2.2rem;
  line-height: 1.2em;
  font-weight: 600;
  letter-spacing: -0.5px;
  color: #263238;
}
#dashboard .page .header h4.settings {
  font-size: 2rem;
  display: inline-block;
}
#dashboard .page .header h4.subheader.plan-name {
  margin-top: 0;
}
#dashboard .page .header h4 i {
  font-size: 2.2rem;
  vertical-align: bottom;
}
#dashboard .page .header h4 i.info {
  color: #aaa;
  cursor: pointer;
  margin-left: 5px;
}
#dashboard .page .header h4 i.info:hover {
  color: #1971c2;
}
#dashboard .page .header #upgrade-button {
  height: 40px;
  line-height: 40px;
  padding: 0 20px;
  font-size: 14px;
  margin-top: 15px;
}
#dashboard .page .progress-container {
  text-align: left;
  font-size: 17px;
  color: #777;
}
#dashboard .page .progress-container .number {
  font-weight: bold;
}
#dashboard .page .progress-container .progress {
  height: 7px;
  border-radius: 7px;
  background: #acecce;
}
#dashboard .page .progress-container .progress .determinate {
  background: #43a047;
}
#dashboard .page .progress-container .full .determinate {
  background: #fe7e7c;
}
#dashboard .page .plan-usage {
  padding-top: 10px;
}
#dashboard .page .plan-usage h5 {
  font-size: 15px;
  text-transform: uppercase;
  color: #b0bec5;
  font-weight: bold;
  letter-spacing: 0.8px;
  margin-bottom: 10px;
}
#dashboard .page .plan-usage .user-license-container,
#dashboard .page .plan-usage .board-container,
#dashboard .page .plan-usage .workflow-row {
  padding: 10px 0;
}
#dashboard .page.payment_status .status-container {
  max-width: 520px;
  margin: 0 auto;
  text-align: center;
}
#dashboard .page.payment_status .status-container i {
  margin: 30px 0;
  font-size: 120px;
  color: #777;
}
#dashboard .page.payment_status .status-container i.ok {
  color: #43a047;
}
#dashboard .page.payment_status .status-container .title {
  font-size: 2.5rem;
  font-weight: 600;
  letter-spacing: -0.5px;
  color: #777;
  margin-bottom: 2rem;
}
#dashboard .page.payment_status .status-container .details {
  text-align: left;
  margin-bottom: 3rem;
}
#dashboard .page.preferences .searchable-container.select2 .select2-container,
#dashboard #create-board-modal .searchable-container.select2 .select2-container,
#dashboard #create-customer-group-modal .searchable-container.select2 .select2-container,
#dashboard #archive-customer-modal .searchable-container.select2 .select2-container {
  margin: 8px 0;
}
#dashboard .page.preferences .searchable-container.select2 .select2-container .select2-selection--single,
#dashboard #create-board-modal .searchable-container.select2 .select2-container .select2-selection--single,
#dashboard #create-customer-group-modal .searchable-container.select2 .select2-container .select2-selection--single,
#dashboard #archive-customer-modal .searchable-container.select2 .select2-container .select2-selection--single {
  height: 45px;
  border-radius: 8px;
  border: 1px solid #eee;
}
#dashboard .page.preferences .searchable-container.select2 .select2-container .select2-selection--single .select2-selection__rendered,
#dashboard #create-board-modal .searchable-container.select2 .select2-container .select2-selection--single .select2-selection__rendered,
#dashboard #create-customer-group-modal .searchable-container.select2 .select2-container .select2-selection--single .select2-selection__rendered,
#dashboard #archive-customer-modal .searchable-container.select2 .select2-container .select2-selection--single .select2-selection__rendered {
  line-height: 45px;
}
#dashboard .page.preferences .searchable-container.select2 .select2-container .select2-selection--single .select2-selection__arrow,
#dashboard #create-board-modal .searchable-container.select2 .select2-container .select2-selection--single .select2-selection__arrow,
#dashboard #create-customer-group-modal .searchable-container.select2 .select2-container .select2-selection--single .select2-selection__arrow,
#dashboard #archive-customer-modal .searchable-container.select2 .select2-container .select2-selection--single .select2-selection__arrow {
  height: 43px;
  right: 5px;
}
#dashboard .page.preferences .select2-container,
#dashboard #create-board-modal .select2-container,
#dashboard #create-customer-group-modal .select2-container,
#dashboard #archive-customer-modal .select2-container {
  margin: 8px 0;
}
#dashboard .page.preferences .select2-container .select2-dropdown,
#dashboard #create-board-modal .select2-container .select2-dropdown,
#dashboard #create-customer-group-modal .select2-container .select2-dropdown,
#dashboard #archive-customer-modal .select2-container .select2-dropdown {
  border: 1px solid #eee;
  border-radius: 8px;
}
#dashboard .page.preferences .select2-container .select2-search input.select2-search__field,
#dashboard #create-board-modal .select2-container .select2-search input.select2-search__field,
#dashboard #create-customer-group-modal .select2-container .select2-search input.select2-search__field,
#dashboard #archive-customer-modal .select2-container .select2-search input.select2-search__field {
  border-radius: 8px;
  border: 1px solid #eee;
}
#dashboard .page.preferences .select2-container .select2-search input.select2-search__field:focus,
#dashboard #create-board-modal .select2-container .select2-search input.select2-search__field:focus,
#dashboard #create-customer-group-modal .select2-container .select2-search input.select2-search__field:focus,
#dashboard #archive-customer-modal .select2-container .select2-search input.select2-search__field:focus {
  box-shadow: #1971c2 0px 0px 3px 0px;
  border-bottom: 1px solid #eee;
}
#dashboard .page.preferences .select2-container .select2-results > .select2-results__options,
#dashboard #create-board-modal .select2-container .select2-results > .select2-results__options,
#dashboard #create-customer-group-modal .select2-container .select2-results > .select2-results__options,
#dashboard #archive-customer-modal .select2-container .select2-results > .select2-results__options {
  max-height: 300px !important;
}
#dashboard .page.preferences .select2-container .select2-results__option,
#dashboard #create-board-modal .select2-container .select2-results__option,
#dashboard #create-customer-group-modal .select2-container .select2-results__option,
#dashboard #archive-customer-modal .select2-container .select2-results__option {
  text-align: left;
}
#dashboard .page.preferences .select2-container .select2-results__option .option-container div,
#dashboard #create-board-modal .select2-container .select2-results__option .option-container div,
#dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container div,
#dashboard #archive-customer-modal .select2-container .select2-results__option .option-container div {
  display: inline-block;
}
#dashboard .page.preferences .select2-container .select2-results__option .option-container .text-container,
#dashboard #create-board-modal .select2-container .select2-results__option .option-container .text-container,
#dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container .text-container,
#dashboard #archive-customer-modal .select2-container .select2-results__option .option-container .text-container {
  max-width: calc(100% - 45px);
  max-width: -webkit-calc(100% - 45px);
  max-width: -moz-calc(100% - 45px);
  max-height: 66px;
  overflow: hidden;
  padding-top: 4px;
  padding-right: 8px;
}
#dashboard .page.preferences .select2-container .select2-results__option .option-container .text-container .name,
#dashboard #create-board-modal .select2-container .select2-results__option .option-container .text-container .name,
#dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container .text-container .name,
#dashboard #archive-customer-modal .select2-container .select2-results__option .option-container .text-container .name {
  color: #263238;
  font-weight: bold;
}
#dashboard .page.preferences .select2-container .select2-results__option .option-container .text-container .description,
#dashboard #create-board-modal .select2-container .select2-results__option .option-container .text-container .description,
#dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container .text-container .description,
#dashboard #archive-customer-modal .select2-container .select2-results__option .option-container .text-container .description {
  color: #b0bec5;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 0.9em;
}
#dashboard .page.preferences .select2-container .select2-results__option .option-container .logo-container,
#dashboard #create-board-modal .select2-container .select2-results__option .option-container .logo-container,
#dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container .logo-container,
#dashboard #archive-customer-modal .select2-container .select2-results__option .option-container .logo-container {
  float: right;
  padding-top: 15px;
}
#dashboard .page.preferences .select2-container .select2-results__option .option-container .logo-container.one-liner,
#dashboard #create-board-modal .select2-container .select2-results__option .option-container .logo-container.one-liner,
#dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container .logo-container.one-liner,
#dashboard #archive-customer-modal .select2-container .select2-results__option .option-container .logo-container.one-liner {
  padding-top: 7px;
}
#dashboard .page.preferences .select2-container .select2-results__option .option-container .logo-container img.logo,
#dashboard #create-board-modal .select2-container .select2-results__option .option-container .logo-container img.logo,
#dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container .logo-container img.logo,
#dashboard #archive-customer-modal .select2-container .select2-results__option .option-container .logo-container img.logo {
  width: 40px;
  height: 40px;
  border-radius: 40px;
  object-fit: cover;
}
@media screen and (max-width: 649px) {
  #dashboard .page.preferences .select2-container .select2-results__option .option-container .text-container,
  #dashboard #create-board-modal .select2-container .select2-results__option .option-container .text-container,
  #dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container .text-container,
  #dashboard #archive-customer-modal .select2-container .select2-results__option .option-container .text-container {
    max-width: 400px;
  }
  #dashboard .page.preferences .select2-container .select2-results__option .option-container .logo-container,
  #dashboard #create-board-modal .select2-container .select2-results__option .option-container .logo-container,
  #dashboard #create-customer-group-modal .select2-container .select2-results__option .option-container .logo-container,
  #dashboard #archive-customer-modal .select2-container .select2-results__option .option-container .logo-container {
    display: none;
  }
}
#dashboard .page.preferences .select2-container .select2-results__option.select2-results__message,
#dashboard #create-board-modal .select2-container .select2-results__option.select2-results__message,
#dashboard #create-customer-group-modal .select2-container .select2-results__option.select2-results__message,
#dashboard #archive-customer-modal .select2-container .select2-results__option.select2-results__message {
  color: #b0bec5;
}
#dashboard .page.preferences .select2-container .select2-results__option.select2-results__option--selected,
#dashboard #create-board-modal .select2-container .select2-results__option.select2-results__option--selected,
#dashboard #create-customer-group-modal .select2-container .select2-results__option.select2-results__option--selected,
#dashboard #archive-customer-modal .select2-container .select2-results__option.select2-results__option--selected {
  background-color: #eee;
}
#dashboard .page.preferences .select2-container .select2-results__option.select2-results__option--highlighted.select2-results__option--selectable,
#dashboard #create-board-modal .select2-container .select2-results__option.select2-results__option--highlighted.select2-results__option--selectable,
#dashboard #create-customer-group-modal .select2-container .select2-results__option.select2-results__option--highlighted.select2-results__option--selectable,
#dashboard #archive-customer-modal .select2-container .select2-results__option.select2-results__option--highlighted.select2-results__option--selectable {
  background-color: #f5f5f5;
  border-radius: 8px;
}
#dashboard .page.preferences #notifications .notifications-info,
#dashboard .page.preferences #notifications .enable-notifications-row {
  color: #777;
}
#dashboard .page.preferences #notifications .notifications-enabled-for-user,
#dashboard .page.preferences #notifications .content {
  margin-top: 50px;
  margin-bottom: 50px;
}
#dashboard .page.preferences #notifications .no-boards-message,
#dashboard .page.preferences #notifications .all-notifications-disabled-text {
  color: #aaa;
  font-size: 1.2rem;
}
#dashboard .page.preferences #notifications .advanced-notifications-container .row {
  margin-bottom: 2rem;
}
#dashboard .page.preferences #notifications .advanced-notifications-collapsible-row {
  margin-top: 50px;
}
#dashboard .page.preferences #notifications .advanced-notifications-collapsible-row .advanced-notifications-collapsible {
  color: #9e9e9e;
  display: flex;
  cursor: pointer;
}
#dashboard .page.preferences #notifications .advanced-notifications-collapsible-row .advanced-notifications-collapsible:hover {
  color: #777;
}
#dashboard .page.preferences #notifications .toggle.open {
  transform: rotate(90deg);
}
#dashboard .page.preferences #notifications .switch .switch-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left: 0;
}
#dashboard .page.preferences #notifications .switch .switch-container .visible-label {
  font-size: 1rem;
  display: flex;
  align-items: center;
  gap: 5px;
  line-height: 17px;
}
#dashboard .page.preferences #notifications .switch .switch-container .visible-label i {
  font-size: 1.2rem;
}
#dashboard .page.preferences #notifications .switch .switch-container .lever {
  margin-right: 0;
}
#dashboard .page.preferences .searchable-container.select2 {
  text-align: left;
}
#dashboard .page.preferences .searchable-container.select2 label {
  position: inherit;
  top: inherit;
  left: inherit;
  display: flex;
  line-height: 15px;
  gap: 5px;
}
#dashboard .page.preferences .searchable-container.select2 i {
  font-size: 16px;
}
#dashboard .page.preferences .profile-picture-container .profile-picture {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 6rem;
  width: 6rem;
  border-radius: 6rem;
  margin: 0.5rem 0;
  text-align: center;
  cursor: pointer;
}
#dashboard .page.preferences .profile-picture-container .profile-picture:hover {
  color: #1161b3;
}
#dashboard .page.preferences .profile-picture-container .profile-picture .hidden {
  visibility: hidden;
}
#dashboard .page.preferences .profile-picture-container .profile-picture .profile-picture-overlay {
  background: rgba(249, 248, 248, 0.9);
  height: 6rem;
  width: 6rem;
  border-radius: 6rem;
  padding: 20px 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
#dashboard .page.preferences .profile-picture-container .profile-picture .profile-picture-overlay span {
  width: 60px;
  color: black;
  font-weight: 400;
  font-size: 14px;
}
#dashboard .page.preferences .profile-picture-container .profile-picture .profile-picture-overlay span:hover {
  color: unset;
}
#dashboard .page.preferences .profile-picture-container input[type='file']#profile_picture {
  display: none;
}
#dashboard .page.preferences .file-field {
  height: 7rem;
  padding-top: 3.9rem;
}
#dashboard .page.preferences .file-field .file-path-wrapper {
  display: none;
}
#dashboard .page.account .header,
#dashboard .page.preferences .header {
  margin-top: 20px;
}
#dashboard .page.account .sidenav-container,
#dashboard .page.preferences .sidenav-container {
  width: 240px;
  margin-top: 40px;
  float: left;
}
#dashboard .page.account .sidenav-container h5,
#dashboard .page.preferences .sidenav-container h5 {
  font-size: 0.8125em;
  text-transform: uppercase;
  color: #b0bec5;
  font-weight: 600;
  letter-spacing: 2px;
  margin-bottom: 20px;
}
#dashboard .page.account .sidenav-container .nav-link,
#dashboard .page.preferences .sidenav-container .nav-link {
  margin-bottom: 10px;
}
#dashboard .page.account .sidenav-container .nav-link a,
#dashboard .page.preferences .sidenav-container .nav-link a {
  color: #b0bec5;
  font-size: 1.05em;
  font-weight: 400;
}
#dashboard .page.account .sidenav-container .nav-link a i,
#dashboard .page.preferences .sidenav-container .nav-link a i {
  margin-right: 10px;
  font-size: 25px;
  vertical-align: bottom;
}
#dashboard .page.account .sidenav-container .nav-link a:hover,
#dashboard .page.preferences .sidenav-container .nav-link a:hover {
  color: #1161b3;
}
#dashboard .page.account .sidenav-container .nav-link a:hover i,
#dashboard .page.preferences .sidenav-container .nav-link a:hover i {
  color: #1161b3;
}
#dashboard .page.account .sidenav-container .nav-link.selected-section a,
#dashboard .page.preferences .sidenav-container .nav-link.selected-section a {
  font-weight: 600;
  color: #1971c2;
}
#dashboard .page.account .sidenav-container .nav-link.selected-section a i,
#dashboard .page.preferences .sidenav-container .nav-link.selected-section a i {
  color: #1971c2;
}
#dashboard .page.account .sidenav-container .spinner,
#dashboard .page.preferences .sidenav-container .spinner {
  position: relative;
  left: -3rem;
}
#dashboard .page.account .content-container,
#dashboard .page.preferences .content-container {
  display: inline-block;
  padding-top: 6px;
  text-align: left;
}
#dashboard .page.account .content-container .plan-info,
#dashboard .page.preferences .content-container .plan-info {
  background: white;
  padding: 25px;
  box-shadow: none;
  border: 2px solid #eee;
  border-radius: 8px;
  margin: 4rem 0;
}
#dashboard .page.account .content-container .plan-info .row:last-child,
#dashboard .page.preferences .content-container .plan-info .row:last-child {
  margin-bottom: 0;
}
#dashboard .page.account .content-container .plan-info .row:first-child,
#dashboard .page.preferences .content-container .plan-info .row:first-child {
  margin-top: 10px;
}
#dashboard .page.account .content-container .plan-info .license-count-exceeded,
#dashboard .page.preferences .content-container .plan-info .license-count-exceeded {
  margin-top: 30px;
}
#dashboard .page.account .content-container .plan-info .icon-container,
#dashboard .page.preferences .content-container .plan-info .icon-container {
  display: inline-block;
  vertical-align: middle;
}
#dashboard .page.account .content-container .plan-info .icon-container i,
#dashboard .page.preferences .content-container .plan-info .icon-container i {
  color: #777;
}
#dashboard .page.account .content-container .plan-info .value-container,
#dashboard .page.preferences .content-container .plan-info .value-container {
  display: inline-block;
  color: #777;
  font-weight: bold;
  margin-left: 10px;
}
#dashboard .page.account .content-container .plan-info .value-container .label,
#dashboard .page.preferences .content-container .plan-info .value-container .label {
  min-width: 100px;
  display: inline-block;
  font-weight: normal;
}
#dashboard .page.account .content-container .plan-info .value-container .value,
#dashboard .page.preferences .content-container .plan-info .value-container .value {
  font-size: 1.1em;
  color: #263238;
}
#dashboard .page.account .content-container .plan-info .contract-type,
#dashboard .page.preferences .content-container .plan-info .contract-type {
  font-weight: bold;
  color: #b0bec5;
  padding-top: 5px;
  margin-bottom: 5px;
}
#dashboard .page.account .content-container .plan-info .text-container,
#dashboard .page.preferences .content-container .plan-info .text-container {
  font-weight: normal;
}
#dashboard .page.account .content-container .plan-info .contract-renewal,
#dashboard .page.preferences .content-container .plan-info .contract-renewal {
  color: #b0bec5;
}
#dashboard .page.account .content-container .plan-info.free .plan-name i,
#dashboard .page.preferences .content-container .plan-info.free .plan-name i {
  vertical-align: bottom;
  margin-left: 8px;
}
#dashboard .page.account .content-container .plan-info.free .progress-container,
#dashboard .page.preferences .content-container .plan-info.free .progress-container {
  margin-bottom: 0.8rem;
}
#dashboard .page.account .content-container .plan-info.enterprise .progress-container,
#dashboard .page.preferences .content-container .plan-info.enterprise .progress-container {
  margin-top: 30px;
}
#dashboard .page.account .content-container .free-plan .action-container,
#dashboard .page.preferences .content-container .free-plan .action-container {
  margin-top: -1rem;
  margin-bottom: 2.5rem;
}
#dashboard .page.account .content-container .payment-failed,
#dashboard .page.preferences .content-container .payment-failed,
#dashboard .page.account .content-container .plan-exceeded,
#dashboard .page.preferences .content-container .plan-exceeded,
#dashboard .page.account .content-container .trial-info,
#dashboard .page.preferences .content-container .trial-info {
  text-align: left;
  margin-top: -1rem;
  margin-bottom: 3rem;
}
#dashboard .page.account .content-container .payment-failed .text-container,
#dashboard .page.preferences .content-container .payment-failed .text-container,
#dashboard .page.account .content-container .plan-exceeded .text-container,
#dashboard .page.preferences .content-container .plan-exceeded .text-container,
#dashboard .page.account .content-container .trial-info .text-container,
#dashboard .page.preferences .content-container .trial-info .text-container {
  display: block;
}
#dashboard .page.account .content-container .payment-failed .alert-icon-container,
#dashboard .page.preferences .content-container .payment-failed .alert-icon-container,
#dashboard .page.account .content-container .plan-exceeded .alert-icon-container,
#dashboard .page.preferences .content-container .plan-exceeded .alert-icon-container,
#dashboard .page.account .content-container .trial-info .alert-icon-container,
#dashboard .page.preferences .content-container .trial-info .alert-icon-container {
  height: 4rem;
  float: left;
  padding-right: 20px;
  padding-top: 8px;
}
#dashboard .page.account .content-container .payment-failed .alert-icon-container .icon-bg,
#dashboard .page.preferences .content-container .payment-failed .alert-icon-container .icon-bg,
#dashboard .page.account .content-container .plan-exceeded .alert-icon-container .icon-bg,
#dashboard .page.preferences .content-container .plan-exceeded .alert-icon-container .icon-bg,
#dashboard .page.account .content-container .trial-info .alert-icon-container .icon-bg,
#dashboard .page.preferences .content-container .trial-info .alert-icon-container .icon-bg {
  display: inline-block;
  background: #fc954f;
  color: white;
  width: 32px;
  height: 32px;
  border-radius: 32px;
  text-align: center;
  padding-top: 3px;
  padding-left: 1px;
}
#dashboard .page.account .content-container .payment-failed .alert-icon-container .icon-bg i,
#dashboard .page.preferences .content-container .payment-failed .alert-icon-container .icon-bg i,
#dashboard .page.account .content-container .plan-exceeded .alert-icon-container .icon-bg i,
#dashboard .page.preferences .content-container .plan-exceeded .alert-icon-container .icon-bg i,
#dashboard .page.account .content-container .trial-info .alert-icon-container .icon-bg i,
#dashboard .page.preferences .content-container .trial-info .alert-icon-container .icon-bg i {
  display: block;
  font-size: 26px;
}
#dashboard .page.account .content-container .payment-failed .action-container,
#dashboard .page.preferences .content-container .payment-failed .action-container,
#dashboard .page.account .content-container .plan-exceeded .action-container,
#dashboard .page.preferences .content-container .plan-exceeded .action-container,
#dashboard .page.account .content-container .trial-info .action-container,
#dashboard .page.preferences .content-container .trial-info .action-container {
  margin: 2rem 0;
}
#dashboard .page.account .content-container .account-tab,
#dashboard .page.preferences .content-container .account-tab,
#dashboard .page.account .content-container .preferences-tab,
#dashboard .page.preferences .content-container .preferences-tab {
  max-width: 500px;
  margin: 0 auto;
  margin-left: 75px;
}
#dashboard .page.account .content-container .account-tab.support,
#dashboard .page.preferences .content-container .account-tab.support,
#dashboard .page.account .content-container .preferences-tab.support,
#dashboard .page.preferences .content-container .preferences-tab.support {
  max-width: 800px;
}
#dashboard .page.account .content-container .account-tab.support #support-option-container,
#dashboard .page.preferences .content-container .account-tab.support #support-option-container,
#dashboard .page.account .content-container .preferences-tab.support #support-option-container,
#dashboard .page.preferences .content-container .preferences-tab.support #support-option-container {
  display: flex;
  align-items: start;
  flex-wrap: wrap;
  gap: 1rem;
  row-gap: 0;
}
#dashboard .page.account .content-container .account-tab.support .card,
#dashboard .page.preferences .content-container .account-tab.support .card,
#dashboard .page.account .content-container .preferences-tab.support .card,
#dashboard .page.preferences .content-container .preferences-tab.support .card {
  background: white;
  padding: 2rem 1.5rem;
  max-width: calc(49%);
  box-shadow: none;
  border: 2px solid #d9dfe3;
  border-radius: 12px;
  text-align: center;
}
#dashboard .page.account .content-container .account-tab.support .card .icon,
#dashboard .page.preferences .content-container .account-tab.support .card .icon,
#dashboard .page.account .content-container .preferences-tab.support .card .icon,
#dashboard .page.preferences .content-container .preferences-tab.support .card .icon {
  height: 50px;
  width: 50px;
}
#dashboard .page.account .content-container .account-tab.support .card .text-container,
#dashboard .page.preferences .content-container .account-tab.support .card .text-container,
#dashboard .page.account .content-container .preferences-tab.support .card .text-container,
#dashboard .page.preferences .content-container .preferences-tab.support .card .text-container {
  margin-top: 1.5rem;
  font-size: 0.9rem;
  color: #777;
}
#dashboard .page.account .content-container .account-tab.support .card .text-container h5,
#dashboard .page.preferences .content-container .account-tab.support .card .text-container h5,
#dashboard .page.account .content-container .preferences-tab.support .card .text-container h5,
#dashboard .page.preferences .content-container .preferences-tab.support .card .text-container h5 {
  font-weight: bold;
  font-size: 1.15rem;
  color: #31343e;
}
#dashboard .page.account .content-container .account-tab.support .card a.cta-link,
#dashboard .page.preferences .content-container .account-tab.support .card a.cta-link,
#dashboard .page.account .content-container .preferences-tab.support .card a.cta-link,
#dashboard .page.preferences .content-container .preferences-tab.support .card a.cta-link {
  margin-top: 1.5rem;
  display: inline-block;
  font-size: 1rem;
  color: #777;
  transition: 0.3s all;
}
#dashboard .page.account .content-container .account-tab.support .card a.cta-link:hover,
#dashboard .page.preferences .content-container .account-tab.support .card a.cta-link:hover,
#dashboard .page.account .content-container .preferences-tab.support .card a.cta-link:hover,
#dashboard .page.preferences .content-container .preferences-tab.support .card a.cta-link:hover {
  color: #1971c2;
}
#dashboard .page.account .content-container .account-tab.support #partner,
#dashboard .page.preferences .content-container .account-tab.support #partner,
#dashboard .page.account .content-container .preferences-tab.support #partner,
#dashboard .page.preferences .content-container .preferences-tab.support #partner {
  margin-top: 4rem;
}
#dashboard .page.account .content-container .account-tab.support #partner h5,
#dashboard .page.preferences .content-container .account-tab.support #partner h5,
#dashboard .page.account .content-container .preferences-tab.support #partner h5,
#dashboard .page.preferences .content-container .preferences-tab.support #partner h5 {
  color: #777;
  font-size: 1.1rem;
}
#dashboard .page.account .content-container .account-tab.support #partner p.dim-text,
#dashboard .page.preferences .content-container .account-tab.support #partner p.dim-text,
#dashboard .page.account .content-container .preferences-tab.support #partner p.dim-text,
#dashboard .page.preferences .content-container .preferences-tab.support #partner p.dim-text {
  font-size: 0.9rem;
}
#dashboard .page.account .content-container .col-header,
#dashboard .page.preferences .content-container .col-header {
  font-size: 1.2em;
  font-weight: bold;
  color: #777;
}
#dashboard .page.account .content-container .progress-container .user-row,
#dashboard .page.preferences .content-container .progress-container .user-row {
  margin: 10px 0;
}
#dashboard .page.account .content-container .progress-container .users,
#dashboard .page.preferences .content-container .progress-container .users {
  margin-left: 0.5rem;
}
#dashboard .page.account .content-container ul.dropdown-content,
#dashboard .page.preferences .content-container ul.dropdown-content {
  margin-top: 0.5rem;
}
#dashboard .page.account .content-container i.info-icon,
#dashboard .page.preferences .content-container i.info-icon {
  padding-left: 5px;
  font-size: 20px;
  vertical-align: bottom;
  cursor: pointer;
  transition: 0.3s all;
}
#dashboard .page.account .content-container i.info-icon:hover,
#dashboard .page.preferences .content-container i.info-icon:hover {
  color: #1cb5f2;
}
#dashboard .page.account .content-container .subheader,
#dashboard .page.preferences .content-container .subheader {
  color: #b0bec5;
  font-size: 1.1rem;
  font-weight: bold;
  padding: 5px;
  padding-left: 0;
}
#dashboard .page.account .content-container .subheader.plan-name,
#dashboard .page.preferences .content-container .subheader.plan-name {
  color: #777;
}
#dashboard .page.account .content-container .no-bottom-margin,
#dashboard .page.preferences .content-container .no-bottom-margin {
  margin-bottom: 0;
}
#dashboard .page.account .content-container .pricing,
#dashboard .page.preferences .content-container .pricing {
  margin-top: 70px;
  margin-bottom: 50px;
}
#dashboard .page.account .content-container .pricing h4.subheader,
#dashboard .page.preferences .content-container .pricing h4.subheader {
  color: #263238;
}
#dashboard .page.account .content-container .pricing .material-icons,
#dashboard .page.preferences .content-container .pricing .material-icons {
  color: #b0bec5;
}
#dashboard .page.account .content-container .pricing .price-container,
#dashboard .page.preferences .content-container .pricing .price-container {
  border-top: 2px solid #eee;
}
#dashboard .page.account .content-container .pricing .price,
#dashboard .page.preferences .content-container .pricing .price {
  padding: 8px 8px 8px 0;
  font-size: 1rem;
  color: #b0bec5;
  text-align: right;
  min-width: 100px;
}
#dashboard .page.account .content-container .pricing .header,
#dashboard .page.preferences .content-container .pricing .header {
  column-span: 2;
  font-weight: bold;
  padding-bottom: 0;
}
#dashboard .page.account .content-container .pricing .subtotal,
#dashboard .page.preferences .content-container .pricing .subtotal {
  border-top: 2px solid #eee;
}
#dashboard .page.account .content-container .pricing .total,
#dashboard .page.preferences .content-container .pricing .total {
  border-top: 2px solid #aaa;
}
#dashboard .page.account .content-container .pricing .price-row .price-primary,
#dashboard .page.preferences .content-container .pricing .price-row .price-primary {
  font-size: 1.2rem;
  font-weight: bold;
  display: table-cell;
  width: 100%;
}
#dashboard .page.account .content-container .pricing .price-row .dim-explanation,
#dashboard .page.preferences .content-container .pricing .price-row .dim-explanation {
  font-size: 1.1rem;
  color: #b0bec5;
}
#dashboard .page.account .content-container .pricing .price-row .sum,
#dashboard .page.preferences .content-container .pricing .price-row .sum {
  font-size: 1.2rem;
  display: table-cell;
  min-width: 80px;
  padding: 5px;
}
#dashboard .page.account .content-container .form-container,
#dashboard .page.preferences .content-container .form-container {
  margin-top: 30px;
}
#dashboard .page.account .content-container .form-container form .input-field,
#dashboard .page.preferences .content-container .form-container form .input-field {
  padding-left: 0;
}
#dashboard .page.account .content-container .form-container form .input-field label,
#dashboard .page.preferences .content-container .form-container form .input-field label {
  left: 0;
  right: 0;
}
#dashboard .page.account .content-container .form-container form button.save,
#dashboard .page.preferences .content-container .form-container form button.save {
  margin-top: 2rem;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method h5,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method h5 {
  margin-top: 40px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: #b0bec5;
  font-size: 14px;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info {
  max-width: 420px;
  margin-top: 2.5rem;
  padding: 1.5rem 0;
  box-shadow: none;
  border: 2px solid #eee;
  border-radius: 8px;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand,
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .details,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .details {
  display: inline-block;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand {
  margin-left: 20px;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon {
  margin-top: 10px;
  font-size: 45px;
  margin-right: 30px;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-visa,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-visa {
  color: #0050b9;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-mastercard,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-mastercard {
  color: #e35205;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-amex,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-amex {
  color: #1274b8;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-discover,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-discover {
  color: #ff6000;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-diners-club,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-diners-club {
  color: #0064a7;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-jcb,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .brand i.credit-card-icon.fa-cc-jcb {
  color: #008eed;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .card-info .details,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .card-info .details {
  margin-left: 10px;
  vertical-align: top;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .no-card-info,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .no-card-info {
  text-align: center;
  margin-top: 50px;
  color: #aaa;
  font-size: 16px;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .current-method .no-card-info i,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .current-method .no-card-info i {
  font-size: 50px;
  margin-bottom: 15px;
}
#dashboard .page.account .content-container .account-payment-info .payment-container .action-container,
#dashboard .page.preferences .content-container .account-payment-info .payment-container .action-container {
  margin-top: 40px;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices {
  margin-top: 70px;
  margin-bottom: 50px;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices h4.subheader,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices h4.subheader {
  color: #263238;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .material-icons,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .material-icons {
  color: #b0bec5;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .material-icons.button-icon,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .material-icons.button-icon {
  color: #b0bec5;
  font-size: 1.5rem;
  position: relative;
  top: -0.25rem;
  left: -0.25rem;
  transition: color 0.1s linear;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .toggle-header,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .toggle-header {
  padding-bottom: 1.2rem;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .toggle-header,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .toggle-header {
  cursor: pointer;
  text-align: center;
  font-weight: inherit;
  transition: color 0.2s linear;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .toggle-header:hover,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .toggle-header:hover {
  color: #27bffc;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .past-invoice,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .past-invoice {
  background-color: #fcfcfc;
  box-shadow: none;
  border-bottom: 2px #eee solid;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .past-invoice:last-child,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .past-invoice:last-child {
  border-bottom: none;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .past-invoice .invoice-header,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .past-invoice .invoice-header {
  padding-left: 0;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .past-invoice .invoice-header .emphasize,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .past-invoice .invoice-header .emphasize {
  font-weight: bold;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .past-invoice .price,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .past-invoice .price {
  position: relative;
  left: 2rem;
  text-align: right;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .past-invoice .invoice-download,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .past-invoice .invoice-download {
  font-size: 0.8rem;
  background-color: rgba(255, 255, 255, 0);
  width: 2.5rem;
  height: 2.5rem;
  position: relative;
  top: 0.5rem;
  left: 2.5rem;
  transition: background-color 0.2s linear;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .past-invoice .invoice-download:hover,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .past-invoice .invoice-download:hover {
  background-color: #ccc;
}
#dashboard .page.account .content-container .account-payment-info #past-invoices .past-invoice .invoice-download:hover i,
#dashboard .page.preferences .content-container .account-payment-info #past-invoices .past-invoice .invoice-download:hover i {
  color: #ffffff;
}
#dashboard .page.account .content-container .account-payment-info .loader-wrapper,
#dashboard .page.preferences .content-container .account-payment-info .loader-wrapper {
  position: relative;
  height: 8rem;
}
#dashboard .page.account .content-container .account-payment-info .loader,
#dashboard .page.preferences .content-container .account-payment-info .loader {
  top: 34%;
}
#dashboard .page.account .content-container .no-payment,
#dashboard .page.preferences .content-container .no-payment {
  padding-bottom: 1rem;
}
#dashboard .page.account form .switch,
#dashboard .page.preferences form .switch {
  margin-bottom: 2rem;
}
#dashboard .page.account form .switch .switch-container,
#dashboard .page.preferences form .switch .switch-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#dashboard .page.account form .switch .switch-container .visible-label,
#dashboard .page.preferences form .switch .switch-container .visible-label {
  font-size: 1rem;
}
#dashboard .page.account form .switch .switch-container .lever,
#dashboard .page.preferences form .switch .switch-container .lever {
  position: relative;
}
@media screen and (max-width: 1066px) {
  #dashboard .page.account .content-container .account-tab,
  #dashboard .page.preferences .content-container .account-tab,
  #dashboard .page.account .content-container .preferences-tab,
  #dashboard .page.preferences .content-container .preferences-tab {
    margin-left: 0;
  }
}
#dashboard #update-payment-modal {
  top: 20%;
  border-radius: 8px;
}
#dashboard #update-payment-modal h5 {
  font-size: 18px;
  font-weight: bold;
}
#dashboard #update-payment-modal #payment-form {
  max-width: 480px;
  margin: 60px auto 20px auto;
}
#dashboard #update-payment-modal #payment-form .input-field label {
  left: 0;
}
#dashboard #update-payment-modal #payment-form .input-field label i.secure {
  vertical-align: sub;
  font-size: 1.5em;
  margin-right: 5px;
}
#dashboard #update-payment-modal #payment-form #card-element {
  border-bottom: 1px solid #ccc;
  padding: 15px 0;
}
#dashboard #update-payment-modal #payment-form .action-container {
  margin-top: 2.5rem;
}
#dashboard .page.boards .header {
  margin-bottom: inherit;
  min-height: 55px;
}
#dashboard .page.boards .header h4 {
  margin-bottom: 0px;
}
#dashboard .page.boards #archived-boards {
  padding: 1.5rem 0;
}
#dashboard .page.boards .customer-group-header {
  margin: 0 0 0.5rem;
  padding-bottom: 5px;
}
#dashboard .page.boards .customer-group-header a,
#dashboard .page.boards .customer-group-header .header {
  color: #b0bec5;
  font-weight: bold;
}
#dashboard .page.boards .customer-group-header .header {
  font-size: 1.1rem;
}
#dashboard .page.boards .customer-group-header .header i {
  position: relative;
  right: -0.3rem;
  vertical-align: bottom;
  font-size: 1.9rem;
}
#dashboard .page.boards .customer-group-header a {
  font-size: 1.8rem;
}
#dashboard .page.boards .customer-group-header a:hover {
  color: #263238;
}
#dashboard .page.boards .customer-group-header .edit-customer-group {
  cursor: pointer;
  margin-left: 20px;
  color: #999;
  font-weight: 500;
  font-size: 1rem;
  display: none;
  text-transform: initial;
  letter-spacing: 0;
}
#dashboard .page.boards .customer-group-header .edit-customer-group i {
  margin-right: 5px;
}
#dashboard .page.boards .customer-group-header .edit-customer-group:hover {
  color: #263238;
}
#dashboard .page.boards .customer-group-header:hover .edit-customer-group {
  display: inline-block;
}
#dashboard .page.boards .customer-group {
  min-height: 50px;
  margin: 2rem 0;
}
#dashboard .page.boards .customers {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-auto-rows: max-content;
  column-gap: 40px;
  row-gap: 20px;
}
@media only screen and (min-width: 601px) {
  #dashboard .page.boards .customers {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 50px;
  }
}
@media only screen and (min-width: 993px) {
  #dashboard .page.boards .customers {
    grid-template-columns: repeat(4, 1fr);
    row-gap: 50px;
  }
}
@media only screen and (min-width: 601px) {
  #dashboard .page.boards .col.m4 {
    width: 32%;
    margin: 0.5%;
  }
}
@media only screen and (min-width: 993px) {
  #dashboard .page.boards .col.l3 {
    width: 23.5%;
    margin: 0.75%;
    padding: 0;
  }
  #dashboard .page.boards .col.l3:first-child {
    margin: 0;
  }
  #dashboard .page.boards .col.l3:last-child {
    margin: 0;
  }
}
#dashboard .page.boards .card {
  width: 100%;
  padding-top: 75%;
  min-height: 240px;
  border-radius: 12px;
  box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.15), 0 4px 15px 0 rgba(0, 0, 0, 0.1);
}
#dashboard .page.boards .card:hover {
  box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.2), 0 6px 18px 0 rgba(0, 0, 0, 0.1);
}
#dashboard .page.boards .card:hover .content {
  filter: brightness(1.08) saturate(1.1);
}
#dashboard .page.boards .card:hover .notifications {
  background-position: top left;
}
#dashboard .page.boards .card .notifications {
  position: absolute;
  right: -10px;
  top: -10px;
  width: 30px;
  height: 30px;
  border-radius: 30px;
  text-align: center;
  z-index: 1;
  background: linear-gradient(115deg, #f95a9a, #f24545);
  color: white;
  font-weight: 500;
  font-size: 0.9rem;
  display: inline-flex;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  overflow: hidden;
  background-position: bottom right;
  background-size: 150%;
  transition: 0.2s all;
}
#dashboard .page.boards .card .notifications .count-badge {
  float: right;
  position: relative;
  top: -10px;
}
#dashboard .page.boards .card .content {
  background: rgba(0, 0, 0, 0);
  /*Required on IE9 to make the whole card clickable*/
  transition: 0.2s all;
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
  background-size: cover;
  background-position: center;
  background-position-y: 42%;
  background-repeat: no-repeat;
}
#dashboard .page.boards .card .content a.board-link {
  padding: 1rem;
  color: white;
  display: table;
  width: 100%;
  height: 100%;
}
#dashboard .page.boards .card .content a.board-link .card-title {
  font-size: 1.5rem;
  font-weight: bold;
  color: white;
  padding-right: 15px;
}
@supports (-webkit-line-clamp: 2) {
  #dashboard .page.boards .card .content a.board-link .card-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: initial;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }
}
#dashboard .page.boards .card .content .bottom-bar {
  position: absolute;
  bottom: 0;
  font-size: 13px;
  background: white;
  color: #b0bec5;
  left: 0;
  right: 0;
  padding: 0 1rem;
  height: 45px;
  line-height: 45px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#dashboard .page.boards .card .content .bottom-bar .action-container {
  display: inline-flex;
}
#dashboard .page.boards .card .content .bottom-bar .action-container a {
  color: #b0bec5;
  display: inline-flex;
  cursor: pointer;
}
#dashboard .page.boards .card .content .bottom-bar .action-container a i {
  padding: 12px 5px;
}
#dashboard .page.boards .card .content .bottom-bar .action-container a:hover {
  color: #1161b3;
}
#dashboard .page.boards .card .content .bottom-bar .statistics-container {
  overflow: hidden;
  max-height: 45px;
}
#dashboard .page.boards .card .content .bottom-bar .statistic {
  display: inline-block;
  margin-right: 8px;
  margin-bottom: 5px;
  font-weight: 500;
}
#dashboard .page.boards .card .content .bottom-bar .statistic * {
  vertical-align: middle !important;
}
#dashboard .page.boards .card .content .bottom-bar .statistic .icon {
  font-size: 22px;
}
#dashboard .page.boards .card .content .bottom-bar .statistic.users .icon {
  font-size: 18px;
  margin-right: -2px;
}
#dashboard .page.boards .card .content .bottom-bar .statistic.items .icon {
  margin-right: -2px;
  margin-left: -2px;
}
#dashboard .page.boards .card .content .bottom-bar .statistic.comments .icon {
  font-size: 16px;
  margin-left: 2px;
  margin-top: -2px;
}
#dashboard .page.boards .card .content .bottom-bar .statistic.votes .icon {
  font-size: 14px;
  margin-left: 2px;
  margin-top: -2px;
}
#dashboard .page.boards .card.create {
  cursor: pointer;
}
#dashboard .page.boards .card.create .content .wrapper {
  display: table;
  width: 100%;
  height: 100%;
  text-align: center;
}
#dashboard .page.boards .card.create .content .wrapper .card-title {
  display: table-cell;
  vertical-align: middle;
  color: #b0bec5;
  font-size: 1rem;
  font-weight: bold;
  line-height: 2.5rem;
}
#dashboard .page.boards .card.create .content .wrapper .card-title .unlock {
  font-size: 4rem;
}
#dashboard .page.boards .card.create:hover .content .card-title {
  color: #758d9a;
}
@media screen and (min-width: 1680px) {
  #dashboard .page.boards .card .content a.board-link .card-title {
    font-size: 1.7rem;
  }
}
@media screen and (min-width: 1921px) {
  #dashboard .page.boards .card {
    padding-top: 67%;
  }
  #dashboard .page.boards .card .content a.board-link .card-title {
    font-size: 2rem;
  }
}
#dashboard .page.boards .empty-collection {
  padding-top: 1rem;
  color: #b0bec5;
}
/* MAIN UI */
#main-view-container {
  color: {{customer.roadmap_font_color}};
  position: absolute;
  width: 100%;
  min-width: 300px;
  height: 100%;
  overflow: hidden;
  /* CONTROL BAR HIGHLIGHT EFFECTS */
  /* STATUS DRAG & DROP */
  /* Bootstrap overrides */
}
#main-view-container .archived-overlay {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: rgba(10, 10, 10, 0.7);
  z-index: 9999;
  display: table;
  cursor: not-allowed;
}
#main-view-container .archived-overlay .content-wrapper {
  display: table-cell;
  vertical-align: middle;
  width: 200px;
  height: 200px;
  text-align: center;
}
#main-view-container .archived-overlay .content-wrapper .overlay-title {
  color: white;
  line-height: 2.5rem;
}
#main-view-container .archived-overlay .content-wrapper .overlay-title i {
  font-size: 5rem;
  font-weight: bold;
}
#main-view-container .archived-overlay .content-wrapper .overlay-content,
#main-view-container .archived-overlay .content-wrapper .overlay-return {
  color: white;
  font-size: 2rem;
  line-height: 2.5rem;
}
#main-view-container .archived-overlay .content-wrapper .overlay-content a,
#main-view-container .archived-overlay .content-wrapper .overlay-return a {
  color: #43a047;
}
#main-view-container .archived-overlay .content-wrapper .overlay-content a:hover,
#main-view-container .archived-overlay .content-wrapper .overlay-return a:hover {
  color: #2e7d32;
}
#main-view-container .archived-overlay .content-wrapper .overlay-content .section,
#main-view-container .archived-overlay .content-wrapper .overlay-return .section {
  padding-top: 1rem;
}
#main-view-container .fade-bar {
  position: absolute;
  z-index: 101;
  opacity: 1;
  max-height: 30%;
  width: 100%;
  pointer-events: none;
}
#main-view-container .fade-bar.top {
  top: 0;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1f1f1f+0,1f1f1f+50,1f1f1f+100&1+0,0.8+50,0+100 */
  background: -moz-linear-gradient(top, rgba(31, 31, 31, 0.3) 0%, rgba(31, 31, 31, 0) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(31, 31, 31, 0.3) 0%, rgba(31, 31, 31, 0) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(31, 31, 31, 0.3) 0%, rgba(31, 31, 31, 0) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
#main-view-container .fade-bar.bottom {
  bottom: 0;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1f1f1f+0,1f1f1f+50,1f1f1f+100&0+0,0.8+50,1+100 */
  background: -moz-linear-gradient(top, rgba(31, 31, 31, 0) 0%, rgba(31, 31, 31, 0.3) 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, rgba(31, 31, 31, 0) 0%, rgba(31, 31, 31, 0.3) 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, rgba(31, 31, 31, 0) 0%, rgba(31, 31, 31, 0.3) 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
#main-view-container .initial-load-icon {
  position: relative;
  left: 50%;
  top: 45%;
  color: #263238;
}
#main-view-container .control-bar-popover {
  white-space: pre-line !important;
  margin-left: -5px;
}
#main-view-container .item-popover .featured-image-container {
  padding-bottom: 10px;
  margin-top: -10px;
  margin-left: -15px;
  margin-right: -15px;
}
#main-view-container .item-popover .featured-image-container .featured-image {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  height: 120px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  background-color: #eee;
}
#main-view-container .item-popover .name {
  font-weight: bold;
}
#main-view-container .item-popover .description {
  margin-top: 5px;
  margin-bottom: 5px;
  color: #263238;
  font-size: 0.95em;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}
#main-view-container .item-popover .created {
  color: #b0bec5;
  font-size: 12px;
}
#main-view-container .item-popover .section {
  margin-top: 15px;
}
#main-view-container .item-popover .section .uppercase-header {
  color: #b0bec5;
}
#main-view-container .item-popover .creator {
  line-height: 20px;
}
#main-view-container .item-popover .creator .profile-picture {
  float: left;
  margin-right: 7px;
  width: 20px;
  height: 20px;
}
#main-view-container .dropdown.user-actions li i,
#main-view-container .dropdown.sorting li i {
  line-height: 1.4em;
  color: #555;
  font-size: 20px;
  vertical-align: middle;
  text-align: center;
  margin-right: 1rem;
}
#main-view-container .dropdown.user-actions li.active i,
#main-view-container .dropdown.sorting li.active i {
  color: #fff;
}
#main-view-container .dropdown.user-actions li.divider,
#main-view-container .dropdown.sorting li.divider {
  margin: 5px 0;
}
#main-view-container #control-bar {
  position: relative;
  width: 225px;
  background: white;
  border-right: 2px solid #d9dfe3;
  color: #263238;
  float: left;
  height: 100%;
}
#main-view-container #control-bar .popover {
  color: {{customer.roadmap_font_color}};
}
#main-view-container #control-bar .dropdown {
  height: 50px;
  padding: 0;
  margin: 15px 5px;
  border: 2px solid #d9dfe3;
  border-radius: 100px;
}
#main-view-container #control-bar .dropdown:hover {
  background: #f5f5f5;
}
#main-view-container #control-bar .dropdown .dropdown-toggle {
  padding: 3px;
  padding-right: 15px;
  line-height: 50px;
  height: 50px;
}
#main-view-container #control-bar .dropdown .dropdown-toggle .image {
  width: 40px;
  height: 40px;
}
#main-view-container #control-bar .dropdown .dropdown-toggle .name {
  max-width: 115px;
  line-height: 40px;
  color: #263238;
  font-weight: bold;
}
#main-view-container #control-bar .dropdown .dropdown-toggle i.fa {
  line-height: 40px;
}
#main-view-container #control-bar .dropdown .dropdown-menu {
  max-height: 400px;
  overflow-y: auto;
  min-width: 225px;
  position: fixed;
  top: 65px;
  left: 0;
}
#main-view-container #control-bar .dropdown .dropdown-menu li .name {
  line-height: 30px;
  height: 30px;
}
#main-view-container #control-bar .dropdown .dropdown-menu li .image {
  height: 30px;
  width: 30px;
}
#main-view-container #control-bar .dropdown .dropdown-menu li.boards a,
#main-view-container #control-bar .dropdown .dropdown-menu li.header a {
  color: #263238;
  font-weight: bold;
}
#main-view-container #control-bar .dropdown .dropdown-menu li.boards a i,
#main-view-container #control-bar .dropdown .dropdown-menu li.header a i,
#main-view-container #control-bar .dropdown .dropdown-menu li.boards a span,
#main-view-container #control-bar .dropdown .dropdown-menu li.header a span {
  vertical-align: middle;
}
#main-view-container #control-bar .dropdown .dropdown-menu li.boards a i,
#main-view-container #control-bar .dropdown .dropdown-menu li.header a i {
  font-size: 20px;
  margin-right: 5px;
}
#main-view-container #control-bar .dropdown .dropdown-menu li.header a {
  font-weight: 600;
  color: #777;
}
#main-view-container #control-bar .dropdown .dropdown-menu .customer-group-row a {
  color: #b0bec5;
  cursor: default;
  padding-top: 10px;
  padding-bottom: 5px;
  font-weight: 500;
  font-size: 12px;
}
#main-view-container #control-bar .dropdown .dropdown-menu .customer-group-row a:hover {
  background: inherit;
}
#main-view-container #control-bar .dropdown .dropdown-menu .customer-row a {
  padding-top: 5px;
  padding-bottom: 5px;
}
#main-view-container #control-bar .dropdown .dropdown-menu .customer-row a .name {
  padding-left: 15px;
}
#main-view-container #control-bar .dropdown .dropdown-menu .customer-row + .customer-group-row a {
  padding-top: 20px;
}
#main-view-container #control-bar .search-results {
  max-width: 300px;
}
#main-view-container #control-bar header.search + .search-container {
  margin-top: 0;
}
#main-view-container #control-bar .search-container {
  height: 35px;
  margin: 17px;
  margin-bottom: 0;
  position: relative;
}
#main-view-container #control-bar .search-container #search-text {
  z-index: 999;
  overflow: hidden;
  position: absolute;
  height: 100%;
  color: #555;
  white-space: nowrap;
  line-height: 35px;
  left: 30px;
  right: 30px;
  font-size: 0.9em;
}
#main-view-container #control-bar .search-container #search-text:focus {
  outline: 0;
  box-shadow: none;
}
#main-view-container #control-bar .search-container #search-text .tag {
  pointer-events: none;
}
#main-view-container #control-bar .search-container #search-text br {
  display: none;
}
#main-view-container #control-bar .search-container #search-text:empty:not(:focus):before {
  content: attr(data-placeholder);
  color: #b0bec5;
  position: inherit;
  pointer-events: none;
}
#main-view-container #control-bar .search-container .search-field {
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  background: white;
  border: 1px solid #ddd;
  border-radius: 100px;
  transition: none;
}
#main-view-container #control-bar .search-container #search-text:focus ~ .search-field,
#main-view-container #control-bar .search-container #search-text:not(:empty) ~ .search-field {
  background: #fff;
  border-color: {{customer.roadmap_highlight_color}};
}
#main-view-container #control-bar .search-container i {
  position: absolute;
  font-size: 1em;
  line-height: 35px;
  cursor: pointer;
}
#main-view-container #control-bar .search-container i.search {
  color: #b0bec5;
  left: 10px;
}
#main-view-container #control-bar .search-container i.clear {
  color: #aaa;
  display: none;
  right: 10px;
}
#main-view-container #control-bar .search-container i.clear:hover {
  color: #555;
}
#main-view-container #control-bar .search-container #search-text:not(:empty) ~ i.search {
  color: #555;
}
#main-view-container #control-bar .search-container #search-text:not(:empty) ~ i.clear {
  display: inline;
}
#main-view-container #control-bar .section.last {
  position: absolute;
  width: 100%;
  bottom: 90px;
}
#main-view-container #control-bar .section.categories-and-statuses-enabled .scrollable.categories {
  max-height: 60%;
}
#main-view-container #control-bar .section.categories-and-statuses-enabled .scrollable.statuses {
  max-height: 40%;
}
#main-view-container #control-bar .section .scrollable {
  max-height: 100%;
}
#main-view-container #control-bar .section header {
  width: 100%;
  padding: 0 20px;
  padding-top: 15px;
}
#main-view-container #control-bar .section header .uppercase-header {
  line-height: 25px;
  color: #b0bec5;
}
#main-view-container #control-bar .section header .clear {
  display: none;
  z-index: 99;
  position: relative;
  float: right;
  margin-left: 10px;
  cursor: pointer;
  border: 0;
  border-radius: 12px;
  padding: 0 6px;
  line-height: 18px;
  margin-top: 2px;
  font-size: 9px;
  font-weight: 500;
  background: #eee;
  color: #263238;
  transition: 0.2s all ease-in;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}
#main-view-container #control-bar .section header .clear:hover {
  background: {{customer.roadmap_highlight_color}};
  color: #ffffff;
}
#main-view-container #control-bar .section header.search {
  padding-top: 5px;
}
#main-view-container #control-bar .section header.advanced-filters {
  padding-top: 5px;
  line-height: 25px;
}
#main-view-container #control-bar .section header.advanced-filters .open {
  cursor: pointer;
}
@media screen and (max-height: 901px) {
  #main-view-container #control-bar .section header.advanced-filters .open {
    font-size: 0.9em;
  }
}
#main-view-container #control-bar .section header.advanced-filters .open.active {
  color: #263238;
  font-weight: 500;
}
#main-view-container #control-bar .section .info {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  float: right;
}
#main-view-container #control-bar .section .info .count-badge {
  background: {{customer.roadmap_highlight_color}};
  vertical-align: top;
  min-width: 18px;
  line-height: 18px;
  margin: 1px;
}
#main-view-container #control-bar .section [data-type='filter'] {
  position: relative;
  /* Scrollbar library overrides */
  /* CATEGORY AND STATUS FILTERS */
}
#main-view-container #control-bar .section [data-type='filter'] .mCSB_inside > .mCSB_container {
  margin-right: 0;
}
#main-view-container #control-bar .section [data-type='filter'] .mCSB_scrollTools {
  width: 12px;
  z-index: 999;
}
#main-view-container #control-bar .section [data-type='filter'] .mCSB_scrollTools .mCSB_draggerRail {
  background: none;
}
#main-view-container #control-bar .section [data-type='filter'] .fade-bar {
  width: 225px;
}
#main-view-container #control-bar .section [data-type='filter'] .fade-bar.top {
  background: linear-gradient(to top, rgba(255, 255, 255, 0.1) 0%, rgba(235, 235, 238, 0.4) 100%);
}
#main-view-container #control-bar .section [data-type='filter'] .fade-bar.bottom {
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.1) 0%, rgba(235, 235, 235, 0.4) 100%);
}
#main-view-container #control-bar .section [data-type='filter'] ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
#main-view-container #control-bar .section [data-type='filter'] ul li {
  cursor: pointer;
  position: relative;
  padding: 5px 20px;
  /* Apply the backround to cells instead of row due to chrome rendering issues */
}
@media screen and (max-height: 901px) {
  #main-view-container #control-bar .section [data-type='filter'] ul li {
    padding: 4px 20px;
    font-size: 0.9em;
  }
}
#main-view-container #control-bar .section [data-type='filter'] ul li.selected {
  background: #d9dfe3;
  color: #263238;
}
#main-view-container #control-bar .section [data-type='filter'] ul li .name {
  overflow: hidden;
  word-wrap: break-word;
}
#main-view-container #control-bar .section [data-type='filter'] ul li .info .hide-items {
  font-size: 18px;
  margin: 1px;
}
#main-view-container #control-bar .section [data-type='filter'] ul li .info .count-badge:not(.hidden) + .hide-items {
  display: none;
}
#main-view-container #control-bar .section [data-type='filter'].scrollable {
  border-top: 45px solid rgba(0, 0, 0, 0);
}
#main-view-container #control-bar .section [data-type='filter'].scrollable .indicator {
  background: #aaa;
  display: inline-block;
  position: absolute;
  z-index: 100;
}
#main-view-container #control-bar .section [data-type='filter'].categories .name {
  margin-left: 13px;
}
#main-view-container #control-bar .section [data-type='filter'].categories .indicator {
  width: 2px;
  top: 2px;
  bottom: 2px;
  transition: transform 0.25s linear;
}
#main-view-container #control-bar .section [data-type='filter'].categories ul li.selected .indicator {
  transform: scaleX(2);
}
#main-view-container #control-bar .section [data-type='filter'].statuses .name {
  margin-left: 15px;
}
#main-view-container #control-bar .section [data-type='filter'].statuses .indicator {
  margin-top: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  transform: scale(0.75);
  margin-left: -5px;
  transition: transform 0.25s linear;
}
#main-view-container #control-bar .section [data-type='filter'].statuses .line {
  z-index: 99;
  position: absolute;
  width: 2px;
  height: 100%;
  background: #aaa;
  margin-left: 2px;
  top: 9px;
}
#main-view-container #control-bar .section [data-type='filter'].statuses li.selected .indicator {
  transform: scale(1);
}
#main-view-container #control-bar .section [data-type='filter'].statuses [data-next-status-belongs-to-process='false'] .line {
  display: none;
}
#main-view-container #control-bar #switch-view {
  height: 35px;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border-top: 2px solid #d9dfe3;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
}
#main-view-container #control-bar #switch-view .view {
  width: 33.333%;
  float: left;
  cursor: pointer;
  text-align: center;
  height: 35px;
  background: white;
  transition: 0.2s all ease-in;
}
#main-view-container #control-bar #switch-view .view i {
  font-size: 24px;
  color: #b0bec5;
  /* Align vertically center */
  vertical-align: top;
  margin-top: 4px;
  transition: 0.2s all ease-in;
}
#main-view-container #control-bar #switch-view .view.active {
  background: #d9dfe3;
}
#main-view-container #control-bar #switch-view .view.active i {
  color: #263238;
}
#main-view-container #control-bar #switch-view .view:hover:not(.active) {
  background: {{customer.roadmap_highlight_color}};
}
#main-view-container #control-bar #switch-view .view:hover:not(.active) i {
  color: #ffffff;
}
#main-view-container #control-bar #switch-view.include-card-view .view {
  width: 25%;
}
#main-view-container #control-bar #action-links {
  line-height: 24px;
  position: absolute;
  bottom: 50px;
  font-weight: 500;
  width: 100%;
}
#main-view-container #control-bar #action-links a {
  color: #b0bec5;
  display: block;
  padding: 0 15px;
}
#main-view-container #control-bar #action-links a:hover {
  text-decoration: none;
  color: {{customer.roadmap_highlight_color}};
}
#main-view-container #control-bar #action-links a i {
  float: left;
  margin-right: 10px;
}
#main-view-container #control-bar #action-links #welcome-message-link * {
  color: {{customer.roadmap_highlight_color}};
}
@media screen and (min-height: 667px) {
  #main-view-container #control-bar .section.last {
    bottom: 120px;
  }
}
@media screen and (max-height: 666px) {
  #main-view-container #control-bar #action-links {
    display: none;
  }
  #main-view-container #control-bar .section.last {
    bottom: 35px;
  }
}
#main-view-container:not(.dragging-item) #control-bar .section header.advanced-filters:hover {
  color: {{customer.roadmap_highlight_color}};
}
#main-view-container:not(.dragging-item) #control-bar .section [data-type='filter'] ul li:hover {
  color: {{customer.roadmap_highlight_color}};
}
#main-view-container:not(.dragging-item) #control-bar .section [data-type='filter'] ul li:hover .indicator {
  background: {{customer.roadmap_highlight_color}};
}
#main-view-container:not(.dragging-item) #control-bar .section [data-type='filter'] ul li.selected {
  color: #263238;
}
#main-view-container:not(.dragging-item) #control-bar .section [data-type='filter'] ul li.selected .indicator {
  background: {{customer.roadmap_highlight_color}};
}
#main-view-container:not(.dragging-item) #control-bar .section [data-type='filter'].statuses li:hover .indicator {
  transform: scale(1);
}
#main-view-container:not(.dragging-item) #control-bar .section [data-type='filter'].categories li:hover .indicator {
  transform: scaleX(2);
}
#main-view-container.dragging-item .popover {
  max-width: 225px;
}
#main-view-container.dragging-item .item-popover {
  display: none !important;
}
#main-view-container.dragging-item #control-bar .header-statuses.droppable-statuses-found .uppercase-header {
  color: #263238;
}
#main-view-container.dragging-item #control-bar #status-selector {
  position: relative;
  z-index: 1;
  width: 275px;
  /* Hide scrollbar during dragging */
}
#main-view-container.dragging-item #control-bar #status-selector .mCSB_scrollTools {
  opacity: 0 !important;
}
#main-view-container.dragging-item #control-bar #status-selector .status {
  width: 225px;
}
#main-view-container.dragging-item #control-bar #status-selector .status.droppable {
  color: #263238;
}
#main-view-container.dragging-item #control-bar #status-selector .status.droppable .indicator {
  background: {{customer.roadmap_highlight_color}};
}
#main-view-container.dragging-item #control-bar #status-selector .status.droppable .drop-area {
  display: inline-block !important;
  position: absolute;
  width: 50px;
  right: -50px;
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  top: 0;
  height: 100%;
}
#main-view-container.dragging-item #control-bar #status-selector .status.droppable .drop-area i {
  color: {{customer.roadmap_navigation_font_color}};
  transform: rotate(90deg);
  font-size: 25px;
  line-height: 30px;
  margin-left: 8px;
}
#main-view-container.dragging-item #control-bar #status-selector .status.droppable.hovering-over {
  background: #dedede;
}
#main-view-container.dragging-item #control-bar #status-selector .status.droppable.hovering-over .indicator {
  transform: scale(1);
}
#main-view-container.dragging-item #control-bar #status-selector .status.droppable.hovering-over .drop-area {
  background: rgba(222, 222, 222, 0.7);
}
#main-view-container.dragging-item #control-bar #status-selector .status.droppable.hovering-over .drop-area i {
  color: #263238;
}
#main-view-container #top-bar {
  height: 50px;
  line-height: 50px;
  padding-right: 10px;
  color: {{customer.roadmap_navigation_font_color}};
}
#main-view-container #top-bar .create-item {
  line-height: 28px;
  float: left;
  cursor: pointer;
  padding: 2px 15px 2px 5px;
  margin: 8px;
  margin-top: 6px;
  margin-left: 20px;
  background-color: {{customer.roadmap_highlight_color}};
  border-color: {{customer.roadmap_highlight_color}};
  transition: 0.5s all;
}
#main-view-container #top-bar .create-item .action-text {
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  font-size: 0.8em;
  text-shadow: none;
  color: #ffffff;
}
#main-view-container #top-bar .create-item svg {
  float: left;
  overflow: visible;
  width: 30px;
  height: 30px;
  padding: 4px;
  margin-right: 2px;
}
#main-view-container #top-bar .create-item svg g {
  -moz-transform-origin: 15px 15px;
  -ms-transform-origin: 15px 15px;
  -o-transform-origin: 15px 15px;
  -webkit-transform-origin: 15px 15px;
  transform-origin: 15px 15px;
}
#main-view-container #top-bar .create-item svg g circle {
  fill: transparent;
}
#main-view-container #top-bar .create-item svg g text {
  font-family: FontAwesome;
  font-size: 15px;
  color: #ffffff;
  fill: #ffffff;
  text-shadow: none;
}
#main-view-container #top-bar .create-item:hover {
  background-color: {{customer.roadmap_highlight_hover_color}};
  border-color: {{customer.roadmap_highlight_hover_color}};
}
@keyframes bounce {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.7);
  }
  75% {
    transform: scale(1.3);
  }
  100% {
    transform: scale(1);
  }
}
#main-view-container #top-bar .create-item:hover g {
  animation: bounce 0.5s;
}
#main-view-container #top-bar .create-item:hover circle {
  transition: fill 0.5s;
  fill: transparent;
}
#main-view-container #top-bar .user-actions {
  display: none;
  padding: calc(9px);
  margin-left: 20px;
}
#main-view-container #top-bar .sort {
  margin-right: 5px;
  /* Visual placeholder for scrollbar */
  cursor: pointer;
  position: relative;
}
#main-view-container #top-bar .sort .sort-key {
  color: {{customer.roadmap_highlight_color}};
  font-weight: 500;
}
#main-view-container #top-bar .sort .icon {
  margin-right: 5px;
  color: #bbb;
  font-size: 20px;
  line-height: 26px;
  position: relative;
  top: 6px;
}
#main-view-container #top-bar .sort .icon.ascending {
  position: absolute;
  left: 0;
}
#main-view-container #top-bar .sort .icon.active {
  color: #263238;
}
#main-view-container #top-bar .sort .icon:hover {
  color: #333;
}
#main-view-container #top-bar .sort:hover .icon.active {
  color: #333;
}
#main-view-container #top-bar .cluster,
#main-view-container #top-bar .cluster-sort {
  margin-right: 5px;
  /* Visual placeholder for scrollbar */
  cursor: pointer;
  position: relative;
}
#main-view-container #top-bar .cluster .cluster-key,
#main-view-container #top-bar .cluster-sort .cluster-key,
#main-view-container #top-bar .cluster .cluster-sort-key,
#main-view-container #top-bar .cluster-sort .cluster-sort-key {
  color: {{customer.roadmap_highlight_color}};
  font-weight: bold;
}
#main-view-container #top-bar .cluster .icon,
#main-view-container #top-bar .cluster-sort .icon {
  margin-right: 5px;
  color: #bbb;
  font-size: 20px;
  line-height: 26px;
  position: relative;
  top: 6px;
}
#main-view-container #top-bar .cluster .icon.ascending,
#main-view-container #top-bar .cluster-sort .icon.ascending {
  position: absolute;
  left: 0;
}
#main-view-container #top-bar .cluster .icon.active,
#main-view-container #top-bar .cluster-sort .icon.active {
  color: #263238;
}
#main-view-container #top-bar .cluster .icon:hover,
#main-view-container #top-bar .cluster-sort .icon:hover {
  color: #333;
}
#main-view-container #top-bar .cluster:hover .icon.active,
#main-view-container #top-bar .cluster-sort:hover .icon.active {
  color: #333;
}
#main-view-container #top-bar .indicators {
  overflow: hidden;
  height: 50px;
  text-align: center;
  padding: 0 10px;
}
#main-view-container #top-bar .indicators .indicator {
  display: inline-block;
  margin: 5px 15px;
  line-height: 40px;
  font-size: 1.4rem;
  text-align: center;
  cursor: default;
}
#main-view-container #top-bar .indicators .indicator .count {
  float: left;
  font-size: 1.3em;
  vertical-align: sub;
}
#main-view-container #top-bar .indicators .indicator .count i {
  font-size: 2rem;
}
#main-view-container #top-bar .indicators .indicator .text {
  float: left;
  display: inline-block;
  margin-left: 5px;
  font-size: 10px;
  color: inherit;
  opacity: 0.6;
  font-weight: 500;
  letter-spacing: 0.3px;
}
#main-view-container #main-content {
  overflow: hidden;
  height: 100%;
  position: relative;
}
#main-view-container #main-content #side-bar {
  background: #fdfdfd;
  border-left: 1px solid #eee;
  position: absolute;
  width: 270px;
  top: 0;
  right: 0;
  bottom: 0;
}
#main-view-container #main-content #side-bar.closed {
  z-index: 10;
  transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
}
#main-view-container #main-content #side-bar.closed .toggle-sidebar {
  left: 0;
}
#main-view-container #main-content #side-bar.closed .toggle-sidebar .show-sidebar {
  display: block;
  transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
}
#main-view-container #main-content #side-bar.closed .toggle-sidebar .hide-sidebar {
  display: none;
}
#main-view-container #main-content #side-bar .show-sidebar {
  display: none;
}
#main-view-container #main-content #side-bar .toggle-sidebar {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: -8px;
  transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  cursor: pointer;
  color: #ccc;
}
#main-view-container #main-content #side-bar .toggle-sidebar i {
  padding: 0 5px;
  position: relative;
  font-size: 28px;
}
#main-view-container #main-content #side-bar .toggle-sidebar i::before {
  color: #fff;
  content: '\f0da';
  font-size: 42px;
  margin-left: -2px;
}
#main-view-container #main-content #side-bar .toggle-sidebar i::after {
  content: '\f0da';
  position: absolute;
  left: 5px;
  top: 7px;
}
#main-view-container #main-content #side-bar .toggle-sidebar i.show-sidebar {
  padding-right: 12px;
  /* Space for scrollbar */
}
#main-view-container #main-content #side-bar .toggle-sidebar i.show-sidebar::before {
  content: '\f0d9';
  margin-left: -3px;
}
#main-view-container #main-content #side-bar .toggle-sidebar i.show-sidebar::after {
  content: '\f0d9';
}
#main-view-container #main-content #side-bar .toggle-sidebar:hover {
  color: #999;
}
#main-view-container #main-content #side-bar .dropdown {
  height: 50px;
  padding: 9px 1rem;
}
#main-view-container #main-content #side-bar .dropdown.user-actions {
  border-bottom: 1px solid #eee;
}
#main-view-container #main-content #side-bar .dropdown.view-selector {
  padding: 18px 1rem 0 1rem;
}
#main-view-container #main-content #side-bar .dropdown.view-selector .dropdown-toggle {
  text-align: center;
  color: #263238;
}
#main-view-container #main-content #side-bar .dropdown.view-selector .dropdown-toggle .chevron {
  float: none;
}
#main-view-container #main-content #side-bar .side-bar-content {
  position: absolute;
  top: 50px;
  bottom: 0;
  left: 0;
  right: 0;
}
#main-view-container #main-content #side-bar .side-bar-content table {
  height: 100%;
  width: 100%;
  /* HEADERS */
  /* LEADERBOARD */
  /* NEWS FEED */
  /* POWERED BY */
}
#main-view-container #main-content #side-bar .side-bar-content table tr.header .uppercase-header {
  color: #999;
  font-weight: 500;
  letter-spacing: 0.5px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr.header td {
  padding: 15px 0 8px 0;
}
#main-view-container #main-content #side-bar .side-bar-content table tr.header td .time-period {
  color: #b0bec4;
  font-size: 12px;
  margin-top: 3px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#leaderboard {
  height: 192px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#leaderboard.current-user-is-not-visible-by-default {
  height: 217px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#leaderboard.top-3-only {
  height: 144px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#leaderboard.top-3-only.current-user-is-not-visible-by-default {
  height: 169px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#leaderboard .separator {
  position: sticky;
  bottom: 48px;
  background: #fdfdfd;
  padding: 0;
  padding-left: 57px;
  line-height: 25px;
  font-size: 10px;
  letter-spacing: 1px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#news-feed {
  height: 100%;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#news-feed .separator {
  text-align: center;
  position: relative;
  margin: 10px 0 15px 0;
  padding: 0;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#news-feed .separator:first-child {
  display: none;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#news-feed .separator .uppercase-header {
  display: inline;
  position: relative;
  z-index: 1;
  padding: 0 5px;
  background: white;
  color: #b0bec4;
  font-size: 11px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#news-feed .separator::after {
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 15px;
  right: 15px;
  background: #eee;
  height: 1px;
  content: '';
}
#main-view-container #main-content #side-bar .side-bar-content table tr#powered-link {
  height: 80px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#powered-link a {
  font-weight: bold;
  color: #b0bec5;
  text-align: center;
  width: 100%;
  overflow: hidden;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#powered-link a img.powered-logo {
  vertical-align: middle;
  height: 2.2em;
  opacity: 0.6;
  margin-bottom: 2px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#powered-link a .logo-wrapper {
  line-height: 80px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#powered-link a .logo-wrapper * {
  line-height: 80px;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#powered-link a.custom {
  line-height: 0;
}
#main-view-container #main-content #side-bar .side-bar-content table tr#powered-link a.custom .logo-wrapper {
  width: 100%;
  height: 0;
  padding-bottom: 30%;
  /* 10:3 aspect ratio */
}
#main-view-container #main-content #side-bar .side-bar-content table tr#powered-link a.custom img.powered-logo {
  width: 100%;
  height: auto;
  opacity: 1;
}
#main-view-container #main-content #side-bar .side-bar-content table td {
  position: relative;
  background: #fdfdfd;
  /* For tutorial */
  vertical-align: top;
  padding: 0;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget {
  height: 100%;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul {
  list-style: none;
  margin: 0;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner) {
  display: inline-block;
  width: 100%;
  padding: 10px 10px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner) .name {
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).data-unavailable {
  user-select: none;
  text-align: center;
  margin-top: 25px;
  color: #b0bec4;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).data-unavailable i {
  margin-right: 7px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).data-unavailable.some-data-available {
  margin-top: 10px;
  font-size: 12px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).data-unavailable .info {
  margin-top: 8px;
  font-size: 13px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).data-unavailable .info p {
  padding: 5px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news {
  position: relative;
  cursor: pointer;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news:hover {
  background: #f5f5f5;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .icon-wrapper {
  position: absolute;
  left: 29px;
  margin-top: -4px;
  background: #b0bec5;
  text-align: center;
  width: 23px;
  height: 23px;
  border-radius: 50%;
  border: 1px solid #fff;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .icon-wrapper .icon {
  color: #fff;
  font-size: 14px;
  padding-top: 4px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .icon-wrapper .icon.fa-comments {
  padding-top: 3px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .icon-wrapper .icon.fa-paper-plane {
  font-size: 12px;
  padding-right: 1px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .profile-picture {
  float: left;
  margin-top: 10px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .news-header {
  display: table-row;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .content-wrapper {
  overflow: hidden;
  padding-left: 15px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .content-wrapper time {
  color: #b0bec4;
  font-size: 0.8em;
  line-height: 20px;
  height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).news .content-wrapper .content {
  font-size: 12px;
  line-height: 17px;
  word-wrap: break-word;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).leaderboard-position {
  padding: 5px 10px;
  height: 48px;
  /* Current user */
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).leaderboard-position.current-user {
  position: sticky;
  bottom: 0;
  background: #f5f5f5;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).leaderboard-position .image {
  float: right;
  margin-top: 3px;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).leaderboard-position .rank-container {
  width: 47px;
  padding-right: 10px;
  line-height: 38px;
  text-align: center;
  font-weight: bold;
  float: left;
  color: {{customer.roadmap_highlight_color}};
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).leaderboard-position .content-container {
  font-size: 1em;
  margin-left: 2.5em;
}
#main-view-container #main-content #side-bar .side-bar-content table td .widget ul li:not(.spinner).leaderboard-position .content-container .points {
  font-size: 13px;
  cursor: default;
}
#main-view-container #main-content #item-container {
  position: absolute;
  top: 0px;
  bottom: 0;
  left: 0;
  right: 270px;
  background: #f9fbfd;
  /* List view design */
  /* Prevent scrollbar when loading first batch of items */
}
#main-view-container #main-content #item-container.list-view #top-bar,
#main-view-container #main-content #item-container.kanban-view #top-bar {
  background: white;
  border-bottom: 2px solid #d9dfe3;
  color: inherit;
}
#main-view-container #main-content #item-container.list-view.with-background #top-bar,
#main-view-container #main-content #item-container.kanban-view.with-background #top-bar {
  background: transparent;
  border: 0;
  color: {{customer.roadmap_navigation_font_color}} !important;
}
#main-view-container #main-content #item-container.list-view {
  background: #f9fbfd;
}
#main-view-container #main-content #item-container.list-view .baron.main {
  top: 70px !important;
}
#main-view-container #main-content #item-container.list-view .baron.main #items {
  /* Override width attributes set by baron to enable card design */
  width: auto !important;
  min-width: initial !important;
  max-width: initial !important;
  scrollbar-width: none;
  /* Hide scrollbar on Firefox */
  position: absolute;
  top: 0;
  left: 24px;
  right: 24px;
  bottom: 0;
}
#main-view-container #main-content #item-container.list-view .baron:hover .baron__bar .handle {
  opacity: 0.4;
}
#main-view-container #main-content #item-container.no-items .no-data {
  display: block;
}
#main-view-container #main-content #item-container .spinner:first-child {
  position: absolute;
  width: 100%;
}
#main-view-container #main-content #item-container.with-background {
  background-size: cover;
  background-position: center;
}
#main-view-container #main-content #item-container.with-background .baron.main:hover .baron__bar .handle {
  opacity: 0.6;
}
#main-view-container #main-content #item-container.with-background .baron.main .baron__bar .handle {
  border: 1px solid #fff;
  box-sizing: content-box;
}
#main-view-container #main-content #item-container.with-background .no-data {
  background: rgba(0, 0, 0, 0.6);
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
}
#main-view-container #main-content #item-container.with-background .no-data .message {
  color: #fff;
}
#main-view-container #main-content #item-container.with-background .no-data svg {
  fill: #fff;
}
#main-view-container #main-content #item-container .no-data {
  display: none;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 55%;
  min-width: 200px;
  max-width: 500px;
  margin: 0 !important;
  padding: 20px;
  border-radius: 12px;
  font-size: 16px;
  line-height: 25px;
  transform: translate(-50%, -75%);
  -ms-transform: translate(-50%, -75%);
  -o-transform: translate(-50%, -75%);
  -webkit-transform: translate(-50%, -75%);
  -moz-transform: translate(-50%, -75%);
}
#main-view-container #main-content #item-container .no-data a {
  color: #1971c2;
}
#main-view-container #main-content #item-container .no-data .bubbles {
  height: 100px;
  width: 100px;
}
#main-view-container #main-content #item-container .baron.main {
  top: 50px;
}
#main-view-container #main-content #item-container .baron #items {
  /* Sticky positioning (not on IE) */
}
#main-view-container #main-content #item-container .baron #items .scale.line {
  fill: {{customer.roadmap_scale_font_color}};
  opacity: 0.75;
}
#main-view-container #main-content #item-container .baron #items .scale.text {
  fill: {{customer.roadmap_scale_font_color}};
  font-size: 25px;
  font-weight: 300;
  letter-spacing: 5px;
  text-anchor: end;
  user-select: none;
}
#main-view-container #main-content #item-container .baron #items .scale.text.number {
  font-size: 30px;
}
@supports not (-ms-high-contrast: none) {
  #main-view-container #main-content #item-container .baron #items.horizontally-scrolled table {
    /* Add vertical separator after sticky columns */
  }
  #main-view-container #main-content #item-container .baron #items.horizontally-scrolled table th.name::after,
  #main-view-container #main-content #item-container .baron #items.horizontally-scrolled table td.name::after {
    display: inline-block;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    background: #f5f5f5;
    width: 1px;
    content: '';
  }
}
#main-view-container #main-content #item-container .baron #items table {
  margin-bottom: 24px;
  background: white;
  transform: 0.3s all;
  border-radius: 12px;
}
#main-view-container #main-content #item-container .baron #items table tr:first-child th:first-child {
  border-top-left-radius: 12px;
}
#main-view-container #main-content #item-container .baron #items table tr:first-child th:last-child {
  border-top-right-radius: 12px;
}
#main-view-container #main-content #item-container .baron #items table tr:last-child td:first-child {
  border-bottom-left-radius: 12px;
}
#main-view-container #main-content #item-container .baron #items table tr:last-child td::before {
  background: none;
}
#main-view-container #main-content #item-container .baron #items table tr:last-child td:last-child {
  border-bottom-right-radius: 12px;
}
#main-view-container #main-content #item-container .baron #items table tr.item-list-view-element {
  cursor: pointer;
  /* Hover highlight */
}
#main-view-container #main-content #item-container .baron #items table tr.item-list-view-element[hide-animated-element='true'] .indicator {
  opacity: 0;
}
#main-view-container #main-content #item-container .baron #items table tr.item-list-view-element td {
  transform: 0.3s all;
}
#main-view-container #main-content #item-container .baron #items table tr.item-list-view-element:hover td {
  background: #f5f5f5;
}
#main-view-container #main-content #item-container .baron #items table tr.item-list-view-element:hover td span.idea-badge {
  background: #f5f5f5;
}
#main-view-container #main-content #item-container .baron #items table tr.item-list-view-element .featured-image {
  border: solid;
  height: 50px;
  width: 50px;
  background-color: #eee;
}
#main-view-container #main-content #item-container .baron #items table tr td,
#main-view-container #main-content #item-container .baron #items table tr th {
  padding: 15px;
  /* Sticky positioning (not on IE) */
}
#main-view-container #main-content #item-container .baron #items table tr td::before,
#main-view-container #main-content #item-container .baron #items table tr th::before {
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  background: #f5f5f5;
  height: 1px;
  content: '';
}
#main-view-container #main-content #item-container .baron #items table tr td:first-child,
#main-view-container #main-content #item-container .baron #items table tr th:first-child {
  padding-left: 60px;
  padding-right: 0;
}
#main-view-container #main-content #item-container .baron #items table tr td:last-child,
#main-view-container #main-content #item-container .baron #items table tr th:last-child {
  padding-right: 40px;
}
#main-view-container #main-content #item-container .baron #items table tr td.name,
#main-view-container #main-content #item-container .baron #items table tr th.name {
  padding-left: 0;
  font-weight: 500;
}
@supports not (-ms-high-contrast: none) {
  #main-view-container #main-content #item-container .baron #items table tr td:first-child,
  #main-view-container #main-content #item-container .baron #items table tr th:first-child,
  #main-view-container #main-content #item-container .baron #items table tr td.name,
  #main-view-container #main-content #item-container .baron #items table tr th.name {
    position: sticky;
    z-index: 6;
    left: 0;
  }
  #main-view-container #main-content #item-container .baron #items table tr td:first-child.name,
  #main-view-container #main-content #item-container .baron #items table tr th:first-child.name,
  #main-view-container #main-content #item-container .baron #items table tr td.name.name,
  #main-view-container #main-content #item-container .baron #items table tr th.name.name {
    left: 60px;
  }
}
#main-view-container #main-content #item-container .baron #items table tr th {
  background: #f9fbfd;
  font-weight: 500;
  color: #777;
  letter-spacing: 0.5px;
  position: sticky;
  top: 0;
  z-index: 5;
  /* Sticky positioning (not on IE) */
}
@supports not (-ms-high-contrast: none) {
  #main-view-container #main-content #item-container .baron #items table tr th:first-child,
  #main-view-container #main-content #item-container .baron #items table tr th.name {
    z-index: 7;
  }
}
#main-view-container #main-content #item-container .baron #items table tr th[data-sort-key] {
  cursor: pointer;
}
#main-view-container #main-content #item-container .baron #items table tr th[data-sort-key].active,
#main-view-container #main-content #item-container .baron #items table tr th[data-sort-key]:hover {
  color: {{customer.roadmap_highlight_color}};
}
#main-view-container #main-content #item-container .baron #items table tr th[data-sort-key] .icon:not(.active) {
  display: none;
}
#main-view-container #main-content #item-container .baron #items table tr td {
  position: relative;
  /* Sticky positioning (not on IE) */
}
#main-view-container #main-content #item-container .baron #items table tr td.creator-profile-picture,
#main-view-container #main-content #item-container .baron #items table tr td.number {
  text-align: center;
}
@supports not (-ms-high-contrast: none) {
  #main-view-container #main-content #item-container .baron #items table tr td:first-child,
  #main-view-container #main-content #item-container .baron #items table tr td.name {
    background: white;
  }
}
#main-view-container #main-content #item-container .baron #items table tr td .indicator {
  position: absolute;
  border-radius: 50%;
  width: 13px;
  height: 13px;
  left: 50%;
  -o-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}
#main-view-container #main-content #item-container .baron #items table tr td .indicator.enlarged {
  width: 18px;
  height: 18px;
}
#main-view-container #main-content #item-container .baron #items table tr td .indicator.new {
  box-sizing: content-box;
  text-align: center;
  width: 24px;
  height: 24px;
  margin-top: -17px;
  margin-left: 12px;
}
#main-view-container #main-content #item-container .baron #items table tr td .indicator.new i {
  color: white;
  font-size: 13px;
  padding-top: calc(5.5px);
}
#main-view-container #main-content #item-container .baron #items table tr td .indicator.new i.fa-comments {
  margin-top: -1px;
}
#main-view-container #main-content #item-container .baron #items table tr td:not(.name) {
  font-size: 13px;
}
#main-view-container #main-content #item-container .baron #items table tr td.status .status-progress-bar .point.active,
#main-view-container #main-content #item-container .baron #items table tr td.status .status-progress-bar .connector.active {
  background: {{customer.roadmap_highlight_color}};
}
#main-view-container #main-content #item-container .baron #items svg.items {
  width: 100%;
  padding: 1rem;
  overflow: visible;
}
#main-view-container #main-content #item-container .baron #items svg.items .item-view[hide-animated-element='true'] {
  opacity: 0;
}
#main-view-container #main-content #item-container .baron #items svg.items .item-view * {
  cursor: pointer;
}
#main-view-container #main-content #item-container .baron #items svg.items .item-view text {
  color: {{customer.roadmap_item_font_color}};
}
#main-view-container #main-content #item-container .baron #items svg.items .item-view .indicator text {
  display: inline-block;
  font-family: FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#main-view-container #main-content #item-container #notification {
  position: fixed;
  top: 50%;
  transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  width: 50%;
  right: 25%;
  left: 25%;
  z-index: 1010;
  display: none;
  opacity: 0;
  max-height: 95%;
  overflow-y: auto;
  overflow-x: hidden;
}
#main-view-container #main-content #item-container #notification .wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  max-height: 100%;
}
#main-view-container #main-content #item-container #notification .wrapper a.close-notification {
  float: right;
  color: #b0bec5;
  text-decoration: none;
  cursor: pointer;
  font-size: 1.5rem;
  margin-left: 10px;
}
#main-view-container #main-content #item-container #notification .wrapper a.close-notification:hover {
  color: {{customer.roadmap_font_color}};
}
#main-view-container #main-content #item-container #notification .wrapper > * {
  display: table-cell;
  vertical-align: top;
  padding: 20px;
}
#main-view-container #main-content #item-container #notification .wrapper .icon-wrapper {
  background: {{customer.roadmap_highlight_color}};
  vertical-align: middle;
}
#main-view-container #main-content #item-container #notification .wrapper .icon-wrapper i {
  color: #ffffff;
  margin: 0 10px;
}
#main-view-container #main-content #item-container #notification .wrapper .content {
  line-height: 22px;
  width: 100%;
  position: relative;
  padding: 30px;
}
#main-view-container #main-content #item-container #notification .wrapper .content .message {
  text-align: left;
  word-break: break-word;
  white-space: pre-wrap;
  font-size: 1.05em;
}
#main-view-container #main-content #item-container #notification .wrapper .content header {
  display: block;
  font-weight: 600;
  font-size: 1.8em;
  line-height: 1;
  letter-spacing: -0.3px;
}
#main-view-container #main-content #item-container #notification .wrapper .content header:not(:empty) + .message {
  margin-top: 20px;
}
#main-view-container #main-content #item-container #notification .wrapper .content .attachments {
  position: relative;
  width: 100%;
  display: table;
  table-layout: fixed;
}
#main-view-container #main-content #item-container #notification .wrapper .content .attachments .row {
  display: table-row;
}
#main-view-container #main-content #item-container #notification .wrapper .content .attachments .attachment {
  display: table-cell;
  max-width: 100%;
  height: auto;
  margin: auto;
  margin-top: 20px;
}
#main-view-container #main-content #item-container #notification .wrapper .content .attachments .attachment-file {
  display: block;
  max-width: 100%;
  height: auto;
  margin: auto;
  margin-top: 5px;
}
#main-view-container #main-content #item-container #notification .wrapper .footer {
  text-align: right;
  margin-top: 20px;
}
#main-view-container #main-content #item-container #notification .wrapper .footer .btn {
  display: inline-block;
  border-radius: 0px;
  color: {{customer.roadmap_font_color}};
  vertical-align: bottom;
  text-decoration: none;
  line-height: 32px;
  padding: 0px 15px;
  background: #eee;
  color: #777;
}
#main-view-container #main-content #item-container #notification .wrapper .footer .btn i {
  font-size: 18px;
  vertical-align: middle;
}
#main-view-container #main-content #item-container #notification .wrapper .footer .btn:hover {
  background: #d5d5d5;
  color: #5e5e5e;
}
#main-view-container #main-content #item-container #notification .wrapper .footer .start-tutorial {
  margin-right: 5px;
}
#main-view-container #main-content #item-container #notification .wrapper .footer .check-btn {
  padding: 0px 2rem;
  background: {{customer.roadmap_highlight_color}};
  color: #ffffff;
}
#main-view-container #main-content #item-container #notification .wrapper .footer .check-btn i {
  margin-left: -5px;
  margin-right: 2px;
}
#main-view-container #main-content #item-container #notification .wrapper .footer .check-btn:hover {
  background: {{customer.roadmap_highlight_hover_color}};
  color: #ffffff;
}
#main-view-container button.btn,
#main-view-container .input-group input {
  border-radius: 0;
  vertical-align: initial;
}
/* IDV */
.item-detail-view {
  position: absolute;
  overflow: hidden;
  top: 0;
  bottom: 0;
  width: 100%;
  color: {{customer.roadmap_font_color}};
}
.item-detail-view.moderation-pending #circle-container,
.item-detail-view.moderation-pending #content-wrapper {
  filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -webkit-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
}
.item-detail-view .uppercase-header {
  font-size: 13px;
}
.item-detail-view .header-extra-content {
  margin-right: 10px;
  float: right;
}
.item-detail-view #circle-container {
  box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.15), 0 4px 15px 0 rgba(0, 0, 0, 0.1);
}
.item-detail-view #circle-container .idv-header-container {
  height: 35%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-left: 30px;
  padding-right: 30px;
  color: #ffffff;
}
.item-detail-view #circle-container .idv-footer-container {
  height: 65%;
  padding-left: 50px;
  padding-right: 50px;
}
.item-detail-view .lightbox-container {
  height: 15%;
}
.item-detail-view .lightbox-container .lightbox-trigger {
  transition: 0.3s all;
  color: #ddd;
  cursor: pointer;
  padding-top: 10px;
  margin-right: -28px;
}
.item-detail-view .lightbox-container .lightbox-trigger:hover {
  color: #aaa;
}
.item-detail-view .creator-and-date-container {
  display: flex;
  gap: 15px;
  position: relative;
  color: #ddd;
}
.item-detail-view .creator-and-date-container .creator-name {
  display: flex;
  align-items: center;
  gap: 10px;
}
.item-detail-view .creator-and-date-container .creator-name .profile-picture {
  max-height: 35px;
  max-width: 35px;
}
.item-detail-view .creator-and-date-container .date {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-left: 20px;
}
.item-detail-view .creator-and-date-container .date .date-icon {
  font-size: 18px;
}
.item-detail-view .tags-container {
  height: 5%;
  width: 100%;
  text-align: center;
  margin-top: 15px;
}
.item-detail-view .actions {
  height: 10%;
}
.item-detail-view .close-button {
  background: white;
  color: black;
  border-radius: 50%;
  display: block;
  position: relative;
}
.item-detail-view .close-button .close-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  font-size: 100%;
  transform: translate(-50%, -50%) rotate(45deg);
  -moz-transform: translate(-50%, -50%) rotate(45deg);
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  -ms-transform: translate(-50%, -50%) rotate(45deg);
  -o-transform: translate(-50%, -50%) rotate(45deg);
}
.item-detail-view .close-button:hover {
  color: #444;
}
.item-detail-view .state {
  height: 10%;
  display: flex;
  align-items: center;
}
.item-detail-view .state.moderation-pending {
  color: #fc954f;
}
.item-detail-view .popover {
  width: 100%;
  border: 1px solid;
  border-color: #eee;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 8px 0 rgba(0, 0, 0, 0.05);
}
.item-detail-view .popover-content {
  max-height: 350px;
  overflow-y: auto;
  white-space: pre-line;
}
.item-detail-view .name-container {
  height: 30%;
}
.item-detail-view .name-container .name {
  font-weight: bold;
}
.item-detail-view .baron._scrollbar .description-container {
  padding-right: 10px;
}
.item-detail-view .description-container {
  white-space: normal;
  word-wrap: break-word;
  overflow-y: auto;
  margin-right: 25px;
  position: relative;
  scrollbar-width: none;
  /* Firefox */
  height: 75%;
  word-break: break-word;
}
.item-detail-view .description-container .baron__scroller {
  padding-right: 10px;
}
.item-detail-view .description-container::-webkit-scrollbar {
  display: none;
  /* Safari and Chrome */
}
.item-detail-view .description-container * {
  max-width: 100%;
}
.item-detail-view .description-container img {
  height: auto;
}
.item-detail-view .description-container h1 {
  font-size: 36px;
}
.item-detail-view .description-container h2,
.item-detail-view .description-container h3 {
  margin-top: 5px;
}
.item-detail-view .description-container iframe {
  border: none;
}
.item-detail-view .vote-container {
  color: #b0bec5;
  display: inline-block;
  height: 25%;
}
.item-detail-view .vote-container.featured-image {
  color: #eee;
}
.item-detail-view .vote-container .popover {
  width: auto;
}
.item-detail-view .vote-container #vote-count {
  -webkit-font-smoothing: antialiased;
}
.item-detail-view .vote-container i {
  margin-left: 7px;
}
.item-detail-view .vote-container .vote-button {
  -webkit-font-smoothing: antialiased;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.item-detail-view .vote-container .vote-button.clickable {
  cursor: pointer;
}
.item-detail-view .vote-container .vote-button.clickable:hover {
  color: #263238;
}
.item-detail-view .vote-container .vote-button.clickable.featured-image:hover {
  color: #aaa;
}
.item-detail-view .vote-container.voted {
  color: #15a9ff;
}
.item-detail-view .vote-container.voted .vote-button.clickable:hover {
  color: #15a9ff;
  -o-filter: brightness(0.8);
  -ms-filter: brightness(0.8);
  -moz-filter: brightness(0.8);
  -webkit-filter: brightness(0.8);
  filter: brightness(0.8);
}
.item-detail-view .actions .btn,
.item-detail-view .lightbox-container .btn {
  position: relative;
  border-radius: 50%;
  padding: 0;
  margin-left: 7px;
  color: #ffffff;
  background: #b0bec5;
  transition: 0.3s all;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
.item-detail-view .actions .btn.favorite.active .fa,
.item-detail-view .lightbox-container .btn.favorite.active .fa {
  color: #fbd224;
}
.item-detail-view .actions .btn:hover,
.item-detail-view .lightbox-container .btn:hover {
  background: #758e9a;
  box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.15), 0 4px 15px 0 rgba(0, 0, 0, 0.1);
}
.item-detail-view .actions .social-sharing,
.item-detail-view .lightbox-container .social-sharing {
  display: none;
  padding-bottom: 100%;
  position: absolute;
  bottom: 15%;
  left: -4px;
  z-index: 10000;
}
.item-detail-view .actions .social-sharing .share-square,
.item-detail-view .lightbox-container .social-sharing .share-square {
  margin: 0;
  margin-left: -1px;
  border-radius: 0;
}
.item-detail-view .actions .social-sharing .share-square:first-child,
.item-detail-view .lightbox-container .social-sharing .share-square:first-child {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}
.item-detail-view .actions .social-sharing .share-square:last-child,
.item-detail-view .lightbox-container .social-sharing .share-square:last-child {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}
.item-detail-view .actions .social-sharing .share-square:before,
.item-detail-view .lightbox-container .social-sharing .share-square:before {
  vertical-align: middle;
}
.item-detail-view .actions .social-sharing .share-square-yammer,
.item-detail-view .lightbox-container .social-sharing .share-square-yammer {
  background: #106ebe;
  color: #ffffff;
  position: relative;
}
.item-detail-view .actions .social-sharing .share-square.teams-share-button,
.item-detail-view .lightbox-container .social-sharing .share-square.teams-share-button {
  background: #6264a7;
}
.item-detail-view .actions .social-sharing .share-square.teams-share-button:hover,
.item-detail-view .lightbox-container .social-sharing .share-square.teams-share-button:hover {
  background: #5a5c99;
}
.item-detail-view .actions .social-sharing .share-square.teams-share-button a,
.item-detail-view .lightbox-container .social-sharing .share-square.teams-share-button a {
  display: inline-block;
  width: 100%;
  height: 100%;
}
.item-detail-view .actions .social-sharing .share-square.teams-share-button img,
.item-detail-view .lightbox-container .social-sharing .share-square.teams-share-button img {
  filter: brightness(1.7) grayscale(1);
  transition: 0.3s all;
}
.item-detail-view .actions .social-sharing .share-square.teams-share-button img:hover,
.item-detail-view .lightbox-container .social-sharing .share-square.teams-share-button img:hover {
  filter: brightness(1.4);
}
.item-detail-view .actions .social-sharing .share-square-yammer:before,
.item-detail-view .lightbox-container .social-sharing .share-square-yammer:before {
  content: '.';
  opacity: 0;
}
.item-detail-view .actions .social-sharing .share-logo-yammer,
.item-detail-view .lightbox-container .social-sharing .share-logo-yammer {
  width: 100%;
  height: 100%;
  transition: 0.3s all;
  background: url('data:image/svg+xml;charset=utf-8;base64,PHN2ZyBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiI+DQo8cGF0aCBkPSJNOCAwQzEyLjQxODMgMCAxNiAzLjU4MTcyIDE2IDhMMTYgMThIMFY4QzAgMy41ODE3MiAzLjU4MTcyIDAgOCAwWiIgZmlsbD0idXJsKCNwYWludDBfbGluZWFyXzEzNF8xNDg3ODEpIi8+DQo8cGF0aCBkPSJNMjQgMEMxOS41ODE3IDAgMTYgMy41ODE3MiAxNiA4TDE2IDE4SDMyVjhDMzIgMy41ODE3MiAyOC40MTgzIDAgMjQgMFoiIGZpbGw9InVybCgjcGFpbnQxX2xpbmVhcl8xMzRfMTQ4NzgxKSIvPg0KPHBhdGggZD0iTTI0IDEzQzI0IDguNTgxNzIgMjAuNDE4MyA1IDE2IDVDMTEuNTgxNyA1IDggOC41ODE3MiA4IDEzQzggMTcuNDE4MyAxMS41ODE3IDIxIDE2IDIxQzIwLjQxODMgMjEgMjQgMTcuNDE4MyAyNCAxM1oiIGZpbGw9InVybCgjcGFpbnQyX2xpbmVhcl8xMzRfMTQ4NzgxKSIvPg0KPHBhdGggZD0iTTMxLjk5ODMgNy44MzIwM0gzMS45OTM3QzMxLjgwMDkgMTIuOTExNSAyNi45Njg5IDE3IDIyIDE3QzE3LjU4MTcgMTcgMTQgMjAuMzU3OSAxNCAyNC41QzE0IDI4LjY0MjEgMTcuNTgxNyAzMiAyMiAzMkMyMi4wNzY0IDMyIDIyLjE1MjYgMzEuOTk5IDIyLjIyODYgMzEuOTk3VjMyQzMwLjQ1NzEgMzIgMzIgMjQuMTQ1OCAzMiAyMC41VjhDMzIgNy45NDM4NyAzMS45OTk0IDcuODg3ODggMzEuOTk4MyA3LjgzMjAzWiIgZmlsbD0idXJsKCNwYWludDNfbGluZWFyXzEzNF8xNDg3ODEpIi8+DQo8cGF0aCBkPSJNMCA4VjIwLjVDMCAyNC4xNDU4IDEuNTQyODYgMzIgOS43NzE0MyAzMlYzMS45OTdDOS44NDczNiAzMS45OTkgOS45MjM1NSAzMiAxMCAzMkMxNC40MTgzIDMyIDE4IDI4LjY0MjEgMTggMjQuNUMxOCAyMC4zNTc5IDE0LjQxODMgMTcgMTAgMTdDNS4wMzEwNSAxNyAwLjE5OTEyOSAxMi45MTE1IDAuMDA2MjkzMTcgNy44MzIwM0gwLjAwMTcyODM1QzAuMDAwNTc3OTkzIDcuODg3ODggMCA3Ljk0Mzg3IDAgOFoiIGZpbGw9InVybCgjcGFpbnQ0X2xpbmVhcl8xMzRfMTQ4NzgxKSIvPg0KPGRlZnM+DQo8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MF9saW5lYXJfMTM0XzE0ODc4MSIgeDE9IjMiIHkxPSIxNS42NjY3IiB4Mj0iNi41MjMwMSIgeTI9Ii0xLjAyODMyIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+DQo8c3RvcCBzdG9wLWNvbG9yPSIjMDUzMzc3Ii8+DQo8c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMyRjkxRjIiLz4NCjwvbGluZWFyR3JhZGllbnQ+DQo8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50MV9saW5lYXJfMTM0XzE0ODc4MSIgeDE9IjI2LjY4MDUiIHkxPSIyLjQ3NzMxIiB4Mj0iMTguNjY2NyIgeTI9IjE0LjUiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj4NCjxzdG9wIHN0b3AtY29sb3I9IiM0QUMxRkYiLz4NCjxzdG9wIG9mZnNldD0iMC45MjY2MzIiIHN0b3AtY29sb3I9IiMxNTVFQjUiLz4NCjwvbGluZWFyR3JhZGllbnQ+DQo8bGluZWFyR3JhZGllbnQgaWQ9InBhaW50Ml9saW5lYXJfMTM0XzE0ODc4MSIgeDE9IjEzLjgzMzMiIHkxPSI3LjE2NjY3IiB4Mj0iMjEuNjY2NyIgeTI9IjIyLjY2NjciIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIj4NCjxzdG9wIHN0b3AtY29sb3I9IiM5NkRGRkYiLz4NCjxzdG9wIG9mZnNldD0iMC40MTM0MzkiIHN0b3AtY29sb3I9IiM1M0FERUUiLz4NCjxzdG9wIG9mZnNldD0iMSIgc3RvcC1jb2xvcj0iIzAwNkJCOSIvPg0KPC9saW5lYXJHcmFkaWVudD4NCjxsaW5lYXJHcmFkaWVudCBpZD0icGFpbnQzX2xpbmVhcl8xMzRfMTQ4NzgxIiB4MT0iMTkuNzczNiIgeTE9IjE5LjQxOTQiIHgyPSIyOC4xMTMiIHkyPSIzMy42Nzc1IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+DQo8c3RvcCBvZmZzZXQ9IjAuMDc5OTE5NCIgc3RvcC1jb2xvcj0iIzRBQzFGRiIvPg0KPHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjMTU1RUI1Ii8+DQo8L2xpbmVhckdyYWRpZW50Pg0KPGxpbmVhckdyYWRpZW50IGlkPSJwYWludDRfbGluZWFyXzEzNF8xNDg3ODEiIHgxPSIzLjQxNTg2IiB5MT0iMTMuODc2MyIgeDI9IjExLjE5OTUiIHkyPSIzMy4xMzM3IiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSI+DQo8c3RvcCBzdG9wLWNvbG9yPSIjMkY5MUYyIi8+DQo8c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiMwNTMzNzciLz4NCjwvbGluZWFyR3JhZGllbnQ+DQo8L2RlZnM+DQo8L3N2Zz4NCg==') 25% no-repeat;
  background-size: 60%;
  background-position: center;
  filter: brightness(1.2) grayscale(1);
  position: absolute;
  top: 0;
}
.item-detail-view .actions .social-sharing .share-logo-yammer:hover,
.item-detail-view .lightbox-container .social-sharing .share-logo-yammer:hover {
  width: 100%;
  height: 100%;
  filter: brightness(1.1);
}
.item-detail-view .actions .btn.share:hover .social-sharing,
.item-detail-view .lightbox-container .btn.share:hover .social-sharing {
  display: block;
  -webkit-animation: animate-social-sharing 0.3s;
  /* Safari 4+ */
  -moz-animation: animate-social-sharing 0.3s;
  /* Fx 5+ */
  -o-animation: animate-social-sharing 0.3s;
  /* Opera 12+ */
  animation: animate-social-sharing 0.3s;
}
@keyframes animate-social-sharing {
  from {
    opacity: 0;
    left: 50%;
  }
  to {
    opacity: 1;
    left: -15%;
  }
}
.item-detail-view .comment-link {
  cursor: pointer;
}
.item-detail-view .comment-link:hover {
  text-decoration: underline;
}
.item-detail-view .commentsBlock {
  padding: 0;
}
.item-detail-view #content-wrapper {
  border-radius: 12px;
}
.item-detail-view #content-wrapper:not(.active) {
  pointer-events: none;
}
.item-detail-view #content-wrapper .nav-tabs {
  position: absolute;
  top: 0px;
  padding: 0;
  width: 73%;
  left: 25%;
  right: 1%;
  display: table;
  table-layout: fixed;
  border-bottom-width: 0px;
  z-index: 1000;
  opacity: 0;
  -o-transform: translateY(-50%) scaleY(0);
  -ms-transform: translateY(-50%) scaleY(0);
  -moz-transform: translateY(-50%) scaleY(0);
  -webkit-transform: translateY(-50%) scaleY(0);
  transform: translateY(-50%) scaleY(0);
}
.item-detail-view #content-wrapper .nav-tabs.wide {
  width: 90%;
  left: 9%;
  right: 1%;
}
.item-detail-view #content-wrapper .nav-tabs.open {
  opacity: 1;
  -o-transform: translateY(-100%) scaleY(1);
  -ms-transform: translateY(-100%) scaleY(1);
  -moz-transform: translateY(-100%) scaleY(1);
  -webkit-transform: translateY(-100%) scaleY(1);
  transform: translateY(-100%) scaleY(1);
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group {
  display: table-cell;
  float: none;
  width: 100%;
  text-align: left;
  vertical-align: bottom;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .title-wrapper {
  overflow: hidden;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab.active .title {
  cursor: default;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab > a {
  cursor: inherit;
  display: table;
  white-space: nowrap;
  table-layout: fixed;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
  margin: 0;
  padding: 0;
  border-radius: 0;
  border-width: 0 !important;
  text-align: center;
  line-height: 2.5em;
  color: #333;
  border-right: 2px solid #777 !important;
  border-top: 2px solid #777 !important;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab > a > * {
  display: table-cell;
  vertical-align: middle;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab > a.dropdown {
  cursor: pointer;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab > a:not(.dropdown) .title::after {
  content: ' ';
  display: inline-block;
  width: 1.9em;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .tab-indicator {
  display: none;
  color: #1971c2;
  position: absolute;
  top: 0;
  left: 1.9em;
  -o-transform: translate(-30%, 0%);
  -ms-transform: translate(-30%, 0%);
  -moz-transform: translate(-30%, 0%);
  -webkit-transform: translate(-30%, 0%);
  transform: translate(-30%, 0%);
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .tab-indicator .icon-stack {
  width: 1em;
  height: 1em;
  line-height: 1em;
  display: block;
  line-height: 1.3em;
  height: 1.3em;
  text-align: center;
  position: relative;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .tab-indicator .background-icon {
  font-size: 1em;
  line-height: 21px;
  color: #1971c2;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .tab-indicator .main-icon {
  font-size: 0.65em;
  line-height: 21px;
  color: #ffffff;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab.show-indicator .tab-indicator {
  display: block;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .tab-icon {
  width: 1.9em;
  font-size: 1.3em;
  line-height: 1.3em;
  text-align: center;
  vertical-align: middle;
  display: table-cell;
  position: relative;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .title {
  overflow: hidden;
  text-overflow: ellipsis;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab.active > a {
  background-color: #ffffff;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab:not(.active) > a {
  background-color: #ddd;
  color: #263238;
  cursor: pointer;
  border: 1px solid #ccc;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .dropdown-menu {
  min-width: 100%;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .dropdown-menu .tab-icon {
  display: none;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group > .tab .dropdown-menu a {
  text-align: left;
  background: #fff;
  padding: 0.8em 1em;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group:last-child .title-wrapper {
  border-top-right-radius: 8px;
}
.item-detail-view #content-wrapper .nav-tabs > .tab-group:first-child .title-wrapper {
  border-left: 2px solid #777 !important;
  border-top-left-radius: 8px;
}
.item-detail-view #content-wrapper .tab-content {
  position: absolute;
  background: white;
  top: 0;
  bottom: 0;
  width: 100%;
  overflow: hidden;
  padding: 0;
  border-radius: 24px;
}
.item-detail-view #content-wrapper .tab-content:before,
.item-detail-view #content-wrapper .tab-content:after {
  position: absolute;
  content: '';
  background: white;
  width: 100%;
  height: 5px;
  z-index: 1;
}
.item-detail-view #content-wrapper .tab-content:after {
  bottom: 0;
}
.item-detail-view #content-wrapper #comments-container {
  position: relative;
  padding: 5px 10px 5px 0;
}
.item-detail-view #content-wrapper #comments-container .commenting-field.main {
  padding: 1rem;
  padding-left: 0;
  padding-bottom: 0;
  margin-bottom: 35px;
}
.item-detail-view #content-wrapper #comments-container .navigation {
  margin-top: 1rem;
  clear: none;
}
.item-detail-view #content-wrapper #comments-container li.comment .profile-picture {
  position: relative;
  transition: all 0.5s;
}
.item-detail-view #content-wrapper #comments-container li.comment .name,
.item-detail-view #content-wrapper #comments-container li.comment .name.highlight-font-bold {
  color: #333 !important;
}
.item-detail-view #content-wrapper #comments-container .comment-wrapper {
  transition-duration: 0;
  padding-right: 12px;
}
.item-detail-view #content-wrapper #comments-container .comment-wrapper.first {
  transition-duration: 0;
  border-top: 0px solid #fff;
}
.item-detail-view #content-wrapper #comments-container .flow-marker {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  cursor: pointer;
  opacity: 0.2;
  width: 5px;
  transition-duration: 0.3s;
}
.item-detail-view #content-wrapper #comments-container .flow-marker.onhover {
  opacity: 0.7;
  width: 8px;
}
.item-detail-view #content-wrapper #comments-container .flow-marker.active {
  opacity: 0.7;
  width: 8px;
}
.item-detail-view #content-wrapper .area {
  padding: 2rem 0rem 1rem 2rem;
}
.item-detail-view #content-wrapper .area .content {
  padding-right: 1rem;
}
.item-detail-view #content-wrapper .people .header-row .indicator {
  color: #263238;
}
.item-detail-view #content-wrapper .people .applications {
  margin-right: 1rem;
}
.item-detail-view #content-wrapper .people .applications .application:not(:first-child) {
  margin-top: 2.5rem;
}
.item-detail-view #content-wrapper .people .applications .application .profile-picture {
  margin-right: 1rem;
}
.item-detail-view #content-wrapper .people .applications .application .name {
  font-weight: bold;
  height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.item-detail-view #content-wrapper .people .applications .application time {
  float: right;
  color: #b0bec5;
  font-size: 0.8em;
  line-height: 20px;
  height: 20px;
  margin-left: 5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
}
.item-detail-view #content-wrapper .people .applications .application .content-wrapper {
  overflow: hidden;
}
.item-detail-view #content-wrapper .people .applications .application .content {
  white-space: pre-line;
  word-break: break-word;
}
.item-detail-view #content-wrapper .item-info .custom-fields {
  margin-top: 24px;
  margin-right: 20px;
}
.item-detail-view #content-wrapper .item-info .custom-fields .custom-field-value {
  margin-bottom: 20px;
}
.item-detail-view #content-wrapper .item-info .custom-fields .custom-field-value .value-text {
  white-space: pre-wrap;
}
.item-detail-view #content-wrapper .no-data {
  color: #ccc;
  font-size: 1.1em;
}
.item-detail-view #content-wrapper .no-data i {
  font-size: 2em;
}
.item-detail-view #content-wrapper .no-data br {
  line-height: 2em;
}
.item-detail-view #content-wrapper .impact.area a.new-estimation {
  color: #1971c2;
}
.item-detail-view #content-wrapper .impact.area a.new-estimation:hover {
  color: #1161b3;
}
.item-detail-view #content-wrapper .impact.area .instruction-container {
  margin-bottom: 15px;
}
.item-detail-view #content-wrapper .impact.area .instruction-container .form-group {
  margin-bottom: 0;
}
.item-detail-view #content-wrapper .impact.area .instruction-container .info {
  color: #263238;
}
.item-detail-view #content-wrapper .impact.area .estimation {
  margin-top: 1em !important;
}
.item-detail-view #content-wrapper .impact.area .estimation .edit {
  display: inline;
  cursor: pointer;
  font-size: 0.9em;
  font-weight: bold;
  color: #b0bec5;
  margin: 0.2em 0;
}
.item-detail-view #content-wrapper .impact.area .estimation .edit:hover {
  color: #263238;
}
.item-detail-view #content-wrapper .impact.area .estimation .padded {
  padding: 0.7em 0.4em;
}
.item-detail-view #content-wrapper .impact.area .estimation .description {
  white-space: pre-line;
  word-break: break-word;
}
.item-detail-view #content-wrapper .impact.area .estimation .description textarea {
  resize: vertical;
  border-radius: 0;
}
.item-detail-view #content-wrapper .impact.area .estimation .edit-buttons {
  display: none;
  margin: 0.4em 0;
}
.item-detail-view #content-wrapper .impact.area .estimation.editing .edit-buttons {
  display: block;
}
.item-detail-view #content-wrapper .impact.area .estimation.editing .edit-wrapper {
  display: none;
}
.item-detail-view #content-wrapper .impact.area .estimation .edited {
  float: inherit;
  margin: 0;
  font-size: 0.9em;
  font-style: italic;
  color: #b0bec5;
}
/* Make sure the login modal won't overlap any content (and prevent buttons
from being pressed) when "hidden" */
.modal {
  overflow-y: auto;
  padding: 0 1em;
  display: none;
}
.modal .row {
  padding: 10px;
}
.modal section:not(:first-child) {
  margin-top: 3rem;
}
.modal p {
  white-space: pre-line;
}
.modal p.applying_info_text {
  margin-bottom: 15px;
}
.modal section h5:first-child {
  margin-top: 0;
}
.modal .add-users {
  margin-bottom: 2rem;
}
.modal .add-users .input-group-addon {
  cursor: pointer;
}
.modal .list-group input[type='checkbox'] {
  margin-right: 1em;
  pointer-events: none;
}
.modal .list-group .list-group-item {
  background: #ffffff;
}
.modal .list-group .list-group-item.highlight {
  background: #f5f5f5;
}
.modal table.navigation {
  margin-top: -20px;
  padding-top: 0;
  width: 100%;
  table-layout: fixed;
}
.modal table.navigation td {
  width: 100%;
  padding: 10px 4px;
  cursor: pointer;
  font-weight: bold;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  color: #aaa;
  border-bottom: 3px solid #ccc;
}
.modal table.navigation td.active {
  color: #000;
  border-bottom: 3px solid #1971c2;
}
.modal .nav.nav-tabs {
  cursor: pointer;
  user-select: none;
}
.modal .merge #merge-table {
  width: 100%;
  vertical-align: top;
  table-layout: fixed;
}
.modal .merge .merge-item {
  color: #b0bec5;
  background-color: white;
  border-radius: 5px;
  padding: 10px;
  cursor: pointer;
  vertical-align: top;
}
.modal .merge .merge-item .rich-description {
  background: white;
  color: initial;
  height: 250px;
  overflow-y: auto;
  word-break: break-word;
}
.modal .merge .merge-item .rich-description * {
  max-width: 100%;
  margin-top: 0;
  margin-bottom: 5px;
}
.modal .merge .merge-item .rich-description img {
  height: auto;
}
.modal .merge .merge-item .rich-description h1 {
  font-size: 36px;
}
.modal .merge .merge-item .rich-description iframe {
  border: none;
}
.modal .merge .merge-item textarea {
  min-height: 200px;
  margin-bottom: 8px;
}
.modal .merge .merge-item .input-sm {
  cursor: pointer;
  background-color: #eeeeee;
  margin-bottom: 8px;
}
.modal .merge .merge-item .add-item {
  margin-bottom: 8px;
}
.modal .merge .merge-item .merge-details {
  opacity: 0;
  color: white;
}
.modal .merge .merge-item .item-details {
  float: right;
}
.modal .merge .merge-item .details div {
  padding: 4px 1px 4px 1px;
}
.modal .merge .active {
  color: white;
  background-color: #145c9e;
  border-radius: 5px;
  cursor: inherit;
}
.modal .merge .active .input-sm {
  cursor: inherit;
  background-color: #ffffff;
}
.modal .merge .active .input-sm:disabled {
  cursor: inherit;
  background-color: #eeeeee;
}
.modal .merge .active .merge-details {
  opacity: 1;
  color: white;
}
.modal .merge .item-name {
  padding: 0 10px 0 10px;
  height: 40px;
  font-size: 1.2rem;
}
.modal .merge .add-item .dropdown-menu {
  padding: 0;
  max-height: 300px;
  overflow-y: scroll;
  overflow-x: hidden;
}
.modal .merge .add-item .dropdown-menu a {
  border-bottom: 1px solid #e4e4e4;
}
.modal .merge .add-item .dropdown-menu .item-auto-complete {
  width: 100%;
  margin-top: 5px;
  margin-bottom: 5px;
}
.modal .merge .add-item .dropdown-menu .item-auto-complete .top-row {
  padding-bottom: 5px;
}
.modal .merge .add-item .dropdown-menu .item-auto-complete .top-row .title {
  width: 100%;
  white-space: pre-wrap;
  word-break: break-word;
}
.modal .merge .add-item .dropdown-menu .item-auto-complete .top-row .details {
  text-align: right;
  white-space: nowrap;
  color: #b0bec5;
}
.modal .merge .add-item .dropdown-menu .item-auto-complete .description {
  white-space: pre-wrap;
  word-break: break-word;
}
.modal .move-item-view .dimmed {
  font-size: 0.95em;
}
.modal .move-item-view p.dimmed {
  margin-top: 2px;
}
.modal .move-item-view span.dimmed {
  display: inline-block;
  font-weight: normal;
}
.modal table.users {
  width: 100%;
  table-layout: fixed;
}
.modal table.users td {
  padding: 1rem;
  width: 50%;
}
.modal table.users td.selectable .action {
  visibility: hidden;
  color: #263238;
}
.modal table.users td.selectable:hover {
  background: #eee;
}
.modal table.users td.selectable:hover .action {
  visibility: visible;
}
.modal table.users td.selectable:hover .action:hover {
  color: #31343e;
}
.modal div.users {
  display: grid;
  grid-template-columns: repeat(2, minmax(100px, 1fr));
}
.modal div.users div.item-cell {
  padding: 1rem;
}
.modal div.users div.item-cell.selectable .action {
  visibility: hidden;
  color: #263238;
}
.modal div.users div.item-cell.selectable:hover {
  background: #eee;
}
.modal div.users div.item-cell.selectable:hover .action {
  visibility: visible;
}
.modal div.users div.item-cell.selectable:hover .action:hover {
  color: #31343e;
}
.modal form.item .alert {
  display: none;
}
.modal form.item .name-input {
  position: relative;
}
.modal form.item .feedback {
  margin-top: 5px;
}
.modal form.item label {
  padding: 0;
  margin-top: 1rem;
}
.modal form.item :first-child label {
  margin-top: 0;
}
.modal form.item .moderation-pending-container {
  margin-top: 2rem;
}
.modal form.item .moderation-pending-container button {
  float: right;
  margin-left: 60px;
}
.modal form.item .custom-fields-container {
  margin-top: 1em;
}
.modal form.item .custom-fields-container .custom-fields {
  margin-top: 1em;
}
.modal form.item .custom-fields-container .custom-field-value {
  margin-bottom: 15px;
}
.modal .modal-dialog.scrollable .modal-body {
  max-height: 600px;
  overflow-y: auto;
}
.modal .modal-body textarea {
  resize: vertical;
}
.modal .modal-body .warning-msg {
  text-align: center;
  font-style: bold;
  font-size: 1.2em;
  line-height: 2em;
  height: 2em;
  margin: 5px;
  border-radius: 3px;
}
.modal .modal-body form > *:not(.form-group) {
  margin-bottom: 5px;
}
.modal .modal-body form .checkbox {
  margin-bottom: 15px;
}
.modal .modal-body form .checkbox label.control-label {
  font-weight: bold;
}
.modal .modal-body form#preferences-basic-info label {
  margin-top: 1rem;
}
.modal .modal-body .error-list .error-row:not(:first-child) {
  margin-top: 10px;
}
.modal .modal-body .error-list .name {
  font-weight: bold;
}
.modal .modal-body .error-list .error {
  color: #a94442;
  /* From Bootstrap */
}
.modal .modal-body .error-list .error i {
  margin-right: 5px;
}
.yleTunnus__container {
  z-index: 1500;
  font-size: 15px;
}
#login-modal .fa-spinner {
  margin-top: 15px;
}
#login-modal .terms {
  float: left;
  color: grey;
  font-size: 0.8em;
  margin-top: 0.4em;
  width: 80%;
  text-align: left;
}
body.reset-password form.reset-confirm {
  padding: 30px;
}
body.reset-password form.reset-confirm ul.errorlist {
  list-style: none;
  padding: 0;
  color: #f00;
}
body.reset-password form.reset-confirm label {
  text-align: left;
  display: block;
}
body.reset-password form.reset-confirm input {
  margin-bottom: 20px;
}
body.reset-password form.reset-confirm p {
  text-align: center;
  margin: 0;
}
body.accept-tos a {
  color: #1971c2;
}
body.accept-tos a:hover {
  color: #1161b3;
}
body.accept-tos .tos-info-container {
  margin: 3em auto;
  color: #777;
}
body.accept-tos form {
  text-align: center;
}
body.accept-tos form button.btn-primary {
  background: #43a047;
  border: none;
  color: white;
  border-radius: 3px;
  letter-spacing: 1px;
  padding: 0.8em 1em;
  text-transform: uppercase;
  font-weight: bold;
}
body.accept-tos form button.btn-primary:hover {
  background: #2e7d32;
}
body.login,
body.logout,
body.reset-password,
body.accept-tos {
  background: #f9fbfd;
}
body.login .logo,
body.logout .logo,
body.reset-password .logo,
body.accept-tos .logo {
  display: block;
  margin: 20px auto;
  max-width: 200px;
  height: auto;
  border-radius: 12px;
}
body.login .steps,
body.logout .steps,
body.reset-password .steps,
body.accept-tos .steps {
  text-align: center;
  font-size: 1.1em;
  margin-bottom: 2rem;
}
body.login .steps .step:not(:first-child),
body.logout .steps .step:not(:first-child),
body.reset-password .steps .step:not(:first-child),
body.accept-tos .steps .step:not(:first-child) {
  margin-left: 10px;
}
body.login .steps .step,
body.logout .steps .step,
body.reset-password .steps .step,
body.accept-tos .steps .step {
  white-space: nowrap;
}
body.login .steps .step.active,
body.logout .steps .step.active,
body.reset-password .steps .step.active,
body.accept-tos .steps .step.active {
  font-weight: bold;
}
body.login .steps .step:not(.active),
body.logout .steps .step:not(.active),
body.reset-password .steps .step:not(.active),
body.accept-tos .steps .step:not(.active) {
  color: #999;
}
body.login .steps .step.disabled,
body.logout .steps .step.disabled,
body.reset-password .steps .step.disabled,
body.accept-tos .steps .step.disabled {
  pointer-events: none;
}
body.login .content.organization label,
body.logout .content.organization label,
body.reset-password .content.organization label,
body.accept-tos .content.organization label {
  color: #777;
}
body.login .content.organization .agree-partner-terms label,
body.logout .content.organization .agree-partner-terms label,
body.reset-password .content.organization .agree-partner-terms label,
body.accept-tos .content.organization .agree-partner-terms label {
  color: inherit;
}
body.login .content.organization .agree-partner-terms [type='checkbox'],
body.logout .content.organization .agree-partner-terms [type='checkbox'],
body.reset-password .content.organization .agree-partner-terms [type='checkbox'],
body.accept-tos .content.organization .agree-partner-terms [type='checkbox'] {
  margin-top: 3px;
}
@media screen and (min-width: 500px) {
  body.login .modal-dialog,
  body.logout .modal-dialog,
  body.reset-password .modal-dialog,
  body.accept-tos .modal-dialog,
  body.login .change-address-container,
  body.logout .change-address-container,
  body.reset-password .change-address-container,
  body.accept-tos .change-address-container {
    width: 450px;
    margin: 30px auto;
  }
  body.login .logo,
  body.logout .logo,
  body.reset-password .logo,
  body.accept-tos .logo {
    max-width: 200px;
    margin: 50px auto;
  }
}
/* SIGNUP */
body.signup-new {
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
}
body.signup-new .signup-header {
  text-align: center;
  font-weight: bold;
  font-size: 26px;
}
body.signup-new .signup-subheader {
  text-align: center;
  font-weight: 500;
  color: #777;
  max-width: 450px;
  margin: auto;
}
body.signup-new .already-using-viima {
  margin-top: 50px;
  text-align: center;
  font-weight: 500;
  color: #777;
}
@media screen and (min-height: 999px) {
  body.signup-new .already-using-viima {
    margin-top: 0;
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
  }
}
body.signup-new .modal {
  background: url('/static/img/section-bg-purple-waves1.webp');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right center;
}
body.signup-new .modal .change-address-container {
  font-size: 1.05em;
  font-weight: 500;
  color: #263238;
  margin: auto;
}
body.signup-new .modal .change-address-container .change-address-link {
  cursor: pointer;
  text-decoration: underline;
}
body.signup-new .modal .modal-dialog {
  margin: 20px auto;
}
body.signup-new .modal .modal-dialog.flipped {
  transform: rotateY(180deg);
  transition: transform 0.5s;
}
body.signup-new .modal .modal-dialog.flipped > * {
  transform: rotateY(-180deg);
}
body.signup-new .modal .modal-dialog #close-change-address-view {
  display: none;
  margin-top: -4px;
  margin-right: -18px;
}
body.signup-new .modal .modal-content {
  border: 0;
  border-radius: 12px;
  box-shadow: 0 17px 60px 0 rgba(23, 23, 26, 0.2), 0 13px 30px 0 rgba(0, 0, 0, 0.1) !important;
  font-size: 15px;
}
body.signup-new .modal .modal-content .modal-header {
  display: none;
}
body.signup-new .modal .modal-content .modal-body {
  padding: 40px;
  padding-bottom: 15px;
}
body.signup-new .modal .modal-content .modal-body #change-address-form {
  margin-top: 30px;
}
body.signup-new .modal .modal-content .modal-body .viima-alert .icon-bg,
body.signup-new .modal .modal-content .modal-body .viima-alert .close {
  display: none;
}
body.signup-new .modal .modal-content .modal-body .viima-alert .viima-alert-content {
  padding: 12px;
}
body.signup-new .modal .modal-content .modal-body .viima-alert .viima-alert-content > b {
  display: none;
}
body.signup-new .modal .modal-content .modal-body .login-button {
  width: 100%;
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  font-weight: 600;
}
body.signup-new .modal .modal-content .modal-body .separator {
  margin-top: 30px;
  margin-bottom: 15px;
}
body.signup-new .modal .modal-content .modal-body input[name],
body.signup-new .modal .modal-content .modal-body button,
body.signup-new .modal .modal-content .modal-body .login-button {
  border-radius: 8px;
  margin-bottom: 8px;
  margin-left: 0;
}
body.signup-new .modal .modal-content .modal-body input[name],
body.signup-new .modal .modal-content .modal-body button {
  height: 35px;
}
body.signup-new .modal .modal-content .modal-body button {
  margin-top: 10px;
  width: 100%;
}
body.signup-new .modal .modal-content .modal-body button[type='submit'] {
  text-transform: uppercase;
  letter-spacing: 0.3px;
  font-weight: bold;
}
body.signup-new .modal .modal-content .modal-body .user-actions {
  text-align: center;
  margin-top: 25px;
}
@media screen and (max-width: 480px) {
  body.signup-new .modal .modal-content .modal-body {
    padding: 1em;
  }
}
/* TUTORIAL */
body.shepherd-active {
  overflow: hidden;
}
body.shepherd-active .shepherd-element .shepherd-content {
  border-radius: 12px;
}
body.shepherd-active .shepherd-element .shepherd-content header {
  border-radius: 12px 12px 0 0;
}
body.shepherd-active .shepherd-element .shepherd-content .shepherd-buttons a.shepherd-button {
  border-radius: 16px;
}
body.shepherd-active .shepherd-step {
  max-width: 45%;
}
body.shepherd-active .shepherd-step,
body.shepherd-active .highlight {
  z-index: 9999 !important;
}
body.shepherd-active a.shepherd-button-example-primary {
  background: {{customer.roadmap_highlight_color}} !important;
  color: #ffffff !important;
}
/* BOOTSTRAP OVERRIDES */
hr {
  margin: 0.75rem 0;
  border-color: #ccc;
}
h5 {
  font-size: 16px;
}
.tooltip {
  z-index: 9999;
  /* For tutorial */
}
.breadcrumb {
  background: none;
  padding: 0;
  margin: 0;
  margin-top: 1rem;
}
/* MATERIALIZE OVERRIDES */
.dropdown-content li > a,
.dropdown-content li > span {
  color: #1971c2;
}
nav ul li.active {
  background-color: rgba(0, 0, 0, 0.2);
}
nav ul.dropdown-content a:hover {
  background-color: rgba(0, 0, 0, 0.05);
}
@media only screen and (min-width: 993px) {
  #toast-container {
    top: auto;
    bottom: 5%;
    right: 3%;
    max-width: 86%;
  }
  .toast.round-toast {
    border-radius: 30px;
  }
}
/* label focus color */
.input-field input[type='email']:focus + label {
  color: #1971c2;
}
.input-field input[type='password']:focus + label {
  color: #1971c2;
}
.input-field input[type='text']:focus + label {
  color: #1971c2;
}
.input-field input[type='tel']:focus + label {
  color: #1971c2;
}
.input-field input:not([type]):focus:not([readonly]) + label,
.input-field input[type='text']:focus:not([readonly]) + label,
.input-field input[type='password']:focus:not([readonly]) + label,
.input-field input[type='email']:focus:not([readonly]) + label,
.input-field input[type='url']:focus:not([readonly]) + label,
.input-field input[type='time']:focus:not([readonly]) + label,
.input-field input[type='date']:focus:not([readonly]) + label,
.input-field input[type='datetime-local']:focus:not([readonly]) + label,
.input-field input[type='tel']:focus:not([readonly]) + label,
.input-field input[type='number']:focus:not([readonly]) + label,
.input-field input[type='search']:focus:not([readonly]) + label,
.input-field textarea.materialize-textarea:focus:not([readonly]) + label {
  color: #1971c2;
}
/* label underline focus color */
.input-field input[type='email']:focus {
  border-bottom: 1px solid #1971c2;
  box-shadow: 0 1px 0 0 #1971c2;
}
.input-field input[type='password']:focus {
  border-bottom: 1px solid #1971c2;
  box-shadow: 0 1px 0 0 #1971c2;
}
.input-field input[type='text']:focus {
  border-bottom: 1px solid #1971c2;
  box-shadow: 0 1px 0 0 #1971c2;
}
.input-field input[type='tel']:focus {
  border-bottom: 1px solid #1971c2;
  box-shadow: 0 1px 0 0 #1971c2;
}
.input-field input:not([type]):focus:not([readonly]),
.input-field input[type='text']:focus:not([readonly]),
.input-field input[type='password']:focus:not([readonly]),
.input-field input[type='email']:focus:not([readonly]),
.input-field input[type='url']:focus:not([readonly]),
.input-field input[type='time']:focus:not([readonly]),
.input-field input[type='date']:focus:not([readonly]),
.input-field input[type='datetime-local']:focus:not([readonly]),
.input-field input[type='tel']:focus:not([readonly]),
.input-field input[type='number']:focus:not([readonly]),
.input-field input[type='search']:focus:not([readonly]),
textarea.materialize-textarea:focus:not([readonly]) {
  border-bottom: 1px solid #1971c2;
  box-shadow: 0 1px 0 0 #1971c2;
}
/* icon prefix focus color */
.input-field .prefix.active {
  color: #1971c2;
}
.input-field .prefix {
  color: #263238;
}
.switch label .lever {
  height: 30px;
  width: 50px;
  background-color: #b0bec4;
  border: 1px solid #e5e5e5;
  border-radius: 50px;
}
.switch label .lever::after {
  width: 26px;
  height: 26px;
  border-radius: 26px;
  top: 1px;
  left: 1px;
  background-color: white;
  box-shadow: none;
}
.switch label input[type='checkbox']:checked + .lever {
  background-color: #43a047;
  border-color: #43a047;
}
.switch label input[type='checkbox']:checked + .lever:after {
  background-color: white;
  left: 22px;
}
.input-field input:not([type]),
.input-field input[type='text'],
.input-field input[type='password'],
.input-field input[type='email'],
.input-field input[type='url'],
.input-field input[type='time'],
.input-field input[type='date'],
.input-field input[type='datetime-local'],
.input-field input[type='tel'],
.input-field input[type='number'],
.input-field input[type='search'],
textarea.materialize-textarea,
.select-wrapper input.select-dropdown {
  border-bottom: 1px solid #ccc;
}
.select-wrapper span.caret {
  color: #777;
}
/* Clicking the label does not activate the input without this */
.input-field input[type='text'] + label,
.input-field input[type='email'] + label,
.input-field input[type='number'] + label,
.input-field input.integer + label,
.input-field input.float + label {
  pointer-events: none;
}
.input-field input[type='text'] + label *,
.input-field input[type='email'] + label *,
.input-field input[type='number'] + label *,
.input-field input.integer + label *,
.input-field input.float + label * {
  pointer-events: all;
}
/* LOADER */
.spinner {
  display: block;
  margin: 15px 0;
  padding: 1rem;
  text-align: center;
}
.spinner #circleG {
  display: inline-block;
}
.spinner .circleG {
  float: left;
  height: 12px;
  margin-left: 5px;
  width: 12px;
  -o-animation-name: bounce_circleG;
  -ms-animation-name: bounce_circleG;
  -moz-animation-name: bounce_circleG;
  -webkit-animation-name: bounce_circleG;
  animation-name: bounce_circleG;
  -o-animation-duration: 0.6s;
  -ms-animation-duration: 0.6s;
  -moz-animation-duration: 0.6s;
  -webkit-animation-duration: 0.6s;
  animation-duration: 0.6s;
  -o-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -o-animation-direction: normal;
  -ms-animation-direction: normal;
  -moz-animation-direction: normal;
  -webkit-animation-direction: normal;
  animation-direction: normal;
  -o-border-radius: 21px;
  -ms-border-radius: 21px;
  -moz-border-radius: 21px;
  -webkit-border-radius: 21px;
  border-radius: 21px;
}
.spinner #circleG_1 {
  -o-animation-delay: 0.12s;
  -ms-animation-delay: 0.12s;
  -moz-animation-delay: 0.12s;
  -webkit-animation-delay: 0.12s;
  animation-delay: 0.12s;
}
.spinner #circleG_2 {
  -o-animation-delay: 0.28s;
  -ms-animation-delay: 0.28s;
  -moz-animation-delay: 0.28s;
  -webkit-animation-delay: 0.28s;
  animation-delay: 0.28s;
}
.spinner #circleG_3 {
  -o-animation-delay: 0.36s;
  -ms-animation-delay: 0.36s;
  -moz-animation-delay: 0.36s;
  -webkit-animation-delay: 0.36s;
  animation-delay: 0.36s;
}
@-moz-keyframes bounce_circleG {
  50% {
    background-color: {{customer.roadmap_highlight_color}};
    background-color: #1971c2;
  }
}
@-webkit-keyframes bounce_circleG {
  50% {
    background-color: {{customer.roadmap_highlight_color}};
    background-color: #1971c2;
  }
}
@-ms-keyframes bounce_circleG {
  50% {
    background-color: {{customer.roadmap_highlight_color}};
    background-color: #1971c2;
  }
}
@-o-keyframes bounce_circleG {
  50% {
    background-color: {{customer.roadmap_highlight_color}};
    background-color: #1971c2;
  }
}
@keyframes bounce_circleG {
  50% {
    background-color: {{customer.roadmap_highlight_color}};
    background-color: #1971c2;
  }
}
i.unlock {
  margin-right: 5px;
  vertical-align: bottom;
}
.permission-denied {
  margin-top: 4rem;
  text-align: center;
  align-content: center;
}
.permission-denied .forbidden-icon {
  margin: 2rem;
  font-size: 10rem;
  color: #e1e1e1;
}
.permission-denied .dim-text {
  color: #b0bec5;
}
.permission-denied .dim-text b {
  color: #263238;
}
.permission-denied h4 {
  font-size: 2em;
  font-weight: 600;
  letter-spacing: -0.3px;
}
.permission-denied p {
  font-size: 1.2em;
}
/**
 * HubSpot EU Cookie law thingy on signup page
**/
#hs-banner-parent div#hs-eu-cookie-confirmation {
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif !important;
}
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner p,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-policy-wording p,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-disclaimer,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area button#hs-eu-confirmation-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area button#hs-eu-cookie-settings-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area button#hs-eu-decline-button,
#hs-banner-parent #hs-modal #hs-modal-content,
#hs-banner-parent #hs-modal #hs-modal-content p a,
#hs-banner-parent #hs-modal #hs-modal-content p p,
#hs-banner-parent #hs-modal #hs-modal-content p,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-body #hs-modal-body-container #hs-modal-introduction-description,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-body #hs-modal-body-container #hs-modal-introduction-description p,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-body #hs-modal-body-container #hs-categories-container .hs-category-row .hs-category-row-header .hs-category-label,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-body #hs-modal-body-container #hs-categories-container .hs-category-row .hs-category-row-header .hs-category-label span,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-body #hs-modal-body-container #hs-categories-container .hs-category-row .hs-category-description,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-body #hs-modal-body-container #hs-categories-container .hs-always-active-label,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container button#hs-modal-accept-all,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container button#hs-modal-save-settings {
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif !important;
  color: #777 !important;
}
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-policy-wording p a,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area button#hs-eu-cookie-settings-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-en-cookie-confirmation-buttons-area a#hs-eu-cookie-settings-button {
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif !important;
  color: #777 !important;
  text-decoration: none !important;
  font-weight: normal !important;
  text-transform: none !important;
}
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-policy-wording p a:hover,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-policy-wording p a:focus {
  color: #1971c2 !important;
  text-decoration: underline !important;
}
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-policy-wording p a:active {
  color: #1971c2 !important;
}
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area button#hs-eu-confirmation-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area button#hs-eu-decline-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-button-group button#hs-eu-confirmation-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-button-group a#hs-eu-confirmation-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-button-group button#hs-eu-decline-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-button-group a#hs-eu-decline-button,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container button#hs-modal-accept-all,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container button#hs-modal-save-settings,
body #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container a#hs-modal-save-settings,
body #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container a#hs-modal-accept-all {
  text-transform: uppercase !important;
  font-weight: bold !important;
  letter-spacing: 0.2px !important;
  border: 0 !important;
  border-radius: 50px !important;
  font-size: 1.05em !important;
  padding: 12px 16px !important;
}
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area button#hs-eu-confirmation-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area a#hs-eu-confirmation-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-button-group button#hs-eu-confirmation-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-button-group a#hs-eu-confirmation-button,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container button#hs-modal-accept-all,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container a#hs-modal-accept-all,
body #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container a#hs-modal-accept-all {
  color: white !important;
  background: linear-gradient(115deg, #1971c2, #8679d1) !important;
  order: 2;
}
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area button#hs-eu-decline-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-buttons-area a#hs-eu-decline-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-button-group button#hs-eu-decline-button,
div#hs-eu-cookie-confirmation div#hs-eu-cookie-confirmation-inner #hs-eu-cookie-confirmation-button-group a#hs-eu-decline-button,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container button#hs-modal-save-settings,
#hs-banner-parent #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container a#hs-modal-save-settings,
body #hs-modal #hs-modal-content #hs-modal-footer #hs-modal-footer-container a#hs-modal-save-settings {
  background: #eee !important;
  color: #777 !important;
  margin-left: 1.1em !important;
}
/* ESTIMATION REMINDER STYLES */
.estimation-reminder .detail-text i {
  cursor: pointer;
  display: none;
}
.estimation-reminder .detail-text:hover i {
  display: inline;
}
.estimation-reminder .feedback-icon {
  right: 3em;
}
.estimation-reminder .date-picker {
  margin-top: 0.4em;
  width: auto;
}
.estimation-reminder .date-picker * {
  border-radius: 0;
}
/* IMPACT ASSESSMENT STYLES */
.modal .assess-item-impact .cashflow-input-wrapper:not(:first-of-type) {
  margin-top: 10px;
}
.modal .assess-item-impact .cashflow-input-wrapper .year-addon {
  min-width: 100px;
}
.modal .assess-item-impact .impact-assessment-field {
  margin-top: 1em;
  margin-bottom: 1.6em;
}
.modal .assess-item-impact .metric-type-selector {
  margin-bottom: 0.4em;
}
/* Multiselect dropdown style fixes */
button.multiselect i {
  height: auto;
}
button.multiselect + ul li label {
  margin: 0 !important;
  /* Avoid warning colors */
  color: inherit !important;
}
button.multiselect + ul li a {
  padding: 0;
}
/* Message bar */
#message-bar {
  padding: 15px 20px;
  margin: 8px 5%;
  margin-bottom: -15px;
  border-radius: 8px;
  background: #37833a;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1), 0 2px 8px 0 rgba(0, 0, 0, 0.05);
  color: white;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row-reverse;
}
#message-bar.main-ui {
  position: absolute;
  z-index: 10;
  margin: 8px;
  width: 800px;
  max-width: 50%;
  left: 50%;
  transform: translateX(-50%);
  padding: 15px 20px;
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
  font-size: 15px;
}
#message-bar .message-container {
  font-weight: 500;
}
#message-bar .message-container .cta a {
  color: white;
  border-bottom: 2px solid white;
  font-weight: bold;
  text-decoration: none;
  padding: 0;
  margin-left: 0.5em;
  transition: 0.2s all;
}
#message-bar .message-container .cta a:hover {
  padding-bottom: 1px;
  padding-left: 1px;
}
#message-bar.red {
  background: #ff5f5c !important;
}
#message-bar.yellow {
  background: #f39d00 !important;
}
#message-bar.green {
  background: #74b616 !important;
}
#message-bar.blue {
  background: #1971c2 !important;
}
#message-bar.black {
  background: #343a40 !important;
}
#message-bar.purple {
  background: #55059e !important;
}
#message-bar .close-icon {
  height: 42px;
  cursor: pointer;
}
#message-bar .close-icon i {
  transition: transform 0.8s;
  padding: 13.5px 15px;
}
#message-bar .close-icon i:hover {
  transform: scale(1.1) rotateY(180deg);
}
/*TINYMCE*/
/*Hide the embed tab in the tinymce media video option*/
.tox .tox-dialog__body-nav-item:nth-child(2) {
  display: none;
}
/* HYPE INTEGRATION ICONS */
.hype-integration-icon,
span.project-icon {
  display: inline-block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.hype-integration-sharing {
  position: absolute;
  display: none;
  z-index: 10000;
}
.hype-integration:hover .hype-integration-sharing {
  display: block;
}
img.project-icon {
  width: 16px !important;
  padding-right: 5px !important;
}
#feature_flags {
  margin-bottom: 25px;
}
#feature_flags input[type='checkbox'] {
  position: relative;
  visibility: visible;
  display: block;
  left: 0;
}
#feature_flags .description {
  font-weight: normal;
  font-size: 13px;
  color: #b0bec5;
  margin-top: 2px;
  margin-bottom: 4px;
  cursor: default;
}
#feature_flags .btn-save {
  margin-right: 25px;
}
#feature_flags #feature-flags-container {
  padding-left: 0;
}
#feature_flags #feature-flags-container .row {
  align-items: center;
  display: flex;
  padding-right: 0;
}
#feature_flags #feature-flags-container .col {
  justify-content: center;
  align-items: center;
  padding-left: 0;
}
.clustering-sort .dropdown-menu li > a,
.clustering .dropdown-menu li > a {
  display: flex;
}
.clustering-sort .dropdown-menu li > a .cluster-sort-name,
.clustering .dropdown-menu li > a .cluster-sort-name,
.clustering-sort .dropdown-menu li > a .cluster-name,
.clustering .dropdown-menu li > a .cluster-name {
  margin-left: 10px;
}
.clustering-sort div .clustering-icon,
.clustering div .clustering-icon {
  width: 17px;
  display: inline-block;
}
.clustering-sort div .clustering-icon svg,
.clustering div .clustering-icon svg {
  fill: #bbb;
}
.clustering-sort div .clustering-icon svg:hover,
.clustering div .clustering-icon svg:hover {
  fill: #000;
}
.cluster-label {
  font-size: 20px;
  fill: #555555;
}
