.bccolors-live-preview {
  position: fixed;
  top: 10%;
  right: -206px;
  width: 206px;
  z-index: 11111;
  transition: all 0.3s;
  color: #3d3d3d;
  font-size: 13px;
  font-family: Arial, Helvetica, sans-serif; }
  .bccolors-live-preview .live-preview-toggle {
    float: left;
    width: 40px;
    height: 40px;
    line-height: 40px;
    margin-left: -40px;
    margin-top: 100px;
    background: #fff;
    text-align: center;
    font-size: 25px;
    cursor: pointer;
    border-radius: 5px 0 0 5px;
    box-shadow: -3px 0px 10px -2px rgba(0, 0, 0, 0.5); }
    .bccolors-live-preview .live-preview-toggle:hover i {
      transform: scale(1.1); }
  .bccolors-live-preview .live-preview-container {
    background: #fff;
    border-radius: 5px 0 0 5px; }
  .bccolors-live-preview .live-preview-title {
    font-size: 15px;
    text-align: center;
    font-weight: 700;
    text-transform: uppercase;
    border-bottom: 1px solid #bdbdbd;
    padding: 15px 0;
    color: #3d3d3d; }
  .bccolors-live-preview .live-preview-boxed-wide {
    padding: 10px 15px;
    overflow: hidden; }
    .bccolors-live-preview .live-preview-boxed-wide a {
      width: 44%;
      float: left;
      color: #3d3d3d;
      text-align: center;
      margin: 0 3%;
      line-height: 28px;
      border: 1px solid #ddd;
      border-radius: 3px;
      transition: all 0.3s; }
      .bccolors-live-preview .live-preview-boxed-wide a.active, .bccolors-live-preview .live-preview-boxed-wide a:hover {
        background: #ddd; }
    .bccolors-live-preview .live-preview-boxed-wide .style, .bccolors-live-preview .live-preview-boxed-wide .boxed_bg_css, .bccolors-live-preview .live-preview-boxed-wide .preview {
      display: none; }
  .bccolors-live-preview .live-preview-wrapper {
    padding: 5px 15px; }
    .bccolors-live-preview .live-preview-wrapper .hint {
      text-align: center;
      color: #31708f;
      background-color: #d9edf7;
      border-color: #bce8f1; }
    .bccolors-live-preview .live-preview-wrapper .acolor {
      padding: 10px 0;
      overflow: hidden;
      line-height: 30px; }
      .bccolors-live-preview .live-preview-wrapper .acolor label {
        float: left;
        margin: 0;
        color: #3d3d3d; }
      .bccolors-live-preview .live-preview-wrapper .acolor .livePreviewColorPicker {
        float: right;
        width: 30px;
        height: 30px;
        border: 1px solid #bdbdbd; }
      .bccolors-live-preview .live-preview-wrapper .acolor .style, .bccolors-live-preview .live-preview-wrapper .acolor .selector, .bccolors-live-preview .live-preview-wrapper .acolor .property, .bccolors-live-preview .live-preview-wrapper .acolor .preview {
        display: none; }
  .bccolors-live-preview .live-preview-reset {
    text-align: center;
    padding: 10px 0;
    border-top: 1px solid #bdbdbd; }
    .bccolors-live-preview .live-preview-reset a {
      color: inherit;
      font-weight: 700;
      font-size: 15px;
      border-bottom: 2px solid; }
  @media (max-width: 767px) {
    .bccolors-live-preview {
      display: none; } }

.bccolors-live-preview.open {
  right: 0; }
  .bccolors-live-preview.open .live-preview-container {
    box-shadow: -3px 0px 50px -2px rgba(0, 0, 0, 0.14); }

/*# sourceMappingURL=front.css.map */