@charset "UTF-8";
/**
 * Retrieves a color value from the $material-colors Sass map
 * Inspired by https://github.com/nilskaspersson/Google-Material-UI-Color-Palette/
 *
 * @function
 * @param {string} color-name             - quoted, lower-case, dasherized color
 *                                          name (e.g. 'pink', 'amber')
 * @param {string} [color-variant='500']  - quoted, lowercase color variant (e.g.
 *                                          '200', 'a100')
 */
/**
 * GLOBAL VARIABLES
 * note: this file is OMITTED from the scss compiler (see paths-app.js)
 * instead, it is @included in bootstrap.scss so it is loaded before other scss
 */
/**
 *		icomoon.com
 * 		custom icon font
 **/
@font-face {
  font-family: "icomoon";
  src: url("../assets/icomoon_fonts/icomoon.eot?arifm");
  src: url("../assets/icomoon_fonts/icomoon.eot?arifm#iefix") format("embedded-opentype"), url("../assets/icomoon_fonts/icomoon.ttf?arifm") format("truetype"), url("../assets/icomoon_fonts/icomoon.woff?arifm") format("woff"), url("../assets/icomoon_fonts/icomoon.svg?arifm#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
}
[class^=icon-],
[class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

accordion {
  display: block;
}
accordion .transclude-container {
  display: block;
  width: 100%;
}
accordion accordion-header {
  cursor: pointer;
}
accordion accordion-content .transclude-container {
  overflow: hidden;
  transition: 0.5s max-height ease-in-out, 0.5s opacity;
  will-change: max-height;
}
accordion accordion-content .transclude-container.is-hidden {
  position: absolute;
  display: none;
}

dropzone {
  display: none;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  align-content: center;
  border: 1px dashed black;
  background-color: #ffb74d;
  color: white;
  font-size: 2em;
  font-weight: bold;
  opacity: 0;
  transition: opacity 0.2s ease;
}
dropzone ng-md-icon {
  margin: 0 20px 0 0;
  color: white;
}
dropzone > * {
  pointer-events: none;
}

body.is-dragover dropzone:not(.disabled) {
  display: flex;
  opacity: 0.8;
  z-index: 1000;
}
body.is-dragover dropzone:not(.disabled).is-dragover {
  z-index: 1000;
  opacity: 1;
}

file-chooser {
  display: inline-block;
}
file-chooser input[type=file] {
  display: none;
}
file-chooser label {
  display: block;
  cursor: pointer;
}

spinner {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  pointer-events: none;
  display: inline-block;
}
spinner .spinner-container {
  position: relative;
}
spinner .spinner-container div {
  display: block;
  box-sizing: border-box;
  position: absolute;
  width: 100%;
  height: 100%;
  border: 1em solid transparent;
  border-radius: 50%;
  border-top-color: #3f51b5;
  -webkit-animation: rotate360 1.6s cubic-bezier(0.5, 0, 0.5, 1) infinite;
          animation: rotate360 1.6s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  will-change: transform;
}
spinner .spinner-container div:nth-child(1) {
  -webkit-animation-delay: 0.2;
          animation-delay: 0.2;
}
spinner .spinner-container div:nth-child(2) {
  -webkit-animation-delay: -0.2s;
          animation-delay: -0.2s;
}
spinner .spinner-container div:nth-child(3) {
  -webkit-animation-delay: -0.4s;
          animation-delay: -0.4s;
}

@-webkit-keyframes rotate360 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotate360 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/**
 * GLOBAL STYLES: ADDHERE CUSTOM ELEMENTS & STYLES
 */
.ah-card {
  border: 1px solid #d7d7d7;
  border-radius: 20px;
  padding: 20px;
  margin: 12px;
  background-color: white;
  box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.3);
}

.tool-icon {
  text-transform: none;
}

.tool-icon:not([disabled]) ng-md-icon {
  color: #9e9e9e;
  transition: color 0.1s;
}
.tool-icon:not([disabled]):hover {
  color: #ffb74d;
}
.tool-icon:not([disabled]):hover ng-md-icon {
  color: #ffb74d;
}
.tool-icon:not([disabled]).active ng-md-icon {
  color: white;
}

.tool-icon[disabled] {
  opacity: 0.5;
}

.rotate90 {
  transform: rotate(90deg);
}

.rotate180 {
  transform: rotate(180deg);
}

.ah-action-link, .ah-action-link a {
  min-width: 0;
  text-align: left;
  padding: 6px 0;
  font-weight: 400;
  cursor: pointer;
  color: #039be5;
  transition: color 0.1s;
  text-decoration: none;
}
.ah-action-link ng-md-icon, .ah-action-link a ng-md-icon {
  transition: color 0.1s;
  transform: translateY(-2px);
  color: #039be5;
}
.ah-action-link ng-md-icon.rotate90, .ah-action-link a ng-md-icon.rotate90 {
  transform: translateY(-2px) rotate(90deg);
}
.ah-action-link:hover, .ah-action-link a:hover {
  color: #0277bd;
}
.ah-action-link:hover ng-md-icon, .ah-action-link a:hover ng-md-icon {
  color: #0277bd;
}
.ah-action-link.disabled, .ah-action-link a.disabled {
  color: #9e9e9e;
  cursor: default;
}
.ah-action-link.active, .ah-action-link a.active {
  color: #ff8a65;
}
.ah-action-link.active ng-md-icon, .ah-action-link a.active ng-md-icon {
  color: #ff8a65;
}

.ah-toggle-button {
  position: relative;
  cursor: pointer;
  text-align: center;
  z-index: 10;
}
.ah-toggle-button .icon-container {
  width: 30px;
  margin: auto;
  background-color: white;
  transform: translateY(10px);
  border-radius: 10px;
  transition: background-color 0.2s;
  text-align: center;
  color: #9e9e9e;
}
.ah-toggle-button .icon-container:hover {
  background-color: #ffb74d;
}
.ah-toggle-button .icon-container:hover ng-md-icon {
  color: white;
}
.ah-toggle-button.label {
  text-align: left;
  display: flex;
  justify-content: flex-start;
}
.ah-toggle-button.label .icon-container {
  transform: none;
  margin: 0;
}
.ah-toggle-button.label .label {
  margin-right: 10px;
  display: flex;
  align-items: center;
  color: #9e9e9e;
  font-weight: bold;
  font-size: 0.8em;
}

.ah-tools-panel {
  background-color: white;
  padding: 10px;
}
.ah-tools-panel .tool-icon.delete-forever ng-md-icon {
  color: red;
}
.ah-tools-panel .tool-icon .mouse-out {
  display: inline-block;
}
.ah-tools-panel .tool-icon .mouse-in {
  display: none;
}
.ah-tools-panel .tool-icon:hover {
  color: #ffb74d;
}
.ah-tools-panel .tool-icon:hover .mouse-out {
  display: none;
}
.ah-tools-panel .tool-icon:hover .mouse-in {
  display: inline-block;
}

.ah-action-button {
  display: flex;
  justify-content: center;
  border-radius: 12px;
  height: 24px;
  width: 24px;
  cursor: pointer;
  background-color: white;
  transition: opacity 0.2s;
  opacity: 0.4;
}
.ah-action-button ng-md-icon {
  transition: color 0.2s;
  width: 18px;
  height: 18px;
  color: black;
}
.ah-action-button.active {
  opacity: 1;
  box-shadow: 2px 2px 4px 0 rgba(0, 0, 0, 0.5);
}
.ah-action-button.active ng-md-icon {
  color: #ff8a65;
}
.ah-action-button:hover {
  opacity: 0.6;
}
.ah-action-button.ah-action-button-lt {
  background-color: #bdbdbd;
}
.ah-action-button.ah-action-button-lt ng-md-icon {
  color: white;
}
.ah-action-button.ah-action-button-lt.active {
  background-color: #ff8a65;
}
.ah-action-button.ah-action-button-lt:hover {
  background-color: #a4a4a4;
}
.ah-action-button.ah-action-button-lt:hover.active {
  background-color: #ff6332;
}

.wrap-height {
  height: 100%;
}

.panel-controls {
  min-height: 50px;
}

.link-secondary {
  color: #2196f3;
  text-decoration: underline;
  cursor: pointer;
  transition: color 0.2s;
}
.link-secondary:hover {
  color: #1976d2;
}

.size-control {
  display: flex;
  justify-content: center;
  align-items: center;
  outline: none;
  min-height: 10px;
  color: #9e9e9e;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.size-control:hover {
  cursor: row-resize;
}

.simple-text-button {
  cursor: pointer;
}
.simple-text-button:hover {
  color: #f57c00 !important;
  text-decoration: underline;
}

.icon-unlock-alt:before {
  content: "";
}

.icon-lock:before {
  content: "";
}

.ah-select-dropdown md-optgroup {
  padding: 10px 0;
}
.ah-select-dropdown md-optgroup label {
  padding: 0px 16px 10px 16px;
  text-transform: none;
  font-size: 0.8em;
  font-weight: 500;
}
.ah-select-dropdown md-optgroup:not(:last-child) {
  border-bottom: 1px solid #e0e0e0;
}
.ah-select-dropdown .md-text {
  font-size: 0.9em;
}
.ah-select-dropdown md-option {
  height: 30px;
}
.ah-select-dropdown md-select-menu,
.ah-select-dropdown md-content {
  max-height: 500px;
}
.ah-select-dropdown .show-all {
  display: block;
  text-align: center;
}
.ah-select-dropdown .show-all button {
  margin-bottom: 0;
}

.ah-asset-count {
  display: inline-block;
  min-width: 1.5em;
  padding: 0px 5px 1px 5px;
  border-radius: 8px;
  background-color: #bdbdbd;
  text-align: center;
  line-height: 1.3em;
  font-size: 0.8em;
  font-weight: bold;
  color: white;
}

.add-page-container,
.add-slide-container {
  cursor: pointer;
  position: relative;
  align-self: stretch !important;
  outline: none;
  min-width: 80px;
  margin: 4px;
  background-color: #fcfcfc;
  border: 1px solid #d7d7d7;
  border-radius: 2px;
  transition: background-color 0.3s;
}
.add-page-container ng-md-icon,
.add-slide-container ng-md-icon {
  color: #d7d7d7;
}
.add-page-container:hover,
.add-slide-container:hover {
  background-color: #ffb74d;
  font-weight: 500;
}
.add-page-container:hover ng-md-icon,
.add-slide-container:hover ng-md-icon {
  color: white;
}

.add-slide-container {
  width: 122px;
  margin-bottom: 8px;
  transition: width 0.5s ease;
}
.add-slide-container.wide {
  width: 162px;
}

.slide-icon {
  fill: #9e9e9e;
  transition: fill 0.15s linear;
}
.slide-icon .icon-bg {
  fill: white;
}
.slide-icon:hover {
  fill: #ffa726;
}

.aspect-switch-container {
  display: flex;
  justify-content: center;
  align-items: center;
  color: #9e9e9e;
  min-height: 40px;
}
.aspect-switch-container .aspect-ratio-button {
  min-width: 30px;
  border-radius: 0;
}
.aspect-switch-container .aspect-ratio-button .slide-icon {
  fill: #9e9e9e;
  width: 70px;
  height: 70px;
}
.aspect-switch-container .aspect-ratio-button .slide-icon .icon-bg {
  fill: white;
}
.aspect-switch-container .aspect-ratio-button .slide-icon svg {
  width: 100%;
  height: 100%;
}
.aspect-switch-container .aspect-ratio-button.default .slide-icon, .aspect-switch-container .aspect-ratio-button.selected .slide-icon {
  fill: #42a5f5;
}

md-switch.confidential-switch {
  margin: 0;
}
md-switch.confidential-switch.ng-not-empty .md-thumb:after {
  color: white;
  content: "";
}
md-switch.confidential-switch .md-thumb:after {
  display: block;
  content: "";
  font: normal normal normal 12px/1 icomoon;
  color: #9e9e9e;
  line-height: 21px;
  text-align: center;
}

.notification-badge {
  position: absolute;
  border-radius: 50%;
  background-color: #f4511e;
  border: 2px solid white;
  width: 15px;
  height: 15px;
  top: -7.5px;
  right: -7.5px;
}
.notification-badge.small {
  border: 1px solid white;
  width: 10px;
  height: 10px;
  top: -5px;
  right: -5px;
}

.ah-remove-button, .ah-add-button {
  z-index: 1;
  position: absolute;
  top: -8px;
  right: -8px;
  padding: 0 !important;
  opacity: 0;
  transition: opacity 0.15s;
  border-radius: 50% !important;
}
.ah-remove-button ng-md-icon, .ah-add-button ng-md-icon {
  color: #1e88e5;
  transition: color 0.15s;
}
.ah-remove-button ng-md-icon:hover, .ah-add-button ng-md-icon:hover {
  color: #ffb74d;
}

.ah-add-button {
  right: auto;
  left: -8px;
}

/**
 * GLOBAL STYLES: ANGULAR & MATERIAL ELEMENTS
 */
md-content {
  background-color: white;
}

md-input-container {
  margin: 18px 0;
}

.md-errors-spacer {
  display: none;
}

md-paging button {
  height: 35px !important;
  width: 35px !important;
  margin: 5px !important;
}

[ng-click] {
  outline: none;
}

.md-tooltip {
  padding: 4px 8px;
  font-size: 14px;
  font-weight: 500;
  height: auto;
}

md-dialog .warning {
  margin-bottom: 20px;
  padding: 10px;
  border: 1px solid #f44336;
  color: #f44336;
}

.md-button[type=file] > input[type=file] {
  display: none;
}

.md-placeholder,
md-input-container label,
md-checkbox {
  color: #616161;
}

.md-dialog-container {
  z-index: 100;
}

md-backdrop.md-dialog-backdrop {
  z-index: 99;
}

md-checkbox {
  margin-bottom: 5px;
  color: #616161;
}
md-checkbox .md-icon {
  border-color: #9e9e9e !important;
}
md-checkbox.active {
  color: #2196f3;
}
md-checkbox.md-checked .md-icon {
  border-color: #64b5f6 !important;
  background-color: #64b5f6 !important;
}
md-checkbox.md-checked .md-icon:after {
  border-color: white !important;
}

.md-button {
  color: #616161;
}

.md-button.md-raised.md-primary {
  color: white;
  background-color: #0277bd;
}

.md-button.md-icon-button {
  height: auto;
  width: auto;
  min-height: 0;
  min-width: 0;
  line-height: 20px;
  align-self: center;
  flex-shrink: 0;
  padding: 5px;
  margin: 0;
  border-radius: 4px;
}
.md-button.md-icon-button.rotate45 {
  transform: translate(0px, -2px) rotate(-45deg);
}
.md-button.md-icon-button.wide {
  padding: 2px 5px;
}

ng-md-icon.small {
  width: 15px;
  height: 15px;
}
ng-md-icon.small-medium {
  width: 20px;
  height: 20px;
}
ng-md-icon.small-medium.wide {
  width: 28px;
  height: 26px;
}
ng-md-icon.medium {
  width: 27px;
  height: 27px;
}
ng-md-icon.med-large {
  width: 40px;
  height: 40px;
}
ng-md-icon.large {
  width: 55px;
  height: 55px;
}
ng-md-icon.x-large {
  width: 70px;
  height: 70px;
}
ng-md-icon svg {
  width: 100%;
  height: 100%;
}

md-divider.vertical {
  border-top-width: 0;
  border-right: 1px solid #d7d7d7;
  height: 100%;
}

md-tabs {
  width: 100%;
  height: 100%;
}
md-tabs .md-tab {
  font-size: 17px;
  font-weight: bold;
  color: #9e9e9e;
  text-transform: none;
  padding-top: 14px;
}
md-tabs .md-tab ng-md-icon {
  transform: translate(-2px, -2px);
}
md-tabs md-ink-bar {
  background: #42a5f5 !important;
}

/**
 * GLOBAL STYLES: HTML ELEMENTS
 */
html,
body {
  height: 100%;
  overflow: hidden !important;
}

body {
  position: relative;
}
body * {
  box-sizing: border-box;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-thumb {
  background-color: #bdbdbd;
}
::-webkit-scrollbar-thumb:hover {
  background-color: #bdbdbd;
}

::-webkit-scrollbar-track {
  background-color: #fafafa;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  /* 1 */
  display: table;
  /* 2 */
}

.clearfix:after {
  clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.clearfix {
  *zoom: 1;
}

.md-color-picker-input-container {
  cursor: pointer;
}
.md-color-picker-input-container md-input-container {
  display: none;
}
.md-color-picker-input-container .md-color-picker-preview {
  top: auto !important;
}
.md-color-picker-input-container .md-color-picker-clear {
  bottom: auto !important;
  right: -30px !important;
}

ah-ng-color-selector {
  display: block;
}

ah-ng-text-field {
  display: block;
  width: 100%;
}

asset-history {
  display: flex;
  flex-wrap: wrap;
}
asset-history .history-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 25px;
  height: 25px;
  border-radius: 3px;
  margin: 2px;
  background-color: #9e9e9e;
}
asset-history .history-icon:hover {
  background-color: #f57c00;
  background-color: #42a5f5;
}
asset-history .history-icon ng-md-icon {
  color: white;
}
asset-history .history-icon ng-md-icon:hover {
  color: white;
}

asset-manager-component {
  display: flex;
  flex-direction: column;
  flex-grow: 1;
  min-height: 0;
}
asset-manager-component .manager-controls {
  display: flex;
  min-height: 48px;
  font-size: 16px;
  font-weight: 500;
  color: white;
  border-bottom: 1px solid #d7d7d7;
  background-color: #1e88e5;
}
asset-manager-component .manager-tree-header {
  flex: 0 0 250px;
  display: flex;
  justify-content: center;
  align-items: center;
}
asset-manager-component .manager-tree-header .search-icon {
  margin-right: 5px;
}
asset-manager-component .category-switch {
  display: flex;
}
asset-manager-component .category-switch > span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 70px;
  cursor: pointer;
}
asset-manager-component .category-switch > span:hover {
  background-color: #2196f3;
}
asset-manager-component .category-switch > span.active {
  background-color: #1565c0;
}
asset-manager-component .manager-tabs-container {
  background-color: white;
  flex: 2 1 auto;
}
asset-manager-component .close-button {
  flex: 0 0 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
asset-manager-component .close-button:hover {
  background-color: #2196f3;
}
asset-manager-component .manager-container {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  max-height: 100%;
}

grid-element {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 120px;
  height: 120px;
  margin: 8px;
  cursor: pointer;
  /* Second sheet of paper */
  /* Third sheet of paper */
}
grid-element img, grid-element .placeholder {
  max-width: 100%;
  max-height: 100px;
  border: 1px solid #d7d7d7;
  position: relative;
  z-index: 10;
  box-shadow: 2px 2px 2px 0 #ccc;
}
grid-element .placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 100px;
  background-color: #f5f5f5;
  color: #e0e0e0;
}
grid-element.selected img, grid-element.selected .placeholder {
  outline: 4px solid #42a5f5;
  box-shadow: 6px 6px 6px 0 #ccc;
}
grid-element .image-container {
  max-width: 100%;
  max-height: 100px;
  background: white;
  position: relative;
}
grid-element .image-container.multi-page::before,
grid-element .image-container.multi-page::after {
  box-shadow: 2px 2px 2px 0 #ccc;
  border: 1px solid #d7d7d7;
  opacity: 0.6;
}
grid-element .image-container.multi-page::before,
grid-element .image-container.multi-page::after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: white;
}
grid-element .image-container.multi-page::before {
  left: 2px;
  top: 2px;
  z-index: 9;
}
grid-element .image-container.multi-page::after {
  left: 6px;
  top: 6px;
  z-index: 8;
}
grid-element .name {
  overflow: hidden;
  max-width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #9e9e9e;
  font-size: 0.8em;
  margin-bottom: 5px;
  flex: 0 0 20px;
}

manager-details {
  flex: 0 0 300px;
  color: #616161;
  background-color: #fafafa;
  overflow: auto;
}
manager-details .asset-name {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  min-height: 100px;
  padding: 15px;
  color: #616161;
  font-weight: bold;
  border-bottom: 1px solid #d7d7d7;
  color: #616161;
  text-align: center;
  font-weight: bold;
}
manager-details .asset-name > * {
  flex: 1 1 100%;
}
manager-details .asset-name textarea {
  overflow-wrap: break-word;
  word-break: break-word;
  color: #616161;
  text-align: center;
  font-weight: bold;
}
manager-details .asset-name md-input-container {
  margin: 0 !important;
}
manager-details .asset-name .item-number {
  color: #9e9e9e;
}
manager-details .preview-image {
  padding: 15px;
  border-top: 1px solid #d7d7d7;
  border-bottom: 1px solid #d7d7d7;
}
manager-details .preview-image img {
  background-color: white;
  border: 1px solid #9e9e9e;
  max-width: 100%;
  cursor: zoom-in;
}
manager-details .actions {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 15px;
}
manager-details .actions .primary {
  margin-bottom: 20px;
  align-self: center;
}
manager-details .asset-info {
  padding: 15px;
}
manager-details .asset-info .info-row {
  margin-bottom: 15px;
}
manager-details .asset-info .info-row.tags {
  position: relative;
}
manager-details .asset-info .info-row.tags .tag-settings-btn {
  position: absolute;
  right: -10px;
  top: -15px;
}
manager-details .asset-info .info-row.tags .tag-remove-all-btn {
  position: absolute;
  right: 15px;
  top: -15px;
}
manager-details .asset-info .info-row.tags tag-chooser {
  display: block;
}
manager-details .asset-info .info-subhead {
  font-size: 0.9em;
}
manager-details .asset-info .info-subhead.confidential, manager-details .asset-info .info-subhead.hotness {
  display: inline-block;
}
manager-details .asset-info .confidential-switch {
  display: inline-block;
  margin-left: 10px;
  height: 17px;
}
manager-details .page-annotations {
  border-top: 1px solid #d7d7d7;
  padding: 15px;
}
manager-details .page-annotations .info-subhead {
  margin-bottom: 10px;
}
manager-details .annotation-block {
  margin-bottom: 15px;
  padding: 0 10px;
  border: 1px solid silver;
  border-bottom: none;
  background: white;
  position: relative;
}
manager-details .annotation-block .is-disabled {
  margin: 10px 0;
  float: left;
  color: #9e9e9e;
}
manager-details .annotation-block.readonly .annotation-image {
  border: none;
  background: transparent;
  margin: 10px 0;
}
manager-details .annotation-block .annotation-image {
  text-align: center;
  padding: 5px;
  background: #F5F5F5;
  border: 1px solid silver;
  cursor: zoom-in;
}
manager-details .annotation-block .annotation-image img {
  background: white;
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 310px;
  display: inline-block;
}
manager-details .used-in-form {
  line-height: 1.4em;
  color: #616161;
}
manager-details .used-in-form a {
  text-decoration: none;
  color: #2196f3;
  cursor: pointer;
}
manager-details .used-in-form a:hover {
  color: #ffb74d;
}
manager-details .used-in-form .index {
  display: inline-block;
  padding: 0 2px;
  min-width: 20px;
  height: 20px;
  margin: 3px;
  border: 1px solid #d7d7d7;
  border-radius: 5px;
  color: #616161;
  font-size: 0.9em;
  line-height: 20px;
  text-align: center;
}
manager-details .ocr-icon {
  font-size: 0.9rem;
  font-weight: 600;
  color: #9e9e9e;
  border-radius: 12px;
  padding: 1px 6px 1px 2px;
  border: 1px solid #bdbdbd;
  margin-top: 5px;
}
manager-details .ocr-icon ng-md-icon {
  color: #9e9e9e;
  transform: translateY(-2px);
}
manager-details .used-in-form-container {
  border: 1px solid #d7d7d7;
  padding: 5px 10px;
  color: #616161;
  font-size: 0.9em;
}
manager-details .used-in-form {
  line-height: 1.4em;
  color: #616161;
}
manager-details .used-in-form a {
  text-decoration: none;
  color: #2196f3;
  cursor: pointer;
}
manager-details .used-in-form a:hover {
  color: #ffb74d;
}
manager-details .used-in-form .index {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 3px;
  border: 1px solid #d7d7d7;
  border-radius: 5px;
  color: #616161;
  font-size: 0.9em;
  line-height: 20px;
  text-align: center;
}
manager-details .used-in-form.selected {
  font-weight: bold;
}

manager-filters {
  position: relative;
  z-index: 1;
}
manager-filters .filter-open {
  position: absolute;
  border: 1px solid #d7d7d7;
  border-top: none;
  background-color: #fff3e0;
  padding: 0px 10px;
  color: #616161;
  cursor: pointer;
  transform: translateX(-50%);
  left: 50%;
}
manager-filters .filter-component-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: space-between;
  height: 180px;
  margin-top: -180px;
  transition: 0.6s margin-top ease;
  border-bottom: 1px solid #d7d7d7;
  color: #616161;
  font-size: 0.9em;
  background: #fff3e0;
}
manager-filters .filter-component-container.show {
  margin-top: 0;
}
manager-filters .filter-component-container .filter-row {
  width: 30%;
  min-width: 190px;
  min-height: 40px;
  margin: 6px;
}
manager-filters .filter-component-container .filter-row > * {
  display: block;
}
manager-filters .filter-component-container .filter-row.hotness, manager-filters .filter-component-container .filter-row.confidential {
  padding-top: 15px;
}
manager-filters .filter-component-container .filter-row.page-number input {
  width: 120px;
}
manager-filters .filter-component-container md-input-container {
  margin: 0;
}
manager-filters .filter-component-container .md-errors-spacer {
  display: none;
}
manager-filters .filter-line {
  display: flex;
  flex-wrap: nowrap;
  box-sizing: content-box;
  padding: 5px 6px;
  position: relative;
  background: #fff3e0;
  border-bottom: 1px solid #d7d7d7;
  z-index: 2;
  transition: 0.3s linear all;
  align-items: center;
  cursor: pointer;
}
manager-filters .filter-line.ng-enter, manager-filters .filter-line.ng-leave.ng-leave-active {
  margin-top: -31px;
}
manager-filters .filter-line.ng-enter.ng-enter-active, manager-filters .filter-line.ng-leave {
  margin-top: 0;
}
manager-filters .filter-line .filter-group {
  display: flex;
  align-items: center;
  text-align: center;
}
manager-filters .filter-line .filter-group.name-group {
  text-align: left;
  flex-shrink: 1;
  white-space: nowrap;
  overflow: hidden;
}
manager-filters .filter-line .filter-group.name-group span {
  margin-left: 5px;
  text-overflow: ellipsis;
  overflow: hidden;
}
manager-filters .filter-line .filter-group.filter-text {
  color: #5d5d5d;
}
manager-filters .filter-line .filter-group.filter-text ng-md-icon {
  margin-right: 1px;
}
manager-filters .filter-line .filter-group.tag-group {
  flex-shrink: 2;
}
manager-filters .filter-line .filter-group.hotness-group {
  flex-shrink: 0;
}
manager-filters .filter-line .filter-group .lock {
  display: inline-block;
}
manager-filters .filter-line .filter-group .lock:after {
  content: "";
  font: normal normal normal 18px/1 icomoon;
  color: #9e9e9e;
}
manager-filters .filter-line .filter-group .tag {
  display: inline-block;
  background: #e0e0e0;
  border-radius: 16px;
  padding: 0 7px;
  font-size: 14px;
  font-weight: bold;
  line-height: 20px;
  margin: 1px 2px;
}
manager-filters .filter-line .filter-group:after {
  content: "•";
  margin: 0 5px;
  font-size: 25px;
  display: inline-block;
}
manager-filters .filter-line .filter-group:last-of-type:after {
  content: none;
}
manager-filters .filter-line .clear-button {
  margin-left: auto;
  flex-shrink: 0;
}
manager-filters .filter-line .clear-button .simple-text-button {
  margin-left: 15px;
  text-decoration: none;
  color: #616161;
}

manager-grid {
  flex: 1 1 auto;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #d7d7d7;
}
manager-grid .project-container {
  height: 100%;
  position: relative;
}
manager-grid .project-container .wrapper {
  position: absolute;
  overflow: auto;
  height: 100%;
  width: 100%;
  background-color: #fafafa;
}
manager-grid .project-container .project {
  padding: 20px 20px;
  border-bottom: 1px solid #e0e0e0;
}
manager-grid .project-container .project-header {
  margin-bottom: 10px;
  font-weight: 500;
}
manager-grid .project-container .project-name, manager-grid .project-container .home-icon {
  font-size: 24px;
}
manager-grid .project-container .asset-count {
  display: inline-block;
  min-width: 22px;
  padding: 0 3px 2px 3px;
  margin-left: 10px;
  transform: translateY(-3px);
  border-radius: 12px;
  background-color: #757575;
  font-size: 0.9em;
  color: white;
  text-align: center;
}
manager-grid .project-container .grid-container {
  display: flex;
  flex-wrap: wrap;
}
manager-grid .project-container .project.current {
  background-color: white;
  padding-bottom: 20px;
}
manager-grid .project-container .project.current .project-name, manager-grid .project-container .project.current .home-icon {
  color: #ff5722;
}
manager-grid .project-container .project.current .project-name ng-md-icon, manager-grid .project-container .project.current .home-icon ng-md-icon {
  transform: translateY(-2px);
}

manager-outline {
  flex: 1 1 auto;
  overflow: auto;
  border-right: 1px solid #d7d7d7;
}
manager-outline .tree-controls {
  flex: 0 0 40px;
  display: flex;
  padding: 15px;
  background-color: #fafafa;
  border-top: 1px solid #d7d7d7;
}
manager-outline .tree-controls .spacer {
  flex: 1 1 auto;
}
manager-outline .tree-controls .checkbox-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
}
manager-outline .tree-controls .checkbox-button md-checkbox {
  margin: 0;
  min-width: 0;
  width: 20px;
}
manager-outline .tree-controls .project-list-filters md-input-container {
  margin: 0;
}
manager-outline .tree-controls .project-list-filters md-input-container .md-errors-spacer {
  display: none;
}
manager-outline .tree-controls .project-list-filters .clear-button {
  min-width: 0;
}
manager-outline .outline-container {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: visible;
  padding: 10px 25px;
}
manager-outline .outline-container .check-box {
  margin: 0 0 0 5px;
}
manager-outline .outline-container .check-box:not(.md-checked) .md-icon {
  background-color: white;
}
manager-outline .outline-container .number-badge {
  min-width: 18px;
  height: 18px;
  line-height: 17px;
  padding: 1px 3px;
  background-color: #2196f3;
  border-radius: 4px;
  font-size: 0.8em;
  font-weight: bold;
  color: white;
  text-align: center;
}
manager-outline .outline-container .number-badge.group-badge {
  background-color: #9e9e9e;
}
manager-outline .outline-container li.hidden {
  min-height: 0px;
}
manager-outline .outline-container li.hidden > .tree-node {
  display: none;
}
manager-outline .outline-container .tree-node {
  border-bottom: 1px solid #d7d7d7;
  padding: 5px 0;
  display: flex;
  align-items: center;
  cursor: pointer;
}
manager-outline .outline-container .tree-node:hover {
  background-color: #eeeeee;
}
manager-outline .outline-container .tree-node.active {
  background-color: #b3e5fc;
}
manager-outline .outline-container .sub-nodes {
  padding-left: 63px;
}
manager-outline .outline-container .node-name {
  padding-left: 10px;
}

manager-outline-details {
  flex: 0 0 300px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background-color: #eeeeee;
  border-top: 1px solid #d7d7d7;
  border-bottom: 1px solid #d7d7d7;
}
manager-outline-details .node-details {
  flex: 1 1 auto;
  padding: 10px 25px;
  overflow: auto;
}
manager-outline-details .settings {
  flex: 0 0 auto;
  padding: 10px 25px;
  display: flex;
  flex-direction: column;
  width: 100%;
  border-top: 1px solid #d7d7d7;
  background: white;
}
manager-outline-details .settings .indent {
  margin-left: 30px;
}
manager-outline-details .subheader {
  margin-bottom: 10px;
  color: #9e9e9e;
}
manager-outline-details .options-button {
  color: #616161;
}
manager-outline-details .info-box {
  max-width: 250px;
  margin: 10px 0;
}
manager-outline-details .info-box .header {
  color: #9e9e9e;
}
manager-outline-details .info-box img {
  width: 100%;
  border: 1px solid #d7d7d7;
  cursor: zoom-in;
}

manager-tree {
  border: 1px solid #d7d7d7;
  flex: 0 0 250px;
  color: #616161;
  overflow: auto;
  background-color: #e0e0e0;
  direction: rtl;
}
manager-tree > * {
  direction: ltr;
}
manager-tree .tree-row {
  padding: 3px 5px;
  cursor: pointer;
  overflow: hidden;
}
manager-tree .directory-header {
  display: flex;
  justify-content: flex-start;
}
manager-tree .directory-header ng-md-icon {
  flex: 0 0 auto;
  color: #9e9e9e;
}
manager-tree .directory-header .group-name {
  flex: 1 1 auto;
  margin: 0 0 0 5px;
  white-space: nowrap;
}
manager-tree .group-list-container {
  overflow: hidden;
  margin-bottom: 15px;
}
manager-tree .group-list-container .project-name {
  white-space: nowrap;
}
manager-tree .group-list-container .tree-row {
  padding-left: 41px;
}
manager-tree .group-list-container .tree-row.selected {
  background-color: white;
  font-weight: 500;
  color: #424242;
}
manager-tree .group-list-container .tree-row:hover {
  background-color: #e3f2fd;
}
manager-tree .group-list-container .tree-row.current {
  color: #ff5722;
}
manager-tree .group-list-container .tree-row.current ng-md-icon {
  transform: translateY(-1px);
}
manager-tree .group-list-container .tree-row.pinned-current {
  font-size: 1.1em;
  padding: 10px 0 10px 18px;
  border-bottom: 1px solid #757575;
}
manager-tree .group-list-container.ng-enter {
  transition: 0.15s linear opacity;
  opacity: 0;
}
manager-tree .group-list-container.ng-enter.ng-enter-active {
  opacity: 1;
}
manager-tree .group-list-container.ng-leave {
  transition: 0.15s linear opacity;
  opacity: 1;
}
manager-tree .group-list-container.ng-leave.ng-leave-active {
  opacity: 0;
}

auth-component #page-header {
  z-index: 3;
  background-color: #2979ff;
  padding-top: 5px;
}
auth-component #page-header #ah-logo {
  height: 46px;
  padding-left: 9px;
}
auth-component #page-header .md-button {
  font-size: 18px;
  font-weight: bold;
}

#auth-content {
  font-size: 1.5em;
  padding: 100px;
}

#login-form {
  width: 500px;
}

#register-form, #update-form {
  width: 600px;
}
#terms {
  min-width: 600px;
  overflow: hidden;
  min-height: 70vh;
}
#terms md-content {
  overflow: auto;
}

#register-form,
#login-form,
#update-form,
#terms {
  font-size: 1.3em;
  padding: 0;
}
#register-form .yellow,
#login-form .yellow,
#update-form .yellow,
#terms .yellow {
  color: #F7EC13;
}
#register-form .hl,
#login-form .hl,
#update-form .hl,
#terms .hl {
  color: #2962ff;
}
#register-form .small,
#login-form .small,
#update-form .small,
#terms .small {
  font-size: 0.8em;
}
#register-form .link,
#login-form .link,
#update-form .link,
#terms .link {
  color: #3f51b5;
  cursor: pointer;
}
#register-form .link:hover,
#login-form .link:hover,
#update-form .link:hover,
#terms .link:hover {
  color: #283593;
  text-decoration: underline;
}
#register-form md-toolbar,
#login-form md-toolbar,
#update-form md-toolbar,
#terms md-toolbar {
  background-color: #2962ff;
  height: 80px;
  padding: 0;
  font-size: 28px;
  color: white;
  border-bottom: 5px solid #ff7043;
}
#register-form md-content,
#login-form md-content,
#update-form md-content,
#terms md-content {
  color: grey;
  background-color: white;
  padding: 30px 50px;
}
#register-form md-input-container,
#login-form md-input-container,
#update-form md-input-container,
#terms md-input-container {
  width: calc(100% - 36px);
}
#register-form md-input-container .md-input,
#login-form md-input-container .md-input,
#update-form md-input-container .md-input,
#terms md-input-container .md-input {
  transform: translateX(36px);
}
#register-form md-input-container .md-errors-spacer,
#login-form md-input-container .md-errors-spacer,
#update-form md-input-container .md-errors-spacer,
#terms md-input-container .md-errors-spacer {
  min-height: 0;
}
#register-form md-input-container ng-md-icon.success,
#login-form md-input-container ng-md-icon.success,
#update-form md-input-container ng-md-icon.success,
#terms md-input-container ng-md-icon.success {
  color: #43a047;
}
#register-form md-input-container label,
#login-form md-input-container label,
#update-form md-input-container label,
#terms md-input-container label {
  transform: translate3d(36px, 28px, 0) scale(1);
}
#register-form md-input-container.md-input-has-value label, #register-form md-input-container.md-input-focused label,
#login-form md-input-container.md-input-has-value label,
#login-form md-input-container.md-input-focused label,
#update-form md-input-container.md-input-has-value label,
#update-form md-input-container.md-input-focused label,
#terms md-input-container.md-input-has-value label,
#terms md-input-container.md-input-focused label {
  transform: translate3d(36px, 6px, 0) scale(0.75);
}
#register-form md-input-container#signup-email,
#login-form md-input-container#signup-email,
#update-form md-input-container#signup-email,
#terms md-input-container#signup-email {
  margin-top: 5px;
}
#register-form md-input-container.agree,
#login-form md-input-container.agree,
#update-form md-input-container.agree,
#terms md-input-container.agree {
  margin: 30px 0 0 0;
  padding: 0;
  font-size: 18px;
  text-align: center;
  width: 100%;
}
#register-form .name-row > md-input-container,
#login-form .name-row > md-input-container,
#update-form .name-row > md-input-container,
#terms .name-row > md-input-container {
  margin-right: 10px;
}
#register-form .name-row > md-input-container:nth-child(1),
#login-form .name-row > md-input-container:nth-child(1),
#update-form .name-row > md-input-container:nth-child(1),
#terms .name-row > md-input-container:nth-child(1) {
  max-width: 195px;
}
#register-form .name-row > md-input-container:nth-child(2),
#login-form .name-row > md-input-container:nth-child(2),
#update-form .name-row > md-input-container:nth-child(2),
#terms .name-row > md-input-container:nth-child(2) {
  max-width: 54px;
}
#register-form .name-row > md-input-container:nth-child(3),
#login-form .name-row > md-input-container:nth-child(3),
#update-form .name-row > md-input-container:nth-child(3),
#terms .name-row > md-input-container:nth-child(3) {
  max-width: 195px;
  margin-right: 0px;
}
#register-form .error-message,
#login-form .error-message,
#update-form .error-message,
#terms .error-message {
  width: 100%;
  margin: 20px 0 0 0;
  background-color: white;
  color: #f44336;
  font-size: 0.9em;
  text-align: center;
  font-weight: bold;
}
#register-form .red,
#login-form .red,
#update-form .red,
#terms .red {
  color: #f44336;
}
#register-form .md-button.login, #register-form .md-button.signup,
#login-form .md-button.login,
#login-form .md-button.signup,
#update-form .md-button.login,
#update-form .md-button.signup,
#terms .md-button.login,
#terms .md-button.signup {
  height: 50px;
  width: 100%;
  text-transform: none;
  font-size: 22px;
  font-weight: bold;
  margin: 10px 0;
}

artwork-editor-component {
  display: flex;
  flex-direction: column;
}
artwork-editor-component textarea {
  min-width: 240px;
}
artwork-editor-component .secondary-screen-header {
  flex: 0 0 50px;
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: #1976d2;
  font-size: 18px;
  font-weight: bold;
  color: white;
}
artwork-editor-component .secondary-screen-header .spacer {
  flex: 1 1 auto;
}
artwork-editor-component .secondary-screen-content {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: auto;
}
artwork-editor-component .full-row {
  flex: 1 1 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
artwork-editor-component .full-row.row-1 {
  margin-top: 40px;
  flex: 0 0 180px;
  align-items: flex-start;
}
artwork-editor-component .full-row.row-2 {
  display: flex;
  justify-content: stretch;
  align-items: stretch;
}
artwork-editor-component .full-row .col {
  flex: 1 1 auto;
  padding: 10px;
}
artwork-editor-component .full-row .col-1 {
  flex: 0 0 400px;
}
artwork-editor-component .full-row .col-2, artwork-editor-component .full-row .col-3 {
  flex: 1 1 50%;
  overflow: hidden;
}
artwork-editor-component .name-input {
  display: block;
  height: 40px;
  margin: 0 20px;
}
artwork-editor-component .name-input textarea {
  font-weight: bold;
}
artwork-editor-component .image-container {
  display: inline-block;
  position: relative;
  min-height: 120px;
}
artwork-editor-component .image-container .label {
  font-size: 0.8em;
  margin-bottom: 5px;
}
artwork-editor-component .image-container img {
  height: 120px;
  min-width: 120px;
  border: 1px solid #d7d7d7;
  background-color: #eeeeee;
}
artwork-editor-component .image-container .thumb-placeholder {
  height: 120px;
  width: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
  border: 1px solid #d7d7d7;
}
artwork-editor-component .image-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
artwork-editor-component .image-container:hover .ah-remove-button {
  opacity: 1;
}
artwork-editor-component .actions-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  height: 160px;
}
artwork-editor-component .actions-container .md-button {
  text-align: left;
}
artwork-editor-component .section-header {
  font-weight: bold;
  display: flex;
  align-items: center;
}
artwork-editor-component .style-list-container {
  width: 100%;
}
artwork-editor-component .element-style, artwork-editor-component .control-list-item {
  display: flex;
  align-items: center;
  margin: 5px 0;
  padding: 0 5px;
  height: 36px;
  border: 1px solid #1976d2;
  background-color: #1976d2;
  font-weight: bold;
  color: white;
}
artwork-editor-component .element-style.alert, artwork-editor-component .control-list-item.alert {
  border: 1px solid #ef5350;
  background-color: #ef5350;
}
artwork-editor-component .element-style.alert .index, artwork-editor-component .control-list-item.alert .index {
  background-color: #c62828;
}
artwork-editor-component .element-style:not(.selected), artwork-editor-component .control-list-item:not(.selected) {
  background-color: white;
  color: #616161;
}
artwork-editor-component .element-style:not(.selected) .md-button, artwork-editor-component .control-list-item:not(.selected) .md-button {
  color: #616161;
}
artwork-editor-component .element-style .grab-handle, artwork-editor-component .control-list-item .grab-handle {
  margin-right: 5px;
  opacity: 0.5;
}
artwork-editor-component .element-style .index, artwork-editor-component .control-list-item .index {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 28px;
  width: 28px;
  border-radius: 6px;
  margin-right: 6px;
  background-color: #0d47a1;
  line-height: 0;
  color: white;
}
artwork-editor-component .element-style .name, artwork-editor-component .control-list-item .name {
  flex: 1 1 auto;
}
artwork-editor-component .element-style .md-button, artwork-editor-component .control-list-item .md-button {
  color: white;
}
artwork-editor-component .control-list-item {
  border: 1px solid #757575;
  background-color: #757575;
}
artwork-editor-component .control-list-item .index {
  background-color: #424242;
}
artwork-editor-component .style-details-container {
  border: 1px solid #1976d2;
}
artwork-editor-component .style-details-container.alert {
  border: 1px solid #ef5350;
}
artwork-editor-component .style-details-container.alert .style-details-header {
  background-color: #ef5350;
}
artwork-editor-component .control-details-container {
  border: 1px solid #616161;
}
artwork-editor-component .style-details-header, artwork-editor-component .control-details-header {
  display: flex;
  align-items: center;
  padding: 0 10px;
  height: 36px;
  background-color: #1976d2;
  font-weight: bold;
  color: white;
}
artwork-editor-component .control-details-header {
  background-color: #616161;
}
artwork-editor-component .control-details-content {
  padding: 10px;
  display: flex;
}
artwork-editor-component .control-details-content .left-col, artwork-editor-component .control-details-content .right-col {
  flex: 1 1 50%;
}
artwork-editor-component .control-details-content .left-col {
  padding-right: 10px;
}
artwork-editor-component .control-details-content .right-col {
  border-left: 1px solid #d7d7d7;
  padding-left: 10px;
}
artwork-editor-component .control-details-content .right-col md-input-container {
  display: inline-block;
}
artwork-editor-component .control-details-content .right-col md-input-container input[type=number] {
  width: 5em;
  margin-right: 10px;
}
artwork-editor-component .control-details-content .right-col md-radio-group label {
  display: block;
  margin-bottom: 10px;
}
artwork-editor-component .control-details-content .right-col md-radio-group md-radio-button {
  display: inline-block;
  margin-right: 10px;
}
artwork-editor-component .control-details-content .color-control .label {
  color: #616161;
  font-size: 0.8em;
  margin-bottom: 5px;
}
artwork-editor-component .control-details-content .color-control .control-color-picker md-input-container {
  margin: 0;
}
artwork-editor-component .control-details-content .color-control .color-block {
  height: 50px;
}
artwork-editor-component .style-details-content {
  padding: 10px;
}
artwork-editor-component .style-details-content .top-row {
  display: flex;
}
artwork-editor-component .style-details-content .top-row .left-col {
  padding-right: 10px;
}
artwork-editor-component .style-details-content .top-row .right-col {
  padding: 0 10px;
  border-left: 1px solid #d7d7d7;
}
artwork-editor-component .style-details-content .section-header {
  border-top: 1px solid #d7d7d7;
  margin-top: 15px;
}
artwork-editor-component .type-select-container md-input-container {
  min-width: 230px;
}
artwork-editor-component .control {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #d7d7d7;
  padding: 5px;
  margin: 5px 0;
}
artwork-editor-component .control accordion-header .transclude-container {
  background-color: #757575;
}
artwork-editor-component .control accordion-header .transclude-container .index {
  background-color: #424242;
}
artwork-editor-component .control .control-row {
  margin-bottom: 10px;
}
artwork-editor-component .control md-radio-button {
  display: inline;
  margin-left: 10px;
}
artwork-editor-component .control input[type=number] {
  width: 4em;
  margin-right: 10px;
}
artwork-editor-component .control .text-control-values md-input-container {
  width: 100%;
}
artwork-editor-component .control .color-block {
  display: inline-block;
  border: 1px solid #d7d7d7;
  width: 80px;
  height: 30px;
  transform: translateY(10px);
}

background-builder-component {
  display: flex;
  flex-direction: column;
  color: #616161;
}
background-builder-component .md-button {
  height: 36px;
}
background-builder-component ng-md-icon {
  margin: 0;
}
background-builder-component md-switch {
  margin: 0;
}
background-builder-component input[type=number] {
  width: 50px;
  margin: 0 7px;
}
background-builder-component input[type=number].wide {
  width: 70px;
}
background-builder-component .color-picker {
  margin: 0 20px;
}
background-builder-component .select-container {
  margin: 0 20px;
}
background-builder-component .asset-type-header {
  height: 30px;
  padding: 5px;
  background-color: #616161;
  color: white;
  font-weight: bold;
  width: 100%;
}
background-builder-component .details-row {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 12px 0;
}
background-builder-component .details-row .spacer {
  flex: 2 0 auto;
}
background-builder-component .details-row .input-label {
  width: 40px;
}
background-builder-component .details-row.name {
  font-size: 1.2em;
  font-weight: bold;
}
background-builder-component textarea {
  min-width: 250px;
}
background-builder-component .secondary-screen-header {
  flex: 0 0 50px;
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: #1a237e;
  font-size: 18px;
  font-weight: bold;
  color: white;
}
background-builder-component .secondary-screen-header .spacer {
  flex: 1 1 auto;
}
background-builder-component .secondary-screen-content {
  flex: 1 1 auto;
  display: flex;
  overflow: auto;
}
background-builder-component .left-col, background-builder-component .right-col {
  flex: 1 1 50%;
  padding: 10px;
}
background-builder-component .left-col {
  flex: 1 0 300px;
  margin-left: 20px;
}
background-builder-component .image-container {
  margin-bottom: 10px;
}
background-builder-component .image-container img {
  height: 150px;
  min-width: 150px;
  border: 1px solid #d7d7d7;
  background-color: #eeeeee;
}

design-builder-component {
  display: flex;
  flex-direction: column;
}
design-builder-component .asset-type-header {
  margin-top: 10px;
  padding: 2px 5px;
  background-color: #1976d2;
  color: white;
  font-weight: bold;
}
design-builder-component textarea {
  min-width: 250px;
}
design-builder-component .secondary-screen-header {
  flex: 0 0 50px;
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: #1a237e;
  font-size: 18px;
  font-weight: bold;
  color: white;
}
design-builder-component .secondary-screen-header .spacer {
  flex: 1 1 auto;
}
design-builder-component .secondary-screen-content {
  flex: 1 1 auto;
  display: flex;
  overflow: auto;
}
design-builder-component .left-col, design-builder-component .right-col {
  flex: 1 1 50%;
  padding: 10px;
}
design-builder-component .image-container {
  display: flex;
  justify-content: flex-start;
  margin-bottom: 10px;
  min-height: 80px;
}
design-builder-component .image-container .label {
  font-size: 0.8em;
  margin-bottom: 5px;
}
design-builder-component .image-container img {
  height: 80px;
  min-width: 80px;
  border: 1px solid #d7d7d7;
  background-color: #eeeeee;
}

design-builder-asset-detail {
  margin: 5px 0;
  display: flex;
}
design-builder-asset-detail .thumb-container {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  border: 1px solid #d7d7d7;
  cursor: pointer;
}
design-builder-asset-detail .thumb-container img {
  border: 1px solid #90a4ae;
  height: 70px;
}
design-builder-asset-detail .thumb-container .thumb-placeholder {
  height: 70px;
  width: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
}
design-builder-asset-detail .thumb-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
design-builder-asset-detail .thumb-container:hover .ah-remove-button, design-builder-asset-detail .thumb-container:hover .ah-add-button {
  opacity: 1;
}
design-builder-asset-detail .thumb-container:hover img {
  border: 3px solid #90caf9;
}
design-builder-asset-detail .setting-info {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  margin-left: 10px;
}
design-builder-asset-detail .setting-info .setting-name {
  font-weight: bold;
  margin-bottom: 10px;
}

docx-template-editor-component {
  display: flex;
  flex-direction: column;
}
docx-template-editor-component textarea {
  min-width: 240px;
}
docx-template-editor-component .secondary-screen-header {
  flex: 0 0 50px;
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: #1a237e;
  font-size: 18px;
  font-weight: bold;
  color: white;
}
docx-template-editor-component .secondary-screen-header .spacer {
  flex: 1 1 auto;
}
docx-template-editor-component .secondary-screen-content {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: auto;
}
docx-template-editor-component .full-row {
  flex: 1 1 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
docx-template-editor-component .full-row.row-1 {
  margin-top: 40px;
  flex: 0 0 180px;
  align-items: flex-start;
}
docx-template-editor-component .full-row.row-2 {
  display: flex;
  justify-content: stretch;
  align-items: stretch;
}
docx-template-editor-component .full-row .col {
  flex: 1 1 auto;
  padding: 10px;
}
docx-template-editor-component .full-row .col-1 {
  flex: 0 0 400px;
}
docx-template-editor-component .full-row .col-2, docx-template-editor-component .full-row .col-3 {
  flex: 1 1 50%;
  overflow: hidden;
}
docx-template-editor-component .name-input {
  display: block;
  height: 40px;
  margin: 0 20px;
}
docx-template-editor-component .name-input textarea {
  font-weight: bold;
}
docx-template-editor-component .image-container {
  display: inline-block;
  position: relative;
  min-height: 80px;
}
docx-template-editor-component .image-container .label {
  font-size: 0.8em;
  margin-bottom: 5px;
}
docx-template-editor-component .image-container img {
  height: 80px;
  width: 80px;
  border: 1px solid #d7d7d7;
  background-color: #eeeeee;
}
docx-template-editor-component .image-container .thumb-placeholder {
  height: 80px;
  width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
  border: 1px solid #d7d7d7;
}
docx-template-editor-component .image-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
docx-template-editor-component .image-container:hover .ah-remove-button {
  opacity: 1;
}
docx-template-editor-component .actions-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  height: 160px;
}
docx-template-editor-component .actions-container .md-button {
  text-align: left;
}
docx-template-editor-component .section-header {
  font-weight: bold;
  display: flex;
  align-items: center;
}
docx-template-editor-component .style-list-container {
  width: 100%;
}
docx-template-editor-component .element-style, docx-template-editor-component .control-list-item {
  display: flex;
  align-items: center;
  margin: 5px 0;
  padding: 0 5px;
  height: 36px;
  border: 1px solid #1976d2;
  background-color: #1976d2;
  font-weight: bold;
  color: white;
}
docx-template-editor-component .element-style.alert, docx-template-editor-component .control-list-item.alert {
  border: 1px solid #ef5350;
  background-color: #ef5350;
}
docx-template-editor-component .element-style.alert .index, docx-template-editor-component .control-list-item.alert .index {
  background-color: #c62828;
}
docx-template-editor-component .element-style:not(.selected), docx-template-editor-component .control-list-item:not(.selected) {
  background-color: white;
  color: #616161;
}
docx-template-editor-component .element-style:not(.selected) .md-button, docx-template-editor-component .control-list-item:not(.selected) .md-button {
  color: #616161;
}
docx-template-editor-component .element-style .grab-handle, docx-template-editor-component .control-list-item .grab-handle {
  margin-right: 5px;
  opacity: 0.5;
}
docx-template-editor-component .element-style .index, docx-template-editor-component .control-list-item .index {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 28px;
  width: 28px;
  border-radius: 6px;
  margin-right: 6px;
  background-color: #0d47a1;
  line-height: 0;
  color: white;
}
docx-template-editor-component .element-style .name, docx-template-editor-component .control-list-item .name {
  flex: 1 1 auto;
}
docx-template-editor-component .element-style .md-button, docx-template-editor-component .control-list-item .md-button {
  color: white;
}
docx-template-editor-component .control-list-item {
  border: 1px solid #757575;
  background-color: #757575;
}
docx-template-editor-component .control-list-item .index {
  background-color: #424242;
}
docx-template-editor-component .style-details-container {
  border: 1px solid #1976d2;
}
docx-template-editor-component .style-details-container.alert {
  border: 1px solid #ef5350;
}
docx-template-editor-component .style-details-container.alert .style-details-header {
  background-color: #ef5350;
}
docx-template-editor-component .control-details-container {
  border: 1px solid #616161;
}
docx-template-editor-component .style-details-header, docx-template-editor-component .control-details-header {
  display: flex;
  align-items: center;
  padding: 0 10px;
  height: 36px;
  background-color: #1976d2;
  font-weight: bold;
  color: white;
}
docx-template-editor-component .control-details-header {
  background-color: #616161;
}
docx-template-editor-component .control-details-content {
  padding: 10px;
  display: flex;
}
docx-template-editor-component .control-details-content .left-col, docx-template-editor-component .control-details-content .right-col {
  flex: 1 1 50%;
}
docx-template-editor-component .control-details-content .left-col {
  padding-right: 10px;
}
docx-template-editor-component .control-details-content .right-col {
  border-left: 1px solid #d7d7d7;
  padding-left: 10px;
}
docx-template-editor-component .control-details-content .right-col md-input-container {
  display: inline-block;
}
docx-template-editor-component .control-details-content .right-col md-input-container input[type=number] {
  width: 5em;
  margin-right: 10px;
}
docx-template-editor-component .control-details-content .right-col md-radio-group label {
  display: block;
  margin-bottom: 10px;
}
docx-template-editor-component .control-details-content .right-col md-radio-group md-radio-button {
  display: inline-block;
  margin-right: 10px;
}
docx-template-editor-component .control-details-content .color-control .label {
  color: #616161;
  font-size: 0.8em;
  margin-bottom: 5px;
}
docx-template-editor-component .control-details-content .color-control .control-color-picker md-input-container {
  margin: 0;
}
docx-template-editor-component .control-details-content .color-control .color-block {
  height: 50px;
}
docx-template-editor-component .style-details-content {
  padding: 10px;
}
docx-template-editor-component .style-details-content .top-row {
  display: flex;
}
docx-template-editor-component .style-details-content .top-row .left-col {
  padding-right: 10px;
}
docx-template-editor-component .style-details-content .top-row .right-col {
  padding: 0 10px;
  border-left: 1px solid #d7d7d7;
}
docx-template-editor-component .style-details-content .section-header {
  border-top: 1px solid #d7d7d7;
  margin-top: 15px;
}
docx-template-editor-component .type-select-container md-input-container {
  min-width: 230px;
}
docx-template-editor-component .control {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #d7d7d7;
  padding: 5px;
  margin: 5px 0;
}
docx-template-editor-component .control accordion-header .transclude-container {
  background-color: #757575;
}
docx-template-editor-component .control accordion-header .transclude-container .index {
  background-color: #424242;
}
docx-template-editor-component .control .control-row {
  margin-bottom: 10px;
}
docx-template-editor-component .control md-radio-button {
  display: inline;
  margin-left: 10px;
}
docx-template-editor-component .control input[type=number] {
  width: 4em;
  margin-right: 10px;
}
docx-template-editor-component .control .text-control-values md-input-container {
  width: 100%;
}
docx-template-editor-component .control .color-block {
  display: inline-block;
  border: 1px solid #d7d7d7;
  width: 80px;
  height: 30px;
  transform: translateY(10px);
}

layout-builder-component {
  display: flex;
  flex-direction: column;
}
layout-builder-component .secondary-screen-header {
  flex: 0 0 50px;
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: #1a237e;
  font-size: 18px;
  font-weight: bold;
  color: white;
}
layout-builder-component .secondary-screen-header .spacer {
  flex: 1 1 auto;
}
layout-builder-component .secondary-screen-content {
  flex: 1 1 auto;
  display: flex;
}
layout-builder-component .layout-display {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
layout-builder-component .layout-display .layout-canvas-container {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 auto;
  background-color: #212121;
}
layout-builder-component .layout-display .layout-canvas-container .canvas-element.lower-canvas {
  border: 1px solid #bdbdbd;
  background-color: white;
}
layout-builder-component .layout-display #layout-tools {
  flex: 0 0 50px;
}
layout-builder-component #layout-controls {
  flex: 0 0 350px;
}

#layout-controls {
  display: flex;
  flex-direction: column;
}
#layout-controls .controls-row {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0 20px;
}
#layout-controls .controls-row .label {
  flex: 1 1 auto;
  margin-left: 10px;
  color: #616161;
}
#layout-controls .controls-row .item-name {
  flex: 1 1 auto;
}
#layout-controls .controls-row input[type=number] {
  width: 2em;
}
#layout-controls .controls-row.preview-image img {
  max-width: 100%;
  border: 1px solid #d7d7d7;
}
#layout-controls .controls-row.preview-image .placeholder-image {
  height: 175px;
  width: 310px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
  border: 1px solid #d7d7d7;
}
#layout-controls .controls-row.preview-image .placeholder-image ng-md-icon {
  color: #bdbdbd;
}
#layout-controls .controls-row.preview-image .update-image-button {
  position: absolute;
  top: 10px;
  left: 30px;
  margin: 0;
  min-width: 40px;
  background-color: white;
  border: 1px solid #d7d7d7;
  opacity: 0;
  transition: 0.3s;
  color: #9e9e9e;
}
#layout-controls .controls-row.preview-image .update-image-button:hover {
  color: #616161;
}
#layout-controls .controls-row.preview-image:hover .update-image-button {
  opacity: 1;
}
#layout-controls .controls-row.tags-row {
  justify-content: space-between;
  padding-bottom: 10px;
}
#layout-controls .controls-row.tags-row tag-chooser {
  flex: 1 1 auto;
}
#layout-controls .controls-row.tags-row .tag-settings-btn {
  position: absolute;
  right: 0;
  bottom: 15px;
}
#layout-controls .controls-row.centered {
  justify-content: center;
}
#layout-controls .controls-row.wrap {
  flex-wrap: wrap;
}
#layout-controls .controls-row .md-button {
  margin: 6px 2px;
  padding: 0 4px;
}
#layout-controls .snapshots-container {
  flex: 1 1 auto;
  margin: 5px 20px;
  padding: 5px;
  height: 100px;
  border: 1px solid #d7d7d7;
  overflow: auto;
}
#layout-controls md-divider {
  margin: 10px 0;
}

#layout-tools {
  min-height: 50px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #eeeeee;
}
#layout-tools .tools-container {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 45px;
  padding: 10px;
  margin: 0 5px;
  border: 1px solid #d7d7d7;
}
#layout-tools .grid-size-input {
  width: 60px;
}
#layout-tools .position-controls input {
  font-size: 0.8em;
  width: 5em;
}
#layout-tools .position-controls .control-container:not(:first-child) {
  padding-left: 10px;
}

style-builder-component {
  display: flex;
  flex-direction: column;
}
style-builder-component textarea {
  min-width: 240px;
}
style-builder-component .secondary-screen-header {
  flex: 0 0 50px;
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: #1a237e;
  font-size: 18px;
  font-weight: bold;
  color: white;
}
style-builder-component .secondary-screen-header .spacer {
  flex: 1 1 auto;
}
style-builder-component .secondary-screen-content {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow: auto;
}
style-builder-component .full-row {
  flex: 1 1 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
style-builder-component .full-row.row-1 {
  flex: 0 0 180px;
}
style-builder-component .full-row.row-2 {
  display: flex;
  justify-content: stretch;
  align-items: stretch;
}
style-builder-component .full-row .col {
  flex: 1 1 auto;
  padding: 10px;
}
style-builder-component .full-row .col-1 {
  flex: 0 0 400px;
}
style-builder-component .full-row .col-2 {
  flex: 1 1 55%;
  overflow: hidden;
}
style-builder-component .full-row .col-3 {
  flex: 1 1 45%;
  overflow: hidden;
}
style-builder-component .name-input {
  display: block;
  height: 40px;
  margin: 0 20px;
}
style-builder-component .name-input textarea {
  font-weight: bold;
}
style-builder-component .image-container {
  display: inline-block;
  position: relative;
  min-height: 80px;
}
style-builder-component .image-container .label {
  font-size: 0.8em;
  margin-bottom: 5px;
}
style-builder-component .image-container img {
  height: 80px;
  width: 80px;
  border: 1px solid #d7d7d7;
  background-color: #eeeeee;
}
style-builder-component .image-container .thumb-placeholder {
  height: 80px;
  width: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
  border: 1px solid #d7d7d7;
}
style-builder-component .image-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
style-builder-component .image-container:hover .ah-remove-button {
  opacity: 1;
}
style-builder-component .actions-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  height: 120px;
}
style-builder-component .actions-container .md-button {
  text-align: left;
}
style-builder-component .section-header {
  font-weight: bold;
  display: flex;
  align-items: center;
}
style-builder-component .style-list-container {
  width: 100%;
}
style-builder-component .element-style, style-builder-component .control-list-item {
  display: flex;
  align-items: center;
  margin: 5px 0;
  padding: 0 5px;
  height: 36px;
  border: 1px solid #1976d2;
  background-color: #1976d2;
  font-weight: bold;
  color: white;
}
style-builder-component .element-style.alert, style-builder-component .control-list-item.alert {
  border: 1px solid #ef5350;
  background-color: #ef5350;
}
style-builder-component .element-style.alert .index, style-builder-component .control-list-item.alert .index {
  background-color: #c62828;
}
style-builder-component .element-style:not(.selected), style-builder-component .control-list-item:not(.selected) {
  background-color: white;
  color: #616161;
}
style-builder-component .element-style:not(.selected) .md-button, style-builder-component .control-list-item:not(.selected) .md-button {
  color: #616161;
}
style-builder-component .element-style .grab-handle, style-builder-component .control-list-item .grab-handle {
  margin-right: 5px;
  opacity: 0.5;
}
style-builder-component .element-style .index, style-builder-component .control-list-item .index {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 28px;
  width: 28px;
  border-radius: 6px;
  margin-right: 6px;
  background-color: #0d47a1;
  line-height: 0;
  color: white;
}
style-builder-component .element-style .name, style-builder-component .control-list-item .name {
  flex: 1 1 auto;
}
style-builder-component .element-style .md-button, style-builder-component .control-list-item .md-button {
  color: white;
}
style-builder-component .control-list-item {
  border: 1px solid #757575;
  background-color: #757575;
}
style-builder-component .control-list-item .index {
  background-color: #424242;
}
style-builder-component .style-details-container {
  border: 1px solid #1976d2;
}
style-builder-component .style-details-container.alert {
  border: 1px solid #ef5350;
}
style-builder-component .style-details-container.alert .style-details-header {
  background-color: #ef5350;
}
style-builder-component .text-level-row {
  display: flex;
  gap: 10px;
}
style-builder-component .text-level-row .level-index {
  color: #9e9e9e;
  display: flex;
  justify-content: center;
  align-items: center;
}
style-builder-component .text-level-row .level-label {
  flex: 2 0 auto;
}
style-builder-component .control-details-container {
  border: 1px solid #616161;
}
style-builder-component .style-details-header, style-builder-component .control-details-header {
  display: flex;
  align-items: center;
  padding: 0 10px;
  height: 36px;
  background-color: #1976d2;
  font-weight: bold;
  color: white;
}
style-builder-component .control-details-header {
  background-color: #616161;
}
style-builder-component .control-details-content {
  padding: 10px;
  display: flex;
}
style-builder-component .control-details-content .left-col, style-builder-component .control-details-content .right-col {
  flex: 1 1 50%;
}
style-builder-component .control-details-content .left-col {
  padding-right: 10px;
}
style-builder-component .control-details-content .right-col {
  border-left: 1px solid #d7d7d7;
  padding-left: 10px;
}
style-builder-component .control-details-content .right-col md-input-container {
  display: inline-block;
}
style-builder-component .control-details-content .right-col md-input-container input[type=number] {
  width: 5em;
  margin-right: 10px;
}
style-builder-component .control-details-content .right-col md-radio-group label {
  display: block;
  margin-bottom: 10px;
}
style-builder-component .control-details-content .right-col md-radio-group md-radio-button {
  display: inline-block;
  margin-right: 10px;
}
style-builder-component .control-details-content .color-control .label {
  color: #616161;
  font-size: 0.8em;
  margin-bottom: 5px;
}
style-builder-component .control-details-content .color-control .control-color-picker md-input-container {
  margin: 0;
}
style-builder-component .control-details-content .color-control .color-block {
  height: 50px;
}
style-builder-component .style-details-content {
  padding: 10px;
}
style-builder-component .style-details-content .top-row {
  display: flex;
}
style-builder-component .style-details-content .top-row .left-col {
  padding-right: 10px;
}
style-builder-component .style-details-content .top-row .right-col {
  padding: 0 10px;
  border-left: 1px solid #d7d7d7;
}
style-builder-component .style-details-content .section-header {
  border-top: 1px solid #d7d7d7;
  margin-top: 15px;
}
style-builder-component .type-select-container md-input-container {
  min-width: 230px;
}
style-builder-component .control {
  display: flex;
  flex-wrap: wrap;
  border: 1px solid #d7d7d7;
  padding: 5px;
  margin: 5px 0;
}
style-builder-component .control accordion-header .transclude-container {
  background-color: #757575;
}
style-builder-component .control accordion-header .transclude-container .index {
  background-color: #424242;
}
style-builder-component .control .control-row {
  margin-bottom: 10px;
}
style-builder-component .control md-radio-button {
  display: inline;
  margin-left: 10px;
}
style-builder-component .control input[type=number] {
  width: 4em;
  margin-right: 10px;
}
style-builder-component .control .text-control-values md-input-container {
  width: 100%;
}
style-builder-component .control .color-block {
  display: inline-block;
  border: 1px solid #d7d7d7;
  width: 80px;
  height: 30px;
  transform: translateY(10px);
}
style-builder-component .md-select-value {
  overflow: hidden;
  max-width: 225px;
}

.snippet-quick-select {
  max-width: 300px;
}

.style-builder-tag-select {
  max-width: 500px;
  border: 1px solid #d7d7d7;
}
.style-builder-tag-select .tag-label {
  color: #9e9e9e;
  margin-left: 10px;
}
.style-builder-tag-select .tag-option {
  color: #616161;
  margin-left: 10px;
}

#calendar {
  display: flex;
  flex-flow: row wrap;
  font-family: sans-serif;
  width: 400px;
  height: 600px;
  align-items: flex-end;
  align-content: flex-start;
  background-color: white;
  padding-left: 20px;
}
#calendar * {
  flex: 1 100%;
}
#calendar .h1 {
  font-size: 2em;
}
#calendar .h2 {
  flex: 1 30%;
  font-size: 1.5em;
}
#calendar .h3 {
  flex: 1 70%;
  font-size: 1em;
}
#calendar .h4 {
  font-size: 0.8em;
}
#calendar #calendar-container {
  margin-top: 10px;
  max-height: 510px;
  overflow-y: scroll;
  border: 1px solid #d7d7d7;
}
#calendar #calendar-items-list {
  position: relative;
  display: flex;
  flex-flow: column;
}
#calendar #calendar-items-list .calendar-item {
  display: flex;
  margin: 0 0 10px 0;
  padding: 20px 0;
  flex-flow: row wrap;
  align-items: flex-start;
  background-color: #F8F8F8;
}
#calendar #calendar-items-list .calendar-item .item-date {
  flex: 1 30%;
  text-align: right;
}
#calendar #calendar-items-list .calendar-item .item-title {
  flex: 1 70%;
}
#calendar #calendar-items-list .calendar-item .item-title span, #calendar #calendar-items-list .calendar-item .item-title p {
  padding-left: 8%;
  margin: 0;
}
#calendar #calendar-items-list .calendar-item .item-edits {
  text-align: right;
  padding-right: 10px;
}
#calendar #calendar-items-list .calendar-item .item-edits button {
  width: 24px;
  min-width: 0;
  text-align: center;
  padding: 0;
}
#calendar #calendar-items-list .calendar-item:last-of-type {
  margin-bottom: 0;
}
#calendar .blue {
  color: #3190E3;
}
#calendar .orange {
  color: #F36B46;
}
#calendar .gray {
  color: #37474F;
}
#calendar .light-gray {
  color: #4e5e65;
}
#calendar .right {
  text-align: right;
}
#calendar .md-button {
  margin: 0 0 -20px 0;
  color: #c4c4c4;
  text-align: right;
  transition: color 0.5s;
}
#calendar .md-button:hover {
  background-color: inherit !important;
  color: #8d8d8d;
}

color-chooser {
  border-radius: 3px;
}
color-chooser ng-md-icon {
  fill: white;
}

#color-chooser-panel {
  width: 204px;
  padding: 2px;
  background: white;
}
#color-chooser-panel .item {
  width: 40px;
  height: 40px;
  border: 2px solid white;
  outline: none;
}
#color-chooser-panel .item:hover {
  border: 2px solid #03a9f4;
}
#color-chooser-panel .item.selected {
  border: 2px solid #424242;
}
#color-chooser-panel .remove {
  display: flex;
  align-items: center;
  justify-content: center;
}
#color-chooser-panel .remove ng-md-icon {
  color: #9e9e9e;
}

design-component {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
  overflow-y: auto;
}
design-component .design-top {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  max-height: calc(100% - 73px);
  min-height: 400px;
  overflow-y: visible;
  background-color: white;
}
design-component .design-top.full-height {
  flex: 1 1 1000px;
}
design-component .design-spacer {
  flex: 2 2 auto;
  min-height: 30px;
}
design-component .design-bottom {
  position: relative;
  flex: 1 1 auto;
  padding: 0 10px 10px 10px;
  overflow: auto;
  border-right: 1px solid #d7d7d7;
  border-left: 1px solid #d7d7d7;
}
design-component .size-control {
  border-right: 1px solid #d7d7d7;
  border-left: 1px solid #d7d7d7;
  border-top: 1px solid #d7d7d7;
}
design-component .size-control .drag-icon {
  pointer-events: none;
}
design-component .has-comments {
  background-color: #fff3e0;
}
design-component .markup-btns {
  position: absolute;
  top: -5px;
  right: 5px;
}
design-component .preview-container {
  flex: 1 1 540px;
  height: 100%;
  position: relative;
  margin: 15px 15px 0 15px;
}
design-component .preview-container .background-image {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  opacity: 0;
}
design-component .preview-container .background-image.visible {
  opacity: 1;
  transition: 0.2s opacity ease-in-out;
}
design-component .preview-container .spinner-overlay {
  background-color: rgba(255, 255, 255, 0.85);
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
design-component .preview-container .spinner-overlay .progress-text {
  margin-top: 20px;
  max-width: 380px;
  text-align: center;
  font-size: 1.2em;
  font-weight: bold;
  color: #283593;
  background-color: rgba(255, 255, 255, 0.85);
  padding: 20px;
}
design-component .preview-container.failed {
  border: 1px solid red;
}
design-component .show-slides {
  transform: translateX(6px);
}
design-component .show-slides ng-md-icon {
  color: #9e9e9e;
}
design-component .show-slides.alert ng-md-icon {
  color: #f57c00;
}
design-component .add-slide-button {
  margin: 2px 0;
  min-width: 0px;
  color: #616161;
  text-transform: none;
}
design-component .slides-container {
  position: relative;
  flex: 0 0 auto;
  z-index: -1;
  height: 0px;
  transition: height 0.5s ease;
  margin-bottom: 10px;
}
design-component .slides-container.expand {
  z-index: 1;
  height: 140px;
}
design-component .slides-scroll-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow-x: scroll;
  overflow-y: hidden;
  background-color: #fafafa;
  padding: 0px 5px;
  border: 1px solid #d7d7d7;
}
design-component .pages-container {
  position: relative;
  display: flex;
  padding: 5px;
  min-height: 120px;
}
design-component .page-thumb {
  position: relative;
  padding: 5px;
  display: flex;
  align-items: center;
}
design-component .page-thumb img {
  height: 67.5px;
  width: 90px;
  outline: 1px solid #9e9e9e;
  background-color: white;
  cursor: pointer;
  transition: opacity 0.1s, width 0.5s ease, height 0.5s ease;
  opacity: 0.5;
}
design-component .page-thumb.wide img {
  width: 120px;
}
design-component .page-thumb .delete-button {
  position: absolute;
  top: 14px;
  right: -2px;
  margin: 0;
  padding: 0 !important;
  transition: opacity 0.2s;
  opacity: 0;
  border-radius: 50%;
}
design-component .page-thumb .delete-button ng-md-icon {
  color: #c62828;
  background-color: white;
  border-radius: 50%;
  transition: color 0.2s;
}
design-component .page-thumb .delete-button ng-md-icon:hover {
  color: #f44336;
}
design-component .page-thumb .annotations-icon {
  position: absolute;
  top: 28px;
  left: 6px;
  padding: 4px;
  border-radius: 4px;
  line-height: 0;
  background: #ff8a65;
}
design-component .page-thumb .annotations-icon ng-md-icon {
  fill: white;
}
design-component .page-thumb .slide-type-icon {
  position: absolute;
  bottom: 18px;
  right: 2px;
  padding: 4px;
  border-radius: 4px;
}
design-component .page-thumb .slide-type-icon.ppt-icon {
  background: #ffab91;
}
design-component .page-thumb .slide-type-icon.add-page-icon {
  background: #64b5f6;
}
design-component .page-thumb .slide-type-icon ng-md-icon {
  fill: white;
}
design-component .page-thumb:nth-child(3) img {
  height: 90px;
  width: 120px;
}
design-component .page-thumb:nth-child(3).wide img {
  width: 160px;
}
design-component .page-thumb:nth-child(3) .slide-type-icon {
  bottom: 6px;
  right: 2px;
}
design-component .page-thumb:nth-child(3) .delete-button {
  top: 4px;
}
design-component .page-thumb:nth-child(3) .annotations-icon {
  top: 18px;
  left: 6px;
}
design-component .page-thumb:hover img {
  outline: 1px solid #42a5f5;
}
design-component .page-thumb:hover .delete-button {
  opacity: 1;
}
design-component .page-thumb.selected {
  background-color: white;
}
design-component .page-thumb.selected .add-page-icon {
  background: #1e88e5;
}
design-component .page-thumb.selected .ppt-icon {
  background: #ff8a65;
}
design-component .page-thumb.selected .annotations-icon {
  background: #f4511e;
}
design-component .page-thumb.selected img {
  opacity: 1;
}
design-component .page-thumb.processing {
  opacity: 0.5;
}
design-component .page-thumb.failed {
  border: 1px solid red;
}
design-component .commands {
  margin: 30px 0;
  width: 90%;
}

.dark design-component .design-top {
  background-color: #e6e6e6;
}
.dark design-component .spinner-overlay {
  background-color: rgba(230, 230, 230, 0.85);
}

#add-user-dialog {
  width: 700px;
  max-width: 95%;
}
#add-user-dialog .warning {
  font-weight: bold;
  color: #f44336;
}

#align-tools {
  color: #616161;
}
#align-tools ng-md-icon {
  color: #9e9e9e;
}
#align-tools ng-md-icon:hover {
  color: #ffb74d;
}

#fabric-context-menu {
  color: #616161;
}
#fabric-context-menu .selection-link {
  margin: 0 5px;
}

.slide-style-details-panel {
  display: flex;
  flex-direction: column;
  max-height: 80vh;
  background: white;
  padding: 20px;
  overflow-y: auto;
  width: 450px;
}
.slide-style-details-panel .element-style-container {
  padding: 10px;
}
.slide-style-details-panel .element-style-container > md-input-container {
  width: 100%;
}
.slide-style-details-panel .reset-button {
  margin-top: 15px;
  align-self: flex-end;
}
.slide-style-details-panel .group0 {
  border-left: 3px solid #90caf9;
}
.slide-style-details-panel .group1 {
  border-left: 3px solid #ffcc80;
}
.slide-style-details-panel .group2 {
  border-left: 3px solid #80cbc4;
}
.slide-style-details-panel .group3 {
  border-left: 3px solid #ffe082;
}
.slide-style-details-panel .group4 {
  border-left: 3px solid #9fa8da;
}
.slide-style-details-panel .missing {
  border: 2px solid red;
}
.slide-style-details-panel .top-row {
  display: flex;
}
.slide-style-details-panel .thumb-container {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  cursor: pointer;
}
.slide-style-details-panel .thumb-container img {
  border: 1px solid #90a4ae;
  height: 70px;
}
.slide-style-details-panel .thumb-container .thumb-placeholder {
  height: 70px;
  width: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
}
.slide-style-details-panel .thumb-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
.slide-style-details-panel .thumb-container:hover .ah-remove-button, .slide-style-details-panel .thumb-container:hover .ah-add-button {
  opacity: 1;
}
.slide-style-details-panel .thumb-container:hover img {
  border: 3px solid #90caf9;
}
.slide-style-details-panel .setting-info {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  margin-left: 10px;
}
.slide-style-details-panel .setting-info .setting-name {
  font-weight: bold;
  margin-bottom: 10px;
}
.slide-style-details-panel .controls-container {
  margin: 10px;
  border: 1px solid #d7d7d7;
}
.slide-style-details-panel .control {
  border-bottom: 1px solid #d7d7d7;
  padding: 10px 0;
}
.slide-style-details-panel .control .md-button {
  width: 100%;
  background-color: whitesmoke;
}
.slide-style-details-panel .control md-input-container {
  margin: 0 5px;
}
.slide-style-details-panel .control > * {
  padding: 10px;
}
.slide-style-details-panel .control-info {
  padding: 0 10px;
}
.slide-style-details-panel .control-info .control-details {
  font-size: 0.9em;
}
.slide-style-details-panel .checkbox-control {
  padding: 5px 10px;
}
.slide-style-details-panel .number-control {
  display: flex;
  align-items: flex-start;
}
.slide-style-details-panel .number-control input {
  width: 3em;
}
.slide-style-details-panel .text-control {
  padding-top: 17px;
}
.slide-style-details-panel .text-control md-input-container {
  width: 100%;
}
.slide-style-details-panel .color-control {
  display: flex;
  align-items: center;
}
.slide-style-details-panel .color-control .control-info {
  flex: 1 1 auto;
}
.slide-style-details-panel .color-control input {
  width: 6em;
}

#artwork-tools .item-count {
  color: #9e9e9e;
  cursor: pointer;
}
#artwork-tools .selected-tag-display {
  display: inline-block;
  min-width: 1.5em;
  padding: 0px 5px 1px 5px;
  border-radius: 8px;
  background-color: #9e9e9e;
  text-align: center;
  line-height: 1.3em;
  font-size: 0.8em;
  font-weight: bold;
  color: white;
  max-width: 70px;
  padding: 0px 8px;
  border-radius: 12px;
  font-size: 1em;
  line-height: 1.5em;
  transform: translateY(5px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#artwork-tools .show-art {
  border: 1px solid #d7d7d7;
  max-width: 390px;
  max-height: 500px;
  overflow: auto;
  display: none;
}
#artwork-tools .show-art.show {
  display: block;
}
#artwork-tools .show-art .art-img {
  display: inline-block;
  border: 1px solid #d7d7d7;
  margin: 3px;
}
#artwork-tools .show-art .art-img.selected {
  outline: 4px solid #42a5f5;
}
#artwork-tools .show-art .art-img img {
  border: none;
  max-width: 110px;
}
#artwork-tools .select-art-btn:disabled ng-md-icon {
  color: #eeeeee;
}
#artwork-tools .select-art-btn:disabled:hover ng-md-icon {
  color: whitesmoke;
}

.ah-art-tag-menu .tag-count {
  display: inline-block;
  min-width: 1.5em;
  padding: 0px 5px 1px 5px;
  border-radius: 8px;
  background-color: #9e9e9e;
  text-align: center;
  line-height: 1.3em;
  font-size: 0.8em;
  font-weight: bold;
  color: white;
}

#background-select-dialog {
  max-height: 500px;
  overflow: auto;
}

#billing-dialog {
  max-width: 500px;
}
#billing-dialog .md-title, #billing-dialog .md-subheader {
  text-align: center;
}
#billing-dialog .source-select {
  width: 230px;
  margin: 40px auto;
  color: #9e9e9e;
}
#billing-dialog .source-select .md-checked {
  color: #616161;
}
#billing-dialog .description {
  color: #616161;
  margin: 0 20px;
}

.manager-chooser-panel {
  display: flex;
  flex-direction: column;
  min-height: 80vh;
  max-height: 80vh;
  min-width: 70vw;
  background: white;
}
.manager-chooser-panel manager-tree {
  display: none;
}
.manager-chooser-panel.expanded {
  min-height: 100vh;
  max-height: 100vh;
  min-width: 100vw;
}
.manager-chooser-panel.expanded manager-tree {
  display: block;
}
.manager-chooser-panel .chooser-header {
  background: #0277bd;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 50px;
  flex-direction: row;
}
.manager-chooser-panel .chooser-header .chooser-title {
  color: white;
  font-weight: bold;
}
.manager-chooser-panel .chooser-header .md-button {
  color: white;
  margin-left: 5px;
}
.manager-chooser-panel manager-container {
  flex: 1 1 auto;
}
.manager-chooser-panel .panel-controls {
  align-items: center;
  min-height: 50px;
  border-top: 1px solid #d7d7d7;
}
.manager-chooser-panel .panel-controls .spinner-container {
  margin: 0 20px;
}

#copy-dialog {
  max-width: 500px;
}

#dev-tools-dialog {
  width: 400px;
  display: flex;
  flex-direction: column;
}
#dev-tools-dialog .md-dialog-content {
  display: flex;
  flex-direction: column;
  flex: 2 1 auto;
}
#dev-tools-dialog .controls-panel, #dev-tools-dialog .data-panel {
  height: 100%;
}
#dev-tools-dialog.show-data {
  width: 95vw;
  height: 95vh;
}
#dev-tools-dialog .header {
  display: flex;
  font-size: 1.5em;
  padding: 10px;
}
#dev-tools-dialog .header > * {
  display: block;
}
#dev-tools-dialog .header .spacer {
  flex: 2 1 auto;
}
#dev-tools-dialog .header .back-button {
  flex: 0 0 auto;
  color: #9e9e9e;
  margin-right: 20px;
}
#dev-tools-dialog .content-body {
  padding: 10px;
}
#dev-tools-dialog .data-panel {
  display: flex;
  flex-direction: column;
}
#dev-tools-dialog .data-panel .content-body {
  flex: 2 1 auto;
}
#dev-tools-dialog .data-panel code, #dev-tools-dialog .data-panel .editable-data {
  height: 100%;
  width: 100%;
  display: block;
  color: #333;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px;
  overflow-y: hidden;
  overflow-x: auto;
  padding: 9.5px;
  font-size: 1.1em;
  line-height: 1.42857143;
  white-space: pre;
}
#dev-tools-dialog .data-panel .editable-data {
  resize: none;
  overflow: auto;
}
#dev-tools-dialog .control-row {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  height: 46px;
}
#dev-tools-dialog .control-row .data-type {
  display: inline-block;
  min-width: 120px;
  margin-left: 11px;
}
#dev-tools-dialog .control-row .md-button {
  min-width: auto;
  margin: 5px;
  color: #9e9e9e;
}
#dev-tools-dialog .control-row.slides-range input {
  width: 3em;
}

#direct-form-nav {
  display: flex;
  align-items: center;
}
#direct-form-nav .text {
  margin-right: 10px;
}
#direct-form-nav .direct-nav-input {
  width: 70px;
}
#direct-form-nav .md-errors-spacer {
  display: none;
}

#doc-data-editor-dialog {
  display: flex;
  flex-direction: column;
  min-height: 300px;
  max-height: 650px;
  height: 80vh;
  min-width: 400px;
  max-width: 80vw;
  width: 850px;
  background-color: white;
  color: #9e9e9e;
}
#doc-data-editor-dialog .header {
  flex: 0 0 50px;
  align-items: center;
  display: flex;
  padding: 10px;
  background-color: #1a237e;
  font-size: 18px;
  font-weight: bold;
  color: white;
}
#doc-data-editor-dialog .data-type-chooser {
  flex: 0 0 50px;
  align-items: center;
  display: flex;
}
#doc-data-editor-dialog .data-type-chooser .data-type-link {
  padding: 10px;
  text-transform: capitalize;
}
#doc-data-editor-dialog .content-container {
  display: flex;
  flex-direction: column;
  flex: 1 2 auto;
  overflow: hidden;
  padding: 10px;
}
#doc-data-editor-dialog .add-new-link {
  margin-left: 6px;
}
#doc-data-editor-dialog .data-container {
  overflow: auto;
}
#doc-data-editor-dialog .data-container .data-item {
  display: flex;
  padding-right: 10px;
}
#doc-data-editor-dialog .data-container .data-item md-input-container {
  margin: 5px 0;
}
#doc-data-editor-dialog .data-container .data-item .label-input {
  flex: 1 1 auto;
}
#doc-data-editor-dialog .panel-controls {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  min-height: 60px;
}

#download-dialog {
  width: 650px;
  min-width: 500px;
}
#download-dialog .controls-container {
  border: 1px solid #d7d7d7;
  padding: 10px;
}
#download-dialog .control-row {
  padding: 10px 0;
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  color: #9e9e9e;
}
#download-dialog .control-row .md-button {
  margin: 0;
  width: 250px;
  height: 100%;
}
#download-dialog .control-row .settings {
  width: 150px;
}
#download-dialog .control-row .slidenumber {
  margin-left: 10px;
}
#download-dialog .control-row md-input-container {
  margin: 0 10px;
}
#download-dialog .control-row md-input-container .md-errors-spacer {
  display: none;
}
#download-dialog .control-row md-input-container .md-input {
  border-bottom: 1px solid #1565c0;
  min-width: 50px;
}
#download-dialog .control-row md-input-container.filename, #download-dialog .control-row md-input-container.control-text-input {
  flex: 1 1 auto;
  margin: 0 10px;
}
#download-dialog .control-row .control-value {
  flex: 1 1 auto;
  margin: 0 10px;
  display: flex;
}
#download-dialog .control-row .char-count {
  margin-top: 10px;
  font-size: 0.9em;
  color: #9e9e9e;
}

.download-doxctemplate-select {
  z-index: 1000;
}

#download-progress {
  width: 300px;
  height: 80px;
  color: #616161;
  font-size: 0.8em;
}
#download-progress .header {
  font-weight: bold;
  margin-bottom: 5px;
}
#download-progress md-progress-linear {
  margin: 10px 0;
  background-color: #eeeeee;
}
#download-progress md-progress-linear .md-bar1 {
  opacity: 0.2 !important;
  background-color: #212121;
  z-index: 100;
}
#download-progress .display-data {
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
}

#edit-calendar-item .data {
  background-color: #eeeeee;
  padding: 10px;
}
#edit-calendar-item md-dialog-content {
  min-width: 396px;
}
#edit-calendar-item md-content {
  background-color: white;
}
#edit-calendar-item .md-block {
  width: 100%;
}

.fullscreen-image-panel {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.fullscreen-image-panel > div {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  cursor: zoom-out;
}
.fullscreen-image-panel > div img {
  background: white;
  transform: scale(2);
  max-width: 46vw;
  max-height: 46vh;
  outline: none;
}
.fullscreen-image-panel > div .info-button {
  position: absolute;
  bottom: 10px;
  right: 10px;
  background-color: white;
  min-width: auto;
  padding: 2px;
}
.fullscreen-image-panel > div .info-button ng-md-icon {
  color: #9e9e9e;
  transition: color 0.15s linear;
}
.fullscreen-image-panel > div .info-button:hover {
  background-color: #fafafa;
}
.fullscreen-image-panel > div .info-button:hover ng-md-icon {
  color: #ffb74d;
}
.fullscreen-image-panel.slideshow {
  background-color: black;
}
.fullscreen-image-panel.slideshow img {
  max-width: 50vw;
  max-height: 50vh;
}

#form-history-dialog {
  min-width: 800px;
  display: flex;
  flex-direction: column;
}
#form-history-dialog md-toolbar {
  color: white;
  background-color: #546e7a;
}
#form-history-dialog md-toolbar .md-toolbar-tools {
  font-weight: bold;
}
#form-history-dialog md-dialog-content {
  color: #9e9e9e;
  max-height: 80vh;
  min-height: 300px;
}
#form-history-dialog .status-icon {
  color: #616161;
}
#form-history-dialog .status-icon.request {
  color: #388e3c;
}

#layout-select-dialog {
  max-height: 500px;
  overflow: auto;
}

#new-project-dialog {
  width: 500px;
  color: #616161;
}
#new-project-dialog .project-name {
  width: 100%;
  margin-bottom: 30px;
}
#new-project-dialog .project-name .md-errors-spacer {
  display: none;
}
#new-project-dialog .controls-row {
  display: flex;
  align-items: center;
  height: 50px;
  width: 100%;
}

.outline-copy-panel {
  display: flex;
  flex-direction: column;
  height: 90vh;
  width: 90vw;
  background: white;
}
.outline-copy-panel.expanded {
  min-height: 100vh;
  max-height: 100vh;
  min-width: 100vw;
}
.outline-copy-panel .chooser-header {
  background: #0277bd;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 50px;
}
.outline-copy-panel .chooser-header .chooser-title {
  color: white;
  font-weight: bold;
}
.outline-copy-panel .content {
  display: flex;
  overflow: hidden;
}
.outline-copy-panel .panel-controls {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  min-height: 50px;
  border-top: 1px solid #d7d7d7;
}
.outline-copy-panel .panel-controls .spinner-container {
  margin: 0 20px;
}

#page-switch-tools .item-count {
  color: #9e9e9e;
  cursor: pointer;
}
#page-switch-tools .selected-tag-display {
  display: inline-block;
  min-width: 1.5em;
  padding: 0px 5px 1px 5px;
  border-radius: 8px;
  background-color: #9e9e9e;
  text-align: center;
  line-height: 1.3em;
  font-size: 0.8em;
  font-weight: bold;
  color: white;
  max-width: 70px;
  padding: 0px 8px;
  border-radius: 12px;
  font-size: 1em;
  line-height: 1.5em;
  transform: translateY(5px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#page-switch-tools .show-art {
  border: 1px solid #d7d7d7;
  max-width: 410px;
  max-height: 500px;
  overflow: auto;
  display: none;
  padding: 10px;
}
#page-switch-tools .show-art.show {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
#page-switch-tools .show-art .art-img {
  position: relative;
  display: inline-block;
  border: 1px solid #d7d7d7;
}
#page-switch-tools .show-art .art-img.selected {
  outline: 4px solid #42a5f5;
}
#page-switch-tools .show-art .art-img img {
  border: none;
  max-width: 110px;
  max-height: 90px;
}
#page-switch-tools .show-art .art-img .view-edit-tools {
  display: flex;
  justify-content: flex-end;
  gap: 5px;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  padding: 5px;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 10;
  opacity: 0;
  transition: opacity 0.2s;
}
#page-switch-tools .show-art .art-img:hover .view-edit-tools {
  opacity: 1;
}
#page-switch-tools .select-art-btn:disabled ng-md-icon {
  color: #eeeeee;
}
#page-switch-tools .select-art-btn:disabled:hover ng-md-icon {
  color: whitesmoke;
}

#pinning-controls {
  border: 1px solid #d7d7d7;
}
#pinning-controls .pinning-radio-group {
  width: 72px;
  display: flex;
  flex-wrap: wrap;
}
#pinning-controls .pinning-radio-group md-radio-button {
  margin: 2px;
  width: 20px;
  height: 20px;
}

#project-info-panel {
  width: 400px;
  background-color: white;
}
#project-info-panel .header {
  background-color: #1565c0;
}
#project-info-panel .layout-container {
  display: inline-block;
  width: 100%;
}
#project-info-panel .preview-image {
  width: 100%;
  max-height: 100%;
}

#save-page-dialog {
  width: 90%;
  max-width: 550px;
}
#save-page-dialog .dialog-content {
  padding-bottom: 0;
  color: #616161;
}
#save-page-dialog .dialog-content > * {
  margin-bottom: 10px;
}
#save-page-dialog .dialog-content .header {
  font-size: 22px;
  font-weight: 500;
}
#save-page-dialog .dialog-content .hotness {
  margin-bottom: 20px;
}
#save-page-dialog .dialog-content .checkbox-container {
  display: flex;
  flex-direction: column;
  margin-top: 20px;
}
#save-page-dialog .dialog-content .active-node {
  border: 1px solid #d7d7d7;
  padding: 5px;
  border-radius: 5px;
}
#save-page-dialog .dialog-content .active-node .index {
  border-radius: 5px;
  padding: 1px 6px 2px 6px;
  background-color: #64b5f6;
  font-weight: bold;
  color: white;
}
#save-page-dialog .dialog-content .active-node .node-name {
  font-weight: bold;
}
#save-page-dialog .dialog-content md-radio-button {
  margin-bottom: 10px;
}

#slide-edit-settings {
  min-width: 300px;
}
#slide-edit-settings .menu-row {
  color: #616161;
}
#slide-edit-settings .menu-row .md-button {
  margin: 4px 0;
  width: 100%;
  text-align: left;
}
#slide-edit-settings .menu-row .md-button ng-md-icon {
  transform: translateY(-3px);
  color: #9e9e9e;
  margin-right: 6px;
}
#slide-edit-settings .menu-row .grid-size-input {
  width: 40px;
  margin-right: 15px;
}
#slide-edit-settings .menu-row .resolution-input {
  width: 50px;
  margin-right: 15px;
}
#slide-edit-settings .menu-row.snapping, #slide-edit-settings .menu-row.resolution, #slide-edit-settings .menu-row.checkbox {
  margin-top: 8px;
  padding-left: 7px;
  font-size: 14px;
  font-weight: 500;
  display: flex;
}
#slide-edit-settings .menu-row.snapping .label, #slide-edit-settings .menu-row.resolution .label, #slide-edit-settings .menu-row.checkbox .label {
  padding: 2px 0 0 0;
  flex: 2 1 auto;
}
#slide-edit-settings hr {
  margin: 20px 0;
}

#slide-element-menu {
  min-width: 300px;
}
#slide-element-menu .menu-row {
  display: flex;
}
#slide-element-menu .md-button {
  min-width: auto;
  width: 100%;
  text-align: left;
}
#slide-element-menu .md-button.active {
  color: #ff8a65;
}
#slide-element-menu .label-container {
  flex: 2 0 auto;
  display: flex;
  margin: 6px 8px;
  padding: 0 6px;
  align-items: center;
  color: #616161;
  font-size: 14px;
  font-weight: 500;
}
#slide-element-menu ng-md-icon {
  min-width: 24px;
  margin-right: 5px;
}
#slide-element-menu .row-label {
  color: #9e9e9e;
}
#slide-element-menu .layer-button {
  min-width: 70px;
  text-align: center;
}
#slide-element-menu .layer-button ng-md-icon {
  margin: 0;
}

#slide-settings-dialog {
  min-width: 1100px;
  height: 900px;
  display: flex;
  flex-direction: column;
}
#slide-settings-dialog md-toolbar {
  color: white;
  background-color: #43a047;
}
#slide-settings-dialog md-toolbar .md-toolbar-tools {
  font-weight: bold;
}
#slide-settings-dialog .slide-settings-tabs {
  height: 48px;
}
#slide-settings-dialog .warning-text {
  padding: 10px;
  color: #616161;
}
#slide-settings-dialog .settings-content {
  display: flex;
  flex-wrap: wrap;
  align-content: stretch;
  height: 100%;
  overflow: auto;
  padding: 10px;
}
#slide-settings-dialog .list-container {
  height: 100%;
  width: 520px;
  overflow: auto;
  margin-right: 30px;
}
#slide-settings-dialog .settings-list {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: flex-start;
  color: #616161;
  padding: 0;
  height: 100%;
}
#slide-settings-dialog .settings-list-item {
  width: 250px;
  transition: background-color 0.25s ease;
  padding-right: 10px;
}
#slide-settings-dialog .settings-list-item:hover {
  background-color: white;
  color: #1e88e5;
}
#slide-settings-dialog .settings-list-item.disabled {
  background-color: #e0e0e0;
  opacity: 0.5;
}
#slide-settings-dialog .color-clear-button {
  position: absolute;
  right: 0;
  top: 5px;
}
#slide-settings-dialog .number-input input {
  width: 40px;
  text-align: right;
}
#slide-settings-dialog .info-image {
  display: inline-block;
  width: 500px;
  background-color: white;
  padding: 10px;
  border: 1px solid #d7d7d7;
  height: 350px;
}
#slide-settings-dialog .info-image .info-image-header {
  display: flex;
  justify-content: space-between;
  padding: 0px 110px 10px 110px;
  color: #1e88e5;
}
#slide-settings-dialog .info-image .info-image-header md-checkbox {
  margin: 0;
  width: 20px;
}
#slide-settings-dialog .info-image .info-image-label {
  text-align: center;
}
#slide-settings-dialog .info-image img {
  border: 1px solid #9e9e9e;
  max-width: 100%;
}
#slide-settings-dialog .info-image .info-text {
  color: #9e9e9e;
  font-size: 0.9em;
}
#slide-settings-dialog .style-controls {
  display: flex;
  align-items: center;
  color: #616161;
}
#slide-settings-dialog .commands {
  height: 100%;
  padding: 0 20px;
  margin: 20px;
  overflow: auto;
  border: 1px solid #d7d7d7;
}
#slide-settings-dialog .commands .commands-input {
  width: 100%;
}

.slide-style-details-panel {
  display: flex;
  flex-direction: column;
  max-height: 80vh;
  background: white;
  padding: 20px;
  overflow-y: auto;
}
.slide-style-details-panel .template-container {
  padding: 10px 0;
  color: #616161;
}
.slide-style-details-panel .asset-header {
  color: #9e9e9e;
  margin: 10px 0;
  font-weight: bold;
  font-size: 0.8em;
}
.slide-style-details-panel .assets-container .horiz-rule {
  border-top: 1px solid #d7d7d7;
}
.slide-style-details-panel .assets-container accordion-content > .transclude-container:not(.is-hidden) {
  padding: 10px 0;
  border-bottom: 1px solid #d7d7d7;
}
.slide-style-details-panel .assets-container.animated {
  transition: all 0.8s ease-in-out;
}
.slide-style-details-panel .section-divider {
  width: 100%;
}
.slide-style-details-panel .settings-btn {
  align-self: flex-start;
  margin: 4px 0;
}
.slide-style-details-panel .settings-btn ng-md-icon {
  min-width: 25px;
  transform: translateY(-2px);
  color: #9e9e9e;
  margin-right: 6px;
}
.slide-style-details-panel .settings-btn.on {
  color: #ff8a65;
}
.slide-style-details-panel .settings-btn.on ng-md-icon {
  color: #ff8a65;
}
.slide-style-details-panel .resolution-input {
  width: 80px;
  margin: 0;
}
.slide-style-details-panel .element-styles-container > md-input-container {
  width: 100%;
}
.slide-style-details-panel .create-layout-buttons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.slide-style-details-panel .group0 {
  border-left: 3px solid #90caf9;
}
.slide-style-details-panel .group1 {
  border-left: 3px solid #ffcc80;
}
.slide-style-details-panel .group2 {
  border-left: 3px solid #80cbc4;
}
.slide-style-details-panel .group3 {
  border-left: 3px solid #ffe082;
}
.slide-style-details-panel .group4 {
  border-left: 3px solid #9fa8da;
}
.slide-style-details-panel .missing {
  border: 2px solid red;
}
.slide-style-details-panel .background-quick-select-container .md-select-value {
  border: none !important;
}
.slide-style-details-panel .background-quick-select-container .md-select-value > span:first-child {
  display: none;
}

.slide-style-details-panel {
  display: flex;
  flex-direction: column;
  max-height: 80vh;
  background: white;
  padding: 20px;
  overflow-y: auto;
  width: 450px;
}
.slide-style-details-panel .element-style-container {
  padding: 10px;
}
.slide-style-details-panel .element-style-container > md-input-container {
  width: 100%;
}
.slide-style-details-panel .group0 {
  border-left: 3px solid #90caf9;
}
.slide-style-details-panel .group1 {
  border-left: 3px solid #ffcc80;
}
.slide-style-details-panel .group2 {
  border-left: 3px solid #80cbc4;
}
.slide-style-details-panel .group3 {
  border-left: 3px solid #ffe082;
}
.slide-style-details-panel .group4 {
  border-left: 3px solid #9fa8da;
}
.slide-style-details-panel .missing {
  border: 2px solid red;
}
.slide-style-details-panel .top-row {
  display: flex;
}
.slide-style-details-panel .thumb-container {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  cursor: pointer;
}
.slide-style-details-panel .thumb-container img {
  border: 1px solid #90a4ae;
  height: 70px;
}
.slide-style-details-panel .thumb-container .thumb-placeholder {
  height: 70px;
  width: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
}
.slide-style-details-panel .thumb-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
.slide-style-details-panel .thumb-container:hover .ah-remove-button, .slide-style-details-panel .thumb-container:hover .ah-add-button {
  opacity: 1;
}
.slide-style-details-panel .thumb-container:hover img {
  border: 3px solid #90caf9;
}
.slide-style-details-panel .setting-info {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  margin-left: 10px;
}
.slide-style-details-panel .setting-info .setting-name {
  font-weight: bold;
  margin-bottom: 10px;
}
.slide-style-details-panel .controls-container {
  margin: 10px;
  border: 1px solid #d7d7d7;
}
.slide-style-details-panel .control .md-button {
  width: 100%;
  background-color: whitesmoke;
}
.slide-style-details-panel .control md-input-container {
  margin: 0 5px;
}
.slide-style-details-panel .control > * {
  padding: 10px;
}
.slide-style-details-panel .control-info {
  padding: 0 10px;
}
.slide-style-details-panel .control-info .control-details {
  font-size: 0.9em;
}
.slide-style-details-panel .checkbox-control {
  padding: 5px 10px;
}
.slide-style-details-panel .number-control {
  display: flex;
  align-items: flex-start;
}
.slide-style-details-panel .number-control input {
  width: 3em;
}
.slide-style-details-panel .text-control {
  padding-top: 17px;
}
.slide-style-details-panel .text-control md-input-container {
  width: 100%;
}
.slide-style-details-panel .color-control {
  display: flex;
  align-items: center;
}
.slide-style-details-panel .color-control .control-info {
  flex: 1 1 auto;
}
.slide-style-details-panel .color-control input {
  width: 6em;
}

#snippet-editor-dialog {
  min-height: 300px;
  max-height: 650px;
  height: 80vh;
  min-width: 400px;
  max-width: 80vw;
  width: 850px;
  background-color: white;
  color: #9e9e9e;
}
#snippet-editor-dialog .header {
  min-height: 40px;
  font-weight: bold;
  background-color: #4a148c;
  color: white;
  padding-left: 10px;
}
#snippet-editor-dialog .header ng-md-icon {
  margin: 0 10px;
}
#snippet-editor-dialog md-content {
  width: 100%;
  background-color: white;
  padding: 0 40px;
}
#snippet-editor-dialog .input-container {
  padding: 0;
  margin: 20px 0 0;
}
#snippet-editor-dialog .list-row {
  border-bottom: 1px solid #ddd;
  min-height: 40px;
  padding: 6px 3px;
}
#snippet-editor-dialog .list-row:hover .remove-icon, #snippet-editor-dialog .list-row:hover .grab-handle {
  color: #9e9e9e;
}
#snippet-editor-dialog .ah-asset-count {
  margin-left: 10px;
}
#snippet-editor-dialog .remove-icon {
  transition: color 0.2s;
  height: 15px;
  width: 15px;
  margin-right: 5px;
  color: transparent;
  outline: none;
  cursor: pointer;
}
#snippet-editor-dialog .remove-icon svg {
  width: 100%;
  height: 100%;
}
#snippet-editor-dialog .remove-icon:hover {
  color: #ffb74d !important;
}
#snippet-editor-dialog .list-container {
  margin-top: 30px;
  border: 1px solid #ddd;
  padding: 0 10px;
  overflow: auto;
}
#snippet-editor-dialog md-input-container .md-errors-spacer {
  min-height: 0;
  min-width: 1px;
}
#snippet-editor-dialog .grab-handle {
  cursor: move;
  padding: 5px;
  color: transparent;
}
#snippet-editor-dialog .fa-bars {
  color: lightgrey;
}
#snippet-editor-dialog .list-item[contenteditable=true]:focus, #snippet-editor-dialog .list-item[contenteditable=true]:hover {
  color: blue;
}
#snippet-editor-dialog .panel-controls {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  min-height: 60px;
}

#style-save-dialog {
  min-width: 800px;
  display: flex;
  flex-direction: column;
  color: #616161;
}
#style-save-dialog md-toolbar {
  color: white;
  background-color: #1a237e;
}
#style-save-dialog md-toolbar .md-toolbar-tools {
  font-weight: bold;
}
#style-save-dialog md-dialog-content {
  flex: 1 1 auto;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
}
#style-save-dialog .layout-preview {
  display: inline-block;
  width: 500px;
  padding: 10px;
}
#style-save-dialog .layout-preview img {
  max-width: 100%;
}
#style-save-dialog .layout-details {
  display: inline-block;
  width: 300px;
  padding: 10px;
}
#style-save-dialog .details-row {
  margin-bottom: 20px;
}
#style-save-dialog .progress-container {
  display: inline-block;
  width: 100%;
  height: 25px;
  padding: 10px;
}

#tag-editor-dialog {
  min-height: 300px;
  max-height: 650px;
  height: 80vh;
  min-width: 400px;
  max-width: 80vw;
  width: 850px;
  background-color: white;
  color: #9e9e9e;
}
#tag-editor-dialog md-toolbar {
  min-height: 40px;
  font-weight: bold;
  background-color: #1e88e5;
  color: white;
}
#tag-editor-dialog md-toolbar ng-md-icon {
  margin: 0 10px;
}
#tag-editor-dialog md-content {
  width: 100%;
  background-color: white;
  padding: 0 40px;
}
#tag-editor-dialog .tag-editor-tabs {
  height: 48px;
  padding: 0 10px;
}
#tag-editor-dialog .tag-editor-tabs .md-tab {
  padding: 12px 10px;
  font-size: 0.9em;
}
#tag-editor-dialog .te-input-container {
  padding: 0;
  margin: 20px 0 0;
}
#tag-editor-dialog .tag-row {
  border-bottom: 1px solid #ddd;
  height: 40px;
  padding: 3px;
}
#tag-editor-dialog .tag-row:hover .remove-icon, #tag-editor-dialog .tag-row:hover .grab-handle {
  color: #9e9e9e;
}
#tag-editor-dialog .ah-asset-count {
  margin-left: 10px;
}
#tag-editor-dialog .remove-icon {
  transition: color 0.2s;
  height: 15px;
  width: 15px;
  margin-right: 5px;
  color: transparent;
  outline: none;
  cursor: pointer;
}
#tag-editor-dialog .remove-icon svg {
  width: 100%;
  height: 100%;
}
#tag-editor-dialog .remove-icon:hover {
  color: #ffb74d !important;
}
#tag-editor-dialog .te-tags-container {
  margin-top: 30px;
  border: 1px solid #ddd;
  padding: 0 10px;
  overflow: auto;
}
#tag-editor-dialog md-input-container .md-errors-spacer {
  min-height: 0;
  min-width: 1px;
}
#tag-editor-dialog .grab-handle {
  cursor: move;
  padding: 5px;
  color: transparent;
}
#tag-editor-dialog .fa-bars {
  color: lightgrey;
}
#tag-editor-dialog .te-list-item[contenteditable=true]:focus, #tag-editor-dialog .te-list-item[contenteditable=true]:hover {
  color: blue;
}
#tag-editor-dialog .panel-controls {
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  min-height: 60px;
}

#tree-header-menu .menu-row {
  display: flex;
  align-items: center;
}
#tree-header-menu .menu-row .md-button {
  margin: 4px 0;
  width: 100%;
  text-align: left;
  color: #616161;
}
#tree-header-menu .menu-row .md-button ng-md-icon {
  color: #9e9e9e;
}
#tree-header-menu .menu-row .md-button ng-md-icon .bg {
  color: white;
}
#tree-header-menu .menu-row .md-button ng-md-icon .spinner {
  color: transparent;
}
#tree-header-menu .menu-row .md-button ng-md-icon .badge {
  color: transparent;
}
#tree-header-menu .menu-row .md-button ng-md-icon.comment-icon .badge-bg {
  color: #f4511e;
}
#tree-header-menu .menu-row .md-button ng-md-icon.comment-icon .badge-border {
  color: white;
}
#tree-header-menu .menu-row .md-button ng-md-icon.update-icon .bg {
  color: #ff9800;
}
#tree-header-menu .menu-row .md-button ng-md-icon.processing-icon .spinner {
  color: #616161;
}
#tree-header-menu .menu-row .row-label {
  padding: 6px;
  color: #9e9e9e;
}
#tree-header-menu .menu-row .layer-button {
  min-width: 70px;
  text-align: center;
}

#upload-dialog {
  max-width: 850px;
  width: 95%;
}
#upload-dialog md-input-container {
  margin: 0;
}
#upload-dialog md-input-container:first-child {
  margin-right: 5px;
}
#upload-dialog md-input-container:last-child {
  margin-left: 5px;
}
#upload-dialog md-input-container .md-errors-spacer {
  display: none;
}
#upload-dialog md-input-container .md-input {
  border-bottom: 1px solid #1565c0;
}
#upload-dialog .md-dialog-content {
  color: #9e9e9e;
  padding-bottom: 0;
}
#upload-dialog .md-dialog-content .md-title {
  display: inline-block;
  font-size: 16px;
  margin-bottom: 8px;
}
#upload-dialog .md-dialog-content .file-table {
  border: 1px solid #d7d7d7;
  padding: 10px;
  margin: 10px 0;
}
#upload-dialog .md-dialog-content .file-table .md-column {
  padding: 0 0 10px 0;
  border-bottom: #9e9e9e;
  color: #9e9e9e;
}
#upload-dialog .md-dialog-content .file-table .md-row {
  height: auto;
}
#upload-dialog .md-dialog-content .file-table .md-cell {
  color: #616161;
  border: none;
  padding: 0 10px 0 0;
}
#upload-dialog .md-dialog-content .file-table .md-cell.remove {
  width: 10px;
}
#upload-dialog .md-dialog-content .file-table .md-cell.filename {
  max-width: 150px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#upload-dialog .md-dialog-content .file-table .md-cell.name {
  max-width: 300px;
  min-width: 200px;
  padding-right: 20px;
}
#upload-dialog .md-dialog-content .file-table .md-cell.name md-input-container {
  width: 100%;
  margin: 0;
}
#upload-dialog .md-dialog-content .file-table .md-cell.range {
  width: 150px;
  min-width: 150px;
}
#upload-dialog .md-dialog-content .file-table .md-errors-spacer {
  min-height: 0;
}
#upload-dialog .md-dialog-content .option-row {
  margin: 20px 0;
}
#upload-dialog .md-dialog-content .option-row > *:first-child {
  margin-right: 20px;
}
#upload-dialog .md-dialog-content .option-row tag-chooser {
  width: 70%;
}
#upload-dialog .md-dialog-content .option-row .confidential-switch {
  zoom: 1.3;
  margin-top: 7px;
}
#upload-dialog .md-dialog-content .option-row hotness {
  margin-top: 10px;
  zoom: 0.8;
}
#upload-dialog .md-dialog-content md-progress-linear {
  margin-top: 15px;
  margin-bottom: 15px !important;
}
#upload-dialog md-dialog-actions {
  margin-top: 20px;
}

#upload-single-dialog {
  width: 350px;
  max-width: 90%;
}
#upload-single-dialog .control-row {
  padding: 10px 0;
}
#upload-single-dialog md-input-container {
  margin: 0 10px 0 0;
}
#upload-single-dialog md-input-container .md-errors-spacer {
  display: none;
}
#upload-single-dialog md-input-container .md-input {
  border: 1px solid #1565c0;
  width: 50px;
}

#view-callout-dialog {
  max-width: 90vw;
}
#view-callout-dialog .layout-container {
  display: flex;
  flex-wrap: wrap;
}
#view-callout-dialog .group-container {
  flex: 0 1 250px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
#view-callout-dialog .image-container {
  display: flex;
  align-items: center;
  border: 1px solid #757575;
  background-image: url(./../assets/checkerboard.svg);
  background-size: 24px;
  background-repeat: repeat;
  margin: 10px;
  padding: 5px;
}
#view-callout-dialog .image-container img {
  width: 100%;
}

firepad .indent-index {
  display: inline-block;
  width: 15px;
  margin-left: 17px;
  padding: 2px 0 0 2px;
  font-size: 0.9em;
  color: #9e9e9e;
  border-left: 1px solid #d7d7d7;
}
firepad #firepad, firepad #firepad + .firepad {
  height: 220px;
}
firepad .powered-by-firepad {
  display: none;
}
firepad .firepad-toolbar-wrapper .firepad-btn-group:nth-child(9) {
  display: none;
}
firepad .firepad-btn, firepad .firepad-btn:visited, firepad .firepad-btn:active {
  font-size: 12px;
  padding: 4px 4px 2px 4px;
  border-bottom-width: 1px;
}
firepad .firepad-btn-group {
  margin: 0 7px 0 0;
}
firepad .firepad-btn-group > .firepad-btn:first-child, firepad .firepad-btn-group > .firepad-btn:last-child {
  border-radius: 0;
}
firepad .firepad-toolbar {
  padding-left: 0;
  height: 35px;
  line-height: 35px;
  border: none;
}
firepad .firepad-with-toolbar .CodeMirror {
  top: 35px;
  border: 1px solid #d7d7d7;
}
firepad .online-people {
  margin: 5px 0 0 0;
  padding-left: 0;
  position: relative;
  z-index: 10;
}
firepad .online-indicator {
  width: 25px;
  display: inline-block;
  margin-right: 5px;
}
firepad .online-indicator img {
  width: 100%;
}
firepad .online-indicator .color-indicator {
  height: 4px;
}
firepad .firepad-btn-group:nth-child(1),
firepad .firepad-btn-group:nth-child(2),
firepad .firepad-btn-group:nth-child(5) {
  display: none;
}
firepad .indicator-tooltip {
  background-color: #FF5722;
  padding: 3px 6px 4px 6px;
  min-width: 60px;
}
firepad tooltip._left tip-arrow {
  border-left-color: #FF5722;
}
firepad tooltip._right tip-arrow {
  border-right-color: #FF5722;
}
firepad tooltip._top tip-arrow {
  border-top-color: #FF5722;
}
firepad tooltip._bottom tip-arrow {
  border-bottom-color: #FF5722;
}

folder-view {
  display: flex;
  width: 100%;
  height: 100%;
}
folder-view .list-container {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  margin: 20px;
  border-radius: 20px;
  border: 1px solid #d7d7d7;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
}
folder-view .list-container dropzone {
  border-radius: 20px;
}
folder-view .details {
  flex: 0 0 250px;
  padding: 20px 10px;
}
folder-view .md-button.md-primary {
  color: white !important;
}
folder-view .upload-button, folder-view .download-button {
  padding: 0px 20px 0px 13px;
}
folder-view .details, folder-view .details-placeholder {
  flex: 0 0 300px;
  color: #616161;
  overflow: auto;
}
folder-view .details .asset-name, folder-view .details-placeholder .asset-name {
  padding: 15px;
  color: #616161;
  font-weight: bold;
  text-align: center;
}
folder-view .details .preview-image, folder-view .details-placeholder .preview-image {
  padding: 15px;
}
folder-view .details .preview-image img, folder-view .details-placeholder .preview-image img {
  background-color: white;
  border: 1px solid #9e9e9e;
  max-width: 100%;
  cursor: zoom-in;
}
folder-view .details .asset-info, folder-view .details-placeholder .asset-info {
  padding: 15px;
}
folder-view .details .asset-info .info-row, folder-view .details-placeholder .asset-info .info-row {
  margin-bottom: 15px;
}
folder-view .details .asset-info .info-row.tags, folder-view .details-placeholder .asset-info .info-row.tags {
  position: relative;
}
folder-view .details .asset-info .info-row.tags tag-chooser, folder-view .details-placeholder .asset-info .info-row.tags tag-chooser {
  display: block;
}
folder-view .details .asset-info .info-subhead, folder-view .details-placeholder .asset-info .info-subhead {
  font-size: 0.9em;
}
folder-view .details .asset-info .info-subhead.confidential, folder-view .details .asset-info .info-subhead.hotness, folder-view .details-placeholder .asset-info .info-subhead.confidential, folder-view .details-placeholder .asset-info .info-subhead.hotness {
  display: inline-block;
}
folder-view .details .asset-info .confidential-switch, folder-view .details-placeholder .asset-info .confidential-switch {
  display: inline-block;
  margin-left: 10px;
  height: 17px;
}
folder-view table.md-table.md-row-select td.md-cell:nth-child(n+3):nth-last-child(n+2),
folder-view table.md-table.md-row-select th.md-column:nth-child(n+3):nth-last-child(n+2) {
  padding: 0 30px 0 0;
}

form-component {
  flex: 1 1 auto;
}
form-component .content-container {
  display: flex;
  height: 100%;
  min-width: 550px;
}
form-component .content-container > .content-left {
  position: relative;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
}
form-component .form-tools {
  margin-top: 10px;
  display: flex;
  width: 100%;
}
form-component .form-tools .form-tools-left {
  width: 100px;
  flex: 2 1 auto;
}
form-component .form-tools .form-tools-left .add-asset-btns {
  display: flex;
  justify-content: center;
  width: 100%;
}
form-component .form-tools .form-tools-left .add-asset-btns > * {
  margin: 0px 20px;
}
form-component .group-container {
  display: flex;
  height: 100%;
  padding-top: 49px;
}
form-component .group-container .content {
  position: relative;
  flex: 0 1 100%;
  display: flex;
  flex-direction: column;
}
form-component .group-container .content .form-tools {
  position: absolute;
  top: -39px;
  right: 0;
}
form-component .group-container .content .slidePlaceholder {
  flex: 0 0 60%;
  display: flex;
  align-items: center;
  justify-content: center;
}
form-component .group-container .content .comments {
  flex: 1 1 auto;
}
form-component .group-container .content .group-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 200px;
  color: #9e9e9e;
  font-size: 1.2em;
  font-weight: bold;
}
form-component .group-container .group-details {
  flex: 0 0 350px;
}

hotness {
  display: inline-block;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
hotness ng-md-icon {
  color: #bdbdbd;
  transition: color 0.2s ease;
  outline: none;
}
hotness ng-md-icon.editable {
  cursor: pointer;
}
hotness ng-md-icon.active {
  color: #ff8a65;
}
hotness ng-md-icon.hovered {
  color: #f57c00;
}
hotness ng-md-icon.remove-hotness:hover {
  color: #f57c00;
}

layout-snapshot-details {
  display: flex;
  position: relative;
  padding: 10px;
  cursor: pointer;
}
layout-snapshot-details.selected {
  border: 2px solid #64b5f6;
}
layout-snapshot-details:hover {
  background-color: #e3f2fd;
}
layout-snapshot-details .thumb-container {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
layout-snapshot-details .thumb-container img {
  border: 1px solid #90a4ae;
  height: 70px;
}
layout-snapshot-details .thumb-container .thumb-placeholder {
  height: 70px;
  width: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
  border: 1px solid #d7d7d7;
}
layout-snapshot-details .thumb-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
layout-snapshot-details .update-button-container {
  position: absolute;
  left: 12px;
  top: 15px;
}
layout-snapshot-details .update-button-container .md-button {
  opacity: 0;
  transition: 0.3s;
  margin: 0;
  padding: 5;
  min-width: 40px;
  background-color: white;
  border: 1px solid #d7d7d7;
  color: #9e9e9e;
}
layout-snapshot-details .update-button-container .md-button:hover {
  background-color: white;
  color: #616161;
}
layout-snapshot-details .delete-button-container {
  position: absolute;
  top: 0px;
  right: 2px;
}
layout-snapshot-details .delete-button-container .delete-button {
  transition: 0.3s;
  opacity: 0;
  padding: 0 !important;
  color: #f44336;
}
layout-snapshot-details .delete-button-container .delete-button ng-md-icon {
  background-color: white;
  border-radius: 50%;
}
layout-snapshot-details .delete-button-container .delete-button:hover {
  color: #c62828;
}
layout-snapshot-details:hover .update-button-container .md-button, layout-snapshot-details:hover .delete-button-container .md-button {
  opacity: 1;
}
layout-snapshot-details .setting-info {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  margin-left: 10px;
  color: #616161;
  font-size: 0.85em;
}
layout-snapshot-details .setting-info .setting-name {
  font-weight: bold;
  margin-bottom: 10px;
}

@-webkit-keyframes hideAnimation {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}

@keyframes hideAnimation {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@-webkit-keyframes showAnimation {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes showAnimation {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.notifications-panel {
  background-color: white;
  width: 310px;
  position: relative;
}
.notifications-panel .notification-header {
  padding: 2px 5px 2px 10px;
  background-color: #F5F5F5;
  position: relative;
}
.notifications-panel .notification-header span {
  line-height: 34px;
}
.notifications-panel .notification-scroller {
  height: 290px;
  max-height: calc(90vh - 80px);
  overflow-y: auto;
}
.notifications-panel .notification-scroller .notification-bar:last-child {
  border-bottom: none;
}
.notifications-panel .no-notifications {
  height: 100%;
  width: 100%;
  top: 0;
  text-align: center;
  position: absolute;
  opacity: 1;
}
.notifications-panel .no-notifications.ng-hide {
  opacity: 0;
}
.notifications-panel .no-notifications.ng-hide-remove {
  transition: opacity 0.5s linear;
  transition-delay: 0.5s;
}
.notifications-panel .no-notifications ng-md-icon {
  width: 100px;
  height: 100px;
  color: #eeeeee;
}
.notifications-panel .no-notifications ng-md-icon + div {
  color: #9e9e9e;
  font-size: 14px;
  font-weight: bold;
}
.notifications-panel .notification-bar {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  cursor: default;
  padding: 5px 10px 8px 10px;
  min-height: 58px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}
.notifications-panel .notification-bar.new {
  background-color: rgba(238, 238, 238, 0.4);
}
.notifications-panel .notification-bar.ng-leave {
  -webkit-animation: 0.35s hideAnimation;
          animation: 0.35s hideAnimation;
}
.notifications-panel .notification-bar.ng-enter {
  -webkit-animation: 0.35s showAnimation;
          animation: 0.35s showAnimation;
}
.notifications-panel .notification-bar:hover {
  background-color: rgba(158, 158, 158, 0.2);
}
.notifications-panel .notification-bar .user-avatar {
  color: #9e9e9e;
  font-size: 13px;
  font-weight: bold;
  background-color: #d7d7d7;
  text-align: center;
  line-height: 40px;
  width: 40px;
  height: 40px;
  margin-right: 10px;
  margin-top: 4px;
}
.notifications-panel .notification-bar .notification-date {
  font-size: 11px;
  color: #9e9e9e;
}
.notifications-panel .notification-bar .notification-text {
  font-weight: normal;
  font-size: 15px;
}
.notifications-panel .notification-bar .notification-text a {
  text-decoration: none;
  color: #2196F3;
}
.notifications-panel .notification-bar .notification-clear {
  pointer-events: initial;
  cursor: pointer;
  color: #9e9e9e;
}
.notifications-panel .notification-bar .notification-clear .small {
  display: block;
}

pdf-component {
  position: absolute;
  width: 100%;
  height: 100%;
}
pdf-component > div {
  height: 100%;
}

.pdf-viewer-container {
  display: none;
}

.pdf-dialog-container {
  min-height: 90%;
  min-width: 90%;
  background: white;
  border-radius: 4px;
  box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12);
}
.pdf-dialog-container .header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 40px;
  padding: 10px;
  background-color: #2196f3;
  color: white;
}
.pdf-dialog-container .header .title {
  font-size: 20px;
  font-weight: bold;
}
.pdf-dialog-container .header .file-info {
  position: absolute;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  font-weight: 500;
}
.pdf-dialog-container .header .file-info .spacer {
  margin: 0 10px;
  font-weight: 300;
}
.pdf-dialog-container .header .ocr-icon-container {
  cursor: pointer;
  z-index: 10;
}
.pdf-dialog-container .header .ocr-icon-container.fully-loaded .ocr-icon ng-md-icon {
  color: #03a9f4;
}
.pdf-dialog-container .header .ocr-icon {
  font-size: 0.9rem;
  font-weight: 600;
  color: #9e9e9e;
  border-radius: 12px;
  padding: 1px 6px;
  border: 2px solid #bdbdbd;
  background-color: whitesmoke;
  margin-top: 5px;
}
.pdf-dialog-container .header .ocr-icon ng-md-icon {
  transform: translateY(-2px);
}
.pdf-dialog-container .header .ocr-icon.ocr-complete {
  border: 2px solid #4caf50;
  color: #4caf50;
}
.pdf-dialog-container .header .ocr-icon.ocr-missing {
  opacity: 0.8;
}
.pdf-dialog-container md-dialog-actions {
  display: flex;
  width: 100%;
  background-color: #eee;
  border-top: 1px solid silver;
}
.pdf-dialog-container .pdf-dialog-content {
  width: 100%;
  position: relative;
}
.pdf-dialog-container .pdf-dialog-content .viewer {
  height: 100%;
}
.pdf-dialog-container .pdf-dialog-content .viewer iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.pdf-dialog-container .pdf-dialog-content .loading-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: 0;
  left: 0;
  background-color: white;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: -1;
  transition: opacity ease-out 0.3s;
}
.pdf-dialog-container .pdf-dialog-content .loading-overlay.visible {
  opacity: 1;
  z-index: 1000;
}

.pdf-panel._md-panel-hidden {
  display: block;
  visibility: hidden;
  z-index: -1000 !important;
  top: -100%;
}
.pdf-panel._md-panel-hidden .md-panel {
  opacity: 1;
}
.pdf-panel._md-panel-shown {
  visibility: visible;
}
.pdf-panel.full-screen .pdf-dialog-container {
  height: 100%;
  width: 100%;
}

project-select-component {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 0 10px;
  font-size: 17px;
  font-weight: bold;
  height: 50px;
  color: #616161;
}
project-select-component md-select {
  margin: 0 5px;
}
project-select-component md-select:focus .md-select-value {
  color: inherit !important;
}
project-select-component .md-select-icon {
  color: #9e9e9e;
}
project-select-component .md-text {
  display: inline-block;
  max-width: 600px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
project-select-component.ps-light .md-select-value {
  color: white !important;
}
project-select-component.ps-light .md-select-icon {
  color: white;
}
project-select-component.ps-light md-select:focus .md-select-value {
  color: white !important;
}

project-settings-component {
  position: relative;
  display: flex;
  position: relative;
  flex: 1 1 auto;
}
project-settings-component .close-button {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 48px;
  width: 48px;
  color: white;
  background-color: #1e88e5;
  border-bottom: 1px solid #d7d7d7;
  cursor: pointer;
}
project-settings-component .close-button:hover {
  background-color: #2196f3;
}
project-settings-component .form-tools {
  position: absolute;
  top: 10px;
  right: 0;
}
project-settings-component .tab-content {
  height: 100%;
}
project-settings-component .tab-content.general {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
}
project-settings-component md-input-container.wide {
  width: 100%;
  max-width: 600px;
}
project-settings-component md-input-container .md-input[disabled] {
  color: black;
}
project-settings-component .md-row th.md-column, project-settings-component .md-row td.md-cell {
  text-align: center;
}
project-settings-component .md-row th.md-checkbox-column, project-settings-component .md-row td.md-checkbox-cell, project-settings-component .md-row th.email, project-settings-component .md-row td.email {
  text-align: left;
}
project-settings-component .md-row th > .md-sort-icon {
  display: none;
}
project-settings-component .md-row th.md-active > .md-sort-icon {
  display: inline-block;
}
project-settings-component .md-row td.email {
  vertical-align: middle;
  white-space: nowrap;
}
project-settings-component .md-row td.email.pending {
  color: #9e9e9e;
}
project-settings-component .md-row td.email.owner {
  font-weight: bold;
}
project-settings-component .md-row td.email.owner img {
  border: 2px solid #ff8a65;
}
project-settings-component .md-row td.email .pending-email-icon {
  height: 20px;
  width: 20px;
}
project-settings-component .md-row td.email .pending-email-icon svg {
  height: 100%;
  width: 100%;
}
project-settings-component .md-row td.email .user-avatar {
  padding: 0 3px;
  border: 1px solid #d7d7d7;
  font-size: 15px;
  color: #9e9e9e;
}
project-settings-component .md-row td.email span {
  margin-left: 5px;
}
project-settings-component .md-row td.email img {
  height: 20px;
  border-radius: 3px;
  display: inline-block;
}
project-settings-component .ah-card {
  overflow: hidden;
}
project-settings-component .settings-card {
  min-width: 400px;
  max-width: 600px;
}
project-settings-component .api-input {
  width: 100%;
}
project-settings-component .info {
  position: relative;
  flex: 0 1 400px;
  display: flex;
  flex-direction: column;
}
project-settings-component .info .label {
  color: #9e9e9e;
  font-size: 0.9em;
}
project-settings-component .info .info-entry {
  color: #616161;
  font-weight: bold;
  margin-bottom: 10px;
}
project-settings-component .info .edit-info-button {
  position: absolute;
  top: 0px;
  right: 0px;
}
project-settings-component .calendar {
  flex: 0 1 450px;
  max-height: 620px;
}
project-settings-component .calendar img {
  max-height: 600px;
  max-width: 400px;
}
project-settings-component .usage {
  flex: 0 1 450px;
}
project-settings-component .usage img {
  max-height: 600px;
  max-width: 400px;
}
project-settings-component .project-defaults {
  display: flex;
  flex-wrap: wrap;
  max-height: 400px;
  max-width: 525px;
}
project-settings-component .project-defaults .card-header {
  flex: 0 0 100%;
}
project-settings-component .project-defaults .default-setting {
  flex: 0 0 230px;
  margin: 5px;
  text-align: center;
}
project-settings-component .project-defaults .default-setting .md-subheader {
  background-color: transparent;
}
project-settings-component .project-defaults .default-setting .thumb-container {
  position: relative;
  display: inline-block;
  border: 1px solid #d7d7d7;
  cursor: pointer;
}
project-settings-component .project-defaults .default-setting .thumb-container img {
  border: 1px solid #d7d7d7;
  height: 70px;
}
project-settings-component .project-defaults .default-setting .thumb-container .thumb-placeholder {
  height: 70px;
  width: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
}
project-settings-component .project-defaults .default-setting .thumb-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
project-settings-component .project-defaults .default-setting .thumb-container:hover .ah-remove-button, project-settings-component .project-defaults .default-setting .thumb-container:hover .ah-add-button {
  opacity: 1;
}
project-settings-component .project-defaults .default-setting .thumb-container:hover img {
  border: 3px solid #90caf9;
}
project-settings-component .project-defaults .aspect-switch-container {
  flex: 0 0 200px;
  min-height: 106px;
  min-width: 100px;
}
project-settings-component .project-image .preview-image {
  flex: 1 0 auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
project-settings-component .project-image .preview-image img {
  margin-top: 10px;
  border: 1px solid #d7d7d7;
  max-width: 350px;
  max-height: 260px;
}
project-settings-component .controls {
  text-align: center;
}
project-settings-component .reset-button {
  color: #616161 !important;
}
project-settings-component .controls-row {
  color: #616161;
}

rich-input {
  display: block;
}
rich-input md-input-container {
  position: relative;
}
rich-input .rich-input {
  overflow: hidden;
  line-height: 26px;
  float: none;
  min-height: 26px;
  height: auto;
}
rich-input .rich-input.singleline {
  white-space: nowrap;
}
rich-input .rich-input p {
  margin: 0;
}
rich-input .rich-input.textarea {
  overflow: auto;
  min-height: 126px;
  max-height: 200px;
  height: auto;
  padding: 10px;
  border: 1px solid #d7d7d7;
}
rich-input .medium-editor-element h1, rich-input .medium-editor-element h2, rich-input .medium-editor-element h3, rich-input .medium-editor-element h4, rich-input .medium-editor-element h5 {
  color: inherit;
  font-weight: inherit;
  font-size: inherit;
}
rich-input .medium-editor-element h1:before {
  content: "• ";
}
rich-input .medium-editor-element h2:before {
  content: "•• ";
}
rich-input .medium-editor-element h3:before {
  content: "••• ";
}
rich-input .medium-editor-element h4:before {
  content: "•••• ";
}
rich-input .medium-editor-element h5:before {
  content: "••••• ";
}
rich-input .medium-editor-placeholder:after {
  color: gray;
  font-style: normal;
}

element-block, .element-block {
  display: block;
}
element-block rich-input, .element-block rich-input {
  margin-top: 15px !important;
  margin-bottom: 0 !important;
}
element-block .element-container, .element-block .element-container {
  position: relative;
  overflow: hidden;
  margin: 5px;
  border-radius: 5px;
}
element-block .border-element, .element-block .border-element {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
  border: 1px solid #bdbdbd;
  border-radius: 5px;
}
element-block .element-header, element-block .element-header .transclude-container, .element-block .element-header, .element-block .element-header .transclude-container {
  display: flex;
  align-items: center;
  gap: 7px;
  overflow: hidden;
  height: 48px;
  cursor: default;
  color: white;
  font-weight: 600;
  line-height: 1rem;
  font-size: 0.9rem;
}
element-block .element-header .icon-container, element-block .element-header .transclude-container .icon-container, .element-block .element-header .icon-container, .element-block .element-header .transclude-container .icon-container {
  flex: 0 0 auto;
  display: flex;
  gap: 5px;
  align-items: center;
  cursor: pointer;
  height: 100%;
  min-width: 30px;
  padding: 0 3px;
}
element-block .element-header .ah-action-button:not(.active), element-block .element-header .drag-handle, element-block .element-header .transclude-container .ah-action-button:not(.active), element-block .element-header .transclude-container .drag-handle, .element-block .element-header .ah-action-button:not(.active), .element-block .element-header .drag-handle, .element-block .element-header .transclude-container .ah-action-button:not(.active), .element-block .element-header .transclude-container .drag-handle {
  opacity: 0;
}
element-block .element-header .settings-button, element-block .element-header .transclude-container .settings-button, .element-block .element-header .settings-button, .element-block .element-header .transclude-container .settings-button {
  margin-right: 5px;
}
element-block .element-header .header-icon, element-block .element-header .transclude-container .header-icon, .element-block .element-header .header-icon, .element-block .element-header .transclude-container .header-icon {
  width: 42px;
  height: 42px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
}
element-block .element-header .header-icon .icon-bg, element-block .element-header .transclude-container .header-icon .icon-bg, .element-block .element-header .header-icon .icon-bg, .element-block .element-header .transclude-container .header-icon .icon-bg {
  fill: transparent;
}
element-block .element-header .header-icon img, element-block .element-header .transclude-container .header-icon img, .element-block .element-header .header-icon img, .element-block .element-header .transclude-container .header-icon img {
  max-width: 100%;
  max-height: 100%;
}
element-block .element-header .header-icon.header-icon-image, element-block .element-header .transclude-container .header-icon.header-icon-image, .element-block .element-header .header-icon.header-icon-image, .element-block .element-header .transclude-container .header-icon.header-icon-image {
  border: 2px solid #bdbdbd;
  background-color: #bdbdbd;
}
element-block .element-header .header-icon ng-md-icon, element-block .element-header .transclude-container .header-icon ng-md-icon, .element-block .element-header .header-icon ng-md-icon, .element-block .element-header .transclude-container .header-icon ng-md-icon {
  color: #bdbdbd;
}
element-block .element-header .spacer, element-block .element-header .transclude-container .spacer, .element-block .element-header .spacer, .element-block .element-header .transclude-container .spacer {
  flex: 1 1 auto;
  align-self: stretch;
  cursor: pointer;
}
element-block .element-header .drag-handle, element-block .element-header .transclude-container .drag-handle, .element-block .element-header .drag-handle, .element-block .element-header .transclude-container .drag-handle {
  margin-right: 3px;
  cursor: -webkit-grab;
  cursor: grab;
  background: transparent;
}
element-block .element-header .drag-handle:active, element-block .element-header .transclude-container .drag-handle:active, .element-block .element-header .drag-handle:active, .element-block .element-header .transclude-container .drag-handle:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}
element-block .element-header .toggle-icon-container ng-md-icon, element-block .element-header .transclude-container .toggle-icon-container ng-md-icon, .element-block .element-header .toggle-icon-container ng-md-icon, .element-block .element-header .transclude-container .toggle-icon-container ng-md-icon {
  color: #bdbdbd;
}
element-block .element-header .icon-container:hover .toggle-icon-container ng-md-icon, element-block .element-header .transclude-container .icon-container:hover .toggle-icon-container ng-md-icon, .element-block .element-header .icon-container:hover .toggle-icon-container ng-md-icon, .element-block .element-header .transclude-container .icon-container:hover .toggle-icon-container ng-md-icon {
  color: #a4a4a4;
}
element-block .element-content-container, .element-block .element-content-container {
  display: block;
  position: relative;
  padding: 2px 10px 10px 10px;
}
element-block .element-content-container .enable-date-button-container, .element-block .element-content-container .enable-date-button-container {
  position: absolute;
  right: 0;
  bottom: 8px;
}
element-block .style-chips-container, .element-block .style-chips-container {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  overflow: hidden;
  cursor: pointer;
  margin-top: 5px;
}
element-block .style-chips-container .style-chip, .element-block .style-chips-container .style-chip {
  border: 1px solid #d7d7d7;
  flex: 0 1 45%;
  padding: 2px 5px;
  background-color: #f2f2f2;
  color: #9e9e9e;
  font-size: 0.9rem;
  font-weight: 500;
  border-radius: 11px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
element-block .style-chips-container .style-chip.slide-design-chip, .element-block .style-chips-container .style-chip.slide-design-chip {
  flex: 1 1 auto;
}
element-block .style-chips-container:hover ng-md-icon, .element-block .style-chips-container:hover ng-md-icon {
  color: #ffb74d;
}
element-block .details-element, .element-block .details-element {
  position: relative;
  display: block;
  border: 1px solid transparent;
}
element-block .details-element rich-input, element-block .details-element autocomplete, .element-block .details-element rich-input, .element-block .details-element autocomplete {
  margin: 15px 0;
  flex: 1 1 auto;
}
element-block .details-element rich-input md-input-container, element-block .details-element autocomplete md-input-container, .element-block .details-element rich-input md-input-container, .element-block .details-element autocomplete md-input-container {
  margin: 0px 0 0 0;
}
element-block .details-element .thumb-container, .element-block .details-element .thumb-container {
  position: relative;
  flex: 0 0 100px;
  width: 120px;
  height: 100px;
  margin-top: 5px;
  padding: 2px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #eeeeee;
}
element-block .details-element .thumb-container img, .element-block .details-element .thumb-container img {
  max-height: 100%;
  max-width: 100%;
  outline: 1px solid #9e9e9e;
}
element-block .details-element .thumb-container .view-edit-tools, .element-block .details-element .thumb-container .view-edit-tools {
  display: flex;
  justify-content: flex-end;
  gap: 5px;
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  padding: 5px;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 10;
  opacity: 0;
  transition: opacity 0.2s;
}
element-block .details-element .thumb-container:hover .view-edit-tools, .element-block .details-element .thumb-container:hover .view-edit-tools {
  opacity: 1;
}
element-block .details-element .info-row, .element-block .details-element .info-row {
  display: flex;
  margin: 5px 0;
  color: #616161;
  word-break: break-word;
}
element-block .details-element .info-row p, .element-block .details-element .info-row p {
  margin: 0;
}
element-block .details-element .info-row.margin-right, .element-block .details-element .info-row.margin-right {
  margin-right: 20px;
}
element-block .details-element .text-content-container, .element-block .details-element .text-content-container {
  position: relative;
}
element-block .details-element .text-area-expand-btn, .element-block .details-element .text-area-expand-btn {
  position: absolute;
  top: 0px;
  right: 0px;
}
element-block .element-container.callout-block-container, .element-block .element-container.callout-block-container {
  border-radius: 0;
  box-shadow: inset 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  margin: 0px 0 20px 0;
  background-color: whitesmoke;
  padding: 10px 0 10px 10px;
}
element-block .element-container.callout-block-container .element-header, element-block .element-container.callout-block-container .element-header .transclude-container, .element-block .element-container.callout-block-container .element-header, .element-block .element-container.callout-block-container .element-header .transclude-container {
  height: auto;
  max-height: auto;
  justify-content: flex-start;
  align-items: flex-start;
  background-color: transparent;
  margin-bottom: 5px;
}
element-block .element-container.callout-block-container .element-header .header-icon, element-block .element-container.callout-block-container .element-header .transclude-container .header-icon, .element-block .element-container.callout-block-container .element-header .header-icon, .element-block .element-container.callout-block-container .element-header .transclude-container .header-icon {
  height: auto;
  width: auto;
  max-height: 100px;
  max-width: 150px;
}
element-block .element-container.callout-block-container .callout-element, .element-block .element-container.callout-block-container .callout-element {
  margin: 0;
  padding: 0;
}
element-block .element-container.disabled, .element-block .element-container.disabled {
  background-image: linear-gradient(45deg, #e0e0e0 25%, whitesmoke 25%, whitesmoke 50%, #e0e0e0 50%, #e0e0e0 75%, whitesmoke 75%, whitesmoke 100%);
  background-size: 10px 10px;
}
element-block .element-container.disabled .drag-handle, .element-block .element-container.disabled .drag-handle {
  opacity: 1 !important;
}
element-block .element-container.disabled .drag-handle ng-md-icon, .element-block .element-container.disabled .drag-handle ng-md-icon {
  color: white;
}
element-block .element-container.disabled .drag-handle:hover, .element-block .element-container.disabled .drag-handle:hover {
  opacity: 0.6;
}
element-block .element-container.disabled .drag-handle:hover ng-md-icon, .element-block .element-container.disabled .drag-handle:hover ng-md-icon {
  color: white;
}
element-block .element-container.callout-block-container.disabled,
element-block .element-container.disabled.callout-block-container .element-header,
element-block .element-container.disabled .element-header .transclude-container, .element-block .element-container.callout-block-container.disabled,
.element-block .element-container.disabled.callout-block-container .element-header,
.element-block .element-container.disabled .element-header .transclude-container {
  background-image: linear-gradient(45deg, #b4b4b4 25%, #d7d7d7 25%, #d7d7d7 50%, #b4b4b4 50%, #b4b4b4 75%, #d7d7d7 75%, #d7d7d7 100%);
  background-size: 10px 10px;
}
element-block .element-container:hover .ah-action-button:not(.active), .element-block .element-container:hover .ah-action-button:not(.active) {
  opacity: 0.4;
}
element-block .element-container:hover .ah-action-button:not(.active):hover, .element-block .element-container:hover .ah-action-button:not(.active):hover {
  opacity: 0.6;
}
element-block.selected .border-element, .element-block.selected .border-element {
  border: 2px solid #64b5f6;
}
element-block.selected .element-header, element-block.selected .element-header .transclude-container, .element-block.selected .element-header, .element-block.selected .element-header .transclude-container {
  background-color: #64b5f6;
}
element-block.selected .element-header .header-icon ng-md-icon, element-block.selected .element-header .transclude-container .header-icon ng-md-icon, .element-block.selected .element-header .header-icon ng-md-icon, .element-block.selected .element-header .transclude-container .header-icon ng-md-icon {
  color: white;
}
element-block.selected .element-container .toggle-icon-container ng-md-icon, .element-block.selected .element-container .toggle-icon-container ng-md-icon {
  color: #eeeeee;
}
element-block.selected .element-container .icon-container:hover .toggle-icon-container ng-md-icon, .element-block.selected .element-container .icon-container:hover .toggle-icon-container ng-md-icon {
  color: #d7d7d7;
}
element-block.selected .drag-handle ng-md-icon, .element-block.selected .drag-handle ng-md-icon {
  color: white;
}
element-block.selected .drag-handle:hover ng-md-icon, .element-block.selected .drag-handle:hover ng-md-icon {
  color: white;
}
element-block.title-element-block .header-icon, .element-block.title-element-block .header-icon {
  transform: translateX(3px);
}

page-details {
  opacity: 1 !important;
}
page-details .used-in-form-container {
  border: 1px solid #d7d7d7;
  padding: 5px 10px;
  color: #616161;
  font-size: 0.9em;
}
page-details .used-in-form {
  line-height: 1.4em;
  color: #616161;
}
page-details .used-in-form a {
  text-decoration: none;
  color: #2196f3;
  cursor: pointer;
}
page-details .used-in-form a:hover {
  color: #ffb74d;
}
page-details .used-in-form .index {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 3px;
  border: 1px solid #d7d7d7;
  border-radius: 5px;
  color: #616161;
  font-size: 0.9em;
  line-height: 20px;
  text-align: center;
}
page-details .used-in-form.selected {
  font-weight: bold;
}
page-details .page-data-accordion {
  margin: 0 0 25px 0;
}
page-details .page-metadata-container {
  display: inline-block;
  width: 100%;
  padding: 10px;
  border: 1px solid #d7d7d7;
}

sidebar-container-component {
  display: flex;
  justify-content: stretch;
  align-items: stretch;
  position: relative;
  transition: flex 0.5s;
  flex: 0 1 350px;
  height: 100%;
}
sidebar-container-component.no-animation {
  transition: none;
}
sidebar-container-component .toggle-btn {
  position: absolute;
  top: 5px;
  right: 15px;
  z-index: 21;
}
sidebar-container-component.collapsed {
  flex: 0 1 50px;
  text-align: center;
}
sidebar-container-component:not(.collapsed) .toggle-btn.white ng-md-icon {
  color: white;
}

slide-details {
  display: flex;
  flex-direction: column;
  opacity: 0;
  transition: opacity 0.2s;
  width: 100%;
  overflow: scroll;
}
slide-details.visible {
  opacity: 1;
}
slide-details .details-header {
  position: sticky;
  top: 0;
  min-height: 80px;
  margin-bottom: 10px;
  background-color: white;
  z-index: 10;
}
slide-details .details-header .create-button {
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: 5px;
  left: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 1.5em;
  font-weight: bold;
  background-color: #f57c00;
  color: white;
  cursor: pointer;
  border-radius: 10px;
  box-shadow: 3px 3px 4px 0px rgba(0, 0, 0, 0.4);
  transition: background-color 0.2s;
}
slide-details .details-header .create-button:hover {
  background-color: #ff9800;
}
slide-details .details-header .duration {
  position: absolute;
  bottom: 10px;
  right: 20px;
  color: #616161;
  opacity: 0.8;
  font-size: 0.85em;
  cursor: pointer;
}
slide-details .details-header .white {
  color: white;
}
slide-details .details-header .animate-btn {
  position: absolute;
  bottom: 0px;
  left: 10px;
  width: 30px;
  display: flex;
  justify-content: center;
}
slide-details .details-header .animate-btn.white ng-md-icon {
  color: white;
}
slide-details .collapsed-content {
  margin-top: 50px;
}
slide-details .create-button {
  background-color: #f57c00 !important;
  cursor: pointer;
  transition: background-color 0.2s;
}
slide-details .create-button ng-md-icon {
  color: white !important;
}
slide-details .create-button:hover {
  background-color: #ff9800 !important;
}
slide-details .block-group-label {
  margin-left: 5px;
  font-size: 0.9rem;
  color: #9e9e9e;
  font-weight: 500;
}
slide-details accordion {
  margin: 10px 0;
}
slide-details .styles-button {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: 0 8px 0 5px;
  width: 85px;
}
slide-details .styles-button .label {
  color: #9e9e9e;
  font-weight: 500;
}

.text-entry-dialog {
  display: flex;
  width: 80%;
  height: 80%;
  background-color: white;
  padding: 20px;
}
.text-entry-dialog md-input-container {
  width: 100%;
  display: block;
}
.text-entry-dialog .rich-input.textarea {
  max-height: none;
  height: 100%;
}

slide-details-setting {
  display: block;
  padding: 10px;
}
slide-details-setting .top-row {
  display: flex;
}
slide-details-setting .thumb-container {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  cursor: pointer;
}
slide-details-setting .thumb-container img {
  border: 1px solid #90a4ae;
  height: 70px;
}
slide-details-setting .thumb-container .thumb-placeholder {
  height: 70px;
  width: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: whitesmoke;
}
slide-details-setting .thumb-container .thumb-placeholder ng-md-icon {
  color: #bdbdbd;
}
slide-details-setting .thumb-container:hover .ah-remove-button, slide-details-setting .thumb-container:hover .ah-add-button {
  opacity: 1;
}
slide-details-setting .thumb-container:hover img {
  border: 3px solid #90caf9;
}
slide-details-setting .setting-info {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  margin-left: 10px;
}
slide-details-setting .setting-info .setting-name {
  font-weight: bold;
  margin-bottom: 10px;
}
slide-details-setting.vertical-layout .top-row {
  flex-direction: column-reverse;
  align-items: center;
}
slide-details-setting.vertical-layout .setting-info {
  margin: 0;
}
slide-details-setting.vertical-layout .setting-info .setting-name {
  margin-bottom: 3px;
  text-align: center;
}
slide-details-setting.vertical-layout .controls-container {
  display: none;
}

slide-edit {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
slide-edit .canvas-element.lower-canvas {
  border: 1px solid #bdbdbd;
}
slide-edit .canvas-element {
  position: relative;
}
slide-edit .toolbar {
  position: absolute;
  display: flex;
  pointer-events: all;
  bottom: -35px;
  right: 0px;
  width: 100%;
  height: 30px;
  display: flex;
  justify-content: flex-end;
}
slide-edit .toolbar > * {
  margin-left: 5px !important;
}
slide-edit .toolbar .spacer {
  flex: 2 1 auto;
}
slide-edit .md-button.active > ng-md-icon {
  fill: #f57c00;
}
slide-edit .md-button.md-icon-button {
  border-radius: 4px;
}
slide-edit .video-icon ng-md-icon {
  color: #f57c00;
}
slide-edit .animation-video-container {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
slide-edit .animation-video-container video {
  width: 100%;
  height: 100%;
}
slide-edit .animation-video-container .animation-video {
  transition: 0.2s linear opacity;
}
slide-edit .animation-video-container .animation-video.hidden {
  opacity: 0;
}
slide-edit .canvas-container {
  transition: opacity 0.15s ease-in;
  position: absolute;
  left: 0;
  right: 0;
}
slide-edit .canvas-container.canvas-hidden {
  opacity: 0;
  pointer-events: none;
}

slide-sorter {
  overflow: hidden;
}
slide-sorter .grid-container {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  overflow: auto;
  height: 100%;
  padding: 20px;
}
slide-sorter .grid-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  padding: 5px;
  width: 140px;
  height: 120px;
  cursor: pointer;
}
slide-sorter .grid-item .name {
  overflow: hidden;
  max-width: 100%;
  min-height: 20px;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #9e9e9e;
  font-size: 0.8em;
  margin-bottom: 5px;
}
slide-sorter .grid-item img {
  max-width: 100%;
  border: 1px solid #d7d7d7;
  box-shadow: 2px 2px 2px 0 #ccc;
}
slide-sorter .grid-item.selected img {
  outline: 4px solid #2196f3;
  box-shadow: 6px 6px 6px 0 #ccc;
}
slide-sorter .grid-item .placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  border: 1px solid #d7d7d7;
  flex: 1 1 auto;
  background-color: #eeeeee;
}
slide-sorter .grid-item .number {
  position: absolute;
  left: 5px;
  top: 30px;
  background-color: #1976d2;
  padding: 0 5px;
  color: white;
  font-weight: bold;
}
slide-sorter .secondary-screen-header {
  flex: 0 0 50px;
  display: flex;
  align-items: center;
  padding: 10px;
  background-color: #1a237e;
  font-size: 18px;
  font-weight: bold;
  color: white;
}
slide-sorter .secondary-screen-header .spacer {
  flex: 1 1 auto;
}
slide-sorter .secondary-screen-header .close-button {
  flex: 0 1 200px;
  display: flex;
  justify-content: flex-end;
  cursor: pointer;
}
slide-sorter .secondary-screen-header .close-button ng-md-icon {
  margin: 0;
}
slide-sorter .secondary-screen-header .icon-bg {
  fill: transparent;
}

.tags-autocomplete .count {
  transform: translateY(-1px);
  margin-left: 5px;
}

tag-chooser .count {
  position: absolute;
  top: -5px;
  right: -8px;
}
tag-chooser .md-chip-content {
  overflow: visible !important;
}
tag-chooser .md-chip-remove md-icon {
  min-width: 0;
  min-height: 0;
  width: 15px !important;
}

team-view-component {
  border-left: 1px solid #d7d7d7;
  width: 0px;
  transition: width 0.5s ease;
  padding-top: 25px;
}
team-view-component.show {
  width: 130px;
}
team-view-component .user-container {
  display: flex;
  min-width: 120px;
  justify-content: space-between;
  font-weight: 500;
  line-height: 1.8em;
  color: #9e9e9e;
  padding: 2px 7px;
  transition: color 0.15s linear, background-color 0.15s linear;
  cursor: default;
}
team-view-component .user-container .more {
  cursor: pointer;
  opacity: 0;
  transition: opacity 0.15s linear;
}
team-view-component .user-container .number {
  font-size: 0.75em;
  padding: 2px 3px 3px 2px;
  border-radius: 50%;
  border: 1px solid #e53935;
  color: #e53935;
  transition: border 0.15s linear, font-weight 0.15s linear;
}
team-view-component .user-container .number:hover {
  font-weight: 700;
  color: #c62828;
  border: 1px solid #c62828;
}
team-view-component .user-container .chat {
  transition: color 0.15s linear;
}
team-view-component .user-container .chat:hover {
  color: #fb8c00;
}
team-view-component .user-container:hover {
  background-color: white;
  color: #1565c0;
}
team-view-component .user-container:hover .more {
  opacity: 1;
}

tree-component {
  position: relative;
  display: flex;
  flex-direction: column;
  z-index: 2;
  flex: 0 0 350px;
  min-width: 160px;
  transition: flex-basis 0.25s ease-out;
}
tree-component.no-animation {
  transition: none;
}
tree-component md-toolbar {
  min-height: auto;
}
tree-component ng-md-icon {
  color: #9e9e9e;
  transition: color 0.15s linear;
}
tree-component ng-md-icon:hover {
  color: #ffb74d;
}
tree-component .tree-header {
  flex: 0 0 49px;
  margin: 0;
  display: flex;
  align-items: center;
}
tree-component .tree-header.main {
  background-color: #64b5f6;
}
tree-component .tree-header.parked {
  background-color: #757575;
}
tree-component .tree-header.trash {
  background-color: #e57373;
}
tree-component .tree-header .tool-icon ng-md-icon {
  color: white;
}
tree-component .tree-header .tree-type-icon {
  color: white;
  transform: translate(-2px, -3px);
}
tree-component .tree-header .tree-type-text {
  font-weight: bold;
  font-size: 17px;
}
tree-component .tree-header .collapse-btn {
  padding: 0;
}
tree-component .tree-header .md-select-icon {
  color: white;
  display: none;
}
tree-component .tree-header .tree-select {
  margin: auto 0;
  flex: 1 1 auto;
}
tree-component .tree-header .tree-select md-select {
  text-align: center;
}
tree-component .tree-header .tree-select md-select-value {
  color: white !important;
  min-height: auto;
  padding: 0;
}
tree-component .tree-container {
  flex: 1 1 auto;
  direction: rtl;
  outline: none;
  overflow-x: hidden;
  overflow-y: auto;
  position: relative;
  padding: 10px 0px 10px 25px;
  transition: opacity 0.15s ease-out;
}
tree-component .tree-container * {
  direction: ltr;
}
tree-component .tree-header .md-toolbar-tools {
  font-size: 17px;
  padding: 3px 10px 3px 25px;
}
tree-component span, tree-component a {
  outline: none;
}
tree-component .tree-node {
  display: flex;
  height: 30px;
  line-height: 30px;
  outline: none;
  margin-bottom: 1px;
  padding-right: 5px;
}
tree-component .tree-node .background-overlay {
  position: absolute;
  left: 0px;
  right: 0px;
  z-index: -1;
  height: 30px;
}
tree-component .tree-node .name-input {
  overflow: hidden;
  outline: none;
  background: inherit;
  border: none;
  font-weight: 500;
  font-size: 0.9em;
  color: #424242;
}
tree-component .tree-node .name-input::-moz-placeholder {
  font-weight: normal;
}
tree-component .tree-node .name-input:-ms-input-placeholder {
  font-weight: normal;
}
tree-component .tree-node .name-input::placeholder {
  font-weight: normal;
}
tree-component .tree-node .form-status ng-md-icon {
  transition: opacity 0.2s;
}
tree-component .tree-node .form-status .status-0 {
  opacity: 0;
}
tree-component .tree-node .form-status .status-1 {
  color: #388e3c;
}
tree-component .tree-node .md-button.md-icon-button {
  padding: 0;
  margin: 0 2px;
}
tree-component .tree-node .md-button.md-icon-button.arrow-button {
  position: relative;
  margin: 0 2px 0 -26px;
}
tree-component .tree-node:hover .background-overlay, tree-component .tree-node.selected .background-overlay {
  background-color: #bbdefb;
}
tree-component .tree-node:hover .name-input, tree-component .tree-node.selected .name-input {
  color: black;
}
tree-component .tree-node:hover:not(.selected) .form-status .status-0 {
  opacity: 1;
}
tree-component .tree-node:hover:not(.selected) .background-overlay {
  background-color: #e3f2fd;
  border: none;
  z-index: -2;
}
tree-component .number-badge {
  position: relative;
  min-width: 22px;
  height: 22px;
  margin: 4px 5px 4px 0;
  padding: 0 3px;
  background-color: #64b5f6;
  color: white;
  line-height: 22px;
  text-align: center;
  font-size: 0.9em;
  font-weight: bold;
  cursor: move;
  border-radius: 5px;
}
tree-component .number-badge.require-update {
  background-color: #ff9800;
}
tree-component .number-badge.group-badge {
  background-color: #bbdefb;
  box-shadow: inset 0px 1px 3px 0 rgba(0, 0, 0, 0.5);
}
tree-component .number-badge.folder-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  width: 22px;
  height: 22px;
  background-color: transparent;
  box-shadow: none;
}
tree-component .number-badge.folder-badge ng-md-icon {
  color: #64b5f6;
}
tree-component .number-badge .spinner-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(245, 245, 245, 0.5);
  padding: 2px;
}
tree-component .angular-ui-tree-node, tree-component .angular-ui-tree-placeholder, tree-component .angular-ui-tree-nodes {
  position: static;
}
tree-component .size-control {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 5px;
  -ms-writing-mode: tb-lr;
      writing-mode: vertical-lr;
  background-color: transparent;
  transition: border 0.1s;
  border-right: 1px solid transparent;
}
tree-component .size-control:hover {
  cursor: col-resize;
  border-right: 1px solid #d7d7d7;
}
tree-component .tree-footer {
  display: flex;
  justify-content: center;
  padding-right: 5px;
  border-top: 1px solid #d7d7d7;
  border-right: 1px solid #d7d7d7;
  transform: translateX(1px);
  background-color: white;
  font-size: 0.8em;
  min-height: 28px;
}
tree-component .tree-footer .tree-control {
  padding: 2px;
}
tree-component .tree-footer .tree-control:first-child {
  margin-right: 3px;
}
tree-component .tree-footer .node-index, tree-component .tree-footer .node-index-collapsed {
  white-space: nowrap;
  cursor: pointer;
}
tree-component .tree-footer .node-index > span, tree-component .tree-footer .node-index-collapsed > span {
  display: inline-block;
  min-width: 20px;
  height: 20px;
  margin: 3px;
  padding: 0 3px;
  border: 1px solid #d7d7d7;
  border-radius: 5px;
  text-align: center;
}
tree-component .tree-footer .node-index-collapsed {
  display: none;
}
tree-component .empty-trash-button {
  padding: 8px;
}
tree-component .empty-trash-button .md-button {
  width: 100%;
  margin: 0;
}
tree-component .move-node-input {
  width: 60px;
}
tree-component .move-node-input md-input-container {
  margin: 0;
}

.angular-ui-tree-handle {
  font-weight: normal;
}

.angular-ui-tree-nodes .angular-ui-tree-nodes {
  padding-left: 25px;
}

.angular-ui-tree-placeholder {
  border: 1px solid #c0c0c0;
}

.angular-ui-tree-empty {
  border: none;
  background: none;
}

tree-component.collapsed {
  min-width: 25px;
}
tree-component.collapsed .tree-container {
  padding: 5px 0 0 0;
}
tree-component.collapsed .tree-container ol {
  padding-left: 0;
}
tree-component.collapsed .tree-header md-select-value {
  min-width: 0;
}
tree-component.collapsed .tree-header md-select-value .md-select-icon, tree-component.collapsed .tree-header md-select-value .tree-type-text {
  display: none;
}
tree-component.collapsed .tree-header .open-menu-icon {
  display: none;
}
tree-component.collapsed .tree-node {
  justify-content: space-around;
}
tree-component.collapsed .tree-node .background-overlay {
  border-radius: 0;
}
tree-component.collapsed .number-badge {
  margin: 4px 0;
  cursor: default;
}
tree-component.collapsed .tree-footer .tree-control:not(.link), tree-component.collapsed .tree-footer .node-index, tree-component.collapsed .tree-footer .spacer {
  display: none;
}
tree-component.collapsed .tree-footer .node-index-collapsed {
  display: inline;
}

.dark tree-component {
  background-color: #424242;
}
.dark tree-component ::-webkit-scrollbar-thumb {
  background-color: #757575;
}
.dark tree-component ::-webkit-scrollbar-thumb:hover {
  background-color: #9e9e9e;
}
.dark tree-component .tree-header.main {
  background-color: #455a64;
}
.dark tree-component .tree-header.parked {
  background-color: #9e9e9e;
}
.dark tree-component .tree-header.trash {
  background-color: #e57373;
}
.dark tree-component .tree-header .md-select-icon {
  color: #bdbdbd;
}
.dark tree-component .tree-header .open-menu-icon ng-md-icon:not(:hover) {
  color: #bdbdbd;
}
.dark tree-component .tree-node .name-input {
  color: white;
}
.dark tree-component .tree-node:hover .background-overlay, .dark tree-component .tree-node.selected .background-overlay {
  height: 32px;
  border: none;
  background-color: #607d8b;
}
.dark tree-component .tree-node:hover input::-moz-placeholder, .dark tree-component .tree-node.selected input::-moz-placeholder {
  color: #bdbdbd;
}
.dark tree-component .tree-node:hover input:-ms-input-placeholder, .dark tree-component .tree-node.selected input:-ms-input-placeholder {
  color: #bdbdbd;
}
.dark tree-component .tree-node:hover input::placeholder, .dark tree-component .tree-node.selected input::placeholder {
  color: #bdbdbd;
}
.dark tree-component .number-badge.processing {
  background-color: #1565c0;
}
.dark tree-component .number-badge.require-update {
  background-color: #2196f3;
}
.dark tree-component .tree-footer {
  background-color: #212121;
  border-top: none;
  color: #9e9e9e;
}
.dark tree-component .tree-footer .node-index span, .dark tree-component .tree-footer .node-index-collapsed span {
  border: 1px solid #9e9e9e;
  color: white;
}
.dark tree-component .tree-footer button ng-md-icon {
  color: #9e9e9e;
}
.dark tree-component .tree-footer button:hover ng-md-icon {
  color: #ffb74d;
}

#user-projects-collections-sidebar {
  flex: 0 0 300px;
  display: flex;
  flex-direction: column;
  background-color: #eeeeee;
  color: #9e9e9e;
}
#user-projects-collections-sidebar .project-list-filters {
  position: relative;
  margin: 15px;
}
#user-projects-collections-sidebar .project-list-filters md-input-container {
  width: 100%;
  margin: 0 0 10px;
}
#user-projects-collections-sidebar .project-list-filters md-input-container .md-errors-spacer {
  min-height: 0;
}
#user-projects-collections-sidebar .project-list-filters .clear-button {
  position: absolute;
  top: 0px;
  right: 0;
  min-width: auto;
  margin: 0;
  line-height: 0;
}
#user-projects-collections-sidebar .project-list-container {
  background-color: transparent;
  padding: 10px;
}
#user-projects-collections-sidebar .project-name {
  flex: 1 1 auto;
}
#user-projects-collections-sidebar .info-button {
  min-width: 25px;
  min-height: 25px;
  line-height: 0px;
  margin: 0px;
  transform: translateX(-3px);
}
#user-projects-collections-sidebar .info-button:hover {
  background-color: transparent;
}
#user-projects-collections-sidebar .info-button:hover ng-md-icon {
  fill: #616161 !important;
}
#user-projects-collections-sidebar .list-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding: 10px;
  border-bottom: 1px solid #d7d7d7;
}
#user-projects-collections-sidebar .list-item:hover .info-button ng-md-icon {
  fill: #9e9e9e;
}
#user-projects-collections-sidebar .info {
  display: flex;
  align-items: flex-start;
  flex: 0 0 100%;
  color: #616161;
}
#user-projects-collections-sidebar .preview-image {
  padding-top: 10px;
  max-width: 220px;
  cursor: zoom-in;
}

#user-projects-groups-desktop {
  flex: 1 1 auto;
  padding: 10px;
  overflow-y: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: flex-start;
  align-content: flex-start;
}
#user-projects-groups-desktop .group {
  width: 300px;
  min-width: 300px;
  height: 300px;
  margin: 10px;
  border-radius: 10px;
  background: white;
}
#user-projects-groups-desktop .group .group-header {
  border-bottom: 1px solid #9e9e9e;
  height: 50px;
  border-radius: 10px 10px 0 0;
  padding: 0 16px 0 8px;
  font-size: 1.13em;
  transition: background-color 0.5s cubic-bezier(0.35, 0, 0.25, 1);
}
#user-projects-groups-desktop .group .group-header:hover ng-md-icon, #user-projects-groups-desktop .group .group-header:hover md-select .md-select-value .md-select-icon:after {
  fill: #bdbdbd;
}
#user-projects-groups-desktop .group .group-header .group-name {
  margin: 0 5px;
  line-height: 1.2em;
  max-height: 44px;
  overflow: hidden;
}
#user-projects-groups-desktop .group .group-header .md-button {
  background-color: transparent;
}
#user-projects-groups-desktop .group .group-header .md-button.md-raised {
  background-color: rgba(255, 255, 255, 0.2);
}
#user-projects-groups-desktop .group .group-header .md-button.md-raised ng-md-icon {
  fill: white;
}
#user-projects-groups-desktop .group .group-list-container {
  background-color: transparent;
  margin-bottom: 10px;
}
#user-projects-groups-desktop .group .group-list-container md-list {
  min-height: 200px;
  padding: 0;
}
#user-projects-groups-desktop .group .group-list-container md-list md-list-item {
  padding: 0;
}
#user-projects-groups-desktop .group .group-list-container md-list md-list-item:hover ng-md-icon {
  fill: #9e9e9e;
}
#user-projects-groups-desktop .group .group-list-container md-list md-list-item .md-list-item-inner {
  padding: 0 13px 0 10px;
}
#user-projects-groups-desktop .group .group-list-container md-list md-list-item .remove-button, #user-projects-groups-desktop .group .group-list-container md-list md-list-item .info-button {
  min-width: 25px;
  min-height: 25px;
  line-height: 0px;
  margin: 0px;
  transform: translateX(-3px);
}
#user-projects-groups-desktop .group .group-list-container md-list md-list-item .remove-button:hover, #user-projects-groups-desktop .group .group-list-container md-list md-list-item .info-button:hover {
  background-color: transparent;
}
#user-projects-groups-desktop .group .group-list-container md-list md-list-item .md-button {
  padding: 0;
}
#user-projects-groups-desktop .group .group-list-container md-list .md-list-item-text {
  outline: none;
}

#user-projects-sidebar {
  flex: 0 0 300px;
  display: flex;
  flex-direction: column;
  background-color: #eeeeee;
  color: #9e9e9e;
}
#user-projects-sidebar .project-list-filters {
  position: relative;
  margin: 15px;
}
#user-projects-sidebar .project-list-filters md-input-container {
  width: 100%;
  margin: 0 0 10px;
}
#user-projects-sidebar .project-list-filters md-input-container .md-errors-spacer {
  min-height: 0;
}
#user-projects-sidebar .project-list-filters .clear-button {
  position: absolute;
  top: 0px;
  right: 0;
  min-width: auto;
  margin: 0;
  line-height: 0;
}
#user-projects-sidebar .project-list-filters .active-label {
  color: #212121;
}
#user-projects-sidebar .project-list-container {
  background-color: transparent;
  padding: 10px;
}
#user-projects-sidebar .project-list-container .info-button {
  min-width: 25px;
  min-height: 25px;
  line-height: 0px;
  margin: 0px;
  transform: translateX(-3px);
}
#user-projects-sidebar .project-list-container .info-button:hover {
  background-color: transparent;
}
#user-projects-sidebar .project-list-container md-list {
  padding: 0;
}
#user-projects-sidebar .project-list-container md-list md-list-item {
  padding: 0;
}
#user-projects-sidebar .project-list-container md-list md-list-item:hover ng-md-icon {
  fill: #9e9e9e;
}
#user-projects-sidebar .project-list-container md-list md-list-item .md-button {
  padding: 0 15px;
}
> .md-button #user-projects-sidebar .project-list-container md-list md-list-item:hover {
  background-color: transparent;
}
#user-projects-sidebar .project-list-container md-list md-list-item .md-list-item-text {
  outline: none;
  line-height: 1.6em;
  margin: 5px;
  width: 100%;
}

user-projects-component {
  display: flex;
  flex-direction: column;
  justify-content: stretch;
  background-color: #fafafa;
}
user-projects-component .sub-header {
  flex: 0 0 48px;
  display: flex;
  background-color: #eeeeee;
  color: #9e9e9e;
  font-weight: bold;
  border-bottom: 1px solid #d7d7d7;
}
user-projects-component .sub-header > * {
  display: flex;
  align-items: center;
  justify-content: center;
}
user-projects-component .sub-header > * > * {
  margin: 0 3px;
}
user-projects-component .sub-header .left, user-projects-component .sub-header .right {
  flex: 0 0 300px;
}
user-projects-component .sub-header .center {
  flex: 1 1 auto;
}
user-projects-component .user-projects-content {
  flex: 1 1 auto;
  display: flex;
  overflow: hidden;
}
user-projects-component .md-button {
  min-width: 30px;
  min-height: 30px;
  line-height: 20px;
  margin: 0;
  padding: 0;
}
user-projects-component ng-md-icon {
  outline: none;
  cursor: pointer;
  margin: 0;
}
user-projects-component ng-md-icon.group-header-icon, user-projects-component ng-md-icon.project-icon {
  fill: transparent;
}
user-projects-component ng-md-icon.group-header-icon:hover, user-projects-component ng-md-icon.project-icon:hover {
  fill: white !important;
}
user-projects-component ng-md-icon.no-click {
  cursor: default;
}
user-projects-component ng-md-icon:not(.visibility-icon) {
  transition: fill 0.2s;
}
user-projects-component .show-groups {
  transition: background-color 0.2s;
}
user-projects-component .show-groups.groups-hidden ng-md-icon {
  fill: #ff8a65;
}
user-projects-component .show-groups[disabled], user-projects-component .show-groups[disabled]:hover {
  background-color: #9e9e9e;
  color: white;
}
user-projects-component .show-groups[disabled] ng-md-icon, user-projects-component .show-groups[disabled]:hover ng-md-icon {
  cursor: default;
}
user-projects-component .show-groups:hover:not([disabled]) {
  color: #ffb74d;
}
user-projects-component .grab-handle ng-md-icon {
  position: relative;
  cursor: move;
}
user-projects-component .collection {
  color: #0d47a1;
}

workspace-component {
  display: flex;
  flex-direction: column;
  height: 100vh;
  width: 100vw;
  background-color: white;
}
workspace-component #workspace-header {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 10px 10px 12px;
  background-color: white;
  border-bottom: 1px solid #d7d7d7;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  z-index: 20;
}
workspace-component #workspace-header .logo-container {
  height: 46px;
  cursor: pointer;
}
workspace-component #workspace-header .logo-container img {
  height: 100%;
}
workspace-component #workspace-header .project-select-container {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
workspace-component #workspace-header .project-select-container project-select-component {
  pointer-events: all;
}
workspace-component #workspace-header .spacer {
  flex: 1 1 auto;
}
workspace-component #workspace-header .app-controls, workspace-component #workspace-header .project-controls {
  display: flex;
  align-items: center;
}
workspace-component #workspace-header .app-controls .notification-badge, workspace-component #workspace-header .project-controls .notification-badge {
  top: 2px;
  right: 6px;
}
workspace-component #workspace-header .app-controls .vertical-divider, workspace-component #workspace-header .project-controls .vertical-divider {
  border-left: 1px solid #d7d7d7;
  height: 46px;
  margin: 0 5px;
}
workspace-component #workspace-header .user-avatar {
  height: auto;
  width: auto;
  min-height: 0;
  min-width: 0;
  margin: 0 0 0 5px;
  padding: 0 5px;
  border: 1px solid #d7d7d7;
  font-size: 24px;
  color: #9e9e9e;
  transition: color 0.15s linear !important;
}
workspace-component #workspace-header .user-avatar:hover {
  color: #ffb74d;
}
@media (max-width: 959px) {
  workspace-component #workspace-header .logo-container {
    height: 40px;
  }
}
workspace-component #workspace-container {
  min-height: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  height: 100%;
}
workspace-component #workspace-container > * {
  height: 100%;
}
workspace-component .form-edit, workspace-component .project-settings {
  display: flex;
}
workspace-component .close-team {
  position: absolute;
  top: 65px;
  right: 0px;
  display: none;
}
workspace-component .close-team.show {
  display: block;
}
workspace-component .sleep-overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  background-color: rgba(38, 50, 56, 0.5);
  transition: opacity 0.5s;
}
workspace-component .sleep-overlay.ng-hide {
  opacity: 0;
}