/* ----------------- Navbar ----------------- */ .navbar { height: 56px; } .y-fixtop { position: fixed; top: 0; right: 0; left: 0; } .y-ver { font-size: 0.8rem; vertical-align: bottom; color: #D2D2D2; } /* ----------------- Page content in _indx_admin or _indx_user ----------------- */ /* ----------------- Page footer (additional for admin in _indx_admin) ----------------- */ .sticky-footer { position: fixed; right: 0; bottom: 0; width: 100%; height: 40px; border-top: 3px double #D5D5D5; } #foot_left_info { font-size: 0.8rem; margin-left: 20px; } .foot-copyright { font-size: 0.8rem; padding-right: 20px; } /* ----------------- bootstrap tune ----------------- */ .page-link { /*padding: .4rem .75rem 0.6rem !important;*/ padding: .4rem .6rem .6rem !important; } .table-hover tbody tr:hover td { background-image: linear-gradient(#DFEFFF, #F2F9FF); } .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(0, 0, 0, 0.02); } /*tr:hover .acts-panel, .acc-toprow .acts-panel {*/ tr .acts-panel, .acc-toprow .acts-panel { opacity: 0.9; background-image: linear-gradient(rgba(185,220,255,0.9), rgba(236,245,255,0.9)); background-position: left top; background-repeat: no-repeat; box-shadow: -5px 0 15px 0 rgba(0, 0, 0, 0.15); } @media (min-width: 768px) { .modal-lg { max-width: 640px; } .y-modal-wider {max-width: 540px; } .y-modal-middle { max-width: 600px; } } @media (min-width: 992px) { .modal-lg { max-width: 860px; } .y-modal-wider {max-width: 700px; } .y-modal-middle { max-width: 700px; } } @media (min-width: 1200px) { .modal-lg { max-width: 1024px; } .y-modal-wider {max-width: 800px; } .y-modal-middle { max-width: 736px; } } .modal-90 { max-width: 90% !important; } .modal-95 { max-width: 95% !important; } .custom-control-input:not(:checked) ~ .custom-control-label::before { /* checkbox/radio unfocused unchecked state */ background-color: #F9F9F9 !important; outline: none; box-shadow: none !important; border: 1px solid #BCBCBC !important; } .tooltip .tooltip-inner { color: #212529; background-color: #FFFFF4; box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.3); } .tooltip.bs-tooltip-top .arrow::before { border-top-color: #FFFFF4; box-shadow: 1px 11px 20px 0px rgba(0, 0, 0, 0.3); } .tooltip.bs-tooltip-bottom .arrow::before { border-bottom-color: #FFFFF4; } .tooltip.fade { /* for tooltip fade in delay (0.15 by default) */ transition-duration: .5s; } .dropdown-menu { padding: 0; box-shadow: 5px 5px 15px 0px rgba(0, 0, 0, 0.2); } .dropdown-item:not(.disabled):hover, .dropdown-item:not(.disabled):active { color: #212529; background-image: linear-gradient(#DADADA, #F0F0F0); } .dropdown-item.disabled { cursor: default; } .modal-open .modal { /*bootstrap redefinition. modal-open - class of . modal - bootstrap modal back*/ overflow-y: hidden !important; } .modal-backdrop.show { filter: alpha(opacity=25); opacity: .25; } .modal-header { background-image: linear-gradient(#CACACA, #F8F8F8); background-position: left top; background-repeat: no-repeat; } .modal-footer { background-image: linear-gradient(#F0F0F0, #FCFCFC); /* default */ } .y-modal-close { margin-left:auto; font-size: 1.3rem; cursor: pointer; padding-bottom: .5em; color: #808080 !important; } .y-modal-err { order: -1; flex: 1; align-self: center; margin: 0; } .y-info-label { font-size: 0.7rem; } .yn-popover, .conf-popover { /*background-color: white;*/ box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.2); } .yn-popover > .popover-header { background-color: #FF8C55; color: white; } .conf-popover > .popover-header { background-color: #4AA5FF; color: white; } .yn-popover.bs-popover-bottom .arrow::after { border-bottom-color: #FF8C55 !important; } .conf-popover.bs-popover-bottom .arrow::after { border-bottom-color: #4AA5FF !important; } .yn-popover.bs-popover-bottom .popover-header::before, /* line below top arrow */ .yn-popover.bs-popover-auto[x-placement^="bottom"] .popover-header::before { border-bottom-color: #FF8C55 !important; } .conf-popover.bs-popover-bottom .popover-header::before, .conf-popover.bs-popover-auto[x-placement^="bottom"] .popover-header::before { border-bottom-color: #4AA5FF !important; } .tm-popover { background-color: #E80000; } .tm-popover div { font-size: 1rem; color: white; } .tm-popover.bs-popover-left .arrow::after { border-left-color: #E80000 !important; } .card-body-only-img { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; flex: 1 1 auto; -ms-flex: 1 1 auto; } .btn-light:hover { background-image: linear-gradient(#D1D7DC, #f8f9fa); /*#e2e6ea*/ } .btn-outline-info:hover { background-image: linear-gradient(#138496, #1AC9E1); /*#138496*/ } .btn-outline-secondary:hover { background-image: linear-gradient(#5a6268, #B5BCBF); /*#5a6268*/ } .btn-outline-primary:hover { background-image: linear-gradient(#0062cc, #3595FF); /*#0062cc*/ } .nav-tabs .nav-link.active { background-image: linear-gradient(#E8F3FF, #F2F9FF); /*#DFEFFF*/ font-weight: 600; box-shadow: 3px 0 10px 0 rgba(0, 0, 0, 0.05); } .nav-tabs .nav-link:not(.active) { font-weight: 400; } /* -------------------------------------------- end: bootstrap tune */ .h-0 { height: 0 !important; } /* flex common */ .y-flex-row-nowrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-flow: row nowrap; flex-flow: row nowrap; } .y-flex-column-nowrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-flow: column nowrap; flex-flow: column nowrap; } .y-flex-row-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-flow: row wrap; flex-flow: row wrap; } .y-align-items-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } /* End of: flex common */ /* accordions */ div.d-table.acc-head { border-left: 1px solid #DCDCDC; border-right: 1px solid #DCDCDC; border-bottom: 1px solid #DCDCDC; } .acc-head code { /*for expand/collapse images*/ color: silver; } div.d-table-cell.acc-nested { border-bottom: 1px solid #E5E5E5; } div.d-table-cell.acc-nested.tbl-order { background: rgba(235,235,211,0.25); } div.tbl-order { background-color: rgba(147, 201, 255, 0.06); } /* accordion */ .acc-panel { border-left: 1px solid #DCDCDC; border-right: 1px solid #DCDCDC; border-bottom: 1px solid #DCDCDC; background: rgba(235,235,211,0.1); padding: 10px; } .acc-nested { font-size: 0.8rem; } .acc-updn { background-color: rgba(192, 192, 192, 0.06); } .acc-open-bk { background-color: rgba(251, 253, 255, 0.95); } .acc-child-title:hover .acts-panel { opacity: 0.9; background-image: linear-gradient(rgba(234,234,213,0.9), rgba(242,242,230,0.9)); background-position: left top; box-shadow: -5px 0 15px 0 rgba(0, 0, 0, 0.15); } .y-order-col-gray, .y-action-col-gray { background-color: rgba(192, 192, 192, 0.05); } /* tables */ .tbl-order { background-color: rgba(147, 201, 255, 0.06); } .y-row-bborder { border-bottom: 1px solid rgba(192, 192, 192, 0.15); /*rgba(0, 0, 0, 0.05);*/ } /* selected cells */ td.tbl-act-cell { /* for selected table cells */ background-image: linear-gradient(rgba(255,231,204,0.85), rgba(255,249,242,0.85)); } .overflow-y-hidden { overflow-y: hidden; } .overflow-y-auto { overflow-y: auto; } /* colors */ .y-err-text { color: #FF0000;} .y-empty-result-text { color: #0080FF;} .y-steel-blue-text { color: #0080C0; } .y-gray-text { color: #808080; } .y-dgray-text { color: #505050; } .y-lgray-text { color: #A0A0A0; } .y-llgray-text { color: #C0C0C0; } .y-whitegray-text { color: #E0E0E0; } .y-dred-text { color: #BF6000; } .y-navy-text { color: #0054A8; } .y-lnavy-text { color: #0067CE; } /* modals */ .y-modal-shadow { box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.25); } .y-modal-footer-bk { background-image: url('/mtkbase/img/status_rb.png'), linear-gradient(#E6E6E6, #F5F5F5); /*../..*/ background-position: right 3px bottom 3px, left top; background-repeat: no-repeat; } .y-modal-footer-connect { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 27px; font-size: 0.7rem; color: #ACACAC; } /* ajax waiting cursor */ .y-ajax-wait { visibility: hidden; position: fixed; top: 45%; left: 45%; width: 64px; height: 64px; z-index: 1500; /* bs modal has 1050 */ text-align: center; overflow: auto; background: url('/mtkbase/img/control/ajax-loader.gif') 50% 50% no-repeat transparent; /* url('../../mtkbase/img/control/ajax-loader.gif') */ } /* borders */ .y-border-no { border: none !important; } .y-border-no-t { border-top: none !important; } .y-border-no-b { border-bottom: none !important; } .y-border-b { border-bottom: 1px solid #EEE; } .y-dborder-b { border-bottom: 3px double #DADADA; } .y-border-b-only { border-top: none !important; border-right: none !important; border-bottom: 1px solid #EEE; border-left: none !important; } /* margins */ .y-mrg-a10 { margin: 10px !important; } .y-mrg-a20 { margin: 20px !important; } .y-mrg-b2 { margin-bottom: 2px !important; } .y-mrg-b10 { margin-bottom: 10px !important; } .y-mrg-lr5 { margin-left: 5px !important; margin-right: 5px !important; } .y-mrg-lr10 { margin-left: 10px !important; margin-right: 10px !important; } .y-mrg-r5 { margin-right: 5px !important; } .y-mrg-r10 { margin-right: 10px !important; } .y-mrg-t10 { margin-top: 10px !important; } .y-mrg-t20 { margin-top: 20px !important; } /* paddings */ .y-pad-a5 { padding: 5px !important; } .y-pad-a10 { padding: 10px !important; } .y-pad-b0 { padding-bottom: 0 !important; } .y-pad-b5 { padding-bottom: 5px !important; } .y-pad-l5 { padding-left: 5px !important; } .y-pad-lr10 { padding-left: 10px !important; padding-right: 10px !important; } .y-pad-lr20 { padding-left: 20px !important; padding-right: 20px !important; } .y-pad-t2 { padding-top: 2px !important; } /* small labels of check and radio labels in forms */ .y-pad-t5 { padding-top: 5px !important; } .y-pad-tb0 { padding-top: 0 !important; padding-bottom: 0 !important; } .y-pad-tb5 { padding-top: 5px !important; padding-bottom: 5px !important; } .y-pad-w5h15 { padding: 5px 15px !important; } .y-pad-card-hf { padding-top: 1px !important; padding-right: 2px !important; padding-bottom: 2px !important; padding-left: 2px !important;} /*cards header/foot*/ /* max-width (IE) */ .y-maxw-col-1 { max-width: 8.333333%; } .y-maxw-col-2 { max-width: 16.666667%; } .y-maxw-col-3 { max-width: 25%; } .y-maxw-col-4 { max-width: 33.333333%; } .y-maxw-col-5 { max-width: 41.666667%; } .y-maxw-col-6 { max-width: 50%; } .y-maxw-col-7 { max-width: 58.333333%; } .y-maxw-col-8 { max-width: 66.666667%; } .y-maxw-col-9 { max-width: 75%; } .y-maxw-col-10 { max-width: 83.333333%; } .y-maxw-col-11 { max-width: 91.666667%; } .y-maxw-col-12 { max-width: 100% } /* width (IE) */ .y-wdt-col-1 { width: 8.333333%; } .y-wdt-col-2 { width: 16.666667%; } .y-wdt-col-3 { width: 25%; } .y-wdt-col-4 { width: 33.333333%; } .y-wdt-col-5 { width: 41.666667%; } .y-wdt-col-6 { width: 50%; } .y-wdt-col-7 { width: 58.333333%; } .y-wdt-col-8 { width: 66.666667%; } .y-wdt-col-9 { width: 75%; } .y-wdt-col-10 { width: 83.333333%; } .y-wdt-col-11 { width: 91.666667%; } .y-wdt-col-12 { width: 100% } /* fonts common */ .y-fw-normal { font-weight: 400; } .y-fw-bold { font-weight: 600; } /* font size */ .y-fz07 { font-size: 0.7rem !important; } .y-fz08 { font-size: 0.8rem !important; } .y-fz10 { font-size: 1.0rem !important; } .y-fz12 { font-size: 1.2rem !important; } .y-fz15 { font-size: 1.5rem !important; } /* links */ .y-a-flat, .y-a-flat:visited, .y-a-flat:link, .y-a-flat:active { text-decoration: none; } /* cursor */ .y-cur-point { cursor: pointer !important; } .y-cur-def { cursor: default !important; } /* diff */ .y-shad { box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.15); } .y-shad-light { box-shadow: 3px 3px 15px rgba(0, 0, 0, 0.075); } .y-tmp-sel-row { background-image: linear-gradient(#FFE4CA, #FFFAF4); } /* slate gray pagination */ .page-item.active .page-link { background-color: #708090; border-color: #708090; } .page-link { color: #5A6774; border: 1px solid #D7DCE1; } .page-link:hover { background-color: #E2E6E9; color: #5A6774; } .page-link:focus { box-shadow: 0 0 0 0.2rem rgba(112, 128, 144, 0.25); } .page-item.disabled .page-link { color: #5A6774; } /*end of: slate gray pagination */ /* cards (for prevent 3-column card-deck stretch bottom cards to full width)... 576 - from Bootstrap */ .card-mw30 {} @media (min-width: 576px) { .card-mw30 { max-width: 30%; } } .card-mw50 {} @media (min-width: 576px) { .card-mw50 { max-width: 50%; } } .foot-copyright>img:hover:not(:active) { transform: scale(1.075); } img.tbar-btn:hover:not(:active) { /* .tbar-btn: buttons on toolbars */ transform: scale(1.075); } .badge-app-info { color: #212529; background-color: #FFF8DF; } .badge-app-blue { color: #212529; background-color: #EAF4FF; border: 1px solid #D2E9FF; } .badge-app-orange { color: #56616B; background-color: #FFEEE6; border: 1px solid #FFD9C6; } .badge-app-green { color: #56616B; background-color: #F9FFF9; border: 1px solid #D9FFD9; } /*div_tmp form back color when div_tmpx form on screen */ .y-modal-beyond { background-color: #EAEAEA !important; opacity: 0.9; } .url-card:hover { box-shadow: 0 0 8px 1px rgba(170, 191, 217, 0.75); /*blue*/ } .url-card.no-head:hover { background-image: url('/mtkbase/img/dotpg_f14.png'); background-position: right 2px top 1px; background-repeat: no-repeat; } .url-card:not(.no-head):hover > .card-header { background-image: url('/mtkbase/img/dotpg_f14.png'); background-position: center center; background-repeat: no-repeat; } .thumb-card { margin: 10px; } .thumb-card>.card-header, .thumb-card>.card-footer { background-image: linear-gradient(to right, #f8f9fa, #EEF0F2, #f8f9fa); /*#f8f9fa: btn-light button*/ } .popover-qr-inf.bs-popover-auto[x-placement^="left"] .arrow::after, .popover-qr-inf.bs-popover-left .arrow::after { border-left-color: #FFFFF2 !important; } .popover-qr-inf.bs-popover-auto[x-placement^="right"] .arrow::after, .popover-qr-inf.bs-popover-right .arrow::after { border-right-color: #FFFFF2 !important; } .popover-qr-inf.bs-popover-auto[x-placement^="top"] .arrow::after, .popover-qr-inf.bs-popover-top .arrow::after { border-top-color: #FFFFF2 !important; } .popover-qr-inf.bs-popover-auto[x-placement^="bottom"] .arrow::after, .popover-qr-inf.bs-popover-bottom .arrow::after { border-bottom-color: #FFFFF2 !important; } .popover-qr-red.bs-popover-auto[x-placement^="left"] .arrow::after, .popover-qr-red.bs-popover-left .arrow::after { border-left-color: #FFEEE6 !important; } .popover-qr-red.bs-popover-auto[x-placement^="right"] .arrow::after, .popover-qr-red.bs-popover-right .arrow::after { border-right-color: #FFEEE6 !important; } .popover-qr-red.bs-popover-auto[x-placement^="top"] .arrow::after, .popover-qr-red.bs-popover-top .arrow::after { border-top-color: #FFEEE6 !important; } .popover-qr-red.bs-popover-auto[x-placement^="bottom"] .arrow::after, .popover-qr-red.bs-popover-bottom .arrow::after { border-bottom-color: #FFEEE6 !important; } .app-img-hovered-card > .card-footer { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; text-shadow: 5px 5px 2px #E0E0E0; } .app-img-hovered-card:hover { box-shadow: 0 0 8px 1px rgba(170, 191, 217, 0.95); /*blue*/ } .app-img-hovered-card > img, .app-qr-hovered-card > img { position: absolute; top: -12px; z-index: 4; visibility: hidden; } .app-img-hovered-card:hover > img, .app-qr-hovered-card:hover > img { visibility: visible; } .photoviewer-button, .photoviewer-button:focus { outline: none !important; border: none !important; }