@charset "utf-8";
/* CSS Document */

nav {
      font-family: "Roboto", Helvetica, Arial, "sans-serif";
}

nav .bg-primary {
    background-color: #055594 !important;
}

.masthead {
    background-image: url("../images/header_background_road_construction_evolution.png");
    min-height: 500px;
/*    height: 800px; */
    height: 600px;
    background-size: cover;
    background-position: center;
}

.masthead_text {
    box-shadow: inset 0 0 0 1000px rgba(0, 84, 147, .7);
}

.masthead h1 {
    font-size: 5em;
    font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    font-weight: 900;
}

.masthead_activity {
    background-image: url("../images/header_background_road_construction_evolution.png");
    height: 400px;
    background-size: cover;
    background-position: center;
}
.masthead_activity h1 {
    font-size: 5em;
    font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
    font-weight: 900;
}

.subheader p {
/*  font-size: 2.25em;*/
    font-family: "Roboto Condensed", "Roboto", Helvetica, Arial, "sans-serif";
/*  font-family: "Crimson Text" , Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";*/
    color: #272460; 
  
}

.subheader .small_logo img {
/*    height: 300px;*/
}

.subheader .large_logo img {
    
}

.highway_history .row {
    height: 250px;
    background-image: url("../images/bb2_highway_history.png");
    background-size: cover;
    box-shadow: inset 0 0 0 1000px rgba(191, 36, 40, 0.7);
    background-position: center;
}

.highway_history h2 {
  font-size: calc(2.5rem + .9vw)/*4.5em*/;
  font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-weight: 900;
}

.interstate_70_anniv .row {
    height: 250px;
    background-image: url("../images/bb1_highway_history.png");
    background-size: cover;
    box-shadow: inset 0 0 0 1000px rgba(8, 86, 149, 0.7);
    background-position: top;
}

.interstate_70_anniv h2 {
  font-size: calc(2.5rem + .9vw)/*4.5em*/;
  font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-weight: 900;
}

.roads_that_built_america .row {
    height: 250px;
    background-image: url("../images/roads_that_built_america_banner.png");
    background-size: cover;
    box-shadow: inset 0 0 0 1000px rgba(191, 36, 40, 0.7);
    background-position-x: center;
    background-position-y: -240px;
}

.roads_that_built_america h2 {
  font-size: calc(2.5rem + .9vw)/*4.5em*/;
  font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-weight: 900;
}

.public_roads .row {
    height: 250px;
    background-image: url("../images/clover_leaf_lg.png");
    background-size: cover;
    box-shadow: inset 0 0 0 1000px rgba(2, 49, 109, 0.7);
    background-position: top;
}

.public_roads h2 {
  font-size: 3em;
  font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-weight: 900;
}

.image_credit {
    writing-mode: vertical-rl;
    width: 25px !important;
    font-size: .6em;
}

.activity_cards .card {
/*  height: 15rem;
  border: 4px solid; */
  border-radius: 0px; 
}

.activity_cards .card h3 {
  font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-weight: 900;
}

.activity_cards .card .card-img-overlay {
    z-index: 1;
}

.activity_col1 {
    background-color: #BF2428;
    color: white;
    border-color: #BF2428 !important;
}

.activity_col1 a h3 {
    color: white;
    text-decoration: underline;
}

.activity_col1::after
{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: inset 0 0 0 1000px rgba(191, 36, 40, 0.7);
  overflow: hidden;
}

.activity_col2 {
    color: #262560;
    border-color: #262560 !important;
}

.activity_col2 a h3 {
    color: #262560;
    text-decoration: underline;
}

.activity_col2::after
{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: inset 0 0 0 1000px rgba(255, 255, 255, 0.7);
  overflow: hidden;
}

.trailblazers::after
{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: inset 0 0 0 1000px rgba(255, 255, 255, 0.85) !important;
  overflow: hidden;
}

.activity_col3 {
    background-color: #085695; 
    color: white;
    border-color: #085695 !important;
}

.activity_col3 a h3 {
    color: white;
    text-decoration: underline;
}

.activity_col3::after
{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: inset 0 0 0 1000px rgba(8, 86, 149, 0.7);
  overflow: hidden;
}

.family_friendly .row {
    height: 250px;
    background-image: url("../images/coloring_book_lg.png");
    background-size: cover;
    box-shadow: inset 0 0 0 1000px rgba(2, 49, 109, 0.7);
    background-position: top;
}

.family_friendly h2 {
  font-size: 3em;
  font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-weight: 900;
}

.logo_footer .small_logo img {
/*    height: 275px;*/
}

.logo_footer .large_logo img {
    
}

.disclaimer_footer p {
  font-family: "Roboto Condensed", "Roboto", Helvetica, Arial, "sans-serif";
/*  font-family: "Crimson Text" , Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";*/
  color: #272460; 
  
}

.small_activity_cards .card {
/*  height: 20rem;*/
  border: 4px solid; 
  border-radius: 0px; 
}

.small_activity_col {
    border-color: #055595 !important;
}

.video_cards h2 {
  font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-weight: 900;
  color: #055595;
}

.video_cards p {
  font-family: "Roboto Condensed", "Roboto", Helvetica, Arial, "sans-serif";
  color: #272460; 
}

.activity_lead p, .activity_lead ul, .eisenhower_links p, .links_70th ul, .downloads_eisenhower p {
  /*font-size: 2.25em;*/
  font-family: "Roboto Condensed", "Roboto", Helvetica, Arial, "sans-serif";
/*  font-family: "Crimson Text" , Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";*/
  color: #272460; 
  
}

.links_70th h2, .downloads_eisenhower h2 {
  font-family: "Libre Franklin", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
  font-weight: 900;
  color: #272460;
}

/* Breakpoint CSS */

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    .activity_title {
        font-size: calc(.6rem + .6vw);
    }
    .masthead, .masthead_activity {
        min-height: 300px;
        height: 300px;
    }
    .masthead h1, .masthead_activity h1 {
        font-size: calc(2.5rem + .6vw);
    }
    .links_70th ul {
    column-count: 1;
    }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    .activity_title {
        font-size: calc(1rem + .6vw);
    }
    .masthead, .masthead_activity {
        min-height: 400px;
        height: 400px;
    }
    .masthead h1, .masthead_activity h1 {
        font-size: calc(3.5rem + .6vw);
    }
    .links_70th ul {
    column-count: 1;
    }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
    .activity_title {
        font-size: calc(1.4rem + .6vw);
    }
    .masthead, .masthead_activity {
        min-height: 500px;
        height: 500px;
    }
    .masthead h1, .masthead_activity h1 {
        font-size: calc(3.5rem + .6vw);
    }
    .links_70th ul {
    column-count: 2;
    }
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
    .activity_title {
        font-size: calc(1.6rem + .6vw);
    }
    .masthead, .masthead_activity {
        min-height: 500px;
        height: 770px;
    }
    .masthead h1, .masthead_activity h1 {
        font-size: calc(3.5rem + .6vw);
    }
    .links_70th ul {
    column-count: 2;
    }
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
    .activity_title {
        font-size: calc(2.3rem + .6vw);
    }
    .masthead, .masthead_activity {
        min-height: 500px;
        height: 770px;
    }
    .masthead h1, .masthead_activity h1 {
        font-size: calc(3.5rem + .6vw);
    }
    .links_70th ul {
    column-count: 2;
    }
}