/*# sourceMappingURL=custom.min.css.map */ /*Custom Color*/ :root { --vz-stress: #FF3A65; --vz-primary-soft:rgb(213,216,228); --vz-primary-lite:rgb(224,226,235); --vz-primary-deep:rgb(59,63,69); --vz-primary-heavy:rgb(51,56,61); } .text-stress {--vz-text-opacity: 1; color: var(--vz-stress);} .ribbon-box .ribbon-two-stress span {background:var(--vz-stress);} .ribbon-box .ribbon-two-stress span::before {border-left: 3px solid #CF0614;border-top: 3px solid #CF0614;} .ribbon-box .ribbon-two-stress span::after {border-right: 3px solid #CF0614;border-top: 3px solid #CF0614;} .btn-stress { --vz-btn-color: #fff; --vz-btn-bg: #FF3A65; --vz-btn-border-color: #FF3A65; --vz-btn-hover-color: #fff; --vz-btn-hover-bg: #F7274A; --vz-btn-hover-border-color: #D62544; --vz-btn-focus-shadow-rgb: 47,190,171; --vz-btn-active-color: #fff; --vz-btn-active-bg: #D62544; --vz-btn-active-border-color: #CF0614; --vz-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); --vz-btn-disabled-color: #fff; --vz-btn-disabled-bg: #FF3A65; --vz-btn-disabled-border-color: #FF3A65; } .form-check-stress .form-check-input:checked { background-color: var(--vz-stress); border-color: var(--vz-stress); } .form-check-outline.form-check-stress .form-check-input:checked[type=checkbox] { color: var(--vz-stress); background-color: transparent; border-color: var(--vz-stress); } /* Preparation Loading */ .preLoad {width:100%; height:100%; display:flex; justify-content:center; position:absolute; left:0; top:0; background:rgba(255,255,255,.5); z-index:10;} .preLoad .spinner-border {align-self:center; border-width: 0.15rem;} [data-layout-mode="dark"] .preLoad {background:rgba(20, 22, 25, 0.5);} /* Sign Page ------------------------- */ .signCover, .signCoverBg, .signCoverImg {position: fixed; top: 0; left: 0; right: 0; bottom: 0; background-size: cover; background-repeat: no-repeat; background-position: center; transition: background .2s linear;} .signCoverBg {background: rgba(0,0,0,.0);} .signBgList {list-style-type: none; margin: 0; padding: 0; display:flex; justify-content: center!important;} .signBgList>li {width: 66px; height: 66px; overflow: hidden; transition: all .2s linear; border: 3px solid transparent; border-radius:50%;} .signBgList>li.active {border-color: #fff; z-index: 1020; position: relative;} .signBgList>li a {display: block; height: 100%; width:100%; overflow: hidden; background-size: cover; background-repeat: no-repeat; background-position: center;} .auth-page-wrapper {padding:0; position:absolute; z-index:999; left:0; top:0; width:100%; height:100%; overflow-y:auto; overflow-x:hidden; display: flex; justify-content: center; align-items: center;} .auth-page-wrapper .card {margin:0; padding:0;} .auth-page-wrapper .auth-page-content {padding:0;} .auth-page-wrapper .card {background:transparent; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); -ms-backdrop-filter: blur(10px); -o-backdrop-filter: blur(10px);} .auth-page-wrapper .main {background: hsla(0,0%,100%,.3);} .auth-page-wrapper h3, .auth-page-wrapper .form-label {margin-bottom:.2rem;} .auth-page-wrapper .copyright {position:relative;} .auth-page-wrapper .copyright>div {position:absolute; top:20px; width:100%; display: flex; justify-content: center; align-items: center;} .commonApps .dropdown-icon-item img {height:42px;} /* Side Nav ------------------------- */ [data-sidebar="light"] .navbar-menu .navbar-nav .nav-link:hover, [data-sidebar="light"] .navbar-menu .navbar-nav .nav-link:hover::after, [data-sidebar="light"] .navbar-menu .navbar-nav .nav-link.active, [data-sidebar="light"] .navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true], [data-sidebar="light"] .navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true]::after, [data-sidebar="light"] .navbar-menu .navbar-nav .nav-sm .nav-link:hover, [data-sidebar="light"] .navbar-menu .navbar-nav .nav-sm .nav-link.active {color: var(--vz-stress)!important;} [data-sidebar="light"] .navbar-menu .navbar-nav .nav-sm .nav-link:hover::before, [data-sidebar="light"] .navbar-menu .navbar-nav .nav-sm .nav-link.active::before {background-color: var(--vz-stress)!important;} [data-layout-mode="dark"] .navbar-menu {background: var(--vz-vertical-menu-bg-dark)!important; border-right: 1px solid var(--vz-vertical-menu-bg-dark)!important;} [data-layout-mode="dark"] .logo-dark {display: none!important;} [data-layout-mode="dark"] .logo-light {display: inline-block!important;} [data-layout-mode="dark"][data-sidebar-size=sm] .navbar-brand-box {background: var(--vz-vertical-menu-bg-dark)!important;} [data-layout-mode="dark"] .navbar-nav .nav-link {color: var(--vz-vertical-menu-item-color-dark)!important;} [data-layout-mode="dark"] .navbar-nav .nav-link:hover {color: var(--vz-vertical-menu-item-hover-color-dark)!important;} [data-layout-mode="dark"] .navbar-nav .nav-sm .nav-link {color: var(--vz-vertical-menu-sub-item-color-dark)!important;} [data-layout-mode="dark"] .navbar-nav .nav-sm .nav-link::before {background-color: var(--vz-vertical-menu-sub-item-color-dark)!important;} [data-layout-mode="dark"] .navbar-nav .nav-sm .nav-link:hover::before {background-color: var(--vz-vertical-menu-item-hover-color-dark)!important;} [data-layout-mode="dark"] .navbar-nav .nav-sm .nav-link.active, [data-layout-mode="dark"] .navbar-nav .nav-link.active, [data-layout-mode="dark"] .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true] {color: var(--vz-vertical-menu-item-active-color-dark)!important;} [data-layout-mode="dark"] .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true]::after {color: inherit;} /* Side Mod ------------------------- */ .dssMod {display:flex; align-items:center; padding-top:13px;} .dssMod a {width:42px; height:42px; justify-content:center; align-items:center;} .dssMod a i {opacity:.5; transition:.15s ease-in-out;} .dssMod a:hover i {opacity:1;} .dssMod i.bx-notification {transform: scaleX(-1)!important;} .dssMod .dss-lg, .dssMod .dss-sm-hover, .dssMod .dss-dft {display:none;} html[data-sidebar-size="lg"][data-layout-style="detached"] .dssMod .dss-sm-hover, html[data-sidebar-size="sm-hover"][data-layout-style="detached"] .dssMod .dss-dft, html[data-sidebar-size="sm-hover"][data-layout-style="default"] .dssMod .dss-lg, html[data-sidebar-size="sm-hover-active"][data-layout-style="default"] .dssMod .dss-lg {display:flex;} html[data-layout-style="default"] .dssMod {padding-top:unset;} /* Node New ------------------------- */ .nodePrice {font-size:3rem; font-style: italic; margin:-16px 5px;} .nodePrice sup {top:-1rem;} .nodePrice sub {bottom:0.2rem;} #nodeNew .form-label {margin-bottom:.2rem;} /* Node MY ------------------------- */ .nodeMeta {display:inline-flex; flex-wrap:nowrap; align-items:center; gap:.5rem;} .nodeAvatar .naTitle {width:32px; height:32px; border-radius:50%; overflow:hidden; display:flex; justify-content:center; align-items:center; font-weight:500; font-size:larger; color:rgba(64,81,137,1); border:1px solid rgba(64,81,137,1); background-color:rgba(248,198,58,.2);} .nodeAvatar .naTitle img {width:100%; height:100%; object-fit:cover;} .nodeAvatar .naIcon {width:14px; height:14px; border-radius:50%; position:absolute; left:20px; bottom:0; font-size:10px!important;line-height:14px; text-align:center; vertical-align:middle; background-color: rgba(64,81,137,1); color: rgba(255,255,255,1);} .nodeAvatar .naIcon i { display:block;} [data-layout-mode="dark"] .nodeAvatar .naTitle {color:rgba(248,198,58,1); border:1px solid rgba(248,198,58,1); background-color:#1a1d21;} [data-layout-mode="dark"] .nodeAvatar .naIcon {background-color:rgba(248,198,58,1); color:#1a1d21;} /* scroller ------------------------- */ .scroller {height: calc(100vh - 112px); padding: 10px 10px 100px; overflow-y: scroll;} /* scroller-status ------------------------- */ .scroller-status {display: none; padding: 20px 0;} .scroller-status__message {text-align: center;color: #777;} .masonry-small .image-grid__item {margin-bottom: 10px;} /* image-grid ------------------------- */ .image-grid {max-width: 1200px;} .image-grid__item, .image-grid__col-sizer {width: 24.5%;} .image-grid__gutter-sizer { width: .5%; } .image-grid__item {margin-bottom: 20px;float: left;} /* hide by default */ .image-grid.are-images-unloaded .image-grid__item {opacity: 0;} .image-grid__image {display: block;max-width: 100%;} /* icon-grid ------------------------- */ .icon-grid {max-width: 1200px;} .icon-grid__item, .icon-grid__col-sizer {width: 16%;} .icon-grid__gutter-sizer { width: .8%; } .icon-grid__item {margin-bottom: 10px;float: left;} /* hide by default */ .icon-grid.are-images-unloaded .icon-grid__item {opacity: 0;} .icon-grid__image {display: block;max-width: 100%;} /* loader-ellips ------------------------- */ .loader-ellips {font-size: 20px; position: relative; width: 4em; height: 1em; margin: 10px auto; } .loader-ellips__dot {display: block; width: 1em; height: 1em; border-radius: 0.5em; background: #555; position: absolute; animation-duration: 0.5s; animation-timing-function: ease; animation-iteration-count: infinite;} .loader-ellips__dot:nth-child(1), .loader-ellips__dot:nth-child(2) {left: 0;} .loader-ellips__dot:nth-child(3) {left: 1.5em; } .loader-ellips__dot:nth-child(4) {left: 3em; } @keyframes reveal { from { transform: scale(0.001); } to { transform: scale(1); } } @keyframes slide { to { transform: translateX(1.5em); } } .loader-ellips__dot:nth-child(1) {animation-name: reveal;} .loader-ellips__dot:nth-child(2), .loader-ellips__dot:nth-child(3) {animation-name: slide;} /* stylelint-disable-next-line no-duplicate-selectors */ .loader-ellips__dot:nth-child(4) {animation-name: reveal; animation-direction: reverse;} /* Article Editor ------------------------- */ .offcanvas {z-index:1060;} .offcanvas-backdrop {z-index:1056;} .articleEditor .modal-header, .modal-footer {padding: 0.5rem!important;} .articleEditor .modal-body {padding:0 .5rem!important;} .articleEditor .note-modal-footer {height:auto; overflow:hidden;} /* Catalog in Card ------------------------- */ .card.catalog .card-header .card-title {margin:0 .5rem 0 0;} .card.catalog .card-header .btn {margin-right:.2rem;} .card.catalog .card-header .btn:last-child {margin:0;} .card.catalog .input-group {margin-bottom:.5rem;} .card.catalog .input-group:last-child {margin:0;} .card.catalog .input-group-text {cursor:pointer;} .card.catalog .input-group .btn {width:45px;} .card.catalog .input-group .spinner-border {width:1rem; height:1rem; border-width:.15rem; position:absolute; top:50%; left:50%; margin:-.5rem 0 0 -.5rem;} .card.catalog .input-group .recall {width:30px; height:100%; text-align:center; position:absolute; z-index:3; top:0; right:135px; display:flex; justify-content: center; visibility: hidden;} .card.catalog .input-group .recall i {align-self: center;} .card.catalog .input-group input.edit+.recall {visibility: visible;} .card.catalog .card-body:not(.modal-dialog .card-body) {position:relative;} .btnDo .spinner-border {width:1rem; height:1rem; border-width:.15rem; position:absolute; top:50%; left:.6rem; margin-top:-.5rem;} /* Table Element ------------------------- */ #listjs thead th.listjs-sorter {padding-right:20px!important;} #listjs thead th.listjs-sorter::after {right:.4rem!important;} .setMv, .setDe {height:38px;} .setMv em, .setDe em {font-style:normal; white-space:nowrap;} /*.fotoView a { width:48px; height:36px; border-radius:5px; position:relative; display:block; overflow:hidden; transition:.15s ease-in-out; -webkit-transition:.15s ease-in-out; -moz-transition:.15s ease-in-out; -ms-transition:.15s ease-in-out; -o-transition:.15s ease-in-out; } .fotoView img { width:48px; height:auto; position:absolute; left:50%; top:50%; border-radius:5px; transform:translate(-50%, -50%); -webkit-transform:translate(-50%, -50%); -moz-transform:translate(-50%, -50%); -ms-transform:translate(-50%, -50%); -o-transform:translate(-50%, -50%); transition:.2s ease-in; -webkit-transition:.2s ease-in; -moz-transition:.2s ease-in; -ms-transition:.2s ease-in; -o-transition:.2s ease-in; -webkit-border-radius:5px; -moz-border-radius:5px; -ms-border-radius:5px; -o-border-radius:5px; } tr.zoom:hover .fotoView a {overflow:visible;} tr.zoom:hover .fotoView img { width:150%; max-height:200%; object-fit: cover; z-index:1; filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, .7)); -webkit-filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, .7)); -webkit-border-radius:5px; -moz-border-radius:5px; -ms-border-radius:5px; -o-border-radius:5px; }*/ .fotoView {padding:0 35px 0 !important; width: 70px; position: relative } .fotoView a {width: calc(100% - 4px); height: calc(100% - 4px); -webkit-transition: .15s ease-in-out; transition: .15s ease-in-out; border: 3px solid #fff; box-shadow: 0 0 0 1px rgba(150, 150, 150, .2); -webkit-box-shadow: 0 0 0 1px rgba(150, 150, 150, .2); -moz-box-shadow: 0 0 0 1px rgba(150, 150, 150, .2); overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: #fff } .fotoView a.avatar {width:50px; height:50px; border-radius: 50%;} .fotoView a img {width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center} .fotoView a.avatar img {object-position: top center;} tr:hover .fotoView a {width: calc(100% - 0px); height: calc(100% - 0px); box-shadow: 0 2px 5px 2px rgba(150, 150, 150, .4); -webkit-box-shadow: 0 2px 5px 2px rgba(150, 150, 150, .4); -moz-box-shadow: 0 2px 5px 2px rgba(150, 150, 150, .4)} tr:hover .fotoView a.avatar{width:56px; height:56px;} /*th:first-child, */td.set {width:40px; position:relative;} /*td i {font-size:1.2rem;}*/ i.slash::after {content:"/"; font-size:0.7rem!important; font-weight:lighter; color:var(--vz-card-color); font-style:italic; padding-left:.25rem; padding-right:.25rem;} td .d-tags {display:flex; flex-wrap:wrap; align-content: center; margin:0 0 -.2rem -.2rem; min-width:200px; overflow:hidden;} td .d-tags .btn {margin:0 0 .2rem .2rem; float:left;} .table[id^='row'] th, .table[id^='row'] td {text-align:center; vertical-align:middle; /*padding:9px;*/} .table[id^='row'] th:first-child, .table[id^='row'] td:first-child {width:40px; position:relative; padding-left:9px; padding-right:9px;} .num {font-family:monospace, 'Courier New', Courier;} .rowOnline .set i, .rowPmLimit .set i, .rowOrder .pi i, .rowOrder .pa i, .rowOrder .ps i, .d-tags i, .aCmd i, .aFan i, .urFollow i {font-size:1.2rem;} /* Table @ Fotos ------------------------- */ #rowFoto th:nth-child(1), #rowFoto td.set {width:40px;} #rowFoto th:nth-child(2), #rowFoto td:nth-child(2) {width:70px;} #rowFoto th:nth-child(4), #rowFoto td:nth-child(4), #rowFoto th:nth-child(5), #rowFoto td:nth-child(5) {width:80px;} #rowFoto th:nth-child(6), #rowFoto td:nth-child(6) {width:80px;} #rowFoto th:nth-child(7), #rowFoto td:nth-child(7), #rowFoto th:nth-child(8), #rowFoto td:nth-child(8) {width:100px;} #rowFoto td:nth-child(3), #rowFoto td:nth-child(7) {text-align:left;} #rowFoto td:nth-child(4), #rowFoto td:nth-child(5) {text-align:right;} /* Table @ Branch Base ------------------------- */ #rowBranchBase th:nth-child(2), #rowBranchBase td:nth-child(2) {width:70px;} #rowBranchBase td:nth-child(3), #rowBranchBase td:nth-child(4) {text-align:left;} #rowBranchBase td:nth-child(5) {text-align:right;} #rowBranchBase th:nth-child(5), #rowBranchBase td:nth-child(5), #rowBranchBase th:nth-child(6), #rowBranchBase td:nth-child(6) {width:80px;} #rowBranchBase th:nth-child(7), #rowBranchBase td:nth-child(7) {width:100px;} /* Table @ Branch Card ------------------------- */ #rowBranchCard th:nth-child(2), #rowBranchCard td:nth-child(2) {width:70px;} #rowBranchCard th:nth-child(5), #rowBranchCard td:nth-child(5), #rowBranchCard th:nth-child(6), #rowBranchCard td:nth-child(6) {width:100px; text-align:center;} #rowBranchCard td:nth-child(3), #rowBranchCard td:nth-child(4) {text-align:left;} #rowBranchCard th:nth-child(7), #rowBranchCard td:nth-child(7) {width:80px;} /* Table @ BranchIcon ------------------------- */ #rowBranchIcon th:nth-child(2), #rowBranchIcon td:nth-child(2) {width:70px;} #rowBranchIcon td:nth-child(3), #rowBranchIcon td:nth-child(5) {text-align:left;} #rowBranchIcon th:nth-child(4), #rowBranchIcon td:nth-child(4) {width:100px;} #rowBranchIcon th:nth-child(6), #rowBranchIcon td:nth-child(6) {width:80px;} /* Table @ Branch Real ------------------------- */ #rowBranchReal th:nth-child(2), #rowBranchReal td:nth-child(2) {width:70px;} #rowBranchReal th:nth-child(7), #rowBranchReal td:nth-child(7) {width:80px; text-align:center;} #rowBranchReal th:nth-child(5), #rowBranchReal td:nth-child(5) {width:100px;} #rowBranchReal td:nth-child(3), #rowBranchReal td:nth-child(4), #rowBranchReal td:nth-child(6) {text-align:left;} #rowBranchReal th:first-child {width:60px;} #rowBranchReal td.set {padding-left:20px; padding-right:0;} /* Table @ Branch Tenant ------------------------- */ #rowBranchTenant th:nth-child(2), #rowBranchTenant td:nth-child(2) {width:70px;} #rowBranchTenant td:nth-child(3), #rowBranchTenant td:nth-child(4), #rowBranchTenant td:nth-child(6) {text-align:left;} #rowBranchTenant th:nth-child(5), #rowBranchTenant td:nth-child(5), #rowBranchTenant th:nth-child(6), #rowBranchTenant td:nth-child(6) {width:80px; text-align:center;} #rowBranchTenant th:first-child {width:60px;} #rowBranchTenant td.set {padding-left:20px; padding-right:0;} /* Table @ Meeting ------------------------- */ #rowMeeting th:nth-child(2), #rowMeeting td:nth-child(2) {width:70px;} #rowMeeting td:nth-child(3), #rowMeeting td:nth-child(4), #rowMeeting td:nth-child(5) {text-align:left;} #rowMeeting th:nth-child(6), #rowMeeting td:nth-child(6), #rowMeeting th:nth-child(7), #rowMeeting td:nth-child(7), #rowMeeting th:nth-child(8), #rowMeeting td:nth-child(8) {width:80px;} #rowMeeting td:nth-child(6), #rowMeeting td:nth-child(7) {text-align:right;} #rowMeeting th:nth-child(9), #rowMeeting td:nth-child(9) {width:100px;} /* Table @ Office ------------------------- */ #rowOffice th:nth-child(2), #rowOffice td:nth-child(2) {width:70px;} #rowOffice td:nth-child(3), #rowOffice td:nth-child(4), #rowOffice td:nth-child(5) {text-align:left;} #rowOffice th:nth-child(6), #rowOffice td:nth-child(6), #rowOffice th:nth-child(7), #rowOffice td:nth-child(7), #rowOffice th:nth-child(8), #rowOffice td:nth-child(8), #rowOffice th:nth-child(9), #rowOffice td:nth-child(9) {width:80px;} #rowOffice td:nth-child(6), #rowOffice td:nth-child(7) {text-align:right;} #rowOffice th:nth-child(10), #rowOffice td:nth-child(10) {width:100px;} /* Table @ Virtual ------------------------- */ #rowVirtual th:nth-child(2), #rowVirtual td:nth-child(2) {width:70px;} #rowVirtual td:nth-child(3), #rowVirtual td:nth-child(4), #rowVirtual td:nth-child(5) {text-align:left;} #rowVirtual th:nth-child(6), #rowVirtual td:nth-child(6), #rowVirtual th:nth-child(7), #rowVirtual td:nth-child(7) {width:80px;} #rowVirtual td:nth-child(6) {text-align:right;} #rowVirtual th:nth-child(8), #rowVirtual td:nth-child(8) {width:100px;} /* Table @ Seat ------------------------- */ #rowSeat th:nth-child(4), #rowSeat td:nth-child(4), #rowSeat th:nth-child(5), #rowSeat td:nth-child(5) {width:80px;} #rowSeat th:nth-child(6), #rowSeat td:nth-child(6) {width:80px; text-align:center;} #rowSeat td:nth-child(2), #rowSeat td:nth-child(3) {text-align:left;} #rowSeat td:nth-child(4), #rowSeat td:nth-child(5) {text-align:right;} /* Table @ About ------------------------- */ #rowAbout th:nth-child(2), #rowAbout td:nth-child(2) {width:70px;} #rowAbout td:nth-child(3) {text-align:left;} #rowAbout td:nth-child(4) {text-align:right;} #rowAbout th:nth-child(4), #rowAbout td:nth-child(4), #rowAbout th:nth-child(5), #rowAbout td:nth-child(5) {width:80px;} #rowAbout th:nth-child(6), #rowAbout td:nth-child(6) {width:100px;} /* Table @ Post ------------------------- */ #rowPost th:nth-child(2), #rowPost td:nth-child(2) {width:70px;} #rowPost th:nth-child(5), #rowPost td:nth-child(5) {width:80px;} #rowPost th:nth-child(6), #rowPost td:nth-child(6) {width:80px; text-align:center;} #rowPost th:nth-child(4), #rowPost td:nth-child(4), #rowPost th:nth-child(7), #rowPost td:nth-child(7) {width:100px;} #rowPost td:nth-child(3), #rowPost td:nth-child(4) {text-align:left;} #rowPost td:nth-child(5) {text-align:right;} /* Table @ Faq ------------------------- */ #rowFaq th:nth-child(2), #rowFaq td:nth-child(2) {width:70px;} #rowFaq th:nth-child(5), #rowFaq td:nth-child(5) {width:80px; text-align:center;} #rowFaq th:nth-child(4), #rowFaq td:nth-child(4), #rowFaq th:nth-child(6), #rowFaq td:nth-child(6) {width:100px;} #rowFaq td:nth-child(3), #rowFaq td:nth-child(4) {text-align:left;} /* Table @ Lore ------------------------- */ #rowLore th:nth-child(2), #rowLore td:nth-child(2) {width:70px;} #rowLore th:nth-child(6), #rowLore td:nth-child(6) {width:80px;} #rowLore th:nth-child(7), #rowLore td:nth-child(7) {width:80px; text-align:center;} #rowLore th:nth-child(4), #rowLore td:nth-child(4), #rowLore th:nth-child(5), #rowLore td:nth-child(5), #rowLore th:nth-child(8), #rowLore td:nth-child(8) {width:100px;} #rowLore td:nth-child(3), #rowLore td:nth-child(5) {text-align:left;} #rowLore td:nth-child(6) {text-align:right;} /* Table @ Slide ------------------------- */ #rowSlide th:nth-child(2), #rowSlide td:nth-child(2) {width:70px;} #rowSlide th:nth-child(5), #rowSlide td:nth-child(5) {width:80px; text-align:center;} #rowSlide th:nth-child(3), #rowSlide td:nth-child(3) {width:100px;} #rowSlide td:nth-child(4) {text-align:left;} #rowSlide th:first-child {width:60px;} #rowSlide td.set {padding-left:20px; padding-right:0;} /* Table @ Referral ------------------------- */ #rowReferral td:nth-child(2) {width:70px;} #rowReferral td:nth-child(3), #rowReferral td:nth-child(4) {text-align:left;} #rowReferral th:nth-child(4), #rowReferral td:nth-child(5) {width:80px; text-align:center;} #rowReferral th:nth-child(5), #rowReferral td:nth-child(6) {width:100px;} #rowReferral td:nth-child(3) div, #rowReferral td:nth-child(4) div {margin:0 0 -.2rem -.2rem; min-width:200px; overflow:hidden;} #rowReferral td:nth-child(3) div .btn, #rowReferral td:nth-child(4) div .btn {margin:0 0 .2rem .2rem; float:left;} #rowReferral td:nth-child(5) a {display:flex; justify-content: center; opacity:.5;} #rowReferral td:nth-child(5) a.use {opacity:1;} #rowReferral td:nth-child(5) i {margin-right:.2rem;} /* Table @ ReferralItem ------------------------- */ #rowReferralItem td:nth-child(2), #rowReferralItem td:nth-child(3) {text-align:left;} #rowReferralItem th:nth-child(5), #rowReferralItem td:nth-child(5), #rowReferralItem th:nth-child(6), #rowReferralItem td:nth-child(6) {width:80px;} #rowReferralItem td:nth-child(5), #rowReferralItem td:nth-child(6) {text-align:right;} #rowReferralItem th:nth-child(7), #rowReferralItem td:nth-child(7), #rowReferralItem th:nth-child(8), #rowReferralItem td:nth-child(8) {width:100px;} #rowReferralItem th:nth-child(4), #rowReferralItem td:nth-child(4), #rowReferralItem th:nth-child(9), #rowReferralItem td:nth-child(9) {width:80px;} #rowReferralItem td:nth-child(9) a {display:flex; justify-content: center; opacity:.5;} #rowReferralItem td:nth-child(9) a.use {opacity:1;} #rowReferralItem td:nth-child(9) i {margin-right:.2rem;} /* Table @ Product ------------------------- */ #rowProduct [class$="aTitle"], #rowProduct [class$="pTitle"] {text-align:left;} #rowProduct [data-sort="aCmd"], #rowProduct [class$="aCmd"], #rowProduct [data-sort="aFan"], #rowProduct [class$="aFan"] {width:60px;} #rowProduct [data-sort="aPrice"], #rowProduct [class$="aPrice"], #rowProduct [data-sort="pomo"], #rowProduct [class$="pomo"], #rowProduct [data-sort="aHits"], #rowProduct [class$="aHits"], #rowProduct [data-sort="oQty"], #rowProduct [class$="oQty"], #rowProduct [data-sort="oTotal"], #rowProduct [class$="oTotal"], #rowProduct [data-sort="aStar"], #rowProduct [class$="aStar"] {width:80px;} #rowProduct [class$="aStar"] {text-align:right;} #rowProduct [data-sort="aShow"], #rowProduct [class$="aShow"], #rowProduct [data-sort="aTime"], #rowProduct [class$="aTime"] {width:100px;} #rowProduct [class$="pTitle"] div {margin:0 0 -.2rem -.2rem; min-width:200px; overflow:hidden;} #rowProduct [class$="pTitle"] div .btn {margin:0 0 .2rem .2rem; float:left;} /* Table @ Price ------------------------- */ .rowPrice thead th:first-child, .rowPrice tbody th:first-child {width:40px;} .rowPrice th, .rowPrice td {white-space:nowrap; text-align:center; vertical-align:middle;} .rowPrice td {padding:0px; position:relative; height:38px; min-width:100px;} .rowPrice .num {width: 80px!important;} .rowPrice input {border:none; text-align:right; position:absolute; width:100%; height:100%; left:0; top:0;} .rowPrice input::placeholder {color:#F06548;} .rowPrice .o1 input, .rowPrice .o2 input {text-align:left; padding-left:38px;} .rowPrice .o1, .rowPrice .o2 {width:auto} .rowPrice .avatar-xs {display:flex; justify-content:center; align-items: center; font-size:18px; position:absolute; z-index:10; left:2px; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } /* Table @ Address ------------------------- */ #rowAddress td {text-align:left;} #rowAddress td:first-child {text-align:center;} #rowAddress th:nth-child(6), #rowAddress td:nth-child(6) {width:80px; text-align:center;} /* Table @ Deliver ------------------------- */ #rowDelivery td {text-align:left;} #rowDelivery td:first-child {text-align:center;} #rowDelivery td:nth-child(5) div {margin:0 0 -.2rem -.2rem; min-width:200px; overflow:hidden;} #rowDelivery td:nth-child(5) div .btn {margin:0 0 .2rem .2rem; float:left;} #rowDelivery th:nth-child(6), #rowDelivery td:nth-child(6) {width:80px; text-align:center;} /* Table @ User ------------------------- */ #rowUser td:nth-child(2) {width:70px;} #rowUser td:nth-child(3), #rowUser td:nth-child(4), #rowUser td:nth-child(5), #rowUser td:nth-child(6) {text-align:left;} #rowUser td:nth-child(6) div {margin:0 0 -.2rem -.2rem; min-width:200px; overflow:hidden;} #rowUser td:nth-child(6) div .btn {margin:0 0 .2rem .2rem; float:left;} #rowUser td:nth-child(8) a {display:flex; justify-content: center; opacity:.5;} #rowUser td:nth-child(8) a.use {opacity:1;} #rowUser td:nth-child(8) i {margin-right:.2rem;} #rowUser th:nth-child(8), #rowUser td:nth-child(8) {width:80px; text-align:center;} #rowUser th:nth-child(9), #rowUser td:nth-child(9) {width:100px;} /* Table @ Buyer ------------------------- */ #rowBuyer td:nth-child(2), #rowBuyer td:nth-child(3), #rowBuyer td:nth-child(4), #rowBuyer td:nth-child(7) {text-align:left;} #rowBuyer td:nth-child(7) div {margin:0 0 -.2rem -.2rem; min-width:200px; overflow:hidden;} #rowBuyer td:nth-child(7) div .btn {margin:0 0 .2rem .2rem; float:left;} #rowBuyer td:nth-child(8) a {display:flex; justify-content: center; opacity:.5;} #rowBuyer td:nth-child(8) a.use {opacity:1;} #rowBuyer td:nth-child(8) i {margin-right:.2rem;} #rowBuyer th:nth-child(8), #rowBuyer td:nth-child(8) {width:80px; text-align:center;} #rowBuyer th:nth-child(9), #rowBuyer td:nth-child(9) {width:100px;} #rowBuyer td:nth-child(5), #rowBuyer td:nth-child(6) {text-align:right;} /* Table @ Msg ------------------------- */ #rowMsg td:nth-child(2) {width:95px;} #rowMsg td:nth-child(3), #rowMsg td:nth-child(4), #rowMsg td:nth-child(5), #rowMsg td:nth-child(6), #rowMsg td:nth-child(7) {text-align:left;} #rowMsg td:nth-child(7) div {margin:0 0 -.2rem -.2rem; min-width:200px; overflow:hidden;} #rowMsg td:nth-child(7) div .btn {margin:0 0 .2rem .2rem; float:left;} #rowMsg th:nth-child(8), #rowMsg td:nth-child(8) {width:60px;} #rowMsg th:nth-child(9), #rowMsg td:nth-child(9) {width:62px;} /* Table @ Home01 ------------------------- */ #home01 {position:relative;} #home01 .home01 {position:absolute; top:12px; right:28px; z-index:1;} #home01 .card-header .form-check {display:inline-block;} #rowHome01 th:nth-child(2), #rowHome01 td:nth-child(2) {width:70px;} #rowHome01 th:nth-child(5), #rowHome01 td:nth-child(5), #rowHome01 th:nth-child(6), #rowHome01 td:nth-child(6) {width:100px; text-align:center;} #rowHome01 td:nth-child(3), #rowHome01 td:nth-child(4) {text-align:left;} #rowHome01 th:nth-child(7), #rowHome01 td:nth-child(7) {width:80px;} /* Table @ Home02 ------------------------- */ #home02 {position:relative;} #home02 .home02 {position:absolute; top:12px; right:28px; z-index:1;} #home02 .card-header .form-check {display:inline-block;} #rowHome02 th:nth-child(2), #rowHome02 td:nth-child(2) {width:70px;} #rowHome02 th:nth-child(5), #rowHome02 td:nth-child(5) {width:100px; text-align:center;} #rowHome02 td:nth-child(3), #rowHome02 td:nth-child(4) {text-align:left;} #rowHome02 th:nth-child(6), #rowHome02 td:nth-child(6) {width:80px;} /* Table @ Home03 ------------------------- */ #home03 {position:relative;} #home03 .home03 {position:absolute; top:12px; right:28px; z-index:1;} #home03 .card-header .form-check {display:inline-block;} #rowHome03 th:nth-child(2), #rowHome03 td:nth-child(2) {width:70px;} #rowHome03 th:nth-child(5), #rowHome03 td:nth-child(5), #rowHome03 th:nth-child(6), #rowHome03 td:nth-child(6) {width:100px; text-align:center;} #rowHome03 td:nth-child(3), #rowHome03 td:nth-child(4) {text-align:left;} #rowHome03 th:nth-child(7), #rowHome03 td:nth-child(7) {width:80px;} /* Table @ Home04 ------------------------- */ #home04 {position:relative;} #home04 .home04 {position:absolute; top:12px; right:28px; z-index:1;} #home04 .card-header .form-check {display:inline-block;} #rowHome04 td:nth-child(2), #rowHome04 td:nth-child(3) {text-align:left;} #rowHome04 th:nth-child(4), #rowHome04 td:nth-child(4) {width:80px;} /* Table @ Home05 ------------------------- */ #home05 {position:relative;} #home05 .home05 {position:absolute; top:12px; right:28px; z-index:1;} #home05 .card-header .form-check {display:inline-block;} #rowHome05 th:nth-child(2), #rowHome05 td:nth-child(2) {width:70px;} #rowHome05 td:nth-child(3), #rowHome05 td:nth-child(4) {text-align:left; width:120px;} #rowHome05 td:nth-child(5) {text-align:left;} #rowHome05 th:nth-child(6), #rowHome05 td:nth-child(6) {width:80px;} /* Table @ Home06 ------------------------- */ #home06 {position:relative;} #home06 .home06 {position:absolute; top:12px; right:28px; z-index:1;} #home06 .card-header .form-check {display:inline-block;} #rowHome06 th:nth-child(2), #rowHome06 td:nth-child(2) {width:70px;} #rowHome06 td:nth-child(3), #rowHome06 td:nth-child(4) {text-align:left;} #rowHome06 th:nth-child(5), #rowHome06 td:nth-child(5) {width:80px;} /* Table @ Home07 ------------------------- */ #home07 {position:relative;} #home07 .home07 {position:absolute; top:12px; right:28px; z-index:1;} #home07 .card-header .form-check {display:inline-block;} /* Table @ Home08 ------------------------- */ #home08 {position:relative;} #home08 .home08 {position:absolute; top:12px; right:28px; z-index:1;} #home08 .card-header .form-check {display:inline-block;} /* Table @ Home09 ------------------------- */ #home09 {position:relative;} #home09 .home09 {position:absolute; top:12px; right:28px; z-index:1;} #home09 .card-header .form-check {display:inline-block;} #rowHome09 th:nth-child(2), #rowHome09 td:nth-child(2) {width:70px;} #rowHome09 th:nth-child(6), #rowHome09 td:nth-child(6), #rowHome09 th:nth-child(7), #rowHome09 td:nth-child(7) {width:100px; text-align:center;} #rowHome09 td:nth-child(3), #rowHome09 td:nth-child(4) {text-align:left;} #rowHome09 td:nth-child(5) {text-align:right;} #rowHome09 th:nth-child(5), #rowHome09 td:nth-child(5), #rowHome09 th:nth-child(8), #rowHome09 td:nth-child(8) {width:80px;} /* Table @ home10 ------------------------- */ #home10 {position:relative;} #home10 .home10 {position:absolute; top:12px; right:28px; z-index:1;} #home10 .card-header .form-check {display:inline-block;} #rowHome10 th:nth-child(2), #rowHome10 td:nth-child(2) {width:70px} #rowHome10 th:nth-child(3), #rowHome10 td:nth-child(3) {width:100px} #rowHome10 td:nth-child(4), #rowHome10 td:nth-child(5) {text-align:left;} #rowHome10 th:nth-child(6), #rowHome10 td:nth-child(6), #rowHome10 th:nth-child(7), #rowHome10 td:nth-child(7) {width:100px;} #rowHome10 th:nth-child(8), #rowHome10 td:nth-child(8) {width:80px;} /* Table @ HomeFooter ------------------------- */ #homeFooter {position:relative;} #homeFooter .homeFooter {position:absolute; top:12px; right:28px; z-index:1;} #homeFooter .card-header .form-check {display:inline-block;} /* Table @ Site Online ------------------------- */ .rowOnline th, .rowOnline td {text-align:center; vertical-align:middle; padding:9px;} .rowOnline th:first-child, .rowOnline td:first-child {width:40px; position:relative;} .rowOnline th:nth-child(2), .rowOnline td:nth-child(2) {width:52px;} .rowOnline th:nth-child(3), .rowOnline td:nth-child(3), .rowOnline th:nth-child(4), .rowOnline td:nth-child(4) {width:98px;} .rowOnline th:nth-child(5), .rowOnline td:nth-child(5), .rowOnline th:nth-child(6), .rowOnline td:nth-child(6), .rowOnline th:nth-child(7), .rowOnline td:nth-child(7) {width:58px;} .rowOnline td:nth-child(5), .rowOnline td:nth-child(6), .rowOnline td:nth-child(7) {text-align:right;} .rowOnline td:nth-child(8) {text-align:left;} .rowOnline th:nth-child(9), .rowOnline td:nth-child(9) {width:120px;} .rowOnline td:nth-child(10) a {display:flex; justify-content: center;} .rowOnline th:nth-child(10) {width:62px;} .rowOnline td:nth-child(10) {width:63px;} /* Table @ Site Online Order ------------------------- */ .rowOnlineOrder th, .rowOnlineOrder td {text-align:center; vertical-align:middle; padding:9px;} .rowOnlineOrder th:first-child, .rowOnlineOrder td:first-child {width:40px; position:relative;} .rowOnlineOrder th:nth-child(3), .rowOnlineOrder td:nth-child(3) {width:60px;} .rowOnlineOrder th:nth-child(4), .rowOnlineOrder td:nth-child(4), .rowOnlineOrder th:nth-child(5), .rowOnlineOrder td:nth-child(5), .rowOnlineOrder th:nth-child(10), .rowOnlineOrder td:nth-child(10) {width:98px;} .rowOnlineOrder th:nth-child(6), .rowOnlineOrder td:nth-child(6){width:72px;} .rowOnlineOrder td:nth-child(3), .rowOnlineOrder td:nth-child(6), .rowOnlineOrder td:nth-child(7) {text-align:right;} .rowOnlineOrder th:nth-child(2), .rowOnlineOrder td:nth-child(2), .rowOnlineOrder th:nth-child(7), .rowOnlineOrder td:nth-child(7), .rowOnlineOrder th:nth-child(8), .rowOnlineOrder td:nth-child(8), .rowOnlineOrder th:nth-child(9), .rowOnlineOrder td:nth-child(9) {width:auto;} .rowOnlineOrder th:nth-child(11) {width:108px;} .rowOnlineOrder td:nth-child(11) {width:109px;} /* Table @ Brand ------------------------- */ #brand {position:relative;} #brand .brand {position:absolute; top:12px; right:28px; z-index:1;} #brand .card-header .form-check {display:inline-block;} #rowBrand th:nth-child(2), #rowBrand td:nth-child(2) {width:70px;} #rowBrand td:nth-child(3), #rowBrand td:nth-child(4) {text-align:left;} #rowBrand th:nth-child(5), #rowBrand td:nth-child(5) {width:80px;} /* Table @ Promo Limit ------------------------- */ .rowPmLimit th, .rowPmLimit td {text-align:center; vertical-align:middle; padding:9px;} .rowPmLimit th:first-child, .rowPmLimit td:first-child {width:40px; position:relative;} .rowPmLimit th:nth-child(2), .rowPmLimit td:nth-child(2) {width:52px;} .rowPmLimit th:nth-child(3), .rowPmLimit td:nth-child(3), .rowPmLimit th:nth-child(4), .rowPmLimit td:nth-child(4) {width:150px;} .rowPmLimit th:nth-child(5), .rowPmLimit td:nth-child(5) {width:58px;} .rowPmLimit th:nth-child(6), .rowPmLimit td:nth-child(6) {width:108px;} .rowPmLimit th:nth-child(7), .rowPmLimit td:nth-child(7) {width:240px;} .rowPmLimit th:nth-child(8), .rowPmLimit td:nth-child(8) {width:60px;} .rowPmLimit th:nth-child(9), .rowPmLimit td:nth-child(9), .rowPmLimit th:nth-child(10), .rowPmLimit td:nth-child(10), .rowPmLimit th:nth-child(11), .rowPmLimit td:nth-child(11) {width:100px;} .rowPmLimit td:nth-child(5), .rowPmLimit td:nth-child(9), .rowPmLimit td:nth-child(10), .rowPmLimit td:nth-child(11) {text-align:right;} .rowPmLimit td:nth-child(12) {text-align:left;} .rowPmLimit .avatar-group .avatar-xs {object-fit: cover!important;} /* Table @ Node ------------------------- */ .rowNode th, .rowNode td {text-align:center; vertical-align:middle; padding:9px;} .rowNode th:first-child, .rowNode td:first-child {width:40px; position:relative;} .rowNode [data-sort="sName"], .rowNode [class$="sName"] {width:auto;} .rowNode [data-sort="spName"], .rowNode [class$="spName"] {width:70px;} .rowNode [data-sort="spFee"], .rowNode [class$="spFee"] {width:55px;} .rowNode [data-sort="sHome"], .rowNode [class$="sHome"] {width:auto;} .rowNode [data-sort="sOpen"], .rowNode [class$="sOpen"] {width:92px;} .rowNode [data-sort="sDays"], .rowNode [class$="sDays"], .rowNode [data-sort="sHits"], .rowNode [class$="sHits"], .rowNode [data-sort="sTotal"], .rowNode [class$="sTotal"] {width:auto;} .rowNode [data-sort="sToday"], .rowNode [class$="sToday"], .rowNode [data-sort="sShow"], .rowNode [class$="sShow"] {width:100px;} .rowNode [class$="sName"], .rowNode [class$="sHome"] {text-align:left;} .rowNode [class$="sDays"], .rowNode [class$="sHits"], .rowNode [class$="sTotal"] {text-align:right;} /* Table @ Quiry ------------------------- */ .rowQuiry th, .rowQuiry td {text-align:center; vertical-align:middle; padding:9px;} .rowQuiry th:first-child, .rowQuiry td:first-child {width:40px; position:relative;} .rowQuiry th[data-sort="num"], .rowQuiry td.num, .rowQuiry th[data-sort="node"], .rowQuiry td.node, .rowQuiry th[data-sort="item"], .rowQuiry td.item, .rowQuiry th[data-sort="all"], .rowQuiry td.all {width:auto;} .rowQuiry th[data-sort="date"], .rowQuiry td.date, .rowQuiry th[data-sort="status"], .rowQuiry td.status, .rowQuiry th[data-sort="last"], .rowQuiry td.last {width:92px;} .rowQuiry td.num, .rowQuiry td.node {text-align:left;} .rowQuiry td.item, .rowQuiry td.all {text-align:right;} .rowQuiry td.all i {display:none;} /* Table @ Order ------------------------- */ .rowOrder th, .rowOrder td {text-align:center; vertical-align:middle; padding:9px;} .rowOrder th:first-child, .rowOrder td:first-child {width:40px; position:relative;} .rowOrder th[data-sort="num"], .rowOrder td.num, .rowOrder th[data-sort="node"], .rowOrder td.node, .rowOrder th[data-sort="item"], .rowOrder td.item, .rowOrder th[data-sort="all"], .rowOrder td.all, .rowOrder th[data-sort="amt"], .rowOrder td.amt {width:auto;} .rowOrder th[data-sort="date"], .rowOrder td.date, .rowOrder th[data-sort="pal"], .rowOrder td.pal, .rowOrder th[data-sort="last"], .rowOrder td.last, .rowOrder th[data-sort="status"], .rowOrder td.status {width:92px;} .rowOrder th[data-sort="pi"], .rowOrder td.pi, .rowOrder th[data-sort="pa"], .rowOrder td.pa, .rowOrder th[data-sort="ps"], .rowOrder td.ps, .rowOrder td.act {width:62px;} .rowOrder td.act a {position:relative} .rowOrder td.num, .rowOrder td.node {text-align:left;} .rowOrder td.item, .rowOrder td.all, .rowOrder td.amt {text-align:right;} .rowOrder td.all i, .rowOrder td.amt i {display:none;} /* Table @ Reviews ------------------------- */ .rowReviews th, .rowReviews td {text-align:center; vertical-align:middle; padding:9px;} .rowReviews th:first-child, .rowReviews td:first-child {width:40px; position:relative;} .rowReviews th[data-sort="title"], .rowReviews td.title, .rowReviews th[data-sort="mod"], .rowReviews td.mod {width:auto;} .rowReviews th[data-sort="date"], .rowReviews td.date, .rowReviews th[data-sort="sts"], .rowReviews td.sts {width:92px;} .rowReviews td.act {width:62px;} .rowReviews td.act a {position:relative} .rowReviews th[data-sort="title"], .rowReviews td.title, .rowReviews td.mod {text-align:left;} .rowReviews td.mod .hstack {gap:.25rem;} .rowReviews td.mod .hstack>div {display:flex;} .rowReviews td.mod .hstack>div>.vr {margin:0 .5rem;} /* Detail @ Reviews(#reviewsDetail, #inReviewsDetail) ------------------------- */ [id$="eviewsDetail"] .modal-body:nth-child(odd) {background-color: rgba(243,246,249,1);} [id$="eviewsDetail"] .modal-body:nth-child(odd) .reviewsInfo tr>* {border-color:#D8DADB;} [data-layout-mode="dark"] [id$="eviewsDetail"] .modal-body:nth-child(odd) {background-color: rgba(255,255,255,0.07);} [data-layout-mode="dark"] [id$="eviewsDetail"] .modal-body:nth-child(odd) .reviewsInfo tr>* {border-color:#D8DADB22!important;} [id$="eviewsDetail"] .oth {display:none;} [id$="eviewsDetail"] .othShow .oth {display:block;} .reviewsInfo th {width:84px;} .reviewsInfo>tbody>tr:last-child>* {border-bottom:none!important;} .reviewsInfo .tag {display:flex; gap:.25rem;} .reviewsInfo .tag .badge {padding:5px 10px; font-size:.7rem;} /* Table Tip @ Quiry & Order & Reviews ------------------------- */ .rowQuiry tr.tip, .rowOrder tr.tip, .rowReviews tr.tip {background-color: rgba(247, 184, 75, .18);} .rowQuiry tr.tip td.act a::before, .rowOrder tr.tip td.act a::before, .rowReviews tr.tip td.act a::before {position:absolute; content:""; padding:.25rem; border-radius:50%; background-color: rgba(var(--vz-danger-rgb), 1); border: var(--vz-border-width) var(--vz-border-style) var(--vz-border-color); border-color:var(--vz-light); left:100%; top:0; transform:translate(-50%, -50%);} /* Table Numberic @ Quiry & Order ------------------------- */ q.num {display:flex; gap:.25rem; justify-content:end; align-items:center; white-space:nowrap;} q.num.jcs {justify-content:start;} q.num.jcc {justify-content:center;} q.num::after, q.num::before {content:none;} q.num i {display:none;} q.num s {font-size:.875em; color:#878a99;} q.num b {font-size:1.12em;} q.num>* {margin:0; padding:0;} /* Table By Sort ------------------------- */ .table[id^='row'] th:first-child {width:40px;} .table.bySort th:first-child {width:60px;} .table.bySort td.set {padding-left:20px!important; padding-right:0;} .table td.set .btn-soft-primary {position:absolute; display:none; justify-content: center; align-items: center; width:20px; height:100%; left:0; top:0;} .table.bySort td.set .btn-soft-primary {display:flex;} /* Table class$=Star ------------------------- */ .table [class$='Star'] {width:80px; text-align:right!important;} .table [class$='Star'] .btn {position:relative; white-space:nowrap; padding:0 20px 0 0;} .table [class$='Star'] span {position:absolute; margin-top:1px; right:0; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } /* Table class$=Show & Cache ------------------------- */ .table [class$='Show'], .table [class$='Cach'] {width:80px; text-align:center!important;} .table [class$='Show'] .btn, .table [class$='Cach'] .btn {position:relative; white-space:nowrap; padding:0 0 0 20px;} .table [class$='Show'] .btn {opacity:.5;} .table [class$='Show'] .show {opacity:1;} .table [class$='Show'] span, .table [class$='Cach'] span {position:absolute; margin-top:1px; left:0; top:50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); } .table [class$='Show'] .spinner-border, .table [class$='Cach'] .spinner-border {width:1rem; height:1rem; border-width:.15rem;} /* Table class$=Act ------------------------- */ .table [class$='Act'] {width:auto; display:flex; justify-content:center; margin-left:-1px;} /* ListJs 參考：https://wickedev.com/create-interactive-html-table-using-list-js/ */ .listjs-sorter {position: relative; cursor: pointer; padding-right: 1.25rem;} .listjs-sorter::after {font-weight: normal; line-height: 1; content: "\21C5"; position: absolute; right: 0.75rem; top: 50%; transform: translateY(-50%);} .listjs-sorter.asc::after {content: "\2191";} .listjs-sorter.desc::after {content: "\2193";} /* Summernote@0.8.18 */ .note-editor .note-toolbar .dropdown-toggle::after {display:none;} .note-editor .note-toolbar .note-color-all .note-dropdown-menu {min-width:345px;} .note-btn-group {margin-right:0} .note-editor.note-frame.fullscreen {background-color:#FFF;} /* Side Gallery */ #itemUpLabel, #itemMvLabel, #itemDeLabel{font-size:.88rem; font-weight:400;} #itemUpLabel em, #itemMvLabel em, #itemDeLabel em {font-style: normal; opacity:.8;} #itemUpLabel *, #itemMvLabel *, #itemDeLabel * {opacity:.7;} #itemUpLabel .now, #itemMvLabel .now, #itemDeLabel .now {opacity:1; color:#f672a7;} #sideAlbum label {overflow: hidden; position:relative; cursor:pointer; padding:.15rem; margin:.0;} #sideAlbum label * {transition:.2s ease-out; -webkit-transition:.2s ease-out; -moz-transition:.2s ease-out; -ms-transition:.2s ease-out; -o-transition:.2s ease-out;} #sideAlbum label img { width:100%; float:left; border:1px solid transparent; border-radius:.2rem ; -webkit-border-radius:.2rem ; -moz-border-radius:.2rem ; -ms-border-radius:.2rem ; -o-border-radius:.2rem ; } #sideAlbum label input {position:absolute; top:10px; right:10px; width: 1.2rem; height: 1.2rem; border-radius: 50%; vertical-align: middle; appearance: none; -webkit-appearance: none; outline: none; cursor: pointer; background-color: rgb(53, 119, 241); background-image:url('../images/svg/sideAlbumCheck.svg'); background-size: contain; background-repeat:no-repeat ; border: .3rem solid rgb(53, 119, 241); opacity:0;} #sideAlbum label.chs {filter: drop-shadow(0px 0px 3px rgba(53, 119, 241, 1)); -webkit-filter: drop-shadow(0px 0px 3px rgba(53, 119, 241, 1));} #sideAlbum label.chs img { border-color:rgb(53, 119, 241);} #sideAlbum label.chs input {opacity:1;} #sideAlbum .full label:not(.chs) img {opacity:.3; cursor: default;} #sideAlbum .offcanvas-header .input-group>* { border-radius:.25rem ; -webkit-border-radius:.25rem ; -moz-border-radius:.25rem ; -ms-border-radius:.25rem ; -o-border-radius:.25rem ; } #sideAlbum .offcanvas-header .input-group select {margin-right:5px;} /* Side Gallery Album Upload */ .goBack {padding-left:2rem; height:38px;} .goBack .spinner-border, .zoneUp .spinner-border, .zoneUr .spinner-border, .zoneMv .spinner-border, .zoneMvOne .spinner-border, .zoneDe .spinner-border {width:19px; height:19px; border-width: 0.15rem; position:absolute; left:7px; display:none;} .goBack .label-icon {width:19px; height:19px; border-width: 0.15rem; position:absolute; left:7px; top:6px;} .goBack em, .zoneUp em, .zoneUr em, .zoneMv em, .zoneMvOne em, .zoneDe em {font-style:normal;} .modal .disabled .spinner-border, .offcanvas .disabled .spinner-border {display:inline-block;} .modal .disabled .label-icon, .offcanvas .disabled .label-icon {display:none;} /* Side Icons */ #sideIcons label {overflow: hidden; position:relative; cursor:pointer; padding:.15rem; display: flex; justify-content: center; border:1px solid transparent; border-radius:.2rem ; -webkit-border-radius:.2rem ; -moz-border-radius:.2rem ; -ms-border-radius:.2rem ; -o-border-radius:.2rem ;} #sideIcons label * {transition:.2s ease-out; -webkit-transition:.2s ease-out; -moz-transition:.2s ease-out; -ms-transition:.2s ease-out; -o-transition:.2s ease-out;} #sideIcons label i {font-size:2rem; float:left;} #sideIcons label input {position:absolute; top:2px; right:2px; width: 1.2rem; height: 1.2rem; border-radius: 50%; vertical-align: middle; appearance: none; -webkit-appearance: none; outline: none; cursor: pointer; background-color: rgb(53, 119, 241); background-image:url('../images/svg/sideAlbumCheck.svg'); background-size: contain; background-repeat:no-repeat ; border: .3rem solid rgb(53, 119, 241); opacity:0;} #sideIcons label.chs {border-color:rgb(53, 119, 241);/*filter: drop-shadow(0px 0px 3px rgba(53, 119, 241, 1)); -webkit-filter: drop-shadow(0px 0px 3px rgba(53, 119, 241, 1));*/} #sideIcons label.chs i {} #sideIcons label.chs input {opacity:1;} #sideIcons .full label:not(.chs) i {opacity:.3; cursor: default;} #sideIcons .offcanvas-header .input-group>* { border-radius:.25rem ; -webkit-border-radius:.25rem ; -moz-border-radius:.25rem ; -ms-border-radius:.25rem ; -o-border-radius:.25rem ; } #sideIcons .offcanvas-header .input-group select {margin-right:5px;} /* #itemUp .goBack, #itemMv .goBack, #itemDe .goBack {padding-left:2rem; height:38px;} #itemUp .goBack .spinner-border, #itemMv .goBack .spinner-border, #itemDe .goBack .spinner-border, #itemUp .zoneUp .spinner-border, #itemMv .zoneMv .spinner-border, #itemDe .zoneDe .spinner-border {width:19px; height:19px; border-width: 0.15rem; position:absolute; left:7px; display:none;} #itemUp .goBack .label-icon, #itemMv .goBack .label-icon, #itemDe .goBack .label-icon {width:19px; height:19px; border-width: 0.15rem; position:absolute; left:7px; top:6px;} #itemUp .goBack em, #itemMv .goBack em, #itemDe .goBack em, #itemUp .zoneUp em, #itemMv .zoneMv em, #itemDe .zoneDe em {font-style:normal;} #itemUp .disabled .spinner-border, #itemMv .disabled .spinner-border, #itemDe .disabled .spinner-border {display:inline-block;} #itemUp .disabled .label-icon, #itemMv .disabled .label-icon, #itemDe .disabled .label-icon {display:none;}*/ #upFile {display:none;} #itemUpRes .alert {text-align:right; border:0; margin-bottom:.25rem;} #itemUpRes .alert b {float:left; margin-right:.5rem;} .sizeRefer {text-align:center;} /* Region Selects */ .regions {display: -webkit-box!important; display: -ms-flexbox!important; display: flex!important;} .regions>div {-webkit-box-flex: 1!important; -ms-flex: 1 1 auto!important; flex: 1 1 auto!important;} .regions>div.rID1 {display:flex; flex-direction: column; align-items: flex-start!important;} .regions>div:not(.rID1,.first) {margin-left:.1rem; display:flex; align-items: flex-end!important;} .regions .spinner-border {width:1rem; height:1rem; border-width:.15em; vertical-align: -0.18em; display:none;} .regions.load .spinner-border {display:inline-block;} .regions.vertical {-webkit-box-orient: vertical!important; -webkit-box-direction: normal!important; -ms-flex-direction: column!important; flex-direction: column!important;} .regions.vertical>div:not(.rID1,.first), .banks.vertical>div:not(.bankList) {margin-top:.1rem; margin-left:0;} .regions.vertical .rID2 label, .regions.vertical .rID3 label, .regions.vertical .rID4 label, .regions.vertical>div:not(.rID1,.first,.bankList) label {display:none;} /* Banks Selects */ .banks {display: -webkit-box!important; display: -ms-flexbox!important; display: flex!important;} .banks>div {-webkit-box-flex: 1!important; -ms-flex: 1 1 auto!important; flex: 1 1 auto!important; margin-left:.1rem;} .banks .bankList {margin-left:0;} /* Logo Zone */ .logoZone { display:flex; justify-content:center; position:relative; padding:1.5rem; border-radius:.25rem; -webkit-border-radius:.25rem; -moz-border-radius:.25rem; -ms-border-radius:.25rem; -o-border-radius:.25rem; transition:.2s ease-in-out; -webkit-transition:.2s ease-in-out; -moz-transition:.2s ease-in-out; -ms-transition:.2s ease-in-out; -o-transition:.2s ease-in-out; } .logoZone>img {max-width:90%; display:none; visibility:hidden;} .logoZone>.btn-group { position:absolute; right:.5rem; bottom:.5rem; opacity:.3; transition:.2s ease-in-out; -webkit-transition:.2s ease-in-out; -moz-transition:.2s ease-in-out; -ms-transition:.2s ease-in-out; -o-transition:.2s ease-in-out; display:none; visibility:hidden;} .logoZone:hover>.btn-group {opacity:1;} .logoZone.got>img {display:block; visibility:visible;} .logoZone.got>.btn-group {display:flex; visibility:visible;} .logoZone.got>button {display:none; visibility:hidden;} .logoLight {background:rgba(0, 0, 0, .45);} .logoLight:hover {background:rgba(0, 0, 0, .55);} .logoDark {background:rgba(0, 0, 0, .15);} .logoDark:hover {background:rgba(0, 0, 0, .05);} /* Img Zone & Ico Zone */ .imgZone, .icoZone { display:flex; justify-content:center; position:relative; padding:1.5rem; border-radius:.25rem; -webkit-border-radius:.25rem; -moz-border-radius:.25rem; -ms-border-radius:.25rem; -o-border-radius:.25rem; transition:.2s ease-in-out; -webkit-transition:.2s ease-in-out; -moz-transition:.2s ease-in-out; -ms-transition:.2s ease-in-out; -o-transition:.2s ease-in-out; } .imgZone img, .icoZone>img {max-width:90%; display:none; visibility:hidden;} .imgZone>.btn-group, .icoZone>.btn-group { position:absolute; right:.5rem; bottom:.5rem; opacity:.3; transition:.2s ease-in-out; -webkit-transition:.2s ease-in-out; -moz-transition:.2s ease-in-out; -ms-transition:.2s ease-in-out; -o-transition:.2s ease-in-out; display:none; visibility:hidden;} .imgZone:hover>.btn-group, .icoZone:hover>.btn-group {opacity:1;} .imgZone.got img, .icoZone.got>img {display:block; visibility:visible;} .imgZone.got>.btn-group, .icoZone.got>.btn-group {display:flex; visibility:visible;} .imgZone.got>button, .icoZone.got>button {display:none; visibility:hidden;} .imgZone, .icoZone {background:rgba(0, 0, 0, .45);} .imgZone:hover, .icoZone:hover {background:rgba(0, 0, 0, .55);} /* 20230713 */ .imgZone .demo {display:flex; justify-content:center; position:relative; max-width:90%;} .imgZone .demo .dusk {width:100%; height:100%; display:flex; justify-content:center; align-items:center; position:absolute; opacity:0; visibility:hidden;} .imgZone.got .demo .dusk {opacity:1; visibility:visible;} .imgZone .demo img {width:100%; max-width:100%;} .imgZone .demo.dark .dusk {background:#00000066;} .imgZone .demo.dark .dusk span {color:#FFF;} .imgZone .demo.light .dusk {background:#FFFFFF80;} .imgZone .demo.light .dusk span {color:#212121;} .imgZone .demo .dusk span {text-align:center; font-weight:400;} .imgZone .demo .dusk span b {color:var(--vz-stress);} /* Avatar Zone */ .avatarZone { display:flex; justify-content:center; position:relative; padding:1.5rem; border-radius:.25rem; -webkit-border-radius:.25rem; -moz-border-radius:.25rem; -ms-border-radius:.25rem; -o-border-radius:.25rem; transition:.2s ease-in-out; -webkit-transition:.2s ease-in-out; -moz-transition:.2s ease-in-out; -ms-transition:.2s ease-in-out; -o-transition:.2s ease-in-out; } .avatarZone>img {max-width:90%; display:none; visibility:hidden;} .avatarZone>.btn-group { position:absolute; right:.5rem; bottom:.5rem; opacity:.3; transition:.2s ease-in-out; -webkit-transition:.2s ease-in-out; -moz-transition:.2s ease-in-out; -ms-transition:.2s ease-in-out; -o-transition:.2s ease-in-out; display:none; visibility:hidden;} .avatarZone:hover>.btn-group {opacity:1;} .avatarZone.got>img {display:block; visibility:visible;} .avatarZone.got>.btn-group {display:flex; visibility:visible;} .avatarZone.got>button {display:none; visibility:hidden;} .avatarZone {background:rgba(0, 0, 0, .45);} .avatarZone:hover {background:rgba(0, 0, 0, .55);} /* Avatar Zone New */ #myAvatar {width:140px; height:140px;} #myAvatar .profile-user {width:130px; height:130px; background-position:center; background-size:cover; background-repeat:no-repeat;} #myAvatar, #myAvatar .preLoad, #myAvatar .profile-user {border-radius:50%; -webkit-border-radius:50%; -moz-border-radius:50%; -ms-border-radius:50%; -o-border-radius:50%; } /* Bootstrap Icon Zone */ .bsiZone { display:flex; justify-content:center; position:relative; padding:1.5rem; border-radius:.25rem; -webkit-border-radius:.25rem; -moz-border-radius:.25rem; -ms-border-radius:.25rem; -o-border-radius:.25rem; transition:.2s ease-in-out; -webkit-transition:.2s ease-in-out; -moz-transition:.2s ease-in-out; -ms-transition:.2s ease-in-out; -o-transition:.2s ease-in-out; } .bsiZone>h1 {display:none; visibility:hidden; margin:0;} .bsiZone>.btn-group { position:absolute; right:.5rem; bottom:.5rem; opacity:.3; transition:.2s ease-in-out; -webkit-transition:.2s ease-in-out; -moz-transition:.2s ease-in-out; -ms-transition:.2s ease-in-out; -o-transition:.2s ease-in-out; display:none; visibility:hidden;} .bsiZone:hover>.btn-group {opacity:1;} .bsiZone.got>h1 {display:block; visibility:visible;} .bsiZone.got>.btn-group {display:flex; visibility:visible;} .bsiZone.got>button {display:none; visibility:hidden;} .bsiZone {background:rgba(0, 0, 0, .1);} .bsiZone:hover {background:rgba(0, 0, 0, .15);} /* Site Online Flatpickr */ [id$='Detail'] .pickrInline .flatpickr-calendar, [id$='Detail'] .pickrInline .flatpickr-days, [id$='Detail'] .pickrInline .flatpickr-calendar.open, [id$='Detail'] .pickrInline .flatpickr-calendar.inline, [id$='Detail'] .pickrInline .flatpickr-rContainer, [id$='Detail'] .pickrInline .dayContainer, [id$='Detail'] .pickrInline .flatpickr-day {width:100%; max-width:100%;} [id$='Detail'] .flatpickr-weekdays {height:2rem; margin-bottom: 1px;} /* 20230114 */ [id$='Detail'] .flatpickr-calendar, [id$='Detail'] span.flatpickr-weekday, [id$='Detail'] .flatpickr-day {font-size:.85rem; font-weight:500;} [id$='Detail'] .flatpickr-months {position:relative;} [id$='Detail'] .flatpickr-months .flatpickr-month {height:3rem;} [id$='Detail'] .flatpickr-calendar.arrowTop::before {display:none;} [id$='Detail'] .flatpickr-current-month {left:50%; top:50%; transform: translate(-50%,-50%)!important; padding:0; display:flex; justify-content: center; align-items: stretch; max-width:220px;} [id$='Detail'] .flatpickr-current-month .flatpickr-monthDropdown-months {font-weight:bolder; flex:1 1 auto; width:1%; min-width:0; border-radius:0.375rem; border-top-right-radius:0; border-bottom-right-radius:0; text-align:center; padding-left:0; border:1px solid rgba(255,255,255,.1)} [id$='Detail'] .flatpickr-current-month input.cur-year {border-radius: 0.375rem; border-top-left-radius:0; border-bottom-left-radius:0; text-align:center; padding-right:.5rem; padding-left:0; border:1px solid rgba(255,255,255,.1)} [id$='Detail'] .flatpickr-current-month .numInputWrapper {display:flex; flex:1 1 auto; width:1%; min-width:0; margin-top:-1px; margin-left:-1px;} [id$='Detail'] .flatpickr-current-month .numInputWrapper:hover, [id$='Detail'] .flatpickr-current-month .flatpickr-monthDropdown-months:hover {background-color:rgba(255,255,255,.1)} [id$='Detail'] .numInputWrapper span {right:.25rem;} [id$='Detail'] .flatpickr-months .flatpickr-prev-month {left:0; top:50%; transform: translateY(-50%)!important; padding:0 0 0 .6rem; display:flex;} [id$='Detail'] .flatpickr-months .flatpickr-next-month {right:0; top:50%; transform: translateY(-50%)!important; padding:0 .6rem 0 0; display:flex;} [id$='Detail'] .flatpickr-months .flatpickr-prev-month i, [id$='Detail'] .flatpickr-months .flatpickr-next-month i {margin-top:auto; margin-bottom:auto;} /* 20230313 */ [id$='Detail'] .flatpickr-innerContainer {border-bottom:none;} [id$='Detail'] .flatpickr-calendar.inline .flatpickr-rContainer .flatpickr-days .dayContainer .flatpickr-day {border-radius:0;} [id$='Detail'] .flatpickr-day.selected.startRange, [id$='Detail'] .flatpickr-day.startRange.startRange {border-radius: 50px 0 0 50px!important;} [id$='Detail'] .flatpickr-day.today, [id$='Detail'] .flatpickr-day.selected.endRange, [id$='Detail'] .flatpickr-day.endRange.endRange {border-radius: 0 50px 50px 0!important;} [id$='Detail'] .flatpickr-day.today, [id$='Detail'] .flatpickr-day.startRange.endRange { border-radius:50px!important; -webkit-border-radius:50px!important; -moz-border-radius:50px!important; -ms-border-radius:50px!important; -o-border-radius:50px!important; } [id$='Detail'] .flatpickr-day.today.inRange { border-radius: 0 !important; -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; -ms-border-radius: 0 !important; -o-border-radius: 0 !important; border-color: var(--vz-primary-deep);} [id$='Detail'] .flatpickr-day.inRange {background-color: var(--vz-primary-soft); border-color: var(--vz-primary-soft); -webkit-box-shadow: -5px 0 0 var(--vz-primary-soft),5px 0 0 var(--vz-primary-soft); box-shadow: -5px 0 0 var(--vz-primary-soft),5px 0 0 var(--vz-primary-soft);} [id$='Detail'] .flatpickr-day.today.inRange + .flatpickr-day.inRange {-webkit-box-shadow: 0px 0 0 var(--vz-primary-soft),5px 0 0 var(--vz-primary-soft); box-shadow: 0px 0 0 var(--vz-primary-soft),5px 0 0 var(--vz-primary-soft);} [id$='Detail'] .flatpickr-day.prevMonthDay.inRange, [id$='Detail'] .flatpickr-day.nextMonthDay.inRange {background-color: var(--vz-primary-lite); border-color: var(--vz-primary-lite); -webkit-box-shadow: -5px 0 0 var(--vz-primary-lite),5px 0 0 var(--vz-primary-lite); box-shadow: -5px 0 0 var(--vz-primary-lite),5px 0 0 var(--vz-primary-lite);} /* 20231121 */ html[data-sidebar-size="lg"] .navbar-brand-box {text-align:left;} /* layout dark */ html[data-layout-mode="dark"] [id$='Detail'] .flatpickr-innerContainer {background-color:transparent;} html[data-layout-mode="dark"] [id$='Detail'] .flatpickr-day.inRange {background-color: var(--vz-primary-deep); border-color: var(--vz-primary-deep); -webkit-box-shadow: -5px 0 0 var(--vz-primary-deep),5px 0 0 var(--vz-primary-deep); box-shadow: -5px 0 0 var(--vz-primary-deep),5px 0 0 var(--vz-primary-deep);} html[data-layout-mode="dark"] [id$='Detail'] .flatpickr-day.prevMonthDay.inRange, html[data-layout-mode="dark"] [id$='Detail'] .flatpickr-day.nextMonthDay.inRange {background-color: var(--vz-primary-heavy); border-color: var(--vz-primary-heavy); -webkit-box-shadow: -5px 0 0 var(--vz-primary-heavy),5px 0 0 var(--vz-primary-heavy); box-shadow: -5px 0 0 var(--vz-primary-heavy),5px 0 0 var(--vz-primary-heavy);} /* Only View Mode */ [id$='Detail'] .onlyView {position:relative;} [id$='Detail'] .onlyView .flatpickr-calendar.inline .flatpickr-rContainer {position:relative;} [id$='Detail'] .onlyView .flatpickr-calendar.inline .flatpickr-rContainer::after{content:""; width:100%; height:100%; position:absolute; z-index:10; -webkit-transform: translateX(-50%)!important; transform: translateX(-50%)!important; left: 50%!important; bottom: 0!important;} /* Per Price */ .perPrice {display:flex; margin-top:.5rem;} .perPrice>i {display:flex; flex-direction: column; text-align:right; line-height:.88rem; margin-right:.5rem; margin-top:auto; margin-bottom:auto;} .perPrice>em {font-size:1.88rem; line-height:1.76rem; color:var(--vz-stress);} .perPrice>p {margin-top:auto; margin-bottom:0rem; margin-left:.3rem;} .perPrice>i>del, .perPrice>p>i {opacity:.7;} /* Mini Cart */ .miniCar .parTitle {display:flex; align-items:center;} .miniCar .parTitle .icon {width:40px; min-width:40px; height:40px; position:relative; border-radius: 50%!important;} .miniCar .parTitle .icon i {position:absolute; -webkit-transform: translate(-50%,-50%)!important; transform: translate(-50%,-50%)!important; left: 50%!important; top:50%;} .miniCar .parTitle h5 {line-height:var(--vz-modal-title-line-height); color:var(--vz-heading-color); margin:0;} .miniCar .parTitle h5 small {font-weight:normal; display:block; font-size:var(--vz-body-font-size);} .miniCar .border-top-dashed {border-top:1px dashed var(--vz-input-border)} .miniCar .card-radio .form-check-input:checked+.form-check-label {background-color: rgba(247,184,75,.18)} .miniCar .card-radio .form-check-input:checked+.form-check-label::before {font-size:2rem; top:-3px;} html[data-layout-mode="dark"] .miniCar .card-radio .form-check-input:checked+.form-check-label {--vz-border-opacity: 1; border-color: rgba(var(--vz-secondary-rgb),var(--vz-border-opacity))!important;} html[data-layout-mode="dark"] .miniCar .card-radio .form-check-input:checked+.form-check-label::before {--vz-text-opacity: 1; color: rgba(var(--vz-secondary-rgb),var(--vz-text-opacity))!important;} .miniCar .itemBox {position:relative; overflow:hidden; background-color: var(--vz-card-bg-custom); border: 1px solid var(--vz-input-check-border); border-radius: 0.25rem; padding:0;} .miniCar .itemBox .ibMain {position:absolute; display:none;} .miniCar .itemBox .ibMeta {position:relative; display:flex; align-items:center; padding:.5rem; padding-right:40px;} .miniCar .itemBox .ibIcon {width:32px; height:32px; font-size:32px; line-height:1; position:absolute; cursor:pointer; margin:0; right:5px; top:50%; transform:translateY(-50%); --vz-text-opacity:1; color:rgba(var(--vz-dark-rgb),.18);} .miniCar .itemBox .ibPrice {display:none;} .miniCar .itemBox .ibPrice .table-responsive {margin:0 -1px -1px;} .miniCar .itemBox .ibPrice .table-responsive .table {margin:0;} .miniCar .itemBox .ibPrice .num div {text-align:right; padding:.5rem .9rem;} .miniCar .itemBox .ibPrice .num label input {padding-right:30px;} .miniCar .itemBox .ibPrice .num label i.ri-pencil-fill {position:absolute; top:50%; right:5px; transform:translateY(-50%); opacity:.5;} .miniCar .itemBox .ibPrice tr:hover .num label i.ri-pencil-fill {opacity:1;} .miniCar .itemBox.bind {border-color: rgba(var(--vz-primary-rgb),var(--vz-border-opacity));} .miniCar .itemBox.bind .ibIcon {color: rgba(var(--vz-primary-rgb),var(--vz-text-opacity));} .miniCar .itemBox.bind .ibPrice {display:block;} /* Navigation Desc */ .miniNav .snBgZone .card-radio .form-check-input:checked+.form-check-label{background-color: rgba(247,184,75,.18)!important} .miniNav .snBgZone .card-radio .form-check-input:checked+.form-check-label::before {font-size:2rem; top:-3px; z-index:3;} .miniNav .snBgZone .form-check-label {padding:.5rem !important;} /* Basic */ .miniNav .form-check-label .mar {width:100%; height:30px; line-height:30px; text-align:center; background:#FFF; color:#212121; font-size:12px; border-top-left-radius:var(--vz-border-radius); border-top-right-radius:var(--vz-border-radius); box-shadow: 0 1px 3px rgba(56,65,74,.45); display:none;} .miniNav .form-check-label .nav { width:100%; height:60px; border-radius:var(--vz-border-radius); box-shadow: 0 1px 3px rgba(56,65,74,.45); overflow:hidden; position:relative; background-color:transparent; background-position:center; background-repeat:no-repeat; background-size:1280px auto; -webkit-border-radius:; -moz-border-radius:; -ms-border-radius:; -o-border-radius:; } .miniNav .form-check-label .nav i { font-style:normal; font-size:1rem; font-weight:400; color:#212529; transition: all .3s ease-out; z-index:2; -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; -o-transition: all .3s ease-out; } .miniNav .form-check-label .nav:hover i {color: var(--vz-stress) !important;} .miniNav .form-check-label .nav * { position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); } .miniNav .form-check-label .nav .dusk {width:100%; height:100%; opacity:.65; z-index:1;} .miniNav .notify .form-check-label .mar {display:block;} .miniNav .notify .form-check-label .nav {border-top-left-radius:0; border-top-right-radius:0;} /* Color */ .miniNav .dark .form-check-label .nav {background-color:#343A40;} .miniNav .dark .form-check-label .nav i {color:#FFF;} .miniNav .dark .form-check-label .nav .dusk {background-color:#000;} .miniNav .light .form-check-label .nav {background-color:#FFF;} .miniNav .light .form-check-label .nav i {color:#212121;} .miniNav .light .form-check-label .nav .dusk {background-color:#FFF;} /* BgImg */ .miniNav .form-check-label .nav.bg01 {background-image:url('https://cdn.ziz.im/assets/img/album/_ogimage01@1200x630.jpg')} /* FaceLayoutEditor */ [id$="LayoutEditor"] .modal-header .row {width:100%;} [id$="LayoutEditor"] .nav-justified .nav-item .nav-link {display:flex; justify-content:center; align-items:center;} [id$="LayoutEditor"] .nav-link.active {color:var(--vz-stress);} [id$="LayoutEditor"] .nav-link {padding:var(--vz-nav-link-padding-y) var(--vz-nav-link-padding-y);} [id$="LayoutEditor"] .nav-link>img {height:12px;} [id$="LayoutEditor"] .nav-link>img+span {margin-left:.2rem;} [id$="LayoutEditor"] .modal-body .dataDemo, [id$="LayoutEditor"] .modal-body .dataProd {display:none;} [id$="LayoutEditor"] .modal-body.demo .dataDemo, [id$="LayoutEditor"] .modal-body.prod .dataProd {display:block;} /* 20250729 */ [id$="LayoutEditor"] .modal-header button[data-bs-dismiss="modal"] {width:2.5rem; height:2.5rem; border:1px solid var(--vz-input-border); position:absolute; top:-.76rem; right:-.62rem;} [id$="LayoutEditor"] .modal-dialog {min-height:350px;} [id$="LayoutEditor"] .modal-dialog>.preLoad {background:rgba(0,0,0,.25);} [id$="LayoutEditor"] .choices {margin-bottom:0;} [id$="LayoutEditor"] .itemDetail, [id$="LayoutEditor"] .itemDel {display:none;} [id$="LayoutEditor"] input, [id$="LayoutEditor"] textarea {font-family:sans-serif;} /* For Summernote */ [id$="LayoutEditor"].miniCar .parTitle {align-items: flex-start} [id$="LayoutEditor"].miniCar .area .card-radio .form-check-label {padding-right:160px; min-height:106px;} [id$="LayoutEditor"].miniCar .area .card-radio .form-check-label img {position:absolute; top:18px; right:18px; width:132px;} [id$="LayoutEditor"].miniCar .itemDetail .card-radio .form-check-label {padding:.5rem!important;} [id$="LayoutEditor"].miniCar pre {white-space: pre-wrap; word-wrap: break-word; margin:0;} [id$="LayoutEditor"].miniCar pre code {color:var(--vz-code-color); cursor:pointer;} .teamSocial {position:relative; cursor:pointer; min-width:2.5rem;} .teamSocial>* { position:absolute; opacity:.2; left:50%; top:50%; transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); -moz-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); } .teamSocial.active {color:#FFF; background-color:#405189; border-color:#405189;} .teamSocial.active>* {opacity:1;} .teamSocial input {display:none;} .masterTone {display:flex; height:2.344rem;} .masterTone label {font-size:.8125rem; font-weight:400; border:0; margin:0; display:flex; flex-grow:1; justify-content:center; align-items:center; cursor:pointer;} .masterTone label input {display:none; visibility:hidden;} .masterTone label span { position:relative; padding-right:0; transition: ease .3s; -webkit-transition: ease .3s; -moz-transition: ease .3s; -ms-transition: ease .3s; -o-transition: ease .3s; } .masterTone label span i { position:absolute; right:0; opacity:0; transition: ease .3s; -webkit-transition: ease .3s; -moz-transition: ease .3s; -ms-transition: ease .3s; -o-transition: ease .3s; } .masterTone label:hover span, .masterTone label.checked span {padding-right:15px;} .masterTone label:hover span i, .masterTone label.checked span i {opacity:1;} .masterTone label:first-child {border-bottom-left-radius: var(--vz-border-radius)!important; border-top-left-radius: var(--vz-border-radius)!important;} .masterTone label:last-child {border-top-right-radius: var(--vz-border-radius)!important; border-bottom-right-radius: var(--vz-border-radius)!important;} .masterToneFix label {margin-bottom:0; cursor:pointer;} .masterToneFix label input {display:none; visibility:hidden;} #duskPara .form-control {display:none; visibility:hidden; border-top-right-radius: var(--vz-border-radius)!important; border-bottom-right-radius: var(--vz-border-radius)!important;} #duskPara.dark .dpDark, #duskPara.light .dpLight, #duskPara.fix .dpFix {display:block; visibility:visible;} /* 20230714 */ .textGroup textarea {position:relative; z-index:1; border-radius:.25rem .25rem 0 0; -webkit-border-radius:.25rem .25rem 0 0; -moz-border-radius:.25rem .25rem 0 0; -ms-border-radius:.25rem .25rem 0 0; -o-border-radius:.25rem .25rem 0 0; } .textGroup textarea+.input-group {margin-top:-1px;} .textGroup textarea+.input-group>*:first-child { border-radius:0 0 0 .25rem; -webkit-border-radius:0 0 0 .25rem; -moz-border-radius:0 0 0 .25rem; -ms-border-radius:0 0 0 .25rem; -o-border-radius:0 0 0 .25rem; } .textGroup textarea+.input-group>*:last-child { border-radius:0 0 .25rem 0; -webkit-border-radius:0 0 .25rem 0; -moz-border-radius:0 0 .25rem 0; -ms-border-radius:0 0 .25rem 0; -o-border-radius:0 0 .25rem 0; } /* 20231027 */ .textGroup2 .input-group>*:first-child { border-radius:.25rem 0 0 0; -webkit-border-radius:.25rem 0 0 0; -moz-border-radius:.25rem 0 0 0; -ms-border-radius:.25rem 0 0 0; -o-border-radius:.25rem 0 0 0; } .textGroup2 .input-group>*:last-child { border-radius:0 .25rem 0 0; -webkit-border-radius:0 .25rem 0 0; -moz-border-radius:0 .25rem 0 0; -ms-border-radius:0 .25rem 0 0; -o-border-radius:0 .25rem 0 0; } .textGroup2 .input-group+textarea {margin-top:-1px;} .textGroup2 textarea { position:relative; z-index:1; border-radius: 0 0 .25rem .25rem; -webkit-border-radius: 0 0 .25rem .25rem; -moz-border-radius: 0 0 .25rem .25rem; -ms-border-radius: 0 0 .25rem .25rem; -o-border-radius: 0 0 .25rem .25rem; } /* 20230715 */ .boxAssoc {padding:.25rem; background-color:rgba(var(--vz-dark-rgb),.18); position:relative; margin-top:1.78rem; margin-bottom:.5rem; width:100%; border-radius:0 .3rem .3rem .3rem; -webkit-border-radius:0 .3rem .3rem .3rem; -moz-border-radius:0 .3rem .3rem .3rem; -ms-border-radius:0 .3rem .3rem .3rem; -o-border-radius:0 .3rem .3rem .3rem; } .boxAssoc .num {width:61px; height:20px; text-align:center; line-height:26px; margin:0; position:absolute; top:-20px; left:0; background-color:rgba(var(--vz-dark-rgb),.18); border-radius:.3rem .3rem 0 0; -webkit-border-radius:.3rem .3rem 0 0; -moz-border-radius:.3rem .3rem 0 0; -ms-border-radius:.3rem .3rem 0 0; -o-border-radius:.3rem .3rem 0 0; } .boxAssoc .del {position:absolute; top:-1.2rem; right:0;} /* 20230810 */ .modal-body code , .swal2-html-container code {font-size:inherit;} /* 20240724 */ .page-title-box h4 .num {font-weight: 600; text-transform:none; position:relative;} .page-title-box h4 .num .badge {position:absolute; left:100%; top:50%; transform: translate(0%, -50%); margin-left:.25rem; font-weight:normal} /* 20250313 form .arrow-navtabs .nav-item .nav-link {display:flex; align-items:center;} form .arrow-navtabs .nav-item .nav-link .badge {font-style:normal; margin-left:.15rem; background-color:rgba(var(--vz-danger-rgb), var(--vz-bg-opacity)); display:none;} form .arrow-navtabs .nav-item .nav-link.tip .badge {display:block;} */ .card .nav-item .nav-link {display:flex; align-items:center;} .card .nav-item .nav-link .badge {font-style:normal; margin-left:.15rem; background-color:rgba(240,101,72,1); display:none;} .card .nav-item .nav-link.tip .badge {display:block;} /* 1:1Img */ .square .card *[class*="card-img"] {width:100%; aspect-ratio:1/1; object-fit:cover;} /* 20250328 */ .avatar-md img, .avatar-lg img {width:100%; height:100%; object-fit:cover;} /* Get File */ .gfile {border-radius:12px; display:flex; flex-direction:row; flex-wrap:nowrap; overflow:hidden; align-items:stretch;} .gfile-type {border-right:1px solid #dddfe2; display:flex; flex-basis:98px; flex-direction:column; flex-shrink:0; justify-content:center; pointer-events:none; width: 98px;} .gfile-type img {border:none;} .gfile-info {width:100%; min-width:148px;} .gfile-info .card-title {margin: 0 0 7px 0;} .gfile-info .url {color:#606770; font-size:12px; height:13px; line-height:11px; margin-top:0px; pointer-events:none;} .gfile-info .ellipsis {overflow:hidden; height:13px; text-overflow:ellipsis; white-space:nowrap;} /* CheckBox @ Pick */ .chx, .chx label {border-radius:50%; margin:0; padding:0; overflow:hidden; display:flex; justify-content:center; align-items:center;} .chx input {display:none;} .chx label {width:100%; height:100%; cursor:pointer; background-color:rgba(var(--vz-dark-rgb),.05); color:rgba(var(--vz-dark-rgb),.2); position:relative; transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;} .chx label i {position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%);} .chx input[type=checkbox]:checked ~ label {background-color:rgba(var(--vz-primary-rgb),1); color:rgba(var(--vz-light-rgb),1);} .chx.s16 {width:16px; height:16px; font-size:12px;} .chx.s32 {width:32px; height:32px; font-size:20px;} .chx.s64 {width:64px; height:64px; font-size:42px;} .pickBox {margin:0; padding:0; list-style:none; text-align:right; display:flex; flex-direction:column; gap:.5rem;} .pickBox li {display:flex; justify-content:end; gap:.5rem;} .pickBox .num {line-height:32px; margin:0; display:flex; gap:.25rem;} .pickBox sub {line-height:32px; bottom:0;} /* Shipping Label */ .printLabel {display:flex; flex-direction:column;} .printLabel>div {border-width:.15mm; border-style:solid; border-color:var(--vz-dark); position:relative; display:flex;} .printLabel .boxPostr {display:flex; flex-direction:column; flex:1 1 auto; gap:1mm; padding:1mm;} .printLabel .boxPostr .post {flex:1 1 auto; border:.12mm dashed var(--vz-dark); border-radius:2mm; padding:2mm 2mm; text-align:right; font-size:10px; opacity:.8} .printLabel .boxPostr .info {border:0/*.12mm solid var(--vz-dark)*/; display:flex; /*gap:1mm;*/ margin:0; padding:0;} .printLabel .boxPostr .info>div {display:flex; flex-direction:column; /*justify-content:center; align-items:start;*/ flex: 1 1 auto !important;} .printLabel .boxPostr .info>div>.num {margin-top:-.5mm; font-size:10px; text-align:center;} .printLabel .boxPostr .info>div>svg, .printLabel .boxPostr .info>div>svg>rect, .printLabel .boxPostr .info>div>svg>rect>g {width:100%!important; height:100%!important; transform:none!important;} .printLabel .boxStore {display:flex; align-items:center; justify-content:flex-start; padding:.25rem; gap:.25rem;} .printLabel .boxStore svg {height:12mm;} .printLabel .boxStore h5 {margin:0;} .printLabel .boxPickr>i{position:absolute; display:block;} .printLabel .boxPickr>i.lt {width:100%; border-top:1mm solid var(--vz-dark); top:0; left:0;} .printLabel .boxPickr>i.lb {width:100%; border-bottom:1mm solid var(--vz-dark); bottom:0; left:0;} .printLabel .boxPickr>i.lr {height:100%; border-right:1mm solid var(--vz-dark); top:0; right:0;} .printLabel .boxPickr>i.ll {height:100%; border-left:1mm solid var(--vz-dark); left:0; bottom:0;} .printLabel .boxPickr .price {display:flex; align-items:flex-end; margin:5mm; margin-left:0; gap:.25rem;} .printLabel .boxPickr .price p {display:flex; flex-direction:column; align-items:flex-end; margin-bottom:0} .printLabel .boxPickr .price p u {text-decoration:none;} .printLabel .boxPickr .price h2 {margin-bottom:0} .printLabel h3 {width:12mm; display:flex; justify-content:center; align-items:center; flex-direction:column; gap:6mm; border-right:.15mm solid var(--vz-dark); padding:0; margin:0;} .printLabel h3 u {text-align:center; text-decoration:none; width:12mm; display:block;} .printLabel ul {margin:5mm; padding:0; list-style:none; flex:1 1 auto;} .printLabel .qr, .printLabel .qr .ico {display:flex; justify-content:center; align-items:center;} .printLabel .qr {position:relative; padding:5px;} .printLabel .qr .ico {width:20px; height:20px; background:#FFF; border-radius:.25rem; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%) !important;} .printLabel .qr .qrcode {width:90px; height:90px;} .printLabel .qr .qrcode>* {width:100%!important; height:100%!important;} q.num.zip {margin-bottom:2mm; gap:1mm} q.num.zip u {min-width:1.2rem; line-height:1.2rem; text-align:center; border-radius:.15rem; border-width:.12mm; border-style:solid; border-color: var(--vz-dark); text-decoration:none;} .printLabel .boxPostr, .printLabel .boxStore, .printLabel .boxSendr {border-bottom:0;} @media (max-width: 1024px) { .dssMod {display:none;} } @media (max-width: 991px) { .signBgList>li {width: 56px; height: 56px;} .auth-page-wrapper {align-items:flex-start;} } @media (max-width: 767px) { /*.card.catalog {box-shadow: none; -webkit-box-shadow:none; background:transparent;} .card.catalog .card-header {padding:0 0 1rem; background:transparent;} .card.catalog .card-header .card-title {margin:0 0 .5rem 0;} .card.catalog .card-body {padding:1rem 0;} .card.catalog .card-footer { background:transparent;}*/ .setMv, .setDe {padding:0; min-width:40px;} .setMv i, .setDe i {left:0; top:0; width:40px;} .setMv em, .setDe em {display:none;} .regions, .banks, .branch { -webkit-box-orient: vertical!important; -webkit-box-direction: normal!important; -ms-flex-direction: column!important; flex-direction: column!important; } .regions>div:not(.rID1,.first), .banks>div:not(.bankList) {margin-top:.1rem; margin-left:0;} .regions .rID2 label, .regions .rID3 label, .regions .rID4 label, .banks>div:not(.bankList) label {display:none;} .branch>.ms-1 {margin-top:.5rem; margin-left:0!important; display:grid;} [id$="LayoutEditor"] .nav-link {padding:var(--vz-nav-link-padding-y) .2rem;} [id$="LayoutEditor"] .nav-link>img {height:20px;} [id$="LayoutEditor"] .nav-link>img+span {display:none;} } @media (max-width: 575px) { #perPage {display:none;} #sideIcons label i {font-size:2.2rem;} .page-title-box h4 .num .badge {transform: translate(-100%, -50%); margin:0;} } @media (max-width: 399px) { .image-grid__item, .image-grid__col-sizer {width: 24.5%/*49%*/;} .image-grid__gutter-sizer { width: .5%/*1%*/; } .icon-grid__item, .icon-grid__col-sizer {width: 23.5%;} .icon-grid__gutter-sizer { width: 2%; } } @media print { body {background-color:transparent;} .printLabel.w94h138 {width:94mm; height:138mm;} .printLabel .boxPostr .info>div>.num {font-size:9px;} .printLabel .boxPostr .info>div>svg {width:90%!important;} .printLabel .qr .qrcode {width:24mm; height:24mm;} /*.printLabel .boxPostr .info {height:15mm!important;} .rowShipping {width:95mm; height:125mm;}*/ }