@charset "UTF-8";

/*  Menu Buttons  */
:root {
     --main-bg: #fff;
    --menu-bg: #ec3b48;
    --menu-font-color: #fff;
    --menu-border: #ec3b48;
    --menu-bg-selected: #959595;
    --menu-bg-hover: #959595;
	--hue: 214;
    --template-bg-light: #f0f4fb;
    --template-text-dark: #495057;
    --template-text-light: #ffffff;
    --template-bg-dark-20: hsl(var(--hue), 40%, 80%);
    --options-form-color: var(--template-text-dark);
    --options-form-bg: unset;
    --options-form-border: 1px solid var(--template-bg-dark-20);
    --options-form-legend-color: var(--template-text-dark);
    --options-form-legend-bg: inherit;
	--bs-dark-rgb: 51, 65, 85;
    --bs-bg-gray-700: #334155;
    --bs-blue: #043673;
    --bs-blue-rgb: 4, 54, 115;
    --bs-bg-blue: #043673;
    --bs-blue-text-emphasis: #012653;
    --bs-blue-bg-subtle: #cfe2ff;
    --bs-blue-border-subtle: #9ec5fe;
    --bs-text-opacity: ;
    --bs-purple: #8b3dff;
    --bs-purple-rgb: 139, 61, 255;
    --bs-purple-bg-subtle: #e8d8ff;
    --bs-purple-text-emphasis: #381866;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.bg-blue {
	background: #ec3b48;
}

body {
	font-size: 18px;
	-webkit-text-size-adjust: 95%;
	/*font-family: 'Baskerville', "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; */
	font-family: Arial, "sans-serif";
	/*font-family: 'Lato', sans-serif; */
	line-height: 28.8px;
	font-weight: 300;
	margin: 0;
	padding: 0;
	text-align: left;
	background-color: none;
	color: #2d2d2d;
	height: 100%;
	}
p {
	font-size: 18px;
	-webkit-text-size-adjust: 95%;
	/*font-family: 'Baskerville', "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; */
	font-family: Arial, "sans-serif";
	/*font-family: 'Lato', sans-serif; */
	line-height: 28.8px;
	font-weight: 300;
	margin: 0;
	padding: 0;
	text-align: left;
	background-color: none;
	color: #2d2d2d;
	height: 100%;
	}

h1 {
	/*font-family: 'Baskerville', "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";*/
	font-family:  "Public Sans", "Lucida Sans Unicode", "Lucida Sans", Arial, "sans-serif";
	webkit-font-smoothing: antialiased;
	/*font-family: 'Lato', sans-serif; */
	font-size: 0.875em;
	text-transform: uppercase !important;
	letter-spacing: 0.1em !important;
	font-weight: 600 !important;
	line-height: 1.2em;
	color: #64748b;
	text-align: center;
	margin: 0;
	padding: .5em 0 .3em 0;
}
h2 {
	/*font-family: 'Baskerville', "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";*/
	font-family:  "Public Sans", "Lucida Sans Unicode", "Lucida Sans", Arial, "sans-serif";
	/*font-family: 'Oswald', sans-serif;*/
	font-size: calc(1.375rem + 1.5vw) !important;
	letter-spacing: -0.03em;
	font-weight: 700;
	webkit-font-smoothing: antialiased;
	color: #1e293b;
	margin: 0;
	margin-bottom: 1rem !important;
	margin-top: 1rem !important;
	padding: 0;
	text-align: center;
}
h3 {
	/*font-family: 'Baskerville', "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";*/
	font-family: Arial, "sans-serif"; 
	/*font-family: 'Lato', sans-serif; */
	font-size: calc(1.275rem + 0.3vw);
	letter-spacing: -0.03em;
	font-weight: 700;
	color: #1e293b;
	margin: 0;	
	margin-bottom: 1rem !important;
	margin-top: 1.5rem !important;
	padding: 0;
	padding-bottom: 1%;
	display: block;
	margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
	unicode-bidi: isolate;
}
h4 {
	/*font-family: 'Baskerville', "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";*/
	font-family: Arial, "sans-serif"; 
	/*font-family: 'Lato', sans-serif; */
	font-size: 1.333em;
	text-transform: none;
	font-weight: normal;
	color: #2d2d2d;
	line-height: 1.5em;
	margin: 0;
	padding: 0;
}
p {
	/*font-family: 'Baskerville', "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";*/
	/*font-family:  "Public Sans", "Lucida Sans Unicode", "Lucida Sans", Arial, "sans-serif";*/
	font-family: Arial, "sans-serif";
	display: block;
    margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
	color: #64748b;
}

.col-6 {
  flex: 0 0 auto;
  width: 50%;
}
.text-white-stable {
  color: #fff !important;
}
.py-5 {
  padding-top: 2rem !important;
  padding-bottom: 2rem !important;
}
  .py-lg-9 {
    padding-top: 5rem !important;
    padding-bottom: 5rem !important;
  }
.g-5,
.gx-5 {
  --bs-gutter-x: 2rem;
}

.g-5,
.gy-5 {
  --bs-gutter-y: 2rem;
}
.row {
  display: flex;
  align-items: center;   /* Vertically center items */
  gap: 20px;             /* Optional spacing */
}

.row img {
  width: 100%;
  min-width: 300px;
  height: auto;
}
.text {
  max-width: 80%;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mb-1 {
  margin-bottom: 0.25rem !important;
}

.mb-2 {
  margin-bottom: 0.5rem !important;
}

.mb-3 {
  margin-bottom: 1rem !important;
}

.mb-4 {
  margin-bottom: 1.5rem !important;
}

.mb-5 {
  margin-bottom: 2rem !important;
}

.mb-6 {
  margin-bottom: 2.5rem !important;
}

.mb-7 {
  margin-bottom: 3rem !important;
}

.mb-8 {
  margin-bottom: 4rem !important;
}

.mb-9 {
  margin-bottom: 5rem !important;
}

.mb-10 {
  margin-bottom: 6rem !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

.ms-0 {
  margin-left: 0 !important;
}

.ms-1 {
  margin-left: 0.25rem !important;
}

.ms-2 {
  margin-left: 0.5rem !important;
}

.ms-3 {
  margin-left: 1rem !important;
}

.ms-4 {
  margin-left: 1.5rem !important;
}

.ms-5 {
  margin-left: 2rem !important;
}

.ms-6 {
  margin-left: 2.5rem !important;
}

.ms-7 {
  margin-left: 3rem !important;
}

.ms-8 {
  margin-left: 4rem !important;
}

.ms-9 {
  margin-left: 5rem !important;
}

.ms-10 {
  margin-left: 6rem !important;
}

.ms-auto {
  margin-left: auto !important;
}
.menu-sub {
    margin: 0 auto;
    display: flex;
    flex-flow: column wrap;
    width: 80rem;
    max-width: 100%;
}

.btn-menu {
    position: relative;
    cursor: pointer;
    background: var(--menu-bg);
    border: none;
    padding: 2rem;
    color: var(--menu-font-color);
    font-weight: 700;
    border-top: 0.1rem solid var(--menu-border);
    border-bottom: 0.1rem solid var(--menu-border);
    transition: background 1s;
	
}

.btn-menu:hover {
    background: var(--menu-bg-hover);
    color: var(--menu-font-hover);
}

.btn-menu:focus {
    outline: none;
    box-shadow: none;
}

.selected {
    background: var(--menu-bg-selected);
    color: var(--menu-font-hover);
}

.selected::before {
    position: absolute;
    left: 0;
    top: 0;
    content: "";
    height: 5.6rem;
    width: 0.5rem;
}

/*  End Menu Buttons  */

.clean-button-mps, a.clean-button-mps {
	margin: 1em 0;
	background-color: #da1a32;
	color: #fff;
	text-decoration:none;
	text-transform: uppercase;
	border: 1px solid #da1a32;
}
.clean-button-mps:hover, .clean-button-mps:focus {
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#1a000000', GradientType=0);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0,0,0,.05)), to(rgba(0,0,0,.1)));
	background-image: -webkit-linear-gradient(transparent, rgba(0,0,0,.05) 40%, rgba(0,0,0,.1));
	background-image: -moz-linear-gradient(top, rgba(0,0,0,.05) 0, rgba(0,0,0,.1));
	background-image: -ms-linear-gradient(transparent, rgba(0,0,0,.05) 40%, rgba(0,0,0,.1));
	background-image: -o-linear-gradient(transparent, rgba(0,0,0,.05) 40%, rgba(0,0,0,.1));
	background-image: linear-gradient(transparent, rgba(0,0,0,.05) 40%, rgba(0,0,0,.1));
	background-color:#b41125;
	text-decoration: none;
	color: #fff;
	border: 1px solid #b41125;
}
.bg-blue-gradient {
    background: linear-gradient(180deg, var(--bs-bg-blue), var(--bs-blue-text-emphasis) 47.92%, var(--bs-bg-blue));
}

.text-blue {color: var(--bs-blue);}
.btn.btn-white:hover {
    color: var(--bs-primary);
    background-color: #f1f5f9;
    border-color: #f1f5f9;
}
.bg-blue {--bs-bg-opacity: 1;background-color: rgba(var(--bs-blue-rgb), var(--bs-bg-opacity));}
.bg-purple {--bs-bg-opacity: 1;background-color: rgba(var(--bs-purple-rgb), var(--bs-bg-opacity));}
.text-purple {--bs-text-opacity: 1;color:rgba(var(--bs-purple-rgb), var(--bs-text-opacity));}

.bg-opacity-10 {
    --bs-bg-opacity: 0.1;
}
.bg-opacity-20 {
    --bs-bg-opacity: 0.2;
}


/*  accordion  */
.accordion {
  font-family: Arial, "sans-serif";
	/*font-family: 'Baskerville', "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"; */
  background-color: #ec3b48;
  color: #fff;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
}

/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
.active, .accordion:hover { 
  color: #fff;
  background-color: #959595;
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  padding: 0 18px;
  background-color: white;
  display: none;
  overflow: hidden;
}

.accordion:after {
  content: '\02795'; /* Unicode character for "plus" sign (+) */
  font-size: 13px;
  color: #fff;
  float: right;
  margin-left: 5px;
}

.active:after {
  content: "\2796"; /* Unicode character for "minus" sign (-) */
}

/*  accordion  */

/* Slider */

.slick-slide {
    margin: 0px 20px;
}

.slick-slide img {
    width: 100%;
}

.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}
/* Slider */

.form-mps-copy{
	width: 30%;
	padding: 14% 4%;
	margin: auto;
	float: left;
	text-align: left;
	vertical-align: middle;
	background-image: url(/navistar/images/form-color.png);
    background-repeat: no-repeat;
    background-position: 0px center;
}

@media screen and (min-width: 10px) and (max-width: 989px) {
	
	.form-mps-copy{
	width: 96%;
	padding: 2em 2%;
	margin: auto;
	float: none;
	text-align: left;
	vertical-align: middle;
	background-image: url(/navistar/images/form-color.png);
	background-color: #000;
    background-repeat: no-repeat;
	background-position: center;
}	
}
@media screen and (min-width: 10px) and (max-width: 767px) {
.row {
 display: inline-block;
  width: 100%;
  float: none;
  margin-bottom: 3%;
}

.row img {
  width: 100%;
  height: auto;
}

.text {
  max-width: 100%;
}
}
.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
  --bs-gutter-x: 2.5rem;
  --bs-gutter-y: 0;
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container-sm, .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container-md, .container-sm, .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container-lg, .container-md, .container-sm, .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1320px;
  }
}
@media (min-width: 768px) {
  .col-md {
    flex: 1 0 0%;
  }
  .row-cols-md-auto > * {
    flex: 0 0 auto;
    width: auto;
  }
  .row-cols-md-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }
  .row-cols-md-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }
  .row-cols-md-3 > * {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .row-cols-md-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }
  .row-cols-md-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }
  .row-cols-md-6 > * {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
  }
  .col-md-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }
  .col-md-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }
  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }
  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }
  .col-md-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }
  .col-md-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }
  .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }
  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }
  .col-md-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }
  .col-md-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }
  .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }
  .offset-md-0 {
    margin-left: 0;
  }
  .offset-md-1 {
    margin-left: 8.33333333%;
  }
  .offset-md-2 {
    margin-left: 16.66666667%;
  }
  .offset-md-3 {
    margin-left: 25%;
  }
  .offset-md-4 {
    margin-left: 33.33333333%;
  }

  .offset-md-5 {
    margin-left: 41.66666667%;
  }
  .offset-md-6 {
    margin-left: 50%;
  }
  .offset-md-7 {
    margin-left: 58.33333333%;
  }
  .offset-md-8 {
    margin-left: 66.66666667%;
  }
  .offset-md-9 {
    margin-left: 75%;
  }
  .offset-md-10 {
    margin-left: 83.33333333%;
  }
  .offset-md-11 {
    margin-left: 91.66666667%;
  }
  .g-md-0,
  .gx-md-0 {
    --bs-gutter-x: 0;
  }
  .g-md-0,
  .gy-md-0 {
    --bs-gutter-y: 0;
  }
  .g-md-1,
  .gx-md-1 {
    --bs-gutter-x: 0.25rem;
  }
  .g-md-1,
  .gy-md-1 {
    --bs-gutter-y: 0.25rem;
  }
  .g-md-2,
  .gx-md-2 {
    --bs-gutter-x: 0.5rem;
  }
  .g-md-2,
  .gy-md-2 {
    --bs-gutter-y: 0.5rem;
  }
  .g-md-3,
  .gx-md-3 {
    --bs-gutter-x: 1rem;
  }
  .g-md-3,
  .gy-md-3 {
    --bs-gutter-y: 1rem;
  }
  .g-md-4,
  .gx-md-4 {
    --bs-gutter-x: 1.5rem;
  }
  .g-md-4,
  .gy-md-4 {
    --bs-gutter-y: 1.5rem;
  }
  .g-md-5,
  .gx-md-5 {
    --bs-gutter-x: 2rem;
  }
  .g-md-5,
  .gy-md-5 {
    --bs-gutter-y: 2rem;
  }
  .g-md-6,
  .gx-md-6 {
    --bs-gutter-x: 2.5rem;
  }
  .g-md-6,
  .gy-md-6 {
    --bs-gutter-y: 2.5rem;
  }
  .g-md-7,
  .gx-md-7 {
    --bs-gutter-x: 3rem;
  }
  .g-md-7,
  .gy-md-7 {
    --bs-gutter-y: 3rem;
  }
  .g-md-8,
  .gx-md-8 {
    --bs-gutter-x: 4rem;
  }
  .g-md-8,
  .gy-md-8 {
    --bs-gutter-y: 4rem;
  }
  .g-md-9,
  .gx-md-9 {
    --bs-gutter-x: 5rem;
  }
  .g-md-9,
  .gy-md-9 {
    --bs-gutter-y: 5rem;
  }
  .g-md-10,
  .gx-md-10 {
    --bs-gutter-x: 6rem;
  }
  .g-md-10,
  .gy-md-10 {
    --bs-gutter-y: 6rem;
  }
}
.background-containernew {
    background-image: url('https://www.oriontalent.com/site/images/hp-military-recruitment-rpo.jpg');
    background-size: cover;
    background-position: center;
    height: 90vh; /* Adjust as needed */
    position: relative;
}

.background-containernew2 {
	background-color: #257ba0;
    background-position: center;
    position: relative;
}
.content-1-4 {
	width: 23%;
	padding: 1%;
	float: left;
	margin-bottom: 2%;
}
/* 3-column layout start */
/* container */
.padded-boxes {
    display:flex;
    flex-wrap:wrap;
    gap:2rem;
}

/* boxes */
.padded-boxes > * {
    width:100%;
    background:#fff;
    border-radius:.5rem;
}

/* headings */
.padded-boxes .heading {
    background:#003049;
    margin:0;
    padding:1rem;
    border-top-left-radius:.5rem;
    border-top-right-radius:.5rem;
}

.padded-boxes li.tick:before {
    content: '✓ ';
    color:#257ba0;
    font-weight:bold;
    font-size:1.3em;
}

/* padded content */
.padded-boxes .padded {
    padding:2rem 1rem;
}

.bullets-nb2 {
	padding: 0;
	padding-top: 1em;
	line-height: 1.3em;
	list-style-type: none;
	font-size:100%;
}
.bullets-nb2  ul{
	margin: 0;
}
.bullets-nb2  li{
	margin: 0;
	list-style-type: none;
	padding-right: 1em;
	padding-bottom: 1.5em;
	padding-left: 0;
}
.ot-img-2-box {
  position: relative;
  width: 100%;
  padding-bottom:100px;
  margin-bottom: .5em;
  overflow: hidden;
	}
.ot-img-2-box-img{
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  vertical-align: middle !important;
	}
.ot-img-3-box {
  position: relative;
  width: 100%;
  padding-bottom:100px;
  margin-bottom: .5em;
  overflow: hidden;
	}
.ot-img-3-box-img{
  position: absolute;
  width: 100%;
  height: 100%;
  overflow: hidden;
  vertical-align: middle !important;
	}

/* tablet breakpoint */
@media (min-width:768px) {
    .padded-boxes > * {
        width:calc((100% - 4rem) / 3);
    }
}
/* 3-column layout end */

@media (max-width: 800px) {
.background-containernew {
height: 100vh; /* Adjust as needed */
}
}

@media (max-width: 768px) {
	.background-containernew {
	height: 90vh; /* Adjust as needed */
}
}
@media only screen and (min-width: 2001px){
.ot-img-2-box {
  padding-bottom:250px;
	}
.ot-img-3-box {
  padding-bottom:400px;
	}
}
@media only screen and (min-width: 1501px) and (max-width: 2000px){
.ot-img-2-box {
  padding-bottom:200px;
	}
.ot-img-3-box {
  padding-bottom:350px;
	}
}

@media only screen and (min-width: 1301px) and (max-width: 1500px){
.ot-img-2-box {
  padding-bottom:150px;
	}
.ot-img-3-box {
  padding-bottom:300px;
	}
}

@media only screen and (min-width: 801px) and (max-width: 1300px){
.ot-img-2-box {
  padding-bottom:100px;
	}
.ot-img-3-box {
  padding-bottom:250px;
	}
}

@media only screen and (min-width: 768px) and (max-width: 800px){
	.content-1-4 {
	width: 100%;
	float: left;
}
.ot-img-2-box {
  padding-bottom:100px;
	}
.ot-img-3-box {
  padding-bottom:250px;
	}
}

@media only screen and (min-width: 321px) and (max-width: 767px){
	.content-1-4 {
	width: 100%;
	float: left;
}
.ot-img-2-box {
  padding-bottom:200px;
	}
.ot-img-3-box {
  padding-bottom:400px;
	}
}

@media only screen and (min-width: 0px) and (max-width: 320px){
	.content-1-4 {
	width: 100%;
	float: none;
	margin-bottom: 5%;
}
.ot-img-2-box {
  padding-bottom:250px;
	}
.ot-img-3-box {
  padding-bottom:440px;
	}
}
	

