Generated by SassMeister.com.

lithium-generated-code.css

.MessageView.lia-message-view-display
  .lia-message-subject
  .lia-message-subject {
  display: inline;
}
.MessageView.lia-message-view-display
  .lia-message-subject
  .lia-link-navigation {
  float: left;
  margin: 10px 2.5px;
}
.MessageView.lia-message-view-display .lia-quilt-column-main-right,
.MessageView.lia-message-view-display .lia-quilt-column-main-left {
  width: 100%;
  border: none;
  padding: 0;
  clear: both;
  margin: 0;
}
@supports (display: contents) {
  %message-contents,
  .MessageView.lia-message-view-display .lia-quilt-column-main-right > div,
  .MessageView.lia-message-view-display
    .lia-quilt-column-main-right
    .MessageTagsTaplet
    > *,
  .MessageSubject {
    display: contents;
  }
  %message-title,
  .MessageView.lia-message-view-display
    .lia-quilt-column-main-right
    > div
    .article-labels-title,
  .MessageView.lia-message-view-display
    .lia-quilt-column-main-right
    .MessageTagsTaplet
    .lia-panel-heading-bar-title,
  .MessageView.lia-message-view-display
    .lia-quilt-column-main-right
    .Attachments::before {
    display: block;
    font-weight: bold;
    color: #626469;
    font-size: 14px;
    text-transform: uppercase;
    border-bottom: 1px solid currentColor;
    margin: 0 0 1rem;
  }
  .MessageView.lia-message-view-display .lia-quilt-column-main-right {
    display: flex;
    flex-direction: column;
    .MessageView.lia-message-view-display .lia-quilt-column-main-right > div {
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        > div
        .article-labels-title {
        display: block;
      }
    }
    .MessageView.lia-message-view-display
      .lia-quilt-column-main-right
      .MessageTagsTaplet {
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .MessageTagsTaplet
        > *,
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .MessageTagsTaplet
        > *
        > *,
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .MessageTagsTaplet
        > *
        > *
        > *,
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .MessageTagsTaplet
        > *
        > *
        > *
        > *,
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .MessageTagsTaplet
        > *
        > *
        > *
        > *
        > *,
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .MessageTagsTaplet
        > *
        > *
        > *
        > *
        > *
        > * {
      }
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .MessageTagsTaplet
        .lia-panel-heading-bar-title {
      }
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .MessageTagsTaplet
        .add-tag-link {
        float: none;
      }
    }
    .MessageView.lia-message-view-display
      .lia-quilt-column-main-right
      .Attachments {
      display: block;
      order: -1;
      margin-bottom: 10px;
      .MessageView.lia-message-view-display
        .lia-quilt-column-main-right
        .Attachments::before {
        content: "Attachments:";
      }
    }
    .MessageView.lia-message-view-display
      .lia-quilt-column-main-right
      .LabelsList
      > ul {
      display: flex;
      clear: both;
    }
  }
  .MessageSubject {
  }
}
.lia-quilt lia-quilt-forum-message.lia-quilt-layout-two-column-message,
.lia-CommentEditor-form.lia-component-comment-editor,
.lia-quilt.lia-quilt-blog-topic-message.lia-quilt-layout-one-column-message {
  border: none;
}

SassMeister-input.scss

// ----
// libsass (v3.5.4)
// ----

// custom responsive

// custom variables
// colors
// main colors
$custom-color-primary: #3dcd58;
$custom-color-secondary: #42b4e6;
$custom-color-pink: #FCE7EF;

// light colors
$custom-color-light: transparentize($custom-color-primary, 0.5);
$custom-color-lighter: transparentize($custom-color-primary, 0.7);
$custom-color-lightest: transparentize($custom-color-primary, 0.9);

// grey colors
$custom-color-grey-text: #333;
$custom-color-grey-border: #9fa0a4;
$custom-color-grey-background: #f7f7f7;
$custom-color-medium-grey-background: #f5f5f5;
$custom-color-light-grey-background: #e7e6e6;
$custom-color-grey-on-dark: transparentize($custom-color-grey-text, 0.5);

// main palette
$custom-color-background: #fff;
$custom-color-foreground: #626469;
$custom-color-rollover: $custom-color-secondary;
$custom-color-rollover-hover: $custom-color-primary;
$custom-color-border: $custom-color-grey-border;
$custom-color-disabled: $custom-color-grey-on-dark;
$custom-color-highlight: $custom-color-grey-background;
$custom-color-danger: #b10043;
$custom-color-warning: #e47f00;
$custom-color-safe: #009530;

$custom-button-hover-color: #336699;
$custom-color-gray-background-alternative: #dcdcdc;

//Spinner
$custom-spinner-size-small: 20px;

// typography
$custom-type-font-body: "Arial Rounded MT", "Arial", sans-serif;
$custom-type-font-titles: $custom-type-font-body;

$custom-type-size-xsmall: 10px; 
$custom-type-size-small: 12px; 
$custom-type-size-base: 14px;
$custom-type-size-large: 16px; 
$custom-type-size-xlarge: 20px; 
$custom-type-size-xxlarge: 26px; 
$custom-type-size-xxxlarge: 36px; 
$custom-type-size-xxxxlarge: 42px;

// spacing
$custom-space-xxsmall: 2.5px;
$custom-space-xsmall: 5px;
$custom-space-small: 10px;
$custom-space-base: 20px;
$custom-space-large: 40px;
$custom-space-xlarge: 60px;
$custom-space-xxlarge: 90px;

// buttons
$custom-button-primary-text: $custom-color-background;
$custom-button-primary-background: $custom-color-secondary;
$custom-button-primary-border: $custom-color-secondary;
$custom-button-primary-hover-text: $custom-color-background;
$custom-button-primary-hover-background: $custom-button-hover-color;
$custom-button-primary-hover-border: $custom-button-hover-color;

$custom-button-secondary-text: $custom-color-background;
$custom-button-secondary-background: $custom-color-secondary;
$custom-button-secondary-border: $custom-color-secondary;
$custom-button-secondary-hover-text: $custom-color-background;
$custom-button-secondary-hover-background: $custom-button-hover-color;
$custom-button-secondary-hover-border: $custom-button-hover-color;

$custom-button-inversed-text: $custom-color-secondary;
$custom-button-inversed-background: transparent;
$custom-button-inversed-border: $custom-color-secondary;
$custom-button-inversed-hover-text: $custom-color-background;
$custom-button-inversed-hover-background: $custom-button-hover-color;
$custom-button-inversed-hover-border: $custom-button-hover-color;

// border-radius
$custom-border-radius-small: 2px;
$custom-border-radius-base: 0;
$custom-border-radius-large: 0;

// tables
$custom-table-text: $custom-color-foreground;
$custom-table-background-even: $custom-color-background;
$custom-table-background-odd: $custom-color-grey-background;
$custom-table-border: $custom-color-grey-border;

// max-width
$custom-max-width: 1180px;
$custom-max-width-hero: 785px;

// breakpoints
$custom-screen-xs: 480px;
$custom-screen-sm: 768px;
$custom-screen-md: 992px;
$custom-screen-lg: 1200px;

// variables overrides
// colors
// brand palette
$brand-primary: $custom-color-primary;
$brand-info: $custom-color-secondary;
$brand-danger: $custom-color-danger;
$brand-warning: $custom-color-warning;
$brand-success: $custom-color-safe;

// general
$custom-header-height: 70px;
$custom-header-space-height:50px;
$body-bg: $custom-color-background;
$li-bg-secondary: $custom-color-background;
$li-sub-header-bg: $custom-color-background;
$text-color: $custom-color-foreground;
$link-color: $custom-color-rollover;
$link-hover-color: $custom-color-rollover-hover;
$link-hover-decoration: underline;
$nav-link-hover-bg: $custom-color-highlight;
$list-group-hover-bg: $custom-color-highlight;
$pagination-hover-bg: $custom-color-highlight;
$dropdown-link-hover-bg: $custom-color-highlight;
$dropdown-link-disabled-color: $custom-color-disabled;

// typography
$font-family-sans-serif: $custom-type-font-body;
$font-family-base: $custom-type-font-body;
$headings-font-family: $custom-type-font-titles;
$headings-font-weight: 600;
$font-size-xsmall: $custom-type-size-xsmall;
$font-size-small: $custom-type-size-small;
$font-size-base: $custom-type-size-base;
$font-size-large: $custom-type-size-large;
$font-size-h1: $custom-type-size-xxxxlarge;
$font-size-h2: $custom-type-size-xxxlarge;
$font-size-h3: $custom-type-size-xxlarge;
$font-size-h4: $custom-type-size-xlarge;
$font-size-h5: $custom-type-size-large;
$font-size-h6: $custom-type-size-base;
$font-size-page-title: $custom-type-size-xxxlarge;
$li-font-size-subject: $custom-type-size-base;
$fa-font-size-base: $custom-type-size-base;
$line-height-base: 1.25;

// buttons
$btn-primary-color: $custom-button-primary-text;
$btn-primary-bg: $custom-button-primary-background;
$btn-primary-border: $custom-button-primary-border;
$btn-inverse-primary-color: $custom-button-primary-background;
$btn-inverse-primary-bg: $custom-button-primary-text;
$btn-inverse-primary-border: $custom-button-primary-border;
$btn-default-color: $custom-button-primary-background;
$btn-default-bg: $custom-button-primary-text;
$btn-default-border: $custom-button-primary-border;
$btn-secondary-color: $custom-button-secondary-text;
$btn-secondary-bg: $custom-button-secondary-background;
$btn-secondary-border: $custom-button-secondary-border;
$btn-inverse-secondary-color: $custom-button-secondary-background;
$btn-inverse-secondary-bg: $custom-button-secondary-text;
$btn-inverse-secondary-border: $custom-button-secondary-border;
$btn-font-weight: bold;

// border-radius
$border-radius-small: $custom-border-radius-small;
$border-radius-base: $custom-border-radius-base;
$border-radius-large: $custom-border-radius-large;

// icons
$li-icon-size: 38px;
$li-icon-size-lg: 50px;
$li-icon-size-sm: 32px;
$li-icon-size-xs: 9px;
$li-icon-color: $custom-color-foreground;
$li-icon-inverse-color: $custom-color-background;

// interaction style icons
$li-icon-blog-bg: $custom-color-secondary;
$li-icon-category-bg: $custom-color-secondary;
$li-icon-community-bg: $custom-color-secondary;
$li-icon-contest-bg: $custom-color-secondary;
$li-icon-forum-bg: $custom-color-secondary;
$li-icon-group-bg: $custom-color-secondary;
$li-icon-idea-bg: $custom-color-secondary;
$li-icon-qanda-bg: $custom-color-secondary;
$li-icon-tkb-bg: $custom-color-secondary;

// triangle top icons
$li-triangletop-thumb-tack-bg: $custom-color-danger;
$li-triangletop-check-bg: $custom-color-primary;
$li-triangletop-lock-bg: $custom-color-primary;
$li-triangletop-bullhorn-bg: $custom-color-primary;

// hero
$li-hero-community-bg: $custom-color-primary;
$li-hero-category-bg: $custom-color-primary;
$li-hero-board-bg: $custom-color-primary;
$li-hero-profile-bg: $custom-color-primary;

// container - 100%
$li-container-fluid: true;

// breakpoints
$screen-xs: $custom-screen-xs;
$screen-sm: $custom-screen-sm;
$screen-md: $custom-screen-md;
$screen-lg: $custom-screen-lg;


/* component: message */
.MessageView.lia-message-view-display {
  .lia-message-subject {
    .lia-message-subject {
      display: inline;
    }
    .lia-link-navigation {
      float: left;
      margin: $custom-space-small $custom-space-xxsmall;
    }
  }

  .lia-quilt-column-main-right,
  .lia-quilt-column-main-left {
    width: 100%;
    border: none;
    padding: 0;
    clear: both;
    margin: 0;
  }
}

@supports (display: contents) {
  %message-contents {
    display: contents;
  }
  %message-title {
    display: block;
    font-weight: bold;
    color: $custom-color-foreground;
    font-size: $custom-type-size-base;
    text-transform: uppercase;
    border-bottom: 1px solid currentColor;
    margin: 0 0 1rem;
  }

  .MessageView.lia-message-view-display .lia-quilt-column-main-right {
    display: flex;
    flex-direction: column;

    & > div {
      @extend %message-contents;
      .article-labels-title {
        display: block;
        @extend %message-title;
      }
    }
    .MessageTagsTaplet {
      & > *,
      & > * > *,
      & > * > * > *,
      & > * > * > * > *,
      & > * > * > * > * > *,
      & > * > * > * > * > * > * {
        @extend %message-contents;
      }
      .lia-panel-heading-bar-title {
        @extend %message-title;
      }

      .add-tag-link {
        float: none;
      }
    }

    .Attachments {
      display: block;
      order: -1;
      margin-bottom: $custom-space-small;
      &::before {
        content: "Attachments:";
        @extend %message-title;
      }
    }

    .LabelsList > ul {
      display: flex;
      clear: both;
    }
  }
  .MessageSubject {
    @extend %message-contents;
  }
}

.lia-quilt lia-quilt-forum-message.lia-quilt-layout-two-column-message,
.lia-CommentEditor-form.lia-component-comment-editor,
.lia-quilt.lia-quilt-blog-topic-message.lia-quilt-layout-one-column-message {
  border: none;
}

.lia-component-common-widget-announcement,
.lia-message-body-content,
.lia-message-subject {
  line-height: 1.5;
}

.lia-messages-search-before-post {
  background-color: $custom-color-background;
  color: $custom-color-danger;
}
/*
.lia-quilt-row.lia-quilt-row-header {
  padding: 20px 25px 15px;
}
*/

SassMeister-output.css

/* component: message */
.MessageView.lia-message-view-display .lia-message-subject .lia-message-subject {
  display: inline;
}

.MessageView.lia-message-view-display .lia-message-subject .lia-link-navigation {
  float: left;
  margin: 10px 2.5px;
}

.MessageView.lia-message-view-display .lia-quilt-column-main-right,
.MessageView.lia-message-view-display .lia-quilt-column-main-left {
  width: 100%;
  border: none;
  padding: 0;
  clear: both;
  margin: 0;
}

@supports (display: contents) {
  .MessageView.lia-message-view-display .lia-quilt-column-main-right > div, .MessageView.lia-message-view-display .lia-quilt-column-main-right .MessageTagsTaplet > *,
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .MessageTagsTaplet > * > *,
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .MessageTagsTaplet > * > * > *,
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .MessageTagsTaplet > * > * > * > *,
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .MessageTagsTaplet > * > * > * > * > *,
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .MessageTagsTaplet > * > * > * > * > * > *, .MessageSubject {
    display: contents;
  }
  .MessageView.lia-message-view-display .lia-quilt-column-main-right > div .article-labels-title, .MessageView.lia-message-view-display .lia-quilt-column-main-right .MessageTagsTaplet .lia-panel-heading-bar-title, .MessageView.lia-message-view-display .lia-quilt-column-main-right .Attachments::before {
    display: block;
    font-weight: bold;
    color: #626469;
    font-size: 14px;
    text-transform: uppercase;
    border-bottom: 1px solid currentColor;
    margin: 0 0 1rem;
  }
  .MessageView.lia-message-view-display .lia-quilt-column-main-right {
    display: flex;
    flex-direction: column;
  }
  .MessageView.lia-message-view-display .lia-quilt-column-main-right > div .article-labels-title {
    display: block;
  }
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .MessageTagsTaplet .add-tag-link {
    float: none;
  }
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .Attachments {
    display: block;
    order: -1;
    margin-bottom: 10px;
  }
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .Attachments::before {
    content: "Attachments:";
  }
  .MessageView.lia-message-view-display .lia-quilt-column-main-right .LabelsList > ul {
    display: flex;
    clear: both;
  }
}

.lia-quilt lia-quilt-forum-message.lia-quilt-layout-two-column-message,
.lia-CommentEditor-form.lia-component-comment-editor,
.lia-quilt.lia-quilt-blog-topic-message.lia-quilt-layout-one-column-message {
  border: none;
}

.lia-component-common-widget-announcement,
.lia-message-body-content,
.lia-message-subject {
  line-height: 1.5;
}

.lia-messages-search-before-post {
  background-color: #fff;
  color: #b10043;
}

/*
.lia-quilt-row.lia-quilt-row-header {
  padding: 20px 25px 15px;
}
*/