.note { .mix-titled-block(@lighter-blue, @dark-blue, @light-blue, @fa-var-arrow-circle-right);}
.tip {.mix-titled-block(@lighter-green, @dark-green, @light-green, @fa-var-check-circle);}
.warning {.mix-titled-block(@lighter-yellow, @dark-yellow, @light-yellow, @fa-var-exclamation-triangle);}

.sidebar {.mix-titled-block(@light-gray, @gray-5, @light-gray, @fa-var-info-circle);}
.output {.mix-box(@light-gray, @gray-5, @light-gray);}

.terminal {
  .mix-box(@gray-2, @gray-e, @gray-c);
  padding: 0 3px;
  border: 2px solid @gray-9;
  border-top: 10px solid @gray-9;
  p, p:first-child {
    margin-top: 0;
    margin-bottom: 0;
    text-shadow: none;
    font-weight: normal;
    font-family: @monospace-font;
    font-size: 85%;
    color: @gray-e;
    &:before {
      font-family: @monospace-font;
      font-style: normal;
      font-weight: bold;
      color: @dark-green;
      content: "$ ";
    }
  }
}

.terminal-su {
  .terminal;
  p, p:first-child {
    &:before {
      color: @bright-red;
      content: "# ";
    }
  }
}

div .terminal {
  margin: 2px auto;
}
