.fusion-builder-live {
  &.fusion-builder-ui-wireframe {
    .fusion-builder-live-element {
      &:after {
        display: none !important;
      }

      .fusion-builder-module-controls-container:not(.fusion-builder-module-controls-type-container) {
        .fusion-builder-module-controls:not(.fusion-builder-controls-wireframe) {
          display: none;
        }
      }

      &.fusion-element-alignment-left,
      &.fusion-element-alignment-right {
          &:hover {
             + .fusion-builder-live-element {
                  z-index: auto;
              }
          }
      }
    }

    &.fusion-builder-nested-cols-dialog-open {
      #main {
        z-index: 9999999;
      }

      .fusion-row.fusion-builder-row-active {
        z-index: auto;
      }
    }



    #fusion_builder_container {
      margin: 0 auto;
      max-width: 1200px;
    }

    .fusion-element-spacing {
        display: none !important;
    }

    .fusion-builder-section-header {
      position: relative;
      display: block;
      margin: 0 auto;
      background: #0091cd;
      width: 100%;
      height: 44px;
      box-sizing: border-box;
      color: #fff;
      border-bottom: 1px solid #fff;

      input[type=text].fusion-builder-section-name {
        background-color: transparent;
        border: 1px solid transparent;
        margin: 9px 0 0 25px;
        z-index: 9;
        box-shadow: none;
        color: #fff;
        width: 33%;
        height: 25px;
        font-size: 14px;
        padding: 3px 5px;
        font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;

        &:hover,
        &:focus,
        &:active {
          border: 1px solid rgba(255, 255, 255, 0.3);
          background-color: rgba(255, 255, 255, 0.1);
          transition-property: border, background, color;
          transition-duration: 0.05s;
          transition-timing-function: ease-in-out;
        }
      }

      .fusion-builder-module-controls-container {
        display: block;
        position: relative !important;
        border-radius: 0;
        box-shadow: none;
        margin: 0;
        top: 0 !important;
        right: 0 !important;
        float: right;
        background: transparent;
        z-index: 9;

        .fusion-builder-controls {
            background-color: transparent !important;

            &:hover {
                .fusion-builder-container-settings {
                  background: rgba(0, 0, 0, 0.15) !important;
                }
            }

            a {
              color: #fff;
              opacity: 1;
              display: block;
              float: left;
              padding: 13px;
              border-left: 1px solid rgba(255, 255, 255, 0.3);
              background: rgba(0, 0, 0, 0.15);
              font-size: 16px;
              height: 16px;
              width: 16px;
              text-decoration: none;
              box-sizing: content-box;
              line-height: 1;

              span {
                  line-height: 1;
              }

              &.fusion-builder-container-settings:hover,
              &:hover {
                background: transparent !important;
              }

              &.fusion-builder-toggle {
                text-align: center;
                padding: 13px 15px;
              }

              &.fusion-builder-insert-column {
                display: none;
              }
            }
        }
      }
    }

    .fusion-builder-module-controls-container {
        .fusion-builder-module-controls-inner {
            flex-wrap: wrap;
        }

        .fusion-builder-module-controls {
            .fusion-builder-container-drag,
            .fusion-builder-column-drag,
            .fusion-builder-element-drag {
                display: none !important;
            }
        }
    }



    .fusion-builder-module-controls-container-wrapper {
      display: none;
    }

    .fusion-builder-empty-container .fusion-builder-empty-container-label {
      display: block;
      margin: 15px 0 20px 0;
      color: rgba(0, 0, 0, 0.4);
      font-size: 24px;
      line-height: 30px;
      text-align: center;
      font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
    }

    .fusion-builder-module-controls-container {
      z-index: 20;
    }

    .fusion-column-sizer-active {
        .fusion_builder_row {
            overflow: visible;
        }
    }

    .fusion_builder_row {
        overflow: auto;
        cursor: auto;
    }

    .fusion-builder-column-content {
      display: block;
      width: 100%;
      float: left;
    }

    .fusion-builder-column {
        &.fusion-layout-column {
          display: inline-block;
          float: none;
          vertical-align: top;
          margin: 20px 1.5% !important;
          padding: 4.5em 2em 2em !important;
          border: 1px solid rgba(0, 0, 0, 0.1);
          cursor: grab;
      }

      .fusion-column-wrapper {
        box-shadow: none !important;
        border: 0 !important;
      }

      .fusion-column-spacing {
        display: none;
      }

      .fusion-builder-add-element {
        display: block;
        width: 100%;
        border: 1px dashed #666;
        float: left;
        padding: 1em 0;
        color: #000;
        opacity: 0.4;
        text-decoration: none;
        box-sizing: border-box;
        transition-property: all;
        box-shadow: none;
        background: #fff;
        text-align: center;
        position: relative;
        bottom: 0;
        left: 0;
        right: 0;
        top: 0;
        font-size: 13px;
        font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;

        span {
          position: relative;
          top: 1px;
          margin-right: 3px;
        }

        &:hover {
          opacity: 1;
          border-color: rgba(102, 102, 102, 0.4);
        }

        .fusion-column-tooltip {
          display: none;
        }
      }

      .fusion-builder-module-controls-container.fusion-builder-module-controls-type-column {
        display: block;
        border-radius: 0;
        box-shadow: none;
        background: transparent;

        .fusion-builder-controls.fusion-builder-module-controls {
          display: block;

          a {
            opacity: 1;
            padding: 0;
            height: 33px;
            width: 33px;
            line-height: 33px;
            text-align: center;
            color: #999;
            background: #f7f7f7 !important;
            border-right: 1px solid rgba(0, 0, 0, 0.1);
            border-bottom: 1px solid rgba(0, 0, 0, 0.1);
            border-radius: 0;

            &:hover,
            &:focus,
            &:active {
              color: #333;
            }
          }

          &:hover {
              a {
                  background: #f7f7f7 !important;
              }
          }

          .fusion-builder-insert-column,
          .fusion-builder-row-add-child {
            display: none !important;
          }
        }
      }

      .fusion-column-wrapper:after {
        display: none;
      }

      .column-sizes > h4,
      .fusion-column-inner-bg {
        display: none;
      }

      .fusion-builder-empty-column {
          padding: 0;

          .fusion-builder-module-controls-container {
              display: none !important;
          }
      }

      .column-sizes {
        top: -72px !important;
        bottom: auto !important;
        left: 0;
        width: 240px;
        border-radius: 0 !important;

        .column-size {
          font-weight: 400;
          color: #444;
          font-size: 13px;
          width: 40px;
          padding: 13px 0;
          line-height: 1;

          &.active-size {
            background: #0091cd;
            color: #fff;
          }
        }
      }

      &.fusion-builder-column-inner {
          .column-sizes {
              top: 100% !important;
              transform: none !important;
          }
      }
    }

    .fusion-builder-live-element,
    .fusion-builder-nested-element {
      float: left;
      width: 100%;
      margin-bottom: 1.5em;

      .fusion-builder-module-controls-container {
        border-radius: 0;
        box-shadow: none;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: #fff !important;
        z-index: 101;
        transform: none;
        border: 1px solid rgba(0, 0, 0, 0.1);
        border-radius: 0;

        .fusion-builder-controls-wireframe {
          position: absolute;
          text-align: center;
          padding: 0;
          left: 0;
          z-index: 100;
          background: transparent !important;
          margin: auto;
          width: 133px;
          right: 0;
          top: 0;
          bottom: 0;
          height: 33px;
          max-width: 100%;
          display: flex;
          flex-wrap: wrap;
          border-left: 1px solid rgba(0, 0, 0, 0.1);
          border-radius: 0;

          a {
            color: #999;
            opacity: 1;
            display: block;
            float: left;
            border-top: 1px solid rgba(0, 0, 0, 0.1);
            border-right: 1px solid rgba(0, 0, 0, 0.1);
            border-bottom: 1px solid rgba(0, 0, 0, 0.1);
            background: #f7f7f7;
            text-decoration: none;
            text-align: center;
            width: 33px;
            border-radius: 0;

            &:hover,
            &:focus,
            &:active {
              color: #333;
            }
          }
        }
      }

      &:hover {
          > .fusion-builder-module-controls-container {
              display: flex;
              align-items: center;
              justify-content: center;

              .fusion-builder-controls-wireframe {
                  position: static;
                  height: auto;
                  margin: 0;
              }
          }
      }
    }

    .fusion-layout-column.fusion-one-full {
      float: left;
    }

    .fusion_builder_row {
      float: left;
      width: 100%;
      padding: 1.5% 1.5% 38px;
      border: 1px solid rgba(0, 0, 0, 0.1);
      border-top: none;
    }

    .fusion-builder-module-preview {
      font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
      display: block;
      padding: 1.5em;
      margin-bottom: 0;
      border: 1px solid rgba(0, 0, 0, 0.1);
      position: relative;
      box-sizing: border-box;
      float: left;
      width: 100%;
      background: #fff;
      overflow: hidden;

      .fusion_module_title {
        font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
        margin: 0 0 0.5em;
        font-size: 15px;
        font-weight: 600;
        color: #333;
      }

      .fusion_module_block_preview {
        font-size: 13px;
        color: #333;

        .fusion-icon-circle-preview {
          width: 40px;
          height: 40px;
          border-radius: 100%;
          margin: 0 auto;
          text-align: center;

          .fa-preview {
            line-height: 40px;
            font-size: 20px;
          }
        }

        ul {
          margin: 0;
          padding: 0;
          text-align: center;
          list-style: none;
        }
      }
    }

    .fusion-builder-container {
      display: block !important;

      &:after {
          display: none;
      }

      .fusion-container-spacing {
        opacity: 0;
        visibility: hidden;
      }

      &.fusion-builder-section-folded {
          .fusion-fullwidth:hover {
              .fusion-builder-container-add,
              .fusion_builder_row>.fusion-builder-insert-column {
                display: none;
              }
          }
      }

      .fusion-fullwidth {
        display: block !important;
        border-top: none !important;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1) !important;
        background: #fff !important;
        padding: 0px !important;
        float: none;
        margin: 0 auto !important;
        overflow: visible !important;
        min-height: auto !important;

        .fusion-builder-module-controls-type-container {
          display: none;
        }

        .fusion-builder-container-add,
        .fusion-builder-insert-column {
          display: none;
          position: absolute !important;
          top: auto !important;
          bottom: 0;
          text-align: center;
          font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
          font-size: 13px !important;
          font-weight: 400 !important;
          line-height: 1.4em;
          border: 1px solid rgba(0, 0, 0, 0.1);
          border-bottom: 0;
          padding: 8px 0;
          text-decoration: none;
          color: #999;
          z-index: 9;
          width: 160px;
          box-shadow: none;
          border-radius: 0;

          span {
            position: relative;
            top: 1px;
            margin-right: 3px;
          }

          .closed {
            display: none;
          }

          .open {
            display: inline-block;
          }

          &:hover {
            color: #333;
          }
        }

        .fusion-builder-container-add {
          right: 160px !important;

          .closed {
            display: none;
          }

          .open {
            display: inline-block;
          }

          &:hover {
            color: #333;
          }
        }

        .fusion-builder-insert-column {
          right: 0 !important;
          border-right: none;
          border-left: none;
          right: 0;
        }

        .fullwidth-faded,
        .fullwidth-video,
        .fullwidth-overlay {
          display: none;
        }

        &:hover {
          .fusion-builder-container-add,
          .fusion_builder_row>.fusion-builder-insert-column {
            display: block;
          }
        }

        &.hundred-percent-height {
          height: auto !important;
          min-height: 0 !important;

          .fusion-fullwidth-center-content {
            height: auto !important;
            min-height: 0 !important;
          }
        }

        .fusion-outline-helper,
        .fusion-scroll-section-nav {
          display: none !important;
        }
      }

      .parallax-inner,
      .fusion-bg-parallax {
        display: none;
      }

      &.fusion-builder-section-folded {

        .fusion-builder-wireframe-utility-toolbar,
        .fusion-builder-container-content {
          display: none;
        }

        &:last-child {
          padding-bottom: 45px;

          .fusion-builder-container-add {
            display: inline-block !important;
            right: 0 !important;
            bottom: -45px;
            border-bottom: 1px solid rgba(0, 0, 0, 0.1);
            ;
          }
        }
      }
    }

    .fusion-column-wrapper {
      background: #fff !important;
      margin: 0 !important;
      padding: 0 !important;
      min-height: 0 !important;
      height: auto !important;
    }

    .fusion-column-content-centered {
      min-height: 0 !important;
    }

    .fusion-builder-element-content {
      display: none !important;
    }

    .fusion_builder_column_layout_1_1,
    .fusion_builder_column_layout_fullwidth {
      width: 97% !important;
    }

    .fusion_builder_column_1_1 {
      width: 97% !important;
    }

    .fusion_builder_column_1_6 {
      width: 13.666% !important;
    }

    .fusion_builder_column_5_6 {
      width: 80.333% !important;
    }

    .fusion_builder_column_1_5 {
      width: 17% !important;
    }

    .fusion_builder_column_2_5 {
      width: 37% !important;
    }

    .fusion_builder_column_3_5 {
      width: 57% !important;
    }

    .fusion_builder_column_4_5 {
      width: 77% !important;
    }

    .fusion_builder_column_1_4 {
      width: 22% !important;
    }

    .fusion_builder_column_3_4 {
      width: 72% !important;
    }

    .fusion_builder_column_1_3 {
      width: 30.33333% !important;
    }

    .fusion_builder_column_2_3 {
      width: 63.66666% !important;
    }

    .fusion_builder_column_1_2 {
      width: 47% !important;
    }

    .fusion-builder-nested-element {
      .fusion-builder-module-preview {
        h4 {
          margin: 0;
          font-weight: 600;
          font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
        }

        p {
          margin-top: 8px;
          margin-bottom: 0;
        }
      }

      .fusion-builder-row-content,
      .fusion-builder-module-controls-type-row {
        display: none;
      }

      .fusion-builder-row-content-active {
        display: block;
        z-index: 9999;
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;

        .fusion-builder-modal-top-container,
        .fusion-builder-modal-bottom-container,
        .fusion-builder-add-element {
          display: block !important;
          float: left;
          width: 100%;
        }

        .fusion-builder-add-element:after {
          content: "Element";
          color: #000;
          padding-left: 5px;
          font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
        }

        .fusion-builder-nested-columns-settings-overlay {
          z-index: 9999;
          position: fixed;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          background: rgba(0, 0, 0, 0.5);
          cursor: auto;
        }

        .fusion-builder-nested-columns-settings {
            overflow: auto;
          cursor: auto;
          border-radius: 3px;
          position: fixed;
          top: 5%;
          left: 0;
          right: 0;
          bottom: 5%;
          width: 85%;
          max-width: 1250px;
          margin: auto;
          background: #FFF;
          overflow: hidden;
          box-sizing: border-box;
          z-index: 99999;
          box-shadow: 0 0 50px rgba(0, 0, 0, 0.3);
        }

        .fusion-builder-modal-top-container {
          position: relative;
          padding: 15px 20px;
          background: #2A3035;
          color: #ffffff;

          h4 {
            overflow: hidden;
            float: left;
            margin: .1em 0;
            width: 90%;
            white-space: nowrap;
            text-overflow: ellipsis;
            font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
            font-size: 18px;
            font-weight: 600;
            color: #ffffff;
          }

          .fusion-builder-inner-row-close-icon {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            right: 20px;
            margin: 0;
            padding: 0;
            line-height: 1;
            font-family: 'fusion-builder-icons';
            color: #ffffff;
            border: none;
            background: transparent;
            text-transform: none;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            cursor: pointer;

            &:before {
              display: block;
              content: "\e904";
              font-size: 14px;
            }
          }
        }

        .fusion-builder-row-container-inner {
          padding: 30px 10px;
          height: ~"calc(100% - 144px)";
          cursor: auto;
          text-align: left;
          overflow: auto;

          .fusion-builder-column {
            padding: 3.5em 1em 1.5em !important;
          }

          .fusion-builder-module-controls-type-column {
            display: block !important;
            background: transparent !important;
            border: none;
            height: auto !important;
          }
        }

        .fusion-builder-modal-bottom-container {
          position: absolute;
          bottom: 0;
          left: 0;
          right: 0;
          width: 100%;
          border-top: 1px solid #e2e2e2;
          padding: 15px 20px;
          background: #FFF;
          z-index: 9999;
          box-sizing: border-box;
          text-align: right;

          a {
            border: none;
            font-family: "Noto Sans", Roboto, "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen-Sans", "Ubuntu", "Cantarell", "Helvetica Neue", sans-serif;
            font-weight: 600;
            margin: 0;
            line-height: 40px;
            padding: .4em 1em;
            display: inline-block;
            position: relative;
            width: 120px;
            text-align: center;
            font-size: 13px;
            border-radius: 0;
            outline: none;
            transition: all 0.3s ease;

            &.fusion-builder-modal-save {
              background: #198fd9;
              color: white;

              &:hover {
                background-color: #1081c7;
              }
            }

            &.fusion-builder-insert-inner-column,
            &.fusion-builder-inner-row-close {
              background: white;
              color: #2a3035;
              border: 1px solid #e2e2e2;
              line-height: 38px;

              &:hover {
                color: #198fd9;
              }
            }

            &.fusion-builder-inner-row-close {
              margin: 0 11px;
            }

            &.fusion-builder-insert-inner-column {
              float: left;

              span {
                position: relative;
                top: 1px;
                margin-right: 3px;
              }
            }
          }
        }
      }

      &.editing {
        .fusion-builder-editing-icons {
          display: none;
        }

        &:hover {
          >.fusion-builder-module-controls-container {
            display: block !important;
          }
        }
      }
    }

    .fusion-builder-next-page {
      justify-content: space-between;
      margin: 0;
      border-radius: 0;
      height: 42px;
      border-left: 1px solid rgba(0, 0, 0, 0.1);

      .fusion-builder-next-page-desc {
        margin: 0 31px;
        font-weight: 400;
      }

      .fusion-builder-next-page-controls {
        order: 2;
        padding: 0;

        .fusion-builder-controls {
          background-color: transparent;
          border-radius: 0;
        }

        a {
          display: none !important;
        }

        .fusion-builder-delete-next-page {
          display: block !important;
          width: 42px;
          height: 42px;
          line-height: 42px;
          background-color: rgba(0, 0, 0, 0.35);
          color: #ffffff;

          &:hover {
            background-color: rgba(0, 0, 0, 0.25);
          }
        }
      }
    }


    .fusion_builder_row {
        &.ui-sortable-placeholder {
            background: #f3f3f3;
            height: inherit;
        }
    }

    .fusion-builder-container {
        &.ui-sortable-placeholder {
          background: #f3f3f3;
        }

        .ui-sortable-helper {
            background: #ffffff;
        }
    }

    .fusion-global-container {
        .ui-sortable-helper,
        .ui-sortable-placeholder {
            &:after {
                display: none;
            }
        }

        .ui-sortable-helper {
            .fusion-builder-section-content {
                background: transparent;
            }
        }
    }

    .ui-sortable-helper {
        opacity: 0.8;

        .fusion-builder-container-add {
            display: none !important;
        }

        &.fusion-builder-column {
            overflow: hidden;
        }
    }

    .ui-sortable-placeholder {
        background: #f3f3f3 !important;
        border: 1px dashed rgba(0, 0, 0, 0.1) !important;
        visibility: visible !important;
        box-shadow: none;
        padding-left: 0;
        padding-right: 0;
        display: inline-block;
        width: 100%;

        &.fusion_builder_module_block {
            height: 70px;
        }
    }
  }

  .fusion-builder-module-preview {
    display: none;
    padding: 4px;
    width: 100%;
    text-align: center;
    background: #fff;
    color: #666;
    border: 1px solid #ccc;
    margin-bottom: 8px;

    .fusion-slide-preview,
    img {
      display: inline-block;
      width: auto;
      margin: 1.5%;
      max-height: 80px;
      vertical-align: middle;
      box-sizing: border-box;
    }

    .fusion-module-icon {
      display: inline-block;
      margin-right: 0.5em;
      font-size: 1em;
    }
  }
}

@media only screen and (min-width: 400px) {
  .fusion-builder-live {
    &.fusion-builder-ui-wireframe {
      .fusion-builder-section-header {
        .fusion-builder-module-controls-container {
         .fusion-builder-controls a {
           width: 13px !important;
         }
       }
      }
    }
  }
}
