/* BusMgr Portal - Main stylesheet. */ /* Document */ html { font-size: 14px; } @media (min-width: 768px) { html { font-size: 14px; } } body { font-family: Arial, Verdana, Helvetica, Lucida, sans-serif; } @media screen and (max-height: 399px) { #sbm-page-body { min-height: 240px; } } @media screen and (min-height: 400px) { html { height: 100%; } body.sbm-layout-flex { height: 100%; display: flex; flex-direction: column; } body.sbm-layout-flex #sbm-page-body { flex: 1; min-height: 0; overflow-y: auto; } } /* Page layout */ #sbm-page-body { background-color: #f8ffff; } #sbm-page-body main.container { position: relative; padding: 4px 4px; } #sbm-page-body > .container, header > .container, footer > .container { padding: 0 4px; } @media (min-width: 992px) { .container { max-width: 1200px; } } @media (min-width: 768px) { .container { max-width: 1200px; } } @media (min-width: 576px) { .container { max-width: 1200px; } } /* Header */ #sbm-page-header { } .navbar { padding: 6px 2px; } .navbar a.navbar-brand { padding-top: 0.3rem; padding-bottom: 0.1rem; white-space: normal; text-align: center; word-break: break-all; } .navbar li.nav-item a.nav-link { padding-top: 0.3rem; padding-bottom: 0.1rem; } .border-top { border-top: 1px solid #e5e5e5; } .border-bottom { border-bottom: 1px solid #e5e5e5; } .box-shadow { box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05); } button.accept-policy { font-size: 1rem; line-height: inherit; } /* Information */ .sbm-para { margin: 8px 0; } /* Footer */ #sbm-page-footer { padding: 3px 0; } #sbm-page-footer, #sbm-page-footer div { font-size: .8rem; } /* Page caption */ .sbm-page-caption { margin: 0; padding: 16px 24px; font-size: 48px; font-weight: bold; color: #000; } /* Actions */ a, a:hover { text-decoration: underline; color: var(--color-OldGold); } a:focus { outline-color: #b0b0b0; outline-width: thin; } .sbm-action, .sbm-action-text { cursor: pointer; } .sbm-action-text:hover { text-decoration: underline; } .sbm-action-link { display: inline-block; font-size: 1rem; font-weight: bold; color: #000; cursor: pointer; } .sbm-action-link:hover { opacity: .7; transition: all .4s ease-in-out; } .sbm-link-text { font-size: 18px; font-weight: bold; } /* Buttons */ .sbm-button-cta, .sbm-button-action { display: inline-block; padding: 12px 12px; min-width: 100px; color: #404040; background-color: #e0e0e0; font-size: 16px; font-weight: bold; text-align: center; border-radius: 20px; cursor: pointer; transition: all .5s ease-in-out; outline: none; } .sbm-button-action { } .sbm-button-action:hover { background-color: #b0b0b0; } .sbm-button-action:focus { outline: none; box-shadow: 0 0 4px 2px #808080; } .sbm-button-cta:hover { background: #808080 !important; } /* --- Notification --- */ #sbm-notification { display: none; position: absolute; top: 7px; right: 48px; min-width: 180px; z-index: 1000; border: 1px solid #808080; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; overflow: hidden; } #sbm-notification .content { background-color: #fbfbfb; overflow: hidden; } #sbm-notification .heading { font-size: 16px; font-weight: bold; background-color: #f0f0f0; border-bottom: 1px solid #808080; } #sbm-notification .heading:after { content: ""; display: table; clear: both; } #sbm-notification .title { float: left; padding: 4px 8px; white-space: nowrap; } #sbm-notification .close { float: right; padding: 4px; font-size: 14px; font-weight: bold; cursor: pointer; } #sbm-notification .message { clear: both; padding: 8px; font-size: 14px; } /* --- Modal Please wait --- */ #sbm-please-wait { display: none; cursor: progress; position: fixed; z-index: 1001; top: 0; left: 0; height: 100%; width: 100%; background: rgba(250,250,250,.25) url('../img/animated/InProgress-01.gif') 50% 50% no-repeat; } /* Drop down menus */ .dropdown-toggle.caret-off::before, .dropdown-toggle.caret-off::after { display: none !important; } /* Dialogs */ .sbm-dialog { display: none; } .ui-dialog { position: fixed; padding: 0; } .ui-dialog .ui-dialog-titlebar { padding: 6px 12px; } .ui-dialog .ui-dialog-content { padding: 6px 12px; } .ui-dialog.ui-widget.ui-widget-content { border-width: 2px; border-color: var(--color-dialog); -moz-box-shadow: 4px 4px 6px #ccc; -webkit-box-shadow: 4px 4px 6px #ccc; overflow: hidden; } .ui-dialog.ui-widget.ui-widget-content.ui-corner-all { border-radius: 6px; } .ui-dialog.ui-widget .ui-widget-header { font-size: 1.1rem; color: #fff; background-color: var(--color-dialog); border-color: var(--color-dialog); } .ui-widget-content { font-size: 16px; color: #000; } .ui-dialog .ui-dialog-titlebar.ui-corner-all { border-bottom-left-radius: 0; border-bottom-right-radius: 0; } .ui-dialog.no-close .ui-dialog-titlebar-close { display: none; } .sbm-dialog.ui-dialog-content.sbm-flex { display: flex !important; flex-direction: column; } .sbm-dialog.ui-dialog-content.sbm-no-padding { padding: 0; } .ui-dialog .ui-dialog-buttonpane { border-color: var(--color-dialog); margin-top: 0; padding: .25em .5em .25em .5em; } .ui-dialog .ui-dialog-buttonpane button { min-width: 80px; margin: .2em .25em .2em 1em; color: #fff; background-color: var(--color-dialog); border-color: var(--color-dialog); outline: none; } .ui-widget-overlay { background-color: #b0b0b0; opacity: 0.25; } /* Date Picker */ .ui-datepicker { } .ui-datepicker .ui-datepicker-header { background-color: #fff; border: 1px solid var(--color-OldGold); } /* The End */