@charset "UTF-8";
/* Web Solutions 4.0 Compatible */

:root {
	--ws-grid: minmax(.5em,1fr) [wrap-start] repeat(2,minmax(0,var(--ws-column-width))) [wrap-end] minmax(.5em,1fr);
	--gutter: 1rem;
}

.desktopOnly {display: none !important}

body {
	background: #FFF;
}

body.slideNav {
	overflow: hidden;
}

/* HEADINGS ------------------------------ */
main h1 {
	font-size: 1.5em;
}

main h2 {
	font-size: 1.45em
}

main h3 {
	font-size: 1.3em
}

main h4, th {
	font-size: 1.2em
}

main h5 {
	font-size: 1.1em
}

main h6 {
	font-size: 1.0em
}

main .intro {
	font-size: 1.25em;
}

/* HEADER ------------------------------ */
body header {
  background: #FFF;
  display: contents;
  position: relative;
  z-index: 1;
}

body header .header-top #brand {
	display: block;
	margin: 0;
	padding: 1em 0;
}

body header .header-top #brand img{
	display: block;
	max-width: 100%;
	height: auto;
	margin:0 auto 0.25rem;
}

body header .header-top #brand .tool-name {
	font-size: 1rem; 
	margin: 0;
}

body header nav > ul {
	display: flex;
}

body header nav > ul > li {
	flex: 1 1 auto;
}
body header nav > ul > li > a:not(.button) {
	display: block;
	font-size: 0.875em;
	padding: 0;
	text-align: center;
}



/* MOBILE NAV ------------------------------ */
#mobilenav {
  align-items: center;
  background-color: var(--dark-purple);
  display: flex;
  justify-content: center;
  position: sticky;
  text-align: center;
  top: 0;
  width: 100%;
  z-index: 1;
}

#mobilenav :is(a, span) {
  color: #FFF;
  flex: 1 1 auto;
  line-height: 2.25;
}

#mobilenav a {
	border-right: 1px solid #888;
}

#mobilenav span svg {
	fill: #FFF;
	pointer-events: none;
	position: relative;
	top: .25em;
	width: 1em;
	margin-left:0.25em;
}

#google_translate_element .goog-te-gadget-simple {
	padding: 0.5em;
}

#google_translate_element .goog-te-gadget-simple > span::before {
	height: 1.5em;
	width: 1.5em;
}


/* MAIN ------------------------------ */
main {
	padding-bottom:3em;
}

.twoCol, .threeCol, .resCol {
	columns: auto;
  column-rule: 1px outset rgba(0,0,0,.15);
	column-width: 13em;
}

.content ul li {
	padding-left: 1.5em;
}

:is(.formTable, .simpleTable), :is(.formTable, .simpleTable) table {
  display: block;
	width: 100%;
}

:is(.formTable, .simpleTable) tbody {
	display: block;
}

:is(.formTable, .simpleTable) tr {
	display: block;
}

:is(.formTable, .simpleTable) td {
	display: block;
	padding: 0;
  	width: 100%;
}

#login td.text, #formTable td.text {
	padding: 0;
  text-align: left;
}

:is(.formTable, .simpleTable) :is([type="text"], [type="password"], [type="tel"], [type="number"], [type="email"], [type="url"], textarea, select) {
	margin-bottom: 1em
}

:is(.formTable, .simpleTable) table td + td {
	padding-left: 0 !important;
}

.photoright {
	margin: 0 0 .75em 1em;
}

.photoleft {
	margin: 0 1em .75em 0;
}

.white-box {
	padding:1em;
	width:100%;
}

.white-box > table td {
	padding:0.5em 1em;
}
.white-box > table td + td{
	padding-top:0;
}
.white-box > table td td{
	padding-left: 0;
	padding-right: 0;
}

main .dashboardList li {
    margin: 0;
    padding: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-start;	
	gap:0.3125rem;
}

main .dashboardList li + li {
    margin-top: 1em;
    padding-top: 1em;
}

.white-box + .dashboardOptions {
    margin-top:-2em;
}
.dashboardOptions a {
    display: block;
    display: block;
    padding: 0.25em 0;
    width:100%;
}

.requisitionDesc {
	margin: 1em 0;
}

.sigPad {width:100% !important; overflow: auto;}

/* Flex */
.flex {display: flex;flex-wrap:wrap}
.flex.space-between {justify-content: space-between;}
/* Gap */
.gap-4 {gap:4px}
.gap-8 {gap:8px}
.gap-10 {gap:10px}
.gap-14 {gap:14px}
.gap-2em {gap:2em}


.flex.mobile-column {
	flex-direction: column;
}
.flex.mobile-column-reverse {
	flex-direction: column-reverse;
}

div.tab {
	width: 100%;
	overflow: auto;
}

main a + ul.tabs {
	clear:both;
	margin-top:1em;
	float: left;
}

main ul.tabs {
	clear: both;
	white-space: nowrap;
	overflow: auto;
}

main ul.tabs li a {
	font-size: 0.75rem;
	line-height: 2.5rem;
}

table.listTable th {white-space: nowrap;}

.manageLinks {
	text-align: left;
	margin:1em 0;
	padding-top:0 !important
}

.manageLinks a {
	display: flex;
	gap:5px;
	width: 100%;
	margin:0;
}

.mobileMarginBottom {
	margin-bottom: 1em;
}

.repeater {
	margin-bottom: 1em;
}

.repeater label {
	width: 100%;
}

main :is(.overflowTable, div.tab) {
	width: calc(100% + (var(--gutter) * 2));
	margin-left: calc(var(--gutter) * -1);
	margin-right: calc(var(--gutter) * -1);
	overflow: auto;
	padding: 0;
	background: #fff;
}

main :is(.overflowTable, div.tab) > table th {
	position: sticky;
	top:0;
}

main :is(.overflowTable, div.tab) > table th:first-child,
main :is(.overflowTable, div.tab) > table td:first-child {
	padding-left: var(--gutter);
}

main :is(.overflowTable, div.tab) > table td:first-child td{
	padding-left: 0;
}

main :is(.overflowTable, div.tab) > table th:last-child,
main :is(.overflowTable, div.tab) > table td:last-child {
	padding-right: var(--gutter);
}

main :is(.overflowTable, div.tab) > table td:last-child td{
	padding-right: 0;
}

main :is(.overflowTable, div.tab) > .listTable td:first-child {
	min-width: 200px
}

label {display: block; width:100%; padding: 0 !important}

/* LOGIN PAGE ------------------------------ */
#loginPage {background:#F3F5F8}
main .loginTable .formTable td {text-align: left !important;}



/* FOOTER ------------------------------ */
body>footer {
	padding: 0.75em 1em;
	text-align: center;
}

body>footer a {
	display: inline-block;
	line-height: 1.6875rem;
	text-decoration: underline;
}

body>footer nav {
	display: block;
}

body>footer nav span:only-of-type {
	display: none;
}