:root { --orange: #ffab00; } body { background-color: #fff; } .side-navbar { width: 280px; height: 100%; position: fixed; margin-left: -300px; background-color: var(--orange); transition: 0.5s; } .fixed .content-wrapper { margin-top: 0px; } .nav-link:active, .nav-link:focus, .nav-link:hover { background-color: #ffffff26; } .my-container { transition: 0.4s; } .active-nav { margin-left: 0; } /* for main section */ .active-cont { margin-left: 280px; } #menu-btn { background-color: #100901; color: #fff; } .bg-dark { background-color: #000 !important; color: #ffffff !important; } .nav-link { font-size: 16px; font-weight: 600; padding-top: 8px; padding-bottom: 8px; } .side-navbar .flex-column > li > a { border-radius: 50px !important; } .nav-link:hover, .nav-link:focus { background: #000 !important; color: #fff !important; border-radius: 50px !important; } .nav-link:hover .right { color: var(--orange); } .nav-link .right { font-size: 20px; font-weight: 600; padding-top: 0; } .sub-menu ul { padding-left: 6px; } .sub-menu ul li { list-style: none; margin: 10px 0; } .sub-menu ul li a { font-size: 16px; font-weight: 600; color: #000; } .sub-menu ul li a:hover { color: #fff; } .nav li { padding: 0 10px; } .bg-yellow { background: #ffd684; padding-top: 7px !important; padding-bottom: 7px !important; } .title { font-weight: 400; } .form-label { font-size: 15px; font-weight: 600; padding-left: 20px; } .table > thead > tr > td, .table > thead > tr > th { font-size: 15px; font-weight:100 !important; } .text-cover{ /*max-width: 165px; overflow: scroll; text-overflow: clip; white-space: nowrap;*/ width : 300px; overflow:hidden; display:inline-block; text-overflow: ellipsis; white-space: nowrap; } .form-control, .form-select { height: 46px !important; } .theme-primary .btn-primary:hover, .theme-primary .btn-primary:active, .theme-primary .btn-primary:focus, .theme-primary .btn-primary.active{ background-color: var(--orange)!important; border-color:white !important; } .form-control:active, .form-select:active { height: 46px !important; border-color: var(--orange); } input:focus,select:focus{ border-color: var(--orange) !important; } .btn-md { font-size: 1rem; /*padding: 12px 70px;*/ background-color: var(--orange) !important; border-color: var(--orange) !important; } .frow .btn-md{ background:transparent !important; color: var(--orange) !important; border-color: var(--orange) !important; } .frow .btn-md:hover { background-color: var(--orange) !important; border-color:var(--orange) !important; color:white !important; } .btn-md:hover { background-color: var(--orange) !important; border-color:var(--orange) !important; color:white !important; } .table-striped > tbody > tr { --bs-table-accent-bg: #e3d9be !important; color: var(--bs-table-striped-color)!important; } .table-striped > tbody > tr:not(:last-child){ border-bottom: solid 1px #dcdee9; } .table-striped thead, tbody, tfoot, tr, td, th{ border-color: inherit; border-style: unset; border-width: 0; background:#fafbff; } .table > tbody > tr > td, .table > tbody > tr > th { font-size: 15px; } .table > tbody > tr > td { border-bottom-width: 0; padding: 1.5rem; } .table .btn{ border-color: var(--orange) !important; background-color: transparent !important; color:var(--orange) !important; } .ordhistory input,select{ border-radius:0px !important; } .jumbotron { padding: 2rem 1rem; margin-bottom: 2rem; background-color: #f5f7fb; border-radius: .3rem; } .btn-toggle.btn-sm, .btn-toggle.btn-sm > .handle { border-radius: 16px; } .switch-me{ } .gdot { height: 15px; width: 15px; background-color:#27af37; border-radius: 50%; display: inline-block; } .rdot { height: 15px; width: 15px; background-color:red; border-radius: 50%; display: inline-block; } .orange_text { color:var(--orange) !important; text-width:bold; } .add-outlet::before{ background-image:url('../images/icons/plushape.png') } .has-search .form-control-feedback { position: absolute; z-index: 2; display: block; width: 23%; height: 2.375rem; line-height: 3.375rem; text-align: right; pointer-events: none; color: #aaa; } .theme-primary .btn-success:hover, .theme-primary .btn-success:active, .theme-primary .btn-success:focus, .theme-primary .btn-success.active{ background-color: var(--orange) !important; border-color: var(--orange) !important; color: #ffffff !important; } .theme-primary button[aria-pressed='false']{ background-color: gray !important; border-color: black !important; color: black !important; } table { font-family:Open Sans Condensed, sans-serif; } .add-outlet{ width: 30%; padding: 12px; float:right; } .form-control, .form-select{ border-color: #eff1f1; } .form-control{ background-color: #eff1f1; } .form-control::placeholder { color:#898989; } @media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait) { .has-search .form-control-feedback { position: sticky; z-index: 2; display: block; width: 97%; height: 0.375rem; line-height: 4.15rem; text-align: right; pointer-events: none; color: #CECECE; float: left; font-size: 22px; } .add-outlet { width:50%; float:right; } .has-search { width:35%; } .fixed .content-wrapper { margin-top:90px; } .text-cover{ width : 200px; overflow:hidden; display:inline-block; text-overflow: ellipsis; white-space: nowrap; } } @media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) { .has-search .form-control-feedback { position: sticky; z-index: 2; display: block; width: 97%; height: 0.375rem; line-height: 4.15rem; text-align: right; pointer-events: none; color:#CECECE; float: left; font-size: 22px; } .add-outlet { width:40%; float:right; } .has-search { width:35%; } .text-cover{ width : 200px; overflow:hidden; display:inline-block; text-overflow: ellipsis; white-space: nowrap; } .fixed .content-wrapper { margin-top:90px; } } @media (min-width: 992px) { /* .none-d { display: none; } */ .m-logo { display: none; } } @media (max-width: 991px) { .active-nav { margin-left: 0; } /* for main section */ .active-cont { margin-left: 280px; } .nav li { padding: initial; } .top-navbar { background: #000; position: absolute; right: 0; left: 0; width: 100%; top: 0px; height: 66px; } #menu-btn { position: absolute; right: 10px; } .m-logo { padding-left: 10px; } .mpt-50 { padding-top: 70px; } } @media (max-width: 767px) { .btn-md { width: 100%; } .add-outlet{ width: 50%; padding: 12px; float:left; } .has-search .form-control-feedback { position: absolute; z-index: 2; display: block; width: 176px; height: 2.375rem; line-height: 3.375rem; text-align: right; pointer-events: none; color: #cdcdcd; } .fixed .content-wrapper { margin-top:55px; } .text-cover{ width :200px; overflow:hidden; display:inline-block; text-overflow: ellipsis; white-space: nowrap; } }