/*Lucid Particle Components

*/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,600,700,900,200italic,300italic,400italic,600italic,700italic,900italic);
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
body {
  line-height: 1;
}
ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
*,
*:before,
*:after {
  box-sizing: border-box;
}
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}
body {
  font-family: 'Source Sans Pro', sans-serif;
  color: #5a5a5a;
}
img {
  max-width: 100%;
}
input {
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 14px;
}
.lucid-input-wrapper {
  display: inline-block;
  vertical-align: top;
  width: 100%;
}
.lucid-input-wrapper .lucid-input {
  background: #fff;
  padding: 0 3px;
  border: 1px solid #A5A5A5;
  border-radius: 3px;
  box-sizing: border-box;
  font-size: 14px;
  height: 22px;
  color: #3D4752;
  width: 100%;
  outline: none;
  font-family: 'Source Sans Pro', sans-serif;
  line-height: 22px;
  -webkit-transition: background 0.15s ease-in-out;
  transition: background 0.15s ease-in-out;
}
.lucid-input-wrapper .lucid-input::-webkit-input-placeholder {
  font-style: italic;
  color: #A5A5A5;
}
.lucid-input-wrapper .lucid-input:focus {
  border-color: #29AAE1;
}
.lucid-input-wrapper[disabled] .lucid-input {
  background: #F0F0F0;
  color: #A5A5A5;
}
.input-label {
  font-size: 10px;
  line-height: 10px;
  margin-top: 5px;
  text-transform: uppercase;
  text-align: left;
  letter-spacing: .5px;
  color: #5a5a5a;
}
.reversed-text .input-label {
  color: #FFF;
}
.lucid-input-stepper-wrapper {
  display: inline-block;
  vertical-align: top;
}
.lucid-input-stepper-wrapper .lucid-input-stepper {
  position: relative;
  font-size: 14px;
  box-sizing: border-box;
  display: inline-block;
  font-family: 'Source Sans Pro', sans-serif;
  vertical-align: top;
  background: #FFF;
  border: 1px solid #A5A5A5;
  border-radius: 3px;
  height: 22px;
  padding: 0 2px 0 6px;
}
.lucid-input-stepper-wrapper .lucid-input-stepper > input {
  background: transparent;
  padding: 0;
  border: none;
  box-sizing: border-box;
  font-size: 14px;
  height: 20px;
  color: #5A5A5A;
  width: 100%;
  outline: none;
  font-family: 'Source Sans Pro', sans-serif;
  -webkit-transition: background 0.15s ease-in-out;
  transition: background 0.15s ease-in-out;
  padding-right: 10px;
  text-align: left;
}
.lucid-input-stepper-wrapper .lucid-input-stepper .lucid-input-unit {
  position: absolute;
  top: 6px;
  right: 13px;
  font-size: 14px;
  color: #3D4752;
}
.lucid-input-stepper-wrapper .lucid-input-stepper .lucid-up,
.lucid-input-stepper-wrapper .lucid-input-stepper .lucid-down {
  position: absolute;
  width: 10px;
  right: 3px;
  cursor: pointer;
}
.lucid-input-stepper-wrapper .lucid-input-stepper .lucid-up {
  top: 0px;
}
.lucid-input-stepper-wrapper .lucid-input-stepper .lucid-up:after {
  content: '';
  position: absolute;
  top: 0;
  right: 2px;
  border: 3px solid transparent;
  border-bottom: 5px solid #828282;
}
.lucid-input-stepper-wrapper .lucid-input-stepper .lucid-down {
  bottom: 0px;
}
.lucid-input-stepper-wrapper .lucid-input-stepper .lucid-down:after {
  content: '';
  position: absolute;
  bottom: 0;
  right: 2px;
  border: 3px solid transparent;
  border-top: 5px solid #828282;
}
.lucid-drawer-wrapper .lucid-wrapper-overflow-hidden {
  overflow: hidden;
}
.lucid-drawer-wrapper .lucid-show-more-drawer-button {
  position: relative;
  background-color: #77818C;
  border-radius: 0 0 5px 5px;
  text-align: center;
  cursor: pointer;
}
.lucid-drawer-wrapper .lucid-show-more-drawer-button .lucid-drawer-center-text {
  display: inline-block;
  position: relative;
  padding-right: 13px;
}
.lucid-drawer-wrapper .lucid-show-more-drawer-button .lucid-drawer-button-text {
  font-size: 14px;
  color: #fff;
  text-align: center;
  height: 25px;
  line-height: 25px;
}
.lucid-drawer-wrapper .lucid-show-more-drawer-button .lucid-drawer-more-icon {
  position: absolute;
  top: 10px;
  right: 0;
  -webkit-transition: 0.25s ease-in-out all;
  transition: 0.25s ease-in-out all;
  font-size: 0;
}
.lucid-drawer-wrapper .lucid-show-more-drawer-button .lucid-drawer-more-icon g {
  fill: #fff;
}
.lucid-drawer-wrapper .lucid-show-more-drawer-button .lucid-drawer-more-icon.lucid-drawer-open {
  -webkit-transform: rotateX(180deg);
          transform: rotateX(180deg);
  -webkit-transform-origin: center;
          transform-origin: center;
}
.lucid-drawer-wrapper .lucid-popover-menu-drawer {
  padding: 10px;
  background: #E6E6E6;
  box-sizing: border-box;
  opacity: 1;
  margin-top: 0;
  -webkit-transition: 0.35s ease-in-out all;
  transition: 0.35s ease-in-out all;
  border-top: 1px solid #D2D2D2;
}
.lucid-drawer-wrapper .lucid-popover-menu-drawer.lucid-drawer-open {
  margin-top: 0px !important;
}
.lucid-drawer-wrapper .lucid-popover-menu-drawer.ng-hide {
  opacity: 0;
}
.lucid-drawer-wrapper .lucid-popover-menu-drawer.ng-hide.top-handle-height {
  height: 0 !important;
  padding: 0;
}
.lucid-drawer-wrapper .lucid-popover-menu-drawer.ng-animate {
  -webkit-transition: 0.35s ease-in-out all;
  transition: 0.35s ease-in-out all;
}
.lucid-drawer-wrapper.top-handle .lucid-show-more-drawer-button {
  border-radius: 0;
}
.lucid-drawer-wrapper.top-handle .lucid-show-more-drawer-button .lucid-drawer-more-icon {
  -webkit-transform: rotateX(180deg);
          transform: rotateX(180deg);
  -webkit-transform-origin: center;
          transform-origin: center;
}
.lucid-drawer-wrapper.top-handle .lucid-show-more-drawer-button .lucid-drawer-more-icon.lucid-drawer-open {
  -webkit-transform: rotateX(0deg);
          transform: rotateX(0deg);
  -webkit-transform-origin: center;
          transform-origin: center;
}
.hide-drawer-handle.lucid-drawer-wrapper .lucid-show-more-drawer-button {
  display: none;
}
.lucid-buttcon-wrapper .lucid-buttcon {
  background: transparent;
  display: inline-block;
  border-radius: 3px;
  position: relative;
  font-size: 0;
  box-sizing: border-box;
  cursor: pointer;
  text-align: center;
}
.lucid-buttcon-wrapper .lucid-buttcon img,
.lucid-buttcon-wrapper .lucid-buttcon svg {
  max-width: 100%;
}
.lucid-buttcon-wrapper .lucid-buttcon .lucid-buttcon-image {
  width: 22px;
  height: 22px;
  display: inline-block;
}
.lucid-buttcon-wrapper .lucid-buttcon .lucid-buttcon-image svg path,
.lucid-buttcon-wrapper .lucid-buttcon .lucid-buttcon-image svg polygon,
.lucid-buttcon-wrapper .lucid-buttcon .lucid-buttcon-image svg rect {
  -webkit-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}
.lucid-buttcon-wrapper .lucid-buttcon .badge {
  position: absolute;
  width: 16px;
  height: 16px;
  border-radius: 8px;
  background: #ED6058;
  color: #fff;
  font-size: 12px;
  line-height: 16px;
  bottom: -4px;
  right: -5px;
  -webkit-transform: scale(1);
          transform: scale(1);
}
.lucid-buttcon-wrapper .lucid-buttcon .badge.ng-enter {
  -webkit-transform: scale(0.01);
          transform: scale(0.01);
  opacity: 0;
}
.lucid-buttcon-wrapper .lucid-buttcon .badge.ng-enter-active {
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: 1;
}
.lucid-buttcon-wrapper .lucid-buttcon .badge.ng-leave {
  -webkit-transform: scale(1);
          transform: scale(1);
  opacity: 1;
}
.lucid-buttcon-wrapper .lucid-buttcon .badge.ng-leave-active {
  -webkit-transform: scale(0.01);
          transform: scale(0.01);
  opacity: 0;
}
.lucid-buttcon-wrapper .lucid-buttcon .badge.ng-animate {
  -webkit-transition: .15s all linear;
  transition: .15s all linear;
}
.lucid-buttcon-wrapper > .input-label {
  text-align: center;
}
.lucid-buttcon-wrapper.active .lucid-buttcon-image svg path,
.lucid-buttcon-wrapper.active .lucid-buttcon-image svg polygon,
.lucid-buttcon-wrapper.active .lucid-buttcon-image svg rect {
  fill: #29AAE1;
}
.lucid-buttcon-wrapper.active .input-label {
  color: #29AAE1;
}
.lucid-buttcon-wrapper {
  position: relative;
  display: inline-block;
}
.lucid-popover-menu {
  background-color: #F0F0F0;
  border-radius: 4px;
  box-shadow: 1px 3px 10px rgba(0, 0, 0, 0.25);
  position: absolute;
  z-index: 10;
  top: 50px;
  margin-top: 0;
  opacity: 1;
  text-align: left;
}
.lucid-popover-menu:after {
  content: '';
  border-bottom: 10px #F0F0F0 solid;
  border-left: 8px transparent solid;
  border-right: 8px transparent solid;
  position: absolute;
  top: -10px;
  left: 50%;
  margin-left: -7px;
}
.lucid-popover-menu.ng-enter {
  margin-top: -7px;
  opacity: 0;
}
.lucid-popover-menu.ng-enter-active {
  margin-top: 0;
  opacity: 1;
}
.lucid-popover-menu.ng-leave {
  margin-top: 0;
  opacity: 1;
}
.lucid-popover-menu.ng-leave-active {
  margin-top: -7px;
  opacity: 0;
}
.lucid-popover-menu.ng-animate {
  -webkit-transition: .1s all linear;
  transition: .1s all linear;
}
.lucid-popover-menu ul {
  padding: 0;
  margin: 0;
}
.lucid-popover-menu .lucid-wrapper-overflow-hidden {
  overflow: hidden;
  border-radius: 3px;
}
.lucid-popover-menu .lucid-buttcon.active {
  background-color: #fff;
}
.popover-list .lucid-popover-menu {
  background: #FFF;
}
.popover-list .lucid-popover-menu:after {
  border-bottom-color: #FFF;
}
.popover-list .lucid-select-dropdown {
  padding: 2px;
}
.popover-list .lucid-select-dropdown li {
  font-size: 14px;
  cursor: pointer;
  padding: 5px 10px;
  text-align: left;
  -webkit-transition: 0.1s ease-in-out all;
  transition: 0.1s ease-in-out all;
  position: relative;
  color: #5A5A5A;
  margin-bottom: 4px;
}
.popover-list .lucid-select-dropdown li:last-child {
  margin-bottom: 0;
}
.popover-list .lucid-select-dropdown li:hover {
  background: #F0F0F0;
}
.lucid-color-picker .lucid-popover-menu {
  font-size: 0;
  box-sizing: border-box;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top {
  padding: 15px 15px 12px;
  border-radius: 5px 5px 0 0;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch {
  float: right;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch.active {
  background: #FFF;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch-toggle {
  position: relative;
  height: 28px;
  font-size: 12px;
  line-height: 20px;
  padding: 0 10px;
  display: inline-block;
  background-color: #fff;
  cursor: pointer;
  border-left: 1px solid #D2D2D2;
  box-sizing: border-box;
  width: 63.333px;
  text-align: center;
  border: 1px solid #C7C7C7;
  margin-left: -1px;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch-toggle:first-child {
  border-radius: 3px 0 0 3px;
  margin-left: 0;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch-toggle:last-child {
  border-radius: 0 3px 3px 0;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch-toggle.active {
  box-shadow: 0 0 4px #29AAE1;
  z-index: 1;
  border: 1px solid #29AAE1;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch-toggle:hover {
  background-color: #fff;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch-toggle .swatch {
  height: 6px;
  position: absolute;
  left: 2px;
  right: 2px;
  bottom: 2px;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch-toggle .swatch.lucid-transparent-swatch {
  background: url(https://lucidsoftware.github.io/particle/components/2.0/color-picker/icon-transparent-grid.svg) #FFF !important;
  background-size: 6px !important;
}
.lucid-color-picker .lucid-popover-menu .lucid-swatch-top .lucid-swatch-toggle.lucid-disabled {
  background: transparent;
  color: #A5A5A5;
}
.lucid-color-picker .lucid-popover-menu .swatch-colors {
  border-top: 1px solid #D2D2D2;
  padding: 15px;
}
.lucid-color-picker .lucid-popover-menu .lucid-colorpicker-wrap {
  background-color: #E6E6E6;
}
.lucid-color-picker .lucid-popover-menu ul.lucid-most-used-colors {
  border: 1px solid #D2D2D2;
  margin-bottom: 10px;
  height: 22px;
}
.lucid-color-picker .lucid-popover-menu ul.lucid-colorpicker-colors {
  margin-bottom: 0;
}
.lucid-color-picker .lucid-popover-menu .lucid-square {
  height: 20px;
  width: 28px;
  display: inline-block;
  cursor: pointer;
  position: relative;
}
.lucid-color-picker .lucid-popover-menu .lucid-square.lucid-transparent {
  background: url(https://lucidsoftware.github.io/particle/components/2.0/color-picker/icon-transparent-grid.svg) repeat #FFF;
}
.lucid-color-picker .lucid-popover-menu .lucid-square.blank {
  cursor: auto;
}
.lucid-color-picker .lucid-popover-menu .lucid-square:hover .lucid-selected-color {
  opacity: .8;
}
.lucid-color-picker .lucid-popover-menu .lucid-square .lucid-selected-color {
  border: 2px solid #fff;
  width: 28px;
  height: 20px;
  left: 0px;
  top: 0px;
  box-sizing: border-box;
  position: absolute;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
  opacity: 0;
}
.lucid-color-picker .lucid-popover-menu .lucid-square .lucid-selected-color .lucid-inset-shadow {
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
  width: 100%;
  height: 100%;
}
.lucid-color-picker .lucid-popover-menu .lucid-square .lucid-selected-color.lucid-selected {
  width: 31px;
  height: 25px;
  left: -2px;
  top: -2px;
  z-index: 2;
  opacity: 1;
  -webkit-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}
.lucid-color-picker .lucid-popover-menu .color-hex-adjustments {
  padding: 0 15px 15px;
}
.lucid-color-picker .lucid-popover-menu .color-hex-adjustments li {
  display: inline-block;
  padding-right: 10px;
  vertical-align: bottom;
}
.lucid-color-picker .lucid-popover-menu .color-hex-adjustments li input {
  text-transform: uppercase;
}
.lucid-color-picker .lucid-popover-menu .color-hex-adjustments li:last-child {
  padding-right: 0;
}
.lucid-color-picker .lucid-popover-menu .lucid-drawer-wrapper .lucid-wrapper-overflow-hidden {
  border-top: 1px solid #D2D2D2;
}
.lucid-color-picker .lucid-popover-menu .lucid-drawer-wrapper .lucid-wrapper-overflow-hidden .lucid-popover-menu-drawer {
  background-color: #f1f1f1;
}
.lucid-color-picker .lucid-popover-menu .lucid-drawer-wrapper .lucid-wrapper-overflow-hidden .lucid-popover-menu-drawer ul {
  width: 200px;
  margin: 0 auto;
}
.lucid-color-picker .lucid-popover-menu .lucid-drawer-wrapper .lucid-wrapper-overflow-hidden .lucid-popover-menu-drawer ul li {
  display: inline-block;
  width: 50px;
  text-align: center;
}
.lucid-color-picker .lucid-popover-menu .lucid-drawer-wrapper .lucid-wrapper-overflow-hidden .lucid-select-wrapper {
  margin-top: 10px;
  width: 100%;
}
.lucid-color-picker .lucid-popover-menu .lucid-drawer-wrapper .lucid-wrapper-overflow-hidden .lucid-select-dropdown {
  width: 100%;
  top: 28px;
}
.lucid-color-picker .lucid-buttcon.active {
  background: transparent;
}
.lucid-color-picker .active-fill .input-label {
  color: #29AAE1;
}
.lucid-color-picker .active-fill svg #primary {
  fill: #29AAE1;
}
.lucid-color-picker .fill-content-wrapper {
  -webkit-transition: 0.35s ease-in-out height;
  transition: 0.35s ease-in-out height;
  overflow: hidden;
}
.lucid-color-picker .fill-content-wrapper.Solid {
  height: 194px;
}
.lucid-color-picker .fill-content-wrapper.Linear {
  height: 142px;
}
.lucid-color-picker .fill-content-wrapper.Radial {
  height: 142px;
}
.lucid-color-picker .fill-content-wrapper.Image {
  height: 142px;
}
.lucid-color-picker .fill-content-wrapper.Image .lucid-colorpicker-placeholder {
  padding-bottom: 10px;
}
.lucid-colorpicker-placeholder {
  padding: 15px 16px;
}
.lucid-modal-wrapper {
  position: relative;
  z-index: 1;
}
.lucid-modal-wrapper.ng-hide {
  opacity: 0;
}
.lucid-modal-wrapper.ng-animate {
  -webkit-transition: 0.35s ease-in-out;
  transition: 0.35s ease-in-out;
}
.lucid-modal-wrapper .lucid-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  background: white;
  border-radius: 8px;
  width: 100%;
  overflow: hidden;
  box-shadow: 4px 5px 7px rgba(0, 0, 0, 0.3);
  z-index: 2;
}
.lucid-modal-wrapper .lucid-modal.ng-hide {
  -webkit-transform: translateY(10px);
          transform: translateY(10px);
  opacity: 0;
}
.lucid-modal-wrapper .lucid-modal.ng-animate {
  -webkit-transition: 0.35s ease-in-out;
  transition: 0.35s ease-in-out;
}
.lucid-modal-wrapper .lucid-modal > header {
  background: #3D4752;
  height: 42px;
  width: 100%;
  text-align: left;
  display: inline-block;
  padding: 10px 15px;
}
.lucid-modal-wrapper .lucid-modal > header .lucid-modal-title {
  color: #fff;
  line-height: 22px;
  font-size: 16px;
}
.lucid-modal-wrapper .lucid-modal > header .lucid-close-modal {
  width: 22px;
  position: absolute;
  right: 10px;
  top: 10px;
  cursor: pointer;
}
.lucid-modal-wrapper .lucid-modal > footer {
  text-align: right;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 49px;
  background: #E6E6E6;
  padding: 10px 10px;
  box-sizing: border-box;
  white-space: nowrap;
  font-size: 0;
}
.lucid-modal-wrapper .lucid-modal > footer .lucid-button {
  margin-left: 10px;
}
.lucid-modal-wrapper .has-footer {
  padding-bottom: 45px;
}
.lucid-modal-wrapper .lucid-modal-bg {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(69, 75, 82, 0.4);
  z-index: 1;
  opacity: 1;
}
.lucid-finger-tabs-wrapper {
  position: relative;
  height: 100%;
}
.lucid-finger-tabs {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 240px;
  position: absolute;
  top: 0;
  bottom: 0;
  border-right: 1px solid #D2D2D2;
}
.lucid-finger-tabs .lucid-finger-tab {
  text-align: left;
  cursor: pointer;
  position: relative;
  color: #3D4752;
  background-color: #fff;
  border-bottom: 1px solid #D2D2D2;
  height: 44px;
  font-size: 16px;
  padding: 0 15px;
  line-height: 42px;
  white-space: nowrap;
}
.lucid-finger-tabs .lucid-finger-tab svg path,
.lucid-finger-tabs .lucid-finger-tab svg polygon {
  fill: #3D4752;
}
.lucid-finger-tabs .lucid-finger-tab.selected {
  color: #fff;
  background-color: #77818C;
}
.lucid-finger-tabs .lucid-finger-tab.selected svg path,
.lucid-finger-tabs .lucid-finger-tab.selected svg polygon {
  fill: #FFF;
}
.lucid-finger-tabs .lucid-finger-tab.selected:after {
  position: absolute;
  content: " ";
  right: -1px;
  top: 11px;
  border-right: 10px solid #fff;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
}
.lucid-finger-tabs .lucid-finger-tab .lucid-icon-22 {
  margin: 10px 6px 0 0;
  vertical-align: top;
}
.lucid-tab-content {
  position: absolute;
  left: 240px;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 40px;
  overflow: auto;
}
.lucid-button {
  padding: 4px 15px 6px;
  border: none;
  border-radius: 4px;
  font-size: 14px;
  font-family: 'Source Sans Pro', sans-serif;
  cursor: pointer;
  outline: none;
  display: inline-block;
  box-sizing: border-box;
  white-space: nowrap;
  -webkit-transition: 0.15s ease-in-out background-color;
  transition: 0.15s ease-in-out background-color;
  -webkit-font-smoothing: auto;
  color: #fff;
}
.lucid-button svg path {
  fill: #fff;
}
.lucid-button.lucid-blue {
  background: #29AAE1;
}
.lucid-button.lucid-blue:hover {
  background: #3fb3e4;
}
.lucid-button.info-green {
  background: #8CBF3F;
}
.lucid-button.info-green:hover {
  background: #98c652;
}
.lucid-button.info-red {
  background: #ED6058;
}
.lucid-button.info-red:hover {
  background: #ef766f;
}
.lucid-button.grey-5 {
  background: #A5A5A5;
}
.lucid-button.grey-5:hover {
  background: #b2b2b2;
}
.lucid-button.blue-steel {
  background: #3D4752;
}
.lucid-button.blue-steel:hover {
  background: #485461;
}
.lucid-button.blue-steel-2 {
  background: #77818C;
}
.lucid-button.blue-steel-2:hover {
  background: #858e98;
}
.lucid-button.info-purple {
  background: #A32385;
}
.lucid-button.info-purple:hover {
  background: #b82896;
}
.lucid-button.lucidchart-orange {
  background: #FC8D2A;
}
.lucid-button.lucidchart-orange:hover {
  background: #fc9a43;
}
.lucid-button.transparent {
  background: transparent;
}
.lucid-button.transparent:hover {
  background: rgba(13, 13, 13, 0);
}
.lucid-button.clear {
  background-color: transparent;
}
.lucid-button.lucid-button-icon .lucid-icon-18 {
  vertical-align: top;
  margin-right: 3px;
}
.lucid-icon-18,
.lucid-icon-22 {
  vertical-align: top;
  display: inline-block;
}
.lucid-icon-18 svg,
.lucid-icon-22 svg {
  vertical-align: top;
}
.lucid-icon-18 {
  width: 18px;
  height: 18px;
}
.lucid-icon-22 {
  width: 22px;
  height: 22px;
}
.lucid-icon svg path,
.lucid-icon svg polygon,
.lucid-icon svg rect,
.lucid-icon svg circle {
  -webkit-transition: 0.15s ease-in-out;
  transition: 0.15s ease-in-out;
}
.lucid-icon.fill-blue-steel svg path,
.lucid-icon.fill-blue-steel svg polygon,
.lucid-icon.fill-blue-steel svg rect,
.lucid-icon.fill-blue-steel svg circle {
  fill: #3D4752;
}
.lucid-icon.fill-active svg path,
.lucid-icon.fill-active svg polygon,
.lucid-icon.fill-active svg rect,
.lucid-icon.fill-active svg circle {
  fill: #29AAE1;
}
.lucid-icon.fill-white svg path,
.lucid-icon.fill-white svg polygon,
.lucid-icon.fill-white svg rect,
.lucid-icon.fill-white svg circle {
  fill: #fff;
}
.lucid-notification {
  padding: 20px 15px 20px 48px;
  position: relative;
  line-height: 22px;
  color: #5a5a5a;
  text-align: left;
  font-size: 16px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.lucid-notification [ng-transclude] {
  font-size: 16px;
}
.lucid-notification .notification-icon {
  width: 22px;
  height: 22px;
  position: absolute;
  left: 15px;
  top: 50%;
  margin-top: -11px;
}
.lucid-notification.lucid-notification-information {
  background-color: #D2EDF9;
}
.lucid-notification.lucid-notification-information .notification-icon {
  background: url(https://lucidsoftware.github.io/particle/components/1.1/icon/img/info-circle-blue.svg) center center no-repeat;
}
.lucid-notification.lucid-notification-information button {
  background-color: #29AAE1;
}
.lucid-notification.lucid-notification-complete {
  background-color: #E9F2D9;
}
.lucid-notification.lucid-notification-complete .notification-icon {
  background: url(https://lucidsoftware.github.io/particle/components/1.1/icon/img/check-circle-green.svg) center center no-repeat;
}
.lucid-notification.lucid-notification-complete button {
  background-color: #8CBF3F;
}
.lucid-notification.lucid-notification-error {
  background-color: #FBDCDA;
}
.lucid-notification.lucid-notification-error .notification-icon {
  background: url(https://lucidsoftware.github.io/particle/components/1.1/icon/img/error-triangle-red.svg) center center no-repeat;
}
.lucid-notification.lucid-notification-error button {
  background-color: #ED6058;
}
.lucid-select-wrapper {
  position: relative;
  display: inline-block;
  font-size: 14px;
  vertical-align: top;
  border-radius: 3px;
}
.lucid-select-wrapper .selected-option-wrapper {
  position: relative;
}
.lucid-select-wrapper .selected-option-wrapper .dropdown-arrow {
  position: absolute;
  width: 8px;
  height: 6px;
  top: 8px;
  right: 6px;
  cursor: pointer;
}
.lucid-select-wrapper .selected-option-wrapper .dropdown-arrow svg {
  vertical-align: top;
}
.lucid-select-wrapper .selected-option-wrapper .dropdown-arrow svg path {
  fill: #77818C;
}
.lucid-select-wrapper .selected-option-wrapper .lucid-selected-option {
  text-align: left;
  display: block;
  cursor: pointer;
  background: #FFF;
  border: 1px solid #A5A5A5;
  border-radius: 3px;
  height: 22px;
  line-height: 19px;
  padding: 0 20px 0 8px;
}
.lucid-select-wrapper .lucid-select-dropdown {
  display: inline-block;
  position: absolute;
  z-index: 1;
  top: 22px;
  left: 1px;
  right: 1px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
  background: #fff;
  opacity: 1;
}
.lucid-select-wrapper .lucid-select-dropdown > div {
  padding: 2px;
  margin-top: 0;
  -webkit-transition: 0.1s ease-in-out margin;
  transition: 0.1s ease-in-out margin;
}
.lucid-select-wrapper .lucid-select-dropdown.ng-hide {
  opacity: 0;
}
.lucid-select-wrapper .lucid-select-dropdown.ng-hide > div {
  margin-top: -10px;
}
.lucid-select-wrapper .lucid-select-dropdown.ng-animate {
  overflow: hidden;
  -webkit-transition: 0.1s ease-in-out all;
  transition: 0.1s ease-in-out all;
}
.lucid-select-wrapper .lucid-select-dropdown li {
  cursor: pointer;
  padding: 5px 15px 5px 25px;
  text-align: left;
  -webkit-transition: 0.1s ease-in-out all;
  transition: 0.1s ease-in-out all;
  position: relative;
  color: #5A5A5A;
  margin-bottom: 4px;
}
.lucid-select-wrapper .lucid-select-dropdown li:last-child {
  margin-bottom: 0;
}
.lucid-select-wrapper .lucid-select-dropdown li:hover {
  background: #F0F0F0;
}
.lucid-select-wrapper .lucid-select-dropdown li .selected-checkmark {
  position: absolute;
  top: 2px;
  left: 3px;
}
[lucid-context-menu] {
  cursor: pointer;
}
.lucid-context-menu {
  position: fixed;
  background: #fff;
  padding: 3px;
  min-width: 200px;
  box-shadow: 0 2px 11px rgba(0, 0, 0, 0.5);
  z-index: 10;
  text-align: left;
  color: #3D4752;
  /* Hide Dropdowns by Default */
  /* Display Dropdowns on Hover */
  /* Fisrt Tier Dropdown */
  /* Second, Third and more Tiers */
  /* Change this in order to change the Dropdown symbol */
}
.lucid-context-menu ul {
  padding: 0;
  margin: 0;
  list-style: none;
  position: relative;
}
.lucid-context-menu ul li {
  display: inline-block;
  line-height: 20px;
  font-size: 14px;
  padding: 3px 12px;
  width: 100%;
  box-sizing: border-box;
  cursor: pointer;
}
.lucid-context-menu ul li:hover {
  background: #F0F0F0;
}
.lucid-context-menu ul li.context-divider {
  background: #D2D2D2;
  height: 1px;
  margin: 5px 0;
  padding: 0;
}
.lucid-context-menu ul li a {
  display: block;
  padding: 0 10px;
  color: #3D4752;
  text-decoration: none;
}
.lucid-context-menu ul li a.saving {
  color: #ccc;
}
.lucid-context-menu ul li span.hotkey {
  position: absolute;
  right: 7px;
  top: 0;
  bottom: 0;
  color: #999;
}
.lucid-context-menu ul li li {
  background: #fff;
}
.lucid-context-menu ul li li.dropdown-divider {
  border-bottom: 1px solid #D2D2D2;
}
.lucid-context-menu ul li li a {
  color: #3D4752;
}
.lucid-context-menu ul li li a:hover {
  background-color: #F0F0F0;
}
.lucid-context-menu ul ul {
  display: none;
  position: absolute;
  padding: 3px;
  background: #FFF;
  top: - 3px;
  left: 200px;
  box-shadow: 0 2px 11px rgba(0, 0, 0, 0.5);
}
.lucid-context-menu ul li:hover > ul {
  display: inherit;
  top: -3px;
}
.lucid-context-menu ul li {
  width: 200px;
  float: none;
  display: list-item;
  position: relative;
}
.lucid-context-menu ul ul ul {
  position: absolute;
  top: 0px;
  left: 200px;
  z-index: -1;
}
.lucid-context-menu ul li.lucid-context-more:after {
  content: '';
  position: absolute;
  width: 18px;
  height: 18px;
  top: 3px;
  right: 0px;
  background: url(https://lucidsoftware.github.io/particle/components/2.0/icon/icons/icon-triangle-right-18px.svg) no-repeat center center;
}
.lucid-collapse-bar {
  position: relative;
  display: inline-block;
  width: 100%;
  text-align: left;
  opacity: 1;
  vertical-align: top;
  margin-bottom: 10px;
}
.lucid-collapse-bar .collapse-bar-top {
  background-color: #CDCED1;
  padding: 8px 10px;
  position: relative;
  color: #5A5A5A;
  -webkit-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out;
  box-sizing: border-box;
  height: 32px;
  text-align: left;
  border-radius: 4px;
  cursor: pointer;
}
.lucid-collapse-bar .collapse-bar-top .lucid-hide-content-icon {
  position: absolute;
  top: 0;
  left: 0;
  height: 30px;
  padding: 12px 4px 0 11px;
  -webkit-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
}
.lucid-collapse-bar .collapse-bar-top .lucid-hide-content-icon svg {
  vertical-align: top;
}
.lucid-collapse-bar .collapse-bar-top .lucid-hide-content-icon svg path {
  -webkit-transform: rotate(0);
          transform: rotate(0);
  -webkit-transform-origin: center;
          transform-origin: center;
  -webkit-transition: all 0.25s ease-in-out;
  transition: all 0.25s ease-in-out;
  fill: #77818C;
}
.lucid-collapse-bar .collapse-bar-top .lucid-hide-content-icon.lucid-hide-content svg path {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}
.lucid-collapse-bar .collapse-bar-top .collapse-bar-name {
  vertical-align: top;
  line-height: 15px;
  font-size: 14px;
  font-weight: 500;
  padding-left: 15px;
  display: inline-block;
}
.lucid-collapse-bar .lucid-collapse-bar-content {
  -webkit-transition: all .5s;
  transition: all .5s;
  width: 100%;
}
.lucid-collapse-bar .lucid-collapse-bar-content.ng-animate {
  overflow: hidden;
}
.lucid-toggle {
  display: inline-block;
}
.lucid-toggle .toggle-button {
  font-size: 12px;
  height: 22px;
  line-height: 20px;
  font-weight: 400;
  border-radius: 4px;
  width: 36px;
  background: #D6D6D8;
  border: 1px solid #A5A5A5;
  color: #5A5A5A;
  -webkit-transition: 0.1s ease-in-out all;
  transition: 0.1s ease-in-out all;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  display: inline-block;
  padding: 0;
  font-family: 'Source Sans Pro', sans-serif;
  letter-spacing: 1px;
}
.lucid-toggle .toggle-button:focus {
  outline: none;
}
.lucid-toggle .toggle-button .toggle-on {
  display: none;
}
.lucid-toggle .toggle-button .toggle-off {
  display: inherit;
}
.lucid-toggle .toggle-button.active {
  background: #D2EDF9;
  border: 1px solid #29AAE1;
  color: #29AAE1;
}
.lucid-toggle .toggle-button.active .toggle-on {
  display: inherit;
}
.lucid-toggle .toggle-button.active .toggle-off {
  display: none;
}
.lucid-toggle .toggle-button[disabled] {
  background: #F0F0F0;
  color: #A5A5A5;
  border: 1px solid #A5A5A5;
}
.lucid-toggle .long-input-label {
  padding-left: 4px;
  font-size: 14px;
  line-height: 15px;
  color: #5A5A5A;
  display: inline-block;
}
.reversed-text .lucid-toggle .toggle-button {
  border: 1px solid #59697C;
  background: #A9B3BE;
}
.edit-in-place-wrapper .edit-in-place {
  line-height: 1em;
  font-size: 1em;
  color: #5A5A5A;
  padding: 0;
  vertical-align: top;
  cursor: pointer;
}
.edit-in-place-wrapper .edit-in-place-input {
  font-style: italic;
  outline: none;
  border: none;
  background: transparent;
  padding: 0;
  margin-top: -2px;
  cursor: auto;
  color: #5A5A5A;
}
.edit-in-place-wrapper.reversed-text .edit-in-place {
  color: #fff;
  font-weight: 300;
}
.edit-in-place-wrapper.reversed-text input.edit-in-place {
  font-weight: 300;
}
.lucid-top-tabs-wrapper {
  position: relative;
  height: 100%;
}
.lucid-top-tabs-wrapper .lucid-top-tab-content {
  padding: 15px 10px;
  height: 100%;
  overflow: auto;
  background: #E6E6E6;
}
.lucid-top-tabs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.lucid-top-tabs .lucid-top-tab {
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
  text-align: center;
  cursor: pointer;
  display: inline-block;
  color: #FFF;
  background-color: #77818C;
  font-size: 14px;
  padding: 10px 0;
  white-space: nowrap;
  border-left: 1px solid #E6E6E6;
  box-sizing: border-box;
  text-transform: uppercase;
}
.lucid-top-tabs .lucid-top-tab:first-child {
  border-left: none;
}
.lucid-top-tabs .lucid-top-tab.selected {
  color: #77818C;
  background-color: #E6E6E6;
}
.lucid-tip-wrapper {
  position: absolute;
  font-size: 14px;
  color: #fff;
  padding: 10px 36px 10px 15px;
  border-radius: 4px;
  line-height: 18px;
  text-align: left;
  z-index: 1;
}
.lucid-tip-wrapper:after {
  content: '';
  position: absolute;
  border: 9px solid transparent;
}
.lucid-tip-wrapper.ng-hide {
  opacity: 0;
}
.lucid-tip-wrapper.caret-left.ng-hide {
  margin-left: 10px;
}
.lucid-tip-wrapper.caret-left:after {
  border-left: none;
  left: -10px;
  top: 10px;
}
.lucid-tip-wrapper.caret-right.ng-hide {
  margin-right: 10px;
}
.lucid-tip-wrapper.caret-right:after {
  border-right: none;
  right: -10px;
  top: 10px;
}
.lucid-tip-wrapper.caret-top.ng-hide {
  margin-top: 10px;
}
.lucid-tip-wrapper.caret-top:after {
  border-top: none;
  left: 50%;
  margin-left: -9px;
  top: -10px;
}
.lucid-tip-wrapper.caret-bottom.ng-hide {
  margin-top: -10px;
}
.lucid-tip-wrapper.caret-bottom:after {
  border-bottom: none;
  left: 50%;
  margin-left: -9px;
  bottom: -10px;
}
.lucid-tip-wrapper.lucidchart-orange {
  background: #FC8D2A;
}
.lucid-tip-wrapper.lucidchart-orange.caret-left:after {
  border-right: 10px solid #FC8D2A;
}
.lucid-tip-wrapper.lucidchart-orange.caret-right:after {
  border-left: 10px solid #FC8D2A;
}
.lucid-tip-wrapper.lucidchart-orange.caret-top:after {
  border-bottom: 10px solid #FC8D2A;
}
.lucid-tip-wrapper.lucidchart-orange.caret-bottom:after {
  border-top: 10px solid #FC8D2A;
}
.lucid-tip-wrapper.info-purple {
  background: #A32385;
}
.lucid-tip-wrapper.info-purple.caret-left:after {
  border-right: 10px solid #A32385;
}
.lucid-tip-wrapper.info-purple.caret-right:after {
  border-left: 10px solid #A32385;
}
.lucid-tip-wrapper.info-purple.caret-top:after {
  border-bottom: 10px solid #A32385;
}
.lucid-tip-wrapper.info-purple.caret-bottom:after {
  border-top: 10px solid #A32385;
}
.lucid-tip-wrapper.info-green {
  background: #8CBF3F;
}
.lucid-tip-wrapper.info-green.caret-left:after {
  border-right: 10px solid #8CBF3F;
}
.lucid-tip-wrapper.info-green.caret-right:after {
  border-left: 10px solid #8CBF3F;
}
.lucid-tip-wrapper.info-green.caret-top:after {
  border-bottom: 10px solid #8CBF3F;
}
.lucid-tip-wrapper.info-green.caret-bottom:after {
  border-top: 10px solid #8CBF3F;
}
.lucid-tip-wrapper.ng-animate {
  -webkit-transition: 0.5s ease-in-out all;
  transition: 0.5s ease-in-out all;
}
.lucid-tip-wrapper.ng-hide.ng-hide-add-active {
  margin: 0;
  -webkit-transition: 0.2s ease-out all;
  transition: 0.2s ease-out all;
}
.lucid-tip-wrapper .lucid-close-icon {
  cursor: pointer;
  z-index: 1;
  position: absolute;
  right: 10px;
  top: 10px;
}
.lucid-tip-wrapper .lucid-close-icon svg path {
  fill: #fff;
}
.lucid-paywall-wrapper {
  position: fixed;
  z-index: 1;
  display: table;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
}
.lucid-paywall-wrapper.ng-hide {
  opacity: 0;
}
.lucid-paywall-wrapper.ng-animate {
  -webkit-transition: 0.35s ease-in-out;
  transition: 0.35s ease-in-out;
}
.lucid-paywall-wrapper .lucid-paywall-inner-wrapper {
  display: table-cell;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  vertical-align: middle;
  position: relative;
  z-index: 2;
}
.lucid-paywall-wrapper .paywall-x {
  position: absolute;
  top: 15px;
  right: 15px;
  cursor: pointer;
}
.lucid-paywall-wrapper .paywall-banner {
  background: url(https://lucidsoftware.github.io/particle/components/2.0/paywall/premium-banner.png);
  width: 111px;
  height: 111px;
  position: absolute;
  top: -8px;
  left: -7px;
}
.lucid-paywall-wrapper .paywall-banner .paywall-banner-text {
  color: #FFF;
  width: 156px;
  height: 28px;
  line-height: 26px;
  text-align: center;
  -webkit-transform: rotateZ(-45deg);
          transform: rotateZ(-45deg);
  -webkit-transform-origin: bottom left;
          transform-origin: bottom left;
  position: absolute;
  bottom: 0;
  left: 0;
  font-size: 18px;
  font-weight: 700;
}
.lucid-paywall-wrapper .lucid-paywall {
  margin: auto;
  width: 100%;
  max-width: 440px;
  padding: 20px;
  background: white;
  border-radius: 8px;
  position: relative;
  box-shadow: 4px 5px 7px rgba(0, 0, 0, 0.3);
  text-align: center;
}
.lucid-paywall-wrapper .lucid-paywall .paywall-title {
  margin-bottom: 20px;
}
.lucid-paywall-wrapper .lucid-paywall .paywall-title > h1 {
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  line-height: 24px;
}
.lucid-paywall-wrapper .lucid-paywall .paywall-title > h2 {
  font-size: 18px;
  color: #828282;
  text-align: center;
  line-height: 20px;
  margin-top: 5px;
  font-weight: normal;
  letter-spacing: inherit;
}
.lucid-paywall-wrapper .lucid-paywall img {
  width: 100%;
  max-width: 300px;
  height: auto;
  margin: 0 auto 24px;
  display: block;
}
.lucid-paywall-wrapper .lucid-paywall > button {
  display: block;
  margin: 0 auto;
}
.lucid-paywall-wrapper .lucid-paywall .cancel-text {
  margin-top: 10px;
  color: #2C84B5;
  cursor: pointer;
  font-size: 14px;
}
.lucid-paywall-wrapper .lucid-paywall p {
  margin: 0 10px 20px;
  line-height: 18px;
  font-size: 16px;
}
.lucid-paywall-wrapper .lucid-paywall.ng-hide {
  -webkit-transform: translateY(10px);
          transform: translateY(10px);
  opacity: 0;
}
.lucid-paywall-wrapper .lucid-paywall.ng-animate {
  -webkit-transition: 0.35s ease-in-out;
  transition: 0.35s ease-in-out;
}
.lucid-paywall-wrapper .lucid-paywall-bg {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(69, 75, 82, 0.4);
  z-index: 1;
  opacity: 1;
}
.lucid-stepper-wrapper {
  position: relative;
  height: 100%;
}
.lucid-stepper-wrapper .lucid-step-content {
  height: 100%;
  overflow: auto;
}
.lucid-top-steps {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.lucid-top-steps .lucid-top-step {
  text-align: center;
  display: inline-block;
  padding: 0;
  white-space: nowrap;
  box-sizing: border-box;
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex: 1;
          flex: 1;
}
.lucid-top-steps .lucid-top-step:after,
.lucid-top-steps .lucid-top-step:before {
  content: '';
  position: absolute;
  top: 13px;
  left: 50%;
  right: 0;
  height: 4px;
  background: #D2D2D2;
}
.lucid-top-steps .lucid-top-step:before {
  left: 0;
  right: 50%;
}
.lucid-top-steps .lucid-top-step:first-child:before {
  display: none;
}
.lucid-top-steps .lucid-top-step:last-child:after {
  display: none;
}
.lucid-top-steps .lucid-top-step .step-number-wrapper {
  cursor: pointer;
  width: 28px;
  height: 28px;
  border-radius: 14px;
  background: #A5A5A5;
  font-size: 18px;
  font-weight: 500;
  margin: 0 auto;
  padding: 5px 0;
  color: #fff;
  position: relative;
  z-index: 1;
}
.lucid-top-steps .lucid-top-step .step-label {
  cursor: pointer;
  font-size: 14px;
  margin-top: 4px;
  line-height: 18px;
  color: #A5A5A5;
}
.lucid-top-steps .lucid-top-step:first-child {
  border-left: none;
}
.lucid-top-steps .lucid-top-step.col-20 {
  width: 20%;
}
.lucid-top-steps .lucid-top-step.col-25 {
  width: 25%;
}
.lucid-top-steps .lucid-top-step.col-33 {
  width: 33.333333%;
}
.lucid-top-steps .lucid-top-step.col-50 {
  width: 50%;
}
.lucid-top-steps .lucid-top-step.selected .step-number-wrapper {
  background: #29AAE1;
}
.lucid-top-steps .lucid-top-step.selected .step-label {
  color: #29AAE1;
}
.lucid-top-steps .lucid-top-step.completed .step-number-wrapper {
  background: #77818C;
}
.lucid-top-steps .lucid-top-step.completed .step-label {
  color: #77818C;
}
.lucid-button-dropdown .lucid-button {
  padding-right: 32px;
}
.lucid-button-dropdown .lucid-button .lucid-icon-18 {
  position: absolute;
  top: 5px;
  right: 10px;
}
.lucid-button-dropdown .lucid-select-dropdown {
  top: 28px;
  left: 1px;
  right: inherit;
}
.lucid-button-dropdown .lucid-select-dropdown li {
  padding: 5px 10px;
  white-space: nowrap;
}
.lucid-button-dropdown .lucid-select-dropdown.right-side {
  left: inherit;
  right: 1px;
}
.lucid-input-wrapper.condensed.search-wrapper {
  position: relative;
}
.lucid-input-wrapper.condensed.search-wrapper .lucid-input {
  padding-right: 22px;
}
.lucid-input-wrapper.condensed.search-wrapper .search-icon {
  position: absolute;
  top: 2px;
  right: 2px;
}
.lucid-input-wrapper.condensed.search-wrapper .search-icon svg path {
  fill: #77818C;
}
.lucid-input-wrapper.condensed.search-wrapper .search-icon .search-x {
  cursor: pointer;
  display: none;
}
.lucid-input-wrapper.condensed.search-wrapper .search-icon.searching .empty-search {
  display: none;
}
.lucid-input-wrapper.condensed.search-wrapper .search-icon.searching .search-x {
  display: inherit;
}
.range-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.range-wrap input[type=range] {
  -webkit-appearance: none;
  margin: 4px 5px 4px 0;
  width: 100%;
  background: transparent;
}
.range-wrap input[type=range]:focus {
  outline: none;
}
.range-wrap input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 4px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: none;
  background: #CDCED1;
  border-radius: 5px;
  border: 0px solid black;
}
.range-wrap input[type=range]::-webkit-slider-thumb {
  box-shadow: none;
  border: 1px solid transparent;
  height: 12px;
  width: 12px;
  border-radius: 6px;
  background: #29AAE1;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -4px;
}
.range-wrap input[type=range]:focus::-webkit-slider-runnable-track {
  background: #dadbdd;
}
.range-wrap input[type=range]::-moz-range-track {
  width: 100%;
  height: 4px;
  cursor: pointer;
  animate: 0.2s;
  box-shadow: none;
  background: #CDCED1;
  border-radius: 5px;
  border: 0px solid black;
}
.range-wrap input[type=range]::-moz-range-thumb {
  box-shadow: none;
  border: 1px solid transparent;
  height: 12px;
  width: 12px;
  border-radius: 6px;
  background: #29AAE1;
  cursor: pointer;
}
.range-wrap input[type=range]::-ms-track {
  width: 100%;
  height: 4px;
  cursor: pointer;
  animate: 0.2s;
  background: transparent;
  border-color: transparent;
  border-width: 12px 0;
  color: transparent;
}
.range-wrap input[type=range]::-ms-fill-lower {
  background: #c0c1c5;
  border: 0px solid black;
  border-radius: 10px;
  box-shadow: none;
}
.range-wrap input[type=range]::-ms-fill-upper {
  background: #CDCED1;
  border: 0px solid black;
  border-radius: 10px;
  box-shadow: none;
}
.range-wrap input[type=range]::-ms-thumb {
  box-shadow: none;
  border: 1px solid transparent;
  height: 12px;
  width: 12px;
  border-radius: 6px;
  background: #29AAE1;
  cursor: pointer;
}
.range-wrap input[type=range]:focus::-ms-fill-lower {
  background: #CDCED1;
}
.range-wrap input[type=range]:focus::-ms-fill-upper {
  background: #dadbdd;
}
lucid-tooltip {
  display: inline-block;
}
.tooltip {
  border-radius: 4px;
  background: #3D4752;
  position: absolute;
  display: none;
  background-color: #3D4752;
  padding: 3px 8px 5px;
  max-width: 250px;
  color: #fff;
  font-size: 14px;
  white-space: nowrap;
  font-weight: 300;
}
.tooltip .hotkey {
  margin-left: 22px;
  color: #AFB7BF;
}
.tooltip-show {
  display: inherit;
}
.tooltip-hide {
  display: none;
}
.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border: 8px solid transparent;
}
.tooltip {
  -webkit-animation: animate-tooltip 0.25s;
          animation: animate-tooltip 0.25s;
}
.tooltip.tooltip-up {
  text-align: left;
}
.tooltip.tooltip-up .tooltip-arrow {
  bottom: -9px;
  left: 50%;
  margin-left: -9px;
  border-top: 9px solid #3D4752;
  border-bottom: none;
}
.tooltip.tooltip-right {
  text-align: left;
}
.tooltip.tooltip-right .tooltip-arrow {
  left: -9px;
  top: 50%;
  margin-top: -8px;
  border-right: 9px solid #3D4752;
  border-left: none;
}
.tooltip.tooltip-bottom {
  text-align: center;
}
.tooltip.tooltip-bottom .tooltip-arrow {
  top: -9px;
  left: 50%;
  margin-left: -9px;
  border-bottom: 9px solid #3D4752;
  border-top: none;
}
.tooltip.tooltip-left {
  text-align: left;
}
.tooltip.tooltip-left .tooltip-arrow {
  right: -9px;
  top: 50%;
  margin-top: -8px;
  border-left: 9px solid #3D4752;
  border-right: none;
}
@-webkit-keyframes animate-tooltip {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
    margin-top: 0;
  }
}
@keyframes animate-tooltip {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
    margin-top: 0;
  }
}
.lucid-growl {
  position: relative;
}
.lucid-growl.lucid-blue {
  background: #29AAE1;
}
.lucid-growl.info-green {
  background: #8CBF3F;
}
.lucid-growl.info-red {
  background: #ED6058;
}
.lucid-growl.grey-5 {
  background: #A5A5A5;
}
.lucid-growl.blue-steel {
  background: #3D4752;
}
.lucid-growl.blue-steel-2 {
  background: #77818C;
}
.lucid-growl.info-purple {
  background: #A32385;
}
.lucid-growl.lucidchart-orange {
  background: #FC8D2A;
}
.lucid-growl.transparent {
  background: transparent;
}
.lucid-growl .growl-content {
  padding: 9px 32px 9px 9px;
  color: #fff;
  font-size: 14px;
  -webkit-transition: color 0.25s ease-in-out;
  transition: color 0.25s ease-in-out;
}
.lucid-growl .growl-content a {
  text-decoration: underline;
}
.lucid-growl .close-growl {
  position: absolute;
  top: 4px;
  right: 2px;
}
.lucid-growl .close-growl svg path {
  fill: #fff;
}
.lucid-growl.ng-hide .growl-content {
  color: transparent;
}
.dynamic-height-hide {
  -webkit-transition: 0.3s ease-in-out all;
  transition: 0.3s ease-in-out all;
}

