@charset "UTF-8";

/*數值 放上面優先讀取*/
/* @mixin box-shadow($x: 2px, $y: 2px, $blur: 5px, $color: rgba(0,0,0,.4), $inset: "") {
  @if ($inset != "") {
    -webkit-box-shadow: $inset $x $y $blur $color;
    -moz-box-shadow:    $inset $x $y $blur $color;
    box-shadow:         $inset $x $y $blur $color;
  } @else {
    -webkit-box-shadow: $x $y $blur $color;
    -moz-box-shadow:    $x $y $blur $color;
    box-shadow:         $x $y $blur $color;
  }
}
 */
/* $inputBorderFocus: #37a700; */
/*  lighten($magic-border-color, 14%) !default */
/* lighten($magic-main-color, 30%) !default */
@font-face {
  font-family: 'Material Icons';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/Material/MaterialIcons-Regular.eot);
  /* For IE6-8 */
  src: local("Material Icons"), local("MaterialIcons-Regular"), url(../fonts/Material/MaterialIcons-Regular.ttf) format("truetype");
}

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga';
}

ag-grid-angular {
  display: inline-block;
}

ag-grid-ng2 {
  display: inline-block;
}

.ag-rtl {
  direction: rtl;
}

.ag-ltr {
  direction: ltr;
}

.ag-select-agg-func-popup {
  position: absolute;
}

.ag-body-no-select {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-root {
  /* set to relative, so absolute popups appear relative to this */
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  /* was getting some 'should be there' scrolls, this sorts it out */
  overflow: hidden;
}

.ag-layout-normal .ag-root {
  height: 100%;
}

.ag-font-style {
  cursor: default;
  /* disable user mouse selection */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-layout-for-print {
  white-space: nowrap;
  display: inline-block;
}

.ag-layout-normal {
  height: 100%;
}

.ag-popup-backdrop {
  position: fixed;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
}

.ag-header {
  white-space: nowrap;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  width: 100%;
}

.ag-layout-normal .ag-header {
  position: absolute;
  top: 0px;
  left: 0px;
}

.ag-pinned-left-header {
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  height: 100%;
}

.ag-pinned-right-header {
  float: right;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  height: 100%;
}

.ag-header-viewport {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  height: 100%;
}

.ag-layout-normal .ag-header-row {
  position: absolute;
}

.ag-layout-normal .ag-header-container {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  white-space: nowrap;
  height: 100%;
}

.ag-layout-auto-height .ag-header-row {
  position: absolute;
}

.ag-layout-auto-height .ag-header-container {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  white-space: nowrap;
  height: 100%;
}

.ag-layout-for-print .ag-header-container {
  white-space: nowrap;
}

.ag-header-overlay {
  display: block;
  position: absolute;
}

.ag-header-cell {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  vertical-align: bottom;
  text-align: center;
  display: inline-block;
  height: 100%;
  position: absolute;
}

.ag-floating-filter {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  display: inline-block;
}

.ag-floating-filter-body {
  margin-right: 25px;
  height: 20px;
}

.ag-floating-filter-full-body {
  width: 100%;
  height: 20px;
}

.ag-floating-filter-button {
  width: 25px;
  height: 20px;
  float: right;
  margin-top: -20px;
}

.ag-floating-filter-button button {
  width: 25px;
  height: 19px;
  padding: 0;
}

.ag-floating-filter-input {
  width: 100%;
}

.ag-floating-filter-input:read-only {
  background-color: #eee;
}

.ag-floating-filter-menu {
  position: absolute;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-dnd-ghost {
  font-size: 14px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  position: absolute;
  background: #e5e5e5;
  border: 1px solid #000;
  cursor: move;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  padding: 3px;
  line-height: 1.4;
}

.ag-dnd-ghost-icon {
  display: inline-block;
  float: left;
  padding-left: 2px;
  padding-right: 2px;
}

.ag-dnd-ghost-label {
  display: inline-block;
}

.ag-header-group-cell {
  height: 100%;
  display: inline-block;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  position: absolute;
}

.ag-header-group-cell-label {
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ag-header-cell-label {
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ag-header-cell-resize {
  height: 100%;
  width: 4px;
  cursor: col-resize;
}

.ag-ltr .ag-header-cell-resize {
  float: right;
}

.ag-ltr .ag-pinned-right-header .ag-header-cell-resize {
  float: left;
}

.ag-rtl .ag-header-cell-resize {
  float: left;
}

.ag-rtl .ag-pinned-left-header .ag-header-cell-resize {
  float: right;
}

.ag-ltr .ag-header-select-all {
  float: left;
}

.ag-rtl .ag-header-select-all {
  float: right;
}

.ag-header-expand-icon {
  padding-left: 4px;
}

.ag-header-cell-menu-button {
  float: right;
}

.ag-overlay-panel {
  display: table;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.ag-overlay-wrapper {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}

.ag-bl-overlay {
  pointer-events: none;
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0px;
  left: 0px;
}

.ag-bl-full-height {
  height: 100%;
  overflow: auto;
  position: relative;
}

.ag-bl-west {
  float: left;
}

.ag-bl-full-height-west {
  height: 100%;
}

.ag-bl-east {
  float: right;
}

.ag-bl-full-height-east {
  height: 100%;
}

.ag-bl-full-height-center {
  height: 100%;
}

.ag-bl-normal {
  height: 100%;
  position: relative;
}

.ag-bl-normal-center-row {
  height: 100%;
  overflow: hidden;
}

.ag-bl-normal-west {
  height: 100%;
  float: left;
}

.ag-bl-normal-east {
  height: 100%;
  float: right;
}

.ag-bl-normal-center {
  height: 100%;
}

.ag-bl-dont-fill {
  position: relative;
}

.ag-body {
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.ag-layout-normal .ag-body {
  height: 100%;
  position: absolute;
}

.ag-floating-top {
  width: 100%;
  white-space: nowrap;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.ag-layout-normal .ag-floating-top {
  position: absolute;
  left: 0px;
}

.ag-pinned-left-floating-top {
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  position: relative;
}

.ag-layout-normal .ag-pinned-left-floating-top {
  height: 100%;
}

.ag-pinned-right-floating-top {
  float: right;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  position: relative;
}

.ag-layout-normal .ag-pinned-right-floating-top {
  height: 100%;
}

.ag-floating-top-viewport {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.ag-layout-normal .ag-floating-top-viewport {
  height: 100%;
}

.ag-floating-top-container {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  white-space: nowrap;
}

.ag-floating-bottom {
  width: 100%;
  white-space: nowrap;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.ag-layout-normal .ag-floating-bottom {
  position: absolute;
  left: 0px;
}

.ag-pinned-left-floating-bottom {
  float: left;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  position: relative;
}

.ag-layout-normal .ag-pinned-left-floating-bottom {
  height: 100%;
}

.ag-pinned-right-floating-bottom {
  float: right;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
  overflow: hidden;
  position: relative;
}

.ag-layout-normal .ag-pinned-right-floating-bottom {
  height: 100%;
}

.ag-floating-bottom-viewport {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.ag-layout-normal .ag-floating-bottom-viewport {
  height: 100%;
}

.ag-floating-bottom-container {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
  white-space: nowrap;
}

.ag-pinned-left-cols-viewport {
  float: left;
}

.ag-pinned-left-cols-container {
  display: inline-block;
  position: relative;
}

.ag-pinned-right-cols-viewport {
  float: right;
}

.ag-ltr .ag-pinned-right-cols-viewport {
  overflow-x: hidden;
  overflow-y: auto;
}

.ag-ltr .ag-pinned-left-cols-viewport {
  overflow: hidden;
}

.ag-rtl .ag-pinned-right-cols-viewport {
  overflow: hidden;
}

.ag-rtl .ag-pinned-left-cols-viewport {
  overflow-x: hidden;
  overflow-y: auto;
}

.ag-pinned-right-cols-container {
  display: inline-block;
  position: relative;
}

.ag-layout-normal .ag-body-viewport-wrapper {
  height: 100%;
}

.ag-body-viewport {
  overflow-x: auto;
  overflow-y: auto;
}

.ag-layout-normal .ag-body-viewport {
  height: 100%;
}

.ag-full-width-viewport {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  display: inline;
  pointer-events: none;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: hidden;
}

.ag-full-width-container {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.ag-floating-bottom-full-width-container {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  pointer-events: none;
  overflow: hidden;
  display: inline;
}

.ag-floating-top-full-width-container {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  pointer-events: none;
  overflow: hidden;
  display: inline;
}

.ag-full-width-row {
  pointer-events: all;
  overflow: hidden;
}

.ag-layout-normal .ag-body-container {
  position: relative;
  display: inline-block;
}

.ag-layout-auto-height .ag-body-container {
  position: relative;
  display: inline-block;
}

.ag-row-animation {
  -webkit-transition: top 0.4s, height 0.4s, background-color 0.1s, opacity 0.2s;
  -moz-transition: top 0.4s, height 0.4s, background-color 0.1s, opacity 0.2s;
  -o-transition: top 0.4s, height 0.4s, background-color 0.1s, opacity 0.2s;
  -ms-transition: top 0.4s, height 0.4s, background-color 0.1s, opacity 0.2s;
  transition: top 0.4s, height 0.4s, background-color 0.1s, opacity 0.2s;
}

.ag-row-no-animation {
  -webkit-transition: background-color 0.1s;
  -moz-transition: background-color 0.1s;
  -o-transition: background-color 0.1s;
  -ms-transition: background-color 0.1s;
  transition: background-color 0.1s;
}

.ag-row {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.ag-layout-normal .ag-row {
  white-space: nowrap;
  position: absolute;
  width: 100%;
}

.ag-layout-auto-height .ag-row {
  white-space: nowrap;
  position: relative;
  width: 100%;
}

.ag-layout-for-print .ag-row {
  position: relative;
}

.ag-column-moving .ag-cell {
  -webkit-transition: left 0.2s;
  -moz-transition: left 0.2s;
  -o-transition: left 0.2s;
  -ms-transition: left 0.2s;
  transition: left 0.2s;
}

.ag-column-moving .ag-header-cell {
  -webkit-transition: left 0.2s;
  -moz-transition: left 0.2s;
  -o-transition: left 0.2s;
  -ms-transition: left 0.2s;
  transition: left 0.2s;
}

.ag-column-moving .ag-header-group-cell {
  -webkit-transition: left 0.2s, width 0.2s;
  -moz-transition: left 0.2s, width 0.2s;
  -o-transition: left 0.2s, width 0.2s;
  -ms-transition: left 0.2s, width 0.2s;
  transition: left 0.2s, width 0.2s;
}

.ag-column-drop {
  width: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.ag-column-drop-vertical .ag-column-drop-cell {
  display: block;
}

.ag-column-drop-vertical .ag-column-drop-empty-message {
  display: block;
}

.ag-column-drop-vertical .ag-column-drop-cell-button {
  line-height: 16px;
}

.ag-ltr .ag-column-drop-vertical .ag-column-drop-cell-button {
  float: right;
}

.ag-rtl .ag-column-drop-vertical .ag-column-drop-cell-button {
  float: left;
}

.ag-column-drop-horizontal {
  white-space: nowrap;
}

.ag-column-drop-horizontal .ag-column-drop-cell {
  display: inline-block;
}

.ag-column-drop-horizontal .ag-column-drop-empty-message {
  display: inline-block;
}

.ag-cell {
  display: inline-block;
  white-space: nowrap;
  height: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  position: absolute;
}

.ag-value-slide-out {
  opacity: 1;
  -ms-filter: none;
  filter: none;
  margin-right: 5px;
  -webkit-transition: opacity 3s, margin-right 3s;
  -moz-transition: opacity 3s, margin-right 3s;
  -o-transition: opacity 3s, margin-right 3s;
  -ms-transition: opacity 3s, margin-right 3s;
  transition: opacity 3s, margin-right 3s;
  -webkit-transition-timing-function: linear;
  -moz-transition-timing-function: linear;
  -o-transition-timing-function: linear;
  -ms-transition-timing-function: linear;
  transition-timing-function: linear;
}

.ag-value-slide-out-end {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  margin-right: 10px;
}

.ag-opacity-zero {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
}

.ag-cell-edit-input {
  width: 100%;
  height: 100%;
}

.ag-group-cell-entire-row {
  width: 100%;
  display: inline-block;
  white-space: nowrap;
  height: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ag-footer-cell-entire-row {
  width: 100%;
  display: inline-block;
  white-space: nowrap;
  height: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ag-large .ag-root {
  font-size: 20px;
}

.ag-popup-editor {
  position: absolute;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-menu {
  position: absolute;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.ag-menu-column-select-wrapper {
  width: 200px;
  height: 300px;
  overflow: auto;
}

.ag-menu-list {
  display: table;
  border-collapse: collapse;
}

.ag-menu-option {
  display: table-row;
}

.ag-menu-option-text {
  display: table-cell;
}

.ag-menu-option-shortcut {
  display: table-cell;
}

.ag-menu-option-icon {
  display: table-cell;
}

.ag-menu-option-popup-pointer {
  display: table-cell;
}

.ag-menu-separator {
  display: table-row;
}

.ag-menu-separator-cell {
  display: table-cell;
}

.ag-virtual-list-viewport {
  overflow-x: auto;
  height: 100%;
  width: 100%;
}

.ag-virtual-list-container {
  position: relative;
  overflow: hidden;
}

.ag-rich-select {
  outline: none;
}

.ag-rich-select-row {
  white-space: nowrap;
}

.ag-rich-select-list {
  width: 200px;
  height: 200px;
}

.ag-set-filter-list {
  width: 200px;
  height: 200px;
}

.ag-set-filter-item {
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.ag-virtual-list-item {
  position: absolute;
  width: 100%;
}

.ag-filter-filter {
  width: 170px;
  margin: 4px;
}

.ag-floating-filter-body input {
  width: 100%;
  margin: 0;
  height: 19px;
}

.ag-floating-filter-full-body input {
  width: 100%;
  margin: 0;
  height: 19px;
}

.ag-filter-select {
  width: 110px;
  margin: 4px 4px 0px 4px;
}

.ag-list-selection {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}

.ag-tool-panel {
  width: 200px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  overflow: auto;
}

.ag-layout-normal .ag-tool-panel {
  height: 100%;
}

.ag-column-select-indent {
  display: inline-block;
}

.ag-column-select-column {
  white-space: nowrap;
}

.ag-ltr .ag-column-select-column {
  margin-left: 14px;
}

.ag-rtl .ag-column-select-column {
  margin-right: 14px;
}

.ag-column-select-column-group {
  white-space: nowrap;
}

.ag-hidden {
  display: none !important;
}

.ag-visibility-hidden {
  visibility: hidden !important;
}

.ag-faded {
  opacity: 0.3;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  filter: alpha(opacity=30);
}

.ag-width-half {
  width: 50%;
  display: inline-block;
}

.ag-shake-left-to-right {
  -webkit-animation-name: ag-shake-left-to-right;
  -moz-animation-name: ag-shake-left-to-right;
  -o-animation-name: ag-shake-left-to-right;
  -ms-animation-name: ag-shake-left-to-right;
  animation-name: ag-shake-left-to-right;
  -webkit-animation-duration: 0.2s;
  -moz-animation-duration: 0.2s;
  -o-animation-duration: 0.2s;
  -ms-animation-duration: 0.2s;
  animation-duration: 0.2s;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -o-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  -moz-animation-direction: alternate;
  -o-animation-direction: alternate;
  -ms-animation-direction: alternate;
  animation-direction: alternate;
}

@-moz-keyframes ag-shake-left-to-right {
  from {
    padding-left: 6px;
    padding-right: 2px;
  }

  to {
    padding-left: 2px;
    padding-right: 6px;
  }
}

@-webkit-keyframes ag-shake-left-to-right {
  from {
    padding-left: 6px;
    padding-right: 2px;
  }

  to {
    padding-left: 2px;
    padding-right: 6px;
  }
}

@-o-keyframes ag-shake-left-to-right {
  from {
    padding-left: 6px;
    padding-right: 2px;
  }

  to {
    padding-left: 2px;
    padding-right: 6px;
  }
}

@keyframes ag-shake-left-to-right {
  from {
    padding-left: 6px;
    padding-right: 2px;
  }

  to {
    padding-left: 2px;
    padding-right: 6px;
  }
}

.lightbox-nav {
  position: relative;
  margin-bottom: 12px;
  /* the font-size of .btn-xs */
  height: 22px;
  text-align: center;
  font-size: 0;
  /* prevent the otherwise inherited font-size and line-height from adding extra space to the bottom of this div */
}

.lightbox-nav .btn-group {
  vertical-align: top;
}

.lightbox-nav .close {
  /* absolutely position this in order to center the nav buttons */
  position: absolute;
  top: 0;
  right: 0;
}

.lightbox-image-container {
  position: relative;
  text-align: center;
  /* center the image */
}

/* the caption overlays the top left corner of the image */
.lightbox-image-caption {
  position: absolute;
  top: 0;
  left: 0;
  margin: 0.5em 0.9em;
  /* the left and right margins are offset by 0.4em for the span box-shadow */
  color: #000;
  font-size: 1.5em;
  font-weight: bold;
  text-align: left;
  text-shadow: 0.1em 0.1em 0.2em rgba(255, 255, 255, 0.5);
}

.lightbox-image-caption span {
  padding-top: 0.1em;
  padding-bottom: 0.1em;
  background-color: rgba(255, 255, 255, 0.75);
  /* pad the left and right of each line of text */
  box-shadow: 0.4em 0 0 rgba(255, 255, 255, 0.75), -0.4em 0 0 rgba(255, 255, 255, 0.75);
}

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.1
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2016 Daniel Eden
 */
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

.animated.dur-2s {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.dur-3s {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

.animated.dur-4s {
  -webkit-animation-duration: 4s;
  animation-duration: 4s;
}

.animated.hinge {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
}

.animated.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}

@-webkit-keyframes bounce {

  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

@keyframes bounce {

  from,
  20%,
  53%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -30px, 0);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    -webkit-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);
    transform: translate3d(0, -4px, 0);
  }
}

.bounce {
  -webkit-animation-name: bounce;
  animation-name: bounce;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

@-webkit-keyframes flash {

  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

@keyframes flash {

  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {

  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

@keyframes shake {

  from,
  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }
}

.shake {
  -webkit-animation-name: shake;
  animation-name: shake;
}

@-webkit-keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-webkit-keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

@keyframes swing {
  20% {
    -webkit-transform: rotate3d(0, 0, 1, 15deg);
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    -webkit-transform: rotate3d(0, 0, 1, -10deg);
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    -webkit-transform: rotate3d(0, 0, 1, 5deg);
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    -webkit-transform: rotate3d(0, 0, 1, -5deg);
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.swing {
  -webkit-transform-origin: top center;
  transform-origin: top center;
  -webkit-animation-name: swing;
  animation-name: swing;
}

@-webkit-keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes wobble {
  from {
    -webkit-transform: none;
    transform: none;
  }

  15% {
    -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {

  from,
  11.1%,
  to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
    transform: skewX(0.39063deg) skewY(0.39063deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
    transform: skewX(-0.19531deg) skewY(-0.19531deg);
  }
}

@keyframes jello {

  from,
  11.1%,
  to {
    -webkit-transform: none;
    transform: none;
  }

  22.2% {
    -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    -webkit-transform: skewX(6.25deg) skewY(6.25deg);
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    -webkit-transform: skewX(0.39063deg) skewY(0.39063deg);
    transform: skewX(0.39063deg) skewY(0.39063deg);
  }

  88.8% {
    -webkit-transform: skewX(-0.19531deg) skewY(-0.19531deg);
    transform: skewX(-0.19531deg) skewY(-0.19531deg);
  }
}

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes bounceIn {

  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {

  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {

  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInDown {

  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -3000px, 0);
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, 25px, 0);
    transform: translate3d(0, 25px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, 5px, 0);
    transform: translate3d(0, 5px, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {

  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInLeft {

  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: translate3d(-3000px, 0, 0);
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(25px, 0, 0);
    transform: translate3d(25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(-10px, 0, 0);
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(5px, 0, 0);
    transform: translate3d(5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {

  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInRight {

  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(3000px, 0, 0);
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(-25px, 0, 0);
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    -webkit-transform: translate3d(10px, 0, 0);
    transform: translate3d(10px, 0, 0);
  }

  90% {
    -webkit-transform: translate3d(-5px, 0, 0);
    transform: translate3d(-5px, 0, 0);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {

  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {

  from,
  60%,
  75%,
  90%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 3000px, 0);
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  75% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  90% {
    -webkit-transform: translate3d(0, -5px, 0);
    transform: translate3d(0, -5px, 0);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.bounceInUp {
  -webkit-animation-name: bounceInUp;
  animation-name: bounceInUp;
}

@-webkit-keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  50%,
  55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

.bounceOut {
  -webkit-animation-name: bounceOut;
  animation-name: bounceOut;
}

@-webkit-keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes bounceOutDown {
  20% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, -20px, 0);
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.bounceOutDown {
  -webkit-animation-name: bounceOutDown;
  animation-name: bounceOutDown;
}

@-webkit-keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(20px, 0, 0);
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.bounceOutLeft {
  -webkit-animation-name: bounceOutLeft;
  animation-name: bounceOutLeft;
}

@-webkit-keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    -webkit-transform: translate3d(-20px, 0, 0);
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.bounceOutRight {
  -webkit-animation-name: bounceOutRight;
  animation-name: bounceOutRight;
}

@-webkit-keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes bounceOutUp {
  20% {
    -webkit-transform: translate3d(0, -10px, 0);
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  40% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    -webkit-animation-timing-function: ease-out;
    animation-timing-function: ease-out;
  }

  50% {
    -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  80% {
    -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

.animated.flip {
  -webkit-backface-visibility: visible;
  backface-visibility: visible;
  -webkit-animation-name: flip;
  animation-name: flip;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}

@-webkit-keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  from {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
}

@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

@-webkit-keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.flipOutY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipOutY;
  animation-name: flipOutY;
}

@-webkit-keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  from {
    -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: skewX(-5deg);
    transform: skewX(-5deg);
    opacity: 1;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.lightSpeedIn {
  -webkit-animation-name: lightSpeedIn;
  animation-name: lightSpeedIn;
  -webkit-animation-timing-function: ease-out;
  animation-timing-function: ease-out;
}

@-webkit-keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.lightSpeedOut {
  -webkit-animation-name: lightSpeedOut;
  animation-name: lightSpeedOut;
  -webkit-animation-timing-function: ease-in;
  animation-timing-function: ease-in;
}

@-webkit-keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateIn {
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
}

@-webkit-keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownLeft {
  -webkit-animation-name: rotateInDownLeft;
  animation-name: rotateInDownLeft;
}

@-webkit-keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInDownRight {
  -webkit-animation-name: rotateInDownRight;
  animation-name: rotateInDownRight;
}

@-webkit-keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpLeft {
  -webkit-animation-name: rotateInUpLeft;
  animation-name: rotateInUpLeft;
}

@-webkit-keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

.rotateInUpRight {
  -webkit-animation-name: rotateInUpRight;
  animation-name: rotateInUpRight;
}

@-webkit-keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.rotateOut {
  -webkit-animation-name: rotateOut;
  animation-name: rotateOut;
}

@-webkit-keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.rotateOutDownLeft {
  -webkit-animation-name: rotateOutDownLeft;
  animation-name: rotateOutDownLeft;
}

@-webkit-keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutDownRight {
  -webkit-animation-name: rotateOutDownRight;
  animation-name: rotateOutDownRight;
}

@-webkit-keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.rotateOutUpLeft {
  -webkit-animation-name: rotateOutUpLeft;
  animation-name: rotateOutUpLeft;
}

@-webkit-keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

@keyframes rotateOutUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.rotateOutUpRight {
  -webkit-animation-name: rotateOutUpRight;
  animation-name: rotateOutUpRight;
}

@-webkit-keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

@keyframes hinge {
  0% {
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    -webkit-transform: rotate3d(0, 0, 1, 80deg);
    transform: rotate3d(0, 0, 1, 80deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    -webkit-transform: rotate3d(0, 0, 1, 60deg);
    transform: rotate3d(0, 0, 1, 60deg);
    -webkit-transform-origin: top left;
    transform-origin: top left;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.rollOut {
  -webkit-animation-name: rollOut;
  animation-name: rollOut;
}

@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

@-webkit-keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInDown {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInDown {
  -webkit-animation-name: zoomInDown;
  animation-name: zoomInDown;
}

@-webkit-keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInLeft {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInLeft {
  -webkit-animation-name: zoomInLeft;
  animation-name: zoomInLeft;
}

@-webkit-keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInRight {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInRight {
  -webkit-animation-name: zoomInRight;
  animation-name: zoomInRight;
}

@-webkit-keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomInUp {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomInUp {
  -webkit-animation-name: zoomInUp;
  animation-name: zoomInUp;
}

@-webkit-keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

.zoomOut {
  -webkit-animation-name: zoomOut;
  animation-name: zoomOut;
}

@-webkit-keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutDown {
  -webkit-animation-name: zoomOutDown;
  animation-name: zoomOutDown;
}

@-webkit-keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    -webkit-transform-origin: left center;
    transform-origin: left center;
  }
}

.zoomOutLeft {
  -webkit-animation-name: zoomOutLeft;
  animation-name: zoomOutLeft;
}

@-webkit-keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
    transform: scale(0.1) translate3d(2000px, 0, 0);
    -webkit-transform-origin: right center;
    transform-origin: right center;
  }
}

.zoomOutRight {
  -webkit-animation-name: zoomOutRight;
  animation-name: zoomOutRight;
}

@-webkit-keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.zoomOutUp {
  -webkit-animation-name: zoomOutUp;
  animation-name: zoomOutUp;
}

@-webkit-keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}

.rotation {
  animation: rotation .7s infinite linear;
  -webkit-animation: rotation .7s infinite linear;
}

@-webkit-keyframes rotation {
  from {
    -webkit-transform: rotate(0deg);
  }

  to {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes rotation {
  from {
    transform: scale(1) rotate(0deg);
  }

  to {
    transform: scale(1) rotate(360deg);
  }
}

/* define bootstrap 5 columns */
.col-xs-1-5,
.col-sm-1-5,
.col-md-1-5,
.col-lg-1-5 {
  position: relative;
  min-height: 1px;
  padding-right: 10px;
  padding-left: 10px;
}

.col-xs-1-5 {
  width: 20%;
  float: left;
}

@media (min-width: 768px) {
  .col-sm-1-5 {
    width: 20%;
    float: left;
  }
}

@media (min-width: 992px) {
  .col-md-1-5 {
    width: 20%;
    float: left;
  }
}

@media (min-width: 1200px) {
  .col-lg-1-5 {
    width: 20%;
    float: left;
  }
}

.badge {
  font-family: sans-serif;
}

.has-error2 .form-control {
  border-color: #007d85;
}

.has-error2 .help-block {
  color: #007d85;
}

.modal-open {
  padding-right: 0 !important;
  overflow: auto;
}

.popover {
  font-family: "微軟正黑體";
}

.btn .fa-angle-down,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button .fa-angle-down {
  font-size: 20px;
  font-weight: bold;
}

.alert {
  position: relative;
}

.alert i {
  position: absolute;
}

.alert i~span {
  padding-left: 25px !important;
  display: inline-block;
}

.alert-info {
  border-color: #cee8f5;
  background: #e7f5fc;
}

.alert-success {
  border-color: #d1ecc6;
  background: #e7fae0;
}

.alert-danger {
  border-color: #ffd6ca;
  background: #ffe9e9;
  color: #ca5656;
}

@media (min-width: 768px) {
  .form-horizontal .control-label {
    padding-top: 5px;
  }
}

.uib-datepicker {
  outline: none;
  padding: 4px;
}

.uib-datepicker table.uib-daypicker {
  width: 100%;
  outline: none;
}

.uib-datepicker table.uib-daypicker * {
  font-size: 12px !important;
}

.uib-datepicker table.uib-daypicker .small {
  font-size: 85% !important;
}

.uib-datepicker.well {
  background-color: #fff;
  -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}

.uib-datepicker .btn-info.active {
  border-color: transparent;
}

.uib-datepicker .btn-info.active .text-info {
  color: #fff;
}

.uib-datepicker .btn-default,
.uib-datepicker .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .uib-datepicker .ag-paging-button {
  border-color: transparent;
}

.uib-datepicker .btn-info.active {
  background-color: #0ea75c;
}

.uib-datepicker .btn-info.active:hover {
  background-color: #0c8f4f;
}

.uib-datepicker .text-muted {
  color: #c7c7c7;
}

.help-block {
  margin-bottom: 0;
  position: absolute;
  top: 24px;
  left: 2px;
  font-size: 10px;
}

.help-block i {
  margin-right: 3px;
}

.dropdown-menu {
  border-color: #0eab5f;
  margin-top: 0;
  min-width: 100%;
  padding-top: 20px;
  border-radius: 0;
}

.dropdown-menu .title {
  padding-left: 10px;
}

.uib-datepicker-popup.dropdown-menu {
  padding-top: 2px;
}

.btn-icon-large {
  padding: 1px 10px 2px !important;
}

.btn-icon-large i {
  font-size: 17px !important;
}

.btn-icon-larger {
  padding: 2px 6px 1px !important;
}

.btn-icon-larger i {
  font-size: 22px !important;
  line-height: 1;
}

.input-group .btn,
.input-group .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .input-group .ag-paging-button,
button.btn,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel button.ag-paging-button {
  padding: 4px 10px;
  /* padding: 6px 12px; */
}

button.close {
  position: absolute;
  right: 2px;
  top: 2px;
  width: 18px;
  height: 18px;
  z-index: 999999;
  font-size: 18px;
  font-weight: 600;
  font-family: sans-serif;
}

.pagination {
  font-size: 13px;
}

.table-responsive.table-layout-fixed table {
  white-space: nowrap;
  table-layout: fixed;
  width: auto;
}

.table-responsive.table-layout-fixed table th {
  width: auto;
}

.table-responsive.table-layout-fixed table th:last-child {
  width: auto;
}

@media (max-width: 767px) {
  .main-content .container {
    padding-right: 6px;
    padding-left: 6px;
  }

  .main-content .container .col-lg-1,
  .main-content .container .col-lg-10,
  .main-content .container .col-lg-11,
  .main-content .container .col-lg-12,
  .main-content .container .col-lg-2,
  .main-content .container .col-lg-3,
  .main-content .container .col-lg-4,
  .main-content .container .col-lg-5,
  .main-content .container .col-lg-6,
  .main-content .container .col-lg-7,
  .main-content .container .col-lg-8,
  .main-content .container .col-lg-9,
  .main-content .container .col-md-1,
  .main-content .container .col-md-10,
  .main-content .container .col-md-11,
  .main-content .container .col-md-12,
  .main-content .container .col-md-2,
  .main-content .container .col-md-3,
  .main-content .container .col-md-4,
  .main-content .container .col-md-5,
  .main-content .container .col-md-6,
  .main-content .container .col-md-7,
  .main-content .container .col-md-8,
  .main-content .container .col-md-9,
  .main-content .container .col-sm-1,
  .main-content .container .col-sm-10,
  .main-content .container .col-sm-11,
  .main-content .container .col-sm-12,
  .main-content .container .col-sm-2,
  .main-content .container .col-sm-3,
  .main-content .container .col-sm-4,
  .main-content .container .col-sm-5,
  .main-content .container .col-sm-6,
  .main-content .container .col-sm-7,
  .main-content .container .col-sm-8,
  .main-content .container .col-sm-9,
  .main-content .container .col-xs-1,
  .main-content .container .col-xs-10,
  .main-content .container .col-xs-11,
  .main-content .container .col-xs-12,
  .main-content .container .col-xs-2,
  .main-content .container .col-xs-3,
  .main-content .container .col-xs-4,
  .main-content .container .col-xs-5,
  .main-content .container .col-xs-6,
  .main-content .container .col-xs-7,
  .main-content .container .col-xs-8,
  .main-content .container .col-xs-9 {
    padding-left: 6px;
    padding-right: 6px;
  }

  .main-content .container .row {
    margin-right: -6px;
    margin-left: -6px;
  }

  .panel-body {
    padding: 10px;
  }
}

@media (min-width: 768px) {
  .sm-pull-right {
    float: right !important;
  }
}

.modal-wrap {
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
  /* display: -webkit-flex; display: -ms-flex; display: flex;
  -webkit-justify-content: center; -ms-flex-pack: center; -webkit-box-pack: center; justify-content: center;
  -webkit-align-items: center; -ms-flex-align: center; -webkit-box-align: center; align-items: center; */
}

.grid-list {
  /* min-height: 526px; */
}

@media (max-width: 767px) {
  .grid-list {
    height: auto;
  }
}

.modal-content {
  padding: 12px 10px 5px;
}

@media (max-width: 767px) {
  .modal-content {
    padding: 10px 0 2px;
  }
}

.modal-content .title {
  padding-left: 8px;
  margin: 12px 0;
}

.modal-content table {
  margin-bottom: 8px;
}

.modal-footer {
  border-top: none;
}

.modal-400 {
  max-width: 400px;
}

.modal-420 {
  max-width: 420px;
}

.modal-440 {
  max-width: 440px;
}

.modal-500 {
  max-width: 500px;
}

.modal-620 {
  max-width: 620px;
  width: 620px;
}

.modal-640 {
  max-width: 640px;
  width: 640px;
}

.modal-840 {
  max-width: 840px;
  width: 840px;
}

.modal-col-1 {
  max-width: 380px;
  width: 380px;
}

.modal-col-2 {
  max-width: 760px;
  width: 760px;
}

.modal-col-3 {
  max-width: 1080px;
  width: 1080px;
}

.popupWidth-col-1 {
  max-width: 380px;
  width: 380px;
}

.popupWidth-col-2 {
  max-width: 760px;
  width: 760px;
}

.popupWidth-col-3 {
  max-width: 1080px;
  width: 1080px;
}

.hint-popup {
  position: absolute;
  top: 0;
  background: #fff;
  border: 3px solid #e1f3ea;
  color: #10be69;
  border-radius: 10px;
  letter-spacing: -1px;
  padding: 6px 5px;
  line-height: 1.1;
  right: 148px;
  text-align: center;
  width: 120px;
}

.hint-popup a {
  color: #10be69 !important;
  font-size: 13px;
  font-weight: bold;
}

.hint-popup a:hover {
  color: #0dab5f !important;
}

.hint-popup:before {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 10px 0 10px;
  border-color: #ffffff transparent transparent transparent;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -10px;
  z-index: 9;
}

.hint-popup:after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 10px 0 10px;
  border-color: #e1f3ea transparent transparent transparent;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  bottom: -16px;
}

.modal-dialog {
  /* margin:0; */
  /* width: 96%  ; */
  /* max-width: 800px ;  */
  max-height: 90%;
}

.max-height-30 {
  max-height: 30px;
}

@media (max-width: 767px) {
  .modal-dialog {
    width: 96% !important;
  }
}

@media (min-width: 768px) {
  .modal-dialog {
    /* width: 100% ; */
    /* max-width: 400px;margin:0; */
  }
}

.alert-warning-style2 {
  background: #ffede1;
  color: #6d3713;
  border-color: #fbe3d3;
}

.alert-warning-style2.dialog-box {
  padding-left: 80px;
  min-height: 76px;
}

.alert-warning-style2 .dialog {
  color: #fff;
  background: #ff6600;
  font-size: 17px;
  font-weight: bold;
  text-align: center;
  padding-top: 14px;
  line-height: 1.2;
  width: 62px;
  height: 62px;
  border-radius: 100%;
  position: absolute;
  left: 6px;
  top: 6px;
}

.alert-warning-style2 .dialog p {
  font-size: 13px;
}

.alert-warning-style2 .dialog:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  margin: auto -12px auto auto;
  border: 8px solid transparent;
  border-left-color: #ff6600;
  line-height: 0;
  height: 0;
  width: 0;
}

.alert-gray {
  background: #f3f3f3;
  color: #545454;
  border-color: #dcdcdc;
}

.progress {
  background-color: #eaeaea;
  height: 16px;
}

.progress .progress-bar {
  line-height: 16px;
}

.tooltip-inner {
  max-width: 400px;
}

.clearfix {
  *zoom: 1;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
  line-height: 0;
}

.clearfix:after {
  clear: both;
}

.hide-text {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.input-block-level {
  display: block;
  width: 100%;
  min-height: 30px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.btn-file {
  overflow: hidden;
  position: relative;
  vertical-align: middle;
  height: 270px;
}

.btn-file label {
  height: 100%;
}

.btn-file img {
  position: relative;
  display: block;
  margin: 0 auto;
  max-height: 100%;
  width: auto;
}

@media (max-width: 1200px) {
  .btn-file {
    height: 173px;
  }
}

@media (max-width: 992px) {
  .btn-file {
    height: 250px;
  }
}

@media (max-width: 767px) {
  .btn-file {
    max-height: none;
    min-height: 0;
    height: auto;
  }

  .btn-file img {
    max-height: none;
    min-height: 0;
    position: relative;
  }
}

.btn-file>input {
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  opacity: 0;
  width: 100%;
  height: 100%;
  cursor: pointer;
}

.fileupload {
  margin-bottom: 9px;
}

.fileupload .fileupload-new {
  cursor: pointer !important;
}

.fileupload .btn-file {
  height: 30px;
  max-height: 30px !important;
}

.fileupload .btn-file a {
  color: #666666;
}

.fileupload .btn-file a:hover {
  color: #000;
}

.fileupload .uneditable-input {
  display: inline-block;
  margin-bottom: 0px;
  vertical-align: middle;
  cursor: text;
}

.fileupload .thumbnail {
  overflow: hidden;
  display: inline-block;
  margin-bottom: 5px;
  vertical-align: middle;
  text-align: center;
}

.fileupload .thumbnail>img {
  display: inline-block !important;
  vertical-align: middle;
  max-height: 100%;
}

.thumbnail img {
  display: inline-block;
}

.fileupload .btn,
.fileupload .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .fileupload .ag-paging-button {
  vertical-align: middle;
}

.fileupload-exists .fileupload-new,
.fileupload-new .fileupload-exists {
  display: none;
}

.fileupload-inline .fileupload-controls {
  display: inline;
}

.fileupload-new .input-append .btn-file {
  -webkit-border-radius: 0 3px 3px 0;
  -moz-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;
}

.thumbnail-borderless .thumbnail {
  border: none;
  padding: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

.fileupload-new.thumbnail-borderless .thumbnail {
  border: 1px solid #ddd;
}

.control-group.warning .fileupload .uneditable-input {
  color: #a47e3c;
  border-color: #a47e3c;
}

.control-group.warning .fileupload .fileupload-preview {
  color: #a47e3c;
}

.control-group.warning .fileupload .thumbnail {
  border-color: #a47e3c;
}

.control-group.error .fileupload .uneditable-input {
  color: #b94a48;
  border-color: #b94a48;
}

.control-group.error .fileupload .fileupload-preview {
  color: #b94a48;
}

.control-group.error .fileupload .thumbnail {
  border-color: #b94a48;
}

.control-group.success .fileupload .uneditable-input {
  color: #468847;
  border-color: #468847;
}

.control-group.success .fileupload .fileupload-preview {
  color: #468847;
}

.control-group.success .fileupload .thumbnail {
  border-color: #468847;
}

.show-hide {
  -webkit-animation: show-hide 1.5s both;
  animation: show-hide 1.5s both;
}

@keyframes show-hide {
  0% {
    opacity: 0;
    transform: translateX(0%);
  }

  10% {
    opacity: 1;
    transform: translateX(0%);
  }

  90% {
    opacity: 1;
    transform: translateX(0%);
  }

  99% {
    opacity: 0;
    transform: translateX(0%);
  }

  100% {
    opacity: 0;
    transform: translateX(-100%);
  }
}

@-webkit-keyframes show-hide {
  0% {
    opacity: 0;
    -webkit-transform: translateX(0%);
  }

  10% {
    opacity: 1;
    -webkit-transform: translateX(0%);
  }

  90% {
    opacity: 1;
    -webkit-transform: translateX(0%);
  }

  99% {
    opacity: 0;
    -webkit-transform: translateX(0%);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-100%);
  }
}

/* ---------------------------------------------------------------------- */
/*  Select2
/* ---------------------------------------------------------------------- */
.select2-container .select2-choice {
  background-image: none;
  border: 1px solid #e6e8e8;
  border-radius: 2px;
  height: 35px;
  padding: 3px 9px;
  transition: border 0.2s linear 0s;
}

.select2-container .select2-choice .select2-arrow {
  background: none repeat scroll 0 0 transparent;
  border-left: 0 none;
}

.select2-container .select2-choice .select2-arrow b {
  background: none;
}

.select2-container .select2-choice .select2-arrow b:before {
  content: "\f0d7";
  font-family: 'FontAwesome';
  font-size: 12px;
  position: relative;
  left: 2px;
  top: 2px;
}

.select2-container.select2-drop-above .select2-choice {
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
}

.select2-dropdown-open.select2-drop-above .select2-choice,
.select2-dropdown-open.select2-drop-above .select2-choices {
  background: #F8F8F8;
  border: 1px solid #e6e8e8;
}

.select2-dropdown-open .select2-choice .select2-arrow b {
  transform: scale(1, -1);
}

.select2-drop.select2-drop-above {
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  box-shadow: none;
}

.select2-drop.select2-drop-above.select2-drop-active {
  border-color: #e6e8e8;
  border-image: none;
  border-radius: 2px;
  border-style: solid solid none;
  border-width: 1px 1px medium;
  padding-top: 0;
}

.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
  background: #f4f5f7;
  border: 1px solid #e5e9ec;
  border-top-left-radius: 2px;
  border-top-right-radius: 2px;
  box-shadow: none;
}

.select2-search {
  padding: 4px 8px;
}

.select2-search input {
  border-radius: 2px;
  font-size: 12px;
  line-height: 28px;
  vertical-align: baseline;
}

.select2-search input:focus {
  background: #ffffff !important;
  border: 1px solid #e6e8e8 !important;
}

.select2-comment {
  text-align: center;
  margin: 10px 0 15px;
  color: #adadad;
}

.select2-results {
  overflow-y: auto;
  max-height: 365px;
  margin: 6px 8px 10px;
}

.select2-results .form-horizontal {
  padding-top: 10px;
}

.select2-results.inputDownSelect {
  max-height: 260px;
}

.select2-results.inputDownSelect-short {
  max-height: 150px;
}

@media (max-width: 767px) {
  .select2-results {
    max-height: 260px;
  }

  .select2-results.shorter-xs {
    min-height: 160px;
    margin-bottom: 26px !important;
  }
}

.select2-results.inputDownSelect ul,
.select2-results.inputDownSelect-short ul {
  list-style: none;
  padding: 0;
  margin-bottom: 0;
}

.select2-results.inputDownSelect ul li,
.select2-results.inputDownSelect-short ul li {
  padding: 3px 5px;
  cursor: pointer;
  border-radius: 0px;
}

.select2-results.inputDownSelect ul li:hover,
.select2-results.inputDownSelect-short ul li:hover {
  background: #1e90ff;
  color: #fff;
}

@media (max-width: 767px) {
  .modal-content-xs-scroll {
    overflow-y: auto;
    max-height: calc(100vh - 150px);
    margin: 6px 8px 10px;
  }
}

.select2-results.footer-btn-mrgin {
  /* margin-bottom: 56px; */
  margin-bottom: 46px;
}

.select2-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
  padding: 6px;
}

.select2-results li.select2-result-with-children>.select2-result-label {
  color: #282323;
}

.select2-results .select2-highlighted {
  background: #0090d9;
  border-radius: 3px;
}

.select2-results .select2-highlighted .select2-result-label {
  color: #ffffff;
}

.select2-results .select2-no-results,
.select2-results .select2-searching,
.select2-results .select2-selection-limit {
  background: none;
  color: #6f7b8a;
  font-size: 12px;
  padding-left: 8px;
  padding-top: 0;
  position: relative;
  top: -5px;
}

.select2-drop-active {
  -moz-border-bottom-colors: none;
  -moz-border-left-colors: none;
  -moz-border-right-colors: none;
  -moz-border-top-colors: none;
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
  border-color: #e6e8e8;
  border-image: none;
  border-left: 1px solid #e6e8e8;
  border-right: 1px solid #e6e8e8;
  border-style: none solid;
  border-width: medium 1px;
  padding-top: 5px;
}

.select2-container-multi .select2-choices {
  background-image: none;
  border: 1px solid #dae0e4;
  border-radius: 2px;
}

.select2-container-multi .select2-choices .select2-search-choice {
  background-color: #e8edf1;
  background-image: none;
  border: medium none;
  border-radius: 8px;
  box-shadow: none;
  color: inherit;
  direction: ltr;
  margin: 8px -5px 7px 10px;
  padding: 4px 8px 4px 21px;
}

.select2-container-multi.select2-container-active .select2-choices {
  border: 1px solid #dae0e4;
  box-shadow: none;
}

.select2-container-multi.select2-container-active .select2-search-choice {
  background-color: #fff !important;
}

.select2-container-multi .select2-search-choice-close {
  left: 6px;
}

.select2-search-choice-close {
  background: none;
  right: 0;
  top: 4px;
}

.select2-search-choice-close:hover {
  text-decoration: none;
}

.select2-search-choice-close:before {
  color: #94a1b2;
  content: "\f00d";
  font-family: 'FontAwesome';
  font-size: 12px;
}

.select2-drop-multi .select2-results .select2-no-results,
.select2-drop-multi .select2-results .select2-searching,
.select2-drop-multi .select2-results .select2-selection-limit {
  top: 0;
}

.select2-container-multi .select2-choices .select2-search-field input {
  min-height: 37px;
  padding: 6px 11px !important;
  background: none !important;
}

.select2.form-control {
  border: 0 none;
  box-shadow: none;
  padding: 0;
}

.select-item {
  margin: 0 8px;
  position: relative;
  border: 1px solid #ddd;
  margin-bottom: 58px;
}

.select-item h3 {
  background: #f5f5f5;
  font-size: 15px;
  margin: 0;
  padding: 10px;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
}

.select-item ol {
  list-style: none;
  padding-left: 0px;
  margin-top: 8px;
}

.select-item ol li {
  padding: 4px;
  padding-left: 12px;
  padding-right: 46px;
  cursor: pointer;
  margin-top: -2px;
  position: relative;
}

.select-item ol li:hover {
  color: #0c8f4f;
}

.select-item ol li.active {
  background: #eafff4;
  border: 2px solid #a9e3c7;
  border-right: none;
  border-left: none;
}

.select-item ol li .btn-up-down {
  display: none;
  position: absolute;
  right: 3px;
  top: 50%;
  margin-top: -22px;
  zoom: .5;
}

.select-item ol li:hover .btn-up-down {
  display: block;
}

@media (max-width: 767px) {
  .select-item ol {
    overflow: auto;
    height: 80px;
  }
}

.select-item .btn-switch {
  position: absolute;
  left: -40px;
  top: 50%;
  margin-top: -34px;
  width: 30px;
  text-align: center;
}

.select-item .btn-switch .btn,
.select-item .btn-switch .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .select-item .btn-switch .ag-paging-button {
  margin-bottom: 5px;
}

@media (max-width: 767px) {
  .select-item .btn-switch {
    left: 50%;
    margin-left: -50px;
    top: -38px;
    margin-top: 0;
    width: 100px;
  }

  .select-item .btn-switch .btn,
  .select-item .btn-switch .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
  .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .select-item .btn-switch .ag-paging-button {
    margin: 2px;
  }
}

.select-item .note {
  position: absolute;
  bottom: -32px;
}

.ag-fresh {
  line-height: 1.4;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: #222;
  /* this is for the rowGroupPanel, that appears along the top of the grid */
  /* this is for the column drops that appear in the toolPanel */
}

.ag-fresh img {
  vertical-align: middle;
  border: 0;
}

.ag-fresh .ag-root {
  border: 1px solid #808080;
}

.ag-fresh .ag-cell-data-changed {
  background-color: #cec;
}

.ag-fresh .ag-cell-data-changed-animation {
  background-color: transparent;
  -webkit-transition: background-color 1s;
  -moz-transition: background-color 1s;
  -o-transition: background-color 1s;
  -ms-transition: background-color 1s;
  transition: background-color 1s;
}

.ag-fresh .ag-cell-not-inline-editing {
  padding: 2px;
}

.ag-fresh .ag-cell-range-selected-1:not(.ag-cell-focus) {
  background-color: rgba(120, 120, 120, 0.4);
}

.ag-fresh .ag-cell-range-selected-2:not(.ag-cell-focus) {
  background-color: rgba(80, 80, 80, 0.4);
}

.ag-fresh .ag-cell-range-selected-3:not(.ag-cell-focus) {
  background-color: rgba(40, 40, 40, 0.4);
}

.ag-fresh .ag-cell-range-selected-4:not(.ag-cell-focus) {
  background-color: rgba(0, 0, 0, 0.4);
}

.ag-fresh .ag-cell-focus {
  border: 1px solid #a9a9a9;
}

.ag-fresh .ag-cell-no-focus {
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
}

.ag-fresh .ag-ltr .ag-cell-no-focus {
  border-right: 1px dotted #808080;
  border-left: 1px solid transparent;
}

.ag-fresh .ag-rtl .ag-cell-no-focus {
  border-right: 1px solid transparent;
  border-left: 1px dotted #808080;
}

.ag-fresh .ag-rtl .ag-cell-first-right-pinned {
  border-left: 1px solid #808080;
}

.ag-fresh .ag-ltr .ag-cell-first-right-pinned {
  border-left: 1px solid #808080;
}

.ag-fresh .ag-rtl .ag-cell-last-left-pinned {
  border-right: 1px solid #808080;
}

.ag-fresh .ag-ltr .ag-cell-last-left-pinned {
  border-right: 1px solid #808080;
}

.ag-fresh .ag-cell-highlight {
  border: 1px solid #006400;
}

.ag-fresh .ag-cell-highlight-animation {
  -webkit-transition: border 1s;
  -moz-transition: border 1s;
  -o-transition: border 1s;
  -ms-transition: border 1s;
  transition: border 1s;
}

.ag-fresh .ag-value-change-delta {
  padding-right: 2px;
}

.ag-fresh .ag-value-change-delta-up {
  color: #006400;
}

.ag-fresh .ag-value-change-delta-down {
  color: #8b0000;
}

.ag-fresh .ag-value-change-value {
  background-color: transparent;
  border-radius: 1px;
  padding-left: 1px;
  padding-right: 1px;
  -webkit-transition: background-color 1s;
  -moz-transition: background-color 1s;
  -o-transition: background-color 1s;
  -ms-transition: background-color 1s;
  transition: background-color 1s;
}

.ag-fresh .ag-value-change-value-highlight {
  background-color: #cec;
  -webkit-transition: background-color 0.1s;
  -moz-transition: background-color 0.1s;
  -o-transition: background-color 0.1s;
  -ms-transition: background-color 0.1s;
  transition: background-color 0.1s;
}

.ag-fresh .ag-rich-select {
  font-size: 14px;
  border: 1px solid #808080;
  background-color: #fff;
}

.ag-fresh .ag-rich-select-value {
  padding: 2px;
}

.ag-fresh .ag-rich-select-list {
  border-top: 1px solid #d3d3d3;
}

.ag-fresh .ag-rich-select-row {
  padding: 2px;
}

.ag-fresh .ag-rich-select-row-selected {
  background-color: #bde2e5;
}

.ag-fresh .ag-large-text {
  border: 1px solid #808080;
}

.ag-fresh .ag-header-select-all {
  padding: 5px 0px 0px 3px;
  line-height: 0;
}

.ag-fresh .ag-header {
  color: #000;
  background: -webkit-linear-gradient(#fff, #d3d3d3);
  background: -moz-linear-gradient(#fff, #d3d3d3);
  background: -o-linear-gradient(#fff, #d3d3d3);
  background: -ms-linear-gradient(#fff, #d3d3d3);
  background: linear-gradient(#ffffff, #d3d3d3);
  border-bottom: 1px solid #808080;
  font-weight: normal;
}

.ag-fresh .ag-header-icon {
  color: #000;
  stroke: none;
  fill: #000;
}

.ag-fresh .ag-layout-for-print .ag-header-container {
  background: -webkit-linear-gradient(#fff, #d3d3d3);
  background: -moz-linear-gradient(#fff, #d3d3d3);
  background: -o-linear-gradient(#fff, #d3d3d3);
  background: -ms-linear-gradient(#fff, #d3d3d3);
  background: linear-gradient(#ffffff, #d3d3d3);
  border-bottom: 1px solid #808080;
}

.ag-fresh .ag-ltr .ag-header-cell {
  border-right: 1px solid #808080;
}

.ag-fresh .ag-rtl .ag-header-cell {
  border-left: 1px solid #808080;
}

.ag-fresh .ag-header-cell-moving .ag-header-cell-label {
  opacity: 0.5;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
}

.ag-fresh .ag-header-cell-moving {
  background-color: #bebebe;
}

.ag-fresh .ag-ltr .ag-header-group-cell {
  border-right: 1px solid #808080;
}

.ag-fresh .ag-rtl .ag-header-group-cell {
  border-left: 1px solid #808080;
}

.ag-fresh .ag-header-group-cell-with-group {
  border-bottom: 1px solid #808080;
}

.ag-fresh .ag-header-cell-label {
  padding: 4px 2px 4px 2px;
}

.ag-fresh .ag-header-cell-text {
  padding-left: 2px;
}

.ag-fresh .ag-header-group-cell-label {
  padding: 4px;
}

.ag-fresh .ag-ltr .ag-header-group-cell-label {
  padding-left: 10px;
}

.ag-fresh .ag-rtl .ag-header-group-cell-label {
  padding-right: 10px;
}

.ag-fresh .ag-rtl .ag-header-group-text {
  margin-left: 2px;
}

.ag-fresh .ag-ltr .ag-header-group-text {
  margin-right: 2px;
}

.ag-fresh .ag-header-cell-menu-button {
  padding: 2px;
  margin-top: 4px;
  margin-left: 1px;
  margin-right: 1px;
  border: 1px solid transparent;
  border-radius: 3px;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  line-height: 0px;
}

.ag-fresh .ag-ltr .ag-pinned-right-header {
  border-left: 1px solid #808080;
}

.ag-fresh .ag-rtl .ag-pinned-left-header {
  border-right: 1px solid #808080;
}

.ag-fresh .ag-header-cell-menu-button:hover {
  border: 1px solid #808080;
}

.ag-fresh .ag-body {
  background-color: #f6f6f6;
}

.ag-fresh .ag-row-odd {
  background-color: #f6f6f6;
}

.ag-fresh .ag-row-even {
  background-color: #fff;
}

.ag-fresh .ag-row-selected {
  background-color: #b0e0e6;
}

.ag-fresh .ag-row-stub {
  background-color: #f0f0f0;
}

.ag-fresh .ag-stub-cell {
  padding: 2px 2px 2px 10px;
}

.ag-fresh .ag-floating-top .ag-row {
  background-color: #f0f0f0;
}

.ag-fresh .ag-floating-bottom .ag-row {
  background-color: #f0f0f0;
}

.ag-fresh .ag-overlay-loading-wrapper {
  background-color: rgba(255, 255, 255, 0.5);
}

.ag-fresh .ag-overlay-loading-center {
  background-color: #fff;
  border: 1px solid #808080;
  border-radius: 10px;
  padding: 10px;
  color: #000;
}

.ag-fresh .ag-overlay-no-rows-center {
  background-color: #fff;
  border: 1px solid #808080;
  border-radius: 10px;
  padding: 10px;
}

.ag-fresh .ag-group-cell-entire-row {
  background-color: #f6f6f6;
  padding: 2px;
}

.ag-fresh .ag-footer-cell-entire-row {
  background-color: #f6f6f6;
  padding: 2px;
}

.ag-fresh .ag-group-cell {
  font-style: italic;
}

.ag-fresh .ag-ltr .ag-group-expanded {
  padding-right: 4px;
}

.ag-fresh .ag-rtl .ag-group-expanded {
  padding-left: 4px;
}

.ag-fresh .ag-ltr .ag-group-contracted {
  padding-right: 4px;
}

.ag-fresh .ag-rtl .ag-group-contracted {
  padding-left: 4px;
}

.ag-fresh .ag-ltr .ag-group-loading {
  padding-right: 4px;
}

.ag-fresh .ag-rtl .ag-group-loading {
  padding-left: 4px;
}

.ag-fresh .ag-ltr .ag-group-value {
  padding-right: 2px;
}

.ag-fresh .ag-rtl .ag-group-value {
  padding-left: 2px;
}

.ag-fresh .ag-ltr .ag-group-checkbox {
  padding-right: 2px;
}

.ag-fresh .ag-rtl .ag-group-checkbox {
  padding-left: 2px;
}

.ag-fresh .ag-group-child-count {
  display: inline-block;
}

.ag-fresh .ag-footer-cell {
  font-style: italic;
}

.ag-fresh .ag-menu {
  border: 1px solid #808080;
  background-color: #f6f6f6;
  cursor: default;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
}

.ag-fresh .ag-menu .ag-tab-header {
  background-color: #e6e6e6;
}

.ag-fresh .ag-menu .ag-tab {
  padding: 6px 8px 6px 8px;
  margin: 2px 2px 0px 2px;
  display: inline-block;
  border-right: 1px solid transparent;
  border-left: 1px solid transparent;
  border-top: 1px solid transparent;
  border-top-right-radius: 2px;
  border-top-left-radius: 2px;
}

.ag-fresh .ag-menu .ag-tab-selected {
  background-color: #f6f6f6;
  border-right: 1px solid #d3d3d3;
  border-left: 1px solid #d3d3d3;
  border-top: 1px solid #d3d3d3;
}

.ag-fresh .ag-menu-separator {
  border-top: 1px solid #d3d3d3;
}

.ag-fresh .ag-menu-option-active {
  background-color: #bde2e5;
}

.ag-fresh .ag-menu-option-icon {
  padding: 2px 4px 2px 4px;
  vertical-align: middle;
}

.ag-fresh .ag-menu-option-text {
  padding: 2px 4px 2px 4px;
  vertical-align: middle;
}

.ag-fresh .ag-menu-option-shortcut {
  padding: 2px 2px 2px 2px;
  vertical-align: middle;
}

.ag-fresh .ag-menu-option-popup-pointer {
  padding: 2px 4px 2px 4px;
  vertical-align: middle;
}

.ag-fresh .ag-menu-option-disabled {
  opacity: 0.5;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
}

.ag-fresh .ag-menu-column-select-wrapper {
  margin: 2px;
}

.ag-fresh .ag-filter-checkbox {
  position: relative;
  top: 2px;
  left: 2px;
}

.ag-fresh .ag-filter-header-container {
  border-bottom: 1px solid #d3d3d3;
}

.ag-fresh .ag-filter-apply-panel {
  border-top: 1px solid #d3d3d3;
  padding: 2px;
}

.ag-fresh .ag-filter-value {
  margin-left: 4px;
}

.ag-fresh .ag-ltr .ag-selection-checkbox {
  padding-right: 4px;
}

.ag-fresh .ag-rtl .ag-selection-checkbox {
  padding-left: 4px;
}

.ag-fresh .ag-paging-panel {
  padding: 4px;
}

.ag-fresh .ag-paging-button {
  margin-left: 4px;
  margin-right: 4px;
}

.ag-fresh .ag-paging-row-summary-panel {
  display: inline-block;
  width: 300px;
}

.ag-fresh .ag-tool-panel {
  background-color: #f6f6f6;
  border-bottom: 1px solid #808080;
  border-top: 1px solid #808080;
  color: #222;
}

.ag-fresh .ltr .ag-tool-panel {
  border-right: 1px solid #808080;
}

.ag-fresh .rtl .ag-tool-panel {
  border-left: 1px solid #808080;
}

.ag-fresh .ag-status-bar {
  color: #222;
  background-color: #f6f6f6;
  font-size: 14px;
  height: 22px;
  border-bottom: 1px solid #808080;
  border-left: 1px solid #808080;
  border-right: 1px solid #808080;
  padding: 2px;
}

.ag-fresh .ag-status-bar-aggregations {
  float: right;
}

.ag-fresh .ag-status-bar-item {
  padding-left: 10px;
}

.ag-fresh .ag-column-drop-cell {
  background: -webkit-linear-gradient(#fff, #d3d3d3);
  background: -moz-linear-gradient(#fff, #d3d3d3);
  background: -o-linear-gradient(#fff, #d3d3d3);
  background: -ms-linear-gradient(#fff, #d3d3d3);
  background: linear-gradient(#ffffff, #d3d3d3);
  color: #000;
  border: 1px solid #808080;
}

.ag-fresh .ag-column-drop-cell-ghost {
  opacity: 0.5;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
}

.ag-fresh .ag-column-drop-cell-text {
  padding-left: 2px;
  padding-right: 2px;
}

.ag-fresh .ag-column-drop-cell-button {
  border: 1px solid transparent;
  padding-left: 2px;
  padding-right: 2px;
  border-radius: 3px;
}

.ag-fresh .ag-column-drop-cell-button:hover {
  border: 1px solid #808080;
}

.ag-fresh .ag-column-drop-empty-message {
  padding-left: 2px;
  padding-right: 2px;
  color: #808080;
}

.ag-fresh .ag-column-drop-icon {
  margin: 3px;
}

.ag-fresh .ag-column-drop {
  background-color: #f6f6f6;
}

.ag-fresh .ag-column-drop-horizontal {
  padding: 2px;
  border-top: 1px solid #808080;
  border-left: 1px solid #808080;
  border-right: 1px solid #808080;
}

.ag-fresh .ag-column-drop-vertical {
  padding: 4px 4px 10px 4px;
  border-bottom: 1px solid #808080;
}

.ag-fresh .ag-column-drop-vertical .ag-column-drop-cell {
  margin-top: 2px;
}

.ag-fresh .ag-column-drop-vertical .ag-column-drop-empty-message {
  text-align: center;
  padding: 5px;
}

.ag-fresh .ag-pivot-mode {
  border-bottom: 1px solid #808080;
  padding: 4px;
  background-color: #f6f6f6;
}

.ag-fresh .ag-tool-panel .ag-column-select-panel {
  border-bottom: 1px solid #808080;
}

.ag-fresh .ag-select-agg-func-popup {
  cursor: default;
  position: absolute;
  font-size: 14px;
  background-color: #fff;
  border: 1px solid #808080;
}

.ag-fresh .ag-select-agg-func-item {
  padding-left: 2px;
  padding-right: 2px;
}

.ag-fresh .ag-select-agg-func-item:hover {
  background-color: #bde2e5;
}

ngb-datepicker {
  min-width: 220px !important;
  outline: none;
  /*------改顏色-----*/
}

ngb-datepicker ngb-datepicker-navigation {
  margin: 2px 0;
}

ngb-datepicker ngb-datepicker-navigation-select {
  margin-top: 3px;
  width: auto !important;
}

ngb-datepicker .ngb-dp-month {
  width: 100%;
}

ngb-datepicker .ngb-dp-months {
  padding: 0 2px;
}

ngb-datepicker .ngb-dp-week {
  margin-bottom: 4px;
}

ngb-datepicker .ngb-dp-weekday {
  white-space: nowrap;
}

ngb-datepicker .ngb-dp-day,
ngb-datepicker .ngb-dp-weekday,
ngb-datepicker .ngb-dp-week-number {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

ngb-datepicker .btn-secondary {
  margin: 0 auto;
}

ngb-datepicker .text-info {
  color: #0c8f4f;
}

ngb-datepicker .bg-primary,
ngb-datepicker .bg-primary:hover {
  background: #0c8f4f;
}

ngb-datepicker .btn-link {
  color: #0c8f4f;
}

ngb-datepicker .btn-secondary {
  -moz-transition: background 0.1s ease-in-out;
  -o-transition: background 0.1s ease-in-out;
  -webkit-transition: background 0.1s ease-in-out;
  -ms-transition: background 0.1s ease-in-out;
  transition: background 0.1s ease-in-out;
}

ngb-datepicker .btn-secondary:hover {
  background: #cccccc;
  -moz-transition: background 0.1s ease-in-out;
  -o-transition: background 0.1s ease-in-out;
  -webkit-transition: background 0.1s ease-in-out;
  -ms-transition: background 0.1s ease-in-out;
  transition: background 0.1s ease-in-out;
}

ngb-datepicker * {
  font-size: 12px !important;
}

ngb-datepicker .small {
  font-size: 85% !important;
}

ngb-datepicker.full {
  width: 100%;
  padding-bottom: 10px;
  border: none !important;
}

.contentTopSearch ngb-datepicker * {
  font-size: 12px !important;
}

.dropdown-item {
  display: block;
  width: 100%;
  padding: 3px 1.5rem;
  clear: both;
  font-weight: 400;
  color: #292b2c;
  text-align: inherit;
  white-space: nowrap;
  background: 0 0;
  border: 0;
}

.dropdown-item:focus,
.dropdown-item:hover {
  color: #1d1e1f;
  text-decoration: none;
  background-color: #f7f7f9;
}

.dropdown-item.active,
.dropdown-item:active {
  color: #fff;
  text-decoration: none;
  background-color: #0275d8;
}

.dropdown-item.disabled,
.dropdown-item:disabled {
  color: #636c72;
  cursor: not-allowed;
  background-color: transparent;
}

.show>.dropdown-menu {
  display: block;
}

.show>a {
  outline: 0;
}

.dropdown-menu-right {
  right: 0;
  left: auto;
}

.dropdown-menu-left {
  right: auto;
  left: 0;
}

.dropdown-header {
  display: block;
  padding: .5rem 1.5rem;
  margin-bottom: 0;
  font-size: .875rem;
  color: #636c72;
  white-space: nowrap;
}

.dropdown-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 990;
}

.dropup .dropdown-menu {
  top: auto;
  bottom: 100%;
  margin-bottom: 0.125rem;
}

/* 列印下拉選單 */
.print-dropdown-style1 .dropdown-menu {
  overflow-y: auto;
  max-height: 420px;
}

.clearfix::after {
  display: block;
  content: "";
  clear: both;
}

.d-none {
  display: none !important;
}

.d-none-n {
  display: none !important
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-table {
  display: table !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: -webkit-box !important;
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
}

.d-inline-flex {
  display: -webkit-inline-box !important;
  display: -webkit-inline-flex !important;
  display: -ms-inline-flexbox !important;
  display: inline-flex !important;
}

@media (min-width: 576px) {
  .d-sm-none {
    display: none !important;
  }

  .d-sm-inline {
    display: inline !important;
  }

  .d-sm-inline-block {
    display: inline-block !important;
  }

  .d-sm-block {
    display: block !important;
  }

  .d-sm-table {
    display: table !important;
  }

  .d-sm-table-cell {
    display: table-cell !important;
  }

  .d-sm-flex {
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-sm-inline-flex {
    display: -webkit-inline-box !important;
    display: -webkit-inline-flex !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 768px) {
  .d-md-none {
    display: none !important;
  }

  .d-md-inline {
    display: inline !important;
  }

  .d-md-inline-block {
    display: inline-block !important;
  }

  .d-md-block {
    display: block !important;
  }

  .d-md-table {
    display: table !important;
  }

  .d-md-table-cell {
    display: table-cell !important;
  }

  .d-md-flex {
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-md-inline-flex {
    display: -webkit-inline-box !important;
    display: -webkit-inline-flex !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 992px) {
  .d-lg-none {
    display: none !important;
  }

  .d-lg-inline {
    display: inline !important;
  }

  .d-lg-inline-block {
    display: inline-block !important;
  }

  .d-lg-block {
    display: block !important;
  }

  .d-lg-table {
    display: table !important;
  }

  .d-lg-table-cell {
    display: table-cell !important;
  }

  .d-lg-flex {
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-lg-inline-flex {
    display: -webkit-inline-box !important;
    display: -webkit-inline-flex !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

@media (min-width: 1200px) {
  .d-xl-none {
    display: none !important;
  }

  .d-xl-inline {
    display: inline !important;
  }

  .d-xl-inline-block {
    display: inline-block !important;
  }

  .d-xl-block {
    display: block !important;
  }

  .d-xl-table {
    display: table !important;
  }

  .d-xl-table-cell {
    display: table-cell !important;
  }

  .d-xl-flex {
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
  }

  .d-xl-inline-flex {
    display: -webkit-inline-box !important;
    display: -webkit-inline-flex !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
  }
}

.flex-first {
  -webkit-box-ordinal-group: 0;
  -webkit-order: -1;
  -ms-flex-order: -1;
  order: -1;
}

.flex-last {
  -webkit-box-ordinal-group: 2;
  -webkit-order: 1;
  -ms-flex-order: 1;
  order: 1;
}

.flex-unordered {
  -webkit-box-ordinal-group: 1;
  -webkit-order: 0;
  -ms-flex-order: 0;
  order: 0;
}

.flex-row,
.btn-file,
.product-column-wrap .product-column,
.product-column-wrap .product-column .item-box .pic,
.productNumber-column-wrap .productNumber-column {
  -webkit-box-orient: horizontal !important;
  -webkit-box-direction: normal !important;
  -webkit-flex-direction: row !important;
  -ms-flex-direction: row !important;
  flex-direction: row !important;
}

.flex-column {
  -webkit-box-orient: vertical !important;
  -webkit-box-direction: normal !important;
  -webkit-flex-direction: column !important;
  -ms-flex-direction: column !important;
  flex-direction: column !important;
}

.flex-row-reverse {
  -webkit-box-orient: horizontal !important;
  -webkit-box-direction: reverse !important;
  -webkit-flex-direction: row-reverse !important;
  -ms-flex-direction: row-reverse !important;
  flex-direction: row-reverse !important;
}

.flex-column-reverse {
  -webkit-box-orient: vertical !important;
  -webkit-box-direction: reverse !important;
  -webkit-flex-direction: column-reverse !important;
  -ms-flex-direction: column-reverse !important;
  flex-direction: column-reverse !important;
}

.flex-wrap {
  -webkit-flex-wrap: wrap !important;
  -ms-flex-wrap: wrap !important;
  flex-wrap: wrap !important;
}

.flex-nowrap {
  -webkit-flex-wrap: nowrap !important;
  -ms-flex-wrap: nowrap !important;
  flex-wrap: nowrap !important;
}

.flex-wrap-reverse {
  -webkit-flex-wrap: wrap-reverse !important;
  -ms-flex-wrap: wrap-reverse !important;
  flex-wrap: wrap-reverse !important;
}

.justify-content-start {
  -webkit-box-pack: start !important;
  -webkit-justify-content: flex-start !important;
  -ms-flex-pack: start !important;
  justify-content: flex-start !important;
}

.justify-content-end {
  -webkit-box-pack: end !important;
  -webkit-justify-content: flex-end !important;
  -ms-flex-pack: end !important;
  justify-content: flex-end !important;
}

.justify-content-center {
  -webkit-box-pack: center !important;
  -webkit-justify-content: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
}

.justify-content-between {
  -webkit-box-pack: justify !important;
  -webkit-justify-content: space-between !important;
  -ms-flex-pack: justify !important;
  justify-content: space-between !important;
}

.justify-content-around {
  -webkit-justify-content: space-around !important;
  -ms-flex-pack: distribute !important;
  justify-content: space-around !important;
}

.align-items-start {
  -webkit-box-align: start !important;
  -webkit-align-items: flex-start !important;
  -ms-flex-align: start !important;
  align-items: flex-start !important;
}

.align-items-end {
  -webkit-box-align: end !important;
  -webkit-align-items: flex-end !important;
  -ms-flex-align: end !important;
  align-items: flex-end !important;
}

.align-items-center {
  -webkit-box-align: center !important;
  -webkit-align-items: center !important;
  -ms-flex-align: center !important;
  align-items: center !important;
}

.align-items-baseline {
  -webkit-box-align: baseline !important;
  -webkit-align-items: baseline !important;
  -ms-flex-align: baseline !important;
  align-items: baseline !important;
}

.align-items-stretch {
  -webkit-box-align: stretch !important;
  -webkit-align-items: stretch !important;
  -ms-flex-align: stretch !important;
  align-items: stretch !important;
}

.align-content-start {
  -webkit-align-content: flex-start !important;
  -ms-flex-line-pack: start !important;
  align-content: flex-start !important;
}

.align-content-end {
  -webkit-align-content: flex-end !important;
  -ms-flex-line-pack: end !important;
  align-content: flex-end !important;
}

.align-content-center {
  -webkit-align-content: center !important;
  -ms-flex-line-pack: center !important;
  align-content: center !important;
}

.align-content-between {
  -webkit-align-content: space-between !important;
  -ms-flex-line-pack: justify !important;
  align-content: space-between !important;
}

.align-content-around {
  -webkit-align-content: space-around !important;
  -ms-flex-line-pack: distribute !important;
  align-content: space-around !important;
}

.align-content-stretch {
  -webkit-align-content: stretch !important;
  -ms-flex-line-pack: stretch !important;
  align-content: stretch !important;
}

.align-self-auto {
  -webkit-align-self: auto !important;
  -ms-flex-item-align: auto !important;
  -ms-grid-row-align: auto !important;
  align-self: auto !important;
}

.align-self-start {
  -webkit-align-self: flex-start !important;
  -ms-flex-item-align: start !important;
  align-self: flex-start !important;
}

.align-self-end {
  -webkit-align-self: flex-end !important;
  -ms-flex-item-align: end !important;
  align-self: flex-end !important;
}

.align-self-center {
  -webkit-align-self: center !important;
  -ms-flex-item-align: center !important;
  -ms-grid-row-align: center !important;
  align-self: center !important;
}

.align-self-baseline {
  -webkit-align-self: baseline !important;
  -ms-flex-item-align: baseline !important;
  align-self: baseline !important;
}

.align-self-stretch {
  -webkit-align-self: stretch !important;
  -ms-flex-item-align: stretch !important;
  -ms-grid-row-align: stretch !important;
  align-self: stretch !important;
}




.flaticon-business:before {
  content: "\f100";
}

.flaticon-check:before {
  content: "\f101";
}

.flaticon-circle:before {
  content: "\f102";
}

.flaticon-clock:before {
  content: "\f103";
}

.flaticon-coins:before {
  content: "\f104";
}

.flaticon-coins-1:before {
  content: "\f105";
}

.flaticon-coins-2:before {
  content: "\f106";
}

.flaticon-coins-3:before {
  content: "\f107";
}

.flaticon-coins-4:before {
  content: "\f108";
}

.flaticon-cross-mark:before {
  content: "\f109";
}

.flaticon-grocery-trolley:before {
  content: "\f10a";
}

.flaticon-logout:before {
  content: "\f10b";
}

.flaticon-lorry:before {
  content: "\f10c";
}

.flaticon-minus-sign-in-a-circle:before {
  content: "\f10d";
}

.flaticon-money:before {
  content: "\f10e";
}

.flaticon-money-1:before {
  content: "\f10f";
}

.flaticon-money-2:before {
  content: "\f110";
}

.flaticon-money-3:before {
  content: "\f111";
}

.flaticon-money-4:before {
  content: "\f112";
}

.flaticon-money-5:before {
  content: "\f113";
}

.flaticon-money-6:before {
  content: "\f114";
}

.flaticon-money-7:before {
  content: "\f115";
}

.flaticon-money-8:before {
  content: "\f116";
}

.flaticon-money-9:before {
  content: "\f117";
}

.flaticon-package:before {
  content: "\f118";
}

.flaticon-paper:before {
  content: "\f119";
}

.flaticon-pen:before {
  content: "\f11a";
}

.flaticon-people:before {
  content: "\f11b";
}

.flaticon-people-1:before {
  content: "\f11c";
}

.flaticon-search:before {
  content: "\f11d";
}

.flaticon-shop:before {
  content: "\f11e";
}

.flaticon-small-calendar:before {
  content: "\f11f";
}

.flaticon-social:before {
  content: "\f120";
}

.flaticon-tickets:before {
  content: "\f121";
}

.flaticon-transport:before {
  content: "\f122";
}

.flaticon-trolley:before {
  content: "\f123";
}

.flaticon-warehouse:before {
  content: "\f124";
}

.flaticon2-bulb:before {
  content: "\f100";
}

.flaticon2-presentation:before {
  content: "\f101";
}

.flaticon2-reputation:before {
  content: "\f102";
}

.flaticon2-clipboard:before {
  content: "\f103";
}

.flaticon2-online-payment:before {
  content: "\f104";
}

.flaticon2-money:before {
  content: "\f105";
}

.flaticon2-horizontal:before {
  content: "\f106";
}

.flaticon2-invoice:before {
  content: "\f107";
}

.flaticon2-time:before {
  content: "\f108";
}

.flaticon2-invoice-1:before {
  content: "\f109";
}

.flaticon2-project:before {
  content: "\f10a";
}

.flaticon2-time-1:before {
  content: "\f10b";
}

.flaticon2-settings:before {
  content: "\f10c";
}

.flaticon2-coins:before {
  content: "\f10d";
}

.flaticon2-money-1:before {
  content: "\f10e";
}

.flaticon2-dollar-symbol:before {
  content: "\f10f";
}

.flaticon2-light-bulb-on:before {
  content: "\f110";
}

.flaticon2-warehouse-with-boxes:before {
  content: "\f111";
}

.flaticon2-calendar:before {
  content: "\f112";
}

.flaticon2-pixel-31-calendar-page:before {
  content: "\f113";
}

.flaticon2-excel-file:before {
  content: "\f114";
}

.flaticon2-writing:before {
  content: "\f115";
}

.flaticon2-document:before {
  content: "\f116";
}

.flaticon2-box:before {
  content: "\f117";
}

.flaticon2-delivery-man:before {
  content: "\f118";
}

.flaticon2-upload:before {
  content: "\f119";
}

.flaticon2-error:before {
  content: "\f11a";
}

.flaticon2-sync-file:before {
  content: "\f11b";
}

.flaticon2-shop:before {
  content: "\f11c";
}

.flaticon2-printer:before {
  content: "\f11d";
}

.flaticon3-currency-security:before {
  content: "\f100";
}

.flaticon3-business-and-finance:before {
  content: "\f101";
}

.flaticon3-place:before {
  content: "\f102";
}

.flaticon3-box:before {
  content: "\f103";
}

.flaticon3-move:before {
  content: "\f104";
}

.flaticon3-server:before {
  content: "\f105";
}

.flaticon3-paper:before {
  content: "\f106";
}

.flaticon3-statement:before {
  content: "\f107";
}

.flaticon3-search:before {
  content: "\f108";
}

.flaticon3-event:before {
  content: "\f109";
}

.flaticon3-clock:before {
  content: "\f10a";
}

.flaticon3-appointment:before {
  content: "\f10b";
}

.flaticon3-conversation:before {
  content: "\f10c";
}

.flaticon3-comment:before {
  content: "\f10d";
}

.flaticon3-agreement:before {
  content: "\f10e";
}

.flaticon3-work:before {
  content: "\f10f";
}

.flaticon3-target:before {
  content: "\f110";
}

.flaticon3-shopping-list:before {
  content: "\f111";
}

.flaticon3-bill:before {
  content: "\f112";
}

.flaticon3-growth:before {
  content: "\f113";
}

.flaticon3-portfolio:before {
  content: "\f114";
}

.flaticon3-receipt:before {
  content: "\f115";
}

.flaticon3-account:before {
  content: "\f116";
}

.flaticon3-user:before {
  content: "\f117";
}

.flaticon3-business-and-finance-1:before {
  content: "\f118";
}

.flaticon3-accept:before {
  content: "\f119";
}

.flaticon3-calendar:before {
  content: "\f11a";
}

.flaticon3-user-1:before {
  content: "\f11b";
}

.flaticon3-resume:before {
  content: "\f11c";
}

.flaticon3-approved:before {
  content: "\f11d";
}

.flaticon3-approval:before {
  content: "\f11e";
}

.flaticon3-handshake:before {
  content: "\f11f";
}

.flaticon3-salary:before {
  content: "\f120";
}

.flaticon3-job:before {
  content: "\f121";
}

.flaticon3-clock-1:before {
  content: "\f122";
}

.flaticon3-target-1:before {
  content: "\f123";
}

.flaticon3-message:before {
  content: "\f124";
}

.flaticon3-trolley:before {
  content: "\f125";
}

.flaticon3-respect:before {
  content: "\f126";
}

.flaticon3-shop:before {
  content: "\f127";
}

.flaticon3-partnership:before {
  content: "\f128";
}

.flaticon3-box-1:before {
  content: "\f129";
}

.flaticon3-phone:before {
  content: "\f12a";
}

.flaticon3-box-2:before {
  content: "\f12b";
}

.flaticon3-delivery-truck:before {
  content: "\f12c";
}

.flaticon3-tag:before {
  content: "\f12d";
}

.flaticon3-hand:before {
  content: "\f12e";
}

.flaticon3-online-shopping:before {
  content: "\f12f";
}

.flaticon3-laptop:before {
  content: "\f130";
}

.flaticon3-voucher:before {
  content: "\f131";
}

.flaticon3-error:before {
  content: "\f132";
}

.flaticon3-file:before {
  content: "\f133";
}

.flaticon3-information:before {
  content: "\f134";
}

.flaticon3-salary-1:before {
  content: "\f135";
}

.flaticon3-portfolio-1:before {
  content: "\f136";
}

.flaticon3-money:before {
  content: "\f137";
}

.flaticon3-logout:before {
  content: "\f138";
}

.flaticon3-logout-1:before {
  content: "\f139";
}

.flaticon3-add:before {
  content: "\f13a";
}

.flaticon3-add-user:before {
  content: "\f13b";
}

.flaticon3-address:before {
  content: "\f13c";
}

.flaticon3-map:before {
  content: "\f13d";
}

.flaticon3-calendar-1:before {
  content: "\f13e";
}

.flaticon3-timetable:before {
  content: "\f13f";
}

.flaticon3-speed:before {
  content: "\f140";
}

.flaticon3-repair:before {
  content: "\f141";
}

.flaticon3-alarm:before {
  content: "\f142";
}

.flaticon3-car:before {
  content: "\f143";
}

.flaticon3-oil:before {
  content: "\f144";
}

.flaticon3-scooter:before {
  content: "\f145";
}

.flaticon3-journalist:before {
  content: "\f146";
}

.flaticon3-drive:before {
  content: "\f147";
}

.flaticon3-comment-1:before {
  content: "\f148";
}

.flaticon3-place-1:before {
  content: "\f149";
}

.flaticon3-pickup-car:before {
  content: "\f14a";
}

.flaticon3-bike:before {
  content: "\f14b";
}

.flaticon3-bike-1:before {
  content: "\f14c";
}

.flaticon3-visit:before {
  content: "\f14d";
}

.flaticon3-coin:before {
  content: "\f14e";
}

.flaticon3-calendar-2:before {
  content: "\f14f";
}

.flaticon3-box-3:before {
  content: "\f150";
}

.flaticon3-pin:before {
  content: "\f151";
}

.flaticon3-cab:before {
  content: "\f152";
}

.flaticon3-meter:before {
  content: "\f153";
}

.flaticon3-dashboard:before {
  content: "\f154";
}

.flaticon3-night:before {
  content: "\f155";
}

.flaticon3-rise:before {
  content: "\f156";
}

.flaticon3-sun:before {
  content: "\f157";
}

.flaticon3-calendar-3:before {
  content: "\f158";
}

.flaticon3-home:before {
  content: "\f159";
}

.flaticon3-money-1:before {
  content: "\f15a";
}

.flaticon3-send:before {
  content: "\f15b";
}

.flaticon3-start:before {
  content: "\f15c";
}

.flaticon3-success:before {
  content: "\f15d";
}

.flaticon3-close:before {
  content: "\f15e";
}

.flaticon3-flowchart:before {
  content: "\f15f";
}

.flaticon3-delete:before {
  content: "\f160";
}

.flaticon3-test:before {
  content: "\f161";
}

.flaticon3-taxi:before {
  content: "\f162";
}

.flaticon3-trash:before {
  content: "\f163";
}

.flaticon3-tile:before {
  content: "\f164";
}

.flaticon3-mail:before {
  content: "\f165";
}

.flaticon3-business-and-finance-2:before {
  content: "\f166";
}

.flaticon3-report:before {
  content: "\f167";
}

.flaticon3-test-1:before {
  content: "\f168";
}

.flaticon3-menu:before {
  content: "\f169";
}

.flaticon3-clock-2:before {
  content: "\f16a";
}

.flaticon3-map-1:before {
  content: "\f16b";
}

.flaticon3-mission:before {
  content: "\f16c";
}

.flaticon3-blog:before {
  content: "\f16d";
}

.flaticon3-interview:before {
  content: "\f16e";
}

.flaticon3-architecture-and-city:before {
  content: "\f16f";
}

.flaticon3-review:before {
  content: "\f170";
}

.flaticon3-gear:before {
  content: "\f171";
}

.flaticon3-send-1:before {
  content: "\f172";
}

.flaticon3-statement-1:before {
  content: "\f173";
}

.flaticon3-info:before {
  content: "\f174";
}

.flaticon3-business-and-finance-3:before {
  content: "\f175";
}

.flaticon3-place-2:before {
  content: "\f176";
}

.flaticon3-flag:before {
  content: "\f177";
}

.flaticon3-compass:before {
  content: "\f178";
}

.flaticon3-more:before {
  content: "\f179";
}

.flaticon3-arrival-time:before {
  content: "\f17a";
}

.flaticon3-trolley-1:before {
  content: "\f17b";
}

.flaticon3-comment-2:before {
  content: "\f17c";
}

.flaticon3-map-2:before {
  content: "\f17d";
}

.flaticon3-list:before {
  content: "\f17e";
}

.flaticon3-start-1:before {
  content: "\f17f";
}

.flaticon3-end:before {
  content: "\f180";
}

.flaticon3-shield:before {
  content: "\f181";
}

.flaticon3-time:before {
  content: "\f182";
}

.flaticon3-user-2:before {
  content: "\f183";
}

.flaticon3-user-3:before {
  content: "\f184";
}

.flaticon3-stand:before {
  content: "\f185";
}

.flaticon3-fix:before {
  content: "\f186";
}

.flaticon4-compass:before {
  content: "\f100";
}

.flaticon4-compass-1:before {
  content: "\f101";
}

.flaticon4-paint:before {
  content: "\f102";
}

.flaticon4-dashboard:before {
  content: "\f103";
}

.flaticon4-megaphone:before {
  content: "\f104";
}

.flaticon4-megaphone-1:before {
  content: "\f105";
}

.flaticon4-start:before {
  content: "\f106";
}

.flaticon4-power:before {
  content: "\f107";
}

.flaticon4-youtube:before {
  content: "\f108";
}

.flaticon4-youtube-1:before {
  content: "\f109";
}

.flaticon4-information:before {
  content: "\f10a";
}

.flaticon4-question:before {
  content: "\f10b";
}

.flaticon4-faq:before {
  content: "\f10c";
}

.flaticon4-questions:before {
  content: "\f10d";
}

.flaticon4-lighthouse:before {
  content: "\f10e";
}

.flaticon4-map:before {
  content: "\f10f";
}

.flaticon4-path:before {
  content: "\f110";
}

.flaticon4-professions-and-jobs:before {
  content: "\f111";
}

.flaticon4-info:before {
  content: "\f112";
}

.flaticon4-payment:before {
  content: "\f113";
}

.flaticon4-value:before {
  content: "\f114";
}

.flaticon4-filter:before {
  content: "\f115";
}

.flaticon4-bank:before {
  content: "\f116";
}

.flaticon4-funnel:before {
  content: "\f117";
}

.flaticon4-like:before {
  content: "\f118";
}

.flaticon4-like-1:before {
  content: "\f119";
}

.flaticon4-taxes:before {
  content: "\f11a";
}

.flaticon4-invoice:before {
  content: "\f11b";
}

.flaticon4-box:before {
  content: "\f11c";
}

.flaticon4-supplies:before {
  content: "\f11d";
}

.flaticon4-investor:before {
  content: "\f11e";
}

.flaticon4-business:before {
  content: "\f11f";
}

.flaticon4-businessman:before {
  content: "\f120";
}

.flaticon4-print:before {
  content: "\f121";
}

.flaticon4-maps-and-location:before {
  content: "\f122";
}

.flaticon4-clock:before {
  content: "\f123";
}

.flaticon4-panel:before {
  content: "\f124";
}

.flaticon4-direction:before {
  content: "\f125";
}

.flaticon4-calendar:before {
  content: "\f126";
}

.flaticon4-login:before {
  content: "\f127";
}

.flaticon4-user:before {
  content: "\f128";
}

.flaticon4-boy:before {
  content: "\f129";
}

.flaticon4-men:before {
  content: "\f12a";
}

@font-face {
  font-family: "Flaticon";
  src: url("../fonts/flaticon/1/Flaticon.eot");
  src: url("../fonts/flaticon/1/Flaticon.eot?#iefix") format("embedded-opentype"), url("../fonts/flaticon/1/Flaticon.ttf") format("truetype"), url("../fonts/flaticon/1/Flaticon.svg#Flaticon") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="flaticon-"]:before,
[class*=" flaticon-"]:before,
[class^="flaticon-"]:after,
[class*=" flaticon-"]:after {
  font-family: "Flaticon";
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Flaticon";
    src: url("../fonts/flaticon/1/Flaticon.svg#Flaticon") format("svg");
  }
}

@font-face {
  font-family: "Flaticon2";
  src: url("../fonts/flaticon/2/Flaticon.eot");
  src: url("../fonts/flaticon/2/Flaticon.eot?#iefix") format("embedded-opentype"), url("../fonts/flaticon/2/Flaticon.ttf") format("truetype"), url("../fonts/flaticon/2/Flaticon.svg#Flaticon") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="flaticon2-"]:before,
[class*=" flaticon2-"]:before,
[class^="flaticon2-"]:after,
[class*=" flaticon2-"]:after {
  font-family: "Flaticon2";
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Flaticon2";
    src: url("../fonts/flaticon/2/Flaticon.svg#Flaticon") format("svg");
  }
}

@font-face {
  font-family: "Flaticon3";
  src: url("../fonts/flaticon/3/Flaticon.eot");
  src: url("../fonts/flaticon/3/Flaticon.eot?#iefix") format("embedded-opentype"), url("../fonts/flaticon/3/Flaticon.ttf") format("truetype"), url("../fonts/flaticon/3/Flaticon.svg#Flaticon") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="flaticon3-"]:before,
[class*=" flaticon3-"]:before,
[class^="flaticon3-"]:after,
[class*=" flaticon3-"]:after {
  font-family: "Flaticon3";
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Flaticon3";
    src: url("../fonts/flaticon/3/Flaticon.svg#Flaticon") format("svg");
  }
}

@font-face {
  font-family: "Flaticon4";
  src: url("../fonts/flaticon/4/Flaticon.eot");
  src: url("../fonts/flaticon/4/Flaticon.eot?#iefix") format("embedded-opentype"), url("../fonts/flaticon/4/Flaticon.ttf") format("truetype"), url("../fonts/flaticon/4/Flaticon.svg#Flaticon") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="flaticon4-"]:before,
[class*=" flaticon4-"]:before,
[class^="flaticon4-"]:after,
[class*=" flaticon4-"]:after {
  font-family: "Flaticon4";
  font-style: normal;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @font-face {
    font-family: "Flaticon4";
    src: url("../fonts/flaticon/4/Flaticon.svg#Flaticon") format("svg");
  }
}

.fa-spin {
  -webkit-animation: fa-spin 2s infinite linear;
  animation: fa-spin 2s infinite linear;
}

.fa-pulse {
  -webkit-animation: fa-spin 1s infinite steps(8);
  animation: fa-spin 1s infinite steps(8);
}

@-webkit-keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

@keyframes fa-spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}

.fa-border {
  padding: .2em .25em .15em;
  border: solid 0.08em #eee;
  border-radius: .1em;
}

.fa-pull-left {
  float: left;
}

.fa-pull-right {
  float: right;
}

.fa.fa-pull-left {
  margin-right: .3em;
}

.fa.fa-pull-right {
  margin-left: .3em;
}

/* Deprecated as of 4.4.0 */
.pull-right {
  float: right;
}

.pull-left {
  float: left;
}

.fa.pull-left {
  margin-right: .3em;
}

.fa.pull-right {
  margin-left: .3em;
}

.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fa-fw {
  width: 1.28571em;
  text-align: center;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.fa-glass:before {
  content: "";
}

.fa-music:before {
  content: "";
}

.fa-search:before {
  content: "";
}

.fa-envelope-o:before {
  content: "";
}

.fa-heart:before {
  content: "";
}

.fa-star:before {
  content: "";
}

.fa-star-o:before {
  content: "";
}

.fa-user:before {
  content: "";
}

.fa-film:before {
  content: "";
}

.fa-th-large:before {
  content: "";
}

.fa-th:before {
  content: "";
}

.fa-th-list:before {
  content: "";
}

.fa-check:before {
  content: "";
}

.fa-remove:before,
.fa-close:before,
.fa-times:before {
  content: "";
}

.fa-search-plus:before {
  content: "";
}

.fa-search-minus:before {
  content: "";
}

.fa-power-off:before {
  content: "";
}

.fa-signal:before {
  content: "";
}

.fa-gear:before,
.fa-cog:before {
  content: "";
}

.fa-trash-o:before {
  content: "";
}

.fa-home:before {
  content: "";
}

.fa-file-o:before {
  content: "";
}

.fa-clock-o:before {
  content: "";
}

.fa-road:before {
  content: "";
}

.fa-download:before {
  content: "";
}

.fa-arrow-circle-o-down:before {
  content: "";
}

.fa-arrow-circle-o-up:before {
  content: "";
}

.fa-inbox:before {
  content: "";
}

.fa-play-circle-o:before {
  content: "";
}

.fa-rotate-right:before,
.fa-repeat:before {
  content: "";
}

.fa-refresh:before {
  content: "";
}

.fa-list-alt:before {
  content: "";
}

.fa-lock:before {
  content: "";
}

.fa-flag:before {
  content: "";
}

.fa-headphones:before {
  content: "";
}

.fa-volume-off:before {
  content: "";
}

.fa-volume-down:before {
  content: "";
}

.fa-volume-up:before {
  content: "";
}

.fa-qrcode:before {
  content: "";
}

.fa-barcode:before {
  content: "";
}

.fa-tag:before {
  content: "";
}

.fa-tags:before {
  content: "";
}

.fa-book:before {
  content: "";
}

.fa-bookmark:before {
  content: "";
}

.fa-print:before {
  content: "";
}

.fa-camera:before {
  content: "";
}

.fa-font:before {
  content: "";
}

.fa-bold:before {
  content: "";
}

.fa-italic:before {
  content: "";
}

.fa-text-height:before {
  content: "";
}

.fa-text-width:before {
  content: "";
}

.fa-align-left:before {
  content: "";
}

.fa-align-center:before {
  content: "";
}

.fa-align-right:before {
  content: "";
}

.fa-align-justify:before {
  content: "";
}

.fa-list:before {
  content: "";
}

.fa-dedent:before,
.fa-outdent:before {
  content: "";
}

.fa-indent:before {
  content: "";
}

.fa-video-camera:before {
  content: "";
}

.fa-photo:before,
.fa-image:before,
.fa-picture-o:before {
  content: "";
}

.fa-pencil:before {
  content: "";
}

.fa-map-marker:before {
  content: "";
}

.fa-adjust:before {
  content: "";
}

.fa-tint:before {
  content: "";
}

.fa-edit:before,
.fa-pencil-square-o:before {
  content: "";
}

.fa-share-square-o:before {
  content: "";
}

.fa-check-square-o:before {
  content: "";
}

.fa-arrows:before {
  content: "";
}

.fa-step-backward:before {
  content: "";
}

.fa-fast-backward:before {
  content: "";
}

.fa-backward:before {
  content: "";
}

.fa-play:before {
  content: "";
}

.fa-pause:before {
  content: "";
}

.fa-stop:before {
  content: "";
}

.fa-forward:before {
  content: "";
}

.fa-fast-forward:before {
  content: "";
}

.fa-step-forward:before {
  content: "";
}

.fa-eject:before {
  content: "";
}

.fa-chevron-left:before {
  content: "";
}

.fa-chevron-right:before {
  content: "";
}

.fa-plus-circle:before {
  content: "";
}

.fa-minus-circle:before {
  content: "";
}

.fa-times-circle:before {
  content: "";
}

.fa-check-circle:before {
  content: "";
}

.fa-question-circle:before {
  content: "";
}

.fa-info-circle:before {
  content: "";
}

.fa-crosshairs:before {
  content: "";
}

.fa-times-circle-o:before {
  content: "";
}

.fa-check-circle-o:before {
  content: "";
}

.fa-ban:before {
  content: "";
}

.fa-arrow-left:before {
  content: "";
}

.fa-arrow-right:before {
  content: "";
}

.fa-arrow-up:before {
  content: "";
}

.fa-arrow-down:before {
  content: "";
}

.fa-mail-forward:before,
.fa-share:before {
  content: "";
}

.fa-expand:before {
  content: "";
}

.fa-compress:before {
  content: "";
}

.fa-plus:before {
  content: "";
}

.fa-minus:before {
  content: "";
}

.fa-asterisk:before {
  content: "";
}

.fa-exclamation-circle:before {
  content: "";
}

.fa-gift:before {
  content: "";
}

.fa-leaf:before {
  content: "";
}

.fa-fire:before {
  content: "";
}

.fa-eye:before {
  content: "";
}

.fa-eye-slash:before {
  content: "";
}

.fa-warning:before,
.fa-exclamation-triangle:before {
  content: "";
}

.fa-plane:before {
  content: "";
}

.fa-calendar:before {
  content: "";
}

.fa-random:before {
  content: "";
}

.fa-comment:before {
  content: "";
}

.fa-magnet:before {
  content: "";
}

.fa-chevron-up:before {
  content: "";
}

.fa-chevron-down:before {
  content: "";
}

.fa-retweet:before {
  content: "";
}

.fa-shopping-cart:before {
  content: "";
}

.fa-folder:before {
  content: "";
}

.fa-folder-open:before {
  content: "";
}

.fa-arrows-v:before {
  content: "";
}

.fa-arrows-h:before {
  content: "";
}

.fa-bar-chart-o:before,
.fa-bar-chart:before {
  content: "";
}

.fa-twitter-square:before {
  content: "";
}

.fa-facebook-square:before {
  content: "";
}

.fa-camera-retro:before {
  content: "";
}

.fa-key:before {
  content: "";
}

.fa-gears:before,
.fa-cogs:before {
  content: "";
}

.fa-comments:before {
  content: "";
}

.fa-thumbs-o-up:before {
  content: "";
}

.fa-thumbs-o-down:before {
  content: "";
}

.fa-star-half:before {
  content: "";
}

.fa-heart-o:before {
  content: "";
}

.fa-sign-out:before {
  content: "";
}

.fa-linkedin-square:before {
  content: "";
}

.fa-thumb-tack:before {
  content: "";
}

.fa-external-link:before {
  content: "";
}

.fa-sign-in:before {
  content: "";
}

.fa-trophy:before {
  content: "";
}

.fa-github-square:before {
  content: "";
}

.fa-upload:before {
  content: "";
}

.fa-lemon-o:before {
  content: "";
}

.fa-phone:before {
  content: "";
}

.fa-square-o:before {
  content: "";
}

.fa-bookmark-o:before {
  content: "";
}

.fa-phone-square:before {
  content: "";
}

.fa-twitter:before {
  content: "";
}

.fa-facebook-f:before,
.fa-facebook:before {
  content: "";
}

.fa-github:before {
  content: "";
}

.fa-unlock:before {
  content: "";
}

.fa-credit-card:before {
  content: "";
}

.fa-feed:before,
.fa-rss:before {
  content: "";
}

.fa-hdd-o:before {
  content: "";
}

.fa-bullhorn:before {
  content: "";
}

.fa-bell:before {
  content: "";
}

.fa-certificate:before {
  content: "";
}

.fa-hand-o-right:before {
  content: "";
}

.fa-hand-o-left:before {
  content: "";
}

.fa-hand-o-up:before {
  content: "";
}

.fa-hand-o-down:before {
  content: "";
}

.fa-arrow-circle-left:before {
  content: "";
}

.fa-arrow-circle-right:before {
  content: "";
}

.fa-arrow-circle-up:before {
  content: "";
}

.fa-arrow-circle-down:before {
  content: "";
}

.fa-globe:before {
  content: "";
}

.fa-wrench:before {
  content: "";
}

.fa-tasks:before {
  content: "";
}

.fa-filter:before {
  content: "";
}

.fa-briefcase:before {
  content: "";
}

.fa-arrows-alt:before {
  content: "";
}

.fa-group:before,
.fa-users:before {
  content: "";
}

.fa-chain:before,
.fa-link:before {
  content: "";
}

.fa-cloud:before {
  content: "";
}

.fa-flask:before {
  content: "";
}

.fa-cut:before,
.fa-scissors:before {
  content: "";
}

.fa-copy:before,
.fa-files-o:before {
  content: "";
}

.fa-paperclip:before {
  content: "";
}

.fa-save:before,
.fa-floppy-o:before {
  content: "";
}

.fa-square:before {
  content: "";
}

.fa-navicon:before,
.fa-reorder:before,
.fa-bars:before {
  content: "";
}

.fa-list-ul:before {
  content: "";
}

.fa-list-ol:before {
  content: "";
}

.fa-strikethrough:before {
  content: "";
}

.fa-underline:before {
  content: "";
}

.fa-table:before {
  content: "";
}

.fa-magic:before {
  content: "";
}

.fa-truck:before {
  content: "";
}

.fa-pinterest:before {
  content: "";
}

.fa-pinterest-square:before {
  content: "";
}

.fa-google-plus-square:before {
  content: "";
}

.fa-google-plus:before {
  content: "";
}

.fa-money:before {
  content: "";
}

.fa-caret-down:before {
  content: "";
}

.fa-caret-up:before {
  content: "";
}

.fa-caret-left:before {
  content: "";
}

.fa-caret-right:before {
  content: "";
}

.fa-columns:before {
  content: "";
}

.fa-unsorted:before,
.fa-sort:before {
  content: "";
}

.fa-sort-down:before,
.fa-sort-desc:before {
  content: "";
}

.fa-sort-up:before,
.fa-sort-asc:before {
  content: "";
}

.fa-envelope:before {
  content: "";
}

.fa-linkedin:before {
  content: "";
}

.fa-rotate-left:before,
.fa-undo:before {
  content: "";
}

.fa-legal:before,
.fa-gavel:before {
  content: "";
}

.fa-dashboard:before,
.fa-tachometer:before {
  content: "";
}

.fa-comment-o:before {
  content: "";
}

.fa-comments-o:before {
  content: "";
}

.fa-flash:before,
.fa-bolt:before {
  content: "";
}

.fa-sitemap:before {
  content: "";
}

.fa-umbrella:before {
  content: "";
}

.fa-paste:before,
.fa-clipboard:before {
  content: "";
}

.fa-lightbulb-o:before {
  content: "";
}

.fa-exchange:before {
  content: "";
}

.fa-cloud-download:before {
  content: "";
}

.fa-cloud-upload:before {
  content: "";
}

.fa-user-md:before {
  content: "";
}

.fa-stethoscope:before {
  content: "";
}

.fa-suitcase:before {
  content: "";
}

.fa-bell-o:before {
  content: "";
}

.fa-coffee:before {
  content: "";
}

.fa-cutlery:before {
  content: "";
}

.fa-file-text-o:before {
  content: "";
}

.fa-building-o:before {
  content: "";
}

.fa-hospital-o:before {
  content: "";
}

.fa-ambulance:before {
  content: "";
}

.fa-medkit:before {
  content: "";
}

.fa-fighter-jet:before {
  content: "";
}

.fa-beer:before {
  content: "";
}

.fa-h-square:before {
  content: "";
}

.fa-plus-square:before {
  content: "";
}

.fa-angle-double-left:before {
  content: "";
}

.fa-angle-double-right:before {
  content: "";
}

.fa-angle-double-up:before {
  content: "";
}

.fa-angle-double-down:before {
  content: "";
}

.fa-angle-left:before {
  content: "";
}

.fa-angle-right:before {
  content: "";
}

.fa-angle-up:before {
  content: "";
}

.fa-angle-down:before {
  content: "";
}

.fa-desktop:before {
  content: "";
}

.fa-laptop:before {
  content: "";
}

.fa-tablet:before {
  content: "";
}

.fa-mobile-phone:before,
.fa-mobile:before {
  content: "";
}

.fa-circle-o:before {
  content: "";
}

.fa-quote-left:before {
  content: "";
}

.fa-quote-right:before {
  content: "";
}

.fa-spinner:before {
  content: "";
}

.fa-circle:before {
  content: "";
}

.fa-mail-reply:before,
.fa-reply:before {
  content: "";
}

.fa-github-alt:before {
  content: "";
}

.fa-folder-o:before {
  content: "";
}

.fa-folder-open-o:before {
  content: "";
}

.fa-smile-o:before {
  content: "";
}

.fa-frown-o:before {
  content: "";
}

.fa-meh-o:before {
  content: "";
}

.fa-gamepad:before {
  content: "";
}

.fa-keyboard-o:before {
  content: "";
}

.fa-flag-o:before {
  content: "";
}

.fa-flag-checkered:before {
  content: "";
}

.fa-terminal:before {
  content: "";
}

.fa-code:before {
  content: "";
}

.fa-mail-reply-all:before,
.fa-reply-all:before {
  content: "";
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
  content: "";
}

.fa-location-arrow:before {
  content: "";
}

.fa-crop:before {
  content: "";
}

.fa-code-fork:before {
  content: "";
}

.fa-unlink:before,
.fa-chain-broken:before {
  content: "";
}

.fa-question:before {
  content: "";
}

.fa-info:before {
  content: "";
}

.fa-exclamation:before {
  content: "";
}

.fa-superscript:before {
  content: "";
}

.fa-subscript:before {
  content: "";
}

.fa-eraser:before {
  content: "";
}

.fa-puzzle-piece:before {
  content: "";
}

.fa-microphone:before {
  content: "";
}

.fa-microphone-slash:before {
  content: "";
}

.fa-shield:before {
  content: "";
}

.fa-calendar-o:before {
  content: "";
}

.fa-fire-extinguisher:before {
  content: "";
}

.fa-rocket:before {
  content: "";
}

.fa-maxcdn:before {
  content: "";
}

.fa-chevron-circle-left:before {
  content: "";
}

.fa-chevron-circle-right:before {
  content: "";
}

.fa-chevron-circle-up:before {
  content: "";
}

.fa-chevron-circle-down:before {
  content: "";
}

.fa-html5:before {
  content: "";
}

.fa-css3:before {
  content: "";
}

.fa-anchor:before {
  content: "";
}

.fa-unlock-alt:before {
  content: "";
}

.fa-bullseye:before {
  content: "";
}

.fa-ellipsis-h:before {
  content: "";
}

.fa-ellipsis-v:before {
  content: "";
}

.fa-rss-square:before {
  content: "";
}

.fa-play-circle:before {
  content: "";
}

.fa-ticket:before {
  content: "";
}

.fa-minus-square:before {
  content: "";
}

.fa-minus-square-o:before {
  content: "";
}

.fa-level-up:before {
  content: "";
}

.fa-level-down:before {
  content: "";
}

.fa-check-square:before {
  content: "";
}

.fa-pencil-square:before {
  content: "";
}

.fa-external-link-square:before {
  content: "";
}

.fa-share-square:before {
  content: "";
}

.fa-compass:before {
  content: "";
}

.fa-toggle-down:before,
.fa-caret-square-o-down:before {
  content: "";
}

.fa-toggle-up:before,
.fa-caret-square-o-up:before {
  content: "";
}

.fa-toggle-right:before,
.fa-caret-square-o-right:before {
  content: "";
}

.fa-euro:before,
.fa-eur:before {
  content: "";
}

.fa-gbp:before {
  content: "";
}

.fa-dollar:before,
.fa-usd:before {
  content: "";
}

.fa-rupee:before,
.fa-inr:before {
  content: "";
}

.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
  content: "";
}

.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
  content: "";
}

.fa-won:before,
.fa-krw:before {
  content: "";
}

.fa-bitcoin:before,
.fa-btc:before {
  content: "";
}

.fa-file:before {
  content: "";
}

.fa-file-text:before {
  content: "";
}

.fa-sort-alpha-asc:before {
  content: "";
}

.fa-sort-alpha-desc:before {
  content: "";
}

.fa-sort-amount-asc:before {
  content: "";
}

.fa-sort-amount-desc:before {
  content: "";
}

.fa-sort-numeric-asc:before {
  content: "";
}

.fa-sort-numeric-desc:before {
  content: "";
}

.fa-thumbs-up:before {
  content: "";
}

.fa-thumbs-down:before {
  content: "";
}

.fa-youtube-square:before {
  content: "";
}

.fa-youtube:before {
  content: "";
}

.fa-xing:before {
  content: "";
}

.fa-xing-square:before {
  content: "";
}

.fa-youtube-play:before {
  content: "";
}

.fa-dropbox:before {
  content: "";
}

.fa-stack-overflow:before {
  content: "";
}

.fa-instagram:before {
  content: "";
}

.fa-flickr:before {
  content: "";
}

.fa-adn:before {
  content: "";
}

.fa-bitbucket:before {
  content: "";
}

.fa-bitbucket-square:before {
  content: "";
}

.fa-tumblr:before {
  content: "";
}

.fa-tumblr-square:before {
  content: "";
}

.fa-long-arrow-down:before {
  content: "";
}

.fa-long-arrow-up:before {
  content: "";
}

.fa-long-arrow-left:before {
  content: "";
}

.fa-long-arrow-right:before {
  content: "";
}

.fa-apple:before {
  content: "";
}

.fa-windows:before {
  content: "";
}

.fa-android:before {
  content: "";
}

.fa-linux:before {
  content: "";
}

.fa-dribbble:before {
  content: "";
}

.fa-skype:before {
  content: "";
}

.fa-foursquare:before {
  content: "";
}

.fa-trello:before {
  content: "";
}

.fa-female:before {
  content: "";
}

.fa-male:before {
  content: "";
}

.fa-gittip:before,
.fa-gratipay:before {
  content: "";
}

.fa-sun-o:before {
  content: "";
}

.fa-moon-o:before {
  content: "";
}

.fa-archive:before {
  content: "";
}

.fa-bug:before {
  content: "";
}

.fa-vk:before {
  content: "";
}

.fa-weibo:before {
  content: "";
}

.fa-renren:before {
  content: "";
}

.fa-pagelines:before {
  content: "";
}

.fa-stack-exchange:before {
  content: "";
}

.fa-arrow-circle-o-right:before {
  content: "";
}

.fa-arrow-circle-o-left:before {
  content: "";
}

.fa-toggle-left:before,
.fa-caret-square-o-left:before {
  content: "";
}

.fa-dot-circle-o:before {
  content: "";
}

.fa-wheelchair:before {
  content: "";
}

.fa-vimeo-square:before {
  content: "";
}

.fa-turkish-lira:before,
.fa-try:before {
  content: "";
}

.fa-plus-square-o:before {
  content: "";
}

.fa-space-shuttle:before {
  content: "";
}

.fa-slack:before {
  content: "";
}

.fa-envelope-square:before {
  content: "";
}

.fa-wordpress:before {
  content: "";
}

.fa-openid:before {
  content: "";
}

.fa-institution:before,
.fa-bank:before,
.fa-university:before {
  content: "";
}

.fa-mortar-board:before,
.fa-graduation-cap:before {
  content: "";
}

.fa-yahoo:before {
  content: "";
}

.fa-google:before {
  content: "";
}

.fa-reddit:before {
  content: "";
}

.fa-reddit-square:before {
  content: "";
}

.fa-stumbleupon-circle:before {
  content: "";
}

.fa-stumbleupon:before {
  content: "";
}

.fa-delicious:before {
  content: "";
}

.fa-digg:before {
  content: "";
}

.fa-pied-piper-pp:before {
  content: "";
}

.fa-pied-piper-alt:before {
  content: "";
}

.fa-drupal:before {
  content: "";
}

.fa-joomla:before {
  content: "";
}

.fa-language:before {
  content: "";
}

.fa-fax:before {
  content: "";
}

.fa-building:before {
  content: "";
}

.fa-child:before {
  content: "";
}

.fa-paw:before {
  content: "";
}

.fa-spoon:before {
  content: "";
}

.fa-cube:before {
  content: "";
}

.fa-cubes:before {
  content: "";
}

.fa-behance:before {
  content: "";
}

.fa-behance-square:before {
  content: "";
}

.fa-steam:before {
  content: "";
}

.fa-steam-square:before {
  content: "";
}

.fa-recycle:before {
  content: "";
}

.fa-automobile:before,
.fa-car:before {
  content: "";
}

.fa-cab:before,
.fa-taxi:before {
  content: "";
}

.fa-tree:before {
  content: "";
}

.fa-spotify:before {
  content: "";
}

.fa-deviantart:before {
  content: "";
}

.fa-soundcloud:before {
  content: "";
}

.fa-database:before {
  content: "";
}

.fa-file-pdf-o:before {
  content: "";
}

.fa-file-word-o:before {
  content: "";
}

.fa-file-excel-o:before {
  content: "";
}

.fa-file-powerpoint-o:before {
  content: "";
}

.fa-file-photo-o:before,
.fa-file-picture-o:before,
.fa-file-image-o:before {
  content: "";
}

.fa-file-zip-o:before,
.fa-file-archive-o:before {
  content: "";
}

.fa-file-sound-o:before,
.fa-file-audio-o:before {
  content: "";
}

.fa-file-movie-o:before,
.fa-file-video-o:before {
  content: "";
}

.fa-file-code-o:before {
  content: "";
}

.fa-vine:before {
  content: "";
}

.fa-codepen:before {
  content: "";
}

.fa-jsfiddle:before {
  content: "";
}

.fa-life-bouy:before,
.fa-life-buoy:before,
.fa-life-saver:before,
.fa-support:before,
.fa-life-ring:before {
  content: "";
}

.fa-circle-o-notch:before {
  content: "";
}

.fa-ra:before,
.fa-resistance:before,
.fa-rebel:before {
  content: "";
}

.fa-ge:before,
.fa-empire:before {
  content: "";
}

.fa-git-square:before {
  content: "";
}

.fa-git:before {
  content: "";
}

.fa-y-combinator-square:before,
.fa-yc-square:before,
.fa-hacker-news:before {
  content: "";
}

.fa-tencent-weibo:before {
  content: "";
}

.fa-qq:before {
  content: "";
}

.fa-wechat:before,
.fa-weixin:before {
  content: "";
}

.fa-send:before,
.fa-paper-plane:before {
  content: "";
}

.fa-send-o:before,
.fa-paper-plane-o:before {
  content: "";
}

.fa-history:before {
  content: "";
}

.fa-circle-thin:before {
  content: "";
}

.fa-header:before {
  content: "";
}

.fa-paragraph:before {
  content: "";
}

.fa-sliders:before {
  content: "";
}

.fa-share-alt:before {
  content: "";
}

.fa-share-alt-square:before {
  content: "";
}

.fa-bomb:before {
  content: "";
}

.fa-soccer-ball-o:before,
.fa-futbol-o:before {
  content: "";
}

.fa-tty:before {
  content: "";
}

.fa-binoculars:before {
  content: "";
}

.fa-plug:before {
  content: "";
}

.fa-slideshare:before {
  content: "";
}

.fa-twitch:before {
  content: "";
}

.fa-yelp:before {
  content: "";
}

.fa-newspaper-o:before {
  content: "";
}

.fa-wifi:before {
  content: "";
}

.fa-calculator:before {
  content: "";
}

.fa-paypal:before {
  content: "";
}

.fa-google-wallet:before {
  content: "";
}

.fa-cc-visa:before {
  content: "";
}

.fa-cc-mastercard:before {
  content: "";
}

.fa-cc-discover:before {
  content: "";
}

.fa-cc-amex:before {
  content: "";
}

.fa-cc-paypal:before {
  content: "";
}

.fa-cc-stripe:before {
  content: "";
}

.fa-bell-slash:before {
  content: "";
}

.fa-bell-slash-o:before {
  content: "";
}

.fa-trash:before {
  content: "";
}

.fa-copyright:before {
  content: "";
}

.fa-at:before {
  content: "";
}

.fa-eyedropper:before {
  content: "";
}

.fa-paint-brush:before {
  content: "";
}

.fa-birthday-cake:before {
  content: "";
}

.fa-area-chart:before {
  content: "";
}

.fa-pie-chart:before {
  content: "";
}

.fa-line-chart:before {
  content: "";
}

.fa-lastfm:before {
  content: "";
}

.fa-lastfm-square:before {
  content: "";
}

.fa-toggle-off:before {
  content: "";
}

.fa-toggle-on:before {
  content: "";
}

.fa-bicycle:before {
  content: "";
}

.fa-bus:before {
  content: "";
}

.fa-ioxhost:before {
  content: "";
}

.fa-angellist:before {
  content: "";
}

.fa-cc:before {
  content: "";
}

.fa-shekel:before,
.fa-sheqel:before,
.fa-ils:before {
  content: "";
}

.fa-meanpath:before {
  content: "";
}

.fa-buysellads:before {
  content: "";
}

.fa-connectdevelop:before {
  content: "";
}

.fa-dashcube:before {
  content: "";
}

.fa-forumbee:before {
  content: "";
}

.fa-leanpub:before {
  content: "";
}

.fa-sellsy:before {
  content: "";
}

.fa-shirtsinbulk:before {
  content: "";
}

.fa-simplybuilt:before {
  content: "";
}

.fa-skyatlas:before {
  content: "";
}

.fa-cart-plus:before {
  content: "";
}

.fa-cart-arrow-down:before {
  content: "";
}

.fa-diamond:before {
  content: "";
}

.fa-ship:before {
  content: "";
}

.fa-user-secret:before {
  content: "";
}

.fa-motorcycle:before {
  content: "";
}

.fa-street-view:before {
  content: "";
}

.fa-heartbeat:before {
  content: "";
}

.fa-venus:before {
  content: "";
}

.fa-mars:before {
  content: "";
}

.fa-mercury:before {
  content: "";
}

.fa-intersex:before,
.fa-transgender:before {
  content: "";
}

.fa-transgender-alt:before {
  content: "";
}

.fa-venus-double:before {
  content: "";
}

.fa-mars-double:before {
  content: "";
}

.fa-venus-mars:before {
  content: "";
}

.fa-mars-stroke:before {
  content: "";
}

.fa-mars-stroke-v:before {
  content: "";
}

.fa-mars-stroke-h:before {
  content: "";
}

.fa-neuter:before {
  content: "";
}

.fa-genderless:before {
  content: "";
}

.fa-facebook-official:before {
  content: "";
}

.fa-pinterest-p:before {
  content: "";
}

.fa-whatsapp:before {
  content: "";
}

.fa-server:before {
  content: "";
}

.fa-user-plus:before {
  content: "";
}

.fa-user-times:before {
  content: "";
}

.fa-hotel:before,
.fa-bed:before {
  content: "";
}

.fa-viacoin:before {
  content: "";
}

.fa-train:before {
  content: "";
}

.fa-subway:before {
  content: "";
}

.fa-medium:before {
  content: "";
}

.fa-yc:before,
.fa-y-combinator:before {
  content: "";
}

.fa-optin-monster:before {
  content: "";
}

.fa-opencart:before {
  content: "";
}

.fa-expeditedssl:before {
  content: "";
}

.fa-battery-4:before,
.fa-battery:before,
.fa-battery-full:before {
  content: "";
}

.fa-battery-3:before,
.fa-battery-three-quarters:before {
  content: "";
}

.fa-battery-2:before,
.fa-battery-half:before {
  content: "";
}

.fa-battery-1:before,
.fa-battery-quarter:before {
  content: "";
}

.fa-battery-0:before,
.fa-battery-empty:before {
  content: "";
}

.fa-mouse-pointer:before {
  content: "";
}

.fa-i-cursor:before {
  content: "";
}

.fa-object-group:before {
  content: "";
}

.fa-object-ungroup:before {
  content: "";
}

.fa-sticky-note:before {
  content: "";
}

.fa-sticky-note-o:before {
  content: "";
}

.fa-cc-jcb:before {
  content: "";
}

.fa-cc-diners-club:before {
  content: "";
}

.fa-clone:before {
  content: "";
}

.fa-balance-scale:before {
  content: "";
}

.fa-hourglass-o:before {
  content: "";
}

.fa-hourglass-1:before,
.fa-hourglass-start:before {
  content: "";
}

.fa-hourglass-2:before,
.fa-hourglass-half:before {
  content: "";
}

.fa-hourglass-3:before,
.fa-hourglass-end:before {
  content: "";
}

.fa-hourglass:before {
  content: "";
}

.fa-hand-grab-o:before,
.fa-hand-rock-o:before {
  content: "";
}

.fa-hand-stop-o:before,
.fa-hand-paper-o:before {
  content: "";
}

.fa-hand-scissors-o:before {
  content: "";
}

.fa-hand-lizard-o:before {
  content: "";
}

.fa-hand-spock-o:before {
  content: "";
}

.fa-hand-pointer-o:before {
  content: "";
}

.fa-hand-peace-o:before {
  content: "";
}

.fa-trademark:before {
  content: "";
}

.fa-registered:before {
  content: "";
}

.fa-creative-commons:before {
  content: "";
}

.fa-gg:before {
  content: "";
}

.fa-gg-circle:before {
  content: "";
}

.fa-tripadvisor:before {
  content: "";
}

.fa-odnoklassniki:before {
  content: "";
}

.fa-odnoklassniki-square:before {
  content: "";
}

.fa-get-pocket:before {
  content: "";
}

.fa-wikipedia-w:before {
  content: "";
}

.fa-safari:before {
  content: "";
}

.fa-chrome:before {
  content: "";
}

.fa-firefox:before {
  content: "";
}

.fa-opera:before {
  content: "";
}

.fa-internet-explorer:before {
  content: "";
}

.fa-tv:before,
.fa-television:before {
  content: "";
}

.fa-contao:before {
  content: "";
}

.fa-500px:before {
  content: "";
}

.fa-amazon:before {
  content: "";
}

.fa-calendar-plus-o:before {
  content: "";
}

.fa-calendar-minus-o:before {
  content: "";
}

.fa-calendar-times-o:before {
  content: "";
}

.fa-calendar-check-o:before {
  content: "";
}

.fa-industry:before {
  content: "";
}

.fa-map-pin:before {
  content: "";
}

.fa-map-signs:before {
  content: "";
}

.fa-map-o:before {
  content: "";
}

.fa-map:before {
  content: "";
}

.fa-commenting:before {
  content: "";
}

.fa-commenting-o:before {
  content: "";
}

.fa-houzz:before {
  content: "";
}

.fa-vimeo:before {
  content: "";
}

.fa-black-tie:before {
  content: "";
}

.fa-fonticons:before {
  content: "";
}

.fa-reddit-alien:before {
  content: "";
}

.fa-edge:before {
  content: "";
}

.fa-credit-card-alt:before {
  content: "";
}

.fa-codiepie:before {
  content: "";
}

.fa-modx:before {
  content: "";
}

.fa-fort-awesome:before {
  content: "";
}

.fa-usb:before {
  content: "";
}

.fa-product-hunt:before {
  content: "";
}

.fa-mixcloud:before {
  content: "";
}

.fa-scribd:before {
  content: "";
}

.fa-pause-circle:before {
  content: "";
}

.fa-pause-circle-o:before {
  content: "";
}

.fa-stop-circle:before {
  content: "";
}

.fa-stop-circle-o:before {
  content: "";
}

.fa-shopping-bag:before {
  content: "";
}

.fa-shopping-basket:before {
  content: "";
}

.fa-hashtag:before {
  content: "";
}

.fa-bluetooth:before {
  content: "";
}

.fa-bluetooth-b:before {
  content: "";
}

.fa-percent:before {
  content: "";
}

.fa-gitlab:before {
  content: "";
}

.fa-wpbeginner:before {
  content: "";
}

.fa-wpforms:before {
  content: "";
}

.fa-envira:before {
  content: "";
}

.fa-universal-access:before {
  content: "";
}

.fa-wheelchair-alt:before {
  content: "";
}

.fa-question-circle-o:before {
  content: "";
}

.fa-blind:before {
  content: "";
}

.fa-audio-description:before {
  content: "";
}

.fa-volume-control-phone:before {
  content: "";
}

.fa-braille:before {
  content: "";
}

.fa-assistive-listening-systems:before {
  content: "";
}

.fa-asl-interpreting:before,
.fa-american-sign-language-interpreting:before {
  content: "";
}

.fa-deafness:before,
.fa-hard-of-hearing:before,
.fa-deaf:before {
  content: "";
}

.fa-glide:before {
  content: "";
}

.fa-glide-g:before {
  content: "";
}

.fa-signing:before,
.fa-sign-language:before {
  content: "";
}

.fa-low-vision:before {
  content: "";
}

.fa-viadeo:before {
  content: "";
}

.fa-viadeo-square:before {
  content: "";
}

.fa-snapchat:before {
  content: "";
}

.fa-snapchat-ghost:before {
  content: "";
}

.fa-snapchat-square:before {
  content: "";
}

.fa-pied-piper:before {
  content: "";
}

.fa-first-order:before {
  content: "";
}

.fa-yoast:before {
  content: "";
}

.fa-themeisle:before {
  content: "";
}

.fa-google-plus-circle:before,
.fa-google-plus-official:before {
  content: "";
}

.fa-fa:before,
.fa-font-awesome:before {
  content: "";
}

.fa-handshake-o:before {
  content: "";
}

.fa-envelope-open:before {
  content: "";
}

.fa-envelope-open-o:before {
  content: "";
}

.fa-linode:before {
  content: "";
}

.fa-address-book:before {
  content: "";
}

.fa-address-book-o:before {
  content: "";
}

.fa-vcard:before,
.fa-address-card:before {
  content: "";
}

.fa-vcard-o:before,
.fa-address-card-o:before {
  content: "";
}

.fa-user-circle:before {
  content: "";
}

.fa-user-circle-o:before {
  content: "";
}

.fa-user-o:before {
  content: "";
}

.fa-id-badge:before {
  content: "";
}

.fa-drivers-license:before,
.fa-id-card:before {
  content: "";
}

.fa-drivers-license-o:before,
.fa-id-card-o:before {
  content: "";
}

.fa-quora:before {
  content: "";
}

.fa-free-code-camp:before {
  content: "";
}

.fa-telegram:before {
  content: "";
}

.fa-thermometer-4:before,
.fa-thermometer:before,
.fa-thermometer-full:before {
  content: "";
}

.fa-thermometer-3:before,
.fa-thermometer-three-quarters:before {
  content: "";
}

.fa-thermometer-2:before,
.fa-thermometer-half:before {
  content: "";
}

.fa-thermometer-1:before,
.fa-thermometer-quarter:before {
  content: "";
}

.fa-thermometer-0:before,
.fa-thermometer-empty:before {
  content: "";
}

.fa-shower:before {
  content: "";
}

.fa-bathtub:before,
.fa-s15:before,
.fa-bath:before {
  content: "";
}

.fa-podcast:before {
  content: "";
}

.fa-window-maximize:before {
  content: "";
}

.fa-window-minimize:before {
  content: "";
}

.fa-window-restore:before {
  content: "";
}

.fa-times-rectangle:before,
.fa-window-close:before {
  content: "";
}

.fa-times-rectangle-o:before,
.fa-window-close-o:before {
  content: "";
}

.fa-bandcamp:before {
  content: "";
}

.fa-grav:before {
  content: "";
}

.fa-etsy:before {
  content: "";
}

.fa-imdb:before {
  content: "";
}

.fa-ravelry:before {
  content: "";
}

.fa-eercast:before {
  content: "";
}

.fa-microchip:before {
  content: "";
}

.fa-snowflake-o:before {
  content: "";
}

.fa-superpowers:before {
  content: "";
}

.fa-wpexplorer:before {
  content: "";
}

.fa-meetup:before {
  content: "";
}

/* makes the font 33% larger relative to the icon container */
.fa-lg {
  font-size: 1.33333em;
  line-height: 0.75em;
  vertical-align: -15%;
}

.fa-2x {
  font-size: 2em;
}

.fa-3x {
  font-size: 3em;
}

.fa-4x {
  font-size: 4em;
}

.fa-5x {
  font-size: 5em;
}

.fa-ul {
  padding-left: 0;
  margin-left: 2.14286em;
  list-style-type: none;
}

.fa-ul>li {
  position: relative;
}

.fa-li {
  position: absolute;
  left: -2.14286em;
  width: 2.14286em;
  top: 0.14286em;
  text-align: center;
}

.fa-li.fa-lg {
  left: -1.85714em;
}

/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: 'FontAwesome';
  src: url("../fonts/FontAwesome/fontawesome-webfont.eot?v=4.7.0");
  src: url("../fonts/FontAwesome/fontawesome-webfont.eot?#iefix&v=4.7.0") format("embedded-opentype"), url("../fonts/FontAwesome/fontawesome-webfont.ttf?v=4.7.0") format("truetype"), url("../fonts/FontAwesome/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

.fa-rotate-90 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.fa-rotate-180 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.fa-rotate-270 {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
  -webkit-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}

.fa-flip-horizontal {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  -webkit-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  transform: scale(-1, 1);
}

.fa-flip-vertical {
  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  -webkit-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  transform: scale(1, -1);
}

:root .fa-rotate-90,
:root .fa-rotate-180,
:root .fa-rotate-270,
:root .fa-flip-horizontal,
:root .fa-flip-vertical {
  filter: none;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto;
}

.fa-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
}

.fa-stack-1x,
.fa-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}

.fa-stack-1x {
  line-height: inherit;
}

.fa-stack-2x {
  font-size: 2em;
}

.fa-inverse {
  color: #fff;
}


@font-face {
  font-family: 'fontelloproduct';
  src: url("../fonts/fontello/product/fontello.eot");
  src: url("../fonts/fontello/product/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/product/fontello.ttf") format("truetype"), url("../fonts/fontello/product/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="iconproduct-"]:before,
[class*=" iconproduct-"]:before {
  font-family: "fontelloproduct";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



/*!
 *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
.icon-1-suppliers:before {
  content: '\e800';
}

/* '' */
.icon-2-sales:before {
  content: '\e801';
}

/* '' */
.icon-3-salereturns:before {
  content: '\e802';
}

/* '' */
.icon-4-receives:before {
  content: '\e803';
}

/* '' */
.icon-5-receivereturns:before {
  content: '\e804';
}

/* '' */
.icon-6-requisitions:before {
  content: '\e805';
}

/* '' */
.icon-7-adjusts:before {
  content: '\e806';
}

/* '' */
.icon-8-otherexpenses:before {
  content: '\e807';
}

/* '' */
.icon-9-otherrevenues:before {
  content: '\e808';
}

/* '' */
.icon-10-payments:before {
  content: '\e809';
}

/* '' */
.icon-11-receipts:before {
  content: '\e80a';
}

/* '' */
.icon2-1-filesimport:before {
  content: '\e800';
}

/* '' */
.icon2-2-filesexport:before {
  content: '\e801';
}

/* '' */
.icon2-3-filesmoney:before {
  content: '\e802';
}

/* '' */
.icon2-4-filescheck:before {
  content: '\e803';
}

/* '' */
.icon2-5-shopee:before {
  content: '\e804';
}

/* '' */
.icon2-6-ruten:before {
  content: '\e805';
}

/* '' */
.icon2-7-pchome:before {
  content: '\e806';
}

/* '' */
.icon2-8-yahoo:before {
  content: '\e807';
}

/* '' */
.icon2-9-shopping-cart:before {
  content: '\e808';
}

/* '' */
.icon3-1-banktransferinside:before {
  content: '\e800';
}

/* '' */
.icon3-2-bankadjust:before {
  content: '\e801';
}

/* '' */
.icon3-3-cashadjusts:before {
  content: '\e802';
}

/* '' */
.icon3-4-shippingwizard:before {
  content: '\e803';
}

/* '' */
.icon3-5-pickingslip:before {
  content: '\e804';
}

/* '' */
.icon3-6-nonshippingorders:before {
  content: '\e805';
}

/* '' */
.icon3-7-shippingorders:before {
  content: '\e806';
}

/* '' */
.icon3-8-updateplatformstock:before {
  content: '\e807';
}

/* '' */
.icon3-9-combination:before {
  content: '\e808';
}

/* '' */
.icon3-10-dismantling:before {
  content: '\e809';
}

/* '' */
.icon4-1-templates:before {
  content: '\e800';
}

/* '' */
.icon4-2-filecreat:before {
  content: '\e801';
}

/* '' */
.icon4-3-filerefresh:before {
  content: '\e802';
}

/* '' */
.icon4-4-lock:before {
  content: '\e803';
}

/* '' */
.icon4-5-purchase:before {
  content: '\e804';
}

/* '' */
.icon4-6-moneytag:before {
  content: '\e805';
}

/* '' */
.icon4-7-pos:before {
  content: '\e806';
}

/* '' */
.icon4-8-inventorywizard:before {
  content: '\e807';
}

/* '' */
.icon4-9-filequestion:before {
  content: '\e808';
}

/* '' */
.icon4-10-fileoperate:before {
  content: '\e809';
}

/* '' */
.icon4-11-bookoperate:before {
  content: '\e80a';
}

/* '' */
.icon5-1-stockabnormal:before {
  content: '\e800';
}

/* '' */
.icon5-2-circleborder:before {
  content: '\e801';
}

/* '' */
.icon5-3-barcodebox:before {
  content: '\e802';
}

/* '' */
.icon5-4-barcodeboxplus:before {
  content: '\e803';
}

/* '' */
.icon5-5-barcodeboxminus:before {
  content: '\e804';
}

/* '' */
.icon5-6-messagepen:before {
  content: '\e805';
}

/* '' */
.icon5-7-bankmoney:before {
  content: '\e806';
}

/* '' */
.icon5-8-shopline:before {
  content: '\e807';
}

/* '' */
.icon5-9-yahoosale:before {
  content: '\e808';
}

/* '' */
.icon5-10-yahoosale-2:before {
  content: '\e809';
}

/* '' */
.icon5-11-yahoomall:before {
  content: '\e80a';
}

/* '' */
.icon5-12-yahoomall-2:before {
  content: '\e80b';
}

/* '' */
.icon5-13-excelorders:before {
  content: '\e80c';
}

/* '' */
.icon5-14-moneyoff:before {
  content: '\e80d';
}

/* '' */
.icon6-1-bell:before {
  content: '\e800';
}

/* '' */
.icon6-1-bell-filled:before {
  content: '\e801';
}

/* '' */
.icon6-2-home:before {
  content: '\e802';
}

/* '' */
.icon6-2-home-filled:before {
  content: '\e803';
}

/* '' */
.icon6-3-message:before {
  content: '\e804';
}

/* '' */
.icon6-3-message-filled:before {
  content: '\e805';
}

/* '' */
.icon6-4-people:before {
  content: '\e806';
}

/* '' */
.icon6-4-people-2:before {
  content: '\e807';
}

/* '' */
.icon6-4-people-2-filled:before {
  content: '\e808';
}

/* '' */
.icon6-4-people-filled:before {
  content: '\e809';
}

/* '' */
.icon6-5-phone:before {
  content: '\e80a';
}

/* '' */
.icon6-6-meeting:before {
  content: '\e80b';
}

/* '' */
.icon6-7-coin:before {
  content: '\e80c';
}

/* '' */
.icon6-8-calendar:before {
  content: '\e80d';
}

/* '' */
.icon6-9-pen:before {
  content: '\e80e';
}

/* '' */
.icon6-10-chart-k:before {
  content: '\e80f';
}

/* '' */
.icon6-11-taxi:before {
  content: '\e810';
}

/* '' */
.icon6-12-2people:before {
  content: '\e811';
}

/* '' */
.icon6-13-personal-img:before {
  content: '\e812';
}

/* '' */
.icon7-1-momo:before {
  content: '\e800';
}

/* '' */
.icon7-1-momo-2:before {
  content: '\e801';
}

/* '' */
.icon7-2-pinecone:before {
  content: '\e802';
}

/* '' */
.icon7-2-pinecone-2:before {
  content: '\e803';
}

/* '' */
.icon7-3-moneyadd:before {
  content: '\e804';
}

/* '' */
.icon7-4-moneyminus:before {
  content: '\e805';
}

/* '' */
.icon7-5-bankmoneyadd:before {
  content: '\e806';
}

/* '' */
.icon7-6-bankmoneyminus:before {
  content: '\e807';
}

/* '' */
.icon7-7-filtermoney:before {
  content: '\e808';
}

/* '' */
.icon7-8-pccat:before {
  content: '\e809';
}

/* '' */
.icon7-9-listmanage:before {
  content: '\e80a';
}

/* '' */
.icon8-1-footwalk:before {
  content: '\e800';
}

/* '' */
.icon8-2-peoplefile:before {
  content: '\e801';
}

/* '' */
.icon8-3-phonecheck:before {
  content: '\e802';
}

/* '' */
.icon8-4-storepen:before {
  content: '\e803';
}

/* '' */
.icon8-5-twostore:before {
  content: '\e804';
}

/* '' */
.icon8-6-additionincome:before {
  content: '\e805';
}

/* '' */
.icon8-7-additionexpenses:before {
  content: '\e806';
}

/* '' */
.icon8-8-balancepayments:before {
  content: '\e807';
}

/* '' */
.icon8-9-storeset:before {
  content: '\e808';
}

/* '' */
.icon8-10-sendstop:before {
  content: '\e809';
}

/* '' */
.icon9-1-producttransfer:before {
  content: '\e800';
}


.icon10-1-membercarrier:before {
  content: '\e800';
}

/* '' */

.icon11-1-price-setting:before {
  content: '\e803';
}

/* '' */

.icon11-1-price-setting:before {
  content: '\e803';
}

/* '' */

.icon12-1-15-googleupload:before {
  content: '\e805';
}

/* '' */

.icon13-1-91appw:before {
  content: '\e810';
}

/* '' */
.icon13-1-91app3:before {
  content: '\e813';
}

/* '' */

.icon14-1-crmoil:before {
  content: '\e800';
}

/* '' */
.icon14-1-crmopp:before {
  content: '\e801';
}

/* '' */
.icon14-1-crmunopp:before {
  content: '\e802';
}

/* '' */
.icon14-1-crmuser:before {
  content: '\e803';
}

/* '' */
.icon14-1-crmsumopp:before {
  content: '\e804';
}

/* '' */
.icon14-1-crmcalendar:before {
  content: '\e805';
}

/* '' */
.icon14-1-crmnewopp:before {
  content: '\e806';
}

/* '' */
.icon14-1-crmflow:before {
  content: '\e807';
}

/* '' */
.icon14-1-crmdash:before {
  content: '\e808';
}

/* '' */
.icon15-1-costshare:before {
  content: '\e809';
}

/* '' */
.icon16-1-projecttags:before {
  content: '\e80c';
}

/* '' */

.icon17-1-delivery-man:before {
  content: '\e810';
}

/* '' */
.icon17-1-excel-import:before {
  content: '\e811';
}

/* '' */
.icon17-1-product-price:before {
  content: '\e812';
}

/* '' */
.icon17-1-product-stock:before {
  content: '\e813';
}

/* '' */
.icon17-1-box-barcode:before {
  content: '\e814';
}

/* '' */
.icon17-1-customer-cart:before {
  content: '\e815';
}

/* '' */
.icon17-1-identity-card:before {
  content: '\e816';
}

/* '' */

.icon18-1-cyberbiz:before {
  content: '\e817';
}

/* '' */
.icon18-1-offset:before {
  content: '\e818';
}

/* '' */

.icon19-1-contracts:before {
  content: '\e828';
}

/* '' */
.icon19-1-contracts-s:before {
  content: '\e829';
}

/* '' */

.icon20-1-items:before {
  content: '\e81b';
}

/* '' */

.icon21-1-logistics:before {
  content: '\e823';
}

.icon22-1-customization:before {
  content: '\e823';
}

.icon23-1-packing2:before {
  content: '\e829';
}

/* '' */
.icon23-2-packing3:before {
  content: '\e82a';
}


.icon24-1-tax-setting:before {
  content: '\e82b';
}

/* '' */
.icon24-1-media:before {
  content: '\e82f';
}

/* '' */
.icon24-1-apply-paper:before {
  content: '\e830';
}

/* '' */
.icon24-1-tax-paper:before {
  content: '\e831';
}

/* '' */
.icon24-1-report-tax:before {
  content: '\e832';
}

/* '' */
.icon24-1-paper-minus:before {
  content: '\e833';
}

/* '' */
.icon24-1-paper-plus:before {
  content: '\e834';
}

/* '' */
.icon24-1-month-invoice:before {
  content: '\e835';
}

/* '' */
.icon24-1-money-invoice:before {
  content: '\e836';
}

/* '' */
.icon24-1-paper-back:before {
  content: '\e837';
}

/* '' */
.icon25-1-file-import2:before {
  content: '\e82f';
}

.icon26-1-product-form-setting:before {
  content: '\e830';
}

/* '' */
.icon26-1-product-content-setting:before {
  content: '\e831';
}

/* '' */
.icon26-1-label-design:before {
  content: '\e832';
}

/* '' */
.icon26-1-label-source-setting:before {
  content: '\e833';
}

/* '' */
.icon26-1-printer:before {
  content: '\e834';
}

/* '' */
.icon26-1-iopen-square:before {
  content: '\e849';
}

/* '' */
.icon27-1-checkbox:before {
  content: '\e836';
}

/* '' */
.icon28-1-boxes-paper:before {
  content: '\e835';
}

/* '' */
.icon28-1-delivery-truck-paper:before {
  content: '\e836';
}

.icon29-1-qa-accountingsvg:before {
  content: '\e83d';
}

/* '' */
.icon29-1-fa-file-text-o-2:before {
  content: '\e83e';
}

/* '' */
.icon29-1-qa-adjust:before {
  content: '\e83f';
}

/* '' */
.icon29-1-outcome:before {
  content: '\e840';
}

/* '' */
.icon29-1-income:before {
  content: '\e841';
}


.icon30-1-expense:before {
  content: '\e800';
}

/* '' */
.icon30-1-income-1:before {
  content: '\e83c';
}

.icon31-1-file:before {
  content: '\e83f';
}

/* '' */
.icon31-1-scrapped:before {
  content: '\e840';
}

/* '' */
.icon31-1-calculate:before {
  content: '\e841';
}

/* '' */
.icon31-1-openbook:before {
  content: '\e843';
}

/* '' */
.icon31-1-statistics:before {
  content: '\e800';
}

/* '' */

/* '' */
.icon31-1-asset:before {
  content: '\e845';
}

.icon32-1-responsive:before {
  content: '\e84c';
}

/* '' */
.icon32-1-auth:before {
  content: '\e84d';
}

/* '' */
.icon32-1-logout:before {
  content: '\e84f';
}

/* '' */
.icon32-1-buy:before {
  content: '\e850';
}

.icon33-1-jambo-2:before {
  content: '\e851';
}

.icon34-mo-plus:before {
  content: '\e85c';
}

.iconproduct-1-pd-tax:before {
  content: '\e852';
}

/* '' */
.iconproduct-1-pd-qa:before {
  content: '\e853';
}

/* '' */
.iconproduct-1-pd-print:before {
  content: '\e854';
}

/* '' */
.iconproduct-1-pd-itemlabel:before {
  content: '\e855';
}

/* '' */
.iconproduct-1-pd-ec:before {
  content: '\e856';
}

/* '' */
.iconproduct-1-pd-crm:before {
  content: '\e857';
}

/* '' */
.iconproduct-1-pd-attendance:before {
  content: '\e858';
}

/* '' */
.iconproduct-1-pd-assets:before {
  content: '\e859';
}

/* '' */
.iconproduct-1-pd-accounting:before {
  content: '\e85a';
}

/* '' */
.iconproduct-1-pd-a1pro:before {
  content: '\e85b';
}

/* '' */

.icon32-1-jambo-2:before {
  content: '\e851';
}

/* '' */




/* '' */


/* '' */

.icon-disabled {
  color: #b2b2b2;
}

/* '' */





@font-face {
  font-family: 'fontello';
  src: url("../fonts/fontello/1/fontello.eot");
  src: url("../fonts/fontello/1/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/1/fontello.ttf") format("truetype"), url("../fonts/fontello/1/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"]:before,
[class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello2';
  src: url("../fonts/fontello/2/fontello.eot");
  src: url("../fonts/fontello/2/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/2/fontello.ttf") format("truetype"), url("../fonts/fontello/2/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon2-"]:before,
[class*=" icon2-"]:before {
  font-family: "fontello2";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello3';
  src: url("../fonts/fontello/3/fontello.eot");
  src: url("../fonts/fontello/3/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/3/fontello.ttf") format("truetype"), url("../fonts/fontello/3/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon3-"]:before,
[class*=" icon3-"]:before {
  font-family: "fontello3";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello4';
  src: url("../fonts/fontello/4/fontello.eot");
  src: url("../fonts/fontello/4/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/4/fontello.ttf") format("truetype"), url("../fonts/fontello/4/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon4-"]:before,
[class*=" icon4-"]:before {
  font-family: "fontello4";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello5';
  src: url("../fonts/fontello/5/fontello.eot");
  src: url("../fonts/fontello/5/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/5/fontello.ttf") format("truetype"), url("../fonts/fontello/5/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon5-"]:before,
[class*=" icon5-"]:before {
  font-family: "fontello5";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello6';
  src: url("../fonts/fontello/6/fontello.eot");
  src: url("../fonts/fontello/6/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/6/fontello.ttf") format("truetype"), url("../fonts/fontello/6/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon6-"]:before,
[class*=" icon6-"]:before {
  font-family: "fontello6";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello7';
  src: url("../fonts/fontello/7/fontello.eot");
  src: url("../fonts/fontello/7/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/7/fontello.ttf") format("truetype"), url("../fonts/fontello/7/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon7-"]:before,
[class*=" icon7-"]:before {
  font-family: "fontello7";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello8';
  src: url("../fonts/fontello/8/fontello.eot");
  src: url("../fonts/fontello/8/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/8/fontello.ttf") format("truetype"), url("../fonts/fontello/8/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon8-"]:before,
[class*=" icon8-"]:before {
  font-family: "fontello8";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello9';
  src: url("../fonts/fontello/9/fontello.eot");
  src: url("../fonts/fontello/9/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/9/fontello.ttf") format("truetype"), url("../fonts/fontello/9/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon9-"]:before,
[class*=" icon9-"]:before {
  font-family: "fontello9";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello10';
  src: url("../fonts/fontello/10/fontello.eot");
  src: url("../fonts/fontello/10/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/10/fontello.ttf") format("truetype"), url("../fonts/fontello/10/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon10-"]:before,
[class*=" icon10-"]:before {
  font-family: "fontello10";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello11';
  src: url("../fonts/fontello/11/fontello.eot");
  src: url("../fonts/fontello/11/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/11/fontello.ttf") format("truetype"), url("../fonts/fontello/11/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon11-"]:before,
[class*=" icon11-"]:before {
  font-family: "fontello11";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello12';
  src: url("../fonts/fontello/12/fontello.eot");
  src: url("../fonts/fontello/12/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/12/fontello.ttf") format("truetype"), url("../fonts/fontello/12/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon12-"]:before,
[class*=" icon12-"]:before {
  font-family: "fontello12";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello13';
  src: url("../fonts/fontello/13/fontello.eot");
  src: url("../fonts/fontello/13/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/13/fontello.ttf") format("truetype"), url("../fonts/fontello/13/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon13-"]:before,
[class*=" icon13-"]:before {
  font-family: "fontello13";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@font-face {
  font-family: 'fontello14';
  src: url("../fonts/fontello/14/fontello.eot");
  src: url("../fonts/fontello/14/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/14/fontello.ttf") format("truetype"), url("../fonts/fontello/14/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon14-"]:before,
[class*=" icon14-"]:before {
  font-family: "fontello14";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello15';
  src: url("../fonts/fontello/15/fontello.eot");
  src: url("../fonts/fontello/15/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/15/fontello.ttf") format("truetype"), url("../fonts/fontello/15/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon15-"]:before,
[class*=" icon15-"]:before {
  font-family: "fontello15";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello16';
  src: url("../fonts/fontello/16/fontello.eot");
  src: url("../fonts/fontello/16/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/16/fontello.ttf") format("truetype"), url("../fonts/fontello/16/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon16-"]:before,
[class*=" icon16-"]:before {
  font-family: "fontello16";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello17';
  src: url("../fonts/fontello/17/fontello.eot");
  src: url("../fonts/fontello/17/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/17/fontello.ttf") format("truetype"), url("../fonts/fontello/17/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon17-"]:before,
[class*=" icon17-"]:before {
  font-family: "fontello17";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello18';
  src: url("../fonts/fontello/18/fontello.eot");
  src: url("../fonts/fontello/18/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/18/fontello.ttf") format("truetype"), url("../fonts/fontello/18/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon18-"]:before,
[class*=" icon18-"]:before {
  font-family: "fontello18";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello19';
  src: url("../fonts/fontello/19/fontello.eot");
  src: url("../fonts/fontello/19/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/19/fontello.ttf") format("truetype"), url("../fonts/fontello/19/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon19-"]:before,
[class*=" icon19-"]:before {
  font-family: "fontello19";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@font-face {
  font-family: 'fontello20';
  src: url("../fonts/fontello/20/fontello.eot");
  src: url("../fonts/fontello/20/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/20/fontello.ttf") format("truetype"), url("../fonts/fontello/20/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon20-"]:before,
[class*=" icon20-"]:before {
  font-family: "fontello20";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello21';
  src: url("../fonts/fontello/21/fontello.eot");
  src: url("../fonts/fontello/21/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/21/fontello.ttf") format("truetype"), url("../fonts/fontello/21/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon21-"]:before,
[class*=" icon21-"]:before {
  font-family: "fontello21";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello22';
  src: url("../fonts/fontello/22/fontello.eot");
  src: url("../fonts/fontello/22/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/22/fontello.ttf") format("truetype"), url("../fonts/fontello/22/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon22-"]:before,
[class*=" icon22-"]:before {
  font-family: "fontello22";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello23';
  src: url("../fonts/fontello/23/fontello.eot");
  src: url("../fonts/fontello/23/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/23/fontello.ttf") format("truetype"), url("../fonts/fontello/23/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon23-"]:before,
[class*=" icon23-"]:before {
  font-family: "fontello23";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@font-face {
  font-family: 'fontello24';
  src: url("../fonts/fontello/24/fontello.eot");
  src: url("../fonts/fontello/24/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/24/fontello.ttf") format("truetype"), url("../fonts/fontello/24/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon24-"]:before,
[class*=" icon24-"]:before {
  font-family: "fontello24";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@font-face {
  font-family: 'fontello25';
  src: url("../fonts/fontello/25/fontello.eot");
  src: url("../fonts/fontello/25/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/25/fontello.ttf") format("truetype"), url("../fonts/fontello/25/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon25-"]:before,
[class*=" icon25-"]:before {
  font-family: "fontello25";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello26';
  src: url("../fonts/fontello/26/fontello.eot");
  src: url("../fonts/fontello/26/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/26/fontello.ttf") format("truetype"), url("../fonts/fontello/26/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon26-"]:before,
[class*=" icon26-"]:before {
  font-family: "fontello26";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello27';
  src: url("../fonts/fontello/27/fontello.eot");
  src: url("../fonts/fontello/27/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/27/fontello.ttf") format("truetype"), url("../fonts/fontello/27/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon27-"]:before,
[class*=" icon27-"]:before {
  font-family: "fontello27";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@font-face {
  font-family: 'fontello28';
  src: url("../fonts/fontello/28/fontello.eot");
  src: url("../fonts/fontello/28/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/28/fontello.ttf") format("truetype"), url("../fonts/fontello/28/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon28-"]:before,
[class*=" icon28-"]:before {
  font-family: "fontello28";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



@font-face {
  font-family: 'fontello29';
  src: url("../fonts/fontello/29/fontello.eot");
  src: url("../fonts/fontello/29/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/29/fontello.ttf") format("truetype"), url("../fonts/fontello/29/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon29-"]:before,
[class*=" icon29-"]:before {
  font-family: "fontello29";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}




@font-face {
  font-family: 'fontello30';
  src: url("../fonts/fontello/30/fontello.eot");
  src: url("../fonts/fontello/30/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/30/fontello.ttf") format("truetype"), url("../fonts/fontello/30/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon30-"]:before,
[class*=" icon30-"]:before {
  font-family: "fontello30";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@font-face {
  font-family: 'fontello31';
  src: url("../fonts/fontello/31/fontello.eot");
  src: url("../fonts/fontello/31/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/31/fontello.ttf") format("truetype"), url("../fonts/fontello/31/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon31-"]:before,
[class*=" icon31-"]:before {
  font-family: "fontello31";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@font-face {
  font-family: 'fontello32';
  src: url("../fonts/fontello/32/fontello.eot");
  src: url("../fonts/fontello/32/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/32/fontello.ttf") format("truetype"), url("../fonts/fontello/32/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon32-"]:before,
[class*=" icon32-"]:before {
  font-family: "fontello32";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@font-face {
  font-family: 'fontello33';
  src: url("../fonts/fontello/33/fontello.eot");
  src: url("../fonts/fontello/33/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/33/fontello.ttf") format("truetype"), url("../fonts/fontello/33/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon33-"]:before,
[class*=" icon33-"]:before {
  font-family: "fontello33";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


@font-face {
  font-family: 'fontello34';
  src: url("../fonts/fontello/34/fontello.eot");
  src: url("../fonts/fontello/34/fontello.eot") format("embedded-opentype"), url("../fonts/fontello/34/fontello.ttf") format("truetype"), url("../fonts/fontello/34/fontello.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

[class^="icon34-"]:before,
[class*=" icon34-"]:before {
  font-family: "fontello34";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  line-height: 1em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}



.magic-checkbox+label:before {
  border-radius: 3px;
}

.magic-checkbox+label:after {
  top: 3px;
  left: 7px;
  box-sizing: border-box;
  width: 6px;
  height: 12px;
  transform: scale(1.5) rotate(45deg);
  border-width: 2px;
  border-style: solid;
  border-color: #fff;
  border-top: 0;
  border-left: 0;
}

.magic-checkbox:checked+label:before {
  border: #0c8f4f;
  background: #0c8f4f;
}

.magic-checkbox:checked[disabled]+label:before {
  border: #0c8f4f;
  background: #0c8f4f;
}

.magic-checkbox.blue:hover+label:before {
  border: 1px solid #0089c2;
}

.magic-checkbox.blue:checked+label:before {
  border: #0089c2;
  background: #0089c2;
}

@keyframes hover-color {
  from {
    border-color: #c0c0c0;
  }

  to {
    border-color: #0c8f4f;
  }
}

@keyframes hover-color-blue {
  from {
    border-color: #c0c0c0;
  }

  to {
    border-color: #0a7eda;
  }
}

@keyframes hover-color-orange {
  from {
    border-color: #c0c0c0;
  }

  to {
    border-color: #ff8c4d;
  }
}

@keyframes hover-color-green {
  from {
    border-color: #c0c0c0;
  }

  to {
    border-color: #26b0a4;
  }
}

@keyframes hover-color-red {
  from {
    border-color: #c0c0c0;
  }

  to {
    border-color: #ff6360;
  }
}


@keyframes hover-color-gray {
  from {
    border-color: #c0c0c0;
  }

  to {
    border-color: #607d8b;
  }
}


@keyframes hover-color-blue2 {
  from {
    border-color: #c0c0c0;
  }

  to {
    border-color: #2d41ac;
  }
}

@keyframes hover-color-purple {
  from {
    border-color: #c0c0c0;
  }

  to {
    border-color: #9f41bd;
  }
}







.magic-radio,
.magic-checkbox {
  /*  position: absolute; */
  display: none;
}

.magic-radio[disabled],
.magic-checkbox[disabled] {
  cursor: not-allowed;
}

.magic-radio.behind-input+label,
.magic-checkbox.behind-input+label {
  padding-left: 20px;
}

.magic-radio+label,
.magic-checkbox+label {
  position: relative;
  display: inline-block;
  padding-left: 26px;
  cursor: pointer;
  vertical-align: top;
}

.magic-radio+label:hover:before,
.magic-checkbox+label:hover:before {
  animation-duration: 0.4s;
  animation-fill-mode: both;
  animation-name: hover-color;
}

[data-theme='blue'] .magic-radio+label:hover:before,
[data-theme='blue'] .magic-checkbox+label:hover:before {
  animation-name: hover-color-blue;
}

[data-theme='orange'] .magic-radio+label:hover:before,
[data-theme='orange'] .magic-checkbox+label:hover:before {
  animation-name: hover-color-orange;
}

[data-theme='green'] .magic-radio+label:hover:before,
[data-theme='green'] .magic-checkbox+label:hover:before {
  animation-name: hover-color-green;
}

[data-theme='red'] .magic-radio+label:hover:before,
[data-theme='red'] .magic-checkbox+label:hover:before {
  animation-name: hover-color-red;
}

[data-theme='blue2'] .magic-radio+label:hover:before,
[data-theme='blue2'] .magic-checkbox+label:hover:before {
  animation-name: hover-color-blue2;
}

[data-theme='gray'] .magic-radio+label:hover:before,
[data-theme='gray'] .magic-checkbox+label:hover:before {
  animation-name: hover-color-gray;
}

[data-theme='purple'] .magic-radio+label:hover:before,
[data-theme='purple'] .magic-checkbox+label:hover:before {
  animation-name: hover-color-purple;
}

.magic-radio+label:before,
.magic-checkbox+label:before {
  position: absolute;
  top: 1px;
  left: 0;
  display: inline-block;
  width: 18px;
  height: 18px;
  content: '';
  border: 1px solid #c0c0c0;
  background: #fff;
}

.magic-radio+label:after,
.magic-checkbox+label:after {
  position: absolute;
  display: none;
  content: '';
}

.magic-radio[disabled]+label,
.magic-checkbox[disabled]+label {
  cursor: not-allowed;
  color: #c0c0c0;
}

.magic-radio[disabled]+label:hover,
.magic-radio[disabled]+label:before,
.magic-radio[disabled]+label:after,
.magic-checkbox[disabled]+label:hover,
.magic-checkbox[disabled]+label:before,
.magic-checkbox[disabled]+label:after {
  cursor: not-allowed;
}

.magic-radio[disabled]+label:hover:before,
.magic-checkbox[disabled]+label:hover:before {
  border: 1px solid #c0c0c0;
  animation-name: none;
}

.magic-radio[disabled]+label:before,
.magic-checkbox[disabled]+label:before {
  border-color: #c0c0c0;
}

.magic-radio:checked[disabled]+label:hover:before,
.magic-checkbox:checked[disabled]+label:hover:before {
  border: 1px solid #0c8f4f;
}

.magic-radio:checked+label:before,
.magic-checkbox:checked+label:before {
  -webkit-animation: fadeIn .2s both;
  animation: fadeIn .2s both;
}

.magic-radio:checked+label:after,
.magic-checkbox:checked+label:after {
  display: block;
  -webkit-animation: checkboxMove .3s both;
  animation: checkboxMove .3s both;
}

@keyframes checkboxMove {

  0%,
  20%,
  60%,
  100% {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    transform: scale(0.1) rotate(45deg);
  }

  20% {
    opacity: .6;
    transform: scale(0.1) rotate(45deg);
  }

  80% {
    opacity: 1;
    transform: scale(1.2) rotate(45deg);
  }

  100% {
    transform: scale(1) rotate(45deg);
  }
}

.magic-radio+label:before {
  border-radius: 50%;
}

.magic-radio+label:after {
  top: 6px;
  left: 5px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #0c8f4f;
}

.magic-radio:checked+label:before {
  border: 1px solid #0c8f4f;
}

.magic-radio:checked[disabled]+label:before {
  border: 1px solid #0c8f4f;
}

.magic-radio:checked[disabled]+label:after {
  background: #0c8f4f;
}

/* ---------------------------------------------------------------------- */
/*  Accordion
/* ---------------------------------------------------------------------- */
.accordion .panel {
  background-color: #FFFFFF;
  border: none;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  -moz-box-shadow: 0, 0, 0, transparent;
  -webkit-box-shadow: 0, 0, 0, transparent;
  box-shadow: 0, 0, 0, transparent;
}

.accordion .panel-heading {
  padding: 0;
  background-image: none;
  height: auto;
  min-height: 0;
  -moz-box-shadow: 0, 0, 0, transparent;
  -webkit-box-shadow: 0, 0, 0, transparent;
  box-shadow: 0, 0, 0, transparent;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
}

.accordion .panel-heading .accordion-toggle {
  background-color: #E6E8E8;
  color: #999;
  display: block;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  padding: 10px;
  position: relative;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}

.accordion .panel-heading .accordion-toggle:hover,
.accordion .panel-heading .accordion-toggle:focus {
  text-decoration: none;
}

.accordion .panel-heading .accordion-toggle.collapsed {
  background-color: #F3F3F3;
  border-color: #D9D9D9;
  border-width: 0 0 0 1px;
  color: gray;
  font-weight: 300;
}

.accordion .panel-heading .accordion-toggle.collapsed>.icon-arrow {
  filter: alpha(opacity=75);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
  -moz-opacity: 0.75;
  -khtml-opacity: 0.75;
  opacity: 0.75;
}

.accordion .panel-heading .accordion-toggle.collapsed>.icon-arrow:before {
  content: "\f067" !important;
}

.accordion .panel-heading .accordion-toggle>.icon-arrow {
  font-family: FontAwesome;
  font-size: 11px;
  padding: 0 5px;
  display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #b3b3b3;
}

.accordion .panel-heading .accordion-toggle>.icon-arrow:before {
  content: "\f068";
}

.accordion .panel-body {
  border: none !important;
}

.accordion.panel-group .panel+.panel {
  margin-top: 1px;
}

.accordion.accordion-white .panel-heading .accordion-toggle {
  background-color: #ffffff;
}

.accordion.accordion-white .panel-heading .accordion-toggle.collapsed {
  background-color: #ffffff;
}

.accordion.accordion-white.panel-group .panel+.panel {
  margin-top: 0;
  border-top: 1px solid #4d4d4d;
}

.add-inner-block {
  position: relative;
  background: #fdefe4;
  padding-top: 20px;
}

.add-inner-block~.add-inner-block {
  padding-top: 0;
}

.add-inner-block .btn-close {
  position: absolute;
  left: 0;
  color: #ddcabb;
  z-index: 99;
  font-size: 116%;
  margin-top: -4px;
}

.add-inner-block .btn-close:hover {
  color: #fc9424;
}

section.add-inner-block:first-of-type:before {
  content: "";
  border: 14px solid transparent;
  border-bottom-color: #fdefe4;
  line-height: 0;
  height: 0;
  width: 0;
  position: absolute;
  top: -26px;
  left: 28px;
}

section.add-inner-block:last-of-type {
  margin-bottom: 20px;
}

@media (max-width: 767px) {
  .add-inner-block {
    margin-bottom: 10px;
    border: 1px solid #cccccc;
  }

  .add-inner-block~.add-inner-block {
    margin-bottom: 10px;
    padding-top: 20px;
  }

  .add-inner-block .btn-close {
    left: auto;
    top: -16px;
    right: -16px;
    color: #b3b3b3;
    z-index: 99;
    font-size: 22px;
  }

  .add-inner-block .btn-close i:before {
    content: "\f057 ";
  }

  .add-inner-block .btn-close i:after {
    content: "";
    width: 20px;
    height: 20px;
    background: #fff;
    border-radius: 100px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    z-index: -1;
  }

  section.add-inner-block:first-of-type:before {
    display: none;
  }
}

/* ---------------------------------------------------------------------- */
/*  calendar-business 業務好幫手
/* ---------------------------------------------------------------------- */
mwl-calendar-month-view .cal-in-month,
mwl-calendar-month-view .cal-out-month {
  max-width: 14.2857143%;
  /* 7分之1 */
}

mwl-calendar-month-view .cal-month-view .cal-event-schedule {
  line-height: 1.5;
}

mwl-calendar-month-view .cal-month-view .cal-event-schedule ol,
mwl-calendar-month-view .cal-month-view .cal-event-schedule ul {
  list-style-type: none;
  padding-left: 6px;
  margin-bottom: 2px;
  font-size: 13px;
  width: 100%;
  max-width: 100%;
}

mwl-calendar-month-view .cal-month-view .cal-event-schedule ol li,
mwl-calendar-month-view .cal-month-view .cal-event-schedule ul li {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

mwl-calendar-month-view .cal-month-view .cal-event-schedule-more .cal-event {
  display: none !important;
}

mwl-calendar-month-view .cal-month-view .cal-event-schedule-more .cal-event-title {
  color: #333;
  cursor: default;
  padding-bottom: 2px;
  line-height: 1.5;
}

mwl-calendar-month-view .cal-month-view small.ng-star-inserted {
  margin: 0 !important;
  margin-top: 6px !important;
  padding: 6px;
  padding-left: 10px;
  background: #dedede;
  color: #3c3c3c;
  position: relative;
  font-size: 13px;
  width: 100%;
}

mwl-calendar-month-view .cal-month-view small.ng-star-inserted:before {
  content: "\f107";
  font-family: 'FontAwesome';
  position: absolute;
  top: 6px;
  right: 10px;
  font-size: 15px;
}

mwl-calendar-month-view .cal-month-view .cal-open small.ng-star-inserted:before {
  content: "\f106";
  top: 4px;
}

mwl-calendar-month-view .cal-month-view .cal-open-day-events li {
  list-style: none;
}

[class*="calendar-icon-"] {
  margin-right: 6px;
  display: inline-block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  text-align: center;
  vertical-align: middle;
  line-height: 18px;
  background: #787878;
  position: relative;
  top: -1px;
}

[class*="calendar-icon-"] i {
  font-size: 12px;
  color: #fff;
  position: relative;
  top: 2px;
}

.calendar-icon-phone {
  background: #03a691;
}

.calendar-icon-phone i {
  top: 0px;
}

.calendar-icon-home {
  background: #ff6a6a;
}

.calendar-icon-home i {
  font-size: 13px;
}

.calendar-icon-mail {
  background: #4e88c9;
}

.calendar-icon-mail i {
  font-size: 13px;
}

.calendar-icon-commenting {
  background: #0cb704;
}

.calendar-icon-commenting i {
  top: -1px;
}

.calendar-icon-money {
  background: #fe7f0e;
}

.calendar-icon-money i {
  font-size: 14px;
}

mwl-calendar-week-view .cal-week-view .cal-event {
  color: #333333;
  font-size: 13px;
}

mwl-calendar-day-view .cal-day-view .cal-event {
  color: #333333;
  font-size: 13px;
}

/* ---------------------------------------------------------------------- */
/*  calendar
/* ---------------------------------------------------------------------- */
mwl-calendar-month-view .cal-month-view .cal-header {
  border: 1px solid #e1e1e1;
  border-bottom: none;
}

mwl-calendar-month-view .cal-month-view .cal-header .cal-cell:not(:last-child) {
  border-right: 1px solid #e1e1e1;
}

mwl-calendar-month-view .cal-month-view .cal-header .cal-weekend {
  color: #d13030;
}

mwl-calendar-month-view .cal-month-view .cal-day-number {
  text-align: right;
  font-size: 13px;
  color: #000;
  opacity: 0.8;
  margin-top: 10px;
  margin-right: 10px;
  margin-bottom: 4px;
}

mwl-calendar-month-view .cal-month-view .cal-day-cell.cal-today .cal-day-number {
  font-size: 16px;
  font-weight: bold;
}

mwl-calendar-month-view .cal-month-view .cal-day-cell.cal-out-month .cal-day-number {
  opacity: 0.25;
}

mwl-calendar-month-view .cal-month-view .cal-day-cell.cal-weekend .cal-day-number {
  color: #d13030;
}

mwl-calendar-month-view .cal-month-view .cal-open-day-events {
  background: #dedede;
  -webkit-box-shadow: inset 0 0 15px 0 rgba(0, 0, 0, 0.12);
  box-shadow: inset 0 0 15px 0 rgba(0, 0, 0, 0.12);
}

mwl-calendar-month-view .cal-month-view .cal-weekend {
  background: rgba(209, 48, 48, 0.04);
}

mwl-calendar-month-view .cal-month-view .cal-events {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

mwl-calendar-month-view .cal-month-view .cal-event {
  color: #fff;
  width: 42px;
  height: 42px;
  line-height: 38px;
  text-align: center;
  vertical-align: middle;
  /* border-radius: 4px; */
  font-size: 20px;
  font-weight: bold !important;
  font-family: "Microsoft Yahei" !important;
}

@media (min-width: 1200px) {

  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(7),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(8),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(9),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(10) {
    display: none;
  }
}

@media (max-width: 1199px) {

  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(5),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(6),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(7),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(8),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(9),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(10) {
    display: none;
  }
}

@media (max-width: 767px) {

  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(3),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(4),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(5),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(6),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(7),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(8),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(9),
  mwl-calendar-month-view .cal-month-view .cal-event:nth-child(10) {
    display: none;
  }
}

mwl-calendar-month-view .cal-month-view .cal-event small {
  margin: 5px;
}

mwl-calendar-month-view .cal-month-view .icon-sale:before {
  content: "銷";
}

mwl-calendar-month-view .cal-month-view .icon-purchase:before {
  content: "進";
}

mwl-calendar-month-view .cal-month-view .icon-receipt:before {
  content: "收";
}

mwl-calendar-month-view .cal-month-view .icon-pay:before {
  content: "付";
}

mwl-calendar-month-view .cal-month-view .icon-ticket:before {
  content: "票";
}

mwl-calendar-month-view .cal-month-view .icon-invoicing:before {
  content: "票";
}

mwl-calendar-month-view .cal-month-view [class*="icon-"]:before {
  font-weight: bold !important;
  font-family: "Microsoft Yahei" !important;
}

mwl-calendar-month-view .cal-month-view .cal-open-day-events {
  /*
  .cal-event{ width:10px;height: 10px;line-height: 10px;}
  [class*="icon-"]:before{display: none;}
  */
}

mwl-calendar-month-view .cal-month-view .cal-open-day-events .cal-event {
  display: inline-block;
  margin: 5px 2px;
}

.calendar-detail-wrap {
  padding-top: 10px;
  border-top: 1px solid #e6e6e6;
  /*---------瀑布流排版----------*/
}

.calendar-detail-wrap .item {
  position: relative;
  background-color: #fff;
  border: 1px solid #dcdcdc;
  box-shadow: 1px 1px 3px 0px #eaeaea;
  border-left: 8px solid;
  padding: 10px 10px 0 !important;
  margin: 0 4px 10px;
}

.calendar-detail-wrap .item:before {
  content: '';
  display: block;
  position: absolute;
  z-index: 2;
  right: -4px;
  bottom: -4px;
  width: 20px;
  height: 20px;
  background: linear-gradient(135deg, #ffffff 30%, #f1f1f1 44%, #d0d0d0 45%, #eaeaea 50%, #ffffff 61%);
  box-shadow: -1px -1px 0px 1px #e5e5e5;
}

.calendar-detail-wrap .item a {
  text-decoration: underline !important;
  color: #333333 !important;
}

.calendar-detail-wrap .item a:hover {
  color: #0ea75c !important;
}

.calendar-detail-wrap .title {
  font-size: 2em;
  line-height: 1;
}

.calendar-detail-wrap .title i {
  font-size: 140%;
  margin-right: 5px;
}

.calendar-detail-wrap .table-wrap {
  overflow: hidden;
  max-height: 190px;
}

.calendar-detail-wrap .table th {
  text-align: left;
  font-weight: bold;
  border: none !important;
  padding: 4px 8px;
}

.calendar-detail-wrap .table th:nth-child(1) {
  width: 50%;
}

.calendar-detail-wrap .table th:nth-child(2) {
  width: 30%;
}

.calendar-detail-wrap .table th:nth-child(3) {
  width: 20%;
}

.calendar-detail-wrap .table td {
  border: none !important;
  white-space: nowrap;
}

.calendar-detail-wrap .item-sale {
  border-left-color: #f22522;
}

.calendar-detail-wrap .item-sale .title {
  color: #f22522;
}

.calendar-detail-wrap .item-sale .table th {
  background: rgba(242, 37, 34, 0.1);
  color: #f22522;
}

.calendar-detail-wrap .item-sale a:hover {
  color: #f22522 !important;
}

.calendar-detail-wrap .item-purchase {
  border-left-color: #5292cf;
}

.calendar-detail-wrap .item-purchase .title {
  color: #5292cf;
}

.calendar-detail-wrap .item-purchase .table th {
  background: rgba(82, 146, 207, 0.1);
  color: #5292cf;
}

.calendar-detail-wrap .item-purchase a:hover {
  color: #5292cf !important;
}

.calendar-detail-wrap .item-receipt {
  border-left-color: #ec9b00;
}

.calendar-detail-wrap .item-receipt .title {
  color: #ec9b00;
}

.calendar-detail-wrap .item-receipt .table th {
  background: rgba(236, 155, 0, 0.1);
  color: #ec9b00;
}

.calendar-detail-wrap .item-receipt a:hover {
  color: #ec9b00 !important;
}

.calendar-detail-wrap .item-pay {
  border-left-color: #5ba62e;
}

.calendar-detail-wrap .item-pay .title {
  color: #5ba62e;
}

.calendar-detail-wrap .item-pay .table th {
  background: rgba(91, 166, 46, 0.1);
  color: #5ba62e;
}

.calendar-detail-wrap .item-pay a:hover {
  color: #5ba62e !important;
}

.calendar-detail-wrap .item-ticket {
  border-left-color: #e7690a;
}

.calendar-detail-wrap .item-ticket .title {
  color: #e7690a;
}

.calendar-detail-wrap .item-ticket .table th {
  background: rgba(231, 105, 10, 0.1);
  color: #e7690a;
}

.calendar-detail-wrap .item-ticket a:hover {
  color: #e7690a !important;
}

.calendar-detail-wrap .item-invoicing {
  border-left-color: #b579db;
}

.calendar-detail-wrap .item-invoicing .title {
  color: #b579db;
}

.calendar-detail-wrap .item-invoicing .table th {
  background: rgba(181, 121, 219, 0.1);
  color: #b579db;
}

.calendar-detail-wrap .item-invoicing a:hover {
  color: #b579db !important;
}

.calendar-detail-wrap .masonry {
  column-count: 1;
  column-gap: 0;
}

@media (min-width: 768px) {
  .calendar-detail-wrap .masonry {
    column-count: 2;
  }
}

.calendar-detail-wrap .masonry .item {
  break-inside: avoid;
}

canvas {
  max-width: 100% !important;
  height: auto !important;
}

.hr-y {
  margin-left: 20px;
  margin-right: 20px;
  border: 0;
  border-left: 1px solid #e6e6e6;
  height: 100%;
  display: block;
}

.hr-y-short {
  margin-top: 10px;
  margin-bottom: 10px;
}

hr.line {
  margin-top: 10px;
  margin-bottom: 10px;
  border-top: 1px solid #e0e0e0;
}

.personal-info {
  display: flex;
  align-items: center;
  justify-content: center;
}

.personal-info .pic {
  color: #f9ceab;
  font-size: 66px;
}

.personal-info .text {
  font-size: 26px;
  margin-left: 10px;
}

.modal .project-main-container {
  position: static;
}

.page-fadeIn {
  -webkit-animation: fadeIn .6s both;
  animation: fadeIn .6s both;
}

.project-main-container {
  width: 100%;
  position: relative;
  z-index: 192;
  -webkit-animation: fadeIn .6s both;
  animation: fadeIn .6s both;
}

.project-main-container .project-panel {
  background: #fff;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  margin-left: 10px;
  -moz-box-shadow: 0 1px 2px #C3C3C3;
  -webkit-box-shadow: 0 1px 2px #C3C3C3;
  box-shadow: 0 1px 2px #C3C3C3;
  position: relative;
  margin-bottom: 10px;
  padding: 18px 15px 4px;
}

@media (max-width: 767px) {
  .project-main-container .project-panel {
    padding: 10px;
    margin-left: 0;
  }
}

.project-main-container .project-content {
  width: 100%;
  margin: 0 auto;
  padding-bottom: 10px;
}

.project-main-container .control-label {
  max-width: 120px;
  max-height: 38px;
  min-height: 38px;
}

.project-main-container .control-label.w60 {
  max-width: 60px;
}

.project-main-container .control-label.w80 {
  max-width: 80px;
}

.project-main-container .control-label.w100 {
  max-width: 100px;
}

@media (max-width: 767px) {
  .project-main-container .control-label {
    min-height: 20px;
  }
}

.project-main-container .control-label-width-min {
  min-width: 120px;
}

.project-main-container textarea.form-control {
  min-height: 70px;
}

.project-main-container .row,
.project-main-container .form-horizontal .form-group {
  margin-left: 0 !important;
  margin-right: 0 !important;
  min-height: 42px;
}

.project-main-container .height-auto,
.project-main-container .height-auto .row {
  min-height: 0;
  height: auto;
}

.project-main-container .col-lg-1,
.project-main-container .col-lg-10,
.project-main-container .col-lg-11,
.project-main-container .col-lg-12,
.project-main-container .col-lg-2,
.project-main-container .col-lg-3,
.project-main-container .col-lg-4,
.project-main-container .col-lg-5,
.project-main-container .col-lg-6,
.project-main-container .col-lg-7,
.project-main-container .col-lg-8,
.project-main-container .col-lg-9,
.project-main-container .col-md-1,
.project-main-container .col-md-10,
.project-main-container .col-md-11,
.project-main-container .col-md-12,
.project-main-container .col-md-2,
.project-main-container .col-md-3,
.project-main-container .col-md-4,
.project-main-container .col-md-5,
.project-main-container .col-md-6,
.project-main-container .col-md-7,
.project-main-container .col-md-8,
.project-main-container .col-md-9,
.project-main-container .col-sm-1,
.project-main-container .col-sm-10,
.project-main-container .col-sm-11,
.project-main-container .col-sm-12,
.project-main-container .col-sm-2,
.project-main-container .col-sm-3,
.project-main-container .col-sm-4,
.project-main-container .col-sm-5,
.project-main-container .col-sm-6,
.project-main-container .col-sm-7,
.project-main-container .col-sm-8,
.project-main-container .col-sm-9,
.project-main-container .col-xs-1,
.project-main-container .col-xs-10,
.project-main-container .col-xs-11,
.project-main-container .col-xs-12,
.project-main-container .col-xs-2,
.project-main-container .col-xs-3,
.project-main-container .col-xs-4,
.project-main-container .col-xs-5,
.project-main-container .col-xs-6,
.project-main-container .col-xs-7,
.project-main-container .col-xs-8,
.project-main-container .col-xs-9 {
  padding-left: 4px;
  padding-right: 4px;
  padding-bottom: 4px;
}

.index-grid-countResult .project-panel:first-child {
  margin-bottom: 5px;
}

.index-grid-countResult .project-panel:first-child .project-content {
  padding-bottom: 0;
}

.index-grid-countResult .project-panel:nth-child(2) {
  padding-top: 4px;
}

.index-grid-countResult .project-panel:nth-child(2) .project-content {
  padding-bottom: 0;
}

/*------4欄的control-label 寬------*/
.project-4col .control-label {
  max-width: 76px;
  font-size: 14px;
  letter-spacing: -1px;
}

.mainContent-footer-btns {
  text-align: center;
  margin: 20px auto;
}

.mainContent-footer-btns .btn,
.mainContent-footer-btns .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .mainContent-footer-btns .ag-paging-button {
  margin: 2px 0;
}

/* 蝦皮列印提示 */
.mainContent-footer-btns.shopee-nonship-footer-btns {
  margin: 50px auto 20px;
}

.mainContent-footer-btns .print-hint:before {
  content: "4/18後停用";
  position: absolute;
  top: -40px;
  width: 100%;
  padding: 5px 0;
  border-radius: 3px;
  left: 0;
  color: #fff;
  background-color: #ffb141;
}

.mainContent-footer-btns .print-hint:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -12px !important;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 10px solid #ffb141;
}

.print-hint.new-print:before {
  content: '更快更穩';
}

@media (max-width: 400px) {

  .mainContent-footer-btns.shopee-nonship-footer-btns {
    margin: 20px auto;
  }

  .mainContent-footer-btns .print-hint:before {
    content: none !important;
  }

  .mainContent-footer-btns .print-hint:after {
    content: none !important;
  }

}

.address-input .county {
  max-width: 100px;
  min-width: 100px;
}

.address-input .town {
  max-width: 130px;
  min-width: 130px;
}

.address-input .code {
  max-width: 80px;
  min-width: 80px;
}

@media (max-width: 767px) {
  .address-input .flex-col {
    margin-bottom: 14px;
  }
}

.th-remark {
  min-width: 300px;
  display: block;
}

.noContent-remind {
  height: calc(100vh - 276px);
  min-height: 200px;
}

@media (max-width: 1199px) {
  .noContent-remind {
    height: calc(100vh - 340px);
  }
}

@media (max-width: 767px) {
  .noContent-remind {
    height: 34vh;
  }
}

.noContent-remind .pic {
  display: block;
  max-width: 120px;
  margin: 0 auto 8px;
}

.noContent-remind .pic img {
  max-width: 100%;
}

.noContent-remind p {
  font-size: 26.6px;
  color: #b3b3b3;
  display: block;
  margin: 0;
}

.noContent-remind p i {
  margin-right: 10px;
  color: #cccccc;
}

.noContent-remind p:before {
  display: block;
  position: relative;
  bottom: -5px;
}

.noContent-remind p.add-search:before {
  content: url(https://a1cdnpoint2.azureedge.net/images/add-search-icon.gif);
}

.noContent-remind p.search:before {
  content: url(https://a1cdnpoint2.azureedge.net/images/search-icon.gif);
}

/*-------下拉產品列表------*/
.dropdown-product-list {
  padding: 15px;
  width: 330px;
  letter-spacing: -5px;
  text-align-last: auto;
  /*
    @media (max-width: $screen-xs-max) {

      width: 235px;
    }
   */
}

.dropdown-product-list a {
  padding: 5px;
  padding-top: 2px;
  border: 1px solid transparent;
  width: 90px !important;
  height: 90px !important;
  display: inline-block;
  letter-spacing: 1px;
  margin: 0;
  text-align: center;
  vertical-align: top;
}

.dropdown-product-list a:hover,
.dropdown-product-list a:active,
.dropdown-product-list a:focus {
  border: 1px solid #e6e6e6;
  background: whitesmoke;
}

.dropdown-product-list a img {
  width: 68px;
  height: auto;
}

.dropdown-product-list a p {
  font-size: 12px;
  line-height: 1.5;
  letter-spacing: 0;
  color: #333333;
  letter-spacing: 0;
  margin-bottom: 0;
  margin-top: -5px;
}

.ui-grid-contents-wrapper .ui-grid-cell-focus {
  background-color: #fff;
  border: 1px solid #0eab5f;
}

.ngscroll-scrollbar-container {
  width: 8px !important;
}

.ngscroll-scrollbar-container .ngscroll-scrollbar {
  right: 0 !important;
}

@media (max-width: 1199px) {
  .ngscroll-scrollbar-container {
    display: none;
  }
}

#toast-container {
  width: 100% !important;
  height: 100% !important;
  background: rgba(255, 255, 255, 0);
  top: 0;
  left: 0;
  right: 0;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  text-align: center;
}

.toast-top-right {
  top: 0;
  right: 0;
}

#toast-container .toast {
  opacity: 1;
}

.toast-success {
  background-color: #0c8f4f !important;
}

.toast-warning {
  background-color: #DD5A82 !important;
}

.progress-wrap {
  height: 260px;
  padding-top: 80px;
  max-width: 620px;
  width: 100%;
}



/* .popover.ng-isolate-scope[uib-popover-html-popup][placement="right"]{margin-top: -35px;}  */
.export-excel {
  cursor: pointer;
}

.content-link-list {
  max-width: 1280px;
  margin: 0 auto;
  padding-bottom: 80px;
  position: relative;
  margin-bottom: 20px;
}

.content-link-list.bg-style2 {
  padding-bottom: 40px;
}

.content-link-list.bg-style2:before {
  background: #fff;
}

.content-link-list:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 408px;
  height: 192px;
  opacity: .6;
  background: url("https://a1cdnpoint2.azureedge.net/images/common/report-illustration.png") no-repeat;
}

/* 調整會計報表背景位置 */
.project-main-container.accounting-report .content-link-list:before {
  left: unset;
  right: 0;
}

@media (max-width: 767px) {
  .content-link-list {
    padding-bottom: 180px;
  }

  .content-link-list:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 96%;
    height: 0;
    padding-bottom: 46%;
    opacity: 1;
    background: url("https://a1cdnpoint2.azureedge.net/images/common/report-illustration.png") no-repeat;
    background-size: 100%;
  }
}

.content-link-list .item {
  padding: 5px 15px 16px;
}

.content-link-list .title {
  font-size: 2em;
  font-weight: bold;
  color: #fc9424;
  position: relative;
  z-index: 0;
  margin-bottom: 20px;
  background: #fff;
}

.content-link-list .title:before {
  content: "";
  width: 100%;
  height: 100%;
  left: 0;
  bottom: 0;
  position: absolute;
  background: #fff;
  z-index: -1;
}

.content-link-list .title:after {
  content: "";
  width: 100%;
  height: 24px;
  position: absolute;
  left: 0;
  top: 80%;
  z-index: -2;
  border-radius: 30%;
  filter: blur(4px);
  background: linear-gradient(to right, rgba(200, 200, 200, 0) 0%, rgba(200, 200, 200, 0.4) 4%, rgba(200, 200, 200, 0.4) 96%, rgba(200, 200, 200, 0) 100%);
}

.content-link-list .title .iconBig {
  font-size: 1.8em;
  margin-right: 10px;
  font-weight: normal;
  padding-left: 0px;
}

.content-link-list .sub-title {
  font-size: 18px;
  color: #0c8f4f;
  padding-left: 6px;
  font-weight: bold;
  margin: 6px 0;
}

.content-link-list .sub-title i {
  margin-right: 10px;
  font-size: 30px;
  font-weight: normal;
  position: relative;
  top: -2px;
  height: 40px;
  line-height: 40px;
  vertical-align: middle;
}

.content-link-list .sub-title i.iconRevise {
  margin-right: 4px;
}

.content-link-list .sub-title i.iconRevise:before {
  font-size: 36px;
}

.content-link-list .list {
  padding: 0;
  margin: 0;
  width: calc(100% - 30px);
  margin-left: 30px;
  position: relative;
}

.content-link-list .list:before {
  display: none !important;
}

.content-link-list .list a {
  width: 100%;
  max-width: 230px;
  display: block;
  margin: 3px 0;
  padding: 5px 10px;
  position: relative;
  border-radius: 4px;
  font-size: 16px;
  color: #333333;
  border: 1px solid transparent;
  transition: all .2s;
  -webkit-transition: all .2s;
}

.content-link-list.tax .list a {
  max-width: 240px;
}

.content-link-list.tax .list {
  width: calc(100% - 20px);
}

/* 20230223 報表按鈕移除hover箭頭 */

/* .content-link-list .list a:before {
  content: "\f105";
  font-family: 'FontAwesome';
  position: absolute;
  font-size: 16px;
  color: #0c8f4f;
  opacity: 0;
  right: 10px;
  top: 4px;
  transition: all .2s .06s;
  -webkit-transition: all .2s .06s;
} */

.content-link-list .list a:hover {
  background: #e9fdf3;
  border: 1px solid #32ee92;
  padding-left: 15px;
}

/* .content-link-list .list a:hover:before {
  opacity: 1;
  right: 6px;
} */

.contentTopSearch {
  width: 100%;
  margin-top: 0 !important;
}

.contentTopSearch:before,
.contentTopSearch:after {
  display: table;
  content: "";
  clear: both;
}

.contentTopSearch.bottom-line {
  border-bottom: 1px solid #e6e6e6;
  padding-bottom: 6px;
}

.contentTopSearch.tabs-bottom-line:after {
  bottom: 4px;
  z-index: 2;
}

@media (min-width: 768px) {
  .contentTopSearch>div:not(:first-child) {
    -webkit-flex: 1 auto;
    -ms-flex: 1 auto;
    flex: 1 auto;
  }
}

@media (max-width: 1320px) {
  .contentTopSearch .hidden-md {
    display: none;
  }
}

.contentTopSearch * {
  font-size: 13.5px !important;
}

.contentTopSearch .form-horizontal * {
  font-size: 15px !important;
}

.contentTopSearch>div,
.contentTopSearch .app-export-button>div,
.contentTopSearch .app-wrap>div {
  padding-left: 2px;
  padding-right: 2px;
}

.contentTopSearch>div:first-child {
  padding-left: 4px;
}

.contentTopSearch>div:last-child {
  padding-right: 4px;
}

@media (max-width: 767px) {
  .contentTopSearch {
    padding-left: 2px;
    padding-right: 2px;
  }

  .contentTopSearch>div {
    padding-left: 2px;
    padding-right: 2px;
  }

  .contentTopSearch>div:first-child {
    padding-left: 2px;
  }

  .contentTopSearch>div:last-child {
    padding-right: 2px;
  }
}

.contentTopSearch .contentTopSearch-select01 {
  max-width: 101px;
  min-width: 101px;
}

@media (max-width: 767px) {
  .contentTopSearch .contentTopSearch-select01 {
    max-width: 101px !important;
  }
}

@media (max-width: 767px) {
  .contentTopSearch .select-xs {
    max-width: 101px !important;
  }
}

.contentTopSearch .contentTopSearch-select02 {
  max-width: 101px;
  min-width: 101px;
}

.contentTopSearch .contentTopSearch-select-small {
  max-width: 86px;
  min-width: 86px;
}

.contentTopSearch .contentTopSearch-select-lg {
  max-width: 140px;
  min-width: 140px;
}

.contentTopSearch .contentTopSearch-date-single {
  max-width: 129px;
  min-width: 129px;
}

.contentTopSearch .contentTopSearch-date {
  max-width: 270px;
  min-width: 270px;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
}

.contentTopSearch .contentTopSearch-date>div {
  padding-left: 2px;
  padding-right: 2px;
}

@media (max-width: 767px) {
  .contentTopSearch .contentTopSearch-date {
    min-width: 200px;
    padding-left: 0px;
    padding-right: 0px;
  }

  .contentTopSearch .contentTopSearch-date>div {
    padding-left: 2px;
    padding-right: 2px;
  }
}

.contentTopSearch .contentTopSearch-name {
  max-width: 230px;
  min-width: 230px;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 0;
}

.contentTopSearch .contentTopSearch-name>div {
  padding-left: 2px;
  padding-right: 2px;
}

@media (max-width: 767px) {
  .contentTopSearch .contentTopSearch-name {
    min-width: 200px;
    padding-left: 0px;
    padding-right: 0px;
  }

  .contentTopSearch .contentTopSearch-name>div {
    padding-left: 2px;
    padding-right: 2px;
  }
}

.contentTopSearch .contentTopSearch-name-single {
  max-width: 105px;
  min-width: 105px;
}

.contentTopSearch .contentTopSearch-content {
  max-width: 180px;
  min-width: 130px;
}

.contentTopSearch .contentTopSearch-content-small {
  max-width: 138px;
  min-width: 100px;
}

.contentTopSearch.contentTopSearch-short * {
  font-size: 13.2px !important;
}

.contentTopSearch.contentTopSearch-short .form-horizontal * {
  font-size: 15px !important;
}

.contentTopSearch.contentTopSearch-short .contentTopSearch-select02 {
  max-width: 84px;
  min-width: 84px;
}

.contentTopSearch.contentTopSearch-short .contentTopSearch-content {
  max-width: 120px;
  min-width: 100px;
}

.contentTopSearch .contentTopSearch-text {
  position: relative;
  vertical-align: middle;
  text-align: right;
  line-height: 30px;
}

@media (max-width: 991px) {
  .contentTopSearch .contentTopSearch-text.flex-col-sm-12 {
    text-align: left;
    -webkit-flex: 1 100%;
    -ms-flex: 1 100%;
    flex: 1 100%;
  }
}

@media (max-width: 1199px) {
  .contentTopSearch .contentTopSearch-text.flex-col-md-12 {
    text-align: left;
    -webkit-flex: 1 100%;
    -ms-flex: 1 100%;
    flex: 1 100%;
  }
}

@media (max-width: 767px) {
  .contentTopSearch .contentTopSearch-text {
    text-align: left;
  }
}

.contentTopSearch .text-symbol {
  padding-left: 14px;
}

.contentTopSearch .text-symbol .symbol:before {
  top: 5px;
}

.contentTopSearch .contentTopSearch-tool {
  letter-spacing: -5px;
  white-space: nowrap;
  -webkit-flex: none !important;
  -ms-flex: none !important;
  flex: none !important;
}

.contentTopSearch .contentTopSearch-tool>button {
  margin-right: 4px;
  margin-bottom: 4px;
}

.contentTopSearch .contentTopSearch-tool>button:last-child {
  margin-right: 0;
}

.contentTopSearch .contentTopSearch-tool>* {
  letter-spacing: 0px;
}

@media (max-width: 767px) {
  .contentTopSearch .contentTopSearch-tool {
    white-space: normal;
  }
}

.contentTopSearch .contentTopSearch-btn,
.contentTopSearch .contentTopSearch-btn2,
.contentTopSearch .contentTopSearch-btn3,
.contentTopSearch .contentTopSearch-btn4,
.contentTopSearch .contentTopSearch-btn5 {
  -webkit-flex: none !important;
  -ms-flex: none !important;
  flex: none !important;
}

.contentTopSearch .contentTopSearch-tabs {
  padding-left: 0 !important;
  padding-right: 10px !important;
}

@media (min-width: 767px) {
  .contentTopSearch .contentTopSearch-tabs {
    -webkit-flex: none !important;
    -ms-flex: none !important;
    flex: none !important;
  }
}

@media (max-width: 767px) {
  .contentTopSearch .contentTopSearch-tabs {
    margin-top: 8px;
    -webkit-order: 1;
    -ms-flex-order: 1;
    -webkit-box-ordinal-group: 2;
    order: 1;
  }
}

.contentTopSearch .contentTopSearch-radio {
  padding-top: 10px;
  flex: none !important;
  -webkit-flex: none !important;
  -ms-flex: none !important;
  /* margin-left: auto; */
}

@media (max-width: 767px) {
  .contentTopSearch .contentTopSearch-radio {
    margin-left: 0;
  }
}

.contentTopSearch .contentTopSearch-checkbox {
  flex: none !important;
  -webkit-flex: none !important;
  -ms-flex: none !important;
  /* margin-left: auto; */
}

@media (max-width: 767px) {
  .contentTopSearch .contentTopSearch-checkbox {
    margin-left: 0;
  }
}

.contentTopSearch .flex-none,
.contentTopSearch .countResult.receipt-result .receipt-item label,
.countResult.receipt-result .receipt-item .contentTopSearch label {
  -webkit-flex: none !important;
  -ms-flex: none !important;
  flex: none !important;
}

@media (max-width: 991px) and (min-width: 768px) {
  .contentTopSearch>div.flex-col-sm-6 {
    -webkit-flex: 1 50%;
    -ms-flex: 1 50%;
    flex: 1 50%;
  }
}

@media (min-width: 992px) {
  .contentTopSearch>div.flex-col-md-4 {
    -webkit-flex: 1 33.33333333%;
    -ms-flex: 1 33.33333333%;
    flex: 1 33.33333333%;
  }
}

@media (min-width: 767px) {
  .contentTopBtns {
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    -webkit-box-pack: end;
    justify-content: flex-end;
    text-align: end;
  }
}

.contentTopBtns>button {
  margin-right: 4px;
  margin-bottom: 4px;
}

.contentTopBtns>button:last-child {
  margin-right: 0;
}

.countResult *:not(.help-block) {
  font-size: 13.7px;
}

.countResult .help-block * {
  font-size: 10px;
}

.countResult label {
  text-align: right;
  max-width: 85px;
  min-width: 85px;
  font-weight: bold;
  white-space: nowrap;
}

@media (max-width: 767px) {
  .countResult label {
    max-width: 90px !important;
    min-width: 90px !important;
  }
}

.countResult .countResult-amount,
.countResult .countResult-sum,
.countResult .countResult-input {
  -webkit-flex-flow: row nowrap;
  -ms-flex-flow: row nowrap;
  flex-flow: row nowrap;
}

@media (max-width: 767px) {
  .countResult .xs-w120 {
    max-width: 120px !important;
    min-width: 120px !important;
  }
}

.countResult label,
.countResult .number {
  padding-top: 6px;
}

.countResult .item {
  margin-right: 14px;
  display: inline-block;
}

.countResult input[type="text"] {
  min-width: 60px;
}

@media (min-width: 1200px) {
  .countResult .countResult-btn {
    max-width: none;
  }
}

@media (min-width: 1200px) {
  .countResult {
    /*.countResult-amount ,.countResult-btn*/
  }

  .countResult .countResult-btn {
    min-width: 66px !important;
  }

  .countResult>div:first-child {
    -webkit-flex: 1 !important;
    -ms-flex: 1 !important;
    flex: 1 !important;
  }

  .countResult>div:first-child.first-child-col-none {
    -webkit-flex: none !important;
    -ms-flex: none !important;
    flex: none !important;
  }

  .countResult>div {
    min-width: 192px;
    -webkit-flex: none !important;
    -ms-flex: none !important;
    flex: none !important;
  }

  .countResult>div input[type="text"] {
    max-width: 160px;
  }
}

@media (min-width: 1200px) {
  .countResult.countResult-col-6 label {
    max-width: 70px;
    min-width: 70px;
  }

  .countResult.countResult-col-6>div {
    min-width: 166px;
  }

  .countResult.countResult-col-6>div input[type="text"] {
    max-width: 120px;
  }

  .countResult.countResult-col-6>div .flex-col-xs {
    padding-right: 0px;
    padding-left: 0px;
  }
}

@media (min-width: 1200px) {
  .countResult.countResult-col-6-flex>div {
    -webkit-flex: 1 !important;
    -ms-flex: 1 !important;
    flex: 1 !important;
  }
}

.countResult.label-wide *:not(.help-block) {
  font-size: 13.6px;
  letter-spacing: -.5px;
}

.countResult.label-wide label {
  max-width: 90px;
  min-width: 90px;
}

.countResult.label-wide>div {
  min-width: 186px;
}

@media (min-width: 1200px) {
  .countResult.label-wide label {
    max-width: 90px;
    min-width: 90px;
  }
}

@media (max-width: 767px) {
  .countResult.label-wide label {
    max-width: 90px !important;
    min-width: 90px !important;
  }
}

.countResult.receipt-result {
  padding-bottom: 0;
}

@media (min-width: 1200px) {
  .countResult.receipt-result>div {
    min-width: 100px;
  }
}

.countResult.receipt-result .receipt-item {
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  margin-bottom: 10px;
  padding-right: 10px;
}

@media (min-width: 1200px) {
  .countResult.receipt-result .receipt-item:last-child {
    padding-right: 0;
  }
}

@media (max-width: 767px) {
  .countResult.receipt-result .receipt-item {
    padding-right: 0;
  }
}

.countResult.receipt-result .receipt-item [class*="flex-col"] {
  padding: 5px 8px;
}

.countResult.receipt-result .receipt-item label {
  color: #fff;
  margin-bottom: 0;
  padding-left: 10px;
  padding-right: 10px;
}

@media (min-width: 991px) {
  .countResult.receipt-result .receipt-item label {
    max-width: none;
    min-width: 0;
  }
}

.countResult.receipt-result .receipt-item .number {
  background: #f0f0f0;
}

.countResult.receipt-result .receipt-item .item {
  margin-right: 0;
  margin-left: 0;
  padding-right: 10px;
  padding-left: 6px;
}

.countResult.receipt-result .receipt-item .item:first-child {
  padding-left: 0;
}

.countResult.receipt-result .receipt-item .item:last-child {
  padding-right: 0;
}

.countResult.receipt-result .receipt-item .item:not(:last-child) {
  border-right: 1px solid #cccccc;
}

.countResult.receipt-result .receipt-item:nth-of-type(1) label {
  background: #4cbce6;
}

.countResult.receipt-result .receipt-item:nth-of-type(2) label {
  background: #ee9444;
}

.countResult.receipt-result .receipt-item:nth-of-type(3) label {
  background: #40b47b;
}

.countResult.receipt-result .receipt-item:nth-of-type(4) label {
  background: #ff96a2;
}

.countResult.receipt-result .receipt-item:nth-of-type(5) label {
  background: #ab8979;
}

.countResult.receipt-result .receipt-item:nth-of-type(6) label {
  background: #979bb9;
}

.countResult-text>div {
  display: inline-block;
  margin-right: 40px;
}

.countResult-text>div:last-child {
  margin-right: 0;
}

.countResult-text>div label {
  padding: 3px 2px;
}

.countResult-text>div span {
  padding: 3px 0;
}

.order-amount {
  letter-spacing: 2px;
  padding: .5em;
  background: #EEE;
  border: 1px solid #CDCDCD;
  margin: .3em 0;
}

.order-amount ul {
  text-align: right;
  white-space: nowrap;
  list-style: none;
  margin-bottom: 0;
}

.order-amount ul li {
  display: inline-block;
  text-align: right;
  white-space: nowrap;
  padding: 3px;
  padding-right: 10px;
}

.order-amount ul li:nth-child(2) {
  min-width: 100px;
}

@media (min-width: 1200px) {
  .countResult-col-currency label {
    max-width: 60px;
    min-width: 60px;
  }

  .countResult-col-currency div:first-child {
    -webkit-flex: none !important;
    -ms-flex: none !important;
    flex: none !important;
  }
}

.flex-seven .countResult-sum {
  min-width: unset !important;
}

@media (max-width: 992px) {
  .flex-seven .countResult-sum label {
    max-width: 100px !important;
    min-width: 100px !important;
  }
}

@media (min-width: 1200px) {
  .flex-seven .first-child-col-flex label {
    max-width: 70px;
    min-width: 70px;
  }
}

@media (min-width: 1200px) {
  .countResult.flex-seven>div input[type="text"] {
    max-width: 75px !important;
  }
}

@media (min-width: 1200px) {
  .countResult.flex-seven>div:first-child {
    -webkit-flex: unset !important;
    -ms-flex: unset !important;
    flex: unset !important;
  }
}

@media (min-width: 1200px) {
  .flex-seven-fee label.flex-col-xs {
    max-width: 70px;
    min-width: 70px;
  }
}

@media (min-width: 991px) and (max-width: 1200px) {
  .countResult-sum.flex-seven-sum {
    max-width: 173px;
  }

  .countResult-sum.flex-seven-sum .number {
    max-width: 200px !important;
  }
}

.invoicing-dashboard .number-larg {
  font-size: 28px;
  font-weight: bold;
  white-space: nowrap;
}

@media (min-width: 768px) and (max-width: 1440px) {
  .invoicing-dashboard .number-larg {
    font-size: 24px;
    padding: 3px 0;
  }
}

.invoicing-dashboard .number-extra-larg {
  font-size: 48px;
  font-weight: bold;
  white-space: nowrap;
}

@media (min-width: 768px) and (max-width: 1440px) {
  .invoicing-dashboard .number-extra-larg {
    font-size: 32px;
    padding: 8px 0;
  }
}

.accounting-dashboard .btn-switch {
  position: absolute;
  right: 10px;
  bottom: -1px;
}

.accounting-dashboard .btn-switch .btn,
.accounting-dashboard .btn-switch .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .accounting-dashboard .btn-switch .ag-paging-button {
  border-radius: 4px 4px 0 0;
  background-color: #f1acac;
  border: none;
  color: #333333;
}

.accounting-dashboard .btn-switch .btn:hover,
.accounting-dashboard .btn-switch .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .accounting-dashboard .btn-switch .ag-paging-button:hover,
.accounting-dashboard .btn-switch .btn:focus,
.accounting-dashboard .btn-switch .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:focus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .accounting-dashboard .btn-switch .ag-paging-button:focus,
.accounting-dashboard .btn-switch .btn:active,
.accounting-dashboard .btn-switch .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:active,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .accounting-dashboard .btn-switch .ag-paging-button:active {
  background-color: #f6cbcb;
}

.accounting-dashboard .btn-switch .btn.active,
.accounting-dashboard .btn-switch .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .active.ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .accounting-dashboard .btn-switch .active.ag-paging-button {
  background-color: #fff;
}

.accounting-dashboard .revenue-compare {
  padding: 10px 5px;
}

@media (max-width: 1199px) {
  .accounting-dashboard .revenue-compare .item {
    margin-bottom: 24px;
  }
}

.accounting-dashboard .revenue-compare .header {
  position: relative;
  padding-bottom: 6px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}

.accounting-dashboard .revenue-compare .header h5 {
  font-size: 20px;
  font-weight: bold;
  margin: 0;
}

.accounting-dashboard .revenue-compare .header .change {
  position: absolute;
  right: 0;
  font-size: 14px;
  display: block;
  bottom: 0;
}

.accounting-dashboard .revenue-compare .number {
  margin-top: 12px;
  font-weight: bold;
  position: relative;
}

.accounting-dashboard .revenue-compare .number .this-month {
  color: #e66b6b;
  font-size: 24px;
}

.accounting-dashboard .revenue-compare .number .last-month {
  color: #8c8c8c;
  position: absolute;
  right: 0;
  bottom: 2px;
}

.accounting-dashboard .revenue-compare .progress {
  height: 10px;
  background-color: #d9d9d9;
  box-shadow: none;
  margin-bottom: 0;
  margin: 4px 0;
}

.accounting-dashboard .revenue-compare .progress .progress-bar {
  background-color: #e66b6b;
}

.accounting-dashboard .revenue-compare .month {
  font-weight: bold;
}

.accounting-dashboard .revenue-compare .month .this-month {
  color: #e66b6b;
}

.accounting-dashboard .revenue-compare .month .last-month {
  color: #8c8c8c;
  float: right;
}

.accounting-dashboard .revenue-compare .text-blue {
  color: #1a9cbc;
}

.accounting-dashboard .annual-total {
  margin: 0 auto;
  width: 100%;
  font-size: 15px;
  table-layout: fixed;
}

.accounting-dashboard .annual-total tr:not(:last-child) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.14);
}

.accounting-dashboard .annual-total th,
.accounting-dashboard .annual-total td {
  padding: 8px 4px;
  white-space: nowrap;
  vertical-align: middle;
  line-height: 24px;
}

.accounting-dashboard .annual-total th {
  width: 50%;
}

.accounting-dashboard .annual-total th span {
  display: inline-block;
  max-width: 100%;
  text-overflow: ellipsis;
  overflow: hidden;
  vertical-align: middle;
}

.accounting-dashboard .annual-total td {
  font-weight: bold;
  text-align: right;
  padding-left: 15px;
}

.accounting-dashboard .annual-total i {
  width: 6px;
  height: 24px;
  display: inline-block;
  margin-right: 10px;
  vertical-align: middle;
  position: relative;
  top: -2px;
}

.accounting-dashboard .annual-total i.red {
  background: #e66b6b;
}

.accounting-dashboard .annual-total i.blue {
  background: #00869e;
}

.accounting-dashboard .annual-total i.yellow {
  background: #FFB848;
}

.accounting-dashboard .annual-total i.green {
  background: #1FBBA6;
}

.accounting-dashboard .annual-total i.pink {
  background: #e684a2;
}

.accounting-dashboard .annual-total i.grey {
  background: #b3b3b3;
}

/* ---------------------------------------------------------------------- */
/* Dropdown Menu
/* ---------------------------------------------------------------------- */
.dropup .dropdown-menu:after,
.dropup .dropdown-menu:before {
  display: none !important;
}

.dropdown-menu.box {
  padding: 5px !important;
}

.dropdown-menu.dropdown-dark {
  background-color: #43493b;
  border: 1px solid #1A1C1E;
  border-radius: 0;
  box-shadow: none;
  list-style: none outside none;
  max-width: 300px;
  min-width: 166px;
  padding: 0;
  position: absolute;
  text-shadow: none;
  z-index: 1000;
}

.dropdown-menu.dropdown-dark:after {
  border-color: transparent;
  border-style: solid;
  display: block;
  height: 0;
  position: absolute;
  width: 0;
  border-width: 10px;
  content: "";
  border-bottom-color: #43493b;
  border-top-width: 0;
  content: " ";
  top: -10px;
  left: 1px;
}

.dropdown-menu.dropdown-dark.pull-right:after {
  left: auto;
  right: 1px;
}

.dropdown-menu.dropdown-dark .dropdown-header {
  padding: 8px 8px 6px;
  color: #b3b3b3;
  font-size: 11px;
}

.dropdown-menu.dropdown-dark .divider {
  background: none;
}

.dropdown-menu.dropdown-dark li p,
.dropdown-menu.dropdown-dark li a,
.dropdown-menu.dropdown-dark .drop-down-wrapper li p,
.dropdown-menu.dropdown-dark .drop-down-wrapper li a {
  color: #EDEDED;
  border-bottom-color: #1A1C1E;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 300;
  margin: 0;
  padding: 8px 8px 6px;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  white-space: normal !important;
  display: block;
}

.dropdown-menu.dropdown-dark li:last-child a {
  border-bottom: none !important;
  border-radius: 0 0 6px 6px;
}

.dropdown-menu.dropdown-dark li:last-child a i {
  margin-right: 4px;
  width: 15px;
  text-align: center;
}

.dropdown-menu.dropdown-dark>li>a:hover,
.dropdown-menu.dropdown-dark>li>a:focus,
.dropdown-menu.dropdown-dark .dropdown-submenu:hover>a,
.dropdown-menu.dropdown-dark .dropdown-submenu:focus>a,
.dropdown-menu.dropdown-dark .drop-down-wrapper li a:hover,
.dropdown-menu.dropdown-dark .drop-down-wrapper li a:focus {
  background-color: #212326;
}

.dropdown-menu.dropdown-light {
  background-color: #FFFFFF;
  border: 1px solid rgba(17, 17, 17, 0.2);
  max-width: 300px;
  /* min-width: 80px; */
  border-radius: 0;
  padding: 0;
}

.dropdown-menu.dropdown-light:before,
.dropdown-menu.dropdown-light:after {
  border-color: transparent;
  border-style: solid;
  display: block;
  height: 0;
  position: absolute;
  width: 0;
}

.dropdown-menu.dropdown-light:before {
  border-bottom-color: rgba(17, 17, 17, 0.2);
  border-style: solid;
  display: block;
  height: 0;
  position: absolute;
  width: 0;
  border-width: 11px;
  content: "";
  border-top-width: 0;
  content: " ";
  top: -11px;
  left: 1px;
}

.dropdown-menu.dropdown-light:after {
  border-color: transparent;
  border-style: solid;
  display: block;
  height: 0;
  position: absolute;
  width: 0;
  border-width: 10px;
  content: "";
  border-bottom-color: #FFFFFF;
  border-top-width: 0;
  content: " ";
  top: -10px;
  left: 2px;
}

.dropdown-menu.dropdown-light.pull-right:after {
  left: auto;
  right: 2px;
}

.dropdown-menu.dropdown-light.pull-right:before {
  left: auto;
  right: 1px;
}

.dropdown-menu.dropdown-light li a {
  border-bottom: 1px solid #DDDDDD;
  /* font-size: 14px; */
}

.dropdown-menu li a {
  padding: 6px 12px;
  font-size: 14px;
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
}

.dropdown-menu li a i {
  margin-right: 3.5px;
  margin-top: 4px;
}

.dropdown-menu li a .badge {
  margin-left: auto;
}

.dropdown-menu li a .badge-new {
  transform: translateY(-2px) rotate(-6deg);
  color: #e66b6b;
  font-size: 13px;
  background: transparent;
  padding: 3px;
  padding-left: 6px;
}

.shopee-non .dropdown-menu.dropdown-light.pull-right:before {
  left: auto;
  right: 25px;
}

.shopee-non .dropdown-menu.dropdown-light.pull-right:after {
  left: auto;
  right: 26px;
}


.dropdown-menu.dropdown-light.fix-left {
  left: 0;
  right: auto;
  max-width: 310px;
}

.dropdown-menu.dropdown-light.pull-right.fix-left:before {
  left: 99px;
  right: auto;
}

.dropdown-menu.dropdown-light.pull-right.fix-left:after {
  left: 99px;
  right: auto;
}

.dropdown-menu.dropdown-light.fix-left a {
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  display: block;
}

.fix-dropdown-menu-2 .dropdown-item.dropdown-list label {
  max-width: 180px;
  text-emphasis: inherit;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}


@media (max-width: 767px) {
  .shopee-non {
    margin-top: 15px;
  }

  .dropdown-menu {
    /*------------手機版靠左對齊-------------*/
    /*------------手機版靠右對齊-------------*/
  }

  .dropdown-menu.pull-left-xs {
    left: 1px;
    right: auto;
  }

  .dropdown-menu.pull-left-xs:after {
    left: 2px !important;
    right: auto !important;
  }

  .dropdown-menu.pull-left-xs:before {
    left: 1px !important;
    right: auto !important;
  }

  .dropdown-menu.pull-right-xs {
    right: 1px;
    left: auto;
  }

  .dropdown-menu.pull-right-xs:after {
    left: auto !important;
    right: 2px !important;
  }

  .dropdown-menu.pull-right-xs:before {
    left: auto !important;
    right: 1px !important;
  }

  .dropdown-menu.four-dropdown.pull-left-xs {
    left: 1px;
    right: auto;
  }

  .dropdown-menu.four-dropdown.pull-left-xs:after {
    left: 29px !important;
    right: auto !important;
  }

  .dropdown-menu.four-dropdown.pull-left-xs:before {
    left: 28px !important;
    right: auto !important;
  }
}

.financialServices-intro {
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
}

.financialServices-intro .inner {
  padding: 0 20px 30px;
}

@media (max-width: 767px) {
  .financialServices-intro .inner {
    padding: 15px;
  }
}

.financialServices-intro .inner.gray {
  background: #f4f4f4;
  padding-top: 20px;
}

.financialServices-intro .inner.gray .title {
  color: #686868;
}

.financialServices-intro .inner.gray .step_icon .icon {
  color: #8c8c8c;
}

.financialServices-intro .inner.gray .step_point:after {
  background: #ababab;
}

.financialServices-intro .title-bar {
  margin-bottom: 10px;
}

.financialServices-intro .title-bar>* {
  display: inline-block;
}

@media (max-width: 767px) {
  .financialServices-intro .title-bar {
    margin-bottom: 0;
  }
}

.financialServices-intro .title-bar .title {
  margin-top: 0;
}

.financialServices-intro .title-bar .time {
  vertical-align: 3px;
  margin-left: 4px;
}

.financialServices-intro .time {
  background: #ffdcdc;
  padding: 4px 8px;
  border-radius: 30px;
}

.financialServices-intro .time i {
  color: #c24848;
  margin-right: 6px;
  font-size: 120%;
  vertical-align: -1px;
}

.financialServices-intro .financial-step {
  width: 100%;
  max-width: 1000px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: row;
}

.financialServices-intro .step_item {
  flex: 1;
  min-height: 56px;
  display: flex;
  align-items: center;
  flex-direction: column;
  position: relative;
  padding-top: 10px;
}

.financialServices-intro .step_item:last-child .step_point:before {
  display: none;
}

.financialServices-intro .step_icon {
  text-align: center;
  flex: none;
  width: 100%;
  height: auto;
  position: relative;
  padding: 0 10px;
  padding-bottom: 6px;
}

.financialServices-intro .step_icon .icon {
  line-height: 1;
  font-size: 4.4rem;
  color: #0c8f4f;
}

.financialServices-intro .step_icon .time {
  color: #c24848;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 2px auto auto auto;
  width: 70px;
  height: 26px;
  padding: 2px 4px;
  transform: translateX(60px);
}

.financialServices-intro .step_icon .time span {
  font-weight: bold;
}

.financialServices-intro .step_point {
  z-index: 2;
  text-align: center;
  flex: none;
  height: 20px;
  position: relative;
  width: 100%;
  color: #fff;
}

.financialServices-intro .step_point span {
  padding-top: 2px;
  display: block;
}

.financialServices-intro .step_point:before {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100%;
  height: 4px;
  background: #dedede;
  z-index: -2;
}

.financialServices-intro .step_point:after {
  content: "";
  display: block;
  position: absolute;
  left: 50%;
  top: -2px;
  margin-left: -13px;
  background: #10be69;
  z-index: -1;
  width: 26px;
  height: 26px;
  border-radius: 26px;
}

@media (min-width: 767px) {
  .financialServices-intro .step_point.begin:after {
    width: 60px;
    margin-left: -30px;
  }
}

.financialServices-intro .step_text {
  width: 100%;
  padding: 0 6px;
  padding-bottom: 8px;
  text-align: center;
}

@media (max-width: 767px) {
  .financialServices-intro .financial-step {
    flex-direction: column;
  }

  .financialServices-intro .step_item {
    flex-direction: row;
    padding-top: 0;
  }

  .financialServices-intro .step_icon {
    width: auto;
    flex: none;
    padding: 0 20px;
  }

  .financialServices-intro .step_icon .icon {
    font-size: 5rem;
  }

  .financialServices-intro .step_icon .time {
    margin: -16px auto auto auto;
    transform: translateX(100%);
  }

  .financialServices-intro .step_point {
    width: 15px;
    height: 130px;
    order: -1;
  }

  .financialServices-intro .step_point:before {
    left: 50%;
    top: 50%;
    bottom: -50%;
    width: 4px;
    height: 120%;
  }

  .financialServices-intro .step_point:after {
    left: 50%;
    top: 50%;
  }

  .financialServices-intro .step_point span {
    position: relative;
    top: calc(50% + 3px);
  }

  .financialServices-intro .step_point.begin span {
    font-size: 12px;
    padding-top: 2px;
  }

  .financialServices-intro .step_text {
    font-size: 18px;
    text-align: left;
    padding: 5px;
    padding-top: 15px;
  }
}

.financialServices-intro .intro {
  width: 100%;
  font-size: 16px;
}

.financialServices-intro .intro>* {
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 767px) {
  .financialServices-intro .intro {
    font-size: 10px;
  }
}

.financialServices-intro .intro .text {
  font-size: 1em;
  color: #0c8f4f;
  font-weight: bold;
  padding: 6px 30px;
  border: 1px solid #10be69;
  line-height: 1.1;
}

.financialServices-intro .intro .text span {
  font-size: 220%;
}

.financialServices-intro .intro .text p {
  margin: 0;
}

@media (min-width: 767px) {
  .financialServices-intro .intro .text {
    flex: none;
  }
}

@media (max-width: 767px) {
  .financialServices-intro .intro .text {
    font-size: 2.2em;
    padding: 15px 10px;
  }

  .financialServices-intro .intro .text span {
    font-size: 100%;
  }
}

.financialServices-intro .intro .content {
  font-size: 1.6em;
  color: #fff;
  background: #10be69;
  padding: 15px;
  font-weight: bold;
}

.form-group {
  margin-bottom: 4px;
}

.form-control {
  border: 1px solid #e6e6e6;
  color: #333333;
  padding: 4px 6px;
  height: 30px;
  /* height: 34px; */
  font-size: 15px;
}

/*-----改placeholder 字體顏色----*/
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #c7c7c7 !important;
}

input:-moz-placeholder,
textarea:-moz-placeholder {
  color: #c7c7c7 !important;
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: #c7c7c7 !important;
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #c7c7c7 !important;
}

/*---------- checkbox radio ----------*/
input[type="checkbox"]+label,
input[type="radio"]+label {
  cursor: pointer;
  margin-left: 3px;
}

input[type="checkbox"],
input[type="radio"] {
  cursor: pointer;
}

/*---------- checkbox 似iphone 外觀 ----------*/
.checkbox-pt {
  width: 68px;
  height: 26px;
  margin-top: 2px;
  border-radius: 50px;
  position: relative;
}

.checkbox-pt input[type=checkbox] {
  visibility: hidden;
}

.checkbox-pt:after,
.checkbox-pt:before {
  font-size: 12px;
  font-family: Arial;
  top: 5px;
}

.checkbox-pt:after {
  content: 'OFF';
  color: #333333;
  position: absolute;
  right: 8px;
  z-index: 1;
  font-weight: bold;
  text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
}

.checkbox-pt:before {
  content: 'ON';
  color: #fff;
  position: absolute;
  left: 10px;
  z-index: 1;
  font-weight: bold;
}

.checkbox-pt label {
  display: block;
  width: 29px;
  height: 20px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  cursor: pointer;
  position: absolute;
  top: 3px;
  left: 1px;
  z-index: 2;
  border: 1px solid #666;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  transition: all 0.4s ease;
  -moz-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.3);
  background: #fff;
  background: white;
  background: -moz-linear-gradient(top, white 52%, #d2d2d2 97%, #d2d2d2 97%);
  background: -webkit-linear-gradient(top, white 52%, #d2d2d2 97%, #d2d2d2 97%);
  background: linear-gradient(to bottom, #ffffff 52%, #d2d2d2 97%, #d2d2d2 97%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#d2d2d2', GradientType=0);
}

.checkbox-pt .bg {
  background: #dbdbdb;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 0;
  left: 0;
  top: 0;
  -moz-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5) inset;
  -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5) inset;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5) inset;
  border-radius: 50px;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  -webkit-transition: all 0.4s ease;
  -ms-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

.checkbox-pt input[type=checkbox]:checked+label {
  left: 32px;
}

.checkbox-pt input[type=checkbox]:checked~.bg {
  background: #0ea75c;
}

/*---------- textarea ----------*/
textarea {
  resize: vertical;
  /* 可以上下放大*/
}

table textarea,
table select,
table input {
  font-size: 14px !important;
}

table input[type="text"] {
  min-width: 92px;
}

/*---------- select 換箭頭----------*/
select {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  padding-right: 18px !important;
  background: url(data:image/gif;base64,R0lGODlhDwAHAMQSACstNDI0O0ZITtDQ0r/AwuHh4oCBhZWWmbO0t+vr7C0vNjo8QnZ3fGFjaKGipVFTWfPz819gZf///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjEgNjQuMTQwOTQ5LCAyMDEwLzEyLzA3LTEwOjU3OjAxICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ4bXAuZGlkOjVFNjNDNUU0OENBMUU2MTE4RkNBQjIxOTE0ODA2NjY4IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjdFQzIyN0U2QTE5NjExRTY4N0MzRkZFNzY1RkMxM0NDIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjdFQzIyN0U1QTE5NjExRTY4N0MzRkZFNzY1RkMxM0NDIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUuMSBXaW5kb3dzIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RTY1NDQ2RjQ5NUExRTYxMThGQ0FCMjE5MTQ4MDY2NjgiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6NUU2M0M1RTQ4Q0ExRTYxMThGQ0FCMjE5MTQ4MDY2NjgiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4B//79/Pv6+fj39vX08/Lx8O/u7ezr6uno5+bl5OPi4eDf3t3c29rZ2NfW1dTT0tHQz87NzMvKycjHxsXEw8LBwL++vby7urm4t7a1tLOysbCvrq2sq6qpqKempaSjoqGgn56dnJuamZiXlpWUk5KRkI+OjYyLiomIh4aFhIOCgYB/fn18e3p5eHd2dXRzcnFwb25tbGtqaWhnZmVkY2JhYF9eXVxbWllYV1ZVVFNSUVBPTk1MS0pJSEdGRURDQkFAPz49PDs6OTg3NjU0MzIxMC8uLSwrKikoJyYlJCMiISAfHh0cGxoZGBcWFRQTEhEQDw4NDAsKCQgHBgUEAwIBAAAh+QQBAAASACwAAAAADwAHAAAFIWAEjOTYSCiaCOX4QGk6BOVSxDFCKgSOHyOHz8cwDI/IEAA7) no-repeat scroll right center #fff !important;
}

select::-ms-expand {
  display: none;
}

/*---------- input[type="number"] 取消上下箭頭按鈕----------*/
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

input[type=number] {
  -moz-appearance: textfield;
}

textarea,
select,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
  background-color: #FFFFFF;
  border: 1px solid #e6e6e6;
  border-radius: 0 0 0 0 !important;
  color: #333333;
  font-family: inherit;
  font-size: 15px;
  line-height: 1.2;
  padding: 4px 4px;
  transition-duration: 0.1s;
  box-shadow: none !important;
  -webkit-transition: 300ms ease-in-out;
  -moz-transition: 300ms ease-in-out;
  -ms-transition: 300ms ease-in-out;
  -o-transition: 300ms ease-in-out;
  transition: 300ms ease-in-out;
}

textarea:hover,
select:hover,
input[type="text"]:hover,
input[type="password"]:hover,
input[type="datetime"]:hover,
input[type="datetime-local"]:hover,
input[type="date"]:hover,
input[type="month"]:hover,
input[type="time"]:hover,
input[type="week"]:hover,
input[type="number"]:hover,
input[type="email"]:hover,
input[type="url"]:hover,
input[type="search"]:hover,
input[type="tel"]:hover,
input[type="color"]:hover {
  border-color: #b3b3b3;
}

textarea:focus,
select:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus {
  box-shadow: none !important;
  border-color: #0eab5f !important;
  background-color: #fff !important;
}

textarea[disabled],
input[disabled],
select[disabled] {
  background: #F8F8F8 !important;
}

textarea[disabled]:hover,
textarea[disabled]:focus,
input[disabled]:hover,
input[disabled]:focus,
select[disabled]:hover,
select[disabled]:focus {
  background: #F8F8F8 !important;
  border-color: #e6e6e6 !important;
}

.form-control[readonly]:hover,
.form-control[readonly]:focus {
  cursor: default;
  background-color: #eee !important;
  border-color: #e6e6e6 !important;
}

.input-group-addon {
  /*
  background-color: lighten($text-color, 30%);
  border: 1px solid lighten($text-color, 30%);
  color: $white;
   */
  background: rgba(153, 153, 153, 0.2);
  border-color: #e6e6e6;
  border-width: 1px;
  color: #666666;
  border-radius: 4px;
}

*+.input-group-addon.input-group-form:first-of-type>* {
  border-left-width: 0px;
  border-right-width: 1px;
}

.input-group-addon.input-group-form {
  min-width: 10px;
  padding: 0;
  border-width: 0;
}

.input-group-addon.input-group-form:first-of-type>* {
  border-right-width: 0px;
}

.input-group-addon.input-group-form:last-child>* {
  border-right-width: 1px;
}

select option {
  background-color: #ffffff !important;
}

select[multiple="multiple"]:focus option {
  background: #F8F8F8 !important;
}

.has-error .form-control:focus,
.has-warning .form-control:focus,
.has-success .form-control:focus {
  box-shadow: none;
  border: 1px solid #E6E8E8;
  background-color: #E6E8E8;
}

label {
  font-weight: normal;
  font-size: 15px;
  color: #333333;
}

.input-icon,
.input-help {
  display: block;
  position: relative;
}

.input-icon>input {
  padding-left: 27px;
  padding-right: 6px;
}

.input-icon.input-icon-right>input {
  padding-left: 6px;
  padding-right: 26px;
}

.input-help>input {
  padding-left: 30px;
  padding-right: 6px;
}

.input-icon>[class*="fa-"],
.input-icon>[class*="clip-"],
.input-icon>.icon,
.input-icon>.unit {
  bottom: 0;
  color: #909090;
  display: inline-block;
  font-size: 14px;
  left: 5px;
  line-height: 30px;
  padding: 0 3px;
  position: absolute;
  top: 0;
  z-index: 6;
}

.input-icon>.unit {
  color: #333333;
  font-size: 15px;
}

.input-icon.input-icon-right>[class*="fa-"],
.input-icon.input-icon-right>[class*="clip-"],
.input-icon.input-icon-right>.icon,
.input-icon.input-icon-right>.unit {
  left: auto;
  right: -4px;
  padding-right: 12px;
  padding-left: 12px;
}

.input-icon>input:focus+[class*="fa-"],
.input-icon>input:focus+[class*="clip-"] {
  /* color: $mainColor; */
}

.input-icon>input+.pointer:hover {
  color: #0c8f4f;
}

.input-icon>input+.fa-times {
  font-size: 11px;
}

.help-button {
  background-color: #65BCDA;
  border-radius: 100%;
  color: #FFFFFF;
  cursor: default;
  position: absolute;
  font-size: 14px;
  font-weight: bold;
  height: 20px;
  padding: 0;
  text-align: center;
  width: 20px;
  line-height: 20px;
  top: 7px;
  left: 9px;
}

.help-button:before {
  content: "\f128";
  display: inline;
  font-family: FontAwesome;
  font-weight: 300;
  height: auto;
  text-shadow: none;
  font-style: normal;
}

select.form-control {
  min-width: 46px;
  background-color: #FFFFFF;
  border: 1px solid #e6e6e6;
  border-radius: 0 0 0 0;
  cursor: pointer;
  font-size: 15px;
}

select.form-control:hover {
  border-color: #b3b3b3;
}

/*
#vouchers_select{

  &.text-blue ,.text-blue{color: #0f4cb0; }
  &.text-red , .text-red{color: #ed3131; }

}
 */
select.form-control option {
  padding: 3px 4px;
}

.form-control.search-select {
  padding: 0 !important;
  box-shadow: none;
  border: none;
}

textarea.autosize {
  vertical-align: top;
  transition: height 0.2s;
  -webkit-transition: height 0.2s;
  -moz-transition: height 0.2s;
  transition: height 0.2s;
  overflow: hidden;
  word-wrap: break-word;
  resize: horizontal;
  height: 69px;
}

.radio label.radio-inline,
.checkbox label.checkbox-inline {
  display: inline-block;
}

.radio-inline,
.radio-inline+.radio-inline,
.checkbox-inline,
.checkbox-inline+.checkbox-inline {
  margin-right: 10px !important;
  margin-top: 5px !important;
  margin-left: 0 !important;
  margin-bottom: 10px !important;
}

.radio label,
.checkbox label {
  margin-bottom: 5px;
}

.checkbox-table {
  display: inline-block;
  margin: 2px 0 0 0;
  padding-left: 20px;
  line-height: 10px;
}

.checkbox-table label {
  margin-bottom: 0;
}

[class^="icheckbox_"],
[class*="icheckbox_"],
[class^="iradio_"],
[class*="iradio_"] {
  float: left !important;
  margin: 0 5px 0 -20px !important;
}

.help-inline {
  margin-top: 6px;
  color: #737373;
}

.help-block.error {
  color: #B94A48;
}

.symbol {
  width: 12px;
  position: absolute;
}

.symbol.required:before {
  content: "*";
  font-size: 22px;
  font-weight: bold;
  position: absolute;
  left: -10px;
  top: 0px;
  display: inline;
  vertical-align: top;
  color: #e66b6b;
  font-family: sans-serif;
}

@media (max-width: 767px) {
  .symbol.required:before {
    font-size: 18px;
    left: -8px;
    top: 2px;
  }
}

/*---------IE8/9/10/11 CSS hack--------*/
@media all and (-ms-high-contrast: none) {

  *::-ms-backdrop,
  .symbol {
    position: relative;
  }

  *::-ms-backdrop.required:before,
  .symbol.required:before {
    left: 0;
    margin-right: 1.5px;
  }
}

.symbol.normal {
  position: relative;
}

.symbol.normal.required:before {
  left: 0;
  top: 0;
}

.symbol.ok:before {
  content: "\f00c";
  display: inline;
  font-family: FontAwesome;
  color: #468847;
}

.has-error .note-editor,
.has-error .cke_chrome {
  border-color: #B94A48 !important;
}

.form-group {
  position: relative;
}

.form-group .text {
  display: block;
  font-size: 14px;
  font-weight: 400;
  margin-top: 7px;
}

.form-control+.fa-caret-down {
  font-size: 17px;
  color: #2b2d34;
}

textarea.input-oneLineHigh,
input.input-oneLineHigh {
  height: 30px;
  min-height: 30px !important;
}

.messages {
  border-left: 1px solid #e6e6e6;
}

@media (max-width: 767px) {
  .messages {
    border-left: none;
    border-top: 1px solid #e6e6e6;
    padding-top: 15px;
    margin-top: 5px;
  }
}

.messages ul.messages-container {
  list-style: none;
  max-width: 960px;
  margin: 0 auto;
  padding-left: 0;
}

.messages ul.messages-container li.post-message-container {
  margin-bottom: 20px;
}

.messages .post-message-content {
  padding: 10px;
  font-size: 15px;
  line-height: 1.5;
  color: #333333;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
}

@media (max-width: 767px) {
  .messages .post-message-content {
    font-size: 13px;
  }
}

.messages .post-message-content a>img,
.messages .post-message-content>img {
  max-width: 300px !important;
  width: 100% !important;
  height: auto;
  border: 1px solid #bfbfbf;
}

.messages .avatar {
  max-width: 50px;
  min-width: 50px;
  height: 50px;
}

@media (max-width: 767px) {
  .messages .avatar {
    max-width: 40px !important;
    min-width: 40px;
    height: 40px;
  }
}

.messages .avatar img {
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  width: 100%;
  height: auto;
}

.messages .post-time {
  font-size: 13px;
  line-height: 1.2;
  color: #b3b3b3;
  max-width: 100px;
  min-width: 100px;
  padding-top: 6px;
}

@media (max-width: 767px) {
  .messages .post-time {
    font-size: 10px;
    max-width: 70px !important;
    min-width: 70px;
  }
}

.messages .user-post {
  padding-left: 66px;
  float: right;
}

.messages .service-post {
  padding-right: 66px;
  float: left;
}

@media (max-width: 767px) {
  .messages .user-post {
    padding-left: 8px;
  }

  .messages .service-post {
    padding-right: 8px;
  }
}

.messages .user-post-content {
  background: #95f6c6;
  position: relative;
  margin-right: 10px;
}

.messages .user-post-content:before {
  content: "";
  position: absolute;
  top: 10px;
  right: -14px;
  border: 7px solid transparent;
  border-left-color: #95f6c6;
  line-height: 0;
  height: 0;
  width: 0;
}

.messages .user-post-content>img {
  float: right;
}

.messages .service-post-content {
  background: #fafafa;
  position: relative;
  margin-left: 10px;
}

.messages .service-post-content:before {
  content: "";
  position: absolute;
  top: 10px;
  left: -14px;
  border: 7px solid transparent;
  border-right-color: #fafafa;
  line-height: 0;
  height: 0;
  width: 0;
}

.messages .service-post-content>img {
  float: left;
}

/* ---------------------------------------------------------------------- */
/*  Panels
/* ---------------------------------------------------------------------- */
.panel {
  background-color: #FFFFFF;
  -moz-box-shadow: 0 1px 2px #C3C3C3;
  -webkit-box-shadow: 0 1px 2px #C3C3C3;
  box-shadow: 0 1px 2px #C3C3C3;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #333333;
  border: none;
  position: relative;
}

.panel-heading {
  position: relative;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  padding: 15px;
  min-height: 50px;
}

.panel-heading .panel-heading-tabs {
  list-style: none;
  top: 0;
  right: 0;
  position: absolute;
  margin: 0;
  padding: 0;
}

.panel-heading .panel-heading-tabs>li {
  float: left;
  padding: 0 15px;
  border-left-width: 1px;
  border-left-style: solid;
  border-left-color: inherit;
  height: 50px;
  line-height: 50px;
}

.panel-heading .panel-heading-tabs>li.panel-tools {
  position: relative;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
  right: auto;
  top: auto;
}

.panel-heading .panel-heading-tabs>li.panel-tools .tmp-tool {
  right: 20px;
  top: auto;
}

.panel-heading .panel-heading-tabs>li.panel-tools .dropdown {
  line-height: normal;
}

.core-box .heading {
  margin-bottom: 15px;
}

.core-box .core-icon {
  width: 33.3333%;
  left: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}

.core-box .core-icon .iconBig {
  font-size: 56px;
  line-height: 56px;
}

@media (min-width: 1200px) and (max-width: 1368px) {
  .core-box .core-icon .iconBig {
    font-size: 46px;
    line-height: 46px;
  }
}

.core-box .core-content {
  margin-left: 33.3333%;
  min-height: 80px;
}

@media (min-width: 1200px) and (max-width: 1368px) {
  .core-box .core-content {
    min-height: 60px;
  }
}

.core-box .heading {
  font-size: 12px;
}

.core-box .title {
  font-size: 32px;
  line-height: 36px;
  margin-bottom: 0;
  font-weight: 400;
}

.core-box .subtitle {
  font-size: 18px;
  filter: alpha(opacity=80);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
}

@media (min-width: 1200px) and (max-width: 1368px) {
  .core-box .subtitle {
    font-size: 15px;
  }
}

.core-box .content {
  line-height: 20px;
  margin-bottom: 15px;
  position: relative;
  padding-left: 60px;
}

.core-box .content .fa {
  font-size: 50px;
  left: 0;
  top: 0;
  position: absolute;
  width: 40px;
}

.core-box .view-more {
  float: right;
}

.core-box .view-more i {
  display: inline-block;
}

.panel-tools {
  position: absolute;
  right: 10px;
  top: 14px;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
  -moz-transition: opacity 0.5s ease-in-out;
  -o-transition: opacity 0.5s ease-in-out;
  -webkit-transition: opacity 0.5s ease-in-out;
  -ms-transition: opacity 0.5s ease-in-out;
  transition: opacity 0.5s ease-in-out;
}

.panel:hover .panel-tools {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.panel-tools .dropdown {
  display: inline-block;
}

.panel-tools .dropdown .dropdown-menu a>i {
  margin-right: 10px;
}

.panel-tools a {
  color: #333333 !important;
  background: none;
}

.panel-tools a:hover {
  color: black !important;
}

.panel-portfolio .portfolio-grid {
  padding: 0;
  text-align: center;
  overflow: hidden;
  max-height: 200px;
  position: relative;
}

.panel-portfolio .portfolio-grid .item {
  overflow: hidden !important;
}

.panel-portfolio .navigator {
  position: relative;
  text-align: center;
  margin-top: -40px;
  margin-bottom: 10px;
  z-index: 101;
}

.panel-grey,
.partition-grey {
  background-color: #999;
  position: relative;
  /* @include background-gradient(lighten($grey,5%) 0px, $grey 100%); */
  color: #1a1a1a;
}

.panel-grey .panel-tools .btn,
.panel-grey .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-grey .panel-tools .ag-paging-button,
.panel-grey .panel-tools>a,
.partition-grey .panel-tools .btn,
.partition-grey .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-grey .panel-tools .ag-paging-button,
.partition-grey .panel-tools>a {
  color: rgba(26, 26, 26, 0.7) !important;
}

.panel-grey .panel-tools .btn:hover,
.panel-grey .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-grey .panel-tools .ag-paging-button:hover,
.panel-grey .panel-tools>a:hover,
.partition-grey .panel-tools .btn:hover,
.partition-grey .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-grey .panel-tools .ag-paging-button:hover,
.partition-grey .panel-tools>a:hover {
  color: #1a1a1a !important;
}

.panel-light-grey,
.partition-light-grey {
  background-color: #e6e6e6;
  position: relative;
  /*  @include background-gradient(lighten(lighten($grey,30%),5%) 0px, lighten($grey,30%) 100%);  */
  color: #333333;
}

.panel-light-grey .panel-tools .btn,
.panel-light-grey .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-light-grey .panel-tools .ag-paging-button,
.panel-light-grey .panel-tools>a,
.partition-light-grey .panel-tools .btn,
.partition-light-grey .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-light-grey .panel-tools .ag-paging-button,
.partition-light-grey .panel-tools>a {
  color: rgba(51, 51, 51, 0.7) !important;
}

.panel-light-grey .panel-tools .btn:hover,
.panel-light-grey .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-light-grey .panel-tools .ag-paging-button:hover,
.panel-light-grey .panel-tools>a:hover,
.partition-light-grey .panel-tools .btn:hover,
.partition-light-grey .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-light-grey .panel-tools .ag-paging-button:hover,
.partition-light-grey .panel-tools>a:hover {
  color: #333333 !important;
}

.panel-orange,
.partition-orange {
  background-color: #fc9424;
  position: relative;
  /*  @include background-gradient(lighten($orange,5%) 0px, $orange 100%);  */
  color: #ffffff;
}

.panel-orange .panel-tools .btn,
.panel-orange .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-orange .panel-tools .ag-paging-button,
.panel-orange .panel-tools>a,
.partition-orange .panel-tools .btn,
.partition-orange .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-orange .panel-tools .ag-paging-button,
.partition-orange .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-orange .panel-tools .btn:hover,
.panel-orange .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-orange .panel-tools .ag-paging-button:hover,
.panel-orange .panel-tools>a:hover,
.partition-orange .panel-tools .btn:hover,
.partition-orange .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-orange .panel-tools .ag-paging-button:hover,
.partition-orange .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-purple,
.partition-purple {
  background-color: #804C75;
  position: relative;
  /*  @include background-gradient(lighten($purple,5%) 0px, $purple 100%);  */
  color: #ffffff;
}

.panel-purple .panel-tools .btn,
.panel-purple .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-purple .panel-tools .ag-paging-button,
.panel-purple .panel-tools>a,
.partition-purple .panel-tools .btn,
.partition-purple .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-purple .panel-tools .ag-paging-button,
.partition-purple .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-purple .panel-tools .btn:hover,
.panel-purple .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-purple .panel-tools .ag-paging-button:hover,
.panel-purple .panel-tools>a:hover,
.partition-purple .panel-tools .btn:hover,
.partition-purple .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-purple .panel-tools .ag-paging-button:hover,
.partition-purple .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-pink,
.partition-pink {
  background-color: #DD5A82;
  position: relative;
  /*  @include background-gradient(lighten($pink,5%) 0px, $pink 100%);  */
  color: #ffffff;
}

.panel-pink .panel-tools .btn,
.panel-pink .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-pink .panel-tools .ag-paging-button,
.panel-pink .panel-tools>a,
.partition-pink .panel-tools .btn,
.partition-pink .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-pink .panel-tools .ag-paging-button,
.partition-pink .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-pink .panel-tools .btn:hover,
.panel-pink .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-pink .panel-tools .ag-paging-button:hover,
.panel-pink .panel-tools>a:hover,
.partition-pink .panel-tools .btn:hover,
.partition-pink .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-pink .panel-tools .ag-paging-button:hover,
.partition-pink .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-azure,
.partition-azure {
  background-color: #00adb8;
  position: relative;
  /* @include background-gradient(lighten($azure,5%) 0px, $azure 100%);  */
  color: #ffffff;
}

.panel-azure .panel-tools .btn,
.panel-azure .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-azure .panel-tools .ag-paging-button,
.panel-azure .panel-tools>a,
.partition-azure .panel-tools .btn,
.partition-azure .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-azure .panel-tools .ag-paging-button,
.partition-azure .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-azure .panel-tools .btn:hover,
.panel-azure .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-azure .panel-tools .ag-paging-button:hover,
.panel-azure .panel-tools>a:hover,
.partition-azure .panel-tools .btn:hover,
.partition-azure .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-azure .panel-tools .ag-paging-button:hover,
.partition-azure .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-bricky,
.partition-bricky {
  background-color: #894550;
  position: relative;
  /* @include background-gradient(lighten($bricky,5%) 0px, $bricky 100%);  */
  color: #ffffff;
}

.panel-bricky .panel-tools .btn,
.panel-bricky .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-bricky .panel-tools .ag-paging-button,
.panel-bricky .panel-tools>a,
.partition-bricky .panel-tools .btn,
.partition-bricky .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-bricky .panel-tools .ag-paging-button,
.partition-bricky .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-bricky .panel-tools .btn:hover,
.panel-bricky .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-bricky .panel-tools .ag-paging-button:hover,
.panel-bricky .panel-tools>a:hover,
.partition-bricky .panel-tools .btn:hover,
.partition-bricky .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-bricky .panel-tools .ag-paging-button:hover,
.partition-bricky .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-green,
.partition-green {
  background-color: #1FBBA6;
  position: relative;
  /* @include background-gradient(lighten($green,5%) 0px, $green 100%);  */
  color: #ffffff;
}

.panel-green .panel-tools .btn,
.panel-green .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-green .panel-tools .ag-paging-button,
.panel-green .panel-tools>a,
.partition-green .panel-tools .btn,
.partition-green .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-green .panel-tools .ag-paging-button,
.partition-green .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-green .panel-tools .btn:hover,
.panel-green .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-green .panel-tools .ag-paging-button:hover,
.panel-green .panel-tools>a:hover,
.partition-green .panel-tools .btn:hover,
.partition-green .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-green .panel-tools .ag-paging-button:hover,
.partition-green .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-green.panel-chart {
  background-color: #72e5cb !important;
}

.panel-red,
.partition-red {
  background-color: #e66b6b;
  position: relative;
  /* @include background-gradient(lighten($red,5%) 0px, $red 100%);  */
  color: #ffffff;
}

.panel-red .panel-tools .btn,
.panel-red .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-red .panel-tools .ag-paging-button,
.panel-red .panel-tools>a,
.partition-red .panel-tools .btn,
.partition-red .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-red .panel-tools .ag-paging-button,
.partition-red .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-red .panel-tools .btn:hover,
.panel-red .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-red .panel-tools .ag-paging-button:hover,
.panel-red .panel-tools>a:hover,
.partition-red .panel-tools .btn:hover,
.partition-red .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-red .panel-tools .ag-paging-button:hover,
.partition-red .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-blue,
.partition-blue {
  background-color: #00869e;
  position: relative;
  /* @include background-gradient(lighten($blue,5%) 0px, $blue 100%); */
  color: #ffffff;
}

.panel-blue .panel-tools .btn,
.panel-blue .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-blue .panel-tools .ag-paging-button,
.panel-blue .panel-tools>a,
.partition-blue .panel-tools .btn,
.partition-blue .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-blue .panel-tools .ag-paging-button,
.partition-blue .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-blue .panel-tools .btn:hover,
.panel-blue .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-blue .panel-tools .ag-paging-button:hover,
.panel-blue .panel-tools>a:hover,
.partition-blue .panel-tools .btn:hover,
.partition-blue .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-blue .panel-tools .ag-paging-button:hover,
.partition-blue .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-yellow,
.partition-yellow {
  background-color: #FFB848;
  position: relative;
  /* @include background-gradient(lighten($yellow,5%) 0px, $yellow 100%); */
  color: #fff;
}

.panel-yellow .panel-tools .btn,
.panel-yellow .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-yellow .panel-tools .ag-paging-button,
.panel-yellow .panel-tools>a,
.partition-yellow .panel-tools .btn,
.partition-yellow .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-yellow .panel-tools .ag-paging-button,
.partition-yellow .panel-tools>a {
  color: rgba(59, 60, 65, 0.7) !important;
}

.panel-yellow .panel-tools .btn:hover,
.panel-yellow .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-yellow .panel-tools .ag-paging-button:hover,
.panel-yellow .panel-tools>a:hover,
.partition-yellow .panel-tools .btn:hover,
.partition-yellow .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-yellow .panel-tools .ag-paging-button:hover,
.partition-yellow .panel-tools>a:hover {
  color: #3b3c41 !important;
}

.panel-white,
.partition-white {
  background-color: #ffffff;
  position: relative;
  color: #333333;
}

.panel-dark,
.partition-dark {
  background-color: #858790;
  position: relative;
  /* @include background-gradient(lighten($black,5%) 0px, $black 100%); */
  color: #ffffff;
}

.panel-dark .panel-tools .btn,
.panel-dark .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-dark .panel-tools .ag-paging-button,
.panel-dark .panel-tools>a,
.partition-dark .panel-tools .btn,
.partition-dark .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-dark .panel-tools .ag-paging-button,
.partition-dark .panel-tools>a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.panel-dark .panel-tools .btn:hover,
.panel-dark .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .panel-dark .panel-tools .ag-paging-button:hover,
.panel-dark .panel-tools>a:hover,
.partition-dark .panel-tools .btn:hover,
.partition-dark .panel-tools .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .partition-dark .panel-tools .ag-paging-button:hover,
.partition-dark .panel-tools>a:hover {
  color: #ffffff !important;
}

.panel-scroll {
  height: 400px;
  overflow: hidden;
  position: relative;
  width: auto;
  padding-right: 10px !important;
}

.panel-note {
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  border: none;
}

.panel-note .panel-heading {
  border-bottom: 0 none;
  padding-top: 30px;
  padding-bottom: 10px;
  top: 0;
  z-index: 3;
  position: relative;
}

.panel-note .panel-heading h3 {
  margin: 0;
}

.panel-note .panel-body {
  padding: 0;
  margin: 0 15px;
  line-height: 18px;
}

.panel-note .panel-footer {
  background: none;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-top: none;
  padding: 10px 15px;
  margin-bottom: 0;
}

.panel-note .panel-footer .avatar-note {
  width: 30px;
  height: 30px;
  float: left;
  margin-right: 10px;
}

.panel-note .panel-footer .avatar-note img {
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
}

.panel-note .panel-footer .author-note {
  display: block;
  line-height: 14px;
}

.panel-note .panel-footer .timestamp {
  color: #999999;
  display: inline-block;
  font-size: 11px;
}

.panel-note .note-options a {
  margin-left: 10px;
  font-size: 12px;
}

.panel-note .note-options a:hover {
  text-decoration: none;
}

[class^="partition-"]:after {
  content: " ";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}

/* ---------------------------------------------------------------------- */
/*  Backdrop
/* ---------------------------------------------------------------------- */
.full-white-backdrop {
  background-color: #FFFFFF;
  display: none;
  bottom: 0;
  left: 0;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1049;
}

.panel.panel-full-screen {
  bottom: 0;
  left: 10px;
  position: fixed;
  top: 10px;
  right: 10px;
  z-index: 1048;
  background-color: #FFFFFF;
}

.tmp-tool {
  position: fixed;
  right: 40px;
  top: 20px;
}

.popover-guide-ng1+.popover {
  border: none;
  padding: 0;
}

.popover-guide-ng1+.popover .popover-inner {
  background: #4080fe;
  color: #fff;
  border-radius: 4px;
  position: relative;
  padding-right: 20px;
}

.popover-guide-ng1+.popover.bottom>.arrow:after {
  border-bottom-color: #4080fe;
}

.popover-guide-ng1+.popover.top>.arrow:after {
  border-top-color: #4080fe;
}

.popover-guide-ng1+.popover.right>.arrow:after {
  border-right-color: #4080fe;
}

.popover-guide-ng1+.popover.left>.arrow:after {
  border-left-color: #4080fe;
}

.popover-guide-ng1+.popover i {
  font-style: normal;
  position: absolute;
  right: 10px;
  top: 5px;
  cursor: pointer;
  font-size: 20px;
  opacity: .7;
  font-weight: bold;
}

.popover-guide-ng1+.popover i:hover {
  opacity: 1;
}

.popover-guide {
  border: none;
  padding: 0;
}

.popover-guide .popover-content {
  background: #4080fe;
  color: #fff;
  border-radius: 4px;
  position: relative;
  padding-right: 30px;
}

.popover-guide.bottom>.arrow:after {
  border-bottom-color: #4080fe;
}

.popover-guide.top>.arrow:after {
  border-top-color: #4080fe;
}

.popover-guide.right>.arrow:after {
  border-right-color: #4080fe;
}

.popover-guide.left>.arrow:after {
  border-left-color: #4080fe;
}

.popover-guide .close {
  font-style: normal;
  position: absolute;
  right: 6px;
  top: 8px;
  cursor: pointer;
  font-size: 22px;
  opacity: .7;
  color: #fff;
  font-family: Arial;
  font-weight: 500;
  text-shadow: none;
  text-align: center;
}

.popover-guide .close:hover {
  opacity: 1;
}

.pop-w-full {
  max-width: 295px;
  margin: 0 auto;
}

.btn-process-switch {
  position: absolute;
  right: 10px;
  top: 10px;
  z-index: 99;
}

.process-map-wrap {
  overflow: auto;
  min-height: 300px;
  position: relative;
}

.vertical-line {
  display: inline-block;
  width: 5px;
  height: 5em !important;
  background: #e1f3ea;
  vertical-align: middle;
  margin: 0 3px;
}

@media (max-width: 1200px) {
  .process-map-wrap {
    padding-top: 40px;
  }
}

.process-border-box {
  position: relative;
  margin-left: 18px;
  display: inline-block;
  letter-spacing: 1px;
  vertical-align: top;
  border-radius: 8px;
  border: 5px solid #e1f3ea;
  padding: .4em;
}

.process-border-box:before,
.process-border-box:after {
  content: "";
  width: 0px;
  height: 0px;
  border-style: solid;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0px;
}

.process-border-box:before {
  margin: auto auto auto -14px;
  z-index: 2;
  border-style: solid;
  border-width: 6px 14px 14px 0;
  border-color: transparent #fff transparent transparent;
}

.process-border-box:after {
  margin: auto auto auto -22px;
  z-index: 1;
  border-width: 11px 19px 19px 0;
  border-color: transparent #e1f3ea transparent transparent;
}

.process-border-box .btn-wrap {
  font-size: .8em !important;
}


.process-border-box.style-qa .vertical-line {
  margin-top: 5px;
  height: 3em !important;
}

.process-border-box.style-qa:before {
  margin: auto auto -14px auto;
  border-width: 14px 14px 0 14px;
  border-color: #fff transparent transparent transparent;
}


.process-border-box.style-qa:after {
  margin: auto auto -22px auto;
  border-width: 19px 19px 0 19px;
  border-color: #e1f3ea transparent transparent transparent;
}


.process-border-box.style-qa .btn-wrap.click {
  width: 120px !important;
  height: 50px !important;
  margin: 0 10px;
}

.process-border-box.style-qa .btn-wrap.click.btn-color1:hover {
  background: #0cab5d !important;
  color: #fff;
}


.process-border-box.style-qa .btn-wrap a i {
  font-size: 3.2em;
  padding-bottom: 0;
  top: 0;
}

.process-border-box.style-qa .btn-wrap a p {
  font-size: 14px;
  margin: 0;
  margin-left: 10px;
}

.process-border-box.style-qa a {
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.process-map {
  display: inline-block;
  text-align: left;
  letter-spacing: -5px;
  font-size: 1em;
  padding-bottom: 3vh;
  white-space: nowrap;
}

.process-map .new {
  display: block;
  position: absolute;
  left: 0px;
  top: 0px;
  background: #ff6262;
  width: 48px;
  padding: 2px;
  border-radius: 10px;
  color: #fff;
  font-family: Arial;
  font-weight: bold;
  text-align: center;
  z-index: 99;
  font-size: 10px;
}

.process-map .new:before {
  content: "NEW";
}

.process-map .click-none {
  cursor: default !important;
}

.process-map .click-none a {
  cursor: default !important;
}

.process-map .click-none i {
  color: #bdbdbd;
}

.process-map .click-none:hover i {
  color: #bdbdbd;
}

.process-map .click-none-pink {
  cursor: default !important;
}

.process-map .click-none-pink a {
  cursor: default !important;
}

.process-map .click-none-pink i {
  color: #ff9999;
}

.process-map .click-none-pink:hover i {
  color: #ff9999;
}

.process-map .btn-wrap {
  font-size: 1em;
  vertical-align: top;
  position: relative;
  text-align: center;
  display: inline-block;
  letter-spacing: 1px;
  width: 6.2em !important;
  height: 6.2em !important;
  border-radius: 6px;
  padding: 0.2em 0.2em;
}

.process-map .btn-wrap.btn-wrap-half {
  width: 3.1em !important;
}

.process-map .btn-wrap a {
  text-align: center;
  display: block;
  padding-top: 6px;
}

.process-map .btn-wrap a i {
  font-size: 3.4em;
  line-height: 1;
  padding-bottom: 2px;
  display: inline-block;
  position: relative;
  top: -2px;
}

.process-map .btn-wrap a i.smaller {
  font-size: 2.8em;
  line-height: 1.3;
}

@media (max-width: 767px) {
  .process-map .btn-wrap a i.smaller {
    line-height: 1.25;
  }
}

.process-map .btn-wrap a p {
  font-size: .96em;
  line-height: 1.2;
  color: #333333;
  letter-spacing: 0;
}

.process-map .btn-wrap a p.small {
  font-size: .9em;
  letter-spacing: -1px;
}

.process-map .btn-wrap a p.two-line {
  line-height: .9;
  margin-top: -2px;
}

.process-map .btn-wrap a p.top {
  position: absolute;
  top: 4px;
  text-align: center;
}

.process-map .btn-wrap .btn-absolute {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 99;
}

.process-map .stage-1 .btn-wrap.click {
  cursor: pointer;
  transition: .1s all;
}

.process-map .stage-1 .btn-wrap.click a {
  color: #10be69;
}

.process-map .stage-1 .btn-wrap.click:hover {
  background: #10be69;
  color: #fff;
  box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.15);
}

.process-map .stage-1 .btn-wrap.click:hover i {
  color: #fff;
}

.process-map .stage-1 .btn-wrap.click:hover p {
  color: #fff;
}

.process-map .stage-2 .btn-wrap.click {
  cursor: pointer;
  transition: .1s all;
}

.process-map .stage-2 .btn-wrap.click a {
  color: #fca342;
}

.process-map .stage-2 .btn-wrap.click:hover {
  background: #fca342;
  color: #fff;
  box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.15);
}

.process-map .stage-2 .btn-wrap.click:hover i {
  color: #fff;
}

.process-map .stage-2 .btn-wrap.click:hover p {
  color: #fff;
}

.process-map .btn-color1 {
  cursor: pointer;
}

.process-map .btn-color1.opacity a {
  color: rgba(16, 190, 105, 0.5) !important;
}

.process-map .btn-color1 a {
  color: #10be69 !important;
}

.process-map .btn-color1:hover {
  background: #10be69 !important;
  color: #fff;
}

.process-map .btn-color1:hover i {
  color: #fff;
}

.process-map .btn-color1:hover p {
  color: #fff;
}

.process-map .btn-color1.border {
  border: 2px solid #10be69;
}

.process-map .btn-color2 {
  cursor: pointer;
}

.process-map .btn-color2.opacity a {
  color: rgba(252, 163, 66, 0.5) !important;
}

.process-map .btn-color2 a {
  color: #fca342 !important;
}

.process-map .btn-color2:hover {
  background: #fca342 !important;
  color: #fff;
}

.process-map .btn-color2:hover i {
  color: #fff;
}

.process-map .btn-color2:hover p {
  color: #fff;
}

.process-map .btn-color2.border {
  border: 2px solid #fca342;
}

.process-map .path-line,
.process-map .path-line-h {
  width: 6.2em;
  height: 1.82353em;
  display: inline-block;
  letter-spacing: 1px;
  position: relative;
  top: 0px;
  position: relative;
  padding: 0.2em 0.2em;
}

.process-map .path-line.path-line-h-half,
.process-map .path-line-h-half.path-line-h {
  width: 3.1em !important;
}

.process-map .path-line.path-line-h-quarter,
.process-map .path-line-h-quarter.path-line-h {
  width: 1.55em !important;
}

.process-map .path-line.padding-top,
.process-map .padding-top.path-line-h {
  padding-top: 2.48em;
}

.process-map .path-line .arr,
.process-map .path-line-h .arr,
.process-map .path-line .arr-left,
.process-map .path-line-h .arr-left,
.process-map .path-line .arr-right,
.process-map .path-line-h .arr-right,
.process-map .path-line .arr-top,
.process-map .path-line-h .arr-top,
.process-map .path-line .line,
.process-map .path-line-h .line,
.process-map .path-line .line-left,
.process-map .path-line-h .line-left,
.process-map .path-line .line-right,
.process-map .path-line-h .line-right,
.process-map .path-line .line-full,
.process-map .path-line-h .line-full,
.process-map .path-line .line-h-full,
.process-map .path-line-h .line-h-full,
.process-map .path-line .line-bottom,
.process-map .path-line-h .line-bottom,
.process-map .path-line .line-half-bottom,
.process-map .path-line-h .line-half-bottom,
.process-map .path-line .line-top,
.process-map .path-line-h .line-top,
.process-map .path-line .line-half-top,
.process-map .path-line-h .line-half-top,
.process-map .path-line .line-full-more,
.process-map .path-line-h .line-full-more,
.process-map .path-line .line-top-more,
.process-map .path-line-h .line-top-more,
.process-map .path-line .line-bottom-more,
.process-map .path-line-h .line-bottom-more {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

.process-map .path-line .arr,
.process-map .path-line-h .arr {
  border: 10px solid transparent;
  border-top-color: #e1f3ea;
  line-height: 0;
  height: 0;
  width: 0;
  margin: auto auto -10px auto;
}

.process-map .path-line .arr-top,
.process-map .path-line-h .arr-top {
  border: 10px solid transparent;
  border-bottom-color: #e1f3ea;
  line-height: 0;
  height: 0;
  width: 0;
  margin: -10px auto auto auto;
}

.process-map .path-line .arr-left,
.process-map .path-line-h .arr-left {
  border: 10px solid transparent;
  border-right-color: #e1f3ea;
  line-height: 0;
  height: 0;
  width: 0;
  margin: auto auto auto -10px;
}

.process-map .path-line .arr-right,
.process-map .path-line-h .arr-right {
  border: 10px solid transparent;
  border-left-color: #e1f3ea;
  line-height: 0;
  height: 0;
  width: 0;
  margin: auto -10px auto auto;
}

.process-map .path-line .line,
.process-map .path-line-h .line,
.process-map .path-line .line-full,
.process-map .path-line-h .line-full,
.process-map .path-line .line-h-full,
.process-map .path-line-h .line-h-full,
.process-map .path-line .line-left,
.process-map .path-line-h .line-left,
.process-map .path-line .line-right,
.process-map .path-line-h .line-right,
.process-map .path-line .line-bottom,
.process-map .path-line-h .line-bottom,
.process-map .path-line .line-bottom-more,
.process-map .path-line-h .line-bottom-more,
.process-map .path-line .line-half-bottom,
.process-map .path-line-h .line-half-bottom,
.process-map .path-line .line-top,
.process-map .path-line-h .line-top,
.process-map .path-line .line-top-more,
.process-map .path-line-h .line-top-more,
.process-map .path-line .line-half-top,
.process-map .path-line-h .line-half-top {
  border: 3px solid #e1f3ea;
}

.process-map .path-line .line,
.process-map .path-line-h .line {
  width: 0px;
  margin: 0 auto auto auto;
  height: calc(100% - 10px);
}

.process-map .path-line .line-dashed,
.process-map .path-line-h .line-dashed {
  border-style: dashed;
}

.process-map .path-line .line-full,
.process-map .path-line-h .line-full {
  margin: 0 auto auto auto;
  height: 100%;
  width: 0px;
}

.process-map .path-line .line-h-full,
.process-map .path-line-h .line-h-full {
  margin: auto 0 auto 0;
  width: 100%;
  height: 0;
}

.process-map .path-line .line-left,
.process-map .path-line-h .line-left {
  margin: auto auto auto 0;
  width: 50%;
  height: 0;
}

.process-map .path-line .line-right,
.process-map .path-line-h .line-right {
  margin: auto 0 auto auto;
  width: 50%;
  height: 0;
}

.process-map .path-line .line-bottom,
.process-map .path-line-h .line-bottom {
  margin: auto auto 2px auto;
  height: 50%;
  width: 0px;
}

.process-map .path-line .line-bottom-more,
.process-map .path-line-h .line-bottom-more {
  margin: auto auto -5px auto;
  height: calc(50% + 5px);
  width: 0px;
}

.process-map .path-line .line-half-bottom,
.process-map .path-line-h .line-half-bottom {
  margin: auto auto 10px auto;
  height: calc(50% - 8px);
  width: 0px;
}

.process-map .path-line .line-top,
.process-map .path-line-h .line-top {
  margin: 2px auto auto auto;
  height: 50%;
  width: 0px;
}

.process-map .path-line .line-top-more,
.process-map .path-line-h .line-top-more {
  margin: -5px auto auto auto;
  height: calc(50% + 5px);
  width: 0px;
}

.process-map .path-line .line-half-top,
.process-map .path-line-h .line-half-top {
  margin: 10px auto auto auto;
  height: calc(50% - 8px);
  width: 0px;
}

.process-map .path-line .line-full-more,
.process-map .path-line-h .line-full-more {
  height: calc(100% + 10px);
  width: 0px;
}

.process-map .path-line .line-full-more-top-bottom,
.process-map .path-line-h .line-full-more-top-bottom {
  height: calc(100% + 20px);
  width: 0px;
  margin: auto;
}

.process-map .path-line .line-2-row {
  height: calc(100% + 60px);
  width: 0px;
}


.process-map .path-line .line-right-arr,
.process-map .path-line-h .line-right-arr {
  margin: auto 8px auto auto;
  width: calc(50% - 8px);
}

.process-map .path-line .line-h-right-arr,
.process-map .path-line-h .line-h-right-arr {
  margin: auto 8px auto 0;
  width: calc(100% - 8px);
}

.process-map .path-line .line-left-arr,
.process-map .path-line-h .line-left-arr {
  margin: auto auto auto 8px;
  width: calc(50% - 8px);
}

.process-map .path-line .line-h-left-arr,
.process-map .path-line-h .line-h-left-arr {
  margin: auto 0 auto 8px;
  width: calc(100% - 8px);
}

.process-map .path-line-h {
  width: 3.1em;
  height: 6.2em;
}

.process-map .move-down-half {
  position: relative;
  top: 3.1em;
}

.process-map .move-down-quarter {
  position: relative;
  top: 1.55em;
}

.process-map .path-line.incline {
  transform: rotateZ(-45deg);
}

.timeLine {
  margin-top: 1.5rem;
  margin-left: 4rem;
}

.timeLine p {
  margin: 0;
}

.timeLine .timeLine-year-group:last-child .timeLine-item:last-child:before {
  display: none;
}

.timeLine .timeLine-item {
  display: flex;
  position: relative;
  min-height: 50px;
  margin-bottom: 12px;
}

.timeLine .timeLine-item:before {
  content: "";
  display: block;
  position: absolute;
  left: 85px;
  top: 20px;
  bottom: -30px;
  width: 4px;
  background-color: #e9e9e9;
}

.timeLine .timeLine-item .year {
  flex: none;
  font-size: 28px;
  font-weight: bold;
  color: #cacaca;
  font-family: Arial;
  width: 76px;
  position: relative;
  top: -5px;
}

.timeLine .timeLine-item .date {
  flex: 0 0 auto;
  position: relative;
  padding-left: 40px;
  width: 124px;
  color: #9B9B9B;
}

.timeLine .timeLine-item .date .sort {
  display: block;
  position: absolute;
  left: -10px;
  width: 40px;
  height: 40px;
  text-align: center;
  border-radius: 100%;
  padding-top: 8px;
  top: -6px;
  font-size: 14px;
  color: #fff;
  border: 2px solid #fff;
}

.timeLine .timeLine-item .date .text .time {
  font-family: Arial;
  color: #000;
  font-size: 12px;
  margin: 0;
}

.timeLine .timeLine-item .date .text .business-name {
  color: #868686;
  font-size: 13px;
  margin: 0;
}

.timeLine .timeLine-item .event {
  flex: none;
  width: calc(100% - 204px);
  max-width: 560px;
  position: relative;
  padding: 10px;
  border: 1px solid #e4e4e4;
  box-shadow: 0px 6px 10px 1px rgba(0, 0, 0, 0.08);
  border-radius: 10px;
  top: -8px;
  cursor: pointer;
  transition: all .06s;
}

.timeLine .timeLine-item .event:hover {
  transform: translateY(-4px);
  box-shadow: 0px 8px 12px 3px rgba(0, 0, 0, 0.12);
  transition: all .12s;
}

.timeLine .timeLine-item .event:hover p:not([class]) {
  position: relative;
}

.timeLine .timeLine-item .event:hover p:not([class]):before {
  content: "";
  position: absolute;
  z-index: -1;
  bottom: -16px;
  left: -14px;
  width: calc(100% + 28px);
  height: 100%;
}

.timeLine .timeLine-item .event .client-name {
  position: absolute;
  right: 12px;
  top: 10px;
  text-align: right;
  color: #868686;
  font-size: 13px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: calc(100% - 120px);
}

.timeLine .timeLine-item .event .sort-title {
  font-weight: bold;
  font-size: 16px;
  margin-top: 0;
  margin-bottom: 10px;
}

.timeLine .timeLine-item .event p {
  font-size: 14px;
}

.timeLine .timeLine-item .event:before,
.timeLine .timeLine-item .event:after {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0px;
  border-style: solid;
}

.timeLine .timeLine-item .event:before {
  margin: 8px auto auto -10px;
  z-index: 2;
  border-width: 6px 10px 6px 0;
  border-color: transparent #fff transparent transparent;
}

.timeLine .timeLine-item .event:after {
  margin: 6px auto auto -12px;
  z-index: 1;
  border-style: solid;
  border-width: 8px 12px 8px 0;
  border-color: transparent #e4e4e4 transparent transparent;
}

.sort.timeLineColor-1 {
  background-color: #ff8196;
}

.sort.timeLineColor-2 {
  background-color: #14cf8f;
}

.sort.timeLineColor-3 {
  background-color: #ff9315;
}

.sort.timeLineColor-4 {
  background-color: #0cadc5;
}

.sort.timeLineColor-5 {
  background-color: #8f98da;
}

.sort.timeLineColor-6 {
  background-color: #fa8c66;
}

.sort-title.timeLineColor-1 {
  color: #ff8196;
}

.sort-title.timeLineColor-2 {
  color: #14cf8f;
}

.sort-title.timeLineColor-3 {
  color: #ff9315;
}

.sort-title.timeLineColor-4 {
  color: #0cadc5;
}

.sort-title.timeLineColor-5 {
  color: #8f98da;
}

.sort-title.timeLineColor-6 {
  color: #fa8c66;
}

@media (max-width: 767px) {
  .timeLine {
    margin-left: 1rem;
    margin-top: 4rem;
  }

  .timeLine .timeLine-year-group {
    padding-bottom: 22px;
  }

  .timeLine .timeLine-item {
    min-height: 100px;
  }

  .timeLine .timeLine-item:before {
    left: 20px;
  }

  .timeLine .timeLine-item .year {
    width: 76px;
    position: relative;
    top: -40px;
    left: -10px;
  }

  .timeLine .timeLine-item .year p {
    text-shadow: 0px 0px 4px #fff, 0px 0px 4px #fff, 0px 0px 4px #fff, 0px 0px 4px #fff, 0px 0px 4px #fff;
  }

  .timeLine .timeLine-item .date {
    width: auto;
    position: relative;
    margin-left: -66px;
    padding-left: 45px;
  }

  .timeLine .timeLine-item .date .text {
    display: inline-flex;
    position: absolute;
    left: 58px;
    width: 200px;
    top: 4px;
  }

  .timeLine .timeLine-item .date .text .time {
    margin: 0;
  }

  .timeLine .timeLine-item .date .text .business-name {
    margin-left: 4px;
    position: relative;
    top: -2px;
  }

  .timeLine .timeLine-item .event {
    width: calc(100% - 60px);
    max-width: none;
    padding-top: 36px;
  }

  .timeLine .timeLine-item .event .client-name {
    max-width: calc(100% - 145px);
  }

  .timeLine .timeLine-item .event:before {
    margin: 16px auto auto -10px;
  }

  .timeLine .timeLine-item .event:after {
    margin: 14px auto auto -12px;
  }
}

.example {
  margin: 15px 0;
  padding: 14px 19px;
}

.space5 {
  display: block;
  margin-bottom: 5px !important;
  clear: both;
}

.space7 {
  margin-bottom: 7px !important;
  clear: both;
}

.space10 {
  margin-bottom: 10px !important;
  clear: both;
}

.space12 {
  margin-bottom: 12px !important;
  clear: both;
}

.space15 {
  margin-bottom: 15px !important;
  clear: both;
}

.space20 {
  margin-bottom: 20px !important;
  clear: both;
}

.height-115 {
  height: 115px !important;
}

.height-130 {
  height: 130px !important;
}

.height-140 {
  height: 140px !important;
}

.height-150 {
  height: 150px !important;
}

.height-155 {
  height: 155px !important;
}

.height-170 {
  height: 170px !important;
}

.height-180 {
  height: 180px !important;
}

.height-200 {
  height: 200px !important;
}

.height-230 {
  height: 230px !important;
}

.height-250 {
  height: 250px !important;
}

.height-280 {
  height: 280px !important;
}

.height-300 {
  height: 300px !important;
}

.height-320 {
  height: 320px !important;
}

.height-330 {
  height: 330px !important;
}

.height-340 {
  height: 340px !important;
}

.height-350 {
  height: 350px !important;
}

.height-360 {
  height: 360px !important;
}

.width-200 {
  width: 200px !important;
}

.vertical-align-bottom {
  vertical-align: bottom;
}

.vertical-align-middle {
  vertical-align: middle;
}

.rate .value {
  font-size: 30px;
  font-weight: 600;
}

.rate i {
  vertical-align: middle;
  padding-bottom: 15px;
}

.rate .percentage {
  vertical-align: middle;
  font-size: 15px;
  padding-bottom: 15px;
}

.rate img {
  display: block;
  position: relative;
  width: 100%;
}

.overlayer {
  display: block;
  position: absolute;
  z-index: 101;
  background-image: linear-gradient(rgba(0, 0, 0, 0) 0px, #000000 100%);
  opacity: 1;
}

.overlayer.fullwidth {
  width: 100%;
}

.overlayer .overlayer-wrapper {
  display: block;
  position: relative;
  z-index: 100;
}

.bottom-left {
  bottom: 0;
  left: 0;
  position: absolute;
}

.tags {
  display: inline-block;
  background: #C2C6CD;
  color: #ffffff !important;
  text-decoration: none;
  cursor: pointer;
  margin: 0 0 10px 18px;
  padding: 2px 10px 1px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  position: relative;
  transition: all .25s linear;
  white-space: nowrap;
  line-height: 21px;
}

.tags:before {
  content: "";
  border-style: solid;
  border-color: transparent #c5c5c5 transparent transparent;
  border-width: 12px 13px 12px 0;
  position: absolute;
  left: -13px;
  top: 0;
  transition: all .25s linear;
}

.tags:hover {
  background-color: #8B91A0;
  color: #FFFFFF;
}

.tags:hover:before {
  border-color: transparent #8B91A0 transparent transparent;
}

.tags:after {
  background: none repeat scroll 0 0 #FFFFFF;
  border-radius: 50% 50% 50% 50%;
  content: "";
  height: 5px;
  left: -1px;
  position: absolute;
  top: 10px;
  width: 5px;
}

.tooltip-notification {
  cursor: pointer;
  right: 0;
  margin-top: 3px;
  padding: 5px 0;
  position: absolute;
  top: 25px;
  z-index: 10000;
}

.toolbar .tooltip-notification {
  top: 60px;
  right: 20px;
}

.tooltip-notification .tooltip-notification-arrow {
  border-width: 0 5px 5px;
  left: 80%;
  margin-left: -5px;
  top: 0;
  border-color: transparent;
  border-bottom-color: #292B2E;
  border-style: solid;
  height: 0;
  position: absolute;
  width: 0;
}

.tooltip-notification .tooltip-notification-inner {
  background-color: #292B2E;
  border-radius: 4px;
  color: #FFFFFF;
  font-size: 12px;
  padding: 8px;
  text-align: center;
  text-decoration: none;
  line-height: normal;
}

.tooltip-notification .tooltip-notification-inner .message {
  color: #BFC0C1;
  font-size: 11px;
  margin-top: -4px;
}

.tooltip-notification .tooltip-notification-inner>div {
  width: 100px;
}

.background-dark {
  background: rgba(0, 0, 0, 0.2);
}

.background-light {
  background: rgba(255, 255, 255, 0.6) !important;
}

.stack-right-bottom {
  left: auto !important;
  right: -0.5em !important;
  top: auto !important;
  bottom: -0.5em !important;
  text-shadow: 2px 0 0 #fff, -2px 0 0 #fff, 0 2px 0 #fff, 0 -2px 0 #fff, 1px 1px #fff, -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff;
}

.noTransform {
  -o-transform: none !important;
  -moz-transform: none !important;
  -ms-transform: none !important;
  -webkit-transform: none !important;
  transform: none !important;
}

.switch-menu {
  position: fixed;
  right: -1px;
  top: 200px;
  width: 30px;
  padding: 4px;
  border-radius: 6px 0 0 6px;
  box-shadow: 1px 1px 1px 2px rgba(0, 0, 0, 0.1);
  background: #fff;
  border: 1px solid #c7c7c7;
  border-right: none;
}

.switch-menu-left-main {
  position: relative;
}

.switch-menu-left {
  left: 0;
  position: absolute;
  top: 185px;
  width: 50px;
  height: 50px;
  padding: 0 4px;
  border-radius: 0 6px 6px 0;
  box-shadow: 1px 1px 1px 2px rgba(0, 0, 0, 0.1);
  background: #fff;
  border: 1px solid #c7c7c7;
  border-right: none;
  z-index: 999;
  font-size: 12px;
  text-align: center;
}

.switch-menu-left .switch-menu-button {
  color: #0eab5f;
  font-size: 20px;
  margin-top: 0px;
}

.switch-menu-left p {
  margin: 0;
}

.switch-menu .btn,
.switch-menu .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .switch-menu .ag-paging-button {
  padding: 2px;
  color: #b3b3b3;
}

.switch-menu .btn:hover,
.switch-menu .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .switch-menu .ag-paging-button:hover {
  color: #666666;
}

.switch-menu .active {
  color: #0c8f4f;
  box-shadow: none;
  cursor: default;
}

.switch-menu .active:hover {
  color: #0c8f4f;
}

@media (max-width: 767px) {
  .switch-menu {
    position: relative;
    right: auto;
    top: auto;
    border: none;
    width: 100%;
    text-align: right;
    box-shadow: none;
    border-bottom: 1px solid #d1d1d1;
  }

  .switch-menu .btn,
  .switch-menu .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
  .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .switch-menu .ag-paging-button {
    font-size: 20px;
  }
}

.product-column-wrap {
  position: relative;
}

.product-column-wrap .product-column {
  padding: 5px;
}

.product-column-wrap .product-column .item-box {
  min-width: 195px;
  max-width: 260px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  margin: 5px;
  padding: 10px;
  padding-bottom: 12px;
  border: 3px solid transparent;
  border-radius: 10px;
  background: whitesmoke;
  display: inline-block;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  -webkit-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
}

.product-column-wrap .product-column .item-box:hover {
  background: #e6e6e6;
}

.product-column-wrap .product-column .item-box.focus {
  background: #e6e6e6;
  border: 3px solid #fdc07f;
}

@media (max-width: 767px) {
  .product-column-wrap .product-column .item-box {
    min-width: 100%;
    max-width: none;
    width: 100%;
    margin: 5px 0;
  }
}

.product-column-wrap .product-column .item-box .title {
  font-size: 15px;
  color: #333333;
  font-weight: bold;
  margin: 0 0 10px;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  padding: 5px;
}

.product-column-wrap .product-column .item-box .pic {
  width: 100%;
  padding: 10px;
  background: #fff;
  height: 140px;
  overflow: hidden;
  margin-bottom: 8px;
}

.product-column-wrap .product-column .item-box .pic img {
  max-width: 100%;
  max-height: 120px;
}

.product-column-wrap .product-column .item-box .product-info {
  margin: 10px 0;
}

.product-column-wrap .product-column .item-box .product-price,
.product-column-wrap .product-column .item-box .product-stock {
  font-size: 12px;
  color: #a6a6a6;
  line-height: 1;
  letter-spacing: 0;
}

.product-column-wrap .product-column .item-box .product-price span,
.product-column-wrap .product-column .item-box .product-stock span {
  color: #000;
  font-weight: bold;
  margin-left: 4px;
}

.product-column-wrap .product-column .item-box .product-number {
  color: #a6a6a6;
  font-size: 12px;
  padding-top: 3px;
  width: calc(100% - 75px);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (min-width: 1781px) {
  body:not(.sidebar-close) .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)):not(:nth-child(9)):not(:nth-child(10)):not(:nth-child(11)):not(:nth-child(12)):not(:nth-child(13)):not(:nth-child(14)) {
    display: none;
  }
}

@media (max-width: 1780px) {
  body:not(.sidebar-close) .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)):not(:nth-child(9)):not(:nth-child(10)):not(:nth-child(11)):not(:nth-child(12)) {
    display: none;
  }
}

@media (max-width: 1550px) {
  body:not(.sidebar-close) .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)):not(:nth-child(9)):not(:nth-child(10)) {
    display: none;
  }
}

@media (max-width: 1340px) {
  body:not(.sidebar-close) .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)) {
    display: none;
  }
}

@media (max-width: 1160px) {
  body:not(.sidebar-close) .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)) {
    display: none;
  }
}

@media (min-width: 1781px) {
  body.sidebar-close .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)):not(:nth-child(9)):not(:nth-child(10)):not(:nth-child(11)):not(:nth-child(12)):not(:nth-child(13)):not(:nth-child(14)):not(:nth-child(15)):not(:nth-child(16)) {
    display: none;
  }
}

@media (max-width: 1780px) {
  body.sidebar-close .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)):not(:nth-child(9)):not(:nth-child(10)):not(:nth-child(11)):not(:nth-child(12)):not(:nth-child(13)):not(:nth-child(14)) {
    display: none;
  }
}

@media (max-width: 1550px) {
  body.sidebar-close .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)):not(:nth-child(9)):not(:nth-child(10)):not(:nth-child(11)):not(:nth-child(12)) {
    display: none;
  }
}

@media (max-width: 1340px) {
  body.sidebar-close .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)):not(:nth-child(9)):not(:nth-child(10)) {
    display: none;
  }
}

@media (max-width: 1160px) {
  body.sidebar-close .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)):not(:nth-child(7)):not(:nth-child(8)) {
    display: none;
  }
}

@media (max-width: 767px) {
  body.sidebar-close .product-column-wrap .product-column .item-box:not(:nth-child(1)):not(:nth-child(2)):not(:nth-child(3)):not(:nth-child(4)):not(:nth-child(5)):not(:nth-child(6)) {
    display: none;
  }
}

.productNumber-column-wrap {
  position: relative;
}

.productNumber-column-wrap .productNumber-column {
  padding: 5px;
}

.productNumber-column-wrap .productNumber-column .item-box {
  min-width: 195px;
  max-width: 260px;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  text-align: center;
  margin: 5px;
  padding: 10px;
  padding-bottom: 12px;
  border: 3px solid transparent;
  border-radius: 10px;
  cursor: pointer;
  display: inline-block;
  -moz-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  -webkit-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  background: rgba(116, 243, 181, 0.2);
}

.productNumber-column-wrap .productNumber-column .item-box .icon {
  color: rgba(94, 193, 145, 0.4);
}

.productNumber-column-wrap .productNumber-column .item-box:hover,
.productNumber-column-wrap .productNumber-column .item-box.focus {
  background: rgba(69, 239, 156, 0.4);
}

.productNumber-column-wrap .productNumber-column .item-box.focus {
  border: 3px solid #13e47e;
}

.productNumber-column-wrap .productNumber-column .item-box:nth-child(even) {
  background: rgba(253, 197, 137, 0.2);
}

.productNumber-column-wrap .productNumber-column .item-box:nth-child(even) .icon {
  color: rgba(235, 196, 155, 0.4);
}

.productNumber-column-wrap .productNumber-column .item-box:nth-child(even):hover,
.productNumber-column-wrap .productNumber-column .item-box:nth-child(even).focus {
  background: rgba(253, 197, 137, 0.4);
}

.productNumber-column-wrap .productNumber-column .item-box:nth-child(even).focus {
  border: 3px solid #fdbb74;
}

.productNumber-column-wrap .productNumber-column .item-box.create {
  background: rgba(255, 223, 227, 0.5);
}

.productNumber-column-wrap .productNumber-column .item-box.create .icon {
  color: rgba(238, 189, 195, 0.6);
}

.productNumber-column-wrap .productNumber-column .item-box.create:hover,
.productNumber-column-wrap .productNumber-column .item-box.create.focus {
  background: rgba(255, 203, 209, 0.6);
}

.productNumber-column-wrap .productNumber-column .item-box.create.focus {
  border: 3px solid #ffa2ae;
}

@media (max-width: 767px) {
  .productNumber-column-wrap .productNumber-column .item-box {
    min-width: 100%;
    max-width: none;
    width: 100%;
    margin: 5px 0;
  }
}

.productNumber-column-wrap .productNumber-column .item-box .number {
  font-size: 18px;
  color: #333333;
  padding: 5px;
  margin: 0;
  font-family: Helvetica;
  height: 35px;
}

.productNumber-column-wrap .productNumber-column .item-box .icon {
  padding: 0;
  font-size: 76px;
}

.productNumber-column-wrap .productNumber-column .item-box .icon i {
  line-height: 1;
  height: 90px;
  overflow: hidden;
  display: block;
}

.productNumber-column-wrap .productNumber-column .item-box .name {
  color: #333333;
  font-size: 18px;
  padding-top: 3px;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@media (min-width: 1781px) {
  body:not(.sidebar-close) .productNumber-column .item-box:not(:nth-child(-n + 14)) {
    display: none;
  }
}

@media (max-width: 1780px) {
  body:not(.sidebar-close) .productNumber-column .item-box:not(:nth-child(-n + 12)) {
    display: none;
  }
}

@media (max-width: 1550px) {
  body:not(.sidebar-close) .productNumber-column .item-box:not(:nth-child(-n + 10)) {
    display: none;
  }
}

@media (max-width: 1366px) {
  body:not(.sidebar-close) .productNumber-column .item-box:not(:nth-child(-n + 10)) {
    display: none;
  }
}

@media (max-width: 1280px) {
  body:not(.sidebar-close) .productNumber-column .item-box:not(:nth-child(-n + 8)) {
    display: none;
  }
}

@media (max-width: 1160px) {
  body:not(.sidebar-close) .productNumber-column .item-box:not(:nth-child(-n + 6)) {
    display: none;
  }
}

@media (max-width: 640px) {
  body:not(.sidebar-close) .productNumber-column .item-box:not(:nth-child(-n + 4)) {
    display: none;
  }
}

@media (min-width: 1781px) {
  body.sidebar-close .productNumber-column .item-box:not(:nth-child(-n + 16)) {
    display: none;
  }
}

@media (max-width: 1780px) {
  body.sidebar-close .productNumber-column .item-box:not(:nth-child(-n + 14)) {
    display: none;
  }
}

@media (max-width: 1550px) {
  body.sidebar-close .productNumber-column .item-box:not(:nth-child(-n + 12)) {
    display: none;
  }
}

@media (max-width: 1366px) {
  body.sidebar-close .productNumber-column .item-box:not(:nth-child(-n + 10)) {
    display: none;
  }
}

@media (max-width: 1160px) {
  body.sidebar-close .productNumber-column .item-box:not(:nth-child(-n + 8)) {
    display: none;
  }
}

@media (max-width: 920px) {
  body.sidebar-close .productNumber-column .item-box:not(:nth-child(-n + 6)) {
    display: none;
  }
}

@media (max-width: 640px) {
  body.sidebar-close .productNumber-column .item-box:not(:nth-child(-n + 4)) {
    display: none;
  }
}

.transparent-bg {
  background: none;
}

.bg-grey {
  background: #999;
}

.bg-light-grey {
  background: rgba(153, 153, 153, 0.12);
}

.bg-lighter-grey {
  background: rgba(153, 153, 153, 0.08);
}

.bg-dark-grey {
  background-color: gray;
}

.bg-main {
  background: #0c8f4f;
}

.bg-white {
  background: #fff;
}

.bg-red {
  background: #e66b6b;
}

.bg-blue {
  background: #00869e;
}

.bg-blue2 {
  background: #0089c2;
}

.bg-orange {
  background: #fc9424;
}

.bg-green {
  background: #1FBBA6;
}

.bg-purple {
  background: #804C75;
}

.bg-azure {
  background: #00adb8;
}

.bg-yellow {
  background: #FFB848;
}

.bg-beige {
  background: #cc9;
}

html,
body {
  position: relative;
  width: 100%;
  /* overflow-x: hidden; */
}

body.sidebar-mobile-open {
  overflow: hidden;
  overflow-y: scroll;
}

body {
  color: #333333;
  direction: ltr;
  font-family: "微軟正黑體", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 14px;
  font-smoothing: antialiased;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding: 0;
  margin: 0;
  background: #fff;
  height: 100%;
}

::-moz-selection {
  background: #0c8f4f;
  text-shadow: none;
  color: #ffffff;
}

::selection {
  background: #0c8f4f;
  text-shadow: none;
  color: #ffffff;
}

a,
a:focus,
a:hover,
a:active {
  outline: 0 !important;
  text-decoration: none !important;
}

a {
  color: #0ea75c;
}

a:hover,
a:focus,
a:active {
  color: #064828;
}

.text-bold h1,
h1.text-bold,
h1 .text-bold,
.text-bold h2,
h2.text-bold,
h2 .text-bold,
.text-bold h3,
h3.text-bold,
h3 .text-bold,
.text-bold h4,
h4.text-bold,
h4 .text-bold {
  font-weight: 800;
}

.main-wrapper {
  position: relative;
}

.main-wrapper>.inner-transform {
  -ms-transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.ajax-white-backdrop {
  background-color: rgba(255, 255, 255, 0.5);
  display: none;
  bottom: 0;
  left: 0;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1049;
}

.ajax-white-backdrop:before {
  background: #000;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 5px;
  top: 60px;
  left: 50%;
  margin-left: -20px;
  content: "";
  position: absolute;
}

.ajax-white-backdrop:after {
  content: "\f110";
  font-family: FontAwesome;
  width: 40px;
  height: 40px;
  line-height: 40px;
  top: 60px;
  color: #ffffff;
  text-align: center;
  position: absolute;
  left: 50%;
  margin-left: -20px;
  -webkit-animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}

.img-responsive {
  width: 100%;
  height: auto;
}

.img-responsive-max {
  max-width: 100%;
  height: auto;
}

.notice {
  display: inline-block;
  letter-spacing: 0;
  /* width: 30em !important; */
  width: 26em !important;
  white-space: normal;
  position: absolute;
  margin-left: 2em;
  vertical-align: top;
  border-radius: 8px;
  padding: 1.3em;
  padding-left: 90px !important;
  font-size: 16px;
  color: #000000;
  z-index: 99999;
}

/*
.alert-warning-style2 .dialog {
  font-size: 27px;
  padding-top: 14px;
  width: 80px;
  height: 80px;
} */
.notice .dialog {
  margin-top: 7px;
  /* margin-top: 20px; */
  padding-top: 20px !important;
  left: 10px;
}


.alert-warning-style2.notice .dialog:before {
  border: 15px solid transparent;
  margin: auto -25px auto auto;
  border-left-color: #ff6600;
}


.alert-warning-style3.alert-warning {
  background: #e6f9f9;
  border: none;
  width: 23em !important;
  padding: 20px !important;
  margin-top: 15px;
}

.notice-circle {
  background: #f56c6c;
  border-radius: 10px;
  display: inline-block;
  color: #fff;
  padding: 0 9px;
  border-radius: 50%;
  width: 45px;
  height: 45px;
  font-size: 28px;
  position: absolute;
  left: -22px;
  top: -22px;
}

.notice-circle i {
  position: relative !important;
}

span.notice-main {
  display: block;
  background: #fff;
  text-align: center;
  padding: 5px 0;
  margin-bottom: 10px;
  color: #0cc1c7;
  font-size: 19px;
  font-weight: bold;
}

.notice-azure-link {
  color: #0cc1ce;
}

.notice-azure-link:hover {
  color: #0a9ea9;
}

.pointer {
  cursor: pointer;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.height-auto {
  height: auto !important;
}

.overflow-auto {
  overflow: auto;
}

.overflow-hidden {
  overflow: hidden;
}

.shadow-none {
  -moz-box-shadow: none;
  -webkit-box-shadow: none;
  box-shadow: none;
}

@media (max-width: 767px) {
  .hight-auto-xs {
    height: auto !important;
  }
}

.block,
.show {
  display: block;
}

.inline {
  display: inline;
}

.inline-block {
  display: inline-block;
}

.no-display,
.hide {
  display: none;
}

@media (max-width: 767px) {

  .xs-hide,
  .hide-xs {
    display: none;
  }

  .xs-show,
  .show-xs {
    display: block;
  }

  .visible-inlineBlock-xs {
    display: inline-block !important;
  }
}

.no-border {
  border: none !important;
}

.border-none {
  border: none !important;
}

.border-lightGray-line {
  border: 1px solid #e6e6e6;
}

.no-border-top {
  border-top: none !important;
}

.no-border-right {
  border-right: none !important;
}

.no-border-bottom {
  border-bottom: none !important;
}

.no-border-left {
  border-left: none !important;
}

.border-right {
  border-right-style: solid;
  border-right-width: 1px;
  border-color: inherit;
}

.border-left {
  border-left-style: solid;
  border-left-width: 1px;
  border-color: inherit;
}

.border-top {
  border-top-style: solid;
  border-top-width: 1px;
  border-color: inherit;
}

.border-bottom {
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-color: inherit;
}

.border-light {
  border-color: rgba(255, 255, 255, 0.2) !important;
}

.panel-white .border-light,
.partition-white .border-light {
  border-color: rgba(0, 0, 0, 0.1) !important;
}

.border-dark {
  border-color: rgba(0, 0, 0, 0.2);
}

.border-lightGray {
  border-color: rgba(0, 0, 0, 0.1);
}

.panel-white .border-dark,
.partition-white .border-dark {
  border-color: rgba(0, 0, 0, 0.3) !important;
}

.no-radius {
  border-radius: 0 !important;
}

.float-none {
  float: none;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

.no-padding {
  padding: 0 !important;
}

.LR-no-padding {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.LR-padding-2 {
  padding-left: 2px !important;
  padding-right: 2px !important;
}

.LR-padding-8 {
  padding-left: 8px !important;
  padding-right: 8px !important;
}

.padding-top-0 {
  padding-top: 0px !important;
}

.padding-top-3 {
  padding-top: 3px !important;
}

.padding-top-5 {
  padding-top: 5px !important;
}

.padding-top-8 {
  padding-top: 8px !important;
}

.padding-top-10 {
  padding-top: 10px !important;
}

.padding-top-15 {
  padding-top: 15px !important;
}

.padding-top-20 {
  padding-top: 20px !important;
}

.padding-top-80 {
  padding-top: 80px !important;
}

.padding-left-0 {
  padding-left: 0 !important;
}

.padding-left-2 {
  padding-left: 2px !important;
}

.padding-left-4 {
  padding-left: 4px !important;
}

.padding-left-5 {
  padding-left: 5px !important;
}

.padding-left-10 {
  padding-left: 10px !important;
}

.padding-left-15 {
  padding-left: 15px !important;
}

.padding-left-20 {
  padding-left: 20px !important;
}

.padding-right-0 {
  padding-right: 0px !important;
}

.padding-right-2 {
  padding-right: 2px !important;
}

.padding-right-4 {
  padding-right: 4px !important;
}

.padding-right-5 {
  padding-right: 5px !important;
}

.padding-right-10 {
  padding-right: 10px !important;
}

.padding-right-15 {
  padding-right: 15px !important;
}

.padding-right-20 {
  padding-right: 20px !important;
}

.padding-2 {
  padding: 2px;
}

.padding-5 {
  padding: 5px;
}

.padding-10 {
  padding: 10px;
}

.padding-15 {
  padding: 15px;
}

.padding-20 {
  padding: 20px;
}

.padding-horizontal-5 {
  padding: 0 5px;
}

.padding-horizontal-10 {
  padding: 0 10px;
}

.padding-horizontal-15 {
  padding: 0 15px;
}

.padding-horizontal-20 {
  padding: 0 20px;
}

.padding-vertical-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.padding-vertical-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}

.padding-vertical-15 {
  padding-top: 15px;
  padding-bottom: 15px;
}

.padding-vertical-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.padding-bottom-5 {
  padding-bottom: 5px;
}

.padding-bottom-10 {
  padding-bottom: 10px;
}

.padding-bottom-15 {
  padding-bottom: 15px;
}

@media (max-width: 767px) {
  .xs-no-padding {
    padding: 0 !important;
  }

  .xs-LR-no-padding {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .xs-no-padding-right {
    padding-right: 0 !important;
  }

  .xs-no-padding-left {
    padding-left: 0 !important;
  }

  .xs-padding-right-4 {
    padding-right: 4px !important;
  }

  .xs-padding-left-4 {
    padding-left: 4px !important;
  }

  .xs-LR-padding-4 {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
}

.margin-left-auto {
  margin-left: auto;
}

.margin-right-auto {
  margin-right: auto;
}

.no-margin {
  margin: 0 !important;
}

.LR-no-margin {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.margin-y-10 {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

.LR-margin-4 {
  margin-left: 4px !important;
  margin-right: 4px !important;
}

.margin-center {
  margin: 0 auto;
}

.sec-line-margin-left {
  margin-left: 64px;
}

@media (max-width: 768px) {
  .xs-margin-center {
    margin: 0 auto;
  }
}

.margin-5 {
  margin: 5px !important;
}

.margin-10 {
  margin: 10px !important;
}

.margin-15 {
  margin: 15px !important;
}

.margin-20 {
  margin: 20px !important;
}

.margin-top-0 {
  margin-top: 0 !important;
}

.margin-top-5 {
  margin-top: 5px !important;
}

.margin-top-10 {
  margin-top: 10px !important;
}

.margin-top-15 {
  margin-top: 15px !important;
}

.margin-top-20 {
  margin-top: 20px !important;
}

.margin-top-25 {
  margin-top: 25px !important;
}

.margin-top-30 {
  margin-top: 30px !important;
}

.margin-top-50 {
  margin-top: 50px !important;
}

.margin-bottom-5 {
  margin-bottom: 5px !important;
}

.margin-bottom-10 {
  margin-bottom: 10px !important;
}

.margin-bottom-15 {
  margin-bottom: 15px !important;
}

.margin-bottom-20 {
  margin-bottom: 20px !important;
}

.margin-bottom-30 {
  margin-bottom: 30px !important;
}

.margin-bottom-40 {
  margin-bottom: 40px !important;
}

.margin-bottom-50 {
  margin-bottom: 50px !important;
}

.margin-left-4 {
  margin-left: 4px !important;
}

.margin-left-5 {
  margin-left: 5px !important;
}

.margin-left-10 {
  margin-left: 10px !important;
}

.margin-left-15 {
  margin-left: 15px !important;
}

.margin-left-20 {
  margin-left: 20px !important;
}

.margin-left-30 {
  margin-left: 30px !important;
}


.margin-right-0 {
  margin-right: 0 !important;
}

.margin-right-4 {
  margin-right: 4px !important;
}

.margin-right-5 {
  margin-right: 5px !important;
}

.margin-right-10 {
  margin-right: 10px !important;
}

.margin-right-15 {
  margin-right: 15px !important;
}

.margin-right-20 {
  margin-right: 20px !important;
}

.margin-right-23 {
  margin-right: 23px !important;
}

.margin-right-30 {
  margin-right: 30px !important;
}

.margin-right-35 {
  margin-right: 35px !important;
}

.margin-right-45 {
  margin-right: 45px !important;
}

@media (max-width: 767px) {
  .xs-no-margin {
    margin: 0 !important;
  }

  .xs-LR-no-margin {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .xs-no-margin-right {
    margin-right: 0 !important;
  }

  .xs-no-margin-left {
    margin-left: 0 !important;
  }

  .xs-margin-right-4 {
    margin-right: 4px !important;
  }

  .xs-margin-left-4 {
    margin-left: 4px !important;
  }
}

.no-radius {
  -moz-border-radius: 0 !important;
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important;
}

.no-radius-left {
  -moz-border-radius: 0 3px 3px 0 !important;
  -webkit-border-radius: 0 3px 3px 0 !important;
  border-radius: 0 3px 3px 0 !important;
}

.circle-100 {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  display: inline-block;
  -moz-box-shadow: 0, 1px, 2px, #C3C3C3;
  -webkit-box-shadow: 0, 1px, 2px, #C3C3C3;
  box-shadow: 0, 1px, 2px, #C3C3C3;
}

.circle-50 {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  line-height: 55px;
  text-align: center;
  display: inline-block;
  -moz-box-shadow: 0, 1px, 2px, #C3C3C3;
  -webkit-box-shadow: 0, 1px, 2px, #C3C3C3;
  box-shadow: 0, 1px, 2px, #C3C3C3;
}

.radius-3 {
  border-radius: 3px !important;
}

.radius-5 {
  border-radius: 5px !important;
}

.radius-10 {
  border-radius: 10px !important;
}

.radius-50 {
  border-radius: 50px !important;
}

.text-italic {
  font-style: italic;
}

.text-bold {
  font-weight: bold;
}

.text-line-heigh {
  line-height: 1.6;
}

.text-normal {
  font-size: 15px !important;
}

.text-extra-small {
  font-size: 11px !important;
}

.text-small {
  font-size: 12px !important;
}

.text-large {
  font-size: 17px !important;
}

.text-extra-large {
  font-size: 19px !important;
}

h1.text-extra-large {
  font-size: 50px !important;
}

.text-main {
  color: #0c8f4f;
}

.text-main:hover {
  color: #0c8f4f;
}

.text-light-grey {
  color: rgba(153, 153, 153, 0.4);
}

.text-azure {
  color: #00adb8;
}

.text-orange {
  color: #fc9424;
}

.text-orange-dark {
  color: #ff6600;
}

.text-black {
  color: #333333;
}

.text-green {
  color: #1FBBA6;
}

.text-blue {
  color: #105698;
}

.text-blue:hover {
  color: #105698;
}

.text-red {
  color: #ed5454;
}

.text-pink {
  color: #DD5A82;
}

.text-purple {
  color: #DD5A82;
}

.text-bricky {
  color: #894550;
}

.text-yellow {
  color: #FFB848;
}

.text-white {
  color: #ffffff;
}

a.text-white {
  color: rgba(255, 255, 255, 0.6);
}

a.text-white:hover {
  color: #ffffff;
}

.text-dark {
  color: rgba(59, 60, 65, 0.4);
}

a.text-dark:hover {
  color: rgba(59, 60, 65, 0.6);
}

.text-light {
  color: rgba(255, 255, 255, 0.6);
}

a.text-light:hover {
  color: rgba(255, 255, 255, 0.8);
}

.text-center,
.center {
  text-align: center;
}

.text-left {
  text-align: left;
}

.text-right {
  text-align: right;
}

@media (max-width: 767px) {

  .text-center-xs,
  .center-xs {
    text-align: center;
  }

  .text-left-xs {
    text-align: left;
  }

  .text-right-xs {
    text-align: right;
  }
}

.badge-new-style1 {
  transform: translateY(-2px) rotate(-6deg);
  color: #e66b6b;
  font-size: 13px;
  background: transparent;
  padding: 3px;
  padding-left: 6px;
}

.badge-new-style2 {
  transform: translateY(-2px) rotate(-6deg);
  color: #e66b6b;
  font-size: 13px;
  background: transparent;
  padding: 3px;
  padding-left: 6px;
}

.text-underLine-light-grey {
  padding-bottom: 6px;
  position: relative;
  border-bottom: 1px solid rgba(153, 153, 153, 0.3);
}

.text-underLine-grey {
  padding-bottom: 6px;
  position: relative;
  border-bottom: 1px solid #999;
}

.text-underLine-main {
  padding-bottom: 6px;
  position: relative;
  border-bottom: 1px solid #0c8f4f;
}

.text-underLine-right {
  position: absolute;
  right: 0;
  bottom: 6px;
  font-size: 15px;
  color: #333333;
  font-weight: normal;
}

.text-inline-block {
  position: relative;
  display: table;
}

.text-inline-block>* {
  display: table-cell;
}

.text-inline-block label {
  white-space: nowrap !important;
  padding-right: 5px;
}

.panel-white .text-light,
.partition-white .text-light {
  color: rgba(0, 0, 0, 0.3) !important;
}

.panel-white a.text-light:hover,
.partition-white a.text-light:hover {
  color: rgba(0, 0, 0, 0.5) !important;
}

.whs-nowrap {
  white-space: nowrap !important;
}

.whs-normal {
  white-space: normal !important;
}

@media (max-width: 767px) {
  .xs-whs-nowrap {
    white-space: nowrap !important;
  }

  .xs-whs-normal {
    white-space: normal !important;
  }
}

.line-caption {
  display: table;
  white-space: nowrap;
  text-align: center;
  width: 100%;
  color: #0c8f4f;
}

.line-caption:after,
.line-caption:before {
  border-top: 1px solid #0c8f4f;
  content: '';
  display: table-cell;
  position: relative;
  top: .6em;
  width: 45%;
}

.line-caption:before {
  right: 1.5%;
}

.line-caption:after {
  left: 1.5%;
}

.box-border {
  border: 5px solid #0c8f4f;
  position: relative;
  margin-top: 30px;
  margin-bottom: 20px;
}

.box-border .title {
  color: #0c8f4f;
  display: inline-block;
  background: #fff;
  font-weight: bold;
  padding: 5px 10px;
  text-align: center;
  position: relative;
  top: -40px;
}

.box-border .content {
  position: relative;
  top: -28px;
}

.box-border-style02 {
  border: 2px solid #0c8f4f;
  position: relative;
  margin: 5px 0 10px;
}

.box-border-style02 .content {
  padding: 15px 20px;
}

.box-border-style02 .row {
  min-height: 0px;
  position: relative;
  top: 4px;
}

@media (max-width: 767px) {
  h3.separate-rwd {
    padding-bottom: 50px;
  }
}

.btn-soft-main {
  background-color: rgba(12, 143, 79, 0.25);
  color: #04311b;
}

.btn-soft-main:hover,
.btn-soft-main:focus,
.btn-soft-main:active,
.btn-soft-main.active {
  background-color: #0c8f4f;
  color: #ffffff;
}

.btn-soft-orange {
  background-color: rgba(252, 148, 36, 0.25);
  color: #b76003;
}

.btn-soft-orange:hover,
.btn-soft-orange:focus,
.btn-soft-orange:active,
.btn-soft-orange.active {
  background-color: #fc9424;
  color: #ffffff;
}

.btn-soft-green {
  background-color: rgba(31, 187, 166, 0.25);
  color: #106458;
}

.btn-soft-green:hover,
.btn-soft-green:focus,
.btn-soft-green:active,
.btn-soft-green.active {
  background-color: #1fbba6;
  color: #ffffff;
}

.btn-soft-red {
  background-color: rgba(230, 107, 107, 0.25);
  color: #c92222;
}

.btn-soft-red:hover,
.btn-soft-red:focus,
.btn-soft-red:active,
.btn-soft-red.active {
  background-color: #e25151;
  color: #ffffff;
}

.btn-soft-default {
  background-color: rgba(153, 153, 153, 0.25);
  color: #666666;
}

.btn-soft-default:hover,
.btn-soft-default:focus,
.btn-soft-default:active,
.btn-soft-default.active {
  background-color: #999999;
  color: #ffffff;
}

.btn-soft-blue {
  background-color: rgba(0, 134, 158, 0.25);
  color: #002f38;
}

.btn-soft-blue:hover,
.btn-soft-blue:focus,
.btn-soft-blue:active,
.btn-soft-blue.active {
  background-color: #00869e;
  color: #ffffff;
}

.btn-soft-azure {
  background-color: rgba(0, 173, 184, 0.25);
  color: #004d52;
}

.btn-soft-azure:hover,
.btn-soft-azure:focus,
.btn-soft-azure:active,
.btn-soft-azure.active {
  background-color: #00adb8;
  color: #ffffff;
}

/* ---------------------------------------------------------------------- */
/*  Buttons
/* ---------------------------------------------------------------------- */
span.new-tag {
  position: absolute;
  top: -17px;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.new-tag-2 {
  position: absolute;
  top: 6px;
  left: 105px;
  z-index: 1;
  font-weight: bold;
  color: #e66b6b;
  font-size: 13px;
  background: transparent;
}

.new-tag-wrap {
  position: relative;
  display: inline-block;
}

@media (max-width: 1199px) {
  .new-tag-btnWrap {
    margin-top: 10px;
  }
}

.sidebar-close .beta-wrap a {
  padding: 20px 5px 10px !important;
}

.beta-wrap .beta-tag {
  font-size: 11px;
  background: #ff6360;
  color: #fff;
  font-weight: 600;
  position: absolute;
  right: 45px;
  top: 16px;
  border-radius: 5px;
  padding: 1px 5px;

}

.sidebar-close .beta-wrap .beta-tag {
  right: 0;
  top: 0;
  border-radius: 5px;
  border-radius: 0 0 0 3px;
}

.beta-wrap a {
  padding: 10px 15px !important;
}





.btn,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button {
  transition: all 0.3s ease 0s !important;
  border-radius: 4px;
  outline: none !important;
}

.btn .material-icons,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button .material-icons {
  position: relative;
  top: 3px;
  font-size: 120%;
  line-height: .8;
}

.btn-xs.tooltips .material-icons {
  left: -2.5px;
}

.btn-inside-big i {
  font-size: 16px;
  margin-left: -1.5px;
}

.btn-only {
  display: inline-block;
  margin: 2px auto;
}

.action-vertical .ui-grid-cell-contents {
  display: flex;
  flex-direction: column;
  width: 30px;
  margin: 0 auto !important;
}


.btn-link:focus,
.btn-link:hover {
  text-decoration: underline !important;
}

.btn-default,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button {
  background-color: #ffffff;
  border: 1px solid #b3b3b3;
  color: #333333;
}

.btn-default.border-none,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .border-none.ag-paging-button {
  border: none;
}

.btn-default:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.btn-default:focus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:focus,
.btn-default:active,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:active,
.btn-default.active,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .active.ag-paging-button {
  background-color: #dbdbdb;
  border-color: gray;
}

.btn-default .caret,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button .caret {
  border-top-color: #b3b3b3;
}

.dropup .btn-default .caret,
.dropup .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button .caret,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .dropup .ag-paging-button .caret {
  border-bottom: 4px solid #b3b3b3;
}

.btn-default.disabled,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .disabled.ag-paging-button,
.btn-default[disabled],
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [disabled].ag-paging-button,
fieldset[disabled] .btn-default,
fieldset[disabled] .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel fieldset[disabled] .ag-paging-button {
  color: #a8a8a8;
}

.btn-default.disabled:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .disabled.ag-paging-button:hover,
.btn-default.disabled:focus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .disabled.ag-paging-button:focus,
.btn-default.disabled.focus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .disabled.focus.ag-paging-button,
.btn-default[disabled]:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [disabled].ag-paging-button:hover,
.btn-default[disabled]:focus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [disabled].ag-paging-button:focus,
.btn-default[disabled].focus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [disabled].focus.ag-paging-button,
fieldset[disabled] .btn-default:hover,
fieldset[disabled] .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel fieldset[disabled] .ag-paging-button:hover,
fieldset[disabled] .btn-default:focus,
fieldset[disabled] .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:focus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel fieldset[disabled] .ag-paging-button:focus,
fieldset[disabled] .btn-default.focus,
fieldset[disabled] .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .focus.ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel fieldset[disabled] .focus.ag-paging-button {
  background-color: #ffffff;
  border-color: #b3b3b3;
}

.btn-main {
  background-color: #0eab5f;
  border-color: #0c9452;
  color: #ffffff;
}

.btn-main:hover,
.btn-main:focus,
.btn-main:active,
.btn-main.active {
  background-color: #0c9452;
  border-color: #0a7c45;
  color: #ffffff;
}

.btn-main .caret {
  border-top-color: #ffffff;
}

.dropup .btn-main .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-main {
  background-color: #10be69;
  border-color: #0ea75c;
  color: #ffffff;
}

.btn-light-main:hover,
.btn-light-main:focus,
.btn-light-main:active,
.btn-light-main.active {
  background-color: #0ea75c;
  border-color: #0c8f4f;
  color: #ffffff;
}

.btn-light-main .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-main .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-main {
  background-color: #0a7742;
  border-color: #086035;
  color: #ffffff;
}

.btn-dark-main:hover,
.btn-dark-main:focus,
.btn-dark-main:active,
.btn-dark-main.active {
  background-color: #086035;
  border-color: #064828;
  color: #ffffff;
}

.btn-dark-main .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-main .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-transparent-main {
  background: none;
  border-color: rgba(12, 143, 79, 0.5);
  border-width: 1px;
  color: #0c8f4f !important;
}

.btn-transparent-main:hover,
.btn-transparent-main:focus,
.btn-transparent-main:active,
.btn-transparent-main.active {
  background-color: rgba(12, 143, 79, 0.1);
  border-color: rgba(12, 143, 79, 0.8);
}

.btn-transparent-main .caret {
  border-top-color: #ffffff;
}

.dropup .btn-transparent-main .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-transparent-main.btn-hover-none {
  cursor: default;
}

.btn-transparent-main.btn-hover-none:hover,
.btn-transparent-main.btn-hover-none:focus,
.btn-transparent-main.btn-hover-none:active,
.btn-transparent-main.btn-hover-none.active {
  background: none;
  color: #0c8f4f !important;
}

.btn-transparent-orange {
  background: none;
  border-color: rgba(252, 148, 36, 0.5);
  border-width: 1px;
  color: #fc9424 !important;
}

.btn-transparent-orange:hover,
.btn-transparent-orange:focus,
.btn-transparent-orange:active,
.btn-transparent-orange.active {
  background-color: rgba(252, 148, 36, 0.1);
  border-color: rgba(252, 148, 36, 0.8);
}

.btn-transparent-orange .caret {
  border-top-color: #ffffff;
}

.dropup .btn-transparent-orange .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-transparent-orange.btn-hover-none {
  cursor: default;
}

.btn-transparent-orange.btn-hover-none:hover,
.btn-transparent-orange.btn-hover-none:focus,
.btn-transparent-orange.btn-hover-none:active,
.btn-transparent-orange.btn-hover-none.active {
  background: none;
  color: #fc9424 !important;
}

.btn-azure {
  background-color: #00adb8;
  border-color: #00959f;
  color: #ffffff;
}

.btn-azure:hover,
.btn-azure:focus,
.btn-azure:active,
.btn-azure.active {
  background-color: #00959f;
  border-color: #007d85;
  color: #ffffff;
}

.btn-azure .caret {
  border-top-color: #ffffff;
}

.dropup .btn-azure .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-azure {
  background-color: #00c5d2;
  border-color: #00adb8;
  color: #ffffff;
}

.btn-light-azure:hover,
.btn-light-azure:focus,
.btn-light-azure:active,
.btn-light-azure.active {
  background-color: #00adb8;
  border-color: #00959f;
  color: #ffffff;
}

.btn-light-azure .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-azure .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-azure {
  background-color: #007d85;
  border-color: #00656c;
  color: #ffffff;
}

.btn-dark-azure:hover,
.btn-dark-azure:focus,
.btn-dark-azure:active,
.btn-dark-azure.active {
  background-color: #00656c;
  border-color: #004d52;
  color: #ffffff;
}

.btn-dark-azure .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-azure .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-blue {
  background-color: #00869e;
  border-color: #007085;
  color: #ffffff;
}

.btn-blue:hover,
.btn-blue:focus,
.btn-blue:active,
.btn-blue.active {
  background-color: #007085;
  border-color: #005b6b;
  color: #ffffff;
}

.btn-blue .caret {
  border-top-color: #ffffff;
}

.dropup .btn-blue .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-blue2 {
  background-color: #0089c2;
  border-color: #0077a9;
  color: #ffffff;
}

.btn-blue2:hover,
.btn-blue2:focus,
.btn-blue2:active,
.btn-blue2.active {
  background-color: #0077a9;
  border-color: #00658f;
  color: #ffffff;
}

.btn-blue2 .caret {
  border-top-color: #ffffff;
}

.dropup .btn-blue2 .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-blue {
  background-color: #00b1d1;
  border-color: #009cb8;
  color: #ffffff;
}

.btn-light-blue:hover,
.btn-light-blue:focus,
.btn-light-blue:active,
.btn-light-blue.active {
  background-color: #009cb8;
  border-color: #00869e;
  color: #ffffff;
}

.btn-light-blue .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-blue .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-blue {
  background-color: #005b6b;
  border-color: #004552;
  color: #ffffff;
}

.btn-dark-blue:hover,
.btn-dark-blue:focus,
.btn-dark-blue:active,
.btn-dark-blue.active {
  background-color: #004552;
  border-color: #002f38;
  color: #ffffff;
}

.btn-dark-blue .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-blue .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-green {
  background-color: #1FBBA6;
  border-color: #1ba593;
  color: #ffffff;
}

.btn-green:hover,
.btn-green:focus,
.btn-green:active,
.btn-green.active {
  background-color: #1ba593;
  border-color: #188f7f;
  color: #ffffff;
}

.btn-green .caret {
  border-top-color: #ffffff;
}

.dropup .btn-green .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-green {
  background-color: #30ddc6;
  border-color: #23d1b9;
  color: #ffffff;
}

.btn-light-green:hover,
.btn-light-green:focus,
.btn-light-green:active,
.btn-light-green.active {
  background-color: #23d1b9;
  border-color: #1fbba6;
  color: #ffffff;
}

.btn-light-green .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-green .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-green {
  background-color: #188f7f;
  border-color: #14796c;
  color: #ffffff;
}

.btn-dark-green:hover,
.btn-dark-green:focus,
.btn-dark-green:active,
.btn-dark-green.active {
  background-color: #14796c;
  border-color: #106458;
  color: #ffffff;
}

.btn-dark-green .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-green .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-orange {
  background-color: #fc9424;
  border-color: #fc880b;
  color: #ffffff;
}

.btn-orange:hover,
.btn-orange:focus,
.btn-orange:active,
.btn-orange.active {
  background-color: #fc880b;
  border-color: #ea7b03;
  color: #ffffff;
}

.btn-orange .caret {
  border-top-color: #ffffff;
}

.btn-bluepurple {
  background-color: #597dd5;
  /* border-color: #fc880b; */
  color: #ffffff;
}

.btn-bluepurple:hover,
.btn-bluepurple:focus,
.btn-bluepurple:active,
.btn-bluepurple.active {
  background-color: #4665b0;
  color: #ffffff;
}

.dropup .btn-orange .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-orange {
  background-color: #fdad56;
  border-color: #fca03d;
  color: #ffffff;
}

.btn-light-orange:hover,
.btn-light-orange:focus,
.btn-light-orange:active,
.btn-light-orange.active {
  background-color: #fca03d;
  border-color: #fc9424;
  color: #ffffff;
}

.btn-light-orange .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-orange .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-orange {
  background-color: #ea7b03;
  border-color: #d16e03;
  color: #ffffff;
}

.btn-dark-orange:hover,
.btn-dark-orange:focus,
.btn-dark-orange:active,
.btn-dark-orange.active {
  background-color: #d16e03;
  border-color: #b76003;
  color: #ffffff;
}

.btn-dark-orange .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-orange .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-red {
  background-color: #e66b6b;
  border-color: #e25555;
  color: #ffffff;
}

.btn-red:hover,
.btn-red:focus,
.btn-red:active,
.btn-red.active {
  background-color: #e25555;
  border-color: #df3f3f;
  color: #ffffff;
}

.btn-red .caret {
  border-top-color: #ffffff;
}

.dropup .btn-red .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-red {
  background-color: #ed9797;
  border-color: #ea8181;
  color: #ffffff;
}

.btn-light-red:hover,
.btn-light-red:focus,
.btn-light-red:active,
.btn-light-red.active {
  background-color: #ea8181;
  border-color: #e66b6b;
  color: #ffffff;
}

.btn-light-red .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-red .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-red {
  background-color: #df3f3f;
  border-color: #db2a2a;
  color: #ffffff;
}

.btn-dark-red:hover,
.btn-dark-red:focus,
.btn-dark-red:active,
.btn-dark-red.active {
  background-color: #db2a2a;
  border-color: #c92222;
  color: #ffffff;
}

.btn-dark-red .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-red .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-purple {
  background-color: #804C75;
  border-color: #704366;
  color: #ffffff;
}

.btn-purple:hover,
.btn-purple:focus,
.btn-purple:active,
.btn-purple.active {
  background-color: #704366;
  border-color: #603958;
  color: #ffffff;
}

.btn-purple .caret {
  border-top-color: #ffffff;
}

.dropup .btn-purple .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-purple {
  background-color: #a05f92;
  border-color: #905684;
  color: #ffffff;
}

.btn-light-purple:hover,
.btn-light-purple:focus,
.btn-light-purple:active,
.btn-light-purple.active {
  background-color: #905684;
  border-color: #804c75;
  color: #ffffff;
}

.btn-light-purple .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-purple .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-purple {
  background-color: #603958;
  border-color: #503049;
  color: #ffffff;
}

.btn-dark-purple:hover,
.btn-dark-purple:focus,
.btn-dark-purple:active,
.btn-dark-purple.active {
  background-color: #503049;
  border-color: #40263b;
  color: #ffffff;
}

.btn-dark-purple .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-purple .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-beige {
  background-color: #cc9;
  border-color: #c4c488;
  color: #ffffff;
}

.btn-beige:hover,
.btn-beige:focus,
.btn-beige:active,
.btn-beige.active {
  background-color: #c4c488;
  border-color: #bbbb77;
  color: #ffffff;
}

.btn-beige .caret {
  border-top-color: #ffffff;
}

.dropup .btn-beige .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-beige {
  background-color: #d5d5aa;
  border-color: #cccc99;
  color: #ffffff;
}

.btn-light-beige:hover,
.btn-light-beige:focus,
.btn-light-beige:active,
.btn-light-beige.active {
  background-color: #cccc99;
  border-color: #c4c488;
  color: #ffffff;
}

.btn-light-beige .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-beige .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-beige {
  background-color: #bbbb77;
  border-color: #b3b366;
  color: #ffffff;
}

.btn-dark-beige:hover,
.btn-dark-beige:focus,
.btn-dark-beige:active,
.btn-dark-beige.active {
  background-color: #b3b366;
  border-color: #aaaa55;
  color: #ffffff;
}

.btn-dark-beige .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-beige .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-yellow {
  background-color: #FFB848;
  border-color: #ffae2f;
  color: #ffffff;
}

.btn-yellow:hover,
.btn-yellow:focus,
.btn-yellow:active,
.btn-yellow.active {
  background-color: #ffae2f;
  border-color: #ffa415;
  color: #ffffff;
}

.btn-yellow .caret {
  border-top-color: #ffffff;
}

.dropup .btn-yellow .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-yellow {
  background-color: #ffcc7b;
  border-color: #ffc262;
  color: #ffffff;
}

.btn-light-yellow:hover,
.btn-light-yellow:focus,
.btn-light-yellow:active,
.btn-light-yellow.active {
  background-color: #ffc262;
  border-color: #ffb848;
  color: #ffffff;
}

.btn-light-yellow .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-yellow .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-yellow {
  background-color: #ffa415;
  border-color: #fb9900;
  color: #ffffff;
}

.btn-dark-yellow:hover,
.btn-dark-yellow:focus,
.btn-dark-yellow:active,
.btn-dark-yellow.active {
  background-color: #fb9900;
  border-color: #e18a00;
  color: #ffffff;
}

.btn-dark-yellow .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-yellow .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-grey {
  background-color: #999;
  border-color: #8c8c8c;
  color: #ffffff;
}

.btn-grey:hover,
.btn-grey:focus,
.btn-grey:active,
.btn-grey.active {
  background-color: #8c8c8c;
  border-color: gray;
  color: #ffffff;
}

.btn-grey .caret {
  border-top-color: #ffffff;
}

.dropup .btn-grey .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-light-grey {
  background-color: #b3b3b3;
  border-color: #a6a6a6;
  color: #ffffff;
}

.btn-light-grey:hover,
.btn-light-grey:focus,
.btn-light-grey:active,
.btn-light-grey.active {
  background-color: #a6a6a6;
  border-color: #999999;
  color: #ffffff;
}

.btn-light-grey .caret {
  border-top-color: #ffffff;
}

.dropup .btn-light-grey .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-dark-grey {
  background-color: gray;
  border-color: #737373;
  color: #ffffff;
}

.btn-dark-grey:hover,
.btn-dark-grey:focus,
.btn-dark-grey:active,
.btn-dark-grey.active {
  background-color: #737373;
  border-color: #666666;
  color: #ffffff;
}

.btn-dark-grey .caret {
  border-top-color: #ffffff;
}

.dropup .btn-dark-grey .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-blue-gray {
  background-color: #607d8b;
  border-color: #607d8b;
  color: #fff;
}

.btn-blue-gray:hover,
.btn-blue-gray:focus,
.btn-blue-gray:active,
.btn-blue-gray.active {
  background-color: #465b65;
  border-color: #465b65;
  color: #ffffff;
}

.btn-transparent-white {
  background: none;
  border-color: rgba(255, 255, 255, 0.6);
  border-width: 1px;
  color: #333 !important;
}

.btn-transparent-white:hover,
.btn-transparent-white:focus,
.btn-transparent-white:active,
.btn-transparent-white.active {
  background-color: rgba(59, 60, 65, 0.1);
  border-color: rgba(255, 255, 255, 0.8);
}

.btn-transparent-white .caret {
  border-top-color: rgba(59, 60, 65, 0.1);
}

.dropup .btn-transparent-white .caret {
  border-bottom: 4px solid rgba(59, 60, 65, 0.1);
}

.btn-transparent-grey {
  background: rgba(153, 153, 153, 0.2);
  border-color: rgba(153, 153, 153, 0.4);
  border-width: 1px;
  color: #666666;
  -moz-box-shadow: 1px 1px 0px 0px rgba(255, 255, 255, 0.8) inset;
  -webkit-box-shadow: 1px 1px 0px 0px rgba(255, 255, 255, 0.8) inset;
  box-shadow: 1px 1px 0px 0px rgba(255, 255, 255, 0.8) inset;
}

.btn-transparent-grey:hover,
.btn-transparent-grey:focus,
.btn-transparent-grey:active,
.btn-transparent-grey.active {
  background: rgba(153, 153, 153, 0.3);
  border-color: rgba(153, 153, 153, 0.6);
  box-shadow: none !important;
  color: #000;
}

.btn-transparent-grey .caret {
  border-top-color: #999;
}

.dropup .btn-transparent-grey .caret {
  border-bottom: 4px solid #999;
}

.btn-transparent-grey2 {
  background: none;
  border-color: rgba(153, 153, 153, 0.3);
  border-width: 1px;
  color: #999 !important;
}


.btn-transparent-grey2:hover,
.btn-transparent-grey2:focus,
.btn-transparent-grey2:active,
.btn-transparent-grey2.active {
  color: #666666 !important;
  background-color: rgba(153, 153, 153, 0.1);
  box-shadow: none !important;
}

.btn-transparent-red {
  background: none;
  border-color: rgba(230, 107, 107, 0.6);
  border-width: 1px;
  color: #e66b6b !important;
}

.btn-transparent-red:hover,
.btn-transparent-red:focus,
.btn-transparent-red:active,
.btn-transparent-red.active {
  background-color: rgba(230, 107, 107, 0.1);
  border-color: rgba(230, 107, 107, 0.8);
}

.btn-transparent-red .caret {
  border-top-color: #ffffff;
}

.dropup .btn-transparent-red .caret {
  border-bottom: 4px solid #ffffff;
}

.btn-squared {
  border-radius: 0 !important;
}

.btn-bgcolor-main {
  background: #0c8f4f;
  color: #fff !important;
  border: 1px solid rgb(0 0 0 / 20%);
}


[data-theme='blue'] .btn-bgcolor-main {
  background: #0a7eda;
}

[data-theme='orange'] .btn-bgcolor-main {
  background: #ff5a00;
}

[data-theme='green'] .btn-bgcolor-main {
  background: #1f8e85;
}

[data-theme='red'] .btn-bgcolor-main {
  background: #ff6360;
}

[data-theme='gray'] .btn-bgcolor-main {
  background: #4f6773;
}

[data-theme='blue2'] .btn-bgcolor-main {
  background: #25358c;
}

[data-theme='purple'] .btn-bgcolor-main {
  background: #85379f;
}

.switch-btn {
  background-color: #0c8f4f;
  color: #fff;
}

.switch-btn:hover {
  background-color: #0c7e46;
}

.btn-icon {
  background-color: #EFEFEF;
  background-image: -moz-linear-gradient(center top, #FAFAFA, #EFEFEF);
  border: 1px solid #DDDDDD;
  border-radius: 2px 2px 2px 2px;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
  cursor: pointer;
  height: 80px;
  display: block;
  font-size: 14px;
  padding: 5px 0 0;
  position: relative;
  text-align: center;
  transition: all 0.3s ease 0s;
  color: #333333;
}

.btn-icon:hover {
  border-color: #A5A5A5;
  box-shadow: 0 0 3px rgba(0, 0, 0, 0.25);
  color: #444444;
  text-decoration: none;
  text-shadow: 0 1px 0 #FFFFFF;
}

.btn-icon .badge {
  border-radius: 12px 12px 12px 12px !important;
  border-style: solid;
  border-width: 0;
  box-shadow: none;
  color: #FFFFFF !important;
  font-size: 11px !important;
  font-weight: 300;
  padding: 3px 7px;
  position: absolute;
  right: -5px;
  text-shadow: none;
  top: -5px;
}

.btn-icon [class^="fa-"],
.btn-icon [class*=" fa-"] {
  clear: both;
  display: block;
}

.buttons-widget .btn,
.buttons-widget .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .buttons-widget .ag-paging-button,
.buttons-widget .bootstrap-switch,
.buttons-widget button {
  margin-bottom: 5px;
}

.buttons-widget .btn-group button,
.buttons-widget .btn-group-vertical button,
.buttons-widget .btn-group .btn,
.buttons-widget .btn-group .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .buttons-widget .btn-group .ag-paging-button,
.buttons-widget .btn-group-vertical .btn,
.buttons-widget .btn-group-vertical .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .buttons-widget .btn-group-vertical .ag-paging-button {
  margin-bottom: 0;
}

/***
Dropdown checkboxes
***/
.dropdown-checkboxes {
  padding: 5px;
}

.dropdown-checkboxes label {
  display: block;
  font-weight: normal;
  line-height: 20px;
}

/***
Social Icons
***/
.social-icons ul {
  list-style: none;
  margin: 0 0 -1px 0;
  padding: 0;
}

.social-icons ul li {
  display: inline-block;
  margin: 0;
  padding: 0;
  height: 40px;
  overflow: hidden;
}

.social-icons ul li a {
  background-position: 0 0;
  background-repeat: no-repeat;
  display: block;
  height: 80px;
  opacity: 0.6;
  text-indent: -9999px;
  transition: all 0.2s ease 0s;
  width: 40px;
  top: 0;
  font-size: 16px;
  position: relative;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.social-icons ul li a:hover {
  top: -40px;
}

.social-icons ul li a:before {
  position: absolute;
  width: 40px;
  height: 40px;
  font-family: FontAwesome;
  text-indent: 0;
  line-height: 40px;
  top: 0;
  left: 0;
  text-align: center;
  color: #999999;
}

.social-icons ul li a:after {
  position: absolute;
  width: 40px;
  height: 40px;
  font-family: FontAwesome;
  text-indent: 0;
  line-height: 40px;
  top: 40px;
  left: 0;
  text-align: center;
  color: #FFFFFF;
}

.social-icons ul li.social-twitter a:before,
.social-icons ul li.social-twitter a:after {
  content: "\f099";
}

.social-icons ul li.social-twitter a:after {
  background: #48C4D2;
}

.social-icons ul li.social-dribbble a:before,
.social-icons ul li.social-dribbble a:after {
  content: "\f17d";
}

.social-icons ul li.social-dribbble a:after {
  background: #EF5B92;
}

.social-icons ul li.social-facebook a:before,
.social-icons ul li.social-facebook a:after {
  content: "\f09a";
}

.social-icons ul li.social-facebook a:after {
  background: #3B5998;
}

.social-icons ul li.social-google a:before,
.social-icons ul li.social-google a:after {
  content: "\f0d5";
}

.social-icons ul li.social-google a:after {
  background: #DD4B39;
}

.social-icons ul li.social-linkedin a:before,
.social-icons ul li.social-linkedin a:after {
  content: "\f0e1";
}

.social-icons ul li.social-linkedin a:after {
  background: #71B2D0;
}

.social-icons ul li.social-youtube a:before,
.social-icons ul li.social-youtube a:after {
  content: "\f167";
}

.social-icons ul li.social-youtube a:after {
  background: #F45750;
}

.social-icons ul li.social-rss a:before,
.social-icons ul li.social-rss a:after {
  content: "\f09e";
}

.social-icons ul li.social-rss a:after {
  background: #FE9900;
}

.social-icons ul li.social-behance a:before,
.social-icons ul li.social-behance a:after {
  content: "\f1b4";
}

.social-icons ul li.social-behance a:after {
  background: #5EB5FB;
}

.social-icons ul li.social-dropbox a:before,
.social-icons ul li.social-dropbox a:after {
  content: "\f16b";
}

.social-icons ul li.social-dropbox a:after {
  background: #85BEEC;
}

.social-icons ul li.social-github a:before,
.social-icons ul li.social-github a:after {
  content: "\f09b";
}

.social-icons ul li.social-github a:after {
  background: #94A5B0;
}

.social-icons ul li.social-skype a:before,
.social-icons ul li.social-skype a:after {
  content: "\f17e";
}

.social-icons ul li.social-skype a:after {
  background: #70CCEF;
}

.social-icons ul li.social-spotify a:before,
.social-icons ul li.social-spotify a:after {
  content: "\f1bc";
}

.social-icons ul li.social-spotify a:after {
  background: #8BD05A;
}

.social-icons ul li.social-stumbleupon a:before,
.social-icons ul li.social-stumbleupon a:after {
  content: "\f1a4";
}

.social-icons ul li.social-stumbleupon a:after {
  background: #F08066;
}

.social-icons ul li.social-tumblr a:before,
.social-icons ul li.social-tumblr a:after {
  content: "\f173";
}

.social-icons ul li.social-tumblr a:after {
  background: #85A5C3;
}

.social-icons ul li.social-vimeo a:before,
.social-icons ul li.social-vimeo a:after {
  content: "\f194";
}

.social-icons ul li.social-vimeo a:after {
  background: #7C99A8;
}

.social-icons ul li.social-wordpress a:before,
.social-icons ul li.social-wordpress a:after {
  content: "\f19a";
}

.social-icons ul li.social-wordpress a:after {
  background: #649EB9;
}

.social-icons ul li.social-xing a:before,
.social-icons ul li.social-xing a:after {
  content: "\f168";
}

.social-icons ul li.social-xing a:after {
  background: #4F9394;
}

.social-icons ul li.social-yahoo a:before,
.social-icons ul li.social-yahoo a:after {
  content: "\f19e";
}

.social-icons ul li.social-yahoo a:after {
  background: #C38DCF;
}

.social-icons ul li.social-vk a:before,
.social-icons ul li.social-vk a:after {
  content: "\f189";
}

.social-icons ul li.social-vk a:after {
  background: #708FAC;
}

.social-icons ul li.social-instagram a:before,
.social-icons ul li.social-instagram a:after {
  content: "\f16d";
}

.social-icons ul li.social-instagram a:after {
  background: #CBAA97;
}

.social-icons ul li.social-reddit a:before,
.social-icons ul li.social-reddit a:after {
  content: "\f1a1";
}

.social-icons ul li.social-reddit a:after {
  background: #FF7A52;
}

.social-icons ul li.social-flickr a:before,
.social-icons ul li.social-flickr a:after {
  content: "\f16e";
}

.social-icons ul li.social-flickr a:after {
  background: #FF4DA9;
}

.social-icons ul li.social-foursquare a:before,
.social-icons ul li.social-foursquare a:after {
  content: "\f180";
}

.social-icons ul li.social-foursquare a:after {
  background: #6FCCF4;
}

.btn.btn-xs.tooltips,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .btn-xs.tooltips.ag-paging-button {
  width: 22px;
  padding: 1px 4px;
}

.btn.btn-xs.tooltips .fa-minus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .btn-xs.tooltips.ag-paging-button .fa-minus {
  position: relative;
  top: 1px;
}

.btn-checkbox-group {
  white-space: nowrap !important;
}

.btn-checkbox-group .btn-checkbox:not(:last-child) {
  margin-right: 3px;
}

.btn-checkbox {
  min-width: 22px !important;
  padding: 2px 5px !important;
  font-size: 13px;
  line-height: 1.5;
  background: #fff;
  margin-top: 2px;
  margin-bottom: 2px;
  border-color: rgba(153, 153, 153, 0.5);
  border-width: 1px;
  color: #4d4d4d;
}

.btn-checkbox:hover,
.btn-checkbox:focus,
.btn-checkbox:active {
  border-color: #0c8f4f;
}

.btn-checkbox.active {
  color: #fff;
  background: #0c8f4f;
  border-color: #0c8f4f;
}

.collapsible {
  box-shadow: none;
  position: relative;
}

.collapsible .heading {
  padding-left: 40px;
}

.collapsible .heading-title {
  height: 32px;
  line-height: 32px;
  vertical-align: middle;
}

@media (max-width: 767px) {
  .collapsible .heading {
    padding-left: 0;
  }
}

.collapsible .panel {
  box-shadow: none;
}

.collapsible .panel-heading {
  min-height: 10px;
  padding: 8px;
  padding-bottom: 3px;
  border-bottom: 1px solid #e8e8e8 !important;
  background-color: #fff !important;
}

.collapsible .panel-body {
  border-top: 1px solid transparent !important;
  background: #f6f6f6;
  padding: 15px 20px;
}

.collapsible .accordion-toggle {
  padding-right: 20px;
  position: relative;
  display: block;
}

.collapsible .accordion-toggle i.pull-right {
  position: absolute;
  top: 4px;
  right: 0px;
}

.collapsible .fa-angle-up,
.collapsible .fa-angle-down {
  color: #0c8f4f;
  font-size: 18px;
  cursor: pointer;
}

.collapsible-wrap .panel-group {
  margin-bottom: 4px;
}

/*------------------------白底------------------------*/
.collapsible.white-bg .panel-heading {
  padding: 0;
  border-bottom: none !important;
}

.collapsible.white-bg .panel-body {
  padding: 0;
  background: #fff;
}

/*------------------------箭頭左邊------------------------*/
.collapsible.arr-left .accordion-toggle {
  padding-right: 0;
}

.collapsible.arr-left i.pull-left {
  position: absolute;
  top: 0px;
  left: 10px;
  z-index: 99;
  font-size: 32px;
}

@media (max-width: 767px) {
  .collapsible.arr-left i.pull-left {
    left: auto;
    right: 4px;
    top: 0;
  }
}

/* ---------------------------------------------------------------------- */
/*  Gallery
/* ---------------------------------------------------------------------- */
#Grid {
  min-height: 575px;
}

#Grid .mix {
  display: none;
  margin-bottom: 20px;
  text-align: center;
  vertical-align: top;
}

div.portfolio-info {
  margin: 2px 0 10px 0;
}

.portfolio-info ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.portfolio-info ul li {
  border-right: 1px solid #E6E6E6;
  color: #B1B1B1;
  display: inline-block;
  font-size: 0.9em;
  margin-right: 8px;
  padding-right: 8px;
}

.portfolio-info ul li i.fa {
  margin-right: 4px;
}

.portfolio-item {
  position: relative;
}

.portfolio-item a.thumb-info span.thumb-info-title {
  background: rgba(0, 0, 0, 0.7);
  bottom: 4px;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 700;
  left: 4px;
  padding: 10px;
  position: absolute;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
  text-transform: uppercase;
}

.portfolio-page ul.nav li a:hover,
.portfolio-page ul.nav li.active a {
  background: #357EBD;
  color: #FFFFFF;
}

.portfolio-page ul.nav li a {
  background: #EEEEEE;
  color: #555555;
  cursor: pointer;
  display: inline-block;
  margin-bottom: 5px;
  margin-right: 2px;
  padding: 6px 15px;
}

.gallery-img {
  margin-bottom: 20px;
}

.portfolio-item {
  position: relative;
  overflow: hidden;
}

.portfolio-item .chkbox {
  width: 18px;
  height: 18px;
  position: absolute;
  top: 5px;
  right: 5px;
  background: #ffffff;
  text-align: center;
  display: none;
  cursor: pointer;
  border: 1px solid #DDDDDD;
}

.portfolio-item .chkbox:hover {
  border-color: rgba(82, 168, 236, 0.8);
  box-shadow: 0 0 12px rgba(82, 168, 236, 0.6);
  outline: 0 none;
}

.portfolio-item:hover .chkbox {
  display: block;
}

.portfolio-item.selected>.chkbox {
  display: block;
}

.portfolio-item:hover>.chkbox {
  display: block;
}

.portfolio-item.selected>.chkbox:before {
  content: "\f00c";
  font-family: FontAwesome;
  height: 14px;
  left: 1px;
  position: absolute;
  top: -2px;
  width: 14px;
}

.portfolio-item>.tools {
  background-color: rgba(0, 0, 0, 0.55);
  bottom: 0;
  left: -30px;
  position: absolute;
  text-align: center;
  top: 0;
  transition: all 0.2s ease 0s;
  vertical-align: middle;
  width: 24px;
}

.portfolio-item>.tools a:hover,
.portfolio-item>.tools a:focus {
  text-decoration: none;
}

.portfolio-item>.tools.tools-bottom {
  bottom: -40px;
  height: 36px;
  left: 0;
  right: 0;
  top: auto;
  width: auto;
}

.portfolio-item:hover>.tools {
  left: 0;
}

.portfolio-item:hover>.tools.tools-bottom {
  bottom: 0;
  top: auto;
}

.portfolio-item:hover>.tools.tools-top {
  bottom: auto;
  top: 0;
}

.portfolio-item:hover>.tools.tools-right {
  left: auto;
  right: 0;
}

.portfolio-item>.tools>a,
.portfolio-item>*:first-child .inner a {
  color: #FFFFFF;
  display: inline-block;
  font-size: 20px;
  font-weight: normal;
  padding: 4px;
}

.portfolio-item>.tools>a:hover,
.portfolio-item>*:first-child .inner a:hover {
  color: #C9E2EA;
  text-decoration: none;
}

.portfolio-item .tools.tools-bottom>a,
.portfolio-item .tools.tools-top>a {
  display: inline-block;
}

/* ---------------------------------------------------------------------- */
/*  Icons
/* ---------------------------------------------------------------------- */
.fa-round {
  border: 0.1em solid #eee;
  border-radius: 100%;
  padding: 0.2em 0.25em 0.15em;
}

.the-icons {
  list-style: none;
  margin: 20px 0;
  padding: 0;
}

.the-icons .fa-hover {
  border-radius: 4px;
  display: block;
  height: 32px;
  line-height: 32px;
  padding-left: 10px;
  color: #8B91A0;
  cursor: pointer;
  -moz-transition: font-size 0.2s ease 0s;
  -o-transition: font-size 0.2s ease 0s;
  -webkit-transition: font-size 0.2s ease 0s;
  -ms-transition: font-size 0.2s ease 0s;
  transition: font-size 0.2s ease 0s;
}

.the-icons .fa-hover:hover {
  font-size: 26px;
}

.the-icons .fa-hover:hover .fa {
  font-size: 26px;
}

.the-icons .fa-hover .fa {
  display: inline-block;
  font-size: 14px;
  margin-right: 10px;
  text-align: right;
  width: 32px;
}

.item-hover-close {
  padding: 4px 0px 0px 26px;
  border: 1px solid transparent;
  position: relative;
}

.item-hover-close:hover {
  background: whitesmoke;
  border: 1px solid #e6e6e6;
}

.item-hover-close:hover .btn-close {
  display: block;
}

.item-hover-close .btn-close {
  width: 26px;
  height: 26px;
  position: absolute;
  left: 0px;
  top: 6px;
  cursor: pointer;
  display: none;
  text-align: center;
  line-height: 1;
  font-size: 22px;
  color: black;
  opacity: .4;
}

.item-hover-close .btn-close:hover {
  opacity: 1;
}

.item-hover-close .btn-close:before {
  content: "×";
}

@media (max-width: 991px) {
  .item-hover-close {
    background: whitesmoke;
    border: 1px solid #e6e6e6;
  }

  .item-hover-close .btn-close {
    display: block;
  }
}

.sk-circle {
  margin: auto;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  text-align: center;
  transform: translateY(-30px);
  width: 72px;
  height: 72px;
}

.sk-circle .sk-child {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.sk-circle .sk-child:before {
  content: '';
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 15%;
  background-color: #0c8f4f;
  border-radius: 100%;
  animation: sk-circleBounceDelay 1.2s infinite ease-in-out both;
}

.sk-circle .sk-circle2 {
  transform: rotate(30deg);
}

.sk-circle .sk-circle3 {
  transform: rotate(60deg);
}

.sk-circle .sk-circle4 {
  transform: rotate(90deg);
}

.sk-circle .sk-circle5 {
  transform: rotate(120deg);
}

.sk-circle .sk-circle6 {
  transform: rotate(150deg);
}

.sk-circle .sk-circle7 {
  transform: rotate(180deg);
}

.sk-circle .sk-circle8 {
  transform: rotate(210deg);
}

.sk-circle .sk-circle9 {
  transform: rotate(240deg);
}

.sk-circle .sk-circle10 {
  transform: rotate(270deg);
}

.sk-circle .sk-circle11 {
  transform: rotate(300deg);
}

.sk-circle .sk-circle12 {
  transform: rotate(330deg);
}

.sk-circle .sk-circle2:before {
  animation-delay: -1.1s;
}

.sk-circle .sk-circle3:before {
  animation-delay: -1s;
}

.sk-circle .sk-circle4:before {
  animation-delay: -0.9s;
}

.sk-circle .sk-circle5:before {
  animation-delay: -0.8s;
}

.sk-circle .sk-circle6:before {
  animation-delay: -0.7s;
}

.sk-circle .sk-circle7:before {
  animation-delay: -0.6s;
}

.sk-circle .sk-circle8:before {
  animation-delay: -0.5s;
}

.sk-circle .sk-circle9:before {
  animation-delay: -0.4s;
}

.sk-circle .sk-circle10:before {
  animation-delay: -0.3s;
}

.sk-circle .sk-circle11:before {
  animation-delay: -0.2s;
}

.sk-circle .sk-circle12:before {
  animation-delay: -0.1s;
}

@keyframes sk-circleBounceDelay {

  0%,
  80%,
  100% {
    transform: scale(0);
  }

  40% {
    transform: scale(1);
  }
}

.fullpage-loading {
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 9999;
  background: rgba(255, 255, 255, 0.8);
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -webkit-align-items: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  text-align: center;
}

.fullpage-loading .loading-item {
  margin: auto;
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  width: 160px;
  height: 40px;
  text-align: center;
}

.fullpage-loading .loading-item img {
  display: inline;
}

.fullpage-loading .loading-item i {
  display: inline-block;
  font-size: 20px;
  margin-right: 6px;
  position: relative;
  top: 4px;
}

.fullpage-loading .loading-item p {
  display: inline-block;
  font-size: 16px;
}

.fullpage-loading .loading-item .loading-bar {
  display: inline-block;
  width: 6px;
  height: 24px;
  border-radius: 4px;
  margin: 0 1px;
  animation: loading 1s ease-in-out infinite;
}

.fullpage-loading .loading-item .loading-bar:nth-child(1) {
  background-color: #10be69;
  animation-delay: 0;
}

.fullpage-loading .loading-item .loading-bar:nth-child(2) {
  background-color: #0c8f4f;
  animation-delay: 0.09s;
}

.fullpage-loading .loading-item .loading-bar:nth-child(3) {
  background-color: #0c8f4f;
  animation-delay: .18s;
}

.fullpage-loading .loading-item .loading-bar:nth-child(4) {
  background-color: #10be69;
  animation-delay: .27s;
}

.fullpage-loading .text {
  transform: translateY(30px);
  letter-spacing: 1px;
  color: #0c8f4f;
  font-size: 14px;
}

.fullpage-loading .loading-box canvas {
  width: 100px !important;
  height: auto !important;
}

.fullpage-loading .loading-box p {
  letter-spacing: 1px;
  font-family: Arial;
  text-align: center;
}

@keyframes loading {
  0% {
    transform: scale(1);
    opacity: .2;
  }

  20% {
    transform: scale(1, 2.2);
    opacity: .8;
  }

  40% {
    transform: scale(1);
    opacity: .2;
  }
}

.dropdown-messageBox-list {
  width: 430px;
}

.dropdown-messageBox-list .scroll {
  position: relative;
  overflow: hidden;
  min-height: 100px;
  max-height: 360px;
}

.dropdown-messageBox-list .content .text-message {
  width: 100%;
  white-space: normal;
  /* overflow: hidden;white-space: nowrap; text-overflow: ellipsis; */
}

.dropdown-messageBox-list .btn-all {
  font-size: 16px;
  border: none;
  border-radius: 0;
  background-color: rgba(153, 153, 153, 0.1);
}

.dropdown-messageBox-list .btn-all:hover,
.dropdown-messageBox-list .btn-all:focus,
.dropdown-messageBox-list .btn-all:active,
.dropdown-messageBox-list .btn-all.active {
  background-color: rgba(153, 153, 153, 0.2);
}

.messageBox-list .message-link {
  color: #e66b6b;
  padding: 0;
  line-height: inherit !important;
  border: none !important;
  text-decoration: underline !important;
}

.messageBox-list .header {
  padding: 5px;
  border-bottom: 1px solid rgba(153, 153, 153, 0.4);
}

.messageBox-list .header .title-number {
  font-size: 14px;
  padding-top: 5px;
  margin: 0;
  padding-left: 5px;
}

.messageBox-list .header .title-number span {
  margin: 0 4px;
  font-weight: bold;
  font-size: 110%;
}

.messageBox-list .header .title-warn {
  font-size: 16px;
  padding-top: 0;
  margin: 0;
  padding-left: 5px;
}

.messageBox-list .header .title-warn span {
  margin: 0 4px;
  font-weight: bold;
  font-size: 110%;
}

.messageBox-list .header .btn-setUp {
  border: none !important;
}

.messageBox-list .content ul {
  list-style: none;
  padding-left: 0;
}

.messageBox-list .content ul li:not(:last-child) {
  border-bottom: 1px solid rgba(153, 153, 153, 0.2);
}

.messageBox-list .content ul li {
  padding: 4px 10px;
  letter-spacing: -5px;
  position: relative;
}

.messageBox-list .content ul li>* {
  letter-spacing: 1px;
  display: inline-block;
  vertical-align: middle;
}

.messageBox-list .content ul li {
  position: relative;
}

.messageBox-list .content ul li:hover {
  background: rgba(153, 153, 153, 0.07);
}

.messageBox-list .content ul li.link {
  cursor: pointer;
}

.messageBox-list .content .icon {
  width: 28px;
  height: 28px;
  line-height: 28px;
  vertical-align: middle;
  background: #999;
  border-radius: 100%;
  text-align: center;
}

.messageBox-list .content .icon i {
  font-size: 15px;
  padding-top: 6px;
}

.messageBox-list .content .icon-bulletin {
  background: #fc9424;
}

.messageBox-list .content .icon-puestion {
  background: #1FBBA6;
}

.messageBox-list .content .icon-warn {
  background: #e66b6b;
}

.messageBox-list .content .text {
  width: calc(100% - 36px);
  padding-left: 12px;
}

.messageBox-list .content .text-message {
  width: 100%;
  font-size: 14px;
  padding-top: 5px;
  padding: 0;
  margin: 0;
  color: #000;
  font-weight: bold;
}

.messageBox-list .content .text-message.read {
  color: #707070;
  font-weight: normal;
}

.messageBox-list .content .text-time {
  color: #adadad;
  font-size: 90%;
  letter-spacing: 1px;
}

.messageBox-list .btn-all {
  width: 100%;
  padding: 10px;
  text-align: center;
  color: #0c8f4f !important;
}

@media (min-width: 768px) {
  .messageBox-list-all .text-message {
    font-size: 16px !important;
  }

  .messageBox-list-all .header {
    margin-bottom: 10px;
    padding: 0;
    padding-bottom: 5px;
  }

  .messageBox-list-all .text-message {
    padding-right: 110px !important;
  }

  .messageBox-list-all .text-time {
    position: absolute;
    right: 0;
    bottom: 16px;
  }

  .messageBox-list-all .content ul li {
    padding: 8px 5px;
  }
}

/*
 @media  (max-width: $screen-md-max ) {

 .dropdown-messageBox-list{width: 400px;}
 .dropdown-messageBox-menu{left: 0 !important;right: auto !important;

   &:before {left: 20px !important;}
   &:after{left: 21px !important;}



 }

}
*/
.questionnaire {
  width: 90%;
  max-width: 1000px;
}

.questionnaire .header {
  margin-bottom: 10px;
}

.questionnaire .header>* {
  display: inline-block;
  vertical-align: middle;
}

.questionnaire .header .icon {
  width: 32px;
  height: 32px;
  line-height: 32px;
  background: #1FBBA6;
  border-radius: 100%;
  text-align: center;
}

.questionnaire .header .icon i {
  font-size: 18px;
  padding-top: 8px;
}

.questionnaire .header .title {
  font-size: 22px;
  margin: 0;
  color: #0c8f4f;
}

.questionnaire .content-box {
  border: 1px solid #e6e6e6;
  position: relative;
  padding: 10px;
}

.questionnaire .btn-part {
  width: 100%;
  background: #fff;
  padding-top: 10px;
}

.questionnaire .btn-part .btn,
.questionnaire .btn-part .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .questionnaire .btn-part .ag-paging-button {
  padding: 5px 20px;
}

.questionnaire .content {
  overflow: hidden;
  height: calc(100vh - 420px);
}

.questionnaire .article-settings {
  line-height: 1.8;
}

.questionnaire .chat-box {
  margin-top: 16px;
}

.questionnaire .chat-textarea-box {
  position: relative;
}

.questionnaire .btn-like-box {
  text-align: right;
}

@media (min-width: 767px) {
  .questionnaire .btn-like-box {
    max-width: 100px;
  }
}

.questionnaire .btn-like-box .btn-like {
  display: inline-block;
}

.questionnaire .btn-like-box .nb {
  font-size: 15px;
  padding-top: 10px;
  display: inline-block;
  color: #8c8c8c;
  margin-left: 4px;
}

.questionnaire .chat-textarea {
  min-height: 42px !important;
  border-radius: 6px !important;
  padding-top: 10px;
  background: #f5f6fa !important;
  padding-left: 46px;
  position: relative;
}

.questionnaire .chat-textarea:focus {
  background: #f5f6fa !important;
}

.btn-like {
  width: 24px;
  height: 24px;
  z-index: 2;
  margin: 0 !important;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  outline: none !important;
  position: relative;
}

.btn-like:before {
  content: "\f118";
  font-family: "Flaticon4";
  color: #8c8c8c;
  font-size: 24px;
  font-style: normal;
}

.btn-like:hover:before {
  color: #3784ff;
}

.btn-like:hover {
  animation: btn-like-hover 0.5s both;
}

.btn-like:checked {
  animation: btn-like-click 0.6s both;
}

.btn-like:checked:before {
  content: "\f119";
  color: #3784ff;
}

.btn-like:checked:after {
  content: "";
  background: url("https://a1cdnpoint2.azureedge.net/images/svg/firework.svg");
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  margin: -2px auto auto 7px;
  animation: btn-like-spinner 0.4s 0.5s both;
}

@keyframes btn-like-hover {
  20% {
    transform: rotate3d(0, 0, 1, 8deg);
    transform-origin: left bottom;
  }

  40% {
    transform: rotate3d(0, 0, 1, -8deg);
    transform-origin: left bottom;
  }

  60% {
    transform: rotate3d(0, 0, 1, 4deg);
    transform-origin: left bottom;
  }

  80% {
    transform: rotate3d(0, 0, 1, -4deg);
    transform-origin: left bottom;
  }

  100% {
    transform: rotate3d(0, 0, 1, 0deg);
    transform-origin: left bottom;
  }
}

@keyframes btn-like-click {
  20% {
    transform: rotate3d(0, 0, 1, 0deg);
    transform-origin: left bottom;
  }

  40% {
    transform: rotate3d(0, 0, 1, -15deg);
    transform-origin: left bottom;
  }

  70% {
    transform: rotate3d(0, 0, 1, -20deg);
    transform-origin: left bottom;
  }

  80% {
    transform: rotate3d(0, 0, 1, 20deg);
    transform-origin: left bottom;
  }

  100% {
    transform: rotate3d(0, 0, 1, 0deg);
    transform-origin: left bottom;
  }
}

@keyframes btn-like-spinner {
  0% {
    transform: scale(0.1);
    opacity: 0;
    transform-origin: center;
  }

  50% {
    transform: scale(2);
    opacity: 1;
    transform-origin: center;
  }

  85% {
    transform: scale(2.4);
    opacity: .6;
    transform-origin: center;
  }

  100% {
    transform: scale(3);
    opacity: 0;
    transform-origin: center;
  }
}

/* ---------------------------------------------------------------------- */
/*  Messages
/* ---------------------------------------------------------------------- */
.panel-body.messages {
  padding: 0;
}

.messages-list {
  border-right: 1px solid #e6e6e6;
  list-style: none;
  margin: 0;
  padding: 0;
}

.messages-list .messages-item {
  border-bottom: 1px solid #e6e6e6;
  padding: 5px 15px 5px 25px;
  position: relative;
}

.messages-list .messages-item:hover {
  background-color: white;
  cursor: pointer !important;
}

.messages-list .messages-item:hover .messages-item-star {
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
}

.messages-list .messages-item.active {
  background-color: #fafafa;
}

.messages-list .messages-item.starred .messages-item-star {
  display: block;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.messages-list .messages-item span {
  color: #999;
  display: block;
}

.messages-list .messages-item .messages-item-star,
.messages-list .messages-item .messages-item-attachment,
.messages-list .messages-item .messages-item-time,
.messages-list .messages-item .messages-item-actions {
  position: absolute;
}

.messages-list .messages-item .messages-item-star {
  color: #1FBBA6;
  left: 7px;
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
  -moz-transition: opacity 0.3s ease-in-out 0s;
  -o-transition: opacity 0.3s ease-in-out 0s;
  -webkit-transition: opacity 0.3s ease-in-out 0s;
  -ms-transition: opacity 0.3s ease-in-out 0s;
  transition: opacity 0.3s ease-in-out 0s;
}

.messages-list .messages-item .messages-item-star:hover,
.messages-list .messages-item .messages-item-star:active,
.messages-list .messages-item .messages-item-star:focus {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.messages-list .messages-item .messages-item-attachment {
  left: 7px;
  top: 25px;
  color: #00869e;
}

.messages-list .messages-item .messages-item-avatar {
  border-radius: 4px;
  float: left;
  height: 40px;
  width: 40px;
}

.messages-list .messages-item .messages-item-from,
.messages-list .messages-item .messages-item-subject {
  margin-left: 45px;
}

.messages-list .messages-item .messages-item-from {
  font-weight: bold;
  margin-top: 2px;
  color: gray;
}

.messages-list .messages-item .messages-item-time {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
  right: 15px;
  top: 8px;
  -moz-transition: opacity 0.3s ease-in-out 0s;
  -o-transition: opacity 0.3s ease-in-out 0s;
  -webkit-transition: opacity 0.3s ease-in-out 0s;
  -ms-transition: opacity 0.3s ease-in-out 0s;
  transition: opacity 0.3s ease-in-out 0s;
}

.messages-list .messages-item .messages-item-time:hover .text {
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
}

.messages-list .messages-item .messages-item-time:hover .messages-item-actions {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.messages-list .messages-item .messages-item-time .text {
  color: #333333;
  font-size: 11px;
}

.messages-list .messages-item .messages-item-time .messages-item-actions {
  filter: alpha(opacity=0);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
  right: 0;
  top: 0;
  -moz-transition: opacity 0.3s ease-in-out 0s;
  -o-transition: opacity 0.3s ease-in-out 0s;
  -webkit-transition: opacity 0.3s ease-in-out 0s;
  -ms-transition: opacity 0.3s ease-in-out 0s;
  transition: opacity 0.3s ease-in-out 0s;
  width: 65px;
}

.messages-list .messages-item .messages-item-time .messages-item-actions>a,
.messages-list .messages-item .messages-item-time .messages-item-actions .dropdown>a {
  margin-left: 5px;
}

.messages-list .messages-item .messages-item-time .messages-item-actions>div {
  display: inline-block;
}

.messages-list .messages-item .messages-item-time .messages-item-actions .dropdown-menu {
  margin-top: 0;
}

.messages-list .messages-item .messages-item-time .messages-item-actions .tag-icon {
  border-radius: 30px;
  display: inline-block;
  height: 11px;
  margin: 0 5px 0 -13px;
  width: 11px;
}

.messages-list .messages-item .messages-item-time .messages-item-actions .tag-icon.red {
  background: #e66b6b;
}

.messages-list .messages-item .messages-item-time .messages-item-actions .tag-icon.blue {
  background: #00869e;
}

.messages-list .messages-item .messages-item-time .messages-item-actions .tag-icon.green {
  background: #1FBBA6;
}

.messages-list .messages-item .messages-item-subject {
  font-size: 12px;
  margin-bottom: 4px;
}

.messages-list .messages-item .messages-item-preview {
  color: gray;
  font-size: 12px;
}

.messages-list .messages-search {
  border-bottom: 1px solid #e6e6e6;
  padding: 0 15px 15px 15px;
  position: relative;
}

.messages-content {
  background-color: none;
  border-top: 1px solid #e6e6e6;
  height: auto;
  position: relative;
  color: #333333;
}

.messages-content .message-header {
  border-bottom: 1px solid #e6e6e6;
  padding: 10px 15px;
}

.messages-content .message-header .message-from {
  font-weight: bold;
  color: gray;
}

.messages-content .message-header .message-to {
  color: #b3b3b3;
}

.messages-content .message-header .message-time {
  color: #b3b3b3;
  position: absolute;
  right: 15px;
  top: 10px;
  font-size: 11px;
}

.messages-content .message-header .message-actions {
  left: 50%;
  margin-left: -60px;
  position: absolute;
  width: 120px;
  font-size: 14px;
}

.messages-content .message-header .message-actions a {
  background-color: #ffffff;
  border-bottom: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
  border-top: 1px solid #e6e6e6;
  color: #b3b3b3;
  margin: 0 0 0 -4px;
  padding: 4px 7px;
}

.messages-content .message-header .message-actions a i {
  -moz-transition: opacity 0.3s ease-in-out 0s;
  -o-transition: opacity 0.3s ease-in-out 0s;
  -webkit-transition: opacity 0.3s ease-in-out 0s;
  -ms-transition: opacity 0.3s ease-in-out 0s;
  transition: opacity 0.3s ease-in-out 0s;
  filter: alpha(opacity=70);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
  -moz-opacity: 0.7;
  -khtml-opacity: 0.7;
  opacity: 0.7;
}

.messages-content .message-header .message-actions a:hover {
  color: #1FBBA6;
}

.messages-content .message-header .message-actions a:hover i {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.messages-content .message-header .message-actions a:first-child {
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
  padding-left: 10px;
}

.messages-content .message-header .message-actions a:last-child {
  border-bottom-right-radius: 4px;
  border-right: 1px solid #F5F4F9;
  border-top-right-radius: 4px;
}

.messages-content .message-content {
  padding: 20px 10px;
  color: #333333;
}

/* ie8 fixes */
.ie8 .messages-list .messages-item .messages-item-star {
  display: none;
}

.ie8 .messages-list .messages-item:hover .messages-item-star {
  display: block;
}

/**/
/* ie8 fixes */
.ie8 .messages-list .messages-item .messages-item-time .messages-item-actions {
  display: none;
}

/**/
/* ---------------------------------------------------------------------- */
/*  Pagination
/* ---------------------------------------------------------------------- */
.pagination>li>a,
.pagination>li>span {
  margin-left: 5px;
  width: 30px;
  padding: 5px 10px;
  border-radius: 5px;
  cursor: pointer;
}

.pagination.squared {
  border-radius: 0 !important;
}

.pagination.squared li:first-child a,
.pagination.squared li:first-child>span {
  border-bottom-left-radius: 0px !important;
  border-left-width: 1px;
  border-top-left-radius: 0px !important;
}

.pagination.squared li:last-child>a,
.pagination.squared li:last-child>span {
  border-bottom-right-radius: 0px !important;
  border-top-right-radius: 0px !important;
}

.pagination.pagination-purple li a {
  background: #F5F4F9;
  border: none !important;
  color: #333333;
  display: inline-block;
  margin-right: 1px;
}

.pagination.pagination-purple li:hover {
  background: #ECEAF3;
  color: #222222;
  cursor: pointer;
}

.pagination .pagination.pagination-purple li a {
  background: #F5F4F9;
  border: none !important;
  color: #333333;
  display: inline-block;
  margin-right: 1px;
}

.pagination .pagination.pagination-purple li:hover {
  background: #ECEAF3;
  color: #222222;
  cursor: pointer;
}

.pagination.pagination-purple li:first-child a,
.pagination-purple .pagination li:first-child a {
  border: none !important;
}

.pagination.pagination-purple li.disabled a,
.pagination-purple .pagination li.disabled a {
  color: #AAAAAA !important;
}

.pagination.pagination-purple li.disabled a:hover,
.pagination-purple .pagination li.disabled a:hover,
.pagination.pagination-purple li.disabled a:focus,
.pagination-purple .pagination li.disabled a:focus {
  background: #F5F4F9;
  cursor: default !important;
}

.pagination.pagination-purple li.active a,
.pagination-purple .pagination li.active a {
  background: #57517B !important;
  border: none !important;
  color: #FFFFFF !important;
  cursor: default !important;
  opacity: 1;
}

.pagination-purple [class^="fa-"],
.pagination-purple [class*=" fa-"] {
  color: #57517B;
}

.pagination-purple li.disabled [class^="fa-"],
.pagination-purple li.disabled [class*=" fa-"] {
  opacity: 0.5;
}

.pagination-main li a {
  color: #333333;
  display: inline-block;
  margin-right: 1px;
}

.pagination-main li a:hover {
  background: #cdecdd;
  color: black;
  cursor: pointer;
}

.pagination-main li.disabled a {
  background: #98e9c1;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
}

.pagination-main li.disabled a:hover,
.pagination-main li.disabled a:focus {
  background: #8bf5c1;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
  cursor: default !important;
}

.pagination-main li.active a {
  background: #10be69 !important;
  border: none !important;
  color: white !important;
  cursor: default !important;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.pagination-main li [class^="fa-"],
.pagination-main li [class*=" fa-"] {
  color: #0c8f4f;
}

.pagination-blue li a {
  background: #8ee6f6;
  border: none !important;
  color: #333333;
  display: inline-block;
  margin-right: 1px;
}

.pagination-blue li a:hover {
  background: #76e1f4;
  color: black;
  cursor: pointer;
}

.pagination-blue li:first-child a {
  border: none !important;
}

.pagination-blue li.disabled a {
  background: #8ee6f6;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
}

.pagination-blue li.disabled a:hover,
.pagination-blue li.disabled a:focus {
  background: #85ecff;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
  cursor: default !important;
}

.pagination-blue li.active a {
  background: #00869e !important;
  border: none !important;
  color: #ffffff !important;
  cursor: default !important;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.pagination-blue li [class^="fa-"],
.pagination-blue li [class*=" fa-"] {
  color: #00869e;
}

.pagination-green li a {
  background: #e2f7f4;
  border: none !important;
  color: #333333;
  display: inline-block;
  margin-right: 1px;
}

.pagination-green li a:hover {
  background: #cef1ed;
  color: black;
  cursor: pointer;
}

.pagination-green li:first-child a {
  border: none !important;
}

.pagination-green li.disabled a {
  background: #e2f7f4;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
}

.pagination-green li.disabled a:hover,
.pagination-green li.disabled a:focus {
  background: #c9f6f0;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
  cursor: default !important;
}

.pagination-green li.active a {
  background: #1FBBA6 !important;
  border: none !important;
  color: #ffffff !important;
  cursor: default !important;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.pagination-green li [class^="fa-"],
.pagination-green li [class*=" fa-"] {
  color: #1FBBA6;
}

.pagination-red li a {
  background: #fceeee;
  border: none !important;
  color: #333333;
  display: inline-block;
  margin-right: 1px;
}

.pagination-red li a:hover {
  background: #f8d8d8;
  color: black;
  cursor: pointer;
}

.pagination-red li:first-child a {
  border: none !important;
}

.pagination-red li.disabled a {
  background: #fceeee;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
}

.pagination-red li.disabled a:hover,
.pagination-red li.disabled a:focus {
  background: white;
  filter: alpha(opacity=30);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
  -moz-opacity: 0.3;
  -khtml-opacity: 0.3;
  opacity: 0.3;
  cursor: default !important;
}

.pagination-red li.active a {
  background: #e66b6b !important;
  border: none !important;
  color: #ffffff !important;
  cursor: default !important;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.pagination-red li [class^="fa-"],
.pagination-red li [class*=" fa-"] {
  color: #e66b6b;
}

.selectListSet .select-item-part {
  position: relative;
  border: 1px solid #ddd;
  overflow: auto;
}

@media (max-width: 767px) {
  .selectListSet .select-item-part {
    height: 200px !important;
  }
}

.selectListSet .select-item-part.part-right {
  margin-left: 42px;
}

@media (max-width: 767px) {
  .selectListSet .select-item-part.part-right {
    margin-left: 0px;
    margin-top: 42px;
  }
}

.selectListSet .select-item-part h3 {
  background: #f5f5f5;
  font-size: 15px;
  margin: 0;
  padding: 10px;
  font-weight: bold;
  border-bottom: 1px solid #ddd;
}

.selectListSet .select-item-part ol {
  list-style: none;
  padding-left: 0px;
  margin-top: 8px;
}

.selectListSet .select-item-part ol li {
  padding: 4px;
  padding-left: 12px;
  padding-right: 46px;
  cursor: pointer;
  margin-top: -2px;
  position: relative;
}

.selectListSet .select-item-part ol li:hover {
  color: #0c8f4f;
}

.selectListSet .select-item-part ol li.active {
  background: #eafff4;
  border: 2px solid #a9e3c7;
  border-right: none;
  border-left: none;
}

.selectListSet .select-item-part ol li .btn-up-down {
  display: none;
  position: absolute;
  right: 3px;
  top: 50%;
  margin-top: -22px;
  zoom: .5;
}

.selectListSet .select-item-part ol li:hover .btn-up-down {
  display: block;
}

.selectListSet .select-item-part tr {
  position: relative;
}

.selectListSet .select-item-part tr.active {
  background: #eafff4;
  border: 2px solid #a9e3c7;
  border-right: none;
  border-left: none;
}

.selectListSet .select-item-part tr.active td,
.selectListSet .select-item-part tr.active td:hover,
.selectListSet .select-item-part tr.active:hover td {
  background: #eafff4 !important;
}

.selectListSet .select-item-part tr td {
  cursor: pointer;
  margin-top: -2px;
  position: relative;
}

.selectListSet .select-item-part tr td:hover {
  color: #0c8f4f;
}

.selectListSet .select-item-part tr td .btn-up-down {
  display: none;
  position: absolute;
  right: 3px;
  top: 50%;
  margin-top: -22px;
  zoom: .5;
}

.selectListSet .select-item-part tr:hover td .btn-up-down,
.selectListSet .select-item-part tr td:hover .btn-up-down {
  display: block;
}

.selectListSet .btn-switch-box {
  position: absolute;
  left: 4px;
  top: 50%;
  margin-top: -100px;
  width: 30px;
  text-align: center;
}

.selectListSet .btn-switch-box .btn,
.selectListSet .btn-switch-box .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .selectListSet .btn-switch-box .ag-paging-button {
  margin-bottom: 5px;
}

@media (max-width: 767px) {
  .selectListSet .btn-switch-box {
    left: 50%;
    margin-left: -90px;
    top: 2px;
    margin-top: 0;
    width: 200px;
  }

  .selectListSet .btn-switch-box.vertical-xs {
    width: 50px;
    margin-left: -20px;
  }

  .selectListSet .btn-switch-box .btn,
  .selectListSet .btn-switch-box .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
  .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .selectListSet .btn-switch-box .ag-paging-button {
    margin: 2px;
    height: 30px;
    line-height: 30px;
  }
}

.selectListSet .btn-switch-box-normal {
  position: relative;
  padding: 6px;
  margin-top: 0;
  top: auto;
  left: auto;
  width: 50px;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-self: center;
}

.selectListSet .btn-switch-box-normal .btn,
.selectListSet .btn-switch-box-normal .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .selectListSet .btn-switch-box-normal .ag-paging-button {
  -webkit-flex: none !important;
  -ms-flex: none !important;
  flex: none !important;
}

@media (max-width: 767px) {
  .selectListSet .btn-switch-box-normal {
    margin-left: 0;
    top: 2px;
    margin-top: 0;
    margin-bottom: 5px;
  }

  .selectListSet .btn-switch-box-normal.vertical-xs {
    width: 50px;
    margin-left: 0;
  }

  .selectListSet .btn-switch-box-normal .btn,
  .selectListSet .btn-switch-box-normal .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
  .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .selectListSet .btn-switch-box-normal .ag-paging-button {
    margin: 2px;
    height: 30px;
    line-height: 30px;
  }
}

.file-status {
  width: 57px;
  height: 57px;
  position: absolute;
  right: 8px;
  top: 8px;
  z-index: 99999;
  background-repeat: no-repeat;
}

.file-status-down {

  width: 57px;
  height: 57px;
  position: absolute;
  right: 8px;
  top: 70px !important;
  z-index: 99999;
  background-repeat: no-repeat;
}

.status-void {
  background-image: url("https://a1cdnpoint2.azureedge.net/images/stamp/void.png");
}

.status-stop {
  background-image: url("https://a1cdnpoint2.azureedge.net/images/stamp/stop.png");
}

.status-finish {
  background-image: url("https://a1cdnpoint2.azureedge.net/images/stamp/finish.png");
}

.status-inventory {
  background-image: url("https://a1cdnpoint2.azureedge.net/images/stamp/inventory.png");
}

.status-branchstore {
  background-image: url("https://a1cdnpoint2.azureedge.net/images/stamp/branchstore.png");
}

.status-costshare {
  background-image: url("https://a1cdnpoint2.azureedge.net/images/stamp/costshare.png");
}

.file-status.status-costshare {
  width: 75px;
  height: 65px;
  right: 20px;
}

/* ---------------------------------------------------------------------- */
/*  status-icon
/* ---------------------------------------------------------------------- */
.status-icon {
  display: inline-block;
  padding: 2.5px 5px;
  width: 22px;
  height: 22px;
  margin-bottom: 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  background-image: none;
  border-radius: 50%;
  color: #fff;
}

.status-icon i {
  font-size: 16px;
  line-height: 1;
  position: relative;
}

.status-icon .material-icons {
  left: -1px;
}

.status-icon .fa {
  right: -1px;
}

.status-icon-warn {
  background: transparent;
  padding: 0;
}

.status-icon-warn i {
  color: #e20000;
  font-size: 22px;
}

.status-icon-warn .material-icons {
  left: 0;
}

.status-icon-warn .fa {
  right: 0;
}

.status-icon-red {
  background: #ff4b82;
}

.status-icon-red2 {
  background: #e20000;
}

.status-icon-blue {
  background: #1e8dff;
}

.status-icon-blue2 {
  background: #0089c2;
}

.status-icon-blue3 {
  background: #00869e;
}

.status-icon-green {
  background: #00bb0d;
}

.status-icon-orange {
  background: #ff7e00;
}

.status-icon-brown {
  background: #cf804b;
}

.status-icon-gray {
  background: #999;
}

.status-icon-pink {
  background: #DD5A82;
}

.status-icon-purple {
  background: #804C75;
}

.status-icon-azure {
  background: #00adb8;
}

.status-icon-beige {
  background: #9c9c4e;
}

.status-icon-bricky {
  background: #b8727d;
}

.status-icon-deeppurple {
  background: #6f4bdb;
}

.step {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  margin-bottom: 15px !important;
}

.step ul {
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  padding: 0;
  margin: 0;
  list-style: none;
}

.step li {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  position: relative;
}

.step li .circle {
  letter-spacing: 0px;
  font-family: Helvetica;
  width: 30px;
  height: 30px;
  line-height: 28px;
  border-radius: 50%;
  font-size: 16px;
  text-align: center;
  margin: 0 auto;
  background: #fff;
  border: 2px solid #c1c1c1;
  color: #c1c1c1;
  z-index: 2;
  position: relative;
  display: block;
}

.step li .circle:hover {
  background: #e9e9e9;
}

.step li .circle.active {
  background: #0c8f4f;
  color: #fff;
  border: 2px solid #0c8f4f;
}

.step li .circle.active:hover {
  background: #0a733f;
  border: 2px solid #0a733f;
}

.step li .line {
  width: 50%;
  height: 2px;
  background: #d3d3d3;
  display: block;
  position: relative;
  top: -18px;
}

.step li .line.right {
  float: right;
}

.step li .line.left {
  float: left;
}

.step li .line.active {
  background: #0c8f4f;
}

.step li p {
  padding: 0;
  margin: 0;
  text-align: center;
  letter-spacing: 0px;
  color: #595959;
  font-weight: bold;
  font-size: 13px;
  padding-top: 0px;
}

.step li p.active {
  color: #0c8f4f;
}

.step.noLink a {
  cursor: default;
}

.step.noLink li .circle:hover {
  background: #fff;
}

.step.noLink li .circle.active:hover {
  background: #0c8f4f;
  border: 2px solid #0c8f4f;
}

.project-main-container .step {
  margin-top: 30px;
  margin-left: 20px;
}

@media (max-width: 767px) {
  .project-main-container .step {
    margin-left: 0;
    margin-top: 60px;
  }
}

.project-main-container .step ul li .circle {
  display: none;
}

.project-main-container .step ul:nth-child(1) {
  margin-bottom: -31px;
}

.project-main-container .step ul:nth-child(2) {
  z-index: 9;
  counter-reset: NB;
}

.project-main-container .step ul:nth-child(2) li {
  text-align: center;
}

.project-main-container .step ul:nth-child(2) li p {
  display: inline-block;
  padding: 2px 6px;
  background: #fff;
  font-size: 14px;
  position: relative;
}

@media (max-width: 767px) {
  .project-main-container .step ul:nth-child(2) li p {
    padding: 2px 4px;
    font-size: 13px;
  }
}

.project-main-container .step ul:nth-child(2) li p:before {
  content: counter(NB);
  counter-increment: NB;
  position: absolute;
  left: -24px;
  top: -1px;
  letter-spacing: 0px;
  font-family: Helvetica;
  width: 26px;
  height: 26px;
  line-height: 28px;
  border-radius: 50%;
  font-size: 15px;
  text-align: center;
  background: #b9b9b9;
  color: #fff;
  z-index: 2;
  display: block;
  font-weight: normal;
}

@media (max-width: 767px) {
  .project-main-container .step ul:nth-child(2) li p:before {
    margin: -24px auto auto auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
}

.project-main-container .step ul:nth-child(2) li p.active:before {
  background: #0c8f4f;
}

.nav-pills>li>a {
  border-radius: 4px;
}

.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
  background-color: #10be69;
}

.nav-tabs-style1 {
  border-bottom: none;
  letter-spacing: -5px;
  white-space: nowrap;
  position: relative;
  z-index: 2;
  overflow-x: auto;
  overflow-y: hidden;
  max-width: 100%;
}

.nav-tabs-style1>li {
  letter-spacing: 1px;
  display: inline-block;
  float: none;
  margin-bottom: 0px;
}

.nav-tabs-style1>li>a,
.nav-tabs-style1>li>a:hover {
  border: none;
  border-radius: 2px 2px 0 0;
  margin-right: 0;
}

.nav-tabs-style1>li.active>a,
.nav-tabs-style1>li.active>a:hover,
.nav-tabs-style1>li.active>a:active,
.nav-tabs-style1>li.active>a:focus {
  background: #10be69;
  color: #fff;
}

.nav-tabs-style2 {
  letter-spacing: -5px;
  white-space: nowrap;
  position: relative;
  overflow-x: auto;
  overflow-y: hidden;
  max-width: 100%;
}

.nav-tabs-style2>li {
  letter-spacing: 1px;
  display: inline-block;
  float: none;
  margin-bottom: 0px;
}

.nav-tabs-style2>li>a,
.nav-tabs-style2>li>a:hover {
  padding: 5px 8px;
}

.nav-tabs-style2.active-bottom-arr {
  padding-bottom: 5px;
}

.nav-tabs-style2.active-bottom-arr>li.active>a:before,
.nav-tabs-style2.active-bottom-arr>li.active>a:hover:before,
.nav-tabs-style2.active-bottom-arr>li.active>a:active:before,
.nav-tabs-style2.active-bottom-arr>li.active>a:focus:before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto auto -10px;
  border: 6px solid transparent;
  border-top-color: #10be69;
  line-height: 0;
  height: 0;
  width: 0;
}

.tabs-bottom-line {
  position: relative;
}

.tabs-bottom-line>li>a,
.tabs-bottom-line>li>a:hover {
  border-bottom: 1px solid #cccccc;
}

.tabs-bottom-line:after {
  content: "";
  z-index: 0;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 1px;
  background: #cccccc;
}

.tree-wrap {
  border: 1px solid #cccccc;
  overflow-x: auto;
  padding-bottom: 20px;
  max-height: 400px;
}

.tree,
.tree ol {
  border-left: 1px dotted #10be69;
  margin-left: 23px;
  list-style: none;
  padding-left: 0;
}

.tree li {
  position: relative;
  font-size: 15px;
  line-height: 1.6;
}

.tree li:after {
  content: "";
  border-bottom: 1px dotted #10be69;
  width: 16px;
  position: absolute;
  top: 24px;
  left: 0;
}

.tree li div {
  padding-left: 18px;
  position: relative;
  top: 12px;
  display: block;
  z-index: 9;
}

.tree li div a {
  padding: 2px;
  cursor: pointer;
  color: #333333;
}

.tree li div a:hover,
.tree li div a:active,
.tree li div a:focus {
  background: #e6e6e6;
  color: #333333;
}

.tree li label {
  position: absolute;
  top: 17px;
  z-index: 99;
  left: -8px;
  margin-left: 0 !important;
  margin-bottom: 0 !important;
}

.tree li label div {
  top: 0px;
}

.tree li label:before {
  content: "\f196";
  font-family: 'FontAwesome';
  font-size: 15px;
  position: absolute;
  left: 0;
  top: 0;
  color: #0c8f4f;
  font-weight: 600;
  width: 15px;
  height: 15px;
  line-height: 15px;
  background: #FFF;
  display: block;
  text-align: center;
}

.tree li input:checked+label:before {
  content: "\f147 ";
  font-family: 'FontAwesome';
}

.tree li input {
  position: absolute;
  left: -8px;
  top: 12px;
  opacity: 0;
  z-index: 2;
  cursor: pointer;
  height: 18px;
  width: 18px;
}

.tree li input~ol {
  display: none;
}

.tree li input:checked~ol {
  display: block;
}

.tree-sort ul {
  letter-spacing: -5px;
  padding-left: 6px;
}

.tree-sort ul li:not(:last-child) {
  margin-right: 12px;
}

.tree-sort ul li {
  display: inline-block;
  font-size: 15px;
  text-align: center;
  letter-spacing: 1px;
}

.tree-sort ul li span:before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  position: relative;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  margin-right: 5px;
}

.tree-sort ul li .item01:before {
  background: #ff7070;
}

.tree-sort ul li .item02:before {
  background: #2f88d4;
}

.tree-sort ul li .item03:before {
  background: #ff9600;
}

.tree-sort ul li .item04:before {
  background: #1eb562;
}

.tree.sort {
  list-style: none;
}

.tree.sort a {
  font-style: normal;
}

.tree.sort [class*="icon"]:before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  position: relative;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  margin-right: 3px;
  top: -1px;
}

.tree.sort .lv-1-icon:before {
  background: #ff7070;
}

.tree.sort .lv-2-icon:before {
  background: #2f88d4;
}

.tree.sort .lv-3-icon:before {
  background: #ff9600;
}

.tree.sort .lv-4-icon:before {
  background: #1eb562;
}

.tree.sort [class*="text"] {
  font-family: "Arial";
  font-weight: bold;
  font-size: 13px;
  margin-right: 4px;
}

.tree.sort .lv-1-text {
  color: #ff7070;
}

.tree.sort .lv-2-text {
  color: #2f88d4;
}

.tree.sort .lv-3-text {
  color: #ff9600;
}

.tree.sort .lv-4-text {
  color: #1eb562;
}

.w-100 {
  width: 100% !important;
}

.flex-row,
.btn-file,
.product-column-wrap .product-column,
.product-column-wrap .product-column .item-box .pic,
.productNumber-column-wrap .productNumber-column {
  display: -webkit-flex;
  display: -ms-flex;
  display: flex;
  -webkit-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex-flow: row wrap;
}

.flex-nowrap {
  flex-wrap: nowrap !important;
}

.flex-row-inline {
  display: inline-flex;
}

.flex-col,
.flex-col-md,
.flex-col-sm,
.flex-col-xs,
[class*="flex-col"] {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  padding-left: 4px;
  padding-right: 4px;
  padding-bottom: 4px;
  position: relative;
}

.flex-col-none,
.flex-none,
.countResult.receipt-result .receipt-item label {
  -webkit-flex: none !important;
  -ms-flex: none !important;
  flex: none !important;
}

/*倍數*/
.flex-col-g2 {
  -webkit-flex-grow: 2;
  -ms-flex-grow: 2;
  flex-grow: 2;
}

.flex-col-g3 {
  -webkit-flex-grow: 3;
  -ms-flex-grow: 3;
  flex-grow: 3;
}

.flex-col-g4 {
  -webkit-flex-grow: 4;
  -ms-flex-grow: 4;
  flex-grow: 4;
}

.flex-col-g5 {
  -webkit-flex-grow: 5;
  -ms-flex-grow: 5;
  flex-grow: 5;
}

.flex-col-g6 {
  -webkit-flex-grow: 6;
  -ms-flex-grow: 6;
  flex-grow: 6;
}

.flex-col-g7 {
  -webkit-flex-grow: 7;
  -ms-flex-grow: 7;
  flex-grow: 7;
}

.flex-col-g6 {
  -webkit-flex-grow: 8;
  -ms-flex-grow: 6;
  flex-grow: 8;
}

@media (min-width: 768px) and (max-width: 991px) {
  .flex-col-sm-12-important {
    -webkit-flex: 1 100% !important;
    -ms-flex: 1 100% !important;
    flex: 1 100% !important;
  }

  .flex-col-sm-12 {
    -webkit-flex: 1 100%;
    -ms-flex: 1 100% !important;
    flex: 1 100%;
  }

  .flex-col-sm-11 {
    -webkit-flex: 1 91.66666667%;
    -ms-flex: 1 91.66666667%;
    flex: 1 91.66666667%;
  }

  .flex-col-sm-10 {
    -webkit-flex: 1 83.33333333%;
    -ms-flex: 1 83.33333333%;
    flex: 1 83.33333333%;
  }

  .flex-col-sm-9 {
    -webkit-flex: 1 75%;
    -ms-flex: 1 75%;
    flex: 1 75%;
    width: 75%;
  }

  .flex-col-sm-8 {
    -webkit-flex: 1 66.66666667%;
    -ms-flex: 1 66.66666667%;
    flex: 1 66.66666667%;
  }

  .flex-col-sm-7 {
    -webkit-flex: 1 58.33333333%;
    -ms-flex: 1 58.33333333%;
    flex: 1 58.33333333%;
  }

  .flex-col-sm-6 {
    -webkit-flex: 1 50%;
    -ms-flex: 1 50%;
    flex: 1 50%;
  }

  .flex-col-sm-5 {
    -webkit-flex: 1 41.66666667%;
    -ms-flex: 1 41.66666667%;
    flex: 1 41.66666667%;
  }

  .flex-col-sm-4 {
    -webkit-flex: 1 33.33333333%;
    -ms-flex: 1 33.33333333%;
    flex: 1 33.33333333%;
  }

  .flex-col-sm-3 {
    -webkit-flex: 1 25%;
    -ms-flex: 1 25%;
    flex: 1 25%;
    width: 25%;
  }

  .flex-col-sm-2 {
    -webkit-flex: 1 16.66666667%;
    -ms-flex: 1 16.66666667%;
    flex: 1 16.66666667%;
  }

  .flex-col-sm-1 {
    -webkit-flex: 1 8.33333333%;
    -ms-flex: 1 8.33333333%;
    flex: 1 8.33333333%;
  }

  .flex-col-sm-first {
    -webkit-order: -1;
    -ms-flex-order: -1;
    -webkit-box-ordinal-group: 0;
    order: -1;
  }

  .flex-col-sm-last {
    -webkit-order: 1;
    -ms-flex-order: 1;
    -webkit-box-ordinal-group: 2;
    order: 1;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .flex-col-md-12-important {
    -webkit-flex: 1 100% !important;
    -ms-flex: 1 100% !important;
    flex: 1 100% !important;
  }

  .flex-col-md-12 {
    -webkit-flex: 1 100%;
    -ms-flex: 1 100%;
    flex: 1 100%;
  }

  .flex-col-md-11 {
    -webkit-flex: 1 91.66666667%;
    -ms-flex: 1 91.66666667%;
    flex: 1 91.66666667%;
  }

  .flex-col-md-10 {
    -webkit-flex: 1 83.33333333%;
    -ms-flex: 1 83.33333333%;
    flex: 1 83.33333333%;
  }

  .flex-col-md-9 {
    -webkit-flex: 1 75%;
    -ms-flex: 1 75%;
    flex: 1 75%;
    width: 75%;
  }

  .flex-col-md-8 {
    -webkit-flex: 1 66.66666667%;
    -ms-flex: 1 66.66666667%;
    flex: 1 66.66666667%;
  }

  .flex-col-md-7 {
    -webkit-flex: 1 58.33333333%;
    -ms-flex: 1 58.33333333%;
    flex: 1 58.33333333%;
  }

  .flex-col-md-6 {
    -webkit-flex: 1 50%;
    -ms-flex: 1 50%;
    flex: 1 50%;
  }

  .flex-col-md-5 {
    -webkit-flex: 1 41.66666667%;
    -ms-flex: 1 41.66666667%;
    flex: 1 41.66666667%;
  }

  .flex-col-md-4 {
    -webkit-flex: 1 33.33333333%;
    -ms-flex: 1 33.33333333%;
    flex: 1 33.33333333%;
  }

  .flex-col-md-3 {
    -webkit-flex: 1 25%;
    -ms-flex: 1 25%;
    flex: 1 25%;
    width: 25%;
  }

  .flex-col-md-2 {
    -webkit-flex: 1 16.66666667%;
    -ms-flex: 1 16.66666667%;
    flex: 1 16.66666667%;
  }

  .flex-col-md-1 {
    -webkit-flex: 1 8.33333333%;
    -ms-flex: 1 8.33333333%;
    flex: 1 8.33333333%;
  }

  .flex-col-md-first {
    -webkit-order: -1;
    -ms-flex-order: -1;
    -webkit-box-ordinal-group: 0;
    order: -1;
  }

  .flex-col-md-last {
    -webkit-order: 1;
    -ms-flex-order: 1;
    -webkit-box-ordinal-group: 2;
    order: 1;
  }
}

@media (min-width: 1200px) {
  .flex-col-lg-12 {
    -webkit-flex: 1 100%;
    -ms-flex: 1 100%;
    flex: 1 100%;
  }

  .flex-col-lg-11 {
    -webkit-flex: 1 91.66666667%;
    -ms-flex: 1 91.66666667%;
    flex: 1 91.66666667%;
  }

  .flex-col-lg-10 {
    -webkit-flex: 1 83.33333333%;
    -ms-flex: 1 83.33333333%;
    flex: 1 83.33333333%;
  }

  .flex-col-lg-9 {
    -webkit-flex: 1 75%;
    -ms-flex: 1 75%;
    flex: 1 75%;
    width: 75%;
  }

  .flex-col-lg-8 {
    -webkit-flex: 1 66.66666667%;
    -ms-flex: 1 66.66666667%;
    flex: 1 66.66666667%;
  }

  .flex-col-lg-7 {
    -webkit-flex: 1 58.33333333%;
    -ms-flex: 1 58.33333333%;
    flex: 1 58.33333333%;
  }

  .flex-col-lg-6 {
    -webkit-flex: 1 50%;
    -ms-flex: 1 50%;
    flex: 1 50%;
  }

  .flex-col-lg-5 {
    -webkit-flex: 1 41.66666667%;
    -ms-flex: 1 41.66666667%;
    flex: 1 41.66666667%;
  }

  .flex-col-lg-4 {
    -webkit-flex: 1 33.33333333%;
    -ms-flex: 1 33.33333333%;
    flex: 1 33.33333333%;
  }

  .flex-col-lg-3 {
    -webkit-flex: 1 25%;
    -ms-flex: 1 25%;
    flex: 1 25%;
    width: 25%;
  }

  .flex-col-lg-2 {
    -webkit-flex: 1 16.66666667%;
    -ms-flex: 1 16.66666667%;
    flex: 1 16.66666667%;
  }

  .flex-col-lg-1 {
    -webkit-flex: 1 8.33333333%;
    -ms-flex: 1 8.33333333%;
    flex: 1 8.33333333%;
  }

  .flex-col-lg-first {
    -webkit-order: -1;
    -ms-flex-order: -1;
    -webkit-box-ordinal-group: 0;
    order: -1;
  }

  .flex-col-lg-last {
    -webkit-order: 1;
    -ms-flex-order: 1;
    -webkit-box-ordinal-group: 2;
    order: 1;
  }

  .flex-nowrap-lg {
    flex-wrap: nowrap !important;
  }

  .flex-col-none-lg,
  .flex-none-lg {
    -webkit-flex: none !important;
    -ms-flex: none !important;
    flex: none !important;
  }
}

@media (max-width: 767px) {
  [class*="flex-col"] {
    max-width: none !important;
    -webkit-flex: 1 100%;
    -ms-flex: 1 100%;
    flex: 1 100%;
  }

  .flex-col-xs-12-important {
    -webkit-flex: 1 100% !important;
    -ms-flex: 1 100% !important;
    flex: 1 100% !important;
  }

  .flex-col-xs-12 {
    -webkit-flex: 1 100%;
    -ms-flex: 1 100%;
    flex: 1 100%;
  }

  .flex-col-xs-11 {
    -webkit-flex: 1 91.66666667%;
    -ms-flex: 1 91.66666667%;
    flex: 1 91.66666667%;
  }

  .flex-col-xs-10 {
    -webkit-flex: 1 83.33333333%;
    -ms-flex: 1 83.33333333%;
    flex: 1 83.33333333%;
  }

  .flex-col-xs-9 {
    -webkit-flex: 1 75%;
    -ms-flex: 1 75%;
    flex: 1 75%;
    width: 75%;
  }

  .flex-col-xs-8 {
    -webkit-flex: 1 66.66666667%;
    -ms-flex: 1 66.66666667%;
    flex: 1 66.66666667%;
  }

  .flex-col-xs-7 {
    -webkit-flex: 1 58.33333333%;
    -ms-flex: 1 58.33333333%;
    flex: 1 58.33333333%;
  }

  .flex-col-xs-6 {
    -webkit-flex: 1 50%;
    -ms-flex: 1 50%;
    flex: 1 50%;
  }

  .flex-col-xs-5 {
    -webkit-flex: 1 41.66666667%;
    -ms-flex: 1 41.66666667%;
    flex: 1 41.66666667%;
  }

  .flex-col-xs-4 {
    -webkit-flex: 1 33.33333333%;
    -ms-flex: 1 33.33333333%;
    flex: 1 33.33333333%;
  }

  .flex-col-xs-3 {
    -webkit-flex: 1 25%;
    -ms-flex: 1 25%;
    flex: 1 25%;
    width: 25%;
  }

  .flex-col-xs-2 {
    -webkit-flex: 1 16.66666667%;
    -ms-flex: 1 16.66666667%;
    flex: 1 16.66666667%;
  }

  .flex-col-xs-1 {
    -webkit-flex: 1 8.33333333%;
    -ms-flex: 1 8.33333333%;
    flex: 1 8.33333333%;
  }

  .flex-col-xs-first {
    -webkit-order: -1;
    -ms-flex-order: -1;
    -webkit-box-ordinal-group: 0;
    order: -1;
  }

  .flex-col-xs-last {
    -webkit-order: 1;
    -ms-flex-order: 1;
    -webkit-box-ordinal-group: 2;
    order: 1;
  }

  .flex-col-xs {
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding-left: 4px;
    padding-right: 4px;
    padding-bottom: 4px;
  }
}

/*---------------------排位 順序 間距 設定----------------------*/
/*--左右反轉-*/
.flex-row-reverse {
  -webkit-flex-flow: row-reverse nowrap;
  -ms-flex-flow: row-reverse nowrap;
  flex-flow: row-reverse nowrap;
}

.flex-start {
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  -webkit-box-pack: start;
  justify-content: flex-start;
  text-align: start;
}

.flex-center,
.btn-file,
.product-column-wrap .product-column .item-box .pic {
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  -webkit-box-pack: center;
  justify-content: center;
  text-align: center;
}

.flex-end {
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  -webkit-box-pack: end;
  justify-content: flex-end;
  text-align: end;
}

.flex-top {
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  -webkit-box-align: start;
  align-items: flex-start;
}

.flex-middle,
.btn-file,
.product-column-wrap .product-column .item-box .pic {
  -webkit-align-items: center;
  -ms-flex-align: center;
  -webkit-box-align: center;
  align-items: center;
}

.flex-bottom {
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  -webkit-box-align: end;
  align-items: flex-end;
}

.flex-around {
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.flex-between {
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  -webkit-box-pack: justify;
  justify-content: space-between;
}

.flex-col-first {
  -webkit-order: -1;
  -ms-flex-order: -1;
  -webkit-box-ordinal-group: 0;
  order: -1;
}

.flex-col-last {
  -webkit-order: 1;
  -ms-flex-order: 1;
  -webkit-box-ordinal-group: 2;
  order: 1;
}

@-ms-viewport {
  width: auto !important;
}

/* ---------------------------------------------------------------------- */
/*  Only larger Devices
/* ---------------------------------------------------------------------- */
@media (min-width: 1824px) {

  .layout-boxed>.main-wrapper,
  .layout-boxed .navbar,
  .layout-boxed footer,
  .layout-boxed .newton,
  .layout-boxed #horizontal-menu {
    max-width: 1470px !important;
  }

  .layout-boxed .main-wrapper>.topbar,
  .layout-boxed .main-wrapper>footer,
  .layout-boxed #horizontal-menu {
    left: 50% !important;
    margin-left: -734px !important;
  }
}

@media (min-width: 1224px) and (max-width: 1823px) {

  .layout-boxed>.main-wrapper,
  .layout-boxed .navbar,
  .layout-boxed footer,
  .layout-boxed .newton,
  .layout-boxed #horizontal-menu {
    max-width: 1170px !important;
  }

  .layout-boxed .main-wrapper>.topbar,
  .layout-boxed .main-wrapper>footer,
  .layout-boxed #horizontal-menu {
    left: 50% !important;
    margin-left: -584px !important;
  }
}

@media (min-width: 992px) {

  /* 992px */
  .layout-boxed #pageslide-left {
    left: auto !important;
    margin-left: 0 !important;
  }

  .layout-boxed .closedbar {
    left: auto !important;
    display: none;
  }

  .layout-boxed.sidebar-close #pageslide-left {
    display: none;
  }

  .layout-boxed.sidebar-close .main-container {
    margin-left: 0 !important;
  }

  .layout-boxed.sidebar-close .closedbar {
    display: block;
  }
}

@media (min-width: 1200px) {

  /* 1200px */
  .core-box .title {
    font-weight: bold;
    font-size: 16px;
    line-height: 16px;
    font-size: 1.5vw;
    line-height: 1.5vw;
  }
}

/* ---------------------------------------------------------------------- */
/*  Small Devices Only
/* ---------------------------------------------------------------------- */
@media (max-width: 767px) {

  /* 767px */
  .current-user .dropdown-menu {
    right: auto !important;
    left: -100px !important;
  }

  .toolbar .tooltip-notification {
    right: auto;
  }

  .tooltip-notification .tooltip-notification-arrow {
    left: 40%;
  }
}

/* ---------------------------------------------------------------------- */
/*  From Small Devices Up To Medium Devices
/* ---------------------------------------------------------------------- */
@media (min-width: 768px) and (max-width: 991px) {

  /* 768px - 991px */
  .current-user .dropdown-menu {
    right: auto !important;
    left: -30px !important;
  }
}

/* ---------------------------------------------------------------------- */
/*  Up To Medium Devices
 /* ---------------------------------------------------------------------- */
@media (max-width: 991px) {

  /* 991px */
  .horizontal-menu-fixed .main-container {
    margin-top: 36px !important;
  }

  .main-container {
    margin-left: 0 !important;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
    left: 0;
  }

  .sidebar-mobile-open .main-container {
    left: 220px !important;
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    -webkit-transition: all 0.1s linear;
    -ms-transition: all 0.1s linear;
    transition: all 0.1s linear;
  }

  .main-content .container>.row,
  #ajax-content>.row {
    padding: 0;
  }

  .topbar {
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
  }

  .sidebar-mobile-open .topbar {
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    -webkit-transition: all 0.1s linear;
    -ms-transition: all 0.1s linear;
    transition: all 0.1s linear;
    left: 220px !important;
    right: -220px !important;
  }

  .topbar>.container .navbar-header {
    float: none;
    margin: 12px 0 0 10px;
    width: 140px;
  }

  .topbar {
    min-height: 50px !important;
    position: relative !important;
  }

  .topbar .container .navbar-header .sb-toggle-left {
    height: 50px !important;
    line-height: 50px !important;
  }

  .topbar .container .navbar-header .navbar-brand {
    line-height: 50px !important;
  }

  .topbar .container .topbar-tools {
    height: 50px !important;
    max-height: 50px !important;
  }

  .topbar .container .topbar-tools>ul>li.current-user .dropdown-toggle {
    line-height: 50px !important;
    height: 50px !important;
  }

  .topbar .container .topbar-tools>ul>li.right-menu-toggle a {
    line-height: 40px;
    height: 40px;
  }

  .main-container,
  .horizontal-menu-fixed .main-container {
    /*  margin-top: 0 !important; */
    top: 0 !important;
  }

  .topbar>.container .navbar-brand,
  .logo {
    /* left: 50px; */
  }

  li.dropdown.current-user .dropdown-toggle>i {
    margin-left: 0;
  }

  .dropdown-subview {
    right: auto !important;
    left: -15px !important;
  }

  .dropdown-subview:before {
    right: auto !important;
    left: 49px !important;
  }

  .dropdown-subview:after {
    right: auto !important;
    left: 50px !important;
  }

  .dropdown-messages {
    right: auto !important;
    left: -110px !important;
  }

  .dropdown-messages:before {
    right: auto !important;
    left: 144px !important;
  }

  .dropdown-messages:after {
    right: auto !important;
    left: 145px !important;
  }

  .main-content .row {
    padding: 0 !important;
  }

  #pageslide-left {
    top: 0;
    left: -220px !important;
    margin-left: 0 !important;
    padding-top: 0 !important;
  }

  .sidebar-mobile-open #pageslide-left {
    left: 0 !important;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
  }

  #pageslide-left .navbar-content {
    top: 0;
  }

  .flot-small-container {
    height: 200px;
  }

  .main-content,
  footer .footer-inner {
    position: relative;
    margin-left: 0 !important;
  }

  .sidebar-mobile-open footer {
    left: 220px !important;
  }

  div.timeline {
    margin: 0;
  }

  div.timeline .columns li {
    float: none !important;
    width: 100% !important;
  }

  .timeline_element {
    margin: 20px auto !important;
  }

  .timeline_element:after {
    display: none;
  }

  .timeline_element:before {
    display: none;
  }

  .timeline-scrubber {
    display: none;
  }

  .faq .nav-tabs {
    float: none;
  }

  .page-header h1 {
    font-size: 24px;
    margin-top: 15px !important;
  }

  /*Lock Screen*/
  .main-ls {
    height: auto;
    left: 0;
    margin: 0 auto !important;
    position: relative;
    top: 0;
    width: 85%;
  }

  .main-ls .logo,
  .main-ls .copyright {
    text-align: center;
  }

  body.lock-screen .box-ls {
    display: inline-block;
    text-align: center;
    width: 100% !important;
  }

  body.lock-screen .user-info {
    float: none !important;
    width: auto !important;
  }

  .mini-stats li {
    border-right: 1px solid #30ddc6;
  }

  .mini-stats li:last-child {
    border-right: 0 none;
  }

  #sidebar-tab.nav-justified>li {
    display: table-cell;
    width: 1%;
  }

  #sidebar-tab.nav-justified>li a {
    border: 1px solid transparent;
  }
}

.w-1 {
  width: 1%;
}

.w-full {
  width: 100%;
}

.w5 {
  width: 5px;
}

.w10 {
  width: 10px;
}

.w15 {
  width: 15px;
}

.w20 {
  width: 20px;
}

.w25 {
  width: 25px;
}

.w30 {
  width: 30px;
}

.w35 {
  width: 35px;
}

.w40 {
  width: 40px;
}

.w45 {
  width: 45px;
}

.w50 {
  width: 50px;
}

.w55 {
  width: 55px;
}

.w60 {
  width: 60px;
}

.w65 {
  width: 65px;
}

.w70 {
  width: 70px;
}

.w75 {
  width: 75px;
}

.w80 {
  width: 80px;
}

.w85 {
  width: 85px;
}

.w90 {
  width: 90px;
}

.w95 {
  width: 95px;
}

.w100 {
  width: 100px;
}

.w105 {
  width: 105px;
}

.w110 {
  width: 110px;
}

.w115 {
  width: 115px;
}

.w120 {
  width: 120px;
}

.w125 {
  width: 125px;
}

.w130 {
  width: 130px;
}

.w135 {
  width: 135px;
}

.w140 {
  width: 140px;
}

.w145 {
  width: 145px;
}

.w150 {
  width: 150px;
}

.w155 {
  width: 155px;
}

.w160 {
  width: 160px;
}

.w165 {
  width: 165px;
}

.w170 {
  width: 170px;
}

.w175 {
  width: 175px;
}

.w180 {
  width: 180px;
}

.w185 {
  width: 185px;
}

.w190 {
  width: 190px;
}

.w195 {
  width: 195px;
}

.w200 {
  width: 200px;
}

.w205 {
  width: 205px;
}

.w210 {
  width: 210px;
}

.w215 {
  width: 215px;
}

.w220 {
  width: 220px;
}

.w225 {
  width: 225px;
}

.w230 {
  width: 230px;
}

.w235 {
  width: 235px;
}

.w240 {
  width: 240px;
}

.w245 {
  width: 245px;
}

.w250 {
  width: 250px;
}

.w255 {
  width: 255px;
}

.w260 {
  width: 260px;
}

.w265 {
  width: 265px;
}

.w270 {
  width: 270px;
}

.w275 {
  width: 275px;
}

.w280 {
  width: 280px;
}

.w285 {
  width: 285px;
}

.w290 {
  width: 290px;
}

.w295 {
  width: 295px;
}

.w300 {
  width: 300px;
}

.w305 {
  width: 305px;
}

.w310 {
  width: 310px;
}

.w315 {
  width: 315px;
}

.w320 {
  width: 320px;
}

.w325 {
  width: 325px;
}

.w330 {
  width: 330px;
}

.w335 {
  width: 335px;
}

.w340 {
  width: 340px;
}

.w345 {
  width: 345px;
}

.w350 {
  width: 350px;
}

.w355 {
  width: 355px;
}

.w360 {
  width: 360px;
}

.w365 {
  width: 365px;
}

.w370 {
  width: 370px;
}

.w375 {
  width: 375px;
}

.w380 {
  width: 380px;
}

.w385 {
  width: 385px;
}

.w390 {
  width: 390px;
}

.w395 {
  width: 395px;
}

.w400 {
  width: 400px;
}

.w405 {
  width: 405px;
}

.w410 {
  width: 410px;
}

.w415 {
  width: 415px;
}

.w420 {
  width: 420px;
}

.w425 {
  width: 425px;
}

.w430 {
  width: 430px;
}

.w435 {
  width: 435px;
}

.w440 {
  width: 440px;
}

.w445 {
  width: 445px;
}

.w450 {
  width: 450px;
}

.w455 {
  width: 455px;
}

.w460 {
  width: 460px;
}

.w465 {
  width: 465px;
}

.w470 {
  width: 470px;
}

.w475 {
  width: 475px;
}

.w480 {
  width: 480px;
}

.w485 {
  width: 485px;
}

.w490 {
  width: 490px;
}

.w495 {
  width: 495px;
}

.w500 {
  width: 500px;
}

.w505 {
  width: 505px;
}

.w510 {
  width: 510px;
}

.w515 {
  width: 515px;
}

.w520 {
  width: 520px;
}

.w525 {
  width: 525px;
}

.w530 {
  width: 530px;
}

.w535 {
  width: 535px;
}

.w540 {
  width: 540px;
}

.w545 {
  width: 545px;
}

.w550 {
  width: 550px;
}

.w555 {
  width: 555px;
}

.w560 {
  width: 560px;
}

.w565 {
  width: 565px;
}

.w570 {
  width: 570px;
}

.w575 {
  width: 575px;
}

.w580 {
  width: 580px;
}

.w585 {
  width: 585px;
}

.w590 {
  width: 590px;
}

.w595 {
  width: 595px;
}

.w600 {
  width: 600px;
}

.w605 {
  width: 605px;
}

.w610 {
  width: 610px;
}

.w615 {
  width: 615px;
}

.w620 {
  width: 620px;
}

.w625 {
  width: 625px;
}

.w630 {
  width: 630px;
}

.w635 {
  width: 635px;
}

.w640 {
  width: 640px;
}

.w645 {
  width: 645px;
}

.w650 {
  width: 650px;
}

.w655 {
  width: 655px;
}

.w660 {
  width: 660px;
}

.w665 {
  width: 665px;
}

.w670 {
  width: 670px;
}

.w675 {
  width: 675px;
}

.w680 {
  width: 680px;
}

.w685 {
  width: 685px;
}

.w690 {
  width: 690px;
}

.w695 {
  width: 695px;
}

.w700 {
  width: 700px;
}

.w705 {
  width: 705px;
}

.w710 {
  width: 710px;
}

.w715 {
  width: 715px;
}

.w720 {
  width: 720px;
}

.w725 {
  width: 725px;
}

.w730 {
  width: 730px;
}

.w735 {
  width: 735px;
}

.w740 {
  width: 740px;
}

.w745 {
  width: 745px;
}

.w750 {
  width: 750px;
}

.rwd-max500 {
  max-width: 500px;
  width: 100%;
}

.rwd-max550 {
  max-width: 550px;
  width: 100%;
}

.rwd-max600 {
  max-width: 600px;
  width: 100%;
}

.rwd-max650 {
  max-width: 650px;
  width: 100%;
}

.rwd-max700 {
  max-width: 700px;
  width: 100%;
}

.rwd-max750 {
  max-width: 750px;
  width: 100%;
}

.rwd-max800 {
  max-width: 800px;
  width: 100%;
}

.rwd-max850 {
  max-width: 850px;
  width: 100%;
}

.rwd-max900 {
  max-width: 900px;
  width: 100%;
}

.rwd-max950 {
  max-width: 950px;
  width: 100%;
}

.rwd-max1000 {
  max-width: 1000px;
  width: 100%;
}

.rwd-max1050 {
  max-width: 1050px;
  width: 100%;
}

.rwd-max1100 {
  max-width: 1100px;
  width: 100%;
}

.rwd-max1150 {
  max-width: 1150px;
  width: 100%;
}

.rwd-max1200 {
  max-width: 1200px;
  width: 100%;
}

.min-5 {
  min-width: 5px !important;
}

.min-10 {
  min-width: 10px !important;
}

.min-15 {
  min-width: 15px !important;
}

.min-20 {
  min-width: 20px !important;
}

.min-25 {
  min-width: 25px !important;
}

.min-30 {
  min-width: 30px !important;
}

.min-35 {
  min-width: 35px !important;
}

.min-40 {
  min-width: 40px !important;
}

.min-45 {
  min-width: 45px !important;
}

.min-50 {
  min-width: 50px !important;
}

.min-55 {
  min-width: 55px !important;
}

.min-60 {
  min-width: 60px !important;
}

.min-65 {
  min-width: 65px !important;
}

.min-70 {
  min-width: 70px !important;
}

.min-75 {
  min-width: 75px !important;
}

.min-80 {
  min-width: 80px !important;
}

.min-85 {
  min-width: 85px !important;
}

.min-90 {
  min-width: 90px !important;
}

.min-95 {
  min-width: 95px !important;
}

.min-100 {
  min-width: 100px !important;
}

.min-105 {
  min-width: 105px !important;
}

.min-110 {
  min-width: 110px !important;
}

.min-115 {
  min-width: 115px !important;
}

.min-120 {
  min-width: 120px !important;
}

.min-125 {
  min-width: 125px !important;
}

.min-130 {
  min-width: 130px !important;
}

.min-135 {
  min-width: 135px !important;
}

.min-140 {
  min-width: 140px !important;
}

.min-145 {
  min-width: 145px !important;
}

.min-150 {
  min-width: 150px !important;
}

.min-155 {
  min-width: 155px !important;
}

.min-160 {
  min-width: 160px !important;
}

.min-165 {
  min-width: 165px !important;
}

.min-170 {
  min-width: 170px !important;
}

.min-175 {
  min-width: 175px !important;
}

.min-180 {
  min-width: 180px !important;
}

.min-185 {
  min-width: 185px !important;
}

.min-190 {
  min-width: 190px !important;
}

.min-195 {
  min-width: 195px !important;
}

.min-200 {
  min-width: 200px !important;
}

.min-205 {
  min-width: 205px !important;
}

.min-210 {
  min-width: 210px !important;
}

.min-215 {
  min-width: 215px !important;
}

.min-220 {
  min-width: 220px !important;
}

.min-225 {
  min-width: 225px !important;
}

.min-230 {
  min-width: 230px !important;
}

.min-235 {
  min-width: 235px !important;
}

.min-240 {
  min-width: 240px !important;
}

.min-245 {
  min-width: 245px !important;
}

.min-250 {
  min-width: 250px !important;
}

.min-255 {
  min-width: 255px !important;
}

.min-260 {
  min-width: 260px !important;
}

.min-265 {
  min-width: 265px !important;
}

.min-270 {
  min-width: 270px !important;
}

.min-275 {
  min-width: 275px !important;
}

.min-280 {
  min-width: 280px !important;
}

.min-285 {
  min-width: 285px !important;
}

.min-290 {
  min-width: 290px !important;
}

.min-295 {
  min-width: 295px !important;
}

.min-300 {
  min-width: 300px !important;
}

.min-305 {
  min-width: 305px !important;
}

.min-310 {
  min-width: 310px !important;
}

.min-315 {
  min-width: 315px !important;
}

.min-320 {
  min-width: 320px !important;
}

.min-325 {
  min-width: 325px !important;
}

.min-330 {
  min-width: 330px !important;
}

.min-335 {
  min-width: 335px !important;
}

.min-340 {
  min-width: 340px !important;
}

.min-345 {
  min-width: 345px !important;
}

.min-350 {
  min-width: 350px !important;
}

.min-355 {
  min-width: 355px !important;
}

.min-360 {
  min-width: 360px !important;
}

.min-365 {
  min-width: 365px !important;
}

.min-370 {
  min-width: 370px !important;
}

.min-375 {
  min-width: 375px !important;
}

.min-380 {
  min-width: 380px !important;
}

.min-385 {
  min-width: 385px !important;
}

.min-390 {
  min-width: 390px !important;
}

.min-395 {
  min-width: 395px !important;
}

.min-400 {
  min-width: 400px !important;
}

.min-405 {
  min-width: 405px !important;
}

.min-410 {
  min-width: 410px !important;
}

.min-415 {
  min-width: 415px !important;
}

.min-420 {
  min-width: 420px !important;
}

.min-425 {
  min-width: 425px !important;
}

.min-430 {
  min-width: 430px !important;
}

.min-435 {
  min-width: 435px !important;
}

.min-440 {
  min-width: 440px !important;
}

.min-445 {
  min-width: 445px !important;
}

.min-450 {
  min-width: 450px !important;
}

.min-455 {
  min-width: 455px !important;
}

.min-460 {
  min-width: 460px !important;
}

.min-465 {
  min-width: 465px !important;
}

.min-470 {
  min-width: 470px !important;
}

.min-475 {
  min-width: 475px !important;
}

.min-480 {
  min-width: 480px !important;
}

.min-485 {
  min-width: 485px !important;
}

.min-490 {
  min-width: 490px !important;
}

.min-495 {
  min-width: 495px !important;
}

.min-500 {
  min-width: 500px !important;
}

.max-5 {
  max-width: 5px;
}

.max-10 {
  max-width: 10px;
}

.max-15 {
  max-width: 15px;
}

.max-20 {
  max-width: 20px;
}

.max-25 {
  max-width: 25px;
}

.max-30 {
  max-width: 30px;
}

.max-35 {
  max-width: 35px;
}

.max-40 {
  max-width: 40px;
}

.max-45 {
  max-width: 45px;
}

.max-50 {
  max-width: 50px;
}

.max-55 {
  max-width: 55px;
}

.max-60 {
  max-width: 60px;
}

.max-65 {
  max-width: 65px;
}

.max-70 {
  max-width: 70px;
}

.max-75 {
  max-width: 75px;
}

.max-80 {
  max-width: 80px;
}

.max-85 {
  max-width: 85px;
}

.max-90 {
  max-width: 90px;
}

.max-95 {
  max-width: 95px;
}

.max-100 {
  max-width: 100px;
}

.max-105 {
  max-width: 105px;
}

.max-110 {
  max-width: 110px;
}

.max-115 {
  max-width: 115px;
}

.max-120 {
  max-width: 120px;
}

.max-125 {
  max-width: 125px;
}

.max-130 {
  max-width: 130px;
}

.max-135 {
  max-width: 135px;
}

.max-140 {
  max-width: 140px;
}

.max-145 {
  max-width: 145px;
}

.max-150 {
  max-width: 150px;
}

.max-155 {
  max-width: 155px;
}

.max-160 {
  max-width: 160px;
}

.max-165 {
  max-width: 165px;
}

.max-170 {
  max-width: 170px;
}

.max-175 {
  max-width: 175px;
}

.max-180 {
  max-width: 180px;
}

.max-185 {
  max-width: 185px;
}

.max-190 {
  max-width: 190px;
}

.max-195 {
  max-width: 195px;
}

.max-200 {
  max-width: 200px;
}

.max-205 {
  max-width: 205px;
}

.max-210 {
  max-width: 210px;
}

.max-215 {
  max-width: 215px;
}

.max-220 {
  max-width: 220px;
}

.max-225 {
  max-width: 225px;
}

.max-230 {
  max-width: 230px;
}

.max-235 {
  max-width: 235px;
}

.max-240 {
  max-width: 240px;
}

.max-245 {
  max-width: 245px;
}

.max-250 {
  max-width: 250px;
}

.max-255 {
  max-width: 255px;
}

.max-260 {
  max-width: 260px;
}

.max-265 {
  max-width: 265px;
}

.max-270 {
  max-width: 270px;
}

.max-275 {
  max-width: 275px;
}

.max-280 {
  max-width: 280px;
}

.max-285 {
  max-width: 285px;
}

.max-290 {
  max-width: 290px;
}

.max-295 {
  max-width: 295px;
}

.max-300 {
  max-width: 300px;
}

.max-305 {
  max-width: 305px;
}

.max-310 {
  max-width: 310px;
}

.max-315 {
  max-width: 315px;
}

.max-320 {
  max-width: 320px;
}

.max-325 {
  max-width: 325px;
}

.max-330 {
  max-width: 330px;
}

.max-335 {
  max-width: 335px;
}

.max-340 {
  max-width: 340px;
}

.max-345 {
  max-width: 345px;
}

.max-350 {
  max-width: 350px;
}

.max-355 {
  max-width: 355px;
}

.max-360 {
  max-width: 360px;
}

.max-365 {
  max-width: 365px;
}

.max-370 {
  max-width: 370px;
}

.max-375 {
  max-width: 375px;
}

.max-380 {
  max-width: 380px;
}

.max-385 {
  max-width: 385px;
}

.max-390 {
  max-width: 390px;
}

.max-395 {
  max-width: 395px;
}

.max-400 {
  max-width: 400px;
}

.max-405 {
  max-width: 405px;
}

.max-410 {
  max-width: 410px;
}

.max-415 {
  max-width: 415px;
}

.max-420 {
  max-width: 420px;
}

.max-425 {
  max-width: 425px;
}

.max-430 {
  max-width: 430px;
}

.max-435 {
  max-width: 435px;
}

.max-440 {
  max-width: 440px;
}

.max-445 {
  max-width: 445px;
}

.max-450 {
  max-width: 450px;
}

.max-455 {
  max-width: 455px;
}

.max-460 {
  max-width: 460px;
}

.max-465 {
  max-width: 465px;
}

.max-470 {
  max-width: 470px;
}

.max-475 {
  max-width: 475px;
}

.max-480 {
  max-width: 480px;
}

.max-485 {
  max-width: 485px;
}

.max-490 {
  max-width: 490px;
}

.max-495 {
  max-width: 495px;
}

.max-500 {
  max-width: 500px;
}

.max-505 {
  max-width: 505px;
}

.max-510 {
  max-width: 510px;
}

.max-515 {
  max-width: 515px;
}

.max-520 {
  max-width: 520px;
}

.max-525 {
  max-width: 525px;
}

.max-530 {
  max-width: 530px;
}

.max-535 {
  max-width: 535px;
}

.max-540 {
  max-width: 540px;
}

.max-545 {
  max-width: 545px;
}

.max-550 {
  max-width: 550px;
}

.max-555 {
  max-width: 555px;
}

.max-560 {
  max-width: 560px;
}

.max-565 {
  max-width: 565px;
}

.max-570 {
  max-width: 570px;
}

.max-575 {
  max-width: 575px;
}

.max-580 {
  max-width: 580px;
}

.max-585 {
  max-width: 585px;
}

.max-590 {
  max-width: 590px;
}

.max-595 {
  max-width: 595px;
}

.max-600 {
  max-width: 600px;
}

.max-605 {
  max-width: 605px;
}

.max-610 {
  max-width: 610px;
}

.max-615 {
  max-width: 615px;
}

.max-620 {
  max-width: 620px;
}

.max-625 {
  max-width: 625px;
}

.max-630 {
  max-width: 630px;
}

.max-635 {
  max-width: 635px;
}

.max-640 {
  max-width: 640px;
}

.max-645 {
  max-width: 645px;
}

.max-650 {
  max-width: 650px;
}

.max-655 {
  max-width: 655px;
}

.max-660 {
  max-width: 660px;
}

.max-665 {
  max-width: 665px;
}

.max-670 {
  max-width: 670px;
}

.max-675 {
  max-width: 675px;
}

.max-680 {
  max-width: 680px;
}

.max-685 {
  max-width: 685px;
}

.max-690 {
  max-width: 690px;
}

.max-695 {
  max-width: 695px;
}

.max-700 {
  max-width: 700px;
}

.max-705 {
  max-width: 705px;
}

.max-710 {
  max-width: 710px;
}

.max-715 {
  max-width: 715px;
}

.max-720 {
  max-width: 720px;
}

.max-725 {
  max-width: 725px;
}

.max-730 {
  max-width: 730px;
}

.max-735 {
  max-width: 735px;
}

.max-740 {
  max-width: 740px;
}

.max-745 {
  max-width: 745px;
}

.max-750 {
  max-width: 750px;
}

.max-755 {
  max-width: 755px;
}

.max-760 {
  max-width: 760px;
}

.max-765 {
  max-width: 765px;
}

.max-770 {
  max-width: 770px;
}

.max-775 {
  max-width: 775px;
}

.max-780 {
  max-width: 780px;
}

.max-785 {
  max-width: 785px;
}

.max-790 {
  max-width: 790px;
}

.max-795 {
  max-width: 795px;
}

.max-800 {
  max-width: 800px;
}

.max-805 {
  max-width: 805px;
}

.max-810 {
  max-width: 810px;
}

.max-815 {
  max-width: 815px;
}

.max-820 {
  max-width: 820px;
}

.max-825 {
  max-width: 825px;
}

.max-830 {
  max-width: 830px;
}

.max-835 {
  max-width: 835px;
}

.max-840 {
  max-width: 840px;
}

.max-845 {
  max-width: 845px;
}

.max-850 {
  max-width: 850px;
}

.max-855 {
  max-width: 855px;
}

.max-860 {
  max-width: 860px;
}

.max-865 {
  max-width: 865px;
}

.max-870 {
  max-width: 870px;
}

.max-875 {
  max-width: 875px;
}

.max-880 {
  max-width: 880px;
}

.max-885 {
  max-width: 885px;
}

.max-890 {
  max-width: 890px;
}

.max-895 {
  max-width: 895px;
}

.max-900 {
  max-width: 900px;
}

.max-905 {
  max-width: 905px;
}

.max-910 {
  max-width: 910px;
}

.max-915 {
  max-width: 915px;
}

.max-920 {
  max-width: 920px;
}

.max-925 {
  max-width: 925px;
}

.max-930 {
  max-width: 930px;
}

.max-935 {
  max-width: 935px;
}

.max-940 {
  max-width: 940px;
}

.max-945 {
  max-width: 945px;
}

.max-950 {
  max-width: 950px;
}

.max-955 {
  max-width: 955px;
}

.max-960 {
  max-width: 960px;
}

.max-965 {
  max-width: 965px;
}

.max-970 {
  max-width: 970px;
}

.max-975 {
  max-width: 975px;
}

.max-980 {
  max-width: 980px;
}

.max-985 {
  max-width: 985px;
}

.max-990 {
  max-width: 990px;
}

.max-995 {
  max-width: 995px;
}

.max-1000 {
  max-width: 1000px;
}

.maxmin-4 {
  max-width: 4px;
  min-width: 4px;
}

.maxmin-6 {
  max-width: 6px;
  min-width: 6px;
}

.maxmin-8 {
  max-width: 8px;
  min-width: 8px;
}

.maxmin-10 {
  max-width: 10px;
  min-width: 10px;
}

.maxmin-12 {
  max-width: 12px;
  min-width: 12px;
}

.maxmin-14 {
  max-width: 14px;
  min-width: 14px;
}

.maxmin-16 {
  max-width: 16px;
  min-width: 16px;
}

.maxmin-18 {
  max-width: 18px;
  min-width: 18px;
}

.maxmin-20 {
  max-width: 20px;
  min-width: 20px;
}

.maxmin-22 {
  max-width: 22px;
  min-width: 22px;
}

.maxmin-24 {
  max-width: 24px;
  min-width: 24px;
}

.maxmin-26 {
  max-width: 26px;
  min-width: 26px;
}

.maxmin-28 {
  max-width: 28px;
  min-width: 28px;
}

.maxmin-30 {
  max-width: 30px;
  min-width: 30px;
}

.maxmin-32 {
  max-width: 32px;
  min-width: 32px;
}

.maxmin-34 {
  max-width: 34px;
  min-width: 34px;
}

.maxmin-36 {
  max-width: 36px;
  min-width: 36px;
}

.maxmin-38 {
  max-width: 38px;
  min-width: 38px;
}

.maxmin-40 {
  max-width: 40px;
  min-width: 40px;
}

.maxmin-42 {
  max-width: 42px;
  min-width: 42px;
}

.maxmin-44 {
  max-width: 44px;
  min-width: 44px;
}

.maxmin-46 {
  max-width: 46px;
  min-width: 46px;
}

.maxmin-48 {
  max-width: 48px;
  min-width: 48px;
}

.maxmin-50 {
  max-width: 50px;
  min-width: 50px;
}

.maxmin-52 {
  max-width: 52px;
  min-width: 52px;
}

.maxmin-54 {
  max-width: 54px;
  min-width: 54px;
}

.maxmin-56 {
  max-width: 56px;
  min-width: 56px;
}

.maxmin-58 {
  max-width: 58px;
  min-width: 58px;
}

.maxmin-60 {
  max-width: 60px;
  min-width: 60px;
}

.maxmin-62 {
  max-width: 62px;
  min-width: 62px;
}

.maxmin-64 {
  max-width: 64px;
  min-width: 64px;
}

.maxmin-66 {
  max-width: 66px;
  min-width: 66px;
}

.maxmin-68 {
  max-width: 68px;
  min-width: 68px;
}

.maxmin-70 {
  max-width: 70px;
  min-width: 70px;
}

.maxmin-72 {
  max-width: 72px;
  min-width: 72px;
}

.maxmin-74 {
  max-width: 74px;
  min-width: 74px;
}

.maxmin-76 {
  max-width: 76px;
  min-width: 76px;
}

.maxmin-78 {
  max-width: 78px;
  min-width: 78px;
}

.maxmin-80 {
  max-width: 80px;
  min-width: 80px;
}

.maxmin-82 {
  max-width: 82px;
  min-width: 82px;
}

.maxmin-84 {
  max-width: 84px;
  min-width: 84px;
}

.maxmin-86 {
  max-width: 86px;
  min-width: 86px;
}

.maxmin-88 {
  max-width: 88px;
  min-width: 88px;
}

.maxmin-90 {
  max-width: 90px;
  min-width: 90px;
}

.maxmin-92 {
  max-width: 92px;
  min-width: 92px;
}

.maxmin-94 {
  max-width: 94px;
  min-width: 94px;
}

.maxmin-96 {
  max-width: 96px;
  min-width: 96px;
}

.maxmin-98 {
  max-width: 98px;
  min-width: 98px;
}

.maxmin-100 {
  max-width: 100px;
  min-width: 100px;
}

.maxmin-102 {
  max-width: 102px;
  min-width: 102px;
}

.maxmin-104 {
  max-width: 104px;
  min-width: 104px;
}

.maxmin-106 {
  max-width: 106px;
  min-width: 106px;
}

.maxmin-108 {
  max-width: 108px;
  min-width: 108px;
}

.maxmin-110 {
  max-width: 110px;
  min-width: 110px;
}

.maxmin-112 {
  max-width: 112px;
  min-width: 112px;
}

.maxmin-114 {
  max-width: 114px;
  min-width: 114px;
}

.maxmin-116 {
  max-width: 116px;
  min-width: 116px;
}

.maxmin-118 {
  max-width: 118px;
  min-width: 118px;
}

.maxmin-120 {
  max-width: 120px;
  min-width: 120px;
}

.maxmin-122 {
  max-width: 122px;
  min-width: 122px;
}

.maxmin-124 {
  max-width: 124px;
  min-width: 124px;
}

.maxmin-126 {
  max-width: 126px;
  min-width: 126px;
}

.maxmin-128 {
  max-width: 128px;
  min-width: 128px;
}

.maxmin-130 {
  max-width: 130px;
  min-width: 130px;
}

.maxmin-132 {
  max-width: 132px;
  min-width: 132px;
}

.maxmin-134 {
  max-width: 134px;
  min-width: 134px;
}

.maxmin-136 {
  max-width: 136px;
  min-width: 136px;
}

.maxmin-138 {
  max-width: 138px;
  min-width: 138px;
}

.maxmin-140 {
  max-width: 140px;
  min-width: 140px;
}

.maxmin-142 {
  max-width: 142px;
  min-width: 142px;
}

.maxmin-144 {
  max-width: 144px;
  min-width: 144px;
}

.maxmin-146 {
  max-width: 146px;
  min-width: 146px;
}

.maxmin-148 {
  max-width: 148px;
  min-width: 148px;
}

.maxmin-150 {
  max-width: 150px;
  min-width: 150px;
}

.maxmin-152 {
  max-width: 152px;
  min-width: 152px;
}

.maxmin-154 {
  max-width: 154px;
  min-width: 154px;
}

.maxmin-156 {
  max-width: 156px;
  min-width: 156px;
}

.maxmin-158 {
  max-width: 158px;
  min-width: 158px;
}

.maxmin-160 {
  max-width: 160px;
  min-width: 160px;
}

.maxmin-162 {
  max-width: 162px;
  min-width: 162px;
}

.maxmin-164 {
  max-width: 164px;
  min-width: 164px;
}

.maxmin-166 {
  max-width: 166px;
  min-width: 166px;
}

.maxmin-168 {
  max-width: 168px;
  min-width: 168px;
}

.maxmin-170 {
  max-width: 170px;
  min-width: 170px;
}

.maxmin-172 {
  max-width: 172px;
  min-width: 172px;
}

.maxmin-174 {
  max-width: 174px;
  min-width: 174px;
}

.maxmin-176 {
  max-width: 176px;
  min-width: 176px;
}

.maxmin-178 {
  max-width: 178px;
  min-width: 178px;
}

.maxmin-180 {
  max-width: 180px;
  min-width: 180px;
}

.maxmin-182 {
  max-width: 182px;
  min-width: 182px;
}

.maxmin-184 {
  max-width: 184px;
  min-width: 184px;
}

.maxmin-186 {
  max-width: 186px;
  min-width: 186px;
}

.maxmin-188 {
  max-width: 188px;
  min-width: 188px;
}

.maxmin-190 {
  max-width: 190px;
  min-width: 190px;
}

.maxmin-192 {
  max-width: 192px;
  min-width: 192px;
}

.maxmin-194 {
  max-width: 194px;
  min-width: 194px;
}

.maxmin-196 {
  max-width: 196px;
  min-width: 196px;
}

.maxmin-198 {
  max-width: 198px;
  min-width: 198px;
}

.maxmin-200 {
  max-width: 200px;
  min-width: 200px;
}

.maxmin-202 {
  max-width: 202px;
  min-width: 202px;
}

.maxmin-204 {
  max-width: 204px;
  min-width: 204px;
}

.maxmin-206 {
  max-width: 206px;
  min-width: 206px;
}

.maxmin-208 {
  max-width: 208px;
  min-width: 208px;
}

.maxmin-210 {
  max-width: 210px;
  min-width: 210px;
}

.maxmin-212 {
  max-width: 212px;
  min-width: 212px;
}

.maxmin-214 {
  max-width: 214px;
  min-width: 214px;
}

.maxmin-216 {
  max-width: 216px;
  min-width: 216px;
}

.maxmin-218 {
  max-width: 218px;
  min-width: 218px;
}

.maxmin-220 {
  max-width: 220px;
  min-width: 220px;
}

.maxmin-222 {
  max-width: 222px;
  min-width: 222px;
}

.maxmin-224 {
  max-width: 224px;
  min-width: 224px;
}

.maxmin-226 {
  max-width: 226px;
  min-width: 226px;
}

.maxmin-228 {
  max-width: 228px;
  min-width: 228px;
}

.maxmin-230 {
  max-width: 230px;
  min-width: 230px;
}

.maxmin-232 {
  max-width: 232px;
  min-width: 232px;
}

.maxmin-234 {
  max-width: 234px;
  min-width: 234px;
}

.maxmin-236 {
  max-width: 236px;
  min-width: 236px;
}

.maxmin-238 {
  max-width: 238px;
  min-width: 238px;
}

.maxmin-240 {
  max-width: 240px;
  min-width: 240px;
}

.maxmin-242 {
  max-width: 242px;
  min-width: 242px;
}

.maxmin-244 {
  max-width: 244px;
  min-width: 244px;
}

.maxmin-246 {
  max-width: 246px;
  min-width: 246px;
}

.maxmin-248 {
  max-width: 248px;
  min-width: 248px;
}

.maxmin-250 {
  max-width: 250px;
  min-width: 250px;
}

.maxmin-252 {
  max-width: 252px;
  min-width: 252px;
}

.maxmin-254 {
  max-width: 254px;
  min-width: 254px;
}

.maxmin-256 {
  max-width: 256px;
  min-width: 256px;
}

.maxmin-258 {
  max-width: 258px;
  min-width: 258px;
}

.maxmin-260 {
  max-width: 260px;
  min-width: 260px;
}

.maxmin-262 {
  max-width: 262px;
  min-width: 262px;
}

.maxmin-264 {
  max-width: 264px;
  min-width: 264px;
}

.maxmin-266 {
  max-width: 266px;
  min-width: 266px;
}

.maxmin-268 {
  max-width: 268px;
  min-width: 268px;
}

.maxmin-270 {
  max-width: 270px;
  min-width: 270px;
}

.maxmin-272 {
  max-width: 272px;
  min-width: 272px;
}

.maxmin-274 {
  max-width: 274px;
  min-width: 274px;
}

.maxmin-276 {
  max-width: 276px;
  min-width: 276px;
}

.maxmin-278 {
  max-width: 278px;
  min-width: 278px;
}

.maxmin-280 {
  max-width: 280px;
  min-width: 280px;
}

.maxmin-282 {
  max-width: 282px;
  min-width: 282px;
}

.maxmin-284 {
  max-width: 284px;
  min-width: 284px;
}

.maxmin-286 {
  max-width: 286px;
  min-width: 286px;
}

.maxmin-288 {
  max-width: 288px;
  min-width: 288px;
}

.maxmin-290 {
  max-width: 290px;
  min-width: 290px;
}

.maxmin-292 {
  max-width: 292px;
  min-width: 292px;
}

.maxmin-294 {
  max-width: 294px;
  min-width: 294px;
}

.maxmin-296 {
  max-width: 296px;
  min-width: 296px;
}

.maxmin-298 {
  max-width: 298px;
  min-width: 298px;
}

.maxmin-300 {
  max-width: 300px;
  min-width: 300px;
}

.maxmin-302 {
  max-width: 302px;
  min-width: 302px;
}

.maxmin-304 {
  max-width: 304px;
  min-width: 304px;
}

.maxmin-306 {
  max-width: 306px;
  min-width: 306px;
}

.maxmin-308 {
  max-width: 308px;
  min-width: 308px;
}

.maxmin-310 {
  max-width: 310px;
  min-width: 310px;
}

.maxmin-312 {
  max-width: 312px;
  min-width: 312px;
}

.maxmin-314 {
  max-width: 314px;
  min-width: 314px;
}

.maxmin-316 {
  max-width: 316px;
  min-width: 316px;
}

.maxmin-318 {
  max-width: 318px;
  min-width: 318px;
}

.maxmin-320 {
  max-width: 320px;
  min-width: 320px;
}

.maxmin-322 {
  max-width: 322px;
  min-width: 322px;
}

.maxmin-324 {
  max-width: 324px;
  min-width: 324px;
}

.maxmin-326 {
  max-width: 326px;
  min-width: 326px;
}

.maxmin-328 {
  max-width: 328px;
  min-width: 328px;
}

.maxmin-330 {
  max-width: 330px;
  min-width: 330px;
}

.maxmin-332 {
  max-width: 332px;
  min-width: 332px;
}

.maxmin-334 {
  max-width: 334px;
  min-width: 334px;
}

.maxmin-336 {
  max-width: 336px;
  min-width: 336px;
}

.maxmin-338 {
  max-width: 338px;
  min-width: 338px;
}

.maxmin-340 {
  max-width: 340px;
  min-width: 340px;
}

.maxmin-342 {
  max-width: 342px;
  min-width: 342px;
}

.maxmin-344 {
  max-width: 344px;
  min-width: 344px;
}

.maxmin-346 {
  max-width: 346px;
  min-width: 346px;
}

.maxmin-348 {
  max-width: 348px;
  min-width: 348px;
}

.maxmin-350 {
  max-width: 350px;
  min-width: 350px;
}

.maxmin-352 {
  max-width: 352px;
  min-width: 352px;
}

.maxmin-354 {
  max-width: 354px;
  min-width: 354px;
}

.maxmin-356 {
  max-width: 356px;
  min-width: 356px;
}

.maxmin-358 {
  max-width: 358px;
  min-width: 358px;
}

.maxmin-360 {
  max-width: 360px;
  min-width: 360px;
}

.maxmin-362 {
  max-width: 362px;
  min-width: 362px;
}

.maxmin-364 {
  max-width: 364px;
  min-width: 364px;
}

.maxmin-366 {
  max-width: 366px;
  min-width: 366px;
}

.maxmin-368 {
  max-width: 368px;
  min-width: 368px;
}

.maxmin-370 {
  max-width: 370px;
  min-width: 370px;
}

.maxmin-372 {
  max-width: 372px;
  min-width: 372px;
}

.maxmin-374 {
  max-width: 374px;
  min-width: 374px;
}

.maxmin-376 {
  max-width: 376px;
  min-width: 376px;
}

.maxmin-378 {
  max-width: 378px;
  min-width: 378px;
}

.maxmin-380 {
  max-width: 380px;
  min-width: 380px;
}

.maxmin-382 {
  max-width: 382px;
  min-width: 382px;
}

.maxmin-384 {
  max-width: 384px;
  min-width: 384px;
}

.maxmin-386 {
  max-width: 386px;
  min-width: 386px;
}

.maxmin-388 {
  max-width: 388px;
  min-width: 388px;
}

.maxmin-390 {
  max-width: 390px;
  min-width: 390px;
}

.maxmin-392 {
  max-width: 392px;
  min-width: 392px;
}

.maxmin-394 {
  max-width: 394px;
  min-width: 394px;
}

.maxmin-396 {
  max-width: 396px;
  min-width: 396px;
}

.maxmin-398 {
  max-width: 398px;
  min-width: 398px;
}

.maxmin-400 {
  max-width: 400px;
  min-width: 400px;
}

@media (max-width: 767px) {
  .full-xs {
    width: 100%;
  }

  .xs-maxfull {
    max-width: 100%;
  }

  .xs-maxmin-4 {
    max-width: 4px !important;
    min-width: 4px !important;
  }

  .xs-maxmin-6 {
    max-width: 6px !important;
    min-width: 6px !important;
  }

  .xs-maxmin-8 {
    max-width: 8px !important;
    min-width: 8px !important;
  }

  .xs-maxmin-10 {
    max-width: 10px !important;
    min-width: 10px !important;
  }

  .xs-maxmin-12 {
    max-width: 12px !important;
    min-width: 12px !important;
  }

  .xs-maxmin-14 {
    max-width: 14px !important;
    min-width: 14px !important;
  }

  .xs-maxmin-16 {
    max-width: 16px !important;
    min-width: 16px !important;
  }

  .xs-maxmin-18 {
    max-width: 18px !important;
    min-width: 18px !important;
  }

  .xs-maxmin-20 {
    max-width: 20px !important;
    min-width: 20px !important;
  }

  .xs-maxmin-22 {
    max-width: 22px !important;
    min-width: 22px !important;
  }

  .xs-maxmin-24 {
    max-width: 24px !important;
    min-width: 24px !important;
  }

  .xs-maxmin-26 {
    max-width: 26px !important;
    min-width: 26px !important;
  }

  .xs-maxmin-28 {
    max-width: 28px !important;
    min-width: 28px !important;
  }

  .xs-maxmin-30 {
    max-width: 30px !important;
    min-width: 30px !important;
  }

  .xs-maxmin-32 {
    max-width: 32px !important;
    min-width: 32px !important;
  }

  .xs-maxmin-34 {
    max-width: 34px !important;
    min-width: 34px !important;
  }

  .xs-maxmin-36 {
    max-width: 36px !important;
    min-width: 36px !important;
  }

  .xs-maxmin-38 {
    max-width: 38px !important;
    min-width: 38px !important;
  }

  .xs-maxmin-40 {
    max-width: 40px !important;
    min-width: 40px !important;
  }

  .xs-maxmin-42 {
    max-width: 42px !important;
    min-width: 42px !important;
  }

  .xs-maxmin-44 {
    max-width: 44px !important;
    min-width: 44px !important;
  }

  .xs-maxmin-46 {
    max-width: 46px !important;
    min-width: 46px !important;
  }

  .xs-maxmin-48 {
    max-width: 48px !important;
    min-width: 48px !important;
  }

  .xs-maxmin-50 {
    max-width: 50px !important;
    min-width: 50px !important;
  }

  .xs-maxmin-52 {
    max-width: 52px !important;
    min-width: 52px !important;
  }

  .xs-maxmin-54 {
    max-width: 54px !important;
    min-width: 54px !important;
  }

  .xs-maxmin-56 {
    max-width: 56px !important;
    min-width: 56px !important;
  }

  .xs-maxmin-58 {
    max-width: 58px !important;
    min-width: 58px !important;
  }

  .xs-maxmin-60 {
    max-width: 60px !important;
    min-width: 60px !important;
  }

  .xs-maxmin-62 {
    max-width: 62px !important;
    min-width: 62px !important;
  }

  .xs-maxmin-64 {
    max-width: 64px !important;
    min-width: 64px !important;
  }

  .xs-maxmin-66 {
    max-width: 66px !important;
    min-width: 66px !important;
  }

  .xs-maxmin-68 {
    max-width: 68px !important;
    min-width: 68px !important;
  }

  .xs-maxmin-70 {
    max-width: 70px !important;
    min-width: 70px !important;
  }

  .xs-maxmin-72 {
    max-width: 72px !important;
    min-width: 72px !important;
  }

  .xs-maxmin-74 {
    max-width: 74px !important;
    min-width: 74px !important;
  }

  .xs-maxmin-76 {
    max-width: 76px !important;
    min-width: 76px !important;
  }

  .xs-maxmin-78 {
    max-width: 78px !important;
    min-width: 78px !important;
  }

  .xs-maxmin-80 {
    max-width: 80px !important;
    min-width: 80px !important;
  }

  .xs-maxmin-82 {
    max-width: 82px !important;
    min-width: 82px !important;
  }

  .xs-maxmin-84 {
    max-width: 84px !important;
    min-width: 84px !important;
  }

  .xs-maxmin-86 {
    max-width: 86px !important;
    min-width: 86px !important;
  }

  .xs-maxmin-88 {
    max-width: 88px !important;
    min-width: 88px !important;
  }

  .xs-maxmin-90 {
    max-width: 90px !important;
    min-width: 90px !important;
  }

  .xs-maxmin-92 {
    max-width: 92px !important;
    min-width: 92px !important;
  }

  .xs-maxmin-94 {
    max-width: 94px !important;
    min-width: 94px !important;
  }

  .xs-maxmin-96 {
    max-width: 96px !important;
    min-width: 96px !important;
  }

  .xs-maxmin-98 {
    max-width: 98px !important;
    min-width: 98px !important;
  }

  .xs-maxmin-100 {
    max-width: 100px !important;
    min-width: 100px !important;
  }

  .xs-maxmin-102 {
    max-width: 102px !important;
    min-width: 102px !important;
  }

  .xs-maxmin-104 {
    max-width: 104px !important;
    min-width: 104px !important;
  }

  .xs-maxmin-106 {
    max-width: 106px !important;
    min-width: 106px !important;
  }

  .xs-maxmin-108 {
    max-width: 108px !important;
    min-width: 108px !important;
  }

  .xs-maxmin-110 {
    max-width: 110px !important;
    min-width: 110px !important;
  }

  .xs-maxmin-112 {
    max-width: 112px !important;
    min-width: 112px !important;
  }

  .xs-maxmin-114 {
    max-width: 114px !important;
    min-width: 114px !important;
  }

  .xs-maxmin-116 {
    max-width: 116px !important;
    min-width: 116px !important;
  }

  .xs-maxmin-118 {
    max-width: 118px !important;
    min-width: 118px !important;
  }

  .xs-maxmin-120 {
    max-width: 120px !important;
    min-width: 120px !important;
  }

  .xs-maxmin-122 {
    max-width: 122px !important;
    min-width: 122px !important;
  }

  .xs-maxmin-124 {
    max-width: 124px !important;
    min-width: 124px !important;
  }

  .xs-maxmin-126 {
    max-width: 126px !important;
    min-width: 126px !important;
  }

  .xs-maxmin-128 {
    max-width: 128px !important;
    min-width: 128px !important;
  }

  .xs-maxmin-130 {
    max-width: 130px !important;
    min-width: 130px !important;
  }

  .xs-maxmin-132 {
    max-width: 132px !important;
    min-width: 132px !important;
  }

  .xs-maxmin-134 {
    max-width: 134px !important;
    min-width: 134px !important;
  }

  .xs-maxmin-136 {
    max-width: 136px !important;
    min-width: 136px !important;
  }

  .xs-maxmin-138 {
    max-width: 138px !important;
    min-width: 138px !important;
  }

  .xs-maxmin-140 {
    max-width: 140px !important;
    min-width: 140px !important;
  }

  .xs-maxmin-142 {
    max-width: 142px !important;
    min-width: 142px !important;
  }

  .xs-maxmin-144 {
    max-width: 144px !important;
    min-width: 144px !important;
  }

  .xs-maxmin-146 {
    max-width: 146px !important;
    min-width: 146px !important;
  }

  .xs-maxmin-148 {
    max-width: 148px !important;
    min-width: 148px !important;
  }

  .xs-maxmin-150 {
    max-width: 150px !important;
    min-width: 150px !important;
  }

  .xs-maxmin-152 {
    max-width: 152px !important;
    min-width: 152px !important;
  }

  .xs-maxmin-154 {
    max-width: 154px !important;
    min-width: 154px !important;
  }

  .xs-maxmin-156 {
    max-width: 156px !important;
    min-width: 156px !important;
  }

  .xs-maxmin-158 {
    max-width: 158px !important;
    min-width: 158px !important;
  }

  .xs-maxmin-160 {
    max-width: 160px !important;
    min-width: 160px !important;
  }

  .xs-maxmin-162 {
    max-width: 162px !important;
    min-width: 162px !important;
  }

  .xs-maxmin-164 {
    max-width: 164px !important;
    min-width: 164px !important;
  }

  .xs-maxmin-166 {
    max-width: 166px !important;
    min-width: 166px !important;
  }

  .xs-maxmin-168 {
    max-width: 168px !important;
    min-width: 168px !important;
  }

  .xs-maxmin-170 {
    max-width: 170px !important;
    min-width: 170px !important;
  }

  .xs-maxmin-172 {
    max-width: 172px !important;
    min-width: 172px !important;
  }

  .xs-maxmin-174 {
    max-width: 174px !important;
    min-width: 174px !important;
  }

  .xs-maxmin-176 {
    max-width: 176px !important;
    min-width: 176px !important;
  }

  .xs-maxmin-178 {
    max-width: 178px !important;
    min-width: 178px !important;
  }

  .xs-maxmin-180 {
    max-width: 180px !important;
    min-width: 180px !important;
  }

  .xs-maxmin-182 {
    max-width: 182px !important;
    min-width: 182px !important;
  }

  .xs-maxmin-184 {
    max-width: 184px !important;
    min-width: 184px !important;
  }

  .xs-maxmin-186 {
    max-width: 186px !important;
    min-width: 186px !important;
  }

  .xs-maxmin-188 {
    max-width: 188px !important;
    min-width: 188px !important;
  }

  .xs-maxmin-190 {
    max-width: 190px !important;
    min-width: 190px !important;
  }

  .xs-maxmin-192 {
    max-width: 192px !important;
    min-width: 192px !important;
  }

  .xs-maxmin-194 {
    max-width: 194px !important;
    min-width: 194px !important;
  }

  .xs-maxmin-196 {
    max-width: 196px !important;
    min-width: 196px !important;
  }

  .xs-maxmin-198 {
    max-width: 198px !important;
    min-width: 198px !important;
  }

  .xs-maxmin-200 {
    max-width: 200px !important;
    min-width: 200px !important;
  }

  .xs-maxmin-202 {
    max-width: 202px !important;
    min-width: 202px !important;
  }

  .xs-maxmin-204 {
    max-width: 204px !important;
    min-width: 204px !important;
  }

  .xs-maxmin-206 {
    max-width: 206px !important;
    min-width: 206px !important;
  }

  .xs-maxmin-208 {
    max-width: 208px !important;
    min-width: 208px !important;
  }

  .xs-maxmin-210 {
    max-width: 210px !important;
    min-width: 210px !important;
  }

  .xs-maxmin-212 {
    max-width: 212px !important;
    min-width: 212px !important;
  }

  .xs-maxmin-214 {
    max-width: 214px !important;
    min-width: 214px !important;
  }

  .xs-maxmin-216 {
    max-width: 216px !important;
    min-width: 216px !important;
  }

  .xs-maxmin-218 {
    max-width: 218px !important;
    min-width: 218px !important;
  }

  .xs-maxmin-220 {
    max-width: 220px !important;
    min-width: 220px !important;
  }

  .xs-maxmin-222 {
    max-width: 222px !important;
    min-width: 222px !important;
  }

  .xs-maxmin-224 {
    max-width: 224px !important;
    min-width: 224px !important;
  }

  .xs-maxmin-226 {
    max-width: 226px !important;
    min-width: 226px !important;
  }

  .xs-maxmin-228 {
    max-width: 228px !important;
    min-width: 228px !important;
  }

  .xs-maxmin-230 {
    max-width: 230px !important;
    min-width: 230px !important;
  }

  .xs-maxmin-232 {
    max-width: 232px !important;
    min-width: 232px !important;
  }

  .xs-maxmin-234 {
    max-width: 234px !important;
    min-width: 234px !important;
  }

  .xs-maxmin-236 {
    max-width: 236px !important;
    min-width: 236px !important;
  }

  .xs-maxmin-238 {
    max-width: 238px !important;
    min-width: 238px !important;
  }

  .xs-maxmin-240 {
    max-width: 240px !important;
    min-width: 240px !important;
  }

  .xs-maxmin-242 {
    max-width: 242px !important;
    min-width: 242px !important;
  }

  .xs-maxmin-244 {
    max-width: 244px !important;
    min-width: 244px !important;
  }

  .xs-maxmin-246 {
    max-width: 246px !important;
    min-width: 246px !important;
  }

  .xs-maxmin-248 {
    max-width: 248px !important;
    min-width: 248px !important;
  }

  .xs-maxmin-250 {
    max-width: 250px !important;
    min-width: 250px !important;
  }

  .xs-maxmin-252 {
    max-width: 252px !important;
    min-width: 252px !important;
  }

  .xs-maxmin-254 {
    max-width: 254px !important;
    min-width: 254px !important;
  }

  .xs-maxmin-256 {
    max-width: 256px !important;
    min-width: 256px !important;
  }

  .xs-maxmin-258 {
    max-width: 258px !important;
    min-width: 258px !important;
  }

  .xs-maxmin-260 {
    max-width: 260px !important;
    min-width: 260px !important;
  }

  .xs-maxmin-262 {
    max-width: 262px !important;
    min-width: 262px !important;
  }

  .xs-maxmin-264 {
    max-width: 264px !important;
    min-width: 264px !important;
  }

  .xs-maxmin-266 {
    max-width: 266px !important;
    min-width: 266px !important;
  }

  .xs-maxmin-268 {
    max-width: 268px !important;
    min-width: 268px !important;
  }

  .xs-maxmin-270 {
    max-width: 270px !important;
    min-width: 270px !important;
  }

  .xs-maxmin-272 {
    max-width: 272px !important;
    min-width: 272px !important;
  }

  .xs-maxmin-274 {
    max-width: 274px !important;
    min-width: 274px !important;
  }

  .xs-maxmin-276 {
    max-width: 276px !important;
    min-width: 276px !important;
  }

  .xs-maxmin-278 {
    max-width: 278px !important;
    min-width: 278px !important;
  }

  .xs-maxmin-280 {
    max-width: 280px !important;
    min-width: 280px !important;
  }

  .xs-maxmin-282 {
    max-width: 282px !important;
    min-width: 282px !important;
  }

  .xs-maxmin-284 {
    max-width: 284px !important;
    min-width: 284px !important;
  }

  .xs-maxmin-286 {
    max-width: 286px !important;
    min-width: 286px !important;
  }

  .xs-maxmin-288 {
    max-width: 288px !important;
    min-width: 288px !important;
  }

  .xs-maxmin-290 {
    max-width: 290px !important;
    min-width: 290px !important;
  }

  .xs-maxmin-292 {
    max-width: 292px !important;
    min-width: 292px !important;
  }

  .xs-maxmin-294 {
    max-width: 294px !important;
    min-width: 294px !important;
  }

  .xs-maxmin-296 {
    max-width: 296px !important;
    min-width: 296px !important;
  }

  .xs-maxmin-298 {
    max-width: 298px !important;
    min-width: 298px !important;
  }

  .xs-maxmin-300 {
    max-width: 300px !important;
    min-width: 300px !important;
  }

  .xs-maxmin-302 {
    max-width: 302px !important;
    min-width: 302px !important;
  }

  .xs-maxmin-304 {
    max-width: 304px !important;
    min-width: 304px !important;
  }

  .xs-maxmin-306 {
    max-width: 306px !important;
    min-width: 306px !important;
  }

  .xs-maxmin-308 {
    max-width: 308px !important;
    min-width: 308px !important;
  }

  .xs-maxmin-310 {
    max-width: 310px !important;
    min-width: 310px !important;
  }

  .xs-maxmin-312 {
    max-width: 312px !important;
    min-width: 312px !important;
  }

  .xs-maxmin-314 {
    max-width: 314px !important;
    min-width: 314px !important;
  }

  .xs-maxmin-316 {
    max-width: 316px !important;
    min-width: 316px !important;
  }

  .xs-maxmin-318 {
    max-width: 318px !important;
    min-width: 318px !important;
  }

  .xs-maxmin-320 {
    max-width: 320px !important;
    min-width: 320px !important;
  }

  .xs-maxmin-322 {
    max-width: 322px !important;
    min-width: 322px !important;
  }

  .xs-maxmin-324 {
    max-width: 324px !important;
    min-width: 324px !important;
  }

  .xs-maxmin-326 {
    max-width: 326px !important;
    min-width: 326px !important;
  }

  .xs-maxmin-328 {
    max-width: 328px !important;
    min-width: 328px !important;
  }

  .xs-maxmin-330 {
    max-width: 330px !important;
    min-width: 330px !important;
  }

  .xs-maxmin-332 {
    max-width: 332px !important;
    min-width: 332px !important;
  }

  .xs-maxmin-334 {
    max-width: 334px !important;
    min-width: 334px !important;
  }

  .xs-maxmin-336 {
    max-width: 336px !important;
    min-width: 336px !important;
  }

  .xs-maxmin-338 {
    max-width: 338px !important;
    min-width: 338px !important;
  }

  .xs-maxmin-340 {
    max-width: 340px !important;
    min-width: 340px !important;
  }

  .xs-maxmin-342 {
    max-width: 342px !important;
    min-width: 342px !important;
  }

  .xs-maxmin-344 {
    max-width: 344px !important;
    min-width: 344px !important;
  }

  .xs-maxmin-346 {
    max-width: 346px !important;
    min-width: 346px !important;
  }

  .xs-maxmin-348 {
    max-width: 348px !important;
    min-width: 348px !important;
  }

  .xs-maxmin-350 {
    max-width: 350px !important;
    min-width: 350px !important;
  }

  .xs-maxmin-352 {
    max-width: 352px !important;
    min-width: 352px !important;
  }

  .xs-maxmin-354 {
    max-width: 354px !important;
    min-width: 354px !important;
  }

  .xs-maxmin-356 {
    max-width: 356px !important;
    min-width: 356px !important;
  }

  .xs-maxmin-358 {
    max-width: 358px !important;
    min-width: 358px !important;
  }

  .xs-maxmin-360 {
    max-width: 360px !important;
    min-width: 360px !important;
  }

  .xs-maxmin-362 {
    max-width: 362px !important;
    min-width: 362px !important;
  }

  .xs-maxmin-364 {
    max-width: 364px !important;
    min-width: 364px !important;
  }

  .xs-maxmin-366 {
    max-width: 366px !important;
    min-width: 366px !important;
  }

  .xs-maxmin-368 {
    max-width: 368px !important;
    min-width: 368px !important;
  }

  .xs-maxmin-370 {
    max-width: 370px !important;
    min-width: 370px !important;
  }

  .xs-maxmin-372 {
    max-width: 372px !important;
    min-width: 372px !important;
  }

  .xs-maxmin-374 {
    max-width: 374px !important;
    min-width: 374px !important;
  }

  .xs-maxmin-376 {
    max-width: 376px !important;
    min-width: 376px !important;
  }

  .xs-maxmin-378 {
    max-width: 378px !important;
    min-width: 378px !important;
  }

  .xs-maxmin-380 {
    max-width: 380px !important;
    min-width: 380px !important;
  }

  .xs-maxmin-382 {
    max-width: 382px !important;
    min-width: 382px !important;
  }

  .xs-maxmin-384 {
    max-width: 384px !important;
    min-width: 384px !important;
  }

  .xs-maxmin-386 {
    max-width: 386px !important;
    min-width: 386px !important;
  }

  .xs-maxmin-388 {
    max-width: 388px !important;
    min-width: 388px !important;
  }

  .xs-maxmin-390 {
    max-width: 390px !important;
    min-width: 390px !important;
  }

  .xs-maxmin-392 {
    max-width: 392px !important;
    min-width: 392px !important;
  }

  .xs-maxmin-394 {
    max-width: 394px !important;
    min-width: 394px !important;
  }

  .xs-maxmin-396 {
    max-width: 396px !important;
    min-width: 396px !important;
  }

  .xs-maxmin-398 {
    max-width: 398px !important;
    min-width: 398px !important;
  }

  .xs-maxmin-400 {
    max-width: 400px !important;
    min-width: 400px !important;
  }
}

.overflow-h {
  overflow: hidden;
}

.ag-fresh .ag-group-btn-arr {
  padding-left: 20px !important;
  cursor: pointer;
}

.ag-fresh .ag-group-btn-arr:before {
  content: "\f105";
  font-family: 'FontAwesome';
  position: absolute;
  left: 8px;
  top: 5px;
  color: #000;
}

.ag-fresh .ag-group-btn-arr.active:before {
  content: "\f107";
  left: 6px;
  top: 6px;
}

.ag-fresh .ag-detail-block {
  padding: 15px 22px;
  background: #ededed;
}

.ag-fresh .ag-detail-table-wrap {
  border: 1px solid #d4d4d4;
  display: inline-block;
  max-height: 250px;
  overflow-y: auto;
  overflow-x: hidden;
}

.ag-fresh .ag-detail-table tr:first-child {
  position: absolute;
}

.ag-fresh .ag-detail-table tr:nth-child(2) td {
  padding-top: 32px;
}

.ag-fresh .ag-detail-table th,
.ag-fresh .ag-detail-table td {
  padding: 4px;
}

.ag-fresh .ag-detail-table tr {
  background: #fff;
}

.ag-fresh .ag-detail-table tr:nth-child(odd) {
  background: #f3f3f3;
}

.ag-fresh .ag-detail-table th {
  border-right: 1px solid #d4d4d4;
  border-bottom: 1px solid #d4d4d4;
  background: #f3f3f3;
  white-space: nowrap;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(1, #fff));
  background: -ms-linear-gradient(bottom, #eee, #fff);
  background: -moz-linear-gradient(center bottom, #eee 0, #fff 100%);
  background: -o-linear-gradient(#fff, #eee);
}

.ag-fresh .ag-detail-table td {
  border-right: 1px solid #d4d4d4;
  border-top: 0 !important;
  padding: 5px;
}

.ag-fresh .ag-detail-table td:last-child {
  border-right: 0;
}

/* ---------------------------------------------------------------------- */
/*  Pricing Tables
/* ---------------------------------------------------------------------- */
.pricing-table .plan {
  border: none;
  margin: 20px 0;
  position: relative;
  padding: 0;
  list-style: none;
  -moz-box-shadow: 0, -1px, 2px, #cccccc;
  -webkit-box-shadow: 0, -1px, 2px, #cccccc;
  box-shadow: 0, -1px, 2px, #cccccc;
  text-align: center;
}

.pricing-table .plan li {
  padding: 10px 15px;
  color: #333333;
  border-bottom: 1px solid #f2f2f2;
}

.pricing-table .plan li.plan-name {
  padding: 15px;
  font-size: 18px;
  line-height: 18px;
  color: #fff;
  background: #a6a6a6;
  border-top: 0;
  border-bottom: 0;
}

.pricing-table .plan li.plan-price {
  background: #999;
  color: #ffffff;
  font-size: 18px;
  padding: 6px 20px;
  border-bottom: none;
}

.pricing-table .plan li.plan-price h3 {
  margin-bottom: 0;
  margin-top: 0;
  font-size: 2em;
  padding: 30px 0;
  font-weight: 600;
}

.pricing-table .plan li.plan-price h3 .price-cents {
  font-size: 50%;
  vertical-align: super;
  margin-left: -10px;
}

.pricing-table .plan li.plan-price h3 .price-month {
  font-size: 30%;
  font-style: italic;
  margin-left: -20px;
  font-weight: 300;
  color: #ffffff;
}

.pricing-table .plan li.plan-action {
  margin-top: 10px;
  border-top: 0;
}

.pricing-table .plan.featured {
  -webkit-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
  box-shadow: 0 3px 25px -4px rgba(0, 0, 0, 0.9) !important;
}

.pricing-table .plan.featured .plan-name {
  background: #666666;
}

.pricing-green .plan li strong {
  color: #e66b6b;
}

.pricing-green .plan li.plan-name {
  background: #23d1b9;
}

.pricing-green .plan li.plan-price {
  background: #1FBBA6;
  color: #ffffff;
}

.pricing-green .plan.featured .plan-name {
  background: #106458;
}

.pricing-blue .plan li strong {
  color: #00869e;
}

.pricing-blue .plan li.plan-name {
  background: #009cb8;
}

.pricing-blue .plan li.plan-price {
  background: #00869e;
  color: #ffffff;
}

.pricing-blue .plan.featured .plan-name {
  background: #002f38;
}

.pricing-red .plan li strong {
  color: #e66b6b;
}

.pricing-red .plan li.plan-name {
  background: #ea8181;
}

.pricing-red .plan li.plan-price {
  background: #e66b6b;
  color: #ffffff;
}

.pricing-red .plan.featured .plan-name {
  background: #c92222;
}

.table>tbody>tr>th {
  color: #666666;
  font-size: 15px;
  font-weight: bold;
  text-align: center;
}

.table>tbody>tr>td {
  font-size: 14px;
  padding: 6px;
}

.table-striped>tbody>tr th {
  background-color: whitesmoke;
}

.table-striped>tbody>tr:nth-of-type(odd) {
  background-color: white;
}

.table-striped>tbody>tr:nth-of-type(even) {
  background-color: #fff;
}

.table-border-none th,
.table-border-none td {
  border-top: none !important;
  padding: 8px !important;
}

.table.white-nowrap th,
.table.white-nowrap td {
  white-space: nowrap;
}

.table>thead>tr>th {
  border-bottom: 1px solid #e6e6e6;
}

.table>thead>tr>th,
.table>tbody>tr>th,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td {
  border-top: 1px solid #e6e6e6;
}

.table-hover>tbody>tr:hover>td,
.table-hover>tbody>tr:hover>th {
  background-color: white;
}

.table>tbody>tr.active>td,
.table>tbody>tr.active>th {
  background-color: #fafafa !important;
  color: #333333 !important;
}

.table>tbody>tr.active:hover>td,
.table>tbody>tr.active:hover>th {
  background-color: whitesmoke !important;
  color: #333333 !important;
}

th.center,
td.center {
  text-align: center;
}

td.center .dropdown-menu {
  text-align: left;
}

td.small-width {
  width: 15%;
}

.table thead tr {
  color: #707070;
  font-weight: normal;
}

.table.table-bordered thead tr th {
  vertical-align: middle;
}

.table thead>tr>th,
.table tbody>tr>th,
.table tfoot>tr>th,
.table thead>tr>td,
.table tbody>tr>td,
.table tfoot>tr>td {
  vertical-align: middle;
}

.editable-element {
  border-bottom: 1px dashed #0088CC;
  text-decoration: none;
  opacity: 0.5;
  display: inline;
}

.table-th-dark th {
  background: #8f8f8f;
  color: #fff !important;
}

.table-th-dark th.left {
  text-align: left !important;
}

.table-th-dark th.center {
  text-align: center !important;
}

.table-th-dark th.right {
  text-align: right !important;
}

.table-ng-ui-grid {
  border: 1px solid #d4d4d4;
}

.table-ng-ui-grid tr:nth-child(odd) {
  background: #f3f3f3;
}

.table-ng-ui-grid th {
  border-right: 1px solid #d4d4d4;
  border-bottom: 1px solid #d4d4d4;
  background: #f3f3f3;
  white-space: nowrap;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(1, #fff));
  background: -ms-linear-gradient(bottom, #eee, #fff);
  background: -moz-linear-gradient(center bottom, #eee 0, #fff 100%);
  background: -o-linear-gradient(#fff, #eee);
}

.table-ng-ui-grid th:last-child {
  border-right: 0;
}

.table-ng-ui-grid td {
  border-right: 1px solid #d4d4d4;
  border-top: 0 !important;
  padding: 5px;
}

.table-ng-ui-grid td:last-child {
  border-right: 0;
}

.ng-ui-grid-readonly {
  background: #e3e3e3 !important;
  background: -moz-linear-gradient(top, #e3e3e3 5%, #d0d0d0 95%) !important;
  background: -webkit-linear-gradient(top, #e3e3e3 5%, #d0d0d0 95%) !important;
  background: linear-gradient(to bottom, #e3e3e3 5%, #d0d0d0 95%) !important;
}

.ui-grid-pager-panel abbr[data-original-title],
.ui-grid-pager-panel abbr[title] {
  border-bottom: none;
}

.ag-fresh {
  overflow-y: hidden;
  font-family: "微軟正黑體", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.ag-fresh .ag-body-viewport {
  /* overflow-y:hidden !important; */
}

.ag-fresh .ag-bl-full-height {
  overflow: hidden !important;
}

.ag-fresh .ag-header {
  background: #cccccc !important;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #eee), color-stop(1, #fff)) !important;
  background: -ms-linear-gradient(bottom, #eee, #fff) !important;
  background: -moz-linear-gradient(center bottom, #eee 0, #fff 100%) !important;
  background: -o-linear-gradient(#fff, #eee) !important;
  border-bottom: 1px solid #cccccc !important;
}

.ag-fresh .ui-grid-cell-contents label[for] {
  position: relative;
  top: -2px;
}

.ag-fresh .ag-header-cell .ui-grid-cell-contents:first-of-type {
  padding-left: 4px;
}

.ag-fresh .ag-header-cell .ui-grid-cell-contents:first-of-type label[for] {
  top: 1px;
}

.ag-fresh .ag-cell-no-focus {
  border-top: none !important;
  border-bottom: none !important;
}

.ag-fresh .ag-ltr .ag-cell-no-focus {
  border-right: 1px solid #cccccc !important;
}

.ag-fresh .ag-ltr .ag-header-select-all {
  float: none !important;
  position: relative;
  top: 4px;
  left: -1px;
}

.ag-fresh .ag-header-cell-label {
  padding: 5px 2px 4px 2px !important;
}

.ag-fresh .ag-cell-not-inline-editing {
  padding: 3px;
  padding-top: 5px;
}

.ag-fresh .ag-header-cell {
  border-right: 1px solid #cccccc !important;
}

.ag-fresh .ag-root {
  border: 1px solid #cccccc !important;
}

.ag-fresh .ag-row-selected {
  background-color: #fff4c0 !important;
}

.ag-fresh .ag-row-odd .input-icon>[class*="fa-"],
.ag-fresh .ag-row-odd .input-icon>[class*="clip-"],
.ag-fresh .ag-row-odd .input-icon>.icon {
  background: #f6f6f6;
}

.ag-fresh .input-icon>[class*="fa-"],
.ag-fresh .input-icon>[class*="clip-"],
.ag-fresh .input-icon>.icon {
  line-height: 20px;
  height: 20px;
  background: white;
}

.ag-fresh .input-icon>[class*="fa-"]:hover,
.ag-fresh .input-icon>[class*="clip-"]:hover,
.ag-fresh .input-icon>.icon:hover {
  color: #0c8f4f;
}

.ag-fresh .magic-radio+label:before,
.ag-fresh .magic-checkbox+label:before {
  top: 2px;
}

.ag-fresh .icon-warn input[type="checkbox"] {
  position: absolute;
}

.ag-fresh .icon-warn input[type="checkbox"]:checked+label:after {
  display: none;
}

.ag-fresh .icon-warn input[type="checkbox"]:checked+label:before {
  content: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO9JREFUeNpi/P//PwND1YT/DKt3Mvz9+o2BFMDMzcXAEOrOwNBWwMj4v7L//98F6xkoAcwJgQyM/1U8/pPqEmwuY6LUEBAAmcGETwHThikMzM8OgjHTxil4DcNrEMPHzwj2p6/YDWBiIsKgb98R7O8/sCr59+8fMQYhaf7+kwKvoRj0gwKD/vxFipp/eJWy4JP8v/cEA4OEMIS95xhegxj/SNr9xy3LyMAgyAdhf/gMClnyvMaYGMjAfGY1GDOmh5HvNUYxoLc42CFsUSGG/2SH0fELDAxq8hD20XP4w4hqmRZcnlAKgGYwUqtgAwgwAA/XYOw13HdGAAAAAElFTkSuQmCC");
}

.ag-fresh .ag-paging-panel * {
  font-size: 13px !important;
}

@media (max-width: 767px) {
  .ag-fresh .ag-paging-panel * {
    font-size: 12px !important;
  }
}

.ag-fresh .ag-paging-panel .ag-paging-row-summary-panel {
  width: 120px;
}

@media (max-width: 767px) {
  .ag-fresh .ag-paging-panel .ag-paging-row-summary-panel {
    display: block;
    width: 100%;
    margin-bottom: 4px;
  }
}

.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button {
  margin-right: 1px;
  margin-left: 1px;
}

.ag-fresh .per-select {
  margin-left: 5px;
}

body>.tooltip.bs-tooltip-top {
  margin-top: -2px;
}

.ag-fresh.blue-grid .ag-header {
  background: #a9d5ff !important;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #e3f1ff), color-stop(1, #fff)) !important;
  background: -ms-linear-gradient(bottom, #e3f1ff, #fff) !important;
  background: -moz-linear-gradient(center bottom, #e3f1ff 0, #fff 100%) !important;
  background: -o-linear-gradient(#fff, #e3f1ff) !important;
  border-bottom: 1px solid #a9d5ff !important;
}

.ag-fresh.blue-grid .ag-header-cell {
  border-right: 1px solid #a9d5ff !important;
}

.ag-fresh.blue-grid .ag-body {
  background-color: #f1f8ff;
}

.ag-fresh.blue-grid .ag-row-odd {
  background-color: #f1f8ff;
}

.ag-fresh.blue-grid .ag-cell-focus {
  border: 1px solid #57adff;
}

.ag-fresh.blue-grid .ag-ltr .ag-cell-no-focus {
  border-right: 1px solid #a9d5ff !important;
}

.ag-fresh.blue-grid .ag-root {
  border: 1px solid #a9d5ff !important;
}

.ag-fresh.red-grid .ag-header {
  background: #ffb7b7 !important;
  background: -webkit-gradient(linear, left bottom, left top, color-stop(0, #ffe9e9), color-stop(1, #fff)) !important;
  background: -ms-linear-gradient(bottom, #ffe9e9, #fff) !important;
  background: -moz-linear-gradient(center bottom, #ffe9e9 0, #fff 100%) !important;
  background: -o-linear-gradient(#fff, #ffe9e9) !important;
  border-bottom: 1px solid #ffb7b7 !important;
}

.ag-fresh.red-grid .ag-header-cell {
  border-right: 1px solid #ffb7b7 !important;
}

.ag-fresh.red-grid .ag-body {
  background-color: #fff3f3;
}

.ag-fresh.red-grid .ag-row-odd {
  background-color: #fff3f3;
}

.ag-fresh.red-grid .ag-cell-focus {
  border: 1px solid #ff6565;
}

.ag-fresh.red-grid .ag-ltr .ag-cell-no-focus {
  border-right: 1px solid #ffb7b7 !important;
}

.ag-fresh.red-grid .ag-root {
  border: 1px solid #ffb7b7 !important;
}

/* ---------------------------------------------------------------------- */
/*  Footer
/* ---------------------------------------------------------------------- */
footer {
  font-size: 12px;
  top: 36px;
  position: relative;
  z-index: 191;
  border: none !important;
  height: 50px;
}

@media (max-width: 991px) {
  footer {
    top: 0;
  }
}

footer .logo img {
  position: relative;
  /* top: -5px; */
}

footer .text {
  margin-left: 6px;
  border-left: 1px solid #b8c1d3;
  padding-left: 5px;
}

@media (max-width: 600px) {
  footer .text .hide-phone {
    display: none;
  }
}

footer .footer-inner {
  padding: 0 20px;
  line-height: 50px;
  margin-left: 220px;
  /* $slideBar-width; */
}

.sidebar-close footer .footer-inner {
  margin-left: 70px;
}

.right-sidebar-open footer {
  left: -220px;
}

.footer-fixed footer {
  bottom: 0 !important;
  left: 0;
  position: fixed;
  right: 0;
  z-index: 1000;
  border-top-width: 1px;
  border-top-style: solid;
}

.footer-fixed.right-sidebar-open footer {
  left: -220px;
  right: 220px;
}

.footer-fixed.sidebar-mobile-open footer {
  left: 220px;
  right: -220px;
}

.go-top {
  cursor: pointer;
  display: block;
  width: 30px;
  height: 30px;
  font-size: 16px;
  margin-bottom: 0;
  margin-right: 0;
  text-decoration: none;
  line-height: 50px;
  text-align: center;
}

/* ---------------------------------------------------------------------- */
/*  Page Header and Page Header elements
/* ---------------------------------------------------------------------- */
.topbar-tools .nav .open>a,
.topbar-tools .nav .open>a:focus,
.topbar-tools .nav .open>a:hover {
  background-color: transparent;
}

.topbar {
  margin: 0 !important;
  padding: 0 !important;
  min-height: 36px !important;
  border: none !important;
}

.header-default .topbar {
  position: relative !important;
}

.right-sidebar-open .topbar {
  left: -220px;
  right: 220px;
}

.topbar .click-area {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  left: 0;
  top: 0;
}

.topbar .container {
  position: relative;
  padding-right: 0;
  z-index: 2;
  max-width: none !important;
  width: auto !important;
}

.topbar .container .navbar-header {
  margin: 12px auto 0;
  float: none;
  width: 140px;
}

.topbar .container .navbar-header .sb-toggle-left {
  position: absolute;
  z-index: 2;
  left: 0;
  top: 0;
  height: 36px;
  width: 36px;
  text-align: center;
  background: none;
  color: #FFFFFF;
  font-size: 1.3em;
  line-height: 36px;
  padding: 0;
}

.topbar .container .navbar-header .sb-toggle-left i {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.topbar .container .navbar-header .sb-toggle-left:hover i,
.topbar .container .navbar-header .sb-toggle-left:active i,
.topbar .container .navbar-header .sb-toggle-left:focus i {
  /* @include opacity(0.6); */
}

.topbar .container .navbar-header .navbar-brand {
  padding: 0;
  min-width: 100px;
  line-height: 36px;
  top: 8px;
  position: absolute;
  margin: 0;
  left: 8px;
  height: auto !important;
}

@media (max-width: 992px) {
  .topbar .container .navbar-header .navbar-brand {
    left: 36px;
    padding-top: 6px;
  }
}

.topbar .container .navbar-header .navbar-brand i {
  font-size: 24px;
}

.topbar .container .topbar-tools {
  float: right;
  height: 36px;
  margin-top: -13px;
  max-height: 36px;
}

.topbar .container .topbar-tools>ul {
  list-style: none;
  margin: 0;
}

.topbar .container .topbar-tools>ul>li {
  display: inline-block;
}

.topbar .container .topbar-tools>ul>li>a {
  padding: 0;
  font-size: 14px;
}

.topbar .container .topbar-tools>ul>li.view-all a {
  padding: 8px 8px 6px !important;
}

.topbar .container .topbar-tools>ul>li.current-user img {
  position: relative;
  top: -3px;
}

.topbar .container .topbar-tools>ul>li.current-user .dropdown-toggle {
  line-height: 36px;
  padding-right: 12px;
  height: 36px;
}

.topbar .container .topbar-tools>ul>li.current-user .dropdown-toggle i {
  margin-left: 4px;
}

.topbar .container .topbar-tools>ul>li.current-user .dropdown-menu:after {
  left: auto;
  right: 12px;
}

.topbar .container .topbar-tools>ul>li.sign-out a,
.topbar .container .topbar-tools>ul>li.software a,
.topbar .container .topbar-tools>ul>li.theme-switch a {
  cursor: pointer;
  margin: 5px;
  line-height: 26px;
  /*  padding-left: 20px !important; */
  height: 26px;
  vertical-align: middle;
}

.topbar .container .topbar-tools>ul>li.sign-out a span,
.topbar .container .topbar-tools>ul>li.software a span,
.topbar .container .topbar-tools>ul>li.theme-switch a span {
  font-size: 14px !important;
  margin-right: 4px;
}

.topbar .container .topbar-tools>ul>li.sign-out a i,
.topbar .container .topbar-tools>ul>li.software a i,
.topbar .container .topbar-tools>ul>li.theme-switch a i {
  font-size: 1.3em !important;
  position: relative;
  top: 3px;
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.topbar .container .topbar-tools>ul>li.sign-out a:hover i,
.topbar .container .topbar-tools>ul>li.sign-out a:active i,
.topbar .container .topbar-tools>ul>li.sign-out a:focus i,
.topbar .container .topbar-tools>ul>li.software a:hover i,
.topbar .container .topbar-tools>ul>li.software a:active i,
.topbar .container .topbar-tools>ul>li.software a:focus i,
.topbar .container .topbar-tools>ul>li.theme-switch a:hover i,
.topbar .container .topbar-tools>ul>li.theme-switch a:active i,
.topbar .container .topbar-tools>ul>li.theme-switch a:focus i {
  filter: alpha(opacity=80);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .title {
  font-size: 14px;
  padding-left: 18px;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box {
  width: 190px;
  padding: 10px;
  padding-top: 0;
  text-align: center;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box [type="radio"] {
  display: none;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box [type="radio"]+label {
  border-radius: 50%;
  width: 30px;
  height: 30px;
  margin: 3px;
  position: relative;
  display: inline-block;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box [type="radio"]+label i {
  display: none;
  position: absolute;
  top: 6px;
  left: 5px;
  color: #fff;
  font-size: 18px;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box [type="radio"]:checked+label i {
  display: block;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box .main {
  background: #0c8f4f;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box .blue {
  background: #0a7eda;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box .blue2 {
  background: #2d41ac;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box .orange {
  background: #ff5a00;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box .green {
  background: #26b0a4;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box .red {
  background: #ff6360;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box .gray {
  background: #607d8b;
}

.topbar .container .topbar-tools>ul>li.theme-switch .dropdown-theme-switch .color-box .purple {
  background: #9f41bd;
}

@media (min-width: 768px) {
  .topbar .container .topbar-tools>ul>li.software.dark-bg {
    background: #09693a;
    /*darken($mainColor, 10%)*/
  }
}

.topbar .container .topbar-tools>ul>li.software .dropdown-light {
  max-width: none;
  right: 1px;
}

.topbar .container .topbar-tools>ul>li.right-menu-toggle {
  display: none;
}

.topbar .container .topbar-tools>ul>li.right-menu-toggle a {
  margin: 5px 0;
  line-height: 26px;
  padding-left: 20px !important;
  height: 26px;
}

.topbar .container .topbar-tools>ul>li.right-menu-toggle a .toggle-icon {
  font-size: 1.3em !important;
}

.topbar .container .topbar-tools>ul>li.right-menu-toggle a i {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

.topbar .container .topbar-tools>ul>li.right-menu-toggle a:hover i,
.topbar .container .topbar-tools>ul>li.right-menu-toggle a:active i,
.topbar .container .topbar-tools>ul>li.right-menu-toggle a:focus i {
  filter: alpha(opacity=80);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
}

.topbar .container .topbar-tools>ul>li.right-menu-toggle .badge {
  background-color: #F35958;
  color: #FFFFFF;
  padding: 4px 6px;
  position: absolute;
  left: 7px;
  top: 2px;
  font-size: 10px;
}

.software.show-event .dropdown-menu {
  visibility: visible;
  display: block;
  animation: software-menu-event 3s linear both;
  -webkit-animation: software-menu-event 3s linear both;
  /* border-color: #000;
  &:before{border-bottom-color:#000;} */
}

.software.show-event .dropdown-menu .dropdown-product-list:before {
  content: "切換產品模組";
  position: absolute;
  top: 100%;
  left: 0;
  background: #0c8f4f;
  color: #fff;
  padding: 6px;
  width: 100%;
  text-align: center;
  letter-spacing: 1px;
  font-size: 15px;
  font-weight: bold;
}

.software.show-event .dropdown-menu .dropdown-product-list:after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto auto 0 auto;
  border: 7px solid transparent;
  border-bottom-color: #0c8f4f;
  line-height: 0;
  height: 0;
  width: 0;
}

@-webkit-keyframes software-menu-event {

  0%,
  12% {
    visibility: hidden;
    opacity: 0;
  }

  13% {
    visibility: visible;
    opacity: 0;
    transform: translate3d(0, -20px, 0);
    -webkit-transform: translate3d(0, -20px, 0);
  }

  18% {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
  }

  97% {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
  }

  100% {
    visibility: hidden;
    opacity: 0;
    transform: translate3d(0, -20px, 0);
    -webkit-transform: translate3d(0, -20px, 0);
  }
}

@keyframes software-menu-event {

  0%,
  12% {
    visibility: hidden;
    opacity: 0;
  }

  13% {
    visibility: visible;
    opacity: 0;
    transform: translate3d(0, -20px, 0);
    -webkit-transform: translate3d(0, -20px, 0);
  }

  18% {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
  }

  97% {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
  }

  100% {
    visibility: hidden;
    opacity: 0;
    transform: translate3d(0, -20px, 0);
    -webkit-transform: translate3d(0, -20px, 0);
  }
}

.demo-register {
  background: #fff;
  position: absolute;
  top: 0;
  padding: 6px 30px;
  border-radius: 0 0 12px 12px;
  transform: translateX(-50%);
  left: 50%;
  box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.2);
  z-index: 9;
  display: flex;
  justify-content: center;
  align-items: center;
}

.demo-register p {
  font-size: 14px;
  margin: 0;
}

.demo-register .btn,
.demo-register .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .demo-register .ag-paging-button {
  margin-left: 10px;
  padding: 3px 8px;
}

.demo-register .btn span,
.demo-register .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button span,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .demo-register .ag-paging-button span {
  display: none;
}

@media (max-width: 767px) {
  .demo-register {
    top: 58px;
    left: 10px;
    transform: translateX(0%);
    padding: 0;
    background: transparent;
    box-shadow: none;
  }

  .demo-register p {
    display: none;
  }

  .demo-register .btn,
  .demo-register .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
  .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .demo-register .ag-paging-button {
    margin-left: 0px;
    font-size: 11px;
    padding: 4px 2px;
  }

  .demo-register .btn span,
  .demo-register .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button span,
  .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .demo-register .ag-paging-button span {
    display: block;
    font-size: 24px;
    margin-bottom: 4px;
  }
}

/* ---------------------------------------------------------------------- */
/*  Main Container
/* ---------------------------------------------------------------------- */
.main-container {
  /*  margin-top: $header-height ; */
  top: 36px;
  margin-left: 220px;
  position: relative;
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  -webkit-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
}

.sidebar-close .main-container {
  margin-left: 70px;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
}

.footer-fixed .main-container {
  margin-bottom: 50px;
}

.right-sidebar-open .main-container {
  left: -220px;
}

.main-container .main-content {
  position: relative !important;
  left: 0 !important;
}

.main-container .container {
  max-width: none !important;
  width: auto !important;
  min-height: calc(100vh - 86px);
}

.main-container .container .page-fadeIn>.row {
  padding-left: 10px;
}

.header-default .main-container {
  margin-top: 0 !important;
}

.toolbar,
.topNavMenu {
  background-color: #fafafa;
  border-bottom: 1px solid #dfdfdf;
  height: 70px;
  position: relative;
  max-height: 70px;
  z-index: 10;
}

.toolbar .toolbar-tools,
.topNavMenu .toolbar-tools {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
  left: 0;
  position: relative;
  -moz-transition: all 0.3s ease-in;
  -o-transition: all 0.3s ease-in;
  -webkit-transition: all 0.3s ease-in;
  -ms-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
}

.toolbar .toolbar-tools .nav,
.topNavMenu .toolbar-tools .nav {
  margin: 0;
}

.toolbar .toolbar-tools .nav .dropdown-light:after,
.topNavMenu .toolbar-tools .nav .dropdown-light:after {
  right: 21px;
  left: auto;
  top: -10px;
}

@media (max-width: 767px) {

  .toolbar .toolbar-tools .nav .dropdown-light:after,
  .topNavMenu .toolbar-tools .nav .dropdown-light:after {
    right: 16px;
  }
}

.toolbar .toolbar-tools .nav .dropdown-light:before,
.topNavMenu .toolbar-tools .nav .dropdown-light:before {
  right: 20px;
  left: auto;
  top: -11px;
}

@media (max-width: 767px) {

  .toolbar .toolbar-tools .nav .dropdown-light:before,
  .topNavMenu .toolbar-tools .nav .dropdown-light:before {
    right: 15px;
  }
}

.toolbar .toolbar-tools .badge,
.topNavMenu .toolbar-tools .badge {
  background-color: #F35958;
  color: #FFFFFF;
  padding: 4px 6px;
  position: absolute;
  right: 5px;
  top: 5px;
  font-size: 10px;
}

.toolbar .toolbar-tools .view-all,
.topNavMenu .toolbar-tools .view-all {
  text-align: center;
}

.toolbar .toolbar-tools .drop-down-wrapper ul,
.topNavMenu .toolbar-tools .drop-down-wrapper ul {
  list-style: none;
  margin: 0;
  padding: 5px 5px 0 5px;
}

.toolbar .page-header,
.topNavMenu .page-header {
  border-bottom: medium none;
  margin: 0;
  padding: 0;
}

.toolbar .page-header h1,
.topNavMenu .page-header h1 {
  color: #666666;
  font-weight: 200;
  letter-spacing: -1px;
  margin: 14px 0 0 0;
  padding: 0;
  font-size: 34.2px;
}

.toolbar .page-header small,
.topNavMenu .page-header small {
  color: #888888;
  font-size: 14px;
  font-weight: 300;
  letter-spacing: 0;
  display: block;
  margin-top: 5px;
}

@-webkit-keyframes event-flash {

  0%,
  100% {
    color: #b76003;
  }

  25%,
  75% {
    color: #fc9424;
  }
}

@keyframes event-flash {

  0%,
  100% {
    color: #b76003;
  }

  25%,
  75% {
    color: #fc9424;
  }
}

.toolbar .navbar-right,
.topNavMenu .navbar-right {
  letter-spacing: -5px;
  white-space: nowrap;
}

.toolbar .navbar-right>li,
.topNavMenu .navbar-right>li {
  letter-spacing: 0;
  display: inline-block;
  vertical-align: top;
}

.toolbar .navbar-right>li>a.event,
.topNavMenu .navbar-right>li>a.event {
  line-height: 1.1;
  color: #ea7b03;
  animation: event-flash 1s infinite both;
  -webkit-animation: event-flash 1s infinite both;
}

.toolbar .navbar-right>li>a.event i,
.topNavMenu .navbar-right>li>a.event i {
  color: #ea7b03;
  animation: event-flash .8s infinite both;
  -webkit-animation: event-flash 1s infinite both;
}

.toolbar .navbar-right>li>a,
.toolbar .navbar-right>li .dropdown-toolbar-list>a,
.toolbar .navbar-right>li .dropdown-toolbar-teach>a,
.topNavMenu .navbar-right>li>a,
.topNavMenu .navbar-right>li .dropdown-toolbar-list>a,
.topNavMenu .navbar-right>li .dropdown-toolbar-teach>a {
  border: 1px solid transparent;
  border-radius: 4px;
  color: #0c8f4f;
  font-size: 12px;
  font-weight: bold;
  letter-spacing: 0;
  line-height: 24px;
  margin-right: 3px;
  margin-top: 5px;
  filter: alpha(opacity=90);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
  -moz-opacity: 0.9;
  -khtml-opacity: 0.9;
  opacity: 0.9;
  padding: 2px 0 4px 0;
  position: relative;
  text-align: center;
  width: 60px;
}

.toolbar .navbar-right>li>a:hover,
.toolbar .navbar-right>li .dropdown-toolbar-list>a:hover,
.toolbar .navbar-right>li .dropdown-toolbar-teach>a:hover,
.topNavMenu .navbar-right>li>a:hover,
.topNavMenu .navbar-right>li .dropdown-toolbar-list>a:hover,
.topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover {
  background: #e9fdf3;
  border: 1px solid #32ee92;
  /* @include box-shadow(1px 1px 1px .2px rgba(0,0,0,.15) ); */
  color: #086035;
}

.toolbar .navbar-right>li>a:hover i,
.toolbar .navbar-right>li .dropdown-toolbar-list>a:hover i,
.toolbar .navbar-right>li .dropdown-toolbar-teach>a:hover i,
.topNavMenu .navbar-right>li>a:hover i,
.topNavMenu .navbar-right>li .dropdown-toolbar-list>a:hover i,
.topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover i {
  color: #086035;
}

.toolbar .navbar-right>li>a:focus,
.toolbar .navbar-right>li .dropdown-toolbar-list>a:focus,
.toolbar .navbar-right>li .dropdown-toolbar-teach>a:focus,
.topNavMenu .navbar-right>li>a:focus,
.topNavMenu .navbar-right>li .dropdown-toolbar-list>a:focus,
.topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:focus {
  border: 1px solid #d6d6d6;
  background: #e6e6e6;
  color: #086035;
}

.toolbar .navbar-right>li>a:focus i,
.toolbar .navbar-right>li .dropdown-toolbar-list>a:focus i,
.toolbar .navbar-right>li .dropdown-toolbar-teach>a:focus i,
.topNavMenu .navbar-right>li>a:focus i,
.topNavMenu .navbar-right>li .dropdown-toolbar-list>a:focus i,
.topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:focus i {
  color: #086035;
}

.toolbar .navbar-right>li>a i,
.toolbar .navbar-right>li>a .dropdown-toolbar-list>a i,
.toolbar .navbar-right>li .dropdown-toolbar-list>a i,
.toolbar .navbar-right>li .dropdown-toolbar-list>a .dropdown-toolbar-list>a i,
.toolbar .navbar-right>li .dropdown-toolbar-teach>a i,
.toolbar .navbar-right>li .dropdown-toolbar-teach>a .dropdown-toolbar-list>a i,
.topNavMenu .navbar-right>li>a i,
.topNavMenu .navbar-right>li>a .dropdown-toolbar-list>a i,
.topNavMenu .navbar-right>li .dropdown-toolbar-list>a i,
.topNavMenu .navbar-right>li .dropdown-toolbar-list>a .dropdown-toolbar-list>a i,
.topNavMenu .navbar-right>li .dropdown-toolbar-teach>a i,
.topNavMenu .navbar-right>li .dropdown-toolbar-teach>a .dropdown-toolbar-list>a i {
  display: block;
  margin-top: 8px;
  color: #0c8f4f;
  font-size: 20px;
  font-weight: normal;
}

.toolbar .navbar-right .dropdown-menu:before,
.topNavMenu .navbar-right .dropdown-menu:before {
  top: -11px;
  right: 39px;
}

.toolbar .navbar-right .dropdown-menu:after,
.topNavMenu .navbar-right .dropdown-menu:after {
  top: -10px;
  right: 40px;
}

.toolbar .navbar-right .dropdown-menu.dropdown-subview .fa-stack,
.topNavMenu .navbar-right .dropdown-menu.dropdown-subview .fa-stack {
  height: 1.9em;
  line-height: 1.9em;
  vertical-align: top;
  margin-right: 5px;
}

.toolbar .navbar-right .dropdown-menu.dropdown-messages,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages {
  width: 300px !important;
}

.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a {
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  color: #333333;
  display: block;
  margin-bottom: 5px;
  padding: 10px;
  color: #333333;
  border-bottom: none;
  background-color: #F8F8F8;
}

.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a.unread,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a.unread {
  background-color: #EEEEEE;
}

.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a:hover,
.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a:focus,
.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a:active,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a:hover,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a:focus,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a:active {
  background-color: #F5F5F5;
}

.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a .thread-image,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a .thread-image {
  float: left;
  height: 50px;
  margin-right: 8px;
  width: 50px;
}

.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a .author,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a .author {
  display: block;
  font-size: 12px;
  font-weight: 600;
  line-height: normal;
}

.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a .preview,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a .preview {
  display: block;
  font-size: 11px;
  line-height: normal;
  color: #888888;
}

.toolbar .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a .time,
.topNavMenu .navbar-right .dropdown-menu.dropdown-messages .drop-down-wrapper ul>li a .time {
  display: block;
  float: right;
  font-size: 11px;
  font-style: italic;
  font-weight: 600;
  color: #888888;
}

.search-box {
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  width: 300px;
  line-height: normal;
  right: 0;
  top: auto;
  left: auto;
  bottom: -58px;
  border: 1px solid rgba(17, 17, 17, 0.15);
}

.search-box .arrow {
  left: auto !important;
  margin-left: 0 !important;
  right: 35px;
  top: -11px;
}

.search-box input {
  background-color: #F8F8F8;
  border-color: #F8F8F8;
  color: #808080;
  -moz-border-radius: 0;
  -webkit-border-radius: 0;
  border-radius: 0;
  -moz-box-shadow: 0, 0, 0, transparent;
  -webkit-box-shadow: 0, 0, 0, transparent;
  box-shadow: 0, 0, 0, transparent;
}

.search-box input:focus {
  border-color: #f3f3f3;
  background-color: #f3f3f3;
  -moz-box-shadow: 0, 0, 0, transparent;
  -webkit-box-shadow: 0, 0, 0, transparent;
  box-shadow: 0, 0, 0, transparent;
}

.breadcrumb {
  display: inline-block;
  background: none;
  font-size: 12px;
  padding: 4px 0;
  margin-bottom: 2px;
  margin-top: 2px;
  margin-left: 10px;
}

.breadcrumb>li+li:before {
  color: #777777;
}

.breadcrumb>.active {
  color: #777777;
  font-weight: 600;
}

.breadcrumb-warn {
  background: #ff7272;
  margin-top: 1px;
  padding: 2px 10px;
  position: relative;
  color: #fff;
  display: inline-block;
  font-size: 12.5px;
  margin-left: 8px;
  border-radius: 4px;
}

.breadcrumb-warn a {
  text-decoration: underline !important;
  color: #fff !important;
  font-weight: bold;
}

.breadcrumb-warn:before {
  content: "";
  position: absolute;
  left: -10px;
  top: 4px;
  border: 6px solid transparent;
  border-right-color: #ff7272;
  line-height: 0;
  height: 0;
  width: 0;
}

@media (max-width: 767px) {
  .breadcrumb-warn {
    margin-left: 0;
    margin-bottom: 4px;
  }

  .breadcrumb-warn:before {
    display: none;
  }
}

.breadcrumb-icon {
  font-size: 16px;
  margin-left: 5px;
}

.breadcrumb-icon:hover {
  font-size: 18px;
}

.btn-switchPage {
  padding: 4px 0;
  float: right;
}

.btn-switchPage .btn-default,
.btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .btn-switchPage .ag-paging-button {
  padding: 0 8px !important;
  color: #0c8f4f;
  border-color: rgba(153, 153, 153, 0.4);
}

.btn-switchPage .btn-default:hover,
.btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .btn-switchPage .ag-paging-button:hover {
  background-color: #dbdbdb;
}

.btn-switchPage .btn-default:focus,
.btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:focus,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .btn-switchPage .ag-paging-button:focus,
.btn-switchPage .btn-default:active,
.btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:active,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .btn-switchPage .ag-paging-button:active {
  background: #fff;
}

.btn-switchPage .btn-default:focus:hover,
.btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:focus:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .btn-switchPage .ag-paging-button:focus:hover,
.btn-switchPage .btn-default:active:hover,
.btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:active:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .btn-switchPage .ag-paging-button:active:hover {
  background-color: #dbdbdb;
}

@media (max-width: 991px) {
  body.sidebar-mobile-open #pageslide-left {
    z-index: 1031;
  }

  body.sidebar-mobile-open #pageslide-left .left-wrapper {
    height: 100vh !important;
  }
}

#pageslide-left {
  /* border-right:1px solid lighten($grey, 26%); */
  -moz-transition: all 0.1s ease-in-out;
  -o-transition: all 0.1s ease-in-out;
  -webkit-transition: all 0.1s ease-in-out;
  -ms-transition: all 0.1s ease-in-out;
  transition: all 0.1s ease-in-out;
  width: 220px;
  z-index: 1021;
  position: fixed;
  top: 0;
  left: 0;
  padding-top: 36px;
  min-height: 100%;
}

.right-sidebar-open #pageslide-left {
  left: -220px;
}

.sidebar-close #pageslide-left {
  /* z-index: 0; */
}

#pageslide-left.slide-default {
  padding-top: 0 !important;
  position: absolute !important;
  bottom: 0;
}

#pageslide-left.slide-default .navbar-content,
#pageslide-left.slide-default .main-navigation {
  height: auto !important;
}

.horizontal-menu-fixed #pageslide-left.slide-default {
  padding-top: 0 !important;
  top: -36px;
}

.header-default.horizontal-menu-fixed #pageslide-left.slide-default {
  padding-top: 36px !important;
  top: 0;
}

#pageslide-left .navbar-content {
  position: relative;
}

#pageslide-left .navbar-content .left-wrapper {
  padding: 0;
  height: calc(100vh - 36px);
  max-height: none !important;
  overflow: hidden;
  position: relative;
  left: 0;
  width: 100%;
}

@media (max-width: 1199px) {
  #pageslide-left .navbar-content .left-wrapper {
    overflow-y: auto;
  }
}

@media (max-width: 767px) {
  #pageslide-left .navbar-content .left-wrapper {
    height: calc(100vh - 50px);
    overflow: auto;
  }
}

#pageslide-left .navigation-toggler {
  position: relative;
  cursor: pointer;
  height: 30px;
  margin-left: 190px;
  margin-top: 5px;
  margin-bottom: 5px;
  width: 16px;
  line-height: 30px;
  text-align: center;
}

#pageslide-left .navigation-toggler .logo {
  position: absolute;
  margin-left: -180px;
}

#pageslide-left .navigation-toggler .sb-toggle-left {
  height: 30px;
  position: relative;
  z-index: 10;
  width: 16px;
  float: left;
}

#pageslide-left .navigation-toggler .sb-toggle-left:before {
  content: "\f0c9";
  font-family: 'FontAwesome';
  font-weight: normal;
  font-size: 14px;
  color: #cccccc;
}

#pageslide-left .user-profile {
  position: relative;
  min-height: 78px;
  line-height: 78px;
}

#pageslide-left .user-profile .user-options {
  position: absolute;
  padding: 1px 4px;
  font-size: 18px;
  right: 7px;
  top: 18px;
  color: #0c8f4f;
  border: 1px solid transparent;
}

#pageslide-left .user-profile .user-options:hover {
  color: #086035;
  background: #e9fdf3;
  border: 1px solid #32ee92;
}

#pageslide-left .user-profile h4 {
  width: 110px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

@media (max-width: 767px) {
  #pageslide-left .user-profile h4 {
    width: 100px;
    font-size: 16px;
  }
}

#pageslide-left .user-profile img {
  margin-right: 10px;
  width: 50px !important;
  height: auto;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

#pageslide-left .slide-tools {
  height: 50px;
  line-height: 50px;
  position: absolute;
  width: 100%;
  z-index: 14;
  left: 0;
  bottom: 0;
}

#pageslide-left.slide-default .navbar-content,
#pageslide-left.slide-default .main-navigation {
  height: auto !important;
}

.header-default #pageslide-left .navbar-content {
  top: 0 !important;
}

ul.main-navigation-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

ul.main-navigation-menu li {
  border: none;
  display: block;
  margin: 0;
  padding: 0;
}

ul.main-navigation-menu li.active ul.sub-menu {
  display: block;
  padding: 0;
}

ul.main-navigation-menu li a.no-link {
  cursor: default;
  background: #e6e6e6;
  padding-left: 48px;
}

ul.main-navigation-menu li a.no-link:hover {
  background: #e6e6e6;
}

ul.main-navigation-menu li a {
  border: 0 none;
  display: block;
  font-size: 18px;
  font-weight: normal;
  margin: 0;
  padding: 10px 15px;
  position: relative;
  text-decoration: none;
  border-bottom: 1px solid #DDDDDD;
  border-top: 1px solid #FFFFFF;
  line-height: 1.42857143;
}

ul.main-navigation-menu li a i:first-of-type {
  width: 25px;
  font-size: 22px !important;
  text-align: center;
  display: inline-block;
}

ul.main-navigation-menu li a i.pull-right {
  font-size: 16px !important;
  padding-top: 4px;
}

ul.main-navigation-menu li a .icon-arrow {
  float: right;
  margin-right: 6px !important;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

ul.main-navigation-menu li a .icon-arrow:before {
  content: "\f104";
  font-family: FontAwesome;
}

ul.main-navigation-menu li.open a .icon-arrow {
  filter: alpha(opacity=100);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
}

ul.main-navigation-menu li.open a .icon-arrow:before {
  content: "\f107";
}

ul.main-navigation-menu li ul.sub-menu {
  clear: both;
  list-style: none;
  margin: 8px 0;
  /* display: none; */
  padding: 0;
}

ul.main-navigation-menu li ul.sub-menu .sub-main-icon {
  position: absolute;
  right: 5px;
  top: 4px;
  font-size: 18px;
  z-index: 99;
  cursor: pointer;
  display: inline-block;
}

ul.main-navigation-menu li ul.sub-menu .sub-main-icon:hover {
  font-size: 20px;
  top: 1px;
  right: 4px;
}

ul.main-navigation-menu li ul.sub-menu li {
  background: none;
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  margin-top: 1px !important;
  padding: 0;
  position: relative;
}


/* side-menu 物流好幫手 增加底線 */

li.menu-border-bottom {
  border-bottom: 1px solid #e7eaf0 !important;
}

li.menu-border-bottom:last-child {
  border-bottom: none !important;
}

ul.main-navigation-menu li ul.sub-menu li a {
  background: none;
  display: block;
  font-size: 16px;
  border: none;
  margin: 0;
  padding-bottom: 5px;
  padding-left: 50px !important;
  padding-right: 10px;
  padding-top: 5px;
  text-decoration: none;
}

ul.main-navigation-menu li ul.sub-menu li a .icon-arrow {
  margin-right: 22px;
}

ul.main-navigation-menu li ul.sub-menu li.dropdown-header {
  padding-left: 40px !important;
}

ul.main-navigation-menu li ul.sub-menu li.divider {
  height: 1px;
  margin: 9px 0;
  overflow: hidden;
  margin-left: 40px !important;
}

ul.main-navigation-menu li ul.sub-menu li ul.sub-menu {
  margin: 0;
}

ul.main-navigation-menu li ul.sub-menu li ul.sub-menu li a {
  padding-left: 60px !important;
}

ul.main-navigation-menu li ul.sub-menu li ul.sub-menu li ul.sub-menu li a {
  padding-left: 80px !important;
}

@media (min-width: 991px) {
  .sidebar-close #pageslide-left {
    z-index: 999;
    width: 70px;
  }

  .sidebar-close #pageslide-left .navigation-toggler {
    margin-left: 22px;
    margin-top: 6px;
  }

  .sidebar-close #pageslide-left .navigation-toggler .logo {
    display: none;
  }

  .sidebar-close #pageslide-left .navigation-toggler .sb-toggle-left:before {
    color: #0c8f4f;
    font-size: 24px;
  }

  .sidebar-close #pageslide-left .ps-content .panel {
    position: static;
  }

  .sidebar-close #pageslide-left .panel {
    position: static;
  }

  .sidebar-close #pageslide-left .navbar-content .left-wrapper {
    overflow: visible;
  }

  .sidebar-close #pageslide-left .user-profile {
    display: none;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(1) .sub-menu,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(2) .sub-menu,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(3) .sub-menu,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(4) .sub-menu,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(5) .sub-menu {
    top: 0;
    bottom: auto;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(1) .sub-menu:before,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(2) .sub-menu:before,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(3) .sub-menu:before,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(4) .sub-menu:before,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(5) .sub-menu:before {
    margin: 20px auto auto -8px;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(1) .sub-menu:after,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(2) .sub-menu:after,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(3) .sub-menu:after,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(4) .sub-menu:after,
  .sidebar-close #pageslide-left ul.main-navigation-menu li:nth-of-type(5) .sub-menu:after {
    margin: 18px auto auto -10px;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li a {
    line-height: 1.1;
    padding: 10px 5px;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li a i {
    font-size: 28px !important;
    display: block;
    text-align: center;
    margin-left: 0;
    width: auto;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li a i.pull-right {
    display: none;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li a .title {
    font-size: 12px;
    letter-spacing: 0;
    text-align: center;
    display: block;
    padding-top: 5px;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li a .title .close-hide {
    display: none;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu {
    display: block;
    min-width: 200px;
    top: auto;
    /* max-height:calc( 100vh - 300px) ; */
    /* bottom: 0;  */
    position: absolute;
    left: 100%;
    padding: 5px 5px;
    background: white;
    border: 1px solid #999999;
    -moz-box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.2);
    -webkit-box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.2);
    box-shadow: 2px 2px 6px 1px rgba(0, 0, 0, 0.2);
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu.listMore {
    width: 420px;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu.two-column {
    width: 420px;
    height: 180px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu li {
    display: inline-block !important;
    min-width: 200px;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu:before,
  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu:after {
    content: "";
    width: 0px;
    height: 0px;
    border-style: solid;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu:before {
    margin: auto auto 20px -8px;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0px;
    z-index: 2;
    border-width: 8px 8px 8px 0;
    border-color: transparent #fff transparent transparent;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu:after {
    margin: auto auto 18px -10px;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0px;
    z-index: 1;
    border-style: solid;
    border-width: 10px 10px 10px 0;
    border-color: transparent #999999 transparent transparent;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu .title {
    font-size: 14px;
    text-align: left;
    padding-top: 0;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a {
    white-space: nowrap;
    padding-left: 20px !important;
    padding: 8px;
    padding-right: 30px !important;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:before {
    content: "\f0da";
    font-family: 'FontAwesome';
    position: absolute;
    display: none;
    top: 8px;
    right: 11px;
    color: #0c8f4f;
    font-size: 16px;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a.active:before {
    color: #fff !important;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover {
    background: #11c76e !important;
    color: #fff !important;
  }

  .sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover:before {
    color: #fff;
  }
}

.btn.status i,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .status.ag-paging-button i {
  color: #1FBBA6 !important;
}

.btn.status.offline i,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .status.offline.ag-paging-button i {
  color: rgba(255, 255, 255, 0.3) !important;
}

.closedbar {
  transform: translateX(-20px);
  position: fixed;
  top: 37px;
  bottom: 1px;
  z-index: 1030;
  opacity: 0;
  width: 20px;
  -moz-border-radius: 0 5px 5px 0;
  -webkit-border-radius: 0 5px 5px 0;
  border-radius: 0 5px 5px 0;
  text-align: center;
  background: url(../images/light_dots.png) no-repeat center 5px;
}

.closedbar.open {
  opacity: 0;
  /* opacity: 1; */
}

.sidebar-close .closedbar {
  transform: translateX(0px);
  -moz-transition: all 0.2s 0.2s;
  -o-transition: all 0.2s 0.2s;
  -webkit-transition: all 0.2s 0.2s;
  -ms-transition: all 0.2s 0.2s;
  transition: all 0.2s 0.2s;
}

.right-sidebar-open .closedbar {
  left: -220px;
}

.closedbar i {
  padding-top: 10px;
}

/*----------------------調整---------------------*/
#pageslide-left {
  background: #f1f3f6;
}

#pageslide-left .panel {
  box-shadow: none;
  border: none;
  background-color: transparent;
}

#pageslide-left .panel-title {
  font-size: inherit;
  border: none;
}

#pageslide-left .panel-heading {
  padding: inherit;
  min-height: inherit;
  border: none;
  background: #fff;
}

#pageslide-left .panel-body {
  border: none;
  padding: 0;
  margin: 0;
}

#pageslide-left [aria-selected='true'],
#pageslide-left [aria-selected='true']:hover,
#pageslide-left [aria-selected='true'] a,
#pageslide-left [aria-selected='true'] a:hover {
  background: #ededed !important;
  /* color:$mainColor; */
}

#pageslide-left [aria-selected='true'] i,
#pageslide-left [aria-selected='true']:hover i,
#pageslide-left [aria-selected='true'] a i,
#pageslide-left [aria-selected='true'] a:hover i {
  color: #0c8f4f;
}

#pageslide-left .alone [aria-selected='true'],
#pageslide-left .alone [aria-selected='true']:hover,
#pageslide-left .alone [aria-selected='true'] a,
#pageslide-left .alone [aria-selected='true'] a:hover {
  background: #11c76e !important;
  color: #fff;
}

#pageslide-left .alone [aria-selected='true'] i,
#pageslide-left .alone [aria-selected='true']:hover i,
#pageslide-left .alone [aria-selected='true'] a i,
#pageslide-left .alone [aria-selected='true'] a:hover i {
  color: #fff;
}

#pageslide-left a[data-toggle] {
  padding: 0 !important;
  border-top: none;
  border-bottom: none;
}

.topNavMenu {
  z-index: 193;
  position: absolute;
  top: 36px;
  right: 15px;
  background-color: transparent !important;
  border-bottom: none !important;
  -moz-transition: all 0.1s linear;
  -o-transition: all 0.1s linear;
  -webkit-transition: all 0.1s linear;
  -ms-transition: all 0.1s linear;
  transition: all 0.1s linear;
  /*-------下拉工具列表------*/
  /*-------下拉工具列表 線上學習------*/
}

@media (max-width: 767px) {
  .topNavMenu.scroll-xs {
    max-width: 100%;
    overflow: hidden;
    overflow-x: auto;
    padding-left: 6px;
  }

  .topNavMenu.scroll-xs .toolbar-tools {
    float: none !important;
  }
}

@media (max-width: 991px) {
  .topNavMenu {
    top: 50px;
  }
}

@media (max-width: 767px) {
  .topNavMenu {
    right: 0;
  }
}

.topNavMenu .dropdown-toolbar-list {
  text-align: center;
  padding: 10px;
  width: 82px;
  letter-spacing: -5px;
  text-align-last: auto;
  white-space: normal !important;
}

.topNavMenu .dropdown-toolbar-list a {
  display: inline-block;
  letter-spacing: 0;
  margin-top: 0 !important;
  margin-right: 0 !important;
}

.topNavMenu .dropdown-toolbar-teach {
  text-align: left;
  padding: 10px;
  width: 212px;
  letter-spacing: -5px;
  text-align-last: auto;
  white-space: normal !important;
}

.topNavMenu .dropdown-toolbar-teach a {
  display: inline-block;
  letter-spacing: 0;
  margin: 2px !important;
}

@media (max-width: 767px) {
  .topNavMenu .dropdown-toolbar-teach-menu {
    left: -140px !important;
    right: auto !important;
  }

  .topNavMenu .dropdown-toolbar-teach-menu:before {
    left: 155px !important;
  }

  .topNavMenu .dropdown-toolbar-teach-menu:after {
    left: 156px !important;
  }
}

@media (max-width: 991px) {
  .sidebar-mobile-open .topNavMenu {
    right: -235px !important;
    -moz-transition: all 0.1s linear;
    -o-transition: all 0.1s linear;
    -webkit-transition: all 0.1s linear;
    -ms-transition: all 0.1s linear;
    transition: all 0.1s linear;
  }
}

.alert-content-top {
  margin-right: 2px;
  padding: 6px 12px;
  margin-bottom: 2px;
  margin-left: 222px;
}

@media (max-width: 991px) {
  .alert-content-top {
    display: none;
  }
}

.sidebar-close .alert-content-top {
  margin-left: 72px;
}

@media (min-width: 991px) {

  .has-alert-content-top [ui-view="topNavMenu"],
  .has-alert-content-top app-top-nav-menu {
    padding-top: 38px;
    display: block;
  }

  .has-alert-content-top .main-container {
    top: 0;
  }

  .has-alert-content-top .topNavMenu {
    top: auto;
  }
}

/* ---------------------------------------------------------------------- */
/*  Login
/* ---------------------------------------------------------------------- */
.login-bg-full {
  background-color: #f1f1f1;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.copyright {
  width: 100%;
  position: fixed;
  text-align: center;
  bottom: 0;
  font-size: 12px;
  color: #222;
  padding: 15px 10px;
  line-height: 1.1;
  z-index: 999;
  background: #f1f1f1;
}

.login-wrap {
  background: #fff;
  border-radius: 15px;
  width: 85%;
  height: 90%;
  position: relative;
  /* max-height: 700px; */
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0 auto 40px;
  overflow: hidden;
  box-shadow: 5px 5px 15px 3px #d2d2d2;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  /* -webkit-text-fill-color: #fff; */
  -webkit-box-shadow: 0 0 0 1000px rgba(255, 255, 255, 0) inset;
  transition: background-color 5000s ease-in-out 0s;
}

.promo-bar {
  width: 100%;
  max-width: 450px;
  /* height: 110px; */
  /* position: absolute; */
  margin: 20px auto 0;
}

.promo-bar img {
  width: 100%;
}

.login-wrap.bg-none {
  background: #fff;
}

.login-wrap .msg-wrap {
  margin: 0 auto;
  text-align: center;
  width: 61%;
  height: 100%;
  border-radius: 0 15px 15px 0;
  padding: 0;
  /* height: 100vh; */
  background: url("https://a1cdnpoint2.azureedge.net/images/login-bg-2.png") #fff no-repeat center left;
}

.login-wrap .msg-wrap .title-text {
  display: inline-flex;
}

.login-wrap .msg-wrap .block-title {
  display: inline-block;
  font-size: 18px;
  font-weight: bold;
  vertical-align: middle;
  color: #535353;
  letter-spacing: 1px;
  margin-left: 10px;
}

.login-wrap .msg-wrap .block-list {
  color: #555555;
  line-height: 1.8;
  font-weight: bold;
  margin: 5px 20px;
}

.login-wrap .msg-wrap .l-notice.new {
  background-color: #ffffffd1;
  display: inline-block;
  text-align: left;
  width: 100%;
  max-width: 530px;
  border-radius: 10px;
  margin-bottom: 15px;
}

.login-wrap .msg-wrap .notice-scroll {
  height: 400px;
  /* min-height: calc(100% - 300px); */
  width: 980px;
  margin: 0 auto;
  overflow-x: unset;
  overflow-y: auto;
}

.login-wrap .msg-wrap .notice-title {
  background-color: #fff;
  border-radius: 10px 10px 0 0;
  padding: 6px 20px;
}

.login-wrap .msg-wrap .title-text {
  display: inline-flex;
  letter-spacing: 3px;
  text-shadow: 3px 3px 5px #0000004d;
}

.login-wrap .msg-wrap img.notice-icon {
  display: inline-block;
}

.login-wrap .title,
.login-wrap .msg-date {
  color: #fff;
  font-size: 30px;
  font-weight: bold;
  font-family: Noto Sans CJK TC;
}

.login-wrap .msg-date {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  display: inline-flex;
  margin-top: 14px;
  text-shadow: 3px 3px 5px #0000004d;
}

.login-wrap .title {
  width: 530px;
  margin: 15px auto;
}

.login-wrap .trial-version {
  position: absolute;
  z-index: 99;
  left: 0;
  top: 0;
  width: 140px;
}

.login-wrap .trial-version img {
  max-width: 100%;
  height: auto;
}


@media (max-width: 1366px) {

  .login-wrap .title:nth-child(1) {
    margin: 0 auto 5px;
  }

  .login-wrap .title:nth-child(2) {
    margin: 0px auto 15px;
  }

  .login-wrap .msg-wrap .notice-scroll {
    height: 310px;
  }

  .login-wrap .msg .more-block {
    margin: 0 auto -45px !important;
  }


}



@media (max-width: 1199px) {
  .login-wrap .trial-version {
    width: 120px;
  }

  .login-wrap .msg-wrap .l-notice.new {
    max-width: 500px;
  }

  .login-wrap .msg-wrap .l-notice.new:last-child {
    margin-bottom: 100px !important;
  }

  .login-wrap .title {
    width: 500px;
  }


}

@media (max-width: 991px) {
  .login-wrap .trial-version {
    width: 100px;
  }



  .login-wrap .title .hint {
    display: none;
  }


}

@media (max-width: 767px) {
  .login-wrap .trial-version {
    width: 80px;
  }

  .login-wrap .main-container .vision {
    margin-top: 30px;
    -webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;
  }


}

.login-wrap .main-container {
  height: 100vh;
  width: 40%;
  /* max-width: 800px; */
  text-align: center;
  position: relative;
  margin-left: 0;
  /* top: unset; */
  /* overflow: hidden; */
}

.login-wrap .main-container .vision {
  padding: 10px;
}

.login-wrap .main-container .vision img {
  max-width: 100%;
  height: auto;
}




.login-wrap .btn-wrap .btn,
.login-wrap .btn-wrap .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .login-wrap .btn-wrap .ag-paging-button {
  padding: 6px 10px;
  width: 100%;
  font-size: 15px;
}

.login-wrap .main-login {
  text-align: left;
  /* margin-top: -30px; */
  position: relative;
  width: 96%;
  max-width: 400px;
  /* margin: -60px auto 0; */
  margin: 0 auto;
  background: #fff;
}

.login-wrap .logo {
  width: 90%;
  max-width: 260px;
  margin: 0 auto 10px;
  text-align: center;
}

.login-wrap .logo img {
  max-width: 100%;
  height: auto;
}

.login-wrap .box-login,
.login-wrap .box-forgot,
.login-wrap .box-register {
  background: #fff;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
  width: 96%;
  padding: 10px;
  max-width: 460px;
  /* margin: 20px auto 130px; */
}

.login-wrap .box-login .input-icon .form-control,
.login-wrap .box-forgot .input-icon .form-control,
.login-wrap .box-register .input-icon .form-control {
  height: 46px;
  padding-left: 36px;
  border-radius: 4px !important;
}

.login-wrap .box-login .input-icon i,
.login-wrap .box-forgot .input-icon i,
.login-wrap .box-register .input-icon i {
  top: 8px;
  font-size: 1.2em;
  left: 10px;
  color: rgba(153, 153, 153, 0.5);
}

.login-wrap .box-login .input-icon .form-control:focus+i,
.login-wrap .box-forgot .input-icon .form-control:focus+i,
.login-wrap .box-register .input-icon .form-control:focus+i {
  color: rgba(12, 143, 79, 0.6);
}

.login-wrap .form fieldset {
  border: none;
  margin: 0;
  padding: 10px 0 0;
}

.login-wrap a.forgot {
  color: #909090;
  font-size: 12px;
  position: absolute;
  right: 10px;
  text-shadow: 1px 1px 1px #FFFFFF;
  top: 9px;
}

.login-wrap input.password {
  padding-right: 66px;
}

.login-wrap label {
  color: #7F7F7F;
  font-size: 14px;
  margin-top: 5px;
}

.login-wrap .form-actions:before,
.login-wrap .form-actions:after {
  content: "";
  display: table;
  line-height: 0;
}

.login-wrap .form-actions:after {
  clear: both;
}

.login-wrap .form-actions {
  margin-top: 6px;
  margin-bottom: 10px;
  padding-top: 10px;
  display: block;
}

.login-wrap .new-account {
  border-top: 1px dotted #EEEEEE;
  margin-top: 15px;
  padding-top: 10px;
  display: block;
}

.login-wrap .alert-success {
  margin-bottom: 6px;
}

.login-wrap .alert-new-year {
  position: relative;
  padding: 10px;
  padding-left: 40px;
  background: url("http://cloudworker.digiwin.biz/images/20200113/cloud.png") no-repeat right bottom #ff7373;
  color: #fff;
}

.login-wrap .alert-new-year .coin {
  position: absolute;
  left: 8px;
  top: -4px;
  animation: name 1s both infinite ease-in;
}

.login-wrap .alert-new-year span {
  letter-spacing: 2px;
  font-size: 14px;
}

.login-wrap .alert-new-year a {
  float: right;
  color: #fff;
  text-decoration: underline !important;
}

.login-wrap .title .hint {
  font-size: 16px;
  /* font-weight: bold; */
  text-align: left;
  text-shadow: 3px 3px 5px #0000004d;
}


.login-wrap .msg {
  position: relative;
  /* margin-top: 55px; */
}

.login-wrap .msg .more-block {
  display: block;
  color: #fff;
  font-size: 30px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: -50px auto;
}

.login-wrap .msg .more-block::selection {
  background: unset !important;
}


.login-wrap.forgot-pw {
  box-shadow: none;
  margin-top: 70px;
}

.login-wrap.forgot-pw .box-forgot {
  text-align: center;
}

.login-wrap.forgot-pw .form-actions {
  display: flex;
  justify-content: space-between;
}

.login-wrap.forgot-pw .captcha-block div {
  margin: 0 auto;
  text-align: center;
}

@keyframes name {

  0%,
  100% {
    transform-origin: top;
    transform: rotate(0deg);
  }

  60% {
    transform-origin: top;
    transform: rotate(10deg);
  }
}

/*
 *  STYLE 1
 */
.notice-scroll.style-1::-webkit-scrollbar-track {
  border-radius: 10px;
}

.notice-scroll.style-1::-webkit-scrollbar {
  width: 12px;
}

.notice-scroll.style-1::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: unset;
}


@media (max-width: 991px) {
  .login-bg-full {
    background: #fff;
  }

  .login-wrap {
    background: #ffffff;
    overflow: auto;
    flex-direction: column;
    width: 100%;
    height: 100%;
    justify-content: start;
    padding-top: 50px;
    box-shadow: none;
    margin: 0;
  }

  .login-wrap .title {
    width: 100% !important;
    max-width: 500px;
    color: #555;
    align-items: center;
  }

  .login-wrap .main-container {
    width: 100% !important;
    max-width: unset !important;
    height: auto !important;
  }

  .login-wrap .main-login {
    width: 100%;
    margin: 0 auto;
  }

  .login-wrap .msg {
    border-top: 1px solid #c0c0c0;
    padding-top: 30px;
  }

  .login-wrap .msg-wrap {
    order: 2;
    height: auto !important;
    background: none;
    width: 96% !important;
    padding: 10px;
    max-width: 460px;
  }


  .login-wrap .msg-wrap .title-text {
    text-shadow: none;
  }

  .msg-wrap .msg-date {
    text-shadow: none;
  }

  .login-wrap .msg-wrap .l-notice.new {
    background-color: #f7f7f7;
  }

  .login-wrap .msg-wrap .l-notice.new {
    background-color: #f7f7f7;
  }

  .msg-wrap .notice.new {
    width: 360px !important;
    background-color: #eee !important;
  }

  .msg-wrap .notice-scroll {
    width: 100% !important;
    max-width: 400px;
    height: 200px !important;
  }

  /* .msg-wrap .title-text {
      color: #484848; } */
  .msg-wrap .notice-title {
    background-color: #eee !important;
    border-bottom: 1px solid #d9d9d9;
  }

  .msg-wrap .msg-date {
    color: #555 !important;
    font-size: 18px !important;
    margin-top: 0;
  }

  .main-container {
    width: 100% !important;
    height: auto !important;
  }

  .login-wrap .title .hint {
    /* color: #8c8c8c; */
    font-weight: normal;
    font-size: 14px;
  }

  .login-wrap .box-login,
  .login-wrap .box-forgot,
  .login-wrap .box-register {
    margin: 30px auto 0 !important;
  }

  .copyright {
    text-align: center;
    background: #eee;
    bottom: 0;
    padding: 15px 10px;
    font-size: 12px;
  }

}

@media (max-width: 767px) {

  .msg-wrap .notice.new {
    width: 100% !important;
  }

  .msg-wrap .notice-scroll {
    max-width: unset;
    overflow-y: unset !important;
    height: unset !important;
  }

  .msg-wrap {
    max-width: unset;
  }

}

@media (max-width: 576px) {
  .login-wrap .title {
    width: 100% !important;
    max-width: 390px;
  }
}

@media (max-width: 400px) {
  .login-wrap .title {
    max-width: 340px;
  }

  .login-wrap .msg-wrap .l-notice {
    width: 90% !important;
  }
}


.rating-help {
  background: #fff;
  font-size: 14px;
  padding-bottom: 60px;
}

@media (max-width: 767px) {
  .rating-help {
    font-size: 10px;
  }
}

.rating-help .header {
  width: 100%;
  height: 36px;
  background: #0c8f4f;
  text-align: center;
}

.rating-help .header .logo {
  position: absolute;
  left: 10px;
  top: 0;
  padding-top: 2px;
}

.rating-help .header .logo i {
  font-size: 30px;
  color: #fff;
  display: inline-block;
  margin-right: 5px;
}

.rating-help .header .logo img {
  display: inline-block;
  vertical-align: top;
  padding-top: 8px;
}

.rating-help .header .logo2 {
  position: absolute;
  right: 10px;
  top: 2px;
}

.rating-help .header h1 {
  margin: 0;
  font-size: 20px;
  letter-spacing: 3px;
  color: #fff;
  padding-top: 6px;
  font-weight: bold;
}

.rating-help .header .icon-btn {
  color: #fff;
  margin-right: 10px;
  font-size: 1.6em;
  line-height: 1;
  margin-top: 5px;
}

@media (max-width: 767px) {
  .rating-help .header .icon-btn {
    font-size: 22px;
  }
}

.rating-help .header .icon-btn:hover i {
  filter: alpha(opacity=80);
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  -moz-opacity: 0.8;
  -khtml-opacity: 0.8;
  opacity: 0.8;
}

.rating-help .container {
  width: 100%;
  max-width: 840px;
  padding: 10px;
}

.rating-help .container h1 {
  font-weight: bold;
  font-size: 3.2em;
  text-align: center;
  letter-spacing: 4px;
  position: relative;
  display: inline-block;
  margin: 40px 0 20px;
  font-family: "Microsoft Yahei";
}

@media (max-width: 767px) {
  .rating-help .container h1 {
    font-size: 3.2em;
  }
}

.rating-help .container h1 .remind {
  background: #ff5b5b;
  color: #fff;
  font-size: 16px;
  text-align: center;
  padding: 4px 8px;
  letter-spacing: 1px;
  border-radius: 6px;
  position: absolute;
  right: 0;
  top: -24px;
}

.rating-help .container h3 {
  text-align: left;
  color: #686868;
  font-size: 1.9em;
  font-weight: bold;
  margin-left: -12px;
}

@media (max-width: 767px) {
  .rating-help .container h3 {
    margin-left: 0px;
  }
}

.rating-help .container h3 .number {
  font-family: "Arial";
  font-size: 46px;
  color: #00b068;
  margin-right: 6px;
  position: relative;
  top: 3px;
  font-style: italic;
}

.rating-help .container h3.small {
  font-size: 1.5em;
}

.rating-help .container h3.small .icon {
  position: relative;
  top: -6px;
  margin: 0 4px;
}

.rating-help .container .text {
  font-size: 16px;
}

@media (max-width: 767px) {
  .rating-help .container .text {
    font-size: 14px;
  }
}

.rating-help .container .arr-bottom {
  color: #cecece;
  display: block;
  padding-left: 5%;
  font-size: 40px;
}

.select-product-wrap-ver2020 {
  padding-top: 40px;
  position: relative;
  overflow: visible;
  min-height: 100vh;
  background: url("https://a1cdnpoint2.azureedge.net/images/select-product_bg2.png") no-repeat bottom center fixed;
}

@media (max-width: 767px) {
  .select-product-wrap-ver2020 {
    background: #fff;
    padding-bottom: 0;
  }
}

.select-product-wrap-ver2020 .header {
  position: fixed;
  width: 100%;
  height: 40px;
  right: 0;
  top: 0px;
  background: #f2f2f2;
  display: flex;
  align-items: center;
  z-index: 9999;
}

.select-product-wrap-ver2020 .header .logo {
  max-width: 180px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}

.select-product-wrap-ver2020 .header .logo img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 767px) {
  .select-product-wrap-ver2020 .header .logo {
    margin-left: 10px;
    margin-right: 0;
  }
}

.select-product-wrap-ver2020 .header .btn-box {
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  align-items: center;
}

.select-product-wrap-ver2020 .header .btn-link {
  width: 46px;
  height: 40px;
  border-left: 1px solid #d6d6d6;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  color: #a6a6a6;
}

.select-product-wrap-ver2020 .header .btn-link:hover {
  color: gray;
  background: #eaeaea;
  text-decoration: none !important;
}

.select-product-wrap-ver2020 .alert {
  letter-spacing: 1px;
  max-width: 450px;
  font-size: 13.6px;
  margin-left: auto;
  margin-right: auto;
}

.select-product-wrap-ver2020 .select-product-box {
  position: relative;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: calc(1.5vh + 46px);
  display: flex;
  justify-content: center;
}

@media (max-width: 991px) {
  .select-product-wrap-ver2020 .select-product-box {
    flex-wrap: wrap;
    padding-bottom: 60px;
  }
}

.select-product-wrap-ver2020 .center-part {
  margin-left: 20px;
  margin-right: 20px;
  max-width: 840px;
}


.select-product.left-part {
  min-height: 239px !important;
  margin-bottom: 20px;
}

.select-product.left-part:last-child {
  margin: 0;
}

.red-tag {
  background: #ff6060;
  border-radius: 50px;
  padding: 3px 10px;
  color: #fff;
  font-weight: bold;
  margin-top: 3px;
  position: absolute;
  left: -16px;
  width: 120px;
  text-align: center;
}

.red-tag-under {
  background: #ff6060;
  border-radius: 50px;
  padding: 3px 10px;
  color: #fff;
  font-weight: bold;
  margin-top: 5px;
  display: inline-block;
  text-align: center;
}

@media (max-width: 991px) {
  .select-product-wrap-ver2020 .center-part {
    margin-left: 0;
    margin-right: 0;
    order: -2;
    margin-bottom: 40px;
    width: 100%;
    max-width: none;
  }

  .left-part-wrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
  }

  .select-product.left-part {
    min-height: 200px !important;
    max-height: 200px;
  }


}

@media (max-width: 450px) {

  .left-part-wrap {
    flex-direction: column;
  }

  .select-product-wrap-ver2020 .left-part {
    width: 100% !important;
    min-height: 150px !important;
  }

  .red-tag-under {
    white-space: nowrap;
    margin-left: -4px;
  }

}


.select-product-wrap-ver2020 .left-part,
.select-product-wrap-ver2020 .right-part {
  justify-content: flex-start;
  flex-direction: column;
}

@media (max-width: 991px) {

  .select-product-wrap-ver2020 .left-part,
  .select-product-wrap-ver2020 .right-part {
    justify-content: flex-start;
    flex-direction: row;
  }

  .select-product-wrap-ver2020 .right-part {
    width: 100%;
    order: -1;
    margin-bottom: 10px;
  }


  .select-product-wrap-ver2020 .left-part {
    width: 47%;
    justify-content: center;
  }


}

.select-product-wrap-ver2020 .select-product {
  text-align: center;
  position: relative;
  padding: 10px 28px 20px;
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.08) inset;
  border-radius: 6px;
  display: flex;
  flex-wrap: wrap;
}

@media (min-width: 991px) {
  .select-product-wrap-ver2020 .select-product {
    min-width: 220px;
    min-height: 300px;
  }
}

.select-product-wrap-ver2020 .select-product .member {
  position: absolute;
  top: -36px;
  left: 6px;
  background: #b3b3b3;
  border-radius: 10px 10px 0 0;
  padding: 4px 12px;
  color: #fff;
  display: inline-block;
  vertical-align: top;
  margin-top: 6px;
}

.select-product-wrap-ver2020 .select-product .member i {
  font-size: 14px;
  line-height: 1;
  position: relative;
  top: 0px;
}

.select-product-wrap-ver2020 .select-product .member .people {
  padding-right: 4px;
  font-size: 14px;
  font-weight: bold;
  position: relative;
  display: inline-block;
  vertical-align: top;
}

.select-product-wrap-ver2020 .select-product .member .people:before,
.select-product-wrap-ver2020 .select-product .member .people:after {
  content: "";
  position: absolute;
  width: 1px;
  height: 90%;
  top: 5%;
}

.select-product-wrap-ver2020 .select-product .member .people:before {
  background-color: gray;
  right: 0;
}

.select-product-wrap-ver2020 .select-product .member .people:after {
  background-color: #cccccc;
  right: -1px;
}

.select-product-wrap-ver2020 .select-product .member .date {
  padding-left: 2px;
  font-size: 12px;
  padding-top: 3px;
  display: inline-block;
  vertical-align: top;
}

.select-product-wrap-ver2020 .select-product .product {
  vertical-align: top;
  margin: 12px 20px;
  text-align: center;
  flex: none;
  position: relative;
}

/* .select-product-wrap-ver2020 .select-product .product {
  vertical-align: top;
  width: 160px;
  height: 180px;
  justify-content: start;
  padding: 12px 20px;
  /* text-align: center;
  display: flex;
  position: relative;
  flex-direction: column;
} */

.select-product-wrap-ver2020 .select-product .product a {
  position: relative;
  display: block;
}

.select-product-wrap-ver2020 .select-product .product .label {
  position: absolute;
  right: 5px;
  top: 10px;
  z-index: 9;
  padding: 5px;
  border-radius: 20px;
}

.select-product-wrap-ver2020 .select-product .product .label-new {
  background: #ff6060;
  font-weight: bold;
  font-family: Arial;
}

.select-product-wrap-ver2020 .select-product .product img {
  width: 90px;
  height: auto;
}

.select-product-wrap-ver2020 .select-product .product:not(.not-open) img {
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  transform: scale(1);
}

.select-product-wrap-ver2020 .select-product .product:not(.not-open) img:hover {
  transform: scale(1.06);
}

.select-product-wrap-ver2020 .select-product .product .name {
  font-size: 15px;
  margin: 0;
  margin-top: -5px;
  font-weight: 600;
}

.select-product-wrap-ver2020 .select-product .product .time {
  font-size: 11px;
  margin: 0;
  font-family: Helvetica;
  color: #999;
}

.select-product-wrap-ver2020 .select-product .not-open {
  opacity: .3;
}

.select-product-wrap-ver2020 .select-product .not-open a {
  cursor: default;
}

@media (max-width: 767px) {
  .select-product-wrap-ver2020 .select-product {
    text-align: left;
  }

  .select-product-wrap-ver2020 .select-product .product {
    margin: 0 !important;
    margin-bottom: 10px !important;
    width: 33%;
    padding: 8px;
  }

  .select-product-wrap-ver2020 .select-product.left-part .product {
    width: 100%;
  }

  .select-product-wrap-ver2020 .select-product .product img {
    max-width: 76px;
    width: 100%;
  }

  .select-product-wrap-ver2020 .select-product .product .name {
    font-size: 13px;
    margin-top: 4px;
    letter-spacing: 0;
    white-space: nowrap;
  }

  .select-product-wrap-ver2020 .select-product .product .time {
    font-size: 11px;
  }
}

.select-product-wrap-ver2020 .APP-QR {
  text-align: center;
  width: 700px;
  position: relative;
  margin-top: 20px;
  margin-left: auto;
  margin-right: auto;
  padding: 5px 0 50px;
  text-align: center;
  position: relative;
}

.select-product-wrap-ver2020 .APP-QR .QR {
  display: inline-block;
}

.select-product-wrap-ver2020 .APP-QR .QR:first-child {
  margin-right: 50px;
}

.select-product-wrap-ver2020 .APP-QR img {
  display: inline-block;
}

.select-product-wrap-ver2020 .APP-QR .app {
  height: 76px;
  margin-right: 4px;
}

.select-product-wrap-ver2020 .APP-QR .app-advantage {
  height: 66px;
}

.select-product-wrap-ver2020 .btn-part {
  letter-spacing: -5px;
  position: fixed;
  width: 100%;
  height: 46px;
  bottom: 0;
}

.select-product-wrap-ver2020 .btn-download {
  display: inline-block;
  width: 50%;
  height: 100%;
  font-size: 16px;
  line-height: 46px;
  font-weight: bold;
  letter-spacing: 1px;
  position: relative;
  border-radius: 0;
  vertical-align: middle;
  color: #fff;
  border: none;
  padding: 0;
  background: #0b97fd;
  background: -webkit-linear-gradient(45deg, #0b97fd 72%, #47e3f0 100%);
  background: linear-gradient(45deg, #0b97fd 72%, #47e3f0 100%);
}

.select-product-wrap-ver2020 .btn-download i {
  font-size: 100%;
  margin-left: 6px;
}

@media (max-width: 350px) {
  .select-product-wrap-ver2020 .btn-download i {
    display: none;
  }
}

@media (min-width: 1380px) {
  .select-product-wrap-ver2020 .center-part {
    max-width: 1018px;
    min-width: 1018px;
  }

  /* .select-product-wrap-ver2020 .select-product .product {
    margin: 14px 26px;
  } */

  .select-product-wrap-ver2020 .select-product .product img {
    width: 120px;
  }

  .select-product-wrap-ver2020 .APP-QR {
    margin-top: 30px;
  }

  .select-product-wrap-ver2020 .APP-QR .QR:first-child {
    margin-right: 70px;
  }

  .select-product-wrap-ver2020 .APP-QR .app {
    height: 102px;
    margin-right: 6px;
  }

  .select-product-wrap-ver2020 .APP-QR .app-advantage {
    height: auto;
  }
}





/* 模組選擇頁V2 */

.select-product-wrap-v2 {
  padding-top: 40px;
  position: relative;
  overflow: visible;
  min-height: 100vh;
  background: rgb(239 255 247);
  background: linear-gradient(0deg, rgb(232 254 243) 0%, rgba(255, 255, 255, 1) 100%);
  /* background: url(../../images/entrance-bg.png), linear-gradient(0deg, rgb(221 238 255) 0%, rgba(255, 255, 255, 1) 100%); */
  background-position: bottom center;
  background-attachment: fixed;
  background-repeat: no-repeat;
  padding-bottom: 30px;
  font-family: 'Noto Sans CJK TC';
}



.select-product-wrap-v2 .header {
  position: fixed;
  width: 100%;
  height: 50px;
  right: 0;
  top: 0px;
  background: #0c8f4f;
  display: flex;
  align-items: center;
  z-index: 999;
}

.select-product-wrap-v2 .header .logo {
  max-width: 180px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}

.select-product-wrap-v2 .header .logo img {
  max-width: 100%;
  height: auto;
}


/* 右上角按鈕 */

.select-product-wrap-v2 .header .btn-box {
  position: absolute;
  right: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 190px;
  padding: 0 10px;
  height: 100%;
  background-color: #09693a;
}

.select-product-wrap-v2 .header .btn-link {
  /* width: 46px; */
  /* height: 40px; */
  /* border-left: 1px solid #d6d6d6; */
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  font-size: 24px;
  color: #ffffff;
}

.select-product-wrap-v2 .header .btn-link:hover {
  color: #e9e9e9;
  text-decoration: none !important;
  cursor: pointer;
}

.select-product-wrap-v2 .header .btn-link i {
  font-size: 20px;
}



.select-product-wrap-v2 .header .btn-link p {
  font-size: 11px;
  margin-bottom: 0;
}

/* 手機版dropdown樣式 */

.select-product-wrap-v2 .header .dropdown-menu.pull-right {
  right: 65px;
  left: auto;
}


/* 公告樣式(沿用尚未調整) */
.select-product-wrap-v2 .alert {
  letter-spacing: 1px;
  max-width: 450px;
  font-size: 13.6px;
  margin-left: auto;
  margin-right: auto;
}

/* 推播訊息 */

.select-product-wrap-v2 .message-box {
  background: #edf9f0 !important;
  background: linear-gradient(180deg, rgb(236 253 241) 0%, rgba(255, 255, 255, 1) 100%) !important;
  background-repeat: no-repeat !important;
  background-position: 98% 100% !important;
  color: #575757;
  font-size: 16px;
  letter-spacing: 1px;
}

.select-product-wrap-v2 .message-box a {
  color: #0c8f4f;
  text-decoration: underline !important;
  font-weight: bold;
}

.select-product-wrap-v2 .message-box.select-product-box.plus span {
  color: #09693a;
  font-weight: bold;
}

/* 主模組選擇 */

.select-product-wrap-v2 .select-product-box {
  position: relative;
  padding-top: 30px;
  display: flex;
  justify-content: space-around;
  max-width: 1280px;
  margin: 0 auto;
}

.select-product-wrap-v2 .select-product-box i.product-icon {
  color: #0c8f4f;
  /* background: linear-gradient(45deg, rgb(8 111 61) 0%, rgb(33 202 119) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent; */
  font-size: 30px;
}

.select-product-wrap-v2 .center-part {
  max-width: 840px;
}

.select-product-wrap-v2 .select-product.right-part {
  min-height: 140px !important;
  margin-bottom: 20px;
  padding: 25px 0 0;
  justify-content: flex-start;
  flex-direction: column;
}

.select-product-wrap-v2 .select-product.right-part:last-child {
  margin: 0;
}


.select-product-wrap-v2 .select-product {
  text-align: center;
  position: relative;
  padding: 0px 28px;
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.08);
  border-radius: 6px;
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  align-items: center;
}

.select-product-wrap-v2 .select-product-box.plus {
  padding-top: 20px;
  padding: 18px 28px;
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 0 10px 1px rgba(0, 0, 0, 0.08);
  border-radius: 6px;
  max-width: 1255px;
  margin-top: 30px;
  /* max-height: 300px; */
  justify-content: start;
}


.select-product-wrap-v2 .select-product-box.plus .title {
  color: #09693a;
  font-size: 18px;
  width: 100%;
  letter-spacing: 2px;
  font-weight: 500 !important;
  margin: 20px;
  white-space: nowrap;
  display: flex;
  align-items: center;
}

.select-product-wrap-v2 .select-product-box.plus .plus-rent {
  display: flex;
  flex-direction: column;
  width: auto;
}

.select-product-wrap-v2 .select-product-box.plus .link i {
  position: absolute;
  color: #0c8f4f;
  margin-left: -20px !important;
}

.select-product-wrap-v2 .select-product-box.plus .link .product {
  border-bottom: 1px solid #dedede !important;
}

.select-product-wrap-v2 .select-product-box.plus .link .name {
  color: #000 !important;
}

.select-product-wrap-v2 .plus-rent .product-wrap a.link:hover {
  background-color: #eefbf2;
  cursor: pointer;
  border-radius: 5px;
  transition: .3s;
}

.select-product-wrap-v2 .select-product.center-part a.empty {
  display: none;
}

.select-product-wrap-v2 .select-product.center-part a.empty .product:hover {
  border: none !important;
  background: unset !important;
  cursor: unset !important;
}


.select-product-wrap-v2 .select-product-box.plus .time {
  font-size: 12px;
  color: #09693a;
}

.select-product-wrap-v2 .select-product-box.plus .time-last {
  font-size: 12px;
  color: #ff5454;
  position: relative;
}

.select-product-wrap-v2 .select-product .product .time-last:before {
  content: '\f06a';
  font-family: 'FontAwesome';
  margin-right: 3px;
}

.select-product-wrap-v2 .select-product-box.plus .time-last:before {
  content: '\f06a';
  font-family: 'FontAwesome';
  position: absolute;
  left: -13px;
  top: 1px;
}


.select-product-wrap-v2 .select-product-box.plus .select-product {
  max-width: 1260px;
  margin: 0 auto !important;
}


.select-product-wrap-v2 .select-product-box.plus .product-wrap {
  display: flex;
  flex-direction: initial;
  flex-wrap: wrap;
  /* height: 200px; */
}



/* 未租用的模組 */
.select-product-wrap-v2 .select-product-box.plus .plus-notrent .product {
  width: 150px !important;
}

.select-product-wrap-v2 .select-product-box.plus .product {
  width: 225px;
  height: 40px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  /* margin: 0 20px; */
  align-items: center;
  border-bottom: 1px solid #dedede;
  margin-left: 40px;
  padding-right: 5px;
}

.select-product-wrap-v2 .select-product-box.plus .product .name {
  width: 160px;
  text-align: left;
  font-size: 16px;
  color: #757575;
  /* padding-left: 5px; */
}



.select-product-wrap-v2 .select-product-box.plus .product * {
  margin: 0;
}

/* .select-product-wrap-v2 .select-product-box.plus .plus-rent .product:last-child,
.select-product-wrap-v2 .select-product-box.plus .plus-rent .product:nth-child(5),
.select-product-wrap-v2 .select-product-box.plus .plus-rent .product:nth-child(10),
.select-product-wrap-v2 .select-product-box.plus .plus-notrent .product:last-child,
.select-product-wrap-v2 .select-product-box.plus .plus-notrent .product:nth-child(5),
.select-product-wrap-v2 .select-product-box.plus .plus-notrent .product:nth-child(10) {
  border: none;
} */

/* 租期到期hover提醒 */

.select-product-wrap-v2 .center-part .block {
  position: relative;
  max-height: 110px;
  height: 110px;
  width: 110px;
  display: flex;
  align-content: center;
  justify-content: center;
  overflow: hidden;
}

.select-product-wrap-v2 .center-part .block a {
  margin: 10px 0;
}

.select-product-wrap-v2 .center-part .block .content-hover a:hover {
  font-weight: bold;
  color: #10a45c;
}

.select-product-wrap-v2 .center-part .block .content-hover {
  transform: scale(0, 0);
  position: absolute;
  height: 100%;
  width: 100%;
  background-color: #eefbf2;
  cursor: pointer;
  border: #bff8dc 1px solid;
  border-radius: 5px;
  transition: all 0.2s ease-in-out;
  display: flex;
  justify-content: center;
  flex-flow: column;
}


.select-product-wrap-v2 .center-part .block .content {
  display: flex;
  justify-content: center;
  flex-flow: column;
}

.select-product-wrap-v2 .center-part .block .content img {
  width: 160px;
}

.select-product-wrap-v2 .center-part .block:hover>.content-hover {
  transform: scale(1, 1);
  cursor: pointer;
}


.select-product-wrap-v2 .center-part .block-hidden .content-hover {
  /* display: none; */
  position: relative;
  width: 110px;
}



.select-product-wrap-v2 .center-part .block-hidden a.home-link {
  opacity: 0;
  width: 110px;
  height: 110px;
  top: -110px;
  left: 0;
  right: 0;
  margin: 0 auto;
  position: absolute !important;
}

.select-product-wrap-v2 .center-part .block-hidden a.order-link {
  display: none !important;
}

.select-product-wrap-v2 .center-part .block-hidden:hover {
  background-color: #eefbf2;
  cursor: pointer;
  border: #bff8dc 1px solid;
  border-radius: 5px;
  transition: .3s;
  padding: 8px 0;
}



/* 未租用 */
.select-product-wrap-v2 .center-part .product.not-open .home-link {
  display: none !important;
}

.select-product-wrap-v2 .center-part .product.not-open .block-hidden:hover {
  background: unset;
  border: unset;
  cursor: default;
}

/* 有租期但無法使用的狀況 */
.select-product-wrap-v2 .center-part .product.not-open .block:hover>.content-hover {
  transform: scale(0, 0);
}





.select-product-wrap-v2 .plus-rent .content {
  display: flex;
  font-size: 16px;
}


.select-product-wrap-v2 .plus-rent .block {
  position: relative;
  max-height: 60px;
  height: 60px;
  width: 110px;
  display: flex;
  align-content: center;
  justify-content: center;
  overflow: hidden;
}


.select-product-wrap-v2 .plus-rent .block-hidden .content-hover {
  /* display: none; */
  position: relative;
  width: 220px;
  margin-left: -220px;
}

.select-product-wrap-v2 .plus-rent .block .content-hover {
  transform: scale(0, 0);
  position: absolute;
  right: 0;
  width: 85px;
  padding: 5px 0;
  text-align: center;
  background-color: #fff !important;
  cursor: pointer;
  border: none !important;
  border-radius: 5px;
  transition: all 0.2s ease-in-out;
  display: flex;
  flex-flow: column;
}

.select-product-wrap-v2 .plus-rent .block.link .content-hover {
  width: 100%;
  flex-flow: nowrap;
  justify-content: space-around;
}

.select-product-wrap-v2 .plus-rent .block .content-hover a:hover {
  font-weight: bold;
  color: #10a45c;
}

.select-product-wrap-v2 .plus-rent .block:hover>.content-hover {
  transform: scale(1, 1);
  cursor: pointer;
}

.select-product-wrap-v2 .plus-rent .block .content {
  display: flex;
  font-size: 16px;
  align-items: center;
  color: #757575;
}

.select-product-wrap-v2 .plus-rent .content p {
  margin: 0;
}

.select-product-wrap-v2 .plus-rent .block .content img {
  width: 160px;
}



/* 加值模組有連結 */

.select-product-wrap-v2 .plus-rent .product {
  border: 1px solid #fff;
  border-bottom: 1px solid #dedede;
  width: 225px;
  height: 40px;
  margin-left: 40px;
  overflow: visible;
}

.select-product-wrap-v2 .plus-rent .product .content p {
  margin: 0;
  /* color: #000 !important; */
}

.select-product-wrap-v2 .plus-rent .product .content i {
  position: absolute;
  margin-left: -20px !important;
}


.select-product-wrap-v2 .plus-rent .product .content p.time-last,
.select-product-wrap-v2 .plus-rent .product .content p.time {
  margin-left: -5px !important;
}

/* .select-product-wrap-v2 .plus-rent .product .content p.time-last {
  margin-right: 10px !important;
} */

/* 有連結的到期日往左位移 */
/* .select-product-wrap-v2 .plus-rent .product.link .content p.time-last {
  margin-left: -14px !important;
} */

.select-product-wrap-v2 .plus-rent .product.link.block-hidden p.time {
  margin-top: 2px;
}

.select-product-wrap-v2 .plus-rent .product.link.block-hidden i {
  margin-top: 5px;
}

.select-product-wrap-v2 .plus-rent .block-hidden:hover {
  background-color: #eefbf2;
  cursor: pointer;
  border: #bff8dc 1px solid;
  border-radius: 5px;
  transition: .3s;
  /* padding: 8px 0; */
}

/* .select-product-wrap-v2 .plus-rent .block-hidden:hover p {
  padding-left: 10px;
} */


/* 加值模組無連結 */

.select-product-wrap-v2 .plus-rent .block-hidden.no-link .content-hover {
  display: none;
}

.select-product-wrap-v2 .plus-rent .block-hidden a.home-link {
  opacity: 0;
  width: 225px;
  height: 40px;
  top: -225px;
  left: 0;
  right: 0;
  margin: 0 auto;
  /* position: absolute !important; */
}

.select-product-wrap-v2 .plus-rent .block-hidden a.order-link {
  display: none !important;
}

.select-product-wrap-v2 .plus-rent .no-link.block-hidden:hover {
  background-color: unset;
  cursor: unset;
  border: 1px solid #fff;
  border-bottom: 1px solid #dedede;
  border-radius: 5px;
  transition: .3s;
  /* padding: 8px 0; */
}



.select-product-wrap-v2 .plus-rent .product.not-open .home-link {
  display: none !important;
}

.select-product-wrap-v2 .plus-rent .product.not-open .block-hidden:hover {
  background: unset;
  border: unset;
  cursor: default;
}


/* .select-product-wrap-v2 .select-product-box.plus .time-last:after {
  content: '\f07a';
  font-family: 'FontAwesome';
  position: absolute;
  right: -13px;
} */


/* 行業推薦 */


.select-product-wrap-v2 .industry-recommend {
  color: #808080;
  font-size: 13px;
  margin: 0 15px;
  letter-spacing: 1px;
}

.select-product-wrap-v2 .industry-recommend i {
  color: #0c8f4f;
}

.select-product-wrap-v2 .industry-recommend a {
  border-bottom: 1px dashed #0ea75c;
}


.select-product-wrap-v2 .select-product-box.plus .product .name.recommend {
  color: #0c8f4f;
  cursor: pointer;
  border: #ffffff 1px solid;
  border-radius: 5px;
  transition: .3s;
  height: 40px;
  line-height: 40px;
  margin-right: -7px;
  /* margin-bottom: -1px; */
}

.select-product-wrap-v2 .select-product-box.plus .product .name.recommend:hover {
  background-color: #eefbf2;
  cursor: pointer;
  border: #bff8dc 1px solid;
  border-radius: 5px;
  transition: .3s;
}

.select-product-wrap-v2 .select-product-box.plus .product .name.recommend:before {
  content: '\f046';
  font-family: 'FontAwesome';
  color: #0c8f4f;
  margin-left: -20px;
  margin-right: 4px;
}



/* 強調標籤樣式(沿用尚未調整) */

.select-product-wrap-v2 .red-tag {
  background: #ff6060;
  border-radius: 50px;
  padding: 3px 10px;
  color: #fff;
  font-weight: bold;
  margin-top: 3px;
  position: absolute;
  left: -16px;
  width: 120px;
  text-align: center;
}

.select-product-wrap-v2 .red-tag-under {
  background: #ff6060;
  border-radius: 50px;
  padding: 3px 10px;
  color: #fff;
  font-weight: bold;
  margin-top: 5px;
  display: inline-block;
  text-align: center;
}


.select-product-wrap-v2 .btn-submit {
  font-family: 'Noto Sans CJK TC';
  font-size: 16px;
  border: none;
  color: #0c8f4f;
  background: #ecfdf1;
  padding: 7px 25px;
  border-radius: 10px;
  letter-spacing: 1px;
  font-weight: 500;
  transition: .3s;
}

.select-product-wrap-v2 .btn-submit.contact {
  font-size: 14px;
  padding: 3px 10px;
  border-radius: 50px;
  letter-spacing: 0;
}

.select-product-wrap-v2 .btn-submit.contact.phone {
  display: none;
}

.select-product-wrap-v2 .btn-submit:hover {
  background: #e0f1e5;
  transition: .3s;
}

.select-product-wrap-v2 .btn-submit i {
  margin-left: 5px;
}


@media (max-width: 1379px) {

  .select-product-wrap-v2 .select-product-box {
    max-width: 1255px;
    width: 95%;
  }

  .select-product-wrap-v2 .center-part,
  .select-product-wrap-v2 .right-part-wrap {
    /* width: 100%; */
    max-width: unset;
    margin: 0 10px;
  }

  .select-product-wrap-v2 .center-part {
    margin-left: 0;
  }

  .select-product-wrap-v2 .right-part-wrap {
    margin-right: 0;
  }

  .select-product-wrap-v2 .select-product.right-part {
    justify-content: center;
  }


  .select-product-wrap-v2 .select-product-box.plus {
    max-height: unset;
    width: 95%;
    margin-top: 35px;
  }

}


@media (max-width: 1024px) {

  .select-product-wrap-v2 .select-product .product {
    width: 110px;
    height: 110px;
  }

}

@media (max-width: 991px) {

  .select-product-wrap-v2 {
    text-align: center;
  }

  .select-product-wrap-v2 .center-part {
    margin-left: 0;
    margin-right: 0;
    order: -2;
    margin-bottom: 20px;
    width: 100%;
    max-width: none;
  }



  .select-product-wrap-v2 .right-part-wrap {
    margin: 0;
  }


  .select-product-wrap-v2 .right-part-wrap {
    width: 100%;
    display: flex;
    justify-content: space-between;
  }

  .select-product-wrap-v2 .select-product.right-part {
    min-height: 145px !important;
    max-height: 145px;
  }

  .select-product-wrap-v2 .select-product {
    min-width: 220px;
    min-height: 300px;
  }


  .select-product-wrap-v2 .select-product-box {
    flex-wrap: wrap;
    padding-bottom: 0;
    padding-top: 20px;
  }

  .select-product-wrap-v2 .message-box.select-product-box.plus {
    margin-top: 30px;
    display: inline-block;
    text-align: left;
  }

  .select-product-wrap-v2 .right-part {
    width: 100%;
    order: -1;
    margin-bottom: 10px;
  }

  .select-product-wrap-v2 .right-part {
    width: 47%;
    justify-content: center;
  }

  .select-product-wrap-v2 .select-product-box.plus {
    max-height: unset;
    width: 95%;
    margin-top: 5px;
  }

  .select-product-wrap-v2 .select-product-box.plus .plus-rent {
    width: 100%;
  }

  .select-product-wrap-v2 .select-product-box.plus .plus-notrent {
    margin: 0 auto;
    width: 100%;
  }

  .select-product-wrap-v2 .select-product-box.plus .product-wrap {
    height: 180px;
    flex-wrap: nowrap;
    height: unset;
    flex-wrap: wrap !important;
    flex-direction: row;
  }


  .select-product-wrap-v2 .select-product-box.plus .plus-rent .product:last-child,
  .select-product-wrap-v2 .select-product-box.plus .plus-rent .product:nth-child(5),
  .select-product-wrap-v2 .select-product-box.plus .plus-rent .product:nth-child(10),
  .select-product-wrap-v2 .select-product-box.plus .plus-notrent .product:last-child,
  .select-product-wrap-v2 .select-product-box.plus .plus-notrent .product:nth-child(5),
  .select-product-wrap-v2 .select-product-box.plus .plus-notrent .product:nth-child(10) {
    border-bottom: 1px solid #dedede;
  }



}


@media (max-width: 767px) {
  .select-product-wrap-v2 .header .logo {
    margin-left: 10px;
    margin-right: 0;
  }



  .select-product-wrap-v2 .select-product {
    text-align: left;
    padding: 30px 30px 10px;
  }

  .select-product-wrap-v2 .select-product .product {
    margin: 5px 10px !important;
    /* margin-bottom: 10px !important; */
    /* width: 33%; */
    padding: 8px;
    height: 100px;
  }

  .select-product-wrap-v2 .select-product.right-part .product {
    margin: 0 auto !important;
  }

  .select-product-wrap-v2 .select-product .product .name {
    font-size: 14px;
    margin-top: 4px;
    letter-spacing: 0;
    white-space: nowrap;
  }

  .select-product-wrap-v2 .select-product .product .time {
    font-size: 11px;
  }



}

@media (max-width: 540px) {
  .select-product-wrap-v2 .select-product-box.plus .title {
    white-space: unset;
    flex-wrap: wrap;
    margin: 30px 20px 10px;
  }

  .select-product-wrap-v2 .select-product-box.plus .plus-rent .title {
    margin-top: 0;
  }

  .select-product-wrap-v2 .industry-recommend {
    margin: 10px 0 0;
  }

  .select-product-wrap-v2 .btn-submit.contact.phone {
    display: inline-block;
    margin-left: 20px;
  }

  .select-product-wrap-v2 .btn-submit.contact.web {
    display: none;
  }

}

@media (max-width: 450px) {


  .select-product-wrap-v2 {
    text-align: center;
  }

  .select-product-wrap-v2 .select-product {
    padding: 30px 10px 10px;
    justify-content: space-around;
  }

  .select-product-wrap-v2 .select-product .product {
    width: unset !important;
  }

  /* .select-product-wrap-v2 .select-product.center-part a.empty {
    display: inline-block;
  } */

  .select-product-wrap-v2 .select-product.center-part a {
    width: 30% !important;
  }




  .select-product-wrap-v2 .select-product .product .name {
    font-size: 16px !important;
  }


  .select-product-wrap-v2 .right-part-wrap {
    flex-direction: column;
  }

  .select-product-wrap-v2 .right-part-wrap {
    display: flex;
    flex-flow: nowrap;
  }

  .select-product-wrap-v2 .select-product.right-part {
    width: 46% !important;
    min-width: unset;
    min-height: 150px !important;
    margin-bottom: 15px;
  }


  .select-product-wrap-v2 .select-product-box.plus {
    padding: 18px 10px !important;
  }


  .select-product-wrap-v2 .select-product-box.plus .title {
    width: unset;
    text-align: left;
    margin: 40px 20px 0 20px;
  }

  .red-tag-under {
    white-space: nowrap;
    margin-left: -4px;
  }

  .select-product-wrap-v2 .select-product-box.plus .product .name {
    font-size: 15px;
    /* width: 133px !important; */
  }


  .select-product-wrap-v2 .select-product-box.plus .plus-notrent .product {
    width: 140px !important;
    margin-left: 20px !important;
  }



}



/* 使用人數 */
.select-product-wrap-v2 .select-product .member {
  position: absolute;
  top: 0;
  right: 0;
  background: hsl(132.89deg 89% 52% / 8%);
  border-radius: 0 5px 0 5px;
  padding: 4px 12px;
  color: #0c8f4f;
  display: inline-block;
  vertical-align: top;
}

.select-product-wrap-v2 .select-product .member i {
  font-size: 14px;
  line-height: 1;
  position: relative;
  top: 0px;
}

.select-product-wrap-v2 .select-product .member .people {
  /* padding-right: 4px; */
  font-size: 14px;
  /* font-weight: bold; */
  position: relative;
  display: inline-block;
  vertical-align: top;
  font-family: 'Noto Sans CJK TC';
}


.select-product-wrap-v2 .select-product .member .date {
  padding-left: 2px;
  font-size: 12px;
  padding-top: 3px;
  display: inline-block;
  vertical-align: top;
}

.select-product-wrap-v2 .select-product .product {
  margin: 5px 20px;
  text-align: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 110px;
  height: 110px;
  color: #fff;
  transition: .3s;
}


.select-product-wrap-v2 .select-product .product a {
  position: relative;
  display: block;
}

.select-product-wrap-v2 .select-product .product .label {
  position: absolute;
  right: 5px;
  top: 10px;
  z-index: 9;
  padding: 5px;
  border-radius: 20px;
}

.select-product-wrap-v2 .select-product .product .label-new {
  background: #ff6060;
  font-weight: bold;
  font-family: Arial;
}

.select-product-wrap-v2 .select-product a .product:not(.not-open):hover {
  background-color: #eefbf2;
  cursor: pointer;
  border: #bff8dc 1px solid;
  border-radius: 5px;
  transition: .3s;
}

.select-product-wrap-v2 .select-product .product .name {
  font-size: 17px;
  color: #000;
  margin: 3px 0;
  font-family: 'Noto Sans CJK TC';
}

.select-product-wrap-v2 .select-product .product .time {
  font-size: 12px;
  margin: 0;
  font-family: Helvetica;
  color: #09693a;
  height: 17px;
}

.select-product-wrap-v2 .select-product .product .time-last {
  font-size: 13px;
  margin: 0;
  font-family: Helvetica;
  color: #ff5454;
  height: 17px;
}

.select-product-wrap-v2 .select-product .not-open {
  opacity: .3;
}

.select-product-wrap-v2 .select-product .not-open a {
  cursor: default;
}


/* 手機版dropdown樣式 */

.select-product-wrap-v2 .dropdown-product-list {
  padding: 0;
  width: unset;
  letter-spacing: 0;
  text-align-last: auto;
}

.select-product-wrap-v2 .dropdown-menu.dropdown-light {
  max-width: unset;
  border: 0;
  border-radius: 10px;
}

.select-product-wrap-v2 .app-group .dropdown-menu .title {
  padding: 0;
  color: #2d86de;
  font-size: 20px;
  font-family: 'Noto Sans CJK TC';
  font-weight: 500;
}

.select-product-wrap-v2 .dropdown-menu .crm .title {
  color: #25a6b4;
}

.select-product-wrap-v2 .dropdown-menu p {
  color: #575757;
  white-space: nowrap;
  margin: 0 0 20px;
}

.select-product-wrap-v2 .dropdown-menu.dropdown-light:after {
  border-bottom-color: #e5fcff;
}

.select-product-wrap-v2 .dropdown-menu.dropdown-light:before {
  border: none;
}

.select-product-wrap-v2 .APP-QR {
  text-align: center;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  display: flex;
  position: relative;
}

.select-product-wrap-v2 .APP-QR .QR {
  display: flex;
  background: #e5f2ff;
  flex-direction: column;
  padding: 30px;
  border-radius: 10px 0 0 10px;
}

.select-product-wrap-v2 .APP-QR .QR.crm {
  background: #e5fcff;
  border-radius: 0 10px 10px 0;
}


.select-product-wrap-v2 .APP-QR img {
  display: inline-block;
}


.select-product-wrap-v2 .APP-QR .app-advantage {
  height: 66px;
}

.select-product-wrap-v2 .dropdown-product-list a.app.phone {
  display: none;
}

.select-product-wrap-v2 .btn-part {
  letter-spacing: -5px;
  position: fixed;
  width: 100%;
  height: 46px;
  bottom: 0;
}

.select-product-wrap-v2 .btn-download {
  display: inline-block;
  width: 50%;
  height: 100%;
  font-size: 16px;
  line-height: 46px;
  font-weight: bold;
  letter-spacing: 1px;
  position: relative;
  border-radius: 0;
  vertical-align: middle;
  color: #fff;
  border: none;
  padding: 0;
  background: #0b97fd;
  background: -webkit-linear-gradient(45deg, #0b97fd 72%, #47e3f0 100%);
  background: linear-gradient(45deg, #0b97fd 72%, #47e3f0 100%);
}

.select-product-wrap-v2 .btn-download i {
  font-size: 100%;
  margin-left: 6px;
}

@media (max-width: 350px) {
  .select-product-wrap-v2 .btn-download i {
    display: none;
  }
}

@media (min-width: 1380px) {
  .select-product-wrap-v2 .center-part {
    max-width: 1060px;
    /* min-width: 1018px; */
  }



  .select-product-wrap-v2 .APP-QR .app-advantage {
    height: auto;
  }
}

@media (max-width: 450px) {

  .select-product-wrap-v2 .header .dropdown-menu.pull-right {
    right: 0;
  }

  .select-product-wrap-v2 .APP-QR .app.web {
    display: none;
  }

  .select-product-wrap-v2 .dropdown-product-list a.app.phone {
    display: block;
    margin: 0 auto;
    height: 30px !important;
    background: #2d86de;
    border-radius: 5px;
    color: #fff;
    font-weight: bold;
  }

  .select-product-wrap-v2 .dropdown-product-list .crm a.app.phone {
    background: #25a6b4;
  }

  .dropdown-menu.dropdown-light.pull-right:after {
    right: 67px;
  }

  .dropdown-menu.dropdown-light.pull-right:before {
    right: 66px;
  }

  .select-product-wrap-v2 .block.link a.home-link p {
    opacity: 1;
  }

  .select-product-wrap-v2 .block-hidden.link a.home-link p {
    opacity: 0;
  }

  .select-product-wrap-v2 .select-product-box.plus .plus-notrent .product-wrap {
    margin-left: 20px;
    margin-top: 20px;
  }

}

/* 主題顏色 */

[data-theme='blue'] .select-product-wrap-v2 .btn-submit.contact:hover {
  background: #deecff
}

[data-theme='blue'] .select-product-wrap-v2 .header .btn-box,
[data-theme='blue'] .select-product-wrap-v2 .select-product-box.plus .time,
[data-theme='blue'] .select-product-wrap-v2 .select-product .product .time,
[data-theme='blue'] .select-product-wrap-v2 .select-product-box.plus .title,
[data-theme='blue'] .select-product-wrap-v2 .message-box.select-product-box.plus span,
[data-theme='blue'] .select-product-wrap-v2 .plus-rent .block .content-hover a,
[data-theme='blue'] .select-product-wrap-v2 .center-part .block .content-hover a,
[data-theme='blue'] .select-product-wrap-v2.survey .messageText span,
[data-theme='blue'] .select-product-wrap-v2.survey .solution-title,
[data-theme='blue'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend,
[data-theme='blue'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:before {
  color: #0867b3
}

[data-theme='blue'] .select-product-wrap-v2 .header .btn-box {
  background-color: #0867b3
}

[data-theme='blue'] .select-product-wrap-v2 .header,
[data-theme='blue'] .select-product-wrap-v2.survey .header {
  background-color: #0a7eda
}

[data-theme='blue'] .select-product-wrap-v2 .message-box a,
[data-theme='blue'] .select-product-wrap-v2 .industry-recommend a {
  color: #0a7eda
}

[data-theme='blue'] .select-product-wrap-v2 .message-box {
  background: #e9f1ff !important;
  background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgb(233 241 255) 100%) !important
}

[data-theme='blue'] .select-product-wrap-v2 .plus-rent .product-wrap a.link:hover {
  background-color: #ebf2ff
}

[data-theme='blue'] .select-product-wrap-v2 .select-product .member,
[data-theme='blue'] .select-product-wrap-v2 .btn-submit {
  background-color: #e9f0ff;
  color: #0a7eda
}

[data-theme='blue'] .select-product-wrap-v2 .select-product a .product:not(.not-open):hover,
[data-theme='blue'] .select-product-wrap-v2 .center-part .block-hidden:hover,
[data-theme='blue'] .select-product-wrap-v2 .plus-rent .link:hover,
[data-theme='blue'] .select-product-wrap-v2 .center-part .block .content-hover,
[data-theme='blue'] .select-product-wrap-v2 .plus-rent .block .content-hover,
[data-theme='blue'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:hover {
  background-color: #ebf2ff;
  border: #a4d7ff 1px solid
}

[data-theme='blue'] .select-product-wrap-v2 .select-product-box i.product-icon,
[data-theme='blue'] .select-product-wrap-v2 .industry-recommend i {
  color: #0a7eda;
  /* background: linear-gradient(45deg, rgb(32 114 180) 0%, rgb(25 153 255) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent */
}

[data-theme='blue'] .select-product-wrap-v2 .select-product-box.plus .link i {
  color: #0a7eda
}

[data-theme='blue'] .select-product-wrap-v2 {
  background: rgb(233 241 255);
  background: linear-gradient(0deg, rgb(233 241 255) 0%, rgba(255, 255, 255, 1) 100%)
}

[data-theme='blue2'] .select-product-wrap-v2 .header .btn-box,
[data-theme='blue2'] .select-product-wrap-v2 .select-product-box.plus .time,
[data-theme='blue2'] .select-product-wrap-v2 .select-product .product .time,
[data-theme='blue2'] .select-product-wrap-v2 .select-product-box.plus .title,
[data-theme='blue2'] .select-product-wrap-v2 .message-box.select-product-box.plus span,
[data-theme='blue2'] .select-product-wrap-v2 .plus-rent .block .content-hover a,
[data-theme='blue2'] .select-product-wrap-v2 .center-part .block .content-hover a,
[data-theme='blue2'] .select-product-wrap-v2.survey .messageText span,
[data-theme='blue2'] .select-product-wrap-v2.survey .solution-title,
[data-theme='blue2'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend,
[data-theme='blue2'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:before {
  color: #25358c
}

[data-theme='blue2'] .select-product-wrap-v2 .header .btn-box {
  background-color: #25358c
}

[data-theme='blue2'] .select-product-wrap-v2 .header,
[data-theme='blue2'] .select-product-wrap-v2.survey .header {
  background-color: #2d41ac
}

[data-theme='blue2'] .select-product-wrap-v2 .message-box a,
[data-theme='blue2'] .select-product-wrap-v2 .industry-recommend a {
  color: #2d41ac
}

[data-theme='blue2'] .select-product-wrap-v2 .message-box {
  background: #ebf1ff !important;
  background: linear-gradient(180deg, rgb(236 238 253) 0%, rgba(255, 255, 255, 1) 100%) !important;
}

[data-theme='blue2'] .select-product-wrap-v2 .plus-rent .product-wrap a.link:hover {
  background-color: #eef3fb
}

[data-theme='blue2'] .select-product-wrap-v2 .select-product .member,
[data-theme='blue2'] .select-product-wrap-v2 .btn-submit {
  background-color: #ebedff;
  color: #2d41ac
}

[data-theme='blue2'] .select-product-wrap-v2 .btn-submit:hover {
  background: #e2e5ff;
}

[data-theme='blue2'] .select-product-wrap-v2 .select-product a .product:not(.not-open):hover,
[data-theme='blue2'] .select-product-wrap-v2 .center-part .block-hidden:hover,
[data-theme='blue2'] .select-product-wrap-v2 .plus-rent .link:hover,
[data-theme='blue2'] .select-product-wrap-v2 .center-part .block .content-hover,
[data-theme='blue2'] .select-product-wrap-v2 .plus-rent .block .content-hover,
[data-theme='blue2'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:hover {
  background-color: #eef3fb;
  border: #bfd5f8 1px solid
}

[data-theme='blue2'] .select-product-wrap-v2 .select-product-box i.product-icon {
  color: #2d41ac;
  /* background: linear-gradient(45deg, rgb(45 65 172) 0%, rgb(129 149 255) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent */
}

[data-theme='blue2'] .select-product-wrap-v2 .select-product-box.plus .link i,
[data-theme='blue2'] .select-product-wrap-v2 .industry-recommend i {
  color: #2d41ac
}

[data-theme='blue2'] .select-product-wrap-v2 {
  background: rgb(238 240 253);
  background: linear-gradient(0deg, rgb(228 230 247) 0%, rgba(255, 255, 255, 1) 100%)
}

[data-theme='gray'] .select-product-wrap-v2 .header .btn-box,
[data-theme='gray'] .select-product-wrap-v2 .select-product-box.plus .time,
[data-theme='gray'] .select-product-wrap-v2 .select-product .product .time,
[data-theme='gray'] .select-product-wrap-v2 .select-product-box.plus .title,
[data-theme='gray'] .select-product-wrap-v2 .message-box.select-product-box.plus span,
[data-theme='gray'] .select-product-wrap-v2 .plus-rent .block .content-hover a,
[data-theme='gray'] .select-product-wrap-v2 .center-part .block .content-hover a,
[data-theme='gray'] .select-product-wrap-v2.survey .messageText span,
[data-theme='gray'] .select-product-wrap-v2.survey .solution-title,
[data-theme='gray'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend,
[data-theme='gray'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:before {
  color: #4f6773
}

[data-theme='gray'] .select-product-wrap-v2 .header .btn-box {
  background-color: #4f6773
}

[data-theme='gray'] .select-product-wrap-v2 .header,
[data-theme='gray'] .select-product-wrap-v2.survey .header {
  background-color: #607d8b
}

[data-theme='gray'] .select-product-wrap-v2 .message-box a,
[data-theme='gray'] .select-product-wrap-v2 .industry-recommend a {
  color: #607d8b
}

[data-theme='gray'] .select-product-wrap-v2 .message-box {
  background: #f5f5f5 !important;
  background: linear-gradient(180deg, rgb(235 235 235) 0%, rgba(255, 255, 255, 1) 100%) !important
}

[data-theme='gray'] .select-product-wrap-v2 .plus-rent .product-wrap a.link:hover {
  background-color: #f5f5f5
}

[data-theme='gray'] .select-product-wrap-v2 .select-product .member,
[data-theme='gray'] .select-product-wrap-v2 .btn-submit {
  background-color: #efefef;
  color: #4f6773;
}

[data-theme='gray'] .select-product-wrap-v2 .btn-submit:hover {
  background-color: #e2e2e2;
}

[data-theme='gray'] .select-product-wrap-v2 .select-product a .product:not(.not-open):hover,
[data-theme='gray'] .select-product-wrap-v2 .center-part .block-hidden:hover,
[data-theme='gray'] .select-product-wrap-v2 .plus-rent .link:hover,
[data-theme='gray'] .select-product-wrap-v2 .center-part .block .content-hover,
[data-theme='gray'] .select-product-wrap-v2 .plus-rent .block .content-hover,
[data-theme='gray'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:hover {
  background-color: #f5f5f5;
  border: #d0d7db 1px solid
}

[data-theme='gray'] .select-product-wrap-v2 .select-product-box i.product-icon {
  color: #607d8b;
  /* background: linear-gradient(45deg, rgb(79 103 115) 0%, rgb(131 158 170) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent; */
}

[data-theme='gray'] .select-product-wrap-v2 .select-product-box.plus .link i,
[data-theme='gray'] .select-product-wrap-v2 .industry-recommend i {
  color: #607d8b
}

[data-theme='gray'] .select-product-wrap-v2 {
  background: rgb(242 242 242);
  background: linear-gradient(0deg, rgb(238 238 238) 0%, rgba(255, 255, 255, 1) 100%)
}

[data-theme='green'] .select-product-wrap-v2 .header .btn-box,
[data-theme='green'] .select-product-wrap-v2 .select-product-box.plus .time,
[data-theme='green'] .select-product-wrap-v2 .select-product .product .time,
[data-theme='green'] .select-product-wrap-v2 .select-product-box.plus .title,
[data-theme='green'] .select-product-wrap-v2 .message-box.select-product-box.plus span,
[data-theme='green'] .select-product-wrap-v2 .plus-rent .block .content-hover a,
[data-theme='green'] .select-product-wrap-v2 .center-part .block .content-hover a,
[data-theme='green'] .select-product-wrap-v2.survey .messageText span,
[data-theme='green'] .select-product-wrap-v2.survey .solution-title,
[data-theme='green'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend,
[data-theme='green'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:before {
  color: #1f8e85
}

[data-theme='green'] .select-product-wrap-v2 .header .btn-box {
  background-color: #1f8e85
}

[data-theme='green'] .select-product-wrap-v2 .header,
[data-theme='green'] .select-product-wrap-v2.survey .header {
  background-color: #26b0a4
}

[data-theme='green'] .select-product-wrap-v2 .message-box a,
[data-theme='green'] .select-product-wrap-v2 .industry-recommend a {
  color: #26b0a4
}

[data-theme='green'] .select-product-wrap-v2 .plus-rent .product-wrap a.link:hover {
  background-color: #eefffd
}

[data-theme='green'] .select-product-wrap-v2 .select-product .member,
[data-theme='green'] .select-product-wrap-v2 .btn-submit {
  background-color: #edfffd;
  color: #1f8e85;
}

[data-theme='green'] .select-product-wrap-v2 .btn-submit:hover {
  background: #ddefed;
}

[data-theme='green'] .select-product-wrap-v2 .select-product a .product:not(.not-open):hover,
[data-theme='green'] .select-product-wrap-v2 .center-part .block-hidden:hover,
[data-theme='green'] .select-product-wrap-v2 .plus-rent .link:hover,
[data-theme='green'] .select-product-wrap-v2 .center-part .block .content-hover,
[data-theme='green'] .select-product-wrap-v2 .plus-rent .block .content-hover,
[data-theme='green'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:hover {
  background-color: #eefffd;
  border: #a9d2ce 1px solid
}

[data-theme='green'] .select-product-wrap-v2 .select-product-box i.product-icon {
  color: #26b0a4;
  /* background: linear-gradient(45deg, rgb(31 145 135) 0%, rgb(54 210 196) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent */
}

[data-theme='green'] .select-product-wrap-v2 .select-product-box.plus .link i,
[data-theme='green'] .select-product-wrap-v2 .industry-recommend i {
  color: #26b0a4
}

[data-theme='green'] .select-product-wrap-v2 {
  background: rgb(206 255 251);
  background: linear-gradient(0deg, rgb(232 250 254) 0%, rgba(255, 255, 255, 1) 100%)
}

[data-theme='green'] .select-product-wrap-v2 .message-box {
  background: #e5fdf2 !important;
  background: linear-gradient(180deg, rgb(236 253 249) 0%, rgba(255, 255, 255, 1) 100%) !important;
}


[data-theme='orange'] .select-product-wrap-v2 .btn-submit:hover {
  background-color: #ffe3d1
}

[data-theme='orange'] .select-product-wrap-v2 .header .btn-box,
[data-theme='orange'] .select-product-wrap-v2 .select-product-box.plus .time,
[data-theme='orange'] .select-product-wrap-v2 .select-product .product .time,
[data-theme='orange'] .select-product-wrap-v2 .select-product-box.plus .title,
[data-theme='orange'] .select-product-wrap-v2 .message-box.select-product-box.plus span,
[data-theme='orange'] .select-product-wrap-v2 .plus-rent .block .content-hover a,
[data-theme='orange'] .select-product-wrap-v2 .center-part .block .content-hover a,
[data-theme='orange'] .select-product-wrap-v2.survey .messageText span,
[data-theme='orange'] .select-product-wrap-v2.survey .solution-title,
[data-theme='orange'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend,
[data-theme='orange'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:before {
  color: #d64c00
}

[data-theme='orange'] .select-product-wrap-v2 .header .btn-box {
  background-color: #d64c00
}

[data-theme='orange'] .select-product-wrap-v2 .header,
[data-theme='orange'] .select-product-wrap-v2.survey .header {
  background-color: #ff5a00
}

[data-theme='orange'] .select-product-wrap-v2 .message-box a,
[data-theme='orange'] .select-product-wrap-v2 .industry-recommend a {
  color: #ff5a00
}

[data-theme='orange'] .select-product-wrap-v2 .message-box {
  background: #fff1e9 !important;
  background: linear-gradient(180deg, rgb(255 241 233) 0%, rgba(255, 255, 255, 1) 100%) !important
}

[data-theme='orange'] .select-product-wrap-v2 .plus-rent .product-wrap a.link:hover {
  background-color: #fff1e9
}

[data-theme='orange'] .select-product-wrap-v2 .select-product .member,
[data-theme='orange'] .select-product-wrap-v2 .btn-submit {
  background-color: #fff1e8;
  color: #ff5a00
}

[data-theme='orange'] .select-product-wrap-v2 .select-product a .product:not(.not-open):hover,
[data-theme='orange'] .select-product-wrap-v2 .center-part .block-hidden:hover,
[data-theme='orange'] .select-product-wrap-v2 .plus-rent .link:hover,
[data-theme='orange'] .select-product-wrap-v2 .center-part .block .content-hover,
[data-theme='orange'] .select-product-wrap-v2 .plus-rent .block .content-hover,
[data-theme='orange'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:hover {
  background-color: #fff1e9;
  border: #ffd8c2 1px solid
}

[data-theme='orange'] .select-product-wrap-v2 .select-product-box i.product-icon {
  color: #ff5a00;
  /* background: linear-gradient(45deg, rgb(214 76 0) 0%, rgb(255 146 86) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent */
}

[data-theme='orange'] .select-product-wrap-v2 .select-product-box.plus .link i,
[data-theme='orange'] .select-product-wrap-v2 .industry-recommend i {
  color: #ff5a00
}

[data-theme='orange'] .select-product-wrap-v2 {
  background: rgb(255 246 240);
  background: linear-gradient(0deg, rgb(251 238 230) 0%, rgba(255, 255, 255, 1) 100%)
}

[data-theme='purple'] .select-product-wrap-v2 .header .btn-box,
[data-theme='purple'] .select-product-wrap-v2 .select-product-box.plus .time,
[data-theme='purple'] .select-product-wrap-v2 .select-product .product .time,
[data-theme='purple'] .select-product-wrap-v2 .select-product-box.plus .title,
[data-theme='purple'] .select-product-wrap-v2 .message-box.select-product-box.plus span,
[data-theme='purple'] .select-product-wrap-v2 .plus-rent .block .content-hover a,
[data-theme='purple'] .select-product-wrap-v2 .center-part .block .content-hover a,
[data-theme='purple'] .select-product-wrap-v2.survey .messageText span,
[data-theme='purple'] .select-product-wrap-v2.survey .solution-title,
[data-theme='purple'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend,
[data-theme='purple'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:before {
  color: #85379f
}

[data-theme='purple'] .select-product-wrap-v2 .header .btn-box {
  background-color: #85379f
}

[data-theme='purple'] .select-product-wrap-v2 .header,
[data-theme='purple'] .select-product-wrap-v2.survey .header {
  background-color: #9f41bd
}

[data-theme='purple'] .select-product-wrap-v2 .message-box a,
[data-theme='purple'] .select-product-wrap-v2 .industry-recommend a {
  color: #9f41bd
}

[data-theme='purple'] .select-product-wrap-v2 .message-box {
  background: #f8eefc !important;
  background: linear-gradient(180deg, rgb(248 236 253) 0%, rgba(255, 255, 255, 1) 100%) !important
}

[data-theme='purple'] .select-product-wrap-v2 .plus-rent .product-wrap a.link:hover {
  background-color: #fbf3ff
}

[data-theme='purple'] .select-product-wrap-v2 .select-product .member,
[data-theme='purple'] .select-product-wrap-v2 .btn-submit {
  background-color: #fbeeff;
  color: #85379f;
}

[data-theme='purple'] .select-product-wrap-v2 .btn-submit:hover {
  background-color: #f8e2ff;
}

[data-theme='purple'] .select-product-wrap-v2 .select-product a .product:not(.not-open):hover,
[data-theme='purple'] .select-product-wrap-v2 .center-part .block-hidden:hover,
[data-theme='purple'] .select-product-wrap-v2 .plus-rent .link:hover,
[data-theme='purple'] .select-product-wrap-v2 .center-part .block .content-hover,
[data-theme='purple'] .select-product-wrap-v2 .plus-rent .block .content-hover,
[data-theme='purple'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:hover {
  background-color: #fbf3ff;
  border: #ecd4f4 1px solid
}

[data-theme='purple'] .select-product-wrap-v2 .select-product-box i.product-icon {
  color: #9f41bd;
  /* background: linear-gradient(45deg, rgb(133 55 159) 0%, rgb(217 108 254) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent; */
}

[data-theme='purple'] .select-product-wrap-v2 .select-product-box.plus .link i,
[data-theme='purple'] .select-product-wrap-v2 .industry-recommend i {
  color: #9f41bd
}

[data-theme='purple'] .select-product-wrap-v2 {
  background: rgb(253 247 253);
  background: linear-gradient(0deg, rgb(250 239 255) 0%, rgba(255, 255, 255, 1) 100%)
}

[data-theme='red'] .select-product-wrap-v2 .header .btn-box,
[data-theme='red'] .select-product-wrap-v2 .select-product-box.plus .time,
[data-theme='red'] .select-product-wrap-v2 .select-product .product .time,
[data-theme='red'] .select-product-wrap-v2 .select-product-box.plus .title,
[data-theme='red'] .select-product-wrap-v2 .message-box.select-product-box.plus span,
[data-theme='red'] .select-product-wrap-v2 .plus-rent .block .content-hover a,
[data-theme='red'] .select-product-wrap-v2 .center-part .block .content-hover a,
[data-theme='red'] .select-product-wrap-v2.survey .messageText span,
[data-theme='red'] .select-product-wrap-v2.survey .solution-title,
[data-theme='red'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend,
[data-theme='red'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:before {
  color: #ff3b37
}

[data-theme='red'] .select-product-wrap-v2 .header .btn-box {
  background-color: #ff3b37
}

[data-theme='red'] .select-product-wrap-v2 .header,
[data-theme='red'] .select-product-wrap-v2.survey .header {
  background-color: #ff6360
}

[data-theme='red'] .select-product-wrap-v2 .message-box a,
[data-theme='red'] .select-product-wrap-v2 .industry-recommend a {
  color: #ff6360
}

[data-theme='red'] .select-product-wrap-v2 .message-box {
  background: #fff2f2 !important;
  background: linear-gradient(180deg, rgb(255 243 243) 0%, rgba(255, 255, 255, 1) 100%) !important;
}

[data-theme='red'] .select-product-wrap-v2 .plus-rent .product-wrap a.link:hover {
  background-color: #fff3f3
}

[data-theme='red'] .select-product-wrap-v2 .select-product .member,
[data-theme='red'] .select-product-wrap-v2 .btn-submit {
  background: #ffeeee;
  color: #ff6360;
}

[data-theme='red'] .select-product-wrap-v2 .btn-submit:hover {
  background: #fcdcdc;
}

[data-theme='red'] .select-product-wrap-v2 .select-product a .product:not(.not-open):hover,
[data-theme='red'] .select-product-wrap-v2 .center-part .block-hidden:hover,
[data-theme='red'] .select-product-wrap-v2 .plus-rent .link:hover,
[data-theme='red'] .select-product-wrap-v2 .center-part .block .content-hover,
[data-theme='red'] .select-product-wrap-v2 .plus-rent .block .content-hover,
[data-theme='red'] .select-product-wrap-v2 .select-product-box.plus .product .name.recommend:hover {
  background-color: #fff3f3;
  border: #ffbebd 1px solid
}

[data-theme='red'] .select-product-wrap-v2 .select-product-box i.product-icon {
  color: #ff6360;
  /* background: linear-gradient(45deg, rgb(255 99 96) 0%, rgb(255 135 133) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent; */
}

[data-theme='red'] .select-product-wrap-v2 .select-product-box.plus .link i,
[data-theme='red'] .select-product-wrap-v2 .industry-recommend i {
  color: #ff6360
}

[data-theme='red'] .select-product-wrap-v2 {
  background: rgb(255 244 244);
  background: linear-gradient(0deg, rgb(255 243 243) 0%, rgba(255, 255, 255, 1) 100%)
}

[data-theme='red'] .select-product-wrap-v2 .select-product .product .time-last {
  font-weight: bold;
}

[data-theme='blue'] .select-product-wrap-v2 .industry-recommend a {
  border-bottom: 1px dashed #0a7eda;
}

[data-theme='blue'] .solution-title img {
  filter: hue-rotate(75deg) !important;
}

[data-theme='orange'] .select-product-wrap-v2 .industry-recommend a {
  border-bottom: 1px dashed #ff5a00;
}

[data-theme='orange'] .solution-title img {
  filter: hue-rotate(224deg) !important;
}

[data-theme='green'] .select-product-wrap-v2 .industry-recommend a {
  border-bottom: 1px dashed #26b0a4;
}

[data-theme='green'] .solution-title img {
  filter: hue-rotate(35deg) !important;
}

[data-theme='red'] .select-product-wrap-v2 .industry-recommend a {
  border-bottom: 1px dashed #ff6360;
}

[data-theme='red'] .solution-title img {
  filter: hue-rotate(210deg) !important;
}

[data-theme='gray'] .select-product-wrap-v2 .industry-recommend a {
  border-bottom: 1px dashed #607d8b;
}

[data-theme='gray'] .solution-title img {
  filter: hue-rotate(67deg) grayscale(.5) !important;
}

[data-theme='blue2'] .select-product-wrap-v2 .industry-recommend a {
  border-bottom: 1px dashed #2d41ac;
}

[data-theme='blue2'] .solution-title img {
  filter: hue-rotate(85deg) contrast(120%) !important;
}

[data-theme='purple'] .select-product-wrap-v2 .industry-recommend a {
  border-bottom: 1px dashed #9f41bd;
}

[data-theme='purple'] .solution-title img {
  filter: hue-rotate(141deg) contrast(120%) !important;
}

/* ---------------------------------------------------------------------- */
/*  select-product
/* ---------------------------------------------------------------------- */
.select-product-wrap {
  position: relative;
  overflow: visible;
  padding: 7% 0 0px;
  min-height: 100vh;
  background: url("https://a1cdnpoint2.azureedge.net/images/select-product_bg.png") no-repeat bottom center fixed, linear-gradient(to bottom, #ffffff 55%, #ffffff 55%, #d7f2f1 100%);
}

@media (max-width: 1367px) {
  .select-product-wrap {
    padding-top: 30px;
  }
}

@media (max-width: 767px) {
  .select-product-wrap {
    padding-top: 40px;
    background: #fff;
    padding-bottom: 0;
  }
}

.select-product-wrap .logo {
  width: 90%;
  margin: 0 auto;
  text-align: center;
}

.select-product-wrap .logo img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 767px) {
  .select-product-wrap .logo {
    margin-top: 40px;
    max-width: 260px;
  }
}

.select-product-wrap .header {
  position: absolute;
  right: 5px;
  top: 0px;
}

.select-product-wrap .header .member {
  background: #b3b3b3;
  border-radius: 6px;
  padding: 3px 8px;
  color: #fff;
  display: inline-block;
  vertical-align: top;
  margin-top: 6px;
  margin-right: 10px;
}

.select-product-wrap .header .member i {
  font-size: 20px;
  line-height: 1;
  position: relative;
  top: 2px;
}

.select-product-wrap .header .member .people {
  padding-right: 6px;
  font-size: 16px;
  font-weight: bold;
  position: relative;
  vertical-align: middle;
}

.select-product-wrap .header .member .people:before,
.select-product-wrap .header .member .people:after {
  content: "";
  position: absolute;
  width: 1px;
  height: 90%;
  top: 5%;
}

.select-product-wrap .header .member .people:before {
  background-color: gray;
  right: 0;
}

.select-product-wrap .header .member .people:after {
  background-color: #cccccc;
  right: -1px;
}

.select-product-wrap .header .member .date {
  padding-left: 6px;
  font-size: 13px;
}

.select-product-wrap .header .sign-out-btn {
  color: #b3b3b3;
  display: inline-block;
  vertical-align: top;
  font-size: 28px;
}

.select-product-wrap .header .sign-out-btn:hover {
  color: #999999;
}

.select-product-wrap .sign-out {
  position: absolute;
  right: 5px;
  top: 0px;
  color: #b3b3b3;
  font-size: 28px;
}

.select-product-wrap .sign-out:hover {
  color: #999999;
}

.select-product-wrap .alert {
  letter-spacing: 1px;
  max-width: 460px;
  font-size: 13.6px;
  margin-left: auto;
  margin-right: auto;
}

.select-product-wrap .select-product {
  letter-spacing: -5px;
  text-align: center;
  padding-top: 4vh;
  width: 90%;
  max-width: 1020px;
  margin: 0 auto;
}

@media (min-width: 767px) and (max-width: 1367px) {
  .select-product-wrap .select-product {
    padding-top: 26px;
  }
}

@media (max-width: 991px) {
  .select-product-wrap .select-product {
    text-align: left;
  }
}

@media (max-width: 767px) {
  .select-product-wrap .select-product {
    padding-top: 30px;
    padding-bottom: 46px;
  }
}

.select-product-wrap .select-product .product {
  display: inline-block;
  letter-spacing: 1px;
  vertical-align: top;
  margin: 30px;
  text-align: center;
}

.select-product-wrap .select-product .product img {
  width: 110px;
  height: auto;
}

@media (min-width: 1031px) and (max-width: 1330px) {
  .select-product-wrap .select-product .product {
    margin: 22px;
  }
}

@media (min-width: 767px) and (max-width: 1030px) {
  .select-product-wrap .select-product .product {
    margin: 15px;
  }

  .select-product-wrap .select-product .product img {
    width: 90px;
  }
}

.select-product-wrap .select-product .product:not(.not-open) img {
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -moz-border-radius: 18px;
  -webkit-border-radius: 18px;
  border-radius: 18px;
  -moz-box-shadow: 0 0px 0px 0px transparent;
  -webkit-box-shadow: 0 0px 0px 0px transparent;
  box-shadow: 0 0px 0px 0px transparent;
}

.select-product-wrap .select-product .product:not(.not-open) img:hover {
  -moz-box-shadow: 0 3px 6px 3px rgba(0, 0, 0, 0.18);
  -webkit-box-shadow: 0 3px 6px 3px rgba(0, 0, 0, 0.18);
  box-shadow: 0 3px 6px 3px rgba(0, 0, 0, 0.18);
}

.select-product-wrap .select-product .product .name {
  font-size: 16px;
  margin: 0;
  margin-top: 12px;
  font-weight: 600;
}

.select-product-wrap .select-product .product .time {
  font-size: 12px;
  margin: 0;
  font-family: Helvetica;
}

.select-product-wrap .select-product .not-open {
  opacity: .5;
}

.select-product-wrap .select-product .not-open a {
  cursor: default;
}

@media (max-width: 767px) {
  .select-product-wrap .select-product {
    text-align: left;
  }

  .select-product-wrap .select-product .product {
    margin: 0 !important;
    margin-bottom: 20px !important;
    width: 33%;
  }

  .select-product-wrap .select-product .product img {
    width: 80px;
  }

  .select-product-wrap .select-product .product .name {
    font-size: 15px;
    margin-top: 5px;
  }

  .select-product-wrap .select-product .product .time {
    font-size: 11px;
  }
}

.select-product-wrap .QR-code {
  text-align: center;
  width: 160px;
  position: relative;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
  background: #fff;
  padding: 20px 6px 8px;
}

@media (min-width: 1367px) {
  .select-product-wrap .QR-code {
    margin-top: 3%;
  }
}

.select-product-wrap .QR-code h3 {
  color: #0c8f4f;
  font-size: 18px;
  letter-spacing: 2px;
  line-height: 1;
  margin: 0;
  font-weight: 500;
}

.select-product-wrap .QR-code img {
  max-width: 100%;
}

.select-product-wrap .QR-code .text {
  background: #0c8f4f;
  color: #fff;
  font-size: 16px;
  width: 100%;
  padding: 5px;
  margin: 0 auto;
}

.select-product-wrap .btn-download {
  display: block;
  width: 100%;
  height: 46px;
  font-size: 20px;
  font-weight: bold;
  position: fixed;
  bottom: 0;
  letter-spacing: 2px;
}

.select-product-wrap .btn-download i {
  position: absolute;
  right: 10px;
  top: 10px;
  font-size: 120%;
}

.select-product-wrap.over-list-6 .select-product {
  max-width: 640px;
}

.select-product-wrap.over-list-8 .select-product {
  max-width: 960px;
}

.select-product-wrap[class*="over-list-"] {
  padding: 2% 0 0px;
}

.select-product-wrap[class*="over-list-"] .logo img {
  width: 260px;
  height: auto;
}

.select-product-wrap[class*="over-list-"] .select-product {
  text-align: left;
}

.select-product-wrap[class*="over-list-"] .select-product .product {
  margin: 10px 30px;
}

.select-product-wrap[class*="over-list-"] .select-product .product .name {
  font-size: 15px;
  margin-top: 6px;
}

.select-product-wrap[class*="over-list-"] .select-product .product img {
  width: 100px;
  height: auto;
}

.select-product-wrap[class*="over-list-"] .QR-code {
  width: 150px;
}

.select-product-wrap[class*="over-list-"] .QR-code img {
  width: 140px;
  height: auto;
}

/* 產品模組空白區塊 */
.select-product-wrap-ver2020 .select-product .product.empty-product {
  min-width: 120px;
}

@media (max-width: 1366px) {
  .select-product-wrap-ver2020 .select-product .product.empty-product {
    min-width: 90px;
  }
}

@media (max-width: 1142px) {
  .select-product-wrap-ver2020 .select-product .product.empty-product {
    display: none !important;
    min-width: unset !important;
  }


  .red-tag-under {
    font-size: 11px;
    padding: 3px 5px;
  }


}

.start {
  width: 100%;
  max-width: 100%;
  position: relative;
  background: #ededed;
}

.start .header {
  width: 100%;
  height: 36px;
  background: #0c8f4f;
  text-align: center;
}

.start .header .logo {
  position: absolute;
  left: 10px;
  top: 0;
  padding-top: 2px;
}

.start .header .logo i {
  font-size: 30px;
  color: #fff;
  display: inline-block;
  margin-right: 5px;
}

.start .header .logo img {
  display: inline-block;
  vertical-align: top;
  padding-top: 8px;
}

.start .header .logo2 {
  position: absolute;
  right: 10px;
  top: 2px;
}

.start .header h1 {
  margin: 0;
  font-size: 20px;
  letter-spacing: 3px;
  color: #fff;
  padding-top: 6px;
  font-weight: bold;
}

.start .stepWrap {
  width: 100%;
  position: relative;
  background: #ededed;
}

.start .step {
  max-width: 980px;
  margin-top: 15px;
}

.start .content {
  width: 100%;
  margin: 0 auto;
  padding-bottom: 10px;
}

.start .content img {
  margin: 0 auto;
  display: block;
}

.start .footer {
  width: 100%;
  height: 50px;
  background: #0c8f4f;
}

.start .footer .btn,
.start .footer .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .start .footer .ag-paging-button {
  background: #0c8f4f;
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  width: 50%;
  padding: 0 30px;
  height: 50px;
  line-height: 50px;
  vertical-align: middle;
  float: left;
  text-align: center;
  position: relative;
  border: none;
}

.start .footer .btn:hover,
.start .footer .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .start .footer .ag-paging-button:hover {
  background: #05733d;
}

.start .footer .previous {
  float: left;
}

.start .footer .next {
  float: right;
}

.start .footer .previous:before,
.start .footer .next:after {
  font-family: 'FontAwesome';
  font-size: 30px;
  color: #fff;
  position: absolute;
  top: 0px;
}

.start .footer .previous:before {
  content: "\f104";
  margin-left: -20px;
}

.start .footer .next:after {
  content: "\f105 ";
  margin-left: 10px;
}

/* 開通動畫V1 */
.teach-tour-wrap {
  width: 100%;
  min-height: 100vh;
  background: rgba(0, 0, 0, 0.1);
}

.teach-tour {
  padding: 10px 0 50px;
  position: relative;
}

.teach-tour .logo {
  margin: 20px 0 50px;
}

.teach-tour .text {
  margin: 30px 0;
  font-size: 30px;
  font-weight: bold;
  color: #333333;
}

.teach-tour .title {
  animation: fadeIn .5s .5s both;
  padding-left: 8px;
  font-size: 30px;
  color: #0c8f4f;
  font-weight: bold;
  text-align: left;
  margin-top: 0;
}


@media (max-width: 767px) {
  .teach-tour .title {
    font-size: 20px;
  }
}

.teach-tour .btn-pass {
  border-radius: 0 !important;
  position: absolute;
  top: 10px;
  right: 0;
  z-index: 99;
}

.teach-tour .btns {
  margin-top: 15px;
}

.teach-tour .btns .btn,
.teach-tour .btns .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .teach-tour .btns .ag-paging-button {
  animation: fadeIn .5s both;
  width: 80%;
  max-width: 200px;
  padding: 10px 20px;
  font-size: 20px;
  font-weight: bold;
  text-align: center;
}

.teach-tour .btns .btn:hover,
.teach-tour .btns .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .teach-tour .btns .ag-paging-button:hover {
  /* animation:pulse .3s both; */
}

.teach-tour .never-show {
  animation: fadeIn .5s both;
}



/* 開通動畫V2 */

.teach-tour-wrap.teach2 {
  background: rgb(221, 237, 255);
  background: url('https://a1cdnpoint2.azureedge.net/images/teach-tour/bg.png'), linear-gradient(0deg, rgba(221, 237, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
  background-repeat: no-repeat;
  background-position: bottom center;
  padding-top: 70px;
  overflow: hidden;
}


.teach2 .teach-tour {
  padding: 10px 0 90px;
  position: relative;
  width: 100%;
  max-width: 1025px;
  height: 665px;
  background-color: #fff;
  border-radius: 10px;
  box-shadow: #00000021 0 0 20px 0;
}

/* .teach2 .teach-tour:before {
  content: url(../../images/teach-tour/bg-up.png);
  width: 149px;
  height: 257px;
  display: block;
  position: absolute;
  bottom: -140px;
  left: -65px;
} */


.teach2 .teach-title {
  background: #597dd5;
  color: #fff;
  display: inline-block;
  padding: 10px 30px;
  border-radius: 50px;
  font-size: 22px;
  font-weight: bold;
  position: absolute;
  left: 0;
  right: 0;
  margin: -35px auto;
  max-width: 665px;
}

.teach2 .teach-title .phone-br {
  display: none;
}

.teach2 .teach-tour .teach-top {
  border-bottom: 1px solid #eee;
  max-width: 755px;
  margin: 0 auto 30px;
}

.teach2 .teach-tour .step-title {
  color: #597dd5;
  font-size: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 755px;
  margin: 20px auto 0;
  border-bottom: none;
}

.teach2 .teach-tour .step-title .number {
  color: #597dd5;
  background: #eff3ff;
  font-size: 18px;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  padding-top: 0px;
  display: inline-block;
  margin-right: 10px;
}

.teach2 .teach-bottom {
  max-width: 755px;
  margin: 0 auto;
  background: #eff3ff;
  color: #3d599b;
  padding: 20px;
  font-size: 16px;
}

.teach2 .teach-bottom .teach-bottom-bold {
  display: block;
  font-size: 20px;
  font-weight: bold;
  margin-bottom: 5px;
  color: #4c67a3;
  letter-spacing: 2px;
}

.teach2 .teach-bottom .highlight {
  /* background: #4c67ac; */
  font-weight: bold;
  padding: 0 5px;
  margin: 0 2px;
  /* color: #ffffff; */
}

.teach2 .teach-top p {
  font-size: 18px;
  color: #5a5a5a;
  margin: 10px 0 15px;
}

.teach2 .teach-top p span {
  font-weight: bold;
  color: #597dd5;
}

.teach2 .teach-tour .block-title {
  font-size: 16px;
  color: #5a5a5a;
  text-align: center;
}

.teach2 .teach-tour .block-title span {
  color: #597dd5;
  font-weight: bold;
}


.teach2 .teach-tour .teach-link {
  color: #597dd5;
  text-decoration: underline !important;
  font-weight: bold;
}

.teach2 .teach-tour .step02 .block {
  margin: 0 25px;
  max-width: 353px;
  text-align: left;
}

/* .teach2 .teach-tour .step02 .teach-top p {
  font-weight: bold;
} */

.teach2 .teach-tour .step02 .block-title-highlight {
  background: #eff3ff;
  color: #4c67a3 !important;
  padding: 3px 15px;
  border-radius: 5px;
  margin-right: 5px;
  display: block;
  text-align: center;
  margin-bottom: 7px;
  letter-spacing: 2px;
  font-size: 20px;
}

.teach2 .teach-tour .step02 .block img {
  margin-left: -20px;
  /* margin-top: 5px; */
}

.teach2 .teach-tour .step03 .teach-img-phone {
  display: none;
}

.teach2 .teach-tour .step03 .teach-top {
  margin-bottom: 5px;
}


.teach2 .teach-tour .step04 .block1 .block-title {
  color: #5b4dd0;
}

.teach2 .teach-tour .step04 .block2 .block-title {
  color: #2645b5;
  margin-top: 5px;
}

.teach2 .teach-tour .step04 .block-title {
  font-size: 18px;
  font-weight: bold;
}

.teach2 .teach-tour .step04 .block {
  background-color: #fff;
  border-radius: 10px;
  box-shadow: #00000021 0 0 20px 0;
  width: 35%;
  margin: 0 15px;
  padding: 40px 0;
}

.teach2 .teach-tour .step04 .block-content {
  max-width: 115px;
  text-align: left;
  margin: 0 auto;
}

.teach2 .teach-tour .step04 .block-content li {
  list-style: none;
  font-size: 16px;
  margin: 15px 0;
}

.teach2 .teach-tour .step04 .block-content li i {
  margin-right: 5px;
}

.teach2 .teach-tour .step04 .block1 .block-content li {
  color: #8377eb;
  font-weight: 600;
}

.teach2 .teach-tour .step04 .block2 .block-content li {
  color: #597dd5;
  font-weight: 600;
}

.teach2 .teach-tour .step04 .btn {
  border: none;
  font-size: 18px;
  font-weight: bold;
  border-radius: 5px;
  padding: 10px 30px;
  /* margin-top: 15px; */
}

.teach2 .teach-tour .btns .btn {
  /* max-width: unset !important; */
  width: 100%;
}

.teach2 .teach-tour .btn i {
  margin-left: 10px;
}

.teach2 .teach-tour .btn-purple {
  background: #5b4dd0;
  border: none;
}

.teach2 .teach-tour .btn-blue {
  background: #2645b5;
  border: none;
}

.teach2 .teach-tour .next-btn {
  position: absolute;
  right: 20px;
  bottom: 20px;
  font-size: 18px;
  max-width: 180px;
}

.teach2 .teach-tour .next-btn i {
  margin-left: 10px;
}

.teach2 .teach-tour .step-line-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: 0 auto 30px;
}

.teach2 .teach-tour .step-line {
  color: #acadaf;
  font-size: 20px;
  background: #ffffff;
  border-radius: 50%;
  width: 35px;
  height: 35px;
  padding-top: 3px;
  margin: 0 15px;
  box-shadow: #00000021 0 0px 20px;
  z-index: 99;
}

.teach2 .teach-tour .step-line-wrap:before {
  content: '';
  width: 210px;
  position: absolute;
  height: 2px;
  background: #f1f1f1;
  top: 17px;
  z-index: 1;
}

.teach2 .teach-tour .step-line.active {
  background: #e7f1fe;
  color: #4c67a3;
  box-shadow: none;
}

.teach-tour-wrap.teach2.step-setting-wrap {
  display: flex;
  align-items: center;
  padding-top: 0;
}

.teach2 .step-setting,
.teach2 .step-open,
.teach2 .step-mistake {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  max-height: 650px;
  justify-content: center;
  padding-bottom: 20px;
}


.teach-tour-wrap.teach2.step-setting-wrap,
.teach-tour-wrap.teach2.step-open-wrap,
.teach-tour-wrap.teach2.step-mistake-wrap {
  display: flex;
  align-items: center;
  padding-top: 0;
}

.teach-tour-wrap.teach2.step-setting-wrap .teach-tour,
.teach-tour-wrap.teach2.step-open-wrap .teach-tour,
.teach-tour-wrap.teach2.step-mistake-wrap .teach-tour {
  background: none;
  box-shadow: none;
}


.teach2 .teach-tour .text {
  font-size: 22px;
  font-weight: bold;
  color: #7263e2;
  margin-top: 25px;
}


@media (max-width: 1536px) {

  .teach-tour-wrap.teach2 {
    background: url('https://a1cdnpoint2.azureedge.net/images/teach-tour/bg-1366.png'), linear-gradient(0deg, rgba(221, 237, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
    background-repeat: no-repeat;
    background-position: 40% bottom;
    padding-top: unset;
    align-items: center;
  }

  .teach2 .teach-tour {
    height: 530px;
    padding: 0;
  }

  .teach2 .teach-tour:before {
    bottom: -45px;
    left: -100px;
  }

  .teach2 .teach-title {
    font-size: 20px;
    max-width: 600px;
    margin: -25px auto;
  }


  /*
  .teach2 .teach-tour .step-line-wrap {
    flex-direction: column;
    left: unset;
    margin: 0 auto;
    top: 0;
    right: 30px;
  }

  .teach2 .teach-tour .step-line {
    margin: 10px 0;
  }

  .teach2 .teach-tour .step-line-wrap:before {
    height: 180px;
    width: 2px;
    top: 170px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
  } */


  .teach2 .teach-tour .teach-top {
    margin: 20px auto 20px;
    padding-bottom: 10px;
    display: flex;
    align-items: center;
    max-width: 800px;
    justify-content: center;
  }


  .teach2 .teach-top p {
    font-size: 16px;
    margin: 0;
    margin-bottom: 0;
    margin-left: 20px;
  }

  .teach2 .teach-bottom {
    padding: 10px 0;
    max-width: 770px;
  }

  /* .teach2 .teach-bottom .teach-bottom-bold {
    margin-bottom: 0;
  } */

  .teach2 .teach-tour .step-line-wrap {
    margin: 0 auto 20px;
  }

  .teach2 .teach-tour .step-title {
    font-size: 22px;
    margin: 0;
  }


  .teach2 .teach-tour .step04 .block {
    padding: 30px 0;
  }

}



@media (max-width: 1024px) {

  .teach2 .teach-tour:before {
    left: -20px;
  }

}

@media (max-width: 768px) {

  .teach-tour-wrap.teach2 {
    background: url('https://a1cdnpoint2.azureedge.net/images/teach-tour/bg-1366.png'), linear-gradient(0deg, rgba(221, 237, 255, 1) 0%, rgba(255, 255, 255, 1) 100%);
    background-repeat: no-repeat;
    background-position: 90% bottom;
    padding-top: unset;
    align-items: center;
    padding-top: 0;
    /* display: flex;
    align-items: center; */
  }

  .teach2 .teach-tour {
    height: unset;
    padding-bottom: 170px;
    margin: 70px 0;
    max-width: 90%;
  }

  .teach2 .teach-tour:before {
    bottom: -190px;
    left: -15px;
    transform: scale(.6);
  }

  .teach2 .teach-title {
    font-size: 16px;
    padding: 10px 30px;
    max-width: 80%;
    border-radius: 10px;
  }

  .teach2 .teach-title .phone-br {
    display: block;
  }

  .teach2 .teach-tour .teach-top {
    display: block;
    padding-top: 15px;
  }


  .teach2 .teach-top p {
    width: 90%;
    margin: 0 auto 10px;
  }

  .teach2 .step02 .teach-center,
  .teach2 .step04 .teach-center {
    flex-direction: column;
    align-items: center;
  }

  .teach2 .teach-tour .step02 .block {
    text-align: center;
    margin: 15px;
  }

  .teach2 .teach-tour .step02 .block img {
    margin-left: 0;
  }

  .teach2 .teach-tour .step03 .teach-img-phone {
    display: block;
  }

  .teach2 .teach-tour .step03 .teach-img-web {
    display: none;
  }

  .teach2 .teach-tour .step04 .block {
    padding: 30px 0;
    width: 90%;
    margin: 15px;
  }

  .teach2 .step04 .teach-center img {
    width: auto;
  }

  .teach2 .teach-center img {
    width: 95%;
  }


  .teach2 .teach-tour .btns {
    margin-top: 0;
  }

  .teach2 .teach-tour .next-btn {
    right: 0;
    left: 0;
    bottom: 100px;
    margin: 0 auto;
  }

  .teach2 .teach-bottom {
    padding: 10px;
    max-width: unset;
    width: 90%;
  }

  .teach2 .teach-tour .step-line-wrap {
    margin: 0 auto 30px;
  }


  .teach2.step-setting-wrap .teach-tour:before,
  .teach2.step-open-wrap .teach-tour:before,
  .teach2.step-mistake-wrap .teach-tour:before {
    content: none;
  }


  .teach2.step-setting-wrap .teach-tour,
  .teach2.step-open-wrap .teach-tour {
    overflow: hidden;
  }




  .teach-tour-wrap.teach2 {
    padding-top: 0 !important;
    background-position: 95% bottom;
  }


}


/* HTML: <div class="loader"></div> */
.open-animate-loader {
  width: 50px;
  aspect-ratio: 1;
  display: grid;
}

.open-animate-loader::before,
.open-animate-loader::after {
  content: "";
  grid-area: 1/1;
  --c: no-repeat radial-gradient(farthest-side, #7263e5 92%, #0000);
  background:
    var(--c) 50% 0,
    var(--c) 50% 100%,
    var(--c) 100% 50%,
    var(--c) 0 50%;
  background-size: 12px 12px;
  animation: l12 1s infinite;
}

.open-animate-loader::before {
  margin: 4px;
  filter: hue-rotate(16deg);
  background-size: 8px 8px;
  animation-timing-function: linear
}

@keyframes l12 {
  100% {
    transform: rotate(.5turn)
  }
}


/* ---------------------------------------------------------------------- */
/*  Theme Default
/* ---------------------------------------------------------------------- */
body {
  /* background-color: $base-color !important; */
  /* background-color: #fff !important; */
}

.main-container,
#pageslide-left,
#pageslide-right {
  background-color: #fff !important;
}

.label-default,
.badge-default {
  background: red !important;
}

.label-w-bg {
  background-color: #fff;
}

.topbar {
  background: #0c8f4f;
}

.topbar>.container .navbar-brand,
.topbar .logo {
  color: #ffffff;
}

.topbar .topbar-tools>ul>li>a {
  color: #ffffff;
}

.topbar .topbar-tools>ul>li.right-menu-toggle>a {
  border-left-width: 1px;
  border-left-style: solid;
  border-left-color: #0c8f4f;
}

.topbar .nav li.dropdown.open>.dropdown-toggle,
.topbar .nav li.dropdown.active>.dropdown-toggle,
.topbar .nav li.dropdown.open.active>.dropdown-toggle {
  background: none;
  color: #ffffff;
}

.topbar .nav>li:hover>a,
.topbar .nav>li:active>a,
.topbar .nav>li>a:focus {
  color: #ffffff;
  background: none;
}

#horizontal-menu .container {
  background: #F7F8FA;
  border-bottom: 1px solid #e7eaf0;
}

#horizontal-menu .navbar-collapse .navbar-nav>li>a {
  color: #6a7ca2;
}

#horizontal-menu .navbar-collapse .navbar-nav>li>a:hover {
  color: #181d27;
  background: #e7eaf0;
}

#horizontal-menu .navbar-collapse .navbar-nav>li>a:active,
#horizontal-menu .navbar-collapse .navbar-nav>li>a:focus {
  background: #d8dde6;
}

#horizontal-menu .navbar-collapse .navbar-nav>li.active>a {
  color: white;
  background: red;
}

#horizontal-menu .navbar-collapse .navbar-nav>li.active>a:after {
  border-top-color: red;
}

.main-content {
  background: #ededed;
}

.go-top {
  color: #6a7ca2;
}

.footer-inner {
  color: #6a7ca2;
}

#pageslide-left .slide-tools {
  background-color: #fafafa;
}

#pageslide-left .btn,
#pageslide-left .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel #pageslide-left .ag-paging-button {
  color: rgba(59, 60, 65, 0.3);
}

#pageslide-left .btn:hover,
#pageslide-left .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button:hover,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel #pageslide-left .ag-paging-button:hover {
  color: #3b3c41;
  background-color: rgba(209, 215, 226, 0.4);
}

#pageslide-left .user-profile {
  border-color: #e7eaf0;
  position: relative;
}

#pageslide-left .user-profile h5 {
  color: #a1a8b7;
}

#pageslide-left .user-profile h4 {
  color: #333333;
}

#pageslide-left .user-profile h6 {
  color: #333333;
}

.closedbar {
  background: #eef0f4;
}

.closedbar:hover {
  background-color: #F7F8FA !important;
}

.closedbar:before {
  content: "\f0c9";
  font-family: 'FontAwesome';
  font-weight: normal;
  font-size: 14px;
  color: #0c8f4f;
  position: relative;
  top: 12px;
}

#pageslide-right .pageslide-title {
  color: rgba(59, 60, 65, 0.4);
}

#pageslide-right .notifications a {
  color: rgba(59, 60, 65, 0.4);
  background: #eef0f4;
}

#pageslide-right .notifications a:hover {
  background: #e7eaf0;
}

#pageslide-right .notifications a .time {
  color: #acacac;
}

#pageslide-right .right-wrapper .nav-tabs li a {
  background: #F7F8FA;
  border-bottom-color: #d8dde6;
}

#pageslide-right .right-wrapper .nav-tabs li.active a {
  border-right-color: #d8dde6;
  border-left-color: #d8dde6;
  color: rgba(59, 60, 65, 0.9);
}

#pageslide-right .media-list .media {
  border-bottom: 1px solid #d8dde6;
  margin: 0;
}

#pageslide-right .media-list .media .media-heading {
  color: #002f38 !important;
}

#pageslide-right .media-list .media a:hover {
  background: #d8dde6;
}

#pageslide-right .media-list .media .status-online {
  color: #1FBBA6;
}

#pageslide-right .media-list .media .media-body span {
  color: #364156;
}

#pageslide-right .media-list .media label {
  color: #495876;
}

#pageslide-right .sidebar-title {
  color: rgba(59, 60, 65, 0.4);
}

#pageslide-right .sidebar-back {
  color: rgba(59, 60, 65, 0.4);
}

#pageslide-right .sidebar-back:hover {
  color: rgba(59, 60, 65, 0.6);
}

#style_selector_container .box-title {
  color: rgba(59, 60, 65, 0.8) !important;
}

#style_selector_container .images {
  border-bottom: 1px solid #e7eaf0;
}

#style_selector_container .images img.active {
  border: 2px solid #404c66;
}

footer {
  background-color: #F7F8FA;
}

/*---------------------------左選單調整-----------------------------*/
ul.main-navigation-menu li a {
  border-bottom: none;
  border-top-color: #e7eaf0;
  color: #333333;
}

ul.main-navigation-menu li a i {
  color: #0c8f4f;
  font-weight: normal;
}

ul.main-navigation-menu li.active a {
  background: #11c76e !important;
  border-top: none !important;
  color: #fff;
}

ul.main-navigation-menu li.active a i {
  color: #fff;
}

ul.main-navigation-menu li a.active {
  background: #11c76e !important;
  color: #fff;
}

ul.main-navigation-menu li a.active i {
  color: #fff;
}

ul.main-navigation-menu li ul.sub-menu li a:hover {
  background: #e5e8ed;
}

ul.main-navigation-menu li.open a,
ul.main-navigation-menu li a:hover,
ul.main-navigation-menu li:hover a {
  background-color: #f1f3f6;
}

ul.main-navigation-menu li.divider {
  background-color: #e7eaf0 !important;
}

ul.main-navigation-menu li.open a,
ul.main-navigation-menu li a:hover,
ul.main-navigation-menu li:hover a {
  background-color: #f1f3f6;
}

ul.main-navigation-menu li.dropdown-header,
ul.main-navigation-menu .mega-menu-sub-title {
  color: #a1a8b7 !important;
}

ul.main-navigation-menu li.dropdown-header,
ul.main-navigation-menu .mega-menu-sub-title {
  color: #a1a8b7 !important;
}

ul.main-navigation-menu .mega-menu .mega-menu-content ul.mega-sub-menu a {
  color: #181d27 !important;
}

ul.main-navigation-menu .mega-menu .mega-menu-content ul.mega-sub-menu a:hover {
  background: none !important;
}

ul.main-navigation-menu .mega-menu .mega-menu-content ul.mega-sub-menu li.active a,
ul.main-navigation-menu .mega-menu .mega-menu-content ul.mega-sub-menu li.active a:hover,
ul.main-navigation-menu .mega-menu .mega-menu-content ul.mega-sub-menu li.active a:focus {
  background-color: #e5e8ed !important;
  text-decoration: none;
}

ul.main-navigation-menu .mega-menu .mega-menu-content ul.mega-sub-menu li a:hover {
  background-color: #e5e8ed !important;
  text-decoration: none;
}

/* ---------------------------------------------------------------------- */
/*  Theme-colorful
/* ---------------------------------------------------------------------- */
[data-theme='blue'] ::-moz-selection {
  background: #0a7eda;
}

[data-theme='blue'] ::selection {
  background: #0a7eda;
}

[data-theme='blue'] .topbar {
  background: #0a7eda;
}

[data-theme='blue'] .switch-btn {
  background: #0a7eda;
}

[data-theme='blue'] .switch-btn:hover {
  background: #0867b3;
  color: #fff;
}

@media (min-width: 767px) {
  [data-theme='blue'] .topbar-tools .software.dark-bg {
    background: #0867b3 !important;
  }
}

[data-theme='blue'] .topNavMenu .navbar-right>li>a {
  color: #0a7eda !important;
}

[data-theme='blue'] .topNavMenu .navbar-right>li>a:hover {
  background: #eff7fe;
  border: 1px solid #70bcf8;
}

[data-theme='blue'] .topNavMenu .navbar-right>li>a i {
  color: #0a7eda !important;
}

[data-theme='blue'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a {
  color: #0a7eda !important;
}

[data-theme='blue'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover {
  background: #eff7fe;
  border: 1px solid #70bcf8;
}

[data-theme='blue'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a i {
  color: #0a7eda !important;
}

[data-theme='blue'] .breadcrumb a {
  color: #0a7eda;
}

[data-theme='blue'] .categories-title {
  color: #0a7eda;
}

[data-theme='blue'] .multi-select .select-number,
[data-theme='blue'] .multi-select .dropdown-title,
[data-theme='blue'] .multi-select .dropdown-item.store-delete p {
  color: #0a7eda !important;
}

[data-theme='blue'] .btn-switchPage .btn,
[data-theme='blue'] .btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [data-theme='blue'] .btn-switchPage .ag-paging-button {
  color: #0a7eda;
}

[data-theme='blue'] .dropdown-menu.dropdown-light:before {
  border-bottom-color: #0a7eda;
}

[data-theme='blue'] .dropdown-menu,
[data-theme='blue'] .multi-select .dropdown-item.store-delete {
  border-color: #0867b3 !important;
}

[data-theme='blue'] .multi-select .dropdown-item.store-plus {
  background: #0a7eda !important;
}

[data-theme='blue'] textarea:focus,
[data-theme='blue'] select:focus,
[data-theme='blue'] input[type="text"]:focus,
[data-theme='blue'] input[type="password"]:focus,
[data-theme='blue'] input[type="datetime"]:focus,
[data-theme='blue'] input[type="datetime-local"]:focus,
[data-theme='blue'] input[type="date"]:focus,
[data-theme='blue'] input[type="month"]:focus,
[data-theme='blue'] input[type="time"]:focus,
[data-theme='blue'] input[type="week"]:focus,
[data-theme='blue'] input[type="number"]:focus,
[data-theme='blue'] input[type="email"]:focus,
[data-theme='blue'] input[type="url"]:focus,
[data-theme='blue'] input[type="search"]:focus,
[data-theme='blue'] input[type="tel"]:focus,
[data-theme='blue'] input[type="color"]:focus {
  border-color: #0867b3 !important;
}

[data-theme='blue'] #pageslide-left .user-profile .user-options {
  color: #0a7eda !important;
}

[data-theme='blue'] #pageslide-left .user-profile .user-options:hover {
  background: #eff7fe;
  border: 1px solid #70bcf8;
}


@media (min-width: 767px) {
  [data-theme='blue'].sidebar-close #pageslide-left .navigation-toggler .sb-toggle-left:before {
    color: #0a7eda !important;
  }

  [data-theme='blue'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:before {
    color: #0a7eda !important;
  }

  [data-theme='blue'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover {
    background: #3ba3f6 !important;
    color: #fff;
  }

  [data-theme='blue'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover:before {
    color: #fff !important;
  }
}

[data-theme='blue'] #pageslide-left .alone [aria-selected='true'] a {
  background: #3ba3f6 !important;
}

[data-theme='blue'] #pageslide-left .alone [aria-selected='true'] a i {
  color: #fff !important;
}

[data-theme='blue'] ul.main-navigation-menu li a i {
  color: #0a7eda !important;
}

[data-theme='blue'] ul.main-navigation-menu li a.active {
  background: #3ba3f6 !important;
}

[data-theme='blue'] ul.main-navigation-menu li a.active i {
  color: #fff !important;
}

[data-theme='blue'] .fullpage-loading .sk-circle .sk-child:before {
  background: #0a7eda !important;
}

[data-theme='blue'] .fullpage-loading .text {
  color: #0a7eda !important;
}

[data-theme='blue'] .magic-checkbox:checked+label:before {
  border: #0a7eda !important;
  background: #0a7eda !important;
}

[data-theme='blue'] .magic-radio:checked+label:before {
  border: 1px solid #0a7eda !important;
}

[data-theme='blue'] .magic-radio+label:after {
  background: #0a7eda !important;
}

[data-theme='blue'] .btn-checkbox:hover,
[data-theme='blue'] .btn-checkbox:focus,
[data-theme='blue'] .btn-checkbox:active {
  border-color: #0a7eda !important;
}

[data-theme='blue'] .btn-checkbox.active {
  background: #0a7eda !important;
  border-color: #0a7eda !important;
}

[data-theme='orange'] ::-moz-selection {
  background: #ff5a00;
}

[data-theme='orange'] ::selection {
  background: #ff5a00;
}

[data-theme='orange'] .topbar {
  background: #ff5a00;
}

[data-theme='orange'] .switch-btn {
  background: #ff5a00;
}

[data-theme='orange'] .switch-btn:hover {
  background: #d64c00;
  color: #fff;
}

@media (min-width: 767px) {
  [data-theme='orange'] .topbar-tools .software.dark-bg {
    background: #d64c00 !important;
  }
}

[data-theme='orange'] .topNavMenu .navbar-right>li>a {
  color: #ff5a00 !important;
}

[data-theme='orange'] .topNavMenu .navbar-right>li>a:hover {
  background: #fff2eb;
  border: 1px solid #ffb085;
}

[data-theme='orange'] .topNavMenu .navbar-right>li>a i {
  color: #ff5a00 !important;
}

[data-theme='orange'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a {
  color: #ff5a00 !important;
}

[data-theme='orange'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover {
  background: #fff2eb;
  border: 1px solid #ffb085;
}

[data-theme='orange'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a i {
  color: #ff5a00 !important;
}

[data-theme='orange'] .breadcrumb a {
  color: #ff5a00;
}

[data-theme='orange'] .categories-title {
  color: #ff5a00;
}

[data-theme='orange'] .multi-select .select-number,
[data-theme='orange'] .multi-select .dropdown-title,
[data-theme='orange'] .multi-select .dropdown-item.store-delete p {
  color: #ff5a00 !important;
}

[data-theme='orange'] .btn-switchPage .btn,
[data-theme='orange'] .btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [data-theme='orange'] .btn-switchPage .ag-paging-button {
  color: #ff5a00;
}

[data-theme='orange'] .dropdown-menu.dropdown-light:before {
  border-bottom-color: #ff5a00;
}

[data-theme='orange'] .dropdown-menu,
[data-theme='orange'] .multi-select .dropdown-item.store-delete {
  border-color: #d64c00 !important;
}

[data-theme='orange'] .multi-select .dropdown-item.store-plus {
  background: #ff5a00 !important;
}

[data-theme='orange'] textarea:focus,
[data-theme='orange'] select:focus,
[data-theme='orange'] input[type="text"]:focus,
[data-theme='orange'] input[type="password"]:focus,
[data-theme='orange'] input[type="datetime"]:focus,
[data-theme='orange'] input[type="datetime-local"]:focus,
[data-theme='orange'] input[type="date"]:focus,
[data-theme='orange'] input[type="month"]:focus,
[data-theme='orange'] input[type="time"]:focus,
[data-theme='orange'] input[type="week"]:focus,
[data-theme='orange'] input[type="number"]:focus,
[data-theme='orange'] input[type="email"]:focus,
[data-theme='orange'] input[type="url"]:focus,
[data-theme='orange'] input[type="search"]:focus,
[data-theme='orange'] input[type="tel"]:focus,
[data-theme='orange'] input[type="color"]:focus {
  border-color: #d64c00 !important;
}

[data-theme='orange'] #pageslide-left .user-profile .user-options {
  color: #ff5a00 !important;
}

[data-theme='orange'] #pageslide-left .user-profile .user-options:hover {
  background: #fff2eb;
  border: 1px solid #ffb085;
}

@media (min-width: 767px) {
  [data-theme='orange'].sidebar-close #pageslide-left .navigation-toggler .sb-toggle-left:before {
    color: #ff5a00 !important;
  }

  [data-theme='orange'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:before {
    color: #ff5a00 !important;
  }

  [data-theme='orange'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover {
    background: #ff8c4d !important;
    color: #fff;
  }

  [data-theme='orange'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover:before {
    color: #fff !important;
  }
}

[data-theme='orange'] #pageslide-left .alone [aria-selected='true'] a {
  background: #ff8c4d !important;
}

[data-theme='orange'] #pageslide-left .alone [aria-selected='true'] a i {
  color: #fff !important;
}

[data-theme='orange'] ul.main-navigation-menu li a i {
  color: #ff5a00 !important;
}

[data-theme='orange'] ul.main-navigation-menu li a.active {
  background: #ff8c4d !important;
}

[data-theme='orange'] ul.main-navigation-menu li a.active i {
  color: #fff !important;
}

[data-theme='orange'] .fullpage-loading .sk-circle .sk-child:before {
  background: #ff5a00 !important;
}

[data-theme='orange'] .fullpage-loading .text {
  color: #ff5a00 !important;
}

[data-theme='orange'] .magic-checkbox:checked+label:before {
  border: #ff5a00 !important;
  background: #ff5a00 !important;
}

[data-theme='orange'] .magic-radio:checked+label:before {
  border: 1px solid #ff5a00 !important;
}

[data-theme='orange'] .magic-radio+label:after {
  background: #ff5a00 !important;
}

[data-theme='orange'] .btn-checkbox:hover,
[data-theme='orange'] .btn-checkbox:focus,
[data-theme='orange'] .btn-checkbox:active {
  border-color: #ff5a00 !important;
}

[data-theme='orange'] .btn-checkbox.active {
  background: #ff5a00 !important;
  border-color: #ff5a00 !important;
}

[data-theme='green'] ::-moz-selection {
  background: #26b0a4;
}

[data-theme='green'] ::selection {
  background: #26b0a4;
}

[data-theme='green'] .topbar {
  background: #26b0a4;
}

[data-theme='green'] .switch-btn {
  background: #26b0a4;
}

[data-theme='green'] .switch-btn:hover {
  background: #1f8e85;
  color: #fff;
}

@media (min-width: 767px) {
  [data-theme='green'] .topbar-tools .software.dark-bg {
    background: #1f8e85 !important;
  }
}

[data-theme='green'] .topNavMenu .navbar-right>li>a {
  color: #26b0a4 !important;
}

[data-theme='green'] .topNavMenu .navbar-right>li>a:hover {
  background: #eafaf9;
  border: 1px solid #79e2d9;
}

[data-theme='green'] .topNavMenu .navbar-right>li>a i {
  color: #26b0a4 !important;
}

[data-theme='green'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a {
  color: #26b0a4 !important;
}

[data-theme='green'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover {
  background: #eafaf9;
  border: 1px solid #79e2d9;
}

[data-theme='green'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a i {
  color: #26b0a4 !important;
}

[data-theme='green'] .breadcrumb a {
  color: #26b0a4;
}

[data-theme='green'] .categories-title {
  color: #26b0a4;
}

[data-theme='green'] .multi-select .select-number,
[data-theme='green'] .multi-select .dropdown-title,
[data-theme='green'] .multi-select .dropdown-item.store-delete p {
  color: #26b0a4 !important;
}

[data-theme='green'] .btn-switchPage .btn,
[data-theme='green'] .btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [data-theme='green'] .btn-switchPage .ag-paging-button {
  color: #26b0a4;
}

[data-theme='green'] .dropdown-menu.dropdown-light:before {
  border-bottom-color: #26b0a4;
}

[data-theme='green'] .dropdown-menu,
[data-theme='green'] .multi-select .dropdown-item.store-delete {
  border-color: #1f8e85 !important;
}

[data-theme='green'] .multi-select .dropdown-item.store-plus {
  background: #26b0a4 !important;
}

[data-theme='green'] textarea:focus,
[data-theme='green'] select:focus,
[data-theme='green'] input[type="text"]:focus,
[data-theme='green'] input[type="password"]:focus,
[data-theme='green'] input[type="datetime"]:focus,
[data-theme='green'] input[type="datetime-local"]:focus,
[data-theme='green'] input[type="date"]:focus,
[data-theme='green'] input[type="month"]:focus,
[data-theme='green'] input[type="time"]:focus,
[data-theme='green'] input[type="week"]:focus,
[data-theme='green'] input[type="number"]:focus,
[data-theme='green'] input[type="email"]:focus,
[data-theme='green'] input[type="url"]:focus,
[data-theme='green'] input[type="search"]:focus,
[data-theme='green'] input[type="tel"]:focus,
[data-theme='green'] input[type="color"]:focus {
  border-color: #1f8e85 !important;
}

[data-theme='green'] #pageslide-left .user-profile .user-options {
  color: #26b0a4 !important;
}

[data-theme='green'] #pageslide-left .user-profile .user-options:hover {
  background: #eafaf9;
  border: 1px solid #79e2d9;
}

@media (min-width: 767px) {
  [data-theme='green'].sidebar-close #pageslide-left .navigation-toggler .sb-toggle-left:before {
    color: #26b0a4 !important;
  }

  [data-theme='green'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:before {
    color: #26b0a4 !important;
  }

  [data-theme='green'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover {
    background: #4ad8cc !important;
    color: #fff;
  }

  [data-theme='green'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover:before {
    color: #fff !important;
  }
}

[data-theme='green'] #pageslide-left .alone [aria-selected='true'] a {
  background: #4ad8cc !important;
}

[data-theme='green'] #pageslide-left .alone [aria-selected='true'] a i {
  color: #fff !important;
}

[data-theme='green'] ul.main-navigation-menu li a i {
  color: #26b0a4 !important;
}

[data-theme='green'] ul.main-navigation-menu li a.active {
  background: #4ad8cc !important;
}

[data-theme='green'] ul.main-navigation-menu li a.active i {
  color: #fff !important;
}

[data-theme='green'] .fullpage-loading .sk-circle .sk-child:before {
  background: #26b0a4 !important;
}

[data-theme='green'] .fullpage-loading .text {
  color: #26b0a4 !important;
}

[data-theme='green'] .magic-checkbox:checked+label:before {
  border: #26b0a4 !important;
  background: #26b0a4 !important;
}

[data-theme='green'] .magic-radio:checked+label:before {
  border: 1px solid #26b0a4 !important;
}

[data-theme='green'] .magic-radio+label:after {
  background: #26b0a4 !important;
}

[data-theme='green'] .btn-checkbox:hover,
[data-theme='green'] .btn-checkbox:focus,
[data-theme='green'] .btn-checkbox:active {
  border-color: #26b0a4 !important;
}

[data-theme='green'] .btn-checkbox.active {
  background: #26b0a4 !important;
  border-color: #26b0a4 !important;
}

[data-theme='red'] ::-moz-selection {
  background: #ff6360;
}

[data-theme='red'] ::selection {
  background: #ff6360;
}

[data-theme='red'] .topbar {
  background: #ff6360;
}

[data-theme='red'] .switch-btn {
  background: #ff6360;
}

[data-theme='red'] .switch-btn:hover {
  background: #ff3b37;
  color: #fff;
}

@media (min-width: 767px) {
  [data-theme='red'] .topbar-tools .software.dark-bg {
    background: #ff3b37 !important;
  }
}

[data-theme='red'] .topNavMenu .navbar-right>li>a {
  color: #ff6360 !important;
}

[data-theme='red'] .topNavMenu .navbar-right>li>a:hover {
  background: #ffefef;
  border: 1px solid #ffb3b2;
}

[data-theme='red'] .topNavMenu .navbar-right>li>a i {
  color: #ff6360 !important;
}

[data-theme='red'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a {
  color: #ff6360 !important;
}

[data-theme='red'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover {
  background: #ffefef;
  border: 1px solid #ffb3b2;
}

[data-theme='red'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a i {
  color: #ff6360 !important;
}

[data-theme='red'] .breadcrumb a {
  color: #ff6360;
}

[data-theme='red'] .categories-title {
  color: #ff6360;
}

[data-theme='red'] .multi-select .select-number,
[data-theme='red'] .multi-select .dropdown-title,
[data-theme='red'] .multi-select .dropdown-item.store-delete p {
  color: #ff6360 !important;
}

[data-theme='red'] .btn-switchPage .btn,
[data-theme='red'] .btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [data-theme='red'] .btn-switchPage .ag-paging-button {
  color: #ff6360;
}

[data-theme='red'] .dropdown-menu.dropdown-light:before {
  border-bottom-color: #ff6360;
}

[data-theme='red'] .dropdown-menu,
[data-theme='red'] .multi-select .dropdown-item.store-delete {
  border-color: #ff3b37 !important;
}

[data-theme='red'] .multi-select .dropdown-item.store-plus {
  background: #ff6360 !important;
}

[data-theme='red'] textarea:focus,
[data-theme='red'] select:focus,
[data-theme='red'] input[type="text"]:focus,
[data-theme='red'] input[type="password"]:focus,
[data-theme='red'] input[type="datetime"]:focus,
[data-theme='red'] input[type="datetime-local"]:focus,
[data-theme='red'] input[type="date"]:focus,
[data-theme='red'] input[type="month"]:focus,
[data-theme='red'] input[type="time"]:focus,
[data-theme='red'] input[type="week"]:focus,
[data-theme='red'] input[type="number"]:focus,
[data-theme='red'] input[type="email"]:focus,
[data-theme='red'] input[type="url"]:focus,
[data-theme='red'] input[type="search"]:focus,
[data-theme='red'] input[type="tel"]:focus,
[data-theme='red'] input[type="color"]:focus {
  border-color: #ff3b37 !important;
}

[data-theme='red'] #pageslide-left .user-profile .user-options {
  color: #ff6360 !important;
}

[data-theme='red'] #pageslide-left .user-profile .user-options:hover {
  background: #ffefef;
  border: 1px solid #ffb3b2;
}

@media (min-width: 767px) {
  [data-theme='red'].sidebar-close #pageslide-left .navigation-toggler .sb-toggle-left:before {
    color: #ff6360 !important;
  }

  [data-theme='red'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:before {
    color: #ff6360 !important;
  }

  [data-theme='red'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover {
    background: #ffaead !important;
    color: #fff;
  }

  [data-theme='red'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover:before {
    color: #fff !important;
  }
}

[data-theme='red'] #pageslide-left .alone [aria-selected='true'] a {
  background: #ffaead !important;
}

[data-theme='red'] #pageslide-left .alone [aria-selected='true'] a i {
  color: #fff !important;
}

[data-theme='red'] ul.main-navigation-menu li a i {
  color: #ff6360 !important;
}

[data-theme='red'] ul.main-navigation-menu li a.active {
  background: #ffaead !important;
}

[data-theme='red'] ul.main-navigation-menu li a.active i {
  color: #fff !important;
}

[data-theme='red'] .fullpage-loading .sk-circle .sk-child:before {
  background: #ff6360 !important;
}

[data-theme='red'] .fullpage-loading .text {
  color: #ff6360 !important;
}

[data-theme='red'] .magic-checkbox:checked+label:before {
  border: #ff6360 !important;
  background: #ff6360 !important;
}

[data-theme='red'] .magic-radio:checked+label:before {
  border: 1px solid #ff6360 !important;
}

[data-theme='red'] .magic-radio+label:after {
  background: #ff6360 !important;
}

[data-theme='red'] .btn-checkbox:hover,
[data-theme='red'] .btn-checkbox:focus,
[data-theme='red'] .btn-checkbox:active {
  border-color: #ff6360 !important;
}

[data-theme='red'] .btn-checkbox.active {
  background: #ff6360 !important;
  border-color: #ff6360 !important;
}

[data-theme='gray'] ::-moz-selection {
  background: #607d8b;
}

[data-theme='gray'] ::selection {
  background: #607d8b;
}

[data-theme='gray'] .topbar {
  background: #607d8b;
}

[data-theme='gray'] .switch-btn {
  background: #607d8b;
}

[data-theme='gray'] .switch-btn:hover {
  background: #4f6773;
  color: #fff;
}

@media (min-width: 767px) {
  [data-theme='gray'] .topbar-tools .software.dark-bg {
    background: #4f6773 !important;
  }
}

[data-theme='gray'] .topNavMenu .navbar-right>li>a {
  color: #607d8b !important;
}

[data-theme='gray'] .topNavMenu .navbar-right>li>a:hover {
  background: #f0f3f5;
  border: 1px solid #abbcc5;
}

[data-theme='gray'] .topNavMenu .navbar-right>li>a i {
  color: #607d8b !important;
}

[data-theme='gray'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a {
  color: #607d8b !important;
}

[data-theme='gray'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover {
  background: #f0f3f5;
  border: 1px solid #abbcc5;
}

[data-theme='gray'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a i {
  color: #607d8b !important;
}

[data-theme='gray'] .breadcrumb a {
  color: #607d8b;
}

[data-theme='gray'] .categories-title {
  color: #607d8b;
}

[data-theme='gray'] .multi-select .select-number,
[data-theme='gray'] .multi-select .dropdown-title,
[data-theme='gray'] .multi-select .dropdown-item.store-delete p {
  color: #607d8b !important;
}

[data-theme='gray'] .btn-switchPage .btn,
[data-theme='gray'] .btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [data-theme='gray'] .btn-switchPage .ag-paging-button {
  color: #607d8b;
}

[data-theme='gray'] .dropdown-menu.dropdown-light:before {
  border-bottom-color: #607d8b;
}

[data-theme='gray'] .dropdown-menu,
[data-theme='gray'] .multi-select .dropdown-item.store-delete {
  border-color: #4f6773 !important;
}

[data-theme='gray'] .multi-select .dropdown-item.store-plus {
  background: #607d8b !important;
}

[data-theme='gray'] textarea:focus,
[data-theme='gray'] select:focus,
[data-theme='gray'] input[type="text"]:focus,
[data-theme='gray'] input[type="password"]:focus,
[data-theme='gray'] input[type="datetime"]:focus,
[data-theme='gray'] input[type="datetime-local"]:focus,
[data-theme='gray'] input[type="date"]:focus,
[data-theme='gray'] input[type="month"]:focus,
[data-theme='gray'] input[type="time"]:focus,
[data-theme='gray'] input[type="week"]:focus,
[data-theme='gray'] input[type="number"]:focus,
[data-theme='gray'] input[type="email"]:focus,
[data-theme='gray'] input[type="url"]:focus,
[data-theme='gray'] input[type="search"]:focus,
[data-theme='gray'] input[type="tel"]:focus,
[data-theme='gray'] input[type="color"]:focus {
  border-color: #4f6773 !important;
}

[data-theme='gray'] #pageslide-left .user-profile .user-options {
  color: #607d8b !important;
}

[data-theme='gray'] #pageslide-left .user-profile .user-options:hover {
  background: #f0f3f5;
  border: 1px solid #abbcc5;
}

@media (min-width: 767px) {
  [data-theme='gray'].sidebar-close #pageslide-left .navigation-toggler .sb-toggle-left:before {
    color: #607d8b !important;
  }

  [data-theme='gray'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:before {
    color: #607d8b !important;
  }

  [data-theme='gray'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover {
    background: #8aa2ae !important;
    color: #fff;
  }

  [data-theme='gray'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover:before {
    color: #fff !important;
  }
}

[data-theme='gray'] #pageslide-left .alone [aria-selected='true'] a {
  background: #8aa2ae !important;
}

[data-theme='gray'] #pageslide-left .alone [aria-selected='true'] a i {
  color: #fff !important;
}

[data-theme='gray'] ul.main-navigation-menu li a i {
  color: #607d8b !important;
}

[data-theme='gray'] ul.main-navigation-menu li a.active {
  background: #8aa2ae !important;
}

[data-theme='gray'] ul.main-navigation-menu li a.active i {
  color: #fff !important;
}

[data-theme='gray'] .fullpage-loading .sk-circle .sk-child:before {
  background: #607d8b !important;
}

[data-theme='gray'] .fullpage-loading .text {
  color: #607d8b !important;
}

[data-theme='gray'] .magic-checkbox:checked+label:before {
  border: #607d8b !important;
  background: #607d8b !important;
}

[data-theme='gray'] .magic-radio:checked+label:before {
  border: 1px solid #607d8b !important;
}

[data-theme='gray'] .magic-radio+label:after {
  background: #607d8b !important;
}

[data-theme='gray'] .btn-checkbox:hover,
[data-theme='gray'] .btn-checkbox:focus,
[data-theme='gray'] .btn-checkbox:active {
  border-color: #607d8b !important;
}

[data-theme='gray'] .btn-checkbox.active {
  background: #607d8b !important;
  border-color: #607d8b !important;
}

[data-theme='blue2'] ::-moz-selection {
  background: #2d41ac;
}

[data-theme='blue2'] ::selection {
  background: #2d41ac;
}

[data-theme='blue2'] .topbar {
  background: #2d41ac;
}


[data-theme='blue2'] .switch-btn {
  background: #2d41ac;
}

[data-theme='blue2'] .switch-btn:hover {
  background: #25358c;
  color: #fff;
}

@media (min-width: 767px) {
  [data-theme='blue2'] .topbar-tools .software.dark-bg {
    background: #25358c !important;
  }
}

[data-theme='blue2'] .topNavMenu .navbar-right>li>a {
  color: #2d41ac !important;
}

[data-theme='blue2'] .topNavMenu .navbar-right>li>a:hover {
  background: #edeffa;
  border: 1px solid #808fde;
}

[data-theme='blue2'] .topNavMenu .navbar-right>li>a i {
  color: #2d41ac !important;
}

[data-theme='blue2'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a {
  color: #2d41ac !important;
}

[data-theme='blue2'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover {
  background: #edeffa;
  border: 1px solid #808fde;
}

[data-theme='blue2'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a i {
  color: #2d41ac !important;
}

[data-theme='blue2'] .breadcrumb a {
  color: #2d41ac;
}

[data-theme='blue2'] .categories-title {
  color: #2d41ac;
}

[data-theme='blue2'] .multi-select .select-number,
[data-theme='blue2'] .multi-select .dropdown-title,
[data-theme='blue2'] .multi-select .dropdown-item.store-delete p {
  color: #2d41ac !important;
}

[data-theme='blue2'] .btn-switchPage .btn,
[data-theme='blue2'] .btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [data-theme='blue2'] .btn-switchPage .ag-paging-button {
  color: #2d41ac;
}

[data-theme='blue2'] .dropdown-menu.dropdown-light:before {
  border-bottom-color: #2d41ac;
}

[data-theme='blue2'] .dropdown-menu,
[data-theme='blue2'] .multi-select .dropdown-item.store-delete {
  border-color: #25358c !important;
}

[data-theme='blue2'] .multi-select .dropdown-item.store-plus {
  background: #2d41ac !important;
}


[data-theme='blue2'] textarea:focus,
[data-theme='blue2'] select:focus,
[data-theme='blue2'] input[type="text"]:focus,
[data-theme='blue2'] input[type="password"]:focus,
[data-theme='blue2'] input[type="datetime"]:focus,
[data-theme='blue2'] input[type="datetime-local"]:focus,
[data-theme='blue2'] input[type="date"]:focus,
[data-theme='blue2'] input[type="month"]:focus,
[data-theme='blue2'] input[type="time"]:focus,
[data-theme='blue2'] input[type="week"]:focus,
[data-theme='blue2'] input[type="number"]:focus,
[data-theme='blue2'] input[type="email"]:focus,
[data-theme='blue2'] input[type="url"]:focus,
[data-theme='blue2'] input[type="search"]:focus,
[data-theme='blue2'] input[type="tel"]:focus,
[data-theme='blue2'] input[type="color"]:focus {
  border-color: #25358c !important;
}

[data-theme='blue2'] #pageslide-left .user-profile .user-options {
  color: #2d41ac !important;
}

[data-theme='blue2'] #pageslide-left .user-profile .user-options:hover {
  background: #edeffa;
  border: 1px solid #808fde;
}

@media (min-width: 767px) {
  [data-theme='blue2'].sidebar-close #pageslide-left .navigation-toggler .sb-toggle-left:before {
    color: #2d41ac !important;
  }

  [data-theme='blue2'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:before {
    color: #2d41ac !important;
  }

  [data-theme='blue2'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover {
    background: #5367d2 !important;
    color: #fff;
  }

  [data-theme='blue2'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover:before {
    color: #fff !important;
  }
}

[data-theme='blue2'] #pageslide-left .alone [aria-selected='true'] a {
  background: #5367d2 !important;
}

[data-theme='blue2'] #pageslide-left .alone [aria-selected='true'] a i {
  color: #fff !important;
}

[data-theme='blue2'] ul.main-navigation-menu li a i {
  color: #2d41ac !important;
}

[data-theme='blue2'] ul.main-navigation-menu li a.active {
  background: #5367d2 !important;
}

[data-theme='blue2'] ul.main-navigation-menu li a.active i {
  color: #fff !important;
}

[data-theme='blue2'] .fullpage-loading .sk-circle .sk-child:before {
  background: #2d41ac !important;
}

[data-theme='blue2'] .fullpage-loading .text {
  color: #2d41ac !important;
}

[data-theme='blue2'] .magic-checkbox:checked+label:before {
  border: #2d41ac !important;
  background: #2d41ac !important;
}

[data-theme='blue2'] .magic-radio:checked+label:before {
  border: 1px solid #2d41ac !important;
}

[data-theme='blue2'] .magic-radio+label:after {
  background: #2d41ac !important;
}

[data-theme='blue2'] .btn-checkbox:hover,
[data-theme='blue2'] .btn-checkbox:focus,
[data-theme='blue2'] .btn-checkbox:active {
  border-color: #2d41ac !important;
}

[data-theme='blue2'] .btn-checkbox.active {
  background: #2d41ac !important;
  border-color: #2d41ac !important;
}

[data-theme='purple'] ::-moz-selection {
  background: #9f41bd;
}

[data-theme='purple'] ::selection {
  background: #9f41bd;
}

[data-theme='purple'] .topbar {
  background: #9f41bd;
}


[data-theme='purple'] .switch-btn {
  background: #9f41bd;
}

[data-theme='purple'] .switch-btn:hover {
  background: #85379f;
  color: #fff;
}

@media (min-width: 767px) {
  [data-theme='purple'] .topbar-tools .software.dark-bg {
    background: #85379f !important;
  }
}

[data-theme='purple'] .topNavMenu .navbar-right>li>a {
  color: #9f41bd !important;
}

[data-theme='purple'] .topNavMenu .navbar-right>li>a:hover {
  background: #f7effa;
  border: 1px solid #d1a3df;
}

[data-theme='purple'] .topNavMenu .navbar-right>li>a i {
  color: #9f41bd !important;
}

[data-theme='purple'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a {
  color: #9f41bd !important;
}

[data-theme='purple'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a:hover {
  background: #f7effa;
  border: 1px solid #d1a3df;
}

[data-theme='purple'] .topNavMenu .navbar-right>li .dropdown-toolbar-teach>a i {
  color: #9f41bd !important;
}

[data-theme='purple'] .breadcrumb a {
  color: #9f41bd;
}

[data-theme='purple'] .categories-title {
  color: #9f41bd;
}

[data-theme='purple'] .multi-select .select-number,
[data-theme='purple'] .multi-select .dropdown-title,
[data-theme='purple'] .multi-select .dropdown-item.store-delete p {
  color: #9f41bd !important;
}

[data-theme='purple'] .btn-switchPage .btn,
[data-theme='purple'] .btn-switchPage .ag-fresh .ag-paging-panel .ag-paging-page-summary-panel .ag-paging-button,
.ag-fresh .ag-paging-panel .ag-paging-page-summary-panel [data-theme='purple'] .btn-switchPage .ag-paging-button {
  color: #9f41bd;
}

[data-theme='purple'] .dropdown-menu.dropdown-light:before {
  border-bottom-color: #9f41bd;
}

[data-theme='purple'] .dropdown-menu,
[data-theme='purple'] .multi-select .dropdown-item.store-delete {
  border-color: #85379f !important;
}

[data-theme='purple'] .multi-select .dropdown-item.store-plus {
  background: #85379f !important;
}



[data-theme='purple'] textarea:focus,
[data-theme='purple'] select:focus,
[data-theme='purple'] input[type="text"]:focus,
[data-theme='purple'] input[type="password"]:focus,
[data-theme='purple'] input[type="datetime"]:focus,
[data-theme='purple'] input[type="datetime-local"]:focus,
[data-theme='purple'] input[type="date"]:focus,
[data-theme='purple'] input[type="month"]:focus,
[data-theme='purple'] input[type="time"]:focus,
[data-theme='purple'] input[type="week"]:focus,
[data-theme='purple'] input[type="number"]:focus,
[data-theme='purple'] input[type="email"]:focus,
[data-theme='purple'] input[type="url"]:focus,
[data-theme='purple'] input[type="search"]:focus,
[data-theme='purple'] input[type="tel"]:focus,
[data-theme='purple'] input[type="color"]:focus {
  border-color: #85379f !important;
}

[data-theme='purple'] #pageslide-left .user-profile .user-options {
  color: #9f41bd !important;
}

[data-theme='purple'] #pageslide-left .user-profile .user-options:hover {
  background: #f7effa;
  border: 1px solid #d1a3df;
}

@media (min-width: 767px) {
  [data-theme='purple'].sidebar-close #pageslide-left .navigation-toggler .sb-toggle-left:before {
    color: #9f41bd !important;
  }

  [data-theme='purple'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:before {
    color: #9f41bd !important;
  }

  [data-theme='purple'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover {
    background: #bc79d1 !important;
    color: #fff;
  }

  [data-theme='purple'].sidebar-close #pageslide-left ul.main-navigation-menu li .sub-menu a:hover:before {
    color: #fff !important;
  }
}

[data-theme='purple'] #pageslide-left .alone [aria-selected='true'] a {
  background: #bc79d1 !important;
}

[data-theme='purple'] #pageslide-left .alone [aria-selected='true'] a i {
  color: #fff !important;
}

[data-theme='purple'] ul.main-navigation-menu li a i {
  color: #9f41bd !important;
}

[data-theme='purple'] ul.main-navigation-menu li a.active {
  background: #bc79d1 !important;
}

[data-theme='purple'] ul.main-navigation-menu li a.active i {
  color: #fff !important;
}

[data-theme='purple'] .fullpage-loading .sk-circle .sk-child:before {
  background: #9f41bd !important;
}

[data-theme='purple'] .fullpage-loading .text {
  color: #9f41bd !important;
}

[data-theme='purple'] .magic-checkbox:checked+label:before {
  border: #9f41bd !important;
  background: #9f41bd !important;
}

[data-theme='purple'] .magic-radio:checked+label:before {
  border: 1px solid #9f41bd !important;
}

[data-theme='purple'] .magic-radio+label:after {
  background: #9f41bd !important;
}

[data-theme='purple'] .btn-checkbox:hover,
[data-theme='purple'] .btn-checkbox:focus,
[data-theme='purple'] .btn-checkbox:active {
  border-color: #9f41bd !important;
}

[data-theme='purple'] .btn-checkbox.active {
  background: #9f41bd !important;
  border-color: #9f41bd !important;
}

@media print {
  body {
    background-color: #fff !important;
  }

  .topNavMenu {
    display: none;
  }

  .navbar {
    display: none;
  }

  .main-navigation {
    display: none;
  }

  .hidden-print {
    display: none;
  }

  .breadcrumb {
    display: none;
  }

  .toolbar {
    display: none;
  }

  .page-header {
    display: none;
  }

  footer,
  .footer {
    display: none;
  }

  .footer-inner {
    display: none;
  }

  .main-container {
    margin: 0 !important;
    padding: 0 !important;
  }

  .main-content .container {
    min-height: 0 !important;
    border: none !important;
  }
}

/* ---------------------------------------------------------------------- */
/*  crm-dashboard
/* ---------------------------------------------------------------------- */

/* crm儀表板選單 */

.crm-dash .nav-tabs-style1>li.active>a,
.crm-dash .nav-tabs-style1>li.active>a:hover,
.crm-dash .nav-tabs-style1>li.active>a:active,
.crm-dash .nav-tabs-style1>li.active>a:focus {
  color: #0c8f4f;
  background-color: #ededed;
  border: none;
  border-bottom: 5px solid #0c8f4f;
}

.crm-dash .nav-tabs a {
  color: #666;
  font-size: 15px !important;
}

[data-theme='blue'] .crm-dash .nav-tabs-style1>li.active>a,
[data-theme='blue'] .crm-dash .nav-tabs-style1>li.active>a:hover,
[data-theme='blue'] .crm-dash .nav-tabs-style1>li.active>a:active,
[data-theme='blue'] .crm-dash .nav-tabs-style1>li.active>a:focus {
  color: #0a7eda;
  border-bottom: 5px solid #0a7eda;
}

[data-theme='purple'] .crm-dash .nav-tabs-style1>li.active>a,
[data-theme='purple'] .crm-dash .nav-tabs-style1>li.active>a:hover,
[data-theme='purple'] .crm-dash .nav-tabs-style1>li.active>a:active,
[data-theme='purple'] .crm-dash .nav-tabs-style1>li.active>a:focus {
  color: #885798;
  border-bottom: 5px solid #885798;
}

[data-theme='orange'] .crm-dash .nav-tabs-style1>li.active>a,
[data-theme='orange'] .crm-dash .nav-tabs-style1>li.active>a:hover,
[data-theme='orange'] .crm-dash .nav-tabs-style1>li.active>a:active,
[data-theme='orange'] .crm-dash .nav-tabs-style1>li.active>a:focus {
  color: #ff5a00;
  border-bottom: 5px solid #ff5a00;
}

[data-theme='green'] .crm-dash .nav-tabs-style1>li.active>a,
[data-theme='green'] .crm-dash .nav-tabs-style1>li.active>a:hover,
[data-theme='green'] .crm-dash .nav-tabs-style1>li.active>a:active,
[data-theme='green'] .crm-dash .nav-tabs-style1>li.active>a:focus {
  color: #26b0a4;
  border-bottom: 5px solid #26b0a4;
}

[data-theme='gray'] .crm-dash .nav-tabs-style1>li.active>a,
[data-theme='gray'] .crm-dash .nav-tabs-style1>li.active>a:hover,
[data-theme='gray'] .crm-dash .nav-tabs-style1>li.active>a:active,
[data-theme='gray'] .crm-dash .nav-tabs-style1>li.active>a:focus {
  color: #607d8b;
  border-bottom: 5px solid #607d8b;
}

[data-theme='blue2'] .crm-dash .nav-tabs-style1>li.active>a,
[data-theme='blue2'] .crm-dash .nav-tabs-style1>li.active>a:hover,
[data-theme='blue2'] .crm-dash .nav-tabs-style1>li.active>a:active,
[data-theme='blue2'] .crm-dash .nav-tabs-style1>li.active>a:focus {
  color: #2d41ac;
  border-bottom: 5px solid #2d41ac;
}

[data-theme='red'] .crm-dash .nav-tabs-style1>li.active>a,
[data-theme='red'] .crm-dash .nav-tabs-style1>li.active>a:hover,
[data-theme='red'] .crm-dash .nav-tabs-style1>li.active>a:active,
[data-theme='red'] .crm-dash .nav-tabs-style1>li.active>a:focus {
  color: #ff6360;
  border-bottom: 5px solid #ff6360;
}

/* crm下拉式選單無底色 */

.casdash select,
.cper-dash select,
.salestargetrate select {
  background: unset !important;
}


/* 儀錶板流程圖切換按鈕 */

.btn-switchPage i.icon14-1-crmdash {
  font-size: 16px;
}

.csaledash .btn-switchPage .btn {
  padding: 2px 14px !important;
}

.csaledash .btn-switchPage .icon14-1-crmflow {
  font-size: 13px;
}

/*
[data-theme='purple'] .crm-dash .nav-tabs-style1 > li.active > a,[data-theme='purple'] .crm-dash .nav-tabs-style1 > li.active > a:hover,[data-theme='purple'] .crm-dash .nav-tabs-style1 > li.active > a:active,[data-theme='purple'] .crm-dash .nav-tabs-style1 > li.active > a:focus {
  color: #9f41bd;
  background-color: #ededed;
  border: none;
  border-bottom: 5px solid #9f41bd;
} */

/* CRM個人儀表板 */

.container.csaledash {
  padding: 0;
}

.csaledash .dash-block {
  min-height: 120px;
  border-radius: 5px !important;
}

.csaledash .panel,
.casdash .panel,
.cper-dash .panel {
  margin: 0 0 20px;
}

.csaledash .dash-block .panel-title {
  font-weight: bold;
  color: #fff;
  text-align: center !important;
  margin: 0 auto 5px !important;
  font-size: 18px;
  letter-spacing: 4px;
  margin-left: 3px !important;
}


.Sch.panel-heading {
  padding: 0;
  width: 100%;
  display: inline-block;
  margin-left: 10px;
  font-size: 16px;
}

.D_Sch.row {
  min-height: 35px;
  display: flex;
  align-items: center;
  border-bottom: 2px solid #fff;
  padding-right: 5px !important;
}

.D_Sch:hover {
  /* border-bottom: 2px solid #e6e6e6; */
  color: #2d2d2d !important;
  font-weight: bold !important;
  cursor: pointer;
}


.D_Sch {
  color: #777777 !important;
  font-weight: bold !important;
}

.D_Sch .pull-left {
  min-width: 45%;
}

.title-icon-wrap {
  display: inline-block;
  width: 34%;
  max-width: 110px;
  padding: 0 !important;
  background-color: #e65d5e;
  height: 120px;
  padding-top: 25px !important;
  border-radius: 5px 0 0 5px;
}

.infotext-wrap {
  /* width: 63%; */
  height: 120px;
  display: flex !important;
  align-items: center;
  padding-right: 15px;
}

.title-icon-wrap .dash-icon {
  width: 100%;
  color: #fff;
  font-size: 24px;
  text-align: center;
}

.title-icon-wrap .dash-icon:before {
  border-radius: 5px;
  display: inline-block;
}

.newc .title-icon-wrap {
  background-color: #00adb8;
}

.crmopp .title-icon-wrap {
  background-color: #ffb852;
  text-shadow: none;
}

.oilfee .title-icon-wrap {
  background-color: #89a0ab;
  text-shadow: none;
}

.csaledash .dash-block.oilfee {
  margin-right: 0 !important;
}



@media (max-width: 991px) {
  .D_Sch.row {
    display: block;
    margin-right: 20px !important;
    line-height: 35px;
  }
}


/* 銷售達成率、商機漏斗調整 */
.salerate .panel,
.oppfunnel .panel {
  border-radius: 5px 5px 0 0;
}

.salerate .panel-heading,
.oppfunnel .panel-heading {
  /* background-color: #0bb060; */
  color: #fff;
  border-top-left-radius: 5px !important;
  border-top-right-radius: 5px !important;
}

.salerate .panel-body {
  align-items: center;
  display: flex;
}

.salerate-block {
  font-size: 16px;
  line-height: 2.5;
  min-width: 175px;
}

.salerate-block .cp-target {
  min-width: 175px;
  padding: 0 3px;
}

@media (max-width: 991px) {
  .salerate .panel-body {
    display: block;
    height: auto !important;
    text-align: center;
  }


}

.casdash h4.panel-title,
.cper-dash h4.panel-title,
.salerate .panel-heading .panel-title,
.oppfunnel .panel-heading .panel-title {
  font-weight: bold;
  letter-spacing: 2px;
}


/* CRM業務活動 */
/* CRM業務活動-block1 本月概況 */
.casdash .D_Sch_number {
  font-size: 26px;
  font-weight: bold !important;
}

.new-c .panel,
.new-o .panel,
.un-o .panel,
.sum-o .panel {
  background: #02adb8;
  color: #fff;
}

.casdash .table-ng-ui-grid {
  border: none;
}

.casdash .casadash-icon {
  font-size: 20px;
  color: #01adb8;
  background-color: #fff;
  border-radius: 50%;
  width: 40px;
  height: 40px;
  line-height: 40px;
  margin-top: 10px;
  margin-right: 10px;
}

.casdash .dash-block .panel-title {
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 1px;
}

.casdash .panel,
.csaledash .panel {
  border-radius: 5px 5px 0 0;
  margin: 0 0 10px !important;
  margin-left: 0 !important;
  margin-right: 10px !important;
  min-height: auto;
}

.casdash .panel.dash-block {
  padding: 10px 20px;
  min-height: 84px;
}

.crm-dash .funnelContainer {
  padding: 60px 0 80px;
}

.casdash .D_Sch_number:hover {
  cursor: pointer !important;
}

/* 針對個人儀表rwd */
@media (max-width: 1200px) {
  .csaledash .panel {
    margin-right: 0px !important;
  }
}

/* CRM業務活動-block2排行榜 */

.casdash select {
  padding-right: 0 !important;
}

.casdash .btn {
  padding: 2px 5px !important;
}

.casdash .fa-chevron-right:before,
.casdash .fa-chevron-left:before {
  font-size: 10px;
}

.casdash .table-ng-ui-grid td,
.cper-dash .table-ng-ui-grid td {
  border: none;
  text-align: center;
}

.crm-dash .table-ng-ui-grid th.text-right,
.crm-dash .table-ng-ui-grid td.text-right {
  text-align: right !important;
  padding: 6px !important;
}

.crm-dash .table-ng-ui-grid th.text-left-first,
.crm-dash .table-ng-ui-grid td.text-left-first {
  text-align: left !important;
  padding: 6px 6px 6px 30px !important;
}

.crm-dash .table-ng-ui-grid th.text-right-last,
.crm-dash .table-ng-ui-grid td.text-right-last {
  text-align: right !important;
  padding: 6px 30px 6px 6px !important;
}

.crm-dash .table-ng-ui-grid th.text-left,
.crm-dash .table-ng-ui-grid td.text-left {
  text-align: left !important;
  padding: 6px !important;
}

.crm-dash .hover-deep tr:hover {
  background-color: #ececec !important;
}

.casdash .table-ng-ui-grid td:hover,
.cper-dash .table-ng-ui-grid td:hover {
  cursor: pointer;
}

/* 20210621調整 */

.new-c .panel {
  background-color: #e65d5e;
}

.new-c .casadash-icon {
  color: #e65d5e;
}

.new-o .panel {
  background-color: #00adb8;
}

.new-o .icon14-1-crmnewopp.casadash-icon {
  color: #00adb8;
}

.un-o .panel {
  background-color: #ffb852;
}

.un-o .icon14-1-crmunopp.casadash-icon {
  color: #ffb852;
}

.sum-o .panel {
  background-color: #89a0ab;
}

.sum-o .icon14-1-crmsumopp.casadash-icon {
  color: #89a0ab;
}


.casdash .panel-heading,
.cper-dash .panel-heading {
  /* background-color: #0bb060; */
  color: #fff !important;
  letter-spacing: 0px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  min-height: auto;
}


/*
.casdash button.btn, .salestargetrate button.btn {
  color: #0c8f4f;
  border: 1px solid #0c8f4f;
} */

.casdash select,
.salestargetrate .select {
  color: #fff;
  padding: 0 5px !important;
  min-width: auto;
}

.casdash select option,
.salestargetrate select option {
  color: #000;
}

.casdash .panel-title .row,
.cper-dash .panel-title .row {
  min-height: 35px;
}

.casdash .panel-heading,
.cper-dash .panel-heading {
  padding: 5px 15px 0;
}


/* 業績 */
.container.cper-dash,
.container.casdash {
  padding: 0;
}

.cper-dash .panel-date {
  display: inline-flex;
  align-self: center;
}

.cper-dash .date-title {
  font-size: 20px;
  padding-bottom: 3px;
  margin-bottom: 10px;
}

.cper-dash .text-block {
  max-width: 180px;
  min-width: 130px;
  align-self: center;
  padding: 0 !important;
}

.cper-dash .cp-target {
  min-height: auto !important;
  padding: 10px 5px;
  display: block;
}

.cp-target-title {
  margin-right: 20px;
}

.cp-target-number i {
  opacity: 0;
  color: #0c8f4f;
  margin-left: 1px;
  border: 0 !important;
}

.cper-dash .cp-target:hover,
.salerate-block .cp-target:hover {
  color: #2d2d2d !important;
  /* font-weight: bold !important; */
  cursor: pointer;
  background-color: #f4f4f4;
}

.cper-dash .cp-target:hover i,
.salerate-block .cp-target:hover i {
  opacity: 1;
}

/*
.cper-dash .funnel {  margin-left: 10vw !important;}
.opport .funnel {  margin-left: 10% !important;}
@media screen and (max-width: 1440px) {
  .cper-dash .funnel {    margin-left: 5vw !important;  }
}

@media screen and (max-width: 1366px) {
  .cper-dash .funnel {    margin-left: 3vw !important;  }

}
@media screen and (max-width: 1200px) {
  .opport .funnel {    margin-left: 1% !important;}
}
@media screen and (max-width: 1024px) {
  .cper-dash .funnel {    margin-left: 20% !important;  }
  .saleopp-block .funnel {    margin-left: 1% !important;  }
}

@media screen and (max-width: 992px) {
  .cper-dash .funnel {    margin-left: 1% !important;  }
  .saleopp-block .funnel {    margin-left: 20% !important;  }
}

@media screen and (max-width: 768px) {
  .cper-dash .funnel {
    margin-left: 1% !important;
  }
}

@media screen and (max-width: 540px) {
  .cper-dash .funnel {
    margin-left: 1% !important;
  }

  .saleopp-block .funnel {
    margin-left: 1% !important;
  }
}
 */


/* 業績表格設定 */

.cper-dash table.table.table-ng-ui-grid,
.casdash table.table.table-ng-ui-grid {
  border: none;
}

.cper-dash .panel {
  border-radius: 5px 5px 0 0;
}


.date-wrap * {
  display: inline-block;
}

.cper-dash .table-ng-ui-grid th,
.casdash .table-ng-ui-grid th {
  border: none !important;
  background: #f3f3f3 !important;
  border-bottom: 1px solid #e0e0e0 !important;
}

.cper-dash .compare-btn.btn {
  height: 30px;
  padding: 4px 10px;
  border-color: #23c6ba;
  color: #23c6ba !important;
}

.cper-dash .btn-group button.btn {
  background-color: #fff;
  opacity: 0.8;
  color: #333333 !important;
}

.cper-dash .btn-group .btn.active,
.cper-dash .btn-group .btn:focus {
  background: rgb(0 0 0 / 30%);
  color: #fff !important;
  border: 1px solid rgb(255 255 255 / 0%);
}

.salestargetrate select.form-control {
  color: #fff;
  padding: 0 5px !important;
  min-width: auto;
}


/* CRM商機 CRM客戶 */
.crm-dash .container.opport,
.crm-dash .container.customer {
  padding: 0 !important;
}

.crm-dash .opport .panel,
.crm-dash .container.customer .panel {
  border-radius: 5px 5px 0 0;
}

.crm-dash .opport .panel.searchbar {
  border-radius: 0 !important;
  background-color: #ededed;
  box-shadow: none !important;
  margin: 5px 0 !important;
}

.crm-dash .opport .panel-heading,
.crm-dash .customer .panel-heading {
  /* background-color: #0bb060; */
  color: #fff;
  border-radius: 5px 5px 0 0;
  letter-spacing: 2px;
}

.crm-dash .opport .panel-title {
  letter-spacing: 2px;
}

.cper-dash .funnel {
  margin-left: 10vw !important;
}

.opport .funnel {
  margin-left: 10% !important;
}

@media screen and (max-width: 1440px) {
  .cper-dash .funnel {
    margin-left: 5vw !important;
  }
}

@media screen and (max-width: 1366px) {
  .cper-dash .funnel {
    margin-left: 3vw !important;
  }

}

@media screen and (max-width: 1200px) {
  .opport .funnel {
    margin-left: 1% !important;
  }
}

@media screen and (max-width: 1024px) {
  .cper-dash .funnel {
    margin-left: 20% !important;
  }

  .saleopp-block .funnel {
    margin-left: 1% !important;
  }
}

@media screen and (max-width: 992px) {
  .cper-dash .funnel {
    margin-left: 1% !important;
  }

  .saleopp-block .funnel {
    margin-left: 20% !important;
  }
}

@media screen and (max-width: 768px) {
  .cper-dash .funnel {
    margin-left: 1% !important;
  }
}

@media screen and (max-width: 540px) {
  .cper-dash .funnel {
    margin-left: 1% !important;
  }

  .saleopp-block .funnel {
    margin-left: 1% !important;
  }
}

.cper-dash .panel-heading,
.casdash .panel-heading,
.crm-dash .opport .panel-heading,
.crm-dash .customer .panel-heading,
.saleopp-block .panel-heading {
  background-color: #43ac79;
}

.cper-dash .salestargetrate button.btn,
.casdash button.btn,
.salestargetrate button.btn {
  color: #ffffff !important;
  border: unset !important;
  background-color: unset !important;
}

[data-theme='blue'] .cper-dash .panel-heading,
[data-theme='blue'] .casdash .panel-heading,
[data-theme='blue'] .crm-dash .opport .panel-heading,
[data-theme='blue'] .crm-dash .customer .panel-heading,
[data-theme='blue'] .saleopp-block .panel-heading {
  background: #0b66af !important;
}

[data-theme='blue'] .cper-dash button.btn,
[data-theme='blue'] .casdash button.btn,
[data-theme='blue'] .crm-dash .customer button.btn,
[data-theme='blue'] .crm-dash .saleopp-block button.btn,
[data-theme='blue'] .cp-target-number i {
  color: #0a7eda;
  border: 1px solid #0a7eda;
}

[data-theme='purple'] .cper-dash .panel-heading,
[data-theme='purple'] .casdash .panel-heading,
[data-theme='purple'] .crm-dash .opport .panel-heading,
[data-theme='purple'] .crm-dash .customer .panel-heading,
[data-theme='purple'] .saleopp-block .panel-heading {
  background-color: #885798;
}

[data-theme='purple'] .cper-dash button.btn,
[data-theme='purple'] .casdash button.btn,
[data-theme='purple'] .crm-dash .customer button.btn,
[data-theme='purple'] .crm-dash .saleopp-block button.btn,
[data-theme='purple'] .cp-target-number i {
  color: #885798;
  border: 1px solid #885798;
}

[data-theme='orange'] .cper-dash .panel-heading,
[data-theme='orange'] .casdash .panel-heading,
[data-theme='orange'] .crm-dash .opport .panel-heading,
[data-theme='orange'] .crm-dash .customer .panel-heading,
[data-theme='orange'] .saleopp-block .panel-heading {
  background: #fd8e52 !important;
}

[data-theme='orange'] .cper-dash button.btn,
[data-theme='orange'] .casdash button.btn,
[data-theme='orange'] .crm-dash .customer button.btn,
[data-theme='orange'] .crm-dash .saleopp-block button.btn,
[data-theme='orange'] .cp-target-number i {
  color: #f1912b;
  border: 1px solid #f1912b;
}

[data-theme='green'] .cper-dash .panel-heading,
[data-theme='green'] .casdash .panel-heading,
[data-theme='green'] .crm-dash .opport .panel-heading,
[data-theme='green'] .crm-dash .customer .panel-heading,
[data-theme='green'] .saleopp-block .panel-heading {
  background: #219a90;
}

[data-theme='green'] .cper-dash button.btn,
[data-theme='green'] .casdash button.btn,
[data-theme='green'] .crm-dash .customer button.btn,
[data-theme='green'] .crm-dash .saleopp-block button.btn,
[data-theme='green'] .cp-target-number i {
  color: #26b0a4;
  border: 1px solid #26b0a4;
}

[data-theme='gray'] .cper-dash .panel-heading,
[data-theme='gray'] .casdash .panel-heading,
[data-theme='gray'] .crm-dash .opport .panel-heading,
[data-theme='gray'] .crm-dash .customer .panel-heading,
[data-theme='gray'] .saleopp-block .panel-heading {
  background: #7e8d94 !important;
}

[data-theme='gray'] .cper-dash button.btn,
[data-theme='gray'] .casdash button.btn,
[data-theme='gray'] .crm-dash .customer button.btn,
[data-theme='gray'] .crm-dash .saleopp-block button.btn,
[data-theme='gray'] .cp-target-number i {
  color: #607d8b;
  border: 1px solid #607d8b;
}

[data-theme='blue2'] .cper-dash .panel-heading,
[data-theme='blue2'] .casdash .panel-heading,
[data-theme='blue2'] .crm-dash .opport .panel-heading,
[data-theme='blue2'] .crm-dash .customer .panel-heading,
[data-theme='blue2'] .saleopp-block .panel-heading {
  background: #33418e;
}

[data-theme='blue2'] .cper-dash button.btn,
[data-theme='blue2'] .casdash button.btn,
[data-theme='blue2'] .crm-dash .customer button.btn,
[data-theme='blue2'] .crm-dash .saleopp-block button.btn,
[data-theme='blue2'] .cp-target-number i {
  color: #2d41ac;
  border: 1px solid #2d41ac;
}


[data-theme='red'] .cper-dash .panel-heading,
[data-theme='red'] .casdash .panel-heading,
[data-theme='red'] .crm-dash .opport .panel-heading,
[data-theme='red'] .crm-dash .customer .panel-heading,
[data-theme='red'] .saleopp-block .panel-heading {
  background: #ea6260;
}

[data-theme='red'] .cper-dash button.btn,
[data-theme='red'] .casdash button.btn,
[data-theme='red'] .crm-dash .customer button.btn,
[data-theme='red'] .crm-dash .saleopp-block button.btn,
[data-theme='red'] .cp-target-number i {
  color: #ff6360;
  border: 1px solid #ff6360;
}


/* 部分共用 */
.csaledash .oppfunnel .panel {
  margin-right: 0 !important;
}

.otherExpenses .nav>li>a {
  line-height: 0.8;
}

/* excelUpload excel資料匯入 */

.content-link-list.excel-import:before {
  width: 387px;
  height: 302px;
  right: 0;
  left: unset;
  opacity: 1;
  background: url(https://a1cdnpoint2.azureedge.net/images/common/excel-import-bg.png) no-repeat;
}

.content-link-list.excel-import {
  max-width: 1000px;
}

.excel-import .process-map .btn-wrap {
  font-size: 1.1em;
}



/* 電商商店設定-蝦皮 */

.project-panel.panel-title-with-bg {
  padding: 0;
}

.project-panel.panel-title-with-bg .panel-heading,
.project-panel.panel-title-with-bg .text-main,
.project-panel.panel-title-with-theme .text-main {
  background-color: #e6fbf1;
  color: #09693a;
  letter-spacing: 2px;
}

.project-panel.panel-title-with-bg .text-main label.panel-title-checkbox {
  color: #09693a;
  letter-spacing: 2px;
  font-size: 18px;
  font-weight: bold;
  background: unset !important;
}

[data-theme='blue'] .project-panel.panel-title-with-bg .panel-heading,
[data-theme='blue'] .project-panel.panel-title-with-bg .text-main,
[data-theme='blue'] .project-panel.panel-title-with-bg .text-main label.panel-title-checkbox,
[data-theme='blue'] .project-panel.panel-title-with-theme .text-main {
  background-color: #e1f2ff;
  color: #0867b3;
}

[data-theme='blue'] .result-list span.include-tag {
  background-color: #e1f2ff !important;
  color: #0867b3 !important;
}



[data-theme='blue'] .text-underLine-main {
  border-bottom: 1px solid #0a7eda;
}

[data-theme='blue'] .switch-menu-button {
  color: #0867b3;
}

[data-theme='blue'] .result-list span.include-keyword {
  color: #0a7eda !important;
}

[data-theme='orange'] .project-panel.panel-title-with-bg .panel-heading,
[data-theme='orange'] .project-panel.panel-title-with-bg .text-main,
[data-theme='orange'] .project-panel.panel-title-with-bg .text-main label.panel-title-checkbox,
[data-theme='orange'] .project-panel.panel-title-with-theme .text-main {
  background-color: #ffefe6;
  color: #ff5b01;
}

[data-theme='orange'] .result-list span.include-tag {
  background-color: #ffefe6 !important;
  color: #ff5b01 !important;
}

[data-theme='orange'] .text-underLine-main {
  border-bottom: 1px solid #ff5a00;
}

[data-theme='orange'] .switch-menu-button {
  color: #ff5b01;
}

[data-theme='orange'] .result-list span.include-keyword {
  color: #ff5a00 !important;
}

[data-theme='green'] .project-panel.panel-title-with-bg .panel-heading,
[data-theme='green'] .project-panel.panel-title-with-bg .text-main,
[data-theme='green'] .project-panel.panel-title-with-bg .text-main label.panel-title-checkbox,
[data-theme='green'] .project-panel.panel-title-with-theme .text-main {
  background-color: #e7fdfb;
  color: #1f8e85;
}

[data-theme='green'] .result-list span.include-tag {
  background-color: #e7fdfb !important;
  color: #1f8e85 !important;
}

[data-theme='green'] .text-underLine-main {
  border-bottom: 1px solid #1f8e85;
}

[data-theme='green'] .switch-menu-button {
  color: #1f8e85;
}

[data-theme='green'] .result-list span.include-keyword {
  color: #26b0a4 !important;
}

[data-theme='red'] .project-panel.panel-title-with-bg .panel-heading,
[data-theme='red'] .project-panel.panel-title-with-bg .text-main,
[data-theme='red'] .project-panel.panel-title-with-bg .text-main label.panel-title-checkbox,
[data-theme='red'] .project-panel.panel-title-with-theme .text-main {
  background-color: #ffe2e1;
  color: #ff3b37;
}

[data-theme='red'] .result-list span.include-tag {
  background-color: #ffe2e1 !important;
  color: #ff3b37 !important;
}

[data-theme='red'] .text-underLine-main {
  border-bottom: 1px solid #ff6360;
}

[data-theme='red'] .switch-menu-button {
  color: #ff3b37;
}

[data-theme='red'] .result-list span.include-keyword {
  color: #ff6360 !important;
}

[data-theme='gray'] .project-panel.panel-title-with-bg .panel-heading,
[data-theme='gray'] .project-panel.panel-title-with-bg .text-main,
[data-theme='gray'] .project-panel.panel-title-with-bg .text-main label.panel-title-checkbox,
[data-theme='gray'] .project-panel.panel-title-with-theme .text-main {
  background-color: #e4ebef;
  color: #4f6773;
}

[data-theme='gray'] .result-list span.include-tag {
  background-color: #e4ebef !important;
  color: #4f6773 !important;
}

[data-theme='gray'] .text-underLine-main {
  border-bottom: 1px solid #4f6773;
}

[data-theme='gray'] .switch-menu-button {
  color: #4f6773;
}

[data-theme='gray'] .result-list span.include-keyword {
  color: #607d8b !important;
}


[data-theme='blue2'] .project-panel.panel-title-with-bg .panel-heading,
[data-theme='blue2'] .project-panel.panel-title-with-bg .text-main,
[data-theme='blue2'] .project-panel.panel-title-with-bg .text-main label.panel-title-checkbox,
[data-theme='blue2'] .project-panel.panel-title-with-theme .text-main {
  background-color: #eaedff;
  color: #25358c;
}

[data-theme='blue2'] .result-list span.include-tag {
  background-color: #eaedff !important;
  color: #25358c !important;
}

[data-theme='blue2'] .text-underLine-main {
  border-bottom: 1px solid #25358c;
}

[data-theme='blue2'] .switch-menu-button {
  color: #25358c;
}

[data-theme='blue2'] .result-list span.include-keyword {
  color: #2d41ac !important;
}


[data-theme='purple'] .project-panel.panel-title-with-bg .panel-heading,
[data-theme='purple'] .project-panel.panel-title-with-bg .text-main,
[data-theme='purple'] .project-panel.panel-title-with-bg .text-main label.panel-title-checkbox,
[data-theme='purple'] .project-panel.panel-title-with-theme .text-main {
  background-color: #f7ecfb;
  color: #85379f;
}

[data-theme='purple'] .result-list span.include-tag {
  background-color: #f7ecfb !important;
  color: #85379f !important;
}

[data-theme='purple'] .text-underLine-main {
  border-bottom: 1px solid #85379f;
}

[data-theme='purple'] .switch-menu-button {
  color: #85379f;
}

[data-theme='purple'] .result-list span.include-keyword {
  color: #9f41bd !important;
}

.project-panel.panel-title-with-bg .text-main,
.project-panel.panel-title-with-theme .text-main {
  background-color: unset !important;
}

.project-panel.panel-title-with-bg .panel-heading .panel-title {
  font-weight: bold;
  font-size: 18px;
}

.project-panel.panel-title-with-bg .project-content {
  margin-top: 20px;
}



.tag-wrap {
  border: 1px solid #e6e6e6;
  padding-bottom: 0 !important;
  padding-top: 5px;
  margin-top: -5px;
}

.notice-red {
  white-space: nowrap;
  padding: 8px !important;
  padding-right: 30px !important;
  padding-left: 20px !important;
  color: #ff6360;
  font-size: 17px;
  font-weight: bold;
}

.notice-red-link {
  color: #ff6360;
  font-size: 17px;
  font-weight: bold;
}

.notice-red-link:hover {
  color: rgb(211, 63, 63);
}

.notice.a1pro {
  margin: 0;
}

p.sidebar-menu-title {
  font-size: 18px;
  font-weight: bold;
  color: #595757;
}

.packing-check-img img {
  height: auto;
  width: auto;
  max-width: 130px;
  max-height: 75px;
}

/* .packing-check-img.img-big img {
  max-height: 80px;
  max-width: 100px !important;
} */

.break-all {
  word-break: break-all;
}

.packing-memo {
  min-height: 15px;
}

.packing-memo.packing-memo-h0 {
  height: 0;
  display: none;
}


.contentTopSearch-content.search-switch .tag-wrap {
  padding-top: 0;
  margin-top: 0;
  min-width: 172px;
}


.contentTopSearch-content.search-switch .tag-wrap .badge {
  background: #ebebeb;
  color: #666;
  border-radius: 3px;
  padding: 0px 7px;
  line-height: unset;
}

.contentTopSearch-content.search-switch .tag-wrap .badge:hover {
  background: #e5e5e5;
}

.contentTopSearch-content.search-switch .tag-wrap .btn-group {
  margin: 3px 5px 4px;
  vertical-align: top;
}

.contentTopSearch-content.search-switch .tag-wrap input[type="text"] {
  border: 0;
  border-left: 1px solid #a09999 !important;
  padding: 0;
  padding-left: 5px;
  margin: 6px 0 5px;
}

.contentTopSearch-content.search-switch .tag-wrap input[type="text"]:focus {
  outline: none;
}

.scroll-tabs .tabs-hint {
  display: flex;
  align-items: center;
  padding-bottom: 4px;
  white-space: nowrap;
}

@media (max-width: 1366px) {

  .scroll-tabs {
    flex-flow: nowrap;
    overflow-x: auto;
  }

  .scroll-tabs .tabs-hint {
    white-space: nowrap;
  }


  .scroll-tabs .contentTopSearch-tabs {
    order: 0;
  }

}

@media (max-width: 768px) {
  .scroll-tabs .tabs-hint {
    padding-bottom: 0;
    padding-top: 5px;
  }

}


.ec-tags-block {
  white-space: initial;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
}

.ec-tags-block span {
  background: rgb(12 143 79 / 10%);
  color: #0c8f4f;
  text-overflow: unset !important;
  overflow-wrap: anywhere !important;
  padding: 1px 3px 1px 6px;
  margin: 0 2px;
  line-height: 1.6;
  text-align: center !important;
  border-radius: 3px;
  word-break: break-all !important;
}

.ec-tags-block span.red {
  background: #f7e9e9;
  color: #ff7272;
}

.ec-tags-block span.blue {
  background: #e5f5fd;
  color: #00a0e9;
}

.ec-tags-block span.purple {
  background: #f6e1ff;
  color: #85379f;
}

.ec-tags-block span.gray {
  background: #edf0f1;
  color: #070707;
}

.ec-tags-block span.orange {
  background: #fbffbc;
  color: #fe6d00;
}



/* 新手引導 */

.tthome-btn {
  position: fixed;
  z-index: 999999;
  right: 50px;
  bottom: 50px;
  background: #0c8f4f;
  color: #fff !important;
  font-weight: bold;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  box-shadow: 2px 2px 10px #8b8b8b;
  flex-direction: column;
}

.tthome-btn:hover {
  color: #fff !important;
  background: #086c3b;
  transform: translate(0, 1px);
  animation: 1s;
}

.tthome-btn i {
  margin-top: 2px;
}

.ttshow.modal-backdrop-m {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgb(0, 0, 0, 0.2);
  z-index: 199;
  /* z-index: -1; */
}

.modal-backdrop-m.menu-bg {
  position: absolute;
  z-index: 999;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgb(0, 0, 0, 0.2);
}



.ttshow .highlight,
.ttshow.highlight,
.ttshow app-head-form-tax-type .form-group:last-child {
  z-index: 990;
  background: #fff;
  border-radius: 5px;
  padding-top: 10px;
  margin-top: -10px;
}



.step-hint {
  display: none;
  position: absolute;
  max-width: 330px;
  background: #fff;
  border: 1px solid #c1c1c1;
  z-index: 988;
  border-radius: 10px;
  padding: 20px;
  left: 128px;
  top: 60px;
}


/* 提示框在上 */
.step-hint.top {
  top: -80px;
}

.step-hint.top:before {
  border-width: 13px 10px 0 10px;
  border-color: #ffffff transparent transparent transparent;
  top: unset;
  bottom: -12px;
}

.step-hint.top:after {
  border-width: 13px 12px 0 12px;
  border-color: #c1c1c1 transparent transparent transparent;
  top: unset;
  bottom: -13px;
}


.ttshow.step-hint {
  display: block;
}

.step-title {
  font-size: 18px;
  color: #0c8f4f;
  font-weight: bold;
  margin-bottom: 10px;
  border-bottom: 1px solid #eee;
  padding-bottom: 5px;
}

.step-title i {
  margin-right: 5px;
}

.step-hint:before {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 10px 13px 10px;
  border-color: transparent transparent #ffffff transparent;
  position: absolute;
  top: -12px;
  left: 10px;
  z-index: 10;
}

.step-hint:after {
  content: '';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 12px 13px 12px;
  border-color: transparent transparent #c1c1c1 transparent;
  position: absolute;
  top: -13px;
  left: 8px;
  z-index: 9;
}

.step-hint.step1exp1:before {
  right: 10px;
  left: unset;
}

.step-hint.step1exp1:after {
  right: 8px;
  left: unset;
}

.step-text {
  font-size: 15px;
  line-height: 1.6;
  margin-bottom: 15px;
}

.plus-btn {
  color: #666;
  background: #ebebeb;
  font-size: 20px;
  margin: 0 3px;
  padding: 0px 7px;
  border-radius: 3px;
  border: 1px solid #cacaca;
}

.step-hint .no-btn {
  margin-bottom: 0;
}

.step-hint .title-only {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.step-hint .title-btn {
  margin-bottom: 15px;
}


button.next-btn {
  background: #0c8f4f;
  color: #fff;
  border: 0;
  padding: 3px 10px;
  border-radius: 5px;
  font-size: 15px;
}

button.next-btn i {
  margin-left: 5px;
}

.ttmenu-cover {
  position: absolute;
  width: 325px;
  height: 80px;
  right: 19px;
  z-index: 999;
  top: 36px;
}


/* 快記帳樣式 */

.container-style2 .project-panel {
  background: #edfff6;
}

.container-style2 .form-wrap {
  width: 100%;
  max-width: unset;
  justify-content: space-between;
  display: flex;
  flex-wrap: wrap;
}

/* .container-style2.project-main-container .form-horizontal .form-group {
  min-height: 42px;
} */



.container-style2 app-qa-action {
  width: 100%;
}


/* 頁籤設定 */

.tab-menu-style1 ul.tab-menu-nav {
  list-style: none;
  display: flex;
  font-size: 17px;
  margin-bottom: 0;
  padding-inline-start: 15px;
}

.tab-menu-style1 ul.tab-menu-nav li a {
  margin: 0 15px;
  min-width: 145px;
  min-height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #0c8f4f;
  border-radius: 10px 10px 0 0;
  box-shadow: 3px 3px 6px 0px hsl(0deg 0% 0% / 16%);
}

.tab-menu-style1 ul.tab-menu-nav li a:first-child {
  margin-left: 0;
}

.tab-menu-style1 ul.tab-menu-nav li a {
  color: #fff;
  letter-spacing: 4px;
  font-weight: bold;
}

.tab-menu-style1 ul.tab-menu-nav li a i {
  margin-right: 10px;
  font-size: 20px;
}

.tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a {
  background: #fff !important;
  position: relative;
  box-shadow: none;
}

.tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a:before {
  content: '';
  position: absolute;
  left: 0;
  width: 3px;
  height: 25px;
  background: #0c8f4f;
  z-index: 999;
}

.tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a {
  color: #0c8f4f;
}


/* 內容區塊 */
.container-content-style2 {
  background: #fff;
  margin: 0px 15px;
  padding: 20px 25px 35px;
  z-index: 999;
  position: relative;
  border-radius: 0 20px;
}


.container-content-style2 .form-group label {
  text-align: left;
}

.container-content-style2 .form-group .form-content {
  max-width: 300px;
}

.container-content-style2 .form-control {
  border-radius: 5px !important;
}

.container-content-style2 .form-control.form-control-flex {
  display: unset;
  padding-left: 20px;
}


/* 符號放置在placeholder */
.container-content-style2 .input-addicon {
  position: relative;
  display: inline-block !important;
}

.container-content-style2 .input-icon-left {
  position: absolute;
  left: 10px;
  top: 5px;
}

.container-content-style2 .input-icon-left i {
  color: #0c8f4f;
}


.container-content-style2 .content-group {
  background: #f0fdf7;
  padding: 20px;
  margin: 0 15px;
  max-width: 500px;
  min-width: 300px;
}

.container-content-style2 .dropdown-style2 .input-group {
  max-width: 292px;
  /* display: table !important; */
}

.container-content-style2 .dropdown-style2 .flex-col {
  width: 300px;
}



.container-content-style2 span.symbol.required {
  display: none;
}


.container-style2 .project-panel.bg-white {
  background: #ffffff !important;
}

.container-content-style2 .content-group:first-child {
  margin-left: 0;
}


.container-content-style2 .content-group-title,
.content-group-title {
  font-size: 18px;
  color: #0c8f4f;
  margin-bottom: 25px;
  font-weight: bold;
}


.container-content-style2 .content-group-title i,
.content-group-title i {
  margin-right: 10px;
}

.container-content-style2 .form-group.require .control-label {
  color: #0c8f4f;
  font-weight: bold;
}

/* .container-content-style2 .content-group-wrap {
  margin-left: 25px;
} */



.container-content-style2 .form-group .control-label {
  max-width: 95px;
  min-width: 95px;
}

.container-content-style2 .btn-wrap {
  margin-top: -3px;
  max-width: 302px;
}

.container-content-style2 .btn-checkbox {
  border: dashed 1px;
  color: #0c8f4f;
  font-size: 14px;
  padding: 3px 8px 2px !important;
  margin-top: -1px !important;
}

.container-content-style2 .btn-checkbox.disabled {
  background: #f8f8f8;
  border: 1px solid #e6e6e6;
  color: #a6a6a6;
}

.container-content-style2 .btn-checkbox.active {
  color: #fff !important;
  background: #0c8f4f;
  border-color: #0c8f4f;
}

.container-content-style2 .btn-checkbox:hover {
  border: 1px solid #0c8f4f;
}

.container-content-style2 input[type="radio"]+label {
  margin-left: 0 !important;
}


.project-main-container .container-content-style2 .form-horizontal .memo-input {
  margin-left: 10px !important;
  /* max-width: 1540px; */
  margin: 25px;
}

.container-style2 .full-list {
  color: #999;
  font-size: 14px;
  margin-left: 30px;
}

.container-style2 .full-list i {
  margin-right: 5px;
}



/* 單號移至右上方 */
.container-style2 .form-wrap-bg-w .content-group {
  background: #fff !important;
  padding: 0px 20px;
  margin-left: 0;
}

.container-style2 .form-no {
  width: 475px;
}

.container-style2 .form-no .form-group {
  max-width: 400px;
  width: 100%;
}


.container-style2 .mainContent-footer-btns {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
}

/* 下拉+新增樣式 */

.container-style2 .input-group-btn {
  background: #fff;
}

.container-style2 .input-group-btn button.btn {
  color: #0c8f4f;
  background: #f0fdf7;
}

.container-content-style2 .dropdown-style2 .form-control+.fa-caret-down {
  color: #0c8f4f;
}

.container-style2 select {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%230c8f4f'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat !important;
  background-color: #fff !important;
  background-size: 12px !important;
  background-position: calc(100% - 5px) 10px !important;
  background-repeat: no-repeat !important;
}

.container-content-style2 .dropdown-style2 .form-control {
  border-radius: 5px 0 0 5px !important;
}

.container-content-style2 .has-error .input-group-btn button.btn {
  border-color: #a94442;
}

/* 僅下拉(無新增) */
.container-content-style2 .dropdown-style3 select {
  max-width: 292px;
}

/* 日期移除icon樣式 */
.container-style2 .date-no-icon .input-group-btn {
  display: none;
}

.container-style2 .date-no-icon .input-group {
  width: 100%;
}

/* 移轉的箭頭 */
.container-style2 .arrow {
  font-size: 30px;
  transform: scaleY(1.1);
  display: flex;
  align-self: center;
  color: #b3b3b3;
}


/* 新手模式toggle switch */

.container-style2 .switch-btn {
  position: absolute !important;
  z-index: 999;
  right: 30px;
  top: 20px;
  border: unset;
}

.qa-easymode.checkbox-pt {
  width: 75px;
  height: 26px;
  margin-top: 2px;
  border-radius: 50px;
  position: relative;
}

.qa-easymode.checkbox-pt label {
  border: unset;
  background: #fff;
  /* box-shadow: unset; */
}

.qa-easymode.checkbox-pt .bg {
  background: hsl(0deg 0% 100% / 80%);
  /* -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.5) inset; */
  box-shadow: unset;
}

.qa-easymode.checkbox-pt:after {
  content: '簡易';
  color: #0b884b;
  position: absolute;
  right: 8px;
  z-index: 1;
  font-weight: bold;
  text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.15);
}

.qa-easymode.checkbox-pt:before {
  content: '新手';
  color: #fff;
  position: absolute;
  left: 10px;
  z-index: 1;
  font-weight: bold;
}

.qa-easymode.checkbox-pt input[type=checkbox]:checked+label {
  left: 38px;
}

/* 針對新手模式的行距調整 */
.container-content-style2.qa-easymode-style .form-horizontal .form-group {
  min-height: 48px;
}

.container-content-style2.qa-easymode-style .checkbox-wrap {
  margin-top: 7px;
}

.container-content-style2.qa-easymode-style .checkbox-wrap.checkbox-wrap-top {
  margin: 0;
}

.container-style2 .title-desc {
  font-size: 11px;
  max-width: 85px;
  min-width: 85px;
  position: absolute;
  top: 26px;
  margin-left: 4px;
  line-height: 1.3;
  color: #8b8b8b;
}

/* 快記帳 開帳設定 資金欄位加寬+靠左對齊 */
.qa-form-title-style1 .control-label {
  max-width: 160px;
  text-align: left;
  line-height: 1.1;
}


@media (max-width: 1200px) {
  .container-content-style2 {
    padding: 35px 10px;
  }

  .container-content-style2 .content-group {
    margin: 20px 15px !important;
    max-width: 47%;
  }

  .container-style2 .form-wrap-bg-w .content-group {
    margin: 0 15px !important;
    padding: 0 20px;
  }
}

@media (max-width: 1024px) {
  .container-style2 .form-wrap-bg-w .content-group {
    margin: 0 !important;
    padding: 0;
    margin-left: 30px !important;
  }

  .project-main-container.container-style2 .control-label {
    min-height: 25px;
    max-width: 25px;
  }

  .container-content-style2 .flex-row.form-group {
    margin-bottom: 10px;
  }

}

@media (max-width: 768px) {
  .container-content-style2 .dropdown-style2 .input-group {
    max-width: 100% !important;
  }

  .container-style2 .title-desc {
    top: 20px;
    max-width: unset;
  }

  .container-content-style2.qa-easymode-style .form-group.require .control-label {
    margin-bottom: 10px;
  }

  .container-style2 .form-wrap-bg-w .content-group {
    margin-left: 15px !important;
  }

  .container-style2 .arrow {
    transform: rotateZ(90deg);
    margin: 0 auto;
  }

  .container-content-style2 .dropdown-style3 select {
    max-width: unset;
  }
}


@media (max-width: 640px) {
  .tab-menu-style1 ul.tab-menu-nav {
    font-size: 16px;
  }

  .tab-menu-style1 ul.tab-menu-nav li a {
    min-width: 90px;
    min-height: 40px;
  }

  .container-style2 .switch-btn {
    right: 40px;
    top: 65px;
    z-index: 9999;
  }

  .container-style2 .form-wrap-bg-w .content-group {
    margin-left: 0 !important;
  }

  .container-content-style2 .content-group {
    margin: 20px 0 !important;
  }

  .container-content-style2 .dropdown-style2 .flex-col {
    width: 280px;
  }

  .project-main-container .container-content-style2 .form-horizontal .memo-input {
    margin-left: 0 !important;
  }

  .container-content-style2 .content-group-title,
  .content-group-title {
    margin-left: 10px;
  }

  .container-style2 .title-desc {
    left: 3px;
  }

  .project-main-container.container-style2 .control-label {
    margin-left: 3px;
  }

  .container-content-style2.qa-easymode-style .form-group.require .control-label {
    margin-left: 2px;
  }

}



/* 快記帳顏色設置 */

[data-theme='blue'] .container-style2 .project-panel,
[data-theme='blue'] .container-content-style2 .content-group,
[data-theme='blue'] .container-style2 .input-group-btn button.btn {
  background: #f4f5f7;
}

[data-theme='blue'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a,
[data-theme='blue'] .content-group-title,
[data-theme='blue'] .content-group-title a,
[data-theme='blue'] .container-content-style2 .form-group.require .control-label,
[data-theme='blue'] .container-content-style2 .btn-checkbox,
[data-theme='blue'] .container-content-style2 .input-icon-left i,
[data-theme='blue'] .container-style2 .input-group-btn button.btn,
[data-theme='blue'] .container-content-style2 .dropdown-style2 .form-control+.fa-caret-down,
[data-theme='blue'] .qa-easymode.checkbox-pt:after,
[data-theme='blue'] .content-style2 .text-underLine-main {
  color: #0a7eda;
}

[data-theme='blue'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a:before,
[data-theme='blue'] .tab-menu-style1 ul.tab-menu-nav li a,
[data-theme='blue'] .checkbox-pt input[type=checkbox]:checked~.bg,
[data-theme='blue'] .container-content-style2 .btn-main {
  background-color: #0a7eda;
}

[data-theme='blue'] .container-style2 select {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%230867b3'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat !important;
  background-size: 12px !important;
  background-position: calc(100% - 5px) 10px !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important;
}

[data-theme='blue'] .container-content-style2 .btn-main:hover {
  background-color: #0867b3;
}

[data-theme='blue'] .content-group-title a:hover {
  color: #0867b3;
}


[data-theme='blue'] .condition-wrap button {
  background-color: #0a7eda;
  border: 1px solid #0867b3;
}



[data-theme='orange'] .container-style2 .project-panel,
[data-theme='orange'] .container-content-style2 .content-group,
[data-theme='orange'] .container-style2 .input-group-btn button.btn {
  background: #fdf8f5;
}

[data-theme='orange'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a,
[data-theme='orange'] .content-group-title,
[data-theme='orange'] .content-group-title a,
[data-theme='orange'] .container-content-style2 .form-group.require .control-label,
[data-theme='orange'] .container-content-style2 .btn-checkbox,
[data-theme='orange'] .container-content-style2 .input-icon-left i,
[data-theme='orange'] .container-style2 .input-group-btn button.btn,
[data-theme='orange'] .container-content-style2 .dropdown-style2 .form-control+.fa-caret-down,
[data-theme='orange'] .qa-easymode.checkbox-pt:after,
[data-theme='orange'] .content-style2 .text-underLine-main {
  color: #ff792f;
}

[data-theme='orange'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a:before,
[data-theme='orange'] .tab-menu-style1 ul.tab-menu-nav li a,
[data-theme='orange'] .checkbox-pt input[type=checkbox]:checked~.bg,
[data-theme='orange'] .container-content-style2 .btn-main {
  background-color: #ff792f;
}

[data-theme='orange'] .container-style2 select {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23ff792f'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat !important;
  background-size: 12px !important;
  background-position: calc(100% - 5px) 10px !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important;
}

[data-theme='orange'] .container-content-style2 .btn-main:hover {
  background-color: #d64c00;
}

[data-theme='orange'] .content-group-title a:hover {
  color: #d64c00;
}

[data-theme='orange'] .condition-wrap button {
  background-color: #ff792f;
  border: 1px solid #d64c00;
}



[data-theme='green'] .container-style2 .project-panel,
[data-theme='green'] .container-content-style2 .content-group,
[data-theme='green'] .container-style2 .input-group-btn button.btn {
  background: #eefffd;
}

[data-theme='green'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a,
[data-theme='green'] .content-group-title,
[data-theme='green'] .content-group-title a,
[data-theme='green'] .container-content-style2 .form-group.require .control-label,
[data-theme='green'] .container-content-style2 .btn-checkbox,
[data-theme='green'] .container-content-style2 .input-icon-left i,
[data-theme='green'] .container-style2 .input-group-btn button.btn,
[data-theme='green'] .container-content-style2 .dropdown-style2 .form-control+.fa-caret-down,
[data-theme='green'] .qa-easymode.checkbox-pt:after,
[data-theme='green'] .content-style2 .text-underLine-main {
  color: #26b0a4;
}

[data-theme='green'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a:before,
[data-theme='green'] .tab-menu-style1 ul.tab-menu-nav li a,
[data-theme='green'] .checkbox-pt input[type=checkbox]:checked~.bg,
[data-theme='green'] .container-content-style2 .btn-main {
  background-color: #26b0a4;
}

[data-theme='green'] .container-style2 select {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%2326b0a4'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat !important;
  background-size: 12px !important;
  background-position: calc(100% - 5px) 10px !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important;
}

[data-theme='green'] .container-content-style2 .btn-main:hover {
  background-color: #1f8e85;
}

[data-theme='green'] .content-group-title a:hover {
  color: #1f8e85;
}

[data-theme='green'] .condition-wrap button {
  background-color: #26b0a4;
  border: 1px solid #1f8e85;
}


[data-theme='red'] .container-style2 .project-panel,
[data-theme='red'] .container-content-style2 .content-group,
[data-theme='red'] .container-style2 .input-group-btn button.btn {
  background: #fff5f5;
}

[data-theme='red'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a,
[data-theme='red'] .content-group-title,
[data-theme='red'] .content-group-title a,
[data-theme='red'] .container-content-style2 .form-group.require .control-label,
[data-theme='red'] .container-content-style2 .btn-checkbox,
[data-theme='red'] .container-content-style2 .input-icon i,
[data-theme='red'] .container-style2 .input-group-btn button.btn,
[data-theme='red'] .container-content-style2 .dropdown-style2 .form-control+.fa-caret-down,
[data-theme='red'] .qa-easymode.checkbox-pt:after,
[data-theme='red'] .content-style2 .text-underLine-main {
  color: #ff6360;
}

[data-theme='red'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a:before,
[data-theme='red'] .tab-menu-style1 ul.tab-menu-nav li a,
[data-theme='red'] .checkbox-pt input[type=checkbox]:checked~.bg,
[data-theme='red'] .container-content-style2 .btn-main {
  background-color: #ff6360;
}

[data-theme='red'] .container-style2 select {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23ff6360'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat !important;
  background-size: 12px !important;
  background-position: calc(100% - 5px) 10px !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important;
}

[data-theme='red'] .container-content-style2 .btn-main:hover {
  background-color: #ff3b37;
}

[data-theme='red'] .content-group-title a:hover {
  color: #ff3b37;
}

[data-theme='red'] .condition-wrap button {
  background-color: #ff6360;
  border: 1px solid #ff3b37;
}


[data-theme='gray'] .container-style2 .project-panel,
[data-theme='gray'] .container-content-style2 .content-group,
[data-theme='gray'] .container-style2 .input-group-btn button.btn {
  background: #f5f5f5;
}

[data-theme='gray'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a,
[data-theme='gray'] .content-group-title,
[data-theme='gray'] .content-group-title a,
[data-theme='gray'] .container-content-style2 .form-group.require .control-label,
[data-theme='gray'] .container-content-style2 .btn-checkbox,
[data-theme='gray'] .container-content-style2 .input-icon i,
[data-theme='gray'] .container-style2 .input-group-btn button.btn,
[data-theme='gray'] .container-content-style2 .dropdown-style2 .form-control+.fa-caret-down,
[data-theme='gray'] .qa-easymode.checkbox-pt:after,
[data-theme='gray'] .content-style2 .text-underLine-main {
  color: #607d8b;
}

[data-theme='gray'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a:before,
[data-theme='gray'] .tab-menu-style1 ul.tab-menu-nav li a,
[data-theme='gray'] .checkbox-pt input[type=checkbox]:checked~.bg,
[data-theme='gray'] .container-content-style2 .btn-main {
  background-color: #607d8b;
}

[data-theme='gray'] .container-style2 select {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%23607d8b'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat !important;
  background-size: 12px !important;
  background-position: calc(100% - 5px) 10px !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important;
}

[data-theme='gray'] .container-content-style2 .btn-main:hover {
  background-color: #4f6773;
}

[data-theme='gray'] .content-group-title a:hover {
  color: #4f6773;
}

[data-theme='gray'] .condition-wrap button {
  background-color: #607d8b;
  border: 1px solid #4f6773;
}


[data-theme='blue2'] .container-style2 .project-panel,
[data-theme='blue2'] .container-content-style2 .content-group,
[data-theme='blue2'] .container-style2 .input-group-btn button.btn {
  background: #f4f5ff;
}

[data-theme='blue2'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a,
[data-theme='blue2'] .content-group-title,
[data-theme='blue2'] .content-group-title a,
[data-theme='blue2'] .container-content-style2 .form-group.require .control-label,
[data-theme='blue2'] .container-content-style2 .btn-checkbox,
[data-theme='blue2'] .container-content-style2 .input-icon i,
[data-theme='blue2'] .container-style2 .input-group-btn button.btn,
[data-theme='blue2'] .container-content-style2 .dropdown-style2 .form-control+.fa-caret-down,
[data-theme='blue2'] .qa-easymode.checkbox-pt:after,
[data-theme='blue2'] .content-style2 .text-underLine-main {
  color: #2d41ac;
}

[data-theme='blue2'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a:before,
[data-theme='blue2'] .tab-menu-style1 ul.tab-menu-nav li a,
[data-theme='blue2'] .checkbox-pt input[type=checkbox]:checked~.bg,
[data-theme='blue2'] .container-content-style2 .btn-main {
  background-color: #2d41ac;
}

[data-theme='blue2'] .container-style2 select {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%232d41ac'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat !important;
  background-size: 12px !important;
  background-position: calc(100% - 5px) 10px !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important;
}

[data-theme='blue2'] .container-content-style2 .btn-main:hover {
  background-color: #25358c;
}

[data-theme='blue2'] .content-group-title a:hover {
  color: #25358c;
}

[data-theme='blue2'] .condition-wrap button {
  background-color: #2d41ac;
  border: 1px solid #25358c;
}


[data-theme='purple'] .container-style2 .project-panel,
[data-theme='purple'] .container-content-style2 .content-group,
[data-theme='purple'] .container-style2 .input-group-btn button.btn {
  background: #fef4ff;
}

[data-theme='purple'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a,
[data-theme='purple'] .content-group-title,
[data-theme='purple'] .content-group-title a,
[data-theme='purple'] .container-content-style2 .form-group.require .control-label,
[data-theme='purple'] .container-content-style2 .btn-checkbox,
[data-theme='purple'] .container-content-style2 .input-icon i,
[data-theme='purple'] .container-style2 .input-group-btn button.btn,
[data-theme='purple'] .container-content-style2 .dropdown-style2 .form-control+.fa-caret-down,
[data-theme='purple'] .qa-easymode.checkbox-pt:after,
[data-theme='purple'] .content-style2 .text-underLine-main {
  color: #9f41bd;
}

[data-theme='purple'] .tab-menu-style1 ul.tab-menu-nav li.tab-menu-active a:before,
[data-theme='purple'] .tab-menu-style1 ul.tab-menu-nav li a,
[data-theme='purple'] .checkbox-pt input[type=checkbox]:checked~.bg,
[data-theme='purple'] .container-content-style2 .btn-main {
  background-color: #9f41bd;
}

[data-theme='purple'] .container-style2 select {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' fill='%239f41bd'><polygon points='0,0 100,0 50,50'/></svg>") no-repeat !important;
  background-size: 12px !important;
  background-position: calc(100% - 5px) 10px !important;
  background-repeat: no-repeat !important;
  background-color: #fff !important;
}

[data-theme='purple'] .container-content-style2 .btn-main:hover {
  background-color: #85379f;
}

[data-theme='purple'] .content-group-title a:hover {
  color: #85379f;
}

[data-theme='purple'] .condition-wrap button {
  background-color: #9f41bd;
  border: 1px solid #85379f;
}


[data-theme='blue'] .container-content-style2 .btn-main,
[data-theme='orange'] .container-content-style2 .btn-main,
[data-theme='green'] .container-content-style2 .btn-main,
[data-theme='red'] .container-content-style2 .btn-main,
[data-theme='gray'] .container-content-style2 .btn-main,
[data-theme='blue2'] .container-content-style2 .btn-main,
[data-theme='purple'] .container-content-style2 .btn-main {
  border: none;
}




/* 自製下拉選單+右側按鈕 */

.dropdown-style3 .dropdown-style3-withbtn {
  position: absolute;
  right: 7px;
  top: 0;
}

.dropdown-style3 .input-group.dropdown-style3-form {
  width: calc(100% - 54px);
}


@media (max-width: 768px) {
  .dropdown-style3 .dropdown-style3-withbtn {
    top: 30px;
  }
}

/* 列印標題(銷貨單) */

.print-title {
  background: #eee;
  padding: 5px 15px;
  font-weight: bold;
  border-bottom: 1px solid #dddddd;
  margin-bottom: 0;
  font-size: 14px !important;
}


.clear-btn {
  margin-top: 10px;
}


.tooltip-inner {
  max-width: unset;
}
