mno-enterprise-frontend 2.0.9 → 3.0.0

data/lib/assets/stylesheets/impac-angular.less

@@ -1,2352 +0,0 @@
-/* ************************************************************************ */
-/*                                LESS VARIABLES
-**                This stylesheet should only contain variables.
-/* ************************************************************************ */
-
-/*-----------------------------------------------------------------------*/
-/*                          Color palette                                */
-/*-----------------------------------------------------------------------*/
-@mgreen:                          #dae173;
-@morange:                         #d6782b;
-@mdarkblue:                       #232528;
-@mgrey:                           #cccccc;
-@mlightgrey:                      #999999;
-@mdarkbg:                         #16161B;
-@mblue:                           #358fdc;
-@darkerblue:                      #16252c;
-@darkblue:                        #17262d;
-@darkerblue:                      darken(@darkblue,4%);
-@darkblue2:                       #25333a;
-@mediumblue:                      #626d6d;
-@lightblue:                       #abc4c6;
-@pink:                            #ed1e79;
-
-@fluroblue:                       #00e5f0;
-@fluroorange:                     #ff7300;
-@flureoyellow:                    #fbd925;
-@flurogreen:                      #47ff00;
-@fluropink:                       #e01f74;
-
-@darkgreen:                       #33d375;
-@green:                           #d1e55c;
-@purple:                          #977bf0;
-@lightgray:                       #e6edee;
-@bluegray:                        #abc4c6;
-@bluegray2:                       #35464c;
-
-@brand-success:                  @fluroblue;
-@brand-warning:                  @purple;
-@brand-info:                     @fluroblue;
-@brand-danger:                   @fluropink;
-@brand-primary:                  @fluroblue;
-
-@impac-positive:                 green;
-@impac-negative:                 @pink;
-@impac-positive2:                #3fc4ff;     // lighter colors used for payables-receivables
-@impac-negative2:                #1de9b6;     // lighter colorsused for payables-receivables
-
-// Dashboard
-//--------------------------------------
-@impac-dashboard-padding-top:                   50px;
-@impac-dashboard-margin-left:                   100px;
-
-// Title
-@impac-dashboard-title-color:                   @purple;
-@impac-dashboard-title-label-color:             @darkblue;
-@impac-dashboard-title-label-create-color:      white;
-@impac-dashboard-source-color:                  @impac-dashboard-title-label-color;
-@impac-dashboard-buttons-border-radius:         4px;
-
-// Dashboard Selector
-  // Tabs
-@impac-dashboard-selector-border:               1px solid @lightblue;
-@impac-dashboard-selector-tabs-margin:          0 2px 0 0;
-@impac-dashboard-selector-tabs-padding:         10px 8px 10px 15px;
-@impac-dashboard-selector-tabs-background-color: transparent;
-@impac-dashboard-selector-tabs-active-background-color: #ffffff;
-@impac-dashboard-selector-tabs-color:           black;
-@impac-dashboard-selector-tabs-active-color:    @purple;
-
-// Widget selector
-@impac-dashboard-widget-selector-bg:            #233845;
-@impac-dashboard-widget-selector-text-color:    white;
-
-// Widgets container
-@impac-placeholder-border:                      2px dashed @lightblue;
-@impac-widgets-container-side-padding:          0px;
-@impac-padding-between-widgets:                 12px;
-@impac-minimum-widget-size:                     250px;
-@impac-big-widget-size:                         565px;
-
-// Buttons
-@impac-btn-shadded-bg:                         @darkblue;
-@impac-btn-shadded-color:                      @mediumblue;
-
-// Dashboard Modals
-@impac-dashboard-loading-spinner:               white;
-
-// Widgets
-//--------------------------------------
-// Global
-@impac-widget-link-color:                      @purple;
-@impac-widget-buttons-color:                   @impac-widget-link-color;
-@impac-widget-tile-selected-color:             @impac-widget-link-color;
-@impac-widget-background-color:                white;
-@impac-widget-border:                          solid 1px darken(@lightgray,10%);
-@impac-widget-text-color:                      #5B6667;
-@impac-widget-text-color-medium:               lighten(@impac-widget-text-color,25%);
-@impac-widget-text-color-light:                lighten(@impac-widget-text-color,40%); //#acb0b1
-@impac-widget-borders-color:                   lighten(@impac-widget-text-color-light,10%); //#f3f4f4
-@impac-widget-scrollbar-color:                 #233845;
-@impac-widget-loading-spinner:                 #67BBE9;
-
-// Title
-@impac-widget-title-text-color:                darken(@impac-widget-text-color,5%);
-@impac-widget-title-bg:                        @impac-widget-background-color;
-@impac-widget-title-border:                    solid 1px @impac-widget-borders-color;
-@impac-widget-title-text-transform:            uppercase;
-@impac-widget-title-text-size:                 12px;
-@impac-widget-title-border-radius:             5px 5px 0px 0px;
-@impac-widget-top-buttons-color:               @impac-widget-text-color-light;
-
-// Content
-@impac-widget-content-border-radius:           0px 0px 5px 5px;
-@impac-widget-lines-container-max-height:      200px;
-
-// Settings
-// Param selector
-@impac-widget-param-selector-color:            @impac-widget-link-color;
-// Hist Mode Choser
-@impac-widget-hist-text-transform:             uppercase;
-@impac-widget-hist-text-size:                  12px;
-@impac-widget-hist-text-color:                 @impac-widget-text-color-light;
-// Params picker
-@impac-widget-params-picker-bg:                #1E303B;
-@impac-widget-params-picker-unchecked-bg:      #c2c4c4;
-// Limit emtries
-@impac-widget-limit-entries-color:             #1E303B;
-
-// Globals and Mixins
-@impac-widget-selectable-color:                @impac-widget-link-color;
-
-// Edit settings
-@impac-widget-sub-bg-color:                    darken(@impac-widget-background-color,10%);
-@impac-widget-sub-bg-color-light:              lighten(@impac-widget-sub-bg-color,5%); //f3f4f4
-
-// Accounts Comparison
-@impac-widget-accounts-comparison-lines-container-max-height: 220px;
-
-// Sales break-even
-@impac-widget-sales-break-even-bg:             rgb(25,40,49);
-@impac-widget-sales-break-even-text-color:     #1de9b6;
-
-.font(@size,@weight,@color) {
-  font-weight:@weight;
-  font-size:@size;
-  color:@color;
-}
-
-.center-bold (@margin-top: 30px) {
-  .font(22px, 900, @impac-widget-text-color);
-  text-align: center;
-  margin-top: @margin-top;
-}
-
-.center-thin () {
-  .font(16px, 300, @impac-widget-text-color);
-  text-align: center;
-}
-
-.center-small () {
-  .font(12px, 300, @impac-widget-text-color);
-  text-align: center;
-}
-
-.left-thin (@margin-top: 0px) {
-  .font(14px, 300, @impac-widget-text-color);
-  text-align: left;
-  margin-top: @margin-top;
-}
-
-.widget-height (@height: @impac-minimum-widget-size) {
-  min-height: @height;
-  @media (min-width: @screen-md-min) {
-    height: @height;
-    .chart-container {
-      max-width: @height + 20px;
-      max-height: @height - 125px;
-      margin: auto;
-    }
-  }
-}
-
-.short-widget () {
-  .widget-height();
-  .edit {
-    max-height: @impac-minimum-widget-size - 20px;
-  }
-}
-
-.tall-widget () {
-  .widget-height(@impac-big-widget-size);
-  .edit {
-    max-height: @impac-big-widget-size - 20px;
-    .widget-lines-container {
-      .scrollable(hidden);
-    }
-  }
-}
-
-.scrollable (@scroll-mode: auto) {
-  overflow-y: @scroll-mode;
-  overflow-x: hidden;
-}
-
-.selectable () {
-  cursor: pointer;
-  :hover, &:hover {
-    color: @impac-widget-selectable-color;
-  }
-  .selected {
-    border: solid 1px @impac-widget-selectable-color;
-    background-color: lighten(@impac-widget-selectable-color, 22%)
-  }
-}
-
-.alternate-bg (@even-color: @impac-widget-sub-bg-color) {
-  &:nth-child(even) {
-    background-color: @even-color;
-  }
-  &:nth-child(odd) {
-    background-color: @impac-widget-background-color;
-  }
-}
-
-.edit-panel-style() {
-  .scrollable();
-  color: @impac-widget-text-color;
-  padding: 2px;
-  font-size: 12px;
-
-  .bottom-buttons {
-    .btn {
-      border-radius: 2px;
-      margin-right: 5px;
-      padding: 3px 13px;
-      text-transform: uppercase;
-      font-size: 12px;
-
-      &.btn-default {
-        background-color: #c2c4c4;
-        border: solid 1px darken(#c2c4c4,10%);
-        color: white;
-        &:hover {
-          border: solid 1px darken(#c2c4c4,20%);
-          background-color: darken(#c2c4c4,10%);
-        }
-      }
-    }
-  }
-
-  h4 {
-    margin: 0;
-    margin-bottom: 8px;
-    text-align: left;
-    .font(12px,normal,@impac-widget-text-color-light);
-  }
-
-  .part {
-    margin-bottom: 8px;
-    padding: 10px 0px;
-    background-color: @impac-widget-sub-bg-color-light;
-    // color: #626d6d;
-    border: solid 1px @impac-widget-borders-color;
-
-    h5 {
-      display: block;
-      margin: 0;
-      margin-bottom: 10px;
-      padding: 0px 15px;
-      text-transform: uppercase;
-      .font(12px,normal,@impac-widget-text-color-light);
-    }
-
-    label {
-      font-weight: normal;
-    }
-
-    select.form-control {
-      margin: 0px;
-      border: solid 1px #acb0b1;
-      outline: none;
-      -webkit-box-shadow: none;
-      font-size: 13px;
-      color: #72728b;
-    }
-  }
-}
-
-.loader-style(@color: @impac-widget-loading-spinner) {
-  color: @color;
-}
-
-/* ************************************************************************ */
-/*                                GLOBAL STYLES
-**        This stylesheet should only contain styles applied global or in
-**                            2 or more components.
-/* ************************************************************************ */
-
-// Not ideal: intends to force a scrollbar on the window (not on the body),
-// so that the tooltips appended to body are not making the screen flickering.
-// (see when there is only 1 invoices list widget on the dashboard)
-// It is better if the tooltips can be appended to body because otherwise it's
-// messing the alternate-bg() mixing (by adding a child to the parent element)
-body {
-  height: 101% !important;
-}
-
-.analytics {
-
-  // ---------------------------------------------------------------------------
-  // --- Titles
-  // ---------------------------------------------------------------------------
-
-  h2 {
-    margin-top: 2px;
-    font-size: 14px;
-    color: @impac-widget-text-color;
-  }
-
-  h3 {
-    margin: 0px;
-    .left-thin();
-  }
-
-  h4 {
-    color: @impac-widget-text-color;
-    font-size: 16px;
-  }
-
-  // ---------------------------------------------------------------------------
-  // --- Colors
-  // ---------------------------------------------------------------------------
-
-  .positive,.green {
-    color: @impac-positive !important;
-  }
-
-  .negative,.red {
-    color: @impac-negative !important;
-  }
-
-  .positive2 {
-    color: @impac-positive2 !important;
-  }
-
-  .negative2 {
-    color: @impac-negative2 !important;
-  }
-
-  // ---------------------------------------------------------------------------
-  // --- Base elements
-  // ---------------------------------------------------------------------------
-
-  a {
-    font-weight: bold;
-    color: @impac-widget-link-color;
-    cursor: pointer;
-  }
-
-  .input-group {
-    width: 100%;
-  }
-
-  select {
-    margin-top: 5px;
-    background-color: @impac-widget-background-color;
-    height: 32px;
-  }
-
-  pre {
-    font-size: 12px;
-    padding: 0px;
-    margin: 1px 0px 8px 0px;
-    border: none;
-  }
-
-  .widget-item .content, kpis-bar .kpi {
-
-    ::-webkit-scrollbar {
-      width: 6px;
-      background-color: transparent;
-    }
-
-    ::-webkit-scrollbar-thumb {
-      background-color: lighten(@impac-widget-scrollbar-color,35%);
-      border-radius: 10px;
-      &:hover {
-        background-color: lighten(@impac-widget-scrollbar-color,40%);
-      }
-    }
-  }
-
-
-  // ---------------------------------------------------------------------------
-  // --- Custom elements
-  // ---------------------------------------------------------------------------
-
-  .btn.btn-shaded {
-    background-color: @impac-btn-shadded-bg;
-    border: solid 1px darken(@impac-btn-shadded-bg,5%);
-    color: @impac-btn-shadded-color;
-    font-weight: 400;
-
-    &:hover {
-      color: lighten(@impac-btn-shadded-color,5%);
-      background-color: lighten(@impac-btn-shadded-bg,5%);
-    }
-  }
-
-  .price {
-    .center-bold();
-  }
-
-  .currency {
-    .center-thin();
-    color: @impac-widget-text-color-medium;
-  }
-
-  .legend {
-    .center-small();
-    .scrollable();
-    color: @impac-widget-text-color-light;
-  }
-
-  .loader {
-    height: 100%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    i {
-      .loader-style();
-    }
-    p {
-      margin-top: 10px;
-    }
-  }
-
-  .right-panel {
-    border-left: solid 1px #e6e6e6;
-  }
-
-  .selector {
-    text-transform: uppercase;
-    font-size: 12px;
-    color: @mediumblue;
-    text-align: center
-  }
-
-  .tile {
-    background-color: rgb(247,247,247);
-    box-shadow: 0px 7px 10px -7px #17262d;
-    height: 45px;
-    margin-bottom: 10px;
-    white-space: nowrap;
-    cursor: pointer;
-    &:hover {
-      background-color: darken(#F1F9FF, 3%);
-    }
-    .colored-area {
-      background-color: #3FC4FF;
-      height: 100%;
-      float: right;
-      color: white;
-      text-align: right;
-      padding: 5px 10px;
-      min-width: 8%;
-      &.selected {
-        background-color: @impac-widget-tile-selected-color;
-      }
-    }
-    .main-text {
-      color: @impac-widget-text-color;
-      padding: 20px 0px 0px 5px;
-      height: 100%;
-      font-style: italic;
-      font-weight: bold;
-    }
-  }
-
-  .widget-lines-container {
-    .scrollable();
-    max-height: @impac-widget-lines-container-max-height;
-    text-align: left;
-    font-size: 12px;
-
-    .widget-line {
-      margin: 0px;
-      padding: 5px;
-      color: @mediumblue;
-
-      &.header {
-        .font(12px,500,@impac-widget-text-color-medium);
-        text-transform: uppercase;
-      }
-      &.small-row {
-        margin: inherit;
-        margin-left: -3px;
-        margin-right: -3px;
-        padding: 2px;
-
-        & > [class*='col-'] {
-          padding-left: 3px;
-          padding-right: 3px;
-        }
-      }
-      &.total {
-        padding: 0px;
-        border-top: solid 1px @lightgray;
-      }
-
-      .dashed {
-        border-bottom: dashed 1px @impac-widget-borders-color;
-      }
-    }
-  }
-}
-
-.vertical-scroll {
-  overflow-y: scroll;
-}
-
-.horizontal-scroll {
-  overflow-x: scroll;
-}
-
-// The tooltips should be append to body
-.tooltip.impac-widgets-tooltip .tooltip-inner.ng-binding {
-  text-align: left;
-  background-color: @mdarkblue;
-  max-width: 100%;
-  white-space: nowrap;
-  strong {
-    color: @mgreen;
-  }
-}
-
-// --- Reusable widget style mixins
-
-// Payroll-Summary - Profit-and-Loss
-.drill-down-widget () {
-  .tall-widget();
-
-  .widget-lines-container {
-    .scrollable(scroll);
-    max-height: 540px;
-    margin-right: 10px;
-
-    .widget-line.total {
-      .selectable();
-    }
-  }
-
-  .right-panel {
-    .widget-lines-container {
-      .scrollable(auto);
-      max-height: 235px;
-    }
-  }
-
-  .no-element {
-    .center-thin();
-  }
-}
-
-// Top customers summary - Sales cycle...
-.simple-summary-widget() {
-  .chart-container {
-    max-width: 410px;
-  }
-  .legend {
-    max-height: 28px;
-  }
-}
-
-// Invoices list - sales list
-.simple-list-widget() {
-  .widget-lines-container {
-    max-height: 230px;
-    .widget-line {
-      .alternate-bg();
-      &.header {
-        background-color: @impac-widget-background-color;
-      }
-    }
-  }
-}
-
-// Workforce-Summary - Salaries-Summary
-.expandable-filterable-widget() {
-  h3.left {
-    margin-top: 69px;
-    text-align: center;
-  }
-  h3.right {
-    margin-bottom: 10px;
-    text-align: center;
-  }
-  .price {
-    margin-top: 0;
-  }
-  .widget-lines-container {
-    max-height: 75px;
-    .widget-line {
-      font-size: 11px;
-    }
-  }
-}
-
-// Leads funnel - Opportunities funnel
-.funnel-widget() {
-  .tall-widget();
-  .funnel-container {
-    width: 95%;
-    margin: auto;
-    margin-top: 15px;
-    padding-right: 10px;
-    max-height: @impac-big-widget-size - 60px;
-    overflow: auto;
-  }
-  .right-panel {
-    .widget-lines-container {
-      max-height: @impac-big-widget-size - 20px;
-      margin-right: 10px;
-      .widget-line {
-        cursor: default;
-      }
-    }
-  }
-}
-.analytics {
-
-  &.show-dhb {
-    transition: opacity 1s;
-    opacity: 1;
-  }
-  &.hide-dhb {
-    opacity: 0;
-  }
-
-
-  padding-top: @impac-dashboard-padding-top;
-  margin-left: @impac-dashboard-margin-left;
-
-  #head-title {
-    // contains customisable impac logo, and heading text.
-    #dashboard-heading {
-      img {
-      float: left;
-      margin-right: 15px;
-      }
-      h2 {
-        padding-top: 12px;
-        height: 48px;
-        font-size: 30px;
-        color: #67bbe9;
-      }
-    }
-  }
-
-  #sub-menu {
-    margin-top: 15px;
-    h3 {
-      font-size: 26px;
-      font-weight: normal;
-      margin-bottom: 10px;
-      color: #233845;
-    }
-
-    .fa.fa-times {
-      margin: 6px;
-      color: lighten(#233845, 15%);
-      cursor: pointer;
-      float: right;
-    }
-  }
-
-  #widget-selector {
-    background-color: @impac-dashboard-widget-selector-bg;
-    color: @impac-dashboard-widget-selector-text-color;
-    padding: 0px 45px 10px 45px;
-    margin: 10px -45px;
-
-    -webkit-user-select: none; /* Chrome/Safari */
-    -moz-user-select: none; /* Firefox */
-    -ms-user-select: none; /* IE10+ */
-    /* Rules below not implemented in browsers yet */
-    -o-user-select: none;
-    user-select: none;
-
-    .badge.confirmation {
-      float: right;
-      margin-right: 10px;
-      opacity: 0;
-    }
-
-    .title {
-      padding: 15px 0px;
-      border-bottom: solid 1px lighten(@impac-dashboard-widget-selector-bg,6%);
-      i.fa.fa-times-circle {
-        float: right;
-        cursor: pointer;
-        margin-right: -35px;
-        margin-top: -6px;
-        font-size: 20px;
-        &:hover {
-          color: @mlightgrey;
-        }
-      }
-    }
-
-    .top-container {
-      margin: 15px 0px;
-      background-color: transparent;
-      border-radius: 3px;
-
-      .categories {
-        background-color: darken(@impac-dashboard-widget-selector-bg,6%);
-        padding-bottom: 15px;
-        .row.lines {
-          p:hover {
-            background-color: darken(@impac-dashboard-widget-selector-bg,3%);
-          }
-          p.selected {
-            background-color: @impac-widget-link-color;
-            font-weight: bold;
-            .box-shadow(-2px 2px 10px -4px black);
-          }
-        }
-        .arrow {
-          position: absolute;
-          top: 33px;
-          right: -11px;
-          z-index: 1;
-          .square {
-            width: 50px;
-            height: 30px;
-            position: absolute;
-            top: 10px;
-            right: 17px;
-            background-color: @impac-widget-link-color;
-          }
-          i.fa.fa-caret-right {
-            font-size: 52px;
-            color: @impac-widget-link-color;
-            float: right;
-            position: absolute;
-            top: -1px;
-            right: 0px;
-          }
-        }
-      }
-
-      .widgets {
-        background-color: darken(@impac-dashboard-widget-selector-bg,3%);
-        padding-bottom: 15px;
-        .row.header {
-          text-transform: uppercase;
-          font-size: 12px;
-          color: @impac-widget-link-color;
-        }
-        .row.lines {
-          padding: 3px 0px;
-          p:hover {
-            background-color: darken(@impac-dashboard-widget-selector-bg,6%);
-            font-weight: normal;
-          }
-          .fa.fa-plus-circle {
-            float: right;
-            margin-top: 3px;
-          }
-        }
-      }
-
-      .row.header {
-        padding: 10px 20px;
-        font-weight: bold;
-        min-height: 40px;
-      }
-
-      .row.lines {
-        overflow-x: hidden;
-        overflow-y: scroll;
-        height: 200px;
-        margin-right: -10px;
-        margin-left: 0px;
-        .box-shadow(inset 0px 0px 10px -4px black);
-        p {
-          padding: 5px;
-          margin: 0px;
-          border-bottom: solid 1px @impac-dashboard-widget-selector-bg;
-          cursor: pointer;
-          &:hover, &.selected {& > div {
-      display: inline-block;
-      margin-left: 10px;
-    }
-    select {
-      margin: 0;
-    }
-    .btn {
-      height: 32px;
-      padding-top: 5px;
-    }
-            color: @impac-dashboard-widget-selector-text-color;
-          }
-        }
-
-        &::-webkit-scrollbar {
-          width: 6px;
-          background-color: transparent;
-        }
-
-        &::-webkit-scrollbar-thumb {
-          background-color: lighten(@impac-dashboard-widget-selector-bg,3%);
-          border-radius: 10px;
-          &:hover {
-            background-color: lighten(@impac-dashboard-widget-selector-bg,6%);
-          }
-        }
-      }
-    }
-
-    .bottom {
-      height: 20px;
-      .suggestion {
-        float: right;
-        opacity: 0.7;
-        a {
-          cursor: pointer;
-          &:hover {
-            color: @fluroblue;
-          }
-        }
-        &:hover {
-          opacity: 1;
-        }
-      }
-    }
-  }
-
-  #dashboard-settings-panel {
-    position: relative;
-    margin: 0px 2px;
-    & > * {
-    }
-    & > div {
-      display: inline-block;
-      margin-left: 5px;
-      margin-top: 5px;
-    }
-    select {
-      margin: 0;
-    }
-    .btn {
-      height: 32px;
-      padding-top: 5px;
-    }
-  }
-
-  // no widgets - empty dashboard.
-  #no-widgets-container {
-    position: relative;
-    min-height: 150px;
-
-    // background image asset
-    img.bg {
-      left: 0;
-      top: 0;
-      min-width: 100%;
-      min-height: 100%;
-    }
-
-    // no widgets message that sits above image asset
-    .impac-info-message {
-      position: absolute;
-      top: 0;
-      width: 100%;
-    }
-
-  }
-
-  // parent div section for widgets to be housed.
-  #widgets-section {
-    padding-left: @impac-widgets-container-side-padding;
-    padding-right: @impac-widgets-container-side-padding;
-
-    // container for widgets
-    #widgets-container {
-      // Quick-fix to avoid screen flockering when tooltips are appended to body:
-      // min-height will force a scrollbar to appear...
-      min-height: 700px;
-    }
-
-    .placeHolderBox {
-      margin: @impac-padding-between-widgets;
-      height: 267px;
-      width: 300px;
-      float: left;
-      border: @impac-placeholder-border;
-      background: none;
-    }
-
-    // individual widget
-    .widget-item {
-      padding: @impac-padding-between-widgets;
-    }
-  }
-}
-
-// Tooltips are append to body
-.tooltip.impac-widget-selector-tooltip .tooltip-inner.ng-binding {
-  font-size: 14px;
-}
-
-.impac-widget-suggestion .modal-body {
-  input,textarea {
-    width: 100%;
-    color: black;
-  }
-  textarea {
-    height: 150px;
-  }
-  .thanks-message {
-    color: @mgreen;
-  }
-}
-
-// This style applies to dashboard modals, and also the
-// `accounts-custom-calculation/formula.modal.html` modal.
-.modal-footer .loader {
-  .loader-style(@impac-dashboard-loading-spinner)
-}
-
-#module__dashboard-selector {
-  a {
-    font-weight: normal;
-  }
-  // dashboard selector template wrapper div
-  & > div:first-child {
-    border-bottom: @impac-dashboard-selector-border;
-  }
-
-  .buttons-bar-row {
-    margin-top: 54px;
-  }
-
-  // container for dashboard selector 'dropdown' template
-  .buttons-bar {
-    padding: 0;
-    padding-bottom: 5px;
-
-    .btn {
-      float: right;
-      margin: 3px;
-      border-radius: @impac-dashboard-buttons-border-radius;
-    }
-
-    .dropdown-container {
-
-      .dashboard-title {
-        color: @impac-dashboard-title-color;
-        display: inline;
-        cursor: pointer;
-        &:hover {
-          color: darken(@impac-dashboard-title-color,10%);
-        }
-        i.fa.fa-pencil {
-          margin-left: 20px;
-          font-size: 14px;
-          &:hover {
-            color: @mgreen;
-          }
-        }
-      }
-
-      .dashboard-select {
-        margin: 5px 0px 10px 30px;
-        height: auto;
-        border-left: 1px solid @impac-dashboard-title-color;
-        border-bottom: 1px solid @impac-dashboard-title-color;
-        width: 300px;
-        background-color: @lightgray;
-        cursor: pointer;
-        .option {
-          color: @impac-dashboard-title-label-color;
-          white-space: nowrap;
-          &:hover {
-            background-color: @impac-widget-background-color;
-          }
-          &.create {
-            background-color: @impac-dashboard-title-color;
-            color: @impac-dashboard-title-label-create-color;
-            height: 30px;
-            padding: 5px 10px 5px 10px;
-            &:hover {
-              background-color: darken(@impac-dashboard-title-color,10%);
-            }
-          }
-          i.fa.fa-pencil {
-            float: right;
-            padding-top: 7px;
-            text-align: center;
-            width: 15%;
-            height: 30px;
-            &:hover {
-              color: darken(@impac-dashboard-title-color,10%);
-            }
-          }
-          span.name {
-            width: 85%;
-            height: 30px;
-            display: inline-block;
-            padding: 5px 10px 5px 10px;
-          }
-        }
-      }
-
-      .change-name {
-        position: absolute;
-        top: 30px;
-        left: 20px;
-        width: 60%;
-        background-color: rgb(23, 38, 45);
-        color: white;
-        padding: 10px;
-        border-radius: 4px;
-        text-align: center;
-        .box-shadow(0px 0px 25px 4px black);
-        z-index: 50;
-        border: solid 1px @impac-widget-background-color;
-
-        .form-control {
-          height: 25px;
-          margin-bottom: 10px;
-        }
-      }
-
-      .data-source-label {
-        color: @impac-dashboard-source-color;
-        padding-left: 3px;
-        margin: 0px;
-      }
-    }
-
-    .loader-container {
-      padding-left: 10px;
-      .loading-spinner {
-        .loader-style();
-        font-size: 40px;
-      }
-    }
-  }
-
-  // angular bootstrap tabs & pills
-  .nav-tabs {
-    border-bottom: 0;
-  }
-  .nav.nav-tabs,
-  .nav.nav-pills {
-
-    // add new tab
-    li:last-child > a {
-      padding-right: 15px;
-      tab-heading a {
-        position: static;
-      }
-    }
-  }
-
-  // TABS
-  .nav.nav-tabs {
-    // tab
-    li > a {
-      padding: @impac-dashboard-selector-tabs-padding;
-      margin: @impac-dashboard-selector-tabs-margin;
-      background-color: @impac-dashboard-selector-tabs-background-color;
-      border: @impac-dashboard-selector-border;
-      color: @impac-dashboard-selector-tabs-color;
-    }
-    // active tab
-    li.active > a {
-      background-color: @impac-dashboard-selector-tabs-active-background-color;
-      color: @impac-dashboard-selector-tabs-active-color;
-    }
-    // add new tab
-    li:last-child > a {
-      // padding-left: 5px;
-    }
-    li:last-child.active > a {
-      background-color: @impac-dashboard-selector-tabs-background-color;
-    }
-  }
-
-  // PILLS
-  // TODO: Add less variables for customisation.
-  .nav.nav-pills {
-    // tab
-    li > a {
-      min-width: 0px;
-      padding-right: 8px;
-    }
-    // add a new tab
-    li:last-child tab-heading a {
-      margin-left: 2px;
-    }
-    // add a new tab
-    li:last-child.active > a {
-      background-color: #f4f4f4;
-    }
-  }
-  // tab icons
-  tab-heading a.close-link {
-    border-bottom: 0px solid;
-    margin-left: 12px;
-    position: relative;
-    top: -9px;
-    right: 1px;
-    color: @impac-dashboard-selector-tabs-color;
-  }
-  ////////
-}
-
-impac-kpi .kpi {
-  .scrollable();
-  text-align: center;
-  max-width: 160px;
-  min-height: 135px;
-  padding: 10px 3px;
-  border-radius: 3px;
-  background-color: white;
-  box-shadow: 0px 4px 12px -7px #17262d;
-
-  &.static {
-    .kpi-value {
-      display: block;
-      font-size: 14px;
-      font-weight: 700;
-    }
-  }
-
-  .kpi-show {
-    white-space: normal;
-
-    .kpi-title {
-      .text-uppercase();
-      font-size: 12px;
-      font-weight: 600;
-      color: @impac-widget-text-color-medium;
-      border-bottom-color: @impac-widget-text-color-medium;
-
-      &:hover {
-        color: @impac-widget-text-color;
-        border-bottom-color: @impac-widget-text-color;
-      }
-    }
-
-    .editable-wrap .editable-controls {
-      & > input {
-        width: 65%;
-        height: 25px;
-        line-height: 25px;
-      }
-
-      .editable-buttons {
-        button {
-          margin: 0px 0px 0px 1px;
-          height: 25px;
-          padding: 0px 4px;
-        }
-      }
-    }
-
-    .kpi-watch {
-      font-size: 11px;
-    }
-
-    .kpi-value {
-      position: absolute;
-      top: 75px;
-      left: 0;
-      right: 0;
-      font-size: 20px;
-      font-weight: 700;
-    }
-
-    .kpi-alert {
-      .text-uppercase();
-      font-size: 11px;
-      font-weight: 700;
-      background-color: white;
-      border: 1px solid @brand-danger;
-      border-radius: 4px;
-      color: @brand-danger;
-      padding: 2px 5px;
-
-      position: absolute;
-      bottom: 15px;
-      left: 15%;
-      width: 70%;
-
-      &.kpi-close {
-        bottom: auto;
-        right: 20px;
-        top: 5px;
-        border-radius: 10px;
-        width: 21px;
-        left: auto;
-      }
-
-      &:hover {
-        color: darken(@brand-danger, 10%);
-        border-color: darken(@brand-danger, 10%);
-      }
-
-      &.static {
-        position: static;
-        margin: 5px 20px;
-      }
-    }
-  }
-
-  .kpi-edit {
-    .param-name {
-      .small();
-    }
-
-    .edit-limit {
-      .input-limit-value, .select-limit-mode {
-        margin-top: 0;
-        width: 50%;
-
-        .form-control-feedback {
-          color: @impac-widget-text-color-medium;
-          .small();
-          line-height: 24px;
-        }
-      }
-    }
-
-    .form-control.input-sm {
-      margin-top: 0;
-      height: 24px;
-      line-height: 24px;
-    }
-
-    .form-group {
-      margin-bottom: 0;
-    }
-
-    .btn.btn-xs {
-      margin-top: 4px;
-    }
-  }
-}
-
-.analytics kpis-bar > .key-stats .kpi {
-  min-height: 80px;
-}
-
-.analytics kpis-bar > .kpis {
-  padding: 10px 0px;
-  min-height: 145px;
-  overflow: hidden;
-
-  .available-kpis-container {
-    text-align: left;
-    position: absolute;
-    z-index: 15;
-    background-color: @impac-widget-background-color;
-    width: 500px;
-    max-height: 115px;
-    box-shadow: 0px 3px 12px -4px;
-
-    .scrollable();
-
-    .available-kpi {
-      border-bottom: solid 1px #D8DBDB;
-      padding: 4px;
-      padding-left: 8px;
-      height: 38px;
-
-      span.kpi-name {
-        padding-top: 5px;
-        display: inline-block;
-      }
-
-      .form-control-static, .btn.btn-sm.btn-info {
-        float: right;
-        min-height: 30px;
-        height: 30px;
-        float: right;
-        margin-left: 3px;
-        margin-top: 0px;
-        font-weight: bold;
-      }
-    }
-  }
-
-  .title-actions {
-    .title {
-      margin-top: 10px;
-      font-weight: 700;
-    }
-  }
-
-  .kpi-loader {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    min-height: 135px;
-  }
-}
-
-.analytics kpis-bar > .key-stats {
-  background-color: white;
-  // color: @light-black;
-  padding: 5px 0px;
-}
-
-.widget-item .top-line {
-  position: relative;
-  cursor: move;
-  background-color: @impac-widget-title-bg;
-  padding: 9px 9px 0px 9px;
-  border-radius: @impac-widget-title-border-radius;
-  border: @impac-widget-border;
-  border-bottom: none;
-  min-height: 41px;
-  .box-shadow(0px 1px 8px -4px);
-}
-
-.widget-item .content {
-  padding: 9px;
-  border-radius: @impac-widget-content-border-radius;
-  border: @impac-widget-border;
-  border-top: none;
-  background-color: @impac-widget-background-color;
-
-  vertical-align: top;
-  .box-shadow(0px 1px 8px -4px);
-  .short-widget();
-
-  .edit {
-    .edit-panel-style();
-  }
-
-  &.accessible {
-    height: auto !important;
-    min-height: 250px !important;
-    max-height: auto !important;
-  }
-}
-
-.analytics .dashboard-settings.currency {
-  text-align: right;
-  select {
-    margin-top: 4px;
-  }
-}
-
-.analytics .dashboard-settings.sync-apps {
-  span {
-    margin-right: 5px;
-    color: @impac-widget-text-color-medium;
-  }
-}
-
-.analytics .widget-item .content .data-not-found {
-  text-align: center;
-  font-size: 18px;
-  color: @impac-widget-text-color;
-  img {
-    opacity: 0.8;
-    -webkit-filter: blur(2px);
-    -moz-filter: blur(2px);
-    -o-filter: blur(2px);
-    -ms-filter: blur(2px);
-    filter: blur(2px);
-    // fix for mobile, prevents images from extended the width of the widget.
-    max-width: 100%;
-  }
-  .message {
-    position: absolute;
-    top: 90px;
-    width: 70%;
-    left: 15%;
-    background-color: rgb(244, 248, 249);
-    padding: 10px 0px;
-    border-radius: 4px;
-    border: solid 1px @impac-widget-borders-color;
-    a {
-      color: @impac-widget-link-color;
-      display: block;
-      font-size: 16px;
-      font-weight: normal;
-    }
-  }
-}
-.analytics .widget-item {
-  .title-wrapper {
-    width: 100%;
-    padding: 0px 10px 10px 10px;
-    white-space: nowrap;
-
-    .title {
-      display: inline;
-      text-transform: @impac-widget-title-text-transform;
-      .font(@impac-widget-title-text-size,600,@impac-widget-title-text-color);
-      text-align: left;
-      cursor: text;
-
-      &.editable-hide {
-        display: none;
-      }
-    }
-
-    .editable-wrap {
-      position: relative;
-      height: 20px;
-      min-width: 100%;
-      // otherwise, white-space is overriden in mno-enterprise
-      white-space: nowrap;
-
-      .editable-controls {
-        min-width: 100%;
-
-        .editable-input {
-          height: 20px;
-          font-size: 12px;
-          text-transform: @impac-widget-title-text-transform;
-          // 55px is .editable-buttons width
-          width: ~"calc(100% - 55px)";
-          padding: 0px 3px;
-        }
-
-        .editable-buttons {
-          background-color: @impac-widget-title-bg;
-          button {
-            margin: 0px 0px 0px 5px;
-            height: 20px;
-            padding: 0px 5px;
-          }
-        }
-      }
-    }
-  }
-}
-
-.analytics .widget-item .top-line #module__top-buttons {
-
-  i.fa {
-    margin-top: 3px;
-  }
-
-  .top-buttons-wrapper {
-    position: absolute;
-    right: 9px;
-    top: 7px;
-
-    .top-button {
-      background: transparent;
-      border: none;
-      color: @impac-widget-top-buttons-color;
-      padding: 1px;
-      margin-left: 3px;
-      outline: none;
-
-      &:active, &:focus {
-        -webkit-box-shadow: none;
-      }
-
-      &.btn-refresh {
-        font-size: 17px;
-        margin-top: -1px;
-        &:hover {
-          color: @mblue;
-        }
-      }
-      &.btn-edit {
-        font-size: 14px;
-        &:hover, &.edit-mode {
-          color: darken(@mgreen,10%);
-        }
-      }
-      &.btn-close {
-        &:hover {
-          color: @pink
-        }
-      }
-
-    }
-  }
-
-  .confirm-delete-popover {
-    position: absolute;
-    top: 90px;
-    left: 15%;
-    width: 70%;
-    background-color: #17262d;
-    padding: 10px;
-    border-radius: 4px;
-    z-index: 50;
-    color: white;
-    text-align: center;
-    cursor: default;
-    .box-shadow(0px 0px 25px 4px black);
-    border: solid 1px @impac-widget-background-color;
-
-    h4 {
-      color: @impac-widget-top-buttons-color;
-      font-weight: bold;
-    }
-
-    .loader i.fa.fa-spinner {
-      font-size: 26px;
-    }
-  }
-
-}
-
-.analytics .widget-item .content.accounts-accounting-values {
-  // Nothing particular yet for this template...
-}
-.analytics .widget-item .content.accounts-assets-liability-summary {
-  .param-selector {
-    text-align: center;
-  }
-  .legend {
-    text-align: left;
-    max-height: 97px;
-
-    .title {
-      text-align: center;
-      border-bottom: dashed 1px @impac-widget-borders-color;
-    }
-  }
-  p {
-    font-weight: bold;
-  }
-}
-
-.analytics .widget-item .content.accounts-assets-summary {
-  .legend {
-    text-align: left;
-    max-height: 115px;
-
-    .title {
-      text-align: center;
-      border-bottom: dashed 1px @impac-widget-borders-color;
-    }
-  }
-}
-
-
-.analytics .widget-item .content.accounts-balance {
-  h3 {
-    .left-thin(30px);
-    text-align: center;
-  }
-  
-  .price {
-    .center-bold(0px);
-  }
-}
-.analytics .widget-item .content.accounts-balance-sheet {
-  .tall-widget();
-  .widget-lines-container {
-    .scrollable(scroll);
-    max-height: 540px;
-  }
-
-  .no-data-block {
-    .center-thin();
-  }
-}
-.analytics .widget-item .content.accounts-cash-summary {
-  .drill-down-widget();
-  .right-panel > .widget-lines-container {
-    max-height: 215px;
-  }
-
-  .row.widget-line.total.cash {
-    border-top: solid 1px;
-    border-bottom: double;
-  }
-}
-.analytics .widget-item .content.accounts-class-comparison {
-  .param-selector {
-    text-align: center;
-  }
-  .widget-lines-container {
-    max-height: 94px;
-    color: #626d6d;
-  }
-}
-
-.analytics .widget-item .content.accounts-comparison {
-  .tall-widget();
-
-  .add-account {
-    position: absolute;
-    right: 40px;
-    bottom: 30px;
-    width: 160px;
-    select {
-      font-size: 13px;
-      background-color: @impac-widget-link-color;
-      color: @impac-widget-background-color;
-      outline: none;
-      border: none;
-      cursor: pointer;
-      &[disabled] {
-        cursor: not-allowed;
-        background-color: lighten(@impac-widget-link-color,10%);
-        &:hover {
-          background-color: lighten(@impac-widget-link-color,10%);
-        }
-      }
-      &:hover {
-        background-color: darken(@impac-widget-link-color,10%);
-      }
-      option {
-        background-color: @impac-widget-background-color;
-        color: lighten(@impac-widget-text-color,40%);
-        &[disabled] {
-          color: @impac-widget-background-color;
-        }
-      }
-    }
-  }
-  button.close {
-    font-size: 15px;
-  }
-  .legend {
-    text-align: left;
-    max-height: 103px;
-  }
-  .row {
-    margin: 0;
-  }
-  .widget-lines-container {
-    font-size: 11px;
-    max-height: @impac-widget-accounts-comparison-lines-container-max-height;
-  }
-
-  .settings.params-checkboxes {
-    margin-left: 13px;
-  }
-
-  .comparable-error h5 {
-    margin-left: 13px;
-    color: @impac-negative;
-  }
-}
-
-.analytics .widget-item .content.accounts-custom-calculation {
-  h3 {
-    margin-top: 85px;
-    text-align: center;
-    font-weight: bold;
-  }
-
-  .price {
-    .center-bold(75px);
-  }
-
-  .legend {
-    max-height: 125px;
-  }
-}
-
-.analytics.modal-custom-calculation {
-  margin: 0px;
-  padding: 0px;
-}
-
-.analytics.modal-custom-calculation .modal-body {
-  .edit {
-    .edit-panel-style();
-    padding: 5px;
-    .part {
-      width: 49%;
-    }
-  }
-}
-.analytics .widget-item .content.accounts-detailed-classifications {
-  .tall-widget();
-  .widget-lines-container {
-    .scrollable(scroll);
-    max-height: 540px;
-  }
-  // single entity selected class title
-  .account-class-title {
-    margin-bottom: 8px;
-    margin-left: 11px;
-  }
-  // .no-data-block {
-  //   .center-thin();
-  // }
-}
-
-
-
-.analytics .widget-item .content.accounts-expense-weight {
-  .legend {
-    text-align: left;
-    max-height: 115px;
-
-    .title {
-      text-align: center;
-      border-bottom: dashed 1px @impac-widget-borders-color;
-    }
-  }
-}
-.analytics .widget-item .content.accounts-expenses-revenue {
-  .legend {
-    font-weight: bold;
-  }
-
-  .settings.params-checkboxes {
-    margin-left: 0px;
-    margin-top: 15px;
-    text-align: center;
-  }
-}
-.analytics .widget-item .content.accounts-payable-receivable {
-  h3 {
-    text-align: center;
-  }
-  .legend {
-    font-weight: bold;
-  }
-  .payable {
-    margin-top: 15px;
-  }
-  .price {
-    .center-bold(0px);
-  }
-}
-.analytics .widget-item .content.accounts-profit-and-loss {
-  .drill-down-widget();
-
-  .row.widget-line.total.profit {
-    border-top: solid 1px;
-    border-bottom: double;
-  }
-}
-.analytics .widget-item .content.hr-employee-details {
-  font-size: 12px;
-  .details-container {
-    padding: 0px;
-    max-height: 200px;
-    .scrollable();
-  }
-  pre {
-    font-size: 12px;
-    padding: 0px;
-    margin: 1px 0px 8px 0px;
-    border: none;
-  }
-  .right-panel {
-    .details-container {
-      max-height: 208px;
-    }
-    .legend {
-      margin-bottom: 5px;
-    }
-  }
-  .title {
-    text-align: center;
-    margin-bottom: 10px;
-    font-size: 14px;
-  }
-}
-.analytics .widget-item .content.hr-employees-list {
-  .legend {
-    margin-bottom: 9px;
-  }
-  .widget-lines-container {
-    text-align: center;
-    .widget-line {
-      .alternate-bg();
-    }
-  }
-  .edit {
-    .widget-lines-container {
-      text-align: left;
-    }
-  }
-}
-.analytics .widget-item .content.hr-leaves-balance{
-  .employee-name {
-    text-align: center;
-  }
-  .balance {
-    .center-bold(0px);
-  }
-  h3 {
-    margin-top: 33px;
-    text-align: center;
-  }
-}
-.analytics .widget-item .content.hr-leaves-schedule{
-  .fc-button {
-    height: 22px;
-    font-size: 12px;
-    color: @impac-widget-buttons-color;
-    background: white;
-    outline: none;
-    &:hover {
-      color: white;
-      background: @impac-widget-buttons-color;
-    }
-  }
-  .fc-toolbar {
-    margin-bottom: 5px;
-  }
-  .fc-day-grid,.fc-widget-header {
-    font-size: 12px;
-    color: @impac-widget-text-color;
-  }
-}
-.analytics .widget-item .content.hr-payroll-summary {
-  .drill-down-widget();
-  .right-panel .widget-lines-container {
-      max-height: 175px;
-  }
-  .no-element p {
-    // corrects alignment issues with the container, which caused text to overflow beyond parents.
-    max-width: 90% !important;
-    margin: auto !important;
-  }
-}
-
-.analytics .widget-item .content.hr-payroll-taxes {
-  // Nothing special yet for this template
-}
-.analytics .widget-item .content.hr-salaries-summary {
-  .expandable-filterable-widget();
-}
-.analytics .widget-item .content.hr-superannuation-accruals {
-  h3 {
-    margin-top: 63px;
-    text-align: center;
-  }
-  .legend {
-    margin-top: 23px;
-  }
-  .currency {
-    font-size: 14px;
-  }
-  .price {
-    .center-bold(0px);
-  }
-}
-.analytics .widget-item .content.hr-timesheets {
-  .currency {
-    font-size: 14px;
-  }
-  .widget-lines-container {
-    max-height: 210px;
-  }
-}
-.analytics .widget-item .content.hr-workforce-summary {
-  .expandable-filterable-widget();
-}
-.analytics .widget-item .content.invoices-aged-payables-receivables {
-  .drill-down-widget();
-
-  .astericks-info {
-    text-align: left;
-    padding-left: 15px;
-  }
-}
-
-.analytics .widget-item .content.invoices-list {
-  .simple-list-widget();
-}
-.analytics .widget-item .content.invoices-summary {
-  .simple-summary-widget();
-}
-.analytics .widget-item .content.sales-aged {
-  .tall-widget();
-
-  .widget-lines-container {
-    max-height: 260px;
-  }
-}
-.analytics .widget-item .content.sales-break-even {
-  .price {
-    .center-bold(0px);
-  }
-  .block {
-    margin: 5px;
-    padding: 0px 10px 5px 10px;
-    text-align: left;
-    box-shadow: 0px 7px 10px -7px #17262d;
-    font-size: 12px;
-    form.editable-wrap .editable-controls input {
-      margin-top: 5px;
-      width: 100px;
-    }
-    &.to-date {
-      background-color: @impac-widget-sub-bg-color;
-      color: @impac-widget-text-color;
-    }
-    &.to-breakeven {
-      margin-top: 10px;
-      background-color: @impac-widget-sales-break-even-bg;
-      color: @impac-widget-sales-break-even-text-color;
-      .title {
-        border-bottom: solid 1px lighten(@impac-widget-sales-break-even-bg, 10%);
-      }
-      .define-text {
-        .center-thin();
-        padding-top: 5px;
-        color: @impac-widget-sales-break-even-text-color;
-      }
-      .price {
-        color: @impac-widget-sales-break-even-text-color;
-      }
-    }
-
-    .title {
-      font-size: 13px;
-      text-align: center;
-      font-variant: small-caps;
-      border-bottom: solid 1px @lightgray;
-      font-weight: 300;
-    }
-  }
-}
-.analytics .widget-item .content.sales-comparison {
-  .drill-down-widget();
-  .right-panel .widget-lines-container {
-    max-height: 270px;
-  }
-}
-.analytics .widget-item .content.sales-customer-details {
-  .loader {
-    font-size: 14px;
-  }
-  font-size: 12px;
-  .details-container {
-    padding: 0px;
-    max-height: 200px;
-    overflow-y: auto;
-    overflow-x: hidden;
-  }
-  .right-panel {
-    .details-container {
-      max-height: 208px;
-    }
-    .legend {
-      margin-bottom: 5px;
-    }
-  }
-  .title {
-    text-align: center;
-    margin-bottom: 10px;
-    font-size: 14px;
-  }
-}
-.analytics .widget-item .content.sales-cycle {
-  .simple-summary-widget();
-}
-.analytics .widget-item .content.sales-forecast {
-  .tall-widget();
-  .widget-lines-container .widget-line.main {
-    .selectable();
-  }
-}
-.analytics .widget-item .content.sales-growth {
-  .price {
-    .center-bold(0px);
-  }
-  .legend {
-    max-height: 49px;
-    font-size: 14px;
-  }
-}
-.analytics .widget-item .content.sales-leads-funnel {
-  .funnel-widget();
-}
-
-.analytics .widget-item .content.sales-leads-list {
-  .simple-list-widget();
-  .widget-lines-container {
-    .scrollable(scroll);
-  }
-}
-.analytics .widget-item .content.sales-list {
-  .simple-list-widget();
-  .widget-lines-container {
-    .scrollable(scroll);
-    max-height: 210px;
-  }
-  .selector {
-    margin-bottom: 4px;
-  }
-}
-.analytics .widget-item .content.sales-margin {
-  // Nothing special yet for this template
-}
-.analytics .widget-item .content.sales-number-of-leads {
-  .stats {
-    margin-top: 35px;
-    font-size: 18px;
-    .stat {
-      margin: 15px 0px 10px 0px;
-      border-bottom: solid 1px @lightgray;
-      span.title {
-        font-weight: bold;
-      }
-      span.nominal {
-        float: right;
-        text-align: right;
-        font-weight: 300;
-      }
-      span.variation {
-        float: right;
-        width: 50px;
-        text-align: right;
-        font-style: italic;
-        font-size: 14px;
-        font-weight: 300;
-        margin-top: 2px;
-      }
-    }
-  }
-}
-.analytics .widget-item .content.sales-opportunities-funnel {
-  .funnel-widget();
-}
-
-.analytics .widget-item .content.sales-performance {
-  .drill-down-widget();
-  .right-panel > .widget-lines-container {
-    max-height: 215px;
-  }
-  // .simple-list-widget();
-  // .widget-lines-container {
-  //   .scrollable(scroll);
-  //   max-height: 210px;
-  //   .widget-line.total {
-  //     .selectable();
-  //   }
-  // }
-  // .selector {
-  //   margin-bottom: 4px;
-  // }
-}
-.analytics .widget-item .content.sales-segmented-turnover {
-  h3.right {
-    margin-top: 55px;
-    text-align: center;
-  }
-  .selector {
-    margin-bottom: 10px;
-  }
-  .analysis {
-    .center-bold(0px);
-  }
-  .widget-lines-container {
-    max-height: 75px;
-    .widget-line {
-      font-size: 11px;
-    }
-  }
-}
-.analytics .widget-item .content.sales-summary {
-  .simple-summary-widget();
-  .selector {
-    margin-bottom: 5px;
-  }
-}
-.analytics .widget-item .content.sales-top-opportunities {
-  .opps-container {
-    max-height: 195px;
-    margin-top: 10px;
-    padding-right: 10px;
-    .scrollable();
-    .tile {
-      height: 40px;
-      font-size: 13px;
-      font-weight: 300;
-      .colored-area {
-        width: 10%;
-        text-align: center;
-        font-size: 20px;
-      }
-      .main-text {
-        color: @impac-widget-text-color;
-        padding: 3px 0px 0px 10px;
-      }
-      &.first {
-        height: 55px;
-        font-size: 15px;
-        font-weight: bold;
-        .colored-area {
-          font-size: 26px;
-          padding-top: 10px;
-          background-color: rgb(255, 110, 65);
-        }
-        .main-text {
-          padding-top: 8px;
-        }
-      }
-      &.second {
-        height: 55px;
-        font-size: 15px;
-        font-weight: 500;
-        .colored-area {
-          font-size: 26px;
-          padding-top: 10px;
-          background-color: #1de9b6;
-        }
-        .main-text {
-          padding-top: 8px;
-        }
-      }
-    }
-  }
-}
-.analytics .widget-item .content .settings.select-account {
-  padding: 0px 5px;
-}
-.analytics .widget-item .content .settings.chart-filters {
-  .row {
-    margin: 0px;
-  }
-  input[type="radio"] {
-    margin: 0;
-    margin-right: 3px;
-    padding: 0;
-    width: 13px;
-    height: 13px;
-    vertical-align: middle;
-    position: relative;
-    top: -1px;
-    outline: none;
-  }
-  input[type="range"] {
-    height: 20px;
-  }
-}
-.analytics .settings.dates-picker {
-  h5 { display: none; }
-
-  .buttons {
-    margin-left: 5px;
-    button.btn.btn-sm {
-      line-height: 1;
-      &.btn-danger {
-        display: none;
-      }
-      &.btn-info {
-        border-radius: 3px;
-      }
-    }
-  }
-
-  .tooltip-inner {
-    text-transform: none;
-  }
-}
-
-.analytics .widget-item .content .settings.hist-mode-choser {
-  .options {
-    width: 150px;
-    margin: auto;
-    padding-bottom: 8px;
-    border-bottom: solid 1px #e6e6e6;
-    .font(@impac-widget-hist-text-size,500,@impac-widget-hist-text-color);
-    a {
-      .font(@impac-widget-hist-text-size,500,@impac-widget-hist-text-color);
-      text-transform: @impac-widget-hist-text-transform;
-      &.active {
-        color: @impac-widget-link-color;
-      }
-    }
-  }
-  .arrow-container {
-    width: 28px;
-    height: 28px;
-    position: relative;
-    top: -14px;
-    margin: auto;
-    &.right {
-      left: 30px;
-    }
-    &.left {
-      left: -30px;
-    }
-    .arrow-border {
-      border-top: 14px solid #e6e6e6;
-      border-left: 14px solid transparent;
-      border-right: 14px solid transparent;
-      width: 0px;
-      height: 0px;
-    }
-    .arrow {
-      border-top: 14px solid @impac-widget-background-color;
-      border-left: 14px solid transparent;
-      border-right: 14px solid transparent;
-      position: relative;
-      top: 12px;
-      width: 0px;
-      height: 0px;
-    }
-  }
-}
-.analytics .settings.limit-entries {
-  color: @impac-widget-limit-entries-color;
-  text-transform: uppercase;
-  text-align: center;
-  border-bottom: dashed 1px #E6E6E6;
-  padding-bottom: 8px;
-
-  a.option {
-    &.badge {
-      color: white;
-      background-color: @impac-widget-limit-entries-color;
-    }
-  }
-
-}
-
-.analytics .settings.organizations {
-  .widget-lines-container {
-    .widget-line {
-      padding: 5px 10px 5px 18px;
-      .alternate-bg(#f3f4f4);
-      .fa {
-        float: right;
-        font-size: 20px;
-        cursor: pointer;
-        &.fa-toggle-on {
-          color: @impac-widget-link-color;
-        }
-        &.fa-toggle-off {
-          color: @impac-widget-text-color-medium;
-        }
-      }
-    }
-  }
-}
-.analytics .widget-item .content .settings.param-selector {
-  display: inline-block;
-  a {
-    font-weight: normal;
-    color: @impac-widget-param-selector-color;
-    white-space: nowrap;
-  }
-  .options-container {
-    position: absolute;
-    background-color: white;
-    text-align: left;
-    min-width: 150px;
-    max-height: 200px;
-    z-index: 999;
-    overflow-y: auto;
-    overflow-x: hidden;
-    .box-shadow(rgb(0, 0, 0) 0px 3px 15px -3px);
-
-    div {
-      padding: 3px 5px;
-    }
-    div:hover {
-      cursor: pointer;
-      background-color: @impac-widget-param-selector-color;
-      color: white;
-    }
-
-    &::-webkit-scrollbar {
-      width: 8px;
-      background-color: darken(@lightgray,5%);
-    }
-
-    &::-webkit-scrollbar-thumb {
-      background-color: @impac-widget-param-selector-color;
-      &:hover {
-        background-color: lighten(@impac-widget-param-selector-color,5%);
-      }
-    }
-  }
-}
-.analytics .settings.params-checkboxes {
-  padding: 2px 0px;
-  input {
-    height: inherit;
-  }
-  span {
-    margin-left: 5px;
-  }
-}
-.analytics .widget-item .content .settings.params-picker {
-  padding: 0px 10px;
-  .parameter {
-    margin: 0px 3px 3px 0px;
-    padding: 3px 5px;
-    background-color: @impac-widget-params-picker-bg;
-    color: white;
-    border: solid 1px @impac-widget-params-picker-bg;
-    border-radius: 4px;
-    cursor: move;
-    font-weight: bold;
-    white-space: nowrap;
-    float: left;
-    input[type="checkbox"] {
-      margin: 0px -3px 0px 3px;
-      vertical-align: middle;
-      height: inherit;
-      outline: none;
-      cursor: pointer;
-    }
-    .badge {
-      margin-right: 3px;
-      font-size: 10px;
-      background-color: darken(@impac-widget-background-color, 5%);
-      color: @impac-widget-params-picker-bg;
-      padding: 2px 6px;
-    }
-
-    &.unchecked {
-      background-color: inherit;
-      font-weight: normal;
-      color: inherit;
-      border-color: @impac-widget-params-picker-unchecked-bg;
-      .badge {
-        background-color: @impac-widget-params-picker-unchecked-bg;
-        color: white;
-      }
-    }
-  }
-}
-.analytics .widget-item .content .settings.time-range {
-  padding: 0px 5px;
-}
-.analytics .widget-item .content .settings.width {
-  float: right;
-  font-size: 14px;
-  i {
-    color: silver;
-    cursor: pointer;
-    &.reduce {
-      margin-right: -10px;
-    }
-    &.expand {
-      margin-right: -3px;
-    }
-  }
-}