/*bootstrap v4.0.0-alpha.6*/
.hidden-xs-up {
  display: none !important;
}

@media (max-width: 575px) {
  .hidden-xs-down {
    display: none !important;
  }
}

@media (min-width: 576px) {
  .hidden-sm-up {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .hidden-sm-down {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .hidden-md-up {
    display: none !important;
  }
}

@media (max-width: 991px) {
  .hidden-md-down {
    display: none !important;
  }
}

@media (min-width: 992px) {
  .hidden-lg-up {
    display: none !important;
  }
}

@media (max-width: 1199px) {
  .hidden-lg-down {
    display: none !important;
  }
}

@media (min-width: 1200px) {
  .hidden-xl-up {
    display: none !important;
  }
}

.hidden-xl-down {
  display: none !important;
}

.visible-print-block {
  display: none !important;
}

.breadcrumb::after {
  display: block;
  content: "";
  clear: both;
}

.navbar {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: block;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: .5rem 1rem;
}

.container-fluid {
  position: relative;
  margin-left: auto;
  margin-right: auto;
}

/*style*/
p {
  word-wrap: break-word;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  color: hsl(0, 0%, 40%);
}

h3 small, h4 small, h5 small {
  font-weight: normal;
  color: hsl(0, 0%, 40%);
}

.btn, button, input, optgroup, select, textarea, .card .card-header .card-title {
  font-family: "Microsoft JhengHei", "微軟正黑體", "微软雅黑", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.overlay .overlay-search {
  font-size: 50px;
}

.login-wrapper {
  background-color: transparent;
}

.login-wrapper .bg-pic>img {
  opacity: 1;
}

.padding {
  padding: 10px 0;
}

.page-logo {
  height: 50px;
  width: auto;
}

.overlay .overlay-brand {
  width: auto;
}

.bg-primary {
  background-color: #1f2532 !important;
}

.pace .pace-progress {
  background: #3a68bf;
  z-index: 500;
}

.copyright {
  padding: 25px 30px;
}

.menu-bar ul li.active {
  border-bottom: 2px solid #3a68bf;
}

.breadcrumb>.breadcrumb-item.active {
  color: #000;
}

.navbar .container, .navbar .container-fluid, .navbar .container-lg, .navbar .container-md, .navbar .container-sm, .navbar .container-xl {
  display: block;
}

.profile-dropdown-toggle {
  color: #fff;
  padding-top: 10px;
  padding-bottom: 10px;
}

.horizontal-app-menu .menu-bar>ul li>a {
  color: #000;
}

.horizontal-app-menu .header .header-inner .brand.inline {
  padding-right: 0;
  margin-right: 0;
}

.menu-bar>ul>li.sep {
  border-right: 1px solid rgba(0, 0, 0, 0.13);
}

.horizontal-app-menu .menu-bar>ul>li.open>ul>li>a {
  min-width: 80px;
}

.form-group-default.focused {
  border-color: #2088cd !important;
  background-color: #fff;
}

.form-group-default.focused.readonly {
  border-color: rgba(0, 0, 0, 0.07) !important;
  background-color: #fff;
}

.form-group-default.readonly label {
  opacity: 1 !important;
}

.btn-primary, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .btn-primary:active, .btn-primary.active:focus, .btn-primary:active:focus, .btn-primary:active:hover, .show .dropdown-toggle.btn-primary {
  color: #fff !important;
  background-color: #3a68bf !important;
  border-color: #3a68bf !important;
}

.btn-primary.hover, .btn-primary:hover, .show .dropdown-toggle.btn-primary {
  background-color: #5b83cd !important;
  border-color: #5b83cd !important;
  color: #fff !important;
}

.register-container .form-group .btn i {
  margin-right: 5px;
  display: none;
  color: #3a68bf;
}

.register-container .form-group .btn.active i {
  display: inline-block;
}

.card-block .regis .switch button {
  margin-bottom: 0;
}

.register-container .section {
  display: none;
}

.register-container .section.active {
  display: block;
}

.section {
  margin-bottom: 20px;
}

.sections>.section:not(:last-of-type) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

a, a:not([href]):not([tabindex]) {
  color: #2088cd;
}

.text-danger a, .text-danger a:not([href]):not([tabindex]), .text-danger a:focus, .text-danger a:hover, .text-danger a:active, .text-danger a:not([href]):not([tabindex]):focus, .text-danger a:not([href]):not([tabindex]):hover {
  color: #f94816;
}

.text-danger .editable-click, .text-danger a.editable-click, .text-danger a.editable-click:hover {
  border-bottom: dashed 1px #f94816;
}

a:focus, a:hover, a:active, a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
  color: #2088cd;
  cursor: pointer;
}

.form-check-inline.radio, .form-check-inline.checkbox {
  margin-top: 0;
}

.form-group-default.focused .checkbox label {
  opacity: 1;
}

.checkbox input[type="checkbox"]:focus+label:before {
  background-color: #fff;
}

.form-group-default .checkbox input[type="checkbox"]:checked+label {
  opacity: 1;
}

.toggle-btn {
  padding: 10px 0;
}

.navbar-top {
  padding: 0;
  margin: 0;
}

.table tbody tr td {
  padding: 10px;
}

.table tbody tr td:first-of-type {
  padding-left: 30px !important;
}

.table.has-checkbox .checkbox input[type=checkbox] {
  display: none;
}

.checkbox input[type=checkbox] {
  display: none;
}

.table thead tr th:first-child {
  padding-left: 30px !important;
}

.table.products thead tr th:first-child,
.table tbody tr td:first-of-type {
  padding-left: 18px !important;
}

.table.products .each {
  padding-top: 5px;
}

.table.products .each .hint-text {
  padding-top: 5px;
}

.table.products .each .plus {
  display: inline-block;
  padding-left: 5px;
  padding-right: 5px;
}

.table.products .each .hint-text>span {
  display: inline-block;
}

.w-limit-150 {
  max-width: 150px;
  display: inline-block;
}

.w-limit-100 {
  max-width: 100px;
  display: inline-block;
}

.w-limit-50 {
  max-width: 50px;
  display: inline-block;
}

.table.in-card thead tr th:first-child, .table.in-card tbody tr td:first-of-type {
  padding-left: 18px !important;
}

.table-responsive>.dataTables_wrapper {
  min-width: 1200px;
}

.table-responsive-sm>.dataTables_wrapper {
  min-width: 600px;
}

.dropdown-menu {
  min-width: 200px;
}

.horizontal-app-menu .menu-bar ul li a .arrow {
  width: 15px;
}

.full-width {
  width: 100%;
}

.select-icon .form-control {
  height: auto !important;
  padding-right: 15px;
}

.select-icon {
  font: normal normal normal 14px/1 pages-icon;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.select-icon:before {
  font-family: "Font Awesome 5 Pro";
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  content: "\f078";
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
  position: absolute;
  right: 10px;
  bottom: 7px;
  color: rgba(0, 0, 0, 0.2);
}

.btn-default, .btn-default:focus {
  color: #5e5e5e;
  background-color: hsl(0, 0%, 80%);
  border-color: hsl(0, 0%, 80%);
}

.btn-default.hover, .btn-default:hover {
  background-color: hsl(0, 0%, 90%);
  border-color: hsl(0, 0%, 90%);
  color: #18191a;
}

.img-thumbnail {
  max-width: 50px;
}

.editable-input .form-control {
  box-sizing: border-box;
  height: 34px;
  min-width: 34px;
  max-width: 100px;
}

.form-control:focus {
  border-color: #2088cd;
  background-color: #fff;
}

.navbar-tool {
  margin-bottom: 0;
  padding: 0;
}

.nav-tool>li>a, .nav-tool>li>button, .nav-tool>li>a:not([href]):not([tabindex]) {
  padding: 5px 10px;
  margin-top: 15px;
  margin-bottom: 15px;
  background-color: hsl(0, 0%, 80%);
  color: hsl(0, 0%, 30%);
  transition: all .3s;
  border-radius: 3px;
  display: inline-block;
}

.nav-tool>li>a:hover {
  background-color: hsl(0, 0%, 70%);
}

.nav-tool>li.active>a {
  background-color: #3a68bf !important;
  color: #fff !important;
}

.bg-transparent {
  background-color: transparent !important;
}

.nav-item .badge.count-sm {
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 10px;
  padding-right: 10px;
}

.nav-item .badge.badge-success {
  background-color: #1dbb99;
  color: #fff;
}

.nav-tool>li>a i {
  margin-right: 5px;
}

.nav-tool>li:not(:last-of-type) {
  margin-right: 5px;
}

.input-group .input-group-addon {
  background-color: transparent;
  border-width: 0;
  padding: 0;
}

.help-other-page {
  margin-bottom: 10px;
}

.input-block label {
  display: block;
}

.input-block {
  margin: 0 0 20px 0;
}

.input-block input {
  display: block;
}

.nav-tool {
  float: left;
}

.nav-page .dropdown-toggle .name {
  width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: inline-block;
  height: 13px;
  line-height: 13px;
  margin-bottom: -2px;
}

.nav-page .dropdown-toggle {
  width: 200px;
  padding: 5px 10px;
  color: hsl(0, 0%, 30%);
}

.nav-page .dropdown-toggle.sm {
  width: 130px;
  height: 34px;
}

.nav-page .dropdown-toggle.sm span {
  width: auto;
  height: 20px;
  margin-top: 2px;
}

.form-sep {
  border-bottom: 1px solid rgba(230, 230, 230, 0.7);
  margin-bottom: 20px;
  margin-top: 20px;
  margin-left: -20px;
  margin-right: -20px;
}

.checksection-wrap .checksection {
  display: none;
}

.checksection-wrap .checksection.active {
  display: block;
}

.selectsection-wrap .selectsection {
  display: none;
}

.selectsection-wrap .selectsection.active {
  display: block;
}

.form-control.picker[disabled], .form-control.picker[readonly] {
  background: #fff;
  color: #2c2d2f;
}

.content-section {
  position: relative;
  border: 1px dotted hsl(0, 0%, 80%);
}

.content-section .btn-group {
  position: absolute;
  left: 10px;
  top: 10px;
  z-index: 2;
}

.content-section .btn-group button>span {
  margin-left: 5px;
}

.videoWrapper {
  position: relative;
  padding-bottom: 52.8%;
  padding-top: 25px;
  height: 0;
}

.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.mail-iframe {
  height: 350px;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.07);
}

.editor {
  padding: 20px;
}

.form-section .editor {
  padding: 10px 0;
  min-height: 50px;
}

.modal-body .summernote-wrapper {
  margin-bottom: 20px;
}

.summernote-wrapper .card {
  margin-bottom: 5px;
}

.modal-body .help {
  margin-left: 8px;
  font-size: 14px;
}

.modal-body .form-group .help {
  font-size: 12px;
}

.form-group-default {
  overflow: visible;
}

.modal .modal-xlg {
  max-width: 1200px;
  width: 100%;
}

.minicolors-theme-default.minicolors {
  width: 100%;
}

.minicolors-theme-default .minicolors-swatch {
  top: auto;
  left: auto;
  right: 0;
}

.form-group-default textarea.form-control {
  height: auto;
}

.header {
  z-index: 100;
}

.badge-circle {
  padding-left: 20px;
  position: relative;
}

.badge-circle:before {
  content: '';
  display: table;
  height: 12px;
  width: 12px;
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  left: 5px;
  top: 3px;
}

.badge-circle-1:before {
  background-color: #f7cf5f;
}

.badge-circle-2:before {
  background-color: #1dbb99;
}

.badge-circle-3:before {
  background-color: #f94816;
}

.badge-circle-4:before {
  background-color: #006bcf;
}

.badge-circle-5:before {
  background-color: #323232;
}

.badge-circle-all:before {
  background-color: #3a68bf;
}

.badge-circle-6:before {
  background-color: #d78525;
}

.badge-circle-7:before {
  background-color: #ae25d7;
}

.nav-item .input-daterange, .nav-item .input-form {
  padding: 14px 0;
}

.nav-item .input-group .form-control {
  border-radius: 0;
  height: 34px;
  line-height: 34px;
  min-width: 120px;
}

.nav-item .input-group .input-group-addon {
  height: 34px;
  line-height: 34px;
  margin-top: 0;
  padding: 0 5px;
}

.nav-item .input-daterange input {
  width: 100px;
}

.important {
  color: #f10e0e;
}

.table>tfoot>tr>td {
  border-bottom: 1px solid rgba(225, 225, 226, 0.7);
  background-color: #fff;
}

.table thead tr th .checkbox {
  margin: 0;
}

.table thead tr th .checkbox label::after {
  left: 1.5px;
}

.form-group-default.disabled input {
  opacity: 1;
  color: #2c2d2f;
}

.form-group-default.disabled {
  background: #f4f4f5;
  color: #575a5d;
}

.card>.card-block:not(:last-of-type), .card .checksection>.card-block:not(:last-of-type) {
  border-bottom: 1px solid rgba(230, 230, 230, 0.7);
}

.card .items>.item {
  border-bottom: 1px solid rgba(230, 230, 230, 0.7);
}

.form-group .form-check-inline a .badge, .navbar-nav .check-inline a .badge {
  opacity: .3;
  transition: all .3s;
}

.form-group .form-check-inline a.active .badge, .navbar-nav .check-inline a.active .badge {
  opacity: 1;
}

.navbar-nav .check-inline {
  padding: 8px 0;
}

.order-note {
  margin-top: 20px;
}

.order-note {
  margin-top: 20px;
}

.social-card.share .card-header:hover {
  background: transparent;
  border-color: #e1e1e2;
  cursor: auto;
}

.timeline-container {
  width: 100%;
}

.list-half {
  margin-left: -5px;
  margin-right: -5px;
}

.list-half-has-left {
  margin-left: -5px;
  margin-right: -5px;
  margin-bottom: 0;
}

.list-half>li {
  width: 50%;
  float: left;
  padding: 0 5px;
}

.list-half-has-left>li {
  width: 45%;
  float: left;
  padding: 0 5px;
}

.list-half-has-left>li:first-of-type {
  width: 10%;
}

.dd-list .list-half-has-left>li {
  width: 50%;
}

.link-product {
  display: block;
  margin-top: -5px;
  margin-bottom: 10px !important;
}

.dd-list .product-item .link-product {
  margin-bottom: -5px !important;
}

.dd-list .product-item.list-half-has-left .link-product {
  margin-bottom: 0px !important;
}

.product-item .link-product {
  margin-top: -10px;
  margin-bottom: 5px !important;
}

.list-half-has-left>li:first-of-type .btn {
  height: 54px;
  padding: 6px;
  width: 100%;
}

.list-has-left {
  margin-left: -5px;
  margin-right: -5px;
  margin-bottom: 0;
}

.list-has-left>li {
  width: 90%;
  float: left;
  padding: 0 5px;
}

.list-has-left>li:first-of-type {
  width: 10%;
}

.list-has-left>li:first-of-type .btn {
  height: 54px;
  padding: 6px;
  width: 100%;
}

.list-half>li.full {
  width: 100%;
}

.form-control[readonly] {
  color: #2c2d2f;
  cursor: default;
}

.nav-form input {
  float: left;
}

.nav-form button {
  float: left;
}

.form-inline {
  width: auto;
  display: inline-block;
}

.navbar-nav li a {
  min-width: auto;
}

.navbar-nav>li.search-icon>a {
  height: 34px;
  width: 34px;
  line-height: 34px;
  background-color: #0084ff;
  color: #fff;
  margin-top: 15px;
  margin-bottom: 15px;
  padding: 0;
  text-align: center;
  border-radius: 3px;
}

.navbar-nav>li.search-icon>a>i:nth-of-type(1) {
  display: inline-block;
}

.navbar-nav>li.search-icon>a>i:nth-of-type(2) {
  display: none;
}

.navbar-nav>li.search-icon.active>a>i:nth-of-type(1) {
  display: none;
}

.navbar-nav>li.search-icon.active>a>i:nth-of-type(2) {
  display: inline-block;
}

.navbar-nav>li.search-icon>a:hover {
  color: #fff;
}

.navbar-nav>li.export>a {
  height: 34px;
  padding: 0 10px;
  line-height: 34px;
  background-color: #0084ff;
  color: #fff;
  margin-top: 15px;
  margin-bottom: 15px;
  text-align: center;
  border-radius: 3px;
  transition: all .3s;
}

.navbar-nav>li.export>a:hover {
  color: #fff;
  background-color: hsl(208, 100%, 60%);
}

.navbar-nav>li.right>a {
  height: 34px;
  padding-top: 0;
  padding-bottom: 0;
  line-height: 34px;
  margin-top: 15px;
  margin-bottom: 15px;
  text-align: center;
  border-radius: 3px;
  transition: all .3s;
  margin-right: 0;
}

.table-tool {
  display: none;
  position: fixed;
  background-color: rgba(0, 0, 0, .7);
  left: 0;
  right: 0;
  z-index: 2;
  padding: 10px 15px;
  bottom: 0;
  z-index: 10;
  color: #fff;
}

.table-tool .num {
  font-size: 20px;
  font-weight: bold;
}

.table-tool .btn-link {
  color: #fff;
}

.table-tool .btn-link:hover, .table-tool .btn-link:active, .table-tool .btn-link:focus {
  color: hsl(0, 0%, 90%);
}

.table-tool button {
  margin-top: 2px;
  margin-bottom: 2px;
}

.features>.feature {
  text-align: center;
  padding: 10px;
  font-size: 20px;
}

.features>.feature h5 {
  font-size: 14px;
  color: hsl(0, 0%, 50%);
}

.table,
.table-hover tbody tr:hover {
  color: #575a5d;
}

.btn-icon i,
a.btn-icon i,
button.btn-icon i,
.table .td-note i,
.table .status-group i {
  color: hsl(0, 0%, 60%);
}

.btn-icon.p-0 {
  padding: 0;
}

.table .product-name {
  margin-right: 5px;
  word-break: break-all;
}

.product-name {
  color: #2088cd;
}

.pick-note {
  font-size: 12px;
  color: hsl(0, 0%, 50%);
  word-break: break-all;
}

.table .sku {
  margin-right: 5px;
  color: #1dbb99;
  word-break: break-all;
}

.modal.fade.fill-in>.close>i, .overlay-close>i {
  font-size: 36px;
}

.table-inline {
  margin-top: 0;
}

.table-detail tbody>tr:last-of-type>td {
  border-width: 0;
}

.table tbody tr.row-details td:first-of-type {
  padding-right: 30px;
}

.table tbody tr.selected.row-details td {
  background: #fff;
}

.login-wrapper .login-container {
  float: left;
  max-width: 450px;
  width: 100%;
}

.login-wrapper .bg-pic {
  text-align: right;
}

.user h5 {
  font-size: 14px;
  margin: 0;
  line-height: 22.7px;
  letter-spacing: -0.006em;
  margin-top: -3px;
  color: #000;
}

.user h6 {
  font-size: 12px;
  margin: 0;
}

.add-line {
  padding: 5px 10px;
  background-color: #00c511;
  color: #fff;
  line-height: 25px;
  border-radius: 5px;
  display: inline-block;
  transition: all .3s;
  font-size: 16px;
  transition: all .3s;
}

.add-line:hover, .add-line:active, .add-line:focus {
  background-color: hsl(125, 100%, 43%);
  color: #fff;
}

.add-line img {
  height: 20px;
  margin-right: 5px;
}

.inbox p {
  font-size: 15px;
}

.inbox.card-group .card-header .card-title>a {
  font-size: 18px;
}

.inbox.card-group .card-header .card-title>a .date {
  margin-left: 5px;
  font-size: 14px;
  opacity: .7;
}

.inbox.card-group .card-header .card-title>a:after {
  font-size: 15px;
}

.inbox.card-group .card-header {
  padding: 5px 18px 0 22px;
}

.inbox .hide-inbox {
  border-top: 1px solid rgba(230, 230, 230, 0.7);
}

.inbox .hide-inbox .btn {
  border-width: 0;
  padding: 10px;
  color: hsl(0, 0%, 50%);
}

.inbox .hide-inbox .btn:hover, .inbox .hide-inbox .btn:focus, .inbox .hide-inbox .btn:active {
  color: hsl(0, 0%, 20%);
  background-color: hsl(0, 0%, 90%);
  border-radius: 0;
}

.list.card-group .card-header .card-title>a {
  font-size: 16px;
}

.list.card-group>.card .card-header {
  padding-top: 5px;
  padding-bottom: 0;
}

.list.card-group .card .card-block {
  font-size: 14px;
  line-height: 1.8;
}

.table tbody tr .btn i {
  transform: rotate(0deg);
  transition: all .3s;
}

.table tbody tr.shown .btn i {
  transform: rotate(180deg);
}

.btn-icon {
  padding: 5px;
  display: inline-block;
  border-width: 0;
  background-color: transparent;
}

.icon-notice i {
  color: hsl(0, 0%, 60%);
}

.loading-icon {
  display: inline-block;
  height: 20px;
  width: 20px;
  margin: -5px 10px -5px 0;
}

.btn-icon .loading-icon {
  height: 15px;
  width: 15px;
  margin: 0 0 -2px 0;
}

.btn-primary.disabled, .btn-primary[disabled], fieldset[disabled] .btn-primary, .btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled:active, .btn-primary[disabled]:active, fieldset[disabled] .btn-primary:active, .btn-primary.disabled.active, .btn-primary[disabled].active, fieldset[disabled] .btn-primary.active {
  background-color: rgba(58, 104, 191, .8) !important;
  border-color: rgba(58, 104, 191, .8) !important;
}

.modal .msg {
  margin-bottom: 10px;
}

.search-data .right {
  width: calc(100% - 48px);
}

.search-data .right h5 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: normal;
}

.search-data p {
  color: hsl(0, 0%, 50%);
}

.no-data {
  font-size: 20px;
  color: hsl(0, 0%, 50%);
  text-align: center;
}

.list-view li.no-data,
.list-view li.no-data:hover {
  text-align: center;
  display: block;
  padding: 20px 10px;
  background-color: #fff;
  font-size: 12px;
  cursor: default;
  border-bottom-width: 0 !important;
}

.overlay .overlay-close {
  z-index: 10;
}

.page-loading .progress-circle-indeterminate {
  height: 60px;
  width: 60px;
}

.admin .load-data .main-content {
  display: none;
}

.admin .main-content {
  display: block;
}

.page-loading {
  padding: 100px 20px;
  display: none;
}

.page-text {
  padding: 100px 20px;
}

.load-data .page-loading {
  display: block;
}

.pace-activity {
  display: none !important;
}

.table tbody tr td.dataTables_empty {
  padding: 20px;
}

.switchery.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.content-sections .nodata, .nodata {
  padding: 30px 20px;
  font-size: 20px;
  color: hsl(0, 0%, 70%);
  line-height: 1.6;
}

.nodata {
  padding: 10px 0;
}

.font-16 {
  font-size: 16px !important;
}

.select-box h5 {
  margin-top: 0;
}

.select-box h5 .label {
  margin-right: 5px;
}

.list-product>li {
  padding-left: 0;
  margin-bottom: 5px;
}

.list-product>li .img-thumbnail {
  float: left;
  margin-right: 10px;
}

.btn-icon-inline, .btn-icon-inline:hover {
  padding: 0 6px;
  color: hsl(0, 0%, 20%);
}

.select2-container--open .select2-selection {
  background-color: #fff;
}

.select2-container--open .select2-selection--multiple .select2-selection__choice {
  background-color: #e1e1e2 !important;
}

.form-group [type=checkbox] {
  display: none;
}

.checkbox.check-success input[type=checkbox]:checked+label::after, .checkbox.check-primary input[type=checkbox]:checked+label::after, .checkbox.check-complete input[type=checkbox]:checked+label::after, .checkbox.check-warning input[type=checkbox]:checked+label::after, .checkbox.check-danger input[type=checkbox]:checked+label::after, .checkbox.check-info input[type=checkbox]:checked+label::after {
  left: 3px;
}

.table .checkbox.check-success input[type=checkbox]:checked+label::after, .table .checkbox.check-primary input[type=checkbox]:checked+label::after, .table .checkbox.check-complete input[type=checkbox]:checked+label::after, .table .checkbox.check-warning input[type=checkbox]:checked+label::after, .table .checkbox.check-danger input[type=checkbox]:checked+label::after, .table .checkbox.check-info input[type=checkbox]:checked+label::after {
  left: 0;
}

.input-group .error {
  font-size: 14px;
}

.form-control.minicolors {
  width: 100%;
  padding-right: 20px;
}

.img-loading .progress-circle-indeterminate {
  position: absolute;
  left: 0;
  right: 0;
}

.img-loading img {
  z-index: 1;
  position: relative;
  min-height: 50px;
}

.basicTable.table>thead>tr>th:focus {
  outline-width: 0;
}

.dd {
  max-width: 100%;
}

.has-bottom .form-input-group {
  border-bottom-width: 0;
}

.has-bottom .has-bottom-button {
  border: 1px solid rgba(0, 0, 0, 0.07);
  border-bottom-left-radius: 2px;
  border-bottom-right-radius: 2px;
}

.has-bottom .has-bottom-button button {
  padding: 5px 10px;
  background-color: #fff;
  border-width: 0;
  transition: all .3s;
  display: block;
  width: 100%;
  border-radius: 0;
  margin: 0;
}

.has-bottom .has-bottom-button button:hover {
  background-color: hsl(0, 0%, 90%);
}

.img-discount {
  max-width: 200px;
  height: auto;
  margin-bottom: 10px;
}

.has-bottom .has-bottom-button {
  margin-left: -12px;
  margin-right: -12px;
  margin-bottom: -4px;
  border-width: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.07);
}

.error.form-control {
  font-size: 14px;
}

.basicTable .status {
  font-size: 12px;
  margin-top: 2px;
  color: hsl(0, 0%, 50%);
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  height: 17px;
  max-width: 110px;
}

.basicTable .name {
  font-size: 12px;
  color: #1dbb99;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  height: 17px;
  max-width: 110px;
}

.section-btns>a, .section-btns>button {
  margin-right: 5px;
}

.lazyload, .lazyloading {
  opacity: 0;
}

.lazyloaded {
  opacity: 1;
  transition: opacity .3s;
}

.login-wrapper .bg-pic>img.lazyload, .login-wrapper .bg-pic>img.lazyloading {
  opacity: 0;
}

.login-wrapper .bg-pic>img.lazyloaded {
  opacity: 1;
  transition: opacity 1s;
}

.img-thumbnail:not([src]) {
  opacity: 0;
}

.modal .sep {
  color: hsl(0, 0%, 70%);
  padding-left: 5px;
  margin-right: 5px;
}

.table-tool .sep {
  border-right: 1px solid rgba(255, 255, 255, .7);
  padding-left: 10px;
  margin-right: 10px;
}

.hint-text {
  opacity: 1;
}

.timeline-content .event-date {
  display: block;
  float: none;
}

.timeline-content .event-date .line {
  margin-right: 5px;
  margin-left: 5px;
  display: inline-block;
}

.timeline-content .event-date .line i {
  margin-right: 5px;
}

.btn-section>button, .btn-section>a {
  margin-bottom: 5px;
  margin-right: 5px;
}

.is-button {
  color: rgba(0, 0, 0, 0.3);
}

.is-button>a {
  display: inline-block;
}

.tool-select-section {
  display: inline-block;
}

.editable-error-block {
  margin: 5px;
}

.error-number {
  font-size: 70px;
  line-height: 90px;
}

.emptySection {
  text-align: center;
  padding: 50px;
}

.emptySection>img {
  height: 150px;
}

.form-group label:not(.error) {
  text-transform: none;
}

.navbar-tool {
  position: fixed;
  top: 95px;
  z-index: 99;
  transition: all .3s;
}

.navbar-tool.slideUp {
  /*top: 29px;*/
}

.has-top-menu {
  padding-top: 64px;
}

.has-top-menu-sub {
  padding-top: 111px;
}

.container-fluid.container-fixed-lg {
  width: auto !important;
}

.thumbnail-wrapper.d48 img {
  width: 20px;
  height: auto;
  margin-top: -3px;
}

.bg-fb {
  background-color: #3c549c;
}

.bg-msgr {
  background-color: #0077ff;
}

.bg-line {
  background-color: #00c511;
}

.fa-no-margin {
  margin: 0 !important;
}

.shake {
  display: inline-block;
  animation: shake .3s ease-in-out infinite;
}

.card .card-header .card-title {
  text-transform: none;
  padding-right: 20px;
}

.card-block button, .card-block a {
  margin-bottom: 5px;
}

.card-block a.btn-icon {
  margin-bottom: 0;
}

.card-block .summernote-wrapper button, .card-block .summernote-wrapper a {
  margin-bottom: 0;
}

.form-check-inline a {
  margin-right: 5px;
  margin-bottom: 2px;
  display: inline-block;
}

.form-check-inline {
  display: block;
  margin-right: 0;
}

.in-card {
  min-width: 600px;
}

.addtocart {
  padding: 30px;
}

.tool-bar {
  margin-bottom: 10px;
}

.fa-spin.seppd-up {
  -webkit-animation: fa-spin 1s infinite linear;
  animation: fa-spin 1s infinite linear;
}

.form-lg {
  min-width: 300px;
}

.is-code {
  padding: 50px 30px;
  text-align: center;
}

.is-code>i {
  font-size: 50px;
  color: hsl(0, 0%, 50%);
}

.is-code .text {
  margin-top: 10px;
  font-size: 16px;
  color: hsl(0, 0%, 30%);
}

.icon-section {
  padding: 50px 30px;
  text-align: center;
}

.icon-section>i {
  font-size: 50px;
  color: hsl(0, 0%, 50%);
}

.icon-section .text {
  margin-top: 10px;
  font-size: 16px;
  color: hsl(0, 0%, 30%);
}

.page-link {
  background-color: transparent;
}

.page-item.active .page-link, .page-item.active .page-link:hover {
  z-index: 2;
  color: #fff;
  background-color: #0084ff;
  border-color: #0084ff;
}

.page-item.disabled .page-link {
  color: #636c72;
  pointer-events: none;
  cursor: not-allowed;
  background-color: transparent;
  border-color: #ddd;
}

form.regis .row [class*='col-']:not(:first-child), form .row [class*='col-']:not(:last-child) {
  padding-right: 7px;
  padding-left: 7px;
}

form .row [class*='col-']:first-child {
  padding-left: 0 !important;
}

form .row [class*='col-']:last-child {
  padding-right: 0 !important;
}

.dropdown-item:focus, .dropdown-item:hover, .dropdown-item.active, .dropdown-item:active {
  color: #1d1e1f;
  text-decoration: none;
  background-color: #f7f7f9 !important;
}

.horizontal-app-menu .header .search-link {
  color: #fff !important;
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
  color: #2c2d2f;
}

.readonly.form-control[disabled], .readonly.form-control[readonly], fieldset[disabled] .form-control.readonly {
  background-color: #fff;
}

.navbar-tool .readonly.form-control[disabled], .navbar-tool .readonly.form-control[readonly], .navbar-tool .form-control.readonly {
  border: 1px solid rgba(0, 0, 0, 0.15);
}

.full-img {
  width: 100%;
}

.bg-img {
  text-align: center;
}

.bg-img img {
  margin-bottom: 5px;
}

.page-alert-top {
  margin-bottom: 30px;
}

.datepicker {
  font-size: 14px;
}

.social-card.share .card-description {
  overflow: hidden;
}

.notice i, .notice {
  color: #f94816 !important;
}

.icon-l-0 i {
  margin-left: 0 !important;
}

a.text-info:focus, a.text-info:hover {
  color: #1f3953 !important;
}

.text-warning {
  color: #ec971f !important
}

.modal {
  overflow-y: scroll !important;
}

.quickview-wrapper.quickview-left {
  position: fixed;
  left: -285px;
  right: auto;
  top: 0;
  width: 285px;
  background: #fff;
  bottom: 0;
  z-index: 1000;
  box-shadow: 0 0 9px rgba(191, 191, 191, 0.36);
  border-left: 1px solid rgba(222, 227, 231, 0.56);
  -webkit-transition: -webkit-transform 400ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
  transition: transform 400ms cubic-bezier(0.05, 0.74, 0.27, 0.99);
  -webkit-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  -webkit-perspective: 1000;
}

.quickview-wrapper.quickview-left.open {
  -webkit-transform: translate3d(100%, 0, 0);
  transform: translate3d(100%, 0, 0);
  -ms-transform: translate(100%, 0);
}

.list-view li>a {
  margin-right: 0;
  padding-left: 15px;
  padding-right: 15px;
}

.list-view li>a .text-master {
  width: 100%;
}

.list-view li {
  padding-left: 0;
}

.list-view li:hover .overflow-ellipsis {
  text-overflow: inherit;
  overflow: auto;
  white-space: normal;
}

.list-view li:hover>a {
  display: table;
  padding-top: 8px;
  padding-bottom: 8px;
}

.list-view li:hover>a>.label {
  margin-right: -1px;
}

.label-section {
  padding-top: 5px;
}

.label-section .label {
  margin-bottom: 3px;
  margin-right: 3px;
}

.label {
  padding: 4px 9px;
  display: inline-block;
}

.navbar-nav .text {
  padding-top: 20px;
}

.filter-holder {
  padding-top: 10px;
  padding-bottom: 10px;
  border-top: 1px solid rgba(0, 0, 0, 0.13);
}

.nav-item .select {
  margin-top: 14px;
  margin-bottom: 12px;
  position: relative;
}

.nav-item .select-2 {
  margin-top: 14px;
  margin-bottom: 14px;
  position: relative;
}

.select {
  position: relative;
  display: inline-block;
}

.table-tool .select {
  position: relative;
  top: 2px;
}

.nav-item .select select, .select select {
  padding-right: 25px;
  width: 150px;
}

.nav-item .select:after, .select:after {
  display: inline-block;
  width: 0;
  height: 0;
  vertical-align: middle;
  content: "";
  border-top: .3em solid #000;
  border-right: .3em solid transparent;
  border-left: .3em solid transparent;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: 0px;
}

.btn-cons {
  min-width: 120px !important;
}

.tip {
  padding: 15px;
  background-color: #fff;
  border-radius: 10px;
  margin-bottom: 10px;
  border-radius: 5px;
}

.tip .tip-img {
  width: 70px;
  float: left;
}

.tip .img {
  float: left;
  padding-right: 15px;
  width: 85px;
}

.tip .text {
  float: left;
  width: calc(100% - 85px);
}

.tip .text>p:last-of-type {
  margin-bottom: 0;
}

.tip .text.plan h4 {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 18px;
}

.tip .text.plan p.b {
  font-size: 16px;
  margin-bottom: 0;
}

.tip .text.plan a {
  color: hsl(0, 0%, 30%);
  transition: all .3s;
}

.tip .text.plan a:hover {
  color: hsl(0, 0%, 0%);
}

.badge-text i {
  margin-right: 5px;
}

.badge-text-gray {
  color: #575a5d !important;
}

.badge {
  padding-top: 4px;
}

.pgn-wrapper {
  z-index: 9999;
}

.form-control-text {
  line-height: 21px;
  font-size: 14px;
}

.row.row-10 {
  margin-left: -5px;
  margin-right: -5px;
}

.row-10>div,
form .row.row-10 [class*='col-']:first-child,
form .row.row-10 [class*='col-']:last-child {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.form-input-group .row {
  margin-left: -5px !important;
  margin-right: -5px !important;
}

.form-input-group .row>div,
form.form-input-group .row [class*='col-']:first-child,
form.form-input-group .row [class*='col-']:last-child {
  padding-left: 5px !important;
  padding-right: 5px !important;
}

.pointer {
  cursor: pointer;
}

.each-shop {
  margin-bottom: 10px;
  padding: 6px 12px;
  border: 1px solid rgba(0, 0, 0, 0.07);
  background-color: #fff;
  position: relative;
}

.each-shop a, .each-shop a:not([href]):not([tabindex]) {
  color: #575a5d;
}

.each-shop.regis {
  color: #575a5d;
}

.each-shop .left {
  width: calc(100% - 100px);
  float: left;
}

.each-shop .right {
  width: 100px;
  float: left;
  text-align: right;
}

.each-shop:hover {
  background-color: #cce6ff;
}

.each-shop .owner {
  font-size: 10.5px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 500;
  opacity: .5;
}

.each-shop .shop-name {
  font-size: 14px;
}

.each-shop .label {
  margin-left: 3px;
  margin-top: 3px;
}

.creat-shop {
  text-align: center;
  font-size: 16px;
  padding: 10px;
}

.profile-dropdown>a>i {
  width: 15px;
  text-align: center;
}

.horizontal-app-menu .header .header-icon, .horizontal-app-menu .header .header-icon:hover {
  color: #fff;
  position: relative;
}

.horizontal-app-menu .header .header-icon.shop-name {
  max-width: 100px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
}

.form-group label a:not([href]):not([tabindex]) {
  color: hsl(0, 0%, 60%);
  padding: 0 5px;
  font-size: 14px;
}

.tip-icon,
.card-block .tip-icon {
  margin: 0 0 0 5px;
}

.tip-icon i {
  margin: 0 !important;
  color: hsl(0, 0%, 60%) !important;
  font-size: 12px !important;
}

.tip-icon span {
  color: hsl(0, 0%, 50%) !important;
}

.box-hover {
  transition: all .3;
  -webkit-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px);
}

.box-hover:hover {
  -webkit-transform: translateY(-3px);
  -ms-transform: translateY(-3px);
  transform: translateY(-3px);
  box-shadow: 0 6px 10px 1px rgba(0, 0, 0, 0.1);
}

.top-alert {
  display: inline-block;
}

.top-alert .btn-text {
  display: inline-block;
  padding: 7px 10px;
}

.error-img {
  height: 150px;
  margin-bottom: 20px;
}

.color-fb {
  color: #3e4da1;
}

.fb-profile img {
  height: 35px;
  width: 35px;
  border-radius: 50%;
  margin-right: 10px;
}

.profile-dropdown.normal-dropdown>a:last-child {
  margin-top: 0;
}

.btn-light, .btn-light:focus, .btn-light:active, .btn-light.active, .btn-light:active, .btn-light.active:focus, .btn-light:active:focus, .btn-light:active:hover, .show .dropdown-toggle.btn-light {
  border-width: 0;
  padding: 10px;
  color: hsl(0, 0%, 50%) !important;
  border: 1px solid rgb(232, 233, 234) !important;
  background-color: #fff;
  padding: 10px;
}

.btn-light.hover, .btn-light:hover, .show .dropdown-toggle.btn-light {
  color: hsl(0, 0%, 20%) !important;
  background-color: hsl(0, 0%, 90%) !important;
  border-color: hsl(0, 0%, 90%) !important;
}

#accordion .next {
  margin-top: 2px;
}

.bootstrap-datetimepicker-widget a {
  color: hsl(0, 0%, 30%) !important;
}

.bootstrap-datetimepicker-widget.dropdown-menu {
  width: 278px;
  padding: 16px 25px;
}

.bootstrap-datetimepicker-widget .datepicker {
  padding-bottom: 0;
}

.bootstrap-datetimepicker-widget a[data-action] {
  padding: 0;
  margin-bottom: 0;
}

.bootstrap-datetimepicker-widget .datepicker {
  padding: 0;
}

.bootstrap-datetimepicker-widget .btn {
  border-width: 0;
  background-color: transparent;
}

.bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
  background: #e8e9ea;
}

.bootstrap-datetimepicker-widget table td span:hover, .bootstrap-datetimepicker-widget table td i:hover {
  background: #e8e9ea;
}

.datepicker table tr td.today, .datepicker table tr td.today:hover, .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:hover {
  color: #575a5d;
}

.datepicker table tr td.active.today, .datepicker table tr td.active.today:hover, .datepicker table tr td.today.active.disabled, .datepicker table tr td.today.active.disabled:hover {
  color: #fff;
}

.bootstrap-datetimepicker-widget table td.today:before {
  border-bottom-color: #575a5d;
}

table .sub, .table .sub a {
  color: hsl(0, 0%, 50%);
}

.log-info .title {
  margin-bottom: 5px;
}

.log-info ol {
  padding-left: 30px;
}

.log-info ol a {
  padding-left: 5px;
  padding-right: 5px;
}

.label-ver {
  background-color: rgba(255, 255, 255, .3);
  color: hsl(0, 0%, 100%);
}

.working img {
  width: 130px;
}

.div-margin>div:not(:last-of-type) {
  margin-bottom: 5px;
}

#preload {
  text-align: center;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.2);
  z-index: 999;
}

.svg-wrapper {
  margin: 0 auto;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
}

.svg-wrapper svg {
  width: 120px;
  margin: 0 auto;
}

.loading-circle #circle-inside {
  animation: c1_3 4.5s infinite;
}

.loading-circle {
  animation: c1_1 1.5s infinite;
}

.select2-container--open .select2-dropdown--below {
  box-shadow: none;
}

.no-arrow.dropdown-toggle:after {
  display: none;
}

.select-shop .select2-container .select2-selection {
  width: 200px;
}

.nav-item .select-shop.select:after {
  display: none;
}

.sale-channel>a {
  background-color: #F8D053 !important;
}

.countryImg {
  margin-right: 5px;
  margin-top: -2px;
}

.btn-icon img {
  height: 80px;
  display: block;
  margin: 10px auto 10px;
}

.btn-icon {
  text-align: center;
}

.form-group .radio.radio-block label {
  display: block;
}

.radio-block .badge, .radio-block .label {
  margin-left: 5px;
}

.form-group .bootstrap-tagsinput .label-info {
  background-color: hsl(0, 0%, 50%);
}

.h-56 {
  min-height: 56px;
}

.radio label:before, .checkbox label:before {
  background-color: #fff !important;
}

.form-group .radio {
  margin-top: 0;
  margin-bottom: 5px;
}

.form-group .radio input {
  display: none;
}

.form-group-default .radio input[type="radio"]:checked+label {
  opacity: 1;
}

.form-group-default .radio label {
  opacity: .4;
}

.has-bottom .has-bottom-button button {
  padding: 10px;
  background-color: #fff;
  border-width: 0;
  transition: all .3s;
  display: block;
  width: 100%;
}

.order-next-pre a .title {
  color: hsl(0, 0%, 30%);
  font-size: 16px;
  margin-bottom: 5px;
}

.card .order-next-pre {
  padding: 15px 20px;
}

.card>.order-next-pre:not(:last-of-type) {
  border-bottom: 1px solid rgba(230, 230, 230, 0.7);
}

.card .order-next-pre .title i {
  color: #2088cd;
  transform: scale(0.9);
}

.order-btns {
  font-size: 16px;
}

.box {
  background-color: #fff;
  padding: 15px;
  border-radius: 4px;
  margin-bottom: 20px;
}

.rand-img {
  height: 100px;
  float: right;
}

#rand-data {
  margin-bottom: 15px;
}

.fly {
  animation: fly 2s ease-in-out infinite;
}

.link-block {
  display: block;
}

.link-block a {
  display: inline-block;
}

.table .sep {
  color: hsl(0, 0%, 70%);
  margin: 0 5px;
}

#btn-video {
  width: 80px;
  height: 80px;
  position: fixed;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 10px;
  text-align: center;
  padding: 5px;
  background: #00bfb6;
  background: -webkit-linear-gradient(to bottom left, #00bfb6, #007dc9);
  background: -o-linear-gradient(to bottom left, #00bfb6, #007dc9);
  background: -moz-linear-gradient(to bottom left, #00bfb6, #007dc9);
  background: linear-gradient(to bottom left, #00bfb6, #007dc9);
  z-index: 10;
}

#btn-video img {
  width: 50px;
}

#btn-video .text {
  font-size: 14px;
  color: #fff;
}

#video-help .modal-header {
  text-align: center;
  padding-top: 35px;
  padding-bottom: 30px;
  border-bottom: 1px solid #e5e5e5;
}

#video-help .modal-header img {
  height: 40px;
  margin: 0 auto 10px;
}

#video-help .modal-header .text {
  margin: 0 auto 5px;
  font-size: 16px;
  font-weight: bold;
}

#video-help .modal-header .sub-text {
  margin: 0 auto;
  font-size: 14px;
  color: hsl(0, 0%, 50%);
}

.modal .modal-dialog.modal-xl {
  max-width: 900px;
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
}

#video-help .modal-body {
  background-color: #f7f9fb;
  padding-top: 20px;
}

#video-help .help-wrap {
  border-radius: 10px;
}

#video-help .help-wrap .title {
  padding: 15px 10px;
  text-align: center;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  text-shadow: 0 0 5px rgba(0, 0, 0, .5);
}

#video-help .help-wrap .links a {
  display: block;
  padding: 10px;
  background-color: #fff;
  color: hsl(0, 0%, 50%);
}

#video-help .help-wrap .links>.block {
  height: 42px;
  border-top: 1px solid #e5e5e5;
  background-color: #fff;
}

#video-help .help-wrap .links a>.text {
  font-weight: bold;
  display: inline-block;
  transform: translateX(0);
  transition: all .3s;
}

#video-help .help-wrap .links a:hover>.text {
  transform: translateX(10px);
}

#video-help .help-wrap .links>a:not(:last-of-type) {
  border-bottom: 1px solid #e5e5e5;
}

#video-help .help-wrap .links a>.time {
  color: hsl(0, 0%, 50%);
  float: right;
}

#video-help .modal-foot {
  border-top: 1px solid #e5e5e5;
  padding: 15px;
  text-align: center;
}

.btn.disabled {
  cursor: not-allowed;
}

.imgs {
  margin-left: -5px;
  margin-right: -5px;
}

.imgs>.bg-img {
  width: 25%;
  float: left;
  padding-left: 5px;
  padding-right: 5px;
}

.header ul li {
  position: relative;
}

.header-icon .bubble {
  display: none;
}

.header-icon.active .bubble {
  display: block;
}

#scheduling-notice {
  display: none;
  color: #fff;
  animation: fadeRed .3s ease-in-out infinite;
}

#scheduling-notice.active {
  display: inline-block;
}

.form-control[readonly] {
  background: transparent;
}

.modal-backdrop.show {
  opacity: .7;
}

.page-lists {
  max-height: 170px;
  overflow-y: scroll;
  padding-top: 5px;
  padding-bottom: 5px;
}

.page-inline {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.search-items>.product-item, .detail-items>.product-item {
  padding-top: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e8e9ea;
}

.modal-price {
  float: left;
  font-size: 14px;
  padding-top: 10px;
}

.modal-price .price {
  font-size: 20px;
  color: #f94816;
}

.product-meta .title {
  color: hsl(0, 0%, 30%);
  font-size: 16px;
  line-height: 1.6;
}

.btn-del {
  z-index: 2;
  display: none;
}

.img-wrap.active .btn-del {
  display: block;
}

.card-block {
  position: relative;
}

pre {
  display: block;
  padding: 9.5px;
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.42857143;
  color: #333;
  word-break: break-all;
  word-wrap: break-word;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.no-arrow.dropdown-toggle:after {
  display: none;
}

.no-arrow {
  cursor: not-allowed !important;
}

.dd-list li:after {
  content: '';
  display: table;
  clear: both;
}

.dd-list li .tool {
  position: absolute;
  right: 0;
  top: 0;
  margin: 0;
  z-index: 2;
  padding-right: 5px;
}

.dd-list li .btn-dd, .dd-list li .btn-dd:hover {
  color: hsl(0, 0%, 50%);
  padding: 6px 5px;
  display: inline-block;
  margin: 0;
  font-size: 14px;
}

.dd-list .dd-list {
  padding-top: 1px;
}

.dd-list .dd-delete {
  position: absolute;
  top: 31px;
}

.dd-list .dd-tool {
  margin: 0;
  left: 0;
  cursor: pointer;
  width: 30px;
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  border: 1px solid rgba(225, 225, 226, 0.7);
  background-color: #fff;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  color: #575a5d;
}

.dd-list .dd-tool:hover {
  background-color: #f5f6f7;
}

.dd3-content:hover {
  background-color: #fff;
}

.dd-list .dd-delete.dd3-handle:before {
  content: "\f2ed";
}

.img-width-limit {
  max-width: 300px;
  width: 100%;
}

a[data-toggle="tooltip"] {
  display: inline-block;
}

a[data-toggle="tooltip"] .label {
  display: inline-block;
}

.tooltip-inner {
  max-width: 300px;
}

.input-group-prepend select.form-control:not([size]):not([multiple]) {
  height: 35px;
  padding-top: 5px;
  padding-bottom: 5px;
}

.slide-img>img {
  height: 100px;
  width: auto;
}

.slide-img .sub {
  word-break: break-all;
}

.slide-img {
  float: left;
}

.dd3-content .label {
  margin-top: -1px;
  margin-bottom: -1px;
}

.dd3-content {
  height: auto;
}

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

.dd3-handle {
  min-height: 32px;
}

.dd3-handle:before {
  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;
  color: #575a5d;
  font-family: "Font Awesome 5 Pro";
  content: "\f338";
  font-weight: 400;
  font-size: 13px;
  top: 9px;
}

.dd3-content:hover {
  color: #575a5d;
}

.img-responsive {
  max-width: 100%;
  height: auto;
}

.bootstrap-tagsinput .tag [data-role="remove"]:after {
  font-family: "Font Awesome 5 Pro";
  content: "\f00d";
  padding: 0;
}

.breadcrumb>.breadcrumb-item+.breadcrumb-item:before {
  font-family: 'Font Awesome 5 Pro';
  font-weight: 400;
}

.breadcrumb {
  text-transform: inherit;
}

.horizontal-app-menu .menu-bar ul li a .arrow:before {
  font-family: 'Font Awesome 5 Pro';
  font-weight: 400;
}

.checkbox input[type=checkbox]:checked+label::after {
  content: "\f00c";
  font-family: "Font Awesome 5 Pro";
  font-weight: 900;
}

.datepicker thead tr .next:before, .datepicker thead tr .prev:before {
  font-family: "Font Awesome 5 Pro";
  font-weight: 900;
}

.card-group .card-header .card-title>a:after {
  font-family: "Font Awesome 5 Pro";
  content: "\f056";
  font-weight: 400;
}

.card-group .card-header .card-title>a.collapsed:after {
  content: "\f055";
}

.btn-action a {
  padding: 0 5px;
  display: inline-block;
  margin: 0;
}

.btn-action a i {
  margin: 0;
  font-size: 14px;
  color: hsl(0, 0%, 60%);
}

.messenger-color {
  color: #0276ff !important;
}

.btn-success.hover, .btn-success:hover, .btn-success:active, .btn-success:focus, .show .dropdown-toggle.btn-success {
  background-color: #4ac9ad !important;
  border-color: #4ac9ad !important;
  color: #fff;
}

.loading1 .card-transparent>.card-block>h3 {
  width: 30%;
  height: 20px;
  background-color: hsl(210, 19%, 91%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading1 .card-transparent>.card-block>p:nth-of-type(1) {
  width: 100%;
  height: 15px;
  background-color: hsl(210, 19%, 91%);
  border-radius: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading1 .card-transparent>.card-block>p:nth-of-type(2) {
  width: 50%;
  height: 15px;
  background-color: hsl(210, 19%, 91%);
  border-radius: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading1 .card-default>.card-block>p:nth-of-type(1), .loading1 .card-default>.card-block>p:nth-of-type(2) {
  width: 100%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading1 .card-default>.card-block>p:nth-of-type(3) {
  width: 50%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading1 .card-default>.card-block>p:nth-of-type(4) {
  width: 70%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading2 .container-fluid>p {
  width: 150px;
  height: 30px;
  background-color: hsl(210, 19%, 91%);
  border-radius: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
  margin-bottom: 20px;
}

.loading2 .table td>p {
  width: 100%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
  margin-top: 10px;
  margin-bottom: 10px;
}

.loading2 .table td {
  text-align: center;
  padding-top: 20px;
  padding-bottom: 20px;
}

.loading3 .card-block>h4>p {
  width: 20%;
  height: 20px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
  margin-bottom: 20px;
  float: left;
}

.loading3 .card-block>h4>.order-btns>p {
  width: 20px;
  height: 20px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 50%;
  animation: fadeplace 1.5s ease-in-out infinite;
  margin-bottom: 20px;
}

.loading3 .card-block>p {
  width: 100%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading3 .card-block>p:nth-of-type(3) {
  width: 50%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading3 .card-block>p:nth-of-type(4) {
  width: 70%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading4 .card-block>p {
  width: 100%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading4 .card-block>p:nth-of-type(3) {
  width: 50%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading4 .card-block>p:nth-of-type(4) {
  width: 70%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading5 .owner>p {
  width: 100px;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 10px;
  margin-top: 5px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading5 .shop-name>p {
  width: 80%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 5px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading5 .shop-meta>p {
  width: 50%;
  height: 15px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  margin-bottom: 5px;
  animation: fadeplace 1.5s ease-in-out infinite;
}

.loading-svg {
  width: 100px;
  display: block;
  margin: 0 auto;
}

.loading2 .table tr:last-of-type>td>p {
  width: 60%;
}

.loading1-list p {
  width: 100%;
  height: 20px;
  background-color: hsl(210, 18%, 93%);
  border-radius: 20px;
  animation: fadeplace 1.5s ease-in-out infinite;
  margin-bottom: 20px;
  margin-top: 20px;
}

.loading-holder {
  display: none;
}

.load-data .loading-holder {
  display: block;
}

.main-inside {
  display: block;
}

.load-data .main-inside {
  display: none;
}

.horizontal-menu .pace .pace-progress {
  top: 50px;
}

.form-group-editor {
  margin-bottom: 10px;
}

.form-group-editor label:not(.error) {
  font-family: "Microsoft JhengHei", "微軟正黑體", "微软雅黑", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 10.5px;
  letter-spacing: .06em;
  font-weight: 500;
}

.form-group-editor label .help {
  margin-left: 8px;
}

.form-group-editor .help {
  font-size: 12px;
  color: rgba(87, 90, 93, 0.55);
}

.note-link-popover {
  z-index: 1060;
}

.profile-dropdown {
  top: 15px !important;
}

.bottom-line {
  color: #00c511;
  font-weight: bold;
}

.bottom-line:hover, .bottom-line:focus, .bottom-line:active {
  color: #00c511;
}

.help-tool {
  text-align: center;
  padding-top: 10px;
  font-size: 12px;
}

.order-notice i {
  margin-left: 5px;
  color: hsl(0, 0%, 60%);
}

.order-notice i.color {
  font-style: normal;
  font-weight: bold;
}

.list-view-fake-header {
  position: relative;
}

.list-view-group-container {
  padding-top: 0;
}

.tags .badge {
  margin-right: 2px;
  margin-bottom: 2px;
}

.form-group-default.form-group-default-select2 .select2-container .select2-selection--multiple {
  height: auto;
}

.export-quick {
  margin-bottom: 5px;
}

body>.pgn-wrapper[data-position="bottom"] {
  left: 0;
}

.shop-meta {
  min-width: 300px;
}

.shop-meta>span {
  margin-right: 10px;
}

.shop-meta>span i {
  color: hsl(0, 0%, 60%);
  margin-right: 10px;
  font-style: normal;
}

.shop-meta .num {
  font-weight: bold;
}

.shop-meta.top {
  margin-bottom: 10px;
}

.navbar-toggle.collapsed>i {
  transform: rotate(0deg);
  transition: all .3s;
}

.navbar-toggle>i {
  transform: rotate(45deg);
  transition: all .3s;
}

.dashboard-title {
  font-weight: bold;
  margin-bottom: 10px;
  display: block;
  font-size: 13px;
  padding-right: 45px;
}

.row-0 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.row-0>div {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.text-blod {
  font-weight: bold;
}

.mobile-header {
  height: inherit;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.mobile-header .btn-link {
  font-size: 16px;
}

.horizontal-app-menu .menu-bar .toggle-sidebar {
  font-size: 16px;
  color: #85858e;
}

.ssl {
  color: #00a30c;
  font-weight: bold;
  padding: 5px 10px;
  font-size: 13px;
  text-align: center;
}

.ssl i {
  margin-right: 5px;
}

.order-notice {
  padding: 3px;
  border: 1px dotted hsl(0, 0%, 80%);
}

.order-notice .title {
  font-size: 12px;
  color: hsl(0, 0%, 30%);
  display: inline-block;
}

.order-notice-wrap>.order-notice {
  border-bottom-width: 0;
}

.order-notice-wrap>.order-notice:last-of-type {
  border-bottom-width: 1px;
}

.all-order-notice .order-notice {
  border-width: 0;
}

.all-order-notice .order-notice .title {
  font-size: 14px;
  margin-right: 5px;
}

.all-order-notice a i {
  color: hsl(0, 0%, 60%);
}

.text-holder {
  width: 100%;
}

.close {
  font-size: 16px;
}

.modal .timeline-point {
  border: 2px solid hsl(0, 0%, 95%);
}

.modal .timeline::before {
  background: hsl(0, 0%, 95%);
}

.modal .timeline {
  padding: 0;
}

.modal .social-card.share .card-header {
  background: hsl(0, 0%, 95%);
}

.modal .social-card.share .card-description {
  background: hsl(0, 0%, 95%);
}

#loading-holder .title {
  margin-top: 30px;
  font-size: 26px;
  margin-bottom: -20px;
}

#loading-holder .modal-content {
  max-width: 250px;
  margin: 0 auto;
}

.apply .btn {
  padding: 3px 10px;
  line-height: 1.6;
}

.help-card .card {
  text-align: center;
  padding: 30px 20px;
}

.help-card .card p {
  font-size: 16px;
  margin-bottom: 15px;
}

.help-card .card .text-light {
  color: hsl(0, 0%, 50%) !important;
}

.help-card .card h3 {
  margin-top: 0;
}

.help-card .card .wrap {
  max-width: 800px;
  margin: 0 auto;
}

.help-card .card img {
  height: 100px;
  display: block;
  margin: 0 auto 20px;
}

#shop .page-help>a {
  width: 34px;
  text-align: center;
  font-weight: bold;
  background-color: #f94816;
  color: #fff;
  font-size: 16px;
}

.shop-plan .card {
  text-align: center;
  font-weight: normal;
}

.shop-plan .card h3 {
  font-size: 20px;
  color: #212529;
  font-weight: bold;
}

.shop-plan .card img {
  height: 100px;
  margin: 15px auto 20px;
  display: block;
}

.shop-plan .card .text {
  height: 110px;
}

.shop-plan .card h2 {
  font-size: 18px;
  line-height: 30px;
}

.shop-plan .card h2>span {
  color: #3a68bf;
  font-size: 36px;
  margin-left: 5px;
  margin-right: 5px;
  font-weight: bold;
}

.shop-plan .card .sub {
  text-align: center;
  color: hsl(0, 0%, 30%);
  font-size: 16px;
}

.shop-plan .card .sub a {
  color: hsl(0, 0%, 30%);
  transition: all .3s;
  display: block;
}

.shop-plan .card .sub a:hover {
  color: #000;
}

.color-light {
  color: hsl(0, 0%, 50%);
}

.tool a, .tool button {
  margin-bottom: 3px;
}

.tools .tool {
  border: 1px solid hsl(0, 0%, 90%);
  background-color: #fff;
  padding: 20px 30px;
  margin-bottom: 30px;
}

.tools .tool>h3 {
  text-align: left;
  font-size: 20px;
  margin-bottom: 10px;
  font-weight: bold;
}

.tools .tool ul {
  list-style: none;
  padding-left: 0;
  text-align: left;
  margin-bottom: 0;
}

.tools .tool ul>li {
  margin-bottom: 5px;
}

.feature>h3 {
  text-align: center;
  margin-top: 50px;
  margin-bottom: 30px;
}

.word-break {
  word-break: break-all;
}

.form-group .form-tool {
  padding-top: 5px;
}

.each-shop.ShopStatus0 {
  background-color: #ffe8e5;
}

.each-shop.ShopStatus2,
.each-shop.ShopStatus3 {
  background-color: #fdf5df;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

input[type="number"] {
  -moz-appearance: textfield;
}

.input-group-text {
  background-color: #fff;
  font-size: 13px;
  border: 1px solid #e8e9ea;
}

.form-control-plaintext {
  padding: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.hover {
  cursor: pointer;
}

.product-page {
  margin-top: 3px;
}

.product-page a i {
  margin-left: 0;
  margin-right: 5px;
}

.status-meta .label {
  margin-right: 5px;
  margin-bottom: 2px;
  margin-top: 2px;
}

.modal-body .pagination {
  margin-bottom: 0;
  margin-top: 20px;
}

.product-meta .page {
  margin-bottom: 3px;
}

.list-discount .label {
  margin-right: 5px;
}

.form-sm {
  margin-left: -5px !important;
  margin-right: -5px !important;
}

.form-sm .col {
  padding-left: 5px;
  padding-right: 5px;
}

.select-page {
  height: 38px;
  width: 200px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
}

.table-receipt .btn-icon {
  padding-top: 0;
  padding-bottom: 0;
}

.modal .modal-w {
  width: 1000px;
}

.order-label {
  margin-top: -5px;
}

.order-label>a {
  margin-top: 5px;
}

.all-caps {
  font-size: 13px;
}

.card-dashboard {
  margin-bottom: 10px;
}

.card-dashboard .num {
  font-size: 24px;
  line-height: 26px;
  font-weight: normal;
}

.dashboard-provider h3.pull-left {
  font-size: 16px;
}

.card-dashboard .num small {
  font-size: 12px;
  font-weight: normal;
  margin-right: 10px;
}

.card-dashboard .col-top {
  font-size: 14px;
}

.card-dashboard .label-icon {
  color: rgb(87, 90, 93);
}

.card-dashboard .sub-num {
  font-weight: bold;
  margin-left: 5px;
}

.form-section {
  position: relative;
}

.form-section .btn-group {
  margin-top: 5px;
  display: block;
  margin-bottom: 10px;
}

.mess-pop {
  justify-content: flex-start;
  display: flex;
  margin-left: 35px;
  margin-bottom: 3px;
}

.mess-text {
  max-width: 85%;
  line-height: 1.35;
  font-size: .88rem;
  text-align: initial;
  border-radius: 4px 14px 14px 4px;
  border-top-left-radius: 14px;
  border-bottom-left-radius: 14px;
  border: 1px solid #f1f0f0;
  background-color: #f1f0f0;
  overflow: hidden;
}

.mess-text-show {
  color: #000;
  padding: 6.16px 10.56px;
  word-wrap: break-word;
}

.mess-img-show img {
  width: 100%;
}

.new-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  position: relative;
  color: #0084ff;
  border: 2px solid #e0e6ed;
  background-color: #fff;
  transition: border-color .15s, color .15s;
  will-change: border-color, color;
  cursor: pointer;
}

.mess-text .new-button {
  padding: 7px;
  border: none !important;
  display: block;
  text-align: center;
}

.mess-text h4 {
  margin: 0;
  font-size: 16px;
}

.mess-text h5 {
  margin: 0;
  color: hsl(0, 0%, 30%);
  font-size: 14px;
}

.mess-avt {
  position: absolute;
  bottom: 0;
  width: 32px;
  height: 32px;
  vertical-align: middle;
  border-radius: 50%;
  overflow: hidden;
}

.mess-avt img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  -o-object-fit: cover;
  object-fit: cover;
}

.mess-view-pop {
  position: relative;
}

.mess-img {
  max-width: 85%;
  min-height: 100px;
  overflow: hidden;
  line-height: 0;
  background-color: transparent;
  border-radius: 4px 14px 14px 4px;
  border: 1px solid #e0e0e0;
}

.mess-img img {
  width: 100%;
}

.notice-cards .tip .text-content {
  min-height: 60px;
}

.notice-cards .tip .text-content p {
  margin: 0;
}

.editable-container.editable-inline {
  display: block;
}

.img-sm {
  max-width: 50px;
  position: relative;
  border-radius: .25rem;
  display: block;
}

.img-sm .mask {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0, 0, 0, .5);
  text-align: center;
  opacity: 0;
  transition: all .3s;
  border-radius: .25rem;
}

.img-sm:hover .mask {
  opacity: 1;
}

.img-sm .mask i {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  font-size: 14px;
  color: #fff;
  margin: 0;
}

.OldImages {
  margin-bottom: 10px;
}

.OldImages img {
  width: 100px;
  margin-right: 10px;
}

.editableform-loading {
  background-image: url(/pages/img/progress/progress-circle-info.svg);
  background-size: 15px;
}

.editable-input select {
  -webkit-appearance: menulist;
}

.product-meta .label {
  margin-right: 5px;
}

.label-m-r .label {
  margin-right: 5px;
}

.radio-padding label {
  padding-top: 1px;
  padding-bottom: 1px;
}

.fs-14 {
  line-height: 1.6;
}

.item-hide {
  max-width: 400px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.item-hide:hover {
  white-space: inherit;
}

.horizontal-app-menu .menu-bar ul li .sub-menu {
  left: 70%;
}

.dd-item>button[data-action="collapse"] {
  display: none;
}

.content-sections .quick-add {
  text-align: center;
  border-top: 1px dotted hsl(0, 0%, 80%);
  padding: 15px 0 10px;
}

.content-section .quick-add {
  display: none;
}

.content-section:hover .quick-add {
  display: block;
}

.content-sections .quick-add .quick-add-title {
  font-size: 20px;
  padding-bottom: 5px;
}

.content-sections .quick-add a {
  padding: 3px;
  padding: 5px 10px;
  display: inline-block;
}

.content-sections .quick-add a i {
  font-size: 16px;
  color: hsl(0, 0%, 50%);
  margin-right: 5px;
}

.content-sections .quick-add a .text {
  color: hsl(0, 0%, 50%);
}

.price-percent .fixed {
  display: none;
}

.price-percent .percent {
  display: block;
}

.price-fixed .fixed {
  display: block;
}

.price-fixed .percent {
  display: none;
}

.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.hover {
  cursor: pointer;
}

.label-web {
  color: hsl(0, 0%, 50%);
  margin-left: 5px;
}

.guest-page {
  display: inline-block;
  padding: 14px;
  color: #fff;
  text-align: left;
}

.guest-page span {
  width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  display: block;
}

.form-control-plaintext {
  color: hsl(0, 0%, 40%);
}

.search-order {
  color: #fff;
}

.search-order input {
  background-color: transparent;
  width: 260px;
}

.search-order input::placeholder {
  color: #fff;
  opacity: .7;
}

.search-order input {
  color: #fff;
}

.search-order .mode {
  position: absolute;
  right: 0;
  top: 0;
  color: #fff !important;
  z-index: 1;
  padding: 10px;
}

.search-order input:focus+.mode {
  color: #000 !important;
}

.has-help-text {
  position: relative;
}

.has-help-text .text {
  border-radius: 4px;
  background-color: hsl(0, 0%, 80%);
  color: #000;
  font-size: 12px;
  position: absolute;
  display: block;
  width: 80px;
  padding: 5px;
  top: 30px;
  left: -50%;
  text-align: center;
  display: none;
}

.has-help-text:hover .text {
  display: block;
}

.in-web-mask {
  background: rgba(255, 255, 255, 0.8);
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 2;
}

.in-web-mask .center {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  transform: translateY(-50%);
  color: hsl(0, 0%, 30%);
  font-size: 16px;
  padding: 20px;
  text-align: center;
}

#quick-fixed-tool {
  list-style: none;
  position: fixed;
  right: 30px;
  bottom: 30px;
  margin: 0;
  padding: 0;
}

#quick-fixed-tool li button {
  display: block;
  color: hsl(0, 0%, 30%);
  background-color: transparent;
  border-width: 0;
  height: 20px;
  width: 20px;
  text-align: center;
  position: relative;
  cursor: pointer;
}

#quick-fixed-tool li button i {
  line-height: 20px;
  font-size: 16px;
}

#quick-fixed-tool li button .text {
  display: block;
  font-size: 12px;
  background-color: hsl(0, 0%, 30%);
  color: #fff;
  border-radius: 4px;
  position: absolute;
  right: 25px;
  width: 80px;
  line-height: 20px;
  top: 0;
  display: none;
}

#quick-fixed-tool li button:hover .text {
  display: block;
}

.nav-sort,
.nav-order {
  color: hsl(0, 0%, 50%) !important;
}

.nav-sort.active,
.nav-order.active {
  color: #2088cd !important;
}

.checkbox .tip-icon {
  margin-bottom: 0;
}

body .table tbody tr td.td-danger,
body .table tbody tr:hover td.td-danger,
.table.table-hover tbody tr.selected:hover td.td-danger,
body .table tbody tr.tr-danger td,
body .table tbody tr.tr-danger:hover td,
.table.table-hover tbody tr.selected.tr-danger:hover td {
  background-color: #fedad0 !important;
}

.CustomerName,
.CustomerName:hover,
.CustomerName:active,
.CustomerName:focus {
  color: #575a5d;
}

.table a.CustomerName i {
  margin-left: 0;
}

/*本次新增*/
.dropdown-toggle .icon img {
  width: 20px;
}

.list-view li>a .text-master img {
  width: 20px;
}

.list-view li>a .text-master .icon {
  margin-right: 5px;
}

.nav-item .badge {
  background-color: #fff;
  padding: 2px 3px;
  min-width: 15px;
  text-align: center;
  margin-left: 5px;
}

.ship-cash {
  background-color: #006bcf;
  color: #fff;
}

.ship-no-cash {
  background-color: #1dbb99;
  color: #fff;
}

.store-address {
  font-size: 12px;
  color: hsl(0, 0%, 40%);
}

.store-phone {
  font-size: 12px;
  color: hsl(0, 0%, 50%);
}

.ship-date {
  font-size: 12px;
  color: hsl(0, 0%, 30%);
}

.menu-level {
  padding-bottom: 10px;
}

.menu-level .btn {
  background-color: transparent;
  border-width: transparent;
  padding-left: 10px;
  padding-right: 10px;
}

.menu-level .btn.active {
  border-color: #3a68bf;
  color: #000;
}

.menu-level .btn .badge {
  background-color: hsl(0, 0%, 98%);
  padding: 2px 3px;
  margin-left: 5px;
  min-width: 15px;
  text-align: center;
}

.has-top-menu-level {
  padding-top: 109px;
}

.menu-level .btn.text-warning .badge {
  background-color: #ec971f;
  color: #fff;
}

.menu-level .btn.text-danger .badge {
  background-color: #f94816;
  color: #fff;
}

.form-group .radio-inline {
  display: inline-block;
  margin-bottom: 0;
  margin-right: 10px;
}

.modal .modal-header p {
  color: #575a5d;
}

.btn.required:after {
  color: #f94816;
  content: "*";
  font-family: arial;
  font-size: 20px;
  position: absolute;
  right: 12px;
  top: 6px;
}

.form-group-default.has-error input {
  background-color: transparent;
}

.navbar-toggle:after {
  font-size: 12px;
  content: '關閉';
}

.navbar-toggle.collapsed:after {
  font-size: 12px;
  content: '展開';
}

.table .OrderNumber {
  font-size: 12px;
}

#shop-sub .btn {
  margin-right: 5px;
}

.color-ShopOrderNumber {
  color: #ec971f !important;
}

.color-OrderID {
  color: #3a68bf !important;
}

.color-OrderNumber {
  color: #1dbb99 !important;
}

.text-box {
  border: 1px solid rgba(230, 230, 230, 0.7);
  margin-bottom: 10px;
}

.text-box .title {
  background-color: rgba(230, 230, 230, 0.7);
  padding: 5px 10px;
}

.text-box .inside {
  padding: 5px 30px 5px 10px;
  position: relative;
}

.text-box .inside .icon {
  width: 20px;
  position: absolute;
  right: 5px;
  top: 5px;
}

.price-section {
  padding-bottom: 10px;
}

.price-section .receiver-amount {
  font-weight: bold;
  font-size: 20px;
}

.price-section .total-amount {
  font-size: 15px;
}

.price-section .total-amount small {
  font-size: 12px;
  color: hsl(0, 0%, 50%);
  display: inline;
  margin-right: 5px;
}

.timeline-track .card {
  padding: 8px 12px;
}

.timeline-track .card h5 {
  font-weight: bold;
  font-size: 14px;
  margin: 0;
  line-height: 22.7px;
}

.timeline-track .card .description {
  font-size: 13px;
  line-height: 21px;
  color: hsl(0, 0%, 50%);
}

.timeline-track {
  padding-top: 0;
}

.timeline-track .timeline-block {
  margin: 0;
}

.timeline-track .timeline-content .event-date {
  padding-top: 5px;
  font-size: 12px;
}

.user-edit-note {
  font-size: 12px;
  color: hsl(0, 0%, 50%);
}

.user-edit-note>span {
  color: hsl(0, 0%, 30%);
}

.list-view-wrapper {
  position: relative;
}

.hightline {
  background-color: hsl(0, 0%, 90%);
  padding-left: 3px;
  padding-right: 3px;
}

.top-number {
  padding: 18px 5px 10px;
  text-align: center;
}

.top-number .top-text {
  font-size: 12px;
  line-height: 14px;
}

.top-number .top-num {
  font-size: 15px;
  line-height: 18px;
  font-weight: bold;
}

.dashboard-provider {
  margin-bottom: 10px;
}

.dashboard-provider .icon {
  height: 25px;
  margin-top: -5px;
  margin-right: 10px;
}

.dashboard-provider .total {
  font-size: 14px;
}

.dashboard-provider .padding-25 {
  padding-bottom: 10px !important;
}

.dashboard-provider .b-dashed {
  font-weight: bold;
}

.table-link tr {
  cursor: pointer;
}

.original .num>.each:not(:last-of-type) {
  margin-bottom: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(225, 225, 226, 0.7);
}

.support {
  opacity: 1 !important;
  color: #1dbb99 !important;
}

.card-dashboard .provider {
  color: hsl(0, 0%, 60%);
  font-size: 12px;
}

.card-dashboard .provider>span {
  margin-right: 10px;
}

.card-dashboard .provider>span b {
  color: hsl(0, 0%, 60%);
  margin-left: 5px;
  font-size: 14px;
}

.icon-sm img {
  height: 15px;
  display: inline-block;
}

.icon-sm .text {
  color: hsl(0, 0%, 50%);
  font-size: 12px;
  margin-left: 3px;
  display: inline-block;
}

.notice-status {
  cursor: pointer;
}

.notice-status .each {
  display: block;
  float: left;
  width: 33.3%;
}

.notice-status .each i {
  margin-right: 5px;
  margin-left: 5px;
  color: hsl(0, 0%, 60%);
}

.notice-status .each>span {
  font-size: 12px;
}

.table .pay-detail .wrap {
  font-size: 14px;
  display: inline-block;
}

.table .pay-detail .wrap b {
  font-size: 12px;
}

.table .pay-detail .wrap-sep {
  margin-left: 5px;
  margin-right: 5px;
  font-size: 14px;
  display: inline-block;
}

.test-server {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 2;
}

.items {
  word-break: break-word;
}

.form-control-button {
  background-color: transparent;
  border-width: 0;
  position: absolute;
  right: 5px;
  bottom: 4px;
  color: hsl(0, 0%, 60%);
  cursor: pointer;
  margin-bottom: 0 !important;
}

.form-control-button:hover {
  color: hsl(0, 0%, 50%);
}

.pay-text {
  padding-top: 5px;
  font-weight: bold;
  font-size: 16px;
}

.search-link-top {
  margin-top: 0 !important;
  border-top: 1px solid hsl(0, 0%, 30%);
}

.search-form {
  flex-shrink: 0;
  margin-top: auto;
}

.search-form .btn {
  border-radius: 0;
  border-width: 0;
  background-color: rgba(133, 133, 142, 0.1);
  color: hsl(0, 0%, 80%);
  padding: 15px 20px;
  font-size: 16px;
}

.search-form input {
  border-radius: 0;
  border-width: 0;
  background-color: rgba(133, 133, 142, 0.1);
  color: hsl(0, 0%, 80%);
  height: 46px;
  padding: 15px 20px;
}

.search-form .form-control::-webkit-input-placeholder {
  color: hsl(0, 0%, 80%);
  opacity: 1;
}

.search-form .form-control::-moz-placeholder {
  color: hsl(0, 0%, 80%);
  opacity: 1;
}

.search-form .form-control:-ms-input-placeholder {
  color: hsl(0, 0%, 80%);
  opacity: 1;
}

.search-form .form-control::-ms-input-placeholder {
  color: hsl(0, 0%, 80%);
  opacity: 1;
}

.search-form .form-control::placeholder {
  color: hsl(0, 0%, 80%);
  opacity: 1;
}

.search-form .form-control:focus::-webkit-input-placeholder {
  color: hsl(0, 0%, 50%);
}

.search-form .form-control:focus::-moz-placeholder {
  color: hsl(0, 0%, 50%);
}

.search-form .form-control:focus:-ms-input-placeholder {
  color: hsl(0, 0%, 50%);
}

.search-form .form-control:focus::-ms-input-placeholder {
  color: hsl(0, 0%, 50%);
}

.search-form .form-control:focus::placeholder {
  color: hsl(0, 0%, 50%);
}

.order-list {
  margin-bottom: 10px;
}

.order-list .each {
  display: inline-block;
  margin-right: 20px;
  margin-bottom: 5px;
}

.form-group .btn {
  margin-right: 5px;
  margin-bottom: 5px;
}

.search-order.sm input {
  width: 100px;
}

.radio label:before, .checkbox label:before {
  top: 2px;
}

.table .provider {
  color: hsl(0, 0%, 50%);
  font-size: 12px;
  margin-right: 5px;
}

.icon-provider {
  height: 15px;
  margin-right: 5px;
  margin-top: -2px;
}

.form-control.datepicker {
  padding: 9px 12px;
}

.form-group .form-control.datepicker {
  padding: 0;
}

.label .badge {
  padding: 2px 4px;
  font-size: 11px;
  transform: scale(0.9);
  margin: -1px -2px -1px 2px;
  border-radius: 3px;
}

a.disabled {
  pointer-events: none;
}

.note-button button {
  border-width: 0;
  background-color: transparent;
  padding: 0;
  color: #2088cd;
}

.badge-link i,
.note-button i {
  margin-right: 5px;
  color: hsl(0, 0%, 60%);
  width: 16px;
  text-align: center;
}

.badge-link {
  color: #2088cd;
}

.badge-link span,
.badge-link a {
  display: inline-block;
}

.form-group-default.focused label {
  opacity: 1;
}

.form-group-default label.fade {
  -webkit-backface-visibility: inherit;
  -moz-backface-visibility: inherit;
  backface-visibility: inherit;
}

.modal.fade.slide-up {
  top: 0;
}

.card-progress {
  z-index: 10;
}

.header .btn-danger, .header .btn-danger:focus, .header .btn-danger:hover, .header .btn-danger:active, .header .btn-danger:focus {
  color: #fff;
}

@media (max-width: 979px) {
  .horizontal-app-menu .header .header-inner .brand.inline {
    padding: 0;
    margin: 0;
    margin-left: 15px;
  }
}

@keyframes fadeplace {
  0% {
    opacity: 1;
  }

  50% {
    opacity: .6;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeRed {
  0% {
    color: #f94816;
  }

  50% {
    color: #fff;
  }

  100% {
    color: #f94816;
  }
}

@-webkit-keyframes c1_2 {
  0% {
    stroke-width: 0;
  }

  10% {
    stroke-width: 8;
  }

  75% {
    stroke-width: 8;
  }

  90% {
    stroke-width: 0;
  }

  100% {
    stroke-width: 0;
  }
}

@-webkit-keyframes c1_3 {
  0% {
    stroke-dasharray: 104, 156;
    stroke-dashoffset: -52;
  }

  16% {
    stroke-dasharray: 1, 156;
    stroke-dashoffset: -52;
  }

  16.01% {
    stroke-dasharray: 1, 156;
    stroke-dashoffset: -208;
  }

  33% {
    stroke-dasharray: 104, 52;
    stroke-dashoffset: -104;
  }

  33.01% {
    stroke-dasharray: 104, 52;
    stroke-dashoffset: -104;
  }

  49% {
    stroke-dasharray: 1, 156;
    stroke-dashoffset: -104;
  }

  49.01% {
    stroke-dasharray: 1, 156;
    stroke-dashoffset: 52;
  }

  66% {
    stroke-dasharray: 104, 52;
    stroke-dashoffset: 156;
  }

  66.01% {
    stroke-dasharray: 104, 52;
    stroke-dashoffset: 156;
  }

  82% {
    stroke-dasharray: 1, 156;
    stroke-dashoffset: 156;
  }

  82.01% {
    stroke-dasharray: 1, 156;
    stroke-dashoffset: 156;
  }

  99.99% {
    stroke-dasharray: 104, 52;
    stroke-dashoffset: 256;
  }
}

@-webkit-keyframes c1_1 {
  0%, 100% {
    -webkit-transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(-360deg);
  }
}

@media (max-width: 991px) {
  .horizontal-app-menu .menu-bar>ul li>a {
    color: #fff;
  }

  .menu-bar>ul>li.sep {
    border-right: none;
    margin-bottom: 10px;
    height: 0;
    min-height: auto;
  }

  .breadcrumb {
    padding-left: 15px !important;
    padding-right: 15px;
  }

  .card-transparent {
    margin-bottom: 0;
  }

  .tool {
    padding-left: 15px;
    padding-right: 15px;
    margin-bottom: 15px;
  }

  .table-responsive {
    border: none;
  }

  .navbar-tool.slideUp {
    /*top: 50px;*/
  }

  .navbar-tool {
    top: 50px;
  }

  .nav-tool>li {
    width: 100%;
    float: none;
    display: block;
  }

  .nav-tool>li:not(:last-of-type) {
    margin-right: 0;
  }

  .flex-row {
    -webkit-box-orient: vertical !important;
    -webkit-box-direction: normal !important;
    -webkit-flex-direction: inherit !important;
    -ms-flex-direction: column !important;
    flex-direction: column !important;
  }

  .navbar-toggle {
    display: inline-block;
  }

  .sm-padding-10 {
    padding: 10px !important;
  }

  .navbar-collapse.collapse {
    display: none !important;
  }

  .collapse.show {
    display: block !important;
  }

  .nav-tool>li>a, .nav-tool>li>button {
    margin-bottom: 10px;
    margin-top: 0;
  }

  .nav-tool {
    width: 100%;
    float: none;
  }

  .nav-page .dropdown-toggle {
    width: 100%;
  }

  .navbar-tool {
    max-height: 300px;
    overflow-y: scroll;
  }

  .error-number {
    font-size: 56px;
  }

  .table-responsive {
    overflow-x: scroll;
  }

  .nav-tool>li>a, .nav-tool>li>button, .nav-tool>li>a:not([href]):not([tabindex]) {
    width: 100%;
    margin-top: 5px;
    margin-bottom: 5px;
  }

  .breadcrumb {
    margin-left: -15px;
    margin-right: -15px;
  }

  .navbar-nav>li.search-icon>a {
    width: 100%;
    margin-bottom: 0;
  }

  .overlay .overlay-search {
    font-size: 30px !important;
    height: auto !important;
  }

  .horizontal-app-menu .menu-bar>ul>li:first-child a, .horizontal-app-menu .menu-bar>ul>li:last-child a {
    padding-right: 20px !important;
    padding-left: 20px !important;
  }

  table.dataTable {
    margin-bottom: 20px !important;
  }

  .navbar-nav .text {
    padding-top: 10px;
    padding-left: 0 !important;
  }

  .navbar {
    min-height: auto;
  }

  .navbar-header {
    display: block;
    width: 100%;
  }

  .navbar-toggle {
    width: 100%;
  }

  .container {
    max-width: 100%;
  }

  .full-width {
    padding-left: 0;
    padding-right: 0;
  }

  .table-tool .container {
    padding: 0;
  }

  .original {
    border-bottom: 1px solid rgba(230, 230, 230, 0.7);
  }

  #quick-fixed-tool {
    right: 15px;
    bottom: 15px;
  }
}

@media (max-width: 768px) {
  .breadcrumb {
    margin-left: 0;
    margin-right: 0;
  }

  form .row [class*='col-']:first-child {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  form .row [class*='col-']:last-child {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }

  #tip {
    padding-left: 15px;
    padding-right: 15px;
  }

  .tool-bar>span {
    display: block;
    margin-bottom: 3px;
  }

  #video-help .help-wrap {
    margin-bottom: 30px;
  }

  #video-help .modal-body {
    padding-bottom: 0;
  }

  .modal .modal-dialog.modal-xl {
    margin: 10px 0;
  }

  #btn-video {
    display: none;
  }

  .content-section .btn-group button>span {
    display: none;
  }

  .modal .item-hide {
    max-width: 200px;
  }

  .list-has-left>li:first-of-type {
    width: 20%;
  }

  .list-has-left>li {
    width: 80%;
  }

  .list-half-has-left>li:first-of-type {
    width: 20%;
  }

  .list-half-has-left>li {
    width: 80%;
  }

  .list-half-has-left>li:last-of-type {
    width: 100%;
  }

  .dd-list .list-half-has-left>li {
    width: 100%;
  }

  .border-padding {
    padding-left: 15px;
    padding-right: 15px;
  }
}

@media (max-width: 480px) {
  .p-l-50 {
    padding-left: 10px !important;
  }

  .p-r-50 {
    padding-right: 10px !important;
  }

  .p-t-50 {
    padding-top: 10px !important;
  }

  .original.p-t-50 {
    padding-top: 50px !important;
  }

  #btn-video {
    right: 10px;
    top: auto;
    bottom: 30px;
    transform: translateY(0%);
    display: none;
  }

  .form-block .input-group-prepend,
  .form-block .input-group-prepend select,
  .form-block .input-group-append,
  .form-block .input-group-append button {
    display: block;
    width: 100%;
  }

  .overlay .overlay-close {
    right: 15px;
    top: -10px;
  }

  .overlay-close>i {
    font-size: 26px;
  }

  .overlay .overlay-search {
    padding-right: 15px;
  }
}

@media (max-width: 768px) {
  .header-inner .brand img {
    display: none;
  }

  .tip .img {
    display: none;
  }

  .tip .text {
    float: none;
    width: 100%;
  }
}