html,
body{
  color:#333;
  font-family:"Heebo", sans-serif;
  font-size:16px;
  -webkit-font-smoothing:antialiased
}
body#homepage .va-agency-bar-container{
  z-index:11;
  position:fixed;
  width:100%;
}
.container.p3-body{
  padding: 0; 
  width: 100%!important; 
  max-width: 100%!important
}
.p3-body .row,
.p3-body .vertical-center > div:first-of-type{margin:0}
.p3-body #content > .row > div{padding:24px 10% 64px}
.p3-body .vertical-center > div {
  float: none;
  display: inline-block;
  margin-left: -.5%;
  vertical-align: middle
}

.p3-body .sectionheader-container{
  padding: 24px 10% 64px;
  width: 100%
}

/* Links */
.p3-body a,
.p3-body a:link{transition:background-color .2s, color .2s}
.p3-body a:hover,
.p3-body a:focus{text-decoration:none}
.p3-body .button {
  background-color: #c47;
  border-radius: 14px; 
  border: 0; 
  color: #fff; 
  display: inline-block; 
  letter-spacing: .05em; 
  margin-top: 12px; 
  padding: 4px 16px; 
  transition: background-color .2s
}
.p3-body .button:hover{
  background-color: #b16;
  color: #fff
}
.p3-body .button:focus{color:#fff}
.p3-body a.btn.ct-container{margin:0!important}

.p3-body #skiptocontent {
  background-color: #fff; 
  border-radius: 8px; 
  box-shadow: 2px 2px 8px 0 #000; 
  font-size: 1.3em; 
  left: -9999px; 
  padding: 3px 12px; 
  position: absolute; 
  top: -9999px
}
.p3-body #skiptocontent:focus{
  left:8px; 
  top: 8px
}
.p3-body .ada-element {
  left: -9999px;
  position: absolute
}

.p3-body .vc:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle
}
.p3-body .vc > * {
  display: inline-block;
  vertical-align: middle
}

.p3-body .list-var {
  min-height: 110px;
  padding-left: 120px;
  position: relative
}
.p3-body .list-var > img {
  left: 0; 
  position: absolute; 
  width: 100px
}

.p3-body .circ {
  background-color:#c47; 
  border-radius: 50%; 
  height: 100px; 
  line-height: 100px; 
  text-align: center; 
  width: 100px
}
.p3-body .circ img{width:60px}

/* Headers */
.p3-body h1 {
  font-size: 3.3em;
  margin: 30px 0 22px
}
.p3-body h2 {
  color: #06283f; font-size: 2.2em; font-weight: 900; margin: 12px 0 0; text-transform: uppercase; }
.p3-body h2 span {
  color: #005daa; font-size: .7em; text-transform: none; }
.p3-body h3 {
  color: #005daa; font-size: 1.6em; font-weight: 700; margin: 42px 0 14px; }
.p3-body h4 {
  font-size: 1.6em; margin: 28px 0 0; }
.p3-body h5 {
  font-size: 1.4em; margin: 26px 0 0; }
.p3-body h6 { font-size: 1.3em; margin: 26px 0 0; }

/* Paragraphs & Lists */
.p3-body p { line-height: 1.5em; margin: 16px 0 6px; }
.p3-body ul, ol { margin: 16px 0 10px; }
.p3-body li { line-height: 1.4em; margin-bottom: 8px; }
.p3-body img { max-width: 100%; }
.p3-body .full-width { width: 100%; }

/* Forms */
.p3-body form { margin: 18px 0; }
.p3-body label { display: block; margin: 10px 0 8px; width: 100%; }
.p3-body input[type="text"] { margin-bottom: 8px; padding-left: 3px; width: 100%; }
.p3-body textarea { height: 80px; margin-bottom: 8px; padding: 3px 5px; resize: none; width: 100%; }
.p3-body input[type="checkbox"],
.p3-body input[type="radio"] { margin: 0 4px 0 2px; }
.p3-body input[type="checkbox"] + label,
.p3-body input[type="radio"] + label { display: inline-block; margin-right: 14px; position: relative; top: -1px; width: auto; }
.p3-body input[type="submit"],
.p3-body input[type="reset"] { background-color: #c47; border-radius: 14px; border: 0; color: #fff; letter-spacing: .05em; margin-top: 14px; padding: 4px 16px; transition: background-color .2s; }
.p3-body .button:hover,
.p3-body input[type="submit"]:hover,
.p3-body input[type="reset"]:hover{background-color:#b16}

/* Tables */
.p3-body table {
  border: 1px solid #333;
  margin: 14px 0;
  width: 100%
}
.p3-body table tr th,
.p3-body table tr td{
  border:1px solid #333; 
  padding:2px 4px
}

/* Quick Header */
#va-commonBanner{
  z-index: 90;
  position: fixed;
  width: 100%
}
.p3-body .header{
  background-color: #0b3c5d;
  background-image: linear-gradient(to bottom, #05365a, #06518e);
  color: #fff;
  padding:0 0 1rem 0;
  position: fixed;
  top: 0; 
  width: 100%; 
  z-index: 10; 
}

.p3-body #header-top{
  background-color:#00172a; 
  font-size:.9em; 
  margin-bottom:60px;
  padding:6px 20px 2px 0;
}
.p3-body #header-top img{
  height: 24px;
  margin: 0
}
.p3-body #header-top p { 
  display: inline-block; 
  margin: 0
}
.p3-body #header-top ul { 
  float: right; 
  padding-top: 1px
}
.p3-body #header-top li { 
  margin-left: 9px; 
  margin-bottom: 0; 
  padding-left: 9px
}
.p3-body #header-top li:Last-of-type{border-left:1px solid #fff}
.p3-body #header-top li a:hover{color:#22bcb9}
.p3-body .header h1 { 
  left: -9999px; 
  position: absolute; }
.p3-body .header img { 
  height: 56px; 
  margin-left: 22px; 
  margin-bottom: 16px
}
#h1-logo-ppp{margin-top:-10px}
.p3-body .header .nav { 
  float: right; 
  top: 0; 
  padding: 17px 40px 0 0; 
  right: 0
}
.p3-body .header ul { 
  margin: 0; 
  padding: 0; }
.p3-body .header li { 
  display: inline-block; 
  margin-left: 32px; }
.p3-body .header li a { 
  color: #fff; 
  display: block; 
  padding: 0 4px; 
  position: relative; 
  filter:drop-shadow(0px 0px 35px black);}
.p3-body .header .nav li a:before { 
  background-color: #22bcb9; 
  content: ""; 
  height: 0; 
  left: 0; 
  margin-top: -9px; 
  position: absolute; 
  transition: height .3s;  
  width: 100%; }
.p3-body .header .nav li a:hover:before{ height: 5px}
.p3-body .header .nav li span.currentbranch2:before { 
  height: 5px!important;
  background-color: #22bcb9; 
  content: ""; 
  height: 0; 
  left: 0; 
  margin-top: -9px; 
  position: absolute; 
  width: 100%;  }
.p3-body nav li .currentbranch1 {
  color: #0B3C5D;
    padding: 10px 15px;
    font-weight: bold;
  display:block}
.menu-opened .p3-body .header .nav li span.currentbranch2 {color:#22bcb9}
.menu-opened .p3-body .header .nav li span.currentbranch2:before{ display:none;}
.menu-opened .p3-body .header .nav li span.currentbranch2{
  border-bottom: 1px solid #06283f;
    color: #06283f;
    padding: 5px 5px 4px;
  display:block
}
.p3-body .header .nav li span.currentbranch2 {
  font-weight:bold;
  color: #22bcb9
}
.p3-body .header li a:hover {
  color: #22bcb9; 
  background-color:transparent !important
}
.p3-body .header li {position:relative}
.p3-body .header li ul {position:absolute;top:30px;max-height:0px;overflow:hidden;
  /** -webkit-transition: all 300ms ease-in-out; -moz-transition: all 300ms ease-in-out; -o-transition: all 300ms ease-in-out; **/
  transition: all 300ms ease-in-out;
  background-color:white}
  .p3-body .header li:hover ul.multilevel-linkul-0 {max-height:1000000px;height:auto;}
  .p3-body .header li ul.multilevel-linkul-0 li {margin:0px;border-bottom:#dedede solid 1px;display:block}
  .p3-body .header li ul.multilevel-linkul-0 li a {color:#0b3c5d;
    padding:10px 15px;font-weight:bold}
  .p3-body .header li ul.multilevel-linkul-0 li:hover a:before {display:none}
  .p3-body .header li ul.multilevel-linkul-0 li:hover a {color:#22bcb9}
  .p3-body #mobile-menu { 
    background-color: transparent; border: 0; cursor: pointer; display: none; padding: 0 4px; }
 .menu-opened .p3-body ul.multilevel-linkul-0 {max-height:10000px;height:auto;top:30px!important;left:0px;}
  .p3-body .mapframe {display:none;}

/* Image Slideshow */
.p3-body .image-slideshow { 
  margin-top: 56px; position: relative; width: 100%; }
.p3-body .image-slideshow > button { 
  background: transparent; border: 0; color: #fff; position: absolute; transition: background .2s, margin .3s; z-index: 3; }
.p3-body .image-slideshow > button span { 
  right: -9999px; position: absolute; }
.p3-body .image-slideshow > button:hover { margin-left: -8px; }
.p3-body .slideshow-trigger { 
  border-radius: 24px; height: 38px; line-height: 38px; margin: 12px; padding: 0; width: 38px; }
.p3-body .slideshow-move { font-size: 1.6em; left: 16%; margin-top: -25px; padding: 0 8px; position: relative; top: 38%; transform: rotate(-180deg); z-index: 2; }
.p3-body .slideshow-move img { width: 90px; }
.p3-body .slideshow-move.next { left: auto; right: 16%; transform: rotate(-0deg); }
.p3-body .slideshow-move.next span { right: auto; left: -9999px; }
.p3-body .slideshow-move.next:hover { margin-right: -8px; }
.p3-body .image-slideshow-slides { overflow: hidden; padding: 32px 0 18px; position: relative; }
.p3-body .image-slideshow-slides > div { box-shadow: 0 0 18px -4px #333; margin-top: 0; opacity: 0; overflow: hidden; position: absolute; transition: opacity 0s; }
.p3-body .image-slideshow-slides > div.active { height: 400px; margin-left: 20%; margin-top: 18px; opacity: 1; position: relative; top: 0; transition: margin .3s, opacity .25s; width: 60%; z-index: 1; }
.p3-body .image-slideshow-slides > div.prev-one { height: 330px; margin-left: 1%; opacity: 1; position: absolute; top: 0; transition: opacity .25s; width: 40%; }
.p3-body .image-slideshow-slides > div.next-one { height: 330px; margin-left: 59%; opacity: 1; position: absolute; top: 0; transition: opacity .25s; width: 40%; }
.p3-body .image-slideshow-slides > div img { left: -35%; max-width: 8000%; position: relative; width: 170%; }
.p3-body .image-slideshow-slides > div > div { 
  color: #fff; display: none; padding: 0 52px; position: absolute; text-align: center; bottom: 34px; width: 100%; }
.p3-body .image-slideshow-slides > div > div span { font-size: 2.4em; font-weight: 700; }
.p3-body .image-slideshow-slides > div > div button { background: #fff; border: 2px solid #004680; border-radius: 60px; color: #004680; display: block; font-size: .9em; margin: 15% auto 0; padding: 5px 10px 4px; transition: background .2s; width: 120px; }
.p3-body .image-slideshow-slides > div > div button:hover { background: #a8e9e8; }
.p3-body .image-slideshow-slides > div > div a { 
  background: #fff; border: 2px solid #004680; border-radius: 60px; color: #004680; display: block; font-size: .9em; margin: 15% auto 0; padding: 5px 10px 4px; transition: background .2s; width: 120px; }
.p3-body .image-slideshow-slides > div > div a:hover { background: #a8e9e8; }
.p3-body .image-slideshow-slides > div.active > div { display: block; }
.p3-body .caption { bottom: 20px; color: #fff; font-size: 1.1em; position: absolute; text-align: center; width: 100%; z-index: 1; }

.p3-body #img-slideshow-buttons { list-style-type: none; padding: 0; text-align: center; }
.p3-body #img-slideshow-buttons li { display: inline-block; }
.p3-body #img-slideshow-buttons li button { background: #747d84; border: 0; border-radius: 50%; height: 12px; margin: 0 4px; transition: .2s; width: 12px; }
.p3-body #img-slideshow-buttons li button.active { background: #004680; height: 18px; width: 18px; }

.p3-body #content {padding-top: 117px;}
.p3-body #subpage-header { background-position: center; background-size: cover; height: 360px; overflow: hidden; position: relative; }
.p3-body #subpage-header.image-about { background-image: url("../images/Interstate95_CowanBoulevardOverpass_FacingNorth.jpg"); }
.p3-body #subpage-header.image-project { background-image: url("../images/DTT-Aerial-View[1].jpg"); }
.p3-body #subpage-header.image-innovation-bg { background-image: url("../images/24402226191_86e5b19f7d_o.jpg"); }
.p3-body #subpage-header.image-pe { background-image: url("../images/SouthIsl_04_2022.07.14_11.16.jpg"); }
.p3-body #subpage-header.image-pe2 { background-image: url("../images/52536431508_2983ed0fda_o.jpg"); background-position: top; }
.p3-body #subpage-header.image-careers { background-image: url("../images/DTT-East-Bound-8-15-2017.jpg"); }
.p3-body #subpage-header.image-contact { background-image: url("../images/48545527591_3c2901557b_o.jpg"); }
.p3-body #subpage-header.image-resources-bg { background-image: url("../images/8122662701_4e7d475bb9_o.jpg"); }
.p3-body #subpage-header.image-team { background-image: url("../images/Old-Highway-Building-DSC02148-(2).jpg"); background-position: top; }
.p3-body #subpage-header:after { background: #fff; box-shadow: 0 0 18px 6px #111; content: ""; height: 30%; left: -10%; position: absolute; top: 90%; transform: rotate(2deg); width: 120%; }
.p3-body #subpage-header > div { background: #fff; display: inline-block; margin-top: 74px; padding: 14px 32px; }
.p3-body #subpage-header > div img { height: 110px; }

/* Quick Footer */
.p3-body .footer { background-color: #06283f; color: #fff; margin-top: 32px; }
.p3-body .footer nav { background-color: #06518e; background-image: linear-gradient(to right, #05365a, #06518e); overflow: auto; }
.p3-body .footer nav a { color: #fff; float: left; font-size: 1.1em; font-weight: 700; padding: 11px 0 9px; position: relative; text-align: center; text-transform: uppercase; width: 25%; }
.p3-body .footer nav a:hover { color: #22bcb9; }
.p3-body .footer nav a:after { background: #fff; content: ""; height: 12px; left: 100%; margin-top: -6px; position: absolute; top: 50%; width: 1px; }
.p3-body .footer nav a:last-of-type:after { display: none; }
.p3-body #footer-middle { font-size: .9em; padding: 18px 0; }
.p3-body #footer-middle div { display: inline-block; text-align: center; vertical-align: middle; width: 25%; }
.p3-body #footer-middle img { height: 54px; }
.p3-body #footer-middle p { display: inline-block; line-height: 1.4em; margin: 0; vertical-align: middle; width: 70%; }
.p3-body #footer-bottom { background: #00172a; font-size: .9em; padding: 14px; text-align: center; }
.p3-body #footer-bottom p { margin: 0; }

.p3-body #intro-screens { height: 100%; }
#homepage .p3-body #background-video-container { height: 100%; max-height: 8000px; position: fixed; top: 0; width: 100%; }
#homepage .p3-body .header { background: none; position: fixed; }
#homepage .p3-body .header > img:last-of-type { left: -20%; opacity: 0; position: relative; }

.p3-body #current-projects { background-size: cover; background-position: center; color: #fff; padding: 78px 0; }

.p3-body #first-screen { height: 100%; position: fixed; text-align: center; top: 0; width: 100%; }
.p3-body #first-screen h2 { color: #fff; display: inline-block; font-size: 4.4em; font-weight: 700; text-transform: none; vertical-align: middle; filter:drop-shadow(0px 0px 100px black) }
.p3-body #first-screen h2:after {display:none;}
.p3-body #first-screen h2 span { color: #fff; display: block; font-size: .35em; letter-spacing: .15em; margin-top: 12px; text-transform: uppercase; }
.p3-body #first-screen h2 img { display: block; height: 70px; margin: 0 auto 14px; width:auto; }
.p3-body #first-screen:after { content: ""; display: inline-block; height: 94%; vertical-align: middle; }

.p3-body #second-screen { color: #fff; height: 100%; margin-top: -90px; padding-top: 120px; position: fixed; text-align: center; top: 100%; width: 100%; }
.p3-body #second-screen span { background: #06283f; box-shadow: 0 -38px 38px -26px #000; content: ""; height: 100%; left: 0; margin-top: -26px; position: absolute; transform: skewY(-3deg); top: 0; width: 100%; }
.p3-body #second-screen:after { content: ""; display: inline-block; height: 72%; vertical-align: middle; }
.p3-body #second-screen div { display: inline-block; position: relative; vertical-align: middle; width: 80%; }
.p3-body #second-screen p { font-size: 1.2em; margin-bottom: 10px; padding: 0 10%; }
#homepage .p3-body #second-screen h3 { color: #fff; font-size: 4.4em; }

.p3-body #scroll-for-more { bottom: 0; 
  color: #fff; left: 0; margin-bottom: 18px; position: fixed; text-align: center; width: 100%; z-index: 4; }
.p3-body #scroll-for-more img { cursor: pointer; display: block; height: 140px; margin: 0 auto 3px; position: relative; z-index: 3; }
.p3-body #scroll-for-more span { position: relative; z-index: 3; }
.p3-body #scroll-for-more div { background: #004680; box-shadow: 0 -38px 38px -26px #000; height: 234px; margin-top: 194px; position: absolute; transform: skewY(-3deg); transition: background .4s; width: 100%; z-index: 2; }
.p3-body #scroll-for-more div.fade-bg { background-image: linear-gradient(to bottom, #000f1a, #06518e); }

#homepage .p3-body h3 { color: #06283f; 
  font-size: 2em; text-transform: uppercase; }
#homepage .p3-body .footer { margin-top: 0; }
#homepage .p3-body .footer #footer-bottom div { display: inline-block; float: none; vertical-align: middle; width: 32%; }

.p3-body .blue-staggered { background: #0b3c5d; color: #fff; margin-top: 100px; padding-bottom: 60px; position: relative; }
.p3-body .blue-staggered h2 { color: #fff; margin: 56px 0 28px; }
.p3-body .blue-staggered h3 { color: #fff !important; }
.p3-body .blue-staggered:before { background: #0b3c5d; content: ""; height: 100px; position: absolute; top: -50px; transform: skewY(-3deg); width: 100%; }
.p3-body .blue-staggered > span { background: #0b3c5d; bottom: -50px; content: ""; height: 100px; left: 0; position: absolute; transform: skewY(3deg); width: 100%; }
#homepage .p3-body .blue-staggered,
#homepage .p3-body .blue-staggered:before,
#homepage .p3-body .blue-staggered > span{background-color:#06283f}
.p3-body #p3-factsheets > span { display: none; }
.p3-body .resources-footer { margin: 0; }
.p3-body .resource-list p { color: #000; }

.p3-body #current-projects,
.p3-body #p3-benefits{text-align:center}

.p3-body #temp-cards a { background: #747d84; background-position: left; background-size: cover; display: inline-block; height: 320px; margin: 14px 18px 26px; overflow: hidden; position: relative; width: 450px; }
.p3-body #temp-cards a:first-of-type {  }
.p3-body #temp-cards a p { bottom: 0; color: #fff; margin: 0; position: absolute; height: 130px; transition: margin .3s; width: 100%; }
.p3-body #temp-cards a p:before { background: #000; background: rgba(0,0,0,.5); content: ""; height: 140%; left: 0; position: absolute; transform: skewY(-3deg); transition: .4s; width: 100%; }
.p3-body #temp-cards a p strong { display: block; font-size: 1.5em; margin: 24px 0 10px; position: relative; }
.p3-body #temp-cards a p span { background: #fff; border-radius: 18px; color: #002856; display: inline-block; font-size: .85em; font-weight: 700; padding: 0 10px; position: relative; transition: .2s; }
.p3-body #temp-cards a:hover p { margin-bottom: 20px; }
.p3-body #temp-cards a:hover p:before { background-color: rgba(0,0,0,.6); }
.p3-body #temp-cards a:hover p span { background-color: #c8ddef; }

.p3-body #awards h3 { margin-bottom: 34px; text-align: center; }
.p3-body #awards .row > * > * { background-color: #fff; background-position: center; background-size: cover; display: block; position: relative; width: 100%; }
.p3-body #awards .col-md-6 > * { height: 540px; }
.p3-body #awards .col-sm-3 > * { height: 256px; margin-bottom: 28px; }
.p3-body #awards a > div { background-color: #fff; bottom: 0; color: #000; font-size: .85em; position: absolute; width: 100%; }
.p3-body #awards a h4 { font-size: 1.2em; font-weight: 700; margin: 0; padding: 12px 12px 0; }
.p3-body #awards a p { border-bottom: 4px solid #f47735; margin: 0 0 6px; padding: 0 12px 16px; transition: padding .3s, margin .5s; }
.p3-body #awards a:hover > div p { margin-bottom: 12px; padding-bottom: 24px; }
.p3-body #awards .award-box > div { background-color: #fff; bottom: 0; color: #000; font-size: .85em; position: absolute; width: 100%; }
.p3-body #awards .award-box h4 { font-size: 1.2em; font-weight: 700; margin: 0; padding: 12px 12px 0; }
.p3-body #awards .award-box p { font-size: 1em; border-bottom: 4px solid #f47735; margin: 0 0 6px; padding: 0 12px 16px; transition: padding .3s, margin .5s; }
.p3-body #awards .img-awards1 { background-size:cover;background-position: center; }
.p3-body #awards .img-awards2 {  background-size:cover;background-position: bottom; }
.p3-body #awards .img-awards3 { background-size:cover; background-position: bottom; }
.p3-body #awards .img-awards4 {  }
.p3-body #awards .col-md-6 > * > div { background: rgba(255,255,255,.8); 
  font-size: .95em; padding: 8px 16px; }
.p3-body #awards .col-md-6 > * > div > div { display: inline-block; vertical-align: middle; }
.p3-body #awards .col-md-6 > * > div > div h4 { padding: 12px 4px 0; }
.p3-body #awards .col-md-6 > * > div > div p { padding: 0 4px 12px; }
.p3-body #awards .col-md-6 > * > div > .btn { background-color: #0070cc; border-color: #000; color: #fff; float: right; font-size: .8em; margin: 24px 12px; vertical-align: middle;  }
.p3-body #awards .col-md-6 a:hover > div > .btn { background-color: #00467f; }
.p3-body #awards > span { display: none; }

.p3-body .innovation-img { opacity: .8; transition: opacity .3s; }
.p3-body .innovation-img:hover { opacity: 1; }

.p3-body #project-stats {  background-size: cover; background-position: center; color: #fff; padding: 280px 0 200px; text-align: center; }
.p3-body #project-stats img { display: block; height: 140px; margin: 0 auto 26px; }
.p3-body #project-stats strong { border-bottom: 6px solid #22bcb9; display: block; font-size: 1.3em; margin: 0 10%; padding-bottom: 6px; }
.p3-body #project-stats p { padding: 0 10%; }
.p3-body #project-stats a { background-color: #fff; color: #0b3c5d; border: 3px solid #0b3c5d; border-radius: 8px; display: block; font-size: 1.3em; margin: 0 12px; padding: 22px 18px;  }
.p3-body #project-stats a:hover { background-color: #50dad7; }

.p3-body .map-iframe { height: 520px; width: 100%; }

.p3-body #project-topics { margin-top: 52px; overflow: auto; }
.p3-body #project-topics nav { border-spacing: 14px 0; display: table; width: 100%; }
.p3-body #project-topics nav a { background-color: #b9c2c8; border-radius: 50px; color: #0b3c5d; display: table-cell; font-weight: 700; line-height: 1.2em; padding: 14px; text-align: center; width: 20%; }
.p3-body #project-topics nav a:hover { background-color: #22bcb9; }
.p3-body #project-topics nav a:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; }
.p3-body #project-topics nav a span { display: inline-block; vertical-align: middle; }
.p3-body #project-topics nav a.active { background: #22bcb9; border: 2px solid #119F9D; color: #0b3c54; }
.p3-body #project-topics nav a.active:hover { background-color: #0b908e; }
.p3-body #topic-cards { margin: 30px 0 0 2%; padding-bottom: 14px; display:flex; flex-direction:row;flex-wrap:wrap;justify-content:left;}

.p3-body #topic-cards .card { margin-right: 1.5%; margin-bottom: 20px; position: relative; border-radius: 12px; box-shadow: 0 0 14px 0 #888; padding: 30px 10px 40px;  text-align: center; }
.p3-body #topic-cards .card img { display: block; height: 130px; margin: 0 auto 18px; }
.p3-body #topic-cards .card h3 { color: #000; display: block; height: 64px; margin-top: 4px; padding: 0 10%;  }
.p3-body #topic-cards .card span { color: #0070cc; display: block; font-weight: 700; margin: 6px 0;  }
.p3-body #topic-cards .card > a { bottom: 0px;
    width: 100%; background-color: #fff; border-radius: 8px; color: #fff; display: block; font-size: 1.1em; font-weight: 700; margin-top: 0; margin-bottom: 0; }
    .p3-body #topic-cards .card > a:hover { background-color: #0b3c5d; }
    .p3-body #topic-cards .card > a:hover h3 { color: #fff; }
    .p3-body #topic-cards .card > a:hover span { color: #f47735; }
    .p3-body #topic-cards .card.show { -webkit-transition: all 1s ease-in-out .4s, opacity .4s; 
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1.1s, opacity .9s; width: 31.5%; }
    .p3-body .resource-list > ul > li {display: flex;justify-content:flex-start;align-items:center;}
.p3-body .resource-list > ul > li > span > a {margin-right:15px;}
.p3-body .resource-list > ul > li > ul {margin:0;}
.p3-body .resource-list > ul > li > ul > li > span:before {content:'-';margin-right:15px;}
.p3-body .resource-list > ul > li:after {content:'';display:block;margin-left: auto; border: solid #50dad7;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;   transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);-webkit-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all 300ms,}
.p3-body .resource-list > ul > li:hover:after {border: solid #0070cc;border-width: 0 3px 3px 0;}

    .p3-body #topic-cards .card.hide {width: 0px; overflow: hidden; box-shadow: none; margin-right: 0px; margin-top: -12px; margin-bottom: 0; opacity: 0; display:none!important; 
      padding: 0;  transform: rotateY(360deg); -webkit-transition: all 1s ease-in-out .4s, opacity .4s;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    transition: all 1.1s ease-in-out 0s, opacity .9s, width .9s, margin-right .15s; }
    .p3-body .callout { background-color: #005daa; border-left: 18px solid #22bcb9; border-radius: 8px; color: #fff; padding: 18px; }
    .p3-body .callout h3 { color: #fff; font-size: 1.3em; margin: 0 0 3px; }
    .p3-body .callout p { margin: 0; }

    .p3-body .procurement-message { opacity: 0; }
    .p3-body .procurement-message.showing { opacity: 1; 
      transition: opacity .6s ease-in-out .6s; }

    .p3-body .contact-us-row { text-align: center; }
    .p3-body #contact-us > div { display: block; float: none; margin: 30px auto 0; }

    .p3-body #meeting-materials { margin-top: 80px; }

    .p3-body #secondary-resources { margin-top: 40px; }
    .p3-body #secondary-resources h2 + a { display: block; font-weight: 700; margin-bottom: 48px; }

    .p3-body #resource-archive { margin-top: 80px; }

    .p3-body #careers > div > h3 { display: inline-block; margin-bottom: 28px; }
    .p3-body #careers > div > a { float: right; margin-top: 30px; }

    .p3-body #guiding-principles ul { display: block; list-style-type: none; padding: 0; }
    .p3-body #guiding-principles li { background: #fff; border-radius: 50%; color: #004680; display: inline-block; font-size: 1.2em; font-weight: 700; height: 280px; margin: 30px 4% 0 0; padding: 0 42px; text-align: center; vertical-align: middle; width: 280px; }
    .p3-body #guiding-principles li img { display: block;; height: 80px; margin: 0 auto 18px; }
    .p3-body #guiding-principles li div { display: inline-block; vertical-align: middle; width: 96%; }
    .p3-body #guiding-principles li:before { content: ""; display: inline-block; height: 100%; vertical-align: middle; }

    .p3-body #team-members { margin-top: 32px;gap: 30px 0px; }
.p3-body #team-members {padding: 0px 10% 64px 10%;}
.p3-body #team-members.row > div.col-sm-4 {padding:0px 18px;width:auto;flex: 0 0 33.333333%;max-width: 33.333333%;}
.p3-body #team-members .contact-square {height: 100%;}

    .p3-body .bio-title { display: block; margin-bottom: 40px; overflow: auto; }
    .p3-body .bio-title div { float: left; height: 100px; margin-right: 24px; width: 100px; }
    .p3-body .bio-title h2 { margin-top: 32px; }
    .p3-body .bio .btn { display: block; margin: 36px auto 0; width: 200px; }

    .p3-body #contact-us > div { padding: 0 4% 0 0;}
    .p3-body .contact-info { background-color: #f2f3f3; 
      border-top: 3px solid #005DAA; padding: 0 18px 12px !important; }
    .p3-body .contact-us-row h2:after {display:none}
    .p3-body .btn {
    display: inline-block;
    font-weight: 600;
    color: #000;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    background-color: transparent;
    border: 2px solid transparent;
    padding: 0.375rem 1rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 50px;
	margin-top: 18px; 
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.p3-body a.btn.btn-vdot-blue {
    background-color: #0070CC;
    border: 2px solid #004680;
    color: #fff;
}
.p3-body a.btn.btn-vdot-blue:hover {
    background-color: #004680;
    color: #fff;
}
.p3-body a.btn.btn-darkblue {
    background-color: #004680;
    border: 2px solid #073452;
    color: #fff;
}
.p3-body a.btn.btn-darkblue:hover {
    background-color: #005DAA;
    color: #fff;
}
.p3-body a.btn.btn-orange {
    background-color: #F47735;
    border: 2px solid #C04E11;
    color: #fff;
}
.p3-body a.btn.btn-orange:hover {
    background-color: #C04E11;
    color: #fff;
}
.p3-body a.btn.btn-teal {
    background-color: #22BCB9;
    border: 2px solid #119F9D;
    color: #06283f;
}
.p3-body a.btn.btn-teal:hover {
    background-color: #119F9D;
    color: #06283f;
}
.p3-body .outline-btn {
	border-color: #004680; 
	color: #004680;
}
.p3-body .outline-btn:hover {
    background-color: #004680;
    color:#fff;
}

/* ACCORDION */
.p3-body .accordion {
    display: block;
    max-width: 100%;
    margin-bottom:30px;
    padding: 0px 10% 0px 10%;
    
}
.p3-body .accordion h5 {margin: 0px;}
.p3-body .accordion .btn {
  border-radius: 0;  color: #004680; font-weight: 700; margin: 0; padding: 10px 10px 4px 10px; text-align: left; 
  text-decoration: none; width: 100%; white-space: normal;
}
.p3-body .accordion .btn img{margin-right:6px}
.p3-body .accordion .btn span { background-color: #fff; border-radius: 50%; box-shadow: 0 3px 8px -3px #333;  color: #005daa; 
  float: right; /*font-size: 30px;*/ font-weight: 400; /* height: 30px; line-height: 30px;*/ text-align: center; width: 1.5em; margin-bottom:3px }
.p3-body .accordion .card {
  background-color:#fff; 
  border-radius: 0;
  overflow:auto;
}
.p3-body .resource-list > ul > li:last-of-type{border:none}


/*
.p3-body .accordion .card.card-header {
	padding: 0;
}
.p3-body .accordion .card.card-header h5 {
    margin: 0;
}
.p3-body .accordion .card.card-header h5 .btn {
    position: relative;
    display: block;
    width: 100%;
    text-align: left;
    outline: none;
    background-color: #dee2e6;
    border-radius: 0;
    padding: 10px 30px 10px 10px;
    font-size: 0.75rem;
    font-weight: 700;
    color: #004680;
}
.p3-body .accordion .card.card-header h5 .btn .accordion-icon {
    width: 16px;
    height: auto;
    margin-right: 5px;
}

.p3-body .accordion .card.card-header h5 .btn:after {
    content: "a";
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    background-color: #fff;
    border-radius: 100%;
    box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.25);
    color: #005DAA;
    text-align: center;
    font-weight: 400;
    width: 18px;
    height: 18px;
    font-size: 14px;
    line-height: 19px;
    right: 10px;
}

.p3-body .accordion .card.card-header h5 .btn.collapsed {
    background-color: #F2F3F3;
}
.p3-body .accordion .card.card-header h5 .btn:after {
    content: "+";
}

.p3-body .accordion .card.card-header h5 .btn:focus {
    box-shadow: none;
    text-decoration: underline;

}

.p3-body .accordion .card.card-header h5 .btn:visited {
    text-decoration: none;
}

.p3-body .accordion .card.card-header h5 .btn:hover {
    background-color: #dee2e6;
    text-decoration: none;
}
*/




.p3-body .accordion .collapse {
	padding: 0 18px 0px 18px; 
}
.p3-body .accordion>.card>.card-header {margin-bottom: 0;background-color:#eaebeb;}


/* RESOURCE CARDS */
.p3-body .resource-card {
    -webkit-transition: all  300ms ease-in-out;
    -moz-transition: all  300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all  300ms ease-in-out;
    box-shadow: 0 0 10px 2px #e3e3e3;
    border-radius: 10px;
    min-height: 250px;
    margin-bottom: 20px;
    padding: 28px 24px;
    position: relative;
    text-align: center;
    background-color: white;
}
.p3-body .resource-card a {
	display: block; 
}
.p3-body .resource-card a h3 {
    color: #0B3C5D!important;
}
.p3-body .resource-card p {
    color: black;
}
.p3-body .resource-card:hover {
        background: #0070CC;
}
.p3-body .resource-card:hover a {
    text-decoration: none;
}

.p3-body .resource-card .underline-link {
    display: inline-block;
    margin: 0 1px;
    font-size: 0.7500em;
    font-style: normal;
    font-weight: 700;
    line-height: 14px;
    letter-spacing: 0px;
    padding-bottom: 2px;
    border-bottom: 2px solid #F47735;
    transition: border-color 300ms;
}
.p3-body .resource-card:hover h3 {
    color: white !important;
}
.p3-body .resource-card:hover p {
    color: white;
}
.p3-body .resource-card:hover .underline-link {
    color: white;
    border-bottom: solid 3px #F47735;

}
.p3-body .resource-card img {
    height: 60px;
}
.p3-body .resource-card h3 {
    border-top: 1px solid #e3e3e3;
    font-size: 1.4em;
    font-weight: 700;
    margin-top: 24px;
    padding-top: 24px;
}
.p3-body .resource-card h3:hover {
    color: #F47735;
}
.p3-body .resource-card p {
    margin-bottom:40px;
}
.p3-body .resource-card > div {
	bottom: 18px;
	left: 50%;
	margin-left: -70px; 
	position: absolute;
	text-align: center;
	width: 140px;
}
.p3-body .resource-card > div .underline-link {
    font-size: 1em;
}
.p3-body .resource-card > div .underline-link :hover {
    color: #22BCB9;
    border-bottom: 3px solid white;
}

/* RESOURCE LIST */
.p3-body .regular-list {
    padding: 0;
}

.p3-body .regular-list li {
    border-bottom: 1px solid #E3E3E3;
    font-weight: 700;
    list-style-type: none;
    padding: 14px 16px;
    position: relative;
}

.p3-body .regular-list li:before {
    background: #22BCB9;
    content: "";
    height: 20px;
    left: 0;
    position: absolute;
    top: 16px;
    width: 3px;
}


.p3-body .header-list {
    padding: 0;
}

@media (max-width: 991.98px) {
    .p3-body .header-list {
        font-size: .85em;
    }
}

.p3-body .header-list h3 {
    font-size: 1.6em;
    font-weight: 700;
}

.p3-body .header-list li {
    border-top: 1px solid #E3E3E3;
    list-style-type: none;
    padding: 10px 0;
   
}

.p3-body .header-list li h4 {
    font-size: 1.1em;
    font-weight: 700;
    margin-bottom: 5px;
    padding-left: 26px;
    position: relative;
}

.p3-body .header-list li h4:before {
    background-color: #22BCB9;
    content: "";
    height: 18px;
    left: 0;
    position: absolute;
    top: 1px;
    width: 18px;
}


.p3-body .resource-list ul {
    padding: 0;
}
.p3-body .resource-list h3 {
    border-bottom: 3px solid #e3e3e3;
    color: #0B3C5D;
    font-size: 1.4em;
    font-weight: 700;
    margin-bottom: 0;
    padding-bottom: 10px;
}
.p3-body .resource-list li {
	list-style-type: none;
	-webkit-transition: all  300ms ease-in-out;
	-moz-transition: all  300ms ease-in-out;
	-o-transition: all 300ms ease-in-out;
	transition: all  300ms ease-in-out;
    margin-bottom:0px;
}
.p3-body .resource-list li:hover {
    background-color: #F2F3F3;
}
.p3-body .resource-list li:hover a > span:last-of-type {
    background-color: #22BCB9;
}
.p3-body .resource-list li:hover a > span:last-of-type img {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(2deg) brightness(107%) contrast(103%);
}
.p3-body .resource-list > ul > li {
    border-bottom: 1px solid #e3e3e3;
    color: #005DAA;
    display: block;
    font-weight: 700;
    padding: 14px 40px 14px 0;
    position: relative;
    -webkit-transition: all  300ms ease-in-out;
    -moz-transition: all  300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all  300ms ease-in-out;
}
.p3-body .resource-list ul li ul li{color:#000}

.p3-body .resource-list > ul > li {display: flex;justify-content:space-between;}
.p3-body .resource-list > ul > li > ul {margin:0}


/* TABS */
.p3-body .tab-component {
    display: block;
    max-width: 100%;
}
.p3-body .tab-component .nav-tabs {
    width: 100%;
    background-color: #F2F3F3;
    display: flex;
    flex: 1;
    flex-direction: row;
    margin-bottom: 0px;
}
.p3-body .tab-component .nav-tabs .nav-item {
    display: flex;
    flex: 1;
	position: relative;
    align-items: stretch;
}
.p3-body .tab-component .nav-tabs .nav-item:after {
	background: #22BCB9;
	content: "";
	height: 0;
	position: absolute;
	top: 0;
	transition: height .2s;
	width: 100%;
}
.p3-body .tab-component .nav-tabs .nav-item .nav-link {
    display: flex;
    align-items: center;
    flex: 1;
    justify-content: center;
    min-width: 71px;
    min-height: 94px;
    padding: 15px 0px;
    border-radius: 0;
    border: 1px solid #e3e3e3;
    transition: background-color 200ms;
    margin-right:0px;
}
.p3-body .tab-component .nav-tabs .nav-item .nav-link:hover {
    background-color: #dee2e6;
}
.p3-body .tab-component .nav-tabs .nav-item .nav-link .tab-title {
    color: #495057;
    font-size: 1rem;
    font-weight: 700;
    text-align: center;
    transition: 100ms ease-in-out;
}
.p3-body .tab-component .nav-tabs .nav-item .nav-link .tab-title .icon {
    filter: invert(50%) sepia(10%) saturate(357%) hue-rotate(164deg) brightness(95%) contrast(88%);
    width: 20px;
    height: auto;
    display: block;
    margin: auto;
    margin-bottom: 1px;
    transition: 100ms ease-in-out;
}
.p3-body .tab-component .nav-tabs .nav-item.active:after {
	height: 7px;
}
.p3-body .tab-component .nav-tabs .nav-item .nav-link.active .tab-title {
    color: #004680;
}
.p3-body .tab-component .nav-tabs .nav-item .nav-link.active .tab-title.icon {
    filter: invert(59%) sepia(25%) saturate(1230%) hue-rotate(130deg) brightness(100%) contrast(88%);
}
.p3-body .tab-component .tab-content {
    border-left: 1px solid #e3e3e3;
    border-right: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3;
    padding: 15px;
}

/* CONTACT */
.p3-body .cimage {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    border-radius:100%;
}

.p3-body .contact-square {
    -webkit-transition: all  300ms ease-in-out;
    -moz-transition: all  300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    transition: all  300ms ease-in-out;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    border-radius: 10px;
    color: #fff;
    margin-bottom: 24px;
    padding: 18px;
    text-align: center;
}
.p3-body .contact-square .cimage {
    height: 140px;
    width: 140px;
}
.p3-body .contact-square h3 {
    font-size: 1.3em;
    margin-top: 16px;
}
.p3-body .contact-square p {
    margin-bottom: 3px;
}
.p3-body .contact-square.gray-version {
    background: #F2F3F3;
    color: #000;
}
.p3-body .contact-square.gray-version:hover {
    background: darken(#F2F3F3, 10%);
}
.p3-body .contact-square.gray-version h3 {
    color: #0B3C5D;
}

/*GRID*/
/* Nav Bar */
.p3-body #background-video-container {
    position: relative;
    display: flex;
    height: 60vw;
    max-height: 60vh;
    overflow: hidden;
    /** background-image: url("../images/bg-video-fallback.jpg"); **/
    background-image:url('/media/p3/images/bg-video-fallback.min.jpg');
    background-size: cover;
    background-position: center;
}
.p3-body #background-video-container .header-background {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120%;
    height: 0;
    padding-bottom: 66.25%;
    transform: translate(-50%, -50%);
    pointer-events: none;
}
.p3-body #background-video-container .header-video-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    /** background-image: url("../images/bg-video-fallback.jpg"); **/
    background-image:url('/media/p3/images/bg-video-fallback.min.jpg');
  
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    transition: opacity 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94), visibility 0.5s linear;
}
.p3-body #background-video-container .header-video-overlay--fadeOut {
    opacity: 0;
    visibility: hidden;
}
.p3-body #background-video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
.p3-body #background-video-container .header-video {
    display: none;
}
.p3-body #background-video-container .inner-banner:after {
    content: "";
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    height: 10vh;
    background: #f2f3f3;
    background: linear-gradient(180deg, rgba(242, 243, 243, 0) 0%, #f2f3f3 100%);
    z-index: 22;
}
.p3-body #background-video-container .header-video-overlay {
    display: none;
}
.p3-body #background-video-container-button {
    position: absolute;
    bottom: 11vh;
    left: 20px;
    background: none;
    border: white solid 1px;
    z-index: 23;
    color: white;
    font-size: 0.8em;
}
.p3-body #background-video-container-button:after {
    content: "Stop video";
    display: inline-block;
}
.p3-body #background-video-container-button.yt-paused:after {
    content: "Play video";
    display: inline-block;
}

/*********************************************/
/****** Media Queries ************************/
/*********************************************/
/* Add more queries as needed; 992px is the column breakpoint for "medium"  columns in Bootstrap */

@media screen and (min-width: 1950px) {
	html, body { font-size: 20px; }
}

@media screen and (max-width: 1260px) {
	.p3-body .header img { height: 36px; 
      margin-left: 12px; }
	.p3-body .header .nav { padding: 6px 26px 0 0; }
	.p3-body .header li { margin-left: 18px; }

	.p3-body #first-screen h2 { font-size: 3.4em; }
	.p3-body #first-screen h2 img { height: 54px; }
	.p3-body #second-screen { margin-top: -70px; }
	.p3-body #second-screen:after { height: 64%; }
	#homepage .p3-body #second-screen h3 { font-size: 3.4em; }
	.p3-body #scroll-for-more img { height: 104px; }
	
	.p3-body #content { padding-top: 98px; }

	.p3-body #temp-cards a { font-size: .9em; 
      height: 280px; width: 390px; }

	.p3-body #project-stats a { font-size: 1.2em; 
      margin: 0; padding: 16px 12px; }

	.p3-body .image-slideshow-slides > div.active { height: 320px; }
	.p3-body .image-slideshow-slides > div.prev-one { height: 260px; }
	.p3-body .image-slideshow-slides > div.next-one { height: 260px; }
	.p3-body .image-slideshow-slides > div > div span { font-size: 2em; }
	.p3-body .image-slideshow-slides > div > div a { margin-top: 12%; }

	.p3-body .footer nav a { font-size: 1em; }

	.p3-body #topic-cards > div h3 { font-size: 1.3em; 
      height: 52px; }

	.p3-body #background-video-container iframe {
	    top: -8%;
	}
}

@media screen and (max-width: 992px) {
    .p3-body h1 { font-size: 2.2em; margin: 20px 0 6px; }
    .p3-body h2 { font-size: 1.7em; margin: 12px 0 0; }
    .p3-body h3 { font-size: 1.4em; margin: 20px 0 0; }
    .p3-body h4 { font-size: 1.3em; margin: 28px 0 0; }
    .p3-body h5 { font-size: 1.2em; margin: 26px 0 0; }
    .p3-body h6 { font-size: 1.1em; 
      margin: 26px 0 0; }
    .p3-body p, .p3-body li { font-size: .9em; line-height: 1.3em; }
    .p3-body .button { font-size: .8em; border-radius: 12px; padding: 4px 12px 3px; }
    .p3-body  table tr { font-size: .8em; padding: 2px; }
    .p3-body .vertical-center > div { margin: 0; }

    /* Quick Mobile Menu */
    .p3-body #mobile-menu { display: inline-block; 
      font-size: 1.3em; }
	.p3-body .header .nav { padding: 0 14px; }
    .p3-body .header .nav ul { background-color: #fff; 
      box-shadow: 2px 4px 8px -4px #000; display: none; opacity: 0; position: absolute; right: 110%; top: 84px; width: 190px; z-index: 1; }
     .menu-opened .p3-body .header .nav ul { opacity: 1; right: 0; transition: right 0s, opacity .2s; }
    .p3-body .header .nav li { border-top: 0; display: block; margin: 0; text-align: center; }
	.p3-body .header .nav li a { border-bottom: 1px solid #06283f; color: #06283f; padding: 5px 5px 4px; }
	.p3-body .header .nav li a.active { background: #22bcb9; }
	.p3-body .header .nav li a.active:before { display: none; }

	.p3-body #second-screen > div { width: 96%; }
	.p3-body #second-screen div p { font-size: 1em; padding: 0 44px; }
	.p3-body #homepage #second-screen h3 { font-size: 2.6em; }

	#homepage .p3-body h3 { font-size: 1.6em; }
	.p3-body #subpage-header { height: 280px; }

	.p3-body #careers > div > a { margin-top: 6px; }

	.p3-body #guiding-principles li { border-radius: 8px; 
      height: auto !important; padding: 23px; width: 100% !important;  }
	.p3-body #guiding-principles li div { width: 90%; }
	.p3-body #guiding-principles li img { height: 50px; }
	
	.p3-body .image-slideshow-slides > div.active { height: 260px; margin-top: 0; }
	.p3-body .image-slideshow-slides > div.prev-one { height: 180px; }
	.p3-body .image-slideshow-slides > div.next-one { height: 180px; }
	.p3-body .image-slideshow-slides > div > div { bottom: 22px; padding: 0 54px; }
	.p3-body .image-slideshow-slides > div > div span { font-size: 1.6em; }
	.p3-body .image-slideshow-slides > div > div a { font-size: .8em; margin-top: 10%; padding: 2px 8px; }
	
	.p3-body #awards .col-md-6 { margin-bottom: 28px; }
	.p3-body #awards .col-md-6 a { height: 360px; }
	.p3-body #awards .col-sm-3 { float: left; width: 50%; }

	.p3-body #project-stats { padding: 140px 0 40px; }
	.p3-body #content #project-stats > div { padding: 24px 6% 64px; }
	.p3-body #project-stats p { margin-bottom: 28px; }
	.p3-body #project-stats img { height: 100px; }
	.p3-body #project-stats .col-sm-3 { margin-bottom: 18px;  width: 50%; }
	.p3-body #project-stats .col-sm-3:nth-of-type(3) { clear: both; }

	.p3-body #project-topics nav a { font-size: .9em; padding: 10px; }
	
	.p3-body .footer nav a { font-size: .9em; }

	.p3-body #topic-cards > div { margin-top: 20px; }
	.p3-body #topic-cards > div h3 { font-size: 1.1em; 
      height: 72px; }
	.p3-body #topic-cards > div > a { font-size: 1em; }

	.p3-body #secondary-resources { margin-top: 20px; }

	.p3-body .tab-component .nav-tabs .nav-item .nav-link { font-size: .8em; }

    
    .p3-body .regular-list {
        font-size: .85em;
    }

    .p3-body .accordion .card.card-header h5 .btn {
        font-size: 1.125rem;
        padding: 22.5px 40px 22.5px 20px;
    } 
    .p3-body .accordion .card.card-header h5 .btn:after {
        width: 24px;
        height: 24px;
        font-size: 22px;
        line-height: 26px;
        right: 10px;
    }
	


    .p3-body .resource-card {
        font-size: .9em;
    }
    .p3-body .resource-card img {
        height: 48px;
    }
    .p3-body .resource-card h3 {
        margin-top: 18px;
        padding-top: 18px;
    }

   
    .p3-body .header-list li h4 {
        padding-left: 22px;
    }
    .p3-body .header-list li h4:before {
        height: 14px;
        width: 14px;
    }
    .p3-body .tab-component .nav-tabs .nav-item .nav-link .tab-title {
        font-size: 1.1em; padding: 0 8px; 
    }
    .p3-body .tab-component .tab-content {
        padding: 20px 30px;
    }

    .p3-body .contact-square {
        font-size: .9em;
    }
    .p3-body .contact-square .cimage {
        height: 80px;
        width: 80px;
    }
  
    .p3-body #background-video-container-button {
		display:none;
    }
}

@media screen and (max-width: 768px) {
    .p3-body #topic-cards .card.show {width: 46%; }
	.p3-body .image-slideshow-slides { margin-top: 0; 
      padding-top: 0; }
	.p3-body .image-slideshow-slides > div.active { height: 220px; margin-left: 10%; margin-top: 0; width: 80%; }
	.p3-body .image-slideshow-slides > div.prev-one,
	.p3-body .image-slideshow-slides > div.next-one { display: none;  }
	.p3-body .image-slideshow-slides > div > div { bottom: 22px; }
	.p3-body .image-slideshow-slides > div > div span { font-size: 1.3em; }
	.p3-body .image-slideshow-slides > div > div a { font-size: .8em; margin-top: 10%; padding: 2px 8px; }
	.p3-body .slideshow-move { left: 0; }
	.p3-body .slideshow-move.next { right: 0; }
	.p3-body .slideshow-move img { width: 74px; }

	.p3-body #footer-middle div { display: none; }
	.p3-body #footer-middle p { display: block; margin: 0 auto; width: 92%; }
    .p3-body .resource-list > ul > li:after {margin-left:40px;}
	.p3-body #project-topics nav { display: block; }
	.p3-body #project-topics nav a { display: inline-block; 
      margin: 0 4px 6px 0; padding: 8px 12px; vertical-align: top; width: auto; }

	.p3-body #topic-cards > div { box-shadow: 0 0 8px 0 #9999; font-size: .9em;}
	.p3-body #topic-cards > div img { height: 80px; }
	
	.p3-body #project-stats .col-sm-3 { margin: 0 auto 16px; max-width: 500px; width: 100%;  }
	.p3-body #project-stats a { font-size: 1.1em; padding: 9px 14px; }

	.p3-body #careers > div > h3 { display: block; }
	.p3-body #careers > div > a { float: none; margin: 0 0 28px; }
	
    .p3-body .resource-card {
        height: 168px;
		min-height: 0;
        font-size: .8em;
        padding: 10px 8px;
    }
    .p3-body .resource-card img {
        height: 38px;
    }
    .p3-body .resource-card h3 {
        font-size: 1.2em;
        line-height: 1.1em;
        margin-top: 10px;
        padding-top: 10px;
    }
    .p3-body .resource-card p {
        line-height: 1.2em;
    }

    .p3-body .contact-square .cimage {
        height: 62px;
        width: 62px;
    }
    .p3-body .contact-square h3 {
        font-size: 1.1em;
    }
  .p3-body #team-members.row > div.col-sm-4 {
    padding:0px 18px;width:auto;flex: 0 0 100%;max-width: 100%;}
  .p3-body #team-members.row { flex-direction: column;}
}

@media screen and (max-width: 580px) {
    .p3-body #topic-cards .card.show {
        width: 100%;
    }
	.p3-body .header img { height: 28px; margin-left: 4px; margin-bottom: 8px; }
	.p3-body .header .nav ul { top: 72px; }
    .p3-body #mobile-menu { font-size: 1.2em; }
	
	.p3-body #header-top { 
      margin-bottom: 30px; padding: 5px 8px; text-align: right; }
	.p3-body #header-top p { display: none; }
	.p3-body #header-top ul { float: none; }
	.p3-body #content { padding-top: 77px; }
	.p3-body #subpage-header { height: 200px; }

	.p3-body #temp-cards > a { height: 240px; width: 80%;  }

	.p3-body #first-screen h2 { font-size: 2em; width: 96%; }
	.p3-body #first-screen h2 img { height: 44px; margin-bottom: 4px; }
	.p3-body #first-screen h2 span { font-size: .4em; line-height: 1.3em; margin-top: 4px; padding: 0 36px; }
	.p3-body #second-screen .btn { font-size: .9em; margin-top: 6px; padding: 2px 10px; }
	.p3-body #second-screen:after { height: 56%; }
	.p3-body #second-screen div p { 
      font-size: .9em; margin-top: 8px; padding: 0 12px; }
	#homepage .p3-body #second-screen h3 { font-size: 1.5em; margin: 0; padding: 0 14px; }
	.p3-body #scroll-for-more img { height: 84px; }
	
	.p3-body #awards .col-sm-3 { float: left; width: 100%; }
	.p3-body #awards .col-sm-3 a { height: 200px; }
						
	.p3-body .image-slideshow-slides > div.active { height: 160px; }
	.p3-body .image-slideshow-slides > div > div span { font-size: 1.3em; line-height: 1em; }

	.p3-body #subpage-header > div { margin-top: 36px; padding: 8px 18px;}
	.p3-body #subpage-header > div img { height:70px; }

	.p3-body .tab-component .nav-tabs { display: inline-block;  }
	.p3-body .tab-component .nav-tabs .nav-item { 
      display: inline-block; float: none; position: relative; }
	.p3-body .tab-component .nav-tabs .nav-item .nav-link { 
      display: inline-block; flex: auto; min-height: 0; width: auto; }
	.p3-body .tab-component .nav-tabs .nav-item:after{left:0}

	.p3-body .footer { margin-top: 0; }
	.p3-body .footer nav { padding: 5px 0 3px; }
	.p3-body .footer nav a { 
      font-size: .85em; 
      padding: 3px 0;
      width: 45%; 
    }
	.p3-body .footer nav a:nth-of-type(even){width:55%}
	.p3-body .footer nav a:nth-of-type(2):after{display:none}
	.p3-body #footer-bottom { padding: 6px; }
	.p3-body #homepage .footer #footer-bottom div { font-size: .8em; width: 100%; }
}

@media (min-width: 992px) {
    .p3-body #background-video-container .header-video {
        display: block;
    }
    .p3-body #background-video-container .header-video-overlay {
        display: block;
    }
}