/* CSS Document */

@font-face {
    font-family: "PublicSans";
    src: url(/stylesheets/PublicSans-VariableFont_wght.ttf);
}
@font-face {
    font-family: "PublicSansItalic";
    src: url(/stylesheets/PublicSans-Italic-VariableFont_wght.ttf);
}


body {
	margin: 0;
	padding: 0;
	font-family: "PublicSans";
	font-size: small;
}

/***BASIC ELEMENTS***/

strong, em, cite { font-family: "PublicSans"; }

th, td { padding: 5px; }

a img { border: none; }

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
}

body.subpage div#content p, li { line-height: 1.4em; }

body.subpage div#content a { color: #004c98; }
body.subpage div#content a:visited { color: #6F78B3; }
body.subpage div#content a:hover { text-decoration: none; }

body.subpage div#content a[href^=http], a.external {
	background: url(/images/external.gif) no-repeat 100% 50%;
	padding-right: 11px;
}

body.subpage div#content a[href^=mailto], a.email {
	background: url(/images/email.gif) no-repeat 100% 50%;
	padding-right: 19px;
}

div#content h1, div#content h2, div#content h3, div#content h4, div#content h5, div#content h6 {
	font-family: "PublicSans";
	margin: 0;
	padding: .7em 0 0 0;
}

div#content h1 { font-size: 170%; }
div#content h2 { font-size: 150%; }
div#content h3 { font-size: 130%; }
div#content h4 { font-size: 110%; }
div#content h5 { font-size: 100%; }
div#content h6 { font-size: 90%; }

body#customers div#content h1, body#customers div#content h2, body#customers div#content h3, body#customers div#content h4, body#customers div#content h5, body#customers div#content h6 {
	color: #BA5115;
}

body#providers div#content h1, body#providers div#content h2, body#providers div#content h3, body#providers div#content h4, body#providers div#content h5, body#providers div#content h6 {
	color: #B6911F;
}

body#general div#content h1, body#general div#content h2, body#general div#content h3, body#general div#content h4, body#general div#content h5, body#general div#content h6 {
	color: #004c98;
}

/*** LAYOUT ***/
div#container {
	margin: 0 auto;
	width: 750px;
	font-size: 13px;
	font-family: "PublicSans";
	position: relative;
	border: 2px solid #004c98;
}


/*** HEADER ***/
div#header {
	display: inline-block;
}
div#headerLogo	{
	position: absolute;
	top: 10px;
	left: 0px;
	z-index: 72;
}
div#headerABS h1 a {
	text-indent: -9000px;
	overflow: hidden;
	display: block;
	background: url(/logos/logo_corner/ABS_corner.jpg) no-repeat top left;
	width: 180px;
	height: 144px;
	position: absolute;
	top: 15px;
	left: 20px;
	z-index: 72;
}

/*** BRANDING AREA ***/
div#branding, div#brandingABS {
	position: absolute;
	top: 120px;
	left: 5px;
	z-index: 71;
}

div#branding h2, div#brandingABS h2 {
	font-family: "PublicSans";
	text-transform: uppercase;
	font-weight: bold;
	color: #fff;
}


/*** LEFT NAV ***/
div#leftNav	{
	display: inline-block;
	height: auto;
	width: 190px;
	margin: 0px;
	padding: 0px 0px 15px 0px;
	vertical-align: top;
}
ul#ulNav {
	list-style: none;
	margin: 0px ;
	padding: 0px;
	font-size: 100%;
}
ul#ulNav li {
	margin: 0px 20px 0px 0px;
	padding: 0px;
}
ul#ulNav li a {
	display: block;
	background: #004c98;
	color: #fff;
	text-transform: uppercase;
	padding: 4px 10px;
	text-decoration: none;
	border-bottom: 1px solid;
	border-bottom-color: #fff;
}
ul#ulNav li.on a { background: #0087fc; }
ul#ulNav li a:hover { background: #6dceee; }


/*** MAIN CONTENT ***/
div#content {
	display: inline-block;
	position: relative;
	margin: 0px auto;
	padding: 16px 5px;
	height: auto;
	width: 530px;
	vertical-align: top;
	font-size: 100%;
}



/*** JOBS COMPLETE (and left icon) ***/
div#jobsComplete {
	display: flex;
	gap: 0px 60px;
	align-items: end;
	margin: 0px;
	font-family: "PublicSans";
}
div#jobsComplete div.leftIcon {
	vertical-align: bottom;
	margin: 0px;
	padding: 0px;
}
div#jobsComplete div.jobsParent {
	vertical-align: bottom;
	margin: 14px 0px 14px 0px;
	padding: 0px;
	font-weight: bold;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
div#jobsComplete div.jobsParent div.jobsHeader {
	border-bottom: 4px solid #004c98;
	margin: 0px 0px 6px 0px;
	width: 100%;
	color: #000;
}
div#jobsComplete div.jobsParent div.jobsChild {
	color: #004c98;
	padding-right:30px;
}
div#jobsComplete h1 { font-size: 220%; margin: 0px; }
div#jobsComplete h2 { font-size: 170%; margin: 0px; color: #000; }
div#jobsComplete h3 { font-size: 110%; margin: 0px; color: #000; }





/*** FOOTER ***/
div#footerContact {
	display: block;
	margin: 0px;
	padding: 15px 25px;
	background: #0087dc;
	border-top: 12px solid #004c98;
	font-size: 95%;
	color: #fff
}
div#footerContact a, a:visited {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
}
div#footerContact a:hover { text-decoration: underline; }


div#footer {
	display: flex;
	justify-content: space-between;
	margin: 0px;
	padding: 0px 25px;
	height: auto;
	background: #fff;
	border-top: 2px solid #004c98;
	font-size: 95%;
	color: #000;
}

div#footer p#copyright {
	margin: 1em 0px;
}
div#footer p#systemstatus {
	vertical-align: bottom;
}

div#footer p a {
	color: #004c98;
	text-decoration: none;
}
div#footer p a:hover { text-decoration: underline; }





/*** FORMS ***/
ol.forms {
	list-style: none;
	margin: 0;
	padding: 0;
	float: left;
	width: 470px;
}

ol.forms li {
	float: left;
	padding: 3px 0;
	width: 100%;
}

ol.forms li label {
	display: block;
	float: left;
	font-weight: bold;
	font-family: "PublicSans";
	width: 11em;
	padding: 3px 0;
}

ol.forms li label.inline {
	display: inline;
	float: none;
	font-weight: bold;
	font-family: "PublicSans";
	width: auto;
	padding: 3px 0;
}

ol.forms li p {
	margin: 0;
	padding: 0;
	line-height: normal;
	float: left;
}

ol.forms input, ol.forms textarea { 
	width: 20em; 
	font-size: 120%;
	font-family: "PublicSans";
}

ol.forms input.inline { width: auto; }

ol.forms textarea { height: 12em; }

ol.forms input.small { width: 5em; }

ol.forms input.medium { width: 10em; }

ol.forms button {
	background: #004c98;
	border: none;
	color: #fff;
	padding: 3px 9px;
	margin-right: 10px;
	font-weight: bold;
	cursor: pointer;
}

ol.forms button:hover {
	background: #0087dc;
}

.required { color: #FF0000; }

.error {
	display: block;
	color: #FF0000;
	font-weight: bold;
	font-family: "PublicSans";
	background: url(/images/error.gif) no-repeat 0 50%;
	height: auto;
	padding-left: 22px;
}



/***Two factor authentication***/
ol.forms.twofa li label {
	width: 15em;
	text-align: right;
	margin-right: 15px;
}

ol.forms.twofa input, ol.forms.twofa textarea { 
	width: 10em;
}

ol.forms.twofa .center {
	text-align: center;
}