#imc {
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
  -webkit-user-select: none;
  /* webkit (safari, chrome) browsers */
  -moz-user-select: none;
  /* mozilla browsers */
  -khtml-user-select: none;
  /* webkit (konqueror) browsers */
  -ms-user-select: none;
  /* IE10+ */ }
  #imc #imc_container {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 104px;
    left: 0;
    background: #000; }
  #imc #imc_work_container {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -110px;
    height: 110px; }
    #imc #imc_work_container:after {
      display: block;
      position: absolute;
      content: "";
      width: 0;
      top: 6px;
      right: 0;
      bottom: 0;
      background: #fff;
      box-shadow: 0 0 8px 6px #fff; }
  #imc #imc_container #imc_image_inline {
    position: absolute;
    bottom: 10px;
    right: 10px;
    display: flex;
    flex-direction: row-reverse; }
    #imc #imc_container #imc_image_inline > * {
      display: flex;
      flex-direction: column;
      margin-left: 8px; }
      #imc #imc_container #imc_image_inline > * > * {
        margin-top: 8px; }
    #imc #imc_container #imc_image_inline > .imc_debug_group {
      display: none; }
    #imc #imc_container #imc_image_inline #imc_loading {
      align-self: flex-end;
      font-size: 20px;
      line-height: 20px;
      color: #fff;
      text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.5);
      display: none; }
    #imc #imc_container #imc_image_inline #imc_loading.loading {
      display: inline-block; }
    #imc #imc_container #imc_image_inline #imc_image_info {
      display: block;
      align-self: flex-end;
      font-size: 80%;
      font-weight: 100;
      line-height: 20px;
      letter-spacing: 0.11em;
      color: #fff;
      text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.9);
      opacity: 0.1;
      padding-top: 1px;
      transition: opacity ease-out 0.3s; }
    #imc #imc_container #imc_image_inline #imc_image_info.display {
      opacity: 0.9;
      transition: opacity ease-out 0.3s; }
    #imc #imc_container #imc_image_inline #imc_image_info.display:before {
      font-family: FontAwesome;
      margin-right: 4px;
      font-weight: 100; }
    #imc #imc_container #imc_image_inline #imc_image_info.display.image:before {
      content: "\f03e"; }
    #imc #imc_container #imc_image_inline #imc_image_info.display.crop:before {
      content: "\f125"; }
    #imc #imc_container #imc_image_inline #imc_croplocked {
      box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.5); }

#imc.imc_debug #imc_container #imc_image_inline .imc_debug_group {
  display: flex; }

/**
 * Preview area and preview images
 */
.imc_preview_container {
  display: flex;
  white-space: nowrap;
  padding-left: 7px;
  overflow-x: scroll;
  height: 115px; }
  .imc_preview_container .imc_preview_image_container .imc_preview_image {
    position: relative;
    margin: 5px 5px 0 0;
    height: 90px;
    width: 90px;
    overflow: hidden;
    border: 2px solid transparent; }
    .imc_preview_container .imc_preview_image_container .imc_preview_image > span {
      position: absolute;
      bottom: 3px;
      left: 3px;
      font-size: 11px;
      line-height: 20px;
      color: #fff;
      font-weight: 300;
      background: rgba(0, 0, 0, 0.4);
      text-shadow: 0 0 1px rgba(0, 0, 0, 0.3);
      border-radius: 2px;
      display: flex;
      flex-direction: row; }
      .imc_preview_container .imc_preview_image_container .imc_preview_image > span i, .imc_preview_container .imc_preview_image_container .imc_preview_image > span b, .imc_preview_container .imc_preview_image_container .imc_preview_image > span em {
        display: block;
        font-style: normal;
        margin-right: 6px;
        line-height: 20px;
        height: 20px; }
      .imc_preview_container .imc_preview_image_container .imc_preview_image > span i {
        display: none; }
      .imc_preview_container .imc_preview_image_container .imc_preview_image > span em {
        overflow: hidden; }
  .imc_preview_container .imc_preview_image_container.active .imc_preview_image {
    box-shadow: 1px 0px 5px 1px rgba(0, 0, 0, 0.5); }
  .imc_preview_container .imc_preview_image_container .imc_preview_image span b {
    font-size: 14px;
    background: rgba(0, 0, 0, 0.3);
    cursor: pointer;
    text-align: center;
    width: 23px;
    padding-left: 1px;
    border-radius: 3px 0 0 3px; }
    .imc_preview_container .imc_preview_image_container .imc_preview_image span b:hover {
      background: rgba(0, 0, 0, 0.7); }
  .imc_preview_container .imc_preview_image_container.usable .imc_preview_image span b::before {
    content: "\f00c";
    color: #26a037; }
  .imc_preview_container .imc_preview_image_container.unusable .imc_preview_image span b::before {
    content: "\f05e";
    color: #ea1b1b;
    font-weight: bold; }

/**
 * Simple button
 */
a.button,
a.toggle {
  display: inline-block;
  text-decoration: none;
  font-size: 12px;
  vertical-align: middle; }

a.button {
  background: #3498DC;
  color: #fff;
  line-height: 22px;
  padding: 0 8px;
  border-radius: 8px;
  font-weight: 100;
  display: block;
  float: left; }
  a.button.secondary {
    background-color: #3498DC; }
  a.button.left, a.button.right {
    padding: 0 16px;
    text-align: center; }
  a.button.left {
    border-radius: 8px 0 0 8px;
    margin-right: 0;
    border-right: 1px solid #3498DC; }
  a.button.right {
    border-radius: 0 8px 8px 0;
    margin-right: 0; }
  a.button:hover {
    background-color: #288dd1; }

/**
 *
 * Toggle option, defaults to off
 *
 */
a.toggle {
  height: 20px;
  color: #3498DC;
  border-radius: 12px;
  padding: 0;
  /* Toggle label */
  /* Toggle options */
  /* Option on state */ }
  a.toggle em {
    display: inline-block;
    line-height: 20px;
    font-style: normal;
    vertical-align: middle;
    /* Use label as title instead */ }
    a.toggle em.hint {
      display: none; }
  a.toggle > span {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: 0;
    padding: 0;
    width: 50px;
    height: 20px;
    border-radius: 10px;
    line-height: 14px;
    background: #3A99D9;
    /* Toggle option, default off */ }
    a.toggle > span span {
      display: block;
      position: absolute;
      overflow: visible;
      width: 14px;
      height: 14px;
      top: 3px;
      left: 3px;
      border-radius: 7px;
      text-indent: 20px;
      background: #2274AC;
      color: #cfddde;
      /* Font awesome vector icon handling */
      /* On defaults to hidden */ }
      a.toggle > span span i {
        text-indent: 3px; }
      a.toggle > span span.on {
        display: none; }
  a.toggle.toggle.on > span {
    background: #3498DC; }
    a.toggle.toggle.on > span span.on {
      display: block;
      background: #2274AC;
      color: #ffffff;
      left: auto;
      right: 3px;
      text-indent: -23px; }
      a.toggle.toggle.on > span span.on i {
        text-indent: 4px; }
    a.toggle.toggle.on > span span.off {
      display: none; }