/* ----- Begin Predefined Variables ----- */
:root {
	/* --- Theme Color --- */
  --bgHeadercolor: #fff;
  --bgFootercolor: #006f71;
  --headerfontcolor: #000;
  --footerfontcolor: #fff;
  
  /* --- General Font --- */
  --generalfontColor: #000;
  --generalfontSize: 15px;
  --generalfontlineHeight: 23px;
  --generalfontfamily: 'Source Sans Pro', Helvetica, Arial, Geneva, sans-serif;
  --generalfontweight: 400;
  
  /* --- Link Details --- */
  --linkcolor: #006f71;
  --linkdecoration: none;
  
  /* --- Link Hover Details --- */
  --linkhovercolor: #0076a8;
  --linkhoverdecoration: underline;
  
  /* --- Button Details --- */
  --buttonbgcolor: #006f71;
  --buttonfontcolor: #fff;
  --buttonbordercolor: #006f71;
  
    /* --- Button Hover Details --- */
  --buttonhoverbgcolor: #006f71;
  --buttonhoverfontcolor: #fff;
  --buttonborderhovercolor: #006f71;
  
  /* --- Main Title --- */
  --mainTitlefontcolor: #006f71;
  --mainTitlefontsize: 36px;
  --mainTitlefontlineheight: 38px;
  --mainTitlefontweight: 700;
  --mainTitlefontfamily: 'Open Sans', sans-serif;
  
  /* --- Sub Title --- */
  --subTitlefontcolor: #000;
  --subTitlefontsize: 28px;
  --subTitlefontlineheight: 30px;
  --subTitlefontweight: 700;
  --subTitlefontfamily: 'Open Sans', sans-serif;
  
  /* --- Reg Title --- */
  --regTitlefontcolor: #000;
  --regTitlefontsize: 20px;
  --regTitlefontlineheight: 23px;
  --regTitlefontweight: 700;
  --regTitlefontfamily: 'Open Sans', sans-serif;
}
/* ----- End Predefined Variables ----- */


/* ----- Begin Header Styles ----- */
.navbar-brand {
	flex-grow: 9;
	margin-left: 15px;
}

.header {
  	background: var(--bgHeadercolor);
}
/* ----- End Header Styles ----- */



/* ----- Begin Nav Styles ----- */
nav {
	padding-right: 10px !important;
  	padding-left: 10px !important;
}
  	
.nav-link {
	font-size: 1rem !important;
	font-weight: 600;
	padding-right: 10px !important;
	padding-left: 10px !important;
	padding-top: 15px;
	color: var(--headerfontcolor) !important;
	text-decoration: none !important;
}

.nav-link:hover {
	color:#0076a8 !important;
	text-decoration: none !important;
}
  	
button .nav-link {
	padding-top: 6px;
	display: inline-block;
	padding-right: 5px !important;
	padding-left: 5px !important;
	text-decoration: none !important;
	color: #fff !important;
}

.nav-item button i {
	color: #fff !important;
}

.nav-item button {
	background-color: var(--buttonbgcolor) !important;   
	border: 1px solid var(--buttonbgcolor) !important;
	border-radius: 0 !important;
	margin-left: 0.625rem;
}

button .nav-link:hover {
	text-decoration: none !important;
	color: var(--buttonfontcolor) !important;
}

.nav-item button:hover i {
	color: var(--buttonfontcolor) !important;
}

.nav-item button:hover {
	background-color: var(--buttonhoverbgcolor) !important; 
	border: 1px solid var(--buttonhoverbgcolor) !important;
	border-radius: 0 !important;
}

.fa-sign-in {
	vertical-align: middle;
 	font-size: 1.1rem;
}

.navbar-toggler {
	border-color: var(--headerfontcolor) !important;
}

.navbar-toggler-icon {
	background-image: url("/static/clients/383FAM1/images/mobile_hamburger_icon.jpg");
}
/* ----- End Nav Styles ----- */


/* ----- Begin Custom Banner Styles ----- */

.custom_banner {
	height: 200px;
    background-image: url("/static/clients/383FAM1/images/footerimage_1920x240_v1_bw-comp.jpg");
    background-repeat: no-repeat;
    background-position: 0 40%;
    background-size: cover;
}

.custom_banner .gradient-helper {
	width: 100%;
	height: 100%;
	background: linear-gradient(0deg, rgba(0,92,86,.7) 15%, rgba(178,210,52,.3) 60%);
}
/* ----- End Custom Banner Styles ----- */


/* ----- Begin Carousel Styles ----- */
.carouselDiv {
	background-color: #E0E0E0;
}
/* ----- End Carousel Styles ----- */



/* ----- Begin Main Content Styles ----- */
.main-content, .footer .container-xxl, .footer .navbar, .footer .container-fluid, .header .container-xxl, .header .navbar, .header .container-fluid {
	padding-right: 0 !important;
	padding-left: 0 !important;
}

.main-wrapper {
	height: 100%;
    display: flex;
    flex-direction: column;
}
  	
.body-content {
	padding-top: 30px;
	padding-bottom: 30px;
}

.job-cat {
	margin-top: 25px;
	margin-bottom: 15px;
}

.body-content {
	flex: 1 0 auto;
}

.footer {
	flex-shrink: 0;
}
/* ----- End Main Content Styles ----- */



/* ----- Begin Job Card Styles ----- */  
.card {
	border-radius: 0;
}
 
.job-card .card-header, .job-card .card-body {
   	padding: 5px !important;
}
   
.job-card h6 {
   	font-size: 1.00rem !important;
   	margin-bottom: 1px !important;
}

.job-card .card-post-close {
   	padding-left: 0 !important;
}
   
.job-card .card-post-close span {
   	padding-right: 5px !important;
   	font-size: 13px !important;
}
   
.job-card .card-pos-id {
   	padding-right: 0 !important;
   	padding-left: 0 !important;
}
   
.card-dept {
   	font-size: 13px !important;
}
   
.job-card .card-header p {
   	margin-bottom: 0 !important;
   	padding-top: 5px !important;
   	font-size: 13px !important;
}

.card-body button {
	color: var(--buttonfontcolor) !important;
	background-color: var(--buttonbgcolor) !important;
	border: 1px solid var(--buttonbordercolor) !important;
	font-weight: 600;
	border-radius: 0;
}

.card-body button:hover {
	background-color: var(--buttonhoverbgcolor) !important;
	color: var(--buttonhoverfontcolor) !important;
	border: 1px solid var(--buttonborderhovercolor) !important;
	font-weight: 600;
	border-radius: 0;
}
   
.jobcard-footer {
   	padding-left: 0 !important;
}
   
.job-card .jobcard-footer p {
   	margin-bottom: 0 !important;
   	font-size: 14px !important;
   	margin-top: 1px;
}
   
.card-job-dec p, .card-job-dec li, .card-job-dec a {
   	margin-bottom: 0 !important;
   	font-size: 14px !important;
   	line-height: 1.2rem !important;
}

.card-job-dec a {
	font-size: 14px !important;
}

.card-job-dec ul, .card-job-dec ol {
	margin-bottom: 0 !important;
	padding-left: 15px !important;
}
/* ----- End Job Card Styles ----- */



/* ----- Begin Footer Styles ----- */
.footer {
	background: var(--bgFootercolor);
}

.footer .address {
	color: var(--footerfontcolor);
	padding: 10px;
}

.footer .address h6 {
	font-size: 14px;
}

.footer-tagline h5 {
	color: var(--footerfontcolor);
	font-weight: 700;
	font-size: 1.5625rem;
    line-height: 40px;
}

.footer-tagline {
	text-decoration: none !important;
}
/* ----- End Footer Styles ----- */



/* ----- Begin IE Styles ----- */
html, body {
	height: 100%;
}

body {
	margin: 0px;
	width: 100% !important;
}

body.bod {
	padding: 0 !important;
}

body.bod > p {
	display: none;
}

.bod, body, p, ul, ul li, ol, ol li {
	font-family: var(--generalfontfamily);
	font-size: var(--generalfontSize);
	line-height: var(--generalfontlineHeight);
	color: var(--generalfontColor);
}

h1, .h1 {
	font-family: var(--mainTitlefontfamily);
	font-size: var(--mainTitlefontsize);
	line-height: var(--mainTitlefontlineheight);
	color: var(--mainTitlefontcolor);
	font-weight: var(--mainTitlefontweight);
}

h2, .h2 {
	font-family: var(--subTitlefontfamily);
	font-size: var(--subTitlefontsize);
	line-height: var(--subTitlefontlineheight);
	color: var(--subTitlefontcolor);
	font-weight: var(--subTitlefontweight);
}

h3 {
	font-family: var(--regTitlefontfamily);
	font-size: var(--regTitlefontsize);
	line-height: var(--regTitlefontlineheight);
	color: var(--regTitlefontcolor);
	font-weight: var(--regTitlefontlineheight);
}

a, a:link, a:visited {
	font-family: var(--generalfontfamily);
	color: var(--linkcolor);
	text-decoration: var(--linkdecoration);
	font-size: var(--generalfontSize);
}

a:hover {
	font-family: var(--generalfontfamily);
	color: var(--linkhovercolor) !important;
	text-decoration: var(--linkhoverdecoration) !important;
	font-size: var(--generalfontSize);
}

.leftcol {
    background-color: #ffffff;
    padding: 0px;
    border-right: 1px solid #AAAAA8;
    width: 0;
    display: none !important;
}

.stb {
	background-image: none;
	background-position: right;	
	padding: 0px;
	display: none !important;	
}

.effect1Main {
    width: 100%;
    font-family: var(--generalfontfamily);
    background-color: #FFFFFF;
    padding: 0px;
    text-align: left;
}

.effect1 {
	font-family: var(--generalfontfamily);
	font-weight: 400;
	padding: 0px;
	text-align: left;
}

.effect2 {
	font-family: var(--generalfontfamily);
	color: var(--generalfontColor);
}

.effect1 input, .effect1 select {
	font-family: var(--generalfontfamily);
    color: var(--generalfontColor);
    background-color: #FFFFFF;
    border: 1px solid #666666;
    padding: 5px !important;
    margin: 5px;
}

.effect1 textarea {
	font-family: var(--generalfontfamily);
	color: var(--generalfontColor);
	background-color: #FFFFFF;
	border: 1px solid #666666;
}

.effect1 .button, .effect1 input[type="button"].link, .effect1Main .button {
    cursor: pointer;
    display: inline-block;
    font-weight: 500;
    padding: 5px 10px !important;
    border: 0px;
}

.effect1 .button, .effect1 input[type="button"].link, .tabSel, #AddReferenceButton, .effect1Main .button {
	color: var(--buttonfontcolor) !important;
	background-color: var(--buttonbgcolor) !important;
	border: 1px solid var(--buttonbordercolor) !important;
	border-radius: 0 !important;
}

.effect1 .button:hover, .effect1Main .button:hover, .tab:hover {
	background-color: var(--buttonhoverbgcolor) !important;
	color: var(--buttonhoverfontcolor) !important;
	border: 1px solid var(--buttonborderhovercolor) !important;
	border-radius: 0 !important;
}

.tab, .tab a {
	font-weight: 500 !important;
	text-decoration: none;
	padding: 3px 9px 4px 9px;
	border: 1px #333333 solid;
	border-bottom: 0px;
	color:  var(--bgcolor) !important;
	background-color: #ffffff;
}

.tabSel, .tab:hover {
	font-weight: 500;
	text-decoration: none !important;
	padding: 3px 9px 4px 9px;
	border: 1px #333333 solid !important;
	border-bottom: 0px;
}

.lcol {
    font-family: var(--generalfontfamily) !important;
    border: 1px #002147 solid;
}
.lcol p {
    color: #666666;
}

.tbline {
    border-bottom: 1px solid #002147;
    padding: 0px;
    line-height: 1px;
}

.wnd {
    font-family: var(--generalfontfamily) !important;
    font-weight: 300;
    color: var(--generalfontColor);
}

.sml {
	font-family: var(--generalfontfamily) !important;
}

.dhtmlx_window_active {
    z-index: 500000 !important;
    overflow: unset !important;
}

#candApplyTable {
    width: 100%;
}

#addDocumentsInstructions, #thankYouText {
	width: 75% !important;
}

#thankYouTable blockquote {
	margin: 20px !important;
}

#applyNowBox {
	width: 25%;
	margin-left: 10px !important;
}

#searchResultsTable {
    width: 90%;
}

#accountSetup {
	width: 500px;
}

#candAccountTable p, #candAccountTable a {
	font-family: var(--generalfontfamily) !important;
}

#candAccountTable td {
	font-family: var(--generalfontfamily) !important;
	font-weight: 400;
	padding: 0 5px !important;
}

#candAccountTable p {
	margin: 0 !important;
}

.body-content > .ie_container {
	width: 100%;
}

#completeJobListThankyouNote {
	width: 80%;
}

#Cand_Email {
	width: 230px !important;	
}

.effect1 legend {
	font-family: var(--generalfontfamily);
	font-size: var(--generalfontSize);
	line-height: var(--generalfontlineHeight);
}

div.dhtmlx_window_active img.dhtmlx_wins_icon_dhx_blue {
	top: 15px;
}

div.dhtmlx_window_active div.dhtmlx_wins_buttons_dhx_blue {
	top: 6px;
}

#candAccountTable td, #candAccountTable p, #candAccountTable a {
	font-size: 14px !important;
}

#completeJobListApplications td, #completeJobListApplications p, #completeJobListApplications a {
	font-size: 14px !important;
}
/*------ Begin Desktop screen ------*/
@media only screen and (min-width: 1300px) {
	body, .effect1Main, .effect1, p, ul, ul li, ol, ol li, .sml, .wnd, a, a:link, a:visited, a:hover, .effect2,
	.button, input[type="button"].link, .button:hover, .tab:hover, .lcol, #candAccountTable p, #candAccountTable a, #candAccountTable td,
	input, select, textarea {
		font-size: 16px;
		line-height: 25.6px;
	}
	
	h1, .h1 {
		font-size: var(--mainTitlefontsize);
	}
	
	h2, .h2 {
		font-size: var(--subTitlefontsize);
	    line-height: var(--subTitlefontlineheight);
	}
}
/*------ End Desktop screen ------*/



/*------ Begin Smaller Desktop screen ------*/
@media only screen and (min-width: 900px) and (max-width: 1300px) {
	body, .effect1Main, .effect1, p, ul, ul li, ol, ol li, .sml, .wnd, a, a:link, a:visited, a:hover, .effect2,
	.button, input[type="button"].link, .button:hover, .tab:hover, .lcol, #candAccountTable p, #candAccountTable a, #candAccountTable td,
	input, select, textarea {
		font-size: 15px;
		line-height: 24px;
	}
	
	h1, .h1 {
		font-size: 38px;
	}
	
	h2, .h2 {
		font-size: 22px;
	    line-height: 30px;
	}
	
	.logo, .top-logo, .companyLogoLowVis {
		height: 85px;
	}
}
/*------ End Smaller Desktop screen ------*/



/*------ Begin Tablet screen ------*/
@media only screen and (min-width: 720px) and (max-width: 900px) {
	body, .effect1Main, .effect1, p, ul, ul li, ol, ol li, .sml, .wnd, a, a:link, a:visited, a:hover, .effect2,
	.button, input[type="button"].link, .button:hover, .tab:hover, .lcol, #candAccountTable p, #candAccountTable a, #candAccountTable td,
	input, select, textarea {
		font-size: 14px;
		line-height: 22px;
	}
	h1, .h1 {
		font-size: 30px;
	}
	h2, .h2 {
		font-size: 20px;
	    line-height: 28px;
	}
	.logo, .top-logo, .companyLogoLowVis {
		height: 75px;
	}
}
/*------ End Tablet screen ------*/


/*------ Begin Smartphones (portrait and landscape) ------*/
@media only screen and (max-width: 720px) {
	body, .bod {
		width: 100% !important;
	}
	body, .effect1Main, .effect1, p, ul, ul li, ol, ol li, .sml, .wnd, a, a:link, a:visited, a:hover, .effect2,
	.responsiveTable td a, .responsiveTable td, .responsiveTable td sml, .top-navigation a,
	.button, input[type="button"].link, .button:hover, .tab:hover, .lcol, #candAccountTable p, #candAccountTable a, #candAccountTable td,
	input, select, textarea {
		font-size: 14px !important;
		line-height: 22px !important;
	}
	.effect1Main {
		width: 95% !important;
	}
	h1, .h1 {
		font-size: 28px !important;
	}
	h2, .h2 {
		font-size: 20px;
	    line-height: 26px;
	}
	h3 {
		font-size: 1.3rem !important;
	}
	.effect1 input, .effect1 select {
		margin: 0px 0px 5px 0px;
	}
	#accountSetup {
		width: 500px;
	}
	#applyNowBox {
		width: 98%;
		margin-bottom: 10px !important;
	}
	#completeJobListApplications, #candAccountTable, #addDocumentsInstructions, #thankYouText {
	    width: 100% !important;
	}
	
	#completeJobListApplications tr {
    	display: table-row;
	}
	
	div.dhtmlx_window_active img.dhtmlx_wins_icon_dhx_blue {
		top: 10px;
	}
	
	.nav-item .btn-primary {
        margin-top: 1rem;
    }
	
}
/*------ End Smartphones (portrait and landscape) ------*/


/* ----- End IE Styles ----- */