html, body {
min-width: 320px;
/* !important: Blazored.Modal v7.2.0 (BlazoredModal.razor.js removeBodyStyle) stamps an inline
`overflow: auto` on when a modal closes, because it reads the pre-modal *inline* overflow
(empty here, since we set it via this stylesheet) and falls back to `|| 'auto'`. That inline style
would otherwise override this rule and make the whole window scroll. The shell is designed so only
#divSWPageContent scrolls, so forcing hidden is safe. */
overflow: hidden !important;
height: 100%;
/* font-family: 'Segoe UI', 'Lucida Grande','Ubuntu','sans-serif';
font-fa/mily: 'Helvetica'; */
}
body {
}
:root {
--bg-dark: #001225;
--divSWLeftScrollOffsetMobile: 196px; /* +12 for spacing */
--divSWQueueScrollOffsetMobile: 126px; /* same as --divSWQueueScrollOffsetDesktop */
--divSWApplicationsOffsetMobile: 147px; /* same as --divSWApplicationsOffsetDesktop1 */
--divSWLeftScrollOffsetDesktop: 194px;
--divSWQueueScrollOffsetDesktop: 181px; /*164px;*/ /*126px;*/
--divSWApplicationsOffsetDesktop: 164px; /*126px;*/
--divSWApplicationsOffsetDesktop1: 140px; /* one line application header */
--divSWApplicationsOffsetDesktop2: 164px; /* two line application header */
}
input[type="search"]::-webkit-search-cancel-button {
display: none
}
input:placeholder-shown + button {
opacity: 0;
pointer-events: none;
}
button.filter-reset {
position: absolute;
border: none;
display: block;
width: 15px;
height: 15px;
line-height: 16px;
font-size: 12px;
border-radius: 50%;
top: 14px; /*0;*/
bottom: 0;
right: 57px; /*5px;*/
margin: auto;
background: #ddd;
padding: 0;
outline: none;
cursor: pointer;
transition: .1s;
}
.assistive-text {
height: 1px;
width: 1px;
position: absolute;
overflow: hidden;
top: -10px;
}
.btnPadding {
padding-right: 3px;
}
.input-group-append-end > .btn-sm {
border-top-right-radius: 0.2rem !important;
border-bottom-right-radius: 0.2rem !important;
}
.SWHide {
display: none;
}
.ui-layout-pane-center {
width: auto !important;
/* Clip horizontal overflow here (the pane already scrolls vertically, so this adds no new
scrollbar) so a full-width child that overshoots by the vertical-scrollbar gutter — e.g. an
inside a Bootstrap .row — can't trigger a spurious horizontal scrollbar.
!important overrides jQuery Layout's inline `overflow:auto` on the x-axis only; overflow-y
stays auto for the detail's vertical scroll. */
overflow-x: hidden !important;
}
/* Tooltip */
.SWsidemenuicon {
/* padding: 3px 6px; */
font-size: 20px;
line-height: 20px;
}
/* Clearable text inputs */
.clearable{
position: relative;
display: inline-block;
}
.clearable input[type=text]{
padding-right: 24px;
width: 100%;
box-sizing: border-box;
}
.clearable__clear{
display: none;
position: absolute;
right:0; top:0;
padding: 0 8px;
font-style: normal;
font-size: 1.2em;
user-select: none;
cursor: pointer;
}
.clearable input::-ms-clear { /* Remove IE default X */
display: none;
}
/* Mobile Screen Sizes */
.SWDesktop {
display: none;
}
/* Fix layout from site.css */
.navbar-expand-lg .navbar-nav .dropdown-menu {
position: absolute;
}
nav.navbar-expand-lg {
justify-content: space-between;
}
/* New Cobalt Start */
.ui-layout-west-noleftborder {
border-left: 0;
}
.divSWMainContentHeader{
margin-left: 5px;
/*margin-bottom: 5px;*/
}
.SWHeaderLogo {
font-size: 1.5rem;
color: #fff;
text-decoration: none;
}
.divSWMainWrapper {
display: flex;
flex-flow: row nowrap;
position: relative;
}
.divSWLeftContent {
position: relative;
transition: all 0.15s linear;
height: 100%;
padding-top: 5px;
left: 0%;
}
.closedSWLeftContent {
margin-left: -100%;
/*left: -100%;*/
/*background-color: #e1e1e1;*/
background-color: #fff;
transition: margin-left 0.15s linear;
}
.openSWLeftContent {
margin-left: 0px;
/*left: -100%;*/
transition: margin-left 0.15s linear;
}
.backcover {
position: absolute;
z-index: 50;
width: 100vw;
height: 100vh;
display: none;
}
.divSWRightMainMenu {
border: 0;
position: absolute;
z-index: 100;
/*top: 64px;*/
top: 2px;
right: 0px;
transition: all 0.15s linear;
}
.divSWRightMainMenuBtn {
border: 0;
position: absolute;
z-index: 100;
/*top: 84px;*/
top: 9px;
right: 259px;
transition: all 0.15s linear;
}
.divSWRightContent {
background-color: #e1e1e1;
height: calc(100vh - 64px);
}
.closedSWRightContent {
/* margin-right: -100%; */
right: -259px;
}
.closedSWRightMenuBtn {
/* margin-right: -100%; */
right: 0px;
}
.divSWLeftSearch {
padding: 0 7px;
padding-right: 48px;
}
#idSWLeftMenuBtn {
display: none;
text-decoration: none;
}
.SWMenuClosedIcon {
float: right;
width: 30px;
text-align: center;
margin-right: 4px;
display: none;
}
.SWMenuOpen i {
font-size: 20px;
width: 20px;
}
.SWMenuOpen i {
width: 30px;
text-align: center;
}
.SWMenuClosedIconHide {
display: none;
}
.divSWSearchUnderline {
background-color: #aaa;
height: 1px;
width: 100%;
margin: 4px 0;
}
.divSWLeftScroll {
height: calc(100vh - var(--divSWLeftScrollOffsetMobile));
/* heig/ht: calc(100vh - 283px); */
width: 100vw;
min-width: 320px;
over/flow-x: hidden;
over/flow-y: auto;
}
.divSWLeftScroll ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.divSWLeftScroll ul li {
font-size: 0.9rem;
/*padding: 5px 0px 5px 20px;*/
cursor: pointer;
}
.divSWLeftScroll ul li a, .divSWLeftScroll ul li a:hover, .divSWLeftScroll ul li a:visited {
color: inherit;
text-decoration: none;
}
.divSWLeftScroll ul li:hover {
background: #eee;
}
.divSWLeftScrollTitle div {
font-weight: 600;
font-size: 0.9rem;
border-bottom-color: #ccc;
border-bottom-style: solid;
border-bottom-width: 1px;
margin: 5px 0px 5px 20px;
padding-top: 7px;
width: 76%;
}
.divSWLeftScrollFooter {
color:rgba(255, 255, 255, 1);
text-align: center;
/*background-color: var(--bg-dark); **Now using DB styles ** */
}
.divSWLeftScrollFooter a, .divSWLeftScrollFooter a:hover, .divSWLeftScrollFooter a:visited {
/*color:rgba(255, 255, 255, 0.5);*/
color: var(--staff-dark-text);
font-size: 0.9rem;
}
/* .divSWLeftScrollFooterOpen / .divSWLeftScrollFooterClosed had rules here reading "di/splay: block"
and "dis/play: none" - a stray slash in the property name, so neither ever applied.
Deleted rather than corrected, deliberately. Showing and hiding these two blocks is done by the
separate .SWHide class (line 76), which site-mod.js adds and removes as the left menu opens and
collapses. Repairing the spelling would have made .divSWLeftScrollFooterClosed{display:none} live;
it sits in this same file at the same specificity as .SWHide, so removing SWHide would no longer
reveal anything and the collapsed-menu footer could never appear again.
The two class names are still used as jQuery selectors in site-mod.js, so do not remove them from
the markup - they just carry no styling of their own. */
.breadcrumbMobileUnderline {
width: 100vw;
background-color: #bbb;
height: 1px;
margin-bottom: 3px;
}
.breadcrumbDesktopUnderline {
display: none;
}
#idSWMainContentWrapper {
padding: 0;
border: 0;
}
.divSWMainContent {
/* border-left: 2px solid #e1e1e1; */
}
.divSWTitle {
margin-top: -5px;
}
#idSWLeftMainMenu {
padding: 0;
border-top: 0;
}
#divSWPageContentQueue {
border-top: 0;
}
.divSWQueue {
width: 100vw;
min-width: 320px;
transition: all 0.15s linear;
padding: 0 7px;
}
.divSWQueueHide {
display: none;
}
.divSWQueue.closedSWQueue {
margin-left: -50%;
}
.divSWQueueScroll {
height: calc(100vh - var(--divSWQueueScrollOffsetMobile));
overflow-y: auto;
overflow-x: hidden;
}
#divSWPageContent {
overflow-y: auto;
overflow-x: hidden;
height: calc(100vh - var(--divSWApplicationsOffsetMobile)); /*147px;*/
width: 100%;
padding: 0;
border-top: 0;
}
.divSWApplications {
display: flex;
flex-flow: row nowrap;
}
.applicationDetails {
position: relative;
transition: all 0.15s linear;
width: 100vw;
min-width: 320px;
padding: 3px 7px;
}
.divSWApplicationDetailsScroll {
height: calc(100vh - var(--divSWApplicationsOffsetMobile));
/* height: calc(100vh - 237px); */
}
.divSWApplicationDetail {
/*width: calc(100vw - 488px);*/
width: 100%;
max-width: 100vw;
}
.noSWLeftContent {
/* width: calc(100vw - 277px); */
width: 100vw;
}
.noSWQueue {
width: 100%;
}
/* New Cobalt End */
.themeLogo {
text-align: center;
}
.SWNav {
order: 1;
}
.MenuNav {
order: 0;
}
.LoginNav {
order: 20;
}
.FullMenuNav {
order: 30;
}
.SearchNav {
order: 18;
}
.navbar-brand {
margin-right: 0;
}
.siteMain {
height: calc(100vh - 334px);
}
.desktopSearch {
display: none;
}
.mobileSearch {
display: block;
}
.footerCard {
background-color: #22638E;
border: none;
}
.footerOffices {
display: flex;
flex-flow: row wrap;
justify-content: space-around;
width: 100%;
}
.footerOfficeInfoWebsite2 {
order: 1;
}
.companyFooter {
display: flex;
flex-flow: row wrap;
justify-content: center;
}
.companyFooter div {
width: 100%;
text-align: center;
padding: 5px 0;
}
.siteInfoFooter {
display: block;
}
.row {
margin-right: 0px;
margin-left: 0px;
}
.mainbox {
display: inline-block;
}
.mainboxcontainer {
white-space: nowrap;
}
#layoutSidenav_content {
overflow-x: hidden;
}
.divSWBackToQueue {
display: block;
}
.form-inline .input-group {
width: 100%;
}
#idSWRightMenu {
padding: 3px 7px;
font-size: 30px;
line-height: 20px;
cursor: pointer;
background: transparent;
border: 0;
outline: none;
}
.reminder-active-num {
position: absolute;
top: -1px;
left: 0px;
border-radius: 16%;
width: 30px;
height: 24px;
background: #fff;
border: 2px solid green;
color: green;
text-align: center;
font-size: 14px;
font-weight: bold;
}
/* Mobile Landscape Screen Sizes */
@media only screen and (min-width: 480px) {
.themeLogo {
text-align: left;
}
.siteMain {
height: calc(100vh - 320px);
}
.companyFooter {
justify-content: space-between;
}
.companyFooter div {
width: auto;
text-align: left;
}
}
@media only screen and (min-width: 576px) {
}
/* Mobile Landscape Screen Sizes */
@media only screen and (min-width: 600px) {
.footerCard {
width: normal;
}
.footerOfficeInfoWrapper2 {
display: flex;
flex-flow: row wrap;
}
.footerOfficeInfoWrapper2 div {
width: 50%;
}
.footerOfficeInfoWebsite2 {
order: 15;
}
}
/* Desktop screen Sizes */
@media only screen and (min-width: 768px) {
.navbar-expand-lg .navbar-toggler {
display: none;
}
.SWDesktop {
display: block;
}
.SWMobile {
display: none;
}
.desktopSearch {
display: block;
}
.mobileSearch {
display: none !important;
}
.form-inline .input-group {
width: auto;
}
.SWMenuClosedIcon {
display: block;
}
.SWMenuClosedIconHide {
display: none;
}
.divSWLeftMainMenuContent {
width: 237px;
min-width: unset;
padding: 0;
padding-top: 5px;
}
.SWSeparator {
width: 4px;
margin-right: 2px;
border-right: 1px #bbb solid;
background: #ddd;
border-width: 0;
height: 100vh;
}
.closedSWLeftContent {
/* margin-left: -212px; */
margin-left: -199px;
background-color: #e1e1e1;
left: 0px;
}
.divSWLeftSearch {
padding: 0;
margin-left: 3px;
}
.divSWSearchUnderline {
width:84%;
}
#idSWLeftMenuBtn {
display: block;
padding: 3px 7px;
font-size: 30px;
line-height: 20px;
cursor: pointer;
background: transparent;
border: 0;
outline: none;
}
.breadcrumbMobileUnderline {
display: none;
}
.breadcrumbDesktopUnderline {
width: 100%;
background-color: #ddd;
height: 1px;
display: block;
}
.divSWQueue {
/* width: 250px; for non ui-layout */
width: 100%; /* for ui-layout */
min-width: unset;
padding: 0;
}
.divSWQueueHide {
display: block;
}
.divSWApplicationDetail {
/*width: calc(100vw - 494px); calc(100vw - (.divSWLeftMainMenuContent width + .divSWQueue width + separator width)) */
width: 100%;
}
.noSWLeftContent {
/*width: calc(100vw - 287px); calc(100vw - (.divSWQueue width + 37)) */
width: 100%;
}
.divSWLeftScroll {
height: calc(100vh - var(--divSWLeftScrollOffsetDesktop));
/* height: calc(100vh - 222px); */
width: 237px;
min-width: unset;
}
.divSWQueueScroll {
height: calc(100vh - var(--divSWQueueScrollOffsetDesktop));
}
.divSWApplicationDetailsScroll {
height: calc(100vh - var(--divSWApplicationsOffsetDesktop2));
/* border: 1px solid red; */
}
.applicationDetails {
padding-left: 7px;
/*padding-right: 2px;*/
}
.divSWBackToQueue {
display: none;
}
.divSWQueue.closedSWQueue {
margin-left: 0;
}
}
/* Desktop screen Sizes */
@media only screen and (min-width: 897px) {
.divSWApplicationDetailsScroll {
height: calc(100vh - var(--divSWApplicationsOffsetDesktop));
}
}
/* Desktop screen Sizes */
@media only screen and (min-width: 900px) {
}
@media only screen and (min-width: 992px) {
.SWNav {
order: 0;
}
.MenuNav {
order: 1;
}
.LoginNav {
order: 40;
}
}
/* Desktop screen Sizes */
@media only screen and (min-width: 1107px) {
}
/* Desktop screen Sizes */
@media only screen and (min-width: 1024px) {
}
/* Desktop screen Sizes */
@media only screen and (min-width: 1056px) {
.navbar-brand {
margin-right: 1rem;
}
}
/* Desktop screen Sizes */
@media only screen and (min-width: 1190px) {
}
/* Desktop screen Sizes */
@media only screen and (min-width: 1200px) {
}