﻿@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
/*General Styles*/
a.btn:hover {
   text-decoration: none;
}
.pac {
   font-family: 'IBM Plex Sans', 'Arial Narrow', Arial, sans-serif;
   margin-left: calc(-.5 * var(--bs-gutter-x));
   margin-right: calc(-.5 * var(--bs-gutter-x));
   overflow: hidden;
   font-size: clamp(13px, calc(.7rem + .5vw), 18px);
   line-height: 150%;
}


   .pac h1, .pac h2, .pac h3, .pac h4, .pac h5 {
      font-weight: 700;
   }
  .pac h1{
   font-size:2em;
   line-height:1.5em;
  }
  .pac h2 {
   font-size: 1.5em;
   line-height: 1.5em;
  }
  .pac h3 {
   font-size: 1.25em;
   line-height: 1.5em;
  }
  .pac h4 {
   font-size: 1em;
   line-height: 1.5em;
  }
   .pac .dotted {
   border-bottom:4px dotted #666;
   }
h1.pac sup, .pac h1 sup {
  vertical-align: super;
  font-size: .25em;
  line-height: .2em;
}
   .fa-ul.greenCheck i{
     color:var(--bs-success);
   }
.pac .mixedHeader {
   font-family: 'Times New Roman',Times,serif;
   line-height: 1.2em;
   font-weight: 400;
   flex: 0 1 min-content;
   padding-bottom:.5em;
}
   .pac .mixedHeader .emphasis {
      font-family: 'IBM Plex Sans',sans-serif;
      font-size: 3em;
      line-height: .85em;
      font-weight: 900;
   }
.pac .mixedHeader.shadowText .emphasis{
  text-shadow:.06em .06em 0 #333;
}
   .pac .mixedHeader.shadowText {
      text-shadow: .07em .07em 0 #333;
   }


ul.gridList {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(20ch,1fr));
  column-gap: 3ch;
  row-gap:1em;
  text-align:left;
}
ul.fa-ul.gridList {
   margin-left: 3ch;

}
ul.flexList {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
}
ul.flexList .fa-li{
  position:relative;
}
.pac .mainContent {
   position: -webkit-sticky;
   position: sticky;
   z-index: 0;
   padding: 1em 0 1em 0;
   margin: 0;
   background-color: #fff;
}
.pac .defaultGrid{
   display: grid;
   grid-column-gap: 1em;
   align-content: space-around;
   grid-auto-columns: min-content;
   grid-auto-rows: auto;
   grid-template-columns: repeat(auto-fit,minmax(350px, 1fr));
}

  /*Component Styles*/
.carousel {
   position: relative;
}

   .carousel .carousel-item img, .carousel-inner > .carousel-item > a > img, div img.slide {
      background-size: 400%;
      height: 0;
      width: 100%;
      padding-top: 75%;
      overflow: hidden;
      background-repeat: no-repeat;
   }

.screenShots .carousel-item {
   padding-bottom: 6em;
   text-align: center;
}

   .screenShots .carousel-item img {
      padding-top: 60%;
      width: 80%;
      margin: auto;
   }

.carousel .carousel-item .carousel-caption {
   background-color: rgba(239,239,239,.8);
   color: #263f6a;
}

div img.slide.slide2 {
   background-position-x: 33.33%;
   background-position-y: 0;
}

div img.slide.slide.slide3 {
   background-position-x: 66.6%;
   background-position-y: 0;
}

div img.slide.slide.slide4 {
   background-position-x: 100%;
   background-position-y: 0;
}

div img.slide.slide5 {
   background-position-x: 0;
   background-position-y: 100%;
}

div img.slide.slide6 {
   background-position-x: 33.33%;
   background-position-y: 100%;
}

div img.slide.slide7 {
   background-position-x: 66.66%;
   background-position-y: 100%;
}

div img.slide.slide8 {
   background-position-x: 100%;
   background-position-y: 100%;
}
  /*Billboard Component Styles*/
  /*Billboard Layout Styles*/
.billboard {
   position: -webkit-sticky;
   position: sticky;
   z-index: 0;
   top: 0px;
   background-image: radial-gradient(farthest-corner at 10% 10%,#234f6a,#59aab4);
   background-size: cover;
   font-weight: bold;
   padding-left: 1em;
   padding-right: 1em;
}
.billboard .billboardContent {
 
  padding:0 0 0 0;
  margin-left: auto;
  margin-right: auto;
  background-repeat: no-repeat;
  background-position: top right;
  display: flex;
  justify-content: space-between;
  align-content: stretch;
  min-height:45vw;
  column-gap:1em;

}
.billboard .billboardText {
  display: flex;
  flex: 0 0 100%;
  flex-direction: column;
  justify-content: center;
  z-index:1;
}
  .billboardText .greenCheck li {
      font-weight:400;
   }
.billboardText .qLinks {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-around;
}
.qLinks > * {
   flex:1 1 50%;
   min-width:135px;
}
.billboard .billboardImg {
   position: absolute;
   bottom: 0;
   right: 0;
   opacity: .15;
   width: 70%;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
}
  .billboard .billboardImg>:first-child {
   display:block;
   width: 100%;

  }
   .billboard .billboardImg img{
      position: relative;
      width: 100%;
      aspect-ratio: 1/1.5;
      background-size: contain;
      background-position: bottom right;
      background-repeat: no-repeat;
   }

  /*Billboard Text Styles*/
.billboard h1 {

   margin-bottom: 0;
   color: #fff;
   font-weight: normal;
}
/*EOS Billboard Styles*/


/*Feature Section Component*/
.gray .ftBannerText {
  background-color: #999;
  color: #333;
}
.yellow .ftBannerText {
   background-color: #fabb50;
   color: #666;
}
.prGreen .ftBannerText {
   background-color: #05261f;
   color: #fefefe;
}
.white .ftBannerText {
   background-color: white;
   color: #666;
}
.ltGray .ftBannerText {
   background-color: #efefef;
   color: #666;
}
.ftSection {
  clear: both;
  
}

.ltgray .ftBannerText {
  background-color: #efefef;
  color: #666;
}

.ftBannerText {
   position: relative;
   flex: 0 0 100%;
   padding-left: 3em;
   padding-right: 3em;
   display:flex;
   align-items:center;
}
  .ftBannerText>div{
  position: relative;
  padding: 1em 0 1em 0em;
  flex:0 0 100%;
}
  .ftBannerText div {
   position: relative;
   z-index: 1;
  }
.ftSection .ftBannerImg {
  display: none;
}

.ftSectionBanner {
   position: relative;
   display: flex;
   justify-content: space-between;
   min-height: 250px;
}

.ftSection .expandText {
  display: none;
}

.ftSection .collapsed .expandText {
  display: inline;
}

.ftSection .collapsed .hideText {
  display: none;
}

.ftSectionBody {
  padding: 1em 0 0 1em;
}

/*jplist Styles*/
.jplist-grid-wrap>nav{
  display:flex;
  justify-content:space-around;
}
ul.pagination {
margin-bottom:0px;
}
.paginationNav {
 display:flex;
 column-gap:1em;
}
.filter-controls {
   display: flex;
   justify-content: space-between;
   padding-top: 1em;
   flex-wrap:wrap;
}
.textSearch {
  width:300px;
}
.jplist-dd-content.jplist-dd-opened {
  display: block
}

  .jplist-dd-content.jplist-dd-opened a {
   display: block;
   padding-left: 1em;
   padding-right: 1em;
   padding-bottom: .5em
  }

.jplist-dd.jplist-dd-opened {
  position: relative
}
.jplist-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 1em;
  align-items: stretch;
  margin-bottom:1em;
  padding-top:1em;
}
  .jplist-grid>div {
   display: flex;
   justify-content:stretch;
  }
  .jplist-grid div.card {
   width:100%;
   min-height:150px;
  }
  .jplist-grid .card-header {
   display: flex;
   justify-content: space-between;
   align-items:baseline;
  }
.jplist-grid .card-body {
  display: flex;
  justify-content: space-between;
  align-content:space-between;
  flex-direction:row;
  flex-wrap:wrap;
}
   .jplist-grid .card-body .card-title {
      font-weight:400;
      flex: 0 0 100%;
   }
   .jplist-grid .card-body .card-text {
      flex:0 0 100%;
   }
   .jplist-grid .card-category {
      align-self:self-end;
      margin-bottom:0;
      color:#ccc;
      font-size:.85em;
   }
.jplist-grid .card-header a {
   height: fit-content;
   flex-shrink: 0;
}
   .jplist-grid div.card .card-footer {
      display: flex;
      justify-content: space-between;
   }
   .jplist-grid .card-footer .thumbnailBtn{
      
      margin-left:auto;
   }
      nav.jplist-pagectrl {
         display: flex;
         justify-content: space-around;
         column-gap: 1em;
         row-gap: 1em;
         flex-wrap: wrap;
      }
nav .jpPages {
   order:1;
   display:flex;
   column-gap:1em;
}
#fptCourses .courseLoc {
   width: 100%;
}
#sstCourses .courseDate {
   width:100%;
}

   nav.jplist-pagectrl .dropdown {
   order:2;
   }
   /*EOS Feature Section Component*/
   /*Offset Banner Component Styles*/
.OSBCtrl {
   --osb-margin-size: 15px;
   display: flex;
   flex-direction: column;
}

   .OSBCtrl.hangLeft {
      align-items: flex-end;
   }

   .OSBCtrl.hangRight {
      align-items: flex-start;
   }

.OSBWrapper {
   margin-top: 1vw;
   margin-bottom: 4vw;
   display: flex;
   flex-direction: column;
   justify-content: end;
   width:100%;
}
.OSBContent {
   display: flex;
   column-gap: 2em;
   row-gap: 1em;
   min-height: 250px;
   position: relative;
   align-items: center;
   justify-content: space-between;
   z-index: 1;
}


.OSBText {
   padding: 2em 0 2em 0;
   flex: 1 1;
}

.OSBanner {
   position: relative;
   width: 100%;
   display: flex;
   justify-content: end;
}
.OSBCtrl.hangRight {
   margin-left: 0
}

.OSBCtrl.hangLeft {
   margin-right: calc(var(--bs-gutter-x)*.5)
}

.hangLeft .OSBWrapper {
   padding-right: 50px;
}

.hangRight .OSBWrapper {
   padding-left: 50px;
}

.hangRight .OSBanner:before, .hangLeft .OSBanner:after {
   position: absolute;
   height: 100.5%;
   content: "";
   background: inherit;
   top: 0;
   right: 0;
   left: 0;
   bottom: 0;
   transform: skewX(6deg);
}

.hangRight .OSBanner:before {
   transform-origin: bottom left;
}

.hangLeft .OSBanner:after {
   transform-origin: bottom right;
   right: -50px
}

.hangRight .OSBContent {
}

.hangLeft .OSBContent {
}
.OSBAddContent {
   transition: all 1s;
   opacity: 1;
   padding-bottom: 1em;
   padding-right: 30px;
}
.hangLeft .OSBAddContent {
   padding-left: calc(var(--bs-gutter-x) * .5);
   padding-right:0;
   margin-left: 0;
   margin-right: 0;
}

.hangRight .OSBAddContent {
   padding-left: calc(var(--bs-gutter-x) * .5);
   padding-right: calc(var(--bs-gutter-x) * .5);
   margin-left: 0;
   margin-right: 0;
}

.hangLeft .OSBLink {
   margin-left: auto;
   margin-right: -50px;
}

   .OSBContent .OSBImg {
      display: none;
   }


.OSBText .OSBTitle {
   display:flex;
   align-items:center;
   column-gap:1em;

}
.OSBTitle h2 {
   font-size:1.2em;
   flex:0 1;
}
.OSBTitle h2.mixedHeader span.emphasis {
   font-size: 2em;
}


button.OSBLink {
   display: flex;
   min-width: 300px;
   border-radius: 0;
   flex-basis: min-content;
   justify-content:center;
   align-self:flex-start;
}



.OSBAddContent h3 {
   color: #666;
}



   .OSBAddContent .jplistCtrls {
      display: flex;
      justify-content: space-between;
      flex-wrap:wrap;
      row-gap:1em;
      column-gap:1em;
   }

   .OSBAddContent h4 {
      font-size: .9em;
   }



.OSBCtrl button.OSBLink, .OSBCtrl button.OSBLink:active, .OSBCtrl .OSBanner {
   color: #fff;
}
   .OSBCtrl button.OSBLink:hover {
      text-decoration:underline;
   }

   .OSBCtrl.ltBlueTheme .OSBanner {
      background-color: #7cbce7;
   }

.OSBCtrl.ltBlueTheme button.OSBLink {
   background-color: #2e6c96;
}

.OSBCtrl.dkBlueTheme .OSBanner {
   background-color: #00455f;
}

.OSBCtrl.dkBlueTheme button.OSBLink {
   background-color: #023244;
}
.OSBCtrl.ltOrgTheme .OSBanner {
   background-color: #da9427;
}

.OSBCtrl.ltOrgTheme button.OSBLink {
   background-color: #a86b0d;
}

.OSBCtrl.dkOrgTheme .OSBanner {
   background-color: #e46d32;
}

.OSBCtrl.dkOrgTheme button.OSBLink {
   background-color: #aa4a03;
}

.OSBCtrl.altBlueTheme .OSBanner {
   background-color: #297694;
}

.OSBCtrl.altBlueTheme .OSBLink a, .OSBAddContent.altBlueTheme .lead, .OSBAddContent.altBlueTheme h4 {
   color: #399594;
}
/*EOS OSB Component */
.pac .twoColumn {
   display: grid;
   grid-column-gap: 1em;
   grid-row-gap: 1em;
   grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
}

@media screen and (max-width:576px) {
   .pac .dropdown-item {
      white-space: break-spaces;
   }

   .pac .dropdown-menu {
      width: 80vw
   }
}
   @media screen and (min-width:576px) {
      nav.jplist-pagectrl {
         justify-content: start;
      }

      nav .jpPages {
         order: 0;
      }

      nav.jplist-pagectrl .dropdown {
         order: 0;
         margin-left: auto;
      }
   }

   @media screen and (min-width:768px) {

      .mainContent > .container-md {
         padding-top: 1em;
         padding-left: 0;
         padding-right: 0;
      }
      /*Component Styles*/
      /*Billboard Component Styles*/
      .billboard .billboardContent {
         min-height: initial;
      }

      .billboard .billboardText {
         display: flex;
         flex: 1 0 50%;
      }

      .billboard .billboardImg {
         position: static;
         flex: 1 0 50%;
         opacity: 1;
      }


      /*EOS Billboard Component*/

      /*Feature Section Component*/
      .ftSection .ftBannerImg {
         display: flex;
         flex: 1 1 34%;
        
      }
      .ftSection .ftBannerImg img{
         background-repeat: no-repeat;
         background-size: cover;
         background-position: center center;
         aspect-ratio:400/267;
         width:100%;
      }
   
      .hangRight .ftBannerText:after {
         transform-origin: top left;
         transform: skewX(-6deg);
         margin-left: 3em;
      }

      .hangLeft .ftBannerText:before {
         transform-origin: top right;
         transform: skewX(-6deg);
         margin-left: -3em;
      }

      .hangRight .ftBannerText:after, .hangLeft .ftBannerText:before {
         position: absolute;
         width: 100%;
         height: 99.99%;
         content: "";
         background: inherit;
         top: 0;
         right: 0;
         left: 0;
         bottom: 0;
      }

      .hangLeft .ftSectionBanner {
         flex-direction: row-reverse;
      }

      .hangLeft .ftBannerText {
         padding-left: 0;
      }

      .ftBannerText {
         flex: 1 1 66%;
      }

      .hangRight .OSBContent {
         margin-left: -50px;
         margin-right: auto;
         padding-left: 80px;
      }

      .hangLeft .OSBContent {
         margin-right: -50px;
         padding-left: 0;
         padding-right: 50px
      }

      .OSBCtrl .OSBAddContent {
         padding-left: 50px;
      }
      /*jplist Styles*/

      .jplist-grid {
         grid-template-columns: repeat(auto-fit,minmax(325px,1fr));
      }

         .jplist-grid div.card {
            min-height: 300px;
            aspect-ratio: 1.5/1;
            overflow: visible
         }

      .singleItemGrid div.card {
         aspect-ratio: auto !important;
         width: 100%;
      }

      div.card:only-child {
         aspect-ratio: auto !important;
         width: 100%;
      }

      /*EOS jplist Styles*/
      .OSBCtrl {
         --osb-margin-size: calc((100vw - 720px)/2)
      }

      .OSBText .OSBTitle h2 {
         flex: 0 1 content;
      }

      .qLinks > * {
         flex: 1 1 25%;
      }
   }

   @media only screen and (min-width:992px) {
      .OSBCtrl {
         --osb-margin-size: calc((100vw - 960px)/2)
      }

         .OSBCtrl.hangRight {
            margin-left: var(--osb-margin-size);
         }

         .OSBCtrl.hangLeft {
            margin-right: var(--osb-margin-size)
         }

      .hangLeft .OSBContent {
         flex-direction: row-reverse;
      }

      .OSBWrapper {
         
         display: flex;
         flex-direction: column;
         justify-content: end;
      }
      .OSBWrapper:has(.OSBImg) {
         min-height: 415px;
      }
         .OSBContent .OSBImg {
         display: block;
         flex: 0 0 400px;
         position: relative;
         margin-top: -225px;
         margin-bottom: -25px;
         align-self: end;
      }

      .OSBImg img {
         display: block;
         background-size: 500%;
         width: 100%;
         aspect-ratio: 1/1;
         background-repeat: no-repeat;
      }

      .hangRight .OSBContent {
         padding-right: 0;
      }

      .hangRight .OSBAddContent {
         padding-right: 0;
      }

      .jplist-grid div.card {
         aspect-ratio: 2/1;
      }
   }

   @media only screen and (min-width:1200px) {
      .OSBCtrl {
         --osb-margin-size: calc((100vw - 1140px)/2)
      }
   }

   @media only screen and (min-width:1400px) {
      .OSBCtrl {
         --osb-margin-size: calc((100vw - 1320px)/2);
      }

      .OSBAddContent {
         margin-top: 10px
      }
   }