/*! normalize.scss v0.1.0 | MIT License | based on git.io/normalize */
/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

html {
  font-family: sans-serif;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

* {
  box-sizing: border-box;
  background-repeat: no-repeat;
}

ul, li, h2 {
  margin: 0;
  padding: 0;
  list-style: none;
}

body {
  font-family: "Open Sans", sans-serif;
  font-size: 100%;
  color: #363545;
  height: 100%;
}

/**
 * Remove default margin.
 */
body {
  margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */
/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
  display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */
audio,
canvas,
progress,
video {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22.
 */
[hidden],
template {
  display: none;
}

/* Links
   ========================================================================== */
/**
 * Remove the gray background color from active links in IE 10.
 */
a {
  background-color: transparent;
}

/**
 * Improve readability when focused and also mouse hovered in all browsers.
 */
a:active,
a:hover {
  outline: 0;
}

/* Text-level semantics
   ========================================================================== */
/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */
abbr[title] {
  border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */
b,
strong {
  font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */
dfn {
  font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */
mark {
  background: #ff0;
  color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* Embedded content
   ========================================================================== */
/**
 * Remove border when inside `a` element in IE 8/9/10.
 */
img {
  border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */
/**
 * Address margin not present in IE 8/9 and Safari.
 */
figure {
  margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */
hr {
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
}

/**
 * Contain overflow in all browsers.
 */
pre {
  overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

/* Forms
   ========================================================================== */
/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */
/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */
button,
input,
optgroup,
select,
textarea {
  color: inherit;
  /* 1 */
  font: inherit;
  /* 2 */
  margin: 0;
  /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */
button {
  overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */
button,
select {
  text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */
button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */
button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */
input {
  line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */
input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome
 *    (include `-moz` to future-proof).
 */
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box;
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */
fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */
textarea {
  overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */
optgroup {
  font-weight: bold;
}

/* Tables
   ========================================================================== */
/**
 * Remove most spacing between table cells.
 */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/*
List view

List view from trimble css

Markup:
<div class="card-wrapper list">
  <div class="col s12 m3 l2">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/girl.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/8.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/1.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/2.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/3.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
<div class="profile-card-container">
        <div class="avatar-wrapper">
            <div class="card-avatar">
                <img src="../src/images/4.png" alt="">
            </div>
        </div>
        <div><h4>Raman Babu</h4></div>
        <div><p class="link">raman_babu@trimble.com</p></div>
        <div><p>Trimble</p></div>
        <div class="profile-card-footer">
                <div class="profile-card-role">
                    <p>Admin</p>
                </div>
                <div class="profile-card-edit">
                    <ul>
                        <li class="dropdown-pane-container">
                            <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                            <div class="dropdown-pane">
                                <ul class="dropdown-list">
                                    <li>FORCE LOGOFF</li>
                                    <li>Remove</li>
                                    <li>Suspend</li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
        </div>
    </div>
  </div>
</div>

Styleguide Grid view
*/
/*
Grid view

Grid view from trimble css

Markup:
<div class="row tile profile">
  <div class="col s12 m3 l2">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/girl.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/8.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/1.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/2.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
      <div class="profile-card-container">
              <div class="avatar-wrapper">
                  <div class="card-avatar">
                      <img src="../src/images/3.png" alt="">
                  </div>
              </div>
              <div><h4>Raman Babu</h4></div>
              <div><p class="link">raman_babu@trimble.com</p></div>
              <div><p>Trimble</p></div>
              <div class="profile-card-footer">
                      <div class="profile-card-role">
                          <p>Admin</p>
                      </div>
                      <div class="profile-card-edit">
                          <ul>
                              <li class="dropdown-pane-container">
                                  <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                                  <div class="dropdown-pane">
                                      <ul class="dropdown-list">
                                          <li>FORCE LOGOFF</li>
                                          <li>Remove</li>
                                          <li>Suspend</li>
                                      </ul>
                                  </div>
                              </li>
                          </ul>
                      </div>
              </div>
          </div>
  </div>
  <div class="col s12 m3 l2 xs12">
<div class="profile-card-container">
        <div class="avatar-wrapper">
            <div class="card-avatar">
                <img src="../src/images/4.png" alt="">
            </div>
        </div>
        <div><h4>Raman Babu</h4></div>
        <div><p class="link">raman_babu@trimble.com</p></div>
        <div><p>Trimble</p></div>
        <div class="profile-card-footer">
                <div class="profile-card-role">
                    <p>Admin</p>
                </div>
                <div class="profile-card-edit">
                    <ul>
                        <li class="dropdown-pane-container">
                            <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                            <div class="dropdown-pane">
                                <ul class="dropdown-list">
                                    <li>FORCE LOGOFF</li>
                                    <li>Remove</li>
                                    <li>Suspend</li>
                                </ul>
                            </div>
                        </li>
                    </ul>
                </div>
        </div>
    </div>
  </div>
</div>

Styleguide List view
*/
.container {
  margin: 0 auto;
  max-width: 1280px;
  width: 90%;
}

@media only screen and (min-width: 601px) {
  .container {
    width: 85%;
  }
}

@media only screen and (min-width: 993px) {
  .container {
    width: 70%;
  }
}

.col .row {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}

.section {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.section.no-pad {
  padding: 0;
}

.section.no-pad-bot {
  padding-bottom: 0;
}

.section.no-pad-top {
  padding-top: 0;
}

.row {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0.75rem;
}

.row.no-margin {
  margin-bottom: 0;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

.row .col {
  float: left;
  box-sizing: border-box;
  padding: 0 0.75rem;
  min-height: 1px;
}

.row .col[class*="push-"], .row .col[class*="pull-"] {
  position: relative;
}

.row .col.s1 {
  width: 8.33333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s2 {
  width: 16.66667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s3 {
  width: 25%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s4 {
  width: 33.33333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s5 {
  width: 41.66667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s6 {
  width: 50%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s7 {
  width: 58.33333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s8 {
  width: 66.66667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s9 {
  width: 75%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s10 {
  width: 83.33333%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s11 {
  width: 91.66667%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.s12 {
  width: 100%;
  margin-left: auto;
  left: auto;
  right: auto;
}

.row .col.offset-s1 {
  margin-left: 8.33333%;
}

.row .col.pull-s1 {
  right: 8.33333%;
}

.row .col.push-s1 {
  left: 8.33333%;
}

.row .col.offset-s2 {
  margin-left: 16.66667%;
}

.row .col.pull-s2 {
  right: 16.66667%;
}

.row .col.push-s2 {
  left: 16.66667%;
}

.row .col.offset-s3 {
  margin-left: 25%;
}

.row .col.pull-s3 {
  right: 25%;
}

.row .col.push-s3 {
  left: 25%;
}

.row .col.offset-s4 {
  margin-left: 33.33333%;
}

.row .col.pull-s4 {
  right: 33.33333%;
}

.row .col.push-s4 {
  left: 33.33333%;
}

.row .col.offset-s5 {
  margin-left: 41.66667%;
}

.row .col.pull-s5 {
  right: 41.66667%;
}

.row .col.push-s5 {
  left: 41.66667%;
}

.row .col.offset-s6 {
  margin-left: 50%;
}

.row .col.pull-s6 {
  right: 50%;
}

.row .col.push-s6 {
  left: 50%;
}

.row .col.offset-s7 {
  margin-left: 58.33333%;
}

.row .col.pull-s7 {
  right: 58.33333%;
}

.row .col.push-s7 {
  left: 58.33333%;
}

.row .col.offset-s8 {
  margin-left: 66.66667%;
}

.row .col.pull-s8 {
  right: 66.66667%;
}

.row .col.push-s8 {
  left: 66.66667%;
}

.row .col.offset-s9 {
  margin-left: 75%;
}

.row .col.pull-s9 {
  right: 75%;
}

.row .col.push-s9 {
  left: 75%;
}

.row .col.offset-s10 {
  margin-left: 83.33333%;
}

.row .col.pull-s10 {
  right: 83.33333%;
}

.row .col.push-s10 {
  left: 83.33333%;
}

.row .col.offset-s11 {
  margin-left: 91.66667%;
}

.row .col.pull-s11 {
  right: 91.66667%;
}

.row .col.push-s11 {
  left: 91.66667%;
}

.row .col.offset-s12 {
  margin-left: 100%;
}

.row .col.pull-s12 {
  right: 100%;
}

.row .col.push-s12 {
  left: 100%;
}

@media only screen and (min-width: 601px) {
  .row .col.m1 {
    width: 8.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m2 {
    width: 16.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m4 {
    width: 33.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m5 {
    width: 41.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m7 {
    width: 58.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m8 {
    width: 66.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m10 {
    width: 83.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m11 {
    width: 91.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.m12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.offset-m1 {
    margin-left: 8.33333%;
  }
  .row .col.pull-m1 {
    right: 8.33333%;
  }
  .row .col.push-m1 {
    left: 8.33333%;
  }
  .row .col.offset-m2 {
    margin-left: 16.66667%;
  }
  .row .col.pull-m2 {
    right: 16.66667%;
  }
  .row .col.push-m2 {
    left: 16.66667%;
  }
  .row .col.offset-m3 {
    margin-left: 25%;
  }
  .row .col.pull-m3 {
    right: 25%;
  }
  .row .col.push-m3 {
    left: 25%;
  }
  .row .col.offset-m4 {
    margin-left: 33.33333%;
  }
  .row .col.pull-m4 {
    right: 33.33333%;
  }
  .row .col.push-m4 {
    left: 33.33333%;
  }
  .row .col.offset-m5 {
    margin-left: 41.66667%;
  }
  .row .col.pull-m5 {
    right: 41.66667%;
  }
  .row .col.push-m5 {
    left: 41.66667%;
  }
  .row .col.offset-m6 {
    margin-left: 50%;
  }
  .row .col.pull-m6 {
    right: 50%;
  }
  .row .col.push-m6 {
    left: 50%;
  }
  .row .col.offset-m7 {
    margin-left: 58.33333%;
  }
  .row .col.pull-m7 {
    right: 58.33333%;
  }
  .row .col.push-m7 {
    left: 58.33333%;
  }
  .row .col.offset-m8 {
    margin-left: 66.66667%;
  }
  .row .col.pull-m8 {
    right: 66.66667%;
  }
  .row .col.push-m8 {
    left: 66.66667%;
  }
  .row .col.offset-m9 {
    margin-left: 75%;
  }
  .row .col.pull-m9 {
    right: 75%;
  }
  .row .col.push-m9 {
    left: 75%;
  }
  .row .col.offset-m10 {
    margin-left: 83.33333%;
  }
  .row .col.pull-m10 {
    right: 83.33333%;
  }
  .row .col.push-m10 {
    left: 83.33333%;
  }
  .row .col.offset-m11 {
    margin-left: 91.66667%;
  }
  .row .col.pull-m11 {
    right: 91.66667%;
  }
  .row .col.push-m11 {
    left: 91.66667%;
  }
  .row .col.offset-m12 {
    margin-left: 100%;
  }
  .row .col.pull-m12 {
    right: 100%;
  }
  .row .col.push-m12 {
    left: 100%;
  }
}

@media only screen and (min-width: 993px) {
  .row .col.l1 {
    width: 8.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l2 {
    width: 16.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l4 {
    width: 33.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l5 {
    width: 41.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l7 {
    width: 58.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l8 {
    width: 66.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l10 {
    width: 83.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l11 {
    width: 91.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.l12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.offset-l1 {
    margin-left: 8.33333%;
  }
  .row .col.pull-l1 {
    right: 8.33333%;
  }
  .row .col.push-l1 {
    left: 8.33333%;
  }
  .row .col.offset-l2 {
    margin-left: 16.66667%;
  }
  .row .col.pull-l2 {
    right: 16.66667%;
  }
  .row .col.push-l2 {
    left: 16.66667%;
  }
  .row .col.offset-l3 {
    margin-left: 25%;
  }
  .row .col.pull-l3 {
    right: 25%;
  }
  .row .col.push-l3 {
    left: 25%;
  }
  .row .col.offset-l4 {
    margin-left: 33.33333%;
  }
  .row .col.pull-l4 {
    right: 33.33333%;
  }
  .row .col.push-l4 {
    left: 33.33333%;
  }
  .row .col.offset-l5 {
    margin-left: 41.66667%;
  }
  .row .col.pull-l5 {
    right: 41.66667%;
  }
  .row .col.push-l5 {
    left: 41.66667%;
  }
  .row .col.offset-l6 {
    margin-left: 50%;
  }
  .row .col.pull-l6 {
    right: 50%;
  }
  .row .col.push-l6 {
    left: 50%;
  }
  .row .col.offset-l7 {
    margin-left: 58.33333%;
  }
  .row .col.pull-l7 {
    right: 58.33333%;
  }
  .row .col.push-l7 {
    left: 58.33333%;
  }
  .row .col.offset-l8 {
    margin-left: 66.66667%;
  }
  .row .col.pull-l8 {
    right: 66.66667%;
  }
  .row .col.push-l8 {
    left: 66.66667%;
  }
  .row .col.offset-l9 {
    margin-left: 75%;
  }
  .row .col.pull-l9 {
    right: 75%;
  }
  .row .col.push-l9 {
    left: 75%;
  }
  .row .col.offset-l10 {
    margin-left: 83.33333%;
  }
  .row .col.pull-l10 {
    right: 83.33333%;
  }
  .row .col.push-l10 {
    left: 83.33333%;
  }
  .row .col.offset-l11 {
    margin-left: 91.66667%;
  }
  .row .col.pull-l11 {
    right: 91.66667%;
  }
  .row .col.push-l11 {
    left: 91.66667%;
  }
  .row .col.offset-l12 {
    margin-left: 100%;
  }
  .row .col.pull-l12 {
    right: 100%;
  }
  .row .col.push-l12 {
    left: 100%;
  }
}

@media only screen and (min-width: 1201px) {
  .row .col.xl1 {
    width: 8.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl2 {
    width: 16.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl3 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl4 {
    width: 33.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl5 {
    width: 41.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl6 {
    width: 50%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl7 {
    width: 58.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl8 {
    width: 66.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl9 {
    width: 75%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl10 {
    width: 83.33333%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl11 {
    width: 91.66667%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.xl12 {
    width: 100%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
  .row .col.offset-xl1 {
    margin-left: 8.33333%;
  }
  .row .col.pull-xl1 {
    right: 8.33333%;
  }
  .row .col.push-xl1 {
    left: 8.33333%;
  }
  .row .col.offset-xl2 {
    margin-left: 16.66667%;
  }
  .row .col.pull-xl2 {
    right: 16.66667%;
  }
  .row .col.push-xl2 {
    left: 16.66667%;
  }
  .row .col.offset-xl3 {
    margin-left: 25%;
  }
  .row .col.pull-xl3 {
    right: 25%;
  }
  .row .col.push-xl3 {
    left: 25%;
  }
  .row .col.offset-xl4 {
    margin-left: 33.33333%;
  }
  .row .col.pull-xl4 {
    right: 33.33333%;
  }
  .row .col.push-xl4 {
    left: 33.33333%;
  }
  .row .col.offset-xl5 {
    margin-left: 41.66667%;
  }
  .row .col.pull-xl5 {
    right: 41.66667%;
  }
  .row .col.push-xl5 {
    left: 41.66667%;
  }
  .row .col.offset-xl6 {
    margin-left: 50%;
  }
  .row .col.pull-xl6 {
    right: 50%;
  }
  .row .col.push-xl6 {
    left: 50%;
  }
  .row .col.offset-xl7 {
    margin-left: 58.33333%;
  }
  .row .col.pull-xl7 {
    right: 58.33333%;
  }
  .row .col.push-xl7 {
    left: 58.33333%;
  }
  .row .col.offset-xl8 {
    margin-left: 66.66667%;
  }
  .row .col.pull-xl8 {
    right: 66.66667%;
  }
  .row .col.push-xl8 {
    left: 66.66667%;
  }
  .row .col.offset-xl9 {
    margin-left: 75%;
  }
  .row .col.pull-xl9 {
    right: 75%;
  }
  .row .col.push-xl9 {
    left: 75%;
  }
  .row .col.offset-xl10 {
    margin-left: 83.33333%;
  }
  .row .col.pull-xl10 {
    right: 83.33333%;
  }
  .row .col.push-xl10 {
    left: 83.33333%;
  }
  .row .col.offset-xl11 {
    margin-left: 91.66667%;
  }
  .row .col.pull-xl11 {
    right: 91.66667%;
  }
  .row .col.push-xl11 {
    left: 91.66667%;
  }
  .row .col.offset-xl12 {
    margin-left: 100%;
  }
  .row .col.pull-xl12 {
    right: 100%;
  }
  .row .col.push-xl12 {
    left: 100%;
  }
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.i24 {
  width: 24px;
  height: 24px;
}

.i48 {
  width: 48px;
  height: 48px;
}

.i96 {
  width: 96px;
  height: 96px;
}

.i16 {
  width: 16px;
  height: 16px;
}

.i18 {
  width: 18px;
  height: 18px;
}

.i32 {
  width: 32px;
  height: 32px;
}

.i64 {
  width: 64px;
  height: 64px;
}

.i24, .i48, .i96, .i16, .i32, .i64 {
  display: inline-block;
}

.icon_line_accuracy_24, .icon_line_accuracy.i24, .icon_line_accuracy.i48, .icon_line_accuracy.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_accuracy_24-48-96.svg");
}

.icon_line_accuracy_24, .icon_line_accuracy.i24, .icon_line_accuracy.i48, .icon_line_accuracy.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_accuracy_24-48-96.svg");
}

.icon_line_angle_24, .icon_line_angle.i24, .icon_line_angle.i48, .icon_line_angle.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_angle_24-48-96.svg");
}

.icon_line_arrow_down_24, .icon_line_arrow_down.i24, .icon_line_arrow_down.i48, .icon_line_arrow_down.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_arrow_down_24-48-96.svg");
}

.icon_line_arrow_up_24, .icon_line_arrow_up.i24, .icon_line_arrow_up.i48, .icon_line_arrow_up.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_arrow_up_24-48-96.svg");
}

.icon_line_assistance_24, .icon_line_assistance.i24, .icon_line_assistance.i48, .icon_line_assistance.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_assistance_24-48-96.svg");
}

.icon_line_asterisk_24, .icon_line_asterisk.i24, .icon_line_asterisk.i48, .icon_line_asterisk.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_asterisk_24-48-96.svg");
}

.icon_line_barcode_24, .icon_line_barcode.i24, .icon_line_barcode.i48, .icon_line_barcode.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_barcode_24-48-96.svg");
}

.icon_line_b_24, .icon_line_b.i24, .icon_line_b.i48, .icon_line_b.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_b_24-48-96.svg");
}

.icon_line_bluetooth_24, .icon_line_bluetooth.i24, .icon_line_bluetooth.i48, .icon_line_bluetooth.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_bluetooth_24-48-96.svg");
}

.icon_line_bluetooth_active_24, .icon_line_bluetooth_active.i24, .icon_line_bluetooth_active.i48, .icon_line_bluetooth_active.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_bluetooth_active_24-48-96.svg");
}

.icon_line_camera_24, .icon_line_camera.i24, .icon_line_camera.i48, .icon_line_camera.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_camera_24-48-96.svg");
}

.icon_line_cancel_24, .icon_line_cancel.i24, .icon_line_cancel.i48, .icon_line_cancel.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cancel_24-48-96.svg");
}

.icon_line_cart_24, .icon_line_cart.i24, .icon_line_cart.i48, .icon_line_cart.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cart_24-48-96.svg");
}

.icon_line_chevron_down_24, .icon_line_chevron_down.i24, .icon_line_chevron_down.i48, .icon_line_chevron_down.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_chevron_down_24-48-96.svg");
}

.icon_line_chevron_left_24, .icon_line_chevron_left.i24, .icon_line_chevron_left.i48, .icon_line_chevron_left.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_chevron_left_24-48-96.svg");
}

.icon_line_chevron_right_24, .icon_line_chevron_right.i24, .icon_line_chevron_right.i48, .icon_line_chevron_right.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_chevron_right_24-48-96.svg");
}

.icon_line_chevron_up_24, .icon_line_chevron_up.i24, .icon_line_chevron_up.i48, .icon_line_chevron_up.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_chevron_up_24-48-96.svg");
}

.icon_line_choice_24, .icon_line_choice.i24, .icon_line_choice.i48, .icon_line_choice.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_choice_24-48-96.svg");
}

.icon_line_choice_24, .icon_line_choice.i24, .icon_line_choice.i48, .icon_line_choice.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_choice_24-48-96.svg");
}

.icon_line_clip_24, .icon_line_clip.i24, .icon_line_clip.i48, .icon_line_clip.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_clip_24-48-96.svg");
}

.icon_line_clip_cross_24, .icon_line_clip_cross.i24, .icon_line_clip_cross.i48, .icon_line_clip_cross.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_clip_cross_24-48-96.svg");
}

.icon_line_cloud_24, .icon_line_cloud.i24, .icon_line_cloud.i48, .icon_line_cloud.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cloud_24-48-96.svg");
}

.icon_line_cloud_down_24, .icon_line_cloud_down.i24, .icon_line_cloud_down.i48, .icon_line_cloud_down.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cloud_down_24-48-96.svg");
}

.icon_line_cloud_search_24-4_24, .icon_line_cloud_search_24-4.i24, .icon_line_cloud_search_24-4.i48, .icon_line_cloud_search_24-4.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cloud_search_24-4_24-48-96.svg");
}

.icon_line_cloud_search_24, .icon_line_cloud_search.i24, .icon_line_cloud_search.i48, .icon_line_cloud_search.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cloud_search_24-48-96.svg");
}

.icon_line_cloud_sync_24, .icon_line_cloud_sync.i24, .icon_line_cloud_sync.i48, .icon_line_cloud_sync.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cloud_sync_24-48-96.svg");
}

.icon_line_cloud_updown_24, .icon_line_cloud_updown.i24, .icon_line_cloud_updown.i48, .icon_line_cloud_updown.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cloud_updown_24-48-96.svg");
}

.icon_line_cloud_up_24, .icon_line_cloud_up.i24, .icon_line_cloud_up.i48, .icon_line_cloud_up.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_cloud_up_24-48-96.svg");
}

.icon_line_column_24, .icon_line_column.i24, .icon_line_column.i48, .icon_line_column.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_column_24-48-96.svg");
}

.icon_line_comment_24, .icon_line_comment.i24, .icon_line_comment.i48, .icon_line_comment.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_comment_24-48-96.svg");
}

.icon_line_comment_add_24, .icon_line_comment_add.i24, .icon_line_comment_add.i48, .icon_line_comment_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_comment_add_24-48-96.svg");
}

.icon_line_comment_conversation_24, .icon_line_comment_conversation.i24, .icon_line_comment_conversation.i48, .icon_line_comment_conversation.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_comment_conversation_24-48-96.svg");
}

.icon_line_comment_edit_24, .icon_line_comment_edit.i24, .icon_line_comment_edit.i48, .icon_line_comment_edit.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_comment_edit_24-48-96.svg");
}

.icon_line_comment_remove_24, .icon_line_comment_remove.i24, .icon_line_comment_remove.i48, .icon_line_comment_remove.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_comment_remove_24-48-96.svg");
}

.icon_line_condition_24, .icon_line_condition.i24, .icon_line_condition.i48, .icon_line_condition.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_condition_24-48-96.svg");
}

.icon_line_correction_source_24, .icon_line_correction_source.i24, .icon_line_correction_source.i48, .icon_line_correction_source.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_correction_source_24-48-96.svg");
}

.icon_line_correction_source_24, .icon_line_correction_source.i24, .icon_line_correction_source.i48, .icon_line_correction_source.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_correction_source_24-48-96.svg");
}

.icon_line_correction_status_24, .icon_line_correction_status.i24, .icon_line_correction_status.i48, .icon_line_correction_status.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_correction_status_24-48-96.svg");
}

.icon_line_correction_status_24, .icon_line_correction_status.i24, .icon_line_correction_status.i48, .icon_line_correction_status.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_correction_status_24-48-96.svg");
}

.icon_line_date_24, .icon_line_date.i24, .icon_line_date.i48, .icon_line_date.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_date_24-48-96.svg");
}

.icon_line_date_24, .icon_line_date.i24, .icon_line_date.i48, .icon_line_date.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_date_24-48-96.svg");
}

.icon_line_date_creation_24, .icon_line_date_creation.i24, .icon_line_date_creation.i48, .icon_line_date_creation.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_date_creation_24-48-96.svg");
}

.icon_line_date_creation_24, .icon_line_date_creation.i24, .icon_line_date_creation.i48, .icon_line_date_creation.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_date_creation_24-48-96.svg");
}

.icon_line_date_creation_2_24, .icon_line_date_creation_2.i24, .icon_line_date_creation_2.i48, .icon_line_date_creation_2.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_date_creation_2_24-48-96.svg");
}

.icon_line_device_id_24, .icon_line_device_id.i24, .icon_line_device_id.i48, .icon_line_device_id.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_device_id_24-48-96.svg");
}

.icon_line_device_id_24, .icon_line_device_id.i24, .icon_line_device_id.i48, .icon_line_device_id.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_device_id_24-48-96.svg");
}

.icon_line_device_type_24, .icon_line_device_type.i24, .icon_line_device_type.i48, .icon_line_device_type.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_device_type_24-48-96.svg");
}

.icon_line_device_type_24, .icon_line_device_type.i24, .icon_line_device_type.i48, .icon_line_device_type.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_device_type_24-48-96.svg");
}

.icon_line_done_24, .icon_line_done.i24, .icon_line_done.i48, .icon_line_done.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_done_24-48-96.svg");
}

.icon_line_draft_24, .icon_line_draft.i24, .icon_line_draft.i48, .icon_line_draft.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_draft_24-48-96.svg");
}

.icon_line_draft_24, .icon_line_draft.i24, .icon_line_draft.i48, .icon_line_draft.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_draft_24-48-96.svg");
}

.icon_line_draft_template_24, .icon_line_draft_template.i24, .icon_line_draft_template.i48, .icon_line_draft_template.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_draft_template_24-48-96.svg");
}

.icon_line_edit_24, .icon_line_edit.i24, .icon_line_edit.i48, .icon_line_edit.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_edit_24-48-96.svg");
}

.icon_line_equal_24, .icon_line_equal.i24, .icon_line_equal.i48, .icon_line_equal.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_equal_24-48-96.svg");
}

.icon_line_error_condition_24, .icon_line_error_condition.i24, .icon_line_error_condition.i48, .icon_line_error_condition.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_error_condition_24-48-96.svg");
}

.icon_line_error_target_24, .icon_line_error_target.i24, .icon_line_error_target.i48, .icon_line_error_target.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_error_target_24-48-96.svg");
}

.icon_line_fieds_24, .icon_line_fieds.i24, .icon_line_fieds.i48, .icon_line_fieds.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_fieds_24-48-96.svg");
}

.icon_line_fields_24, .icon_line_fields.i24, .icon_line_fields.i48, .icon_line_fields.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_fields_24-48-96.svg");
}

.icon_line_fields_24, .icon_line_fields.i24, .icon_line_fields.i48, .icon_line_fields.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_fields_24-48-96.svg");
}

.icon_line_fields_v2_24, .icon_line_fields_v2.i24, .icon_line_fields_v2.i48, .icon_line_fields_v2.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_fields_v2_24-48-96.svg");
}

.icon_line_file_24, .icon_line_file.i24, .icon_line_file.i48, .icon_line_file.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_file_24-48-96.svg");
}

.icon_line_filter_24, .icon_line_filter.i24, .icon_line_filter.i48, .icon_line_filter.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_filter_24-48-96.svg");
}

.icon_line_folder_closed_24, .icon_line_folder_closed.i24, .icon_line_folder_closed.i48, .icon_line_folder_closed.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_folder_closed_24-48-96.svg");
}

.icon_line_folder_open_24, .icon_line_folder_open.i24, .icon_line_folder_open.i48, .icon_line_folder_open.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_folder_open_24-48-96.svg");
}

.icon_line_geometry_24, .icon_line_geometry.i24, .icon_line_geometry.i48, .icon_line_geometry.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_geometry_24-48-96.svg");
}

.icon_line_geometry_24, .icon_line_geometry.i24, .icon_line_geometry.i48, .icon_line_geometry.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_geometry_24-48-96.svg");
}

.icon_line_greaterThanEqualTo_24, .icon_line_greaterThanEqualTo.i24, .icon_line_greaterThanEqualTo.i48, .icon_line_greaterThanEqualTo.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_greaterThanEqualTo_24-48-96.svg");
}

.icon_line_greaterThan_24, .icon_line_greaterThan.i24, .icon_line_greaterThan.i48, .icon_line_greaterThan.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_greaterThan_24-48-96.svg");
}

.icon_line_group_24, .icon_line_group.i24, .icon_line_group.i48, .icon_line_group.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_group_24-48-96.svg");
}

.icon_line_group_24, .icon_line_group.i24, .icon_line_group.i48, .icon_line_group.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_group_24-48-96.svg");
}

.icon_line_hamburger_24, .icon_line_hamburger.i24, .icon_line_hamburger.i48, .icon_line_hamburger.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_hamburger_24-48-96.svg");
}

.icon_line_hdop1_24, .icon_line_hdop1.i24, .icon_line_hdop1.i48, .icon_line_hdop1.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_hdop1_24-48-96.svg");
}

.icon_line_hdop1_24, .icon_line_hdop1.i24, .icon_line_hdop1.i48, .icon_line_hdop1.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_hdop1_24-48-96.svg");
}

.icon_line_info_24, .icon_line_info.i24, .icon_line_info.i48, .icon_line_info.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_info_24-48-96.svg");
}

.icon_line_layers_24, .icon_line_layers.i24, .icon_line_layers.i48, .icon_line_layers.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_layers_24-48-96.svg");
}

.icon_line_layers_24, .icon_line_layers.i24, .icon_line_layers.i48, .icon_line_layers.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_layers_24-48-96.svg");
}

.icon_line_length_24, .icon_line_length.i24, .icon_line_length.i48, .icon_line_length.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_length_24-48-96.svg");
}

.icon_line_length_24, .icon_line_length.i24, .icon_line_length.i48, .icon_line_length.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_length_24-48-96.svg");
}

.icon_line_lessThanEqualTo_24, .icon_line_lessThanEqualTo.i24, .icon_line_lessThanEqualTo.i48, .icon_line_lessThanEqualTo.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_lessThanEqualTo_24-48-96.svg");
}

.icon_line_lessThan_24, .icon_line_lessThan.i24, .icon_line_lessThan.i48, .icon_line_lessThan.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_lessThan_24-48-96.svg");
}

.icon_line_link_24, .icon_line_link.i24, .icon_line_link.i48, .icon_line_link.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_link_24-48-96.svg");
}

.icon_line_markup_arrow_24, .icon_line_markup_arrow.i24, .icon_line_markup_arrow.i48, .icon_line_markup_arrow.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_markup_arrow_24-48-96.svg");
}

.icon_line_markup_cloud_24, .icon_line_markup_cloud.i24, .icon_line_markup_cloud.i48, .icon_line_markup_cloud.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_markup_cloud_24-48-96.svg");
}

.icon_line_markup_line_24, .icon_line_markup_line.i24, .icon_line_markup_line.i48, .icon_line_markup_line.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_markup_line_24-48-96.svg");
}

.icon_line_markup_note_24, .icon_line_markup_note.i24, .icon_line_markup_note.i48, .icon_line_markup_note.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_markup_note_24-48-96.svg");
}

.icon_line_marquee_24, .icon_line_marquee.i24, .icon_line_marquee.i48, .icon_line_marquee.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_marquee_24-48-96.svg");
}

.icon_line_measure_24, .icon_line_measure.i24, .icon_line_measure.i48, .icon_line_measure.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_measure_24-48-96.svg");
}

.icon_line_minus_24, .icon_line_minus.i24, .icon_line_minus.i48, .icon_line_minus.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_minus_24-48-96.svg");
}

.icon_line_notEqual_24, .icon_line_notEqual.i24, .icon_line_notEqual.i48, .icon_line_notEqual.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_notEqual_24-48-96.svg");
}

.icon_line_number_24, .icon_line_number.i24, .icon_line_number.i48, .icon_line_number.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_number_24-48-96.svg");
}

.icon_line_orbit_24, .icon_line_orbit.i24, .icon_line_orbit.i48, .icon_line_orbit.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_orbit_24-48-96.svg");
}

.icon_line_pagebreak_24, .icon_line_pagebreak.i24, .icon_line_pagebreak.i48, .icon_line_pagebreak.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_pagebreak_24-48-96.svg");
}

.icon_line_pagebreak_24, .icon_line_pagebreak.i24, .icon_line_pagebreak.i48, .icon_line_pagebreak.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_pagebreak_24-48-96.svg");
}

.icon_line_pdop1_24, .icon_line_pdop1.i24, .icon_line_pdop1.i48, .icon_line_pdop1.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_pdop1_24-48-96.svg");
}

.icon_line_pdop1_24, .icon_line_pdop1.i24, .icon_line_pdop1.i48, .icon_line_pdop1.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_pdop1_24-48-96.svg");
}

.icon_line_plus_24, .icon_line_plus.i24, .icon_line_plus.i48, .icon_line_plus.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_plus_24-48-96.svg");
}

.icon_line_polygon_24, .icon_line_polygon.i24, .icon_line_polygon.i48, .icon_line_polygon.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_polygon_24-48-96.svg");
}

.icon_line_positioning_24, .icon_line_positioning.i24, .icon_line_positioning.i48, .icon_line_positioning.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_positioning_24-48-96.svg");
}

.icon_line_rows_24, .icon_line_rows.i24, .icon_line_rows.i48, .icon_line_rows.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_rows_24-48-96.svg");
}

.icon_line_rules_24, .icon_line_rules.i24, .icon_line_rules.i48, .icon_line_rules.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_rules_24-48-96.svg");
}

.icon_line_rules_24, .icon_line_rules.i24, .icon_line_rules.i48, .icon_line_rules.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_rules_24-48-96.svg");
}

.icon_line_screen_maximise_24, .icon_line_screen_maximise.i24, .icon_line_screen_maximise.i48, .icon_line_screen_maximise.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_screen_maximise_24-48-96.svg");
}

.icon_line_screen_minimise_24, .icon_line_screen_minimise.i24, .icon_line_screen_minimise.i48, .icon_line_screen_minimise.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_screen_minimise_24-48-96.svg");
}

.icon_line_search_24, .icon_line_search.i24, .icon_line_search.i48, .icon_line_search.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_search_24-48-96.svg");
}

.icon_line_select-polygon_24, .icon_line_select-polygon.i24, .icon_line_select-polygon.i48, .icon_line_select-polygon.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select-polygon_24-48-96.svg");
}

.icon_line_select-polygon_add_24, .icon_line_select-polygon_add.i24, .icon_line_select-polygon_add.i48, .icon_line_select-polygon_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select-polygon_add_24-48-96.svg");
}

.icon_line_select-polygon_subtract_24, .icon_line_select-polygon_subtract.i24, .icon_line_select-polygon_subtract.i48, .icon_line_select-polygon_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select-polygon_subtract_24-48-96.svg");
}

.icon_line_select-rectangle_24, .icon_line_select-rectangle.i24, .icon_line_select-rectangle.i48, .icon_line_select-rectangle.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select-rectangle_24-48-96.svg");
}

.icon_line_select-rectangle_add_24, .icon_line_select-rectangle_add.i24, .icon_line_select-rectangle_add.i48, .icon_line_select-rectangle_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select-rectangle_add_24-48-96.svg");
}

.icon_line_select-rectangle_subtract_24, .icon_line_select-rectangle_subtract.i24, .icon_line_select-rectangle_subtract.i48, .icon_line_select-rectangle_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select-rectangle_subtract_24-48-96.svg");
}

.icon_line_select-single_24, .icon_line_select-single.i24, .icon_line_select-single.i48, .icon_line_select-single.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select-single_24-48-96.svg");
}

.icon_line_select_24, .icon_line_select.i24, .icon_line_select.i48, .icon_line_select.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_24-48-96.svg");
}

.icon_line_select_polygon_24, .icon_line_select_polygon.i24, .icon_line_select_polygon.i48, .icon_line_select_polygon.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_polygon_24-48-96.svg");
}

.icon_line_select_polygon_24, .icon_line_select_polygon.i24, .icon_line_select_polygon.i48, .icon_line_select_polygon.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_polygon_24-48-96.svg");
}

.icon_line_select_polygon_add_24, .icon_line_select_polygon_add.i24, .icon_line_select_polygon_add.i48, .icon_line_select_polygon_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_polygon_add_24-48-96.svg");
}

.icon_line_select_polygon_add_24, .icon_line_select_polygon_add.i24, .icon_line_select_polygon_add.i48, .icon_line_select_polygon_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_polygon_add_24-48-96.svg");
}

.icon_line_select_polygon_subtract_24, .icon_line_select_polygon_subtract.i24, .icon_line_select_polygon_subtract.i48, .icon_line_select_polygon_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_polygon_subtract_24-48-96.svg");
}

.icon_line_select_polygon_subtract_24, .icon_line_select_polygon_subtract.i24, .icon_line_select_polygon_subtract.i48, .icon_line_select_polygon_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_polygon_subtract_24-48-96.svg");
}

.icon_line_select_rectangle_24, .icon_line_select_rectangle.i24, .icon_line_select_rectangle.i48, .icon_line_select_rectangle.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_rectangle_24-48-96.svg");
}

.icon_line_select_rectangle_24, .icon_line_select_rectangle.i24, .icon_line_select_rectangle.i48, .icon_line_select_rectangle.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_rectangle_24-48-96.svg");
}

.icon_line_select_rectangle_add_24, .icon_line_select_rectangle_add.i24, .icon_line_select_rectangle_add.i48, .icon_line_select_rectangle_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_rectangle_add_24-48-96.svg");
}

.icon_line_select_rectangle_add_24, .icon_line_select_rectangle_add.i24, .icon_line_select_rectangle_add.i48, .icon_line_select_rectangle_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_rectangle_add_24-48-96.svg");
}

.icon_line_select_rectangle_subtract_24, .icon_line_select_rectangle_subtract.i24, .icon_line_select_rectangle_subtract.i48, .icon_line_select_rectangle_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_rectangle_subtract_24-48-96.svg");
}

.icon_line_select_rectangle_subtract_24, .icon_line_select_rectangle_subtract.i24, .icon_line_select_rectangle_subtract.i48, .icon_line_select_rectangle_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_rectangle_subtract_24-48-96.svg");
}

.icon_line_select_single_24, .icon_line_select_single.i24, .icon_line_select_single.i48, .icon_line_select_single.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_select_single_24-48-96.svg");
}

.icon_line_source_direct_24, .icon_line_source_direct.i24, .icon_line_source_direct.i48, .icon_line_source_direct.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_source_direct_24-48-96.svg");
}

.icon_line_source_ntrip_24, .icon_line_source_ntrip.i24, .icon_line_source_ntrip.i48, .icon_line_source_ntrip.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_source_ntrip_24-48-96.svg");
}

.icon_line_source_rtx_24, .icon_line_source_rtx.i24, .icon_line_source_rtx.i48, .icon_line_source_rtx.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_source_rtx_24-48-96.svg");
}

.icon_line_source_sbas_24, .icon_line_source_sbas.i24, .icon_line_source_sbas.i48, .icon_line_source_sbas.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_source_sbas_24-48-96.svg");
}

.icon_line_swapView_24, .icon_line_swapView.i24, .icon_line_swapView.i48, .icon_line_swapView.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_swapView_24-48-96.svg");
}

.icon_line_tablet_24, .icon_line_tablet.i24, .icon_line_tablet.i48, .icon_line_tablet.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_tablet_24-48-96.svg");
}

.icon_line_target_24, .icon_line_target.i24, .icon_line_target.i48, .icon_line_target.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_target_24-48-96.svg");
}

.icon_line_task_add_24, .icon_line_task_add.i24, .icon_line_task_add.i48, .icon_line_task_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_task_add_24-48-96.svg");
}

.icon_line_task_add_24, .icon_line_task_add.i24, .icon_line_task_add.i48, .icon_line_task_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_task_add_24-48-96.svg");
}

.icon_line_task_subtract_24, .icon_line_task_subtract.i24, .icon_line_task_subtract.i48, .icon_line_task_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_task_subtract_24-48-96.svg");
}

.icon_line_task_subtract_24, .icon_line_task_subtract.i24, .icon_line_task_subtract.i48, .icon_line_task_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_task_subtract_24-48-96.svg");
}

.icon_line_template_24, .icon_line_template.i24, .icon_line_template.i48, .icon_line_template.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_template_24-48-96.svg");
}

.active .icon_line_template.i24 {
  background-image: url("../images/SVGs-24scale/icon_line_template_white_24-48-96.svg");
}

.icon_line_template_24, .icon_line_template.i24, .icon_line_template.i48, .icon_line_template.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_template_24-48-96.svg");
}

.active .icon_line_template.i24 {
  background-image: url("../images/SVGs-24scale/icon_line_template_white_24-48-96.svg");
}

.icon_line_template_draft_24, .icon_line_template_draft.i24, .icon_line_template_draft.i48, .icon_line_template_draft.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_template_draft_24-48-96.svg");
}

.icon_line_text_24, .icon_line_text.i24, .icon_line_text.i48, .icon_line_text.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_text_24-48-96.svg");
}

.icon_line_thumbnail_24, .icon_line_thumbnail.i24, .icon_line_thumbnail.i48, .icon_line_thumbnail.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_thumbnail_24-48-96.svg");
}

.icon_line_tick_24, .icon_line_tick.i24, .icon_line_tick.i48, .icon_line_tick.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_tick_24-48-96.svg");
}

.active .icon_line_tick.i24 {
  background-image: url("../images/SVGs-24scale/icon_line_tick_white_24-48-96.svg");
}

.icon_line_tick_24, .icon_line_tick.i24, .icon_line_tick.i48, .icon_line_tick.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_tick_24-48-96.svg");
}

.active .icon_line_tick.i24 {
  background-image: url("../images/SVGs-24scale/icon_line_tick_white_24-48-96.svg");
}

.icon_line_tick_square_24, .icon_line_tick_square.i24, .icon_line_tick_square.i48, .icon_line_tick_square.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_tick_square_24-48-96.svg");
}

.icon_line_tick_square_24, .icon_line_tick_square.i24, .icon_line_tick_square.i48, .icon_line_tick_square.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_tick_square_24-48-96.svg");
}

.icon_line_todo_24, .icon_line_todo.i24, .icon_line_todo.i48, .icon_line_todo.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_todo_24-48-96.svg");
}

.icon_line_turn_head_24, .icon_line_turn_head.i24, .icon_line_turn_head.i48, .icon_line_turn_head.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_turn_head_24-48-96.svg");
}

.icon_line_view_fit_24, .icon_line_view_fit.i24, .icon_line_view_fit.i48, .icon_line_view_fit.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_view_fit_24-48-96.svg");
}

.icon_line_visibility_hide_24, .icon_line_visibility_hide.i24, .icon_line_visibility_hide.i48, .icon_line_visibility_hide.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_visibility_hide_24-48-96.svg");
}

.icon_line_visibility_show_24, .icon_line_visibility_show.i24, .icon_line_visibility_show.i48, .icon_line_visibility_show.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_visibility_show_24-48-96.svg");
}

.icon_line_visibility_toggle_24, .icon_line_visibility_toggle.i24, .icon_line_visibility_toggle.i48, .icon_line_visibility_toggle.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_visibility_toggle_24-48-96.svg");
}

.icon_line_walk_24, .icon_line_walk.i24, .icon_line_walk.i48, .icon_line_walk.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_walk_24-48-96.svg");
}

.icon_line_white_condition_24, .icon_line_white_condition.i24, .icon_line_white_condition.i48, .icon_line_white_condition.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_white_condition_24-48-96.svg");
}

.icon_line_white_draft_24, .icon_line_white_draft.i24, .icon_line_white_draft.i48, .icon_line_white_draft.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_white_draft_24-48-96.svg");
}

.icon_line_white_draft_template_24, .icon_line_white_draft_template.i24, .icon_line_white_draft_template.i48, .icon_line_white_draft_template.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_white_draft_template_24-48-96.svg");
}

.icon_line_white_target_24, .icon_line_white_target.i24, .icon_line_white_target.i48, .icon_line_white_target.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_white_target_24-48-96.svg");
}

.icon_line_white_template_24, .icon_line_white_template.i24, .icon_line_white_template.i48, .icon_line_white_template.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_white_template_24-48-96.svg");
}

.icon_line_white_template_draft_24, .icon_line_white_template_draft.i24, .icon_line_white_template_draft.i48, .icon_line_white_template_draft.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_white_template_draft_24-48-96.svg");
}

.icon_line_white_tick_24, .icon_line_white_tick.i24, .icon_line_white_tick.i48, .icon_line_white_tick.i96 {
  background-image: url("../images/SVGs-24scale/icon_line_white_tick_24-48-96.svg");
}

.icon_solid_alert_24, .icon_solid_alert.i24, .icon_solid_alert.i48, .icon_solid_alert.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_alert_24-48-96.svg");
}

.icon_solid_alert_critical_24, .icon_solid_alert_critical.i24, .icon_solid_alert_critical.i48, .icon_solid_alert_critical.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_alert_critical_24-48-96.svg");
}

.icon_solid_alert_info_24, .icon_solid_alert_info.i24, .icon_solid_alert_info.i48, .icon_solid_alert_info.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_alert_info_24-48-96.svg");
}

.icon_solid_alert_positive_24, .icon_solid_alert_positive.i24, .icon_solid_alert_positive.i48, .icon_solid_alert_positive.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_alert_positive_24-48-96.svg");
}

.icon_solid_alert_warning_24, .icon_solid_alert_warning.i24, .icon_solid_alert_warning.i48, .icon_solid_alert_warning.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_alert_warning_24-48-96.svg");
}

.icon_solid_assistance_24, .icon_solid_assistance.i24, .icon_solid_assistance.i48, .icon_solid_assistance.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_assistance_24-48-96.svg");
}

.icon_solid_autofields_24, .icon_solid_autofields.i24, .icon_solid_autofields.i48, .icon_solid_autofields.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_autofields_24-48-96.svg");
}

.icon_solid_camera_24, .icon_solid_camera.i24, .icon_solid_camera.i48, .icon_solid_camera.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_camera_24-48-96.svg");
}

.icon_solid_cart_24, .icon_solid_cart.i24, .icon_solid_cart.i48, .icon_solid_cart.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_cart_24-48-96.svg");
}

.icon_solid_clash_bang_critical_24, .icon_solid_clash_bang_critical.i24, .icon_solid_clash_bang_critical.i48, .icon_solid_clash_bang_critical.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_bang_critical_24-48-96.svg");
}

.icon_solid_clash_bang_gray_24, .icon_solid_clash_bang_gray.i24, .icon_solid_clash_bang_gray.i48, .icon_solid_clash_bang_gray.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_bang_gray_24-48-96.svg");
}

.icon_solid_clash_bang_positive_24_24, .icon_solid_clash_bang_positive_24.i24, .icon_solid_clash_bang_positive_24.i48, .icon_solid_clash_bang_positive_24.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_bang_positive_24_24-48-96.svg");
}

.icon_solid_clash_bang_positive_24_24, .icon_solid_clash_bang_positive_24.i24, .icon_solid_clash_bang_positive_24.i48, .icon_solid_clash_bang_positive_24.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_bang_positive_24_24-48-96.svg");
}

.icon_solid_clash_bang_warning_24, .icon_solid_clash_bang_warning.i24, .icon_solid_clash_bang_warning.i48, .icon_solid_clash_bang_warning.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_bang_warning_24-48-96.svg");
}

.icon_solid_clash_set_24, .icon_solid_clash_set.i24, .icon_solid_clash_set.i48, .icon_solid_clash_set.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_set_24-48-96.svg");
}

.icon_solid_clash_set_add_24, .icon_solid_clash_set_add.i24, .icon_solid_clash_set_add.i48, .icon_solid_clash_set_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_set_add_24-48-96.svg");
}

.icon_solid_clash_set_download_24, .icon_solid_clash_set_download.i24, .icon_solid_clash_set_download.i48, .icon_solid_clash_set_download.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_set_download_24-48-96.svg");
}

.icon_solid_clash_set_remove_24, .icon_solid_clash_set_remove.i24, .icon_solid_clash_set_remove.i48, .icon_solid_clash_set_remove.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_clash_set_remove_24-48-96.svg");
}

.icon_solid_collectedby_24, .icon_solid_collectedby.i24, .icon_solid_collectedby.i48, .icon_solid_collectedby.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_collectedby_24-48-96.svg");
}

.icon_solid_collectedby_24, .icon_solid_collectedby.i24, .icon_solid_collectedby.i48, .icon_solid_collectedby.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_collectedby_24-48-96.svg");
}

.icon_solid_comment_24, .icon_solid_comment.i24, .icon_solid_comment.i48, .icon_solid_comment.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_comment_24-48-96.svg");
}

.icon_solid_comment_add_24, .icon_solid_comment_add.i24, .icon_solid_comment_add.i48, .icon_solid_comment_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_comment_add_24-48-96.svg");
}

.icon_solid_comment_conversation_24, .icon_solid_comment_conversation.i24, .icon_solid_comment_conversation.i48, .icon_solid_comment_conversation.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_comment_conversation_24-48-96.svg");
}

.icon_solid_comment_edit_24, .icon_solid_comment_edit.i24, .icon_solid_comment_edit.i48, .icon_solid_comment_edit.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_comment_edit_24-48-96.svg");
}

.icon_solid_comment_remove_24, .icon_solid_comment_remove.i24, .icon_solid_comment_remove.i48, .icon_solid_comment_remove.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_comment_remove_24-48-96.svg");
}

.icon_solid_fields_24, .icon_solid_fields.i24, .icon_solid_fields.i48, .icon_solid_fields.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_fields_24-48-96.svg");
}

.icon_solid_filter_24, .icon_solid_filter.i24, .icon_solid_filter.i48, .icon_solid_filter.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_filter_24-48-96.svg");
}

.icon_solid_filter_24, .icon_solid_filter.i24, .icon_solid_filter.i48, .icon_solid_filter.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_filter_24-48-96.svg");
}

.icon_solid_folder_closed_24, .icon_solid_folder_closed.i24, .icon_solid_folder_closed.i48, .icon_solid_folder_closed.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_folder_closed_24-48-96.svg");
}

.icon_solid_folder_open_24, .icon_solid_folder_open.i24, .icon_solid_folder_open.i48, .icon_solid_folder_open.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_folder_open_24-48-96.svg");
}

.icon_solid_info_24, .icon_solid_info.i24, .icon_solid_info.i48, .icon_solid_info.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_info_24-48-96.svg");
}

.icon_solid_layers_24, .icon_solid_layers.i24, .icon_solid_layers.i48, .icon_solid_layers.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_layers_24-48-96.svg");
}

.icon_solid_locationservices_24, .icon_solid_locationservices.i24, .icon_solid_locationservices.i48, .icon_solid_locationservices.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_locationservices_24-48-96.svg");
}

.icon_solid_lock_24, .icon_solid_lock.i24, .icon_solid_lock.i48, .icon_solid_lock.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_lock_24-48-96.svg");
}

.icon_solid_lock_24, .icon_solid_lock.i24, .icon_solid_lock.i48, .icon_solid_lock.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_lock_24-48-96.svg");
}

.icon_solid_map_24, .icon_solid_map.i24, .icon_solid_map.i48, .icon_solid_map.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_map_24-48-96.svg");
}

.icon_solid_measure_24, .icon_solid_measure.i24, .icon_solid_measure.i48, .icon_solid_measure.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_measure_24-48-96.svg");
}

.icon_solid_menu_24, .icon_solid_menu.i24, .icon_solid_menu.i48, .icon_solid_menu.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_menu_24-48-96.svg");
}

.icon_solid_minus_24, .icon_solid_minus.i24, .icon_solid_minus.i48, .icon_solid_minus.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_minus_24-48-96.svg");
}

.icon_solid_number_24, .icon_solid_number.i24, .icon_solid_number.i48, .icon_solid_number.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_number_24-48-96.svg");
}

.icon_solid_number_24, .icon_solid_number.i24, .icon_solid_number.i48, .icon_solid_number.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_number_24-48-96.svg");
}

.icon_solid_plus_24, .icon_solid_plus.i24, .icon_solid_plus.i48, .icon_solid_plus.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_plus_24-48-96.svg");
}

.icon_solid_preferences_24, .icon_solid_preferences.i24, .icon_solid_preferences.i48, .icon_solid_preferences.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_preferences_24-48-96.svg");
}

.icon_solid_select_single_24, .icon_solid_select_single.i24, .icon_solid_select_single.i48, .icon_solid_select_single.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_select_single_24-48-96.svg");
}

.icon_solid_select_single_add_24, .icon_solid_select_single_add.i24, .icon_solid_select_single_add.i48, .icon_solid_select_single_add.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_select_single_add_24-48-96.svg");
}

.icon_solid_select_single_subtract_24, .icon_solid_select_single_subtract.i24, .icon_solid_select_single_subtract.i48, .icon_solid_select_single_subtract.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_select_single_subtract_24-48-96.svg");
}

.icon_solid_settings_24, .icon_solid_settings.i24, .icon_solid_settings.i48, .icon_solid_settings.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_settings_24-48-96.svg");
}

.icon_solid_swapView_24, .icon_solid_swapView.i24, .icon_solid_swapView.i48, .icon_solid_swapView.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_swapView_24-48-96.svg");
}

.icon_solid_text_24, .icon_solid_text.i24, .icon_solid_text.i48, .icon_solid_text.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_text_24-48-96.svg");
}

.icon_solid_text_24, .icon_solid_text.i24, .icon_solid_text.i48, .icon_solid_text.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_text_24-48-96.svg");
}

.icon_solid_todo_24, .icon_solid_todo.i24, .icon_solid_todo.i48, .icon_solid_todo.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_todo_24-48-96.svg");
}

.icon_solid_trash_24, .icon_solid_trash.i24, .icon_solid_trash.i48, .icon_solid_trash.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_trash_24-48-96.svg");
}

.icon_solid_user_24, .icon_solid_user.i24, .icon_solid_user.i48, .icon_solid_user.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_user_24-48-96.svg");
}

.icon_solid_user_group_24, .icon_solid_user_group.i24, .icon_solid_user_group.i48, .icon_solid_user_group.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_user_group_24-48-96.svg");
}

.icon_solid_white_alert_24, .icon_solid_white_alert.i24, .icon_solid_white_alert.i48, .icon_solid_white_alert.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_white_alert_24-48-96.svg");
}

.icon_solid_white_trash_24, .icon_solid_white_trash.i24, .icon_solid_white_trash.i48, .icon_solid_white_trash.i96 {
  background-image: url("../images/SVGs-24scale/icon_solid_white_trash_24-48-96.svg");
}

.vect_solid_rotat_24, .vect_solid_rotat.i24, .vect_solid_rotat.i48, .vect_solid_rotat.i96 {
  background-image: url("../images/SVGs-24scale/vect_solid_rotat_24-48-96.svg");
}

.vect_solid_rotate_24, .vect_solid_rotate.i24, .vect_solid_rotate.i48, .vect_solid_rotate.i96 {
  background-image: url("../images/SVGs-24scale/vect_solid_rotate_24-48-96.svg");
}

.icon_line_3D_component_32, .icon_line_3D_component.i16, .icon_line_3D_component.i32, .icon_line_3D_component.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_3D_component_16-32-64.svg");
}

.icon_line_3D_isometric_32, .icon_line_3D_isometric.i16, .icon_line_3D_isometric.i32, .icon_line_3D_isometric.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_3D_isometric_16-32-64.svg");
}

.icon_line_3D_left_32, .icon_line_3D_left.i16, .icon_line_3D_left.i32, .icon_line_3D_left.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_3D_left_16-32-64.svg");
}

.icon_line_3D_perspective_32, .icon_line_3D_perspective.i16, .icon_line_3D_perspective.i32, .icon_line_3D_perspective.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_3D_perspective_16-32-64.svg");
}

.icon_line_3D_right_32, .icon_line_3D_right.i16, .icon_line_3D_right.i32, .icon_line_3D_right.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_3D_right_16-32-64.svg");
}

.icon_line_3D_top_32, .icon_line_3D_top.i16, .icon_line_3D_top.i32, .icon_line_3D_top.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_3D_top_16-32-64.svg");
}

.icon_line_accuracy_32, .icon_line_accuracy.i16, .icon_line_accuracy.i32, .icon_line_accuracy.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_accuracy_16-32-64.svg");
}

.icon_line_angle_32, .icon_line_angle.i16, .icon_line_angle.i32, .icon_line_angle.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_angle_16-32-64.svg");
}

.icon_line_arrow_down_32, .icon_line_arrow_down.i16, .icon_line_arrow_down.i32, .icon_line_arrow_down.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_arrow_down_16-32-64.svg");
}

.icon_line_arrow_up_32, .icon_line_arrow_up.i16, .icon_line_arrow_up.i32, .icon_line_arrow_up.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_arrow_up_16-32-64.svg");
}

.icon_line_assistance_32, .icon_line_assistance.i16, .icon_line_assistance.i32, .icon_line_assistance.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_assistance_16-32-64.svg");
}

.icon_line_barcode_32, .icon_line_barcode.i16, .icon_line_barcode.i32, .icon_line_barcode.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_barcode_16-32-64.svg");
}

.icon_line_bluetooth_32, .icon_line_bluetooth.i16, .icon_line_bluetooth.i32, .icon_line_bluetooth.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_bluetooth_16-32-64.svg");
}

.icon_line_bluetooth_active_32, .icon_line_bluetooth_active.i16, .icon_line_bluetooth_active.i32, .icon_line_bluetooth_active.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_bluetooth_active_16-32-64.svg");
}

.icon_line_camera_32, .icon_line_camera.i16, .icon_line_camera.i32, .icon_line_camera.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_camera_16-32-64.svg");
}

.icon_line_cart_32, .icon_line_cart.i16, .icon_line_cart.i32, .icon_line_cart.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cart_16-32-64.svg");
}

.icon_line_chevron_down_32, .icon_line_chevron_down.i16, .icon_line_chevron_down.i32, .icon_line_chevron_down.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_chevron_down_16-32-64.svg");
}

.icon_line_chevron_left_32, .icon_line_chevron_left.i16, .icon_line_chevron_left.i32, .icon_line_chevron_left.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_chevron_left_16-32-64.svg");
}

.icon_line_chevron_right_32, .icon_line_chevron_right.i16, .icon_line_chevron_right.i32, .icon_line_chevron_right.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_chevron_right_16-32-64.svg");
}

.icon_line_chevron_up_32, .icon_line_chevron_up.i16, .icon_line_chevron_up.i32, .icon_line_chevron_up.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_chevron_up_16-32-64.svg");
}

.icon_line_choice_32, .icon_line_choice.i16, .icon_line_choice.i32, .icon_line_choice.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_choice_16-32-64.svg");
}

.icon_line_clear_filter_32, .icon_line_clear_filter.i16, .icon_line_clear_filter.i32, .icon_line_clear_filter.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_clear_filter_16-32-64.svg");
}

.icon_line_clip_32, .icon_line_clip.i16, .icon_line_clip.i32, .icon_line_clip.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_clip_16-32-64.svg");
}

.icon_line_clip_cross_32, .icon_line_clip_cross.i16, .icon_line_clip_cross.i32, .icon_line_clip_cross.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_clip_cross_16-32-64.svg");
}

.icon_line_cloud_32, .icon_line_cloud.i16, .icon_line_cloud.i32, .icon_line_cloud.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cloud_16-32-64.svg");
}

.icon_line_cloud_down_32, .icon_line_cloud_down.i16, .icon_line_cloud_down.i32, .icon_line_cloud_down.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cloud_down_16-32-64.svg");
}

.icon_line_cloud_search_32, .icon_line_cloud_search.i16, .icon_line_cloud_search.i32, .icon_line_cloud_search.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cloud_search_16-32-64.svg");
}

.icon_line_cloud_sync_32, .icon_line_cloud_sync.i16, .icon_line_cloud_sync.i32, .icon_line_cloud_sync.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cloud_sync_16-32-64.svg");
}

.icon_line_cloud_updown_32, .icon_line_cloud_updown.i16, .icon_line_cloud_updown.i32, .icon_line_cloud_updown.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cloud_updown_16-32-64.svg");
}

.icon_line_cloud_up_32, .icon_line_cloud_up.i16, .icon_line_cloud_up.i32, .icon_line_cloud_up.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cloud_up_16-32-64.svg");
}

.icon_line_column_32, .icon_line_column.i16, .icon_line_column.i32, .icon_line_column.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_column_16-32-64.svg");
}

.icon_line_comment_32, .icon_line_comment.i16, .icon_line_comment.i32, .icon_line_comment.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_comment_16-32-64.svg");
}

.icon_line_comment_add_32, .icon_line_comment_add.i16, .icon_line_comment_add.i32, .icon_line_comment_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_comment_add_16-32-64.svg");
}

.icon_line_comment_conversation_32, .icon_line_comment_conversation.i16, .icon_line_comment_conversation.i32, .icon_line_comment_conversation.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_comment_conversation_16-32-64.svg");
}

.icon_line_comment_edit_32, .icon_line_comment_edit.i16, .icon_line_comment_edit.i32, .icon_line_comment_edit.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_comment_edit_16-32-64.svg");
}

.icon_line_comment_remove_32, .icon_line_comment_remove.i16, .icon_line_comment_remove.i32, .icon_line_comment_remove.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_comment_remove_16-32-64.svg");
}

.icon_line_correction_source_32, .icon_line_correction_source.i16, .icon_line_correction_source.i32, .icon_line_correction_source.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_correction_source_16-32-64.svg");
}

.icon_line_correction_status_32, .icon_line_correction_status.i16, .icon_line_correction_status.i32, .icon_line_correction_status.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_correction_status_16-32-64.svg");
}

.icon_line_cross_section_32, .icon_line_cross_section.i16, .icon_line_cross_section.i32, .icon_line_cross_section.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cross_section_16-32-64.svg");
}

.icon_line_cross_sect_32, .icon_line_cross_sect.i16, .icon_line_cross_sect.i32, .icon_line_cross_sect.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_cross_sect_16-32-64.svg");
}

.icon_line_date_32, .icon_line_date.i16, .icon_line_date.i32, .icon_line_date.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_date_16-32-64.svg");
}

.icon_line_date_creation_32, .icon_line_date_creation.i16, .icon_line_date_creation.i32, .icon_line_date_creation.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_date_creation_16-32-64.svg");
}

.icon_line_date_update_32, .icon_line_date_update.i16, .icon_line_date_update.i32, .icon_line_date_update.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_date_update_16-32-64.svg");
}

.icon_line_device_id_32, .icon_line_device_id.i16, .icon_line_device_id.i32, .icon_line_device_id.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_device_id_16-32-64.svg");
}

.icon_line_device_type_32, .icon_line_device_type.i16, .icon_line_device_type.i32, .icon_line_device_type.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_device_type_16-32-64.svg");
}

.icon_line_done_32, .icon_line_done.i16, .icon_line_done.i32, .icon_line_done.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_done_16-32-64.svg");
}

.icon_line_draft_32, .icon_line_draft.i16, .icon_line_draft.i32, .icon_line_draft.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_draft_16-32-64.svg");
}

.icon_line_draft_template_32, .icon_line_draft_template.i16, .icon_line_draft_template.i32, .icon_line_draft_template.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_draft_template_16-32-64.svg");
}

.icon_line_edit_32, .icon_line_edit.i16, .icon_line_edit.i32, .icon_line_edit.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_edit_white_16-32-64.svg");
}

.icon_line_equal_32, .icon_line_equal.i16, .icon_line_equal.i32, .icon_line_equal.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_equal_16-32-64.svg");
}

.icon_line_expand_collapse_32, .icon_line_expand_collapse.i16, .icon_line_expand_collapse.i32, .icon_line_expand_collapse.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_expand_collapse_16-32-64.svg");
}

.icon_line_expand_colla_32, .icon_line_expand_colla.i16, .icon_line_expand_colla.i32, .icon_line_expand_colla.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_expand_colla_16-32-64.svg");
}

.icon_line_fields_32, .icon_line_fields.i16, .icon_line_fields.i32, .icon_line_fields.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_fields_16-32-64.svg");
}

.active .icon_line_fields.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_fields_white_16-32-64.svg");
}

.icon_line_files_32, .icon_line_files.i16, .icon_line_files.i32, .icon_line_files.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_files_16-32-64.svg");
}

.icon_line_file_32, .icon_line_file.i16, .icon_line_file.i32, .icon_line_file.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_file_16-32-64.svg");
}

.icon_line_file_add_32, .icon_line_file_add.i16, .icon_line_file_add.i32, .icon_line_file_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_file_add_16-32-64.svg");
}

.icon_line_file_export_32, .icon_line_file_export.i16, .icon_line_file_export.i32, .icon_line_file_export.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_file_export_16-32-64.svg");
}

.icon_line_file_remove_32, .icon_line_file_remove.i16, .icon_line_file_remove.i32, .icon_line_file_remove.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_file_remove_16-32-64.svg");
}

.icon_line_file_upload_32, .icon_line_file_upload.i16, .icon_line_file_upload.i32, .icon_line_file_upload.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_file_upload_16-32-64.svg");
}

.icon_line_filter_32, .icon_line_filter.i16, .icon_line_filter.i32, .icon_line_filter.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_filter_16-32-64.svg");
}

.icon_line_folder_closed_32, .icon_line_folder_closed.i16, .icon_line_folder_closed.i32, .icon_line_folder_closed.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_folder_closed_16-32-64.svg");
}

.icon_line_folder_open_32, .icon_line_folder_open.i16, .icon_line_folder_open.i32, .icon_line_folder_open.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_folder_open_16-32-64.svg");
}

.icon_line_geometry_32, .icon_line_geometry.i16, .icon_line_geometry.i32, .icon_line_geometry.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_geometry_16-32-64.svg");
}

.icon_line_greaterThanEqualTo_32, .icon_line_greaterThanEqualTo.i16, .icon_line_greaterThanEqualTo.i32, .icon_line_greaterThanEqualTo.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_greaterThanEqualTo_16-32-64.svg");
}

.icon_line_greaterThan_32, .icon_line_greaterThan.i16, .icon_line_greaterThan.i32, .icon_line_greaterThan.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_greaterThan_16-32-64.svg");
}

.icon_line_group_32, .icon_line_group.i16, .icon_line_group.i32, .icon_line_group.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_group_16-32-64.svg");
}

.icon_line_hdop1_32, .icon_line_hdop1.i16, .icon_line_hdop1.i32, .icon_line_hdop1.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_hdop1_16-32-64.svg");
}

.icon_line_info_32, .icon_line_info.i16, .icon_line_info.i32, .icon_line_info.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_info_16-32-64.svg");
}

.icon_line_layers_32, .icon_line_layers.i16, .icon_line_layers.i32, .icon_line_layers.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_layers_16-32-64.svg");
}

.active .icon_line_layers.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_layers_white_16-32-64.svg");
}

.icon_line_length_32, .icon_line_length.i16, .icon_line_length.i32, .icon_line_length.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_length_16-32-64.svg");
}

.icon_line_lessThanEqualTo_32, .icon_line_lessThanEqualTo.i16, .icon_line_lessThanEqualTo.i32, .icon_line_lessThanEqualTo.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_lessThanEqualTo_16-32-64.svg");
}

.icon_line_lessThan_32, .icon_line_lessThan.i16, .icon_line_lessThan.i32, .icon_line_lessThan.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_lessThan_16-32-64.svg");
}

.icon_line_links_32, .icon_line_links.i16, .icon_line_links.i32, .icon_line_links.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_links_16-32-64.svg");
}

.icon_line_link_32, .icon_line_link.i16, .icon_line_link.i32, .icon_line_link.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_link_16-32-64.svg");
}

.active .icon_line_link.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_link_white_16-32-64.svg");
}

.icon_line_markup_arrow_32, .icon_line_markup_arrow.i16, .icon_line_markup_arrow.i32, .icon_line_markup_arrow.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_markup_arrow_16-32-64.svg");
}

.icon_line_markup_cloud_32, .icon_line_markup_cloud.i16, .icon_line_markup_cloud.i32, .icon_line_markup_cloud.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_markup_cloud_16-32-64.svg");
}

.icon_line_markup_line_32, .icon_line_markup_line.i16, .icon_line_markup_line.i32, .icon_line_markup_line.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_markup_line_16-32-64.svg");
}

.icon_line_markup_note_32, .icon_line_markup_note.i16, .icon_line_markup_note.i32, .icon_line_markup_note.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_markup_note_16-32-64.svg");
}

.icon_line_marquee_32, .icon_line_marquee.i16, .icon_line_marquee.i32, .icon_line_marquee.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_marquee_16-32-64.svg");
}

.icon_line_measure_32, .icon_line_measure.i16, .icon_line_measure.i32, .icon_line_measure.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_measure_16-32-64.svg");
}

.icon_line_menu_32, .icon_line_menu.i16, .icon_line_menu.i32, .icon_line_menu.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_menu_16-32-64.svg");
}

.icon_line_menu_dots_32, .icon_line_menu_dots.i16, .icon_line_menu_dots.i32, .icon_line_menu_dots.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_menu_dots_16-32-64.svg");
}

.icon_line_minus_32, .icon_line_minus.i16, .icon_line_minus.i32, .icon_line_minus.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_minus_16-32-64.svg");
}

.icon_line_notEqual_32, .icon_line_notEqual.i16, .icon_line_notEqual.i32, .icon_line_notEqual.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_notEqual_16-32-64.svg");
}

.icon_line_number_32, .icon_line_number.i16, .icon_line_number.i32, .icon_line_number.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_number_16-32-64.svg");
}

.icon_line_orbit_32, .icon_line_orbit.i16, .icon_line_orbit.i32, .icon_line_orbit.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_orbit_16-32-64.svg");
}

.icon_line_pagebreak_32, .icon_line_pagebreak.i16, .icon_line_pagebreak.i32, .icon_line_pagebreak.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_pagebreak_16-32-64.svg");
}

.icon_line_pagefit_height_32, .icon_line_pagefit_height.i16, .icon_line_pagefit_height.i32, .icon_line_pagefit_height.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_pagefit_height_16-32-64.svg");
}

.icon_line_pagefit_width_32, .icon_line_pagefit_width.i16, .icon_line_pagefit_width.i32, .icon_line_pagefit_width.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_pagefit_width_16-32-64.svg");
}

.icon_line_page_not_available_32, .icon_line_page_not_available.i16, .icon_line_page_not_available.i32, .icon_line_page_not_available.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_page_not_available_16-32-64.svg");
}

.icon_line_pdop1_32, .icon_line_pdop1.i16, .icon_line_pdop1.i32, .icon_line_pdop1.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_pdop1_16-32-64.svg");
}

.icon_line_plus_32, .icon_line_plus.i16, .icon_line_plus.i32, .icon_line_plus.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_plus_16-32-64.svg");
}

.active .icon_line_plus.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_plus_white_16-32-64.svg");
}

.icon_line_polygon_32, .icon_line_polygon.i16, .icon_line_polygon.i32, .icon_line_polygon.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_polygon_16-32-64.svg");
}

.icon_line_positioning_32, .icon_line_positioning.i16, .icon_line_positioning.i32, .icon_line_positioning.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_positioning_16-32-64.svg");
}

.icon_line_refresh_32, .icon_line_refresh.i16, .icon_line_refresh.i32, .icon_line_refresh.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_refresh_16-32-64.svg");
}

.icon_line_rows_32, .icon_line_rows.i16, .icon_line_rows.i32, .icon_line_rows.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_rows_16-32-64.svg");
}

.icon_line_rules_32, .icon_line_rules.i16, .icon_line_rules.i32, .icon_line_rules.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_rules_16-32-64.svg");
}

.active .icon_line_rules.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_rules_white_16-32-64.svg");
}

.icon_line_screen_maximise_32, .icon_line_screen_maximise.i16, .icon_line_screen_maximise.i32, .icon_line_screen_maximise.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_screen_maximise_16-32-64.svg");
}

.icon_line_screen_minimise_32, .icon_line_screen_minimise.i16, .icon_line_screen_minimise.i32, .icon_line_screen_minimise.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_screen_minimise_16-32-64.svg");
}

.icon_line_search_32, .icon_line_search.i16, .icon_line_search.i32, .icon_line_search.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_search_16-32-64.svg");
}

.icon_line_select_32, .icon_line_select.i16, .icon_line_select.i32, .icon_line_select.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_select_16-32-64.svg");
}

.icon_line_select_polygon_32, .icon_line_select_polygon.i16, .icon_line_select_polygon.i32, .icon_line_select_polygon.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_select_polygon_16-32-64.svg");
}

.active .icon_line_select_polygon.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_select_polygon_white_16-32-64.svg");
}

.icon_line_select_polygon_add_32, .icon_line_select_polygon_add.i16, .icon_line_select_polygon_add.i32, .icon_line_select_polygon_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_select_polygon_add_16-32-64.svg");
}

.active .icon_line_select_polygon_add.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_select_polygon_add_white_16-32-64.svg");
}

.icon_line_select_polygon_subtract_32, .icon_line_select_polygon_subtract.i16, .icon_line_select_polygon_subtract.i32, .icon_line_select_polygon_subtract.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_select_polygon_subtract_16-32-64.svg");
}

.active .icon_line_select_polygon_subtract.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_select_polygon_subtract_white_16-32-64.svg");
}

.icon_line_select_rectangle_32, .icon_line_select_rectangle.i16, .icon_line_select_rectangle.i32, .icon_line_select_rectangle.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_select_rectangle_16-32-64.svg");
}

.active .icon_line_select_rectangle.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_select_rectangle_white_16-32-64.svg");
}

.icon_line_select_rectangle_add_32, .icon_line_select_rectangle_add.i16, .icon_line_select_rectangle_add.i32, .icon_line_select_rectangle_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_select_rectangle_add_16-32-64.svg");
}

.active .icon_line_select_rectangle_add.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_select_rectangle_add_white_16-32-64.svg");
}

.icon_line_select_rectangle_subtract_32, .icon_line_select_rectangle_subtract.i16, .icon_line_select_rectangle_subtract.i32, .icon_line_select_rectangle_subtract.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_select_rectangle_subtract_16-32-64.svg");
}

.active .icon_line_select_rectangle_subtract.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_select_rectangle_subtract_white_16-32-64.svg");
}

.icon_line_select_single_32, .icon_line_select_single.i16, .icon_line_select_single.i32, .icon_line_select_single.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_select_single_16-32-64.svg");
}

.icon_line_sign_32, .icon_line_sign.i16, .icon_line_sign.i32, .icon_line_sign.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_sign_16-32-64.svg");
}

.icon_line_source_direct_32, .icon_line_source_direct.i16, .icon_line_source_direct.i32, .icon_line_source_direct.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_source_direct_16-32-64.svg");
}

.icon_line_source_ntrip_32, .icon_line_source_ntrip.i16, .icon_line_source_ntrip.i32, .icon_line_source_ntrip.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_source_ntrip_16-32-64.svg");
}

.icon_line_source_rtx_32, .icon_line_source_rtx.i16, .icon_line_source_rtx.i32, .icon_line_source_rtx.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_source_rtx_16-32-64.svg");
}

.icon_line_source_sbas_32, .icon_line_source_sbas.i16, .icon_line_source_sbas.i32, .icon_line_source_sbas.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_source_sbas_16-32-64.svg");
}

.icon_line_swapView_32, .icon_line_swapView.i16, .icon_line_swapView.i32, .icon_line_swapView.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_swapView_16-32-64.svg");
}

.icon_line_sync_32, .icon_line_sync.i16, .icon_line_sync.i32, .icon_line_sync.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_sync_16-32-64.svg");
}

.icon_line_tablet_32, .icon_line_tablet.i16, .icon_line_tablet.i32, .icon_line_tablet.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_tablet_16-32-64.svg");
}

.icon_line_task_add_32, .icon_line_task_add.i16, .icon_line_task_add.i32, .icon_line_task_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_task_add_16-32-64.svg");
}

.icon_line_task_subtract_32, .icon_line_task_subtract.i16, .icon_line_task_subtract.i32, .icon_line_task_subtract.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_task_subtract_16-32-64.svg");
}

.icon_line_template_32, .icon_line_template.i16, .icon_line_template.i32, .icon_line_template.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_template_16-32-64.svg");
}

.active .icon_line_template.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_template_white_16-32-64.svg");
}

.icon_line_template_draft_32, .icon_line_template_draft.i16, .icon_line_template_draft.i32, .icon_line_template_draft.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_template_draft_16-32-64.svg");
}

.icon_line_text_32, .icon_line_text.i16, .icon_line_text.i32, .icon_line_text.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_text_16-32-64.svg");
}

.icon_line_thumbnail_32, .icon_line_thumbnail.i16, .icon_line_thumbnail.i32, .icon_line_thumbnail.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_thumbnail_16-32-64.svg");
}

.icon_line_tick_32, .icon_line_tick.i16, .icon_line_tick.i32, .icon_line_tick.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_tick_16-32-64.svg");
}

.active .icon_line_tick.i32 {
  background-image: url("../images/SVGs-32scale/icon_line_tick_white_16-32-64.svg");
}

.icon_line_tick_square_32, .icon_line_tick_square.i16, .icon_line_tick_square.i32, .icon_line_tick_square.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_tick_square_16-32-64.svg");
}

.icon_line_todo_32, .icon_line_todo.i16, .icon_line_todo.i32, .icon_line_todo.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_todo_16-32-64.svg");
}

.icon_line_turn_head_32, .icon_line_turn_head.i16, .icon_line_turn_head.i32, .icon_line_turn_head.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_turn_head_16-32-64.svg");
}

.icon_line_view_fit_32, .icon_line_view_fit.i16, .icon_line_view_fit.i32, .icon_line_view_fit.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_view_fit_16-32-64.svg");
}

.icon_line_visibility_hide_32, .icon_line_visibility_hide.i16, .icon_line_visibility_hide.i32, .icon_line_visibility_hide.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_visibility_hide_16-32-64.svg");
}

.icon_line_visibility_hide_others_32, .icon_line_visibility_hide_others.i16, .icon_line_visibility_hide_others.i32, .icon_line_visibility_hide_others.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_visibility_hide_others_16-32-64.svg");
}

.icon_line_visibility_show_32, .icon_line_visibility_show.i16, .icon_line_visibility_show.i32, .icon_line_visibility_show.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_visibility_show_16-32-64.svg");
}

.icon_line_visibility_show_all_32, .icon_line_visibility_show_all.i16, .icon_line_visibility_show_all.i32, .icon_line_visibility_show_all.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_visibility_show_all_16-32-64.svg");
}

.icon_line_visibility_show_only_32, .icon_line_visibility_show_only.i16, .icon_line_visibility_show_only.i32, .icon_line_visibility_show_only.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_visibility_show_only_16-32-64.svg");
}

.icon_line_visibility_toggle_32, .icon_line_visibility_toggle.i16, .icon_line_visibility_toggle.i32, .icon_line_visibility_toggle.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_visibility_toggle_16-32-64.svg");
}

.icon_line_walk_32, .icon_line_walk.i16, .icon_line_walk.i32, .icon_line_walk.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_walk_16-32-64.svg");
}

.icon_line_white_plus_32, .icon_line_white_plus.i16, .icon_line_white_plus.i32, .icon_line_white_plus.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_white_plus_16-32-64.svg");
}

.icon_line_white_tick_32, .icon_line_white_tick.i16, .icon_line_white_tick.i32, .icon_line_white_tick.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_white_tick_16-32-64.svg");
}

.icon_line_x_32, .icon_line_x.i16, .icon_line_x.i32, .icon_line_x.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_x_16-32-64.svg");
}

.icon_line_yesno_32, .icon_line_yesno.i16, .icon_line_yesno.i32, .icon_line_yesno.i64 {
  background-image: url("../images/SVGs-32scale/icon_line_yesno_16-32-64.svg");
}

.icon_solid_3D_isometric_32, .icon_solid_3D_isometric.i16, .icon_solid_3D_isometric.i32, .icon_solid_3D_isometric.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_3D_isometric_16-32-64.svg");
}

.icon_solid_3D_reset_32, .icon_solid_3D_reset.i16, .icon_solid_3D_reset.i32, .icon_solid_3D_reset.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_3D_reset_16-32-64.svg");
}

.icon_solid_alert_32, .icon_solid_alert.i16, .icon_solid_alert.i32, .icon_solid_alert.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_alert_16-32-64.svg");
}

.icon_solid_alert_critical_32, .icon_solid_alert_critical.i16, .icon_solid_alert_critical.i32, .icon_solid_alert_critical.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_alert_critical_16-32-64.svg");
}

.icon_solid_alert_info_32, .icon_solid_alert_info.i16, .icon_solid_alert_info.i32, .icon_solid_alert_info.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_alert_info_16-32-64.svg");
}

.icon_solid_alert_positive_32, .icon_solid_alert_positive.i16, .icon_solid_alert_positive.i32, .icon_solid_alert_positive.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_alert_positive_16-32-64.svg");
}

.icon_solid_alert_warning_32, .icon_solid_alert_warning.i16, .icon_solid_alert_warning.i32, .icon_solid_alert_warning.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_alert_warning_16-32-64.svg");
}

.icon_solid_assistance_32, .icon_solid_assistance.i16, .icon_solid_assistance.i32, .icon_solid_assistance.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_assistance_16-32-64.svg");
}

.icon_solid_autofields_32, .icon_solid_autofields.i16, .icon_solid_autofields.i32, .icon_solid_autofields.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_autofields_16-32-64.svg");
}

.icon_solid_cache_32, .icon_solid_cache.i16, .icon_solid_cache.i32, .icon_solid_cache.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_cache_16-32-64.svg");
}

.icon_solid_camera_32, .icon_solid_camera.i16, .icon_solid_camera.i32, .icon_solid_camera.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_camera_16-32-64.svg");
}

.icon_solid_cam_32, .icon_solid_cam.i16, .icon_solid_cam.i32, .icon_solid_cam.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_cam_16-32-64.svg");
}

.icon_solid_cart_32, .icon_solid_cart.i16, .icon_solid_cart.i32, .icon_solid_cart.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_cart_16-32-64.svg");
}

.icon_solid_clash_bang_critical_32, .icon_solid_clash_bang_critical.i16, .icon_solid_clash_bang_critical.i32, .icon_solid_clash_bang_critical.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_bang_critical_16-32-64.svg");
}

.icon_solid_clash_bang_gray_32, .icon_solid_clash_bang_gray.i16, .icon_solid_clash_bang_gray.i32, .icon_solid_clash_bang_gray.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_bang_gray_16-32-64.svg");
}

.icon_solid_clash_bang_information_32, .icon_solid_clash_bang_information.i16, .icon_solid_clash_bang_information.i32, .icon_solid_clash_bang_information.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_bang_information_16-32-64.svg");
}

.icon_solid_clash_bang_positive_32, .icon_solid_clash_bang_positive.i16, .icon_solid_clash_bang_positive.i32, .icon_solid_clash_bang_positive.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_bang_positive_16-32-64.svg");
}

.icon_solid_clash_bang_warning_32, .icon_solid_clash_bang_warning.i16, .icon_solid_clash_bang_warning.i32, .icon_solid_clash_bang_warning.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_bang_warning_16-32-64.svg");
}

.icon_solid_clash_set_32, .icon_solid_clash_set.i16, .icon_solid_clash_set.i32, .icon_solid_clash_set.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_set_16-32-64.svg");
}

.icon_solid_clash_set_add_32, .icon_solid_clash_set_add.i16, .icon_solid_clash_set_add.i32, .icon_solid_clash_set_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_set_add_16-32-64.svg");
}

.icon_solid_clash_set_download_32, .icon_solid_clash_set_download.i16, .icon_solid_clash_set_download.i32, .icon_solid_clash_set_download.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_set_download_16-32-64.svg");
}

.icon_solid_clash_set_remove_32, .icon_solid_clash_set_remove.i16, .icon_solid_clash_set_remove.i32, .icon_solid_clash_set_remove.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_clash_set_remove_16-32-64.svg");
}

.icon_solid_collectedby_32, .icon_solid_collectedby.i16, .icon_solid_collectedby.i32, .icon_solid_collectedby.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_collectedby_16-32-64.svg");
}

.icon_solid_comment_32, .icon_solid_comment.i16, .icon_solid_comment.i32, .icon_solid_comment.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_comment_16-32-64.svg");
}

.icon_solid_comment_add_32, .icon_solid_comment_add.i16, .icon_solid_comment_add.i32, .icon_solid_comment_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_comment_add_16-32-64.svg");
}

.icon_solid_comment_conversation_32, .icon_solid_comment_conversation.i16, .icon_solid_comment_conversation.i32, .icon_solid_comment_conversation.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_comment_conversation_16-32-64.svg");
}

.icon_solid_comment_edit_32, .icon_solid_comment_edit.i16, .icon_solid_comment_edit.i32, .icon_solid_comment_edit.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_comment_edit_16-32-64.svg");
}

.icon_solid_comment_remove_32, .icon_solid_comment_remove.i16, .icon_solid_comment_remove.i32, .icon_solid_comment_remove.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_comment_remove_16-32-64.svg");
}

.icon_solid_fields_32, .icon_solid_fields.i16, .icon_solid_fields.i32, .icon_solid_fields.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_fields_16-32-64.svg");
}

.icon_solid_filter_32, .icon_solid_filter.i16, .icon_solid_filter.i32, .icon_solid_filter.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_filter_16-32-64.svg");
}

.active .icon_solid_filter.i32 {
  background-image: url("../images/SVGs-32scale/icon_solid_filter_white_16-32-64.svg");
}

.icon_solid_folder_closed_32, .icon_solid_folder_closed.i16, .icon_solid_folder_closed.i32, .icon_solid_folder_closed.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_folder_closed_16-32-64.svg");
}

.icon_solid_folder_open_32, .icon_solid_folder_open.i16, .icon_solid_folder_open.i32, .icon_solid_folder_open.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_folder_open_16-32-64.svg");
}

.icon_solid_info_32, .icon_solid_info.i16, .icon_solid_info.i32, .icon_solid_info.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_info_16-32-64.svg");
}

.icon_solid_layers_32, .icon_solid_layers.i16, .icon_solid_layers.i32, .icon_solid_layers.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_layers_16-32-64.svg");
}

.icon_solid_line_32, .icon_solid_line.i16, .icon_solid_line.i32, .icon_solid_line.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_line_16-32-64.svg");
}

.icon_solid_locationservices_32, .icon_solid_locationservices.i16, .icon_solid_locationservices.i32, .icon_solid_locationservices.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_locationservices_16-32-64.svg");
}

.icon_solid_lock_32, .icon_solid_lock.i16, .icon_solid_lock.i32, .icon_solid_lock.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_lock_16-32-64.svg");
}

.icon_solid_map_32, .icon_solid_map.i16, .icon_solid_map.i32, .icon_solid_map.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_map_16-32-64.svg");
}

.icon_solid_measure_32, .icon_solid_measure.i16, .icon_solid_measure.i32, .icon_solid_measure.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_measure_16-32-64.svg");
}

.icon_solid_menu_32, .icon_solid_menu.i16, .icon_solid_menu.i32, .icon_solid_menu.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_menu_16-32-64.svg");
}

.icon_solid_minus_32, .icon_solid_minus.i16, .icon_solid_minus.i32, .icon_solid_minus.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_minus_16-32-64.svg");
}

.icon_solid_number_32, .icon_solid_number.i16, .icon_solid_number.i32, .icon_solid_number.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_number_16-32-64.svg");
}

.icon_solid_pagefit_height_32, .icon_solid_pagefit_height.i16, .icon_solid_pagefit_height.i32, .icon_solid_pagefit_height.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_pagefit_height_16-32-64.svg");
}

.icon_solid_pagefit_width_32, .icon_solid_pagefit_width.i16, .icon_solid_pagefit_width.i32, .icon_solid_pagefit_width.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_pagefit_width_16-32-64.svg");
}

.icon_solid_plus_32, .icon_solid_plus.i16, .icon_solid_plus.i32, .icon_solid_plus.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_plus_16-32-64.svg");
}

.icon_solid_point_32, .icon_solid_point.i16, .icon_solid_point.i32, .icon_solid_point.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_point_16-32-64.svg");
}

.icon_solid_poly_32, .icon_solid_poly.i16, .icon_solid_poly.i32, .icon_solid_poly.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_poly_16-32-64.svg");
}

.icon_solid_preferences_32, .icon_solid_preferences.i16, .icon_solid_preferences.i32, .icon_solid_preferences.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_preferences_16-32-64.svg");
}

.icon_solid_select_single_32, .icon_solid_select_single.i16, .icon_solid_select_single.i32, .icon_solid_select_single.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_select_single_16-32-64.svg");
}

.active .icon_solid_select_single.i32 {
  background-image: url("../images/SVGs-32scale/icon_solid_select_single_white_16-32-64.svg");
}

.icon_solid_select_single_add_32, .icon_solid_select_single_add.i16, .icon_solid_select_single_add.i32, .icon_solid_select_single_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_select_single_add_16-32-64.svg");
}

.active .icon_solid_select_single_add.i32 {
  background-image: url("../images/SVGs-32scale/icon_solid_select_single_add_white_16-32-64.svg");
}

.icon_solid_select_single_add_32, .icon_solid_select_single_add.i16, .icon_solid_select_single_add.i32, .icon_solid_select_single_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_select_single_add_16-32-64.svg");
}

.active .icon_solid_select_single_add.i32 {
  background-image: url("../images/SVGs-32scale/icon_solid_select_single_add_white_16-32-64.svg");
}

.icon_solid_select_single_subtract_32, .icon_solid_select_single_subtract.i16, .icon_solid_select_single_subtract.i32, .icon_solid_select_single_subtract.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_select_single_subtract_16-32-64.svg");
}

.active .icon_solid_select_single_subtract.i32 {
  background-image: url("../images/SVGs-32scale/icon_solid_select_single_subtract_white_16-32-64.svg");
}

.icon_solid_settings_32, .icon_solid_settings.i16, .icon_solid_settings.i32, .icon_solid_settings.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_settings_16-32-64.svg");
}

.icon_solid_space_32, .icon_solid_space.i16, .icon_solid_space.i32, .icon_solid_space.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_space_16-32-64.svg");
}

.icon_solid_swapView_32, .icon_solid_swapView.i16, .icon_solid_swapView.i32, .icon_solid_swapView.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_swapView_16-32-64.svg");
}

.icon_solid_text_32, .icon_solid_text.i16, .icon_solid_text.i32, .icon_solid_text.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_text_16-32-64.svg");
}

.icon_solid_todo_32, .icon_solid_todo.i16, .icon_solid_todo.i32, .icon_solid_todo.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_todo_16-32-64.svg");
}

.active .icon_solid_todo.i32 {
  background-image: url("../images/SVGs-32scale/icon_solid_todo_white_16-32-64.svg");
}

.icon_solid_todo_add_32, .icon_solid_todo_add.i16, .icon_solid_todo_add.i32, .icon_solid_todo_add.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_todo_add_16-32-64.svg");
}

.icon_solid_trash_32, .icon_solid_trash.i16, .icon_solid_trash.i32, .icon_solid_trash.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_trash_16-32-64.svg");
}

.icon_solid_user_32, .icon_solid_user.i16, .icon_solid_user.i32, .icon_solid_user.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_user_16-32-64.svg");
}

.icon_solid_user_group_32, .icon_solid_user_group.i16, .icon_solid_user_group.i32, .icon_solid_user_group.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_user_group_16-32-64.svg");
}

.icon_solid_white_alert_32, .icon_solid_white_alert.i16, .icon_solid_white_alert.i32, .icon_solid_white_alert.i64 {
  background-image: url("../images/SVGs-32scale/icon_solid_white_alert_16-32-64.svg");
}

.icon_vect_line_move_hand_closed_32, .icon_vect_line_move_hand_closed.i16, .icon_vect_line_move_hand_closed.i32, .icon_vect_line_move_hand_closed.i64 {
  background-image: url("../images/SVGs-32scale/icon_vect_line_move_hand_closed_16-32-64.svg");
}

.icon_vect_line_move_hand_open_32, .icon_vect_line_move_hand_open.i16, .icon_vect_line_move_hand_open.i32, .icon_vect_line_move_hand_open.i64 {
  background-image: url("../images/SVGs-32scale/icon_vect_line_move_hand_open_16-32-64.svg");
}

.icon_vect_solid_move_hand_closed_32, .icon_vect_solid_move_hand_closed.i16, .icon_vect_solid_move_hand_closed.i32, .icon_vect_solid_move_hand_closed.i64 {
  background-image: url("../images/SVGs-32scale/icon_vect_solid_move_hand_closed_16-32-64.svg");
}

.icon_vect_solid_move_hand_open_32, .icon_vect_solid_move_hand_open.i16, .icon_vect_solid_move_hand_open.i32, .icon_vect_solid_move_hand_open.i64 {
  background-image: url("../images/SVGs-32scale/icon_vect_solid_move_hand_open_16-32-64.svg");
}

/*
Avatar

Avatar styles from trimble css

Markup:
Avatar:
<div class="avatar">
	<!-- <img src="" alt=""> -->
	<i class="i64 icon_solid_user"></i>
	<div class="edit-avatar">
		<i class="i16 icon_line_edit"></i>
	</div>
</div>

Styleguide UI Elements.avatar
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.avatar {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.avatar img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.avatar img#avatar-output {
  display: none;
}

.avatar .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.avatar .edit-avatar input {
  display: none;
}

.avatar-small {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  width: 1.75rem;
  height: 1.75rem;
  margin-bottom: 0;
  overflow: hidden;
}

.avatar-small img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.avatar-small img#avatar-output {
  display: none;
}

.avatar-small .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.avatar-small .edit-avatar input {
  display: none;
}

.avatar-medium {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  width: 2.25rem;
  height: 2.25rem;
  margin-bottom: 0;
  overflow: hidden;
}

.avatar-medium img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.avatar-medium img#avatar-output {
  display: none;
}

.avatar-medium .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.avatar-medium .edit-avatar input {
  display: none;
}

.card-avatar {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: solid 5px #E2E2E7;
  width: 7.5rem;
  height: 7.5rem;
  margin-bottom: 1rem;
  overflow: hidden;
  box-sizing: border-box;
}

.card-avatar img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.card-avatar img#avatar-output {
  display: none;
}

.card-avatar .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.card-avatar .edit-avatar input {
  display: none;
}

.list .card-avatar {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  width: 1.75rem;
  height: 1.75rem;
  margin-bottom: 0;
  overflow: hidden;
}

.list .card-avatar img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.list .card-avatar img#avatar-output {
  display: none;
}

.list .card-avatar .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.list .card-avatar .edit-avatar input {
  display: none;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.panel {
  background-color: #f9f9fb;
  margin-bottom: 0.75rem;
  padding: 1rem;
  box-shadow: 1px 1px 5px #b5b4c5;
}

.panel .panel-title {
  padding-bottom: 1rem;
  color: #6A6976;
}

.panel .panel-section {
  padding: 0.75rem;
}

.panel .avatar {
  margin: 1rem auto 2rem auto;
}

.panel .basic-interest {
  border-left: 1px solid #005F9E;
  padding-left: 10px;
  margin: 1rem;
}

.panel .basic-interest .title {
  margin-bottom: 12px;
}

.panel .basic-interest li {
  font-size: 0.75rem;
  margin: 0 0 5px 10px;
}

.panel .disclaimer {
  font-size: 0.6875rem;
  color: #AEAEB6;
  flex: 100%;
  margin-top: 5px;
}

/*
Input box

Input box from trimble css

Markup:
<div class="input-group">
    <label>Normal input</label>
    <input class="icon user" type="text" placeholder="First Name">
</div>
<div class="input-group">
    <label>Input with focus</label>
    <input class="icon user focus" type="text" placeholder="First Name">
</div>
<div class="input-group">
    <label>Input with error</label>
    <input class="icon user error" type="text" placeholder="First Name">
</div>
<div class="input-group">
    <label>Input without icon</label>
    <input class="" type="text" placeholder="Without icon">
</div>

Styleguide Form Elements.input
*/
/*
Select box

Select box from trimble css

Markup:
<select>
    <option value="">All Users</option>
    <option value="">Pod 3</option>
    <option value="">Architects</option>
    <option value="">Engineers</option>
    <option value="">Surveyors</option>
</select>

Styleguide Form Elements.select
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

/*
Input box with floating label

Floating label styles from trimble css

Markup:
<div class="input-group">
    <input class="icon user" type="text" required/>
    <label class="label float">First Name</label>
</div>

Styleguide Form Elements.Floating label
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

input:focus ~ .label.float, input:valid ~ .label.float, select:focus ~ .label.float, select:valid ~ .label.float {
  top: -1.3125rem;
  left: 0;
  font-size: 0.75rem;
  font-style: normal;
}

.error-message {
  color: #C81922;
  font-size: .75rem;
}

input[type="text"], input[type="email"], input[type="password"] {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 2.813rem;
  padding: 0 1rem;
  border: solid 1px #EAEAEF;
  background-color: #FFFFFF;
  font-size: 1rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  padding: 0 1rem;
}

input[type="text"]:focus, input[type="text"].focus, input[type="email"]:focus, input[type="email"].focus, input[type="password"]:focus, input[type="password"].focus {
  outline: none;
  background-color: #FFFFFF;
  border-bottom: solid 2px #009AD9;
}

input[type="text"]::placeholder, input[type="email"]::placeholder, input[type="password"]::placeholder {
  color: #9D9DA6;
  font-style: italic;
}

input[type="text"].error, input[type="email"].error, input[type="password"].error {
  outline: none;
  background-color: #FFFFFF;
  border-bottom: solid 2px #C81922;
}

input[type="text"].icon, input[type="email"].icon, input[type="password"].icon {
  padding: 0 1rem 0 3.5rem;
  background-repeat: no-repeat;
  background-position: 0.25rem center;
}

input[type="text"].user, input[type="email"].user, input[type="password"].user {
  background-image: url("../images/Icons/user_default.svg");
}

input[type="text"].email, input[type="email"].email, input[type="password"].email {
  background-image: url("../images/Icons/email.svg");
}

input[type="text"].phone, input[type="email"].phone, input[type="password"].phone {
  background-image: url("../images/Icons/phone.svg");
}

input[type="text"].location, input[type="email"].location, input[type="password"].location {
  background-image: url("../images/Icons/location.svg");
}

select {
  width: 100%;
  border: solid 1px #EAEAEF;
  height: 2.813rem;
  padding: 0 0.5rem;
  box-sizing: border-box;
  background-color: #FFFFFF;
  font-size: 1rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  /* color:$col_gray_5;    */
}

select:focus {
  outline: none;
  background-color: #FFFFFF;
}

select::placeholder {
  color: #9D9DA6;
  font-style: italic;
}

select.error {
  border: solid 1px #C81922;
}

.input-group {
  display: flex;
  flex-flow: row wrap;
  margin-bottom: 2rem;
  position: relative;
}

.input-group.last-child {
  margin-bottom: 0;
}

.input-group .error-message {
  color: #C81922;
  font-size: .75rem;
  flex: 1;
}

.input-group label {
  font-size: 0.75rem;
  color: #8C8B96;
  margin-bottom: 0.2143rem;
}

.input-group .label {
  font-size: 0.75rem;
  color: #8C8B96;
  margin-bottom: 0.2143rem;
  top: -1.3125rem;
  left: 0;
  font-size: 12px;
  position: absolute;
  pointer-events: none;
}

.input-group .label.float {
  font-size: 1rem;
  font-style: italic;
  left: 3.5rem;
  top: 0.625rem;
  transition: 0.2s ease all;
  -moz-transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
}

.input-group .label.no-icon {
  left: 1rem;
}

.input-group-add {
  display: flex;
  flex: 1 0 100%;
}

.input-group-label {
  display: block;
}

label {
  color: #6A6976;
}

.prefix-label {
  text-align: center;
  width: 30%;
  line-height: 2.813rem;
  font-size: 16px;
  color: #6A6976;
}

.input-group.prefix input {
  width: 20%;
}

.input-group.prefix label.float {
  left: 31%;
}

div.error, span.error {
  color: #C81922;
  display: block;
  width: 100%;
  font-size: 80%;
}

div.error.padding-bottom, span.error.padding-bottom {
  padding-bottom: 1rem;
}

div.success, span.success {
  color: #5E9331;
  display: block;
  width: 100%;
  font-size: 80%;
}

div.success.padding-bottom, span.success.padding-bottom {
  padding-bottom: 1rem;
}

/*
Buttons

Buttons styles from trimble css

Markup:
<div>
<button class="button default">default button</button>
</div>
<br/>
<div>
<button class="button small">small button</button>
</div>
<br/>
<div>
<button class="button expanded">expanded button</button>
</div>
<br/>
<div>
<button class="button small">
    <i class="icon add"></i>icon button
</button> 
</div>
<br/>
<div>
<button class="button default" disabled="disabled">Disabled button</button>
</div>
<br/>
<div>
<button class="button secondary">Secondary button</button>
</div>

Styleguide Form Elements.button
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

button, .button {
  background-color: #005F9E;
  color: #FFFFFF;
  outline: 0;
  border: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  text-transform: uppercase;
  margin-left: 0.5rem;
  font-size: 0.75rem;
  display: flex;
  cursor: pointer;
  justify-content: center;
}

button:hover, .button:hover {
  background-color: #197CB6;
}

button:focus, .button:focus {
  background-color: #07599B;
}

button.clear, .button.clear {
  height: 40px;
  line-height: 40px;
  background: none;
  border: none;
  padding: 0;
  color: #005F9E;
  font-size: 0.875rem;
}

button.clear:hover, .button.clear:hover {
  background-color: transparent;
}

button.clear:focus, .button.clear:focus {
  background-color: transparent;
}

button.default, .button.default {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
}

button.small, .button.small {
  height: 32px;
  line-height: 32px;
  padding: 0 1rem;
}

button.expanded, .button.expanded {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
  width: 100%;
}

button.secondary, .button.secondary {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
  background-color: #363545;
  color: #F3F3F7;
}

button.icon-w-text, .button.icon-w-text {
  padding-left: 0;
}

button i, .button i {
  width: 32px;
  height: 32px;
}

button i.add, .button i.add {
  background-image: url("../images/Icons/icon_add.svg");
  background-repeat: no-repeat;
  filter: grayscale(100%) brightness(5);
}

.disabled, .button:disabled, button[disabled] {
  opacity: .4;
  cursor: not-allowed;
}

/*
Checkbox

Checkbox styles from trimble css

Markup:
<div class="checkbox">
  <input class="check-input" type="checkbox" id="timezones" /><label for="timezones">Display All Timezones</label>
</div>

Styleguide Form Elements.checkbox
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

input[type="checkbox"] + label[for], input[type="radio"] + label[for] {
  cursor: pointer;
}

.check-input {
  box-sizing: border-box;
  opacity: 0;
  position: relative;
  z-index: 0;
  width: 1rem;
  height: 1rem;
  margin: 0 2px;
}

.checkbox {
  position: relative;
}

.check-input + label {
  display: inline-block;
  vertical-align: baseline;
  margin-left: 1rem;
  margin-right: 1rem;
  margin-bottom: 0;
}

.check-input + label:before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 25px;
  height: 25px;
  background: url("../images/checkbox-unchecked.svg") no-repeat;
  display: inline-block;
}

.check-input + label:hover:before {
  background: url("../images/checkbox-unchecked-hover.svg") no-repeat;
}

.check-input:checked + label {
  display: inline-block;
  padding: 0;
  cursor: pointer;
}

.check-input:checked + label:before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 25px;
  height: 25px;
  background: url("../images/checkbox-checked.svg") no-repeat;
  display: inline-block;
}

.check-input:checked + label:hover:before {
  background: url("../images/checkbox-checked-hover.svg") no-repeat;
}

.check-input:indeterminate + label {
  display: inline-block;
  padding: 0;
  cursor: pointer;
}

.check-input:indeterminate + label:before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 25px;
  height: 25px;
  background: url("../images/checkbox-indeterminate.svg") no-repeat;
  display: inline-block;
}

.check-input:indeterminate + label:hover:before {
  background: url("../images/checkbox-indeterminate-hover.svg") no-repeat;
  background-size: 25px 25px;
  background-position: center;
}

@media only screen and (max-width: 480px) {
  .checkbox {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    min-height: 1.5rem;
  }
}

/*
Input box

Input box from trimble css

Markup:
<div class="input-group">
    <label>Normal input</label>
    <input class="icon user" type="text" placeholder="First Name">
</div>
<div class="input-group">
    <label>Input with focus</label>
    <input class="icon user focus" type="text" placeholder="First Name">
</div>
<div class="input-group">
    <label>Input with error</label>
    <input class="icon user error" type="text" placeholder="First Name">
</div>
<div class="input-group">
    <label>Input without icon</label>
    <input class="" type="text" placeholder="Without icon">
</div>

Styleguide Form Elements.input
*/
/*
Select box

Select box from trimble css

Markup:
<select>
    <option value="">All Users</option>
    <option value="">Pod 3</option>
    <option value="">Architects</option>
    <option value="">Engineers</option>
    <option value="">Surveyors</option>
</select>

Styleguide Form Elements.select
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

/*
Input box with floating label

Floating label styles from trimble css

Markup:
<div class="input-group">
    <input class="icon user" type="text" required/>
    <label class="label float">First Name</label>
</div>

Styleguide Form Elements.Floating label
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

input:focus ~ .label.float, input:valid ~ .label.float, select:focus ~ .label.float, select:valid ~ .label.float {
  top: -1.3125rem;
  left: 0;
  font-size: 0.75rem;
  font-style: normal;
}

.error-message {
  color: #C81922;
  font-size: .75rem;
}

input[type="text"], input[type="email"], input[type="password"] {
  display: block;
  box-sizing: border-box;
  width: 100%;
  height: 2.813rem;
  padding: 0 1rem;
  border: solid 1px #EAEAEF;
  background-color: #FFFFFF;
  font-size: 1rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  padding: 0 1rem;
}

input[type="text"]:focus, input[type="text"].focus, input[type="email"]:focus, input[type="email"].focus, input[type="password"]:focus, input[type="password"].focus {
  outline: none;
  background-color: #FFFFFF;
  border-bottom: solid 2px #009AD9;
}

input[type="text"]::placeholder, input[type="email"]::placeholder, input[type="password"]::placeholder {
  color: #9D9DA6;
  font-style: italic;
}

input[type="text"].error, input[type="email"].error, input[type="password"].error {
  outline: none;
  background-color: #FFFFFF;
  border-bottom: solid 2px #C81922;
}

input[type="text"].icon, input[type="email"].icon, input[type="password"].icon {
  padding: 0 1rem 0 3.5rem;
  background-repeat: no-repeat;
  background-position: 0.25rem center;
}

input[type="text"].user, input[type="email"].user, input[type="password"].user {
  background-image: url("../images/Icons/user_default.svg");
}

input[type="text"].email, input[type="email"].email, input[type="password"].email {
  background-image: url("../images/Icons/email.svg");
}

input[type="text"].phone, input[type="email"].phone, input[type="password"].phone {
  background-image: url("../images/Icons/phone.svg");
}

input[type="text"].location, input[type="email"].location, input[type="password"].location {
  background-image: url("../images/Icons/location.svg");
}

select {
  width: 100%;
  border: solid 1px #EAEAEF;
  height: 2.813rem;
  padding: 0 0.5rem;
  box-sizing: border-box;
  background-color: #FFFFFF;
  font-size: 1rem;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  /* color:$col_gray_5;    */
}

select:focus {
  outline: none;
  background-color: #FFFFFF;
}

select::placeholder {
  color: #9D9DA6;
  font-style: italic;
}

select.error {
  border: solid 1px #C81922;
}

.input-group {
  display: flex;
  flex-flow: row wrap;
  margin-bottom: 2rem;
  position: relative;
}

.input-group.last-child {
  margin-bottom: 0;
}

.input-group .error-message {
  color: #C81922;
  font-size: .75rem;
  flex: 1;
}

.input-group label {
  font-size: 0.75rem;
  color: #8C8B96;
  margin-bottom: 0.2143rem;
}

.input-group .label {
  font-size: 0.75rem;
  color: #8C8B96;
  margin-bottom: 0.2143rem;
  top: -1.3125rem;
  left: 0;
  font-size: 12px;
  position: absolute;
  pointer-events: none;
}

.input-group .label.float {
  font-size: 1rem;
  font-style: italic;
  left: 3.5rem;
  top: 0.625rem;
  transition: 0.2s ease all;
  -moz-transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
}

.input-group .label.no-icon {
  left: 1rem;
}

.input-group-add {
  display: flex;
  flex: 1 0 100%;
}

.input-group-label {
  display: block;
}

label {
  color: #6A6976;
}

.prefix-label {
  text-align: center;
  width: 30%;
  line-height: 2.813rem;
  font-size: 16px;
  color: #6A6976;
}

.input-group.prefix input {
  width: 20%;
}

.input-group.prefix label.float {
  left: 31%;
}

div.error, span.error {
  color: #C81922;
  display: block;
  width: 100%;
  font-size: 80%;
}

div.error.padding-bottom, span.error.padding-bottom {
  padding-bottom: 1rem;
}

div.success, span.success {
  color: #5E9331;
  display: block;
  width: 100%;
  font-size: 80%;
}

div.success.padding-bottom, span.success.padding-bottom {
  padding-bottom: 1rem;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

/*
Checkbox

Checkbox styles from trimble css

Markup:
<div class="checkbox">
  <input class="check-input" type="checkbox" id="timezones" /><label for="timezones">Display All Timezones</label>
</div>

Styleguide Form Elements.checkbox
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

input[type="checkbox"] + label[for], input[type="radio"] + label[for] {
  cursor: pointer;
}

.check-input {
  box-sizing: border-box;
  opacity: 0;
  position: relative;
  z-index: 0;
  width: 1rem;
  height: 1rem;
  margin: 0 2px;
}

.checkbox {
  position: relative;
}

.check-input + label {
  display: inline-block;
  vertical-align: baseline;
  margin-left: 1rem;
  margin-right: 1rem;
  margin-bottom: 0;
}

.check-input + label:before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 25px;
  height: 25px;
  background: url("../images/checkbox-unchecked.svg") no-repeat;
  display: inline-block;
}

.check-input + label:hover:before {
  background: url("../images/checkbox-unchecked-hover.svg") no-repeat;
}

.check-input:checked + label {
  display: inline-block;
  padding: 0;
  cursor: pointer;
}

.check-input:checked + label:before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 25px;
  height: 25px;
  background: url("../images/checkbox-checked.svg") no-repeat;
  display: inline-block;
}

.check-input:checked + label:hover:before {
  background: url("../images/checkbox-checked-hover.svg") no-repeat;
}

.check-input:indeterminate + label {
  display: inline-block;
  padding: 0;
  cursor: pointer;
}

.check-input:indeterminate + label:before {
  content: " ";
  position: absolute;
  left: 0;
  top: 0;
  width: 25px;
  height: 25px;
  background: url("../images/checkbox-indeterminate.svg") no-repeat;
  display: inline-block;
}

.check-input:indeterminate + label:hover:before {
  background: url("../images/checkbox-indeterminate-hover.svg") no-repeat;
  background-size: 25px 25px;
  background-position: center;
}

@media only screen and (max-width: 480px) {
  .checkbox {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    min-height: 1.5rem;
  }
}

/*table*/
.table {
  display: flex;
  flex-flow: column nowrap;
  flex: 1 1 auto;
  line-height: 1.5;
}

.table .tr, .table .thead {
  width: 100%;
  display: flex;
  flex-flow: row nowrap;
  height: 60px;
  box-sizing: border-box;
}

.table .tr .td, .table .tr .th, .table .thead .td, .table .thead .th {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  flex-grow: 1;
  flex-basis: auto;
  padding: 1rem;
  word-break: break-word;
  min-width: 20px;
  width: 100px;
  border-bottom: 1px solid #EAEAEF;
  box-sizing: border-box;
}

.table .tr .td .card-avatar, .table .tr .th .card-avatar, .table .thead .td .card-avatar, .table .thead .th .card-avatar {
  width: 1.75rem;
  height: 1.75rem;
  margin-bottom: 0;
  border: none;
}

.table .tr .td.thumbnail, .table .tr .th.thumbnail, .table .thead .td.thumbnail, .table .thead .th.thumbnail {
  margin: 0 !important;
  max-width: 55px;
  flex-shrink: 0;
}

.table .tr .td.thumbnail img, .table .tr .th.thumbnail img, .table .thead .td.thumbnail img, .table .thead .th.thumbnail img {
  width: auto;
  height: auto;
  max-width: 29px;
  max-height: 22px;
}

.table .tr .th, .table .thead .th {
  font-size: 0.875rem;
}

.table .tr .th:first-child, .table .thead .th:first-child {
  flex: 0 0 100px;
}

.table .tr .th:last-child, .table .thead .th:last-child {
  flex: 0 0 auto;
}

.table .tr .td, .table .thead .td {
  color: #6A6976;
}

.table .tr .td .data, .table .thead .td .data {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.875rem;
}

.table .tr {
  background: #FFFFFF;
  cursor: pointer;
}

.table .tr:hover {
  background-color: #009AD9;
}

.table .tr:hover .td {
  color: #FFFFFF;
}

.table .thead {
  font-weight: 600;
  background: #f9f9fb;
}

.width0 {
  max-width: 60px;
  flex-shrink: 0;
}

.width1 {
  flex-grow: 1;
}

.width2 {
  flex-grow: 2;
}

.width3 {
  flex-grow: 3;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.content-area {
  margin: 0.75rem;
}

.icon_blue_plus {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/add_default.svg");
}

.icon_blue_minus {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/remove_default.svg");
}

.icon_search {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/icon_search.svg");
}

.icon_light_edit {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/icon_light_edit.svg");
}

.icon_profile {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/icon_profile.svg");
}

.icon_list {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/icon_list.svg");
}

.icon_grid {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/icon_grid.svg");
}

.icon_blue_overflow {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/icon_overflow_active.svg");
}

/* padding:1rem 1rem 0.75rem; */
.tile .table {
  display: none;
}

.tile .profile-card-container {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  background-color: #FFFFFF;
  box-shadow: 1px 1px 5px #b5b4c5;
  margin: 0.75rem 0 0.75rem 0;
  box-sizing: border-box;
  padding: 1rem 1rem 0.75rem;
  background-color: #f9f9fb;
  border: solid 1px transparent;
  text-align: center;
}

.tile .profile-card-container:hover, .tile .profile-card-container.active, .tile .profile-card-container.selected {
  background-color: #FFFFFF;
  cursor: pointer;
  border: solid 1px #009AD9;
}

.tile .profile-card-container:hover h4, .tile .profile-card-container:hover p, .tile .profile-card-container.active h4, .tile .profile-card-container.active p, .tile .profile-card-container.selected h4, .tile .profile-card-container.selected p {
  color: #005F9E;
}

.tile .profile-card-container > div.name {
  display: none;
}

.tile .profile-card-container h4 {
  font-size: 14px;
  font-weight: 600;
  color: #AEAEB6;
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tile .profile-card-container p {
  font-size: 12px;
  color: #8C8B96;
  margin: 0;
  padding: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tile .profile-card-container p.link {
  color: #009AD9;
}

.tile .profile-card-container .profile-card-footer {
  margin-top: 0.75rem;
  text-align: left;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  margin-right: -10px;
}

.avatar-wrapper {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}

.list {
  display: inherit;
  margin: 0 0.75rem 0.75rem 0.75rem;
}

.list .profile-card-container {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  box-shadow: none;
  border-bottom: solid 1px #EAEAEF;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  max-width: inherit;
  padding: 0;
  box-sizing: border-box;
  text-align: inherit;
  margin: 0;
  padding-left: 1rem;
  padding-right: 1rem;
  min-height: 3.75rem;
}

.list .profile-card-container > div {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  flex-grow: 1;
  flex-basis: 0;
  padding: 1rem;
  word-break: break-word;
  min-width: 20px;
  width: 100px;
}

.list .profile-card-container > div.avatar-wrapper {
  max-width: 100px;
  padding: 0;
}

.list .profile-card-container h4 {
  font-size: 14px;
  font-weight: 600;
  color: #6A6976;
  margin: 0;
  padding: 0;
}

.list .profile-card-container p {
  font-size: 12px;
  color: #6A6976;
  margin: 0;
  padding: 0;
}

.list .profile-card-container .profile-card-footer {
  margin-top: 0;
  padding: 0;
  justify-content: flex-end;
  flex-grow: 0;
}

.list .profile-card-container:hover {
  background-color: #009AD9;
  cursor: pointer;
}

.list .profile-card-container:hover h4, .list .profile-card-container:hover p {
  color: #FFFFFF;
}

.list .profile-card-container:hover i {
  filter: grayscale(100%) brightness(5);
}

.list .profile-card-container .profile-card-role {
  display: none;
}

.list .profile-card-container.thead {
  background-color: #f9f9fb;
  font-weight: 600;
}

.list .profile-card-container.thead > div .data {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.875rem;
}

.list .profile-card-container.thead > div:last-child {
  flex: 0;
}

.page-header {
  margin: 0.75rem;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  /*   h2{
    font-size: $font-page-header;
    line-height: $font-page-header;
    color: $col_trimble_blue_mid;
    font-weight: 300;
  } */
}

.page-header h1 {
  color: #005F9E;
}

.page-header .search {
  margin: 0 0.75rem;
}

.page-header .right {
  margin-left: auto;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
}

.filter-wrapper {
  margin: 0.75rem;
}

.filter-wrapper select {
  width: 264px;
}

@media only screen and (min-width: 993px) and (max-width: 1024px) {
  .profile.tile .col.l2 {
    width: 25%;
    margin-left: auto;
    left: auto;
    right: auto;
  }
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.info-panel {
  margin: 0;
  font-size: 0.75rem;
  padding: 1.25rem;
  box-sizing: border-box;
  background: #FFFFFF;
  border-left: 1px solid #BFBFC6;
}

.info-panel > section {
  margin: 1rem 0 2rem 0;
}

.info-panel > section h2 {
  text-align: center;
  margin-top: 0;
  color: #8C8B96;
  margin-bottom: 0.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 400;
}

.info-panel > section h2.name {
  font-size: 1.25rem;
  color: #6A6976;
}

.info-panel > section .section-title {
  height: 2.5rem;
  line-height: 2.5rem;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
}

.info-panel > section .section-title label {
  color: #8C8B96;
}

.info-panel > section .section-title button {
  display: flex;
}

.info-panel > section ul li.list-item {
  display: flex;
  margin-bottom: 0.75rem;
}

.info-panel > section ul li.list-item:last-child {
  margin-bottom: 0;
}

.info-panel > section ul li.list-item span.value {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
}

.info-panel > section ul li.list-item span.value.role {
  color: #005F9E;
}

.info-panel > section ul li.list-item label.field {
  flex: 1;
  color: #8C8B96;
}

.info-panel > section ul li.list-item-image {
  background: #f9f9fb;
  height: 50px;
  margin-bottom: 0.75rem;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  padding: 0 15px;
}

.info-panel > section ul li.list-item-image .app-icon {
  width: 2.5rem;
  height: 2.5rem;
  border: 2px solid #E2E2E7;
  border-radius: 50%;
  flex: 0 2.5rem;
}

.info-panel > section ul li.list-item-image .app-icon img {
  width: auto;
  height: 100%;
  border-radius: 50%;
}

.info-panel > section ul li.list-item-image .app-details {
  display: flex;
  flex-flow: column nowrap;
  margin-left: 1rem;
  color: #8C8B96;
  min-width: 0;
}

.info-panel > section ul li.list-item-image .app-details .name {
  font-size: 0.875rem;
  font-weight: 600;
  color: #363545;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.info-panel > section ul li.list-item-image .app-status {
  margin-left: auto;
}

/*
Dropdown pane

Dropdown pane from trimble css

Markup:
<div class="dropdown-pane-container">
  <div class="dropdownpane-link"> Click here</div>
  <div class="dropdown-pane">
      <ul class="dropdown-list">
          <li>FORCE LOGOFF</li>
          <li>Remove</li>
          <li>Suspend</li>
      </ul>
  </div>
</div>

Styleguide UI Elements.dropdownpane
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.dropdownpane-link {
  cursor: pointer;
}

.dropdown-pane {
  position: absolute;
  z-index: 10;
  padding: 1.25rem;
  visibility: hidden;
  display: none;
  box-shadow: 1px 1px 5px #b5b4c5;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  background-color: #FFFFFF;
  width: 100%;
  max-width: 10rem;
}

.dropdown-pane.is-open {
  visibility: visible;
  display: block;
}

.dropdown-pane.left {
  left: 0;
}

.dropdown-pane.right {
  right: 0;
}

.dropdown-pane .dropdown-list li {
  font-size: 0.875rem;
  margin-bottom: 1.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dropdown-pane .dropdown-list li:last-child {
  margin-bottom: 0;
}

.dropdown-pane .dropdown-list li:hover, .dropdown-pane .dropdown-list li.active {
  color: #009AD9;
  cursor: pointer;
}

/*
Popup

Popup styles from trimble css

Markup:
<button class="button primary reveal-overlay-link" open-container-id="invite-user-popup">Open popup</button>
<div class="reveal-overlay" id="invite-user-popup">
    <div class="reveal">
        <header>
            <h1>Invite People to this Project</h1>
            <button class="close-button close" aria-label="Close reveal" type="button">
                <i class="i32 icon_close_popup"></i>
            </button>
        </header>
        <section>
        Popup content
        </section>
        <footer>
            <button class="button clear close">Cancel</button>
            <button class="button default">Invite</button>
        </footer>
    </div>
</div>

Styleguide UI Elements.popup
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

/*
Buttons

Buttons styles from trimble css

Markup:
<div>
<button class="button default">default button</button>
</div>
<br/>
<div>
<button class="button small">small button</button>
</div>
<br/>
<div>
<button class="button expanded">expanded button</button>
</div>
<br/>
<div>
<button class="button small">
    <i class="icon add"></i>icon button
</button> 
</div>
<br/>
<div>
<button class="button default" disabled="disabled">Disabled button</button>
</div>
<br/>
<div>
<button class="button secondary">Secondary button</button>
</div>

Styleguide Form Elements.button
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

button, .button {
  background-color: #005F9E;
  color: #FFFFFF;
  outline: 0;
  border: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  text-transform: uppercase;
  margin-left: 0.5rem;
  font-size: 0.75rem;
  display: flex;
  cursor: pointer;
  justify-content: center;
}

button:hover, .button:hover {
  background-color: #197CB6;
}

button:focus, .button:focus {
  background-color: #07599B;
}

button.clear, .button.clear {
  height: 40px;
  line-height: 40px;
  background: none;
  border: none;
  padding: 0;
  color: #005F9E;
  font-size: 0.875rem;
}

button.clear:hover, .button.clear:hover {
  background-color: transparent;
}

button.clear:focus, .button.clear:focus {
  background-color: transparent;
}

button.default, .button.default {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
}

button.small, .button.small {
  height: 32px;
  line-height: 32px;
  padding: 0 1rem;
}

button.expanded, .button.expanded {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
  width: 100%;
}

button.secondary, .button.secondary {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
  background-color: #363545;
  color: #F3F3F7;
}

button.icon-w-text, .button.icon-w-text {
  padding-left: 0;
}

button i, .button i {
  width: 32px;
  height: 32px;
}

button i.add, .button i.add {
  background-image: url("../images/Icons/icon_add.svg");
  background-repeat: no-repeat;
  filter: grayscale(100%) brightness(5);
}

.disabled, .button:disabled, button[disabled] {
  opacity: .4;
  cursor: not-allowed;
}

.reveal-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1005;
  display: none;
  background-color: rgba(10, 10, 10, 0.45);
  overflow-y: scroll;
}

.reveal {
  z-index: 1006;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: block;
  padding: 2rem;
  box-shadow: 1px 1px 10px #8a89a4;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  background-color: #F3F3F7;
  position: relative;
  margin-right: auto;
  margin-left: auto;
  top: 100px;
  width: 600px;
  max-width: 75rem;
}

.reveal header {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem;
}

.reveal h1 {
  font-size: 1.25rem;
  color: #005F9E;
  font-weight: 600;
}

.reveal footer {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  margin-top: 2.5rem;
  margin-bottom: 0.5rem;
}

.reveal footer button {
  flex: 1 1 auto;
}

.content-list-view {
  background-color: #FFFFFF;
  max-height: 17.5rem;
  overflow-y: auto;
  margin-bottom: 2.25rem;
}

.content-list-view li {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  padding: 0 0.875rem;
  height: 3.5rem;
}

.content-list-view li:nth-child(even) {
  background-color: #f9f9fb;
}

.content-list-view li .avatar-medium {
  flex: 0 0 auto;
}

.content-list-view li .name, .content-list-view li .company {
  padding: 0 0.75rem;
  flex: 1 1 auto;
  width: 7rem;
}

.close-button {
  background-color: #005F9E;
  color: #FFFFFF;
  outline: 0;
  border: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  text-transform: uppercase;
  margin-left: 0.5rem;
  font-size: 0.75rem;
  display: flex;
  cursor: pointer;
  justify-content: center;
  height: 40px;
  line-height: 40px;
  background: none;
  border: none;
  padding: 0;
  color: #005F9E;
  font-size: 0.875rem;
}

.close-button:hover {
  background-color: #197CB6;
}

.close-button:focus {
  background-color: #07599B;
}

.close-button:hover {
  background-color: transparent;
}

.close-button:focus {
  background-color: transparent;
}

.icon_close_popup {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/close_popup.svg");
}

.icon_esc {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/icon_close.svg");
}

/*
Switch

Switch styles from trimble css

Markup:
Switch:
<div class="switch">
        <input class="switch-input" id="exampleSwitch" type="checkbox" name="exampleSwitch">
        <label class="switch-paddle" for="exampleSwitch">
            &nbsp;
        </label>
</div>

Styleguide UI Elements.switch
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.switch {
  position: relative;
  outline: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.switch-input {
  position: absolute !important;
  margin-bottom: 0;
  opacity: 0;
}

input + .switch-paddle {
  margin: 0;
}

input:checked ~ .switch-paddle {
  background: #005F9E;
}

input:checked ~ .switch-paddle::after {
  left: 1.6rem;
}

.switch-paddle {
  position: relative;
  display: block;
  width: 2.75rem;
  height: 1.25rem;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  border-radius: 20px;
  background: #D0D0D7;
  -webkit-transition: all 0.25s ease-out;
  transition: all 0.25s ease-out;
  font-weight: inherit;
  color: inherit;
  cursor: pointer;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.switch-paddle::after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  border-radius: 50%;
  background: #FFFFFF;
  -webkit-transition: all 0.25s ease-out;
  transition: all 0.25s ease-out;
  content: '';
}

.switch-label {
  margin-left: 1rem;
  color: #6A6976;
}

/*
Accordion menu

Accordion menu styles from trimble css

Markup:
<ul class="accordion">
  <li class="accordion-menu">
    <a href="#">Item 1</a>
    <ul class="accordion-menu-container">
      <li class="accordion-menu">
        <a href="#">Item 11</a>
        <ul class="accordion-menu-container">
          <li><a href="#">Item 111</a></li>
          <li><a href="#">Item 112</a></li>
        </ul>
      </li>
      <li><a href="#">Item 12</a></li>
      <li><a href="#">Item 13</a></li>
    </ul>
  </li>
  <li class="accordion-menu">
    <a href="#">Item 2</a>
    <ul class="accordion-menu-container">
      <li><a href="#">Item 21</a></li>
    </ul>
  </li>
  <li class="accordion-menu">
    <a href="#">Item 3</a>
  </li>
</ul>

Styleguide UI Elements.accordionmenu
*/
/*
Accordion panel

Accordion panel styles from trimble css

Markup:
<div class="info-panel">
<section>
		<div class="section-title accordion accordion-panel">
			<label>Details</label>
		</div>
		<div class="accordion-content" style="max-height: 75px;">
			<ul>
				<li class="list-item">
					<label class="field">Email:</label>
					<span class="value">keysersoze@yahoo.com</span>
				</li>
				<li class="list-item">
					<label class="field">Phone:</label>
				<span class="value">001-303-709-9207</span>
				</li>
				<li class="list-item">
					<label class="field">Time Zone:</label>
				<span class="value">MST</span>
				</li>
			</ul>
		</div>
	</section>
	<section>
		<div class="section-title accordion accordion-panel">
			<label>Projects</label>
		</div>
		<div class="accordion-content">
			<ul>
				<li class="list-item-image">
					<div class="app-icon">
						<img src="../src/images/building.jpg" alt="">
					</div>
					<div class="app-details">
						<span class="name">Trimble Building</span>
						<span>Owner</span>
					</div>
				</li>
				<li class="list-item-image">
					<div class="app-icon">
						<img src="../src/images/river.jpg" alt="">
					</div>
					<div class="app-details">
						<span class="name">Riverfront Overpass</span>
						<span>Contributor</span>
					</div>
				</li>
				<li class="list-item-image">
					<div class="app-icon">
						<img src="../src/images/shopping.jpg" alt="">
					</div>
					<div class="app-details">
						<span class="name">Downtown Shopping Mall</span>
						<span>Contributor</span>
					</div>
				</li>
			</ul>
		</div>
	</section>
</div>

Styleguide UI Elements.accordionpanel
*/
.accordion .accordion-menu {
  padding: 0;
  margin: 0;
}

.accordion .accordion-menu a {
  text-decoration: none;
  cursor: pointer;
}

.accordion .accordion-menu li {
  margin: 0.625rem 0;
}

.accordion .accordion-menu .accordion-menu-container {
  padding-left: 1.25rem;
  margin: 0.625rem 0;
  display: none;
}

.accordion .accordion-menu .accordion-menu-container.is-visible {
  display: block;
  height: auto;
}

.accordion.accordion-panel {
  cursor: pointer;
  background: url("../images/Icons/add_default.svg") no-repeat right;
}

.accordion.accordion-panel.active {
  background: url("../images/Icons/remove_default.svg") no-repeat right;
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  display: none;
}

/*
Tooltip from css

Tooltip from trimble css

Markup:
<div class="tooltip">Hover over me - Left tooltip
  <span class="tooltip-text">Tooltip text</span>
</div><br/>
<div class="tooltip">Hover over me - Right tooltip
  <span class="tooltip-text right">Tooltip text</span>
</div><br/>
<div class="tooltip-container">
  <input type="text" value="error field" style="width:200px;"/>
  <span class="tooltip-text">Tooltip text</span>
</div>

Styleguide UI Elements.tooltip
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.tooltip-text {
  visibility: hidden;
  width: 140px;
  background-color: #000000;
  color: #FFFFFF;
  text-align: center;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  border-radius: 6px;
  padding: 5px 0;
  position: absolute;
  z-index: 1;
  right: -130px;
}

.tooltip-text.right {
  right: 0;
  left: -10px;
}

.tooltip-text::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent #000000 transparent transparent;
}

.tooltip-text.right::after {
  left: 100%;
  right: 0;
  border-color: transparent transparent transparent #000000;
}

.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted #000000;
}

.tooltip:hover .tooltip-text {
  visibility: visible;
}

/*
Project Tile

Markup:
<div class="row tile projects">
<div class="col s12 m3 l2 xs12">
<div class="media-object">
        <div class="thumbnail-wrapper">
                <div class="thumbnail" style="background-image:url(https://www.bing.com/az/hprichbg/rb/FishingWarehouses_EN-IN11622673825_1920x1080.jpg)">                                                                
                </div> 
        </div>                                                          
        <div class="media-object-section">
                <div class="media-object-details">
                    <h4>Trimble Building</h4>
                    <p>Owner: Acme Co</p>
                </div>
                <div class="owner"><p>Acme Co</p></div>
                <div class="update"><p>02/03/2018</p></div>
                <div class="media-object-edit">
                    <ul>
                        <li class="dropdown-pane-container">
                            <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                            <div class="dropdown-pane is-open">
                                <ul class="dropdown-list">
                                    <li>FORCE LOGOFF</li>
                                    <li>Remove</li>
                                    <li>Suspend</li>
                                </ul>                                        
                            </div>
                        </li>
                    </ul>       
                </div>
        </div>
        <div class="owner"><p>Acme Co</p></div>
        <div class="update"><p>02/03/2018</p></div>      
        <div class="media-object-edit">
                    <ul>
                        <li class="dropdown-pane-container">
                            <button class="clear dropdownpane-link"><i class="i32 icon_blue_overflow"></i></button>
                            <div class="dropdown-pane is-open">
                                <ul class="dropdown-list">
                                    <li>FORCE LOGOFF</li>
                                    <li>Remove</li>
                                    <li>Suspend</li>
                                </ul>                                        
                            </div>
                        </li>
                    </ul>       
        </div>                          
</div>
</div>
</div>

Styleguide UI Elements.project-tile
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

/*
Avatar

Avatar styles from trimble css

Markup:
Avatar:
<div class="avatar">
	<!-- <img src="" alt=""> -->
	<i class="i64 icon_solid_user"></i>
	<div class="edit-avatar">
		<i class="i16 icon_line_edit"></i>
	</div>
</div>

Styleguide UI Elements.avatar
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

.avatar {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.avatar img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.avatar img#avatar-output {
  display: none;
}

.avatar .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.avatar .edit-avatar input {
  display: none;
}

.avatar-small {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  width: 1.75rem;
  height: 1.75rem;
  margin-bottom: 0;
  overflow: hidden;
}

.avatar-small img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.avatar-small img#avatar-output {
  display: none;
}

.avatar-small .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.avatar-small .edit-avatar input {
  display: none;
}

.avatar-medium {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  width: 2.25rem;
  height: 2.25rem;
  margin-bottom: 0;
  overflow: hidden;
}

.avatar-medium img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.avatar-medium img#avatar-output {
  display: none;
}

.avatar-medium .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.avatar-medium .edit-avatar input {
  display: none;
}

.card-avatar {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: solid 5px #E2E2E7;
  width: 7.5rem;
  height: 7.5rem;
  margin-bottom: 1rem;
  overflow: hidden;
  box-sizing: border-box;
}

.card-avatar img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.card-avatar img#avatar-output {
  display: none;
}

.card-avatar .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.card-avatar .edit-avatar input {
  display: none;
}

.list .card-avatar {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  width: 1.75rem;
  height: 1.75rem;
  margin-bottom: 0;
  overflow: hidden;
}

.list .card-avatar img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.list .card-avatar img#avatar-output {
  display: none;
}

.list .card-avatar .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.list .card-avatar .edit-avatar input {
  display: none;
}

.tile .media-object {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  background-color: #FFFFFF;
  box-shadow: 1px 1px 5px #b5b4c5;
  margin: 0.75rem 0 0.75rem 0;
  box-sizing: border-box;
  height: 11.25rem;
}

.tile .media-object .thumbnail-wrapper {
  height: 100%;
  max-height: 130px;
}

.tile .media-object .thumbnail {
  max-height: 130px;
  background-size: cover;
  height: 100%;
}

.tile .media-object .media-object-edit {
  display: none;
}

.tile .media-object .media-object-section {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  height: 3.125rem;
  padding-left: 1rem;
  padding-right: 0;
}

.tile .media-object .media-object-section .media-object-details {
  overflow: hidden;
}

.tile .media-object .media-object-section .media-object-details h4, .tile .media-object .media-object-section .media-object-details p {
  color: #363545;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tile .media-object .media-object-section .media-object-details p {
  font-size: 0.75rem;
}

.tile .media-object .media-object-section .media-object-edit {
  display: block;
}

.tile .media-object .owner, .tile .media-object .update {
  display: none;
}

.list .media-object {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  box-shadow: none;
  border-bottom: solid 1px #EAEAEF;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  max-width: inherit;
  padding: 0;
  box-sizing: border-box;
  text-align: inherit;
  margin: 0;
  min-height: 3.75rem;
}

.list .media-object > div {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  flex-grow: 1;
  flex-basis: 0;
  padding: 1rem;
  word-break: break-word;
  min-width: 20px;
  width: 100px;
}

.list .media-object > div.thumbnail-wrapper {
  max-width: 100px;
}

.list .media-object > div.thumbnail-wrapper .thumbnail {
  position: relative;
  border-radius: 50%;
  border: solid 1px #7B7A86;
  background-color: #F3F3F7;
  width: 7rem;
  height: 7rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  width: 2.5rem;
  height: 2.5rem;
  margin-bottom: 0;
  overflow: hidden;
  flex: 0 0 auto;
  background-size: cover;
}

.list .media-object > div.thumbnail-wrapper .thumbnail img {
  border-radius: 50%;
  width: auto;
  height: 100%;
}

.list .media-object > div.thumbnail-wrapper .thumbnail img#avatar-output {
  display: none;
}

.list .media-object > div.thumbnail-wrapper .thumbnail .edit-avatar {
  position: absolute;
  bottom: 8px;
  right: 3px;
  border-radius: 50%;
  background-color: #009AD9;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.list .media-object > div.thumbnail-wrapper .thumbnail .edit-avatar input {
  display: none;
}

.list .media-object > div.media-object-edit {
  flex: 0 0 auto;
  justify-content: flex-end;
}

.list .media-object > div.owner p, .list .media-object > div.update p {
  color: #7B7A86;
  font-size: 0.875rem;
}

.list .media-object .media-object-section {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  height: 3.125rem;
  padding-left: 1rem;
  padding-right: 1rem;
}

.list .media-object .media-object-section .media-object-details {
  overflow: hidden;
}

.list .media-object .media-object-section .media-object-details h4 {
  color: #363545;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.list .media-object .media-object-section .media-object-details p {
  display: none;
}

.list .media-object .media-object-section .owner, .list .media-object .media-object-section .update, .list .media-object .media-object-section .media-object-edit {
  display: none;
}

.list .media-object:hover, .list .media-object.active, .list .media-object:active {
  background-color: #009AD9;
  cursor: pointer;
}

.list .media-object:hover .media-object-section .media-object-details h4, .list .media-object.active .media-object-section .media-object-details h4, .list .media-object:active .media-object-section .media-object-details h4 {
  color: #FFFFFF;
}

.list .media-object:hover > div p, .list .media-object.active > div p, .list .media-object:active > div p {
  color: #FFFFFF;
}

.list .media-object:hover i, .list .media-object.active i, .list .media-object:active i {
  filter: grayscale(100%) brightness(5);
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

/*
Buttons

Buttons styles from trimble css

Markup:
<div>
<button class="button default">default button</button>
</div>
<br/>
<div>
<button class="button small">small button</button>
</div>
<br/>
<div>
<button class="button expanded">expanded button</button>
</div>
<br/>
<div>
<button class="button small">
    <i class="icon add"></i>icon button
</button> 
</div>
<br/>
<div>
<button class="button default" disabled="disabled">Disabled button</button>
</div>
<br/>
<div>
<button class="button secondary">Secondary button</button>
</div>

Styleguide Form Elements.button
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

button, .button {
  background-color: #005F9E;
  color: #FFFFFF;
  outline: 0;
  border: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  text-transform: uppercase;
  margin-left: 0.5rem;
  font-size: 0.75rem;
  display: flex;
  cursor: pointer;
  justify-content: center;
}

button:hover, .button:hover {
  background-color: #197CB6;
}

button:focus, .button:focus {
  background-color: #07599B;
}

button.clear, .button.clear {
  height: 40px;
  line-height: 40px;
  background: none;
  border: none;
  padding: 0;
  color: #005F9E;
  font-size: 0.875rem;
}

button.clear:hover, .button.clear:hover {
  background-color: transparent;
}

button.clear:focus, .button.clear:focus {
  background-color: transparent;
}

button.default, .button.default {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
}

button.small, .button.small {
  height: 32px;
  line-height: 32px;
  padding: 0 1rem;
}

button.expanded, .button.expanded {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
  width: 100%;
}

button.secondary, .button.secondary {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
  background-color: #363545;
  color: #F3F3F7;
}

button.icon-w-text, .button.icon-w-text {
  padding-left: 0;
}

button i, .button i {
  width: 32px;
  height: 32px;
}

button i.add, .button i.add {
  background-image: url("../images/Icons/icon_add.svg");
  background-repeat: no-repeat;
  filter: grayscale(100%) brightness(5);
}

.disabled, .button:disabled, button[disabled] {
  opacity: .4;
  cursor: not-allowed;
}

/*
Popup

Popup styles from trimble css

Markup:
<button class="button primary reveal-overlay-link" open-container-id="invite-user-popup">Open popup</button>
<div class="reveal-overlay" id="invite-user-popup">
    <div class="reveal">
        <header>
            <h1>Invite People to this Project</h1>
            <button class="close-button close" aria-label="Close reveal" type="button">
                <i class="i32 icon_close_popup"></i>
            </button>
        </header>
        <section>
        Popup content
        </section>
        <footer>
            <button class="button clear close">Cancel</button>
            <button class="button default">Invite</button>
        </footer>
    </div>
</div>

Styleguide UI Elements.popup
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

/*
Buttons

Buttons styles from trimble css

Markup:
<div>
<button class="button default">default button</button>
</div>
<br/>
<div>
<button class="button small">small button</button>
</div>
<br/>
<div>
<button class="button expanded">expanded button</button>
</div>
<br/>
<div>
<button class="button small">
    <i class="icon add"></i>icon button
</button> 
</div>
<br/>
<div>
<button class="button default" disabled="disabled">Disabled button</button>
</div>
<br/>
<div>
<button class="button secondary">Secondary button</button>
</div>

Styleguide Form Elements.button
*/
h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

button, .button {
  background-color: #005F9E;
  color: #FFFFFF;
  outline: 0;
  border: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  text-transform: uppercase;
  margin-left: 0.5rem;
  font-size: 0.75rem;
  display: flex;
  cursor: pointer;
  justify-content: center;
}

button:hover, .button:hover {
  background-color: #197CB6;
}

button:focus, .button:focus {
  background-color: #07599B;
}

button.clear, .button.clear {
  height: 40px;
  line-height: 40px;
  background: none;
  border: none;
  padding: 0;
  color: #005F9E;
  font-size: 0.875rem;
}

button.clear:hover, .button.clear:hover {
  background-color: transparent;
}

button.clear:focus, .button.clear:focus {
  background-color: transparent;
}

button.default, .button.default {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
}

button.small, .button.small {
  height: 32px;
  line-height: 32px;
  padding: 0 1rem;
}

button.expanded, .button.expanded {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
  width: 100%;
}

button.secondary, .button.secondary {
  height: 40px;
  line-height: 40px;
  padding: 0 2rem;
  font-size: 0.875rem;
  background-color: #363545;
  color: #F3F3F7;
}

button.icon-w-text, .button.icon-w-text {
  padding-left: 0;
}

button i, .button i {
  width: 32px;
  height: 32px;
}

button i.add, .button i.add {
  background-image: url("../images/Icons/icon_add.svg");
  background-repeat: no-repeat;
  filter: grayscale(100%) brightness(5);
}

.disabled, .button:disabled, button[disabled] {
  opacity: .4;
  cursor: not-allowed;
}

.reveal-overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1005;
  display: none;
  background-color: rgba(10, 10, 10, 0.45);
  overflow-y: scroll;
}

.reveal {
  z-index: 1006;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  display: block;
  padding: 2rem;
  box-shadow: 1px 1px 10px #8a89a4;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
  background-color: #F3F3F7;
  position: relative;
  margin-right: auto;
  margin-left: auto;
  top: 100px;
  width: 600px;
  max-width: 75rem;
}

.reveal header {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 2rem;
}

.reveal h1 {
  font-size: 1.25rem;
  color: #005F9E;
  font-weight: 600;
}

.reveal footer {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  margin-top: 2.5rem;
  margin-bottom: 0.5rem;
}

.reveal footer button {
  flex: 1 1 auto;
}

.content-list-view {
  background-color: #FFFFFF;
  max-height: 17.5rem;
  overflow-y: auto;
  margin-bottom: 2.25rem;
}

.content-list-view li {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: space-between;
  padding: 0 0.875rem;
  height: 3.5rem;
}

.content-list-view li:nth-child(even) {
  background-color: #f9f9fb;
}

.content-list-view li .avatar-medium {
  flex: 0 0 auto;
}

.content-list-view li .name, .content-list-view li .company {
  padding: 0 0.75rem;
  flex: 1 1 auto;
  width: 7rem;
}

.close-button {
  background-color: #005F9E;
  color: #FFFFFF;
  outline: 0;
  border: none;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  text-transform: uppercase;
  margin-left: 0.5rem;
  font-size: 0.75rem;
  display: flex;
  cursor: pointer;
  justify-content: center;
  height: 40px;
  line-height: 40px;
  background: none;
  border: none;
  padding: 0;
  color: #005F9E;
  font-size: 0.875rem;
}

.close-button:hover {
  background-color: #197CB6;
}

.close-button:focus {
  background-color: #07599B;
}

.close-button:hover {
  background-color: transparent;
}

.close-button:focus {
  background-color: transparent;
}

.icon_close_popup {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/close_popup.svg");
}

.icon_esc {
  background-repeat: no-repeat;
  background-image: url("../images/Icons/icon_close.svg");
}

.pagepopup-overlay {
  position: fixed;
  margin: 0 !important;
  padding: 0 !important;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1005;
  display: none;
  background-color: #F3F3F7;
  overflow-y: scroll;
}

.show {
  display: block;
}

.pagepopup-title {
  margin: 0 auto;
  margin-top: 50px;
  text-align: center;
  text-transform: uppercase;
}

.pagepopup-overlay .pagepopup .close-button {
  position: absolute;
  top: 30px;
  right: 10px;
}

.addproject-popup {
  width: 600px;
  height: 600px;
  margin: 0 auto;
}

.addproject-popup .addproject-navbar {
  width: 278px;
  height: 60px;
  margin: 0 auto;
  margin-top: 50px;
}

.addproject-popup .addproject-content {
  margin-top: 60px;
}

.addproject-popup .addproject-navbar .circle.active {
  background-color: #009AD9;
  border: 1px solid #009AD9;
  color: #FFFFFF;
}

.addproject-popup .addproject-navbar .circle {
  height: 48px;
  width: 48px;
  float: left;
  background-color: #FFFFFF;
  border: 1px solid #D0D0D7;
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  -ms-border-radius: 25px;
  border-radius: 25px;
  color: #7B7A86;
  font-size: 1.5rem;
  font-weight: 300;
  padding-left: 17px;
  padding-top: 6px;
  cursor: pointer;
}

.addproject-popup .addproject-navbar .circle-line.active {
  background-color: #009AD9;
}

.addproject-popup .addproject-navbar .circle-line {
  width: 67px;
  height: 1px;
  background-color: #D0D0D7;
  float: left;
  margin-top: 23px;
}

.addproject-popup .addproject-content .addproject-page1 .input-projectname {
  width: 400px;
  margin: 0 auto;
}

.addproject-popup .addproject-content .addproject-page1 .input-projectimage {
  margin: 27px;
  margin-top: 50px;
}

.addproject-popup .addproject-content .addproject-page1 .input-projectimage .file-upload {
  padding: 21px;
}

.file-upload {
  border: 1px dashed #8C8B96;
}

.uploader {
  position: relative;
}

.file-upload .drop-content {
  font-weight: 700;
  text-transform: uppercase;
  font-size: 30px;
  color: #363545;
  padding: 7px;
}

.supported-file-formats {
  color: #8C8B96;
  font-size: 12px;
  line-height: 16px;
  text-align: center;
  display: block;
  padding: 7px;
}

.file-upload .browse-files {
  font-size: 14px;
  font-weight: 700;
  padding: 7px;
  text-decoration: underline;
  color: #009AD9;
  display: block;
}

.drop-error {
  color: #A51D25;
}

.drop-error, .supported-file-formats {
  font-size: 0.75rem;
  line-height: 1rem;
  text-align: center;
  display: block;
}

.addproject-popup .addproject-content .addproject-page1 .button-section.fixed-button {
  margin-right: 23px;
  margin-top: 233px;
}

.button-section {
  display: flex;
  min-height: 35px;
  margin-top: 20px;
  margin-right: 7px;
  margin-bottom: 10px;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.align-center {
  text-align: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.file-upload input[type=file] {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  opacity: 0;
  width: 100%;
  cursor: pointer;
}

.error-messages {
  font-size: 0.75rem;
}

.error-messages.error {
  color: #A51D25;
}

.addproject-popup .addproject-content .addproject-page1 .button-section.fixed-button .button {
  width: 180px;
}

.create-project {
  display: flex;
  text-align: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 60px;
}

.pagepopup-overlay .pagepopup .close-button .close-button-text {
  top: 40px;
  font-size: 1.25rem;
  font-weight: 300;
  position: absolute;
  text-transform: capitalize;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

.page-header h1 {
  margin: 1rem 0;
  font-size: 1.5rem;
  font-weight: 300;
}

h2 {
  font-size: 1.25rem;
}

h3 {
  font-size: 1rem;
}

h4, p {
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

h5 {
  font-size: 0.75rem;
}

h4 {
  font-weight: 600;
}

/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800'); */
/* @mixin border-radius{
  border-radius: 2px;
} */
/* box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2); */
.end {
  display: flex;
  justify-content: flex-end;
}

.align-center {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: center;
}

header {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  background-color: #FFFFFF;
  min-height: 55px;
  box-shadow: 1px 1px 5px #b5b4c5;
  width: 100%;
  top: 0;
  position: fixed;
  z-index: 1021;
  padding: 0 1rem;
  justify-content: space-between;
}

header .logo {
  width: 7.25rem;
}

header ~ section {
  margin-top: 5rem;
}