/* Variables */
/* Mix ins */
/* CSS */
.messageBubble {
  -webkit-transition: -webkit-transform 200ms ease-in;
  -moz-transition: -moz-transform 200ms ease-in;
  -ms-transition: -ms-transform 200ms ease-in;
  -o-transition: -o-transform 200ms ease-in;
  transition: transform 200ms ease-in;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  position: fixed;
  top: 0;
  display: block;
  padding: 10px;
  font-weight: 300;
  left: 0;
  width: 100%;
  font-size: 20px;
  cursor: pointer;
  text-align: center;
  z-index: 6000;
  background: #878746;
  color: white;
  border-color: #4C4D25;
  border-width: 0 0 0 10px;
  border-style: solid; }
  .messageBubble#SuccessMessage {
    background: #878746;
    color: white;
    border-color: #4C4D25; }
  .messageBubble#ErrorMessage {
    background: #d0374b;
    color: white;
    border-color: #ac283a; }
  .messageBubble#SystemMessage {
    background: #82b7bf;
    color: white;
    border-color: #60a4ae; }
  .messageBubble.done {
    top: -200px;
    -webkit-transform: translate3d(0, 110%, 0);
    -moz-transform: translate3d(0, 110%, 0);
    -ms-transform: translate3d(0, 110%, 0);
    -o-transform: translate3d(0, 110%, 0);
    transform: translate3d(0, 110%, 0); }