/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ GENERAL ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.container { 	background-color: #ffffff; }
.bodycontainer { 	padding-left: 10%;	padding-right: 10%; }
@media screen and (max-width: 500px) {
.bodycontainer {	padding-left: 5%;	padding-right: 5%; }
}
body {
	color: #303437;
	font-family: 'arimo-font', Arial, Helvetica, sans-serif;
	background-color: #f3f3f4;
	margin: 0 auto;
	width: 80%;
	max-width: 1400px;
	line-height: 1.3;
	font-size: 16px;
}
@media screen and (max-width: 1200px) {
body {	width: 90%; }
}
@media screen and (max-width: 500px) {
body {	width: 100%; }
}
.hidden {	display: none;}
.invisible {	visibility: hidden;}
.visuallyhidden {
	border: 0 none;
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}
img, embed, object, video {	max-width: 100%;}
/*~~~~~ SPACING ~~~~~*/
ul.spacedList > li {	margin-bottom: 0.8em;	margin-top: 0.8em;}
ol.spacedList > li {	margin-bottom: 0.8em;	margin-top: 0.8em;}

.current-posititons, .portal, .viewing-files, .error-page {	padding-top: 20px;	padding-bottom: 50px;}

.p-0 {	padding: 0em;}.p-1 { padding: 1em;}.p-2 { padding: 2em;}.p-3 { padding: 3em;}
.pl-0 {	padding-left: 0em;}.pl-1 { padding-left: 1em;}.pl-2 { padding-left: 2em;}.pl-3 { padding-left: 3em;}
.m-0 {	margin: 0em;}.m-1 { margin: 1em;}.m-2 { margin: 2em;}.m-3 { margin: 3em;}
.mt-0 {	margin-top: 0em;}.mt-1 { margin-top: 1em;}.mt-2 { margin-top: 2em;}.mt-3 { margin-top: 3em;}
.ml-0 {	margin-left: 0em;}.ml-1 { margin-left: 1em;}.ml-2 { margin-left: 2em;}.ml-3 { margin-left: 3em;}
.mr-0 {	margin-right: 0em;}.mr-1 { margin-right: 1em;}.mr-2 { margin-right: 2em;}.mr-3 { margin-right: 3em;}
/*~~~~~ SKIPNAV ~~~~~*/
#skip a, #skip a:hover, #skip a:visited {
	position: absolute;
	left: 0px;
	top: -500px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
#skip a:active, #skip a:focus {
	position: static;
	display: block;
	width: auto;
	height: auto;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ FONTS AND HEADINGS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
@font-face {	font-family: 'arimo-font';	src: url(fonts/Arimo-Regular.ttf);}
@font-face {	font-family: 'archivo-font';	src: url(fonts/ArchivoBlack-Regular.ttf);}
a {	color: #344559;}
a:visited {	color: #24688d;	text-decoration: none;}
h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	font-weight: bold;
	color: #344559;
	font-family: 'archivo-font', sans-serif; 
	word-break: break-word;
}
.h1, .h2, .h3, .h4, .h5, .h6 { margin: 15px 0; }
h2, .h2 {	font-size: 2.1em;}
h3, .h3 {	font-size: 1.5em;}
h4, .h4 {	font-size: 1.2em;}
h4.office {	clear: both;}
.small {	font-size: .75em;}
@media screen and (max-width: 950px) {
h2 {	margin-bottom: 1em;}
}
@media screen and (max-width: 655px) {
h2 {	margin-bottom: 1em;}
}
@media screen and (max-width: 375px) {
h2 {	font-size: 1.5em;}
h3 {	font-size: 1.3em;}
h4 {	font-size: 1.1em;}
h2, h3, h4 {	margin: .5em 0;}
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ERRORS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.error {
	position: relative;
	background: #E4B7B2;
	padding: .1em 1%;
	border-radius: 3px;
	text-align: left;
	display: block;
	width: 97%;
	zoom: 1;
}
div.error:after {
	position: absolute;
	display: block;
	content: '';
	border: 10px solid transparent;
	border-top-color: #E4B7B2;
	top: 100%;
	left: 5%;
}
fieldset .error {	margin-bottom: 15px;}
.resume-attach .error {	margin-top: 15px;}
.other-tab.error:after {	border: none;}
.other-tab.error {	padding: 1em 2%;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ALERTS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.alert {
    padding: 15px;
	margin-top: 20px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}
.alert-primary {
    color: #004085;
    background-color: #cce5ff;
    border-color: #b8daff;
}
.alert-warning {
    color: #856404;
    background-color: #fff3cd;
    border-color: #ffeeba;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ COLUMNS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.columns {	-webkit-columns: 4 170px;	-moz-columns: 4 170px;	columns: 4 170px;}
div.columns ul {	margin: 0;}
div.columns li {	-webkit-column-break-inside: avoid;	page-break-inside: avoid;	break-inside: avoid;}
@media screen and (max-width: 775px) {
div.columns {	-webkit-column-count: 2;	-moz-column-count: 2;	column-count: 2;}
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ BUTTONS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.btn {
    text-align: center;
    text-decoration: none;
    padding: 7px;
    display: inline-block;
    margin-bottom: 0.5em;
    font-weight: bold;
    cursor: pointer;
    border: none;
    font-size: 1em;
}
.btn.btn-inline {  display: inline-block; margin-right: 1em; }
.btn.btn-fullwidth {  display: block;  width: 100%;}
.btn.btn-lg {  font-size: 2.5em;  margin-bottom: .2em;}
@media screen and (max-width: 500px) {
.btn.btn-lg {  font-size: 1.5em;  margin-bottom: .2em;}
}
.btn:hover {    box-shadow: 0px 0px 15px #627388;}
/*~~~~~ YELLOW BUTTON ~~~~~*/
.btn.btn-yellow {  color: #344559;  background-color: #ffcc00;}
.btn.btn-yellow:hover {    background-color: #e8b900;}
/*~~~~~ BLUE BUTTON ~~~~~*/
.btn.btn-blue {	background-color: #344559;	color: #ffffff;}
.btn.btn-lg.btn-blue {
	border-bottom: 10px solid #293646;
	padding-top: .2em;
	padding-bottom: .2em;
	font-family: 'archivo-font', sans-serif;
	width: 100%;
	width: calc(100% - 14px);
}
.btn.btn-blue:hover {	background-color: #2A3B4F;}
/*~~~~~ RETURN TO TOP ~~~~~*/
.top {
	text-align: right;
	font-size: .8em;
}
.top a {
	color: #ffffff;
	background: #333739;
	padding: 10px;
	text-decoration: none;
}
.top a:hover, .top a:focus {
	box-shadow: 0px 0px 15px #627388;
	padding: 10px;
	text-decoration: none;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ MODAL WINDOWS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.modalOverlay {	
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	background: url("../images/opac-bg.png");
	width: 100%;
	height: 100%;
	z-index: 10;
}
.modalOverlay .modalWindow {
	position: absolute;
	top: 30%;
	left: 50%;
	text-align: center;
	background: #fff;
	border: 1px solid #444;
	border-radius: 3px;
	box-shadow: 1px 1px 3px rgba(0,0,0,.8);
	width: 450px !Important;
	margin: 0 0 0 -275px !Important;
	padding: 50px !Important;
}
.modalOverlay .modalWindow p {	margin: 10px 0 0 0;}
@media screen and (max-width: 655px) {
.modalOverlay .modalWindow {	width: 300px !Important;	margin: 0 0 0 -190px !Important;	padding: 30px !Important;}
}
@media screen and (max-width: 375px) {
.modalOverlay .modalWindow {	width: 250px !Important;	margin: 0 0 0 -145px !Important;	padding: 10px 20px !Important;	top: 50px;}
.modalOverlay .modalWindow ul {    padding: 0 0 0 20px;}
}
@media screen and (max-width: 300px) {
.modalOverlay .modalWindow {
	width: 80% !Important;
	margin: 0 0 0 5% !Important;
	padding: 5% !Important;
	left: 0 !important;
	top: 0 !important;
	position: relative;
}
.modalOverlay .modalWindow li {	font-size: .8em;}
}
/*~~~~~ JOB APPLICATION FORM ~~~~~*/
#tab1-warning .modalWindow {	text-align: left;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ TABLES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
table {	border-collapse: collapse;	border-spacing: 5px;}
table tr:hover th { background: #a9b6c6; }
table tr:hover td { background: #c4d0df; }
table td, table th {	border: 1px solid #333739;	padding: 5px 10px;}
table th {	text-align: left;	background: #c4d0df;	font-weight: bold;}
table a {	word-break: break-all;}
table p {	margin: 0;	padding: 0;}
@media screen and (max-width: 500px) {
table td, table th {	display: block;}
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ FORMS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
span.required {	color: #790B0B;}
input, select, textarea {	border: 1px solid #c4d0df; padding: 7px; }
input[type="checkbox"]:focus, input[type="radio"]:focus {	outline: red dotted 1px;}
.fixedwidth-form {    display: flex;    flex-wrap: wrap;}
.fixedwidth-form > * {    flex: 1; width: 100%; width: calc(100% - 14px);}
.fixedwidth-form label {max-width: 250px; min-width: 250px;}
@media screen and (max-width: 1000px) {
.fixedwidth-form {    display: block;}
.fixedwidth-form label {max-width: none; min-width: unset;}
}
@media screen and (max-width: 500px) {
input, select, textarea {	width: 100%; width: calc(100% - 14px); }
input[type="radio"], input[type="checkbox"] {	width: auto;  }
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ BOXES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.flexbox {	display: flex;	flex-wrap: wrap; row-gap: 1em; }
.flexbox > * {	flex: 1; min-width: 300px; }
@media screen and (max-width: 500px) {
.flexbox {	display: block;	gap: 0; }
.flexbox > * {min-width: unset; margin-bottom: 1em; }
}
.blueflexbox { padding-bottom: 100px; column-gap: 2em;}
.blueflexbox > * {background-color: #c4d0df;padding: 1em 2em 1em;}
@media screen and (max-width: 500px) {
.blueflexbox {	padding-bottom: 1em; }
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ HEADER ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
header {
    padding: 25px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
}
@media screen and (max-width: 775px) {
header {    padding: 15px 0 0; }
}
/*~~~~~ LOGO ~~~~~*/
.logo a {	display: block;}
.logo p {
	font-size: .9em;
	font-family: 'arimo-font', Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-top: 0;
}
@media screen and (max-width: 500px) {
.logo {	width: 65%;}
.logo img {	width: 60%;	height: inherit;}
}
@media screen and (max-width: 375px) {
.logo p {	font-size: .7em;}
}
@media screen and (max-width: 300px) {
.logo {	width: 100%;	padding-top: 10px;	float: none;}
}
/*~~~~~ SOCIAL MEDIA ICON ~~~~~*/
.social-media a {	width: 40px !important;	display: block;}
.social-media a:focus {	outline: red dotted 1px;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ MAIN MENU ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
nav {	z-index: 5;	position: relative;}
button#menu-label {	display: none;}
#main-menu {
	list-style: none outside none;
  text-align: center;
  margin: 0 auto;
  background: #c4d0df;
  width: 60%;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#main-menu li a {
	color: #303437 !important;
	display: block;
	padding: 13px 20px;
	text-transform: uppercase;
	font-weight: bold;
	text-decoration: none;
}
#home nav ul li a.navhome, #employment nav ul li a.navemployment, #services nav ul a.navservices, #products nav ul a.navproducts, #contact nav ul a.navcontact, nav ul a:hover {
	background-color: #7da7d9;
	color: #303437;
}
.submenu {	display: none;}
nav select {	display: none;}
@media screen and (max-width: 1300px) {
#main-menu {	width: 100%;}
}
@media screen and (max-width: 775px) {
#main-menu li a {	padding: 7px 7px;}
}
@media screen and (max-width: 599px) {
#main-menu {
	text-align: left;
	margin-top: 0;
	margin-bottom: 10px;
	width: 100%;
	margin-left: 0;
	display: block;
}
#main-menu li {	text-align: left;	display: block;
}
#main-menu li a {	padding: 6px 24px;}
#main-menu.submenu {	margin: 0 !important;	margin-left: 6% !important;	width: 94%;}
.submenu {	display: block;}
#main-menu.submenu li a {	padding: 3px 0 3px 24px;	text-transform: none;}
button#menu-label {	display: block;}
button#menu-label {
	display: block;
	width: 100%;
	border: none;
	background: #7da7d9;
	color: #303437;
	height: 40px;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 1.2em;
}
button#menu-label:focus {	outline: dotted 1px;}
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ BREADCRUMBS ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.breadcrumbs p {    font-size: .8em;    margin-left: 1em;    margin-top: .5em;	font-weight: bold;}
.breadcrumbs a {    text-decoration: none;}
.breadcrumbs a:hover {    text-decoration: underline;}
@media screen and (max-width: 500px) {
.breadcrumbs p { margin-left: 0; }
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ SIDENAV ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.sidenav {	background-color: #333739;	color: #ffffff;	margin-top: -30px;
}
#opportunities ul li a.sidenavOpportunities,
#environment ul li a.sidenavEnvironment,
#benefits ul li a.sidenavBenefits,
#employees ul li a.sidenavEmployees,
#ourservices ul li a.sidenavOurservices,
#customers ul li a.sidenavCustomers,
#ciosp3 ul li a.sidenavCio,
#conf ul li a.sidenavConf,
.sidenav ul li a:hover {
	background-color: #525252;
	color: #ffffff;
}
.sidenav ul {
	list-style: none outside none;
	text-align: center;
	margin: 0;
	padding-left: 0 !important;
	padding-top: 35px;
}
.sidenav ul li {
	display: inline-block;
	margin-bottom: 10px;
}
.sidenav ul li a {
	padding: 10px 15px;
	display: block;
	color: #ffffff;
	text-decoration: none;
}
@media screen and (max-width: 599px) {
.sidenav {	display: none;}
.opportunities ul li a.sidenavOpportunities,
	.environment ul li a.sidenavEnvironment,
	.benefits ul li a.sidenavBenefits,
	.employees ul li a.sidenavEmployees,
	.ourservices ul li a.sidenavOurservices,
	.customers ul li a.sidenavCustomers,
	.ciosp3 ul li a.sidenavCio,
	.conf ul li a.sidenavConf {
	background-color: #ffffff;
}
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ FOOTER ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
footer {	background-color: #c4d0df;	position: relative; display: flex; flex-wrap: wrap; padding-top: 1em; padding-bottom: 3em; }
footer h3 {	font-size: 1em;	margin-bottom: .5em;}
footer p {	margin-top: 0;	margin-bottom: 0;}
footer .calverton, footer .rockville {	flex: 1;  max-width: 250px; }
footer .rockville {	text-align: right;}
footer .general {	flex: 1;	text-align: center;	margin-top: 50px; }
footer .general p {	max-width: 400px; margin: 0 auto;}
@media screen and (max-width: 1400px) {
footer { justify-content: space-between; }
footer .calverton {	order: 1; flex: 1; }
footer .rockville {	order: 2; flex: 1; }
footer .general { order: 3; flex-basis: 100%; }
}
@media screen and (max-width: 767px) {
footer .calverton , footer .rockville, footer .general { text-align: left; flex-basis: 100%; max-width: none; margin: 0; }
footer .general p {	margin-top: 1em; max-width: none; }
}
/*~~~~~ RETURN TO TOP ~~~~~*/
footer .top { display: none;	order: 4; }
@media screen and (max-width: 500px) {
footer .top { display: block;    width: 100%; width: calc(100% - 20px);   text-align: center; margin: 1em 0 0; }
footer .top a { display: block; width: 100%; }
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                                  SPECIFIC PAGE STYLING
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ HOMEPAGE ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
main.homepage {    margin-top: -25px;    border-top: 25px solid #b5b5b5;}
.homepage-block {	margin-top: 50px;}
@media screen and (max-width: 655px) {
.homepage-block {	margin-top: 0px;}
}
main.homepage h2 {margin-bottom: 1.5em;	margin-top: 1em }
/*~~~~~ HOMEPAGE HERO ~~~~~*/
.header-block {  background-color: #B5B5B5;    margin: 0;}
.header-block .header-banner a {
  width: 50%;
  margin-left: 10%;
  position: relative;
  display: block;
  font-weight: normal;
}
.header-block img.header-bg-img.desktop {	margin-top: -88px;}
.header-block img.header-bg-img.mobile {	display: none;}
@media screen and (max-width: 775px) {
.header-block .header-banner a {	width: 100%; width: calc(100% - 14px); margin: 0; }
}
@media screen and (max-width: 655px) {
.header-block img.header-bg-img.desktop {	margin-top: -53px;}
}
@media screen and (max-width: 375px) {
.header-block img.header-bg-img.desktop {	display: none;}
.header-block img.header-bg-img.mobile {	display: block;}
.header-block img.header-bg-img.desktop {	margin-top: 0;}
}
/*~~~~~ MISSION STATEMENT ~~~~~*/
.what-we-do {
	background-color: #333739;
	text-align: center;
	padding: 12px 19%;
}
.what-we-do * {	color: #ffffff !important;}
@media screen and (max-width: 950px) {
.what-we-do {	padding: 15px;}
}
/*~~~~~ ABOUT SECTION ~~~~~*/
.about-ims .years-number {
	width: 200px;
	height: 200px;
	float: left;
	margin-right: 5%;
	margin-bottom: 10px;
	background-color: #c4d0df;
	border-radius: 100px;
	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	text-align: center;
	font-family: Verdana, Geneva, sans-serif;
	color: #344559;
	-webkit-transform: rotate(-10deg);
	-moz-transform: rotate(-10deg);
	-ms-transform: rotate(-10deg);
	-o-transform: rotate(-10deg);
}
.about-ims .years-number .yearnumber {	font-size: 6.5em;	font-weight: bold;	margin-top: 17px;	margin-left: -31px;}
.about-ims .years-number span {	margin-left: -5px;}
.about-ims .years-number span.plus {	font-size: .4em;	-webkit-text-stroke-width: 5px;	-webkit-text-stroke-color: #344559;	position: absolute;	margin-top: 41px;}
.about-ims .years-number .yeartext {	margin-top: -128px;	font-size: 2em;	font-family: 'arimo-font', Arial, Helvetica, sans-serif;}
.about-ims .govt-funding-logos img {	margin-left: 11%;}
@media screen and (max-width: 655px) {
.about-ims .govt-funding-logos img {	margin-left: 3%;}
}
@media screen and (max-width: 500px) {
.about-ims .years-number {	width: 120px;	height: 120px;	margin-right: 3%;	margin-bottom: 10px;}
.about-ims .years-number .yearnumber {	font-size: 3.5em;	margin-top: 15px;	margin-left: -18px;}
.about-ims .years-number span {	margin-left: -1px;}
.about-ims .years-number span.plus {	margin-top: 21px;}
.about-ims .years-number .yeartext {	margin-top: -65px;	font-size: 1em;}
}
@media screen and (max-width: 375px) {
.about-ims .govt-funding-logos img {	margin-left: 0;}
}
@media screen and (max-width: 300px) {
.about-ims .years-number {	float: none;	margin: 0 auto;	width: 180px;	height: 180px;}
.about-ims .years-number .yearnumber {	font-size: 5em;	margin-left: -28px;	padding-top: 15px;}
.about-ims .years-number span.plus {	margin-top: 28px;}
.about-ims .years-number .yeartext {	margin-top: -95px;	font-size: 1.5em;}
}
/*~~~~~ PRODUCTS SECTION ~~~~~*/
.products {
	background-color: #c4d0df;
	display: flex;
	flex-wrap: wrap;
}
.products h2 {	flex-basis: 100%;}
.products .product-logo {
	background: #ffffff;
	width: 16%;
	margin: 0 2.3% 2.3%;
	padding: 2%;
	overflow: hidden;
	position: relative;
}
.products .product-logo a {	display: block;}
.products .product-logo:hover {	box-shadow: 0px 0px 15px #627388;}
.products .product-logo.view-all {	background-color: #344559;}
.products .product-logo.view-all:hover { background-color: #2A3B4F;}
.products .product-logo.view-all a {	text-decoration: none;}
.products .product-logo.view-all a:focus {	outline: red dotted 1px;}
.products .product-logo h3 {
	font-weight: bold;
	text-align: center;
	font-family: 'arimo-font', Arial, Helvetica, sans-serif;
	color: #ffffff;
	margin: 0;
	top: 25%;
	position: absolute;
	width: 80%;
}
@media screen and (max-width: 1075px) {
.products .product-logo {	width: 24%;}
.products .product-logo h3 {	font-size: 1.2em;}
}
@media screen and (max-width: 950px) {
.products .product-logo h3 {	font-size: 1.2em;}
}
@media screen and (max-width: 775px) {
.products .product-logo h3 {	font-size: 1em;}
}
@media screen and (max-width: 655px) {
.products .product-logo {	width: 24%;}
}
@media screen and (max-width: 375px) {
.products .product-logo {	width: 41%;}
}
@media screen and (max-width: 350px) {
.products .product-logo {	height: inherit;	width: 92%;	float: none;}
.products .product-logo.view-all img {	display: none;}
.products .product-logo h3 {	position: relative;	width: 100%;}
}
/*~~~~~ SQUARE ANIMATION ~~~~~*/
.square-animation {	position: relative;	-webkit-transition: all 0.35s ease-in-out;	-moz-transition: all 0.35s ease-in-out;	transition: all 0.35s ease-in-out;}
.square-animation .info {	background: #344559;	height: 40%;	position: absolute;	bottom: 0;	left: 0;	right: 0;	text-align: center;	-webkit-backface-visibility: hidden;	backface-visibility: hidden;	visibility: hidden;	opacity: 0;	-webkit-transform: scale(0);	-moz-transform: scale(0);	-ms-transform: scale(0);	-o-transform: scale(0);	transform: scale(0);	-webkit-transition: all 0.35s ease-in-out;	-moz-transition: all 0.35s ease-in-out;	transition: all 0.35s ease-in-out;}
.square-animation .img {	z-index: 11;	-webkit-transition: all 0.35s ease-in-out;	-moz-transition: all 0.35s ease-in-out;	transition: all 0.35s ease-in-out;	-webkit-transform: scale(1);	-moz-transform: scale(1);	-ms-transform: scale(1);	-o-transform: scale(1);	transform: scale(1);}
.square-animation a:hover .info {	visibility: visible;	opacity: 1;	-webkit-transform: scale(1);	-moz-transform: scale(1);	-ms-transform: scale(1);	-o-transform: scale(1);	transform: scale(1);}
.square-animation .info h3 {	color: #fff;	text-align: center;}
.square-animation .info p {	color: #ffffff;	margin: 0;	text-align: center;	padding: 6% 4%;	font-size: .8em;}
.square-animation a:hover .img {	-webkit-transform: translateY(-30px) scale(0.6);	-moz-transform: translateY(-30px) scale(0.6);	-ms-transform: translateY(-30px) scale(0.6);	-o-transform: translateY(-30px) scale(0.6);	transform: translateY(-30px) scale(0.6);}
@media screen and (max-width: 1400px) {
.square-animation .info {	height: 50%;}
}
@media screen and (max-width: 1200px) {
.square-animation a:hover .img {	-webkit-transform: translateY(-35px) scale(0.6);	-moz-transform: translateY(-35px) scale(0.6);	-ms-transform: translateY(-35px) scale(0.6);	-o-transform: translateY(-35px) scale(0.6);	transform: translateY(-35px) scale(0.6);}
.square-animation .info {	height: 57%;}
}
@media screen and (max-width: 1075px) {
.square-animation .info p {	padding: 2%;}
.square-animation a:hover .img {	-webkit-transform: translateY(-37px) scale(0.6);	-moz-transform: translateY(-37px) scale(0.6);	-ms-transform: translateY(-37px) scale(0.6);	-o-transform: translateY(-37px) scale(0.6);	transform: translateY(-37px) scale(0.6);}
.square-animation .info {	height: 50%;}
}
@media screen and (max-width: 950px) {
.square-animation a:hover .img {	-webkit-transform: translateY(-29px) scale(0.6);	-moz-transform: translateY(-29px) scale(0.6);	-ms-transform: translateY(-29px) scale(0.6);	-o-transform: translateY(-29px) scale(0.6);	transform: translateY(-29px) scale(0.6);}
}
@media screen and (max-width: 775px) {
.square-animation .info {	display: none;}
.square-animation a:hover .img {	-webkit-transform: none;	-moz-transform: none;	-ms-transform: none;	-o-transform: none;	transform: none;}
}
/*~~~~~ CAREERS SECTION ~~~~~*/
.careers {background-image: url(../images/career-bg.jpg);display: flex;flex-wrap: wrap;align-items: center; padding-bottom: 2em;}
.careers h2 {    flex-basis: 100%;    margin-bottom: .5em;}
.careers p {	text-align: center;	line-height: 1.7em;}
.careers .ims-job-paragraph {	flex: 3; min-width: 350px; }
.careers .ims-job-paragraph span.gray {	font-size: 2.3em;	font-weight: bold;	color: #344559;	font-family: 'archivo-font', sans-serif;}
.careers .ims-job-paragraph span.blueWord {	font-size: 2.1em;	font-weight: bold;	color: #43484d;	font-family: 'archivo-font', sans-serif;}
.careers .jobtitle {	margin: 0 auto;	width: 90%;}
.careers .jobpost-list, .careers .jobpost-list.squish-problem {	flex: 2; min-width: 350px; }
.careers .jobpost-list .jobtitle .btn.btn-yellow { width: 100%; display: block; margin-right: 0; width: calc(100% - 14px); }
.careers .jobpost-list.squish-problem {	background-color: #ffffff;	padding: 2%;text-align: center;}
.careers .jobpost-list.squish-problem p {	line-height: 1.3;	margin-top: 1em;}
@media screen and (max-width: 1400px) {
.careers .ims-job-paragraph br {	display: none;}
}
@media screen and (max-width: 500px) {
.careers { display: inline-block; }
.careers .ims-job-paragraph, .careers .jobpost-list, .careers .jobpost-list.squish-problem {	flex: 2; min-width: unset; }
}
@media screen and (max-width: 375px) {
.careers .ims-job-paragraph span.gray {	font-size: 1.7em;}
.careers .ims-job-paragraph span.blueWord {	font-size: 1.5em;}
.careers p {	line-height: 1.6em;	margin-top: 0;}
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ EMPLOYMENT SECTION PAGES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div.current-posititons {
	background-image: url(../images/career-bg.jpg);
	width: 100%;
}
/*~~~~~ TESTIMONIALS ~~~~~*/
.employees .author {	text-align: right;	font-style: italic;	color: #24688d;	display: block;}
.employees .dottedLine {	border-bottom: medium dotted #D4D4D4;}
/*~~~~~ JOB AD - APPLY NOW ~~~~~*/
.job-callout:focus {	outline: red dotted 1px;}
.job-callout {	float: right;	}
@media screen and (max-width: 500px) {
.job-callout {	float: none;	}
}
/*~~~~~ JOB DESCRIPTION ~~~~~*/
.squish-job-description {	clear: both;}
.squish-job-description h3+br {    display: none;}
.squish-job-description h3 {    margin-top: 0;}
/*~~~~~ JOB APPILCATION - DISABILITY CALLOUT ~~~~~*/
.disability-callout {
	text-align: right;
	margin-top: -50px;
}
@media screen and (max-width: 1000px) {
.disability-callout {	margin-top: 0px;}
}
/*~~~~~ JOB APPILCATION - TABS ~~~~~*/
#employment .ui-widget-content {
	border: 1px solid #c4d0df;
	margin-bottom: 20px;
	width: 100%;
}
#employment .ui-helper-reset {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
  list-style: none;
  /* border: 1px solid #c4d0df; */
}
#employment .ui-helper-reset li {
  flex: 1;
  border-bottom: 1px solid #c4d0df;
  background-color: #f3f5f8;
  border-right: 1px solid #c4d0df;
}
#employment .ui-helper-reset li a {
  display: block;
  width: 100%;
	width: calc(100% - 10px);
  text-align: center;
  padding: 5px;
}
#employment .ui-helper-reset li.ui-tabs-active {
  border-bottom: none;
  background: none;
}
#employment .ui-helper-reset li.ui-tabs-active:last-of-type {    border-right: none;}
#employment .ui-helper-reset li.ui-tabs-active a {    text-decoration: none;}
#employment .ui-helper-clearfix:before, #employment .ui-helper-clearfix:after {
	content: "";
	display: table;
	border-collapse: collapse;
}
#employment .ui-helper-clearfix:after {	clear: both;}
#employment .ui-state-default a:hover {	background-color: #ffcc00 }
#employment .ui-state-active.ui-state-hover a:hover {
	box-shadow: none;
	background: none;
	border-top: 1px solid #aaaaaa;
}
#employment .ui-tabs .ui-tabs-panel {
	display: block;
	border-width: 0;
	padding: 0 2% 2%;
	width: 96%;
}
@media screen and (max-width: 1000px) {
#employment .ui-tabs .ui-tabs-nav .ui-tabs-anchor {	padding: .5em 5%;	width: 90%;	margin-right: 2px;}
#employment .ui-tabs .ui-tabs-panel {/* border: 1px solid #aaaaaa; */}
}
@media screen and (max-width: 500px) {
#employment .ui-tabs .ui-tabs-nav li.complete {	width: 100% !important;}
#employment .ui-tabs .ui-tabs-nav li.complete .ui-tabs-anchor {	padding: 2% !important;	width: 96%;}
#employment .ui-helper-reset li.flex-500-fullwidth {	flex-basis: 100%;}
}
/*~~~~~ JOB APPILCATION - PREVIOUS AND NEXT BUTTONS ~~~~~*/
p.next-buttons {margin-top: 2em;min-height: 50px;}
a.next-tab.forward {	float: right;}
a.next-tab.back {	float: left;}
@media screen and (max-width: 767px) {
p.next-buttons {min-height: unset;}
a.next-tab.forward, a.next-tab.back {	float: none; display: block;}
}
/*~~~~~ JOB APPILCATION - PRINT BUTTON ~~~~~*/
.print-option a:before {
	content: url(../images/print.gif);
	padding-right: 5px;
	position: relative;
	top: 2px;
}
/*~~~~~ JOB APPILCATION - SUMMARY ~~~~~*/
dl.summary-section {	padding: 2% 2% 3em;	margin: 0 0 2em;	background-color: #c4d0df;}
dl.summary-section dt {
	display: inline-block;
	font-weight: bold;
	vertical-align: top;
	padding: .25em .25em .75em;
	width: 25%;
	width: calc(25% - 1em);
	clear:left;
}
dl.summary-section dd {
	margin: 0;
	display: inline-block;
	padding: 0.25em 0.25em 0.75em;
	width: 75%;
	width: calc(75% - 1em);
	clear:right;
}
a.next-tab.summary {
	position: absolute;
	width: 300px;
	margin-top: -4.5em;
	right: .25em;
}
@media screen and (max-width: 900px) {
dl.summary-section dt, dl.summary-section dd { display: block; width: auto; padding: 7px 0; }
a.next-tab.summary {	width: 100%;	width: calc(100% - 23px);}
}
/*~~~~~ APPLICATION SUCCESS ~~~~~*/
.thank-you-success { 
    background-color: #ffcc00;
    text-align: center;
    position: relative;
    margin-bottom: 100px;
    padding-top: 20px;
    padding-bottom: 100px;
}
.thank-you-success:after {
    content: url(../images/yellow-check.png);
    position: absolute;
    bottom: -20%;
    margin-left: -60px;
}
@media screen and (max-width: 950px) {
.thank-you-success {    margin-bottom: 70px;}
}
@media screen and (max-width: 655px) {
.thank-you-success {  margin-top: -20px;}
}
@media screen and (max-width: 500px) {
.thank-you-success:after {    margin-left: -40px;    transform: scale(.7);}
}
@media screen and (max-width: 375px) {
.thank-you-success { margin-top: -10px;}
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ SERVICES SECTION PAGES ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~ SERVICES INCLUDE ~~~~~*/
main .ourservices {
    background-image: url(../images/career-bg.jpg);
    padding-top: 25px;
    padding-bottom: 50px;
    margin-top: 45px;
}
main .ourservices .service-links {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
}
main .ourservices .service-links > * {
	flex: 1;
	min-width: 200px;
	text-align: left;
	padding: 1em;
	font-weight: bold;
	position: relative;
	margin: 0;
	padding-bottom: 65px;
}
main .ourservices  img {
	height: 50px;
	position: absolute;
	bottom: 5px;
	right: 5px;
}
body.data-coord .service-links .data-coord, 
body.analytic .service-links .analytic, 
body.app-dev .service-links .app-dev, 
body.web-service .service-links .web-service, 
body.hosting .service-links .hosting, 
body.ct-support .service-links .ct-support, 
body.ciosp3 .service-links .service-ciosp {    opacity: .5;}
@media screen and (max-width: 500px) {
main .ourservices .service-links {	display: block; }
main .ourservices .service-links > * {	width: 100%; width: calc(100% - 2em);	margin-bottom: 1em;}
}
/*~~~~~ CLIENT QUOTES ~~~~~*/
.quotes {
	-webkit-columns: 3 250px;
	-moz-columns: 3 250px;
	columns: 3 250px;
	-webkit-column-gap: 100px;
	-moz-column-gap: 100px;
	column-gap: 100px;
	-webkit-column-rule: 1px solid #aaa;
	-moz-column-rule: 1px solid #aaa;
	column-rule: 1px solid #aaa;
}
.quotes .service-highlight {
	-webkit-column-span: all;
	-moz-column-span: all;
	column-span: all;
	margin: 40px 0 !important;
	background-color: #c4d0df;
	padding: 2%;
	border-bottom: none !important;
}
.quotes .service-highlight .author {	color: #303437;}
.quotes p {
	border-bottom: medium dotted #D4D4D4;
	margin-top: 0;
	-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
	page-break-inside: avoid; /* Firefox */
	break-inside: avoid; /* IE 10+ */
}
.quotes .author {	margin: 10px 0;}
.quotes .author:before {	content: "~ ";}
/*~~~~~ CIO-SP3 LOGO ~~~~~*/
.cio-sp3-logo {	float: right;	margin: 0 0 1em 1em; text-align: right; }
@media screen and (max-width: 1250px) {
.cio-sp3-logo {	float: none;	margin: 0 0 2em;	display: block;	text-align: left; }
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ PRODUCTS PAGE ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.products-page .product-boxes {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	column-gap: 2em;
	margin-bottom: 4em;
}
.products-page .product-boxes .product-link {	flex: 1;}
.products-page .product-boxes p { flex: 2; min-width: 300px;	}
.products-page .product-boxes img {	max-width: none;}
@media screen and (max-width: 500px) {
.products-page .product-boxes {	display: block; }
.products-page .product-boxes p { flex: 2; min-width: unset;	}
.products-page .product-boxes img {	max-width: 100%;}
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ CONTACT US PAGE ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.contact-us-box {
	background-image: url(../images/career-bg.jpg);
	padding-top: 2em;
	padding-bottom: 2em;
}
.contact-us-box .flexbox label + * {
	flex: 2;
}